@adea-ai/ui 0.105.0 → 0.106.0
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/README.md +44 -8
- package/dist/components/composites/action-button/action-button.d.ts.map +1 -1
- package/dist/components/composites/action-button/action-button.js +6 -8
- package/dist/components/composites/action-button/action-button.js.map +1 -1
- package/dist/components/composites/appearance-editor/accent-swatch-groups.d.ts +16 -0
- package/dist/components/composites/appearance-editor/accent-swatch-groups.d.ts.map +1 -0
- package/dist/components/composites/appearance-editor/accent-swatch-groups.js +151 -0
- package/dist/components/composites/appearance-editor/accent-swatch-groups.js.map +1 -0
- package/dist/components/composites/appearance-editor/appearance-choices.d.ts.map +1 -1
- package/dist/components/composites/appearance-editor/appearance-choices.js +24 -84
- package/dist/components/composites/appearance-editor/appearance-choices.js.map +1 -1
- package/dist/components/composites/appearance-editor/appearance-editor.d.ts +2 -2
- package/dist/components/composites/appearance-editor/appearance-editor.d.ts.map +1 -1
- package/dist/components/composites/appearance-editor/appearance-editor.js +25 -7
- package/dist/components/composites/appearance-editor/appearance-editor.js.map +1 -1
- package/dist/components/composites/appearance-editor/appearance-types.d.ts +9 -0
- package/dist/components/composites/appearance-editor/appearance-types.d.ts.map +1 -1
- package/dist/components/composites/appearance-editor/font-settings-group.d.ts +10 -0
- package/dist/components/composites/appearance-editor/font-settings-group.d.ts.map +1 -0
- package/dist/components/composites/appearance-editor/font-settings-group.js +310 -0
- package/dist/components/composites/appearance-editor/font-settings-group.js.map +1 -0
- package/dist/components/composites/appearance-editor/index.d.ts +2 -0
- package/dist/components/composites/appearance-editor/index.d.ts.map +1 -1
- package/dist/components/composites/appearance-editor/index.js +3 -1
- package/dist/components/composites/update-dialog/update-dialog.js +2 -2
- package/dist/components/composites/update-dialog/update-dialog.js.map +1 -1
- package/dist/components/conversation/message-row.d.ts.map +1 -1
- package/dist/components/conversation/message-row.js +3 -3
- package/dist/components/conversation/message-row.js.map +1 -1
- package/dist/components/conversation/paste-token-editor.js +1 -1
- package/dist/components/conversation/paste-token-editor.js.map +1 -1
- package/dist/components/layout/side-rail/side-rail.js +2 -2
- package/dist/components/layout/side-rail/side-rail.js.map +1 -1
- package/dist/components/layout/top-bar/top-bar.js +1 -1
- package/dist/components/layout/top-bar/top-bar.js.map +1 -1
- package/dist/components/theme/appearance-panel.d.ts +1 -1
- package/dist/components/theme/appearance-panel.d.ts.map +1 -1
- package/dist/components/theme/appearance-panel.js +45 -105
- package/dist/components/theme/appearance-panel.js.map +1 -1
- package/dist/components/theme/theme-provider.d.ts +5 -2
- package/dist/components/theme/theme-provider.d.ts.map +1 -1
- package/dist/components/theme/theme-provider.js +38 -19
- package/dist/components/theme/theme-provider.js.map +1 -1
- package/dist/components/ui/code-block/code-block.d.ts +3 -3
- package/dist/components/ui/code-block/code-block.js +6 -6
- package/dist/components/ui/code-block/code-block.js.map +1 -1
- package/dist/components/ui/command/command.js +1 -1
- package/dist/components/ui/command/command.js.map +1 -1
- package/dist/components/ui/context-menu/context-menu.js +1 -1
- package/dist/components/ui/context-menu/context-menu.js.map +1 -1
- package/dist/components/ui/diff-block/diff-block.js +5 -5
- package/dist/components/ui/diff-block/diff-block.js.map +1 -1
- package/dist/components/ui/dropdown-menu/dropdown-menu.d.ts.map +1 -1
- package/dist/components/ui/dropdown-menu/dropdown-menu.js +101 -8
- package/dist/components/ui/dropdown-menu/dropdown-menu.js.map +1 -1
- package/dist/components/ui/kbd/kbd.js +1 -1
- package/dist/components/ui/kbd/kbd.js.map +1 -1
- package/dist/components/ui/menubar/menubar.js +1 -1
- package/dist/components/ui/menubar/menubar.js.map +1 -1
- package/dist/components/ui/typography/typography.d.ts +3 -5
- package/dist/components/ui/typography/typography.d.ts.map +1 -1
- package/dist/components/ui/typography/typography.js +6 -8
- package/dist/components/ui/typography/typography.js.map +1 -1
- package/dist/index.js +6 -3
- package/dist/lib/appearance-font-settings.d.ts +53 -0
- package/dist/lib/appearance-font-settings.d.ts.map +1 -0
- package/dist/lib/appearance-font-settings.js +160 -0
- package/dist/lib/appearance-font-settings.js.map +1 -0
- package/dist/lib/font-catalog.d.ts +72 -0
- package/dist/lib/font-catalog.d.ts.map +1 -0
- package/dist/lib/font-catalog.js +71 -0
- package/dist/lib/font-catalog.js.map +1 -0
- package/dist/lib/safe-script.d.ts +3 -0
- package/dist/lib/safe-script.d.ts.map +1 -0
- package/dist/lib/safe-script.js +9 -0
- package/dist/lib/safe-script.js.map +1 -0
- package/dist/lib/tokens.d.ts +2 -19
- package/dist/lib/tokens.d.ts.map +1 -1
- package/dist/lib/tokens.js +63 -39
- package/dist/lib/tokens.js.map +1 -1
- package/dist/r/appearance-editor.json +11 -0
- package/dist/r/lib.json +15 -0
- package/dist/r/registry.json +33 -0
- package/dist/r/src/components/composites/action-button/action-button.tsx +2 -1
- package/dist/r/src/components/composites/appearance-editor/accent-swatch-groups.tsx +147 -0
- package/dist/r/src/components/composites/appearance-editor/appearance-choices.tsx +17 -74
- package/dist/r/src/components/composites/appearance-editor/appearance-editor.tsx +19 -6
- package/dist/r/src/components/composites/appearance-editor/appearance-types.ts +9 -0
- package/dist/r/src/components/composites/appearance-editor/font-settings-group.tsx +350 -0
- package/dist/r/src/components/composites/appearance-editor/index.ts +19 -0
- package/dist/r/src/components/composites/update-dialog/update-dialog.tsx +2 -2
- package/dist/r/src/components/conversation/message-row.tsx +7 -3
- package/dist/r/src/components/conversation/paste-token-editor.tsx +1 -1
- package/dist/r/src/components/layout/side-rail/side-rail.tsx +3 -3
- package/dist/r/src/components/layout/top-bar/top-bar.tsx +1 -1
- package/dist/r/src/components/theme/appearance-panel.tsx +34 -83
- package/dist/r/src/components/theme/theme-provider.tsx +50 -20
- package/dist/r/src/components/ui/code-block/code-block.tsx +6 -6
- package/dist/r/src/components/ui/command/command.tsx +1 -1
- package/dist/r/src/components/ui/context-menu/context-menu.tsx +1 -1
- package/dist/r/src/components/ui/diff-block/diff-block.tsx +7 -7
- package/dist/r/src/components/ui/dropdown-menu/dropdown-menu.tsx +145 -7
- package/dist/r/src/components/ui/kbd/kbd.tsx +1 -1
- package/dist/r/src/components/ui/menubar/menubar.tsx +1 -1
- package/dist/r/src/components/ui/typography/typography.tsx +6 -8
- package/dist/r/src/lib/appearance-font-settings.ts +233 -0
- package/dist/r/src/lib/font-catalog.ts +80 -0
- package/dist/r/src/lib/safe-script.ts +7 -0
- package/dist/r/src/lib/tokens.ts +64 -59
- package/dist/r/src/styles/appearance-font-settings.css +110 -0
- package/dist/r/src/styles/fonts.css +4 -5
- package/dist/r/src/styles/globals.css +4 -1
- package/dist/r/src/styles/theme.css +14 -0
- package/dist/r/theme.json +5 -0
- package/dist/r/theming.json +2 -0
- package/package.json +2 -1
- package/registry.json +33 -0
- package/src/components/composites/action-button/action-button.tsx +2 -1
- package/src/components/composites/appearance-editor/accent-swatch-groups.tsx +147 -0
- package/src/components/composites/appearance-editor/appearance-choices.tsx +17 -74
- package/src/components/composites/appearance-editor/appearance-editor.tsx +19 -6
- package/src/components/composites/appearance-editor/appearance-types.ts +9 -0
- package/src/components/composites/appearance-editor/font-settings-group.tsx +350 -0
- package/src/components/composites/appearance-editor/index.ts +19 -0
- package/src/components/composites/update-dialog/update-dialog.tsx +2 -2
- package/src/components/conversation/message-row.tsx +7 -3
- package/src/components/conversation/paste-token-editor.tsx +1 -1
- package/src/components/layout/side-rail/side-rail.tsx +3 -3
- package/src/components/layout/top-bar/top-bar.tsx +1 -1
- package/src/components/theme/appearance-panel.tsx +34 -83
- package/src/components/theme/theme-provider.tsx +50 -20
- package/src/components/ui/code-block/code-block.tsx +6 -6
- package/src/components/ui/command/command.tsx +1 -1
- package/src/components/ui/context-menu/context-menu.tsx +1 -1
- package/src/components/ui/diff-block/diff-block.tsx +7 -7
- package/src/components/ui/dropdown-menu/dropdown-menu.tsx +145 -7
- package/src/components/ui/kbd/kbd.tsx +1 -1
- package/src/components/ui/menubar/menubar.tsx +1 -1
- package/src/components/ui/typography/typography.tsx +6 -8
- package/src/lib/appearance-font-settings.ts +233 -0
- package/src/lib/font-catalog.ts +80 -0
- package/src/lib/safe-script.ts +7 -0
- package/src/lib/tokens.ts +64 -59
- package/src/styles/appearance-font-settings.css +110 -0
- package/src/styles/fonts.css +4 -5
- package/src/styles/globals.css +4 -1
- package/src/styles/theme.css +14 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu.js","names":["DropdownMenu","KobalteDropdownMenu","Check","ChevronRight","Circle","ComponentProps","splitProps","menuContentPadding","destructiveMenuItem","menuItem","menuLabel","menuSeparator","overlayMotion","overlaySurface","popoverArrow","cn","props","local","rest","_$createComponent","_$mergeProps","modal","DropdownMenuTrigger","Trigger","DropdownMenuPortal","Portal","DropdownMenuContentProps","Content","hideArrow","portalMount","HTMLElement","DropdownMenuContent","mount","children","class","_$memo","Arrow","DropdownMenuItem","Item","variant","shortcut","keyshortcuts","aria-keyshortcuts","_el$","_tmpl$","_$insert","DropdownMenuShortcut","_el$2","_tmpl$2","_$spread","DropdownMenuCheckboxItem","CheckboxItem","ItemIndicator","DropdownMenuRadioGroup","RadioGroup","DropdownMenuRadioItem","RadioItem","DropdownMenuLabel","GroupLabel","DropdownMenuGroup","Group","DropdownMenuSeparator","Separator","DropdownMenuSub","Sub","DropdownMenuSubTrigger","SubTrigger","DropdownMenuSubContent","SubContent","DropdownMenu","_$createComponent","KobalteDropdownMenu","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as KobalteDropdownMenu } from '@kobalte/core/dropdown-menu'\nimport { Check, ChevronRight, Circle } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport {\n menuContentPadding,\n destructiveMenuItem,\n menuItem,\n menuLabel,\n menuSeparator,\n overlayMotion,\n overlaySurface,\n popoverArrow,\n} from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * DropdownMenu.\n *\n * A list of actions on a trigger, with radio groups for persistent choices\n * that fit naturally in a compact menu. Use Select for form inputs whose\n * selected value needs the field-style control, and Popover for arbitrary\n * content.\n *\n * Kobalte supplies the full menu contract — arrow keys, typeahead, the roving\n * highlight, Escape to close and return focus — which is exactly what a\n * hand-rolled `div` with click handlers gets wrong.\n * Menus are nonmodal by default so their generated focus guards do not become\n * invalid direct children of the ARIA menu. Set `modal` explicitly when the\n * surrounding interaction needs modal containment.\n *\n * The `destructive` variant marks the row with a status-coloured edge and\n * highlighted tint while keeping its label on the body foreground. Pairing it\n * with an AlertDialog is the caller's job.\n */\nexport function DropdownMenu(props: ComponentProps<typeof KobalteDropdownMenu>) {\n const [local, rest] = splitProps(props, ['modal'])\n return <KobalteDropdownMenu modal={local.modal ?? false} {...rest} />\n}\n\nexport function DropdownMenuTrigger(props: ComponentProps<typeof KobalteDropdownMenu.Trigger>) {\n return <KobalteDropdownMenu.Trigger {...props} />\n}\n\nexport function DropdownMenuPortal(props: ComponentProps<typeof KobalteDropdownMenu.Portal>) {\n return <KobalteDropdownMenu.Portal {...props} />\n}\n\nexport type DropdownMenuContentProps = ComponentProps<typeof KobalteDropdownMenu.Content> & {\n hideArrow?: boolean\n /** Mount under an owner element such as a modal, keeping the menu in its accessible subtree. */\n portalMount?: HTMLElement\n}\n\nexport function DropdownMenuContent(props: DropdownMenuContentProps) {\n const [local, rest] = splitProps(props, ['class', 'hideArrow', 'children', 'portalMount'])\n\n return (\n <KobalteDropdownMenu.Portal mount={local.portalMount}>\n <KobalteDropdownMenu.Content\n class={cn(\n overlaySurface,\n overlayMotion,\n 'z-(--z-menu) min-w-[10rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n menuContentPadding,\n local.class\n )}\n {...rest}\n >\n {!local.hideArrow && <KobalteDropdownMenu.Arrow aria-hidden=\"true\" class={popoverArrow} />}\n {local.children}\n </KobalteDropdownMenu.Content>\n </KobalteDropdownMenu.Portal>\n )\n}\n\nexport function DropdownMenuItem(\n props: ComponentProps<typeof KobalteDropdownMenu.Item> & {\n /** Colour the row as a destructive action. Confirm it separately. */\n variant?: 'default' | 'destructive'\n /** Draw a shortcut hint at the trailing edge of the row. */\n shortcut?: string\n /**\n * The parseable chord behind `shortcut`, e.g. `Meta+E`. The drawn glyph is\n * `aria-hidden` — reading it out would pollute the item's accessible name —\n * so this is what assistive technology announces instead. Supply it\n * whenever `shortcut` is drawn.\n */\n keyshortcuts?: string\n }\n) {\n const [local, rest] = splitProps(props, [\n 'class',\n 'variant',\n 'shortcut',\n 'keyshortcuts',\n 'children',\n ])\n\n return (\n <KobalteDropdownMenu.Item\n class={cn(\n menuItem,\n {\n [destructiveMenuItem]: local.variant === 'destructive',\n },\n local.class\n )}\n aria-keyshortcuts={local.keyshortcuts}\n {...rest}\n >\n {local.children}\n {local.shortcut ? (\n <span\n aria-hidden=\"true\"\n class=\"text-muted-foreground ms-auto font-mono text-2xs tracking-widest\"\n >\n {local.shortcut}\n </span>\n ) : null}\n </KobalteDropdownMenu.Item>\n )\n}\n\n/**\n * The chord drawn at a row's trailing edge.\n *\n * A component as well as the `shortcut` prop on an item, because a caller composing\n * a row by hand needs the same treatment — and because the alternative is every\n * caller inventing the same mono-and-dimmed span.\n *\n * The glyphs are decorative: the span is `aria-hidden` and the parseable chord\n * belongs in the row's `aria-keyshortcuts`, so the item's accessible name stays\n * exactly its label.\n */\nexport function DropdownMenuShortcut(props: ComponentProps<'span'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n aria-hidden=\"true\"\n class={cn('text-muted-foreground ms-auto font-mono text-2xs tracking-widest', local.class)}\n {...rest}\n />\n )\n}\n\nexport function DropdownMenuCheckboxItem(\n props: ComponentProps<typeof KobalteDropdownMenu.CheckboxItem>\n) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteDropdownMenu.CheckboxItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n {local.children}\n <KobalteDropdownMenu.ItemIndicator\n data-slot=\"dropdown-menu-indicator\"\n class=\"absolute end-2 flex size-4 items-center justify-center text-primary\"\n >\n <Check class=\"size-4\" />\n </KobalteDropdownMenu.ItemIndicator>\n </KobalteDropdownMenu.CheckboxItem>\n )\n}\n\nexport function DropdownMenuRadioGroup(\n props: ComponentProps<typeof KobalteDropdownMenu.RadioGroup>\n) {\n return <KobalteDropdownMenu.RadioGroup {...props} />\n}\n\nexport function DropdownMenuRadioItem(props: ComponentProps<typeof KobalteDropdownMenu.RadioItem>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteDropdownMenu.RadioItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n {local.children}\n {/* The indicator reads in the accent, like every other selected state in\n the system — a canvas-colored dot on a checked row reads as decoration. */}\n <KobalteDropdownMenu.ItemIndicator\n data-slot=\"dropdown-menu-indicator\"\n class=\"absolute end-2 flex size-4 items-center justify-center text-primary\"\n >\n <Circle class=\"size-2 fill-current\" />\n </KobalteDropdownMenu.ItemIndicator>\n </KobalteDropdownMenu.RadioItem>\n )\n}\n\n/**\n * The caption of a `DropdownMenuGroup`, and that group's accessible name. It must be a\n * child of the group it names: Kobalte reads the group from context, so a label\n * placed directly in the content throws `useMenuGroupContext must be used within\n * a Menu.Group` the moment the menu opens. For an ungrouped caption, wrap the\n * label and its items in a group anyway — the grouping is what a screen reader\n * announces.\n */\nexport function DropdownMenuLabel(props: ComponentProps<typeof KobalteDropdownMenu.GroupLabel>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDropdownMenu.GroupLabel class={cn(menuLabel, local.class)} {...rest} />\n}\n\nexport function DropdownMenuGroup(props: ComponentProps<typeof KobalteDropdownMenu.Group>) {\n return <KobalteDropdownMenu.Group {...props} />\n}\n\nexport function DropdownMenuSeparator(props: ComponentProps<typeof KobalteDropdownMenu.Separator>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDropdownMenu.Separator class={cn(menuSeparator, local.class)} {...rest} />\n}\n\nexport function DropdownMenuSub(props: ComponentProps<typeof KobalteDropdownMenu.Sub>) {\n return <KobalteDropdownMenu.Sub {...props} />\n}\n\nexport function DropdownMenuSubTrigger(\n props: ComponentProps<typeof KobalteDropdownMenu.SubTrigger>\n) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteDropdownMenu.SubTrigger class={cn(menuItem, local.class)} {...rest}>\n {local.children}\n <ChevronRight class=\"ms-auto size-4\" />\n </KobalteDropdownMenu.SubTrigger>\n )\n}\n\nexport function DropdownMenuSubContent(\n props: ComponentProps<typeof KobalteDropdownMenu.SubContent>\n) {\n const [local, rest] = splitProps(props, ['class'])\n\n return (\n <KobalteDropdownMenu.Portal>\n <KobalteDropdownMenu.SubContent\n class={cn(\n overlaySurface,\n overlayMotion,\n 'z-(--z-menu) min-w-[8rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n menuContentPadding,\n local.class\n )}\n {...rest}\n />\n </KobalteDropdownMenu.Portal>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA,SAAgBA,eAAagB,OAAmD;CAC9E,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,gBAAQlB,cAAmBmB,WAAA,EAAA,IAACC,QAAK;EAAA,OAAEJ,MAAMI,SAAS;CAAK,EAAA,GAAMH,IAAI,CAAA;AACnE;AAEA,SAAgBI,oBAAoBN,OAA2D;CAC7F,OAAAG,gBAAQlB,aAAoBsB,SAAYP,KAAK;AAC/C;AAEA,SAAgBQ,mBAAmBR,OAA0D;CAC3F,OAAAG,gBAAQlB,aAAoBwB,QAAWT,KAAK;AAC9C;AAQA,SAAgBe,oBAAoBf,OAAiC;CACnE,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO;EAAC;EAAS;EAAa;EAAY;CAAa,CAAC;CAEzF,OAAAG,gBACGlB,aAAoBwB,QAAM;EAAA,IAACO,QAAK;GAAA,OAAEf,MAAMY;EAAW;EAAA,IAAAI,WAAA;GAAA,OAAAd,gBACjDlB,aAAoB0B,SAAOP,WAAA,EAAA,KAAA,WAAA;IAAA,OACnBL,GACLF,gBACAD,eACA,0FAAA,OAEAK,MAAMiB,KACR;GAAC,EAAA,GACGhB,MAAI,EAAA,IAAAe,WAAA;IAAA,OAAA,CAAAE,WAEPA,WAAA,CAAA,CAAA,CAAClB,MAAMW,SAAS,CAAA,CAAA,KAAAT,gBAAKlB,aAAoBmC,OAAK;KAAA,eAAA;KAAA,SAAA;IAAuC,CAAA,CAAI,GAAAD,WACzFlB,MAAMgB,QAAQ,CAAA;GAAA,EAAA,CAAA,CAAA;EAAA;CAAA,CAAA;AAIvB;AAEA,SAAgBI,iBACdrB,OAaA;CACA,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO;EACtC;EACA;EACA;EACA;EACA;CAAU,CACX;CAED,OAAAG,gBACGlB,aAAoBqC,MAAIlB,WAAA;EAAA,KAAA,WAAA;GAAA,OAChBL,GACLN,UACA,GACGD,sBAAsBS,MAAMsB,YAAY,cAC3C,GACAtB,MAAMiB,KACR;EAAC;EAAA,KAAA,uBAAA;GAAA,OACkBjB,MAAMwB;EAAY;CAAA,GACjCvB,MAAI,EAAA,IAAAe,WAAA;EAAA,OAAA,CAAAE,WAEPlB,MAAMgB,QAAQ,GAAAE,WACdA,WAAA,CAAA,CAAAlB,MAAMuB,QAAQ,CAAA,CAAA,WAAA;GAAA,IAAAG,OAAAC,OAAA;GAAAC,OAAAF,YAKV1B,MAAMuB,QAAQ;GAAA,OAAAG;EAAA,EAAA,CAAA,IAEf,IAAI,CAAA;CAAA,EAAA,CAAA,CAAA;AAGd;;;;;;;;;;;;AAaA,SAAgBG,qBAAqB9B,OAA+B;CAClE,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAA+B,QAAAC,QAAA;EAAAC,OAAAF,OAAA3B,WAAA,EAAA,KAAA,WAAA;GAAA,OAIWL,GAAG,oEAAoEE,MAAMiB,KAAK;EAAC,EAAA,GACtFhB,IAAI,GAAA,OAAA,KAAA;EAAA,OAAA6B;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBG,yBACdlC,OACA;CACA,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGlB,aAAoBkD,cAAY/B,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQL,GAAGN,UAAU,QAAQQ,MAAMiB,KAAK;CAAC,EAAA,GAAMhB,MAAI,EAAA,IAAAe,WAAA;EAAA,OAAA,CAAAE,WACjFlB,MAAMgB,QAAQ,GAAAd,gBACdlB,aAAoBmD,eAAa;GAAA,aAAA;GAAA,SAAA;GAAA,IAAAnB,WAAA;IAAA,OAAAd,gBAI/BjB,OAAK,EAAA,SAAA,SAAA,CAAA;GAAA;EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAId;AAEA,SAAgBmD,uBACdrC,OACA;CACA,OAAAG,gBAAQlB,aAAoBqD,YAAetC,KAAK;AAClD;AAEA,SAAgBuC,sBAAsBvC,OAA6D;CACjG,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGlB,aAAoBuD,WAASpC,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQL,GAAGN,UAAU,QAAQQ,MAAMiB,KAAK;CAAC,EAAA,GAAMhB,MAAI,EAAA,IAAAe,WAAA;EAAA,OAAA,CAAAE,WAC9ElB,MAAMgB,QAAQ,GAAAd,gBAGdlB,aAAoBmD,eAAa;GAAA,aAAA;GAAA,SAAA;GAAA,IAAAnB,WAAA;IAAA,OAAAd,gBAI/Bf,QAAM,EAAA,SAAA,sBAAA,CAAA;GAAA;EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAIf;;;;;;;;;AAUA,SAAgBqD,kBAAkBzC,OAA8D;CAC9F,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,gBAAQlB,aAAoByD,YAAUtC,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQL,GAAGL,WAAWO,MAAMiB,KAAK;CAAC,EAAA,GAAMhB,IAAI,CAAA;AACpF;AAEA,SAAgByC,kBAAkB3C,OAAyD;CACzF,OAAAG,gBAAQlB,aAAoB2D,OAAU5C,KAAK;AAC7C;AAEA,SAAgB6C,sBAAsB7C,OAA6D;CACjG,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,gBAAQlB,aAAoB6D,WAAS1C,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQL,GAAGJ,eAAeM,MAAMiB,KAAK;CAAC,EAAA,GAAMhB,IAAI,CAAA;AACvF;AAEA,SAAgB6C,gBAAgB/C,OAAuD;CACrF,OAAAG,gBAAQlB,aAAoB+D,KAAQhD,KAAK;AAC3C;AAEA,SAAgBiD,uBACdjD,OACA;CACA,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAG,gBACGlB,aAAoBiE,YAAU9C,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQL,GAAGN,UAAUQ,MAAMiB,KAAK;CAAC,EAAA,GAAMhB,MAAI,EAAA,IAAAe,WAAA;EAAA,OAAA,CAAAE,WACvElB,MAAMgB,QAAQ,GAAAd,gBACdhB,cAAY,EAAA,SAAA,iBAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAGnB;AAEA,SAAgBgE,uBACdnD,OACA;CACA,MAAM,CAACC,OAAOC,QAAQZ,WAAWU,OAAO,CAAC,OAAO,CAAC;CAEjD,OAAAG,gBACGlB,aAAoBwB,QAAM,EAAA,IAAAQ,WAAA;EAAA,OAAAd,gBACxBlB,aAAoBmE,YAAUhD,WAAA,EAAA,KAAA,WAAA;GAAA,OACtBL,GACLF,gBACAD,eACA,yFAAA,OAEAK,MAAMiB,KACR;EAAC,EAAA,GACGhB,IAAI,CAAA;CAAA,EAAA,CAAA;AAIhB"}
|
|
1
|
+
{"version":3,"file":"dropdown-menu.js","names":["DropdownMenu","KobalteDropdownMenu","Check","ChevronRight","Circle","Accessor","ComponentProps","createContext","splitProps","useContext","menuContentPadding","destructiveMenuItem","menuItem","menuLabel","menuSeparator","overlayMotion","overlaySurface","popoverArrow","cn","MenuOrientation","DropdownMenuOrientationContext","HandlerEvent","Handler","args","Arguments","DropdownMenuTriggerKeyEvent","NonNullable","Trigger","DropdownMenuTriggerPointerEvent","props","local","rest","orientation","_$createComponent","Provider","value","children","_$mergeProps","modal","SCROLLABLE_OVERFLOW","OVERFLOW_PROPERTIES","const","OverflowProperty","OverflowDeclaration","Readonly","property","priority","readInlineOverflow","element","HTMLElement","map","style","getPropertyValue","getPropertyPriority","declarationsMatch","declarations","every","bypassUnboundedScrollLookup","trigger","scrollRoot","document","scrollingElement","documentElement","window","getComputedStyle","overflow","temporaryStyles","Array","original","applied","parent","parentElement","computed","overflowX","overflowY","test","setProperty","push","length","queueMicrotask","isConnected","removeProperty","DropdownMenuTrigger","inheritedOrientation","onPointerDown","event","disabled","defaultPrevented","isPrimary","button","altKey","ctrlKey","metaKey","shiftKey","currentTarget","isNativeLink","HTMLAnchorElement","hasAttribute","focus","preventScroll","onKeyDown","menubarOrientation","closest","getAttribute","openingArrow","includes","key","DropdownMenuPortal","Portal","DropdownMenuContentProps","Content","hideArrow","portalMount","DropdownMenuContent","mount","class","_$memo","Arrow","DropdownMenuItem","Item","variant","shortcut","keyshortcuts","aria-keyshortcuts","_el$","_tmpl$","_$insert","DropdownMenuShortcut","_el$2","_tmpl$2","_$spread","DropdownMenuCheckboxItem","CheckboxItem","ItemIndicator","DropdownMenuRadioGroup","RadioGroup","DropdownMenuRadioItem","RadioItem","DropdownMenuLabel","GroupLabel","DropdownMenuGroup","Group","DropdownMenuSeparator","Separator","DropdownMenuSub","Sub","DropdownMenuSubTrigger","SubTrigger","DropdownMenuSubContent","SubContent","DropdownMenu","_$createComponent","KobalteDropdownMenu","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { DropdownMenu as KobalteDropdownMenu } from '@kobalte/core/dropdown-menu'\nimport { Check, ChevronRight, Circle } from 'lucide-solid'\nimport type { Accessor, ComponentProps } from 'solid-js'\nimport { createContext, splitProps, useContext } from 'solid-js'\nimport {\n menuContentPadding,\n destructiveMenuItem,\n menuItem,\n menuLabel,\n menuSeparator,\n overlayMotion,\n overlaySurface,\n popoverArrow,\n} from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\ntype MenuOrientation = 'horizontal' | 'vertical'\nconst DropdownMenuOrientationContext = createContext<Accessor<MenuOrientation | undefined>>()\ntype HandlerEvent<Handler> = Handler extends (...args: infer Arguments) => void\n ? Arguments[0]\n : never\ntype DropdownMenuTriggerKeyEvent = HandlerEvent<\n NonNullable<ComponentProps<typeof KobalteDropdownMenu.Trigger>['onKeyDown']>\n>\ntype DropdownMenuTriggerPointerEvent = HandlerEvent<\n NonNullable<ComponentProps<typeof KobalteDropdownMenu.Trigger>['onPointerDown']>\n>\n\n/**\n * DropdownMenu.\n *\n * A list of actions on a trigger, with radio groups for persistent choices\n * that fit naturally in a compact menu. Use Select for form inputs whose\n * selected value needs the field-style control, and Popover for arbitrary\n * content.\n *\n * Kobalte supplies the full menu contract — arrow keys, typeahead, the roving\n * highlight, Escape to close and return focus — which is exactly what a\n * hand-rolled `div` with click handlers gets wrong.\n * Menus are nonmodal by default so their generated focus guards do not become\n * invalid direct children of the ARIA menu. Set `modal` explicitly when the\n * surrounding interaction needs modal containment.\n *\n * The `destructive` variant marks the row with a status-coloured edge and\n * highlighted tint while keeping its label on the body foreground. Pairing it\n * with an AlertDialog is the caller's job.\n */\nexport function DropdownMenu(props: ComponentProps<typeof KobalteDropdownMenu>) {\n const [local, rest] = splitProps(props, ['modal', 'orientation'])\n const orientation = () => local.orientation\n return (\n <DropdownMenuOrientationContext.Provider value={orientation}>\n <KobalteDropdownMenu modal={local.modal ?? false} orientation={local.orientation} {...rest} />\n </DropdownMenuOrientationContext.Provider>\n )\n}\n\nconst SCROLLABLE_OVERFLOW = /(auto|scroll)/\nconst OVERFLOW_PROPERTIES = ['overflow', 'overflow-x', 'overflow-y'] as const\n\ntype OverflowProperty = (typeof OVERFLOW_PROPERTIES)[number]\ntype OverflowDeclaration = Readonly<{\n property: OverflowProperty\n value: string\n priority: string\n}>\n\nfunction readInlineOverflow(element: HTMLElement): OverflowDeclaration[] {\n return OVERFLOW_PROPERTIES.map((property) => ({\n property,\n value: element.style.getPropertyValue(property),\n priority: element.style.getPropertyPriority(property),\n }))\n}\n\nfunction declarationsMatch(element: HTMLElement, declarations: OverflowDeclaration[]) {\n return declarations.every(\n ({ property, value, priority }) =>\n element.style.getPropertyValue(property) === value &&\n element.style.getPropertyPriority(property) === priority\n )\n}\n\nfunction bypassUnboundedScrollLookup(trigger: HTMLElement) {\n const scrollRoot = document.scrollingElement ?? document.documentElement\n if (window.getComputedStyle(scrollRoot).overflow !== 'hidden') return\n\n const temporaryStyles: Array<{\n element: HTMLElement\n original: OverflowDeclaration[]\n applied: OverflowDeclaration[]\n }> = []\n\n for (let element: HTMLElement | null = trigger; element;) {\n const parent: HTMLElement | null = element.parentElement\n if (element !== scrollRoot) {\n const computed = window.getComputedStyle(element)\n const overflow = `${computed.overflow} ${computed.overflowX} ${computed.overflowY}`\n if (SCROLLABLE_OVERFLOW.test(overflow)) {\n const original = readInlineOverflow(element)\n element.style.setProperty('overflow', 'clip', 'important')\n temporaryStyles.push({ element, original, applied: readInlineOverflow(element) })\n }\n }\n element = parent\n }\n\n if (temporaryStyles.length === 0) return\n\n // Kobalte's keyboard path synchronously walks scroll parents before it opens\n // the menu. Clipping only non-root scroll ancestors makes that walk stop at\n // the locked viewport. Restore those declarations once the event handler\n // finishes, and leave any newer owner write untouched.\n queueMicrotask(() => {\n for (const { element, original, applied } of temporaryStyles) {\n if (!element.isConnected || !declarationsMatch(element, applied)) continue\n for (const property of OVERFLOW_PROPERTIES) element.style.removeProperty(property)\n for (const { property, value, priority } of original) {\n if (value) element.style.setProperty(property, value, priority)\n }\n }\n })\n}\n\nexport function DropdownMenuTrigger(props: ComponentProps<typeof KobalteDropdownMenu.Trigger>) {\n const inheritedOrientation = useContext(DropdownMenuOrientationContext)\n const [local, rest] = splitProps(props, ['disabled', 'onKeyDown', 'onPointerDown'])\n const onPointerDown = (event: DropdownMenuTriggerPointerEvent) => {\n if (typeof local.onPointerDown === 'function') local.onPointerDown(event)\n else if (local.onPointerDown) local.onPointerDown[0](local.onPointerDown[1], event)\n\n // WebKit can leave focus on a previous control when a native button gets\n // a pointer click. Focus the trigger before Kobalte opens the menu so an\n // enclosing modal focus scope does not restore focus and dismiss the menu.\n if (\n local.disabled ||\n event.defaultPrevented ||\n !event.isPrimary ||\n event.button !== 0 ||\n event.altKey ||\n event.ctrlKey ||\n event.metaKey ||\n event.shiftKey\n ) {\n return\n }\n const trigger = event.currentTarget\n const isNativeLink = trigger instanceof HTMLAnchorElement && trigger.hasAttribute('href')\n if (trigger instanceof HTMLElement && !isNativeLink) {\n trigger.focus({ preventScroll: true })\n }\n }\n const onKeyDown = (event: DropdownMenuTriggerKeyEvent) => {\n // Kobalte's MenuTrigger does not consult defaultPrevented before its own\n // open-key handling. Preserve its existing callback behavior; this wrapper\n // only makes the pre-open scroll-parent lookup terminate.\n if (typeof local.onKeyDown === 'function') local.onKeyDown(event)\n else if (local.onKeyDown) local.onKeyDown[0](local.onKeyDown[1], event)\n\n if (local.disabled) return\n const trigger = event.currentTarget\n if (!(trigger instanceof HTMLElement)) return\n const menubarOrientation = trigger.closest('[role=\"menubar\"]')?.getAttribute('aria-orientation')\n const orientation =\n inheritedOrientation?.() ?? (menubarOrientation === 'vertical' ? 'vertical' : 'horizontal')\n const openingArrow = orientation === 'horizontal' ? 'ArrowDown' : 'ArrowRight'\n if (!['Enter', ' ', openingArrow].includes(event.key)) return\n const isNativeLink = trigger instanceof HTMLAnchorElement && trigger.hasAttribute('href')\n if (isNativeLink && (event.key === 'Enter' || event.key === ' ')) return\n bypassUnboundedScrollLookup(trigger)\n }\n\n return (\n <KobalteDropdownMenu.Trigger\n {...rest}\n disabled={local.disabled}\n onPointerDown={onPointerDown}\n onKeyDown={onKeyDown}\n />\n )\n}\n\nexport function DropdownMenuPortal(props: ComponentProps<typeof KobalteDropdownMenu.Portal>) {\n return <KobalteDropdownMenu.Portal {...props} />\n}\n\nexport type DropdownMenuContentProps = ComponentProps<typeof KobalteDropdownMenu.Content> & {\n hideArrow?: boolean\n /** Mount under an owner element such as a modal, keeping the menu in its accessible subtree. */\n portalMount?: HTMLElement\n}\n\nexport function DropdownMenuContent(props: DropdownMenuContentProps) {\n const [local, rest] = splitProps(props, ['class', 'hideArrow', 'children', 'portalMount'])\n\n return (\n <KobalteDropdownMenu.Portal mount={local.portalMount}>\n <KobalteDropdownMenu.Content\n class={cn(\n overlaySurface,\n overlayMotion,\n 'z-(--z-menu) min-w-[10rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n menuContentPadding,\n local.class\n )}\n {...rest}\n >\n {!local.hideArrow && <KobalteDropdownMenu.Arrow aria-hidden=\"true\" class={popoverArrow} />}\n {local.children}\n </KobalteDropdownMenu.Content>\n </KobalteDropdownMenu.Portal>\n )\n}\n\nexport function DropdownMenuItem(\n props: ComponentProps<typeof KobalteDropdownMenu.Item> & {\n /** Colour the row as a destructive action. Confirm it separately. */\n variant?: 'default' | 'destructive'\n /** Draw a shortcut hint at the trailing edge of the row. */\n shortcut?: string\n /**\n * The parseable chord behind `shortcut`, e.g. `Meta+E`. The drawn glyph is\n * `aria-hidden` — reading it out would pollute the item's accessible name —\n * so this is what assistive technology announces instead. Supply it\n * whenever `shortcut` is drawn.\n */\n keyshortcuts?: string\n }\n) {\n const [local, rest] = splitProps(props, [\n 'class',\n 'variant',\n 'shortcut',\n 'keyshortcuts',\n 'children',\n ])\n\n return (\n <KobalteDropdownMenu.Item\n class={cn(\n menuItem,\n {\n [destructiveMenuItem]: local.variant === 'destructive',\n },\n local.class\n )}\n aria-keyshortcuts={local.keyshortcuts}\n {...rest}\n >\n {local.children}\n {local.shortcut ? (\n <span\n aria-hidden=\"true\"\n class=\"text-muted-foreground ms-auto font-code text-code tracking-widest\"\n >\n {local.shortcut}\n </span>\n ) : null}\n </KobalteDropdownMenu.Item>\n )\n}\n\n/**\n * The chord drawn at a row's trailing edge.\n *\n * A component as well as the `shortcut` prop on an item, because a caller composing\n * a row by hand needs the same treatment — and because the alternative is every\n * caller inventing the same mono-and-dimmed span.\n *\n * The glyphs are decorative: the span is `aria-hidden` and the parseable chord\n * belongs in the row's `aria-keyshortcuts`, so the item's accessible name stays\n * exactly its label.\n */\nexport function DropdownMenuShortcut(props: ComponentProps<'span'>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n aria-hidden=\"true\"\n class={cn('text-muted-foreground ms-auto font-code text-code tracking-widest', local.class)}\n {...rest}\n />\n )\n}\n\nexport function DropdownMenuCheckboxItem(\n props: ComponentProps<typeof KobalteDropdownMenu.CheckboxItem>\n) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteDropdownMenu.CheckboxItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n {local.children}\n <KobalteDropdownMenu.ItemIndicator\n data-slot=\"dropdown-menu-indicator\"\n class=\"absolute end-2 flex size-4 items-center justify-center text-primary\"\n >\n <Check class=\"size-4\" />\n </KobalteDropdownMenu.ItemIndicator>\n </KobalteDropdownMenu.CheckboxItem>\n )\n}\n\nexport function DropdownMenuRadioGroup(\n props: ComponentProps<typeof KobalteDropdownMenu.RadioGroup>\n) {\n return <KobalteDropdownMenu.RadioGroup {...props} />\n}\n\nexport function DropdownMenuRadioItem(props: ComponentProps<typeof KobalteDropdownMenu.RadioItem>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteDropdownMenu.RadioItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n {local.children}\n {/* The indicator reads in the accent, like every other selected state in\n the system — a canvas-colored dot on a checked row reads as decoration. */}\n <KobalteDropdownMenu.ItemIndicator\n data-slot=\"dropdown-menu-indicator\"\n class=\"absolute end-2 flex size-4 items-center justify-center text-primary\"\n >\n <Circle class=\"size-2 fill-current\" />\n </KobalteDropdownMenu.ItemIndicator>\n </KobalteDropdownMenu.RadioItem>\n )\n}\n\n/**\n * The caption of a `DropdownMenuGroup`, and that group's accessible name. It must be a\n * child of the group it names: Kobalte reads the group from context, so a label\n * placed directly in the content throws `useMenuGroupContext must be used within\n * a Menu.Group` the moment the menu opens. For an ungrouped caption, wrap the\n * label and its items in a group anyway — the grouping is what a screen reader\n * announces.\n */\nexport function DropdownMenuLabel(props: ComponentProps<typeof KobalteDropdownMenu.GroupLabel>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDropdownMenu.GroupLabel class={cn(menuLabel, local.class)} {...rest} />\n}\n\nexport function DropdownMenuGroup(props: ComponentProps<typeof KobalteDropdownMenu.Group>) {\n return <KobalteDropdownMenu.Group {...props} />\n}\n\nexport function DropdownMenuSeparator(props: ComponentProps<typeof KobalteDropdownMenu.Separator>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteDropdownMenu.Separator class={cn(menuSeparator, local.class)} {...rest} />\n}\n\nexport function DropdownMenuSub(props: ComponentProps<typeof KobalteDropdownMenu.Sub>) {\n return <KobalteDropdownMenu.Sub {...props} />\n}\n\nexport function DropdownMenuSubTrigger(\n props: ComponentProps<typeof KobalteDropdownMenu.SubTrigger>\n) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n\n return (\n <KobalteDropdownMenu.SubTrigger class={cn(menuItem, local.class)} {...rest}>\n {local.children}\n <ChevronRight class=\"ms-auto size-4\" />\n </KobalteDropdownMenu.SubTrigger>\n )\n}\n\nexport function DropdownMenuSubContent(\n props: ComponentProps<typeof KobalteDropdownMenu.SubContent>\n) {\n const [local, rest] = splitProps(props, ['class'])\n\n return (\n <KobalteDropdownMenu.Portal>\n <KobalteDropdownMenu.SubContent\n class={cn(\n overlaySurface,\n overlayMotion,\n 'z-(--z-menu) min-w-[8rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n menuContentPadding,\n local.class\n )}\n {...rest}\n />\n </KobalteDropdownMenu.Portal>\n )\n}\n"],"mappings":";;;;;;;;;AAiBA,IAAMoB,iCAAiCb,cAAqD;;;;;;;;;;;;;;;;;;;;AA8B5F,SAAgBP,eAAa6B,OAAmD;CAC9E,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO,CAAC,SAAS,aAAa,CAAC;CAChE,MAAMG,oBAAoBF,MAAME;CAChC,OAAAC,gBACGb,+BAA+Bc,UAAQ;EAACC,OAAOH;EAAW,IAAAI,WAAA;GAAA,OAAAH,gBACxDhC,cAAmBoC,WAAA;IAAA,IAACC,QAAK;KAAA,OAAER,MAAMQ,SAAS;IAAK;IAAA,IAAEN,cAAW;KAAA,OAAEF,MAAME;IAAW;GAAA,GAAMD,IAAI,CAAA;EAAA;CAAA,CAAA;AAGhG;AAEA,IAAMQ,sBAAsB;AAC5B,IAAMC,sBAAsB;CAAC;CAAY;CAAc;AAAY;AASnE,SAASO,mBAAmBC,SAA6C;CACvE,OAAOR,oBAAoBU,KAAKL,cAAc;EAC5CA;EACAV,OAAOa,QAAQG,MAAMC,iBAAiBP,QAAQ;EAC9CC,UAAUE,QAAQG,MAAME,oBAAoBR,QAAQ;CACtD,EAAE;AACJ;AAEA,SAASS,kBAAkBN,SAAsBO,cAAqC;CACpF,OAAOA,aAAaC,OACjB,EAAEX,UAAUV,OAAOW,eAClBE,QAAQG,MAAMC,iBAAiBP,QAAQ,MAAMV,SAC7Ca,QAAQG,MAAME,oBAAoBR,QAAQ,MAAMC,QACpD;AACF;AAEA,SAASW,4BAA4BC,SAAsB;CACzD,MAAMC,aAAaC,SAASC,oBAAoBD,SAASE;CACzD,IAAIC,OAAOC,iBAAiBL,UAAU,CAAC,CAACM,aAAa,UAAU;CAE/D,MAAMC,kBAID,CAAA;CAEL,KAAK,IAAIlB,UAA8BU,SAASV,UAAU;EACxD,MAAMsB,SAA6BtB,QAAQuB;EAC3C,IAAIvB,YAAYW,YAAY;GAC1B,MAAMa,WAAWT,OAAOC,iBAAiBhB,OAAO;GAChD,MAAMiB,WAAW,GAAGO,SAASP,SAAQ,GAAIO,SAASC,UAAS,GAAID,SAASE;GACxE,IAAInC,oBAAoBoC,KAAKV,QAAQ,GAAG;IACtC,MAAMG,WAAWrB,mBAAmBC,OAAO;IAC3CA,QAAQG,MAAMyB,YAAY,YAAY,QAAQ,WAAW;IACzDV,gBAAgBW,KAAK;KAAE7B;KAASoB;KAAUC,SAAStB,mBAAmBC,OAAO;IAAE,CAAC;GAClF;EACF;EACAA,UAAUsB;CACZ;CAEA,IAAIJ,gBAAgBY,WAAW,GAAG;CAMlCC,qBAAqB;EACnB,KAAK,MAAM,EAAE/B,SAASoB,UAAUC,aAAaH,iBAAiB;GAC5D,IAAI,CAAClB,QAAQgC,eAAe,CAAC1B,kBAAkBN,SAASqB,OAAO,GAAG;GAClE,KAAK,MAAMxB,YAAYL,qBAAqBQ,QAAQG,MAAM8B,eAAepC,QAAQ;GACjF,KAAK,MAAM,EAAEA,UAAUV,OAAOW,cAAcsB,UAC1C,IAAIjC,OAAOa,QAAQG,MAAMyB,YAAY/B,UAAUV,OAAOW,QAAQ;EAElE;CACF,CAAC;AACH;AAEA,SAAgBoC,oBAAoBrD,OAA2D;CAC7F,MAAMsD,uBAAuB1E,WAAWW,8BAA8B;CACtE,MAAM,CAACU,OAAOC,QAAQvB,WAAWqB,OAAO;EAAC;EAAY;EAAa;CAAe,CAAC;CAClF,MAAMuD,iBAAiBC,UAA2C;EAChE,IAAI,OAAOvD,MAAMsD,kBAAkB,YAAYtD,MAAMsD,cAAcC,KAAK;OACnE,IAAIvD,MAAMsD,eAAetD,MAAMsD,cAAc,EAAE,CAACtD,MAAMsD,cAAc,IAAIC,KAAK;EAKlF,IACEvD,MAAMwD,YACND,MAAME,oBACN,CAACF,MAAMG,aACPH,MAAMI,WAAW,KACjBJ,MAAMK,UACNL,MAAMM,WACNN,MAAMO,WACNP,MAAMQ,UAEN;EAEF,MAAMnC,UAAU2B,MAAMS;EACtB,MAAMC,eAAerC,mBAAmBsC,qBAAqBtC,QAAQuC,aAAa,MAAM;EACxF,IAAIvC,mBAAmBT,eAAe,CAAC8C,cACrCrC,QAAQwC,MAAM,EAAEC,eAAe,KAAK,CAAC;CAEzC;CACA,MAAMC,aAAaf,UAAuC;EAIxD,IAAI,OAAOvD,MAAMsE,cAAc,YAAYtE,MAAMsE,UAAUf,KAAK;OAC3D,IAAIvD,MAAMsE,WAAWtE,MAAMsE,UAAU,EAAE,CAACtE,MAAMsE,UAAU,IAAIf,KAAK;EAEtE,IAAIvD,MAAMwD,UAAU;EACpB,MAAM5B,UAAU2B,MAAMS;EACtB,IAAI,EAAEpC,mBAAmBT,cAAc;EACvC,MAAMoD,qBAAqB3C,QAAQ4C,QAAQ,oBAAkB,CAAC,EAAEC,aAAa,kBAAkB;EAI/F,IAAI,CAAC;GAAC;GAAS;IAFbpB,uBAAuB,MAAMkB,uBAAuB,aAAa,aAAa,mBAC3C,eAAe,cAAc;EAClC,CAAC,CAACI,SAASpB,MAAMqB,GAAG,GAAG;EAEvD,IADqBhD,mBAAmBsC,qBAAqBtC,QAAQuC,aAAa,MAAM,MACnEZ,MAAMqB,QAAQ,WAAWrB,MAAMqB,QAAQ,MAAM;EAClEjD,4BAA4BC,OAAO;CACrC;CAEA,OAAAzB,gBACGhC,aAAoB0B,SAAOU,WACtBN,MAAI;EAAA,IACRuD,WAAQ;GAAA,OAAExD,MAAMwD;EAAQ;EACTF;EACJgB;CAAS,CAAA,CAAA;AAG1B;AAEA,SAAgBO,mBAAmB9E,OAA0D;CAC3F,OAAAI,gBAAQhC,aAAoB2G,QAAW/E,KAAK;AAC9C;AAQA,SAAgBoF,oBAAoBpF,OAAiC;CACnE,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO;EAAC;EAAS;EAAa;EAAY;CAAa,CAAC;CAEzF,OAAAI,gBACGhC,aAAoB2G,QAAM;EAAA,IAACM,QAAK;GAAA,OAAEpF,MAAMkF;EAAW;EAAA,IAAA5E,WAAA;GAAA,OAAAH,gBACjDhC,aAAoB6G,SAAOzE,WAAA,EAAA,KAAA,WAAA;IAAA,OACnBnB,GACLF,gBACAD,eACA,0FAAA,OAEAe,MAAMqF,KACR;GAAC,EAAA,GACGpF,MAAI,EAAA,IAAAK,WAAA;IAAA,OAAA,CAAAgF,WAEPA,WAAA,CAAA,CAAA,CAACtF,MAAMiF,SAAS,CAAA,CAAA,KAAA9E,gBAAKhC,aAAoBoH,OAAK;KAAA,eAAA;KAAA,SAAA;IAAuC,CAAA,CAAI,GAAAD,WACzFtF,MAAMM,QAAQ,CAAA;GAAA,EAAA,CAAA,CAAA;EAAA;CAAA,CAAA;AAIvB;AAEA,SAAgBkF,iBACdzF,OAaA;CACA,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO;EACtC;EACA;EACA;EACA;EACA;CAAU,CACX;CAED,OAAAI,gBACGhC,aAAoBsH,MAAIlF,WAAA;EAAA,KAAA,WAAA;GAAA,OAChBnB,GACLN,UACA,GACGD,sBAAsBmB,MAAM0F,YAAY,cAC3C,GACA1F,MAAMqF,KACR;EAAC;EAAA,KAAA,uBAAA;GAAA,OACkBrF,MAAM4F;EAAY;CAAA,GACjC3F,MAAI,EAAA,IAAAK,WAAA;EAAA,OAAA,CAAAgF,WAEPtF,MAAMM,QAAQ,GAAAgF,WACdA,WAAA,CAAA,CAAAtF,MAAM2F,QAAQ,CAAA,CAAA,WAAA;GAAA,IAAAG,OAAAC,OAAA;GAAAC,OAAAF,YAKV9F,MAAM2F,QAAQ;GAAA,OAAAG;EAAA,EAAA,CAAA,IAEf,IAAI,CAAA;CAAA,EAAA,CAAA,CAAA;AAGd;;;;;;;;;;;;AAaA,SAAgBG,qBAAqBlG,OAA+B;CAClE,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO,CAAC,OAAO,CAAC;CACjD,cAAA;EAAA,IAAAmG,QAAAC,QAAA;EAAAC,OAAAF,OAAA3F,WAAA,EAAA,KAAA,WAAA;GAAA,OAIWnB,GAAG,qEAAqEY,MAAMqF,KAAK;EAAC,EAAA,GACvFpF,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAiG;CAAA,EAAA,CAAA;AAGd;AAEA,SAAgBG,yBACdtG,OACA;CACA,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAI,gBACGhC,aAAoBmI,cAAY/F,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQnB,GAAGN,UAAU,QAAQkB,MAAMqF,KAAK;CAAC,EAAA,GAAMpF,MAAI,EAAA,IAAAK,WAAA;EAAA,OAAA,CAAAgF,WACjFtF,MAAMM,QAAQ,GAAAH,gBACdhC,aAAoBoI,eAAa;GAAA,aAAA;GAAA,SAAA;GAAA,IAAAjG,WAAA;IAAA,OAAAH,gBAI/B/B,OAAK,EAAA,SAAA,SAAA,CAAA;GAAA;EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAId;AAEA,SAAgBoI,uBACdzG,OACA;CACA,OAAAI,gBAAQhC,aAAoBsI,YAAe1G,KAAK;AAClD;AAEA,SAAgB2G,sBAAsB3G,OAA6D;CACjG,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAI,gBACGhC,aAAoBwI,WAASpG,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQnB,GAAGN,UAAU,QAAQkB,MAAMqF,KAAK;CAAC,EAAA,GAAMpF,MAAI,EAAA,IAAAK,WAAA;EAAA,OAAA,CAAAgF,WAC9EtF,MAAMM,QAAQ,GAAAH,gBAGdhC,aAAoBoI,eAAa;GAAA,aAAA;GAAA,SAAA;GAAA,IAAAjG,WAAA;IAAA,OAAAH,gBAI/B7B,QAAM,EAAA,SAAA,sBAAA,CAAA;GAAA;EAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAIf;;;;;;;;;AAUA,SAAgBsI,kBAAkB7G,OAA8D;CAC9F,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAI,gBAAQhC,aAAoB0I,YAAUtG,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQnB,GAAGL,WAAWiB,MAAMqF,KAAK;CAAC,EAAA,GAAMpF,IAAI,CAAA;AACpF;AAEA,SAAgB6G,kBAAkB/G,OAAyD;CACzF,OAAAI,gBAAQhC,aAAoB4I,OAAUhH,KAAK;AAC7C;AAEA,SAAgBiH,sBAAsBjH,OAA6D;CACjG,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAI,gBAAQhC,aAAoB8I,WAAS1G,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQnB,GAAGJ,eAAegB,MAAMqF,KAAK;CAAC,EAAA,GAAMpF,IAAI,CAAA;AACvF;AAEA,SAAgBiH,gBAAgBnH,OAAuD;CACrF,OAAAI,gBAAQhC,aAAoBgJ,KAAQpH,KAAK;AAC3C;AAEA,SAAgBqH,uBACdrH,OACA;CACA,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO,CAAC,SAAS,UAAU,CAAC;CAE7D,OAAAI,gBACGhC,aAAoBkJ,YAAU9G,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQnB,GAAGN,UAAUkB,MAAMqF,KAAK;CAAC,EAAA,GAAMpF,MAAI,EAAA,IAAAK,WAAA;EAAA,OAAA,CAAAgF,WACvEtF,MAAMM,QAAQ,GAAAH,gBACd9B,cAAY,EAAA,SAAA,iBAAA,CAAA,CAAA;CAAA,EAAA,CAAA,CAAA;AAGnB;AAEA,SAAgBiJ,uBACdvH,OACA;CACA,MAAM,CAACC,OAAOC,QAAQvB,WAAWqB,OAAO,CAAC,OAAO,CAAC;CAEjD,OAAAI,gBACGhC,aAAoB2G,QAAM,EAAA,IAAAxE,WAAA;EAAA,OAAAH,gBACxBhC,aAAoBoJ,YAAUhH,WAAA,EAAA,KAAA,WAAA;GAAA,OACtBnB,GACLF,gBACAD,eACA,yFAAA,OAEAe,MAAMqF,KACR;EAAC,EAAA,GACGpF,IAAI,CAAA;CAAA,EAAA,CAAA;AAIhB"}
|
|
@@ -21,7 +21,7 @@ var _tmpl$2 = /*#__PURE__*/ template(`<span data-slot=kbd-group>`);
|
|
|
21
21
|
* `KbdGroup` exists because a shortcut is a sequence: typing `⌘` then `K`
|
|
22
22
|
* needs a gap between them that is a layout concern, not punctuation.
|
|
23
23
|
*/
|
|
24
|
-
var kbdVariants = cva("bg-muted text-muted-foreground pointer-events-none inline-flex h-5 min-w-5 items-center justify-center gap-1 rounded-sm border border-border px-1 font-
|
|
24
|
+
var kbdVariants = cva("bg-muted text-muted-foreground pointer-events-none inline-flex h-5 min-w-5 items-center justify-center gap-1 rounded-sm border border-border px-1 font-code text-code font-medium select-none", {
|
|
25
25
|
variants: { size: {
|
|
26
26
|
default: "",
|
|
27
27
|
compact: "h-4 min-w-4 bg-muted/40 px-0.5 font-normal leading-none"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"kbd.js","names":["ComponentProps","For","splitProps","cva","VariantProps","cn","kbdVariants","variants","size","default","compact","defaultVariants","KbdSize","NonNullable","Kbd","props","local","rest","_el$","_tmpl$","_$spread","_$mergeProps","class","kbdGroupVariants","KbdGroup","_el$2","_tmpl$2","kbdChordKeys","keys","KbdChordProps","Omit","KbdChord","_$createComponent","children","each","key","_$mergeProps","_$createComponent"],"sources":["../../../../src/components/ui/kbd/kbd.tsx"],"sourcesContent":["import type { ComponentProps } from 'solid-js'\nimport { For, splitProps } from 'solid-js'\nimport { cva, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\n\n/**\n * Kbd.\n *\n * A keyboard key, in the order the user presses them. The element is a real\n * `<kbd>` so the semantics survive copy-paste, and the mono face is what makes\n * a shortcut visually distinct from the sentence around it.\n *\n * `size=\"compact\"` exists for the dense rows a default cap would outweigh — a\n * rail search row, a sidebar shortcut hint. It drops a height rung, and it\n * lightens the fill and weight with it because at that size a solid muted cap\n * reads heavier than the row text it sits in. The default rendering is every\n * cap that is not inside such a row, and it is untouched by the rung.\n *\n * `KbdGroup` exists because a shortcut is a sequence: typing `⌘` then `K`\n * needs a gap between them that is a layout concern, not punctuation.\n */\nexport const kbdVariants = cva(\n 'bg-muted text-muted-foreground pointer-events-none inline-flex h-5 min-w-5 items-center justify-center gap-1 rounded-sm border border-border px-1 font-
|
|
1
|
+
{"version":3,"file":"kbd.js","names":["ComponentProps","For","splitProps","cva","VariantProps","cn","kbdVariants","variants","size","default","compact","defaultVariants","KbdSize","NonNullable","Kbd","props","local","rest","_el$","_tmpl$","_$spread","_$mergeProps","class","kbdGroupVariants","KbdGroup","_el$2","_tmpl$2","kbdChordKeys","keys","KbdChordProps","Omit","KbdChord","_$createComponent","children","each","key","_$mergeProps","_$createComponent"],"sources":["../../../../src/components/ui/kbd/kbd.tsx"],"sourcesContent":["import type { ComponentProps } from 'solid-js'\nimport { For, splitProps } from 'solid-js'\nimport { cva, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\n\n/**\n * Kbd.\n *\n * A keyboard key, in the order the user presses them. The element is a real\n * `<kbd>` so the semantics survive copy-paste, and the mono face is what makes\n * a shortcut visually distinct from the sentence around it.\n *\n * `size=\"compact\"` exists for the dense rows a default cap would outweigh — a\n * rail search row, a sidebar shortcut hint. It drops a height rung, and it\n * lightens the fill and weight with it because at that size a solid muted cap\n * reads heavier than the row text it sits in. The default rendering is every\n * cap that is not inside such a row, and it is untouched by the rung.\n *\n * `KbdGroup` exists because a shortcut is a sequence: typing `⌘` then `K`\n * needs a gap between them that is a layout concern, not punctuation.\n */\nexport const kbdVariants = cva(\n 'bg-muted text-muted-foreground pointer-events-none inline-flex h-5 min-w-5 items-center justify-center gap-1 rounded-sm border border-border px-1 font-code text-code font-medium select-none',\n {\n variants: {\n size: {\n default: '',\n compact: 'h-4 min-w-4 bg-muted/40 px-0.5 font-normal leading-none',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n }\n)\n\nexport type KbdSize = NonNullable<VariantProps<typeof kbdVariants>['size']>\n\nexport function Kbd(props: ComponentProps<'kbd'> & { size?: KbdSize }) {\n const [local, rest] = splitProps(props, ['size', 'class'])\n\n return (\n <kbd data-slot=\"kbd\" class={cn(kbdVariants({ size: local.size }), local.class)} {...rest} />\n )\n}\n\nexport const kbdGroupVariants = cva('inline-flex items-center gap-1', {\n variants: {\n size: {\n default: '',\n /** The gap is what separates caps, so it tightens with them. */\n compact: 'gap-0.5',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n})\n\nexport function KbdGroup(props: ComponentProps<'span'> & { size?: KbdSize }) {\n const [local, rest] = splitProps(props, ['size', 'class'])\n\n return (\n <span\n data-slot=\"kbd-group\"\n class={cn(kbdGroupVariants({ size: local.size }), local.class)}\n {...rest}\n />\n )\n}\n\n/**\n * Split a written chord into one entry per key cap. Every character is a key:\n * `⌘K` renders as `⌘` + `K`, and a longer chord like `⇧⌘P` stays three caps\n * wide, which matches how the system draws chords in menus.\n */\nexport function kbdChordKeys(keys: string): string[] {\n return [...keys]\n}\n\nexport type KbdChordProps = Omit<ComponentProps<'span'>, 'children'> & {\n /** The chord as it is drawn, e.g. `\"⌘K\"` or `\"⇧⌘P\"`. One cap per character. */\n keys: string\n size?: KbdSize\n}\n\n/**\n * KbdChord.\n *\n * A written chord drawn as caps, one per character. Decoration only: the\n * composition renders `aria-hidden`, so the accessible name and the parseable\n * `aria-keyshortcuts` stay on the control the chord belongs to. That is why\n * there is no children — the chord says what was drawn, nothing more.\n */\nexport function KbdChord(props: KbdChordProps) {\n const [local, rest] = splitProps(props, ['keys', 'size', 'class'])\n\n return (\n <KbdGroup {...rest} size={local.size} class={local.class} aria-hidden=\"true\">\n <For each={kbdChordKeys(local.keys)}>{(key) => <Kbd size={local.size}>{key}</Kbd>}</For>\n </KbdGroup>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAqBA,IAAaM,cAAcH,IACzB,iMACA;CACEI,UAAU,EACRC,MAAM;EACJC,SAAS;EACTC,SAAS;CACX,EACF;CACAC,iBAAiB,EACfH,MAAM,UACR;AACF,CACF;AAIA,SAAgBM,IAAIC,OAAmD;CACrE,MAAM,CAACC,OAAOC,QAAQf,WAAWa,OAAO,CAAC,QAAQ,OAAO,CAAC;CAEzD,cAAA;EAAA,IAAAG,OAAAC,OAAA;EAAAC,OAAAF,MAAAG,WAAA,EAAA,KAAA,WAAA;GAAA,OAC8BhB,GAAGC,YAAY,EAAEE,MAAMQ,MAAMR,KAAK,CAAC,GAAGQ,MAAMM,KAAK;EAAC,EAAA,GAAML,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAC;CAAA,EAAA,CAAA;AAE5F;AAEA,IAAaK,mBAAmBpB,IAAI,kCAAkC;CACpEI,UAAU,EACRC,MAAM;EACJC,SAAS;;EAETC,SAAS;CACX,EACF;CACAC,iBAAiB,EACfH,MAAM,UACR;AACF,CAAC;AAED,SAAgBgB,SAAST,OAAoD;CAC3E,MAAM,CAACC,OAAOC,QAAQf,WAAWa,OAAO,CAAC,QAAQ,OAAO,CAAC;CAEzD,cAAA;EAAA,IAAAU,QAAAC,QAAA;EAAAN,OAAAK,OAAAJ,WAAA,EAAA,KAAA,WAAA;GAAA,OAGWhB,GAAGkB,iBAAiB,EAAEf,MAAMQ,MAAMR,KAAK,CAAC,GAAGQ,MAAMM,KAAK;EAAC,EAAA,GAC1DL,IAAI,GAAA,OAAA,KAAA;EAAA,OAAAQ;CAAA,EAAA,CAAA;AAGd;;;;;;AAOA,SAAgBE,aAAaC,MAAwB;CACnD,OAAO,CAAC,GAAGA,IAAI;AACjB;;;;;;;;;AAgBA,SAAgBG,SAAShB,OAAsB;CAC7C,MAAM,CAACC,OAAOC,QAAQf,WAAWa,OAAO;EAAC;EAAQ;EAAQ;CAAO,CAAC;CAEjE,OAAAiB,gBACGR,UAAQH,WAAKJ,MAAI;EAAA,IAAET,OAAI;GAAA,OAAEQ,MAAMR;EAAI;EAAA,KAAA,WAAA;GAAA,OAASQ,MAAMM;EAAK;EAAA,eAAA;EAAA,IAAAW,WAAA;GAAA,OAAAD,gBACrD/B,KAAG;IAAA,IAACiC,OAAI;KAAA,OAAEP,aAAaX,MAAMY,IAAI;IAAC;IAAAK,WAAIE,QAAGH,gBAAMlB,KAAG;KAAA,IAACN,OAAI;MAAA,OAAEQ,MAAMR;KAAI;KAAAyB,UAAGE;IAAG,CAAA;GAAO,CAAA;EAAA;CAAA,CAAA,CAAA;AAGvF"}
|
|
@@ -5,7 +5,7 @@ import { Check, ChevronRight, Circle } from "lucide-solid";
|
|
|
5
5
|
import { splitProps } from "solid-js";
|
|
6
6
|
import { Menubar } from "@kobalte/core/menubar";
|
|
7
7
|
//#region src/components/ui/menubar/menubar.tsx
|
|
8
|
-
var _tmpl$ = /*#__PURE__*/ template(`<span aria-hidden=true class="text-muted-foreground ms-auto font-
|
|
8
|
+
var _tmpl$ = /*#__PURE__*/ template(`<span aria-hidden=true class="text-muted-foreground ms-auto font-code text-code tracking-widest">`);
|
|
9
9
|
/**
|
|
10
10
|
* Menubar.
|
|
11
11
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menubar.js","names":["Menubar","KobalteMenubar","Check","ChevronRight","Circle","ComponentProps","splitProps","menuContentPadding","destructiveMenuItem","menuItem","menuLabel","menuSeparator","overlayMotion","overlaySurface","popoverArrow","cn","props","local","rest","_$createComponent","_$mergeProps","class","MenubarMenu","Menu","MenubarTrigger","Trigger","MenubarContent","Content","Portal","children","Arrow","_$memo","MenubarItem","Item","variant","shortcut","keyshortcuts","aria-keyshortcuts","_el$","_tmpl$","_$insert","MenubarCheckboxItem","CheckboxItem","ItemIndicator","MenubarRadioGroup","RadioGroup","MenubarRadioItem","RadioItem","MenubarLabel","GroupLabel","MenubarGroup","Group","MenubarSeparator","Separator","MenubarSub","Sub","MenubarSubTrigger","SubTrigger","MenubarSubContent","SubContent","Menubar","_$createComponent","KobalteMenubar","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/menubar/menubar.tsx"],"sourcesContent":["import { Menubar as KobalteMenubar } from '@kobalte/core/menubar'\nimport { Check, ChevronRight, Circle } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport {\n menuContentPadding,\n destructiveMenuItem,\n menuItem,\n menuLabel,\n menuSeparator,\n overlayMotion,\n overlaySurface,\n popoverArrow,\n} from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * Menubar.\n *\n * A persistent row of menus at the top of a surface — the desktop application\n * pattern. Each trigger opens its own menu, and the arrow keys move *between*\n * menus once one is open, which is what makes a menubar a single control rather\n * than five menus that happen to be adjacent.\n *\n * This is for a window-level command surface. For actions on one thing, use\n * DropdownMenu; a menubar on a row would be a menu pretending to be chrome.\n */\nexport function Menubar(props: ComponentProps<typeof KobalteMenubar>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteMenubar\n class={cn(\n 'flex items-center gap-0.5 rounded-md border border-border bg-card p-0.5',\n local.class\n )}\n {...rest}\n />\n )\n}\n\n/**\n * One top-level menu: a trigger and the panel it opens.\n *\n * Required, and the reason the component is not just a row of triggers — the\n * menubar's arrow keys move *between* menus, which only works when each trigger\n * belongs to a menu the bar knows about. `value` names it.\n */\nexport function MenubarMenu(props: ComponentProps<typeof KobalteMenubar.Menu>) {\n return <KobalteMenubar.Menu {...props} />\n}\n\nexport function MenubarTrigger(props: ComponentProps<typeof KobalteMenubar.Trigger>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteMenubar.Trigger\n class={cn(\n 'flex items-center rounded-sm px-2 py-1 text-sm font-medium select-none',\n 'transition-colors ease-out outline-none',\n 'data-[expanded]:bg-surface-active',\n 'data-[highlighted]:bg-surface-hover',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n local.class\n )}\n {...rest}\n />\n )\n}\n\nexport function MenubarContent(props: ComponentProps<typeof KobalteMenubar.Content>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n return (\n <KobalteMenubar.Portal>\n <KobalteMenubar.Content\n class={cn(\n overlaySurface,\n overlayMotion,\n 'z-(--z-menu) min-w-[10rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n menuContentPadding,\n local.class\n )}\n {...rest}\n >\n <KobalteMenubar.Arrow aria-hidden=\"true\" class={popoverArrow} />\n {local.children}\n </KobalteMenubar.Content>\n </KobalteMenubar.Portal>\n )\n}\n\nexport function MenubarItem(\n props: ComponentProps<typeof KobalteMenubar.Item> & {\n variant?: 'default' | 'destructive'\n shortcut?: string\n /**\n * The parseable chord behind `shortcut`, e.g. `Meta+N`. The drawn glyph is\n * `aria-hidden` — reading it out would pollute the item's accessible name —\n * so this is what assistive technology announces instead. Supply it\n * whenever `shortcut` is drawn.\n */\n keyshortcuts?: string\n }\n) {\n const [local, rest] = splitProps(props, [\n 'class',\n 'variant',\n 'shortcut',\n 'keyshortcuts',\n 'children',\n ])\n return (\n <KobalteMenubar.Item\n class={cn(\n menuItem,\n {\n [destructiveMenuItem]: local.variant === 'destructive',\n },\n local.class\n )}\n aria-keyshortcuts={local.keyshortcuts}\n {...rest}\n >\n {local.children}\n {local.shortcut ? (\n <span\n aria-hidden=\"true\"\n class=\"text-muted-foreground ms-auto font-mono text-2xs tracking-widest\"\n >\n {local.shortcut}\n </span>\n ) : null}\n </KobalteMenubar.Item>\n )\n}\n\nexport function MenubarCheckboxItem(props: ComponentProps<typeof KobalteMenubar.CheckboxItem>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n return (\n <KobalteMenubar.CheckboxItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n {local.children}\n <KobalteMenubar.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n <Check class=\"size-4\" />\n </KobalteMenubar.ItemIndicator>\n </KobalteMenubar.CheckboxItem>\n )\n}\n\nexport function MenubarRadioGroup(props: ComponentProps<typeof KobalteMenubar.RadioGroup>) {\n return <KobalteMenubar.RadioGroup {...props} />\n}\n\nexport function MenubarRadioItem(props: ComponentProps<typeof KobalteMenubar.RadioItem>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n return (\n <KobalteMenubar.RadioItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n {local.children}\n <KobalteMenubar.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n <Circle class=\"size-2 fill-current\" />\n </KobalteMenubar.ItemIndicator>\n </KobalteMenubar.RadioItem>\n )\n}\n\n/**\n * The caption of a `MenubarGroup`, and that group's accessible name. It must be a\n * child of the group it names: Kobalte reads the group from context, so a label\n * placed directly in the content throws `useMenuGroupContext must be used within\n * a Menu.Group` the moment the menu opens. For an ungrouped caption, wrap the\n * label and its items in a group anyway — the grouping is what a screen reader\n * announces.\n */\nexport function MenubarLabel(props: ComponentProps<typeof KobalteMenubar.GroupLabel>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteMenubar.GroupLabel class={cn(menuLabel, local.class)} {...rest} />\n}\n\nexport function MenubarGroup(props: ComponentProps<typeof KobalteMenubar.Group>) {\n return <KobalteMenubar.Group {...props} />\n}\n\nexport function MenubarSeparator(props: ComponentProps<typeof KobalteMenubar.Separator>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteMenubar.Separator class={cn(menuSeparator, local.class)} {...rest} />\n}\n\nexport function MenubarSub(props: ComponentProps<typeof KobalteMenubar.Sub>) {\n return <KobalteMenubar.Sub {...props} />\n}\n\nexport function MenubarSubTrigger(props: ComponentProps<typeof KobalteMenubar.SubTrigger>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n return (\n <KobalteMenubar.SubTrigger class={cn(menuItem, local.class)} {...rest}>\n {local.children}\n <ChevronRight class=\"ms-auto size-4\" />\n </KobalteMenubar.SubTrigger>\n )\n}\n\nexport function MenubarSubContent(props: ComponentProps<typeof KobalteMenubar.SubContent>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteMenubar.Portal>\n <KobalteMenubar.SubContent\n class={cn(\n overlaySurface,\n overlayMotion,\n 'z-(--z-menu) min-w-[8rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n menuContentPadding,\n local.class\n )}\n {...rest}\n />\n </KobalteMenubar.Portal>\n )\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"menubar.js","names":["Menubar","KobalteMenubar","Check","ChevronRight","Circle","ComponentProps","splitProps","menuContentPadding","destructiveMenuItem","menuItem","menuLabel","menuSeparator","overlayMotion","overlaySurface","popoverArrow","cn","props","local","rest","_$createComponent","_$mergeProps","class","MenubarMenu","Menu","MenubarTrigger","Trigger","MenubarContent","Content","Portal","children","Arrow","_$memo","MenubarItem","Item","variant","shortcut","keyshortcuts","aria-keyshortcuts","_el$","_tmpl$","_$insert","MenubarCheckboxItem","CheckboxItem","ItemIndicator","MenubarRadioGroup","RadioGroup","MenubarRadioItem","RadioItem","MenubarLabel","GroupLabel","MenubarGroup","Group","MenubarSeparator","Separator","MenubarSub","Sub","MenubarSubTrigger","SubTrigger","MenubarSubContent","SubContent","Menubar","_$createComponent","KobalteMenubar","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/menubar/menubar.tsx"],"sourcesContent":["import { Menubar as KobalteMenubar } from '@kobalte/core/menubar'\nimport { Check, ChevronRight, Circle } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport {\n menuContentPadding,\n destructiveMenuItem,\n menuItem,\n menuLabel,\n menuSeparator,\n overlayMotion,\n overlaySurface,\n popoverArrow,\n} from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * Menubar.\n *\n * A persistent row of menus at the top of a surface — the desktop application\n * pattern. Each trigger opens its own menu, and the arrow keys move *between*\n * menus once one is open, which is what makes a menubar a single control rather\n * than five menus that happen to be adjacent.\n *\n * This is for a window-level command surface. For actions on one thing, use\n * DropdownMenu; a menubar on a row would be a menu pretending to be chrome.\n */\nexport function Menubar(props: ComponentProps<typeof KobalteMenubar>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteMenubar\n class={cn(\n 'flex items-center gap-0.5 rounded-md border border-border bg-card p-0.5',\n local.class\n )}\n {...rest}\n />\n )\n}\n\n/**\n * One top-level menu: a trigger and the panel it opens.\n *\n * Required, and the reason the component is not just a row of triggers — the\n * menubar's arrow keys move *between* menus, which only works when each trigger\n * belongs to a menu the bar knows about. `value` names it.\n */\nexport function MenubarMenu(props: ComponentProps<typeof KobalteMenubar.Menu>) {\n return <KobalteMenubar.Menu {...props} />\n}\n\nexport function MenubarTrigger(props: ComponentProps<typeof KobalteMenubar.Trigger>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteMenubar.Trigger\n class={cn(\n 'flex items-center rounded-sm px-2 py-1 text-sm font-medium select-none',\n 'transition-colors ease-out outline-none',\n 'data-[expanded]:bg-surface-active',\n 'data-[highlighted]:bg-surface-hover',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n local.class\n )}\n {...rest}\n />\n )\n}\n\nexport function MenubarContent(props: ComponentProps<typeof KobalteMenubar.Content>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n return (\n <KobalteMenubar.Portal>\n <KobalteMenubar.Content\n class={cn(\n overlaySurface,\n overlayMotion,\n 'z-(--z-menu) min-w-[10rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n menuContentPadding,\n local.class\n )}\n {...rest}\n >\n <KobalteMenubar.Arrow aria-hidden=\"true\" class={popoverArrow} />\n {local.children}\n </KobalteMenubar.Content>\n </KobalteMenubar.Portal>\n )\n}\n\nexport function MenubarItem(\n props: ComponentProps<typeof KobalteMenubar.Item> & {\n variant?: 'default' | 'destructive'\n shortcut?: string\n /**\n * The parseable chord behind `shortcut`, e.g. `Meta+N`. The drawn glyph is\n * `aria-hidden` — reading it out would pollute the item's accessible name —\n * so this is what assistive technology announces instead. Supply it\n * whenever `shortcut` is drawn.\n */\n keyshortcuts?: string\n }\n) {\n const [local, rest] = splitProps(props, [\n 'class',\n 'variant',\n 'shortcut',\n 'keyshortcuts',\n 'children',\n ])\n return (\n <KobalteMenubar.Item\n class={cn(\n menuItem,\n {\n [destructiveMenuItem]: local.variant === 'destructive',\n },\n local.class\n )}\n aria-keyshortcuts={local.keyshortcuts}\n {...rest}\n >\n {local.children}\n {local.shortcut ? (\n <span\n aria-hidden=\"true\"\n class=\"text-muted-foreground ms-auto font-code text-code tracking-widest\"\n >\n {local.shortcut}\n </span>\n ) : null}\n </KobalteMenubar.Item>\n )\n}\n\nexport function MenubarCheckboxItem(props: ComponentProps<typeof KobalteMenubar.CheckboxItem>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n return (\n <KobalteMenubar.CheckboxItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n {local.children}\n <KobalteMenubar.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n <Check class=\"size-4\" />\n </KobalteMenubar.ItemIndicator>\n </KobalteMenubar.CheckboxItem>\n )\n}\n\nexport function MenubarRadioGroup(props: ComponentProps<typeof KobalteMenubar.RadioGroup>) {\n return <KobalteMenubar.RadioGroup {...props} />\n}\n\nexport function MenubarRadioItem(props: ComponentProps<typeof KobalteMenubar.RadioItem>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n return (\n <KobalteMenubar.RadioItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n {local.children}\n <KobalteMenubar.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n <Circle class=\"size-2 fill-current\" />\n </KobalteMenubar.ItemIndicator>\n </KobalteMenubar.RadioItem>\n )\n}\n\n/**\n * The caption of a `MenubarGroup`, and that group's accessible name. It must be a\n * child of the group it names: Kobalte reads the group from context, so a label\n * placed directly in the content throws `useMenuGroupContext must be used within\n * a Menu.Group` the moment the menu opens. For an ungrouped caption, wrap the\n * label and its items in a group anyway — the grouping is what a screen reader\n * announces.\n */\nexport function MenubarLabel(props: ComponentProps<typeof KobalteMenubar.GroupLabel>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteMenubar.GroupLabel class={cn(menuLabel, local.class)} {...rest} />\n}\n\nexport function MenubarGroup(props: ComponentProps<typeof KobalteMenubar.Group>) {\n return <KobalteMenubar.Group {...props} />\n}\n\nexport function MenubarSeparator(props: ComponentProps<typeof KobalteMenubar.Separator>) {\n const [local, rest] = splitProps(props, ['class'])\n return <KobalteMenubar.Separator class={cn(menuSeparator, local.class)} {...rest} />\n}\n\nexport function MenubarSub(props: ComponentProps<typeof KobalteMenubar.Sub>) {\n return <KobalteMenubar.Sub {...props} />\n}\n\nexport function MenubarSubTrigger(props: ComponentProps<typeof KobalteMenubar.SubTrigger>) {\n const [local, rest] = splitProps(props, ['class', 'children'])\n return (\n <KobalteMenubar.SubTrigger class={cn(menuItem, local.class)} {...rest}>\n {local.children}\n <ChevronRight class=\"ms-auto size-4\" />\n </KobalteMenubar.SubTrigger>\n )\n}\n\nexport function MenubarSubContent(props: ComponentProps<typeof KobalteMenubar.SubContent>) {\n const [local, rest] = splitProps(props, ['class'])\n return (\n <KobalteMenubar.Portal>\n <KobalteMenubar.SubContent\n class={cn(\n overlaySurface,\n overlayMotion,\n 'z-(--z-menu) min-w-[8rem] origin-(--kb-menu-content-transform-origin) overflow-hidden',\n menuContentPadding,\n local.class\n )}\n {...rest}\n />\n </KobalteMenubar.Portal>\n )\n}\n"],"mappings":"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"}
|
|
@@ -49,11 +49,9 @@ export declare function Heading<T extends ValidComponent = 'h2'>(props: HeadingP
|
|
|
49
49
|
/**
|
|
50
50
|
* Text.
|
|
51
51
|
*
|
|
52
|
-
* Everything that is not a heading.
|
|
53
|
-
*
|
|
54
|
-
*
|
|
55
|
-
* `micro` (11px, 500) is the floor — keyboard keys and the status bar. `code` is
|
|
56
|
-
* the mono face at 12px, for anything a user compares character by character.
|
|
52
|
+
* Everything that is not a heading. Body and strong copy use the content font
|
|
53
|
+
* axis; labels, captions and microcopy inherit the UI face. Code uses its own
|
|
54
|
+
* family and size axis for anything a user compares character by character.
|
|
57
55
|
*
|
|
58
56
|
* `tone` is a separate axis from `variant` because "secondary" is a colour
|
|
59
57
|
* decision, not a size: a muted caption and a muted body line are both common.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/typography/typography.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAA;AAC/E,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAGtD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,eAAe;;;;;8EAsC1B,CAAA;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc;;;;;;;CAOjB,CAAA;AAEV,KAAK,mBAAmB,GAAG,YAAY,CAAC,OAAO,eAAe,CAAC,CAAA;AAG/D,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,cAAc,GAAG,IAAI,IAAI,gBAAgB,CAC1E,CAAC,EACD,mBAAmB,GAAG;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CACF,CAAA;AAED,wBAAgB,OAAO,CAAC,CAAC,SAAS,cAAc,GAAG,IAAI,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,kCA0B9E;AAED
|
|
1
|
+
{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/typography/typography.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAA;AAC/E,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAGtD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,eAAe;;;;;8EAsC1B,CAAA;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc;;;;;;;CAOjB,CAAA;AAEV,KAAK,mBAAmB,GAAG,YAAY,CAAC,OAAO,eAAe,CAAC,CAAA;AAG/D,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,cAAc,GAAG,IAAI,IAAI,gBAAgB,CAC1E,CAAC,EACD,mBAAmB,GAAG;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CACF,CAAA;AAED,wBAAgB,OAAO,CAAC,CAAC,SAAS,cAAc,GAAG,IAAI,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,kCA0B9E;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,YAAY;;;;8EA6BvB,CAAA;AAEF,eAAO,MAAM,WAAW;;;;;;;CAOd,CAAA;AAEV,KAAK,gBAAgB,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAA;AAGzD,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,cAAc,GAAG,GAAG,IAAI,gBAAgB,CACtE,CAAC,EACD,gBAAgB,GAAG;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CACF,CAAA;AAED,wBAAgB,IAAI,CAAC,CAAC,SAAS,cAAc,GAAG,GAAG,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,kCAoBvE"}
|
|
@@ -102,11 +102,9 @@ function Heading(props) {
|
|
|
102
102
|
/**
|
|
103
103
|
* Text.
|
|
104
104
|
*
|
|
105
|
-
* Everything that is not a heading.
|
|
106
|
-
*
|
|
107
|
-
*
|
|
108
|
-
* `micro` (11px, 500) is the floor — keyboard keys and the status bar. `code` is
|
|
109
|
-
* the mono face at 12px, for anything a user compares character by character.
|
|
105
|
+
* Everything that is not a heading. Body and strong copy use the content font
|
|
106
|
+
* axis; labels, captions and microcopy inherit the UI face. Code uses its own
|
|
107
|
+
* family and size axis for anything a user compares character by character.
|
|
110
108
|
*
|
|
111
109
|
* `tone` is a separate axis from `variant` because "secondary" is a colour
|
|
112
110
|
* decision, not a size: a muted caption and a muted body line are both common.
|
|
@@ -119,17 +117,17 @@ var textVariants = cva("", {
|
|
|
119
117
|
variants: {
|
|
120
118
|
variant: {
|
|
121
119
|
/** 14px / 400. Body copy and descriptions. */
|
|
122
|
-
body: "text-
|
|
120
|
+
body: "font-content text-content",
|
|
123
121
|
/** 14px / 500. Labels, control text, list-row titles. */
|
|
124
122
|
label: "text-sm font-medium",
|
|
125
123
|
/** 14px / 600. Emphasis inside body copy. */
|
|
126
|
-
strong: "text-
|
|
124
|
+
strong: "font-content text-content font-semibold",
|
|
127
125
|
/** 12px / 400. Metadata, secondary rows, units. */
|
|
128
126
|
caption: "text-xs",
|
|
129
127
|
/** 11px / 500. The floor: keyboard keys, the status bar. */
|
|
130
128
|
micro: "text-2xs font-medium",
|
|
131
129
|
/** 12px mono. Ids, paths, hashes, inline code. */
|
|
132
|
-
code: "font-
|
|
130
|
+
code: "font-code text-code"
|
|
133
131
|
},
|
|
134
132
|
tone: {
|
|
135
133
|
inherit: "",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"typography.js","names":["Polymorphic","PolymorphicProps","ComponentProps","splitProps","ValidComponent","cva","VariantProps","cn","headingVariants","variants","size","display","title","page","section","card","subsection","leading","rung","none","numeric","true","tone","inherit","foreground","muted","defaultVariants","headingElement","const","HeadingVariantProps","HeadingSize","HeadingProps","T","class","Heading","props","local","rest","as","_$createComponent","_$mergeProps","textVariants","variant","body","label","strong","caption","micro","code","textElement","TextVariantProps","TextVariant","TextProps","Text","_$createComponent","_$mergeProps"],"sources":["../../../../src/components/ui/typography/typography.tsx"],"sourcesContent":["import { Polymorphic, type PolymorphicProps } from '@kobalte/core/polymorphic'\nimport { type ComponentProps, splitProps, type ValidComponent } from 'solid-js'\nimport { cva, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\n\n/**\n * Typography.\n *\n * The type ladder in `theme.css` has eight rungs, each with its own leading. These\n * two components are where a rung is paired with its weight and tracking, so a call\n * site names a *role* — a page title, a section heading, a caption — and never\n * re-decides `text-xl font-semibold tracking-tight` for itself. Twenty call sites\n * that each choose a size and a weight drift; twenty that name a role cannot.\n *\n * **Size is visual; the element is the document outline.** They are separate\n * decisions and the API keeps them separate. Each size has a conventional default\n * element (`display`, `title` and `page` render an `h1`, `section` an `h2`, `card`\n * an `h3`, `subsection` an `h4`) so the common case needs no prop, but the default\n * is a convenience, not a coupling: a card-sized title that is the first heading\n * in a settings section is an `h2`, so it says `as=\"h2\"`. Never pick a `size` to get\n * a heading level, and never pick an element to get a size.\n *\n * Headings are 600, and weights stop at 600 — on a dark surface a bold word blooms.\n * Leading comes from the rung; `leading=\"none\"` is for a title whose surrounding\n * stack already sets the rhythm (a card or dialog header), and is the only other\n * option.\n */\nexport const headingVariants = cva('font-semibold', {\n variants: {\n size: {\n /** 30px. An app-level headline — a first-run or empty-app screen. Once per app. */\n display: 'text-3xl tracking-tight',\n /** 24px. A landing title or a headline figure larger than a stat's. */\n title: 'text-2xl tracking-tight',\n /** 20px. The title of a page (`PageHeaderTitle`). */\n page: 'text-xl tracking-tight',\n /** 18px. A section heading inside a page (`PageSection`). */\n section: 'text-lg tracking-tight',\n /** 16px. A card, dialog, drawer or settings-section title. */\n card: 'text-base tracking-tight',\n /** 14px. A heading inside a compact surface: a sheet, a chart, a column. */\n subsection: 'text-sm',\n },\n leading: {\n /** The rung's own line-height from `theme.css`. */\n rung: '',\n /** Line-height 1, for a title whose container's gap sets the rhythm. */\n none: 'leading-none',\n },\n /** Tabular figures, so a row of numbers can be compared without digits shifting. */\n numeric: {\n true: 'tabular-nums',\n },\n tone: {\n /** Inherit the surrounding colour — right on every surface by construction. */\n inherit: '',\n foreground: 'text-foreground',\n muted: 'text-muted-foreground',\n },\n },\n defaultVariants: {\n size: 'section',\n leading: 'rung',\n tone: 'inherit',\n },\n})\n\n/**\n * The conventional element for each heading size. Exported so a test (and a\n * reader) can see the whole mapping in one place; pass `as` to depart from it.\n */\nexport const headingElement = {\n display: 'h1',\n title: 'h1',\n page: 'h1',\n section: 'h2',\n card: 'h3',\n subsection: 'h4',\n} as const\n\ntype HeadingVariantProps = VariantProps<typeof headingVariants>\ntype HeadingSize = keyof typeof headingElement\n\nexport type HeadingProps<T extends ValidComponent = 'h2'> = PolymorphicProps<\n T,\n HeadingVariantProps & {\n class?: string\n }\n>\n\nexport function Heading<T extends ValidComponent = 'h2'>(props: HeadingProps<T>) {\n const [local, rest] = splitProps(props as HeadingProps & { as?: ValidComponent }, [\n 'as',\n 'size',\n 'leading',\n 'numeric',\n 'tone',\n 'class',\n ])\n\n return (\n <Polymorphic\n as={local.as ?? headingElement[(local.size ?? 'section') as HeadingSize]}\n data-slot=\"heading\"\n class={cn(\n headingVariants({\n size: local.size,\n leading: local.leading,\n numeric: local.numeric,\n tone: local.tone,\n }),\n local.class\n )}\n {...(rest as ComponentProps<'h2'>)}\n />\n )\n}\n\n/**\n * Text.\n *\n * Everything that is not a heading.
|
|
1
|
+
{"version":3,"file":"typography.js","names":["Polymorphic","PolymorphicProps","ComponentProps","splitProps","ValidComponent","cva","VariantProps","cn","headingVariants","variants","size","display","title","page","section","card","subsection","leading","rung","none","numeric","true","tone","inherit","foreground","muted","defaultVariants","headingElement","const","HeadingVariantProps","HeadingSize","HeadingProps","T","class","Heading","props","local","rest","as","_$createComponent","_$mergeProps","textVariants","variant","body","label","strong","caption","micro","code","textElement","TextVariantProps","TextVariant","TextProps","Text","_$createComponent","_$mergeProps"],"sources":["../../../../src/components/ui/typography/typography.tsx"],"sourcesContent":["import { Polymorphic, type PolymorphicProps } from '@kobalte/core/polymorphic'\nimport { type ComponentProps, splitProps, type ValidComponent } from 'solid-js'\nimport { cva, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\n\n/**\n * Typography.\n *\n * The type ladder in `theme.css` has eight rungs, each with its own leading. These\n * two components are where a rung is paired with its weight and tracking, so a call\n * site names a *role* — a page title, a section heading, a caption — and never\n * re-decides `text-xl font-semibold tracking-tight` for itself. Twenty call sites\n * that each choose a size and a weight drift; twenty that name a role cannot.\n *\n * **Size is visual; the element is the document outline.** They are separate\n * decisions and the API keeps them separate. Each size has a conventional default\n * element (`display`, `title` and `page` render an `h1`, `section` an `h2`, `card`\n * an `h3`, `subsection` an `h4`) so the common case needs no prop, but the default\n * is a convenience, not a coupling: a card-sized title that is the first heading\n * in a settings section is an `h2`, so it says `as=\"h2\"`. Never pick a `size` to get\n * a heading level, and never pick an element to get a size.\n *\n * Headings are 600, and weights stop at 600 — on a dark surface a bold word blooms.\n * Leading comes from the rung; `leading=\"none\"` is for a title whose surrounding\n * stack already sets the rhythm (a card or dialog header), and is the only other\n * option.\n */\nexport const headingVariants = cva('font-semibold', {\n variants: {\n size: {\n /** 30px. An app-level headline — a first-run or empty-app screen. Once per app. */\n display: 'text-3xl tracking-tight',\n /** 24px. A landing title or a headline figure larger than a stat's. */\n title: 'text-2xl tracking-tight',\n /** 20px. The title of a page (`PageHeaderTitle`). */\n page: 'text-xl tracking-tight',\n /** 18px. A section heading inside a page (`PageSection`). */\n section: 'text-lg tracking-tight',\n /** 16px. A card, dialog, drawer or settings-section title. */\n card: 'text-base tracking-tight',\n /** 14px. A heading inside a compact surface: a sheet, a chart, a column. */\n subsection: 'text-sm',\n },\n leading: {\n /** The rung's own line-height from `theme.css`. */\n rung: '',\n /** Line-height 1, for a title whose container's gap sets the rhythm. */\n none: 'leading-none',\n },\n /** Tabular figures, so a row of numbers can be compared without digits shifting. */\n numeric: {\n true: 'tabular-nums',\n },\n tone: {\n /** Inherit the surrounding colour — right on every surface by construction. */\n inherit: '',\n foreground: 'text-foreground',\n muted: 'text-muted-foreground',\n },\n },\n defaultVariants: {\n size: 'section',\n leading: 'rung',\n tone: 'inherit',\n },\n})\n\n/**\n * The conventional element for each heading size. Exported so a test (and a\n * reader) can see the whole mapping in one place; pass `as` to depart from it.\n */\nexport const headingElement = {\n display: 'h1',\n title: 'h1',\n page: 'h1',\n section: 'h2',\n card: 'h3',\n subsection: 'h4',\n} as const\n\ntype HeadingVariantProps = VariantProps<typeof headingVariants>\ntype HeadingSize = keyof typeof headingElement\n\nexport type HeadingProps<T extends ValidComponent = 'h2'> = PolymorphicProps<\n T,\n HeadingVariantProps & {\n class?: string\n }\n>\n\nexport function Heading<T extends ValidComponent = 'h2'>(props: HeadingProps<T>) {\n const [local, rest] = splitProps(props as HeadingProps & { as?: ValidComponent }, [\n 'as',\n 'size',\n 'leading',\n 'numeric',\n 'tone',\n 'class',\n ])\n\n return (\n <Polymorphic\n as={local.as ?? headingElement[(local.size ?? 'section') as HeadingSize]}\n data-slot=\"heading\"\n class={cn(\n headingVariants({\n size: local.size,\n leading: local.leading,\n numeric: local.numeric,\n tone: local.tone,\n }),\n local.class\n )}\n {...(rest as ComponentProps<'h2'>)}\n />\n )\n}\n\n/**\n * Text.\n *\n * Everything that is not a heading. Body and strong copy use the content font\n * axis; labels, captions and microcopy inherit the UI face. Code uses its own\n * family and size axis for anything a user compares character by character.\n *\n * `tone` is a separate axis from `variant` because \"secondary\" is a colour\n * decision, not a size: a muted caption and a muted body line are both common.\n * The default inherits, so text on a filled surface picks up that surface's\n * foreground without the caller restating it.\n *\n * Defaults: `body` renders a `p`, `code` a `code`, every other variant a `span`.\n */\nexport const textVariants = cva('', {\n variants: {\n variant: {\n /** 14px / 400. Body copy and descriptions. */\n body: 'font-content text-content',\n /** 14px / 500. Labels, control text, list-row titles. */\n label: 'text-sm font-medium',\n /** 14px / 600. Emphasis inside body copy. */\n strong: 'font-content text-content font-semibold',\n /** 12px / 400. Metadata, secondary rows, units. */\n caption: 'text-xs',\n /** 11px / 500. The floor: keyboard keys, the status bar. */\n micro: 'text-2xs font-medium',\n /** 12px mono. Ids, paths, hashes, inline code. */\n code: 'font-code text-code',\n },\n tone: {\n inherit: '',\n foreground: 'text-foreground',\n muted: 'text-muted-foreground',\n },\n numeric: {\n true: 'tabular-nums',\n },\n },\n defaultVariants: {\n variant: 'body',\n tone: 'inherit',\n },\n})\n\nexport const textElement = {\n body: 'p',\n label: 'span',\n strong: 'span',\n caption: 'span',\n micro: 'span',\n code: 'code',\n} as const\n\ntype TextVariantProps = VariantProps<typeof textVariants>\ntype TextVariant = keyof typeof textElement\n\nexport type TextProps<T extends ValidComponent = 'p'> = PolymorphicProps<\n T,\n TextVariantProps & {\n class?: string\n }\n>\n\nexport function Text<T extends ValidComponent = 'p'>(props: TextProps<T>) {\n const [local, rest] = splitProps(props as TextProps & { as?: ValidComponent }, [\n 'as',\n 'variant',\n 'tone',\n 'numeric',\n 'class',\n ])\n\n return (\n <Polymorphic\n as={local.as ?? textElement[(local.variant ?? 'body') as TextVariant]}\n data-slot=\"text\"\n class={cn(\n textVariants({ variant: local.variant, tone: local.tone, numeric: local.numeric }),\n local.class\n )}\n {...(rest as ComponentProps<'p'>)}\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,IAAaQ,kBAAkBH,IAAI,iBAAiB;CAClDI,UAAU;EACRC,MAAM;;GAEJC,SAAS;;GAETC,OAAO;;GAEPC,MAAM;;GAENC,SAAS;;GAETC,MAAM;;GAENC,YAAY;EACd;EACAC,SAAS;;GAEPC,MAAM;;GAENC,MAAM;EACR;;EAEAC,SAAS,EACPC,MAAM,eACR;EACAC,MAAM;;GAEJC,SAAS;GACTC,YAAY;GACZC,OAAO;EACT;CACF;CACAC,iBAAiB;EACfhB,MAAM;EACNO,SAAS;EACTK,MAAM;CACR;AACF,CAAC;;;;;AAMD,IAAaK,iBAAiB;CAC5BhB,SAAS;CACTC,OAAO;CACPC,MAAM;CACNC,SAAS;CACTC,MAAM;CACNC,YAAY;AACd;AAYA,SAAgBkB,QAAyCC,OAAwB;CAC/E,MAAM,CAACC,OAAOC,QAAQlC,WAAWgC,OAAiD;EAChF;EACA;EACA;EACA;EACA;EACA;CAAO,CACR;CAED,OAAAI,gBACGvC,aAAWwC,WAAA;EAAA,IACVF,KAAE;GAAA,OAAEF,MAAME,MAAMX,eAAgBS,MAAM1B,QAAQ;EAA0B;EAAA,aAAA;EAAA,KAAA,WAAA;GAAA,OAEjEH,GACLC,gBAAgB;IACdE,MAAM0B,MAAM1B;IACZO,SAASmB,MAAMnB;IACfG,SAASgB,MAAMhB;IACfE,MAAMc,MAAMd;GACd,CAAC,GACDc,MAAMH,KACR;EAAC;CAAA,GACII,IAA4B,CAAA;AAGvC;;;;;;;;;;;;;;;AAgBA,IAAaI,eAAepC,IAAI,IAAI;CAClCI,UAAU;EACRiC,SAAS;;GAEPC,MAAM;;GAENC,OAAO;;GAEPC,QAAQ;;GAERC,SAAS;;GAETC,OAAO;;GAEPC,MAAM;EACR;EACA1B,MAAM;GACJC,SAAS;GACTC,YAAY;GACZC,OAAO;EACT;EACAL,SAAS,EACPC,MAAM,eACR;CACF;CACAK,iBAAiB;EACfgB,SAAS;EACTpB,MAAM;CACR;AACF,CAAC;AAED,IAAa2B,cAAc;CACzBN,MAAM;CACNC,OAAO;CACPC,QAAQ;CACRC,SAAS;CACTC,OAAO;CACPC,MAAM;AACR;AAYA,SAAgBK,KAAqClB,OAAqB;CACxE,MAAM,CAACC,OAAOC,QAAQlC,WAAWgC,OAA8C;EAC7E;EACA;EACA;EACA;EACA;CAAO,CACR;CAED,OAAAI,gBACGvC,aAAWwC,WAAA;EAAA,IACVF,KAAE;GAAA,OAAEF,MAAME,MAAMW,YAAab,MAAMM,WAAW;EAAuB;EAAA,aAAA;EAAA,KAAA,WAAA;GAAA,OAE9DnC,GACLkC,aAAa;IAAEC,SAASN,MAAMM;IAASpB,MAAMc,MAAMd;IAAMF,SAASgB,MAAMhB;GAAQ,CAAC,GACjFgB,MAAMH,KACR;EAAC;CAAA,GACII,IAA2B,CAAA;AAGtC"}
|
package/dist/index.js
CHANGED
|
@@ -95,9 +95,13 @@ import { MessageBody, MessageDayDivider, MessageGroup, MessageRow } from "./comp
|
|
|
95
95
|
import { TranscriptComposition, transcriptDisclosureKey } from "./components/conversation/transcript-composition.js";
|
|
96
96
|
import { AttachmentCard, ThreadPanel } from "./components/conversation/thread-panel.js";
|
|
97
97
|
import { PASTE_THRESHOLD_CHARS, PASTE_THRESHOLD_LINES, PASTE_TOKEN_REGEX, countLines, expandAll, findTokenRanges, formatToken, isPasteBlock, nextSeq, pruneBlocks, recollapsePastes, remapCarriedBlocks, shouldCollapse, stripTrailingBlankLines, tokenRangeAt } from "./components/conversation/paste-tokens.js";
|
|
98
|
-
import {
|
|
98
|
+
import { fontOptions } from "./lib/font-catalog.js";
|
|
99
|
+
import { accentPresets, allTokens, colorTokens, densityTokens, designTokens, elevationTokens, motionTokens, radiusTokens, typographyTokens, undocumentedTokenAliases, zIndexTokens } from "./lib/tokens.js";
|
|
99
100
|
import { isThemeAccentId } from "./lib/theme-accents.js";
|
|
100
101
|
import { appearancePreviewThemes, builtinThemes, contrastRatio, defaultDarkThemeId, defaultLightThemeId, resolveAccentPreset, themeAccentsFor, themeById, themeCssVariables, themeFamilies, themeRecordById, themeRecords, themesForAppearance, validateTheme, validateThemeRegistry, withAccent } from "./lib/themes.js";
|
|
102
|
+
import { APPEARANCE_EDITOR_FONT_AXES, APPEARANCE_EDITOR_FONT_SIZE_MAX, APPEARANCE_EDITOR_FONT_SIZE_MIN, DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS, applyAppearanceFontSettings, fontSettingsBootstrapScript, normalizeAppearanceEditorFontSettings, normalizeAppearanceEditorFontSize } from "./lib/appearance-font-settings.js";
|
|
103
|
+
import { PalettePreview, ThemeMiniature, ThemeMiniatureSplit } from "./components/composites/appearance-editor/theme-preview.js";
|
|
104
|
+
import { AppearanceFontSettingsGroup } from "./components/composites/appearance-editor/font-settings-group.js";
|
|
101
105
|
import { ThemePicker, ThemePreview, ThemeSwatch } from "./components/theme/theme-picker.js";
|
|
102
106
|
import { ThemeProvider, defaultThemeSelection, inlineScriptLiteral, resolvedDensity, themeScript, useTheme } from "./components/theme/theme-provider.js";
|
|
103
107
|
import { AppearancePanel } from "./components/theme/appearance-panel.js";
|
|
@@ -115,7 +119,6 @@ import { SettingsNavigation } from "./components/composites/settings/settings-na
|
|
|
115
119
|
import { SettingsLayout } from "./components/composites/settings/settings-layout.js";
|
|
116
120
|
import { SceneControls } from "./components/composites/scene-controls/scene-controls.js";
|
|
117
121
|
import { PropertyList, PropertyRow, PropertyTerm, PropertyValue, Stat, StatGroup } from "./components/composites/stat/stat.js";
|
|
118
|
-
import { PalettePreview, ThemeMiniature, ThemeMiniatureSplit } from "./components/composites/appearance-editor/theme-preview.js";
|
|
119
122
|
import { AppearanceEditor, AppearancePopover } from "./components/composites/appearance-editor/appearance-editor.js";
|
|
120
123
|
import { formatBytes, formatReleaseDate, plainTextFromMarkdown } from "./lib/version-notes.js";
|
|
121
124
|
import { UpdateDialog } from "./components/composites/update-dialog/update-dialog.js";
|
|
@@ -123,4 +126,4 @@ import { AboutDialog } from "./components/composites/about-dialog/about-dialog.j
|
|
|
123
126
|
import { HelpCenter } from "./components/composites/help-center/help-center.js";
|
|
124
127
|
import { WorkspaceMark } from "./components/composites/workspace-mark/workspace-mark.js";
|
|
125
128
|
import { writeClipboardText } from "./lib/clipboard.js";
|
|
126
|
-
export { AboutDialog, Accordion, AccordionContent, AccordionItem, AccordionTrigger, AccountMenu, ActionButton, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, AppShellBody, AppShellContent, AppShellMain, AppearanceEditor, AppearancePanel, AppearancePopover, AspectRatio, AttachmentCard, Avatar, AvatarFallback, AvatarImage, Badge, Board, BoardCardBody, BoardCardTitle, BoardCardTrigger, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbSeparator, BusySendButton, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CalendarSurface, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CatalogBrowser, CatalogDetail, CatalogDetailSection, ChatComposer, Checkbox, CheckboxDescription, CheckboxLabel, CodeBlock, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxClear, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxSection, ComboboxTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, CommandSeparator, CommandShortcut, ComposerAttachmentButton, ComposerHint, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, ConversationAvatar, ConversationSurface, DatePicker, DetailPanel, DetailPanelBody, DetailPanelField, DetailPanelHeader, DetailPanelSection, Dialog, DialogClose, DialogCloseButton, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiffBlock, DiffSummary, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, EmptyTitle, EntityIcon, FLOATING_PREVIEW_CORNER_RADIUS, FLOATING_PREVIEW_EDGE_GAP, Field, FieldDescription, FieldError, FieldGroup, FieldInput, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTextArea, FloatingPreview, FormField, Heading, HelpCenter, HoverCard, HoverCardContent, HoverCardTrigger, InlineCode, Input, InputControl, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputOtp, InputOtpCaret, Item, ItemDescription, ItemEmpty, ItemGroup, ItemGroupEntry, ItemTitle, Kbd, KbdChord, KbdGroup, Label, ListGroup, ListRow, ListRowControl, MAX_LAYOUT_DEPTH, MAX_LAYOUT_LEAVES, MAX_SPLIT_RATIO, MIN_SPLIT_RATIO, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageBody, MessageComposer, MessageDayDivider, MessageGroup, MessageRow, ModalDialog, Motion, NO_FLOATING_PREVIEW_OBSTACLES, NO_PREVIEW_MINI_PLAYER_OBSTACLES, NativeSelect, NavigationMenu, NavigationMenuContent, NavigationMenuGroup, NavigationMenuGroupLabel, NavigationMenuItem, NavigationMenuMenu, NavigationMenuSeparator, NavigationMenuTrigger, NavigationMenuViewport, NumberField, OrbitItem, OrbitLayout, PASTE_THRESHOLD_CHARS, PASTE_THRESHOLD_LINES, PASTE_TOKEN_REGEX, PREVIEW_MINI_PLAYER_CORNER_RADIUS, PREVIEW_MINI_PLAYER_EDGE_GAP, Page, PageHeader, PageHeaderActions, PageHeaderContent, PageHeaderDescription, PageHeaderTitle, PageSection, Pagination, PaginationEllipsis, PaginationItem, PaginationNext, PaginationPrevious, PalettePreview, Panel, PanelActions, PanelBody, PanelCard, PanelDescription, PanelFooter, PanelHeader, PanelPlaceholder, PanelTitle, PanelToolbar, Popover, PopoverAnchor, PopoverCloseButton, PopoverContent, PopoverDescription, PopoverTitle, PopoverTrigger, Presence, Progress, PropertyList, PropertyRow, PropertyTerm, PropertyValue, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, SceneControls, ScrollArea, SecretInputGroup, Select, SelectChevronsUpDown, SelectContent, SelectItem, SelectLabel, SelectSection, SelectTrigger, SelectValue, Separator, SettingsField, SettingsLayout, SettingsNavigation, SettingsPage, SettingsRow, SettingsSection, Sheet, SheetBody, SheetCloseButton, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, SideRail, SideRailButton, SideRailContent, SideRailFooter, SideRailHeader, SideRailItem, SideRailSection, SidebarNav, SidebarNavButton, SidebarNavContent, SidebarNavFooter, SidebarNavHeader, SidebarNavItem, SidebarNavLabel, SidebarNavResizeHandle, SidebarNavRow, SidebarNavSection, SidebarNavTitle, Skeleton, SkipLink, Slider, Spinner, SplitLayout, Stat, StatGroup, StatusBar, StatusBarItem, StatusBarSpacer, StatusChip, StatusList, Switch, SwitchDescription, SwitchLabel, TALL_CODE_BLOCK_PX, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableNumericCell, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Text, TextLink, Textarea, ThemeMiniature, ThemeMiniatureSplit, ThemeModeToggle, ThemePicker, ThemePreview, ThemeProvider, ThemeSwatch, ThemeToggle, ThreadPanel, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, TopBarBreadcrumb, TopBarPill, TopBarSearch, TopBarSection, TopBarTitle, TranscriptComposition, Tree, TreeRow, UpdateDialog, ValueCombobox, VirtualWindow, WorkspaceMark, accentPresets, alertVariants, allTokens, appearancePreviewThemes, badgeVariants, boardCardTitleVariants, builtinThemes, buttonVariants, clampFloatingPreviewPosition, clampPreviewMiniPlayerPosition, closePane, cn, colorTokens, computeLayoutFrames, contrastRatio, controlInteractive, controlSize, controlSizeIcon, controlSizes, countLeaves, countLines, createAppMenuItems, createLayoutState, cva, defaultDarkThemeId, defaultLightThemeId, defaultThemeSelection, densityTokens, designTokens, diffLineVariants, diffStats, diffTargetPath, elevationTokens, entityIconVariants, expandAll, findTokenRanges, focusPane, fontOptions, formatBytes, formatReleaseDate, formatToken, headingElement, headingVariants, initialsFrom, inlineScriptLiteral, isPasteBlock, isThemeAccentId, itemVariants, kbdChordKeys, kbdGroupVariants, kbdVariants, keyedRows, layoutDepth, listLeaves, monogram, motionTokens, movePane, neighborLeaf, nextSeq, normalizeLayout, parseDiff, plainTextFromMarkdown, pruneBlocks, radiusTokens, recollapsePastes, remapCarriedBlocks, resizeFloatingPreview, resizePreviewMiniPlayer, resizeSplit, resolveAccentPreset, resolveFloatingPreviewFrame, resolvePreviewMiniPlayerFrame, resolvedDensity, sheetVariants, shouldCollapse, sidebarNavItemClass, sidebarNavItemStateClass, splitPane, statusDotVariants, stripTrailingBlankLines, surfaceInteractive, swapPanes, textElement, textVariants, textareaVariants, themeAccentsFor, themeById, themeCssVariables, themeFamilies, themeRecordById, themeRecords, themeScript, themesForAppearance, toast, toaster, toggleVariants, tokenRangeAt, transcriptDisclosureKey, typographyTokens, undoClosePane, undocumentedTokenAliases, useSideRail, useTheme, validateTheme, validateThemeRegistry, withAccent, writeClipboardText, zIndexTokens };
|
|
129
|
+
export { APPEARANCE_EDITOR_FONT_AXES, APPEARANCE_EDITOR_FONT_SIZE_MAX, APPEARANCE_EDITOR_FONT_SIZE_MIN, AboutDialog, Accordion, AccordionContent, AccordionItem, AccordionTrigger, AccountMenu, ActionButton, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, AppShellBody, AppShellContent, AppShellMain, AppearanceEditor, AppearanceFontSettingsGroup, AppearancePanel, AppearancePopover, AspectRatio, AttachmentCard, Avatar, AvatarFallback, AvatarImage, Badge, Board, BoardCardBody, BoardCardTitle, BoardCardTrigger, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbSeparator, BusySendButton, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CalendarSurface, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CatalogBrowser, CatalogDetail, CatalogDetailSection, ChatComposer, Checkbox, CheckboxDescription, CheckboxLabel, CodeBlock, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxClear, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxSection, ComboboxTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandLoading, CommandSeparator, CommandShortcut, ComposerAttachmentButton, ComposerHint, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, ConversationAvatar, ConversationSurface, DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS, DatePicker, DetailPanel, DetailPanelBody, DetailPanelField, DetailPanelHeader, DetailPanelSection, Dialog, DialogClose, DialogCloseButton, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiffBlock, DiffSummary, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, EmptyTitle, EntityIcon, FLOATING_PREVIEW_CORNER_RADIUS, FLOATING_PREVIEW_EDGE_GAP, Field, FieldDescription, FieldError, FieldGroup, FieldInput, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTextArea, FloatingPreview, FormField, Heading, HelpCenter, HoverCard, HoverCardContent, HoverCardTrigger, InlineCode, Input, InputControl, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputOtp, InputOtpCaret, Item, ItemDescription, ItemEmpty, ItemGroup, ItemGroupEntry, ItemTitle, Kbd, KbdChord, KbdGroup, Label, ListGroup, ListRow, ListRowControl, MAX_LAYOUT_DEPTH, MAX_LAYOUT_LEAVES, MAX_SPLIT_RATIO, MIN_SPLIT_RATIO, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageBody, MessageComposer, MessageDayDivider, MessageGroup, MessageRow, ModalDialog, Motion, NO_FLOATING_PREVIEW_OBSTACLES, NO_PREVIEW_MINI_PLAYER_OBSTACLES, NativeSelect, NavigationMenu, NavigationMenuContent, NavigationMenuGroup, NavigationMenuGroupLabel, NavigationMenuItem, NavigationMenuMenu, NavigationMenuSeparator, NavigationMenuTrigger, NavigationMenuViewport, NumberField, OrbitItem, OrbitLayout, PASTE_THRESHOLD_CHARS, PASTE_THRESHOLD_LINES, PASTE_TOKEN_REGEX, PREVIEW_MINI_PLAYER_CORNER_RADIUS, PREVIEW_MINI_PLAYER_EDGE_GAP, Page, PageHeader, PageHeaderActions, PageHeaderContent, PageHeaderDescription, PageHeaderTitle, PageSection, Pagination, PaginationEllipsis, PaginationItem, PaginationNext, PaginationPrevious, PalettePreview, Panel, PanelActions, PanelBody, PanelCard, PanelDescription, PanelFooter, PanelHeader, PanelPlaceholder, PanelTitle, PanelToolbar, Popover, PopoverAnchor, PopoverCloseButton, PopoverContent, PopoverDescription, PopoverTitle, PopoverTrigger, Presence, Progress, PropertyList, PropertyRow, PropertyTerm, PropertyValue, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, SceneControls, ScrollArea, SecretInputGroup, Select, SelectChevronsUpDown, SelectContent, SelectItem, SelectLabel, SelectSection, SelectTrigger, SelectValue, Separator, SettingsField, SettingsLayout, SettingsNavigation, SettingsPage, SettingsRow, SettingsSection, Sheet, SheetBody, SheetCloseButton, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, SideRail, SideRailButton, SideRailContent, SideRailFooter, SideRailHeader, SideRailItem, SideRailSection, SidebarNav, SidebarNavButton, SidebarNavContent, SidebarNavFooter, SidebarNavHeader, SidebarNavItem, SidebarNavLabel, SidebarNavResizeHandle, SidebarNavRow, SidebarNavSection, SidebarNavTitle, Skeleton, SkipLink, Slider, Spinner, SplitLayout, Stat, StatGroup, StatusBar, StatusBarItem, StatusBarSpacer, StatusChip, StatusList, Switch, SwitchDescription, SwitchLabel, TALL_CODE_BLOCK_PX, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableNumericCell, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Text, TextLink, Textarea, ThemeMiniature, ThemeMiniatureSplit, ThemeModeToggle, ThemePicker, ThemePreview, ThemeProvider, ThemeSwatch, ThemeToggle, ThreadPanel, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, TopBarBreadcrumb, TopBarPill, TopBarSearch, TopBarSection, TopBarTitle, TranscriptComposition, Tree, TreeRow, UpdateDialog, ValueCombobox, VirtualWindow, WorkspaceMark, accentPresets, alertVariants, allTokens, appearancePreviewThemes, applyAppearanceFontSettings, badgeVariants, boardCardTitleVariants, builtinThemes, buttonVariants, clampFloatingPreviewPosition, clampPreviewMiniPlayerPosition, closePane, cn, colorTokens, computeLayoutFrames, contrastRatio, controlInteractive, controlSize, controlSizeIcon, controlSizes, countLeaves, countLines, createAppMenuItems, createLayoutState, cva, defaultDarkThemeId, defaultLightThemeId, defaultThemeSelection, densityTokens, designTokens, diffLineVariants, diffStats, diffTargetPath, elevationTokens, entityIconVariants, expandAll, findTokenRanges, focusPane, fontOptions, fontSettingsBootstrapScript, formatBytes, formatReleaseDate, formatToken, headingElement, headingVariants, initialsFrom, inlineScriptLiteral, isPasteBlock, isThemeAccentId, itemVariants, kbdChordKeys, kbdGroupVariants, kbdVariants, keyedRows, layoutDepth, listLeaves, monogram, motionTokens, movePane, neighborLeaf, nextSeq, normalizeAppearanceEditorFontSettings, normalizeAppearanceEditorFontSize, normalizeLayout, parseDiff, plainTextFromMarkdown, pruneBlocks, radiusTokens, recollapsePastes, remapCarriedBlocks, resizeFloatingPreview, resizePreviewMiniPlayer, resizeSplit, resolveAccentPreset, resolveFloatingPreviewFrame, resolvePreviewMiniPlayerFrame, resolvedDensity, sheetVariants, shouldCollapse, sidebarNavItemClass, sidebarNavItemStateClass, splitPane, statusDotVariants, stripTrailingBlankLines, surfaceInteractive, swapPanes, textElement, textVariants, textareaVariants, themeAccentsFor, themeById, themeCssVariables, themeFamilies, themeRecordById, themeRecords, themeScript, themesForAppearance, toast, toaster, toggleVariants, tokenRangeAt, transcriptDisclosureKey, typographyTokens, undoClosePane, undocumentedTokenAliases, useSideRail, useTheme, validateTheme, validateThemeRegistry, withAccent, writeClipboardText, zIndexTokens };
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { type FontOption } from '#lib/font-catalog';
|
|
2
|
+
export declare const APPEARANCE_EDITOR_FONT_AXES: readonly ["ui", "content", "code"];
|
|
3
|
+
export type AppearanceEditorFontAxis = (typeof APPEARANCE_EDITOR_FONT_AXES)[number];
|
|
4
|
+
export type AppearanceEditorFontFamilyId = FontOption['id'];
|
|
5
|
+
export type AppearanceEditorFontSetting = Readonly<{
|
|
6
|
+
/** A stable id from the shared font catalogue, never a CSS family string. */
|
|
7
|
+
family: AppearanceEditorFontFamilyId;
|
|
8
|
+
/** A pixel size, normalized to the supported range. */
|
|
9
|
+
size: number;
|
|
10
|
+
}>;
|
|
11
|
+
/** The host-owned choices edited by the shared appearance composition. */
|
|
12
|
+
export type AppearanceEditorFontSettings = Readonly<Record<AppearanceEditorFontAxis, AppearanceEditorFontSetting>>;
|
|
13
|
+
export declare const APPEARANCE_EDITOR_FONT_SIZE_MIN = 10;
|
|
14
|
+
export declare const APPEARANCE_EDITOR_FONT_SIZE_MAX = 32;
|
|
15
|
+
/** New preferences use the platform face in each text role. */
|
|
16
|
+
export declare const DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS: AppearanceEditorFontSettings;
|
|
17
|
+
export type NormalizedAppearanceEditorFontSettings = Readonly<{
|
|
18
|
+
settings: AppearanceEditorFontSettings;
|
|
19
|
+
/** Axes whose persisted family or size was unavailable or outside its limits. */
|
|
20
|
+
recoveredAxes: readonly AppearanceEditorFontAxis[];
|
|
21
|
+
}>;
|
|
22
|
+
/** Normalize a single number-input value; invalid edits return the current size. */
|
|
23
|
+
export declare function normalizeAppearanceEditorFontSize(value: unknown, fallback: number): number;
|
|
24
|
+
/**
|
|
25
|
+
* Recover persisted font choices against the shared font catalogue.
|
|
26
|
+
*
|
|
27
|
+
* `legacyUiFamily` lets a host migrate its previous single font field into the
|
|
28
|
+
* UI axis. Content and code remain on the new System defaults during that
|
|
29
|
+
* migration. Missing settings are ordinary defaults; an unknown saved id or an
|
|
30
|
+
* invalid size is reported through `recoveredAxes` for the host's notice.
|
|
31
|
+
*/
|
|
32
|
+
export declare function normalizeAppearanceEditorFontSettings(value: unknown, legacyUiFamily?: unknown): NormalizedAppearanceEditorFontSettings;
|
|
33
|
+
/**
|
|
34
|
+
* Project normalized font preferences onto a document root.
|
|
35
|
+
*
|
|
36
|
+
* This is shared by `ThemeProvider` and hosts that own their own appearance
|
|
37
|
+
* persistence, so UI/content/code use the same catalogue ids, theme tokens,
|
|
38
|
+
* sizes, and projected CSS variables. The marker activates the optional role
|
|
39
|
+
* stylesheet and survives CSS import reordering.
|
|
40
|
+
*/
|
|
41
|
+
export declare function applyAppearanceFontSettings(root: HTMLElement, value: unknown): NormalizedAppearanceEditorFontSettings;
|
|
42
|
+
/**
|
|
43
|
+
* Generate a safe inline prepaint script for a host-owned appearance record.
|
|
44
|
+
*
|
|
45
|
+
* The stored object is read from `localStorage[storageKey].fonts`. A legacy
|
|
46
|
+
* top-level `font` family migrates into UI only; content/code use the shared
|
|
47
|
+
* defaults. The script applies the same catalogue whitelist, limits, attributes,
|
|
48
|
+
* and CSS properties as `applyAppearanceFontSettings` before styles paint. When
|
|
49
|
+
* `persistedVersion` is supplied, only a record with that exact top-level version
|
|
50
|
+
* is used; absent or mismatched records receive the System defaults.
|
|
51
|
+
*/
|
|
52
|
+
export declare function fontSettingsBootstrapScript(storageKey: string, persistedVersion?: number): string;
|
|
53
|
+
//# sourceMappingURL=appearance-font-settings.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"appearance-font-settings.d.ts","sourceRoot":"","sources":["../../src/lib/appearance-font-settings.ts"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAGhE,eAAO,MAAM,2BAA2B,oCAAqC,CAAA;AAE7E,MAAM,MAAM,wBAAwB,GAAG,CAAC,OAAO,2BAA2B,CAAC,CAAC,MAAM,CAAC,CAAA;AACnF,MAAM,MAAM,4BAA4B,GAAG,UAAU,CAAC,IAAI,CAAC,CAAA;AAE3D,MAAM,MAAM,2BAA2B,GAAG,QAAQ,CAAC;IACjD,6EAA6E;IAC7E,MAAM,EAAE,4BAA4B,CAAA;IACpC,uDAAuD;IACvD,IAAI,EAAE,MAAM,CAAA;CACb,CAAC,CAAA;AAEF,0EAA0E;AAC1E,MAAM,MAAM,4BAA4B,GAAG,QAAQ,CACjD,MAAM,CAAC,wBAAwB,EAAE,2BAA2B,CAAC,CAC9D,CAAA;AAED,eAAO,MAAM,+BAA+B,KAAK,CAAA;AACjD,eAAO,MAAM,+BAA+B,KAAK,CAAA;AAEjD,+DAA+D;AAC/D,eAAO,MAAM,uCAAuC,EAAE,4BAIpD,CAAA;AAEF,MAAM,MAAM,sCAAsC,GAAG,QAAQ,CAAC;IAC5D,QAAQ,EAAE,4BAA4B,CAAA;IACtC,iFAAiF;IACjF,aAAa,EAAE,SAAS,wBAAwB,EAAE,CAAA;CACnD,CAAC,CAAA;AAqEF,oFAAoF;AACpF,wBAAgB,iCAAiC,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAQ1F;AAED;;;;;;;GAOG;AACH,wBAAgB,qCAAqC,CACnD,KAAK,EAAE,OAAO,EACd,cAAc,CAAC,EAAE,OAAO,GACvB,sCAAsC,CA+CxC;AAED;;;;;;;GAOG;AACH,wBAAgB,2BAA2B,CACzC,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,OAAO,GACb,sCAAsC,CAsBxC;AAED;;;;;;;;;GASG;AACH,wBAAgB,2BAA2B,CAAC,UAAU,EAAE,MAAM,EAAE,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAajG"}
|