@hanzo/ui 8.0.44 → 8.0.45

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.
Files changed (56) hide show
  1. package/dist/backends/gui/aspect-ratio.cjs +14 -1
  2. package/dist/backends/gui/aspect-ratio.d.ts +13 -0
  3. package/dist/backends/gui/aspect-ratio.d.ts.map +1 -1
  4. package/dist/backends/gui/aspect-ratio.js +14 -1
  5. package/dist/backends/gui/aspect-ratio.js.map +1 -1
  6. package/dist/backends/gui/button.cjs +30 -6
  7. package/dist/backends/gui/button.d.ts.map +1 -1
  8. package/dist/backends/gui/button.js +30 -6
  9. package/dist/backends/gui/button.js.map +1 -1
  10. package/dist/backends/gui/card.cjs +42 -3
  11. package/dist/backends/gui/card.d.ts +48 -3
  12. package/dist/backends/gui/card.d.ts.map +1 -1
  13. package/dist/backends/gui/card.js +41 -3
  14. package/dist/backends/gui/card.js.map +1 -1
  15. package/dist/backends/gui/grid.cjs +61 -0
  16. package/dist/backends/gui/grid.d.ts +16 -0
  17. package/dist/backends/gui/grid.d.ts.map +1 -0
  18. package/dist/backends/gui/grid.js +59 -0
  19. package/dist/backends/gui/grid.js.map +1 -0
  20. package/dist/backends/gui/index.cjs +7 -2
  21. package/dist/backends/gui/index.d.ts +3 -1
  22. package/dist/backends/gui/index.d.ts.map +1 -1
  23. package/dist/backends/gui/index.js +3 -1
  24. package/dist/backends/gui/index.js.map +1 -1
  25. package/dist/backends/gui/section.cjs +39 -0
  26. package/dist/backends/gui/section.d.ts +29 -0
  27. package/dist/backends/gui/section.d.ts.map +1 -0
  28. package/dist/backends/gui/section.js +37 -0
  29. package/dist/backends/gui/section.js.map +1 -0
  30. package/dist/gallery.cjs +10 -1
  31. package/dist/gallery.d.ts.map +1 -1
  32. package/dist/gallery.js +11 -2
  33. package/dist/gallery.js.map +1 -1
  34. package/dist/gui-config.cjs +11 -0
  35. package/dist/gui-config.d.ts +182 -0
  36. package/dist/gui-config.d.ts.map +1 -1
  37. package/dist/gui-config.js +11 -0
  38. package/dist/gui-config.js.map +1 -1
  39. package/dist/primitives/CardMedia.cjs +8 -0
  40. package/dist/primitives/CardMedia.d.ts +2 -0
  41. package/dist/primitives/CardMedia.d.ts.map +1 -0
  42. package/dist/primitives/CardMedia.js +5 -0
  43. package/dist/primitives/CardMedia.js.map +1 -0
  44. package/dist/primitives/Grid.cjs +8 -0
  45. package/dist/primitives/Grid.d.ts +2 -0
  46. package/dist/primitives/Grid.d.ts.map +1 -0
  47. package/dist/primitives/Grid.js +5 -0
  48. package/dist/primitives/Grid.js.map +1 -0
  49. package/dist/primitives/Section.cjs +8 -0
  50. package/dist/primitives/Section.d.ts +2 -0
  51. package/dist/primitives/Section.d.ts.map +1 -0
  52. package/dist/primitives/Section.js +5 -0
  53. package/dist/primitives/Section.js.map +1 -0
  54. package/dist/styles/motion.css +27 -0
  55. package/dist/styles.css +58 -3
  56. package/package.json +1 -1
@@ -16,8 +16,8 @@
16
16
  // one room. Re-run after changing the surface:
17
17
  // node scripts/gen-primitives.mjs
18
18
  Object.defineProperty(exports, "__esModule", { value: true });
19
- exports.DropdownMenuSub = exports.DropdownMenuPortal = exports.DropdownMenuGroup = exports.DropdownMenuShortcut = exports.DropdownMenuSeparator = exports.DropdownMenuLabel = exports.DropdownMenuRadioItem = exports.DropdownMenuCheckboxItem = exports.DropdownMenuItem = exports.DropdownMenuContent = exports.DropdownMenuTrigger = exports.DropdownMenu = exports.DialogTrigger = exports.DialogTitle = exports.DialogPortal = exports.DialogOverlay = exports.DialogHeader = exports.DialogFooter = exports.DialogDescription = exports.DialogContent = exports.DialogClose = exports.Dialog = exports.CommandSeparator = exports.CommandShortcut = exports.CommandItem = exports.CommandGroup = exports.CommandEmpty = exports.CommandList = exports.CommandInput = exports.CommandDialog = exports.Command = exports.CollapsibleContent = exports.CollapsibleTrigger = exports.Collapsible = exports.Checkbox = exports.CardContent = exports.CardDescription = exports.CardAction = exports.CardTitle = exports.CardFooter = exports.CardHeader = exports.Card = exports.buttonVariants = exports.Button = exports.badgeVariants = exports.Badge = exports.AvatarFallback = exports.AvatarImage = exports.Avatar = exports.AspectRatio = void 0;
20
- exports.TooltipProvider = exports.TooltipContent = exports.TooltipTrigger = exports.Tooltip = exports.toast = exports.Toaster = exports.Textarea = exports.TabsContent = exports.TabsTrigger = exports.TabsList = exports.Tabs = exports.Switch = exports.Slider = exports.Separator = exports.SelectScrollDownButton = exports.SelectScrollUpButton = exports.SelectSeparator = exports.SelectItem = exports.SelectLabel = exports.SelectContent = exports.SelectTrigger = exports.SelectValue = exports.SelectGroup = exports.Select = exports.ScrollBar = exports.ScrollArea = exports.ResizableHandle = exports.ResizablePanel = exports.ResizablePanelGroup = exports.Progress = exports.PopoverClose = exports.PopoverAnchor = exports.PopoverContent = exports.PopoverTrigger = exports.Popover = exports.Label = exports.Input = exports.Glass = exports.DropdownMenuRadioGroup = exports.DropdownMenuSubTrigger = exports.DropdownMenuSubContent = void 0;
19
+ exports.DropdownMenuPortal = exports.DropdownMenuGroup = exports.DropdownMenuShortcut = exports.DropdownMenuSeparator = exports.DropdownMenuLabel = exports.DropdownMenuRadioItem = exports.DropdownMenuCheckboxItem = exports.DropdownMenuItem = exports.DropdownMenuContent = exports.DropdownMenuTrigger = exports.DropdownMenu = exports.DialogTrigger = exports.DialogTitle = exports.DialogPortal = exports.DialogOverlay = exports.DialogHeader = exports.DialogFooter = exports.DialogDescription = exports.DialogContent = exports.DialogClose = exports.Dialog = exports.CommandSeparator = exports.CommandShortcut = exports.CommandItem = exports.CommandGroup = exports.CommandEmpty = exports.CommandList = exports.CommandInput = exports.CommandDialog = exports.Command = exports.CollapsibleContent = exports.CollapsibleTrigger = exports.Collapsible = exports.Checkbox = exports.CardMedia = exports.CardContent = exports.CardDescription = exports.CardAction = exports.CardTitle = exports.CardFooter = exports.CardHeader = exports.Card = exports.buttonVariants = exports.Button = exports.badgeVariants = exports.Badge = exports.AvatarFallback = exports.AvatarImage = exports.Avatar = exports.AspectRatio = void 0;
20
+ exports.TooltipProvider = exports.TooltipContent = exports.TooltipTrigger = exports.Tooltip = exports.toast = exports.Toaster = exports.Textarea = exports.TabsContent = exports.TabsTrigger = exports.TabsList = exports.Tabs = exports.Switch = exports.Slider = exports.Separator = exports.Section = exports.SelectScrollDownButton = exports.SelectScrollUpButton = exports.SelectSeparator = exports.SelectItem = exports.SelectLabel = exports.SelectContent = exports.SelectTrigger = exports.SelectValue = exports.SelectGroup = exports.Select = exports.ScrollBar = exports.ScrollArea = exports.ResizableHandle = exports.ResizablePanel = exports.ResizablePanelGroup = exports.Progress = exports.PopoverClose = exports.PopoverAnchor = exports.PopoverContent = exports.PopoverTrigger = exports.Popover = exports.Label = exports.Input = exports.Grid = exports.Glass = exports.DropdownMenuRadioGroup = exports.DropdownMenuSubTrigger = exports.DropdownMenuSubContent = exports.DropdownMenuSub = void 0;
21
21
  var aspect_ratio_1 = require("./aspect-ratio.cjs");
