@logicplanes/kaeso-ui 0.1.0 → 0.2.1

package/dist/chunks/{code-block-BbK6E4Eo.js → code-block-DxtladFW.js}

@@ -1,7 +1,7 @@
 "use client";
 import { t as e } from "./cn-CidVUKMm.js";
 import { i as t } from "./context-BELWW79w.js";
-import { n } from "./copy-button-mAzHjYXq.js";
+import { n } from "./copy-button-DXxn-YYZ.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";
@@ -178,34 +178,38 @@ async function y(e, t) {
 var b = { surface: {
 	well: { classes: "rounded-well bg-fill-1" },
 	plain: { classes: "bg-transparent" }
-} }, x = { surface: "well" }, S = /* @__PURE__ */ r(function({ code: r = "", lang: u = "ts", tabs: d, title: f, lineNumbers: p, highlightLines: m = [], collapseAfter: h = 24, surface: g = "well", copy: _ = !0, wrap: v = !1, className: x }, S) {
-	let [C, w] = o(0), T = t(), E = d?.[C] ?? {
+} }, x = { surface: "well" }, S = /* @__PURE__ */ r(function({ code: r = "", lang: u = "ts", tabs: d, tab: f, onTabChange: p, title: m, lineNumbers: h, highlightLines: g = [], collapseAfter: _ = 24, surface: v = "well", copy: x = !0, wrap: S = !1, className: C }, w) {
+	let [T, E] = o(0), D = f === void 0 ? -1 : d?.findIndex((e) => e.label === f) ?? -1, O = D >= 0 ? D : T, k = (e) => {
+		E(e);
+		let t = d?.[e]?.label;
+		t !== void 0 && p?.(t);
+	}, A = t(), j = d?.[O] ?? {
 		label: "",
 		code: r,
 		lang: u
-	}, D = E.code.replace(/\n$/, ""), O = a(() => D.split("\n"), [D]), [k, A] = o(null), [j, M] = o(!1);
+	}, M = j.code.replace(/\n$/, ""), N = a(() => M.split("\n"), [M]), [P, F] = o(null), [I, L] = o(!1);
 	i(() => {
-		let e = !0, t = E.lang ?? "ts";
-		return y(D, t).then((n) => e && A({
-			text: D,
+		let e = !0, t = j.lang ?? "ts";
+		return y(M, t).then((n) => e && F({
+			text: M,
 			lang: t,
 			tokens: n
 		})).catch(() => void 0), () => {
 			e = !1;
 		};
-	}, [D, E.lang]);
-	let N = k && k.lang === (E.lang ?? "ts") && k.text === D ? k.tokens : null, P = h > 0 && O.length > h && !j, F = P ? h : O.length, I = e("relative overflow-x-auto py-16 scrollbar-quiet focus-ring-inset", P && "overflow-y-hidden"), L = /* @__PURE__ */ s("pre", {
+	}, [M, j.lang]);
+	let R = P && P.lang === (j.lang ?? "ts") && P.text === M ? P.tokens : null, z = _ > 0 && N.length > _ && !I, B = z ? _ : N.length, V = e("relative overflow-x-auto py-16 scrollbar-quiet focus-ring-inset", z && "overflow-y-hidden", x && "coarse:mr-40"), H = /* @__PURE__ */ s("pre", {
 		className: "mono text-small text-fg",
 		children: /* @__PURE__ */ s("code", {
-			className: e("grid", !v && "min-w-max"),
-			children: O.slice(0, F).map((t, n) => /* @__PURE__ */ c("span", {
-				className: e("flex px-16 leading-code", v && "whitespace-pre-wrap wrap-anywhere", m.includes(n + 1) && "bg-fill-2"),
-				children: [p && /* @__PURE__ */ s("span", {
+			className: e("grid", !S && "min-w-max"),
+			children: N.slice(0, B).map((t, n) => /* @__PURE__ */ c("span", {
+				className: e("flex px-16 leading-code", S && "whitespace-pre-wrap wrap-anywhere", g.includes(n + 1) && "bg-fill-2"),
+				children: [h && /* @__PURE__ */ s("span", {
 					className: "mr-16 inline-block w-24 shrink-0 text-right text-fg-tertiary select-none tabular",
 					children: n + 1
 				}), /* @__PURE__ */ s("span", {
 					className: "min-w-0",
-					children: N?.[n]?.length ? N[n].map((e, t) => /* @__PURE__ */ s("span", {
+					children: R?.[n]?.length ? R[n].map((e, t) => /* @__PURE__ */ s("span", {
 						className: e.className || void 0,
 						children: e.content
 					}, t)) : t || " "
@@ -214,52 +218,52 @@ var b = { surface: {
 		})
 	});
 	return /* @__PURE__ */ c("div", {
-		ref: S,
-		className: e("group/code relative min-w-0", b.surface[g].classes, x),
+		ref: w,
+		className: e("group/code relative min-w-0", b.surface[v].classes, C),
 		children: [
 			/* @__PURE__ */ c(l.Root, {
-				value: C,
-				onValueChange: (e) => w(Number(e)),
-				children: [(f || d) && /* @__PURE__ */ c("div", {
+				value: O,
+				onValueChange: (e) => k(Number(e)),
+				children: [(m || d) && /* @__PURE__ */ c("div", {
 					className: "flex h-44 items-center gap-4 px-8 hairline-b",
-					children: [f && /* @__PURE__ */ s("span", {
+					children: [m && /* @__PURE__ */ s("span", {
 						className: "px-8 mono text-small text-fg-secondary",
-						children: f
+						children: m
 					}), d && /* @__PURE__ */ s(l.List, {
-						"aria-label": T("codeBlock.language", "Language"),
+						"aria-label": A("codeBlock.language", "Language"),
 						className: "flex items-center gap-2",
 						children: d.map((t, n) => /* @__PURE__ */ s(l.Tab, {
 							value: n,
-							className: e("inline-flex h-28 cursor-pointer items-center rounded-pill px-10 text-small font-medium transition-control focus-ring", n === C ? "bg-fill-2 text-fg" : "text-fg-secondary hover:bg-fill-2 hover:text-fg"),
+							className: e("inline-flex h-28 cursor-pointer items-center rounded-pill px-10 text-small font-medium transition-control focus-ring", n === O ? "bg-fill-2 text-fg" : "text-fg-secondary hover:bg-fill-2 hover:text-fg"),
 							children: t.label
 						}, t.label))
 					})]
 				}), d ? /* @__PURE__ */ s(l.Panel, {
-					value: C,
-					className: I,
-					children: L
+					value: O,
+					className: V,
+					children: H
 				}) : /* @__PURE__ */ s("div", {
 					tabIndex: 0,
 					role: "region",
-					"aria-label": typeof f == "string" ? T("codeBlock.titledCode", "{title} code", { title: f }) : T("codeBlock.code", "Code"),
-					className: I,
-					children: L
+					"aria-label": typeof m == "string" ? A("codeBlock.titledCode", "{title} code", { title: m }) : A("codeBlock.code", "Code"),
+					className: V,
+					children: H
 				})]
 			}),
-			h > 0 && O.length > h && /* @__PURE__ */ s("div", {
+			_ > 0 && N.length > _ && /* @__PURE__ */ s("div", {
 				className: "flex justify-center pb-12",
 				children: /* @__PURE__ */ s("button", {
 					type: "button",
-					onClick: () => M((e) => !e),
+					onClick: () => L((e) => !e),
 					className: "inline-flex h-28 cursor-pointer items-center rounded-pill px-12 text-small font-medium text-fg-secondary transition-control hover:bg-fill-2 hover:text-fg focus-ring",
-					children: j ? T("codeBlock.showLess", "Show less") : T("codeBlock.showAllLines", "Show all {count} lines", { count: String(O.length) })
+					children: I ? A("codeBlock.showLess", "Show less") : A("codeBlock.showAllLines", "Show all {count} lines", { count: String(N.length) })
 				})
 			}),
-			_ && /* @__PURE__ */ s("div", {
-				className: e("absolute right-8 opacity-0 transition-control group-hover/code:opacity-100 coarse:opacity-100 focus-within:opacity-100", f || d ? "top-52" : "top-8"),
+			x && /* @__PURE__ */ s("div", {
+				className: e("absolute right-8 opacity-0 transition-control group-hover/code:opacity-100 coarse:opacity-100 focus-within:opacity-100", m || d ? "top-52" : "top-8"),
 				children: /* @__PURE__ */ s(n, {
-					value: D,
-					label: T("codeBlock.copy", "Copy code")
+					value: M,
+					label: A("codeBlock.copy", "Copy code")
 				})
 			})
 		]
@@ -270,4 +274,4 @@ var C = S;
 //#endregion
 export { g as a, b as i, C as n, y as o, x as r, m as s, S as t };
 
-//# sourceMappingURL=code-block-BbK6E4Eo.js.map
+//# sourceMappingURL=code-block-DxtladFW.js.map

package/dist/chunks/code-block-DxtladFW.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-block-DxtladFW.js","names":["BaseTabs","cn","useUiText","TONES","ITALIC","BOLD","codeTokenClass","style","fontStyle","tone","color","kaesoShikiTheme","instance","CODE_LANGS","getHighlighter","createHighlighterCore","createJavaScriptRegexEngine","LOADERS","highlight","lang","h","loader","code","line","token","KAESO_CODE_BLOCK_VARIANTS","KAESO_CODE_BLOCK_DEFAULT_VARIANTS","CodeBlock","chosen","own","setOwn","useState","match","tabs","item","tab","choose","i","label","onTabChange","t","current","text","lines","useMemo","highlighted","setHighlighted","expanded","setExpanded","alive","tokenLines","collapsed","collapseAfter","visible","codeClass","copy","source","wrap","highlightLines","lineNumbers","j","surface","className","Tabs","v","title","CopyButton","CodeHighlighted"],"sources":["../../src/components/code-block/kaeso-theme.ts","../../src/components/code-block/highlighter.ts","../../src/components/code-block/code-block.tsx"],"sourcesContent":["const TONES = {\n  text: { color: \"var(--k-text)\", className: \"\" },\n  quiet: { color: \"var(--k-text-tertiary)\", className: \"text-fg-tertiary\" },\n  secondary: { color: \"var(--k-text-secondary)\", className: \"text-fg-secondary\" },\n  string: { color: \"var(--k-info-text)\", className: \"text-info-text\" },\n  constant: { color: \"var(--k-warning-text)\", className: \"text-warning-text\" },\n} as const;\n\nconst ITALIC = 1;\nconst BOLD = 2;\n\nexport function codeTokenClass(color: string | undefined, fontStyle: number | undefined): string {\n  const style = fontStyle ?? 0;\n  return [\n    Object.values(TONES).find((tone) => tone.color === color?.toLowerCase())?.className ?? \"\",\n    style & ITALIC ? \"italic\" : \"\",\n    style & BOLD ? \"font-semibold\" : \"\",\n  ]\n    .filter(Boolean)\n    .join(\" \");\n}\n\nexport const kaesoShikiTheme = {\n  name: \"kaeso\",\n  type: \"light\" as const,\n  colors: { \"editor.background\": \"transparent\", \"editor.foreground\": TONES.text.color },\n  settings: [\n    { settings: { foreground: TONES.text.color, background: \"transparent\" } },\n    { scope: [\"comment\", \"punctuation.definition.comment\"], settings: { foreground: TONES.quiet.color, fontStyle: \"italic\" } },\n    {\n      scope: [\"string\", \"string.quoted\", \"string.template\", \"punctuation.definition.string\", \"markup.inline.raw\"],\n      settings: { foreground: TONES.string.color },\n    },\n    {\n      scope: [\"constant.numeric\", \"constant.language.boolean\", \"constant.language.null\", \"constant.language\"],\n      settings: { foreground: TONES.constant.color },\n    },\n    {\n      scope: [\"keyword\", \"storage\", \"storage.type\", \"storage.modifier\", \"keyword.control\", \"keyword.operator.new\", \"variable.language\"],\n      settings: { foreground: TONES.text.color, fontStyle: \"bold\" },\n    },\n    {\n      scope: [\"punctuation\", \"meta.brace\", \"punctuation.separator\", \"punctuation.terminator\", \"keyword.operator\", \"meta.tag punctuation\"],\n      settings: { foreground: TONES.quiet.color },\n    },\n    { scope: [\"entity.name.function\", \"support.function\", \"entity.name.tag\", \"support.class.component\"], settings: { foreground: TONES.text.color } },\n    {\n      scope: [\"support.type.property-name\", \"meta.object-literal.key\", \"entity.other.attribute-name\", \"variable.other.property\"],\n      settings: { foreground: TONES.text.color },\n    },\n    { scope: [\"entity.name.type\", \"support.type\", \"entity.other.inherited-class\"], settings: { foreground: TONES.secondary.color } },\n  ],\n};\n","import { codeTokenClass, kaesoShikiTheme } from \"./kaeso-theme.js\";\n\ntype Highlighter = {\n  codeToTokens: (\n    code: string,\n    o: { lang: string; theme: string },\n  ) => { tokens: { content: string; color?: string | undefined; fontStyle?: number | undefined }[][] };\n  getLoadedLanguages: () => string[];\n  loadLanguage: (...l: unknown[]) => Promise<void>;\n};\nlet instance: Promise<Highlighter> | null = null;\n\nexport const CODE_LANGS = [\"ts\", \"tsx\", \"js\", \"json\", \"bash\", \"python\", \"yaml\", \"diff\"] as const;\nexport type CodeLang = (typeof CODE_LANGS)[number] | \"text\";\n\nexport function getHighlighter(): Promise<Highlighter> {\n  instance ??= (async () => {\n    const [{ createHighlighterCore }, { createJavaScriptRegexEngine }] = await Promise.all([import(\"shiki/core\"), import(\"shiki/engine/javascript\")]);\n    return (await createHighlighterCore({ themes: [kaesoShikiTheme as never], langs: [], engine: createJavaScriptRegexEngine() })) as unknown as Highlighter;\n  })();\n  return instance;\n}\n\nconst LOADERS: Record<Exclude<CodeLang, \"text\">, () => Promise<{ default: unknown }>> = {\n  ts: () => import(\"shiki/dist/langs/typescript.mjs\"),\n  tsx: () => import(\"shiki/dist/langs/tsx.mjs\"),\n  js: () => import(\"shiki/dist/langs/javascript.mjs\"),\n  json: () => import(\"shiki/dist/langs/json.mjs\"),\n  bash: () => import(\"shiki/dist/langs/bash.mjs\"),\n  python: () => import(\"shiki/dist/langs/python.mjs\"),\n  yaml: () => import(\"shiki/dist/langs/yaml.mjs\"),\n  diff: () => import(\"shiki/dist/langs/diff.mjs\"),\n};\n\nexport interface CodeToken {\n  content: string;\n  className: string;\n}\n\nexport async function highlight(code: string, lang: CodeLang): Promise<CodeToken[][] | null> {\n  if (lang === \"text\") return null;\n  const h = await getHighlighter();\n  if (!h.getLoadedLanguages().includes(lang)) {\n    const loader = LOADERS[lang];\n    if (!loader) return null;\n    await h.loadLanguage((await loader()).default);\n  }\n  return h\n    .codeToTokens(code, { lang, theme: \"kaeso\" })\n    .tokens.map((line) => line.map((token) => ({ content: token.content, className: codeTokenClass(token.color, token.fontStyle) })));\n}\n","import { forwardRef, useEffect, useMemo, useState, type ReactNode } from \"react\";\nimport { Tabs as BaseTabs } from \"@base-ui/react/tabs\";\nimport { cn } from \"../../utils/cn.js\";\nimport { CopyButton } from \"../copy-button/copy-button.js\";\nimport { highlight, type CodeLang, type CodeToken } from \"./highlighter.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_CODE_BLOCK_VARIANTS = {\n  surface: {\n    well: { classes: \"rounded-well bg-fill-1\" },\n    plain: { classes: \"bg-transparent\" },\n  },\n} as const;\nexport const KAESO_CODE_BLOCK_DEFAULT_VARIANTS = { surface: \"well\" } as const;\n\nexport interface CodeTab {\n  label: string;\n  code: string;\n  lang?: CodeLang | undefined;\n}\n\nexport interface CodeBlockProps {\n  code?: string | undefined;\n  lang?: CodeLang | undefined;\n  tabs?: CodeTab[] | undefined;\n  tab?: string | undefined;\n  onTabChange?: ((label: string) => void) | undefined;\n  title?: ReactNode | undefined;\n  lineNumbers?: boolean | undefined;\n  highlightLines?: number[] | undefined;\n  collapseAfter?: number | undefined;\n  surface?: keyof typeof KAESO_CODE_BLOCK_VARIANTS.surface | undefined;\n  copy?: boolean | undefined;\n  wrap?: boolean | undefined;\n  className?: string | undefined;\n}\n\nexport const CodeBlock = /* @__PURE__ */ forwardRef<HTMLDivElement, CodeBlockProps>(function CodeBlock(\n  {\n    code = \"\",\n    lang = \"ts\",\n    tabs,\n    tab: chosen,\n    onTabChange,\n    title,\n    lineNumbers,\n    highlightLines = [],\n    collapseAfter = 24,\n    surface = \"well\",\n    copy = true,\n    wrap = false,\n    className,\n  },\n  ref,\n) {\n  const [own, setOwn] = useState(0);\n  const match = chosen === undefined ? -1 : (tabs?.findIndex((item) => item.label === chosen) ?? -1);\n  const tab = match >= 0 ? match : own;\n  const choose = (i: number) => {\n    setOwn(i);\n    const label = tabs?.[i]?.label;\n    if (label !== undefined) onTabChange?.(label);\n  };\n  const t = useUiText();\n  const current = tabs?.[tab] ?? { label: \"\", code, lang };\n  const text = current.code.replace(/\\n$/, \"\");\n  const lines = useMemo(() => text.split(\"\\n\"), [text]);\n  const [highlighted, setHighlighted] = useState<{ text: string; lang: CodeLang; tokens: CodeToken[][] | null } | null>(null);\n  const [expanded, setExpanded] = useState(false);\n  useEffect(() => {\n    let alive = true;\n    const lang = current.lang ?? \"ts\";\n    highlight(text, lang)\n      .then((tokens) => alive && setHighlighted({ text, lang, tokens }))\n      .catch(() => undefined);\n    return () => {\n      alive = false;\n    };\n  }, [text, current.lang]);\n  const tokenLines = highlighted && highlighted.lang === (current.lang ?? \"ts\") && highlighted.text === text ? highlighted.tokens : null;\n  const collapsed = collapseAfter > 0 && lines.length > collapseAfter && !expanded;\n  const visible = collapsed ? collapseAfter : lines.length;\n  const codeClass = cn(\"relative overflow-x-auto py-16 scrollbar-quiet focus-ring-inset\", collapsed && \"overflow-y-hidden\", copy && \"coarse:mr-40\");\n  const source = (\n    <pre className=\"mono text-small text-fg\">\n      <code className={cn(\"grid\", !wrap && \"min-w-max\")}>\n        {lines.slice(0, visible).map((line, i) => (\n          <span key={i} className={cn(\"flex px-16 leading-code\", wrap && \"whitespace-pre-wrap wrap-anywhere\", highlightLines.includes(i + 1) && \"bg-fill-2\")}>\n            {lineNumbers && <span className=\"mr-16 inline-block w-24 shrink-0 text-right text-fg-tertiary select-none tabular\">{i + 1}</span>}\n            <span className=\"min-w-0\">\n              {tokenLines?.[i]?.length\n                ? tokenLines[i].map((token, j) => (\n                    <span key={j} className={token.className || undefined}>\n                      {token.content}\n                    </span>\n                  ))\n                : line || \" \"}\n            </span>\n          </span>\n        ))}\n      </code>\n    </pre>\n  );\n\n  return (\n    <div ref={ref} className={cn(\"group/code relative min-w-0\", KAESO_CODE_BLOCK_VARIANTS.surface[surface].classes, className)}>\n      <BaseTabs.Root value={tab} onValueChange={(v: unknown) => choose(Number(v))}>\n        {(title || tabs) && (\n          <div className=\"flex h-44 items-center gap-4 px-8 hairline-b\">\n            {title && <span className=\"px-8 mono text-small text-fg-secondary\">{title}</span>}\n            {tabs && (\n              <BaseTabs.List aria-label={t(\"codeBlock.language\", \"Language\")} className=\"flex items-center gap-2\">\n                {tabs.map((item, i) => (\n                  <BaseTabs.Tab\n                    key={item.label}\n                    value={i}\n                    className={cn(\n                      \"inline-flex h-28 cursor-pointer items-center rounded-pill px-10 text-small font-medium transition-control focus-ring\",\n                      i === tab ? \"bg-fill-2 text-fg\" : \"text-fg-secondary hover:bg-fill-2 hover:text-fg\",\n                    )}\n                  >\n                    {item.label}\n                  </BaseTabs.Tab>\n                ))}\n              </BaseTabs.List>\n            )}\n          </div>\n        )}\n        {tabs ? (\n          <BaseTabs.Panel value={tab} className={codeClass}>\n            {source}\n          </BaseTabs.Panel>\n        ) : (\n          <div\n            tabIndex={0}\n            role=\"region\"\n            aria-label={typeof title === \"string\" ? t(\"codeBlock.titledCode\", \"{title} code\", { title }) : t(\"codeBlock.code\", \"Code\")}\n            className={codeClass}\n          >\n            {source}\n          </div>\n        )}\n      </BaseTabs.Root>\n      {collapseAfter > 0 && lines.length > collapseAfter && (\n        <div className=\"flex justify-center pb-12\">\n          <button\n            type=\"button\"\n            onClick={() => setExpanded((e) => !e)}\n            className=\"inline-flex h-28 cursor-pointer items-center rounded-pill px-12 text-small font-medium text-fg-secondary transition-control hover:bg-fill-2 hover:text-fg focus-ring\"\n          >\n            {expanded ? t(\"codeBlock.showLess\", \"Show less\") : t(\"codeBlock.showAllLines\", \"Show all {count} lines\", { count: String(lines.length) })}\n          </button>\n        </div>\n      )}\n      {copy && (\n        <div\n          className={cn(\n            \"absolute right-8 opacity-0 transition-control group-hover/code:opacity-100 coarse:opacity-100 focus-within:opacity-100\",\n            title || tabs ? \"top-52\" : \"top-8\",\n          )}\n        >\n          <CopyButton value={text} label={t(\"codeBlock.copy\", \"Copy code\")} />\n        </div>\n      )}\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") CodeBlock.displayName = \"CodeBlock\";\n\nexport const CodeHighlighted = CodeBlock;\n"],"mappings":"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"}

package/dist/chunks/{combobox-D8pQk22r.js → combobox-D30Wt11R.js}

@@ -6,9 +6,9 @@ import { n as a, r as o } from "./portal-context-BBbzDKmY.js";
 import { i as s } from "./context-BELWW79w.js";
 import { t as c } from "./icon-CeNQtobn.js";
 import { a as l, o as u, s as d } from "./field-d8V94bvZ.js";
-import { i as f } from "./input-group-DQqEPFj_.js";
-import { a as p } from "./tag-BsmQ1xPj.js";
-import { n as ee, t as te } from "./use-layout-width-DZaLOQMT.js";
+import { i as f } from "./input-group-CYA1MEoZ.js";
+import { a as p } from "./tag-Dg89uYpV.js";
+import { n as ee, t as te } from "./use-layout-width-CbSDbRb0.js";
 import { forwardRef as m, useMemo as h, useRef as g, useState as _ } from "react";
 import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
 import { Add01Icon as x, ArrowDown01Icon as S, Cancel01Icon as C, Tick02Icon as w } from "@hugeicons/core-free-icons";
@@ -288,4 +288,4 @@ process.env.NODE_ENV !== "production" && (j.displayName = "Autocomplete");
 //#endregion
 export { D as a, O as i, A as n, k as r, j as t };
 
-//# sourceMappingURL=combobox-D8pQk22r.js.map
+//# sourceMappingURL=combobox-D30Wt11R.js.map

package/dist/chunks/{combobox-D8pQk22r.js.map → combobox-D30Wt11R.js.map}

@@ -1 +1 @@
-{"version":3,"file":"combobox-D8pQk22r.js","names":["_Fragment","Combobox","BaseCombobox","__icon_Cancel01Icon","__icon_ArrowDown01Icon","__icon_Add01Icon","__icon_Tick02Icon","Autocomplete","BaseAutocomplete","MENU_ITEM","MENU_POPUP","MENU_ICON","cn","pageBoundary","usePortalContainer","useUiText","Icon","useField","useFieldControl","withField","KAESO_INPUT_GROUP_VARIANTS","Tag","useLayoutWidth","anchorWidthStyle","Fragment$1","KAESO_COMBOBOX_VARIANTS","KAESO_COMBOBOX_DEFAULT_VARIANTS","Highlight","q","query","text","i","keepValueOnEscape","Combobox$1","ariaLabel","force","props","className","t","field","fc","setQuery","useState","fieldRef","useRef","fieldWidth","seen","byValue","useMemo","o","options","filtered","list","onCreate","inner","setInner","multiple","current","rootValue","v","handleChange","arr","created","x","next","inputEl","Combobox","id","invalid","error","control","onInputValueChange","a","b","disabled","name","label","description","value","Cancel01Icon","size","ArrowDown01Icon","loading","emptyText","Add01Icon","Tick02Icon","Autocomplete$1","defaultValue","Autocomplete","suggestions","onValueChange","leadingIcon","s"],"sources":["../../src/components/combobox/combobox.tsx"],"sourcesContent":["import { pageBoundary, usePortalContainer } from \"../../utils/portal-context.js\";\nimport { forwardRef, useMemo, useRef, useState, type KeyboardEvent, type ReactNode } from \"react\";\nimport { Combobox as BaseCombobox } from \"@base-ui/react/combobox\";\nimport { Autocomplete as BaseAutocomplete } from \"@base-ui/react/autocomplete\";\nimport { cn } from \"../../utils/cn.js\";\nimport { warnStylingClassName } from \"../../utils/dev.js\";\nimport { useField, useFieldControl, withField, type FieldWrapProps } from \"../field/field.js\";\nimport { Icon, type IconData } from \"../icon/icon.js\";\nimport { Cancel01Icon as __icon_Cancel01Icon, ArrowDown01Icon as __icon_ArrowDown01Icon, Add01Icon as __icon_Add01Icon, Tick02Icon as __icon_Tick02Icon } from \"@hugeicons/core-free-icons\";\nimport { KAESO_INPUT_GROUP_VARIANTS, type InputSize } from \"../input/input-group.js\";\nimport { Tag } from \"../tag/tag.js\";\nimport { MENU_ICON, MENU_ITEM, MENU_POPUP } from \"../menu/styles.js\";\n\nimport { anchorWidthStyle, useLayoutWidth } from \"../../hooks/use-layout-width.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_COMBOBOX_VARIANTS = {\n  size: {\n    sm: {\n      classes: KAESO_INPUT_GROUP_VARIANTS.size.sm.classes,\n    },\n    md: {\n      classes: KAESO_INPUT_GROUP_VARIANTS.size.md.classes,\n    },\n    lg: {\n      classes: KAESO_INPUT_GROUP_VARIANTS.size.lg.classes,\n    },\n    xl: {\n      classes: KAESO_INPUT_GROUP_VARIANTS.size.xl.classes,\n    },\n  },\n} as const;\nexport const KAESO_COMBOBOX_DEFAULT_VARIANTS = { size: \"md\" } as const;\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  description?: ReactNode | undefined;\n  icon?: IconData | undefined;\n  leading?: ReactNode | undefined;\n  disabled?: boolean | undefined;\n}\n\ninterface CreateItem extends ComboboxOption {\n  __create: true;\n}\n\nexport function Highlight({ text, query }: { text: string; query: string }) {\n  const q = query.trim().toLowerCase();\n  if (!q) return <>{text}</>;\n  const i = text.toLowerCase().indexOf(q);\n  if (i < 0) return <span className=\"text-fg-secondary\">{text}</span>;\n  return (\n    <span className=\"text-fg-secondary\">\n      {text.slice(0, i)}\n      <span className=\"text-fg\">{text.slice(i, i + q.length)}</span>\n      {text.slice(i + q.length)}\n    </span>\n  );\n}\n\ninterface BaseProps extends FieldWrapProps {\n  options: ComboboxOption[];\n  placeholder?: string | undefined;\n  size?: InputSize | undefined;\n  emptyText?: ReactNode | undefined;\n  loading?: boolean | undefined;\n  onInputValueChange?: ((value: string) => void) | undefined;\n  onCreate?: ((label: string) => void) | undefined;\n  disabled?: boolean | undefined;\n  invalid?: boolean | undefined;\n  id?: string | undefined;\n  name?: string | undefined;\n  \"aria-label\"?: string | undefined;\n  className?: string | undefined;\n  \"data-force\"?: string | undefined;\n}\nexport interface SingleComboboxProps extends BaseProps {\n  multiple?: false | undefined;\n  value?: string | null | undefined;\n  defaultValue?: string | null | undefined;\n  onValueChange?: ((value: string | null) => void) | undefined;\n}\nexport interface MultiComboboxProps extends BaseProps {\n  multiple: true;\n  value?: string[] | undefined;\n  defaultValue?: string[] | undefined;\n  onValueChange?: ((value: string[]) => void) | undefined;\n}\nexport type ComboboxProps = SingleComboboxProps | MultiComboboxProps;\n\nfunction keepValueOnEscape(e: KeyboardEvent<HTMLInputElement> & { preventBaseUIHandler?: (() => void) | undefined }) {\n  if (e.key === \"Escape\" && e.currentTarget.getAttribute(\"aria-expanded\") !== \"true\") e.preventBaseUIHandler?.();\n}\n\nexport const Combobox = /* @__PURE__ */ forwardRef<HTMLInputElement, ComboboxProps>(function Combobox(props, ref) {\n  const {\n    options,\n    placeholder,\n    size = \"md\",\n    emptyText,\n    loading,\n    onInputValueChange,\n    onCreate,\n    disabled,\n    invalid,\n    id,\n    name,\n    label,\n    description,\n    error,\n    optional,\n    required,\n    layout,\n    className,\n    multiple,\n    \"aria-label\": ariaLabel,\n    \"data-force\": force,\n  } = props;\n  warnStylingClassName(\"Combobox\", className);\n  const t = useUiText();\n  const field = useField();\n  const fc = useFieldControl(props);\n  const [query, setQuery] = useState(\"\");\n  const fieldRef = useRef<HTMLDivElement | null>(null);\n  const fieldWidth = useLayoutWidth(fieldRef);\n  const seen = useRef(new Map<string, ComboboxOption>());\n  const byValue = useMemo(() => {\n    for (const o of options) seen.current.set(o.value, o);\n    return seen.current;\n  }, [options]);\n  const filtered = useMemo(() => {\n    const q = query.trim().toLowerCase();\n    const list: (ComboboxOption | CreateItem)[] = q ? options.filter((o) => o.label.toLowerCase().includes(q) || o.value.toLowerCase().includes(q)) : options;\n    if (onCreate && q && !options.some((o) => o.label.toLowerCase() === q))\n      list.push({\n        value: `__create__${query}`,\n        label: query.trim(),\n        __create: true,\n      });\n    return list;\n  }, [options, query, onCreate]);\n\n  const [inner, setInner] = useState<string | null | string[]>(() => props.defaultValue ?? (multiple ? [] : null));\n  const current = props.value !== undefined ? props.value : inner;\n  const rootValue = Array.isArray(current) ? current.flatMap((v) => byValue.get(v) ?? []) : current == null ? null : (byValue.get(current) ?? null);\n\n  const handleChange = (v: unknown) => {\n    const arr = Array.isArray(v) ? (v as (ComboboxOption | CreateItem)[]) : null;\n    const created = (arr ?? [v as ComboboxOption | CreateItem | null]).find((x) => x && \"__create\" in x) as CreateItem | undefined;\n    if (created) {\n      onCreate?.(created.label);\n      return;\n    }\n    const next = multiple ? (arr ?? []).map((x) => x.value) : ((v as ComboboxOption | null)?.value ?? null);\n    if (props.value === undefined) setInner(next);\n    if (multiple) (props.onValueChange as ((x: string[]) => void) | undefined)?.(next as string[]);\n    else (props.onValueChange as ((x: string | null) => void) | undefined)?.(next as string | null);\n  };\n\n  const inputEl = (\n    <BaseCombobox.Input\n      ref={ref}\n      placeholder={placeholder}\n      {...(id ? { id } : {})}\n      {...fc.controlProps}\n      {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n      {...(invalid || error ? { \"aria-invalid\": true } : {})}\n      onKeyDown={keepValueOnEscape}\n      className=\"min-w-80 flex-1 bg-transparent text-fg outline-none placeholder:text-fg-tertiary disabled:cursor-not-allowed\"\n    />\n  );\n\n  const control = (\n    <BaseCombobox.Root\n      items={filtered}\n      filteredItems={filtered}\n      value={rootValue}\n      onValueChange={handleChange}\n      onInputValueChange={(v: string) => {\n        setQuery(v);\n        onInputValueChange?.(v);\n      }}\n      autoHighlight\n      itemToStringLabel={(o: ComboboxOption) => o?.label ?? \"\"}\n      isItemEqualToValue={(a: ComboboxOption, b: ComboboxOption) => a?.value === b?.value}\n      multiple={multiple === true}\n      {...(disabled ? { disabled } : {})}\n      {...(name ? { name } : {})}\n    >\n      {multiple ? (\n        <BaseCombobox.Chips\n          ref={fieldRef}\n          {...(force ? { \"data-force\": force } : {})}\n          className={cn(\n            \"flex min-h-36 w-full flex-wrap items-center gap-4 rounded-field p-4 material-field transition-control cursor-text\",\n            (invalid || error) && \"ring-invalid\",\n            !(label || description || error) && className,\n          )}\n        >\n          <BaseCombobox.Value>\n            {(value: ComboboxOption[]) => (\n              <>\n                {value.map((o) => (\n                  <BaseCombobox.Chip key={o.value} aria-label={o.label} className=\"outline-none\">\n                    <Tag className=\"pr-2\">\n                      {o.label}\n                      <BaseCombobox.ChipRemove\n                        aria-label={t(\"combobox.remove\", \"Remove {label}\", { label: o.label })}\n                        className=\"ml-2 inline-flex size-24 items-center justify-center rounded-pill text-fg-tertiary transition-control hover:bg-fill-2 hover:text-fg\"\n                      >\n                        <Icon icon={__icon_Cancel01Icon} size=\"xs\" />\n                      </BaseCombobox.ChipRemove>\n                    </Tag>\n                  </BaseCombobox.Chip>\n                ))}\n                <span className={cn(\"flex h-28 min-w-80 flex-1 items-center\", value.length === 0 ? \"px-12\" : \"px-8\")}>{inputEl}</span>\n              </>\n            )}\n          </BaseCombobox.Value>\n        </BaseCombobox.Chips>\n      ) : (\n        <BaseCombobox.InputGroup\n          ref={fieldRef}\n          {...(force ? { \"data-force\": force } : {})}\n          className={cn(\n            \"relative flex w-full min-w-0 items-center rounded-pill material-field transition-control cursor-text\",\n            KAESO_COMBOBOX_VARIANTS.size[size].classes,\n            \"pr-4\",\n            (invalid || error) && \"ring-invalid\",\n            !(label || description || error) && className,\n          )}\n        >\n          {inputEl}\n          <BaseCombobox.Trigger\n            aria-label={t(\"combobox.showOptions\", \"Show options\")}\n            className=\"inline-flex size-28 shrink-0 items-center justify-center rounded-pill text-fg-tertiary transition-control hover:bg-fill-1 hover:text-fg\"\n          >\n            <Icon icon={__icon_ArrowDown01Icon} size=\"sm\" />\n          </BaseCombobox.Trigger>\n        </BaseCombobox.InputGroup>\n      )}\n      <BaseCombobox.Portal container={usePortalContainer()}>\n        <BaseCombobox.Positioner\n          anchor={fieldRef}\n          positionMethod=\"fixed\"\n          collisionBoundary={pageBoundary()}\n          align=\"start\"\n          sideOffset={6}\n          collisionPadding={8}\n          className=\"z-50 outline-none\"\n        >\n          <BaseCombobox.Popup className={cn(MENU_POPUP, \"relative min-w-anchor overflow-hidden\")} style={anchorWidthStyle(fieldWidth)}>\n            {loading && (\n              <span aria-hidden className=\"absolute inset-x-16 top-0 h-2 overflow-hidden rounded-pill\">\n                <span className=\"block h-full w-1/3 animate-indeterminate rounded-pill bg-fg-tertiary\" />\n              </span>\n            )}\n            <BaseCombobox.Status className=\"sr-only\">{loading ? t(\"combobox.loadingResults\", \"Loading results\") : \"\"}</BaseCombobox.Status>\n            <BaseCombobox.Empty className=\"flex h-34 items-center px-10 text-body text-fg-secondary empty:hidden\">\n              {loading ? t(\"combobox.loading\", \"Loading…\") : (emptyText ?? t(\"combobox.noResults\", \"No results\"))}\n            </BaseCombobox.Empty>\n            <BaseCombobox.List className=\"-m-6 flex min-h-0 flex-col overflow-y-auto overscroll-contain p-6 outline-none scrollbar-quiet\">\n              {(o: ComboboxOption | CreateItem) => (\n                <BaseCombobox.Item key={o.value} value={o} {...(o.disabled ? { disabled: true } : {})} className={MENU_ITEM}>\n                  {\"__create\" in o ? (\n                    <>\n                      <Icon icon={__icon_Add01Icon} size=\"sm\" className={MENU_ICON} />\n                      <span className=\"min-w-0 flex-1 truncate\">{t(\"combobox.create\", \"Create “{label}”\", { label: o.label })}</span>\n                    </>\n                  ) : (\n                    <>\n                      {o.leading}\n                      {o.icon && <Icon icon={o.icon} size=\"sm\" className={MENU_ICON} />}\n                      <span className={cn(\"flex min-w-0 flex-1 flex-col\", o.description && \"gap-2 py-8\")}>\n                        <span className=\"truncate\">\n                          <Highlight text={o.label} query={query} />\n                        </span>\n                        {o.description && <span className=\"text-small font-regular text-fg-secondary\">{o.description}</span>}\n                      </span>\n                      <BaseCombobox.ItemIndicator\n                        keepMounted\n                        className=\"flex size-16 shrink-0 items-center justify-center text-fg opacity-0 data-selected:opacity-100\"\n                      >\n                        <Icon icon={__icon_Tick02Icon} size=\"sm\" />\n                      </BaseCombobox.ItemIndicator>\n                    </>\n                  )}\n                </BaseCombobox.Item>\n              )}\n            </BaseCombobox.List>\n          </BaseCombobox.Popup>\n        </BaseCombobox.Positioner>\n      </BaseCombobox.Portal>\n    </BaseCombobox.Root>\n  );\n  if (field) return control;\n  return withField(\n    {\n      label,\n      description,\n      error,\n      optional,\n      required,\n      layout,\n      id: fc.wrapId ?? id,\n      disabled,\n      className,\n    },\n    control,\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Combobox.displayName = \"Combobox\";\n\nexport interface AutocompleteProps extends FieldWrapProps {\n  suggestions: string[];\n  value?: string | undefined;\n  defaultValue?: string | undefined;\n  onValueChange?: ((value: string) => void) | undefined;\n  placeholder?: string | undefined;\n  size?: InputSize | undefined;\n  disabled?: boolean | undefined;\n  id?: string | undefined;\n  name?: string | undefined;\n  leadingIcon?: IconData | undefined;\n  \"aria-label\"?: string | undefined;\n  className?: string | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const Autocomplete = /* @__PURE__ */ forwardRef<HTMLInputElement, AutocompleteProps>(function Autocomplete(props, ref) {\n  const {\n    suggestions,\n    value,\n    defaultValue,\n    onValueChange,\n    placeholder,\n    size = \"md\",\n    disabled,\n    id,\n    name,\n    leadingIcon,\n    label,\n    description,\n    error,\n    optional,\n    required,\n    layout,\n    className,\n    \"aria-label\": ariaLabel,\n    \"data-force\": force,\n  } = props;\n  const field = useField();\n  const fc = useFieldControl(props);\n  const [query, setQuery] = useState(defaultValue ?? \"\");\n  const fieldRef = useRef<HTMLDivElement | null>(null);\n  const fieldWidth = useLayoutWidth(fieldRef);\n  const current = value ?? query;\n  const control = (\n    <BaseAutocomplete.Root\n      items={suggestions}\n      {...(value !== undefined ? { value } : {})}\n      {...(defaultValue !== undefined ? { defaultValue } : {})}\n      onValueChange={(v: string) => {\n        setQuery(v);\n        onValueChange?.(v);\n      }}\n      {...(disabled ? { disabled } : {})}\n      {...(name ? { name } : {})}\n    >\n      <BaseAutocomplete.InputGroup\n        ref={fieldRef}\n        {...(force ? { \"data-force\": force } : {})}\n        className={cn(\n          \"relative flex w-full min-w-0 items-center rounded-pill material-field transition-control cursor-text\",\n          KAESO_COMBOBOX_VARIANTS.size[size].classes,\n          leadingIcon && \"pl-14\",\n          props.error && \"ring-invalid\",\n          !(label || description || error) && className,\n        )}\n      >\n        {leadingIcon && <Icon icon={leadingIcon} size=\"sm\" className=\"text-fg-tertiary\" />}\n        <BaseAutocomplete.Input\n          ref={ref}\n          placeholder={placeholder}\n          {...(id ? { id } : {})}\n          {...fc.controlProps}\n          {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n          onKeyDown={keepValueOnEscape}\n          className=\"min-w-0 flex-1 bg-transparent text-fg outline-none placeholder:text-fg-tertiary\"\n        />\n      </BaseAutocomplete.InputGroup>\n      <BaseAutocomplete.Portal container={usePortalContainer()}>\n        <BaseAutocomplete.Positioner\n          anchor={fieldRef}\n          positionMethod=\"fixed\"\n          collisionBoundary={pageBoundary()}\n          align=\"start\"\n          sideOffset={6}\n          collisionPadding={8}\n          className=\"z-50 outline-none\"\n        >\n          <BaseAutocomplete.Popup className={cn(MENU_POPUP, \"min-w-anchor overflow-hidden data-empty:hidden\")} style={anchorWidthStyle(fieldWidth)}>\n            <BaseAutocomplete.List className=\"-m-6 flex min-h-0 flex-col overflow-y-auto overscroll-contain p-6 outline-none scrollbar-quiet\">\n              {(s: string) => (\n                <BaseAutocomplete.Item key={s} value={s} className={MENU_ITEM}>\n                  <span className=\"truncate\">\n                    <Highlight text={s} query={current} />\n                  </span>\n                </BaseAutocomplete.Item>\n              )}\n            </BaseAutocomplete.List>\n          </BaseAutocomplete.Popup>\n        </BaseAutocomplete.Positioner>\n      </BaseAutocomplete.Portal>\n    </BaseAutocomplete.Root>\n  );\n  if (field) return control;\n  return withField(\n    {\n      label,\n      description,\n      error,\n      optional,\n      required,\n      layout,\n      id: fc.wrapId ?? id,\n      disabled,\n      className,\n    },\n    control,\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Autocomplete.displayName = \"Autocomplete\";\n"],"mappings":"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"}
+{"version":3,"file":"combobox-D30Wt11R.js","names":["_Fragment","Combobox","BaseCombobox","__icon_Cancel01Icon","__icon_ArrowDown01Icon","__icon_Add01Icon","__icon_Tick02Icon","Autocomplete","BaseAutocomplete","MENU_ITEM","MENU_POPUP","MENU_ICON","cn","pageBoundary","usePortalContainer","useUiText","Icon","useField","useFieldControl","withField","KAESO_INPUT_GROUP_VARIANTS","Tag","useLayoutWidth","anchorWidthStyle","Fragment$1","KAESO_COMBOBOX_VARIANTS","KAESO_COMBOBOX_DEFAULT_VARIANTS","Highlight","q","query","text","i","keepValueOnEscape","Combobox$1","ariaLabel","force","props","className","t","field","fc","setQuery","useState","fieldRef","useRef","fieldWidth","seen","byValue","useMemo","o","options","filtered","list","onCreate","inner","setInner","multiple","current","rootValue","v","handleChange","arr","created","x","next","inputEl","Combobox","id","invalid","error","control","onInputValueChange","a","b","disabled","name","label","description","value","Cancel01Icon","size","ArrowDown01Icon","loading","emptyText","Add01Icon","Tick02Icon","Autocomplete$1","defaultValue","Autocomplete","suggestions","onValueChange","leadingIcon","s"],"sources":["../../src/components/combobox/combobox.tsx"],"sourcesContent":["import { pageBoundary, usePortalContainer } from \"../../utils/portal-context.js\";\nimport { forwardRef, useMemo, useRef, useState, type KeyboardEvent, type ReactNode } from \"react\";\nimport { Combobox as BaseCombobox } from \"@base-ui/react/combobox\";\nimport { Autocomplete as BaseAutocomplete } from \"@base-ui/react/autocomplete\";\nimport { cn } from \"../../utils/cn.js\";\nimport { warnStylingClassName } from \"../../utils/dev.js\";\nimport { useField, useFieldControl, withField, type FieldWrapProps } from \"../field/field.js\";\nimport { Icon, type IconData } from \"../icon/icon.js\";\nimport { Cancel01Icon as __icon_Cancel01Icon, ArrowDown01Icon as __icon_ArrowDown01Icon, Add01Icon as __icon_Add01Icon, Tick02Icon as __icon_Tick02Icon } from \"@hugeicons/core-free-icons\";\nimport { KAESO_INPUT_GROUP_VARIANTS, type InputSize } from \"../input/input-group.js\";\nimport { Tag } from \"../tag/tag.js\";\nimport { MENU_ICON, MENU_ITEM, MENU_POPUP } from \"../menu/styles.js\";\n\nimport { anchorWidthStyle, useLayoutWidth } from \"../../hooks/use-layout-width.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_COMBOBOX_VARIANTS = {\n  size: {\n    sm: {\n      classes: KAESO_INPUT_GROUP_VARIANTS.size.sm.classes,\n    },\n    md: {\n      classes: KAESO_INPUT_GROUP_VARIANTS.size.md.classes,\n    },\n    lg: {\n      classes: KAESO_INPUT_GROUP_VARIANTS.size.lg.classes,\n    },\n    xl: {\n      classes: KAESO_INPUT_GROUP_VARIANTS.size.xl.classes,\n    },\n  },\n} as const;\nexport const KAESO_COMBOBOX_DEFAULT_VARIANTS = { size: \"md\" } as const;\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  description?: ReactNode | undefined;\n  icon?: IconData | undefined;\n  leading?: ReactNode | undefined;\n  disabled?: boolean | undefined;\n}\n\ninterface CreateItem extends ComboboxOption {\n  __create: true;\n}\n\nexport function Highlight({ text, query }: { text: string; query: string }) {\n  const q = query.trim().toLowerCase();\n  if (!q) return <>{text}</>;\n  const i = text.toLowerCase().indexOf(q);\n  if (i < 0) return <span className=\"text-fg-secondary\">{text}</span>;\n  return (\n    <span className=\"text-fg-secondary\">\n      {text.slice(0, i)}\n      <span className=\"text-fg\">{text.slice(i, i + q.length)}</span>\n      {text.slice(i + q.length)}\n    </span>\n  );\n}\n\ninterface BaseProps extends FieldWrapProps {\n  options: ComboboxOption[];\n  placeholder?: string | undefined;\n  size?: InputSize | undefined;\n  emptyText?: ReactNode | undefined;\n  loading?: boolean | undefined;\n  onInputValueChange?: ((value: string) => void) | undefined;\n  onCreate?: ((label: string) => void) | undefined;\n  disabled?: boolean | undefined;\n  invalid?: boolean | undefined;\n  id?: string | undefined;\n  name?: string | undefined;\n  \"aria-label\"?: string | undefined;\n  className?: string | undefined;\n  \"data-force\"?: string | undefined;\n}\nexport interface SingleComboboxProps extends BaseProps {\n  multiple?: false | undefined;\n  value?: string | null | undefined;\n  defaultValue?: string | null | undefined;\n  onValueChange?: ((value: string | null) => void) | undefined;\n}\nexport interface MultiComboboxProps extends BaseProps {\n  multiple: true;\n  value?: string[] | undefined;\n  defaultValue?: string[] | undefined;\n  onValueChange?: ((value: string[]) => void) | undefined;\n}\nexport type ComboboxProps = SingleComboboxProps | MultiComboboxProps;\n\nfunction keepValueOnEscape(e: KeyboardEvent<HTMLInputElement> & { preventBaseUIHandler?: (() => void) | undefined }) {\n  if (e.key === \"Escape\" && e.currentTarget.getAttribute(\"aria-expanded\") !== \"true\") e.preventBaseUIHandler?.();\n}\n\nexport const Combobox = /* @__PURE__ */ forwardRef<HTMLInputElement, ComboboxProps>(function Combobox(props, ref) {\n  const {\n    options,\n    placeholder,\n    size = \"md\",\n    emptyText,\n    loading,\n    onInputValueChange,\n    onCreate,\n    disabled,\n    invalid,\n    id,\n    name,\n    label,\n    description,\n    error,\n    optional,\n    required,\n    layout,\n    className,\n    multiple,\n    \"aria-label\": ariaLabel,\n    \"data-force\": force,\n  } = props;\n  warnStylingClassName(\"Combobox\", className);\n  const t = useUiText();\n  const field = useField();\n  const fc = useFieldControl(props);\n  const [query, setQuery] = useState(\"\");\n  const fieldRef = useRef<HTMLDivElement | null>(null);\n  const fieldWidth = useLayoutWidth(fieldRef);\n  const seen = useRef(new Map<string, ComboboxOption>());\n  const byValue = useMemo(() => {\n    for (const o of options) seen.current.set(o.value, o);\n    return seen.current;\n  }, [options]);\n  const filtered = useMemo(() => {\n    const q = query.trim().toLowerCase();\n    const list: (ComboboxOption | CreateItem)[] = q ? options.filter((o) => o.label.toLowerCase().includes(q) || o.value.toLowerCase().includes(q)) : options;\n    if (onCreate && q && !options.some((o) => o.label.toLowerCase() === q))\n      list.push({\n        value: `__create__${query}`,\n        label: query.trim(),\n        __create: true,\n      });\n    return list;\n  }, [options, query, onCreate]);\n\n  const [inner, setInner] = useState<string | null | string[]>(() => props.defaultValue ?? (multiple ? [] : null));\n  const current = props.value !== undefined ? props.value : inner;\n  const rootValue = Array.isArray(current) ? current.flatMap((v) => byValue.get(v) ?? []) : current == null ? null : (byValue.get(current) ?? null);\n\n  const handleChange = (v: unknown) => {\n    const arr = Array.isArray(v) ? (v as (ComboboxOption | CreateItem)[]) : null;\n    const created = (arr ?? [v as ComboboxOption | CreateItem | null]).find((x) => x && \"__create\" in x) as CreateItem | undefined;\n    if (created) {\n      onCreate?.(created.label);\n      return;\n    }\n    const next = multiple ? (arr ?? []).map((x) => x.value) : ((v as ComboboxOption | null)?.value ?? null);\n    if (props.value === undefined) setInner(next);\n    if (multiple) (props.onValueChange as ((x: string[]) => void) | undefined)?.(next as string[]);\n    else (props.onValueChange as ((x: string | null) => void) | undefined)?.(next as string | null);\n  };\n\n  const inputEl = (\n    <BaseCombobox.Input\n      ref={ref}\n      placeholder={placeholder}\n      {...(id ? { id } : {})}\n      {...fc.controlProps}\n      {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n      {...(invalid || error ? { \"aria-invalid\": true } : {})}\n      onKeyDown={keepValueOnEscape}\n      className=\"min-w-80 flex-1 bg-transparent text-fg outline-none placeholder:text-fg-tertiary disabled:cursor-not-allowed\"\n    />\n  );\n\n  const control = (\n    <BaseCombobox.Root\n      items={filtered}\n      filteredItems={filtered}\n      value={rootValue}\n      onValueChange={handleChange}\n      onInputValueChange={(v: string) => {\n        setQuery(v);\n        onInputValueChange?.(v);\n      }}\n      autoHighlight\n      itemToStringLabel={(o: ComboboxOption) => o?.label ?? \"\"}\n      isItemEqualToValue={(a: ComboboxOption, b: ComboboxOption) => a?.value === b?.value}\n      multiple={multiple === true}\n      {...(disabled ? { disabled } : {})}\n      {...(name ? { name } : {})}\n    >\n      {multiple ? (\n        <BaseCombobox.Chips\n          ref={fieldRef}\n          {...(force ? { \"data-force\": force } : {})}\n          className={cn(\n            \"flex min-h-36 w-full flex-wrap items-center gap-4 rounded-field p-4 material-field transition-control cursor-text\",\n            (invalid || error) && \"ring-invalid\",\n            !(label || description || error) && className,\n          )}\n        >\n          <BaseCombobox.Value>\n            {(value: ComboboxOption[]) => (\n              <>\n                {value.map((o) => (\n                  <BaseCombobox.Chip key={o.value} aria-label={o.label} className=\"outline-none\">\n                    <Tag className=\"pr-2\">\n                      {o.label}\n                      <BaseCombobox.ChipRemove\n                        aria-label={t(\"combobox.remove\", \"Remove {label}\", { label: o.label })}\n                        className=\"ml-2 inline-flex size-24 items-center justify-center rounded-pill text-fg-tertiary transition-control hover:bg-fill-2 hover:text-fg\"\n                      >\n                        <Icon icon={__icon_Cancel01Icon} size=\"xs\" />\n                      </BaseCombobox.ChipRemove>\n                    </Tag>\n                  </BaseCombobox.Chip>\n                ))}\n                <span className={cn(\"flex h-28 min-w-80 flex-1 items-center\", value.length === 0 ? \"px-12\" : \"px-8\")}>{inputEl}</span>\n              </>\n            )}\n          </BaseCombobox.Value>\n        </BaseCombobox.Chips>\n      ) : (\n        <BaseCombobox.InputGroup\n          ref={fieldRef}\n          {...(force ? { \"data-force\": force } : {})}\n          className={cn(\n            \"relative flex w-full min-w-0 items-center rounded-pill material-field transition-control cursor-text\",\n            KAESO_COMBOBOX_VARIANTS.size[size].classes,\n            \"pr-4\",\n            (invalid || error) && \"ring-invalid\",\n            !(label || description || error) && className,\n          )}\n        >\n          {inputEl}\n          <BaseCombobox.Trigger\n            aria-label={t(\"combobox.showOptions\", \"Show options\")}\n            className=\"inline-flex size-28 shrink-0 items-center justify-center rounded-pill text-fg-tertiary transition-control hover:bg-fill-1 hover:text-fg\"\n          >\n            <Icon icon={__icon_ArrowDown01Icon} size=\"sm\" />\n          </BaseCombobox.Trigger>\n        </BaseCombobox.InputGroup>\n      )}\n      <BaseCombobox.Portal container={usePortalContainer()}>\n        <BaseCombobox.Positioner\n          anchor={fieldRef}\n          positionMethod=\"fixed\"\n          collisionBoundary={pageBoundary()}\n          align=\"start\"\n          sideOffset={6}\n          collisionPadding={8}\n          className=\"z-50 outline-none\"\n        >\n          <BaseCombobox.Popup className={cn(MENU_POPUP, \"relative min-w-anchor overflow-hidden\")} style={anchorWidthStyle(fieldWidth)}>\n            {loading && (\n              <span aria-hidden className=\"absolute inset-x-16 top-0 h-2 overflow-hidden rounded-pill\">\n                <span className=\"block h-full w-1/3 animate-indeterminate rounded-pill bg-fg-tertiary\" />\n              </span>\n            )}\n            <BaseCombobox.Status className=\"sr-only\">{loading ? t(\"combobox.loadingResults\", \"Loading results\") : \"\"}</BaseCombobox.Status>\n            <BaseCombobox.Empty className=\"flex h-34 items-center px-10 text-body text-fg-secondary empty:hidden\">\n              {loading ? t(\"combobox.loading\", \"Loading…\") : (emptyText ?? t(\"combobox.noResults\", \"No results\"))}\n            </BaseCombobox.Empty>\n            <BaseCombobox.List className=\"-m-6 flex min-h-0 flex-col overflow-y-auto overscroll-contain p-6 outline-none scrollbar-quiet\">\n              {(o: ComboboxOption | CreateItem) => (\n                <BaseCombobox.Item key={o.value} value={o} {...(o.disabled ? { disabled: true } : {})} className={MENU_ITEM}>\n                  {\"__create\" in o ? (\n                    <>\n                      <Icon icon={__icon_Add01Icon} size=\"sm\" className={MENU_ICON} />\n                      <span className=\"min-w-0 flex-1 truncate\">{t(\"combobox.create\", \"Create “{label}”\", { label: o.label })}</span>\n                    </>\n                  ) : (\n                    <>\n                      {o.leading}\n                      {o.icon && <Icon icon={o.icon} size=\"sm\" className={MENU_ICON} />}\n                      <span className={cn(\"flex min-w-0 flex-1 flex-col\", o.description && \"gap-2 py-8\")}>\n                        <span className=\"truncate\">\n                          <Highlight text={o.label} query={query} />\n                        </span>\n                        {o.description && <span className=\"text-small font-regular text-fg-secondary\">{o.description}</span>}\n                      </span>\n                      <BaseCombobox.ItemIndicator\n                        keepMounted\n                        className=\"flex size-16 shrink-0 items-center justify-center text-fg opacity-0 data-selected:opacity-100\"\n                      >\n                        <Icon icon={__icon_Tick02Icon} size=\"sm\" />\n                      </BaseCombobox.ItemIndicator>\n                    </>\n                  )}\n                </BaseCombobox.Item>\n              )}\n            </BaseCombobox.List>\n          </BaseCombobox.Popup>\n        </BaseCombobox.Positioner>\n      </BaseCombobox.Portal>\n    </BaseCombobox.Root>\n  );\n  if (field) return control;\n  return withField(\n    {\n      label,\n      description,\n      error,\n      optional,\n      required,\n      layout,\n      id: fc.wrapId ?? id,\n      disabled,\n      className,\n    },\n    control,\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Combobox.displayName = \"Combobox\";\n\nexport interface AutocompleteProps extends FieldWrapProps {\n  suggestions: string[];\n  value?: string | undefined;\n  defaultValue?: string | undefined;\n  onValueChange?: ((value: string) => void) | undefined;\n  placeholder?: string | undefined;\n  size?: InputSize | undefined;\n  disabled?: boolean | undefined;\n  id?: string | undefined;\n  name?: string | undefined;\n  leadingIcon?: IconData | undefined;\n  \"aria-label\"?: string | undefined;\n  className?: string | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const Autocomplete = /* @__PURE__ */ forwardRef<HTMLInputElement, AutocompleteProps>(function Autocomplete(props, ref) {\n  const {\n    suggestions,\n    value,\n    defaultValue,\n    onValueChange,\n    placeholder,\n    size = \"md\",\n    disabled,\n    id,\n    name,\n    leadingIcon,\n    label,\n    description,\n    error,\n    optional,\n    required,\n    layout,\n    className,\n    \"aria-label\": ariaLabel,\n    \"data-force\": force,\n  } = props;\n  const field = useField();\n  const fc = useFieldControl(props);\n  const [query, setQuery] = useState(defaultValue ?? \"\");\n  const fieldRef = useRef<HTMLDivElement | null>(null);\n  const fieldWidth = useLayoutWidth(fieldRef);\n  const current = value ?? query;\n  const control = (\n    <BaseAutocomplete.Root\n      items={suggestions}\n      {...(value !== undefined ? { value } : {})}\n      {...(defaultValue !== undefined ? { defaultValue } : {})}\n      onValueChange={(v: string) => {\n        setQuery(v);\n        onValueChange?.(v);\n      }}\n      {...(disabled ? { disabled } : {})}\n      {...(name ? { name } : {})}\n    >\n      <BaseAutocomplete.InputGroup\n        ref={fieldRef}\n        {...(force ? { \"data-force\": force } : {})}\n        className={cn(\n          \"relative flex w-full min-w-0 items-center rounded-pill material-field transition-control cursor-text\",\n          KAESO_COMBOBOX_VARIANTS.size[size].classes,\n          leadingIcon && \"pl-14\",\n          props.error && \"ring-invalid\",\n          !(label || description || error) && className,\n        )}\n      >\n        {leadingIcon && <Icon icon={leadingIcon} size=\"sm\" className=\"text-fg-tertiary\" />}\n        <BaseAutocomplete.Input\n          ref={ref}\n          placeholder={placeholder}\n          {...(id ? { id } : {})}\n          {...fc.controlProps}\n          {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n          onKeyDown={keepValueOnEscape}\n          className=\"min-w-0 flex-1 bg-transparent text-fg outline-none placeholder:text-fg-tertiary\"\n        />\n      </BaseAutocomplete.InputGroup>\n      <BaseAutocomplete.Portal container={usePortalContainer()}>\n        <BaseAutocomplete.Positioner\n          anchor={fieldRef}\n          positionMethod=\"fixed\"\n          collisionBoundary={pageBoundary()}\n          align=\"start\"\n          sideOffset={6}\n          collisionPadding={8}\n          className=\"z-50 outline-none\"\n        >\n          <BaseAutocomplete.Popup className={cn(MENU_POPUP, \"min-w-anchor overflow-hidden data-empty:hidden\")} style={anchorWidthStyle(fieldWidth)}>\n            <BaseAutocomplete.List className=\"-m-6 flex min-h-0 flex-col overflow-y-auto overscroll-contain p-6 outline-none scrollbar-quiet\">\n              {(s: string) => (\n                <BaseAutocomplete.Item key={s} value={s} className={MENU_ITEM}>\n                  <span className=\"truncate\">\n                    <Highlight text={s} query={current} />\n                  </span>\n                </BaseAutocomplete.Item>\n              )}\n            </BaseAutocomplete.List>\n          </BaseAutocomplete.Popup>\n        </BaseAutocomplete.Positioner>\n      </BaseAutocomplete.Portal>\n    </BaseAutocomplete.Root>\n  );\n  if (field) return control;\n  return withField(\n    {\n      label,\n      description,\n      error,\n      optional,\n      required,\n      layout,\n      id: fc.wrapId ?? id,\n      disabled,\n      className,\n    },\n    control,\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Autocomplete.displayName = \"Autocomplete\";\n"],"mappings":"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"}

package/dist/chunks/{copy-button-mAzHjYXq.js → copy-button-DXxn-YYZ.js}

@@ -2,9 +2,9 @@
 import { t as e } from "./cn-CidVUKMm.js";
 import { i as t } from "./context-BELWW79w.js";
 import { t as n } from "./icon-CeNQtobn.js";
-import { r } from "./tooltip-CDu00nzg.js";
-import { t as i } from "./use-truncated-DmQoePvG.js";
-import { n as a } from "./button-BHKAE6ui.js";
+import { r } from "./tooltip-DEbCCsru.js";
+import { t as i } from "./use-truncated-CW0hByYt.js";
+import { n as a } from "./button-DQvoOxVQ.js";
 import { t as o } from "./use-copy-Dm2ncvMX.js";
 import { forwardRef as s, useRef as c, useState as l } from "react";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
@@ -106,4 +106,4 @@ process.env.NODE_ENV !== "production" && (b.displayName = "InlineCopyText");
 //#endregion
 export { _ as a, v as i, g as n, h as o, b as r, m as s, y as t };
 
-//# sourceMappingURL=copy-button-mAzHjYXq.js.map
+//# sourceMappingURL=copy-button-DXxn-YYZ.js.map

package/dist/chunks/{copy-button-mAzHjYXq.js.map → copy-button-DXxn-YYZ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"copy-button-mAzHjYXq.js","names":["__icon_Tick02Icon","__icon_Copy01Icon","cn","useUiText","Icon","useTruncated","Button","useCopy","KAESO_COPY_BUTTON_VARIANTS","KAESO_COPY_BUTTON_DEFAULT_VARIANTS","CopyButton","labelProp","props","hover","setHover","useState","t","label","done","Tooltip","copied","Tick02Icon","Copy01Icon","copy","value","onCopy","KAESO_CLIPBOARD_TEXT_VARIANTS","KAESO_CLIPBOARD_TEXT_DEFAULT_VARIANTS","ClipboardText","size","className","display","InlineCopyText","text","useRef","cut","children"],"sources":["../../src/components/copy-button/copy-button.tsx"],"sourcesContent":["import type * as React from \"react\";\nimport { forwardRef, useRef, useState, type HTMLAttributes, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useCopy } from \"../../hooks/use-copy.js\";\nimport { useTruncated } from \"../../hooks/use-truncated.js\";\nimport { Button, type ButtonSize } from \"../button/button.js\";\nimport { Tooltip } from \"../tooltip/tooltip.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Tick02Icon as __icon_Tick02Icon, Copy01Icon as __icon_Copy01Icon } from \"@hugeicons/core-free-icons\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_COPY_BUTTON_VARIANTS = {\n  variant: {\n    ghost: { classes: \"material-ghost\" },\n    secondary: { classes: \"material-secondary\" },\n  },\n  size: {\n    xs: { classes: \"size-24\" },\n    sm: { classes: \"size-32\" },\n    md: { classes: \"size-36\" },\n    lg: { classes: \"size-40\" },\n    xl: { classes: \"size-48\" },\n  },\n} as const;\nexport const KAESO_COPY_BUTTON_DEFAULT_VARIANTS = { variant: \"ghost\", size: \"sm\" } as const;\n\nexport interface CopyButtonProps {\n  value: string;\n  label?: string | undefined;\n  size?: ButtonSize | undefined;\n  variant?: keyof typeof KAESO_COPY_BUTTON_VARIANTS.variant | undefined;\n  onCopy?: ((value: string) => void) | undefined;\n  className?: string | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const CopyButton = /* @__PURE__ */ forwardRef<HTMLButtonElement, CopyButtonProps>(function CopyButton(\n  { value, label: labelProp, size = \"sm\", variant = \"ghost\", onCopy, className, ...props },\n  ref,\n) {\n  const { copied, copy } = useCopy();\n  const [hover, setHover] = useState(false);\n  const t = useUiText();\n  const label = labelProp ?? t(\"copyButton.copy\", \"Copy\");\n  const done = t(\"copyButton.copied\", \"Copied\");\n  return (\n    <Tooltip content={copied ? done : label} open={copied || hover} onOpenChange={setHover}>\n      <Button\n        ref={ref as React.Ref<HTMLButtonElement & HTMLAnchorElement>}\n        shape=\"circle\"\n        size={size}\n        variant={variant}\n        icon={copied ? __icon_Tick02Icon : __icon_Copy01Icon}\n        aria-label={copied ? done : label}\n        className={className}\n        onClick={async () => {\n          if (await copy(value)) onCopy?.(value);\n        }}\n        {...props}\n      />\n    </Tooltip>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") CopyButton.displayName = \"CopyButton\";\n\nexport const KAESO_CLIPBOARD_TEXT_VARIANTS = {\n  size: {\n    sm: { classes: \"h-32 pl-12 pr-0 text-small\" },\n    md: { classes: \"h-36 pl-16 pr-2 text-small\" },\n    lg: { classes: \"h-40 pl-18 pr-4 text-small\" },\n  },\n} as const;\nexport const KAESO_CLIPBOARD_TEXT_DEFAULT_VARIANTS = { size: \"md\" } as const;\n\nexport interface ClipboardTextProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n  value: string;\n  display?: ReactNode | undefined;\n  label?: string | undefined;\n  size?: keyof typeof KAESO_CLIPBOARD_TEXT_VARIANTS.size | undefined;\n}\n\nexport const ClipboardText = /* @__PURE__ */ forwardRef<HTMLDivElement, ClipboardTextProps>(function ClipboardText(\n  { value, display, label, size = \"md\", className, ...props },\n  ref,\n) {\n  return (\n    <div\n      ref={ref}\n      className={cn(\"inline-flex min-w-0 max-w-full items-center gap-8 rounded-pill bg-fill-1\", KAESO_CLIPBOARD_TEXT_VARIANTS.size[size].classes, className)}\n      {...props}\n    >\n      <span className=\"mono min-w-0 flex-1 truncate text-fg select-all\">{display ?? value}</span>\n      <CopyButton value={value} label={label} size=\"sm\" />\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") ClipboardText.displayName = \"ClipboardText\";\n\nexport interface InlineCopyTextProps extends Omit<HTMLAttributes<HTMLButtonElement>, \"children\" | \"onCopy\"> {\n  value: string;\n  children?: ReactNode | undefined;\n  label?: string | undefined;\n  onCopy?: ((value: string) => void) | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const InlineCopyText = /* @__PURE__ */ forwardRef<HTMLButtonElement, InlineCopyTextProps>(function InlineCopyText(\n  { value, children, label, onCopy, className, ...props },\n  ref,\n) {\n  const { copied, copy } = useCopy();\n  const [hover, setHover] = useState(false);\n  const text = useRef<HTMLSpanElement>(null);\n  const cut = useTruncated(text);\n  const t = useUiText();\n  const done = t(\"copyButton.copied\", \"Copied\");\n  return (\n    <Tooltip\n      content={copied ? done : cut ? value : (label ?? t(\"copyButton.copy\", \"Copy\"))}\n      shape={cut && !copied ? \"multiline\" : \"pill\"}\n      open={copied || hover}\n      onOpenChange={setHover}\n    >\n      <button\n        ref={ref}\n        type=\"button\"\n        onClick={async () => {\n          if (await copy(value)) onCopy?.(value);\n        }}\n        className={cn(\n          \"group/copy relative -mx-4 inline-flex max-w-full min-w-0 items-center gap-4 rounded-code px-4 align-baseline mono text-small text-fg transition-control focus-ring tap-target\",\n          \"hover:bg-fill-1 active:bg-fill-2 cursor-copy\",\n          className,\n        )}\n        {...props}\n      >\n        <span ref={text} className=\"min-w-0 truncate\">\n          {children ?? value}\n        </span>\n        <Icon\n          icon={copied ? __icon_Tick02Icon : __icon_Copy01Icon}\n          size=\"xs\"\n          className={cn(\n            \"text-fg-tertiary opacity-0 transition-control group-hover/copy:opacity-100 coarse:opacity-100 group-focus-visible/copy:opacity-100\",\n            copied && \"opacity-100 text-fg\",\n          )}\n        />\n        <span className=\"sr-only\" aria-live=\"polite\">\n          {copied ? done : \"\"}\n        </span>\n      </button>\n    </Tooltip>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") InlineCopyText.displayName = \"InlineCopyText\";\n"],"mappings":"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"}
+{"version":3,"file":"copy-button-DXxn-YYZ.js","names":["__icon_Tick02Icon","__icon_Copy01Icon","cn","useUiText","Icon","useTruncated","Button","useCopy","KAESO_COPY_BUTTON_VARIANTS","KAESO_COPY_BUTTON_DEFAULT_VARIANTS","CopyButton","labelProp","props","hover","setHover","useState","t","label","done","Tooltip","copied","Tick02Icon","Copy01Icon","copy","value","onCopy","KAESO_CLIPBOARD_TEXT_VARIANTS","KAESO_CLIPBOARD_TEXT_DEFAULT_VARIANTS","ClipboardText","size","className","display","InlineCopyText","text","useRef","cut","children"],"sources":["../../src/components/copy-button/copy-button.tsx"],"sourcesContent":["import type * as React from \"react\";\nimport { forwardRef, useRef, useState, type HTMLAttributes, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useCopy } from \"../../hooks/use-copy.js\";\nimport { useTruncated } from \"../../hooks/use-truncated.js\";\nimport { Button, type ButtonSize } from \"../button/button.js\";\nimport { Tooltip } from \"../tooltip/tooltip.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Tick02Icon as __icon_Tick02Icon, Copy01Icon as __icon_Copy01Icon } from \"@hugeicons/core-free-icons\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_COPY_BUTTON_VARIANTS = {\n  variant: {\n    ghost: { classes: \"material-ghost\" },\n    secondary: { classes: \"material-secondary\" },\n  },\n  size: {\n    xs: { classes: \"size-24\" },\n    sm: { classes: \"size-32\" },\n    md: { classes: \"size-36\" },\n    lg: { classes: \"size-40\" },\n    xl: { classes: \"size-48\" },\n  },\n} as const;\nexport const KAESO_COPY_BUTTON_DEFAULT_VARIANTS = { variant: \"ghost\", size: \"sm\" } as const;\n\nexport interface CopyButtonProps {\n  value: string;\n  label?: string | undefined;\n  size?: ButtonSize | undefined;\n  variant?: keyof typeof KAESO_COPY_BUTTON_VARIANTS.variant | undefined;\n  onCopy?: ((value: string) => void) | undefined;\n  className?: string | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const CopyButton = /* @__PURE__ */ forwardRef<HTMLButtonElement, CopyButtonProps>(function CopyButton(\n  { value, label: labelProp, size = \"sm\", variant = \"ghost\", onCopy, className, ...props },\n  ref,\n) {\n  const { copied, copy } = useCopy();\n  const [hover, setHover] = useState(false);\n  const t = useUiText();\n  const label = labelProp ?? t(\"copyButton.copy\", \"Copy\");\n  const done = t(\"copyButton.copied\", \"Copied\");\n  return (\n    <Tooltip content={copied ? done : label} open={copied || hover} onOpenChange={setHover}>\n      <Button\n        ref={ref as React.Ref<HTMLButtonElement & HTMLAnchorElement>}\n        shape=\"circle\"\n        size={size}\n        variant={variant}\n        icon={copied ? __icon_Tick02Icon : __icon_Copy01Icon}\n        aria-label={copied ? done : label}\n        className={className}\n        onClick={async () => {\n          if (await copy(value)) onCopy?.(value);\n        }}\n        {...props}\n      />\n    </Tooltip>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") CopyButton.displayName = \"CopyButton\";\n\nexport const KAESO_CLIPBOARD_TEXT_VARIANTS = {\n  size: {\n    sm: { classes: \"h-32 pl-12 pr-0 text-small\" },\n    md: { classes: \"h-36 pl-16 pr-2 text-small\" },\n    lg: { classes: \"h-40 pl-18 pr-4 text-small\" },\n  },\n} as const;\nexport const KAESO_CLIPBOARD_TEXT_DEFAULT_VARIANTS = { size: \"md\" } as const;\n\nexport interface ClipboardTextProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n  value: string;\n  display?: ReactNode | undefined;\n  label?: string | undefined;\n  size?: keyof typeof KAESO_CLIPBOARD_TEXT_VARIANTS.size | undefined;\n}\n\nexport const ClipboardText = /* @__PURE__ */ forwardRef<HTMLDivElement, ClipboardTextProps>(function ClipboardText(\n  { value, display, label, size = \"md\", className, ...props },\n  ref,\n) {\n  return (\n    <div\n      ref={ref}\n      className={cn(\"inline-flex min-w-0 max-w-full items-center gap-8 rounded-pill bg-fill-1\", KAESO_CLIPBOARD_TEXT_VARIANTS.size[size].classes, className)}\n      {...props}\n    >\n      <span className=\"mono min-w-0 flex-1 truncate text-fg select-all\">{display ?? value}</span>\n      <CopyButton value={value} label={label} size=\"sm\" />\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") ClipboardText.displayName = \"ClipboardText\";\n\nexport interface InlineCopyTextProps extends Omit<HTMLAttributes<HTMLButtonElement>, \"children\" | \"onCopy\"> {\n  value: string;\n  children?: ReactNode | undefined;\n  label?: string | undefined;\n  onCopy?: ((value: string) => void) | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const InlineCopyText = /* @__PURE__ */ forwardRef<HTMLButtonElement, InlineCopyTextProps>(function InlineCopyText(\n  { value, children, label, onCopy, className, ...props },\n  ref,\n) {\n  const { copied, copy } = useCopy();\n  const [hover, setHover] = useState(false);\n  const text = useRef<HTMLSpanElement>(null);\n  const cut = useTruncated(text);\n  const t = useUiText();\n  const done = t(\"copyButton.copied\", \"Copied\");\n  return (\n    <Tooltip\n      content={copied ? done : cut ? value : (label ?? t(\"copyButton.copy\", \"Copy\"))}\n      shape={cut && !copied ? \"multiline\" : \"pill\"}\n      open={copied || hover}\n      onOpenChange={setHover}\n    >\n      <button\n        ref={ref}\n        type=\"button\"\n        onClick={async () => {\n          if (await copy(value)) onCopy?.(value);\n        }}\n        className={cn(\n          \"group/copy relative -mx-4 inline-flex max-w-full min-w-0 items-center gap-4 rounded-code px-4 align-baseline mono text-small text-fg transition-control focus-ring tap-target\",\n          \"hover:bg-fill-1 active:bg-fill-2 cursor-copy\",\n          className,\n        )}\n        {...props}\n      >\n        <span ref={text} className=\"min-w-0 truncate\">\n          {children ?? value}\n        </span>\n        <Icon\n          icon={copied ? __icon_Tick02Icon : __icon_Copy01Icon}\n          size=\"xs\"\n          className={cn(\n            \"text-fg-tertiary opacity-0 transition-control group-hover/copy:opacity-100 coarse:opacity-100 group-focus-visible/copy:opacity-100\",\n            copied && \"opacity-100 text-fg\",\n          )}\n        />\n        <span className=\"sr-only\" aria-live=\"polite\">\n          {copied ? done : \"\"}\n        </span>\n      </button>\n    </Tooltip>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") InlineCopyText.displayName = \"InlineCopyText\";\n"],"mappings":"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"}