@logicplanes/kaeso-ui 0.3.6 → 0.3.8

package/ai/component-guides.md

@@ -1,6 +1,6 @@
 # @logicplanes/kaeso-ui component guides
 
-Version 0.3.6. Generated from the showcase's demo modules (apps/showcase/src/demos); do not edit. For each component: what it is for, its import, keyboard, accessibility, do and don't, and every example's code. Props and variants: `component-registry.md`.
+Version 0.3.8. Generated from the showcase's demo modules (apps/showcase/src/demos); do not edit. For each component: what it is for, its import, keyboard, accessibility, do and don't, and every example's code. Props and variants: `component-registry.md`.
 
 ## AlertDialog
 
@@ -1226,7 +1226,7 @@ A pill showing the date; a calendar with circles, today ringed, and a typed ISO
 
 - The calendar is a grid with day names; typed ISO fields (YYYY-MM-DD) are an alternative to pointing.
 - The calendar, the trigger and the typed fields name the same day, in the viewer's calendar.
-- An aria-label or a field's label names the trigger; the date or range it shows is its description.
+- A field's label names the trigger and the date or range it shows is its description; without a label, the trigger is named by what it shows and its aria-label is its description.
 
 ### Examples
 
@@ -2979,7 +2979,7 @@ A model from a catalogue of any size: searchable, grouped by provider, recent mo
 
 ### Accessibility
 
-- A button named “Model” by default opens a search field over a listbox, one group per provider.
+- A button named by the model it shows, and described as “Model” by default, opens a search field over a listbox, one group per provider.
 - Above the list, a Provider select narrows it to one provider; it offers only the providers whose models match the search.
 - On phones the list opens as a full-screen sheet with the search on top.
 
@@ -4333,7 +4333,8 @@ The console navigation: the place it is in, 32px items with pill fills, groups t
 ### Accessibility
 
 - The current page has aria-current=page.
-- In rail mode labels move into tooltips and become accessible names.
+- In rail mode labels move into tooltips and stay the accessible names.
+- The place and the switcher are named by what they show; what opening them does is their description.
 - A collapsed sidebar is inert, so its links leave the tab order.
 
 ### Examples

package/ai/component-registry.json