22
22
  Object.defineProperty(exports, "AspectRatio", { enumerable: true, get: function () { return aspect_ratio_1.AspectRatio; } });
23
23
  var avatar_1 = require("./avatar.cjs");
@@ -38,6 +38,7 @@ Object.defineProperty(exports, "CardTitle", { enumerable: true, get: function ()
38
38
  Object.defineProperty(exports, "CardAction", { enumerable: true, get: function () { return card_1.CardAction; } });
39
39
  Object.defineProperty(exports, "CardDescription", { enumerable: true, get: function () { return card_1.CardDescription; } });
40
40
  Object.defineProperty(exports, "CardContent", { enumerable: true, get: function () { return card_1.CardContent; } });
41
+ Object.defineProperty(exports, "CardMedia", { enumerable: true, get: function () { return card_1.CardMedia; } });
41
42
  var checkbox_1 = require("./checkbox.cjs");
42
43
  Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return checkbox_1.Checkbox; } });
43
44
  var collapsible_1 = require("./collapsible.cjs");
@@ -83,6 +84,8 @@ Object.defineProperty(exports, "DropdownMenuSubTrigger", { enumerable: true, get
83
84
  Object.defineProperty(exports, "DropdownMenuRadioGroup", { enumerable: true, get: function () { return dropdown_menu_1.DropdownMenuRadioGroup; } });
84
85
  var glass_1 = require("./glass.cjs");
85
86
  Object.defineProperty(exports, "Glass", { enumerable: true, get: function () { return glass_1.Glass; } });
87
+ var grid_1 = require("./grid.cjs");
88
+ Object.defineProperty(exports, "Grid", { enumerable: true, get: function () { return grid_1.Grid; } });
86
89
  var input_1 = require("./input.cjs");
87
90
  Object.defineProperty(exports, "Input", { enumerable: true, get: function () { return input_1.Input; } });
88
91
  var label_1 = require("./label.cjs");
@@ -113,6 +116,8 @@ Object.defineProperty(exports, "SelectItem", { enumerable: true, get: function (
113
116
  Object.defineProperty(exports, "SelectSeparator", { enumerable: true, get: function () { return select_1.SelectSeparator; } });
114
117
  Object.defineProperty(exports, "SelectScrollUpButton", { enumerable: true, get: function () { return select_1.SelectScrollUpButton; } });
115
118
  Object.defineProperty(exports, "SelectScrollDownButton", { enumerable: true, get: function () { return select_1.SelectScrollDownButton; } });
119
+ var section_1 = require("./section.cjs");
120
+ Object.defineProperty(exports, "Section", { enumerable: true, get: function () { return section_1.Section; } });
116
121
  var separator_1 = require("./separator.cjs");
117
122
  Object.defineProperty(exports, "Separator", { enumerable: true, get: function () { return separator_1.Separator; } });
118
123
  var slider_1 = require("./slider.cjs");
@@ -2,13 +2,14 @@ export { AspectRatio, type AspectRatioProps } from './aspect-ratio.js';
2
2
  export { Avatar, AvatarImage, AvatarFallback } from './avatar.js';
3
3
  export { Badge, badgeVariants, type BadgeProps, type BadgeVariant } from './badge.js';
4
4
  export { Button, buttonVariants, type ButtonProps, type ButtonSize, type ButtonVariant } from './button.js';
5
- export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, } from './card.js';
5
+ export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, CardMedia, type CardMediaProps, } from './card.js';
6
6
  export { Checkbox } from './checkbox.js';
7
7
  export { Collapsible, CollapsibleTrigger, CollapsibleContent } from './collapsible.js';
8
8
  export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, type CommandFilter, type CommandProps, } from './command.js';
9
9
  export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, } from './dialog.js';
10
10
  export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, type DropdownMenuProps, } from './dropdown-menu.js';
11
11
  export { Glass, type GlassProps } from './glass.js';
12
+ export { Grid, type GridProps } from './grid.js';
12
13
  export { Input, type InputProps } from './input.js';
13
14
  export { Label } from './label.js';
14
15
  export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor, PopoverClose } from './popover.js';
@@ -16,6 +17,7 @@ export { Progress } from './progress.js';
16
17
  export { ResizablePanelGroup, ResizablePanel, ResizableHandle, type ResizablePanelGroupProps, type ResizablePanelProps, type ResizableHandleProps, } from './resizable.js';
17
18
  export { ScrollArea, ScrollBar } from './scroll-area.js';
18
19
  export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, } from './select.js';
20
+ export { Section, type SectionProps } from './section.js';
19
21
  export { Separator } from './separator.js';
20
22
  export { Slider } from './slider.js';
21
23
  export { Switch } from './switch.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/index.ts"],"names":[],"mappings":"AAiBA,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACnE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAC9D,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,MAAM,SAAS,CAAA;AAClF,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,UAAU,CAAA;AACxG,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,GACZ,MAAM,QAAQ,CAAA;AACf,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAA;AACnF,OAAO,EACL,OAAO,EACP,aAAa,EACb,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,EAChB,KAAK,aAAa,EAClB,KAAK,YAAY,GAClB,MAAM,WAAW,CAAA;AAClB,OAAO,EACL,MAAM,EACN,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,MAAM,UAAU,CAAA;AACjB,OAAO,EACL,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,wBAAwB,EACxB,qBAAqB,EACrB,iBAAiB,EACjB,qBAAqB,EACrB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,KAAK,iBAAiB,GACvB,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;AAChD,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAChG,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EACL,mBAAmB,EACnB,cAAc,EACd,eAAe,EACf,KAAK,wBAAwB,EAC7B,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,GAC1B,MAAM,aAAa,CAAA;AACpB,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,UAAU,CAAA;AACjB,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAA;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAC1C,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/index.ts"],"names":[],"mappings":"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"}
@@ -18,13 +18,14 @@ export { AspectRatio } from './aspect-ratio.js';
18
18
  export { Avatar, AvatarImage, AvatarFallback } from './avatar.js';
19
19
  export { Badge, badgeVariants } from './badge.js';
20
20
  export { Button, buttonVariants } from './button.js';
21
- export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, } from './card.js';
21
+ export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, CardMedia, } from './card.js';
22
22
  export { Checkbox } from './checkbox.js';
23
23
  export { Collapsible, CollapsibleTrigger, CollapsibleContent } from './collapsible.js';
24
24
  export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, } from './command.js';
25
25
  export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, } from './dialog.js';
26
26
  export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, } from './dropdown-menu.js';
27
27
  export { Glass } from './glass.js';
28
+ export { Grid } from './grid.js';
28
29
  export { Input } from './input.js';
29
30
  export { Label } from './label.js';
30
31
  export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor, PopoverClose } from './popover.js';
@@ -32,6 +33,7 @@ export { Progress } from './progress.js';
32
33
  export { ResizablePanelGroup, ResizablePanel, ResizableHandle, } from './resizable.js';
33
34
  export { ScrollArea, ScrollBar } from './scroll-area.js';
34
35
  export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, } from './select.js';
36
+ export { Section } from './section.js';
35
37
  export { Separator } from './separator.js';
36
38
  export { Slider } from './slider.js';
