@lumeo-ui/mcp-server 4.1.0-preview.4 → 4.1.0-preview.6
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 +201 -68
- package/src/registry.json +96 -237
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.6",
|
|
4
|
+
"generated": "2026-07-04T07:18:46.3317266Z",
|
|
5
5
|
"stats": {
|
|
6
6
|
"componentCount": 164,
|
|
7
|
-
"totalParameters":
|
|
7
|
+
"totalParameters": 4178,
|
|
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": {},
|
|
@@ -6468,7 +6468,7 @@
|
|
|
6468
6468
|
},
|
|
6469
6469
|
{
|
|
6470
6470
|
"title": "Fallback Initials",
|
|
6471
|
-
"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>"
|
|
6472
6472
|
},
|
|
6473
6473
|
{
|
|
6474
6474
|
"title": "Sizes",
|
|
@@ -6780,7 +6780,7 @@
|
|
|
6780
6780
|
},
|
|
6781
6781
|
{
|
|
6782
6782
|
"title": "Custom Content",
|
|
6783
|
-
"code": "<BackToTop>\n <
|
|
6783
|
+
"code": "<BackToTop>\n <SvgGlyph Svg=\"@(Lucide.ChevronUp)\" class=\"h-5 w-5\" />\n</BackToTop>"
|
|
6784
6784
|
},
|
|
6785
6785
|
{
|
|
6786
6786
|
"title": "Interactive: Visibility Threshold",
|
|
@@ -8014,11 +8014,11 @@
|
|
|
8014
8014
|
},
|
|
8015
8015
|
{
|
|
8016
8016
|
"title": "With Icons",
|
|
8017
|
-
"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>"
|
|
8018
8018
|
},
|
|
8019
8019
|
{
|
|
8020
8020
|
"title": "Custom Separator",
|
|
8021
|
-
"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>"
|
|
8022
8022
|
}
|
|
8023
8023
|
],
|
|
8024
8024
|
"subComponents": {
|
|
@@ -8562,11 +8562,11 @@
|
|
|
8562
8562
|
},
|
|
8563
8563
|
{
|
|
8564
8564
|
"title": "Sizes",
|
|
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 <
|
|
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>"
|
|
8566
8566
|
},
|
|
8567
8567
|
{
|
|
8568
8568
|
"title": "With Icon",
|
|
8569
|
-
"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>"
|
|
8570
8570
|
},
|
|
8571
8571
|
{
|
|
8572
8572
|
"title": "Disabled",
|
|
@@ -8655,7 +8655,7 @@
|
|
|
8655
8655
|
"examples": [
|
|
8656
8656
|
{
|
|
8657
8657
|
"title": "Horizontal (default)",
|
|
8658
|
-
"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>"
|
|
8659
8659
|
},
|
|
8660
8660
|
{
|
|
8661
8661
|
"title": "Vertical",
|
|
@@ -9132,11 +9132,11 @@
|
|
|
9132
9132
|
},
|
|
9133
9133
|
{
|
|
9134
9134
|
"title": "Card with Actions",
|
|
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 <
|
|
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>"
|
|
9136
9136
|
},
|
|
9137
9137
|
{
|
|
9138
9138
|
"title": "Horizontal Card",
|
|
9139
|
-
"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>"
|
|
9140
9140
|
},
|
|
9141
9141
|
{
|
|
9142
9142
|
"title": "With Form",
|
|
@@ -10513,7 +10513,25 @@
|
|
|
10513
10513
|
"name": "Gradient",
|
|
10514
10514
|
"type": "bool",
|
|
10515
10515
|
"default": "true",
|
|
10516
|
-
"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.",
|
|
10517
10535
|
"isCascading": false,
|
|
10518
10536
|
"captureUnmatched": false,
|
|
10519
10537
|
"isEditorRequired": false
|
|
@@ -19840,7 +19858,7 @@
|
|
|
19840
19858
|
"examples": [
|
|
19841
19859
|
{
|
|
19842
19860
|
"title": "Default",
|
|
19843
|
-
"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 <
|
|
19861
|
+
"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>"
|
|
19844
19862
|
},
|
|
19845
19863
|
{
|
|
19846
19864
|
"title": "Initially Open",
|
|
@@ -19848,7 +19866,7 @@
|
|
|
19848
19866
|
},
|
|
19849
19867
|
{
|
|
19850
19868
|
"title": "Sidebar Section",
|
|
19851
|
-
"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 <
|
|
19869
|
+
"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>"
|
|
19852
19870
|
}
|
|
19853
19871
|
],
|
|
19854
19872
|
"subComponents": {
|
|
@@ -21249,7 +21267,7 @@
|
|
|
21249
21267
|
"examples": [
|
|
21250
21268
|
{
|
|
21251
21269
|
"title": "Default",
|
|
21252
|
-
"code": "<Command>\n <CommandInput Placeholder=\"Type a command or search...\" />\n <CommandList>\n <CommandGroup Heading=\"Suggestions\">\n <CommandItem>\n <
|
|
21270
|
+
"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>"
|
|
21253
21271
|
},
|
|
21254
21272
|
{
|
|
21255
21273
|
"title": "Compact",
|
|
@@ -21257,7 +21275,7 @@
|
|
|
21257
21275
|
},
|
|
21258
21276
|
{
|
|
21259
21277
|
"title": "Navigation",
|
|
21260
|
-
"code": "<Command>\n <CommandInput Placeholder=\"Go to...\" />\n <CommandList>\n <CommandGroup Heading=\"Pages\">\n <CommandItem>\n <
|
|
21278
|
+
"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>"
|
|
21261
21279
|
},
|
|
21262
21280
|
{
|
|
21263
21281
|
"title": "Disabled Items",
|
|
@@ -21403,6 +21421,15 @@
|
|
|
21403
21421
|
"captureUnmatched": false,
|
|
21404
21422
|
"isEditorRequired": false
|
|
21405
21423
|
},
|
|
21424
|
+
{
|
|
21425
|
+
"name": "AutoFocus",
|
|
21426
|
+
"type": "bool",
|
|
21427
|
+
"default": null,
|
|
21428
|
+
"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).",
|
|
21429
|
+
"isCascading": false,
|
|
21430
|
+
"captureUnmatched": false,
|
|
21431
|
+
"isEditorRequired": false
|
|
21432
|
+
},
|
|
21406
21433
|
{
|
|
21407
21434
|
"name": "Class",
|
|
21408
21435
|
"type": "string?",
|
|
@@ -21641,7 +21668,7 @@
|
|
|
21641
21668
|
"Home"
|
|
21642
21669
|
],
|
|
21643
21670
|
"keyboardInteractive": true,
|
|
21644
|
-
"focusManaged":
|
|
21671
|
+
"focusManaged": true
|
|
21645
21672
|
},
|
|
21646
21673
|
"parseFailed": false,
|
|
21647
21674
|
"parseError": null
|
|
@@ -23300,7 +23327,7 @@
|
|
|
23300
23327
|
"name": "Compact",
|
|
23301
23328
|
"type": "bool",
|
|
23302
23329
|
"default": null,
|
|
23303
|
-
"description":
|
|
23330
|
+
"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.",
|
|
23304
23331
|
"isCascading": false,
|
|
23305
23332
|
"captureUnmatched": false,
|
|
23306
23333
|
"isEditorRequired": false
|
|
@@ -23426,7 +23453,7 @@
|
|
|
23426
23453
|
"name": "VirtualItemSize",
|
|
23427
23454
|
"type": "float",
|
|
23428
23455
|
"default": "41f",
|
|
23429
|
-
"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.",
|
|
23456
|
+
"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.",
|
|
23430
23457
|
"isCascading": false,
|
|
23431
23458
|
"captureUnmatched": false,
|
|
23432
23459
|
"isEditorRequired": false
|
|
@@ -24553,6 +24580,24 @@
|
|
|
24553
24580
|
"captureUnmatched": false,
|
|
24554
24581
|
"isEditorRequired": false
|
|
24555
24582
|
},
|
|
24583
|
+
{
|
|
24584
|
+
"name": "Visible",
|
|
24585
|
+
"type": "bool",
|
|
24586
|
+
"default": "true",
|
|
24587
|
+
"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.",
|
|
24588
|
+
"isCascading": false,
|
|
24589
|
+
"captureUnmatched": false,
|
|
24590
|
+
"isEditorRequired": false
|
|
24591
|
+
},
|
|
24592
|
+
{
|
|
24593
|
+
"name": "VisibleChanged",
|
|
24594
|
+
"type": "EventCallback<bool>",
|
|
24595
|
+
"default": null,
|
|
24596
|
+
"description": "Fires when the column's visibility changes through the built-in UI — the callback half of Visible's two-way binding.",
|
|
24597
|
+
"isCascading": false,
|
|
24598
|
+
"captureUnmatched": false,
|
|
24599
|
+
"isEditorRequired": false
|
|
24600
|
+
},
|
|
24556
24601
|
{
|
|
24557
24602
|
"name": "AdditionalAttributes",
|
|
24558
24603
|
"type": "Dictionary<string, object>?",
|
|
@@ -24563,7 +24608,13 @@
|
|
|
24563
24608
|
"isEditorRequired": false
|
|
24564
24609
|
}
|
|
24565
24610
|
],
|
|
24566
|
-
"events": [
|
|
24611
|
+
"events": [
|
|
24612
|
+
{
|
|
24613
|
+
"name": "VisibleChanged",
|
|
24614
|
+
"type": "EventCallback<bool>",
|
|
24615
|
+
"description": "Fires when the column's visibility changes through the built-in UI — the callback half of Visible's two-way binding."
|
|
24616
|
+
}
|
|
24617
|
+
],
|
|
24567
24618
|
"enums": [],
|
|
24568
24619
|
"records": [],
|
|
24569
24620
|
"gotchas": [],
|
|
@@ -26024,6 +26075,7 @@
|
|
|
26024
26075
|
},
|
|
26025
26076
|
"a11y": {
|
|
26026
26077
|
"roles": [
|
|
26078
|
+
"checkbox",
|
|
26027
26079
|
"columnheader",
|
|
26028
26080
|
"dialog",
|
|
26029
26081
|
"gridcell",
|
|
@@ -26031,6 +26083,7 @@
|
|
|
26031
26083
|
"status"
|
|
26032
26084
|
],
|
|
26033
26085
|
"ariaAttributes": [
|
|
26086
|
+
"aria-checked",
|
|
26034
26087
|
"aria-colcount",
|
|
26035
26088
|
"aria-colindex",
|
|
26036
26089
|
"aria-expanded",
|
|
@@ -28129,7 +28182,7 @@
|
|
|
28129
28182
|
},
|
|
28130
28183
|
{
|
|
28131
28184
|
"title": "Confirmation Dialog",
|
|
28132
|
-
"code": "<Dialog @bind-Open=\"_isOpen\">\n <DialogTrigger>\n <Button Variant=\"Button.ButtonVariant.Destructive\">\n <
|
|
28185
|
+
"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}"
|
|
28133
28186
|
},
|
|
28134
28187
|
{
|
|
28135
28188
|
"title": "Prevent Close",
|
|
@@ -28653,7 +28706,7 @@
|
|
|
28653
28706
|
"examples": [
|
|
28654
28707
|
{
|
|
28655
28708
|
"title": "LTR vs RTL",
|
|
28656
|
-
"code": "@* Same markup, two directions. *@\n<DirectionProvider Direction=\"LayoutDirection.Rtl\">\n <Flex Align=\"center\" Gap=\"3\">\n <
|
|
28709
|
+
"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}"
|
|
28657
28710
|
},
|
|
28658
28711
|
{
|
|
28659
28712
|
"title": "Wrapping the whole app",
|
|
@@ -28751,11 +28804,11 @@
|
|
|
28751
28804
|
"examples": [
|
|
28752
28805
|
{
|
|
28753
28806
|
"title": "Basic Dock",
|
|
28754
|
-
"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 <
|
|
28807
|
+
"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>"
|
|
28755
28808
|
},
|
|
28756
28809
|
{
|
|
28757
28810
|
"title": "Custom Scale & Radius",
|
|
28758
|
-
"code": "<Dock MaxScale=\"2.2\" MagnifyRadius=\"120\">\n <!-- dock items with
|
|
28811
|
+
"code": "<Dock MaxScale=\"2.2\" MagnifyRadius=\"120\">\n <!-- dock items with SvgGlyph icons -->\n</Dock>"
|
|
28759
28812
|
}
|
|
28760
28813
|
],
|
|
28761
28814
|
"subComponents": {},
|
|
@@ -28887,7 +28940,7 @@
|
|
|
28887
28940
|
},
|
|
28888
28941
|
{
|
|
28889
28942
|
"title": "Filters Drawer",
|
|
28890
|
-
"code": "<Drawer @bind-Open=\"_isFiltersOpen\">\n <DrawerTrigger>\n <Button Variant=\"Button.ButtonVariant.Outline\">\n <
|
|
28943
|
+
"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>"
|
|
28891
28944
|
},
|
|
28892
28945
|
{
|
|
28893
28946
|
"title": "Prevent Close",
|
|
@@ -30620,7 +30673,7 @@
|
|
|
30620
30673
|
"examples": [
|
|
30621
30674
|
{
|
|
30622
30675
|
"title": "Basic Feature Grid",
|
|
30623
|
-
"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><
|
|
30676
|
+
"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>"
|
|
30624
30677
|
},
|
|
30625
30678
|
{
|
|
30626
30679
|
"title": "Two Columns",
|
|
@@ -30628,7 +30681,7 @@
|
|
|
30628
30681
|
},
|
|
30629
30682
|
{
|
|
30630
30683
|
"title": "Standalone Feature Item",
|
|
30631
|
-
"code": "<FeatureItem Title=\"Fast by default\" Description=\"A small CSS bundle keeps your app lean.\">\n <IconContent><
|
|
30684
|
+
"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>"
|
|
30632
30685
|
}
|
|
30633
30686
|
],
|
|
30634
30687
|
"subComponents": {},
|
|
@@ -30726,7 +30779,7 @@
|
|
|
30726
30779
|
"examples": [
|
|
30727
30780
|
{
|
|
30728
30781
|
"title": "Basic",
|
|
30729
|
-
"code": "<FeatureItem Title=\"Fast by default\" Description=\"A small CSS bundle keeps your app lean.\">\n <IconContent><
|
|
30782
|
+
"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>"
|
|
30730
30783
|
},
|
|
30731
30784
|
{
|
|
30732
30785
|
"title": "Without an Icon",
|
|
@@ -30734,11 +30787,11 @@
|
|
|
30734
30787
|
},
|
|
30735
30788
|
{
|
|
30736
30789
|
"title": "With Extra Content",
|
|
30737
|
-
"code": "<FeatureItem Title=\"Accessible\" Description=\"WAI-ARIA roles, keyboard navigation, and focus management built in.\">\n <IconContent><
|
|
30790
|
+
"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>"
|
|
30738
30791
|
},
|
|
30739
30792
|
{
|
|
30740
30793
|
"title": "In a Feature Grid",
|
|
30741
|
-
"code": "<FeatureGrid Columns=\"2\" Title=\"Composes into a grid\">\n <FeatureItem Title=\"Fast\" Description=\"Small CSS bundle, tree-shakeable.\">\n <IconContent><
|
|
30794
|
+
"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>"
|
|
30742
30795
|
}
|
|
30743
30796
|
],
|
|
30744
30797
|
"subComponents": {},
|
|
@@ -32572,6 +32625,24 @@
|
|
|
32572
32625
|
"captureUnmatched": false,
|
|
32573
32626
|
"isEditorRequired": false
|
|
32574
32627
|
},
|
|
32628
|
+
{
|
|
32629
|
+
"name": "ZoomLevels",
|
|
32630
|
+
"type": "IReadOnlyList<GanttViewMode>?",
|
|
32631
|
+
"default": null,
|
|
32632
|
+
"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 }\".",
|
|
32633
|
+
"isCascading": false,
|
|
32634
|
+
"captureUnmatched": false,
|
|
32635
|
+
"isEditorRequired": false
|
|
32636
|
+
},
|
|
32637
|
+
{
|
|
32638
|
+
"name": "DefaultZoom",
|
|
32639
|
+
"type": "GanttViewMode?",
|
|
32640
|
+
"default": null,
|
|
32641
|
+
"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).",
|
|
32642
|
+
"isCascading": false,
|
|
32643
|
+
"captureUnmatched": false,
|
|
32644
|
+
"isEditorRequired": false
|
|
32645
|
+
},
|
|
32575
32646
|
{
|
|
32576
32647
|
"name": "OnTaskClick",
|
|
32577
32648
|
"type": "EventCallback<GanttTask>",
|
|
@@ -33817,10 +33888,11 @@
|
|
|
33817
33888
|
"name": "Icon",
|
|
33818
33889
|
"category": "Utility",
|
|
33819
33890
|
"subcategory": null,
|
|
33820
|
-
"description": "Icon wrapper — renders Lucide
|
|
33891
|
+
"description": "Icon wrapper — renders the built-in LumeoIcons set (Lucide-derived) or any IconSource natively.",
|
|
33821
33892
|
"nugetPackage": "Lumeo",
|
|
33822
33893
|
"files": [
|
|
33823
|
-
"UI/Icon/Icon.razor"
|
|
33894
|
+
"UI/Icon/Icon.razor",
|
|
33895
|
+
"UI/Icon/SvgGlyph.razor"
|
|
33824
33896
|
],
|
|
33825
33897
|
"namespace": "Lumeo",
|
|
33826
33898
|
"inheritsFrom": null,
|
|
@@ -33830,16 +33902,16 @@
|
|
|
33830
33902
|
"name": "Name",
|
|
33831
33903
|
"type": "string?",
|
|
33832
33904
|
"default": null,
|
|
33833
|
-
"description": "Lucide icon name (PascalCase, e.g. \"Search\", \"ChevronDown\", \"TrendingUp\"). Unknown names fall back to a Circle. Use Svg to supply any icon directly (
|
|
33905
|
+
"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).",
|
|
33834
33906
|
"isCascading": false,
|
|
33835
33907
|
"captureUnmatched": false,
|
|
33836
33908
|
"isEditorRequired": false
|
|
33837
33909
|
},
|
|
33838
33910
|
{
|
|
33839
33911
|
"name": "Svg",
|
|
33840
|
-
"type": "
|
|
33912
|
+
"type": "IconSource?",
|
|
33841
33913
|
"default": null,
|
|
33842
|
-
"description": "Direct
|
|
33914
|
+
"description": "Direct IconSource reference — takes precedence over Name. Lets consumers supply any vendored icon (e.g. LumeoIcons.Search or an icon-pack member).",
|
|
33843
33915
|
"isCascading": false,
|
|
33844
33916
|
"captureUnmatched": false,
|
|
33845
33917
|
"isEditorRequired": false
|
|
@@ -33853,6 +33925,15 @@
|
|
|
33853
33925
|
"captureUnmatched": false,
|
|
33854
33926
|
"isEditorRequired": false
|
|
33855
33927
|
},
|
|
33928
|
+
{
|
|
33929
|
+
"name": "StrokeWidth",
|
|
33930
|
+
"type": "double?",
|
|
33931
|
+
"default": null,
|
|
33932
|
+
"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.",
|
|
33933
|
+
"isCascading": false,
|
|
33934
|
+
"captureUnmatched": false,
|
|
33935
|
+
"isEditorRequired": false
|
|
33936
|
+
},
|
|
33856
33937
|
{
|
|
33857
33938
|
"name": "Title",
|
|
33858
33939
|
"type": "string?",
|
|
@@ -33889,7 +33970,50 @@
|
|
|
33889
33970
|
"--color-foreground"
|
|
33890
33971
|
],
|
|
33891
33972
|
"examples": [],
|
|
33892
|
-
"subComponents": {
|
|
33973
|
+
"subComponents": {
|
|
33974
|
+
"SvgGlyph": {
|
|
33975
|
+
"componentName": "SvgGlyph",
|
|
33976
|
+
"fileName": "SvgGlyph.razor",
|
|
33977
|
+
"namespace": "Lumeo",
|
|
33978
|
+
"inheritsFrom": null,
|
|
33979
|
+
"implements": [],
|
|
33980
|
+
"parameters": [
|
|
33981
|
+
{
|
|
33982
|
+
"name": "Svg",
|
|
33983
|
+
"type": "IconSource",
|
|
33984
|
+
"default": "default!",
|
|
33985
|
+
"description": "The icon to render. Its Content becomes the inner markup and its ViewBox/RenderStyle/ StrokeWidth style the root <svg>.",
|
|
33986
|
+
"isCascading": false,
|
|
33987
|
+
"captureUnmatched": false,
|
|
33988
|
+
"isEditorRequired": true
|
|
33989
|
+
},
|
|
33990
|
+
{
|
|
33991
|
+
"name": "StrokeWidth",
|
|
33992
|
+
"type": "double?",
|
|
33993
|
+
"default": null,
|
|
33994
|
+
"description": "Optional root stroke-width override for Stroke icons. When null (default) the icon's own StrokeWidth is used; ignored for Fill icons.",
|
|
33995
|
+
"isCascading": false,
|
|
33996
|
+
"captureUnmatched": false,
|
|
33997
|
+
"isEditorRequired": false
|
|
33998
|
+
},
|
|
33999
|
+
{
|
|
34000
|
+
"name": "AdditionalAttributes",
|
|
34001
|
+
"type": "Dictionary<string, object>?",
|
|
34002
|
+
"default": null,
|
|
34003
|
+
"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.",
|
|
34004
|
+
"isCascading": false,
|
|
34005
|
+
"captureUnmatched": true,
|
|
34006
|
+
"isEditorRequired": false
|
|
34007
|
+
}
|
|
34008
|
+
],
|
|
34009
|
+
"events": [],
|
|
34010
|
+
"enums": [],
|
|
34011
|
+
"records": [],
|
|
34012
|
+
"gotchas": [],
|
|
34013
|
+
"parseFailed": false,
|
|
34014
|
+
"parseError": null
|
|
34015
|
+
}
|
|
34016
|
+
},
|
|
33893
34017
|
"a11y": {
|
|
33894
34018
|
"roles": [
|
|
33895
34019
|
"img"
|
|
@@ -35739,7 +35863,7 @@
|
|
|
35739
35863
|
},
|
|
35740
35864
|
{
|
|
35741
35865
|
"title": "With Icon and Sparkline",
|
|
35742
|
-
"code": "<KpiCard Label=\"Page Views\" Value=\"94,210\" Delta=\"5.7\">\n <IconContent>\n <
|
|
35866
|
+
"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>"
|
|
35743
35867
|
}
|
|
35744
35868
|
],
|
|
35745
35869
|
"subComponents": {},
|
|
@@ -37714,7 +37838,7 @@
|
|
|
37714
37838
|
},
|
|
37715
37839
|
{
|
|
37716
37840
|
"title": "Icons and Disabled Item",
|
|
37717
|
-
"code": "<MegaMenu>\n <MegaMenuItem Label=\"Products\" Icon=\"
|
|
37841
|
+
"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>"
|
|
37718
37842
|
},
|
|
37719
37843
|
{
|
|
37720
37844
|
"title": "Orientation — interactive",
|
|
@@ -37802,9 +37926,9 @@
|
|
|
37802
37926
|
},
|
|
37803
37927
|
{
|
|
37804
37928
|
"name": "Icon",
|
|
37805
|
-
"type": "
|
|
37929
|
+
"type": "IconSource?",
|
|
37806
37930
|
"default": null,
|
|
37807
|
-
"description":
|
|
37931
|
+
"description": "Optional leading icon. Supply an IconSource from a Lumeo.Icons pack (e.g. Lucide.Home) or from LumeoIcons.",
|
|
37808
37932
|
"isCascading": false,
|
|
37809
37933
|
"captureUnmatched": false,
|
|
37810
37934
|
"isEditorRequired": false
|
|
@@ -37904,9 +38028,9 @@
|
|
|
37904
38028
|
},
|
|
37905
38029
|
{
|
|
37906
38030
|
"name": "Icon",
|
|
37907
|
-
"type": "
|
|
38031
|
+
"type": "IconSource?",
|
|
37908
38032
|
"default": null,
|
|
37909
|
-
"description":
|
|
38033
|
+
"description": "Optional leading icon. Supply an IconSource from a Lumeo.Icons pack (e.g. Lucide.Home) or from LumeoIcons.",
|
|
37910
38034
|
"isCascading": false,
|
|
37911
38035
|
"captureUnmatched": false,
|
|
37912
38036
|
"isEditorRequired": false
|
|
@@ -41942,9 +42066,9 @@
|
|
|
41942
42066
|
},
|
|
41943
42067
|
{
|
|
41944
42068
|
"name": "Icon",
|
|
41945
|
-
"type": "
|
|
42069
|
+
"type": "Lumeo.IconSource?",
|
|
41946
42070
|
"default": null,
|
|
41947
|
-
"description":
|
|
42071
|
+
"description": "Optional leading icon shown beside the title. Supply an IconSource from a Lumeo.Icons pack (e.g. Lucide.TriangleAlert) or from LumeoIcons.",
|
|
41948
42072
|
"isCascading": false,
|
|
41949
42073
|
"captureUnmatched": false,
|
|
41950
42074
|
"isEditorRequired": false
|
|
@@ -42208,6 +42332,15 @@
|
|
|
42208
42332
|
"captureUnmatched": false,
|
|
42209
42333
|
"isEditorRequired": false
|
|
42210
42334
|
},
|
|
42335
|
+
{
|
|
42336
|
+
"name": "FocusOnOpen",
|
|
42337
|
+
"type": "bool",
|
|
42338
|
+
"default": "true",
|
|
42339
|
+
"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.",
|
|
42340
|
+
"isCascading": false,
|
|
42341
|
+
"captureUnmatched": false,
|
|
42342
|
+
"isEditorRequired": false
|
|
42343
|
+
},
|
|
42211
42344
|
{
|
|
42212
42345
|
"name": "Class",
|
|
42213
42346
|
"type": "string?",
|
|
@@ -42959,7 +43092,7 @@
|
|
|
42959
43092
|
},
|
|
42960
43093
|
{
|
|
42961
43094
|
"title": "With Leading and Trailing Content",
|
|
42962
|
-
"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 <
|
|
43095
|
+
"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>"
|
|
42963
43096
|
}
|
|
42964
43097
|
],
|
|
42965
43098
|
"subComponents": {},
|
|
@@ -45702,7 +45835,7 @@
|
|
|
45702
45835
|
},
|
|
45703
45836
|
{
|
|
45704
45837
|
"title": "Sticky bottom tab bar (realistic example)",
|
|
45705
|
-
"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 <
|
|
45838
|
+
"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>"
|
|
45706
45839
|
}
|
|
45707
45840
|
],
|
|
45708
45841
|
"subComponents": {},
|
|
@@ -48410,11 +48543,11 @@
|
|
|
48410
48543
|
"examples": [
|
|
48411
48544
|
{
|
|
48412
48545
|
"title": "Push (Default)",
|
|
48413
|
-
"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><
|
|
48546
|
+
"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>"
|
|
48414
48547
|
},
|
|
48415
48548
|
{
|
|
48416
48549
|
"title": "Overlay",
|
|
48417
|
-
"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><
|
|
48550
|
+
"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>"
|
|
48418
48551
|
},
|
|
48419
48552
|
{
|
|
48420
48553
|
"title": "Side — interactive",
|
|
@@ -48422,7 +48555,7 @@
|
|
|
48422
48555
|
},
|
|
48423
48556
|
{
|
|
48424
48557
|
"title": "Icon",
|
|
48425
|
-
"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><
|
|
48558
|
+
"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>"
|
|
48426
48559
|
}
|
|
48427
48560
|
],
|
|
48428
48561
|
"subComponents": {
|
|
@@ -53421,7 +53554,7 @@
|
|
|
53421
53554
|
},
|
|
53422
53555
|
{
|
|
53423
53556
|
"title": "Icon reveal",
|
|
53424
|
-
"code": "<Tabs ActiveValue=\"members\" IconReveal Variant=\"Tabs.TabsVariant.Card\">\n <TabsList>\n <TabsTrigger Value=\"members\">\n <IconContent><
|
|
53557
|
+
"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>"
|
|
53425
53558
|
},
|
|
53426
53559
|
{
|
|
53427
53560
|
"title": "Notifications",
|
|
@@ -54939,7 +55072,7 @@
|
|
|
54939
55072
|
},
|
|
54940
55073
|
{
|
|
54941
55074
|
"title": "With Icons",
|
|
54942
|
-
"code": "<Timeline>\n <TimelineItem Title=\"Account created\" Time=\"9:00 AM\">\n <IconContent><
|
|
55075
|
+
"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>"
|
|
54943
55076
|
},
|
|
54944
55077
|
{
|
|
54945
55078
|
"title": "Alternate Layout",
|
|
@@ -56093,19 +56226,19 @@
|
|
|
56093
56226
|
"examples": [
|
|
56094
56227
|
{
|
|
56095
56228
|
"title": "Default",
|
|
56096
|
-
"code": "<Toggle @bind-Pressed=\"_bold\">\n <
|
|
56229
|
+
"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}"
|
|
56097
56230
|
},
|
|
56098
56231
|
{
|
|
56099
56232
|
"title": "Variants",
|
|
56100
|
-
"code": "<Toggle @bind-Pressed=\"_pressed1\">\n <
|
|
56233
|
+
"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>"
|
|
56101
56234
|
},
|
|
56102
56235
|
{
|
|
56103
56236
|
"title": "Sizes",
|
|
56104
|
-
"code": "<Toggle Size=\"Lumeo.Size.Sm\" @bind-Pressed=\"_sm\">\n <
|
|
56237
|
+
"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>"
|
|
56105
56238
|
},
|
|
56106
56239
|
{
|
|
56107
56240
|
"title": "With Text",
|
|
56108
|
-
"code": "<Toggle @bind-Pressed=\"_pressed\">\n <
|
|
56241
|
+
"code": "<Toggle @bind-Pressed=\"_pressed\">\n <SvgGlyph Svg=\"@(Lucide.Bold)\" class=\"h-4 w-4\" />\n Bold\n</Toggle>"
|
|
56109
56242
|
}
|
|
56110
56243
|
],
|
|
56111
56244
|
"subComponents": {},
|
|
@@ -56279,15 +56412,15 @@
|
|
|
56279
56412
|
"examples": [
|
|
56280
56413
|
{
|
|
56281
56414
|
"title": "Single Selection",
|
|
56282
|
-
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Single\">\n <ToggleGroupItem Value=\"bold\">\n <
|
|
56415
|
+
"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>"
|
|
56283
56416
|
},
|
|
56284
56417
|
{
|
|
56285
56418
|
"title": "Multiple Selection",
|
|
56286
|
-
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Multiple\">\n <ToggleGroupItem Value=\"bold\">\n <
|
|
56419
|
+
"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>"
|
|
56287
56420
|
},
|
|
56288
56421
|
{
|
|
56289
56422
|
"title": "Outline Variant",
|
|
56290
|
-
"code": "<ToggleGroup Type=\"ToggleGroup.ToggleGroupType.Single\" Variant=\"ToggleGroup.ToggleGroupVariant.Outline\">\n <ToggleGroupItem Value=\"left\">\n <
|
|
56423
|
+
"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>"
|
|
56291
56424
|
},
|
|
56292
56425
|
{
|
|
56293
56426
|
"title": "Sizes",
|
|
@@ -56514,7 +56647,7 @@
|
|
|
56514
56647
|
"examples": [
|
|
56515
56648
|
{
|
|
56516
56649
|
"title": "Basic Toolbar",
|
|
56517
|
-
"code": "<Toolbar>\n <Button Variant=\"Button.ButtonVariant.Ghost\" Size=\"Button.ButtonSize.Sm\">\n <
|
|
56650
|
+
"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>"
|
|
56518
56651
|
},
|
|
56519
56652
|
{
|
|
56520
56653
|
"title": "With Spacer and Groups",
|
|
@@ -56894,7 +57027,7 @@
|
|
|
56894
57027
|
},
|
|
56895
57028
|
{
|
|
56896
57029
|
"title": "With Icons",
|
|
56897
|
-
"code": "<Tooltip>\n <TooltipTrigger>\n <Button Variant=\"Button.ButtonVariant.Outline\" Size=\"Button.ButtonSize.Icon\">\n <
|
|
57030
|
+
"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>"
|
|
56898
57031
|
},
|
|
56899
57032
|
{
|
|
56900
57033
|
"title": "Placement",
|
|
@@ -58393,7 +58526,7 @@
|
|
|
58393
58526
|
"name": "Icon",
|
|
58394
58527
|
"type": "RenderFragment?",
|
|
58395
58528
|
"default": null,
|
|
58396
|
-
"description": "Custom leading icon. Defaults to
|
|
58529
|
+
"description": "Custom leading icon. Defaults to LumeoIcons.Upload.",
|
|
58397
58530
|
"isCascading": false,
|
|
58398
58531
|
"captureUnmatched": false,
|
|
58399
58532
|
"isEditorRequired": false
|
|
@@ -58456,7 +58589,7 @@
|
|
|
58456
58589
|
},
|
|
58457
58590
|
{
|
|
58458
58591
|
"title": "Custom Label and Icon",
|
|
58459
|
-
"code": "<UploadTrigger Variant=\"Button.ButtonVariant.Outline\" OnFilesSelected=\"@HandleFiles\">\n <Icon>\n <
|
|
58592
|
+
"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>"
|
|
58460
58593
|
}
|
|
58461
58594
|
],
|
|
58462
58595
|
"subComponents": {},
|