@logicplanes/kaeso-ui 0.4.0 → 0.4.1

package/ai/component-guides.md

@@ -1,6 +1,6 @@
 # @logicplanes/kaeso-ui component guides
 
-Version 0.4.0. 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.4.1. 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
 

package/ai/component-registry.json

@@ -1,6 +1,6 @@
 {
   "package": "@logicplanes/kaeso-ui",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "components": [
     {
       "entry": "app-frame",
@@ -521,7 +521,7 @@
               "type": "\"danger\" | \"link\" | \"secondary\" | \"primary\" | \"ghost\" | \"quiet\" | \"soft\" | \"danger-secondary\"",
               "required": false,
               "default": null,
-              "description": "`primary` for the one main action of a view, `secondary` for others, `ghost` and `quiet` for toolbars, `danger` for destructive actions."
+              "description": "`primary` for the one main action of a view, `secondary` for others, `ghost` and `quiet` for toolbars and rows, `danger` for destructive actions. A ghost or quiet button at the end of a settings row's control pulls its padding past the row's edge, so its label ends where an outlined button's ring does."
             }
           ],
           "file": "src/components/button/button.tsx"
@@ -852,7 +852,7 @@
         },
         {
           "name": "ChartFrame",
-          "description": "The frame every chart draws in: a hidden data table for assistive technology, a \"View as table\" toggle, and the empty, loading and error states. Use it to build a chart of your own that behaves like the others.",
+          "description": "The frame every chart draws in: a hidden data table for assistive technology, a \"View as table\" toggle, and the empty, loading and error states. The toggle sits at the right end of the last line of the legend; when the frame is narrower than 480px (the `chart-legend` container size, a phone), it moves to its own line under the legend, so it never reads as one of the series. Use it to build a chart of your own that behaves like the others.",
           "props": [
             {
               "name": "children",
@@ -2173,7 +2173,7 @@
       "components": [
         {
           "name": "CodeBlock",
-          "description": "Highlighted code on a well: Kaeso's monochrome theme, copy on hover, tabs, line numbers, collapse.",
+          "description": "Highlighted code on a well: Kaeso's monochrome theme, copy on hover, tabs, line numbers, collapse. Long lines scroll sideways inside 16px of padding at both ends, and the code fades out at an edge with more to scroll to.",
           "props": [
             {
               "name": "className",
@@ -3451,7 +3451,7 @@
         },
         {
           "name": "InlineCopyText",
-          "description": "Inline mono text that copies itself on click, with a hover affordance. Never wider than its container: a long value (a user agent, an id) ends in an ellipsis, and its tooltip shows the whole of it until it is copied.",
+          "description": "Inline mono text that copies itself on click. On hover and keyboard focus a copy icon appears after it. When nothing follows it on its line and its row's padding has room that no cell clips, the icon takes no space, so the text ends on the same edge as the values around it; otherwise the icon keeps its own space. Touch screens always show the icon in its own space. Never wider than its container: a long value (a user agent, an id) ends in an ellipsis, and its tooltip shows the whole of it until it is copied.",
           "props": [
             {
               "name": "value",
@@ -10065,7 +10065,7 @@
           "axes": {
             "appearance": {
               "ghost": "Transparent until hovered: a column header (default)",
-              "default": "A raised pill with a ring: a form or toolbar"
+              "default": "A pill with a text input's ring: a form or toolbar"
             }
           },
           "defaults": {
@@ -11228,7 +11228,7 @@
         "SELECT": {
           "axes": {
             "appearance": {
-              "default": "A raised pill with a ring (default)",
+              "default": "A pill with the same ring, hover and focus as a text input (default)",
               "ghost": "Inline in settings rows: “GPT-5 mini (default) ⌄”",
               "header": "Transparent until hovered, in full text colour: a column header's model"
             },
@@ -11334,7 +11334,7 @@
         },
         {
           "name": "SettingsRow",
-          "description": "One setting: title 15/500 and description 13 on the left, the control on the right. When the row is too narrow to keep 140px of text beside the control (a phone, a sheet), the control moves under the text.",
+          "description": "One setting: title 15/500 and description 13 on the left, the control on the right. The row is its own size container: narrower than 480px inside its padding (the `settings-row` container size, a phone), every row's control moves under its text, so the rows of a group line up the same way whatever their control's width. A ghost or quiet button that ends the control keeps its label on the row's edge, where an outlined button's ring ends; under the text it starts on the text's edge.",
           "props": [
             {
               "name": "title",
@@ -11586,8 +11586,8 @@
               "lg": "800px"
             },
             "side": {
-              "right": "From the right (default)",
-              "left": "From the left: the mobile sidebar",
+              "right": "From the right (default); fills a phone's screen",
+              "left": "From the left: the mobile sidebar; fills a phone's screen",
               "bottom": "From the bottom: mobile menus"
             }
           },

package/ai/component-registry.md

@@ -1,6 +1,6 @@
 # @logicplanes/kaeso-ui component registry
 
-Version 0.4.0. Generated from the component types, their descriptions and variants; do not edit.
+Version 0.4.1. Generated from the component types, their descriptions and variants; do not edit.
 
 ## app-frame
 
@@ -135,7 +135,7 @@ The button. Every one is a pill; icon-only buttons are circles (see `IconButton`
 | `size` | `"md" \| "xs" \| "sm" \| "lg" \| "xl"` |  | The height, from `xs` (24px) to `xl` (44px). |
 | `target` | `string` |  | Where the link opens, as on an `a` element. |
 | `trailingIcon` | `IconSvgElement` |  | An icon after the text. |
-| `variant` | `"danger" \| "link" \| "secondary" \| "primary" \| "ghost" \| "quiet" \| "soft" \| "danger-secondary"` |  | `primary` for the one main action of a view, `secondary` for others, `ghost` and `quiet` for toolbars, `danger` for destructive actions. |
+| `variant` | `"danger" \| "link" \| "secondary" \| "primary" \| "ghost" \| "quiet" \| "soft" \| "danger-secondary"` |  | `primary` for the one main action of a view, `secondary` for others, `ghost` and `quiet` for toolbars and rows, `danger` for destructive actions. A ghost or quiet button at the end of a settings row's control pulls its padding past the row's edge, so its label ends where an outlined button's ring does. |
 
 ## button-group
 
@@ -218,7 +218,7 @@ Bars for comparing values across categories: grouped, stacked, or horizontal for
 
 ### ChartFrame
 
-The frame every chart draws in: a hidden data table for assistive technology, a "View as table" toggle, and the empty, loading and error states. Use it to build a chart of your own that behaves like the others.
+The frame every chart draws in: a hidden data table for assistive technology, a "View as table" toggle, and the empty, loading and error states. The toggle sits at the right end of the last line of the legend; when the frame is narrower than 480px (the `chart-legend` container size, a phone), it moves to its own line under the legend, so it never reads as one of the series. Use it to build a chart of your own that behaves like the others.
 
 | Prop | Type | Default | Description |
 |---|---|---|---|
@@ -507,7 +507,7 @@ Inline code: Geist Mono 13 on fill-1.
 
 ### CodeBlock
 
-Highlighted code on a well: Kaeso's monochrome theme, copy on hover, tabs, line numbers, collapse.
+Highlighted code on a well: Kaeso's monochrome theme, copy on hover, tabs, line numbers, collapse. Long lines scroll sideways inside 16px of padding at both ends, and the code fades out at an edge with more to scroll to.
 
 | Prop | Type | Default | Description |
 |---|---|---|---|
@@ -789,7 +789,7 @@ A circle that copies a value: a check and "Copied" for 1.2s.
 
 ### InlineCopyText
 
-Inline mono text that copies itself on click, with a hover affordance. Never wider than its container: a long value (a user agent, an id) ends in an ellipsis, and its tooltip shows the whole of it until it is copied.
+Inline mono text that copies itself on click. On hover and keyboard focus a copy icon appears after it. When nothing follows it on its line and its row's padding has room that no cell clips, the icon takes no space, so the text ends on the same edge as the values around it; otherwise the icon keeps its own space. Touch screens always show the icon in its own space. Never wider than its container: a long value (a user agent, an id) ends in an ellipsis, and its tooltip shows the whole of it until it is copied.
 
 | Prop | Type | Default | Description |
 |---|---|---|---|
@@ -2100,7 +2100,7 @@ Moves through long lists by pages, by cursor, or with a Load more button.
 
 - **divider** (compare_grid): `hairline` (default) — Columns separated by a hairline, edge to edge (default); `none` — No line between columns: columns that sit in panels of their own
 - **size** (composer): `md` (default) — Text 14/20, 8px around the buttons; the outline concentric with them (16 + 8) (default); `sm` — The same box starting one line tall: a follow-up field under a thread
-- **appearance** (model_picker): `ghost` (default) — Transparent until hovered: a column header (default); `default` — A raised pill with a ring: a form or toolbar
+- **appearance** (model_picker): `ghost` (default) — Transparent until hovered: a column header (default); `default` — A pill with a text input's ring: a form or toolbar
 - **layout** (parameter_panel): `popover` (default) — Inside a 320px popover (ParameterPopover) (default); `panel` — A side panel or sheet: a little more room between groups
 - **align** (prompt_suggestions): `start` (default) — Rows the composer's width, their text on its text (default); `center` — Centered under an empty thread's title
 - **state** (reasoning): `done` (default) — Finished: “Thought for 4.2 s”, closed until opened (default); `live` — Still reasoning: “Thinking” pulses quietly and the latest line shows beside it
@@ -2554,7 +2554,7 @@ Two to five mutually exclusive options: 24h/7d/30d, List/Board, providers.
 
 `import { Select } from "@logicplanes/kaeso-ui/select";`
 
-- **appearance** (select): `default` (default) — A raised pill with a ring (default); `ghost` — Inline in settings rows: “GPT-5 mini (default) ⌄”; `header` — Transparent until hovered, in full text colour: a column header's model
+- **appearance** (select): `default` (default) — A pill with the same ring, hover and focus as a text input (default); `ghost` — Inline in settings rows: “GPT-5 mini (default) ⌄”; `header` — Transparent until hovered, in full text colour: a column header's model
 - **size** (select): `sm` — 32px: settings rows and toolbars; `md` (default) — 36px (default); `lg` — 40px; `xl` — 48px: sign-in and setup forms
 
 ### Select
@@ -2624,7 +2624,7 @@ A group of settings rows: radius 14, raised, ring and a whisper of shadow; hairl
 
 ### SettingsRow
 
-One setting: title 15/500 and description 13 on the left, the control on the right. When the row is too narrow to keep 140px of text beside the control (a phone, a sheet), the control moves under the text.
+One setting: title 15/500 and description 13 on the left, the control on the right. The row is its own size container: narrower than 480px inside its padding (the `settings-row` container size, a phone), every row's control moves under its text, so the rows of a group line up the same way whatever their control's width. A ghost or quiet button that ends the control keeps its label on the row's edge, where an outlined button's ring ends; under the text it starts on the text's edge.
 
 | Prop | Type | Default | Description |
 |---|---|---|---|
@@ -2657,7 +2657,7 @@ A settings section: a title-sm heading 48px above, 12px below; usually one Setti
 `import { Sheet } from "@logicplanes/kaeso-ui/sheet";`
 
 - **size** (sheet): `sm` (default) — 480px (default); `md` — 640px: the request inspector; `lg` — 800px
-- **side** (sheet): `right` (default) — From the right (default); `left` — From the left: the mobile sidebar; `bottom` — From the bottom: mobile menus
+- **side** (sheet): `right` (default) — From the right (default); fills a phone's screen; `left` — From the left: the mobile sidebar; fills a phone's screen; `bottom` — From the bottom: mobile menus
 
 ### Sheet
 

package/ai/icons.md

@@ -1,6 +1,6 @@
 # Icon vocabulary
 
-Version 0.4.0. 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.4.1. 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.4.0. 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.4.1. 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
 
@@ -17,6 +17,7 @@ Version 0.4.0. Generated from `@logicplanes/kaeso-tokens`; do not edit. Componen
 | `--k-line-strong` | #d4d4d4 | #333333 |
 | `--k-line-field` | #858585 | #757575 |
 | `--k-line-field-hover` | #707070 | #858585 |
+| `--k-switch-thumb` | #ffffff | #c7c7c7 |
 | `--k-text` | #0a0a0a | #fafafa |
 | `--k-text-secondary` | #666666 | #a3a3a3 |
 | `--k-text-tertiary` | #707070 | #858585 |

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-BLcP7v24.js";
+import { t } from "../chunks/dialog-BZCVFmGF.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,9 +1,9 @@
 "use client";
-import { t as e } from "../chunks/cn-DUDmdLpZ.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 { t as e } from "../chunks/cn-Isw2DnQX.js";
+import { t } from "../chunks/app-frame-DZPEf2NQ.js";
+import { r as n } from "../chunks/page-header-CZCQVHYE.js";
+import { t as r } from "../chunks/empty-By1qTJr6.js";
+import { a as i, t as a } from "../chunks/section-Bvg0EUnr.js";
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/blocks/pages/pages.tsx
 var l = { page: {

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-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-7VARol_x.js";
+import { i as t } from "../chunks/input-B6Docqrk.js";
+import { r as n } from "../chunks/toolbar-B_960Ttx.js";
+import { t as r } from "../chunks/empty-By1qTJr6.js";
+import { i, o as a } from "../chunks/list-CMXBTVkI.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-Cj_gCbmu.js → app-frame-DZPEf2NQ.js}

@@ -1,11 +1,11 @@
 "use client";
-import { t as e } from "./cn-DUDmdLpZ.js";
+import { t as e } from "./cn-Isw2DnQX.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-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 { l as i, s as a } from "./tooltip-CRApbLF6.js";
+import { a as o } from "./button-9q66Ta23.js";
+import { t as s } from "./icon-button-C7Du4pvb.js";
+import { l as c, t as l } from "./sidebar-DifJ5KgE.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-D7wIF_OU.js").then((e) => e.n), { base: () => import.meta.url });
+var j = 750, M = /* @__PURE__ */ a(() => import("./nav-sheet-Y2Ite-iF.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)), []);
@@ -189,12 +189,12 @@ var z = /* @__PURE__ */ f(function({ title: r, description: i, actions: a, class
 			children: [/* @__PURE__ */ S("header", {
 				className: "flex flex-col gap-8",
 				children: [/* @__PURE__ */ S("div", {
-					className: "flex items-start justify-between gap-16",
+					className: "flex flex-wrap items-start justify-between gap-x-16 gap-y-8",
 					children: [/* @__PURE__ */ x("h1", {
 						className: "min-w-0 text-title-lg font-semibold text-fg text-balance",
 						children: r
 					}), a && /* @__PURE__ */ x("div", {
-						className: "flex h-34 shrink-0 items-center gap-8",
+						className: "ml-auto flex h-34 shrink-0 items-center gap-8",
 						children: a
 					})]
 				}), i && /* @__PURE__ */ x("p", {
@@ -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-Cj_gCbmu.js.map
+//# sourceMappingURL=app-frame-DZPEf2NQ.js.map

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

@@ -1 +1 @@
-{"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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"}
+{"version":3,"file":"app-frame-DZPEf2NQ.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 flex-wrap items-start justify-between gap-x-16 gap-y-8\">\n            <h1 className=\"min-w-0 text-title-lg font-semibold text-fg text-balance\">{title}</h1>\n            {actions && <div className=\"ml-auto 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/{avatar-DOzOhYJr.js → avatar-HnvBUoe5.js}

@@ -1,5 +1,5 @@
 "use client";
-import { t as e } from "./cn-DUDmdLpZ.js";
+import { t as e } from "./cn-Isw2DnQX.js";
 import { i as t } from "./context-BELWW79w.js";
 import { forwardRef as n, useState as r } from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
@@ -80,4 +80,4 @@ process.env.NODE_ENV !== "production" && (d.displayName = "AvatarGroup");
 //#endregion
 export { c as a, o as i, d as n, s as r, l as t };
 
-//# sourceMappingURL=avatar-DOzOhYJr.js.map
+//# sourceMappingURL=avatar-HnvBUoe5.js.map

package/dist/chunks/{avatar-DOzOhYJr.js.map → avatar-HnvBUoe5.js.map}

@@ -1 +1 @@
-{"version":3,"file":"avatar-DOzOhYJr.js","names":["cn","useUiText","KAESO_AVATAR_VARIANTS","KAESO_AVATAR_DEFAULT_VARIANTS","initials","parts","name","first","max","Avatar","failedSrc","setFailedSrc","useState","decorative","size","kind","className","src","GROUP_OVERLAP","AvatarGroup","t","shown","people","rest","overlap","p","i","children"],"sources":["../../src/components/avatar/avatar.tsx"],"sourcesContent":["import { forwardRef, useState, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_AVATAR_VARIANTS = {\n  size: {\n    20: { classes: \"size-20 text-micro\" },\n    24: { classes: \"size-24 text-micro\" },\n    28: { classes: \"size-28 text-caption\" },\n    32: { classes: \"size-32 text-caption\" },\n    40: { classes: \"size-40 text-body\" },\n  },\n  kind: {\n    person: { classes: \"rounded-pill\" },\n    org: { classes: \"rounded-org\" },\n  },\n} as const;\nexport const KAESO_AVATAR_DEFAULT_VARIANTS = { size: 24, kind: \"person\" } as const;\n\nexport function initials(name: string, max: 1 | 2 = 2): string {\n  const parts = name.trim().split(/\\s+/).filter(Boolean);\n  if (parts.length === 0) return \"?\";\n  const first = parts[0]?.[0] ?? \"\";\n  return (max === 1 || parts.length < 2 ? first : first + (parts[parts.length - 1]?.[0] ?? \"\")).toUpperCase();\n}\n\nexport interface AvatarProps {\n  name: string;\n  src?: string | undefined;\n  size?: keyof typeof KAESO_AVATAR_VARIANTS.size | undefined;\n  kind?: keyof typeof KAESO_AVATAR_VARIANTS.kind | undefined;\n  decorative?: boolean | undefined;\n  className?: string | undefined;\n}\n\nexport const Avatar = /* @__PURE__ */ forwardRef<HTMLSpanElement, AvatarProps>(function Avatar({ name, src, size = 24, kind = \"person\", decorative, className }, ref) {\n  const [failedSrc, setFailedSrc] = useState<string | undefined>(undefined);\n  return (\n    <span\n      ref={ref}\n      {...(decorative ? { \"aria-hidden\": true } : { role: \"img\", \"aria-label\": name })}\n      className={cn(\n        \"relative inline-flex shrink-0 items-center justify-center overflow-hidden bg-fill-2 font-semibold text-fg select-none\",\n        KAESO_AVATAR_VARIANTS.size[size].classes,\n        KAESO_AVATAR_VARIANTS.kind[kind].classes,\n        size <= 24 && kind === \"org\" && \"rounded-avatar\",\n        className,\n      )}\n    >\n      {src && src !== failedSrc ? (\n        <img src={src} alt=\"\" className=\"size-full object-cover\" onError={() => setFailedSrc(src)} />\n      ) : (\n        initials(name, size === 20 ? 1 : 2)\n      )}\n    </span>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Avatar.displayName = \"Avatar\";\n\nexport interface AvatarGroupProps {\n  people: { name: string; src?: string | undefined }[];\n  size?: keyof typeof KAESO_AVATAR_VARIANTS.size | undefined;\n  max?: number | undefined;\n  className?: string | undefined;\n  children?: ReactNode | undefined;\n}\n\nconst GROUP_OVERLAP = { 20: \"-ms-4\", 24: \"-ms-2\", 28: \"-ms-2\", 32: \"-ms-4\", 40: \"-ms-6\" } as const;\n\nexport const AvatarGroup = /* @__PURE__ */ forwardRef<HTMLDivElement, AvatarGroupProps>(function AvatarGroup({ people, size = 24, max = 4, className, children }, ref) {\n  const t = useUiText();\n  const shown = people.slice(0, max);\n  const rest = people.length - shown.length;\n  const overlap = GROUP_OVERLAP[size];\n  return (\n    <div\n      ref={ref}\n      role=\"group\"\n      aria-label={people.map((p) => p.name).join(t(\"avatarGroup.listSeparator\", \", \"))}\n      className={cn(\"flex items-center\", className)}\n    >\n      {shown.map((p, i) => (\n        <Avatar\n          key={p.name + i}\n          name={p.name}\n          {...(p.src ? { src: p.src } : {})}\n          size={size}\n          decorative\n          className={cn(\"ring-2 ring-panel\", i > 0 && overlap)}\n        />\n      ))}\n      {rest > 0 && (\n        <span\n          className={cn(\n            \"inline-flex shrink-0 items-center justify-center rounded-pill bg-fill-1 font-medium text-fg-secondary ring-2 ring-panel tabular\",\n            KAESO_AVATAR_VARIANTS.size[size].classes,\n            overlap,\n          )}\n        >\n          +{rest}\n        </span>\n      )}\n      {children && <span className=\"ms-8 inline-flex items-center\">{children}</span>}\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") AvatarGroup.displayName = \"AvatarGroup\";\n"],"mappings":";;;;;;AAIA,IAAaE,IAAwB;CACnC,MAAM;EACJ,IAAI,EAAE,SAAS,qBAAqB;EACpC,IAAI,EAAE,SAAS,qBAAqB;EACpC,IAAI,EAAE,SAAS,uBAAuB;EACtC,IAAI,EAAE,SAAS,uBAAuB;EACtC,IAAI,EAAE,SAAS,oBAAoB;CACrC;CACA,MAAM;EACJ,QAAQ,EAAE,SAAS,eAAe;EAClC,KAAK,EAAE,SAAS,cAAc;CAChC;AACF,GACaC,IAAgC;CAAE,MAAM;CAAI,MAAM;AAAS;AAExE,SAAgBC,EAAS,GAAc,IAAa,GAAW;CAC7D,IAAMC,IAAQC,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO;CACrD,IAAID,EAAM,WAAW,GAAG,OAAO;CAC/B,IAAME,IAAQF,EAAM,EAAE,GAAG,MAAM;CAC/B,QAAQG,MAAQ,KAAKH,EAAM,SAAS,IAAIE,IAAQA,KAASF,EAAMA,EAAM,SAAS,EAAE,GAAG,MAAM,IAAA,CAAK,YAAY;AAC5G;AAWA,IAAaI,IAAyB,kBAAyC,SAAgB,EAAE,SAAM,QAAK,UAAO,IAAI,UAAO,UAAU,eAAY,gBAAa,GAAK;CACpK,IAAM,CAACC,GAAWC,KAAgBC,EAA6B,KAAA,CAAS;CACxE,OACE,kBAAC,QAAD;EACO;EACL,GAAKC,IAAa,EAAE,eAAe,GAAK,IAAI;GAAE,MAAM;GAAO,cAAcP;EAAK;EAC9E,WAAWN,EACT,yHACAE,EAAsB,KAAKY,EAAK,CAAC,SACjCZ,EAAsB,KAAKa,EAAK,CAAC,SACjCD,KAAQ,MAAMC,MAAS,SAAS,kBAChCC,CACF;EAEC,UAAAC,KAAOA,MAAQP,IACd,kBAAC,OAAD;GAAU;GAAK,KAAI;GAAG,WAAU;GAAyB,eAAeC,EAAaM,CAAG;EAAI,CAAA,IAE5Fb,EAASE,GAAMQ,MAAS,KAAK,IAAI,CAAC;CAEhC,CAAA;AAEV,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAO,cAAc;AAUhE,IAAMI,IAAgB;CAAE,IAAI;CAAS,IAAI;CAAS,IAAI;CAAS,IAAI;CAAS,IAAI;AAAQ,GAE3EC,IAA8B,kBAA6C,SAAqB,EAAE,WAAQ,UAAO,IAAI,SAAM,GAAG,cAAW,eAAY,GAAK;CACrK,IAAMC,IAAInB,EAAU,GACdoB,IAAQC,EAAO,MAAM,GAAGd,CAAG,GAC3Be,IAAOD,EAAO,SAASD,EAAM,QAC7BG,IAAUN,EAAcJ;CAC9B,OACE,kBAAC,OAAD;EACO;EACL,MAAK;EACL,cAAYQ,EAAO,KAAK,MAAMG,EAAE,IAAI,CAAC,CAAC,KAAKL,EAAE,6BAA6B,IAAI,CAAC;EAC/E,WAAWpB,EAAG,qBAAqBgB,CAAS;EAJ9C,UAAA;GAMGK,EAAM,KAAK,GAAG,MACb,kBAACZ,GAAD;IAEE,MAAMgB,EAAE;IACR,GAAKA,EAAE,MAAM,EAAE,KAAKA,EAAE,IAAI,IAAI,CAAC;IACzB;IACN,YAAA;IACA,WAAWzB,EAAG,qBAAqB0B,IAAI,KAAKF,CAAO;GACpD,GANMC,EAAE,OAAOC,CAMf,CACF;GACAH,IAAO,KACN,kBAAC,QAAD;IACE,WAAWvB,EACT,mIACAE,EAAsB,KAAKY,EAAK,CAAC,SACjCU,CACF;IALF,UAAA,CAMC,KACGD,CACE;;GAEPI,KAAY,kBAAC,QAAD;IAAM,WAAU;IAAiC;GAAe,CAAA;EAC1E;;AAET,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAY,cAAc"}
+{"version":3,"file":"avatar-HnvBUoe5.js","names":["cn","useUiText","KAESO_AVATAR_VARIANTS","KAESO_AVATAR_DEFAULT_VARIANTS","initials","parts","name","first","max","Avatar","failedSrc","setFailedSrc","useState","decorative","size","kind","className","src","GROUP_OVERLAP","AvatarGroup","t","shown","people","rest","overlap","p","i","children"],"sources":["../../src/components/avatar/avatar.tsx"],"sourcesContent":["import { forwardRef, useState, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_AVATAR_VARIANTS = {\n  size: {\n    20: { classes: \"size-20 text-micro\" },\n    24: { classes: \"size-24 text-micro\" },\n    28: { classes: \"size-28 text-caption\" },\n    32: { classes: \"size-32 text-caption\" },\n    40: { classes: \"size-40 text-body\" },\n  },\n  kind: {\n    person: { classes: \"rounded-pill\" },\n    org: { classes: \"rounded-org\" },\n  },\n} as const;\nexport const KAESO_AVATAR_DEFAULT_VARIANTS = { size: 24, kind: \"person\" } as const;\n\nexport function initials(name: string, max: 1 | 2 = 2): string {\n  const parts = name.trim().split(/\\s+/).filter(Boolean);\n  if (parts.length === 0) return \"?\";\n  const first = parts[0]?.[0] ?? \"\";\n  return (max === 1 || parts.length < 2 ? first : first + (parts[parts.length - 1]?.[0] ?? \"\")).toUpperCase();\n}\n\nexport interface AvatarProps {\n  name: string;\n  src?: string | undefined;\n  size?: keyof typeof KAESO_AVATAR_VARIANTS.size | undefined;\n  kind?: keyof typeof KAESO_AVATAR_VARIANTS.kind | undefined;\n  decorative?: boolean | undefined;\n  className?: string | undefined;\n}\n\nexport const Avatar = /* @__PURE__ */ forwardRef<HTMLSpanElement, AvatarProps>(function Avatar({ name, src, size = 24, kind = \"person\", decorative, className }, ref) {\n  const [failedSrc, setFailedSrc] = useState<string | undefined>(undefined);\n  return (\n    <span\n      ref={ref}\n      {...(decorative ? { \"aria-hidden\": true } : { role: \"img\", \"aria-label\": name })}\n      className={cn(\n        \"relative inline-flex shrink-0 items-center justify-center overflow-hidden bg-fill-2 font-semibold text-fg select-none\",\n        KAESO_AVATAR_VARIANTS.size[size].classes,\n        KAESO_AVATAR_VARIANTS.kind[kind].classes,\n        size <= 24 && kind === \"org\" && \"rounded-avatar\",\n        className,\n      )}\n    >\n      {src && src !== failedSrc ? (\n        <img src={src} alt=\"\" className=\"size-full object-cover\" onError={() => setFailedSrc(src)} />\n      ) : (\n        initials(name, size === 20 ? 1 : 2)\n      )}\n    </span>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Avatar.displayName = \"Avatar\";\n\nexport interface AvatarGroupProps {\n  people: { name: string; src?: string | undefined }[];\n  size?: keyof typeof KAESO_AVATAR_VARIANTS.size | undefined;\n  max?: number | undefined;\n  className?: string | undefined;\n  children?: ReactNode | undefined;\n}\n\nconst GROUP_OVERLAP = { 20: \"-ms-4\", 24: \"-ms-2\", 28: \"-ms-2\", 32: \"-ms-4\", 40: \"-ms-6\" } as const;\n\nexport const AvatarGroup = /* @__PURE__ */ forwardRef<HTMLDivElement, AvatarGroupProps>(function AvatarGroup({ people, size = 24, max = 4, className, children }, ref) {\n  const t = useUiText();\n  const shown = people.slice(0, max);\n  const rest = people.length - shown.length;\n  const overlap = GROUP_OVERLAP[size];\n  return (\n    <div\n      ref={ref}\n      role=\"group\"\n      aria-label={people.map((p) => p.name).join(t(\"avatarGroup.listSeparator\", \", \"))}\n      className={cn(\"flex items-center\", className)}\n    >\n      {shown.map((p, i) => (\n        <Avatar\n          key={p.name + i}\n          name={p.name}\n          {...(p.src ? { src: p.src } : {})}\n          size={size}\n          decorative\n          className={cn(\"ring-2 ring-panel\", i > 0 && overlap)}\n        />\n      ))}\n      {rest > 0 && (\n        <span\n          className={cn(\n            \"inline-flex shrink-0 items-center justify-center rounded-pill bg-fill-1 font-medium text-fg-secondary ring-2 ring-panel tabular\",\n            KAESO_AVATAR_VARIANTS.size[size].classes,\n            overlap,\n          )}\n        >\n          +{rest}\n        </span>\n      )}\n      {children && <span className=\"ms-8 inline-flex items-center\">{children}</span>}\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") AvatarGroup.displayName = \"AvatarGroup\";\n"],"mappings":";;;;;;AAIA,IAAaE,IAAwB;CACnC,MAAM;EACJ,IAAI,EAAE,SAAS,qBAAqB;EACpC,IAAI,EAAE,SAAS,qBAAqB;EACpC,IAAI,EAAE,SAAS,uBAAuB;EACtC,IAAI,EAAE,SAAS,uBAAuB;EACtC,IAAI,EAAE,SAAS,oBAAoB;CACrC;CACA,MAAM;EACJ,QAAQ,EAAE,SAAS,eAAe;EAClC,KAAK,EAAE,SAAS,cAAc;CAChC;AACF,GACaC,IAAgC;CAAE,MAAM;CAAI,MAAM;AAAS;AAExE,SAAgBC,EAAS,GAAc,IAAa,GAAW;CAC7D,IAAMC,IAAQC,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO;CACrD,IAAID,EAAM,WAAW,GAAG,OAAO;CAC/B,IAAME,IAAQF,EAAM,EAAE,GAAG,MAAM;CAC/B,QAAQG,MAAQ,KAAKH,EAAM,SAAS,IAAIE,IAAQA,KAASF,EAAMA,EAAM,SAAS,EAAE,GAAG,MAAM,IAAA,CAAK,YAAY;AAC5G;AAWA,IAAaI,IAAyB,kBAAyC,SAAgB,EAAE,SAAM,QAAK,UAAO,IAAI,UAAO,UAAU,eAAY,gBAAa,GAAK;CACpK,IAAM,CAACC,GAAWC,KAAgBC,EAA6B,KAAA,CAAS;CACxE,OACE,kBAAC,QAAD;EACO;EACL,GAAKC,IAAa,EAAE,eAAe,GAAK,IAAI;GAAE,MAAM;GAAO,cAAcP;EAAK;EAC9E,WAAWN,EACT,yHACAE,EAAsB,KAAKY,EAAK,CAAC,SACjCZ,EAAsB,KAAKa,EAAK,CAAC,SACjCD,KAAQ,MAAMC,MAAS,SAAS,kBAChCC,CACF;EAEC,UAAAC,KAAOA,MAAQP,IACd,kBAAC,OAAD;GAAU;GAAK,KAAI;GAAG,WAAU;GAAyB,eAAeC,EAAaM,CAAG;EAAI,CAAA,IAE5Fb,EAASE,GAAMQ,MAAS,KAAK,IAAI,CAAC;CAEhC,CAAA;AAEV,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAO,cAAc;AAUhE,IAAMI,IAAgB;CAAE,IAAI;CAAS,IAAI;CAAS,IAAI;CAAS,IAAI;CAAS,IAAI;AAAQ,GAE3EC,IAA8B,kBAA6C,SAAqB,EAAE,WAAQ,UAAO,IAAI,SAAM,GAAG,cAAW,eAAY,GAAK;CACrK,IAAMC,IAAInB,EAAU,GACdoB,IAAQC,EAAO,MAAM,GAAGd,CAAG,GAC3Be,IAAOD,EAAO,SAASD,EAAM,QAC7BG,IAAUN,EAAcJ;CAC9B,OACE,kBAAC,OAAD;EACO;EACL,MAAK;EACL,cAAYQ,EAAO,KAAK,MAAMG,EAAE,IAAI,CAAC,CAAC,KAAKL,EAAE,6BAA6B,IAAI,CAAC;EAC/E,WAAWpB,EAAG,qBAAqBgB,CAAS;EAJ9C,UAAA;GAMGK,EAAM,KAAK,GAAG,MACb,kBAACZ,GAAD;IAEE,MAAMgB,EAAE;IACR,GAAKA,EAAE,MAAM,EAAE,KAAKA,EAAE,IAAI,IAAI,CAAC;IACzB;IACN,YAAA;IACA,WAAWzB,EAAG,qBAAqB0B,IAAI,KAAKF,CAAO;GACpD,GANMC,EAAE,OAAOC,CAMf,CACF;GACAH,IAAO,KACN,kBAAC,QAAD;IACE,WAAWvB,EACT,mIACAE,EAAsB,KAAKY,EAAK,CAAC,SACjCU,CACF;IALF,UAAA,CAMC,KACGD,CACE;;GAEPI,KAAY,kBAAC,QAAD;IAAM,WAAU;IAAiC;GAAe,CAAA;EAC1E;;AAET,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAY,cAAc"}

package/dist/chunks/{badge-wUHlj7m3.js → badge-CM8ahjDR.js}

@@ -1,5 +1,5 @@
 "use client";
-import { t as e } from "./cn-DUDmdLpZ.js";
+import { t as e } from "./cn-Isw2DnQX.js";
 import { forwardRef as t } from "react";
 import { jsx as n } from "react/jsx-runtime";
 //#region src/components/badge/badge.tsx
@@ -23,4 +23,4 @@ process.env.NODE_ENV !== "production" && (a.displayName = "Badge");
 //#endregion
 export { i as n, r, a as t };
 
-//# sourceMappingURL=badge-wUHlj7m3.js.map
+//# sourceMappingURL=badge-CM8ahjDR.js.map

package/dist/chunks/{badge-wUHlj7m3.js.map → badge-CM8ahjDR.js.map}

@@ -1 +1 @@
-{"version":3,"file":"badge-wUHlj7m3.js","names":["cn","KAESO_BADGE_VARIANTS","KAESO_BADGE_DEFAULT_VARIANTS","Badge","props","tone","className"],"sources":["../../src/components/badge/badge.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\n\nexport const KAESO_BADGE_VARIANTS = {\n  tone: {\n    neutral: { classes: \"bg-fill-2 text-fg-secondary\" },\n    success: { classes: \"bg-success-tint text-success-text\" },\n    warning: { classes: \"bg-warning-tint text-warning-text\" },\n    danger: { classes: \"bg-danger-tint text-danger-text\" },\n    info: { classes: \"bg-info-tint text-info-text\" },\n    outline: { classes: \"bg-transparent text-fg-secondary shadow-ring\" },\n    ink: { classes: \"bg-ink text-on-ink\" },\n  },\n} as const;\nexport const KAESO_BADGE_DEFAULT_VARIANTS = { tone: \"neutral\" } as const;\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n  tone?: keyof typeof KAESO_BADGE_VARIANTS.tone | undefined;\n  children: ReactNode;\n}\n\nexport const Badge = /* @__PURE__ */ forwardRef<HTMLSpanElement, BadgeProps>(function Badge({ tone = \"neutral\", className, children, ...props }, ref) {\n  return (\n    <span\n      ref={ref}\n      className={cn(\n        \"inline-flex h-22 shrink-0 items-center rounded-pill px-8 text-caption font-medium whitespace-nowrap tabular\",\n        KAESO_BADGE_VARIANTS.tone[tone].classes,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </span>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Badge.displayName = \"Badge\";\n"],"mappings":";;;;;AAGA,IAAaC,IAAuB,EAClC,MAAM;CACJ,SAAS,EAAE,SAAS,8BAA8B;CAClD,SAAS,EAAE,SAAS,oCAAoC;CACxD,SAAS,EAAE,SAAS,oCAAoC;CACxD,QAAQ,EAAE,SAAS,kCAAkC;CACrD,MAAM,EAAE,SAAS,8BAA8B;CAC/C,SAAS,EAAE,SAAS,+CAA+C;CACnE,KAAK,EAAE,SAAS,qBAAqB;AACvC,EACF,GACaC,IAA+B,EAAE,MAAM,UAAU,GAOjDC,IAAwB,kBAAwC,SAAe,EAAE,UAAO,WAAW,cAAW,aAAU,GAAGC,KAAS,GAAK;CACpJ,OACE,kBAAC,QAAD;EACO;EACL,WAAWJ,EACT,+GACAC,EAAqB,KAAKI,EAAK,CAAC,SAChCC,CACF;EACA,GAAIF;EAEH;CACG,CAAA;AAEV,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAM,cAAc"}
+{"version":3,"file":"badge-CM8ahjDR.js","names":["cn","KAESO_BADGE_VARIANTS","KAESO_BADGE_DEFAULT_VARIANTS","Badge","props","tone","className"],"sources":["../../src/components/badge/badge.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\n\nexport const KAESO_BADGE_VARIANTS = {\n  tone: {\n    neutral: { classes: \"bg-fill-2 text-fg-secondary\" },\n    success: { classes: \"bg-success-tint text-success-text\" },\n    warning: { classes: \"bg-warning-tint text-warning-text\" },\n    danger: { classes: \"bg-danger-tint text-danger-text\" },\n    info: { classes: \"bg-info-tint text-info-text\" },\n    outline: { classes: \"bg-transparent text-fg-secondary shadow-ring\" },\n    ink: { classes: \"bg-ink text-on-ink\" },\n  },\n} as const;\nexport const KAESO_BADGE_DEFAULT_VARIANTS = { tone: \"neutral\" } as const;\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n  tone?: keyof typeof KAESO_BADGE_VARIANTS.tone | undefined;\n  children: ReactNode;\n}\n\nexport const Badge = /* @__PURE__ */ forwardRef<HTMLSpanElement, BadgeProps>(function Badge({ tone = \"neutral\", className, children, ...props }, ref) {\n  return (\n    <span\n      ref={ref}\n      className={cn(\n        \"inline-flex h-22 shrink-0 items-center rounded-pill px-8 text-caption font-medium whitespace-nowrap tabular\",\n        KAESO_BADGE_VARIANTS.tone[tone].classes,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </span>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Badge.displayName = \"Badge\";\n"],"mappings":";;;;;AAGA,IAAaC,IAAuB,EAClC,MAAM;CACJ,SAAS,EAAE,SAAS,8BAA8B;CAClD,SAAS,EAAE,SAAS,oCAAoC;CACxD,SAAS,EAAE,SAAS,oCAAoC;CACxD,QAAQ,EAAE,SAAS,kCAAkC;CACrD,MAAM,EAAE,SAAS,8BAA8B;CAC/C,SAAS,EAAE,SAAS,+CAA+C;CACnE,KAAK,EAAE,SAAS,qBAAqB;AACvC,EACF,GACaC,IAA+B,EAAE,MAAM,UAAU,GAOjDC,IAAwB,kBAAwC,SAAe,EAAE,UAAO,WAAW,cAAW,aAAU,GAAGC,KAAS,GAAK;CACpJ,OACE,kBAAC,QAAD;EACO;EACL,WAAWJ,EACT,+GACAC,EAAqB,KAAKI,EAAK,CAAC,SAChCC,CACF;EACA,GAAIF;EAEH;CACG,CAAA;AAEV,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAM,cAAc"}

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

@@ -1,8 +1,8 @@
 "use client";
-import { t as e } from "./cn-DUDmdLpZ.js";
+import { t as e } from "./cn-Isw2DnQX.js";
 import { i as t } from "./context-BELWW79w.js";
-import { t as n } from "./icon-BqujXDUc.js";
-import { t as r } from "./icon-button-DmKFxQbP.js";
+import { t as n } from "./icon-D5uD_mnL.js";
+import { t as r } from "./icon-button-C7Du4pvb.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-DY1jSc9Y.js.map
+//# sourceMappingURL=banner-CvYgPwCc.js.map

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

@@ -1 +1 @@
-{"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"}
+{"version":3,"file":"banner-CvYgPwCc.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-h2IFCER2.js → button-9q66Ta23.js}

@@ -1,12 +1,12 @@
 "use client";
-import { t as e } from "./cn-DUDmdLpZ.js";
+import { t as e } from "./cn-Isw2DnQX.js";
 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-CTBnfiDH.js";
-import { i as c, r as l } from "./loader-ENBh2Fbt.js";
-import { r as u } from "./swap-text-Cica0pUr.js";
+import { t as a } from "./icon-D5uD_mnL.js";
+import { i as o } from "./kbd-9A9rX60U.js";
+import { r as s } from "./tooltip-CRApbLF6.js";
+import { i as c, r as l } from "./loader-DqOUwS1j.js";
+import { r as u } from "./swap-text-CC77iKJF.js";
 import { forwardRef as d } from "react";
 import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
 //#region src/components/button/button.tsx
@@ -22,15 +22,15 @@ var h = {
 		link: { classes: "bg-transparent text-fg underline decoration-line-strong decoration-1 underline-offset-3 hover:decoration-current disabled:text-fg-disabled" }
 	},
 	size: {
-		xs: { classes: "h-24 px-10 gap-4 text-caption font-medium" },
-		sm: { classes: "h-32 px-12 gap-6 text-body font-medium" },
-		md: { classes: "h-36 px-16 gap-6 text-body font-medium" },
-		lg: { classes: "h-40 px-18 gap-8 text-body font-medium" },
-		xl: { classes: "h-48 px-22 gap-8 text-body-lg font-medium" }
+		xs: { classes: "h-24 px-10 gap-4 text-caption font-medium ghost-end:-mr-10 ghost-start:-ml-10" },
+		sm: { classes: "h-32 px-12 gap-6 text-body font-medium ghost-end:-mr-12 ghost-start:-ml-12" },
+		md: { classes: "h-36 px-16 gap-6 text-body font-medium ghost-end:-mr-16 ghost-start:-ml-16" },
+		lg: { classes: "h-40 px-18 gap-8 text-body font-medium ghost-end:-mr-18 ghost-start:-ml-18" },
+		xl: { classes: "h-48 px-22 gap-8 text-body-lg font-medium ghost-end:-mr-22 ghost-start:-ml-22" }
 	},
 	shape: {
 		pill: { classes: "rounded-pill" },
-		circle: { classes: "rounded-pill p-0 justify-center" }
+		circle: { classes: "rounded-pill p-0 justify-center ghost-end:mr-0 ghost-start:ml-0" }
 	}
 }, g = {
 	variant: "secondary",
@@ -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-h2IFCER2.js.map
+//# sourceMappingURL=button-9q66Ta23.js.map

package/dist/chunks/button-9q66Ta23.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-9q66Ta23.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 ghost-end:-mr-10 ghost-start:-ml-10\" },\n    sm: { classes: \"h-32 px-12 gap-6 text-body font-medium ghost-end:-mr-12 ghost-start:-ml-12\" },\n    md: { classes: \"h-36 px-16 gap-6 text-body font-medium ghost-end:-mr-16 ghost-start:-ml-16\" },\n    lg: { classes: \"h-40 px-18 gap-8 text-body font-medium ghost-end:-mr-18 ghost-start:-ml-18\" },\n    xl: {\n      classes: \"h-48 px-22 gap-8 text-body-lg font-medium ghost-end:-mr-22 ghost-start:-ml-22\",\n    },\n  },\n  shape: {\n    pill: { classes: \"rounded-pill\" },\n    circle: { classes: \"rounded-pill p-0 justify-center ghost-end:mr-0 ghost-start:ml-0\" },\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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"}