37
39
  export { Switch } from './switch.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/backends/gui/index.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,EAAE;AACF,kFAAkF;AAClF,4EAA4E;AAC5E,uEAAuE;AACvE,EAAE;AACF,4EAA4E;AAC5E,iFAAiF;AACjF,+EAA+E;AAC/E,0BAA0B;AAC1B,EAAE;AACF,6DAA6D;AAC7D,6EAA6E;AAC7E,iFAAiF;AACjF,+CAA+C;AAC/C,oCAAoC;AAEpC,OAAO,EAAE,WAAW,EAAyB,MAAM,gBAAgB,CAAA;AACnE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAC9D,OAAO,EAAE,KAAK,EAAE,aAAa,EAAsC,MAAM,SAAS,CAAA;AAClF,OAAO,EAAE,MAAM,EAAE,cAAc,EAAyD,MAAM,UAAU,CAAA;AACxG,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,GACZ,MAAM,QAAQ,CAAA;AACf,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAA;AACnF,OAAO,EACL,OAAO,EACP,aAAa,EACb,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,GAGjB,MAAM,WAAW,CAAA;AAClB,OAAO,EACL,MAAM,EACN,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,MAAM,UAAU,CAAA;AACjB,OAAO,EACL,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,wBAAwB,EACxB,qBAAqB,EACrB,iBAAiB,EACjB,qBAAqB,EACrB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,GAEvB,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,KAAK,EAAmB,MAAM,SAAS,CAAA;AAChD,OAAO,EAAE,KAAK,EAAmB,MAAM,SAAS,CAAA;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAChG,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EACL,mBAAmB,EACnB,cAAc,EACd,eAAe,GAIhB,MAAM,aAAa,CAAA;AACpB,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,UAAU,CAAA;AACjB,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAA;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAC1C,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/backends/gui/index.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,39 @@
1
+ 'use client';"use strict";
2
+ 'use client';
3
+ Object.defineProperty(exports, "__esModule", { value: true });
4
+ exports.Section = void 0;
5
+ const jsx_runtime_1 = require("react/jsx-runtime");
6
+ /**
7
+ * Section — the page's vertical rhythm, in one place.
8
+ *
9
+ * Components kept inventing their own vertical story: a margin here, a padding
10
+ * there, a `<div style={{marginTop: 64}}>` somewhere else. The result is a page
11
+ * whose spacing is the sum of everyone's guesses, and which is never the same
12
+ * twice on a phone.
13
+ *
14
+ * So the page-level spacing decision is made once, from the space scale, and it
15
+ * is mobile-first: phone values by default, stepping up past `$gtSm`. A caller
16
+ * that writes nothing gets the right answer at every width, which is the point —
17
+ * the failure mode being designed out is "had to remember something".
18
+ *
19
+ * Two boxes, because they do two different jobs and merging them is what breaks:
20
+ * the OUTER runs full-bleed and owns the vertical rhythm and the side gutter, so
21
+ * a background set on it reaches both edges; the INNER is the centred measure and
22
+ * owns `maxWidth`. Put `maxWidth` on the outer box instead and a section can
23
+ * never have a full-width background.
24
+ */
25
+ const gui_1 = require("@hanzo/gui");
26
+ const slot_1 = require("./slot.cjs");
27
+ const Section = ({ maxWidth = 1200, children, innerProps, ...props }) => ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('section'), width: "100%",
28
+ // Values come from the space scale, never literals — a section spaced in
29
+ // raw px drifts from everything else on the page. `$md` is a MAX-width
30
+ // query in this config, so the base is the roomy value and the phone steps
31
+ // it down; that is the direction every other responsive prop in this
32
+ // package is written in ($md/$sm in Field, PageHeader, SiteNav) and mixing
33
+ // both directions in one codebase is how a breakpoint ends up applying
34
+ // twice.
35
+ py: "$11", px: "$6", "$md": { py: '$8', px: '$4' }, ...props, children: (0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('section-inner'), width: "100%", ...(maxWidth === false ? {} : { maxWidth }),
36
+ // The centring. `self: center` is the cross-axis rule a YStack understands
37
+ // on web AND native, where `margin: auto` is web-only.
38
+ self: "center", ...innerProps, children: children }) }));
39
+ exports.Section = Section;
@@ -0,0 +1,29 @@
1
+ /**
2
+ * Section — the page's vertical rhythm, in one place.
3
+ *
4
+ * Components kept inventing their own vertical story: a margin here, a padding
5
+ * there, a `<div style={{marginTop: 64}}>` somewhere else. The result is a page
6
+ * whose spacing is the sum of everyone's guesses, and which is never the same
7
+ * twice on a phone.
8
+ *
9
+ * So the page-level spacing decision is made once, from the space scale, and it
10
+ * is mobile-first: phone values by default, stepping up past `$gtSm`. A caller
11
+ * that writes nothing gets the right answer at every width, which is the point —
12
+ * the failure mode being designed out is "had to remember something".
13
+ *
14
+ * Two boxes, because they do two different jobs and merging them is what breaks:
15
+ * the OUTER runs full-bleed and owns the vertical rhythm and the side gutter, so
16
+ * a background set on it reaches both edges; the INNER is the centred measure and
17
+ * owns `maxWidth`. Put `maxWidth` on the outer box instead and a section can
18
+ * never have a full-width background.
19
+ */
20
+ import { type YStackProps } from '@hanzo/gui';
21
+ export interface SectionProps extends YStackProps {
22
+ /** The centred measure. `false` lets the content run the full width. */
23
+ maxWidth?: number | false;
24
+ /** Props for the inner centred column. */
25
+ innerProps?: YStackProps;
26
+ }
27
+ declare const Section: ({ maxWidth, children, innerProps, ...props }: SectionProps) => import("react/jsx-runtime").JSX.Element;
28
+ export { Section };
29
+ //# sourceMappingURL=section.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"section.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/section.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,YAAY,CAAA;AAGrD,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C,wEAAwE;IACxE,QAAQ,CAAC,EAAE,MAAM,GAAG,KAAK,CAAA;IACzB,0CAA0C;IAC1C,UAAU,CAAC,EAAE,WAAW,CAAA;CACzB;AAED,QAAA,MAAM,OAAO,GAAI,8CAAqD,YAAY,4CA4BjF,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}
@@ -0,0 +1,37 @@
1
+ 'use client';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ /**
4
+ * Section — the page's vertical rhythm, in one place.
5
+ *
6
+ * Components kept inventing their own vertical story: a margin here, a padding
7
+ * there, a `<div style={{marginTop: 64}}>` somewhere else. The result is a page
8
+ * whose spacing is the sum of everyone's guesses, and which is never the same
9
+ * twice on a phone.
10
+ *
11
+ * So the page-level spacing decision is made once, from the space scale, and it
12
+ * is mobile-first: phone values by default, stepping up past `$gtSm`. A caller
13
+ * that writes nothing gets the right answer at every width, which is the point —
14
+ * the failure mode being designed out is "had to remember something".
15
+ *
16
+ * Two boxes, because they do two different jobs and merging them is what breaks:
17
+ * the OUTER runs full-bleed and owns the vertical rhythm and the side gutter, so
18
+ * a background set on it reaches both edges; the INNER is the centred measure and
19
+ * owns `maxWidth`. Put `maxWidth` on the outer box instead and a section can
20
+ * never have a full-width background.
21
+ */
22
+ import { YStack } from '@hanzo/gui';
23
+ import { slot } from './slot.js';
24
+ const Section = ({ maxWidth = 1200, children, innerProps, ...props }) => (_jsx(YStack, { ...slot('section'), width: "100%",
25
+ // Values come from the space scale, never literals — a section spaced in
26
+ // raw px drifts from everything else on the page. `$md` is a MAX-width
27
+ // query in this config, so the base is the roomy value and the phone steps
28
+ // it down; that is the direction every other responsive prop in this
29
+ // package is written in ($md/$sm in Field, PageHeader, SiteNav) and mixing
30
+ // both directions in one codebase is how a breakpoint ends up applying
31
+ // twice.
32
+ py: "$11", px: "$6", "$md": { py: '$8', px: '$4' }, ...props, children: _jsx(YStack, { ...slot('section-inner'), width: "100%", ...(maxWidth === false ? {} : { maxWidth }),
33
+ // The centring. `self: center` is the cross-axis rule a YStack understands
34
+ // on web AND native, where `margin: auto` is web-only.
35
+ self: "center", ...innerProps, children: children }) }));
36
+ export { Section };
37
+ //# sourceMappingURL=section.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"section.js","sourceRoot":"","sources":["../../../src/backends/gui/section.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAE,MAAM,EAAoB,MAAM,YAAY,CAAA;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAS7B,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,GAAG,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE,CAAC,CACrF,KAAC,MAAM,OACD,IAAI,CAAC,SAAS,CAAC,EACnB,KAAK,EAAC,MAAM;IACZ,yEAAyE;IACzE,uEAAuE;IACvE,2EAA2E;IAC3E,qEAAqE;IACrE,2EAA2E;IAC3E,uEAAuE;IACvE,SAAS;IACT,EAAE,EAAC,KAAK,EACR,EAAE,EAAC,IAAI,SACF,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,KACvB,KAAK,YAET,KAAC,MAAM,OACD,IAAI,CAAC,eAAe,CAAC,EACzB,KAAK,EAAC,MAAM,KACR,CAAC,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC;QAC5C,2EAA2E;QAC3E,uDAAuD;QACvD,IAAI,EAAC,QAAQ,KACT,UAAU,YAEb,QAAQ,GACF,GACF,CACV,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}
package/dist/gallery.cjs CHANGED
@@ -4,6 +4,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
4
4
  exports.Gallery = void 0;