@@ -1,6 +1,6 @@
 {
   "package": "@logicplanes/kaeso-ui",
-  "version": "0.3.6",
+  "version": "0.3.8",
   "components": [
     {
       "entry": "app-frame",
@@ -3165,6 +3165,13 @@
               "default": "default",
               "description": "A raised pill, quiet in a settings row, or transparent in a column header."
             },
+            {
+              "name": "aria-label",
+              "type": "string",
+              "required": false,
+              "default": null,
+              "description": "What the picker is for. The pill is named by what it shows, so this becomes its description; it names the pill only while the pill shows nothing."
+            },
             {
               "name": "children",
               "type": "ReactNode",
@@ -3750,14 +3757,14 @@
               "type": "string",
               "required": false,
               "default": null,
-              "description": "Names the trigger when there is no `label`: \"Expires\". What it shows (the date, or the placeholder) becomes its description."
+              "description": "What the trigger is for when there is no `label`: \"Expires\". The trigger is named by what it shows (the date, or the placeholder) and reads this as its description."
             },
             {
               "name": "aria-labelledby",
               "type": "string",
               "required": false,
               "default": null,
-              "description": "Names the trigger by the elements with these ids, as `aria-label` does."
+              "description": "Names the trigger by the elements with these ids, followed by what it shows."
             },
             {
               "name": "className",
@@ -3890,14 +3897,14 @@
               "type": "string",
               "required": false,
               "default": null,
-              "description": "Names the trigger when there is no `label`: \"Expires\". What it shows (the date, or the placeholder) becomes its description."
+              "description": "What the trigger is for when there is no `label`: \"Expires\". The trigger is named by what it shows (the date, or the placeholder) and reads this as its description."
             },
             {
               "name": "aria-labelledby",
               "type": "string",
               "required": false,
               "default": null,
-              "description": "Names the trigger by the elements with these ids, as `aria-label` does."
+              "description": "Names the trigger by the elements with these ids, followed by what it shows."
             },
             {
               "name": "className",
@@ -6890,7 +6897,7 @@
               "type": "string",
               "required": false,
               "default": null,
-              "description": "The accessible name, for when there is no visible label."
+              "description": "What the picker is for, when there is no visible label: it names the list, and the pill, named by the provider it shows, reads it as its description."
             },
             {
               "name": "autoFocus",
@@ -9324,7 +9331,7 @@
               "type": "string",
               "required": false,
               "default": null,
-              "description": "The picker's accessible name (\"Model\" by default)."
+              "description": "What the picker is for (\"Model\" by default): it names the list and its popover, and the button, named by the model it shows, reads it as its description."
             },
             {
               "name": "className",
@@ -10953,7 +10960,7 @@
               "type": "SegmentedOption[]",
               "required": true,
               "default": null,
-              "description": "The options, as segments."
+              "description": "The options, as segments. A segment with a label is named by it; an icon-only one needs its `aria-label`, also shown as its tooltip."
             },
             {
               "name": "className",

package/ai/component-registry.md

@@ -1,6 +1,6 @@
 # @logicplanes/kaeso-ui component registry
 
-Version 0.3.6. Generated from the component types, their descriptions and variants; do not edit.
+Version 0.3.8. Generated from the component types, their descriptions and variants; do not edit.
 
 ## app-frame
 
@@ -722,6 +722,7 @@ The pill that opens a picker and shows its value, in the same looks and sizes as
 | Prop | Type | Default | Description |
 |---|---|---|---|
 | `appearance` | `"ghost" \| "default" \| "header"` | `default` | A raised pill, quiet in a settings row, or transparent in a column header. |
+| `aria-label` | `string` |  | What the picker is for. The pill is named by what it shows, so this becomes its description; it names the pill only while the pill shows nothing. |
 | `children` | `ReactNode` |  | The chosen value as it should read; the placeholder shows without it. |
 | `data-force` | `string` |  | Forces an interaction state for state matrices: `hover`, `pressed`, `focus`, `open`. |
 | `fullWidth` | `boolean` |  | Fills the container. |
@@ -851,8 +852,8 @@ A pill showing the date; a popover with the calendar and a typed ISO field.
 
 | Prop | Type | Default | Description |
 |---|---|---|---|
-| `aria-label` | `string` |  | Names the trigger when there is no `label`: "Expires". What it shows (the date, or the placeholder) becomes its description. |
-| `aria-labelledby` | `string` |  | Names the trigger by the elements with these ids, as `aria-label` does. |
+| `aria-label` | `string` |  | What the trigger is for when there is no `label`: "Expires". The trigger is named by what it shows (the date, or the placeholder) and reads this as its description. |
+| `aria-labelledby` | `string` |  | Names the trigger by the elements with these ids, followed by what it shows. |
 | `className` | `string` |  | Classes for the layout of the outer element: margin, width and placement, never its look. |
 | `data-force` | `string` |  | Forces an interaction state for state matrices: `hover`, `pressed`, `focus`, `open`. |
 | `defaultValue` | `Date \| null` |  | The chosen day on first render. |
@@ -877,8 +878,8 @@ A pill showing the range ("Oct 1 – Oct 12") or its preset ("Last 30 days"); pr
 
 | Prop | Type | Default | Description |
 |---|---|---|---|
-| `aria-label` | `string` |  | Names the trigger when there is no `label`: "Expires". What it shows (the date, or the placeholder) becomes its description. |
-| `aria-labelledby` | `string` |  | Names the trigger by the elements with these ids, as `aria-label` does. |
+| `aria-label` | `string` |  | What the trigger is for when there is no `label`: "Expires". The trigger is named by what it shows (the date, or the placeholder) and reads this as its description. |
+| `aria-labelledby` | `string` |  | Names the trigger by the elements with these ids, followed by what it shows. |
 | `className` | `string` |  | Classes for the layout of the outer element: margin, width and placement, never its look. |
 | `data-force` | `string` |  | Forces an interaction state for state matrices: `hover`, `pressed`, `focus`, `open`. |
 | `defaultValue` | `DateRange \| null` |  | The chosen range on first render. |
@@ -1556,7 +1557,7 @@ Choosing a provider from any number of them: a search field over every provider,
 | `providers` * | `ProviderPickerOption[]` |  | The providers: id, name, whether the organization has connected it, and a short hint such as its key count. |
 | `allLabel` | `string` |  | Select only: a first option for no provider in particular, such as "All providers"; choosing it reports `null`. |
 | `appearance` | `"list" \| "select"` |  | An always-open list for a dialog step, or a pill that opens it. |
-| `aria-label` | `string` |  | The accessible name, for when there is no visible label. |
+| `aria-label` | `string` |  | What the picker is for, when there is no visible label: it names the list, and the pill, named by the provider it shows, reads it as its description. |
 | `autoFocus` | `boolean` |  | List only: focuses the search field when it appears. |
 | `className` | `string` |  | Classes for the layout of the outer element: margin, width and placement, never its look. |
 | `data-force` | `string` |  | Forces an interaction state for state matrices: `hover`, `pressed`, `focus`, `open`. |
@@ -2159,7 +2160,7 @@ A model from a catalogue of any size: a pill showing the chosen model that opens
 | `options` * | `ModelPickerOption[]` |  | The models: value, provider, id, name, capabilities, context window, a formatted price, a short note such as why it is disabled, and whether it is deprecated. |
 | `allLabel` | `string` |  | Single only: a first option for no model in particular, such as "All models"; choosing it reports an empty string. |
 | `appearance` | `"ghost" \| "default"` |  | A quiet button (`ghost`) or a filled one (`default`). |
-| `aria-label` | `string` |  | The picker's accessible name ("Model" by default). |
+| `aria-label` | `string` |  | What the picker is for ("Model" by default): it names the list and its popover, and the button, named by the model it shows, reads it as its description. |
 | `className` | `string` |  | Classes for the layout of the outer element: margin, width and placement, never its look. |
 | `data-force` | `string` |  | Forces an interaction state for state matrices: `hover`, `pressed`, `focus`, `open`. |
 | `defaultValue` | `string \| string[] \| null` |  | The chosen model, or models with `multiple`, on first render. |
@@ -2539,7 +2540,7 @@ Two to five mutually exclusive options: 24h/7d/30d, List/Board, providers.
 | Prop | Type | Default | Description |
 |---|---|---|---|
 | `aria-label` * | `string` |  | The control's accessible name. |
-| `options` * | `SegmentedOption[]` |  | The options, as segments. |
+| `options` * | `SegmentedOption[]` |  | The options, as segments. A segment with a label is named by it; an icon-only one needs its `aria-label`, also shown as its tooltip. |
 | `className` | `string` |  | Classes for the layout of the outer element: margin, width and placement, never its look. |
 | `data-force` | `string` |  | Forces an interaction state for state matrices: `hover`, `pressed`, `focus`, `open`. |
 | `defaultValue` | `string` |  | The chosen option on first render. |

package/ai/icons.md

@@ -1,6 +1,6 @@
 # Icon vocabulary
 
-Version 0.3.6. Generated from `src/icons/vocabulary.ts`; do not edit. Use the name, never an icon picked by look: `icons.key` always means a key. Hugeicons, Stroke Rounded. Rules: `foundations/icons.md`.
+Version 0.3.8. Generated from `src/icons/vocabulary.ts`; do not edit. Use the name, never an icon picked by look: `icons.key` always means a key. Hugeicons, Stroke Rounded. Rules: `foundations/icons.md`.
 
 ## Kaeso objects
 

package/ai/tokens.md

@@ -1,6 +1,6 @@
 # @logicplanes/kaeso-ui tokens
 
-Version 0.3.6. Generated from `@logicplanes/kaeso-tokens`; do not edit. Components use these through role names (`bg-panel`, `text-fg-secondary`, `h-36`, `rounded-pill`); a raw value never appears in a component. How to use them: `foundations/*.md`.
+Version 0.3.8. Generated from `@logicplanes/kaeso-tokens`; do not edit. Components use these through role names (`bg-panel`, `text-fg-secondary`, `h-36`, `rounded-pill`); a raw value never appears in a component. How to use them: `foundations/*.md`.
 
 ## Neutrals
 

package/dist/blocks/delete-resource.js

@@ -1,6 +1,6 @@
 "use client";
 import { i as e } from "../chunks/context-BELWW79w.js";
-import { t } from "../chunks/dialog-truWH0qe.js";
+import { t } from "../chunks/dialog-BLcP7v24.js";
 import { jsx as n } from "react/jsx-runtime";
 //#region src/blocks/delete-resource/delete-resource.tsx
 var r = { confirm: {

package/dist/blocks/pages.js

@@ -1,7 +1,7 @@
 "use client";
 import { t as e } from "../chunks/cn-DUDmdLpZ.js";
-import { t } from "../chunks/app-frame-B9vrgwaE.js";
-import { r as n } from "../chunks/page-header-Ccnrspbp.js";
+import { t } from "../chunks/app-frame-Cj_gCbmu.js";
+import { r as n } from "../chunks/page-header-B3tV8Wog.js";
 import { t as r } from "../chunks/empty-YXmSkKzR.js";
 import { a as i, t as a } from "../chunks/section-BsET7Fo-.js";
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";

package/dist/blocks/resource-list.js

@@ -1,9 +1,9 @@
 "use client";
 import { i as e } from "../chunks/context-BELWW79w.js";
-import { i as t } from "../chunks/input-B0wtkcNh.js";
+import { i as t } from "../chunks/input-9y3afoiq.js";
 import { r as n } from "../chunks/toolbar-nVLFWH2i.js";
 import { t as r } from "../chunks/empty-YXmSkKzR.js";
-import { i, o as a } from "../chunks/list-wXZIZo_s.js";
+import { i, o as a } from "../chunks/list-7VARol_x.js";
 import { useMemo as o, useState as s } from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/blocks/resource-list/resource-list.tsx

package/dist/chunks/{app-frame-B9vrgwaE.js → app-frame-Cj_gCbmu.js}

@@ -2,10 +2,10 @@
 import { t as e } from "./cn-DUDmdLpZ.js";
 import { n as t, t as n } from "./inset-BnBj8NJV.js";
 import { i as r } from "./context-BELWW79w.js";
-import { l as i, s as a } from "./tooltip-S1DmyLVl.js";
-import { a as o } from "./button-CAPyW-v8.js";
-import { t as s } from "./icon-button-D4O4puwH.js";
-import { l as c, t as l } from "./sidebar-Dey1ZfGt.js";
+import { l as i, s as a } from "./tooltip-CTBnfiDH.js";
+import { a as o } from "./button-h2IFCER2.js";
+import { t as s } from "./icon-button-DmKFxQbP.js";
+import { l as c, t as l } from "./sidebar-ZSTPK9Jn.js";
 import { t as u } from "./when-idle-Cy3pinqO.js";
 import { createContext as d, forwardRef as f, useCallback as p, useContext as m, useEffect as h, useId as g, useLayoutEffect as _, useMemo as v, useRef as y, useState as b } from "react";
 import { jsx as x, jsxs as S } from "react/jsx-runtime";
@@ -103,7 +103,7 @@ function A({ banner: e, href: t, label: n, actions: i, open: a, onToggle: o, tog
 	});
 }
 process.env.NODE_ENV !== "production" && (A.displayName = "AppFrame.PhoneBar");
-var j = 750, M = /* @__PURE__ */ a(() => import("./nav-sheet-QqNRHo-y.js").then((e) => e.n), { base: () => import.meta.url });
+var j = 750, M = /* @__PURE__ */ a(() => import("./nav-sheet-D7wIF_OU.js").then((e) => e.n), { base: () => import.meta.url });
 function N({ navOpen: e, setNavOpen: t, toggle: n, ready: r, children: a }) {
 	let { peeking: o, setPeeking: s } = c(), [l, d] = b(!1);
 	h(() => u(() => d(!0)), []);
@@ -217,4 +217,4 @@ var B = /* @__PURE__ */ Object.assign(O, {
 //#endregion
 export { w as a, T as i, L as n, j as o, I as r, D as s, B as t };
 
-//# sourceMappingURL=app-frame-B9vrgwaE.js.map
+//# sourceMappingURL=app-frame-Cj_gCbmu.js.map

package/dist/chunks/{app-frame-B9vrgwaE.js.map → app-frame-Cj_gCbmu.js.map}

@@ -1 +1 @@
-{"version":3,"file":"app-frame-B9vrgwaE.js","names":["__icon_SidebarLeftIcon","cn","InsetContent","GutterContent","useUiText","useLazyModule","lazyModule","buttonClasses","IconButton","useSidebar","BrandWordmark","whenIdle","KAESO_APP_FRAME_VARIANTS","KAESO_APP_FRAME_DEFAULT_VARIANTS","Ctx","useAppFrame","useContext","Root","navOpen","setNavOpen","useState","toggle","useRef","sheetReady","mainId","useId","Main","fill","frame","useMemo","className","SkipLink","sidebar","PhoneBar","brandHref","brandLabel","phoneActions","o","corner","FrameSheet","t","target","main","Bar","banner","actions","toggleRef","SidebarLeftIcon","open","onToggle","PEEK_DELAY","navSheet","n","idle","setIdle","dismiss","useCallback","setPeeking","NavSheet","peeking","pending","useLayoutEffect","usePendingDismiss","doc","onKeyDown","onPointerDown","MenuButton","intent","wide","collapsed","setCollapsed","openNav","KAESO_APP_FRAME_BODY_VARIANTS","KAESO_APP_FRAME_BODY_DEFAULT_VARIANTS","Body","props","padding","Settings","title","description","AppFrame"],"sources":["../../src/components/app-frame/app-frame.tsx"],"sourcesContent":["import {\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n  type RefObject,\n} from \"react\";\nimport { GutterContent, InsetContent } from \"../../utils/inset.js\";\nimport { cn } from \"../../utils/cn.js\";\nimport { SidebarLeftIcon as __icon_SidebarLeftIcon } from \"@hugeicons/core-free-icons\";\nimport { IconButton } from \"../icon-button/icon-button.js\";\nimport { buttonClasses } from \"../button/button.js\";\nimport { useSidebar, BrandWordmark } from \"../sidebar/sidebar.js\";\nimport { lazyModule, useLazyModule } from \"../../utils/lazy-module.js\";\nimport { whenIdle } from \"../../utils/when-idle.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_APP_FRAME_VARIANTS = {\n  fill: {\n    screen: { classes: \"h-dvh\" },\n    parent: { classes: \"h-full\" },\n  },\n} as const;\nexport const KAESO_APP_FRAME_DEFAULT_VARIANTS = { fill: \"screen\" } as const;\n\nconst Ctx = /* @__PURE__ */ createContext<{ openNav: () => void; embedded: boolean; sheetReady: RefObject<boolean> }>({\n  openNav: () => undefined,\n  embedded: false,\n  sheetReady: { current: false },\n});\nexport const useAppFrame = () => useContext(Ctx);\n\nexport interface AppFrameProps {\n  sidebar: ReactNode;\n  children: ReactNode;\n  corner?: ReactNode | undefined;\n  fill?: keyof typeof KAESO_APP_FRAME_VARIANTS.fill | undefined;\n  brandHref?: string | undefined;\n  brandLabel?: string | undefined;\n  phoneActions?: ReactNode | undefined;\n  className?: string | undefined;\n}\n\nconst Root = /* @__PURE__ */ forwardRef<HTMLDivElement, AppFrameProps>(function AppFrame(\n  { sidebar, children, corner, fill = \"screen\", brandHref, brandLabel, phoneActions, className },\n  ref,\n) {\n  const [navOpen, setNavOpen] = useState(false);\n  const toggle = useRef<HTMLButtonElement | null>(null);\n  const sheetReady = useRef(false);\n  const mainId = `k-main-${useId().replace(/[^\\w-]/g, \"\")}`;\n  const Main = fill === \"screen\" ? \"main\" : \"div\";\n  const frame = useMemo(() => ({ openNav: () => setNavOpen(true), embedded: fill === \"parent\", sheetReady }), [fill]);\n  return (\n    <Ctx.Provider value={frame}>\n      <div\n        ref={ref}\n        className={cn(\n          \"relative isolate flex w-full flex-col overflow-hidden bg-chrome text-fg lg:flex-row\",\n          KAESO_APP_FRAME_VARIANTS.fill[fill].classes,\n          className,\n        )}\n      >\n        <SkipLink target={mainId} />\n        <div className=\"hidden h-full lg:flex\">{sidebar}</div>\n        <PhoneBar\n          banner={fill === \"screen\"}\n          href={brandHref}\n          label={brandLabel}\n          actions={phoneActions}\n          open={navOpen}\n          onToggle={() => setNavOpen((o) => !o)}\n          toggleRef={toggle}\n        />\n        <Main\n          id={mainId}\n          className=\"relative flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden bg-panel outline-none safe-area-panel lg:my-8 lg:mr-8 lg:rounded-panel lg:shadow-panel\"\n        >\n          {children}\n        </Main>\n        {corner && <div className=\"fixed right-16 bottom-16 z-10 flex items-center gap-8\">{corner}</div>}\n      </div>\n      <FrameSheet navOpen={navOpen} setNavOpen={setNavOpen} toggle={toggle} ready={sheetReady}>\n        {sidebar}\n      </FrameSheet>\n    </Ctx.Provider>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Root.displayName = \"AppFrame\";\n\nfunction SkipLink({ target }: { target: string }) {\n  const t = useUiText();\n  return (\n    <a\n      href={`#${target}`}\n      onClick={(e) => {\n        const main = document.getElementById(target);\n        if (!main) return;\n        e.preventDefault();\n        main.setAttribute(\"tabindex\", \"-1\");\n        main.addEventListener(\"blur\", () => main.removeAttribute(\"tabindex\"), { once: true });\n        main.focus();\n      }}\n      className={cn(buttonClasses({ size: \"sm\" }), \"absolute top-8 left-8 z-50 not-focus:sr-only\")}\n    >\n      {t(\"appFrame.skipToContent\", \"Skip to content\")}\n    </a>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") SkipLink.displayName = \"AppFrame.SkipLink\";\n\nfunction PhoneBar({\n  banner,\n  href,\n  label,\n  actions,\n  open,\n  onToggle,\n  toggleRef,\n}: {\n  banner: boolean;\n  href: string | undefined;\n  label: string | undefined;\n  actions: ReactNode;\n  open: boolean;\n  onToggle: () => void;\n  toggleRef: RefObject<HTMLButtonElement | null>;\n}) {\n  const Bar = banner ? \"header\" : \"div\";\n  const t = useUiText();\n  return (\n    <Bar data-phone-bar=\"\" className=\"shrink-0 bg-panel safe-area-bar lg:hidden\">\n      <div className=\"mt-8 flex h-52 items-center justify-between px-24\">\n        <BrandWordmark href={href} label={label} />\n        <span className=\"flex items-center\">\n          {actions}\n          <IconButton\n            ref={toggleRef}\n            icon={__icon_SidebarLeftIcon}\n            aria-label={t(\"appFrame.openNavigation\", \"Open navigation\")}\n            aria-haspopup=\"dialog\"\n            aria-expanded={open}\n            tooltip={false}\n            onClick={onToggle}\n          />\n        </span>\n      </div>\n    </Bar>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") PhoneBar.displayName = \"AppFrame.PhoneBar\";\n\nexport const PEEK_DELAY = 750;\n\nconst navSheet = /* @__PURE__ */ lazyModule(() => import(\"./nav-sheet.js\"), { base: () => import.meta.url });\n\nfunction FrameSheet({\n  navOpen,\n  setNavOpen,\n  toggle,\n  ready,\n  children,\n}: {\n  navOpen: boolean;\n  setNavOpen: (o: boolean) => void;\n  toggle: RefObject<HTMLElement | null>;\n  ready: RefObject<boolean>;\n  children: ReactNode;\n}) {\n  const { peeking, setPeeking } = useSidebar();\n  const [idle, setIdle] = useState(false);\n  useEffect(() => whenIdle(() => setIdle(true)), []);\n  const dismiss = useCallback(() => {\n    setNavOpen(false);\n    setPeeking(false);\n  }, [setNavOpen, setPeeking]);\n  const NavSheet = useLazyModule(navSheet, idle || navOpen || peeking, () => {\n    setIdle(false);\n    dismiss();\n  })?.NavSheet;\n  const pending = (navOpen || peeking) && !NavSheet;\n  useLayoutEffect(() => {\n    ready.current = !!NavSheet;\n  });\n  usePendingDismiss(pending, toggle, dismiss);\n  if (!NavSheet) return null;\n  return (\n    <NavSheet\n      open={navOpen || peeking}\n      peek={peeking && !navOpen}\n      {...(navOpen ? { returnFocus: toggle } : {})}\n      onOpenChange={(o) => {\n        if (!o) dismiss();\n      }}\n    >\n      {children}\n    </NavSheet>\n  );\n}\n\nfunction usePendingDismiss(pending: boolean, toggle: RefObject<HTMLElement | null>, dismiss: () => void) {\n  useEffect(() => {\n    if (!pending) return;\n    const doc = toggle.current?.ownerDocument ?? document;\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key !== \"Escape\") return;\n      e.stopPropagation();\n      dismiss();\n    };\n    const onPointerDown = (e: PointerEvent) => {\n      if (!toggle.current?.contains(e.target as Node)) dismiss();\n    };\n    doc.addEventListener(\"keydown\", onKeyDown, true);\n    doc.addEventListener(\"pointerdown\", onPointerDown, true);\n    return () => {\n      doc.removeEventListener(\"keydown\", onKeyDown, true);\n      doc.removeEventListener(\"pointerdown\", onPointerDown, true);\n    };\n  }, [pending, toggle, dismiss]);\n}\n\nfunction MenuButton({ className }: { className?: string | undefined }) {\n  const { openNav, sheetReady } = useAppFrame();\n  const { collapsed, setCollapsed, setPeeking } = useSidebar();\n  const intent = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  useEffect(() => () => clearTimeout(intent.current), []);\n  const t = useUiText();\n  const wide = () => typeof window !== \"undefined\" && window.matchMedia(\"(min-width: 1024px)\").matches;\n  return (\n    <IconButton\n      onPointerEnter={() => {\n        if (collapsed && wide()) intent.current = setTimeout(() => setPeeking(true), PEEK_DELAY);\n      }}\n      onPointerLeave={() => {\n        clearTimeout(intent.current);\n        if (!sheetReady.current) setPeeking(false);\n      }}\n      icon={__icon_SidebarLeftIcon}\n      data-sidebar-expand=\"\"\n      aria-label={collapsed ? t(\"appFrame.expandSidebar\", \"Expand sidebar\") : t(\"appFrame.openNavigation\", \"Open navigation\")}\n      shortcut={collapsed ? [\"[\"] : undefined}\n      onClick={() => {\n        clearTimeout(intent.current);\n        if (collapsed && wide()) setCollapsed(false);\n        else openNav();\n      }}\n      className={cn(\"hidden\", collapsed && \"lg:inline-flex\", className)}\n    />\n  );\n}\nif (process.env.NODE_ENV !== \"production\") MenuButton.displayName = \"AppFrame.MenuButton\";\n\nexport const KAESO_APP_FRAME_BODY_VARIANTS = {\n  padding: {\n    none: { classes: \"\" },\n    list: { classes: \"pt-8 pb-24\" },\n    page: { classes: \"px-24 pt-16 pb-48\" },\n  },\n} as const;\nexport const KAESO_APP_FRAME_BODY_DEFAULT_VARIANTS = { padding: \"none\" } as const;\n\nexport interface AppFrameBodyProps extends HTMLAttributes<HTMLDivElement> {\n  padding?: keyof typeof KAESO_APP_FRAME_BODY_VARIANTS.padding | undefined;\n}\n\nconst Body = /* @__PURE__ */ forwardRef<HTMLDivElement, AppFrameBodyProps>(function AppFrameBody({ className, padding = \"none\", children, ...props }, ref) {\n  return (\n    <div\n      ref={ref}\n      className={cn(\"min-h-0 flex-1 overflow-y-auto overscroll-contain scrollbar-quiet\", KAESO_APP_FRAME_BODY_VARIANTS.padding[padding].classes, className)}\n      {...props}\n    >\n      <GutterContent padded={padding === \"page\"}>{children}</GutterContent>\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Body.displayName = \"AppFrame.Body\";\n\nexport interface SettingsPageProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  title: ReactNode;\n  description?: ReactNode | undefined;\n  actions?: ReactNode | undefined;\n}\n\nconst Settings = /* @__PURE__ */ forwardRef<HTMLDivElement, SettingsPageProps>(function AppFrameSettings({ title, description, actions, className, children, ...props }, ref) {\n  return (\n    <Body ref={ref} className=\"relative\">\n      <MenuButton className=\"absolute top-10 left-24 z-10\" />\n      <div className={cn(\"mx-auto w-full max-w-settings px-24 pt-64 pb-96\", className)} {...props}>\n        <header className=\"flex flex-col gap-8\">\n          <div className=\"flex items-start justify-between gap-16\">\n            <h1 className=\"min-w-0 text-title-lg font-semibold text-fg text-balance\">{title}</h1>\n            {actions && <div className=\"flex h-34 shrink-0 items-center gap-8\">{actions}</div>}\n          </div>\n          {description && <p className=\"text-body-lg font-regular text-fg-secondary\">{description}</p>}\n        </header>\n        <div className=\"mt-8\">\n          <InsetContent>\n            <GutterContent>{children}</GutterContent>\n          </InsetContent>\n        </div>\n      </div>\n    </Body>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Settings.displayName = \"AppFrame.Settings\";\n\nexport const AppFrame = /* @__PURE__ */ Object.assign(Root, { MenuButton, Body, Settings });\n"],"mappings":"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"}
+{"version":3,"file":"app-frame-Cj_gCbmu.js","names":["__icon_SidebarLeftIcon","cn","InsetContent","GutterContent","useUiText","useLazyModule","lazyModule","buttonClasses","IconButton","useSidebar","BrandWordmark","whenIdle","KAESO_APP_FRAME_VARIANTS","KAESO_APP_FRAME_DEFAULT_VARIANTS","Ctx","useAppFrame","useContext","Root","navOpen","setNavOpen","useState","toggle","useRef","sheetReady","mainId","useId","Main","fill","frame","useMemo","className","SkipLink","sidebar","PhoneBar","brandHref","brandLabel","phoneActions","o","corner","FrameSheet","t","target","main","Bar","banner","actions","toggleRef","SidebarLeftIcon","open","onToggle","PEEK_DELAY","navSheet","n","idle","setIdle","dismiss","useCallback","setPeeking","NavSheet","peeking","pending","useLayoutEffect","usePendingDismiss","doc","onKeyDown","onPointerDown","MenuButton","intent","wide","collapsed","setCollapsed","openNav","KAESO_APP_FRAME_BODY_VARIANTS","KAESO_APP_FRAME_BODY_DEFAULT_VARIANTS","Body","props","padding","Settings","title","description","AppFrame"],"sources":["../../src/components/app-frame/app-frame.tsx"],"sourcesContent":["import {\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n  type RefObject,\n} from \"react\";\nimport { GutterContent, InsetContent } from \"../../utils/inset.js\";\nimport { cn } from \"../../utils/cn.js\";\nimport { SidebarLeftIcon as __icon_SidebarLeftIcon } from \"@hugeicons/core-free-icons\";\nimport { IconButton } from \"../icon-button/icon-button.js\";\nimport { buttonClasses } from \"../button/button.js\";\nimport { useSidebar, BrandWordmark } from \"../sidebar/sidebar.js\";\nimport { lazyModule, useLazyModule } from \"../../utils/lazy-module.js\";\nimport { whenIdle } from \"../../utils/when-idle.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_APP_FRAME_VARIANTS = {\n  fill: {\n    screen: { classes: \"h-dvh\" },\n    parent: { classes: \"h-full\" },\n  },\n} as const;\nexport const KAESO_APP_FRAME_DEFAULT_VARIANTS = { fill: \"screen\" } as const;\n\nconst Ctx = /* @__PURE__ */ createContext<{ openNav: () => void; embedded: boolean; sheetReady: RefObject<boolean> }>({\n  openNav: () => undefined,\n  embedded: false,\n  sheetReady: { current: false },\n});\nexport const useAppFrame = () => useContext(Ctx);\n\nexport interface AppFrameProps {\n  sidebar: ReactNode;\n  children: ReactNode;\n  corner?: ReactNode | undefined;\n  fill?: keyof typeof KAESO_APP_FRAME_VARIANTS.fill | undefined;\n  brandHref?: string | undefined;\n  brandLabel?: string | undefined;\n  phoneActions?: ReactNode | undefined;\n  className?: string | undefined;\n}\n\nconst Root = /* @__PURE__ */ forwardRef<HTMLDivElement, AppFrameProps>(function AppFrame(\n  { sidebar, children, corner, fill = \"screen\", brandHref, brandLabel, phoneActions, className },\n  ref,\n) {\n  const [navOpen, setNavOpen] = useState(false);\n  const toggle = useRef<HTMLButtonElement | null>(null);\n  const sheetReady = useRef(false);\n  const mainId = `k-main-${useId().replace(/[^\\w-]/g, \"\")}`;\n  const Main = fill === \"screen\" ? \"main\" : \"div\";\n  const frame = useMemo(() => ({ openNav: () => setNavOpen(true), embedded: fill === \"parent\", sheetReady }), [fill]);\n  return (\n    <Ctx.Provider value={frame}>\n      <div\n        ref={ref}\n        className={cn(\n          \"relative isolate flex w-full flex-col overflow-hidden bg-chrome text-fg lg:flex-row\",\n          KAESO_APP_FRAME_VARIANTS.fill[fill].classes,\n          className,\n        )}\n      >\n        <SkipLink target={mainId} />\n        <div className=\"hidden h-full lg:flex\">{sidebar}</div>\n        <PhoneBar\n          banner={fill === \"screen\"}\n          href={brandHref}\n          label={brandLabel}\n          actions={phoneActions}\n          open={navOpen}\n          onToggle={() => setNavOpen((o) => !o)}\n          toggleRef={toggle}\n        />\n        <Main\n          id={mainId}\n          className=\"relative flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden bg-panel outline-none safe-area-panel lg:my-8 lg:mr-8 lg:rounded-panel lg:shadow-panel\"\n        >\n          {children}\n        </Main>\n        {corner && <div className=\"fixed right-16 bottom-16 z-10 flex items-center gap-8\">{corner}</div>}\n      </div>\n      <FrameSheet navOpen={navOpen} setNavOpen={setNavOpen} toggle={toggle} ready={sheetReady}>\n        {sidebar}\n      </FrameSheet>\n    </Ctx.Provider>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Root.displayName = \"AppFrame\";\n\nfunction SkipLink({ target }: { target: string }) {\n  const t = useUiText();\n  return (\n    <a\n      href={`#${target}`}\n      onClick={(e) => {\n        const main = document.getElementById(target);\n        if (!main) return;\n        e.preventDefault();\n        main.setAttribute(\"tabindex\", \"-1\");\n        main.addEventListener(\"blur\", () => main.removeAttribute(\"tabindex\"), { once: true });\n        main.focus();\n      }}\n      className={cn(buttonClasses({ size: \"sm\" }), \"absolute top-8 left-8 z-50 not-focus:sr-only\")}\n    >\n      {t(\"appFrame.skipToContent\", \"Skip to content\")}\n    </a>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") SkipLink.displayName = \"AppFrame.SkipLink\";\n\nfunction PhoneBar({\n  banner,\n  href,\n  label,\n  actions,\n  open,\n  onToggle,\n  toggleRef,\n}: {\n  banner: boolean;\n  href: string | undefined;\n  label: string | undefined;\n  actions: ReactNode;\n  open: boolean;\n  onToggle: () => void;\n  toggleRef: RefObject<HTMLButtonElement | null>;\n}) {\n  const Bar = banner ? \"header\" : \"div\";\n  const t = useUiText();\n  return (\n    <Bar data-phone-bar=\"\" className=\"shrink-0 bg-panel safe-area-bar lg:hidden\">\n      <div className=\"mt-8 flex h-52 items-center justify-between px-24\">\n        <BrandWordmark href={href} label={label} />\n        <span className=\"flex items-center\">\n          {actions}\n          <IconButton\n            ref={toggleRef}\n            icon={__icon_SidebarLeftIcon}\n            aria-label={t(\"appFrame.openNavigation\", \"Open navigation\")}\n            aria-haspopup=\"dialog\"\n            aria-expanded={open}\n            tooltip={false}\n            onClick={onToggle}\n          />\n        </span>\n      </div>\n    </Bar>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") PhoneBar.displayName = \"AppFrame.PhoneBar\";\n\nexport const PEEK_DELAY = 750;\n\nconst navSheet = /* @__PURE__ */ lazyModule(() => import(\"./nav-sheet.js\"), { base: () => import.meta.url });\n\nfunction FrameSheet({\n  navOpen,\n  setNavOpen,\n  toggle,\n  ready,\n  children,\n}: {\n  navOpen: boolean;\n  setNavOpen: (o: boolean) => void;\n  toggle: RefObject<HTMLElement | null>;\n  ready: RefObject<boolean>;\n  children: ReactNode;\n}) {\n  const { peeking, setPeeking } = useSidebar();\n  const [idle, setIdle] = useState(false);\n  useEffect(() => whenIdle(() => setIdle(true)), []);\n  const dismiss = useCallback(() => {\n    setNavOpen(false);\n    setPeeking(false);\n  }, [setNavOpen, setPeeking]);\n  const NavSheet = useLazyModule(navSheet, idle || navOpen || peeking, () => {\n    setIdle(false);\n    dismiss();\n  })?.NavSheet;\n  const pending = (navOpen || peeking) && !NavSheet;\n  useLayoutEffect(() => {\n    ready.current = !!NavSheet;\n  });\n  usePendingDismiss(pending, toggle, dismiss);\n  if (!NavSheet) return null;\n  return (\n    <NavSheet\n      open={navOpen || peeking}\n      peek={peeking && !navOpen}\n      {...(navOpen ? { returnFocus: toggle } : {})}\n      onOpenChange={(o) => {\n        if (!o) dismiss();\n      }}\n    >\n      {children}\n    </NavSheet>\n  );\n}\n\nfunction usePendingDismiss(pending: boolean, toggle: RefObject<HTMLElement | null>, dismiss: () => void) {\n  useEffect(() => {\n    if (!pending) return;\n    const doc = toggle.current?.ownerDocument ?? document;\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key !== \"Escape\") return;\n      e.stopPropagation();\n      dismiss();\n    };\n    const onPointerDown = (e: PointerEvent) => {\n      if (!toggle.current?.contains(e.target as Node)) dismiss();\n    };\n    doc.addEventListener(\"keydown\", onKeyDown, true);\n    doc.addEventListener(\"pointerdown\", onPointerDown, true);\n    return () => {\n      doc.removeEventListener(\"keydown\", onKeyDown, true);\n      doc.removeEventListener(\"pointerdown\", onPointerDown, true);\n    };\n  }, [pending, toggle, dismiss]);\n}\n\nfunction MenuButton({ className }: { className?: string | undefined }) {\n  const { openNav, sheetReady } = useAppFrame();\n  const { collapsed, setCollapsed, setPeeking } = useSidebar();\n  const intent = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  useEffect(() => () => clearTimeout(intent.current), []);\n  const t = useUiText();\n  const wide = () => typeof window !== \"undefined\" && window.matchMedia(\"(min-width: 1024px)\").matches;\n  return (\n    <IconButton\n      onPointerEnter={() => {\n        if (collapsed && wide()) intent.current = setTimeout(() => setPeeking(true), PEEK_DELAY);\n      }}\n      onPointerLeave={() => {\n        clearTimeout(intent.current);\n        if (!sheetReady.current) setPeeking(false);\n      }}\n      icon={__icon_SidebarLeftIcon}\n      data-sidebar-expand=\"\"\n      aria-label={collapsed ? t(\"appFrame.expandSidebar\", \"Expand sidebar\") : t(\"appFrame.openNavigation\", \"Open navigation\")}\n      shortcut={collapsed ? [\"[\"] : undefined}\n      onClick={() => {\n        clearTimeout(intent.current);\n        if (collapsed && wide()) setCollapsed(false);\n        else openNav();\n      }}\n      className={cn(\"hidden\", collapsed && \"lg:inline-flex\", className)}\n    />\n  );\n}\nif (process.env.NODE_ENV !== \"production\") MenuButton.displayName = \"AppFrame.MenuButton\";\n\nexport const KAESO_APP_FRAME_BODY_VARIANTS = {\n  padding: {\n    none: { classes: \"\" },\n    list: { classes: \"pt-8 pb-24\" },\n    page: { classes: \"px-24 pt-16 pb-48\" },\n  },\n} as const;\nexport const KAESO_APP_FRAME_BODY_DEFAULT_VARIANTS = { padding: \"none\" } as const;\n\nexport interface AppFrameBodyProps extends HTMLAttributes<HTMLDivElement> {\n  padding?: keyof typeof KAESO_APP_FRAME_BODY_VARIANTS.padding | undefined;\n}\n\nconst Body = /* @__PURE__ */ forwardRef<HTMLDivElement, AppFrameBodyProps>(function AppFrameBody({ className, padding = \"none\", children, ...props }, ref) {\n  return (\n    <div\n      ref={ref}\n      className={cn(\"min-h-0 flex-1 overflow-y-auto overscroll-contain scrollbar-quiet\", KAESO_APP_FRAME_BODY_VARIANTS.padding[padding].classes, className)}\n      {...props}\n    >\n      <GutterContent padded={padding === \"page\"}>{children}</GutterContent>\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Body.displayName = \"AppFrame.Body\";\n\nexport interface SettingsPageProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  title: ReactNode;\n  description?: ReactNode | undefined;\n  actions?: ReactNode | undefined;\n}\n\nconst Settings = /* @__PURE__ */ forwardRef<HTMLDivElement, SettingsPageProps>(function AppFrameSettings({ title, description, actions, className, children, ...props }, ref) {\n  return (\n    <Body ref={ref} className=\"relative\">\n      <MenuButton className=\"absolute top-10 left-24 z-10\" />\n      <div className={cn(\"mx-auto w-full max-w-settings px-24 pt-64 pb-96\", className)} {...props}>\n        <header className=\"flex flex-col gap-8\">\n          <div className=\"flex items-start justify-between gap-16\">\n            <h1 className=\"min-w-0 text-title-lg font-semibold text-fg text-balance\">{title}</h1>\n            {actions && <div className=\"flex h-34 shrink-0 items-center gap-8\">{actions}</div>}\n          </div>\n          {description && <p className=\"text-body-lg font-regular text-fg-secondary\">{description}</p>}\n        </header>\n        <div className=\"mt-8\">\n          <InsetContent>\n            <GutterContent>{children}</GutterContent>\n          </InsetContent>\n        </div>\n      </div>\n    </Body>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Settings.displayName = \"AppFrame.Settings\";\n\nexport const AppFrame = /* @__PURE__ */ Object.assign(Root, { MenuButton, Body, Settings });\n"],"mappings":"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"}

package/dist/chunks/{banner-BBlNFHd-.js → banner-DY1jSc9Y.js}

@@ -2,7 +2,7 @@
 import { t as e } from "./cn-DUDmdLpZ.js";
 import { i as t } from "./context-BELWW79w.js";
 import { t as n } from "./icon-BqujXDUc.js";
-import { t as r } from "./icon-button-D4O4puwH.js";
+import { t as r } from "./icon-button-DmKFxQbP.js";
 import { forwardRef as i, useState as a } from "react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
 import { Alert02Icon as c, AlertCircleIcon as l, Cancel01Icon as u, CheckmarkCircle02Icon as d, InformationCircleIcon as f } from "@hugeicons/core-free-icons";
@@ -82,4 +82,4 @@ process.env.NODE_ENV !== "production" && (_.displayName = "Banner");
 //#endregion
 export { m as n, p as r, _ as t };
 
-//# sourceMappingURL=banner-BBlNFHd-.js.map
+//# sourceMappingURL=banner-DY1jSc9Y.js.map

package/dist/chunks/{banner-BBlNFHd-.js.map → banner-DY1jSc9Y.js.map}

@@ -1 +1 @@
-{"version":3,"file":"banner-BBlNFHd-.js","names":["__icon_InformationCircleIcon","__icon_CheckmarkCircle02Icon","__icon_Alert02Icon","__icon_AlertCircleIcon","__icon_Cancel01Icon","cn","useUiText","Icon","IconButton","KAESO_BANNER_VARIANTS","KAESO_BANNER_DEFAULT_VARIANTS","ICON","InformationCircleIcon","CheckmarkCircle02Icon","Alert02Icon","AlertCircleIcon","ICON_TONE","Banner","hidden","setHidden","useState","t","dismissible","onDismiss","tone","layout","className","actions","icon","title","children","Cancel01Icon"],"sources":["../../src/components/banner/banner.tsx"],"sourcesContent":["import { forwardRef, useState, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { InformationCircleIcon as __icon_InformationCircleIcon, CheckmarkCircle02Icon as __icon_CheckmarkCircle02Icon, Alert02Icon as __icon_Alert02Icon, AlertCircleIcon as __icon_AlertCircleIcon, Cancel01Icon as __icon_Cancel01Icon } from \"@hugeicons/core-free-icons\";\nimport { Icon, type IconData } from \"../icon/icon.js\";\nimport { IconButton } from \"../icon-button/icon-button.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_BANNER_VARIANTS = {\n  tone: {\n    neutral: { classes: \"bg-fill-1 text-fg\" },\n    info: { classes: \"bg-info-tint text-fg\" },\n    success: { classes: \"bg-success-tint text-fg\" },\n    warning: { classes: \"bg-warning-tint text-fg\" },\n    danger: { classes: \"bg-danger-tint text-fg\" },\n  },\n  layout: {\n    inline: { classes: \"rounded-well px-16 py-12\" },\n    full: { classes: \"rounded-none px-24 py-10\" },\n  },\n} as const;\nexport const KAESO_BANNER_DEFAULT_VARIANTS = { tone: \"neutral\", layout: \"inline\" } as const;\n\nconst ICON: Record<keyof typeof KAESO_BANNER_VARIANTS.tone, IconData> = {\n  neutral: __icon_InformationCircleIcon,\n  info: __icon_InformationCircleIcon,\n  success: __icon_CheckmarkCircle02Icon,\n  warning: __icon_Alert02Icon,\n  danger: __icon_AlertCircleIcon,\n};\nconst ICON_TONE = {\n  neutral: \"text-fg-secondary\",\n  info: \"text-info-text\",\n  success: \"text-success-text\",\n  warning: \"text-warning-text\",\n  danger: \"text-danger-text\",\n} as const;\n\nexport interface BannerProps {\n  tone?: keyof typeof KAESO_BANNER_VARIANTS.tone | undefined;\n  layout?: keyof typeof KAESO_BANNER_VARIANTS.layout | undefined;\n  title?: ReactNode | undefined;\n  children?: ReactNode | undefined;\n  icon?: IconData | undefined;\n  actions?: ReactNode | undefined;\n  onDismiss?: (() => void) | undefined;\n  className?: string | undefined;\n}\n\nexport const Banner = /* @__PURE__ */ forwardRef<HTMLDivElement, BannerProps>(function Banner(\n  { tone = \"neutral\", layout = \"inline\", title, children, icon, actions, onDismiss, className },\n  ref,\n) {\n  const [hidden, setHidden] = useState(false);\n  const t = useUiText();\n  if (hidden) return null;\n  const dismissible = onDismiss && (tone === \"neutral\" || tone === \"info\");\n  return (\n    <div\n      ref={ref}\n      role={tone === \"danger\" ? \"alert\" : \"status\"}\n      className={cn(\"@container w-full\", KAESO_BANNER_VARIANTS.tone[tone].classes, KAESO_BANNER_VARIANTS.layout[layout].classes, className)}\n    >\n      <div className={cn(\"flex items-start gap-8\", actions && \"@banner:items-center\")}>\n        <div className=\"flex min-w-0 flex-1 flex-col gap-12 @banner:flex-row @banner:items-center @banner:gap-24\">\n          <div className=\"flex min-w-0 flex-1 items-start gap-8\">\n            <Icon icon={icon ?? ICON[tone]} size=\"sm\" className={cn(\"mt-2\", ICON_TONE[tone])} />\n            <div className=\"flex min-w-0 flex-1 flex-col gap-2 text-body\">\n              {title && <span className=\"font-semibold text-fg\">{title}</span>}\n              {children && <div className=\"text-fg text-pretty\">{children}</div>}\n            </div>\n          </div>\n          {actions && <div className=\"ml-24 flex shrink-0 flex-wrap items-center gap-8 @banner:ml-0\">{actions}</div>}\n        </div>\n        {dismissible && (\n          <IconButton\n            icon={__icon_Cancel01Icon}\n            aria-label={t(\"banner.dismiss\", \"Dismiss\")}\n            size=\"xs\"\n            className=\"-my-2 -mr-6\"\n            onClick={() => {\n              setHidden(true);\n              onDismiss?.();\n            }}\n          />\n        )}\n      </div>\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Banner.displayName = \"Banner\";\n"],"mappings":";;;;;;;;;AAOA,IAAaS,IAAwB;CACnC,MAAM;EACJ,SAAS,EAAE,SAAS,oBAAoB;EACxC,MAAM,EAAE,SAAS,uBAAuB;EACxC,SAAS,EAAE,SAAS,0BAA0B;EAC9C,SAAS,EAAE,SAAS,0BAA0B;EAC9C,QAAQ,EAAE,SAAS,yBAAyB;CAC9C;CACA,QAAQ;EACN,QAAQ,EAAE,SAAS,2BAA2B;EAC9C,MAAM,EAAE,SAAS,2BAA2B;CAC9C;AACF,GACaC,IAAgC;CAAE,MAAM;CAAW,QAAQ;AAAS,GAE3EC,IAAkE;CACtE,SAASX;CACT,MAAMA;CACN,SAASC;CACT,SAASC;CACT,QAAQC;AACV,GACMa,IAAY;CAChB,SAAS;CACT,MAAM;CACN,SAAS;CACT,SAAS;CACT,QAAQ;AACV,GAaaC,IAAyB,kBAAwC,SAC5E,EAAE,UAAO,WAAW,YAAS,UAAU,UAAO,aAAU,SAAM,YAAS,cAAW,gBAClF,GACA;CACA,IAAM,CAACC,GAAQC,KAAaC,EAAS,EAAK,GACpCC,IAAIf,EAAU;CACpB,IAAIY,GAAQ,OAAO;CACnB,IAAMI,IAAcC,MAAcC,MAAS,aAAaA,MAAS;CACjE,OACE,kBAAC,OAAD;EACO;EACL,MAAMA,MAAS,WAAW,UAAU;EACpC,WAAWnB,EAAG,qBAAqBI,EAAsB,KAAKe,EAAK,CAAC,SAASf,EAAsB,OAAOgB,EAAO,CAAC,SAASC,CAAS;EAEpI,UAAA,kBAAC,OAAD;GAAK,WAAWrB,EAAG,0BAA0BsB,KAAW,sBAAsB;GAA9E,UAAA,CACE,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,kBAACpB,GAAD;MAAM,MAAMqB,KAAQjB,EAAKa;MAAO,MAAK;MAAK,WAAWnB,EAAG,QAAQW,EAAUQ,EAAK;KAAI,CAAA,GACnF,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACGK,KAAS,kBAAC,QAAD;OAAM,WAAU;OAAyB,UAAAA;MAAY,CAAA,GAC9DC,KAAY,kBAAC,OAAD;OAAK,WAAU;OAAuB;MAAc,CAAA,CAC9D;KACF,CAAA,CAAA;IACJ,CAAA,GAAAH,KAAW,kBAAC,OAAD;KAAK,WAAU;KAAiE,UAAAA;IAAa,CAAA,CACtG;GACJ,CAAA,GAAAL,KACC,kBAACd,GAAD;IACE,MAAMJ;IACN,cAAYiB,EAAE,kBAAkB,SAAS;IACzC,MAAK;IACL,WAAU;IACV,eAAe;KAEb,AADAF,EAAU,EAAI,GACdI,IAAY;IACd;GACD,CAAA,CAEA;;CACF,CAAA;AAET,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAO,cAAc"}
+{"version":3,"file":"banner-DY1jSc9Y.js","names":["__icon_InformationCircleIcon","__icon_CheckmarkCircle02Icon","__icon_Alert02Icon","__icon_AlertCircleIcon","__icon_Cancel01Icon","cn","useUiText","Icon","IconButton","KAESO_BANNER_VARIANTS","KAESO_BANNER_DEFAULT_VARIANTS","ICON","InformationCircleIcon","CheckmarkCircle02Icon","Alert02Icon","AlertCircleIcon","ICON_TONE","Banner","hidden","setHidden","useState","t","dismissible","onDismiss","tone","layout","className","actions","icon","title","children","Cancel01Icon"],"sources":["../../src/components/banner/banner.tsx"],"sourcesContent":["import { forwardRef, useState, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { InformationCircleIcon as __icon_InformationCircleIcon, CheckmarkCircle02Icon as __icon_CheckmarkCircle02Icon, Alert02Icon as __icon_Alert02Icon, AlertCircleIcon as __icon_AlertCircleIcon, Cancel01Icon as __icon_Cancel01Icon } from \"@hugeicons/core-free-icons\";\nimport { Icon, type IconData } from \"../icon/icon.js\";\nimport { IconButton } from \"../icon-button/icon-button.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_BANNER_VARIANTS = {\n  tone: {\n    neutral: { classes: \"bg-fill-1 text-fg\" },\n    info: { classes: \"bg-info-tint text-fg\" },\n    success: { classes: \"bg-success-tint text-fg\" },\n    warning: { classes: \"bg-warning-tint text-fg\" },\n    danger: { classes: \"bg-danger-tint text-fg\" },\n  },\n  layout: {\n    inline: { classes: \"rounded-well px-16 py-12\" },\n    full: { classes: \"rounded-none px-24 py-10\" },\n  },\n} as const;\nexport const KAESO_BANNER_DEFAULT_VARIANTS = { tone: \"neutral\", layout: \"inline\" } as const;\n\nconst ICON: Record<keyof typeof KAESO_BANNER_VARIANTS.tone, IconData> = {\n  neutral: __icon_InformationCircleIcon,\n  info: __icon_InformationCircleIcon,\n  success: __icon_CheckmarkCircle02Icon,\n  warning: __icon_Alert02Icon,\n  danger: __icon_AlertCircleIcon,\n};\nconst ICON_TONE = {\n  neutral: \"text-fg-secondary\",\n  info: \"text-info-text\",\n  success: \"text-success-text\",\n  warning: \"text-warning-text\",\n  danger: \"text-danger-text\",\n} as const;\n\nexport interface BannerProps {\n  tone?: keyof typeof KAESO_BANNER_VARIANTS.tone | undefined;\n  layout?: keyof typeof KAESO_BANNER_VARIANTS.layout | undefined;\n  title?: ReactNode | undefined;\n  children?: ReactNode | undefined;\n  icon?: IconData | undefined;\n  actions?: ReactNode | undefined;\n  onDismiss?: (() => void) | undefined;\n  className?: string | undefined;\n}\n\nexport const Banner = /* @__PURE__ */ forwardRef<HTMLDivElement, BannerProps>(function Banner(\n  { tone = \"neutral\", layout = \"inline\", title, children, icon, actions, onDismiss, className },\n  ref,\n) {\n  const [hidden, setHidden] = useState(false);\n  const t = useUiText();\n  if (hidden) return null;\n  const dismissible = onDismiss && (tone === \"neutral\" || tone === \"info\");\n  return (\n    <div\n      ref={ref}\n      role={tone === \"danger\" ? \"alert\" : \"status\"}\n      className={cn(\"@container w-full\", KAESO_BANNER_VARIANTS.tone[tone].classes, KAESO_BANNER_VARIANTS.layout[layout].classes, className)}\n    >\n      <div className={cn(\"flex items-start gap-8\", actions && \"@banner:items-center\")}>\n        <div className=\"flex min-w-0 flex-1 flex-col gap-12 @banner:flex-row @banner:items-center @banner:gap-24\">\n          <div className=\"flex min-w-0 flex-1 items-start gap-8\">\n            <Icon icon={icon ?? ICON[tone]} size=\"sm\" className={cn(\"mt-2\", ICON_TONE[tone])} />\n            <div className=\"flex min-w-0 flex-1 flex-col gap-2 text-body\">\n              {title && <span className=\"font-semibold text-fg\">{title}</span>}\n              {children && <div className=\"text-fg text-pretty\">{children}</div>}\n            </div>\n          </div>\n          {actions && <div className=\"ml-24 flex shrink-0 flex-wrap items-center gap-8 @banner:ml-0\">{actions}</div>}\n        </div>\n        {dismissible && (\n          <IconButton\n            icon={__icon_Cancel01Icon}\n            aria-label={t(\"banner.dismiss\", \"Dismiss\")}\n            size=\"xs\"\n            className=\"-my-2 -mr-6\"\n            onClick={() => {\n              setHidden(true);\n              onDismiss?.();\n            }}\n          />\n        )}\n      </div>\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Banner.displayName = \"Banner\";\n"],"mappings":";;;;;;;;;AAOA,IAAaS,IAAwB;CACnC,MAAM;EACJ,SAAS,EAAE,SAAS,oBAAoB;EACxC,MAAM,EAAE,SAAS,uBAAuB;EACxC,SAAS,EAAE,SAAS,0BAA0B;EAC9C,SAAS,EAAE,SAAS,0BAA0B;EAC9C,QAAQ,EAAE,SAAS,yBAAyB;CAC9C;CACA,QAAQ;EACN,QAAQ,EAAE,SAAS,2BAA2B;EAC9C,MAAM,EAAE,SAAS,2BAA2B;CAC9C;AACF,GACaC,IAAgC;CAAE,MAAM;CAAW,QAAQ;AAAS,GAE3EC,IAAkE;CACtE,SAASX;CACT,MAAMA;CACN,SAASC;CACT,SAASC;CACT,QAAQC;AACV,GACMa,IAAY;CAChB,SAAS;CACT,MAAM;CACN,SAAS;CACT,SAAS;CACT,QAAQ;AACV,GAaaC,IAAyB,kBAAwC,SAC5E,EAAE,UAAO,WAAW,YAAS,UAAU,UAAO,aAAU,SAAM,YAAS,cAAW,gBAClF,GACA;CACA,IAAM,CAACC,GAAQC,KAAaC,EAAS,EAAK,GACpCC,IAAIf,EAAU;CACpB,IAAIY,GAAQ,OAAO;CACnB,IAAMI,IAAcC,MAAcC,MAAS,aAAaA,MAAS;CACjE,OACE,kBAAC,OAAD;EACO;EACL,MAAMA,MAAS,WAAW,UAAU;EACpC,WAAWnB,EAAG,qBAAqBI,EAAsB,KAAKe,EAAK,CAAC,SAASf,EAAsB,OAAOgB,EAAO,CAAC,SAASC,CAAS;EAEpI,UAAA,kBAAC,OAAD;GAAK,WAAWrB,EAAG,0BAA0BsB,KAAW,sBAAsB;GAA9E,UAAA,CACE,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,kBAACpB,GAAD;MAAM,MAAMqB,KAAQjB,EAAKa;MAAO,MAAK;MAAK,WAAWnB,EAAG,QAAQW,EAAUQ,EAAK;KAAI,CAAA,GACnF,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACGK,KAAS,kBAAC,QAAD;OAAM,WAAU;OAAyB,UAAAA;MAAY,CAAA,GAC9DC,KAAY,kBAAC,OAAD;OAAK,WAAU;OAAuB;MAAc,CAAA,CAC9D;KACF,CAAA,CAAA;IACJ,CAAA,GAAAH,KAAW,kBAAC,OAAD;KAAK,WAAU;KAAiE,UAAAA;IAAa,CAAA,CACtG;GACJ,CAAA,GAAAL,KACC,kBAACd,GAAD;IACE,MAAMJ;IACN,cAAYiB,EAAE,kBAAkB,SAAS;IACzC,MAAK;IACL,WAAU;IACV,eAAe;KAEb,AADAF,EAAU,EAAI,GACdI,IAAY;IACd;GACD,CAAA,CAEA;;CACF,CAAA;AAET,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAO,cAAc"}

package/dist/chunks/{button-CAPyW-v8.js → button-h2IFCER2.js}

@@ -4,7 +4,7 @@ import { i as t, r as n } from "./dev-CR1p7gCm.js";
 import { n as r, r as i } from "./link-provider-BsUxhZKG.js";
 import { t as a } from "./icon-BqujXDUc.js";
 import { i as o } from "./kbd-DqWmbr_e.js";
-import { r as s } from "./tooltip-S1DmyLVl.js";
+import { r as s } from "./tooltip-CTBnfiDH.js";
 import { i as c, r as l } from "./loader-ENBh2Fbt.js";
 import { r as u } from "./swap-text-Cica0pUr.js";
 import { forwardRef as d } from "react";
@@ -161,4 +161,4 @@ process.env.NODE_ENV !== "production" && (S.displayName = "Button");
 //#endregion
 export { x as a, h as i, S as n, g as r, b as t };
 
-//# sourceMappingURL=button-CAPyW-v8.js.map
+//# sourceMappingURL=button-h2IFCER2.js.map

package/dist/chunks/{button-CAPyW-v8.js.map → button-h2IFCER2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"button-CAPyW-v8.js","names":["_Fragment","cn","warnStylingClassName","warnMissingName","isExternalHref","useLinkComponent","Icon","KbdSequence","Tooltip","useDelayedLoading","Spinner","SwapText","Fragment$1","KAESO_BUTTON_VARIANTS","KAESO_BUTTON_DEFAULT_VARIANTS","LEADING_ICON_PADDING","TRAILING_ICON_PADDING","CIRCLE","BUTTON_ICON_SIZE","buttonClasses","size","shape","leading","variant","trailing","fullWidth","Button","rest","props","LinkComp","className","spinning","loading","busy","isCircle","iconSize","spinnerSize","leadingIcon","trailingIcon","shortcut","count","reserveLabels","domProps","k","softDisabled","disabledReason","disabled","inert","classes","content","handleClick","onClick","el","href","external","target","rel","type"],"sources":["../../src/components/button/button.tsx"],"sourcesContent":["import { forwardRef, type ButtonHTMLAttributes, type MouseEvent, type ReactElement, type ReactNode, type Ref } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useLinkComponent, isExternalHref } from \"../../utils/link-provider.js\";\nimport { warnMissingName, warnStylingClassName } from \"../../utils/dev.js\";\nimport { Icon, type IconData, type IconSize } from \"../icon/icon.js\";\nimport { Spinner, useDelayedLoading } from \"../loader/loader.js\";\nimport { KbdSequence } from \"../kbd/kbd.js\";\nimport { Tooltip } from \"../tooltip/tooltip.js\";\nimport { SwapText } from \"../swap-text/swap-text.js\";\n\nexport const KAESO_BUTTON_VARIANTS = {\n  variant: {\n    primary: { classes: \"material-primary\" },\n    secondary: { classes: \"material-secondary\" },\n    ghost: { classes: \"material-ghost\" },\n    quiet: {\n      classes: \"material-ghost text-fg-secondary hover:text-fg\",\n    },\n    soft: { classes: \"material-soft\" },\n    danger: { classes: \"material-danger\" },\n    \"danger-secondary\": { classes: \"material-danger-secondary\" },\n    link: {\n      classes: \"bg-transparent text-fg underline decoration-line-strong decoration-1 underline-offset-3 hover:decoration-current disabled:text-fg-disabled\",\n    },\n  },\n  size: {\n    xs: { classes: \"h-24 px-10 gap-4 text-caption font-medium\" },\n    sm: { classes: \"h-32 px-12 gap-6 text-body font-medium\" },\n    md: { classes: \"h-36 px-16 gap-6 text-body font-medium\" },\n    lg: { classes: \"h-40 px-18 gap-8 text-body font-medium\" },\n    xl: { classes: \"h-48 px-22 gap-8 text-body-lg font-medium\" },\n  },\n  shape: {\n    pill: { classes: \"rounded-pill\" },\n    circle: { classes: \"rounded-pill p-0 justify-center\" },\n  },\n} as const;\nexport const KAESO_BUTTON_DEFAULT_VARIANTS = { variant: \"secondary\", size: \"md\", shape: \"pill\" } as const;\n\nexport type ButtonVariant = keyof typeof KAESO_BUTTON_VARIANTS.variant;\nexport type ButtonSize = keyof typeof KAESO_BUTTON_VARIANTS.size;\nexport type ButtonShape = keyof typeof KAESO_BUTTON_VARIANTS.shape;\n\nconst LEADING_ICON_PADDING: Record<ButtonSize, string> = { xs: \"pl-8\", sm: \"pl-10\", md: \"pl-14\", lg: \"pl-16\", xl: \"pl-20\" };\nconst TRAILING_ICON_PADDING: Record<ButtonSize, string> = { xs: \"pr-8\", sm: \"pr-10\", md: \"pr-14\", lg: \"pr-16\", xl: \"pr-20\" };\nconst CIRCLE: Record<ButtonSize, string> = { xs: \"size-24\", sm: \"size-32\", md: \"size-36\", lg: \"size-40\", xl: \"size-48\" };\nexport const BUTTON_ICON_SIZE: Record<ButtonSize, IconSize> = { xs: \"xs\", sm: \"sm\", md: \"sm\", lg: \"md\", xl: \"lg\" };\n\nexport function buttonClasses({\n  variant = KAESO_BUTTON_DEFAULT_VARIANTS.variant,\n  size = KAESO_BUTTON_DEFAULT_VARIANTS.size,\n  shape = KAESO_BUTTON_DEFAULT_VARIANTS.shape,\n  leading = false,\n  trailing = false,\n  fullWidth = false,\n}: {\n  variant?: ButtonVariant | undefined;\n  size?: ButtonSize | undefined;\n  shape?: ButtonShape | undefined;\n  leading?: boolean | undefined;\n  trailing?: boolean | undefined;\n  fullWidth?: boolean | undefined;\n} = {}) {\n  return cn(\n    \"relative inline-flex shrink-0 select-none items-center justify-center whitespace-nowrap no-underline\",\n    \"cursor-pointer transition-control focus-ring tap-target disabled:cursor-not-allowed\",\n    KAESO_BUTTON_VARIANTS.size[size].classes,\n    KAESO_BUTTON_VARIANTS.shape[shape].classes,\n    shape === \"circle\" && CIRCLE[size],\n    shape === \"pill\" && leading && variant !== \"link\" && LEADING_ICON_PADDING[size],\n    shape === \"pill\" && trailing && variant !== \"link\" && TRAILING_ICON_PADDING[size],\n    variant === \"link\" && \"-mx-4 px-4\",\n    KAESO_BUTTON_VARIANTS.variant[variant].classes,\n    fullWidth && \"w-full\",\n  );\n}\n\ninterface CommonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"children\"> {\n  variant?: ButtonVariant | undefined;\n  size?: ButtonSize | undefined;\n  loading?: boolean | undefined;\n  disabledReason?: string | undefined;\n  href?: string | undefined;\n  target?: string | undefined;\n  rel?: string | undefined;\n  fullWidth?: boolean | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport interface PillButtonProps extends CommonProps {\n  shape?: \"pill\" | undefined;\n  children: ReactNode;\n  leadingIcon?: IconData | undefined;\n  trailingIcon?: IconData | undefined;\n  shortcut?: string[] | string[][] | undefined;\n  count?: number | undefined;\n  reserveLabels?: ReactNode[] | undefined;\n}\n\nexport interface CircleButtonProps extends CommonProps {\n  shape: \"circle\";\n  icon: IconData;\n  \"aria-label\": string;\n  children?: never | undefined;\n}\n\nexport type ButtonProps = PillButtonProps | CircleButtonProps;\n\nexport const Button = /* @__PURE__ */ forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(function Button(props, ref) {\n  const {\n    variant = KAESO_BUTTON_DEFAULT_VARIANTS.variant,\n    size = KAESO_BUTTON_DEFAULT_VARIANTS.size,\n    loading = false,\n    disabled = false,\n    disabledReason,\n    href,\n    target,\n    rel,\n    fullWidth,\n    className,\n    type,\n    onClick,\n    ...rest\n  } = props;\n  const LinkComp = useLinkComponent();\n  warnStylingClassName(\"Button\", className);\n\n  const spinning = useDelayedLoading(loading);\n  const busy = loading || spinning;\n  const isCircle = props.shape === \"circle\";\n  const iconSize = BUTTON_ICON_SIZE[size];\n  const spinnerSize = iconSize === \"xs\" ? \"xs\" : iconSize === \"sm\" ? \"sm\" : \"md\";\n  const leadingIcon = !isCircle ? (props as PillButtonProps).leadingIcon : undefined;\n  const trailingIcon = !isCircle ? (props as PillButtonProps).trailingIcon : undefined;\n  const shortcut = !isCircle ? (props as PillButtonProps).shortcut : undefined;\n  const count = !isCircle ? (props as PillButtonProps).count : undefined;\n  const reserveLabels = !isCircle ? (props as PillButtonProps).reserveLabels : undefined;\n  if (isCircle) warnMissingName(\"Button\", !!(props as CircleButtonProps)[\"aria-label\"]);\n\n  const domProps = { ...rest } as Record<string, unknown>;\n  for (const k of [\"shape\", \"icon\", \"leadingIcon\", \"trailingIcon\", \"shortcut\", \"count\", \"children\", \"reserveLabels\"]) delete domProps[k];\n\n  const softDisabled = !!disabledReason && disabled;\n  const inert = busy || softDisabled;\n  const classes = cn(\n    buttonClasses({\n      variant,\n      size,\n      shape: isCircle ? \"circle\" : \"pill\",\n      leading: !!leadingIcon,\n      trailing: !!trailingIcon || !!shortcut || count !== undefined,\n      fullWidth: !!fullWidth,\n    }),\n    busy && \"cursor-progress\",\n    className,\n  );\n\n  const content = isCircle ? (\n    spinning ? (\n      <Spinner size={spinnerSize} />\n    ) : (\n      <Icon icon={(props as CircleButtonProps).icon} size={iconSize} />\n    )\n  ) : (\n    <>\n      {spinning && leadingIcon ? <Spinner size={spinnerSize} /> : leadingIcon ? <Icon icon={leadingIcon} size={iconSize} /> : null}\n      <span className={cn(\"inline-flex min-w-0 items-center\", spinning && !leadingIcon && \"opacity-0\")}>\n        {reserveLabels ? <SwapText reserve={reserveLabels}>{(props as PillButtonProps).children}</SwapText> : (props as PillButtonProps).children}\n      </span>\n      {count !== undefined && (\n        <span\n          className={cn(\n            \"inline-flex h-20 min-w-20 items-center justify-center rounded-pill px-6 text-caption font-medium tabular\",\n            variant === \"primary\" ? \"bg-on-ink/15 text-on-ink\" : variant === \"danger\" ? \"bg-on-danger/20 text-on-danger\" : \"bg-fill-2 text-fg-secondary\",\n          )}\n        >\n          {count}\n        </span>\n      )}\n      {shortcut && <KbdSequence keys={shortcut} tone={variant === \"primary\" || variant === \"danger\" ? \"onInk\" : \"default\"} />}\n      {trailingIcon && <Icon icon={trailingIcon} size={iconSize} />}\n      {spinning && !leadingIcon && <Spinner size={spinnerSize} className=\"absolute inset-0 m-auto\" />}\n    </>\n  );\n\n  const handleClick = (e: MouseEvent<HTMLButtonElement & HTMLAnchorElement>) => {\n    if (inert) {\n      e.preventDefault();\n      return;\n    }\n    onClick?.(e as MouseEvent<HTMLButtonElement>);\n  };\n\n  let el: ReactNode;\n  if (href && !disabled) {\n    const external = isExternalHref(href);\n    el = (\n      <LinkComp\n        ref={ref as Ref<HTMLAnchorElement>}\n        href={href}\n        className={classes}\n        {...(target ? { target } : external ? { target: \"_blank\" } : {})}\n        {...(rel ? { rel } : external ? { rel: \"noopener noreferrer\" } : {})}\n        {...(domProps as object)}\n        {...(busy ? { \"aria-busy\": true, \"data-loading\": \"\" } : {})}\n        onClick={handleClick}\n      >\n        {content}\n      </LinkComp>\n    );\n  } else {\n    el = (\n      <button\n        ref={ref as Ref<HTMLButtonElement>}\n        type={type ?? \"button\"}\n        className={classes}\n        disabled={disabled && !softDisabled}\n        {...(domProps as object)}\n        {...(softDisabled ? { \"aria-disabled\": true } : {})}\n        {...(busy ? { \"aria-busy\": true, \"data-loading\": \"\" } : {})}\n        {...(softDisabled ? { \"data-disabled\": \"\" } : {})}\n        onClick={handleClick}\n      >\n        {content}\n      </button>\n    );\n  }\n\n  if (disabledReason && disabled) {\n    return <Tooltip content={disabledReason}>{el as ReactElement}</Tooltip>;\n  }\n  return el;\n});\nif (process.env.NODE_ENV !== \"production\") Button.displayName = \"Button\";\n"],"mappings":"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"}
+{"version":3,"file":"button-h2IFCER2.js","names":["_Fragment","cn","warnStylingClassName","warnMissingName","isExternalHref","useLinkComponent","Icon","KbdSequence","Tooltip","useDelayedLoading","Spinner","SwapText","Fragment$1","KAESO_BUTTON_VARIANTS","KAESO_BUTTON_DEFAULT_VARIANTS","LEADING_ICON_PADDING","TRAILING_ICON_PADDING","CIRCLE","BUTTON_ICON_SIZE","buttonClasses","size","shape","leading","variant","trailing","fullWidth","Button","rest","props","LinkComp","className","spinning","loading","busy","isCircle","iconSize","spinnerSize","leadingIcon","trailingIcon","shortcut","count","reserveLabels","domProps","k","softDisabled","disabledReason","disabled","inert","classes","content","handleClick","onClick","el","href","external","target","rel","type"],"sources":["../../src/components/button/button.tsx"],"sourcesContent":["import { forwardRef, type ButtonHTMLAttributes, type MouseEvent, type ReactElement, type ReactNode, type Ref } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useLinkComponent, isExternalHref } from \"../../utils/link-provider.js\";\nimport { warnMissingName, warnStylingClassName } from \"../../utils/dev.js\";\nimport { Icon, type IconData, type IconSize } from \"../icon/icon.js\";\nimport { Spinner, useDelayedLoading } from \"../loader/loader.js\";\nimport { KbdSequence } from \"../kbd/kbd.js\";\nimport { Tooltip } from \"../tooltip/tooltip.js\";\nimport { SwapText } from \"../swap-text/swap-text.js\";\n\nexport const KAESO_BUTTON_VARIANTS = {\n  variant: {\n    primary: { classes: \"material-primary\" },\n    secondary: { classes: \"material-secondary\" },\n    ghost: { classes: \"material-ghost\" },\n    quiet: {\n      classes: \"material-ghost text-fg-secondary hover:text-fg\",\n    },\n    soft: { classes: \"material-soft\" },\n    danger: { classes: \"material-danger\" },\n    \"danger-secondary\": { classes: \"material-danger-secondary\" },\n    link: {\n      classes: \"bg-transparent text-fg underline decoration-line-strong decoration-1 underline-offset-3 hover:decoration-current disabled:text-fg-disabled\",\n    },\n  },\n  size: {\n    xs: { classes: \"h-24 px-10 gap-4 text-caption font-medium\" },\n    sm: { classes: \"h-32 px-12 gap-6 text-body font-medium\" },\n    md: { classes: \"h-36 px-16 gap-6 text-body font-medium\" },\n    lg: { classes: \"h-40 px-18 gap-8 text-body font-medium\" },\n    xl: { classes: \"h-48 px-22 gap-8 text-body-lg font-medium\" },\n  },\n  shape: {\n    pill: { classes: \"rounded-pill\" },\n    circle: { classes: \"rounded-pill p-0 justify-center\" },\n  },\n} as const;\nexport const KAESO_BUTTON_DEFAULT_VARIANTS = { variant: \"secondary\", size: \"md\", shape: \"pill\" } as const;\n\nexport type ButtonVariant = keyof typeof KAESO_BUTTON_VARIANTS.variant;\nexport type ButtonSize = keyof typeof KAESO_BUTTON_VARIANTS.size;\nexport type ButtonShape = keyof typeof KAESO_BUTTON_VARIANTS.shape;\n\nconst LEADING_ICON_PADDING: Record<ButtonSize, string> = { xs: \"pl-8\", sm: \"pl-10\", md: \"pl-14\", lg: \"pl-16\", xl: \"pl-20\" };\nconst TRAILING_ICON_PADDING: Record<ButtonSize, string> = { xs: \"pr-8\", sm: \"pr-10\", md: \"pr-14\", lg: \"pr-16\", xl: \"pr-20\" };\nconst CIRCLE: Record<ButtonSize, string> = { xs: \"size-24\", sm: \"size-32\", md: \"size-36\", lg: \"size-40\", xl: \"size-48\" };\nexport const BUTTON_ICON_SIZE: Record<ButtonSize, IconSize> = { xs: \"xs\", sm: \"sm\", md: \"sm\", lg: \"md\", xl: \"lg\" };\n\nexport function buttonClasses({\n  variant = KAESO_BUTTON_DEFAULT_VARIANTS.variant,\n  size = KAESO_BUTTON_DEFAULT_VARIANTS.size,\n  shape = KAESO_BUTTON_DEFAULT_VARIANTS.shape,\n  leading = false,\n  trailing = false,\n  fullWidth = false,\n}: {\n  variant?: ButtonVariant | undefined;\n  size?: ButtonSize | undefined;\n  shape?: ButtonShape | undefined;\n  leading?: boolean | undefined;\n  trailing?: boolean | undefined;\n  fullWidth?: boolean | undefined;\n} = {}) {\n  return cn(\n    \"relative inline-flex shrink-0 select-none items-center justify-center whitespace-nowrap no-underline\",\n    \"cursor-pointer transition-control focus-ring tap-target disabled:cursor-not-allowed\",\n    KAESO_BUTTON_VARIANTS.size[size].classes,\n    KAESO_BUTTON_VARIANTS.shape[shape].classes,\n    shape === \"circle\" && CIRCLE[size],\n    shape === \"pill\" && leading && variant !== \"link\" && LEADING_ICON_PADDING[size],\n    shape === \"pill\" && trailing && variant !== \"link\" && TRAILING_ICON_PADDING[size],\n    variant === \"link\" && \"-mx-4 px-4\",\n    KAESO_BUTTON_VARIANTS.variant[variant].classes,\n    fullWidth && \"w-full\",\n  );\n}\n\ninterface CommonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"children\"> {\n  variant?: ButtonVariant | undefined;\n  size?: ButtonSize | undefined;\n  loading?: boolean | undefined;\n  disabledReason?: string | undefined;\n  href?: string | undefined;\n  target?: string | undefined;\n  rel?: string | undefined;\n  fullWidth?: boolean | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport interface PillButtonProps extends CommonProps {\n  shape?: \"pill\" | undefined;\n  children: ReactNode;\n  leadingIcon?: IconData | undefined;\n  trailingIcon?: IconData | undefined;\n  shortcut?: string[] | string[][] | undefined;\n  count?: number | undefined;\n  reserveLabels?: ReactNode[] | undefined;\n}\n\nexport interface CircleButtonProps extends CommonProps {\n  shape: \"circle\";\n  icon: IconData;\n  \"aria-label\": string;\n  children?: never | undefined;\n}\n\nexport type ButtonProps = PillButtonProps | CircleButtonProps;\n\nexport const Button = /* @__PURE__ */ forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(function Button(props, ref) {\n  const {\n    variant = KAESO_BUTTON_DEFAULT_VARIANTS.variant,\n    size = KAESO_BUTTON_DEFAULT_VARIANTS.size,\n    loading = false,\n    disabled = false,\n    disabledReason,\n    href,\n    target,\n    rel,\n    fullWidth,\n    className,\n    type,\n    onClick,\n    ...rest\n  } = props;\n  const LinkComp = useLinkComponent();\n  warnStylingClassName(\"Button\", className);\n\n  const spinning = useDelayedLoading(loading);\n  const busy = loading || spinning;\n  const isCircle = props.shape === \"circle\";\n  const iconSize = BUTTON_ICON_SIZE[size];\n  const spinnerSize = iconSize === \"xs\" ? \"xs\" : iconSize === \"sm\" ? \"sm\" : \"md\";\n  const leadingIcon = !isCircle ? (props as PillButtonProps).leadingIcon : undefined;\n  const trailingIcon = !isCircle ? (props as PillButtonProps).trailingIcon : undefined;\n  const shortcut = !isCircle ? (props as PillButtonProps).shortcut : undefined;\n  const count = !isCircle ? (props as PillButtonProps).count : undefined;\n  const reserveLabels = !isCircle ? (props as PillButtonProps).reserveLabels : undefined;\n  if (isCircle) warnMissingName(\"Button\", !!(props as CircleButtonProps)[\"aria-label\"]);\n\n  const domProps = { ...rest } as Record<string, unknown>;\n  for (const k of [\"shape\", \"icon\", \"leadingIcon\", \"trailingIcon\", \"shortcut\", \"count\", \"children\", \"reserveLabels\"]) delete domProps[k];\n\n  const softDisabled = !!disabledReason && disabled;\n  const inert = busy || softDisabled;\n  const classes = cn(\n    buttonClasses({\n      variant,\n      size,\n      shape: isCircle ? \"circle\" : \"pill\",\n      leading: !!leadingIcon,\n      trailing: !!trailingIcon || !!shortcut || count !== undefined,\n      fullWidth: !!fullWidth,\n    }),\n    busy && \"cursor-progress\",\n    className,\n  );\n\n  const content = isCircle ? (\n    spinning ? (\n      <Spinner size={spinnerSize} />\n    ) : (\n      <Icon icon={(props as CircleButtonProps).icon} size={iconSize} />\n    )\n  ) : (\n    <>\n      {spinning && leadingIcon ? <Spinner size={spinnerSize} /> : leadingIcon ? <Icon icon={leadingIcon} size={iconSize} /> : null}\n      <span className={cn(\"inline-flex min-w-0 items-center\", spinning && !leadingIcon && \"opacity-0\")}>\n        {reserveLabels ? <SwapText reserve={reserveLabels}>{(props as PillButtonProps).children}</SwapText> : (props as PillButtonProps).children}\n      </span>\n      {count !== undefined && (\n        <span\n          className={cn(\n            \"inline-flex h-20 min-w-20 items-center justify-center rounded-pill px-6 text-caption font-medium tabular\",\n            variant === \"primary\" ? \"bg-on-ink/15 text-on-ink\" : variant === \"danger\" ? \"bg-on-danger/20 text-on-danger\" : \"bg-fill-2 text-fg-secondary\",\n          )}\n        >\n          {count}\n        </span>\n      )}\n      {shortcut && <KbdSequence keys={shortcut} tone={variant === \"primary\" || variant === \"danger\" ? \"onInk\" : \"default\"} />}\n      {trailingIcon && <Icon icon={trailingIcon} size={iconSize} />}\n      {spinning && !leadingIcon && <Spinner size={spinnerSize} className=\"absolute inset-0 m-auto\" />}\n    </>\n  );\n\n  const handleClick = (e: MouseEvent<HTMLButtonElement & HTMLAnchorElement>) => {\n    if (inert) {\n      e.preventDefault();\n      return;\n    }\n    onClick?.(e as MouseEvent<HTMLButtonElement>);\n  };\n\n  let el: ReactNode;\n  if (href && !disabled) {\n    const external = isExternalHref(href);\n    el = (\n      <LinkComp\n        ref={ref as Ref<HTMLAnchorElement>}\n        href={href}\n        className={classes}\n        {...(target ? { target } : external ? { target: \"_blank\" } : {})}\n        {...(rel ? { rel } : external ? { rel: \"noopener noreferrer\" } : {})}\n        {...(domProps as object)}\n        {...(busy ? { \"aria-busy\": true, \"data-loading\": \"\" } : {})}\n        onClick={handleClick}\n      >\n        {content}\n      </LinkComp>\n    );\n  } else {\n    el = (\n      <button\n        ref={ref as Ref<HTMLButtonElement>}\n        type={type ?? \"button\"}\n        className={classes}\n        disabled={disabled && !softDisabled}\n        {...(domProps as object)}\n        {...(softDisabled ? { \"aria-disabled\": true } : {})}\n        {...(busy ? { \"aria-busy\": true, \"data-loading\": \"\" } : {})}\n        {...(softDisabled ? { \"data-disabled\": \"\" } : {})}\n        onClick={handleClick}\n      >\n        {content}\n      </button>\n    );\n  }\n\n  if (disabledReason && disabled) {\n    return <Tooltip content={disabledReason}>{el as ReactElement}</Tooltip>;\n  }\n  return el;\n});\nif (process.env.NODE_ENV !== \"production\") Button.displayName = \"Button\";\n"],"mappings":"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"}

package/dist/chunks/{calendar-CBeptQFq.js → calendar-cVuezHQ6.js}

@@ -69,7 +69,10 @@ function p(e, t) {
 }
 function m({ mode: n = "single", selected: a, onSelect: o, month: s, defaultMonth: l, onMonthChange: u, numberOfMonths: m = 1, weekStartsOn: h = 1, disabled: g, className: _ }) {
 	let v = t(), y = e(), b = {
-		...r(() => v === "en" ? {} : p(v, y), [v, y]),
+		...r(() => {
+			let e = p(v, y);
+			return v === "en" ? { labels: e.labels } : e;
+		}, [v, y]),
 		classNames: m > 1 ? {
 			...d,
 			outside: "k-outside invisible"
@@ -101,4 +104,4 @@ process.env.NODE_ENV !== "production" && (m.displayName = "Calendar");
 //#endregion
 export { u as n, l as r, m as t };
 
-//# sourceMappingURL=calendar-CBeptQFq.js.map
+//# sourceMappingURL=calendar-cVuezHQ6.js.map

package/dist/chunks/calendar-cVuezHQ6.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-cVuezHQ6.js","names":["__icon_ArrowLeft01Icon","__icon_ArrowRight01Icon","__icon_ArrowDown01Icon","useUiText","useLocale","Icon","KAESO_CALENDAR_VARIANTS","KAESO_CALENDAR_DEFAULT_VARIANTS","CAL_CLASSES","Chevron","orientation","ArrowLeft01Icon","ArrowRight01Icon","ArrowDown01Icon","localized","monthYear","locale","weekdayShort","weekdayLong","full","month","weekday","label","date","modifiers","Calendar","t","common","useMemo","own","numberOfMonths","defaultMonth","onMonthChange","disabled","className","mode","DayPicker","onSelect","r","d"],"sources":["../../src/components/calendar/calendar.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { DayPicker, type DateRange, type Formatters, type Labels } from \"react-day-picker\";\nimport { Icon } from \"../icon/icon.js\";\nimport { ArrowLeft01Icon as __icon_ArrowLeft01Icon, ArrowRight01Icon as __icon_ArrowRight01Icon, ArrowDown01Icon as __icon_ArrowDown01Icon } from \"@hugeicons/core-free-icons\";\nimport { useLocale, useUiText, type UiText } from \"../../i18n/context.js\";\n\nexport const KAESO_CALENDAR_VARIANTS = {\n  mode: {\n    single: { classes: \"\" },\n    range: { classes: \"\" },\n  },\n} as const;\nexport const KAESO_CALENDAR_DEFAULT_VARIANTS = { mode: \"single\" } as const;\n\nconst CAL_CLASSES = {\n  root: \"k-cal relative select-none\",\n  months: \"flex gap-24\",\n  month: \"flex flex-col gap-8\",\n  month_caption: \"flex h-32 items-center px-8 text-body font-semibold text-fg\",\n  caption_label: \"\",\n  nav: \"absolute top-0 right-0 flex items-center gap-2\",\n  button_previous:\n    \"inline-flex size-32 items-center justify-center rounded-pill text-fg-secondary transition-control hover:bg-fill-1 hover:text-fg focus-ring disabled:opacity-40\",\n  button_next:\n    \"inline-flex size-32 items-center justify-center rounded-pill text-fg-secondary transition-control hover:bg-fill-1 hover:text-fg focus-ring disabled:opacity-40\",\n  month_grid: \"border-collapse\",\n  weekdays: \"\",\n  weekday: \"h-32 w-36 text-caption font-medium text-fg-tertiary\",\n  weeks: \"\",\n  week: \"\",\n  day: \"k-day\",\n  day_button: \"\",\n  selected: \"k-selected\",\n  today: \"k-today\",\n  outside: \"k-outside\",\n  disabled: \"k-disabled\",\n  range_start: \"k-range-start\",\n  range_middle: \"k-range-middle\",\n  range_end: \"k-range-end\",\n  hidden: \"invisible\",\n  focused: \"\",\n  chevron: \"\",\n  footer: \"\",\n};\n\nfunction Chevron({ orientation }: { orientation?: \"left\" | \"right\" | \"up\" | \"down\" | undefined }) {\n  return <Icon icon={orientation === \"left\" ? __icon_ArrowLeft01Icon : orientation === \"right\" ? __icon_ArrowRight01Icon : __icon_ArrowDown01Icon} size=\"sm\" />;\n}\n\nfunction localized(locale: string, t: UiText): { formatters: Partial<Formatters>; labels: Partial<Labels>; lang: string } {\n  const monthYear = new Intl.DateTimeFormat(locale, { month: \"long\", year: \"numeric\" });\n  const weekdayShort = new Intl.DateTimeFormat(locale, { weekday: \"short\" });\n  const weekdayLong = new Intl.DateTimeFormat(locale, { weekday: \"long\" });\n  const full = new Intl.DateTimeFormat(locale, { dateStyle: \"full\" });\n  return {\n    lang: locale,\n    formatters: {\n      formatCaption: (month) => monthYear.format(month),\n      formatWeekdayName: (weekday) => weekdayShort.format(weekday).replace(/\\.$/, \"\"),\n    },\n    labels: {\n      labelPrevious: () => t(\"calendar.previousMonth\", \"Go to the previous month\"),\n      labelNext: () => t(\"calendar.nextMonth\", \"Go to the next month\"),\n      labelNav: () => t(\"calendar.navigation\", \"Navigation bar\"),\n      labelGrid: (month) => monthYear.format(month),\n      labelWeekday: (weekday) => weekdayLong.format(weekday),\n      labelDayButton: (date, modifiers) => {\n        let label = full.format(date);\n        if (modifiers.today) label = t(\"calendar.today\", \"Today, {date}\", { date: label });\n        if (modifiers.selected) label = t(\"calendar.selected\", \"{date}, selected\", { date: label });\n        return label;\n      },\n    },\n  };\n}\n\nexport interface CalendarProps {\n  mode?: keyof typeof KAESO_CALENDAR_VARIANTS.mode | undefined;\n  selected?: Date | DateRange | undefined;\n  onSelect?: ((value: Date | DateRange | undefined) => void) | undefined;\n  month?: Date | undefined;\n  defaultMonth?: Date | undefined;\n  onMonthChange?: ((month: Date) => void) | undefined;\n  numberOfMonths?: number | undefined;\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;\n  disabled?: ((date: Date) => boolean) | undefined;\n  className?: string | undefined;\n}\n\nexport function Calendar({\n  mode = \"single\",\n  selected,\n  onSelect,\n  month,\n  defaultMonth,\n  onMonthChange,\n  numberOfMonths = 1,\n  weekStartsOn = 1,\n  disabled,\n  className,\n}: CalendarProps) {\n  const locale = useLocale();\n  const t = useUiText();\n  const language = useMemo(() => {\n    const own = localized(locale, t);\n    return locale === \"en\" ? { labels: own.labels } : own;\n  }, [locale, t]);\n  const common = {\n    ...language,\n    classNames: numberOfMonths > 1 ? { ...CAL_CLASSES, outside: \"k-outside invisible\" } : CAL_CLASSES,\n    components: { Chevron },\n    weekStartsOn,\n    numberOfMonths,\n    showOutsideDays: true,\n    fixedWeeks: true,\n    ...(month ? { month } : {}),\n    ...(defaultMonth ? { defaultMonth } : {}),\n    ...(onMonthChange ? { onMonthChange } : {}),\n    ...(disabled ? { disabled } : {}),\n    ...(className ? { className } : {}),\n  };\n  if (mode === \"range\") {\n    return <DayPicker mode=\"range\" selected={selected as DateRange | undefined} onSelect={(r) => onSelect?.(r)} {...common} />;\n  }\n  return <DayPicker mode=\"single\" selected={selected as Date | undefined} onSelect={(d) => onSelect?.(d)} {...common} />;\n}\nif (process.env.NODE_ENV !== \"production\") Calendar.displayName = \"Calendar\";\n"],"mappings":"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"}

package/dist/chunks/{code-block-DREsvJ-g.js → code-block-BU8gYeZQ.js}

@@ -1,7 +1,7 @@
 "use client";
 import { t as e } from "./cn-DUDmdLpZ.js";
 import { i as t } from "./context-BELWW79w.js";
-import { n } from "./copy-button-CNpEnS04.js";
+import { n } from "./copy-button-CXJ7fA9z.js";
 import { forwardRef as r, useEffect as i, useMemo as a, useState as o } from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
 import { Tabs as l } from "@base-ui/react/tabs";
@@ -277,4 +277,4 @@ var w = C;
 //#endregion
 export { _ as a, x as i, w as n, b as o, S as r, m as s, C as t };
 
-//# sourceMappingURL=code-block-DREsvJ-g.js.map
+//# sourceMappingURL=code-block-BU8gYeZQ.js.map