@lumeo-ui/mcp-server 4.1.0-preview.1 → 4.1.0-preview.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/components-api.json +237 -72
- package/src/registry.json +111 -252
package/src/components-api.json
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://lumeo.nativ.sh/components-api-schema.json",
|
|
3
|
-
"version": "4.1.0-preview.
|
|
4
|
-
"generated": "2026-07-
|
|
3
|
+
"version": "4.1.0-preview.11",
|
|
4
|
+
"generated": "2026-07-06T08:55:21.9563423Z",
|
|
5
5
|
"stats": {
|
|
6
6
|
"componentCount": 164,
|
|
7
|
-
"totalParameters":
|
|
7
|
+
"totalParameters": 4181,
|
|
8
8
|
"totalEnums": 74,
|
|
9
9
|
"totalRecords": 72,
|
|
10
10
|
"serviceCount": 33,
|
|
@@ -5041,11 +5041,11 @@
|
|
|
5041
5041
|
},
|
|
5042
5042
|
{
|
|
5043
5043
|
"title": "With Icon",
|
|
5044
|
-
"code": "<Alert>\n <Flex Gap=\"3\">\n <
|
|
5044
|
+
"code": "<Alert>\n <Flex Gap=\"3\">\n <SvgGlyph Svg=\"@(Lucide.Info)\" class=\"h-4 w-4 mt-0.5\" />\n <Stack Gap=\"0\">\n <Heading Level=\"5\" Size=\"sm\" Weight=\"medium\" Class=\"mb-1 leading-none tracking-tight\">Information</Heading>\n <Lumeo.Text Size=\"sm\" Leading=\"relaxed\">This action will update your preferences.</Lumeo.Text>\n </Stack>\n </Flex>\n</Alert>\n<Alert Variant=\"Alert.AlertVariant.Destructive\">\n <Flex Gap=\"3\">\n <SvgGlyph Svg=\"@(Lucide.CircleAlert)\" class=\"h-4 w-4 mt-0.5\" />\n <Stack Gap=\"0\">\n <Heading Level=\"5\" Size=\"sm\" Weight=\"medium\" Class=\"mb-1 leading-none tracking-tight\">Something went wrong</Heading>\n <Lumeo.Text Size=\"sm\" Leading=\"relaxed\">Could not save your changes. Please try again.</Lumeo.Text>\n </Stack>\n </Flex>\n</Alert>"
|
|
5045
5045
|
},
|
|
5046
5046
|
{
|
|
5047
5047
|
"title": "With Action",
|
|
5048
|
-
"code": "<Alert>\n <Flex Align=\"start\" Justify=\"between\" Gap=\"4\">\n <Flex Gap=\"3\">\n <
|
|
5048
|
+
"code": "<Alert>\n <Flex Align=\"start\" Justify=\"between\" Gap=\"4\">\n <Flex Gap=\"3\">\n <SvgGlyph Svg=\"@(Lucide.Bell)\" class=\"h-4 w-4 mt-0.5 text-primary\" />\n <Stack Gap=\"0\">\n <Heading Level=\"5\" Size=\"sm\" Weight=\"medium\" Class=\"mb-1 leading-none tracking-tight\">New feature available</Heading>\n <Lumeo.Text Size=\"sm\" Leading=\"relaxed\">Dark mode is now available for all users.</Lumeo.Text>\n </Stack>\n </Flex>\n <Button Variant=\"Button.ButtonVariant.Outline\" Size=\"Button.ButtonSize.Sm\">Try it</Button>\n </Flex>\n</Alert>"
|
|
5049
5049
|
}
|
|
5050
5050
|
],
|
|
5051
5051
|
"subComponents": {},
|
|
@@ -5196,7 +5196,7 @@
|
|
|
5196
5196
|
},
|
|
5197
5197
|
{
|
|
5198
5198
|
"title": "Unsaved Changes",
|
|
5199
|
-
"code": "<AlertDialog @bind-Open=\"_isOpen\">\n <AlertDialogTrigger>\n <Button Variant=\"Button.ButtonVariant.Ghost\">\n <
|
|
5199
|
+
"code": "<AlertDialog @bind-Open=\"_isOpen\">\n <AlertDialogTrigger>\n <Button Variant=\"Button.ButtonVariant.Ghost\">\n <SvgGlyph Svg=\"@(Lucide.X)\" class=\"h-4 w-4\" /> Close Editor\n </Button>\n </AlertDialogTrigger>\n <AlertDialogContent>\n <AlertDialogHeader>\n <AlertDialogTitle>Discard unsaved changes?</AlertDialogTitle>\n <AlertDialogDescription>\n You have unsaved changes. If you close now, your changes will be lost.\n </AlertDialogDescription>\n </AlertDialogHeader>\n <AlertDialogFooter>\n <AlertDialogCancel>Keep Editing</AlertDialogCancel>\n <AlertDialogAction>Discard Changes</AlertDialogAction>\n </AlertDialogFooter>\n </AlertDialogContent>\n</AlertDialog>"
|
|
5200
5200
|
},
|
|
5201
5201
|
{
|
|
5202
5202
|
"title": "Loading Action",
|
|
@@ -5956,7 +5956,7 @@
|
|
|
5956
5956
|
},
|
|
5957
5957
|
{
|
|
5958
5958
|
"title": "With Search",
|
|
5959
|
-
"code": "<AppBar>\n <StartContent>\n <Lumeo.Text Size=\"sm\" Weight=\"semibold\">Dashboard</Lumeo.Text>\n </StartContent>\n <ChildContent>\n <Input Placeholder=\"Search...\" Class=\"max-w-xs h-8 text-sm\" />\n </ChildContent>\n <EndContent>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <
|
|
5959
|
+
"code": "<AppBar>\n <StartContent>\n <Lumeo.Text Size=\"sm\" Weight=\"semibold\">Dashboard</Lumeo.Text>\n </StartContent>\n <ChildContent>\n <Input Placeholder=\"Search...\" Class=\"max-w-xs h-8 text-sm\" />\n </ChildContent>\n <EndContent>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <SvgGlyph Svg=\"@(Lucide.Bell)\" class=\"h-4 w-4\" />\n </Button>\n <Avatar><AvatarFallback>JD</AvatarFallback></Avatar>\n </EndContent>\n</AppBar>"
|
|
5960
5960
|
},
|
|
5961
5961
|
{
|
|
5962
5962
|
"title": "Appearance toggles — interactive",
|
|
@@ -5964,7 +5964,7 @@
|
|
|
5964
5964
|
},
|
|
5965
5965
|
{
|
|
5966
5966
|
"title": "Elevated (no border)",
|
|
5967
|
-
"code": "<AppBar Elevated=\"true\" Bordered=\"false\">\n <StartContent>\n <Lumeo.Text Size=\"sm\" Weight=\"semibold\">My App</Lumeo.Text>\n </StartContent>\n <EndContent>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <
|
|
5967
|
+
"code": "<AppBar Elevated=\"true\" Bordered=\"false\">\n <StartContent>\n <Lumeo.Text Size=\"sm\" Weight=\"semibold\">My App</Lumeo.Text>\n </StartContent>\n <EndContent>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <SvgGlyph Svg=\"@(Lucide.Settings)\" class=\"h-4 w-4\" />\n </Button>\n </EndContent>\n</AppBar>"
|
|
5968
5968
|
}
|
|
5969
5969
|
],
|
|
5970
5970
|
"subComponents": {},
|
|
@@ -6379,7 +6379,7 @@
|
|
|
6379
6379
|
"name": "Shape",
|
|
6380
6380
|
"type": "AvatarShape",
|
|
6381
6381
|
"default": "AvatarShape.Circle",
|
|
6382
|
-
"description":
|
|
6382
|
+
"description": "Avatar outline. Circle (default) and Square are literal contracts — a Circle avatar stays a circle in every theme. Themed follows the theme radius token instead: it renders identically to Circle at stock radii (the computed radius exceeds half the avatar size, so corners clamp to a full circle) and squares off along with the rest of the UI in sharp themes (--radius: 0) — pick it for sharp-brand designs.",
|
|
6383
6383
|
"isCascading": false,
|
|
6384
6384
|
"captureUnmatched": false,
|
|
6385
6385
|
"isEditorRequired": false
|
|
@@ -6436,7 +6436,8 @@
|
|
|
6436
6436
|
"name": "AvatarShape",
|
|
6437
6437
|
"values": [
|
|
6438
6438
|
"Circle",
|
|
6439
|
-
"Square"
|
|
6439
|
+
"Square",
|
|
6440
|
+
"Themed"
|
|
6440
6441
|
],
|
|
6441
6442
|
"description": null
|
|
6442
6443
|
},
|
|
@@ -6467,7 +6468,7 @@
|
|
|
6467
6468
|
},
|
|
6468
6469
|
{
|
|
6469
6470
|
"title": "Fallback Initials",
|
|
6470
|
-
"code": "<Avatar>\n <AvatarFallback>JD</AvatarFallback>\n</Avatar>\n<Avatar>\n <AvatarFallback>\n <
|
|
6471
|
+
"code": "<Avatar>\n <AvatarFallback>JD</AvatarFallback>\n</Avatar>\n<Avatar>\n <AvatarFallback>\n <SvgGlyph Svg=\"@(Lucide.User)\" class=\"h-4 w-4\" />\n </AvatarFallback>\n</Avatar>"
|
|
6471
6472
|
},
|
|
6472
6473
|
{
|
|
6473
6474
|
"title": "Sizes",
|
|
@@ -6779,7 +6780,7 @@
|
|
|
6779
6780
|
},
|
|
6780
6781
|
{
|
|
6781
6782
|
"title": "Custom Content",
|
|
6782
|
-
"code": "<BackToTop>\n <
|
|
6783
|
+
"code": "<BackToTop>\n <SvgGlyph Svg=\"@(Lucide.ChevronUp)\" class=\"h-5 w-5\" />\n</BackToTop>"
|
|
6783
6784
|
},
|
|
6784
6785
|
{
|
|
6785
6786
|
"title": "Interactive: Visibility Threshold",
|
|
@@ -6852,7 +6853,7 @@
|
|
|
6852
6853
|
"name": "Pill",
|
|
6853
6854
|
"type": "bool",
|
|
6854
6855
|
"default": null,
|
|
6855
|
-
"description": "Pill shape
|
|
6856
|
+
"description": "Pill shape instead of the default rounded-md — for count/quota chips. Theme-radius-aware: renders as a full pill at stock radii and squares off along with the rest of the UI in sharp themes (--radius: 0).",
|
|
6856
6857
|
"isCascading": false,
|
|
6857
6858
|
"captureUnmatched": false,
|
|
6858
6859
|
"isEditorRequired": false
|
|
@@ -8013,11 +8014,11 @@
|
|
|
8013
8014
|
},
|
|
8014
8015
|
{
|
|
8015
8016
|
"title": "With Icons",
|
|
8016
|
-
"code": "<Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem>\n <BreadcrumbLink Href=\"#\">\n <
|
|
8017
|
+
"code": "<Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem>\n <BreadcrumbLink Href=\"#\">\n <SvgGlyph Svg=\"@(Lucide.Home)\" class=\"h-4 w-4\" />\n </BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator />\n <BreadcrumbItem>\n <BreadcrumbLink Href=\"#\">Documents</BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator />\n <BreadcrumbItem>\n <BreadcrumbLink Href=\"#\">Projects</BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator />\n <BreadcrumbItem>\n <BreadcrumbPage>Report.pdf</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n</Breadcrumb>"
|
|
8017
8018
|
},
|
|
8018
8019
|
{
|
|
8019
8020
|
"title": "Custom Separator",
|
|
8020
|
-
"code": "<Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem>\n <BreadcrumbLink Href=\"#\">Home</BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator>\n <
|
|
8021
|
+
"code": "<Breadcrumb>\n <BreadcrumbList>\n <BreadcrumbItem>\n <BreadcrumbLink Href=\"#\">Home</BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator>\n <SvgGlyph Svg=\"@(Lucide.Slash)\" class=\"h-4 w-4\" />\n </BreadcrumbSeparator>\n <BreadcrumbItem>\n <BreadcrumbLink Href=\"#\">Settings</BreadcrumbLink>\n </BreadcrumbItem>\n <BreadcrumbSeparator>\n <SvgGlyph Svg=\"@(Lucide.Slash)\" class=\"h-4 w-4\" />\n </BreadcrumbSeparator>\n <BreadcrumbItem>\n <BreadcrumbPage>Profile</BreadcrumbPage>\n </BreadcrumbItem>\n </BreadcrumbList>\n</Breadcrumb>"
|
|
8021
8022
|
}
|
|
8022
8023
|
],
|
|
8023
8024
|
"subComponents": {
|
|
@@ -8561,11 +8562,11 @@
|
|
|
8561
8562
|
},
|
|
8562
8563
|
{
|
|
8563
8564
|
"title": "Sizes",
|
|
8564
|
-
"code": "<Button Size=\"Button.ButtonSize.Sm\">Small</Button>\n<Button>Default</Button>\n<Button Size=\"Button.ButtonSize.Lg\">Large</Button>\n<Button Size=\"Button.ButtonSize.Icon\">\n <
|
|
8565
|
+
"code": "<Button Size=\"Button.ButtonSize.Sm\">Small</Button>\n<Button>Default</Button>\n<Button Size=\"Button.ButtonSize.Lg\">Large</Button>\n<Button Size=\"Button.ButtonSize.Icon\">\n <SvgGlyph Svg=\"@(Lucide.ChevronRight)\" class=\"h-4 w-4\" />\n</Button>"
|
|
8565
8566
|
},
|
|
8566
8567
|
{
|
|
8567
8568
|
"title": "With Icon",
|
|
8568
|
-
"code": "<Button>\n <
|
|
8569
|
+
"code": "<Button>\n <SvgGlyph Svg=\"@(Lucide.Mail)\" class=\"h-4 w-4\" />\n Login with Email\n</Button>\n<Button Variant=\"Button.ButtonVariant.Secondary\">\n <SvgGlyph Svg=\"@(Lucide.Loader2)\" class=\"h-4 w-4 animate-spin\" />\n Please wait\n</Button>"
|
|
8569
8570
|
},
|
|
8570
8571
|
{
|
|
8571
8572
|
"title": "Disabled",
|
|
@@ -8654,7 +8655,7 @@
|
|
|
8654
8655
|
"examples": [
|
|
8655
8656
|
{
|
|
8656
8657
|
"title": "Horizontal (default)",
|
|
8657
|
-
"code": "<ButtonGroup>\n <Button Variant=\"Button.ButtonVariant.Outline\">\n <
|
|
8658
|
+
"code": "<ButtonGroup>\n <Button Variant=\"Button.ButtonVariant.Outline\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n </Button>\n <Button Variant=\"Button.ButtonVariant.Outline\">\n <SvgGlyph Svg=\"@(Lucide.Italic)\" class=\"h-4 w-4\" />\n </Button>\n <Button Variant=\"Button.ButtonVariant.Outline\">\n <SvgGlyph Svg=\"@(Lucide.Underline)\" class=\"h-4 w-4\" />\n </Button>\n</ButtonGroup>"
|
|
8658
8659
|
},
|
|
8659
8660
|
{
|
|
8660
8661
|
"title": "Vertical",
|
|
@@ -9131,11 +9132,11 @@
|
|
|
9131
9132
|
},
|
|
9132
9133
|
{
|
|
9133
9134
|
"title": "Card with Actions",
|
|
9134
|
-
"code": "<Card>\n <CardHeader>\n <Heading Level=\"3\" Size=\"lg\" Class=\"leading-none tracking-tight\">Blog Post</Heading>\n <Lumeo.Text Size=\"sm\" Color=\"muted\">Published on Jan 12, 2025</Lumeo.Text>\n </CardHeader>\n <CardContent>\n <Lumeo.Text Size=\"sm\" Color=\"foreground\">\n Learn how to build accessible, composable UI components using\n Blazor and Tailwind CSS in this in-depth guide.\n </Lumeo.Text>\n </CardContent>\n <CardFooter>\n <Flex Gap=\"2\" Class=\"w-full\">\n <Button Variant=\"Button.ButtonVariant.Outline\" Size=\"Button.ButtonSize.Sm\">\n <
|
|
9135
|
+
"code": "<Card>\n <CardHeader>\n <Heading Level=\"3\" Size=\"lg\" Class=\"leading-none tracking-tight\">Blog Post</Heading>\n <Lumeo.Text Size=\"sm\" Color=\"muted\">Published on Jan 12, 2025</Lumeo.Text>\n </CardHeader>\n <CardContent>\n <Lumeo.Text Size=\"sm\" Color=\"foreground\">\n Learn how to build accessible, composable UI components using\n Blazor and Tailwind CSS in this in-depth guide.\n </Lumeo.Text>\n </CardContent>\n <CardFooter>\n <Flex Gap=\"2\" Class=\"w-full\">\n <Button Variant=\"Button.ButtonVariant.Outline\" Size=\"Button.ButtonSize.Sm\">\n <SvgGlyph Svg=\"@(Lucide.Copy)\" class=\"h-4 w-4\" /> Edit\n </Button>\n <Button Variant=\"Button.ButtonVariant.Destructive\" Size=\"Button.ButtonSize.Sm\">\n <SvgGlyph Svg=\"@(Lucide.Trash)\" class=\"h-4 w-4\" /> Delete\n </Button>\n </Flex>\n </CardFooter>\n</Card>"
|
|
9135
9136
|
},
|
|
9136
9137
|
{
|
|
9137
9138
|
"title": "Horizontal Card",
|
|
9138
|
-
"code": "<Card>\n <Flex>\n <Center Class=\"w-32 h-32 rounded-l-lg bg-muted shrink-0\">\n <
|
|
9139
|
+
"code": "<Card>\n <Flex>\n <Center Class=\"w-32 h-32 rounded-l-lg bg-muted shrink-0\">\n <SvgGlyph Svg=\"@(Lucide.Star)\" class=\"h-10 w-10 text-muted-foreground\" />\n </Center>\n <Stack Gap=\"0\" Class=\"flex-1\">\n <CardHeader>\n <Heading Level=\"3\" Size=\"base\" Weight=\"semibold\" Class=\"leading-none tracking-tight\">Featured Article</Heading>\n <Lumeo.Text Size=\"sm\" Color=\"muted\">5 min read</Lumeo.Text>\n </CardHeader>\n <CardContent>\n <Lumeo.Text Size=\"sm\" Color=\"muted\">\n An introduction to modern component-driven design systems.\n </Lumeo.Text>\n </CardContent>\n <CardFooter>\n <Button Variant=\"Button.ButtonVariant.Link\" Class=\"px-0\">Read more</Button>\n </CardFooter>\n </Stack>\n </Flex>\n</Card>"
|
|
9139
9140
|
},
|
|
9140
9141
|
{
|
|
9141
9142
|
"title": "With Form",
|
|
@@ -10512,7 +10513,25 @@
|
|
|
10512
10513
|
"name": "Gradient",
|
|
10513
10514
|
"type": "bool",
|
|
10514
10515
|
"default": "true",
|
|
10515
|
-
"description":
|
|
10516
|
+
"description": "When true (default) the fill uses a lighter opacity than a solid area. This is the legacy opacity-only behaviour and is unaffected by GradientFill.",
|
|
10517
|
+
"isCascading": false,
|
|
10518
|
+
"captureUnmatched": false,
|
|
10519
|
+
"isEditorRequired": false
|
|
10520
|
+
},
|
|
10521
|
+
{
|
|
10522
|
+
"name": "GradientFill",
|
|
10523
|
+
"type": "bool",
|
|
10524
|
+
"default": null,
|
|
10525
|
+
"description": "Opt into a real vertical gradient fill: each series' area fades from its own (brand/theme) colour at the top to transparent at the bottom, the look used by modern dashboards. Off by default so existing charts are unchanged. Override the stops with GradientStops.",
|
|
10526
|
+
"isCascading": false,
|
|
10527
|
+
"captureUnmatched": false,
|
|
10528
|
+
"isEditorRequired": false
|
|
10529
|
+
},
|
|
10530
|
+
{
|
|
10531
|
+
"name": "GradientStops",
|
|
10532
|
+
"type": "List<EChartGradientColorStop>?",
|
|
10533
|
+
"default": null,
|
|
10534
|
+
"description": "Explicit gradient colour-stops applied to every series' area fill when set (implies GradientFill). Offsets run 0 (top) → 1 (bottom); colours accept theme tokens like var(--color-primary). When null and GradientFill is true, a per-series colour → transparent fade is used.",
|
|
10516
10535
|
"isCascading": false,
|
|
10517
10536
|
"captureUnmatched": false,
|
|
10518
10537
|
"isEditorRequired": false
|
|
@@ -19164,6 +19183,15 @@
|
|
|
19164
19183
|
"captureUnmatched": false,
|
|
19165
19184
|
"isEditorRequired": false
|
|
19166
19185
|
},
|
|
19186
|
+
{
|
|
19187
|
+
"name": "IconContent",
|
|
19188
|
+
"type": "RenderFragment?",
|
|
19189
|
+
"default": null,
|
|
19190
|
+
"description": "Optional leading icon slot. Rendered before ChildContent inside an inline-flex items-center shrink-0 wrapper so sized content (e.g. a colour-dot <span>) retains its explicit dimensions. Only active when neither Avatar nor Icon is set.",
|
|
19191
|
+
"isCascading": false,
|
|
19192
|
+
"captureUnmatched": false,
|
|
19193
|
+
"isEditorRequired": false
|
|
19194
|
+
},
|
|
19167
19195
|
{
|
|
19168
19196
|
"name": "Variant",
|
|
19169
19197
|
"type": "ChipVariant",
|
|
@@ -19839,7 +19867,7 @@
|
|
|
19839
19867
|
"examples": [
|
|
19840
19868
|
{
|
|
19841
19869
|
"title": "Default",
|
|
19842
|
-
"code": "<Collapsible @bind-Open=\"_isOpen\">\n <div class=\"flex items-center justify-between\">\n <h4 class=\"text-sm font-semibold\">Starred Repositories</h4>\n <CollapsibleTrigger>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <
|
|
19870
|
+
"code": "<Collapsible @bind-Open=\"_isOpen\">\n <div class=\"flex items-center justify-between\">\n <h4 class=\"text-sm font-semibold\">Starred Repositories</h4>\n <CollapsibleTrigger>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <SvgGlyph Svg=\"@(Lucide.ChevronDown)\" class=\"h-4 w-4\" />\n </Button>\n </CollapsibleTrigger>\n </div>\n <CollapsibleContent>\n <div class=\"rounded-md border px-4 py-2 text-sm\">Content here</div>\n </CollapsibleContent>\n</Collapsible>"
|
|
19843
19871
|
},
|
|
19844
19872
|
{
|
|
19845
19873
|
"title": "Initially Open",
|
|
@@ -19847,7 +19875,7 @@
|
|
|
19847
19875
|
},
|
|
19848
19876
|
{
|
|
19849
19877
|
"title": "Sidebar Section",
|
|
19850
|
-
"code": "<Collapsible @bind-Open=\"_isOpen\">\n <CollapsibleTrigger>\n <div class=\"flex items-center justify-between px-2 py-1.5 rounded-md hover:bg-accent cursor-pointer\">\n <div class=\"flex items-center gap-2 text-sm font-medium\">\n <
|
|
19878
|
+
"code": "<Collapsible @bind-Open=\"_isOpen\">\n <CollapsibleTrigger>\n <div class=\"flex items-center justify-between px-2 py-1.5 rounded-md hover:bg-accent cursor-pointer\">\n <div class=\"flex items-center gap-2 text-sm font-medium\">\n <SvgGlyph Svg=\"@(Lucide.Settings)\" class=\"h-4 w-4\" /> Settings\n </div>\n <SvgGlyph Svg=\"@(Lucide.ChevronDown)\" class=\"@($\"h-4 w-4 transition-transform {(_isOpen ? \\\"rotate-180\\\" : \\\"\\\")}\")}\" />\n </div>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <div class=\"pl-6 mt-1 space-y-1\">\n <div class=\"px-2 py-1.5 text-sm text-muted-foreground\">General</div>\n <div class=\"px-2 py-1.5 text-sm text-muted-foreground\">Security</div>\n <div class=\"px-2 py-1.5 text-sm text-muted-foreground\">Notifications</div>\n </div>\n </CollapsibleContent>\n</Collapsible>"
|
|
19851
19879
|
}
|
|
19852
19880
|
],
|
|
19853
19881
|
"subComponents": {
|
|
@@ -21248,7 +21276,7 @@
|
|
|
21248
21276
|
"examples": [
|
|
21249
21277
|
{
|
|
21250
21278
|
"title": "Default",
|
|
21251
|
-
"code": "<Command>\n <CommandInput Placeholder=\"Type a command or search...\" />\n <CommandList>\n <CommandGroup Heading=\"Suggestions\">\n <CommandItem>\n <
|
|
21279
|
+
"code": "<Command>\n <CommandInput Placeholder=\"Type a command or search...\" />\n <CommandList>\n <CommandGroup Heading=\"Suggestions\">\n <CommandItem>\n <SvgGlyph Svg=\"@(Lucide.Calendar)\" class=\"mr-2 h-4 w-4\" />\n <span>Calendar</span>\n </CommandItem>\n <CommandItem>\n <SvgGlyph Svg=\"@(Lucide.Settings)\" class=\"mr-2 h-4 w-4\" />\n <span>Settings</span>\n </CommandItem>\n </CommandGroup>\n <CommandSeparator />\n <CommandGroup Heading=\"Actions\">\n <CommandItem>\n <SvgGlyph Svg=\"@(Lucide.User)\" class=\"mr-2 h-4 w-4\" />\n <span>Profile</span>\n </CommandItem>\n </CommandGroup>\n </CommandList>\n</Command>"
|
|
21252
21280
|
},
|
|
21253
21281
|
{
|
|
21254
21282
|
"title": "Compact",
|
|
@@ -21256,7 +21284,7 @@
|
|
|
21256
21284
|
},
|
|
21257
21285
|
{
|
|
21258
21286
|
"title": "Navigation",
|
|
21259
|
-
"code": "<Command>\n <CommandInput Placeholder=\"Go to...\" />\n <CommandList>\n <CommandGroup Heading=\"Pages\">\n <CommandItem>\n <
|
|
21287
|
+
"code": "<Command>\n <CommandInput Placeholder=\"Go to...\" />\n <CommandList>\n <CommandGroup Heading=\"Pages\">\n <CommandItem>\n <SvgGlyph Svg=\"@(Lucide.House)\" class=\"mr-2 h-4 w-4\" />\n <span>Dashboard</span>\n </CommandItem>\n <CommandItem>\n <SvgGlyph Svg=\"@(Lucide.User)\" class=\"mr-2 h-4 w-4\" />\n <span>Profile</span>\n </CommandItem>\n <CommandItem>\n <SvgGlyph Svg=\"@(Lucide.Settings)\" class=\"mr-2 h-4 w-4\" />\n <span>Settings</span>\n </CommandItem>\n </CommandGroup>\n <CommandSeparator />\n <CommandGroup Heading=\"Recent\">\n <CommandItem>\n <SvgGlyph Svg=\"@(Lucide.Bell)\" class=\"mr-2 h-4 w-4\" />\n <span>Notifications</span>\n </CommandItem>\n <CommandItem>\n <SvgGlyph Svg=\"@(Lucide.Mail)\" class=\"mr-2 h-4 w-4\" />\n <span>Messages</span>\n </CommandItem>\n </CommandGroup>\n </CommandList>\n</Command>"
|
|
21260
21288
|
},
|
|
21261
21289
|
{
|
|
21262
21290
|
"title": "Disabled Items",
|
|
@@ -21402,6 +21430,15 @@
|
|
|
21402
21430
|
"captureUnmatched": false,
|
|
21403
21431
|
"isEditorRequired": false
|
|
21404
21432
|
},
|
|
21433
|
+
{
|
|
21434
|
+
"name": "AutoFocus",
|
|
21435
|
+
"type": "bool",
|
|
21436
|
+
"default": null,
|
|
21437
|
+
"description": "Focuses the search input on first render via the existing focus interop. Mirrors cmdk, where a bare Command.Input does NOT autofocus but a dialog-hosted command palette does — so this is opt-in (default false): set AutoFocus=\"true\" when hosting the palette in a Dialog/Popover so the user can type immediately on open. The HTML autofocus attribute is a no-op in Blazor WASM, hence the post-render FocusElement hop (see Input.AutoFocus).",
|
|
21438
|
+
"isCascading": false,
|
|
21439
|
+
"captureUnmatched": false,
|
|
21440
|
+
"isEditorRequired": false
|
|
21441
|
+
},
|
|
21405
21442
|
{
|
|
21406
21443
|
"name": "Class",
|
|
21407
21444
|
"type": "string?",
|
|
@@ -21640,7 +21677,7 @@
|
|
|
21640
21677
|
"Home"
|
|
21641
21678
|
],
|
|
21642
21679
|
"keyboardInteractive": true,
|
|
21643
|
-
"focusManaged":
|
|
21680
|
+
"focusManaged": true
|
|
21644
21681
|
},
|
|
21645
21682
|
"parseFailed": false,
|
|
21646
21683
|
"parseError": null
|
|
@@ -23299,7 +23336,7 @@
|
|
|
23299
23336
|
"name": "Compact",
|
|
23300
23337
|
"type": "bool",
|
|
23301
23338
|
"default": null,
|
|
23302
|
-
"description":
|
|
23339
|
+
"description": "Dense layout: header and body cells drop from px-3 py-2 to px-2 py-1 (and the root text shrinks to text-sm), so the effective row height genuinely decreases — not just the font size. The flag flows to every cell through DataGridContext{TItem}, so toggling it after first render re-pads the grid live. When virtualization is active (see VirtualItemSize) the default row-height estimate is auto-tightened under Compact unless you pass an explicit VirtualItemSize. Default false.",
|
|
23303
23340
|
"isCascading": false,
|
|
23304
23341
|
"captureUnmatched": false,
|
|
23305
23342
|
"isEditorRequired": false
|
|
@@ -23425,7 +23462,7 @@
|
|
|
23425
23462
|
"name": "VirtualItemSize",
|
|
23426
23463
|
"type": "float",
|
|
23427
23464
|
"default": "41f",
|
|
23428
|
-
"description": "Estimated row height in CSS pixels — used by <Virtualize> to size the scroll spacers. Tune if your rows are taller (dense badges, two-line cells). Default 41px.",
|
|
23465
|
+
"description": "Estimated row height in CSS pixels — used by <Virtualize> to size the scroll spacers. Tune if your rows are taller (dense badges, two-line cells). Default 41px. When Compact is on and this parameter is left at its default, the estimate auto-tightens to CompactVirtualItemSizepx so the scroll spacers match the shorter compact rows; pass an explicit value to override either way.",
|
|
23429
23466
|
"isCascading": false,
|
|
23430
23467
|
"captureUnmatched": false,
|
|
23431
23468
|
"isEditorRequired": false
|
|
@@ -24552,6 +24589,24 @@
|
|
|
24552
24589
|
"captureUnmatched": false,
|
|
24553
24590
|
"isEditorRequired": false
|
|
24554
24591
|
},
|
|
24592
|
+
{
|
|
24593
|
+
"name": "Visible",
|
|
24594
|
+
"type": "bool",
|
|
24595
|
+
"default": "true",
|
|
24596
|
+
"description": "Two-way bindable column visibility. Seeds the registered column's initial visibility and lets a consumer show/hide the column programmatically via @bind-Visible. When the user toggles the column through the built-in column-chooser, VisibleChanged fires so the bound value follows. Default true.",
|
|
24597
|
+
"isCascading": false,
|
|
24598
|
+
"captureUnmatched": false,
|
|
24599
|
+
"isEditorRequired": false
|
|
24600
|
+
},
|
|
24601
|
+
{
|
|
24602
|
+
"name": "VisibleChanged",
|
|
24603
|
+
"type": "EventCallback<bool>",
|
|
24604
|
+
"default": null,
|
|
24605
|
+
"description": "Fires when the column's visibility changes through the built-in UI — the callback half of Visible's two-way binding.",
|
|
24606
|
+
"isCascading": false,
|
|
24607
|
+
"captureUnmatched": false,
|
|
24608
|
+
"isEditorRequired": false
|
|
24609
|
+
},
|
|
24555
24610
|
{
|
|
24556
24611
|
"name": "AdditionalAttributes",
|
|
24557
24612
|
"type": "Dictionary<string, object>?",
|
|
@@ -24562,7 +24617,13 @@
|
|
|
24562
24617
|
"isEditorRequired": false
|
|
24563
24618
|
}
|
|
24564
24619
|
],
|
|
24565
|
-
"events": [
|
|
24620
|
+
"events": [
|
|
24621
|
+
{
|
|
24622
|
+
"name": "VisibleChanged",
|
|
24623
|
+
"type": "EventCallback<bool>",
|
|
24624
|
+
"description": "Fires when the column's visibility changes through the built-in UI — the callback half of Visible's two-way binding."
|
|
24625
|
+
}
|
|
24626
|
+
],
|
|
24566
24627
|
"enums": [],
|
|
24567
24628
|
"records": [],
|
|
24568
24629
|
"gotchas": [],
|
|
@@ -26023,16 +26084,21 @@
|
|
|
26023
26084
|
},
|
|
26024
26085
|
"a11y": {
|
|
26025
26086
|
"roles": [
|
|
26087
|
+
"checkbox",
|
|
26026
26088
|
"columnheader",
|
|
26027
26089
|
"dialog",
|
|
26028
26090
|
"gridcell",
|
|
26091
|
+
"menu",
|
|
26092
|
+
"menuitem",
|
|
26029
26093
|
"row",
|
|
26030
26094
|
"status"
|
|
26031
26095
|
],
|
|
26032
26096
|
"ariaAttributes": [
|
|
26097
|
+
"aria-checked",
|
|
26033
26098
|
"aria-colcount",
|
|
26034
26099
|
"aria-colindex",
|
|
26035
26100
|
"aria-expanded",
|
|
26101
|
+
"aria-haspopup",
|
|
26036
26102
|
"aria-hidden",
|
|
26037
26103
|
"aria-label",
|
|
26038
26104
|
"aria-level",
|
|
@@ -28128,7 +28194,7 @@
|
|
|
28128
28194
|
},
|
|
28129
28195
|
{
|
|
28130
28196
|
"title": "Confirmation Dialog",
|
|
28131
|
-
"code": "<Dialog @bind-Open=\"_isOpen\">\n <DialogTrigger>\n <Button Variant=\"Button.ButtonVariant.Destructive\">\n <
|
|
28197
|
+
"code": "<Dialog @bind-Open=\"_isOpen\">\n <DialogTrigger>\n <Button Variant=\"Button.ButtonVariant.Destructive\">\n <SvgGlyph Svg=\"@(Lucide.Trash)\" class=\"h-4 w-4\" /> Delete Account\n </Button>\n </DialogTrigger>\n <DialogContent>\n <DialogHeader>\n <DialogTitle>Are you absolutely sure?</DialogTitle>\n <DialogDescription>\n This action cannot be undone. This will permanently delete your\n account and remove your data from our servers.\n </DialogDescription>\n </DialogHeader>\n <DialogFooter>\n <DialogClose>\n <Button Variant=\"Button.ButtonVariant.Outline\">Cancel</Button>\n </DialogClose>\n <DialogClose>\n <Button Variant=\"Button.ButtonVariant.Destructive\">Yes, delete account</Button>\n </DialogClose>\n </DialogFooter>\n </DialogContent>\n</Dialog>\n\n@code {\n private bool _isOpen;\n}"
|
|
28132
28198
|
},
|
|
28133
28199
|
{
|
|
28134
28200
|
"title": "Prevent Close",
|
|
@@ -28652,7 +28718,7 @@
|
|
|
28652
28718
|
"examples": [
|
|
28653
28719
|
{
|
|
28654
28720
|
"title": "LTR vs RTL",
|
|
28655
|
-
"code": "@* Same markup, two directions. *@\n<DirectionProvider Direction=\"LayoutDirection.Rtl\">\n <Flex Align=\"center\" Gap=\"3\">\n <
|
|
28721
|
+
"code": "@* Same markup, two directions. *@\n<DirectionProvider Direction=\"LayoutDirection.Rtl\">\n <Flex Align=\"center\" Gap=\"3\">\n <SvgGlyph Svg=\"@(Lucide.Info)\" class=\"h-5 w-5 text-primary shrink-0\" />\n <Lumeo.Text Size=\"sm\">Mirrors under RTL.</Lumeo.Text>\n <Button Size=\"Lumeo.Size.Sm\" Class=\"ms-auto\">Action</Button>\n </Flex>\n</DirectionProvider>\n\n@code {\n // LayoutDirection lives in Lumeo.Services.\n}"
|
|
28656
28722
|
},
|
|
28657
28723
|
{
|
|
28658
28724
|
"title": "Wrapping the whole app",
|
|
@@ -28750,11 +28816,11 @@
|
|
|
28750
28816
|
"examples": [
|
|
28751
28817
|
{
|
|
28752
28818
|
"title": "Basic Dock",
|
|
28753
|
-
"code": "<Dock>\n <button class=\"w-12 h-12 rounded-xl bg-card border border-border/40 flex items-center justify-center\" title=\"Home\">\n <
|
|
28819
|
+
"code": "<Dock>\n <button class=\"w-12 h-12 rounded-xl bg-card border border-border/40 flex items-center justify-center\" title=\"Home\">\n <SvgGlyph Svg=\"Lucide.House\" class=\"h-6 w-6 text-foreground/80\" />\n </button>\n <button class=\"w-12 h-12 rounded-xl bg-card border border-border/40 flex items-center justify-center\" title=\"Files\">\n <SvgGlyph Svg=\"Lucide.FolderOpen\" class=\"h-6 w-6 text-foreground/80\" />\n </button>\n <button class=\"w-12 h-12 rounded-xl bg-card border border-border/40 flex items-center justify-center\" title=\"Mail\">\n <SvgGlyph Svg=\"Lucide.Mail\" class=\"h-6 w-6 text-foreground/80\" />\n </button>\n</Dock>"
|
|
28754
28820
|
},
|
|
28755
28821
|
{
|
|
28756
28822
|
"title": "Custom Scale & Radius",
|
|
28757
|
-
"code": "<Dock MaxScale=\"2.2\" MagnifyRadius=\"120\">\n <!-- dock items with
|
|
28823
|
+
"code": "<Dock MaxScale=\"2.2\" MagnifyRadius=\"120\">\n <!-- dock items with SvgGlyph icons -->\n</Dock>"
|
|
28758
28824
|
}
|
|
28759
28825
|
],
|
|
28760
28826
|
"subComponents": {},
|
|
@@ -28886,7 +28952,7 @@
|
|
|
28886
28952
|
},
|
|
28887
28953
|
{
|
|
28888
28954
|
"title": "Filters Drawer",
|
|
28889
|
-
"code": "<Drawer @bind-Open=\"_isFiltersOpen\">\n <DrawerTrigger>\n <Button Variant=\"Button.ButtonVariant.Outline\">\n <
|
|
28955
|
+
"code": "<Drawer @bind-Open=\"_isFiltersOpen\">\n <DrawerTrigger>\n <Button Variant=\"Button.ButtonVariant.Outline\">\n <SvgGlyph Svg=\"@(Lucide.Settings)\" class=\"h-4 w-4\" /> Filters\n </Button>\n </DrawerTrigger>\n <DrawerContent>\n <DrawerHeader>\n <DrawerTitle>Filter Results</DrawerTitle>\n <DrawerDescription>Narrow down your search.</DrawerDescription>\n </DrawerHeader>\n <Stack Gap=\"4\" Class=\"p-4\">\n <Select @bind-Value=\"_filterCategory\">\n <SelectTrigger><span>@(_filterCategory ?? \"All categories\")</span></SelectTrigger>\n <SelectContent>\n <SelectItem Value=\"electronics\">Electronics</SelectItem>\n <SelectItem Value=\"clothing\">Clothing</SelectItem>\n </SelectContent>\n </Select>\n </Stack>\n <DrawerFooter>\n <DrawerClose><Button Class=\"w-full\">Apply Filters</Button></DrawerClose>\n </DrawerFooter>\n </DrawerContent>\n</Drawer>"
|
|
28890
28956
|
},
|
|
28891
28957
|
{
|
|
28892
28958
|
"title": "Prevent Close",
|
|
@@ -30619,7 +30685,7 @@
|
|
|
30619
30685
|
"examples": [
|
|
30620
30686
|
{
|
|
30621
30687
|
"title": "Basic Feature Grid",
|
|
30622
|
-
"code": "<FeatureGrid Title=\"Everything in the box\"\n Subtitle=\"A focused set of primitives that compose into anything.\">\n <FeatureItem Title=\"Theming\" Description=\"Every color is a CSS variable.\">\n <IconContent><
|
|
30688
|
+
"code": "<FeatureGrid Title=\"Everything in the box\"\n Subtitle=\"A focused set of primitives that compose into anything.\">\n <FeatureItem Title=\"Theming\" Description=\"Every color is a CSS variable.\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Palette)\" class=\"h-5 w-5\" /></IconContent>\n </FeatureItem>\n <FeatureItem Title=\"Accessible\" Description=\"WAI-ARIA roles and keyboard navigation.\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Accessibility)\" class=\"h-5 w-5\" /></IconContent>\n </FeatureItem>\n <FeatureItem Title=\"Density\" Description=\"Flip a panel between compact and spacious.\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Rows3)\" class=\"h-5 w-5\" /></IconContent>\n </FeatureItem>\n</FeatureGrid>"
|
|
30623
30689
|
},
|
|
30624
30690
|
{
|
|
30625
30691
|
"title": "Two Columns",
|
|
@@ -30627,7 +30693,7 @@
|
|
|
30627
30693
|
},
|
|
30628
30694
|
{
|
|
30629
30695
|
"title": "Standalone Feature Item",
|
|
30630
|
-
"code": "<FeatureItem Title=\"Fast by default\" Description=\"A small CSS bundle keeps your app lean.\">\n <IconContent><
|
|
30696
|
+
"code": "<FeatureItem Title=\"Fast by default\" Description=\"A small CSS bundle keeps your app lean.\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Zap)\" class=\"h-5 w-5\" /></IconContent>\n</FeatureItem>"
|
|
30631
30697
|
}
|
|
30632
30698
|
],
|
|
30633
30699
|
"subComponents": {},
|
|
@@ -30725,7 +30791,7 @@
|
|
|
30725
30791
|
"examples": [
|
|
30726
30792
|
{
|
|
30727
30793
|
"title": "Basic",
|
|
30728
|
-
"code": "<FeatureItem Title=\"Fast by default\" Description=\"A small CSS bundle keeps your app lean.\">\n <IconContent><
|
|
30794
|
+
"code": "<FeatureItem Title=\"Fast by default\" Description=\"A small CSS bundle keeps your app lean.\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Zap)\" class=\"h-5 w-5\" /></IconContent>\n</FeatureItem>"
|
|
30729
30795
|
},
|
|
30730
30796
|
{
|
|
30731
30797
|
"title": "Without an Icon",
|
|
@@ -30733,11 +30799,11 @@
|
|
|
30733
30799
|
},
|
|
30734
30800
|
{
|
|
30735
30801
|
"title": "With Extra Content",
|
|
30736
|
-
"code": "<FeatureItem Title=\"Accessible\" Description=\"WAI-ARIA roles, keyboard navigation, and focus management built in.\">\n <IconContent><
|
|
30802
|
+
"code": "<FeatureItem Title=\"Accessible\" Description=\"WAI-ARIA roles, keyboard navigation, and focus management built in.\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Accessibility)\" class=\"h-5 w-5\" /></IconContent>\n <ChildContent>\n <a href=\"/docs/accessibility\" class=\"mt-3 inline-flex items-center gap-1 text-sm font-medium text-primary hover:underline\">\n Learn more\n <SvgGlyph Svg=\"@(Lucide.ArrowRight)\" class=\"h-4 w-4\" />\n </a>\n </ChildContent>\n</FeatureItem>"
|
|
30737
30803
|
},
|
|
30738
30804
|
{
|
|
30739
30805
|
"title": "In a Feature Grid",
|
|
30740
|
-
"code": "<FeatureGrid Columns=\"2\" Title=\"Composes into a grid\">\n <FeatureItem Title=\"Fast\" Description=\"Small CSS bundle, tree-shakeable.\">\n <IconContent><
|
|
30806
|
+
"code": "<FeatureGrid Columns=\"2\" Title=\"Composes into a grid\">\n <FeatureItem Title=\"Fast\" Description=\"Small CSS bundle, tree-shakeable.\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Zap)\" class=\"h-5 w-5\" /></IconContent>\n </FeatureItem>\n <FeatureItem Title=\"Themeable\" Description=\"Every color is a CSS variable.\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Palette)\" class=\"h-5 w-5\" /></IconContent>\n </FeatureItem>\n</FeatureGrid>"
|
|
30741
30807
|
}
|
|
30742
30808
|
],
|
|
30743
30809
|
"subComponents": {},
|
|
@@ -31130,6 +31196,15 @@
|
|
|
31130
31196
|
"captureUnmatched": false,
|
|
31131
31197
|
"isEditorRequired": false
|
|
31132
31198
|
},
|
|
31199
|
+
{
|
|
31200
|
+
"name": "ShowFileList",
|
|
31201
|
+
"type": "bool",
|
|
31202
|
+
"default": "true",
|
|
31203
|
+
"description": "When true (default), renders the internal file card list after selection. Set to false for immediate-upload flows where the app renders its own file list — the internal card with the remove-X will no longer linger after the upload completes. Selection and upload events (OnFilesSelected, OnUpload, OnFileUploaded) still fire normally regardless of this setting. Pair with Reset via @@ref to clear state and allow the same file to be re-picked.",
|
|
31204
|
+
"isCascading": false,
|
|
31205
|
+
"captureUnmatched": false,
|
|
31206
|
+
"isEditorRequired": false
|
|
31207
|
+
},
|
|
31133
31208
|
{
|
|
31134
31209
|
"name": "Variant",
|
|
31135
31210
|
"type": "FileUploadVariant",
|
|
@@ -32571,6 +32646,24 @@
|
|
|
32571
32646
|
"captureUnmatched": false,
|
|
32572
32647
|
"isEditorRequired": false
|
|
32573
32648
|
},
|
|
32649
|
+
{
|
|
32650
|
+
"name": "ZoomLevels",
|
|
32651
|
+
"type": "IReadOnlyList<GanttViewMode>?",
|
|
32652
|
+
"default": null,
|
|
32653
|
+
"description": "Restricts which zoom buttons the toolbar renders, in the given order. When null or empty the full default set (Day, Week, Month, Year) is shown — matching the previous hardcoded toolbar. Only toolbar-representable levels are drawn: QuarterDay / HalfDay have no toolbar button and are silently skipped here (still settable via ViewMode). Example: ZoomLevels=\"new[]{ GanttViewMode.Day, GanttViewMode.Week, GanttViewMode.Month }\".",
|
|
32654
|
+
"isCascading": false,
|
|
32655
|
+
"captureUnmatched": false,
|
|
32656
|
+
"isEditorRequired": false
|
|
32657
|
+
},
|
|
32658
|
+
{
|
|
32659
|
+
"name": "DefaultZoom",
|
|
32660
|
+
"type": "GanttViewMode?",
|
|
32661
|
+
"default": null,
|
|
32662
|
+
"description": "The zoom level selected on first render. When set it seeds the initial toolbar selection (and the level the timeline mounts at), overriding ViewMode's default — handy for uncontrolled usage, e.g. ZoomLevels=\"…\" DefaultZoom=\"GanttViewMode.Week\". After mount, ViewMode / @bind-ViewMode govern as before. Null falls back to ViewMode (the existing behaviour).",
|
|
32663
|
+
"isCascading": false,
|
|
32664
|
+
"captureUnmatched": false,
|
|
32665
|
+
"isEditorRequired": false
|
|
32666
|
+
},
|
|
32574
32667
|
{
|
|
32575
32668
|
"name": "OnTaskClick",
|
|
32576
32669
|
"type": "EventCallback<GanttTask>",
|
|
@@ -33816,10 +33909,11 @@
|
|
|
33816
33909
|
"name": "Icon",
|
|
33817
33910
|
"category": "Utility",
|
|
33818
33911
|
"subcategory": null,
|
|
33819
|
-
"description": "Icon wrapper — renders Lucide
|
|
33912
|
+
"description": "Icon wrapper — renders the built-in LumeoIcons set (Lucide-derived) or any IconSource natively.",
|
|
33820
33913
|
"nugetPackage": "Lumeo",
|
|
33821
33914
|
"files": [
|
|
33822
|
-
"UI/Icon/Icon.razor"
|
|
33915
|
+
"UI/Icon/Icon.razor",
|
|
33916
|
+
"UI/Icon/SvgGlyph.razor"
|
|
33823
33917
|
],
|
|
33824
33918
|
"namespace": "Lumeo",
|
|
33825
33919
|
"inheritsFrom": null,
|
|
@@ -33829,16 +33923,16 @@
|
|
|
33829
33923
|
"name": "Name",
|
|
33830
33924
|
"type": "string?",
|
|
33831
33925
|
"default": null,
|
|
33832
|
-
"description": "Lucide icon name (PascalCase, e.g. \"Search\", \"ChevronDown\", \"TrendingUp\"). Unknown names fall back to a Circle. Use Svg to supply any icon directly (
|
|
33926
|
+
"description": "Lucide icon name (PascalCase, e.g. \"Search\", \"ChevronDown\", \"TrendingUp\"). Unknown names fall back to a Circle. Use Svg to supply any icon directly (any IconSource, e.g. from a Lumeo icon pack).",
|
|
33833
33927
|
"isCascading": false,
|
|
33834
33928
|
"captureUnmatched": false,
|
|
33835
33929
|
"isEditorRequired": false
|
|
33836
33930
|
},
|
|
33837
33931
|
{
|
|
33838
33932
|
"name": "Svg",
|
|
33839
|
-
"type": "
|
|
33933
|
+
"type": "IconSource?",
|
|
33840
33934
|
"default": null,
|
|
33841
|
-
"description": "Direct
|
|
33935
|
+
"description": "Direct IconSource reference — takes precedence over Name. Lets consumers supply any vendored icon (e.g. LumeoIcons.Search or an icon-pack member).",
|
|
33842
33936
|
"isCascading": false,
|
|
33843
33937
|
"captureUnmatched": false,
|
|
33844
33938
|
"isEditorRequired": false
|
|
@@ -33852,6 +33946,15 @@
|
|
|
33852
33946
|
"captureUnmatched": false,
|
|
33853
33947
|
"isEditorRequired": false
|
|
33854
33948
|
},
|
|
33949
|
+
{
|
|
33950
|
+
"name": "StrokeWidth",
|
|
33951
|
+
"type": "double?",
|
|
33952
|
+
"default": null,
|
|
33953
|
+
"description": "Overrides the IconSource's stroke width on the rendered svg. Only affects Stroke-style icons (Lucide, Tabler); ignored for Fill sets (Phosphor, Material, Bootstrap) where stroke is not used. When null (default) the icon source's own StrokeWidth is used.",
|
|
33954
|
+
"isCascading": false,
|
|
33955
|
+
"captureUnmatched": false,
|
|
33956
|
+
"isEditorRequired": false
|
|
33957
|
+
},
|
|
33855
33958
|
{
|
|
33856
33959
|
"name": "Title",
|
|
33857
33960
|
"type": "string?",
|
|
@@ -33888,7 +33991,50 @@
|
|
|
33888
33991
|
"--color-foreground"
|
|
33889
33992
|
],
|
|
33890
33993
|
"examples": [],
|
|
33891
|
-
"subComponents": {
|
|
33994
|
+
"subComponents": {
|
|
33995
|
+
"SvgGlyph": {
|
|
33996
|
+
"componentName": "SvgGlyph",
|
|
33997
|
+
"fileName": "SvgGlyph.razor",
|
|
33998
|
+
"namespace": "Lumeo",
|
|
33999
|
+
"inheritsFrom": null,
|
|
34000
|
+
"implements": [],
|
|
34001
|
+
"parameters": [
|
|
34002
|
+
{
|
|
34003
|
+
"name": "Svg",
|
|
34004
|
+
"type": "IconSource",
|
|
34005
|
+
"default": "default!",
|
|
34006
|
+
"description": "The icon to render. Its Content becomes the inner markup and its ViewBox/RenderStyle/ StrokeWidth style the root <svg>.",
|
|
34007
|
+
"isCascading": false,
|
|
34008
|
+
"captureUnmatched": false,
|
|
34009
|
+
"isEditorRequired": true
|
|
34010
|
+
},
|
|
34011
|
+
{
|
|
34012
|
+
"name": "StrokeWidth",
|
|
34013
|
+
"type": "double?",
|
|
34014
|
+
"default": null,
|
|
34015
|
+
"description": "Optional root stroke-width override for Stroke icons. When null (default) the icon's own StrokeWidth is used; ignored for Fill icons.",
|
|
34016
|
+
"isCascading": false,
|
|
34017
|
+
"captureUnmatched": false,
|
|
34018
|
+
"isEditorRequired": false
|
|
34019
|
+
},
|
|
34020
|
+
{
|
|
34021
|
+
"name": "AdditionalAttributes",
|
|
34022
|
+
"type": "Dictionary<string, object>?",
|
|
34023
|
+
"default": null,
|
|
34024
|
+
"description": "Arbitrary attributes (class, aria-*, role, title, …) splatted onto the root <svg>. Sizing is done here via classes (e.g. h-4 w-4), exactly like the icon component it replaces. A consumer-supplied attribute that collides with one this component sets (e.g. fill) wins, because the splat is applied last.",
|
|
34025
|
+
"isCascading": false,
|
|
34026
|
+
"captureUnmatched": true,
|
|
34027
|
+
"isEditorRequired": false
|
|
34028
|
+
}
|
|
34029
|
+
],
|
|
34030
|
+
"events": [],
|
|
34031
|
+
"enums": [],
|
|
34032
|
+
"records": [],
|
|
34033
|
+
"gotchas": [],
|
|
34034
|
+
"parseFailed": false,
|
|
34035
|
+
"parseError": null
|
|
34036
|
+
}
|
|
34037
|
+
},
|
|
33892
34038
|
"a11y": {
|
|
33893
34039
|
"roles": [
|
|
33894
34040
|
"img"
|
|
@@ -35738,7 +35884,7 @@
|
|
|
35738
35884
|
},
|
|
35739
35885
|
{
|
|
35740
35886
|
"title": "With Icon and Sparkline",
|
|
35741
|
-
"code": "<KpiCard Label=\"Page Views\" Value=\"94,210\" Delta=\"5.7\">\n <IconContent>\n <
|
|
35887
|
+
"code": "<KpiCard Label=\"Page Views\" Value=\"94,210\" Delta=\"5.7\">\n <IconContent>\n <SvgGlyph Svg=\"@(Lucide.TrendingUp)\" class=\"h-4 w-4\" />\n </IconContent>\n <SparkContent>\n <Sparkline Data=\"@_viewData\" Class=\"h-10 w-full\" />\n </SparkContent>\n</KpiCard>"
|
|
35742
35888
|
}
|
|
35743
35889
|
],
|
|
35744
35890
|
"subComponents": {},
|
|
@@ -37713,7 +37859,7 @@
|
|
|
37713
37859
|
},
|
|
37714
37860
|
{
|
|
37715
37861
|
"title": "Icons and Disabled Item",
|
|
37716
|
-
"code": "<MegaMenu>\n <MegaMenuItem Label=\"Products\" Icon=\"
|
|
37862
|
+
"code": "<MegaMenu>\n <MegaMenuItem Label=\"Products\" Icon=\"LumeoIcons.Box\">\n <MegaMenuPanel Columns=\"2\">\n <MegaMenuGroup Title=\"Design\">\n <MegaMenuLink Href=\"#\" Icon=\"LumeoIcons.Component\" Title=\"Components\" Description=\"Pre-built UI components\" />\n <MegaMenuLink Href=\"#\" Icon=\"LumeoIcons.LayoutTemplate\" Title=\"Templates\" Description=\"Starter page templates\" />\n </MegaMenuGroup>\n <MegaMenuGroup Title=\"Development\">\n <MegaMenuLink Href=\"#\" Icon=\"LumeoIcons.Terminal\" Title=\"CLI\" Description=\"Command-line tooling\" />\n <MegaMenuLink Href=\"#\" Icon=\"LumeoIcons.BookOpen\" Title=\"API Reference\" Description=\"Complete API docs\" Disabled=\"true\" />\n </MegaMenuGroup>\n </MegaMenuPanel>\n </MegaMenuItem>\n <MegaMenuItem Label=\"Docs\" Icon=\"LumeoIcons.FileText\" Href=\"#\" />\n <MegaMenuItem Label=\"Archived\" Disabled=\"true\" />\n</MegaMenu>"
|
|
37717
37863
|
},
|
|
37718
37864
|
{
|
|
37719
37865
|
"title": "Orientation — interactive",
|
|
@@ -37801,9 +37947,9 @@
|
|
|
37801
37947
|
},
|
|
37802
37948
|
{
|
|
37803
37949
|
"name": "Icon",
|
|
37804
|
-
"type": "
|
|
37950
|
+
"type": "IconSource?",
|
|
37805
37951
|
"default": null,
|
|
37806
|
-
"description":
|
|
37952
|
+
"description": "Optional leading icon. Supply an IconSource from a Lumeo.Icons pack (e.g. Lucide.Home) or from LumeoIcons.",
|
|
37807
37953
|
"isCascading": false,
|
|
37808
37954
|
"captureUnmatched": false,
|
|
37809
37955
|
"isEditorRequired": false
|
|
@@ -37903,9 +38049,9 @@
|
|
|
37903
38049
|
},
|
|
37904
38050
|
{
|
|
37905
38051
|
"name": "Icon",
|
|
37906
|
-
"type": "
|
|
38052
|
+
"type": "IconSource?",
|
|
37907
38053
|
"default": null,
|
|
37908
|
-
"description":
|
|
38054
|
+
"description": "Optional leading icon. Supply an IconSource from a Lumeo.Icons pack (e.g. Lucide.Home) or from LumeoIcons.",
|
|
37909
38055
|
"isCascading": false,
|
|
37910
38056
|
"captureUnmatched": false,
|
|
37911
38057
|
"isEditorRequired": false
|
|
@@ -41941,9 +42087,9 @@
|
|
|
41941
42087
|
},
|
|
41942
42088
|
{
|
|
41943
42089
|
"name": "Icon",
|
|
41944
|
-
"type": "
|
|
42090
|
+
"type": "Lumeo.IconSource?",
|
|
41945
42091
|
"default": null,
|
|
41946
|
-
"description":
|
|
42092
|
+
"description": "Optional leading icon shown beside the title. Supply an IconSource from a Lumeo.Icons pack (e.g. Lucide.TriangleAlert) or from LumeoIcons.",
|
|
41947
42093
|
"isCascading": false,
|
|
41948
42094
|
"captureUnmatched": false,
|
|
41949
42095
|
"isEditorRequired": false
|
|
@@ -42207,6 +42353,15 @@
|
|
|
42207
42353
|
"captureUnmatched": false,
|
|
42208
42354
|
"isEditorRequired": false
|
|
42209
42355
|
},
|
|
42356
|
+
{
|
|
42357
|
+
"name": "FocusOnOpen",
|
|
42358
|
+
"type": "bool",
|
|
42359
|
+
"default": "true",
|
|
42360
|
+
"description": "When true (default), focus moves into the popover surface on open so its @onkeydown handler receives Escape and keyboard users land inside the dialog (the Radix onOpenAutoFocus default). Set to false when the trigger is a typeable control that must KEEP focus while the popover opens (e.g. DatePicker's keyboard-input trigger) — the surface still positions, registers click-outside and saves/restores focus, it just doesn't steal focus from the trigger on open.",
|
|
42361
|
+
"isCascading": false,
|
|
42362
|
+
"captureUnmatched": false,
|
|
42363
|
+
"isEditorRequired": false
|
|
42364
|
+
},
|
|
42210
42365
|
{
|
|
42211
42366
|
"name": "Class",
|
|
42212
42367
|
"type": "string?",
|
|
@@ -42958,7 +43113,7 @@
|
|
|
42958
43113
|
},
|
|
42959
43114
|
{
|
|
42960
43115
|
"title": "With Leading and Trailing Content",
|
|
42961
|
-
"code": "<PromptInput @bind-Value=\"_prompt\" OnSend=\"@HandleSend\" Placeholder=\"Message Claude…\">\n <LeadingContent>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Icon\" Class=\"h-7 w-7\">\n <
|
|
43116
|
+
"code": "<PromptInput @bind-Value=\"_prompt\" OnSend=\"@HandleSend\" Placeholder=\"Message Claude…\">\n <LeadingContent>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Icon\" Class=\"h-7 w-7\">\n <SvgGlyph Svg=\"@(Lucide.Paperclip)\" class=\"h-4 w-4\" />\n </Button>\n </LeadingContent>\n <TrailingContent>\n <span class=\"text-xs text-muted-foreground\">Shift+Enter for newline</span>\n </TrailingContent>\n</PromptInput>"
|
|
42962
43117
|
}
|
|
42963
43118
|
],
|
|
42964
43119
|
"subComponents": {},
|
|
@@ -45701,7 +45856,7 @@
|
|
|
45701
45856
|
},
|
|
45702
45857
|
{
|
|
45703
45858
|
"title": "Sticky bottom tab bar (realistic example)",
|
|
45704
|
-
"code": "<div class=\"relative h-64 border border-border/40 rounded-md overflow-hidden bg-background\">\n <div class=\"p-4 space-y-2 overflow-y-auto h-full pb-16\">\n <!-- scrollable content -->\n </div>\n <SafeArea Bottom=\"true\" Top=\"false\"\n Class=\"absolute bottom-0 left-0 right-0 bg-card border-t border-border/40\">\n <Flex Justify=\"around\" Class=\"py-3\">\n <Button Variant=\"Button.ButtonVariant.Ghost\">\n <
|
|
45859
|
+
"code": "<div class=\"relative h-64 border border-border/40 rounded-md overflow-hidden bg-background\">\n <div class=\"p-4 space-y-2 overflow-y-auto h-full pb-16\">\n <!-- scrollable content -->\n </div>\n <SafeArea Bottom=\"true\" Top=\"false\"\n Class=\"absolute bottom-0 left-0 right-0 bg-card border-t border-border/40\">\n <Flex Justify=\"around\" Class=\"py-3\">\n <Button Variant=\"Button.ButtonVariant.Ghost\">\n <SvgGlyph Svg=\"@(Lucide.Bell)\" class=\"h-5 w-5\" />\n </Button>\n <Button Variant=\"Button.ButtonVariant.Ghost\">\n <SvgGlyph Svg=\"@(Lucide.Search)\" class=\"h-5 w-5\" />\n </Button>\n <Button Variant=\"Button.ButtonVariant.Ghost\">\n <SvgGlyph Svg=\"@(Lucide.User)\" class=\"h-5 w-5\" />\n </Button>\n </Flex>\n </SafeArea>\n</div>"
|
|
45705
45860
|
}
|
|
45706
45861
|
],
|
|
45707
45862
|
"subComponents": {},
|
|
@@ -48409,11 +48564,11 @@
|
|
|
48409
48564
|
"examples": [
|
|
48410
48565
|
{
|
|
48411
48566
|
"title": "Push (Default)",
|
|
48412
|
-
"code": "<SidebarProvider @bind-IsCollapsed=\"_isCollapsed\">\n <SidebarComponent>\n <SidebarHeader>\n <Lumeo.Text As=\"span\" Size=\"sm\" Weight=\"semibold\">Acme Inc</Lumeo.Text>\n </SidebarHeader>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Platform</SidebarGroupLabel>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton Href=\"#\" IsActive=\"true\">\n <IconContent><
|
|
48567
|
+
"code": "<SidebarProvider @bind-IsCollapsed=\"_isCollapsed\">\n <SidebarComponent>\n <SidebarHeader>\n <Lumeo.Text As=\"span\" Size=\"sm\" Weight=\"semibold\">Acme Inc</Lumeo.Text>\n </SidebarHeader>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Platform</SidebarGroupLabel>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton Href=\"#\" IsActive=\"true\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.House)\" class=\"h-4 w-4\" /></IconContent>\n <LabelContent><span>Dashboard</span></LabelContent>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n </SidebarContent>\n <SidebarFooter>\n <Avatar><AvatarFallback>CN</AvatarFallback></Avatar>\n </SidebarFooter>\n </SidebarComponent>\n <main class=\"flex-1 p-6\">\n <SidebarTrigger />\n </main>\n</SidebarProvider>"
|
|
48413
48568
|
},
|
|
48414
48569
|
{
|
|
48415
48570
|
"title": "Overlay",
|
|
48416
|
-
"code": "<SidebarProvider @bind-IsCollapsed=\"_isCollapsed\" Variant=\"SidebarProvider.SidebarVariant.Overlay\">\n <SidebarComponent>\n <SidebarHeader>\n <Lumeo.Text As=\"span\" Size=\"sm\" Weight=\"semibold\">Workspace</Lumeo.Text>\n </SidebarHeader>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Navigation</SidebarGroupLabel>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton Href=\"#\" IsActive=\"true\">\n <IconContent><
|
|
48571
|
+
"code": "<SidebarProvider @bind-IsCollapsed=\"_isCollapsed\" Variant=\"SidebarProvider.SidebarVariant.Overlay\">\n <SidebarComponent>\n <SidebarHeader>\n <Lumeo.Text As=\"span\" Size=\"sm\" Weight=\"semibold\">Workspace</Lumeo.Text>\n </SidebarHeader>\n <SidebarContent>\n <SidebarGroup>\n <SidebarGroupLabel>Navigation</SidebarGroupLabel>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton Href=\"#\" IsActive=\"true\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.House)\" class=\"h-4 w-4\" /></IconContent>\n <LabelContent><span>Home</span></LabelContent>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n </SidebarContent>\n </SidebarComponent>\n <main class=\"flex-1 p-6\">\n <SidebarTrigger />\n <Lumeo.Text Size=\"sm\" Color=\"muted\">Click backdrop to dismiss.</Lumeo.Text>\n </main>\n</SidebarProvider>"
|
|
48417
48572
|
},
|
|
48418
48573
|
{
|
|
48419
48574
|
"title": "Side — interactive",
|
|
@@ -48421,7 +48576,7 @@
|
|
|
48421
48576
|
},
|
|
48422
48577
|
{
|
|
48423
48578
|
"title": "Icon",
|
|
48424
|
-
"code": "<SidebarProvider @bind-IsCollapsed=\"_isCollapsed\" Variant=\"SidebarProvider.SidebarVariant.Icon\">\n <SidebarComponent>\n <SidebarContent>\n <SidebarGroup>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton Href=\"#\" IsActive=\"true\" Tooltip=\"Home\">\n <IconContent><
|
|
48579
|
+
"code": "<SidebarProvider @bind-IsCollapsed=\"_isCollapsed\" Variant=\"SidebarProvider.SidebarVariant.Icon\">\n <SidebarComponent>\n <SidebarContent>\n <SidebarGroup>\n <SidebarMenu>\n <SidebarMenuItem>\n <SidebarMenuButton Href=\"#\" IsActive=\"true\" Tooltip=\"Home\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.House)\" class=\"h-4 w-4\" /></IconContent>\n <LabelContent><span>Home</span></LabelContent>\n </SidebarMenuButton>\n </SidebarMenuItem>\n </SidebarMenu>\n </SidebarGroup>\n </SidebarContent>\n </SidebarComponent>\n <main class=\"flex-1 p-6\">\n <SidebarTrigger />\n <Lumeo.Text Size=\"sm\" Color=\"muted\">Toggle to expand with labels.</Lumeo.Text>\n </main>\n</SidebarProvider>"
|
|
48425
48580
|
}
|
|
48426
48581
|
],
|
|
48427
48582
|
"subComponents": {
|
|
@@ -53378,7 +53533,8 @@
|
|
|
53378
53533
|
"values": [
|
|
53379
53534
|
"Default",
|
|
53380
53535
|
"Card",
|
|
53381
|
-
"Pill"
|
|
53536
|
+
"Pill",
|
|
53537
|
+
"Underline"
|
|
53382
53538
|
],
|
|
53383
53539
|
"description": null
|
|
53384
53540
|
},
|
|
@@ -53419,7 +53575,7 @@
|
|
|
53419
53575
|
},
|
|
53420
53576
|
{
|
|
53421
53577
|
"title": "Icon reveal",
|
|
53422
|
-
"code": "<Tabs ActiveValue=\"members\" IconReveal Variant=\"Tabs.TabsVariant.Card\">\n <TabsList>\n <TabsTrigger Value=\"members\">\n <IconContent><
|
|
53578
|
+
"code": "<Tabs ActiveValue=\"members\" IconReveal Variant=\"Tabs.TabsVariant.Card\">\n <TabsList>\n <TabsTrigger Value=\"members\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Users)\" class=\"h-4 w-4\" /></IconContent>\n Members\n </TabsTrigger>\n <TabsTrigger Value=\"credentials\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Award)\" class=\"h-4 w-4\" /></IconContent>\n Shared Credentials\n </TabsTrigger>\n @* …more icon tabs… *@\n </TabsList>\n <TabsContent Value=\"members\">Team members and their roles.</TabsContent>\n <TabsContent Value=\"credentials\">Credentials shared with this team.</TabsContent>\n</Tabs>"
|
|
53423
53579
|
},
|
|
53424
53580
|
{
|
|
53425
53581
|
"title": "Notifications",
|
|
@@ -54757,6 +54913,15 @@
|
|
|
54757
54913
|
"captureUnmatched": false,
|
|
54758
54914
|
"isEditorRequired": false
|
|
54759
54915
|
},
|
|
54916
|
+
{
|
|
54917
|
+
"name": "IncludeSystem",
|
|
54918
|
+
"type": "bool",
|
|
54919
|
+
"default": "true",
|
|
54920
|
+
"description": "When true (default) the toggle walks the full three-way mode cycle (System → Dark → Light). Set to false for a binary Light ↔ Dark toggle: every click visibly changes the theme — the System step is skipped (useful in app shells where an \"invisible\" System→Dark click reads as a broken button when the OS is already dark).",
|
|
54921
|
+
"isCascading": false,
|
|
54922
|
+
"captureUnmatched": false,
|
|
54923
|
+
"isEditorRequired": false
|
|
54924
|
+
},
|
|
54760
54925
|
{
|
|
54761
54926
|
"name": "AdditionalAttributes",
|
|
54762
54927
|
"type": "Dictionary<string, object>?",
|
|
@@ -54937,7 +55102,7 @@
|
|
|
54937
55102
|
},
|
|
54938
55103
|
{
|
|
54939
55104
|
"title": "With Icons",
|
|
54940
|
-
"code": "<Timeline>\n <TimelineItem Title=\"Account created\" Time=\"9:00 AM\">\n <IconContent><
|
|
55105
|
+
"code": "<Timeline>\n <TimelineItem Title=\"Account created\" Time=\"9:00 AM\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.UserPlus)\" class=\"h-4 w-4\" /></IconContent>\n </TimelineItem>\n <TimelineItem Title=\"Profile updated\" Time=\"10:30 AM\">\n <IconContent><SvgGlyph Svg=\"@(Lucide.Pencil)\" class=\"h-4 w-4\" /></IconContent>\n </TimelineItem>\n</Timeline>"
|
|
54941
55106
|
},
|
|
54942
55107
|
{
|
|
54943
55108
|
"title": "Alternate Layout",
|
|
@@ -56091,19 +56256,19 @@
|
|
|
56091
56256
|
"examples": [
|
|
56092
56257
|
{
|
|
56093
56258
|
"title": "Default",
|
|
56094
|
-
"code": "<Toggle @bind-Pressed=\"_bold\">\n <
|
|
56259
|
+
"code": "<Toggle @bind-Pressed=\"_bold\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n</Toggle>\n\n@code {\n private bool _bold;\n}"
|
|
56095
56260
|
},
|
|
56096
56261
|
{
|
|
56097
56262
|
"title": "Variants",
|
|
56098
|
-
"code": "<Toggle @bind-Pressed=\"_pressed1\">\n <
|
|
56263
|
+
"code": "<Toggle @bind-Pressed=\"_pressed1\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n</Toggle>\n<Toggle Variant=\"Toggle.ToggleVariant.Outline\" @bind-Pressed=\"_pressed2\">\n <SvgGlyph Svg=\"@(Lucide.Italic)\" class=\"h-4 w-4\" />\n</Toggle>"
|
|
56099
56264
|
},
|
|
56100
56265
|
{
|
|
56101
56266
|
"title": "Sizes",
|
|
56102
|
-
"code": "<Toggle Size=\"Lumeo.Size.Sm\" @bind-Pressed=\"_sm\">\n <
|
|
56267
|
+
"code": "<Toggle Size=\"Lumeo.Size.Sm\" @bind-Pressed=\"_sm\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-3 w-3\" />\n</Toggle>\n<Toggle @bind-Pressed=\"_md\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n</Toggle>\n<Toggle Size=\"Lumeo.Size.Lg\" @bind-Pressed=\"_lg\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-5 w-5\" />\n</Toggle>"
|
|
56103
56268
|
},
|
|
56104
56269
|
{
|
|
56105
56270
|
"title": "With Text",
|
|
56106
|
-
"code": "<Toggle @bind-Pressed=\"_pressed\">\n <
|
|
56271
|
+
"code": "<Toggle @bind-Pressed=\"_pressed\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n Bold\n</Toggle>"
|
|
56107
56272
|
}
|
|
56108
56273
|
],
|
|
56109
56274
|
"subComponents": {},
|
|
@@ -56277,15 +56442,15 @@
|
|
|
56277
56442
|
"examples": [
|
|
56278
56443
|
{
|
|
56279
56444
|
"title": "Single Selection",
|
|
56280
|
-
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Single\">\n <ToggleGroupItem Value=\"bold\">\n <
|
|
56445
|
+
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Single\">\n <ToggleGroupItem Value=\"bold\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n <ToggleGroupItem Value=\"italic\">\n <SvgGlyph Svg=\"@(Lucide.Italic)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n <ToggleGroupItem Value=\"underline\">\n <SvgGlyph Svg=\"@(Lucide.Underline)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n</ToggleGroup>"
|
|
56281
56446
|
},
|
|
56282
56447
|
{
|
|
56283
56448
|
"title": "Multiple Selection",
|
|
56284
|
-
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Multiple\">\n <ToggleGroupItem Value=\"bold\">\n <
|
|
56449
|
+
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Multiple\">\n <ToggleGroupItem Value=\"bold\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n <ToggleGroupItem Value=\"italic\">\n <SvgGlyph Svg=\"@(Lucide.Italic)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n <ToggleGroupItem Value=\"underline\">\n <SvgGlyph Svg=\"@(Lucide.Underline)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n</ToggleGroup>"
|
|
56285
56450
|
},
|
|
56286
56451
|
{
|
|
56287
56452
|
"title": "Outline Variant",
|
|
56288
|
-
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Single\" Variant=\"ToggleGroup.ToggleGroupVariant.Outline\">\n <ToggleGroupItem Value=\"left\">\n <
|
|
56453
|
+
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Single\" Variant=\"ToggleGroup.ToggleGroupVariant.Outline\">\n <ToggleGroupItem Value=\"left\">\n <SvgGlyph Svg=\"@(Lucide.AlignLeft)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n <ToggleGroupItem Value=\"center\">\n <SvgGlyph Svg=\"@(Lucide.AlignCenter)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n <ToggleGroupItem Value=\"right\">\n <SvgGlyph Svg=\"@(Lucide.AlignRight)\" class=\"h-4 w-4\" />\n </ToggleGroupItem>\n</ToggleGroup>"
|
|
56289
56454
|
},
|
|
56290
56455
|
{
|
|
56291
56456
|
"title": "Sizes",
|
|
@@ -56512,7 +56677,7 @@
|
|
|
56512
56677
|
"examples": [
|
|
56513
56678
|
{
|
|
56514
56679
|
"title": "Basic Toolbar",
|
|
56515
|
-
"code": "<Toolbar>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <
|
|
56680
|
+
"code": "<Toolbar>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n </Button>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <SvgGlyph Svg=\"@(Lucide.Italic)\" class=\"h-4 w-4\" />\n </Button>\n <ToolbarSeparator />\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <SvgGlyph Svg=\"@(Lucide.AlignLeft)\" class=\"h-4 w-4\" />\n </Button>\n</Toolbar>"
|
|
56516
56681
|
},
|
|
56517
56682
|
{
|
|
56518
56683
|
"title": "With Spacer and Groups",
|
|
@@ -56892,7 +57057,7 @@
|
|
|
56892
57057
|
},
|
|
56893
57058
|
{
|
|
56894
57059
|
"title": "With Icons",
|
|
56895
|
-
"code": "<Tooltip>\n <TooltipTrigger>\n <Button Variant=\"Button.ButtonVariant.Outline\" Size=\"Button.ButtonSize.Icon\">\n <
|
|
57060
|
+
"code": "<Tooltip>\n <TooltipTrigger>\n <Button Variant=\"Button.ButtonVariant.Outline\" Size=\"Button.ButtonSize.Icon\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n <p>Bold</p>\n </TooltipContent>\n</Tooltip>\n\n<Tooltip>\n <TooltipTrigger>\n <Button Variant=\"Button.ButtonVariant.Outline\" Size=\"Button.ButtonSize.Icon\">\n <SvgGlyph Svg=\"@(Lucide.Italic)\" class=\"h-4 w-4\" />\n </Button>\n </TooltipTrigger>\n <TooltipContent>\n <p>Italic</p>\n </TooltipContent>\n</Tooltip>"
|
|
56896
57061
|
},
|
|
56897
57062
|
{
|
|
56898
57063
|
"title": "Placement",
|
|
@@ -58391,7 +58556,7 @@
|
|
|
58391
58556
|
"name": "Icon",
|
|
58392
58557
|
"type": "RenderFragment?",
|
|
58393
58558
|
"default": null,
|
|
58394
|
-
"description": "Custom leading icon. Defaults to
|
|
58559
|
+
"description": "Custom leading icon. Defaults to LumeoIcons.Upload.",
|
|
58395
58560
|
"isCascading": false,
|
|
58396
58561
|
"captureUnmatched": false,
|
|
58397
58562
|
"isEditorRequired": false
|
|
@@ -58454,7 +58619,7 @@
|
|
|
58454
58619
|
},
|
|
58455
58620
|
{
|
|
58456
58621
|
"title": "Custom Label and Icon",
|
|
58457
|
-
"code": "<UploadTrigger Variant=\"Button.ButtonVariant.Outline\" OnFilesSelected=\"@HandleFiles\">\n <Icon>\n <
|
|
58622
|
+
"code": "<UploadTrigger Variant=\"Button.ButtonVariant.Outline\" OnFilesSelected=\"@HandleFiles\">\n <Icon>\n <SvgGlyph Svg=\"@(Lucide.Image)\" class=\"h-4 w-4\" />\n </Icon>\n <ChildContent>\n <span>Replace photo</span>\n </ChildContent>\n</UploadTrigger>\n\n<UploadTrigger Size=\"Button.ButtonSize.Icon\" Variant=\"Button.ButtonVariant.Ghost\" OnFilesSelected=\"@HandleFiles\" aria-label=\"Attach file\">\n <Icon>\n <SvgGlyph Svg=\"@(Lucide.Paperclip)\" class=\"h-4 w-4\" />\n </Icon>\n @* Empty ChildContent suppresses the default text label *@\n <ChildContent></ChildContent>\n</UploadTrigger>"
|
|
58458
58623
|
}
|
|
58459
58624
|
],
|
|
58460
58625
|
"subComponents": {},
|