5
5
  const jsx_runtime_1 = require("react/jsx-runtime");
6
6
  const gui_1 = require("./backends/gui/index.cjs");
7
+ /** A real <img> with real intrinsic pixels, inline so nothing hits the network.
8
+ * 120x40 on purpose: the wrong ratio for every box it goes in, so a frame that
9
+ * fails to cover-fit its child is visible rather than merely untested. */
10
+ const SWATCH = 'data:image/svg+xml;utf8,' +
11
+ encodeURIComponent(
12
+ // `#` is written literally and encodeURIComponent turns it into %23. Writing
13
+ // %23 here instead double-encodes it to %25888, the fill is invalid, and the
14
+ // swatch silently renders black — which it did.
15
+ '<svg xmlns="http://www.w3.org/2000/svg" width="120" height="40"><rect width="120" height="40" fill="#888"/></svg>');
7
16
  const BUTTON_VARIANTS = [
8
17
  'default', 'destructive', 'outline', 'secondary', 'ghost', 'link', 'primary', 'linkFG', 'linkMuted',
9
18
  ];
@@ -18,6 +27,6 @@ const Section = ({ name, children }) => ((0, jsx_runtime_1.jsx)("section", { "da
18
27
  * Every component, once. `data-gallery` names each section so a browser test can
19
28
  * scope its assertions without depending on document order.
20
29
  */
21
- const Gallery = () => ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: 28, padding: 24, maxWidth: 928 }, children: [(0, jsx_runtime_1.jsxs)(Section, { name: "button", children: [BUTTON_VARIANTS.map((variant) => ((0, jsx_runtime_1.jsx)(gui_1.Button, { variant: variant, children: variant }, variant))), BUTTON_SIZES.map((size) => ((0, jsx_runtime_1.jsx)(gui_1.Button, { size: size, children: size }, size))), (0, jsx_runtime_1.jsx)(gui_1.Button, { disabled: true, children: "disabled" }), (0, jsx_runtime_1.jsx)(gui_1.Button, { isLoading: true, children: "loading" })] }), (0, jsx_runtime_1.jsx)(Section, { name: "badge", children: BADGE_VARIANTS.map((variant) => ((0, jsx_runtime_1.jsx)(gui_1.Badge, { variant: variant, children: variant }, variant))) }), (0, jsx_runtime_1.jsx)(Section, { name: "card", children: (0, jsx_runtime_1.jsxs)(gui_1.Card, { children: [(0, jsx_runtime_1.jsxs)(gui_1.CardHeader, { children: [(0, jsx_runtime_1.jsx)(gui_1.CardTitle, { children: "Card title" }), (0, jsx_runtime_1.jsx)(gui_1.CardDescription, { children: "Card description" }), (0, jsx_runtime_1.jsx)(gui_1.CardAction, { children: (0, jsx_runtime_1.jsx)(gui_1.Button, { size: "sm", variant: "ghost", children: "action" }) })] }), (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "Card content" }), (0, jsx_runtime_1.jsx)(gui_1.CardFooter, { children: "Card footer" })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "form", children: [(0, jsx_runtime_1.jsx)(gui_1.Label, { children: "Label" }), (0, jsx_runtime_1.jsx)(gui_1.Input, { placeholder: "Input" }), (0, jsx_runtime_1.jsx)(gui_1.Input, { placeholder: "Password", type: "password" }), (0, jsx_runtime_1.jsx)(gui_1.Textarea, { placeholder: "Textarea" }), (0, jsx_runtime_1.jsx)(gui_1.Checkbox, {}), (0, jsx_runtime_1.jsx)(gui_1.Checkbox, { checked: true }), (0, jsx_runtime_1.jsx)(gui_1.Switch, {}), (0, jsx_runtime_1.jsx)(gui_1.Switch, { checked: true }), (0, jsx_runtime_1.jsx)(gui_1.Slider, { defaultValue: [40] }), (0, jsx_runtime_1.jsx)(gui_1.Progress, { value: 40 })] }), (0, jsx_runtime_1.jsx)(Section, { name: "tabs", children: (0, jsx_runtime_1.jsxs)(gui_1.Tabs, { defaultValue: "one", children: [(0, jsx_runtime_1.jsxs)(gui_1.TabsList, { children: [(0, jsx_runtime_1.jsx)(gui_1.TabsTrigger, { value: "one", children: "One" }), (0, jsx_runtime_1.jsx)(gui_1.TabsTrigger, { value: "two", children: "Two" })] }), (0, jsx_runtime_1.jsx)(gui_1.TabsContent, { value: "one", children: "Panel one" })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "surface", children: [(0, jsx_runtime_1.jsx)(gui_1.Separator, {}), (0, jsx_runtime_1.jsx)(gui_1.AspectRatio, { ratio: 16 / 9 }), (0, jsx_runtime_1.jsx)(gui_1.Avatar, { children: (0, jsx_runtime_1.jsx)(gui_1.AvatarFallback, { children: "HZ" }) }), (0, jsx_runtime_1.jsx)(gui_1.ScrollArea, { height: 80, children: "Scroll area" }), (0, jsx_runtime_1.jsxs)(gui_1.ResizablePanelGroup, { direction: "horizontal", children: [(0, jsx_runtime_1.jsx)(gui_1.ResizablePanel, {}), (0, jsx_runtime_1.jsx)(gui_1.ResizableHandle, {}), (0, jsx_runtime_1.jsx)(gui_1.ResizablePanel, {})] })] }), (0, jsx_runtime_1.jsx)(Section, { name: "collapsible", children: (0, jsx_runtime_1.jsxs)(gui_1.Collapsible, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.CollapsibleTrigger, { children: "Collapsible trigger" }), (0, jsx_runtime_1.jsx)(gui_1.CollapsibleContent, { children: "Collapsible content" })] }) }), (0, jsx_runtime_1.jsx)(Section, { name: "command", children: (0, jsx_runtime_1.jsxs)(gui_1.Command, { children: [(0, jsx_runtime_1.jsx)(gui_1.CommandInput, {}), (0, jsx_runtime_1.jsxs)(gui_1.CommandList, { children: [(0, jsx_runtime_1.jsx)(gui_1.CommandEmpty, { children: "No results" }), (0, jsx_runtime_1.jsx)(gui_1.CommandGroup, { heading: "Group", children: (0, jsx_runtime_1.jsxs)(gui_1.CommandItem, { value: "a", children: ["Item", (0, jsx_runtime_1.jsx)(gui_1.CommandShortcut, { children: "\u2318A" })] }) }), (0, jsx_runtime_1.jsx)(gui_1.CommandSeparator, {})] })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "overlay", children: [(0, jsx_runtime_1.jsx)(gui_1.Dialog, { open: true, children: (0, jsx_runtime_1.jsxs)(gui_1.DialogContent, { children: [(0, jsx_runtime_1.jsxs)(gui_1.DialogHeader, { children: [(0, jsx_runtime_1.jsx)(gui_1.DialogTitle, { children: "Dialog title" }), (0, jsx_runtime_1.jsx)(gui_1.DialogDescription, { children: "Dialog description" })] }), (0, jsx_runtime_1.jsx)(gui_1.DialogFooter, { children: (0, jsx_runtime_1.jsx)(gui_1.Button, { size: "sm", children: "OK" }) })] }) }), (0, jsx_runtime_1.jsxs)(gui_1.DropdownMenu, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.DropdownMenuTrigger, { children: "Menu" }), (0, jsx_runtime_1.jsxs)(gui_1.DropdownMenuContent, { children: [(0, jsx_runtime_1.jsx)(gui_1.DropdownMenuLabel, { children: "Label" }), (0, jsx_runtime_1.jsx)(gui_1.DropdownMenuSeparator, {}), (0, jsx_runtime_1.jsx)(gui_1.DropdownMenuItem, { children: "Item" })] })] }), (0, jsx_runtime_1.jsxs)(gui_1.Popover, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.PopoverTrigger, { children: "Popover" }), (0, jsx_runtime_1.jsx)(gui_1.PopoverContent, { children: "Popover content" })] }), (0, jsx_runtime_1.jsxs)(gui_1.Select, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.SelectTrigger, { children: (0, jsx_runtime_1.jsx)(gui_1.SelectValue, { placeholder: "Select" }) }), (0, jsx_runtime_1.jsx)(gui_1.SelectContent, { children: (0, jsx_runtime_1.jsx)(gui_1.SelectItem, { value: "x", index: 0, children: "Option" }) })] }), (0, jsx_runtime_1.jsx)(gui_1.TooltipProvider, { delay: 0, children: (0, jsx_runtime_1.jsxs)(gui_1.Tooltip, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.TooltipTrigger, { children: "Tooltip" }), (0, jsx_runtime_1.jsx)(gui_1.TooltipContent, { children: "Tooltip content" })] }) }), (0, jsx_runtime_1.jsx)(gui_1.Toaster, {})] })] }));
30
+ const Gallery = () => ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: 28, padding: 24, maxWidth: 928 }, children: [(0, jsx_runtime_1.jsxs)(Section, { name: "button", children: [BUTTON_VARIANTS.map((variant) => ((0, jsx_runtime_1.jsx)(gui_1.Button, { variant: variant, children: variant }, variant))), BUTTON_SIZES.map((size) => ((0, jsx_runtime_1.jsx)(gui_1.Button, { size: size, children: size }, size))), (0, jsx_runtime_1.jsx)(gui_1.Button, { disabled: true, children: "disabled" }), (0, jsx_runtime_1.jsx)(gui_1.Button, { isLoading: true, children: "loading" })] }), (0, jsx_runtime_1.jsx)(Section, { name: "badge", children: BADGE_VARIANTS.map((variant) => ((0, jsx_runtime_1.jsx)(gui_1.Badge, { variant: variant, children: variant }, variant))) }), (0, jsx_runtime_1.jsx)(Section, { name: "card", children: (0, jsx_runtime_1.jsxs)(gui_1.Card, { children: [(0, jsx_runtime_1.jsxs)(gui_1.CardHeader, { children: [(0, jsx_runtime_1.jsx)(gui_1.CardTitle, { children: "Card title" }), (0, jsx_runtime_1.jsx)(gui_1.CardDescription, { children: "Card description" }), (0, jsx_runtime_1.jsx)(gui_1.CardAction, { children: (0, jsx_runtime_1.jsx)(gui_1.Button, { size: "sm", variant: "ghost", children: "action" }) })] }), (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "Card content" }), (0, jsx_runtime_1.jsx)(gui_1.CardFooter, { children: "Card footer" })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "form", children: [(0, jsx_runtime_1.jsx)(gui_1.Label, { children: "Label" }), (0, jsx_runtime_1.jsx)(gui_1.Input, { placeholder: "Input" }), (0, jsx_runtime_1.jsx)(gui_1.Input, { placeholder: "Password", type: "password" }), (0, jsx_runtime_1.jsx)(gui_1.Textarea, { placeholder: "Textarea" }), (0, jsx_runtime_1.jsx)(gui_1.Checkbox, {}), (0, jsx_runtime_1.jsx)(gui_1.Checkbox, { checked: true }), (0, jsx_runtime_1.jsx)(gui_1.Switch, {}), (0, jsx_runtime_1.jsx)(gui_1.Switch, { checked: true }), (0, jsx_runtime_1.jsx)(gui_1.Slider, { defaultValue: [40] }), (0, jsx_runtime_1.jsx)(gui_1.Progress, { value: 40 })] }), (0, jsx_runtime_1.jsx)(Section, { name: "tabs", children: (0, jsx_runtime_1.jsxs)(gui_1.Tabs, { defaultValue: "one", children: [(0, jsx_runtime_1.jsxs)(gui_1.TabsList, { children: [(0, jsx_runtime_1.jsx)(gui_1.TabsTrigger, { value: "one", children: "One" }), (0, jsx_runtime_1.jsx)(gui_1.TabsTrigger, { value: "two", children: "Two" })] }), (0, jsx_runtime_1.jsx)(gui_1.TabsContent, { value: "one", children: "Panel one" })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "surface", children: [(0, jsx_runtime_1.jsx)(gui_1.Separator, {}), (0, jsx_runtime_1.jsx)(gui_1.AspectRatio, { ratio: 16 / 9 }), (0, jsx_runtime_1.jsx)(gui_1.Avatar, { children: (0, jsx_runtime_1.jsx)(gui_1.AvatarFallback, { children: "HZ" }) }), (0, jsx_runtime_1.jsx)(gui_1.ScrollArea, { height: 80, children: "Scroll area" }), (0, jsx_runtime_1.jsxs)(gui_1.ResizablePanelGroup, { direction: "horizontal", children: [(0, jsx_runtime_1.jsx)(gui_1.ResizablePanel, {}), (0, jsx_runtime_1.jsx)(gui_1.ResizableHandle, {}), (0, jsx_runtime_1.jsx)(gui_1.ResizablePanel, {})] })] }), (0, jsx_runtime_1.jsx)(Section, { name: "collapsible", children: (0, jsx_runtime_1.jsxs)(gui_1.Collapsible, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.CollapsibleTrigger, { children: "Collapsible trigger" }), (0, jsx_runtime_1.jsx)(gui_1.CollapsibleContent, { children: "Collapsible content" })] }) }), (0, jsx_runtime_1.jsx)(Section, { name: "command", children: (0, jsx_runtime_1.jsxs)(gui_1.Command, { children: [(0, jsx_runtime_1.jsx)(gui_1.CommandInput, {}), (0, jsx_runtime_1.jsxs)(gui_1.CommandList, { children: [(0, jsx_runtime_1.jsx)(gui_1.CommandEmpty, { children: "No results" }), (0, jsx_runtime_1.jsx)(gui_1.CommandGroup, { heading: "Group", children: (0, jsx_runtime_1.jsxs)(gui_1.CommandItem, { value: "a", children: ["Item", (0, jsx_runtime_1.jsx)(gui_1.CommandShortcut, { children: "\u2318A" })] }) }), (0, jsx_runtime_1.jsx)(gui_1.CommandSeparator, {})] })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "overlay", children: [(0, jsx_runtime_1.jsx)(gui_1.Dialog, { open: true, children: (0, jsx_runtime_1.jsxs)(gui_1.DialogContent, { children: [(0, jsx_runtime_1.jsxs)(gui_1.DialogHeader, { children: [(0, jsx_runtime_1.jsx)(gui_1.DialogTitle, { children: "Dialog title" }), (0, jsx_runtime_1.jsx)(gui_1.DialogDescription, { children: "Dialog description" })] }), (0, jsx_runtime_1.jsx)(gui_1.DialogFooter, { children: (0, jsx_runtime_1.jsx)(gui_1.Button, { size: "sm", children: "OK" }) })] }) }), (0, jsx_runtime_1.jsxs)(gui_1.DropdownMenu, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.DropdownMenuTrigger, { children: "Menu" }), (0, jsx_runtime_1.jsxs)(gui_1.DropdownMenuContent, { children: [(0, jsx_runtime_1.jsx)(gui_1.DropdownMenuLabel, { children: "Label" }), (0, jsx_runtime_1.jsx)(gui_1.DropdownMenuSeparator, {}), (0, jsx_runtime_1.jsx)(gui_1.DropdownMenuItem, { children: "Item" })] })] }), (0, jsx_runtime_1.jsxs)(gui_1.Popover, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.PopoverTrigger, { children: "Popover" }), (0, jsx_runtime_1.jsx)(gui_1.PopoverContent, { children: "Popover content" })] }), (0, jsx_runtime_1.jsxs)(gui_1.Select, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.SelectTrigger, { children: (0, jsx_runtime_1.jsx)(gui_1.SelectValue, { placeholder: "Select" }) }), (0, jsx_runtime_1.jsx)(gui_1.SelectContent, { children: (0, jsx_runtime_1.jsx)(gui_1.SelectItem, { value: "x", index: 0, children: "Option" }) })] }), (0, jsx_runtime_1.jsx)(gui_1.TooltipProvider, { delay: 0, children: (0, jsx_runtime_1.jsxs)(gui_1.Tooltip, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.TooltipTrigger, { children: "Tooltip" }), (0, jsx_runtime_1.jsx)(gui_1.TooltipContent, { children: "Tooltip content" })] }) }), (0, jsx_runtime_1.jsx)(gui_1.Toaster, {})] }), (0, jsx_runtime_1.jsxs)(Section, { name: "layout", children: [(0, jsx_runtime_1.jsx)(gui_1.Grid, { min: 240, gap: "$3", style: { width: '100%' }, "data-grid": "auto", children: [0, 1, 2, 3, 4, 5, 6].map((i) => ((0, jsx_runtime_1.jsxs)(gui_1.Card, { children: [(0, jsx_runtime_1.jsx)(gui_1.CardMedia, { ratio: 16 / 10, children: (0, jsx_runtime_1.jsx)("img", { src: SWATCH, alt: "" }) }), (0, jsx_runtime_1.jsxs)(gui_1.CardHeader, { children: [(0, jsx_runtime_1.jsxs)(gui_1.CardTitle, { children: ["Card ", i] }), (0, jsx_runtime_1.jsx)(gui_1.CardDescription, { children: "Sized by its content, never by a pinned height." })] })] }, i))) }), (0, jsx_runtime_1.jsxs)(gui_1.Grid, { min: 900, gap: "$3", style: { width: '100%' }, "data-grid": "wide", children: [(0, jsx_runtime_1.jsx)(gui_1.Card, { children: (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "wide" }) }), (0, jsx_runtime_1.jsx)(gui_1.Card, { children: (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "wide" }) })] }), (0, jsx_runtime_1.jsx)("div", { style: { width: '100%', overflow: 'hidden' }, children: (0, jsx_runtime_1.jsxs)(gui_1.Grid, { cols: 3, gap: "$3", style: { width: '100%' }, "data-grid": "fixed", children: [(0, jsx_runtime_1.jsx)(gui_1.Card, { children: (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "short" }) }), (0, jsx_runtime_1.jsx)(gui_1.Card, { children: (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: (0, jsx_runtime_1.jsx)("span", { style: { whiteSpace: 'nowrap' }, children: "MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM" }) }) }), (0, jsx_runtime_1.jsx)(gui_1.Card, { children: (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "short" }) })] }) }), (0, jsx_runtime_1.jsxs)("div", { "data-grid": "growth", style: { display: 'flex', alignItems: 'flex-start', gap: 12, width: '100%' }, children: [(0, jsx_runtime_1.jsx)(gui_1.Card, { "data-card": "lean", children: (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "one line" }) }), (0, jsx_runtime_1.jsxs)(gui_1.Card, { "data-card": "fat", children: [(0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "one line" }), (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "two line" }), (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "three line" }), (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "four line" })] })] }), (0, jsx_runtime_1.jsx)(gui_1.Card, { interactive: true, "data-card": "interactive", children: (0, jsx_runtime_1.jsx)(gui_1.CardHeader, { children: (0, jsx_runtime_1.jsx)(gui_1.CardTitle, { children: "Interactive card" }) }) }), (0, jsx_runtime_1.jsx)(gui_1.Section, { maxWidth: 600, "data-section": "demo", children: (0, jsx_runtime_1.jsx)(gui_1.CardTitle, { children: "Section" }) }), (0, jsx_runtime_1.jsx)(gui_1.CardTitle, { fontFamily: "$mono", "data-type": "mono", children: "1234567890" }), (0, jsx_runtime_1.jsx)(gui_1.Button, { "data-button": "block-child", children: (0, jsx_runtime_1.jsx)("span", { "data-block-child": true, style: { display: 'block', height: 119, width: 119 } }) })] })] }));
22
31
  exports.Gallery = Gallery;
