@logicplanes/kaeso-ui 0.4.0 → 0.4.2

package/dist/chunks/code-block-U5fCqwgC.js

@@ -0,0 +1,330 @@
+"use client";
+import { t as e } from "./cn-Dj6sRgkF.js";
+import { i as t } from "./context-BELWW79w.js";
+import { t as n } from "./observe-resize-DhxhmoyB.js";
+import { n as r } from "./copy-button-7-irieJw.js";
+import { forwardRef as i, useEffect as a, useMemo as o, useRef as s, useState as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { Tabs as d } from "@base-ui/react/tabs";
+//#region src/components/code-block/kaeso-theme.ts
+var f = {
+	text: {
+		color: "var(--k-text)",
+		className: ""
+	},
+	quiet: {
+		color: "var(--k-text-tertiary)",
+		className: "text-fg-tertiary"
+	},
+	secondary: {
+		color: "var(--k-text-secondary)",
+		className: "text-fg-secondary"
+	},
+	string: {
+		color: "var(--k-info-text)",
+		className: "text-info-text"
+	},
+	constant: {
+		color: "var(--k-warning-text)",
+		className: "text-warning-text"
+	}
+}, p = 1, m = 2;
+function h(e, t) {
+	let n = t ?? 0;
+	return [
+		Object.values(f).find((t) => t.color === e?.toLowerCase())?.className ?? "",
+		n & p ? "italic" : "",
+		n & m ? "font-semibold" : ""
+	].filter(Boolean).join(" ");
+}
+var g = {
+	name: "kaeso",
+	type: "light",
+	colors: {
+		"editor.background": "transparent",
+		"editor.foreground": f.text.color
+	},
+	settings: [
+		{ settings: {
+			foreground: f.text.color,
+			background: "transparent"
+		} },
+		{
+			scope: ["comment", "punctuation.definition.comment"],
+			settings: {
+				foreground: f.quiet.color,
+				fontStyle: "italic"
+			}
+		},
+		{
+			scope: [
+				"string",
+				"string.quoted",
+				"string.template",
+				"punctuation.definition.string",
+				"markup.inline.raw"
+			],
+			settings: { foreground: f.string.color }
+		},
+		{
+			scope: [
+				"constant.numeric",
+				"constant.language.boolean",
+				"constant.language.null",
+				"constant.language"
+			],
+			settings: { foreground: f.constant.color }
+		},
+		{
+			scope: [
+				"keyword",
+				"storage",
+				"storage.type",
+				"storage.modifier",
+				"keyword.control",
+				"keyword.operator.new",
+				"variable.language"
+			],
+			settings: {
+				foreground: f.text.color,
+				fontStyle: "bold"
+			}
+		},
+		{
+			scope: [
+				"punctuation",
+				"meta.brace",
+				"punctuation.separator",
+				"punctuation.terminator",
+				"keyword.operator",
+				"meta.tag punctuation"
+			],
+			settings: { foreground: f.quiet.color }
+		},
+		{
+			scope: [
+				"entity.name.function",
+				"support.function",
+				"entity.name.tag",
+				"support.class.component"
+			],
+			settings: { foreground: f.text.color }
+		},
+		{
+			scope: [
+				"support.type.property-name",
+				"meta.object-literal.key",
+				"entity.other.attribute-name",
+				"variable.other.property"
+			],
+			settings: { foreground: f.text.color }
+		},
+		{
+			scope: [
+				"entity.name.type",
+				"support.type",
+				"entity.other.inherited-class"
+			],
+			settings: { foreground: f.secondary.color }
+		}
+	]
+}, _ = null, v = 2e3, y = [
+	"ts",
+	"tsx",
+	"js",
+	"json",
+	"bash",
+	"python",
+	"yaml",
+	"diff"
+];
+function b() {
+	return _ ??= (async () => {
+		let [{ createHighlighterCore: e }, { createJavaScriptRegexEngine: t }] = await Promise.all([import("shiki/core"), import("shiki/engine/javascript")]);
+		return await e({
+			themes: [g],
+			langs: [],
+			engine: t()
+		});
+	})().catch((e) => {
+		throw _ = null, e;
+	}), _;
+}
+var x = {
+	ts: () => import("shiki/dist/langs/typescript.mjs"),
+	tsx: () => import("shiki/dist/langs/tsx.mjs"),
+	js: () => import("shiki/dist/langs/javascript.mjs"),
+	json: () => import("shiki/dist/langs/json.mjs"),
+	bash: () => import("shiki/dist/langs/bash.mjs"),
+	python: () => import("shiki/dist/langs/python.mjs"),
+	yaml: () => import("shiki/dist/langs/yaml.mjs"),
+	diff: () => import("shiki/dist/langs/diff.mjs")
+};
+async function S(e, t) {
+	if (t === "text" || e.length > 2e5) return null;
+	let n = await b();
+	if (!n.getLoadedLanguages().includes(t)) {
+		let e = x[t];
+		if (!e) return null;
+		await n.loadLanguage((await e()).default);
+	}
+	return n.codeToTokens(e, {
+		lang: t,
+		theme: "kaeso",
+		tokenizeMaxLineLength: v
+	}).tokens.map((e) => e.map((e) => ({
+		content: e.content,
+		className: h(e.color, e.fontStyle)
+	})));
+}
+//#endregion
+//#region src/components/code-block/indent.ts
+var C = /^[ \t]+/;
+function w(e, t) {
+	let n = t;
+	return e.flatMap((e) => {
+		if (n === 0) return [e];
+		let t = Math.min(n, e.content.length);
+		return n -= t, t === e.content.length ? [] : [{
+			...e,
+			content: e.content.slice(t)
+		}];
+	});
+}
+//#endregion
+//#region src/hooks/use-scroll-fade.ts
+function T(e, t, n) {
+	n > 0 ? e.style.setProperty(t, `${n}px`) : e.style.removeProperty(t);
+}
+function E(e, t, r) {
+	a(() => {
+		let r = e.current;
+		if (!r) return;
+		let i = () => {
+			let e = Math.abs(r.scrollLeft);
+			T(r, "--scroll-area-overflow-x-start", e), T(r, "--scroll-area-overflow-x-end", r.scrollWidth - r.clientWidth - e);
+		};
+		i(), r.addEventListener("scroll", i, { passive: !0 });
+		let a = r.querySelector(t), o = n(a ? [r, a] : [r], i);
+		return () => {
+			r.removeEventListener("scroll", i), o();
+		};
+	}, [
+		e,
+		t,
+		r
+	]);
+}
+//#endregion
+//#region src/components/code-block/code-block.tsx
+var D = { surface: {
+	well: { classes: "rounded-well bg-fill-1" },
+	plain: { classes: "bg-transparent" }
+} }, O = { surface: "well" }, k = /* @__PURE__ */ i(function({ code: n = "", lang: i = "ts", tabs: f, tab: p, onTabChange: m, title: h, lineNumbers: g, highlightLines: _ = [], collapseAfter: v = 24, surface: y = "well", copy: b = !0, wrap: x = !1, className: T }, O) {
+	let [k, A] = c(0), j = p === void 0 ? -1 : f?.findIndex((e) => e.label === p) ?? -1, M = j >= 0 ? j : k, N = (e) => {
+		A(e);
+		let t = f?.[e]?.label;
+		t !== void 0 && m?.(t);
+	}, P = t(), F = f?.[M] ?? {
+		label: "",
+		code: n,
+		lang: i
+	}, I = F.code.replace(/\n$/, ""), L = o(() => I.split("\n"), [I]), [R, z] = c(null), [B, V] = c(!1);
+	a(() => {
+		let e = !0, t = F.lang ?? "ts";
+		return S(I, t).then((n) => e && z({
+			text: I,
+			lang: t,
+			tokens: n
+		})).catch(() => void 0), () => {
+			e = !1;
+		};
+	}, [I, F.lang]);
+	let H = R && R.lang === (F.lang ?? "ts") && R.text === I ? R.tokens : null, U = v > 0 && L.length > v && !B, W = U ? v : L.length, G = s(null);
+	E(G, "code", !!f);
+	let K = e("relative overflow-x-auto py-16 scrollbar-quiet scroll-fade-x focus-ring-inset", U && "overflow-y-hidden", b && "coarse:mr-40"), q = /* @__PURE__ */ l("pre", {
+		className: "mono text-small text-fg",
+		children: /* @__PURE__ */ l("code", {
+			className: e("grid", !x && "min-w-max", x === "phone" && "sm:min-w-max"),
+			children: L.slice(0, W).map((t, n) => /* @__PURE__ */ u("span", {
+				className: e("flex px-16 leading-code", x === !0 && "whitespace-pre-wrap wrap-anywhere", x === "phone" && "max-sm:whitespace-pre-wrap max-sm:wrap-anywhere", _.includes(n + 1) && "bg-fill-2"),
+				children: [
+					g && /* @__PURE__ */ l("span", {
+						className: "mr-16 inline-block w-24 shrink-0 text-right text-fg-tertiary select-none tabular",
+						children: n + 1
+					}),
+					x && C.test(t) && /* @__PURE__ */ l("span", {
+						className: "shrink-0 whitespace-pre",
+						children: C.exec(t)?.[0]
+					}),
+					/* @__PURE__ */ l("span", {
+						className: e("min-w-0", x === !0 && "pl-16 -indent-16", x === "phone" && "max-sm:pl-16 max-sm:-indent-16"),
+						children: H?.[n]?.length ? w(H[n], x ? C.exec(t)?.[0].length ?? 0 : 0).map((e, t) => /* @__PURE__ */ l("span", {
+							className: e.className || void 0,
+							children: e.content
+						}, t)) : (x ? t.replace(C, "") : t) || " "
+					})
+				]
+			}, n))
+		})
+	});
+	return /* @__PURE__ */ u("div", {
+		ref: O,
+		className: e("group/code relative min-w-0", D.surface[y].classes, T),
+		children: [
+			/* @__PURE__ */ u(d.Root, {
+				value: M,
+				onValueChange: (e) => N(Number(e)),
+				children: [(h || f) && /* @__PURE__ */ u("div", {
+					className: "flex h-44 items-center gap-4 px-8 hairline-b",
+					children: [h && /* @__PURE__ */ l("span", {
+						className: "px-8 mono text-small text-fg-secondary",
+						children: h
+					}), f && /* @__PURE__ */ l(d.List, {
+						"aria-label": P("codeBlock.language", "Language"),
+						className: "flex items-center gap-2",
+						children: f.map((t, n) => /* @__PURE__ */ l(d.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 === M ? "bg-fill-2 text-fg" : "text-fg-secondary hover:bg-fill-2 hover:text-fg"),
+							children: t.label
+						}, t.label))
+					})]
+				}), f ? /* @__PURE__ */ l(d.Panel, {
+					ref: G,
+					value: M,
+					className: K,
+					children: q
+				}) : /* @__PURE__ */ l("div", {
+					ref: G,
+					tabIndex: 0,
+					role: "region",
+					"aria-label": typeof h == "string" ? P("codeBlock.titledCode", "{title} code", { title: h }) : P("codeBlock.code", "Code"),
+					className: K,
+					children: q
+				})]
+			}),
+			v > 0 && L.length > v && /* @__PURE__ */ l("div", {
+				className: "flex justify-center pb-12",
+				children: /* @__PURE__ */ l("button", {
+					type: "button",
+					onClick: () => V((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: B ? P("codeBlock.showLess", "Show less") : P("codeBlock.showAllLines", "Show all {count} lines", { count: String(L.length) })
+				})
+			}),
+			b && /* @__PURE__ */ l("div", {
+				className: e("absolute right-8 opacity-0 transition-control group-hover/code:opacity-100 coarse:opacity-100 focus-within:opacity-100", h || f ? "top-52" : "top-8"),
+				children: /* @__PURE__ */ l(r, {
+					value: I,
+					label: P("codeBlock.copy", "Copy code")
+				})
+			})
+		]
+	});
+});
+process.env.NODE_ENV !== "production" && (k.displayName = "CodeBlock");
+var A = k;
+//#endregion
+export { y as a, D as i, A as n, S as o, O as r, g as s, k as t };
+
+//# sourceMappingURL=code-block-U5fCqwgC.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"code-block-U5fCqwgC.js","names":["BaseTabs","cn","useUiText","observeResize","CopyButton","TONES","ITALIC","BOLD","codeTokenClass","style","fontStyle","tone","color","kaesoShikiTheme","instance","HIGHLIGHT_MAX_LINE","CODE_LANGS","getHighlighter","createHighlighterCore","createJavaScriptRegexEngine","error","LOADERS","highlight","lang","code","h","loader","line","token","INDENT","dropIndent","left","n","tokens","t","cut","setLength","px","el","name","useScrollFadeX","ref","update","start","inner","content","stop","key","KAESO_CODE_BLOCK_VARIANTS","KAESO_CODE_BLOCK_DEFAULT_VARIANTS","CodeBlock","chosen","own","setOwn","useState","match","tabs","item","tab","choose","i","label","onTabChange","current","text","lines","useMemo","highlighted","setHighlighted","expanded","setExpanded","alive","tokenLines","collapsed","collapseAfter","visible","scroller","useRef","codeClass","copy","source","wrap","highlightLines","lineNumbers","j","surface","className","Tabs","v","title","CodeHighlighted"],"sources":["../../src/components/code-block/kaeso-theme.ts","../../src/components/code-block/highlighter.ts","../../src/components/code-block/indent.ts","../../src/hooks/use-scroll-fade.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; tokenizeMaxLineLength?: number | undefined },\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 HIGHLIGHT_MAX_CHARS = 200_000;\n\nconst HIGHLIGHT_MAX_LINE = 2_000;\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  })().catch((error: unknown) => {\n    instance = null;\n    throw error;\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\" || code.length > HIGHLIGHT_MAX_CHARS) 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\", tokenizeMaxLineLength: HIGHLIGHT_MAX_LINE })\n    .tokens.map((line) => line.map((token) => ({ content: token.content, className: codeTokenClass(token.color, token.fontStyle) })));\n}\n","import type { CodeToken } from \"./highlighter.js\";\n\nexport const INDENT = /^[ \\t]+/;\n\nexport function dropIndent(tokens: CodeToken[], n: number): CodeToken[] {\n  let left = n;\n  return tokens.flatMap((t) => {\n    if (left === 0) return [t];\n    const cut = Math.min(left, t.content.length);\n    left -= cut;\n    return cut === t.content.length ? [] : [{ ...t, content: t.content.slice(cut) }];\n  });\n}\n","import { useEffect, type RefObject } from \"react\";\nimport { observeResize } from \"../utils/observe-resize.js\";\n\nfunction setLength(el: HTMLElement, name: string, px: number) {\n  if (px > 0) el.style.setProperty(name, `${px}px`);\n  else el.style.removeProperty(name);\n}\n\nexport function useScrollFadeX(ref: RefObject<HTMLElement | null>, content: string, key?: unknown) {\n  useEffect(() => {\n    const el = ref.current;\n    if (!el) return;\n    const update = () => {\n      const start = Math.abs(el.scrollLeft);\n      setLength(el, \"--scroll-area-overflow-x-start\", start);\n      setLength(el, \"--scroll-area-overflow-x-end\", el.scrollWidth - el.clientWidth - start);\n    };\n    update();\n    el.addEventListener(\"scroll\", update, { passive: true });\n    const inner = el.querySelector(content);\n    const stop = observeResize(inner ? [el, inner] : [el], update);\n    return () => {\n      el.removeEventListener(\"scroll\", update);\n      stop();\n    };\n  }, [ref, content, key]);\n}\n","import { forwardRef, useEffect, useMemo, useRef, 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 { INDENT, dropIndent } from \"./indent.js\";\nimport { useUiText } from \"../../i18n/context.js\";\nimport { useScrollFadeX } from \"../../hooks/use-scroll-fade.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 | \"phone\" | 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 scroller = useRef<HTMLDivElement | null>(null);\n  useScrollFadeX(scroller, \"code\", !!tabs);\n  const codeClass = cn(\n    \"relative overflow-x-auto py-16 scrollbar-quiet scroll-fade-x focus-ring-inset\",\n    collapsed && \"overflow-y-hidden\",\n    copy && \"coarse:mr-40\",\n  );\n  const source = (\n    <pre className=\"mono text-small text-fg\">\n      <code className={cn(\"grid\", !wrap && \"min-w-max\", wrap === \"phone\" && \"sm:min-w-max\")}>\n        {lines.slice(0, visible).map((line, i) => (\n          <span\n            key={i}\n            className={cn(\n              \"flex px-16 leading-code\",\n              wrap === true && \"whitespace-pre-wrap wrap-anywhere\",\n              wrap === \"phone\" && \"max-sm:whitespace-pre-wrap max-sm:wrap-anywhere\",\n              highlightLines.includes(i + 1) && \"bg-fill-2\",\n            )}\n          >\n            {lineNumbers && <span className=\"mr-16 inline-block w-24 shrink-0 text-right text-fg-tertiary select-none tabular\">{i + 1}</span>}\n            {wrap && INDENT.test(line) && <span className=\"shrink-0 whitespace-pre\">{INDENT.exec(line)?.[0]}</span>}\n            <span className={cn(\"min-w-0\", wrap === true && \"pl-16 -indent-16\", wrap === \"phone\" && \"max-sm:pl-16 max-sm:-indent-16\")}>\n              {tokenLines?.[i]?.length\n                ? dropIndent(tokenLines[i], wrap ? (INDENT.exec(line)?.[0].length ?? 0) : 0).map((token, j) => (\n                    <span key={j} className={token.className || undefined}>\n                      {token.content}\n                    </span>\n                  ))\n                : (wrap ? line.replace(INDENT, \"\") : 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 ref={scroller} value={tab} className={codeClass}>\n            {source}\n          </BaseTabs.Panel>\n        ) : (\n          <div\n            ref={scroller}\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/{code-C49NzHUQ.js → code-tqj0uhBL.js}

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

package/dist/chunks/{code-C49NzHUQ.js.map → code-tqj0uhBL.js.map}

@@ -1 +1 @@
-{"version":3,"file":"code-C49NzHUQ.js","names":["cn","KAESO_CODE_VARIANTS","KAESO_CODE_DEFAULT_VARIANTS","Code","props","oneWord","children","flow","shape","className"],"sources":["../../src/components/code/code.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\n\nexport const KAESO_CODE_VARIANTS = {\n  shape: {\n    auto: { classes: \"\" },\n    pill: { classes: \"rounded-pill\" },\n    rounded: { classes: \"rounded-code\" },\n  },\n  flow: {\n    box: { classes: \"inline-block\" },\n    text: {\n      classes: \"inline box-decoration-clone\",\n    },\n    cell: {\n      classes: \"inline\",\n    },\n  },\n} as const;\nexport const KAESO_CODE_DEFAULT_VARIANTS = { shape: \"auto\", flow: \"box\" } as const;\n\nexport interface CodeProps extends HTMLAttributes<HTMLElement> {\n  shape?: keyof typeof KAESO_CODE_VARIANTS.shape | undefined;\n  flow?: keyof typeof KAESO_CODE_VARIANTS.flow | undefined;\n}\n\nexport const Code = /* @__PURE__ */ forwardRef<HTMLElement, CodeProps>(function Code({ shape = \"auto\", flow = \"box\", className, children, ...props }, ref) {\n  const oneWord = typeof children === \"string\" && !/\\s/.test(children);\n  return (\n    <code\n      ref={ref}\n      className={cn(\n        \"mono bg-fill-1 px-4 py-2 align-baseline text-small leading-none text-fg\",\n        KAESO_CODE_VARIANTS.flow[flow].classes,\n        shape === \"auto\" ? (oneWord ? \"rounded-pill\" : \"rounded-code\") : KAESO_CODE_VARIANTS.shape[shape].classes,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </code>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Code.displayName = \"Code\";\n"],"mappings":";;;;;AAGA,IAAaC,IAAsB;CACjC,OAAO;EACL,MAAM,EAAE,SAAS,GAAG;EACpB,MAAM,EAAE,SAAS,eAAe;EAChC,SAAS,EAAE,SAAS,eAAe;CACrC;CACA,MAAM;EACJ,KAAK,EAAE,SAAS,eAAe;EAC/B,MAAM,EACJ,SAAS,8BACX;EACA,MAAM,EACJ,SAAS,SACX;CACF;AACF,GACaC,IAA8B;CAAE,OAAO;CAAQ,MAAM;AAAM,GAO3DC,IAAuB,kBAAmC,SAAc,EAAE,WAAQ,QAAQ,UAAO,OAAO,cAAW,aAAU,GAAGC,KAAS,GAAK;CACzJ,IAAMC,IAAU,OAAOC,KAAa,YAAY,CAAC,KAAK,KAAKA,CAAQ;CACnE,OACE,kBAAC,QAAD;EACO;EACL,WAAWN,EACT,2EACAC,EAAoB,KAAKM,EAAK,CAAC,SAC/BC,MAAU,SAAUH,IAAU,iBAAiB,iBAAkBJ,EAAoB,MAAMO,EAAM,CAAC,SAClGC,CACF;EACA,GAAIL;EAEH;CACG,CAAA;AAEV,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAK,cAAc"}
+{"version":3,"file":"code-tqj0uhBL.js","names":["cn","KAESO_CODE_VARIANTS","KAESO_CODE_DEFAULT_VARIANTS","Code","props","oneWord","children","flow","shape","className"],"sources":["../../src/components/code/code.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\n\nexport const KAESO_CODE_VARIANTS = {\n  shape: {\n    auto: { classes: \"\" },\n    pill: { classes: \"rounded-pill\" },\n    rounded: { classes: \"rounded-code\" },\n  },\n  flow: {\n    box: { classes: \"inline-block\" },\n    text: {\n      classes: \"inline box-decoration-clone\",\n    },\n    cell: {\n      classes: \"inline\",\n    },\n  },\n} as const;\nexport const KAESO_CODE_DEFAULT_VARIANTS = { shape: \"auto\", flow: \"box\" } as const;\n\nexport interface CodeProps extends HTMLAttributes<HTMLElement> {\n  shape?: keyof typeof KAESO_CODE_VARIANTS.shape | undefined;\n  flow?: keyof typeof KAESO_CODE_VARIANTS.flow | undefined;\n}\n\nexport const Code = /* @__PURE__ */ forwardRef<HTMLElement, CodeProps>(function Code({ shape = \"auto\", flow = \"box\", className, children, ...props }, ref) {\n  const oneWord = typeof children === \"string\" && !/\\s/.test(children);\n  return (\n    <code\n      ref={ref}\n      className={cn(\n        \"mono bg-fill-1 px-4 py-2 align-baseline text-small leading-none text-fg\",\n        KAESO_CODE_VARIANTS.flow[flow].classes,\n        shape === \"auto\" ? (oneWord ? \"rounded-pill\" : \"rounded-code\") : KAESO_CODE_VARIANTS.shape[shape].classes,\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </code>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Code.displayName = \"Code\";\n"],"mappings":";;;;;AAGA,IAAaC,IAAsB;CACjC,OAAO;EACL,MAAM,EAAE,SAAS,GAAG;EACpB,MAAM,EAAE,SAAS,eAAe;EAChC,SAAS,EAAE,SAAS,eAAe;CACrC;CACA,MAAM;EACJ,KAAK,EAAE,SAAS,eAAe;EAC/B,MAAM,EACJ,SAAS,8BACX;EACA,MAAM,EACJ,SAAS,SACX;CACF;AACF,GACaC,IAA8B;CAAE,OAAO;CAAQ,MAAM;AAAM,GAO3DC,IAAuB,kBAAmC,SAAc,EAAE,WAAQ,QAAQ,UAAO,OAAO,cAAW,aAAU,GAAGC,KAAS,GAAK;CACzJ,IAAMC,IAAU,OAAOC,KAAa,YAAY,CAAC,KAAK,KAAKA,CAAQ;CACnE,OACE,kBAAC,QAAD;EACO;EACL,WAAWN,EACT,2EACAC,EAAoB,KAAKM,EAAK,CAAC,SAC/BC,MAAU,SAAUH,IAAU,iBAAiB,iBAAkBJ,EAAoB,MAAMO,EAAM,CAAC,SAClGC,CACF;EACA,GAAIL;EAEH;CACG,CAAA;AAEV,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAK,cAAc"}

package/dist/chunks/{collapsible-CDQq1Y9x.js → collapsible-CKrCX_T9.js}

@@ -1,6 +1,6 @@
 "use client";
-import { t as e } from "./cn-DUDmdLpZ.js";
-import { t } from "./icon-BqujXDUc.js";
+import { t as e } from "./cn-Dj6sRgkF.js";
+import { t } from "./icon-D7ja-_Yk.js";
 import { forwardRef as n } from "react";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 import { ArrowDown01Icon as a, ArrowRight01Icon as o } from "@hugeicons/core-free-icons";
@@ -10,34 +10,34 @@ import { Accordion as c } from "@base-ui/react/accordion";
 var l = { state: {
 	closed: { classes: "" },
 	open: { classes: "group-data-panel-open/dt:rotate-90" }
-} }, u = { state: "closed" }, d = "group/dt flex min-h-40 w-full cursor-pointer items-center gap-8 rounded-item px-12 text-left text-body font-medium text-fg transition-control hover:bg-fill-1 focus-ring-inset", f = /* @__PURE__ */ n(function({ title: n, children: a, open: c, defaultOpen: u, onOpenChange: f, hint: p, className: m }, h) {
+} }, u = { state: "closed" }, d = "group/dt flex min-h-40 w-full cursor-pointer items-center gap-8 rounded-item px-12 text-left text-body font-medium text-fg transition-control hover:bg-fill-1 focus-ring-inset", f = /* @__PURE__ */ n(function({ title: n, children: a, open: c, defaultOpen: u, onOpenChange: d, hint: f, className: p }, m) {
 	return /* @__PURE__ */ i(s.Root, {
-		ref: h,
+		ref: m,
 		...c === void 0 ? {} : { open: c },
 		...u === void 0 ? {} : { defaultOpen: u },
-		...f ? { onOpenChange: (e) => f(e) } : {},
-		className: e("flex flex-col", m),
+		...d ? { onOpenChange: (e) => d(e) } : {},
+		className: e("flex flex-col", p),
 		children: [/* @__PURE__ */ i(s.Trigger, {
-			className: d,
+			className: "group/dt flex min-h-40 w-full cursor-pointer items-center gap-8 rounded-item text-left text-body font-medium text-fg focus-ring",
 			children: [
 				/* @__PURE__ */ r(t, {
 					icon: o,
 					size: "sm",
-					className: e("text-fg-tertiary transition-transform duration-180 ease-overlay", l.state.open.classes)
+					className: e("text-fg-tertiary transition-transform duration-180 ease-overlay group-hover/dt:text-fg", l.state.open.classes)
 				}),
 				/* @__PURE__ */ r("span", {
 					className: "min-w-0 flex-1",
 					children: n
 				}),
-				p && /* @__PURE__ */ r("span", {
-					className: "text-small font-regular text-fg-secondary",
-					children: p
+				f && /* @__PURE__ */ r("span", {
+					className: "text-small font-regular text-fg-secondary transition-control group-hover/dt:text-fg",
+					children: f
 				})
 			]
 		}), /* @__PURE__ */ r(s.Panel, {
 			className: "collapse-motion",
 			children: /* @__PURE__ */ r("div", {
-				className: "pt-4 pr-12 pb-12 pl-36",
+				className: "pt-4 pb-12 pl-24",
 				children: a
 			})
 		})]
@@ -84,4 +84,4 @@ process.env.NODE_ENV !== "production" && (p.displayName = "Accordion");
 //#endregion
 export { l as i, f as n, u as r, p as t };
 
-//# sourceMappingURL=collapsible-CDQq1Y9x.js.map
+//# sourceMappingURL=collapsible-CKrCX_T9.js.map

package/dist/chunks/collapsible-CKrCX_T9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible-CKrCX_T9.js","names":["Collapsible","BaseCollapsible","__icon_ArrowRight01Icon","Accordion","BaseAccordion","__icon_ArrowDown01Icon","cn","KAESO_COLLAPSIBLE_VARIANTS","KAESO_COLLAPSIBLE_DEFAULT_VARIANTS","TRIGGER","Collapsible$1","Collapsible","open","defaultOpen","onOpenChange","o","className","Icon","ArrowRight01Icon","title","hint","Accordion$1","Accordion","multiple","defaultValue","items","it","ArrowDown01Icon"],"sources":["../../src/components/collapsible/collapsible.tsx"],"sourcesContent":["import { forwardRef, type ReactNode } from \"react\";\nimport { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\nimport { Accordion as BaseAccordion } from \"@base-ui/react/accordion\";\nimport { cn } from \"../../utils/cn.js\";\nimport { ArrowRight01Icon as __icon_ArrowRight01Icon, ArrowDown01Icon as __icon_ArrowDown01Icon } from \"@hugeicons/core-free-icons\";\nimport { Icon } from \"../icon/icon.js\";\n\nexport const KAESO_COLLAPSIBLE_VARIANTS = {\n  state: {\n    closed: { classes: \"\" },\n    open: { classes: \"group-data-panel-open/dt:rotate-90\" },\n  },\n} as const;\nexport const KAESO_COLLAPSIBLE_DEFAULT_VARIANTS = { state: \"closed\" } as const;\n\nconst TRIGGER =\n  \"group/dt flex min-h-40 w-full cursor-pointer items-center gap-8 rounded-item px-12 text-left text-body font-medium text-fg transition-control hover:bg-fill-1 focus-ring-inset\";\n\nexport interface CollapsibleProps {\n  title: ReactNode;\n  children: ReactNode;\n  open?: boolean | undefined;\n  defaultOpen?: boolean | undefined;\n  onOpenChange?: ((open: boolean) => void) | undefined;\n  hint?: ReactNode | undefined;\n  className?: string | undefined;\n}\n\nexport const Collapsible = /* @__PURE__ */ forwardRef<HTMLDivElement, CollapsibleProps>(function Collapsible(\n  { title, children, open, defaultOpen, onOpenChange, hint, className },\n  ref,\n) {\n  return (\n    <BaseCollapsible.Root\n      ref={ref}\n      {...(open !== undefined ? { open } : {})}\n      {...(defaultOpen !== undefined ? { defaultOpen } : {})}\n      {...(onOpenChange ? { onOpenChange: (o: boolean) => onOpenChange(o) } : {})}\n      className={cn(\"flex flex-col\", className)}\n    >\n      <BaseCollapsible.Trigger className=\"group/dt flex min-h-40 w-full cursor-pointer items-center gap-8 rounded-item text-left text-body font-medium text-fg focus-ring\">\n        <Icon\n          icon={__icon_ArrowRight01Icon}\n          size=\"sm\"\n          className={cn(\n            \"text-fg-tertiary transition-transform duration-180 ease-overlay group-hover/dt:text-fg\",\n            KAESO_COLLAPSIBLE_VARIANTS.state.open.classes,\n          )}\n        />\n        <span className=\"min-w-0 flex-1\">{title}</span>\n        {hint && <span className=\"text-small font-regular text-fg-secondary transition-control group-hover/dt:text-fg\">{hint}</span>}\n      </BaseCollapsible.Trigger>\n      <BaseCollapsible.Panel className=\"collapse-motion\">\n        <div className=\"pt-4 pb-12 pl-24\">{children}</div>\n      </BaseCollapsible.Panel>\n    </BaseCollapsible.Root>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Collapsible.displayName = \"Collapsible\";\n\nexport interface AccordionItem {\n  value: string;\n  title: ReactNode;\n  content: ReactNode;\n  hint?: ReactNode | undefined;\n}\n\nexport interface AccordionProps {\n  items: AccordionItem[];\n  multiple?: boolean | undefined;\n  defaultValue?: string[] | undefined;\n  className?: string | undefined;\n}\n\nexport const Accordion = /* @__PURE__ */ forwardRef<HTMLDivElement, AccordionProps>(function Accordion({ items, multiple = false, defaultValue, className }, ref) {\n  return (\n    <BaseAccordion.Root\n      ref={ref}\n      {...(multiple ? { multiple: true } : {})}\n      {...(defaultValue ? { defaultValue } : {})}\n      className={cn(\"flex flex-col\", className)}\n    >\n      {items.map((it) => (\n        <BaseAccordion.Item key={it.value} value={it.value} className=\"hairline-b\">\n          <BaseAccordion.Header>\n            <BaseAccordion.Trigger className={cn(TRIGGER, \"min-h-48\")}>\n              <span className=\"min-w-0 flex-1\">{it.title}</span>\n              {it.hint && <span className=\"text-small font-regular text-fg-secondary\">{it.hint}</span>}\n              <Icon\n                icon={__icon_ArrowDown01Icon}\n                size=\"sm\"\n                className=\"text-fg-tertiary transition-transform duration-180 ease-overlay group-data-panel-open/dt:rotate-180\"\n              />\n            </BaseAccordion.Trigger>\n          </BaseAccordion.Header>\n          <BaseAccordion.Panel className=\"collapse-motion\">\n            <div className=\"px-12 pb-16 text-body text-fg-secondary\">{it.content}</div>\n          </BaseAccordion.Panel>\n        </BaseAccordion.Item>\n      ))}\n    </BaseAccordion.Root>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Accordion.displayName = \"Accordion\";\n"],"mappings":";;;;;;;;;AAOA,IAAaO,IAA6B,EACxC,OAAO;CACL,QAAQ,EAAE,SAAS,GAAG;CACtB,MAAM,EAAE,SAAS,qCAAqC;AACxD,EACF,GACaC,IAAqC,EAAE,OAAO,SAAS,GAE9DC,IACJ,kLAYWT,IAA8B,kBAA6C,SACtF,EAAE,UAAO,aAAU,SAAM,gBAAa,iBAAc,SAAM,gBAC1D,GACA;CACA,OACE,kBAACC,EAAgB,MAAjB;EACO;EACL,GAAKW,MAAS,KAAA,IAAuB,CAAC,IAAZ,EAAE,QAAK;EACjC,GAAKC,MAAgB,KAAA,IAA8B,CAAC,IAAnB,EAAE,eAAY;EAC/C,GAAKC,IAAe,EAAE,eAAe,MAAeA,EAAaC,CAAC,EAAE,IAAI,CAAC;EACzE,WAAWT,EAAG,iBAAiBU,CAAS;EAL1C,UAAA,CAOE,kBAACf,EAAgB,SAAjB;GAAyB,WAAU;GAAnC,UAAA;IACE,kBAACgB,GAAD;KACE,MAAMf;KACN,MAAK;KACL,WAAWI,EACT,0FACAC,EAA2B,MAAM,KAAK,OACxC;IACD,CAAA;IACD,kBAAC,QAAD;KAAM,WAAU;KAAkB,UAAAY;IAAY,CAAA;IAC7CC,KAAQ,kBAAC,QAAD;KAAM,WAAU;KAAuF,UAAAA;IAAW,CAAA;GACpG;EACzB,CAAA,GAAA,kBAACnB,EAAgB,OAAjB;GAAuB,WAAU;GAC/B,UAAA,kBAAC,OAAD;IAAK,WAAU;IAAoB;GAAc,CAAA;EAC5B,CAAA,CACH;;AAE1B,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAY,cAAc;AAgBrE,IAAaE,IAA4B,kBAA2C,SAAmB,EAAE,UAAO,cAAW,IAAO,iBAAc,gBAAa,GAAK;CAChK,OACE,kBAACC,EAAc,MAAf;EACO;EACL,GAAKmB,IAAW,EAAE,UAAU,GAAK,IAAI,CAAC;EACtC,GAAKC,IAAe,EAAE,gBAAa,IAAI,CAAC;EACxC,WAAWlB,EAAG,iBAAiBU,CAAS;EAEvC,UAAAS,EAAM,KAAK,MACV,kBAACrB,EAAc,MAAf;GAAmC,OAAOsB,EAAG;GAAO,WAAU;GAA9D,UAAA,CACE,kBAACtB,EAAc,QAAf,EAAA,UACE,kBAACA,EAAc,SAAf;IAAuB,WAAWE,EAAGG,GAAS,UAAU;IAAxD,UAAA;KACE,kBAAC,QAAD;MAAM,WAAU;MAAkB,UAAAiB,EAAG;KAAY,CAAA;KAChDA,EAAG,QAAQ,kBAAC,QAAD;MAAM,WAAU;MAA6C,UAAAA,EAAG;KAAW,CAAA;KACvF,kBAACT,GAAD;MACE,MAAMZ;MACN,MAAK;MACL,WAAU;KACX,CAAA;IACoB;GACH,CAAA,EAAA,CAAA,GACtB,kBAACD,EAAc,OAAf;IAAqB,WAAU;IAC7B,UAAA,kBAAC,OAAD;KAAK,WAAU;KAA2C,UAAAsB,EAAG;IAAa,CAAA;GACvD,CAAA,CACH;EAfK,GAAAA,EAAG,KAeR,CACrB;CACiB,CAAA;AAExB,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAU,cAAc"}

package/dist/chunks/{combobox-B9ttar4C.js → combobox-BARyrpXH.js}

@@ -1,13 +1,13 @@
 "use client";
 import { i as e, o as t, r as n } from "./styles-CVJU9t9v.js";
-import { t as r } from "./cn-DUDmdLpZ.js";
+import { t as r } from "./cn-Dj6sRgkF.js";
 import { i } from "./dev-CR1p7gCm.js";
 import { n as ee, r as te } from "./portal-context-BBbzDKmY.js";
 import { i as a } from "./context-BELWW79w.js";
-import { t as o } from "./icon-BqujXDUc.js";
-import { a as s, o as ne, s as re } from "./field-BZriODU7.js";
-import { i as c } from "./input-group-BoxjnN8I.js";
-import { a as l } from "./tag-XgPXKoxi.js";
+import { t as o } from "./icon-D7ja-_Yk.js";
+import { a as s, o as ne, s as re } from "./field-TviMvYa2.js";
+import { i as c } from "./input-group-CUSNsQjQ.js";
+import { a as l } from "./tag-DNdX1XRR.js";
 import { n as ie, t as ae } from "./use-layout-width-CbSDbRb0.js";
 import { forwardRef as u, useEffect as d, useMemo as f, useRef as p, useState as m } from "react";
 import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
@@ -311,4 +311,4 @@ process.env.NODE_ENV !== "production" && (O.displayName = "Autocomplete");
 //#endregion
 export { w as a, T as i, D as n, E as r, O as t };
 
-//# sourceMappingURL=combobox-B9ttar4C.js.map
+//# sourceMappingURL=combobox-BARyrpXH.js.map