41 lines
1.1 KiB
Plaintext
41 lines
1.1 KiB
Plaintext
// Empty state component - Shows when no data is available
|
|
import { Theme, Typography, SpacingSystem } from "../theme/theme.slint";
|
|
|
|
export component Empty inherits Rectangle {
|
|
in property <string> icon: "📭";
|
|
in property <string> title: "No Data";
|
|
in property <string> description: "";
|
|
|
|
background: transparent;
|
|
|
|
VerticalLayout {
|
|
alignment: center;
|
|
spacing: SpacingSystem.spacing.s3;
|
|
|
|
// Icon
|
|
Text {
|
|
text: root.icon;
|
|
font-size: 48px;
|
|
horizontal-alignment: center;
|
|
}
|
|
|
|
// Title
|
|
Text {
|
|
text: root.title;
|
|
font-size: Typography.sizes.lg;
|
|
font-weight: Typography.weights.semibold;
|
|
color: Theme.colors.foreground;
|
|
horizontal-alignment: center;
|
|
}
|
|
|
|
// Description (optional)
|
|
if root.description != "": Text {
|
|
text: root.description;
|
|
font-size: Typography.sizes.sm;
|
|
color: Theme.colors.muted-foreground;
|
|
horizontal-alignment: center;
|
|
wrap: word-wrap;
|
|
}
|
|
}
|
|
}
|