23
32
  exports.default = exports.Gallery;
@@ -1 +1 @@
1
- {"version":3,"file":"gallery.d.ts","sourceRoot":"","sources":["../src/gallery.tsx"],"names":[],"mappings":"AA2DA;;;GAGG;AACH,eAAO,MAAM,OAAO,+CAiJnB,CAAA;AAED,eAAe,OAAO,CAAA"}
1
+ {"version":3,"file":"gallery.d.ts","sourceRoot":"","sources":["../src/gallery.tsx"],"names":[],"mappings":"AAuEA;;;GAGG;AACH,eAAO,MAAM,OAAO,+CAsOnB,CAAA;AAED,eAAe,OAAO,CAAA"}
package/dist/gallery.js CHANGED
@@ -1,6 +1,15 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { AspectRatio, Avatar, AvatarFallback, Badge, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Input, Label, Popover, PopoverContent, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Separator, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from './backends/gui/index.js';
3
+ import { AspectRatio, Avatar, AvatarFallback, Badge, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Input, Label, Popover, PopoverContent, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Separator, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Grid, Section as PageSection, CardMedia, } from './backends/gui/index.js';
4
+ /** A real <img> with real intrinsic pixels, inline so nothing hits the network.
5
+ * 120x40 on purpose: the wrong ratio for every box it goes in, so a frame that
6
+ * fails to cover-fit its child is visible rather than merely untested. */
7
+ const SWATCH = 'data:image/svg+xml;utf8,' +
8
+ encodeURIComponent(
9
+ // `#` is written literally and encodeURIComponent turns it into %23. Writing
10
+ // %23 here instead double-encodes it to %25888, the fill is invalid, and the
11
+ // swatch silently renders black — which it did.
12
+ '<svg xmlns="http://www.w3.org/2000/svg" width="120" height="40"><rect width="120" height="40" fill="#888"/></svg>');
4
13
  const BUTTON_VARIANTS = [
5
14
  'default', 'destructive', 'outline', 'secondary', 'ghost', 'link', 'primary', 'linkFG', 'linkMuted',
6
15
  ];
@@ -15,6 +24,6 @@ const Section = ({ name, children }) => (_jsx("section", { "data-gallery": name,
15
24
  * Every component, once. `data-gallery` names each section so a browser test can
16
25
  * scope its assertions without depending on document order.
17
26
  */
18
- export const Gallery = () => (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 28, padding: 24, maxWidth: 928 }, children: [_jsxs(Section, { name: "button", children: [BUTTON_VARIANTS.map((variant) => (_jsx(Button, { variant: variant, children: variant }, variant))), BUTTON_SIZES.map((size) => (_jsx(Button, { size: size, children: size }, size))), _jsx(Button, { disabled: true, children: "disabled" }), _jsx(Button, { isLoading: true, children: "loading" })] }), _jsx(Section, { name: "badge", children: BADGE_VARIANTS.map((variant) => (_jsx(Badge, { variant: variant, children: variant }, variant))) }), _jsx(Section, { name: "card", children: _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Card title" }), _jsx(CardDescription, { children: "Card description" }), _jsx(CardAction, { children: _jsx(Button, { size: "sm", variant: "ghost", children: "action" }) })] }), _jsx(CardContent, { children: "Card content" }), _jsx(CardFooter, { children: "Card footer" })] }) }), _jsxs(Section, { name: "form", children: [_jsx(Label, { children: "Label" }), _jsx(Input, { placeholder: "Input" }), _jsx(Input, { placeholder: "Password", type: "password" }), _jsx(Textarea, { placeholder: "Textarea" }), _jsx(Checkbox, {}), _jsx(Checkbox, { checked: true }), _jsx(Switch, {}), _jsx(Switch, { checked: true }), _jsx(Slider, { defaultValue: [40] }), _jsx(Progress, { value: 40 })] }), _jsx(Section, { name: "tabs", children: _jsxs(Tabs, { defaultValue: "one", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "one", children: "One" }), _jsx(TabsTrigger, { value: "two", children: "Two" })] }), _jsx(TabsContent, { value: "one", children: "Panel one" })] }) }), _jsxs(Section, { name: "surface", children: [_jsx(Separator, {}), _jsx(AspectRatio, { ratio: 16 / 9 }), _jsx(Avatar, { children: _jsx(AvatarFallback, { children: "HZ" }) }), _jsx(ScrollArea, { height: 80, children: "Scroll area" }), _jsxs(ResizablePanelGroup, { direction: "horizontal", children: [_jsx(ResizablePanel, {}), _jsx(ResizableHandle, {}), _jsx(ResizablePanel, {})] })] }), _jsx(Section, { name: "collapsible", children: _jsxs(Collapsible, { open: true, children: [_jsx(CollapsibleTrigger, { children: "Collapsible trigger" }), _jsx(CollapsibleContent, { children: "Collapsible content" })] }) }), _jsx(Section, { name: "command", children: _jsxs(Command, { children: [_jsx(CommandInput, {}), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "No results" }), _jsx(CommandGroup, { heading: "Group", children: _jsxs(CommandItem, { value: "a", children: ["Item", _jsx(CommandShortcut, { children: "\u2318A" })] }) }), _jsx(CommandSeparator, {})] })] }) }), _jsxs(Section, { name: "overlay", children: [_jsx(Dialog, { open: true, children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Dialog title" }), _jsx(DialogDescription, { children: "Dialog description" })] }), _jsx(DialogFooter, { children: _jsx(Button, { size: "sm", children: "OK" }) })] }) }), _jsxs(DropdownMenu, { open: true, children: [_jsx(DropdownMenuTrigger, { children: "Menu" }), _jsxs(DropdownMenuContent, { children: [_jsx(DropdownMenuLabel, { children: "Label" }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { children: "Item" })] })] }), _jsxs(Popover, { open: true, children: [_jsx(PopoverTrigger, { children: "Popover" }), _jsx(PopoverContent, { children: "Popover content" })] }), _jsxs(Select, { open: true, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Select" }) }), _jsx(SelectContent, { children: _jsx(SelectItem, { value: "x", index: 0, children: "Option" }) })] }), _jsx(TooltipProvider, { delay: 0, children: _jsxs(Tooltip, { open: true, children: [_jsx(TooltipTrigger, { children: "Tooltip" }), _jsx(TooltipContent, { children: "Tooltip content" })] }) }), _jsx(Toaster, {})] })] }));
27
+ export const Gallery = () => (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 28, padding: 24, maxWidth: 928 }, children: [_jsxs(Section, { name: "button", children: [BUTTON_VARIANTS.map((variant) => (_jsx(Button, { variant: variant, children: variant }, variant))), BUTTON_SIZES.map((size) => (_jsx(Button, { size: size, children: size }, size))), _jsx(Button, { disabled: true, children: "disabled" }), _jsx(Button, { isLoading: true, children: "loading" })] }), _jsx(Section, { name: "badge", children: BADGE_VARIANTS.map((variant) => (_jsx(Badge, { variant: variant, children: variant }, variant))) }), _jsx(Section, { name: "card", children: _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Card title" }), _jsx(CardDescription, { children: "Card description" }), _jsx(CardAction, { children: _jsx(Button, { size: "sm", variant: "ghost", children: "action" }) })] }), _jsx(CardContent, { children: "Card content" }), _jsx(CardFooter, { children: "Card footer" })] }) }), _jsxs(Section, { name: "form", children: [_jsx(Label, { children: "Label" }), _jsx(Input, { placeholder: "Input" }), _jsx(Input, { placeholder: "Password", type: "password" }), _jsx(Textarea, { placeholder: "Textarea" }), _jsx(Checkbox, {}), _jsx(Checkbox, { checked: true }), _jsx(Switch, {}), _jsx(Switch, { checked: true }), _jsx(Slider, { defaultValue: [40] }), _jsx(Progress, { value: 40 })] }), _jsx(Section, { name: "tabs", children: _jsxs(Tabs, { defaultValue: "one", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "one", children: "One" }), _jsx(TabsTrigger, { value: "two", children: "Two" })] }), _jsx(TabsContent, { value: "one", children: "Panel one" })] }) }), _jsxs(Section, { name: "surface", children: [_jsx(Separator, {}), _jsx(AspectRatio, { ratio: 16 / 9 }), _jsx(Avatar, { children: _jsx(AvatarFallback, { children: "HZ" }) }), _jsx(ScrollArea, { height: 80, children: "Scroll area" }), _jsxs(ResizablePanelGroup, { direction: "horizontal", children: [_jsx(ResizablePanel, {}), _jsx(ResizableHandle, {}), _jsx(ResizablePanel, {})] })] }), _jsx(Section, { name: "collapsible", children: _jsxs(Collapsible, { open: true, children: [_jsx(CollapsibleTrigger, { children: "Collapsible trigger" }), _jsx(CollapsibleContent, { children: "Collapsible content" })] }) }), _jsx(Section, { name: "command", children: _jsxs(Command, { children: [_jsx(CommandInput, {}), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "No results" }), _jsx(CommandGroup, { heading: "Group", children: _jsxs(CommandItem, { value: "a", children: ["Item", _jsx(CommandShortcut, { children: "\u2318A" })] }) }), _jsx(CommandSeparator, {})] })] }) }), _jsxs(Section, { name: "overlay", children: [_jsx(Dialog, { open: true, children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Dialog title" }), _jsx(DialogDescription, { children: "Dialog description" })] }), _jsx(DialogFooter, { children: _jsx(Button, { size: "sm", children: "OK" }) })] }) }), _jsxs(DropdownMenu, { open: true, children: [_jsx(DropdownMenuTrigger, { children: "Menu" }), _jsxs(DropdownMenuContent, { children: [_jsx(DropdownMenuLabel, { children: "Label" }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { children: "Item" })] })] }), _jsxs(Popover, { open: true, children: [_jsx(PopoverTrigger, { children: "Popover" }), _jsx(PopoverContent, { children: "Popover content" })] }), _jsxs(Select, { open: true, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Select" }) }), _jsx(SelectContent, { children: _jsx(SelectItem, { value: "x", index: 0, children: "Option" }) })] }), _jsx(TooltipProvider, { delay: 0, children: _jsxs(Tooltip, { open: true, children: [_jsx(TooltipTrigger, { children: "Tooltip" }), _jsx(TooltipContent, { children: "Tooltip content" })] }) }), _jsx(Toaster, {})] }), _jsxs(Section, { name: "layout", children: [_jsx(Grid, { min: 240, gap: "$3", style: { width: '100%' }, "data-grid": "auto", children: [0, 1, 2, 3, 4, 5, 6].map((i) => (_jsxs(Card, { children: [_jsx(CardMedia, { ratio: 16 / 10, children: _jsx("img", { src: SWATCH, alt: "" }) }), _jsxs(CardHeader, { children: [_jsxs(CardTitle, { children: ["Card ", i] }), _jsx(CardDescription, { children: "Sized by its content, never by a pinned height." })] })] }, i))) }), _jsxs(Grid, { min: 900, gap: "$3", style: { width: '100%' }, "data-grid": "wide", children: [_jsx(Card, { children: _jsx(CardContent, { children: "wide" }) }), _jsx(Card, { children: _jsx(CardContent, { children: "wide" }) })] }), _jsx("div", { style: { width: '100%', overflow: 'hidden' }, children: _jsxs(Grid, { cols: 3, gap: "$3", style: { width: '100%' }, "data-grid": "fixed", children: [_jsx(Card, { children: _jsx(CardContent, { children: "short" }) }), _jsx(Card, { children: _jsx(CardContent, { children: _jsx("span", { style: { whiteSpace: 'nowrap' }, children: "MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM" }) }) }), _jsx(Card, { children: _jsx(CardContent, { children: "short" }) })] }) }), _jsxs("div", { "data-grid": "growth", style: { display: 'flex', alignItems: 'flex-start', gap: 12, width: '100%' }, children: [_jsx(Card, { "data-card": "lean", children: _jsx(CardContent, { children: "one line" }) }), _jsxs(Card, { "data-card": "fat", children: [_jsx(CardContent, { children: "one line" }), _jsx(CardContent, { children: "two line" }), _jsx(CardContent, { children: "three line" }), _jsx(CardContent, { children: "four line" })] })] }), _jsx(Card, { interactive: true, "data-card": "interactive", children: _jsx(CardHeader, { children: _jsx(CardTitle, { children: "Interactive card" }) }) }), _jsx(PageSection, { maxWidth: 600, "data-section": "demo", children: _jsx(CardTitle, { children: "Section" }) }), _jsx(CardTitle, { fontFamily: "$mono", "data-type": "mono", children: "1234567890" }), _jsx(Button, { "data-button": "block-child", children: _jsx("span", { "data-block-child": true, style: { display: 'block', height: 119, width: 119 } }) })] })] }));
19
28
  export default Gallery;
20
29
  //# sourceMappingURL=gallery.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"gallery.js","sourceRoot":"","sources":["../src/gallery.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"gallery.js","sourceRoot":"","sources":["../src/gallery.tsx"],"names":[],"mappings":"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"}
@@ -30,6 +30,11 @@ const gui_1 = require("@hanzo/gui");
30
30
  // names them.
31
31
  // ─────────────────────────────────────────────────────────────────────────────
32
32
  const GEIST = "'Geist', system-ui, -apple-system, sans-serif";
33
+ /** The numeric/code/id face. Byte-for-byte the stack `.mono` sets in
34
+ * styles/motion.css — the class and the `$mono` token have to resolve to the
35
+ * same face or the same number renders in two different fonts depending on
36
+ * which one a component reached for. */
37
+ const GEIST_MONO = "'Geist Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace";
33
38
  /** Type — SIX sizes in the app, matching the host's `--text-*` design tokens.
34
39
  * $1 label · $2 nav + dense body · $3 base · $4/$5 emphasis · $6 section head ·
35
40
  * $7 page title · $8+ display. `$5` collapses onto 15 to retire the 16px base
@@ -147,6 +152,12 @@ exports.config = (0, gui_1.createGui)({
147
152
  ...v5_1.defaultConfig.fonts,
148
153
  body: { ...v5_1.defaultConfig.fonts.body, family: GEIST, size: FONT_SIZE, lineHeight: LINE_HEIGHT },
149
154
  heading: { ...v5_1.defaultConfig.fonts.heading, family: GEIST, size: FONT_SIZE, lineHeight: LINE_HEIGHT },
155
+ // `$mono` was NOT defined here, and gui emits NO class for a font token it
156
+ // does not know — no warning, no fallback, a green build and text that is
157
+ // simply not monospace. 260 `fontFamily="$mono"` call sites across 74 files
158
+ // in hanzo.app were dead on that alone. A missing token has to be a defined
159
+ // token, not a silent no-op, so it is defined.
160
+ mono: { ...v5_1.defaultConfig.fonts.body, family: GEIST_MONO, size: FONT_SIZE, lineHeight: LINE_HEIGHT },
150
161
  },
151
162
  });
152
163
  exports.default = exports.config;
@@ -548,6 +548,188 @@ export declare const config: import("@hanzogui/web").GuiInternalConfig<{
548
548
  };
549
549
  }> | undefined>;
550
550
  };
551
+ mono: {
552
+ family: string;
553
+ size: {
554
+ readonly 1: 11;
555
+ readonly 2: 13;
556
+ readonly 3: 14;
557
+ readonly 4: 15;
558
+ readonly 5: 15;
559
+ readonly 6: 17;
560
+ readonly 7: 21;
561
+ readonly 8: 26;
562
+ readonly 9: 26;
563
+ readonly 10: 32;
564
+ readonly 11: 40;
565
+ readonly 12: 48;
566
+ readonly 13: 56;
567
+ readonly 14: 64;
568
+ readonly 15: 80;
569
+ readonly 16: 96;
570
+ readonly true: 14;
571
+ };
572
+ lineHeight: {
573
+ readonly 1: 16;
574
+ readonly 2: 18;
575
+ readonly 3: 20;
576
+ readonly 4: 22;
577
+ readonly 5: 22;
578
+ readonly 6: 24;
579
+ readonly 7: 28;
580
+ readonly 8: 32;
581
+ readonly 9: 32;
582
+ readonly 10: 38;
583
+ readonly 11: 46;
584
+ readonly 12: 54;
585
+ readonly 13: 62;
586
+ readonly 14: 70;
587
+ readonly 15: 86;
588
+ readonly 16: 102;
589
+ readonly true: 20;
590
+ };
591
+ weight: {
592
+ 1: any;
593
+ 5: any;
594
+ 7: any;
595
+ 12: any;
596
+ 2: any;
597
+ 3: any;
598
+ 16: any;
599
+ 4: any;
600
+ 6: any;
601
+ true: any;
602
+ 10: any;
603
+ 8: any;
604
+ 11: any;
605
+ 9: any;
606
+ 15: any;
607
+ 14: any;
608
+ 13: any;
609
+ };
610
+ letterSpacing: {
611
+ 1: any;
612
+ 5: any;
613
+ 7: any;
614
+ 12: any;
615
+ 2: any;
616
+ 3: any;
617
+ 16: any;
618
+ 4: any;
619
+ 6: any;
620
+ true: any;
621
+ 10: any;
622
+ 8: any;
623
+ 11: any;
624
+ 9: any;
625
+ 15: any;
626
+ 14: any;
627
+ 13: any;
628
+ };
629
+ style: {
630
+ 1: any;
631
+ 5: any;
632
+ 7: any;
633
+ 12: any;
634
+ 2: any;
635
+ 3: any;
636
+ 16: any;
637
+ 4: any;
638
+ 6: any;
639
+ true: any;
640
+ 10: any;
641
+ 8: any;
642
+ 11: any;
643
+ 9: any;
644
+ 15: any;
645
+ 14: any;
646
+ 13: any;
647
+ };
648
+ transform: {
649
+ 1: any;
650
+ 5: any;
651
+ 7: any;
652
+ 12: any;
653
+ 2: any;
654
+ 3: any;
655
+ 16: any;
656
+ 4: any;
657
+ 6: any;
658
+ true: any;
659
+ 10: any;
660
+ 8: any;
661
+ 11: any;
662
+ 9: any;
663
+ 15: any;
664
+ 14: any;
665
+ 13: any;
666
+ };
667
+ color: {
668
+ 1: any;
669
+ 5: any;
670
+ 7: any;
671
+ 12: any;
672
+ 2: any;
673
+ 3: any;
674
+ 16: any;
675
+ 4: any;
676
+ 6: any;
677
+ true: any;
678
+ 10: any;
679
+ 8: any;
680
+ 11: any;
681
+ 9: any;
682
+ 15: any;
683
+ 14: any;
684
+ 13: any;
685
+ };
686
+ face: Partial<Partial<{
687
+ bold: {
688
+ normal?: string;
689
+ italic?: string;
690
+ };
691
+ normal: {
692
+ normal?: string;
693
+ italic?: string;
694
+ };
695
+ 100: {
696
+ normal?: string;
697
+ italic?: string;
698
+ };
699
+ 500: {
700
+ normal?: string;
701
+ italic?: string;
702
+ };
703
+ 700: {
704
+ normal?: string;
705
+ italic?: string;
706
+ };
707
+ 200: {
708
+ normal?: string;
709
+ italic?: string;
710
+ };
711
+ 300: {
712
+ normal?: string;
713
+ italic?: string;
714
+ };
715
+ 400: {
716
+ normal?: string;
717
+ italic?: string;
718
+ };
719
+ 600: {
720
+ normal?: string;
721
+ italic?: string;
722
+ };
723
+ 800: {
724
+ normal?: string;
725
+ italic?: string;
726
+ };
727
+ 900: {
728
+ normal?: string;
729
+ italic?: string;
730
+ };
731
+ }> | undefined>;
732
+ };
551
733
  }, {
552
734
  mediaQueryDefaultActive: {
553
735
  touchable: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"gui-config.d.ts","sourceRoot":"","sources":["../src/gui-config.ts"],"names":[],"mappings":"AA+IA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;aAYjB,CAAA;AAEF,eAAe,MAAM,CAAA;AAErB,MAAM,MAAM,IAAI,GAAG,OAAO,MAAM,CAAA"}
1
+ {"version":3,"file":"gui-config.d.ts","sourceRoot":"","sources":["../src/gui-config.ts"],"names":[],"mappings":"AAqJA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;aAkBjB,CAAA;AAEF,eAAe,MAAM,CAAA;AAErB,MAAM,MAAM,IAAI,GAAG,OAAO,MAAM,CAAA"}