@hanzo/ui 8.15.0 → 8.16.0

package/dist/gallery.cjs

@@ -6,6 +6,9 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const box_1 = require("./box.cjs");
 const Workbench_1 = require("./product/Workbench.cjs");
 const Skeleton_1 = require("./product/Skeleton.cjs");
+const ConnectionBadge_1 = require("./product/ConnectionBadge.cjs");
+const ProjectThumb_1 = require("./product/ProjectThumb.cjs");
+const Split_1 = require("./product/Split.cjs");
 const TooltipAnchor_1 = require("./product/TooltipAnchor.cjs");
 const DialogTemplate_1 = require("./product/DialogTemplate.cjs");
 const chat_1 = require("./chat/index.cjs");
@@ -71,7 +74,7 @@ const Section = ({ name, children }) => ((0, jsx_runtime_1.jsx)("section", { "da
  * Every component, once. `data-gallery` names each section so a browser test can
  * scope its assertions without depending on document order.
  */
-const Gallery = () => ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: 28, padding: 24, maxWidth: 928 }, children: [(0, jsx_runtime_1.jsx)(Section, { name: "type", children: (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', flexDirection: 'column', gap: 12, width: '100%' }, children: [11, 10, 9, 7, 6, 4, 3, 2, 1].map((rung) => ((0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: `$${rung}`, lineHeight: `$${rung}`, letterSpacing: `$${rung}`, children: "Hanzo \u2014 the Open AI Cloud" }, rung))) }) }), (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.jsxs)(gui_1.RadioGroup, { defaultValue: "a", children: [(0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "a" }), (0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "b" }), (0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "c", disabled: true })] }), (0, jsx_runtime_1.jsxs)(gui_1.RadioGroup, { orientation: "horizontal", defaultValue: "a", children: [(0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "a" }), (0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "b" })] })] }), (0, jsx_runtime_1.jsxs)(Section, { name: "toggle-group", children: [['default', 'outline'].map((variant) => ['default', 'sm', 'lg'].map((size) => ((0, jsx_runtime_1.jsxs)(gui_1.ToggleGroup, { type: "single", defaultValue: "a", variant: variant, size: size, children: [(0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "a", children: "A" }), (0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "b", children: "B" }), (0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "c", disabled: true, children: "C" })] }, `${variant}-${size}`)))), (0, jsx_runtime_1.jsxs)(gui_1.ToggleGroup, { type: "multiple", defaultValue: ['a'], children: [(0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "a", children: "A" }), (0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "b", children: "B" })] }), (0, jsx_runtime_1.jsxs)(gui_1.ToggleGroup, { type: "single", orientation: "vertical", defaultValue: "a", children: [(0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "a", children: "A" }), (0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "b", children: "B" })] })] }), (0, jsx_runtime_1.jsx)(Section, { name: "accordion", children: (0, jsx_runtime_1.jsxs)(gui_1.Accordion, { type: "single", collapsible: true, defaultValue: "one", children: [(0, jsx_runtime_1.jsxs)(gui_1.AccordionItem, { value: "one", children: [(0, jsx_runtime_1.jsx)(gui_1.AccordionTrigger, { children: "Accordion trigger" }), (0, jsx_runtime_1.jsx)(gui_1.AccordionContent, { children: "Accordion content" })] }), (0, jsx_runtime_1.jsxs)(gui_1.AccordionItem, { value: "two", children: [(0, jsx_runtime_1.jsx)(gui_1.AccordionTrigger, { children: "Second trigger" }), (0, jsx_runtime_1.jsx)(gui_1.AccordionContent, { children: "Second content" })] })] }) }), (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: "spinner", children: [12, 16, 20, 32].map((size) => ((0, jsx_runtime_1.jsx)(gui_1.Spinner, { size: size }, size))) }), (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.jsxs)(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)(gui_1.CommandDialog, { open: true, defaultValue: "alpha", onValueChange: (v) => {
+const Gallery = () => ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: 28, padding: 24, maxWidth: 928 }, children: [(0, jsx_runtime_1.jsx)(Section, { name: "type", children: (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', flexDirection: 'column', gap: 12, width: '100%' }, children: [11, 10, 9, 7, 6, 4, 3, 2, 1].map((rung) => ((0, jsx_runtime_1.jsx)(gui_1.Text, { fontSize: `$${rung}`, lineHeight: `$${rung}`, letterSpacing: `$${rung}`, children: "Hanzo \u2014 the Open AI Cloud" }, rung))) }) }), (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.jsxs)(gui_1.RadioGroup, { defaultValue: "a", children: [(0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "a" }), (0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "b" }), (0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "c", disabled: true })] }), (0, jsx_runtime_1.jsxs)(gui_1.RadioGroup, { orientation: "horizontal", defaultValue: "a", children: [(0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "a" }), (0, jsx_runtime_1.jsx)(gui_1.RadioGroupItem, { value: "b" })] })] }), (0, jsx_runtime_1.jsxs)(Section, { name: "toggle-group", children: [['default', 'outline'].map((variant) => ['default', 'sm', 'lg'].map((size) => ((0, jsx_runtime_1.jsxs)(gui_1.ToggleGroup, { type: "single", defaultValue: "a", variant: variant, size: size, children: [(0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "a", children: "A" }), (0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "b", children: "B" }), (0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "c", disabled: true, children: "C" })] }, `${variant}-${size}`)))), (0, jsx_runtime_1.jsxs)(gui_1.ToggleGroup, { type: "multiple", defaultValue: ['a'], children: [(0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "a", children: "A" }), (0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "b", children: "B" })] }), (0, jsx_runtime_1.jsxs)(gui_1.ToggleGroup, { type: "single", orientation: "vertical", defaultValue: "a", children: [(0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "a", children: "A" }), (0, jsx_runtime_1.jsx)(gui_1.ToggleGroupItem, { value: "b", children: "B" })] })] }), (0, jsx_runtime_1.jsx)(Section, { name: "accordion", children: (0, jsx_runtime_1.jsxs)(gui_1.Accordion, { type: "single", collapsible: true, defaultValue: "one", children: [(0, jsx_runtime_1.jsxs)(gui_1.AccordionItem, { value: "one", children: [(0, jsx_runtime_1.jsx)(gui_1.AccordionTrigger, { children: "Accordion trigger" }), (0, jsx_runtime_1.jsx)(gui_1.AccordionContent, { children: "Accordion content" })] }), (0, jsx_runtime_1.jsxs)(gui_1.AccordionItem, { value: "two", children: [(0, jsx_runtime_1.jsx)(gui_1.AccordionTrigger, { children: "Second trigger" }), (0, jsx_runtime_1.jsx)(gui_1.AccordionContent, { children: "Second content" })] })] }) }), (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.jsxs)(Section, { name: "connection-badge", children: [(0, jsx_runtime_1.jsx)(ConnectionBadge_1.ConnectionBadge, { method: "OAuth", extra: "acme/site", onDisconnect: () => { } }), (0, jsx_runtime_1.jsx)(ConnectionBadge_1.ConnectionBadge, { method: "API key", onDisconnect: () => { }, disconnecting: true })] }), (0, jsx_runtime_1.jsx)(Section, { name: "project-thumb", children: (0, jsx_runtime_1.jsx)("div", { style: { width: 240 }, children: (0, jsx_runtime_1.jsx)(ProjectThumb_1.ProjectThumb, { name: "Acme" }) }) }), (0, jsx_runtime_1.jsx)(Section, { name: "split", children: (0, jsx_runtime_1.jsx)("div", { style: { width: 360, height: 120 }, children: (0, jsx_runtime_1.jsx)(Split_1.Split, { left: (0, jsx_runtime_1.jsx)(box_1.Box, { children: "left" }), right: (0, jsx_runtime_1.jsx)(box_1.Box, { children: "right" }) }) }) }), (0, jsx_runtime_1.jsx)(Section, { name: "spinner", children: [12, 16, 20, 32].map((size) => ((0, jsx_runtime_1.jsx)(gui_1.Spinner, { size: size }, size))) }), (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.jsxs)(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)(gui_1.CommandDialog, { open: true, defaultValue: "alpha", onValueChange: (v) => {
                         const el = document.querySelector('[data-palette-selected]');
                         if (el)
                             el.setAttribute('data-palette-selected', v);

package/dist/gallery.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gallery.d.ts","sourceRoot":"","sources":["../src/gallery.tsx"],"names":[],"mappings":"AAkJA;;;GAGG;AACH,eAAO,MAAM,OAAO,+CA2kBnB,CAAA;eAEc,OAAO"}
+{"version":3,"file":"gallery.d.ts","sourceRoot":"","sources":["../src/gallery.tsx"],"names":[],"mappings":"AAqJA;;;GAGG;AACH,eAAO,MAAM,OAAO,+CA+lBnB,CAAA;eAEc,OAAO"}