@adea-ai/ui 0.60.3 → 0.61.0

package/dist/components/ui/code-block/code-block.js

@@ -0,0 +1,186 @@
+import { cn } from "../../../lib/utils.js";
+import { Button } from "../button/button.js";
+import { createComponent, effect, insert, memo, mergeProps, setAttribute, setStyleProperty, spread, template, use } from "solid-js/web";
+import { Check, Copy } from "lucide-solid";
+import { For, Show, createMemo, createSignal, splitProps } from "solid-js";
+//#region src/components/ui/code-block/code-block.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div class="flex items-center gap-1 opacity-0 transition-opacity group-focus-within/code:opacity-100 group-hover/code:opacity-100">`);
+var _tmpl$2 = /*#__PURE__*/ template(`<p class="px-3 pb-2 text-xs text-muted-foreground italic">Generating…`);
+var _tmpl$3 = /*#__PURE__*/ template(`<div data-code-block-footer class="flex items-center justify-end border-t border-transparent px-3 py-1 transition-colors group-focus-within/code:border-border group-hover/code:border-border">`);
+var _tmpl$4 = /*#__PURE__*/ template(`<div><div class="flex items-center justify-between gap-2 px-3 py-1"><span class="truncate font-mono text-xs text-muted-foreground"></span></div><div class="scroll-fade overflow-x-auto"tabindex=0 role=region>`);
+var _tmpl$5 = /*#__PURE__*/ template(`<pre class="m-0 px-3 py-2"><code class="font-mono text-xs">`);
+var _tmpl$6 = /*#__PURE__*/ template(`<span class="grid grid-cols-[3ch_1fr] gap-3"><span class="text-right text-muted-foreground select-none"aria-hidden=true></span><span>`);
+var _tmpl$7 = /*#__PURE__*/ template(`<div class="px-3 py-2">`);
+var _tmpl$8 = /*#__PURE__*/ template(`<code>`);
+/** The height a block must exceed before its actions are repeated. */
+var TALL_CODE_BLOCK_PX = 480;
+/**
+* Copy, reporting whether it worked. `navigator.clipboard` is absent in an
+* insecure context, and `writeText` rejects when the document is not focused —
+* both are normal in an embedded or iframed application, and neither should
+* silently look like success.
+*/
+async function copyText(text) {
+	try {
+		if (!navigator.clipboard) return false;
+		await navigator.clipboard.writeText(text);
+		return true;
+	} catch {
+		return false;
+	}
+}
+function CodeBlock(props) {
+	const [local, rest] = splitProps(props, [
+		"code",
+		"language",
+		"highlight",
+		"complete",
+		"title",
+		"actions",
+		"copyLabel",
+		"copiedLabel",
+		"lineHeight",
+		"showLineNumbers",
+		"tallThreshold",
+		"class",
+		"ref"
+	]);
+	const [copied, setCopied] = createSignal(false);
+	const [failed, setFailed] = createSignal(false);
+	const [tall, setTall] = createSignal(false);
+	const label = () => local.title ?? local.language ?? "code";
+	const regionLabel = () => local.language ? `${local.language} code` : "code";
+	const lines = createMemo(() => local.code.replace(/\n$/, "").split("\n"));
+	const copy = async () => {
+		const ok = await copyText(local.code);
+		setCopied(ok);
+		setFailed(!ok);
+		if (ok) setTimeout(() => setCopied(false), 1500);
+	};
+	const Actions = () => (() => {
+		var _el$ = _tmpl$();
+		insert(_el$, () => local.actions, null);
+		insert(_el$, createComponent(Button, {
+			variant: "ghost",
+			size: "icon-2xs",
+			get ["aria-label"]() {
+				return memo(() => !!copied())() ? local.copiedLabel ?? "Copied" : local.copyLabel ?? "Copy code";
+			},
+			get title() {
+				return failed() ? "Copying is unavailable in this context" : void 0;
+			},
+			onClick: () => void copy(),
+			get children() {
+				return createComponent(Show, {
+					get when() {
+						return copied();
+					},
+					get fallback() {
+						return createComponent(Copy, { "aria-hidden": "true" });
+					},
+					get children() {
+						return createComponent(Check, { "aria-hidden": "true" });
+					}
+				});
+			}
+		}), null);
+		return _el$;
+	})();
+	return (() => {
+		var _el$2 = _tmpl$4(), _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$3.nextSibling;
+		use((element) => {
+			if (typeof local.ref === "function") local.ref(element);
+			else if (local.ref) local.ref = element;
+			new ResizeObserver(() => {
+				setTall(element.offsetHeight > (local.tallThreshold ?? 480));
+			}).observe(element);
+		}, _el$2);
+		spread(_el$2, mergeProps({ get ["class"]() {
+			return cn("group/code overflow-hidden rounded-xl border border-border bg-card", local.class);
+		} }, rest), false, true);
+		insert(_el$4, label);
+		insert(_el$3, createComponent(Actions, {}), null);
+		insert(_el$5, createComponent(Show, {
+			get when() {
+				return local.highlight;
+			},
+			get fallback() {
+				return (() => {
+					var _el$8 = _tmpl$5(), _el$9 = _el$8.firstChild;
+					insert(_el$9, createComponent(Show, {
+						get when() {
+							return local.showLineNumbers;
+						},
+						get fallback() {
+							return local.code.replace(/\n$/, "");
+						},
+						get children() {
+							return createComponent(For, {
+								get each() {
+									return lines();
+								},
+								children: (line, index) => (() => {
+									var _el$0 = _tmpl$6(), _el$1 = _el$0.firstChild, _el$10 = _el$1.nextSibling;
+									insert(_el$1, () => index() + 1);
+									insert(_el$10, line || " ");
+									return _el$0;
+								})()
+							});
+						}
+					}));
+					effect((_$p) => setStyleProperty(_el$8, "line-height", local.lineHeight ?? "1.5"));
+					return _el$8;
+				})();
+			},
+			children: (highlight) => (() => {
+				var _el$11 = _tmpl$7();
+				insert(_el$11, () => highlight()(local.code));
+				return _el$11;
+			})()
+		}), null);
+		insert(_el$5, createComponent(Show, {
+			get when() {
+				return !local.complete;
+			},
+			get children() {
+				return _tmpl$2();
+			}
+		}), null);
+		insert(_el$2, createComponent(Show, {
+			get when() {
+				return tall();
+			},
+			get children() {
+				var _el$7 = _tmpl$3();
+				insert(_el$7, createComponent(Actions, {}));
+				return _el$7;
+			}
+		}), null);
+		effect(() => setAttribute(_el$5, "aria-label", regionLabel()));
+		return _el$2;
+	})();
+}
+/**
+* InlineCode.
+*
+* The `code` inside a sentence. It is a component rather than a class because it
+* has to hold three properties at once: it must not break the line's rhythm
+* (`font-size: 0.9em`, so it tracks the surrounding text), it must wrap rather
+* than overflow a narrow column (`overflow-wrap: anywhere` — an identifier with
+* no spaces is one long token), and it must be legible against whatever surface
+* it lands on, which is why the fill is a token and not a fixed grey.
+*/
+function InlineCode(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return (() => {
+		var _el$12 = _tmpl$8();
+		spread(_el$12, mergeProps({ get ["class"]() {
+			return cn("rounded-sm bg-muted px-[0.4em] py-[0.15em] font-mono text-[0.9em] text-foreground [overflow-wrap:anywhere]", local.class);
+		} }, rest), false, false);
+		return _el$12;
+	})();
+}
+//#endregion
+export { CodeBlock, InlineCode, TALL_CODE_BLOCK_PX };
+
+//# sourceMappingURL=code-block.js.map

package/dist/components/ui/code-block/code-block.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-block.js","names":["createMemo","createSignal","For","Show","splitProps","ComponentProps","JSX","Check","Copy","Button","cn","CodeBlockProps","Omit","code","language","highlight","Element","complete","title","actions","copyLabel","copiedLabel","lineHeight","showLineNumbers","tallThreshold","TALL_CODE_BLOCK_PX","copyText","text","Promise","navigator","clipboard","writeText","CodeBlock","props","local","rest","copied","setCopied","failed","setFailed","tall","setTall","label","regionLabel","lines","replace","split","copy","ok","setTimeout","Actions","_el$","_tmpl$","_$insert","_$createComponent","variant","size","aria-label","_$memo","undefined","onClick","children","when","fallback","_el$2","_tmpl$4","_el$3","firstChild","_el$4","_el$5","nextSibling","_$use","element","ref","observer","ResizeObserver","offsetHeight","observe","_$spread","_$mergeProps","class","_el$8","_tmpl$5","_el$9","each","line","index","_el$0","_tmpl$6","_el$1","_el$10","_$effect","_$p","_$setStyleProperty","_el$11","_tmpl$7","_tmpl$2","_el$7","_tmpl$3","_$setAttribute","InlineCode","_el$12","_tmpl$8","_$createComponent","_$memo","_$mergeProps","_$setStyleProperty","_$setAttribute"],"sources":["../../../../src/components/ui/code-block/code-block.tsx"],"sourcesContent":["import {\n  createMemo,\n  createSignal,\n  For,\n  Show,\n  splitProps,\n  type ComponentProps,\n  type JSX,\n} from 'solid-js'\nimport { Check, Copy } from 'lucide-solid'\nimport { Button } from '../button'\nimport { cn } from '#lib/utils'\n\n/**\n * CodeBlock.\n *\n * A fenced block, rendered as a surface. The library ships no highlighter —\n * syntax colouring is a large dependency with its own theme format, and a\n * component that bundled one would force every consumer to pay for it. This\n * renders the block, its chrome, and its behaviour; a caller that wants\n * highlighting passes the result through `highlight`, which is the seam a\n * Shiki/Pierre/Prism integration plugs into.\n *\n * Four details are the reason this exists rather than a styled `<pre>`:\n *\n * **Copy confirms only on success.** `navigator.clipboard.writeText` rejects\n * outside a secure context, in a sandboxed frame, and when the document is not\n * focused. Flipping to a tick unconditionally confirms a copy that did not\n * happen, and the reader pastes something stale and does not know why. The\n * rejection is caught and the button reports the failure instead.\n *\n * **A tall block repeats its action row at the bottom.** Copying from a block\n * that is taller than the viewport otherwise costs a scroll back to the top and\n * another scroll down to where you were. The threshold is a fixed 480px rather\n * than viewport-relative so the behaviour does not change when the window is\n * resized.\n *\n * **The scroller is focusable and named.** A horizontally scrollable region has\n * to be reachable by keyboard — this is axe's `scrollable-region-focusable`, and\n * a region that scrolls but cannot be focused is a WCAG 2.1.1 failure. It is a\n * `region` with a label rather than a bare `tabindex`, so the tab stop announces\n * what it is.\n *\n * **Resolving a streaming block must not move the reader.** When `complete` is\n * false the block shows the code it has plus a generating indicator; the\n * indicator is inside the scroller's own box and does not add a line, because a\n * block that grows the moment its content resolves shifts everything below it.\n * If a caller's `highlight` changes the line box, that is the caller's height to\n * hold — `lineHeight` is a prop for exactly that reason.\n */\nexport type CodeBlockProps = Omit<ComponentProps<'div'>, 'children'> & {\n  code: string\n  /** The language, shown in the header and used as the region's label. */\n  language?: string\n  /** The code, transformed — highlighted HTML or a component. Omit for plain text. */\n  highlight?: (code: string) => JSX.Element\n  /** False while the block is still streaming. Adds a generating indicator. */\n  complete?: boolean\n  /** A filename or title, shown instead of the language. */\n  title?: string\n  /** Extra header controls, before the copy button. */\n  actions?: JSX.Element\n  /** Copy label. Override for a non-English application. */\n  copyLabel?: string\n  copiedLabel?: string\n  /** Line height of the rendered code. Set it when `highlight` changes the box. */\n  lineHeight?: string\n  /** A line-number gutter. Off by default; a short snippet rarely needs one. */\n  showLineNumbers?: boolean\n  /** The height above which the action row is repeated below the block. */\n  tallThreshold?: number\n}\n\n/** The height a block must exceed before its actions are repeated. */\nexport const TALL_CODE_BLOCK_PX = 480\n\n/**\n * Copy, reporting whether it worked. `navigator.clipboard` is absent in an\n * insecure context, and `writeText` rejects when the document is not focused —\n * both are normal in an embedded or iframed application, and neither should\n * silently look like success.\n */\nasync function copyText(text: string): Promise<boolean> {\n  try {\n    if (!navigator.clipboard) return false\n    await navigator.clipboard.writeText(text)\n    return true\n  } catch {\n    return false\n  }\n}\n\nexport function CodeBlock(props: CodeBlockProps) {\n  const [local, rest] = splitProps(props, [\n    'code',\n    'language',\n    'highlight',\n    'complete',\n    'title',\n    'actions',\n    'copyLabel',\n    'copiedLabel',\n    'lineHeight',\n    'showLineNumbers',\n    'tallThreshold',\n    'class',\n    'ref',\n  ])\n\n  const [copied, setCopied] = createSignal(false)\n  const [failed, setFailed] = createSignal(false)\n  const [tall, setTall] = createSignal(false)\n\n  const label = () => local.title ?? local.language ?? 'code'\n  const regionLabel = () => (local.language ? `${local.language} code` : 'code')\n  const lines = createMemo(() => local.code.replace(/\\n$/, '').split('\\n'))\n\n  const copy = async () => {\n    const ok = await copyText(local.code)\n    setCopied(ok)\n    setFailed(!ok)\n    if (ok) setTimeout(() => setCopied(false), 1500)\n  }\n\n  const Actions = () => (\n    <div class=\"flex items-center gap-1 opacity-0 transition-opacity group-focus-within/code:opacity-100 group-hover/code:opacity-100\">\n      {local.actions}\n      <Button\n        variant=\"ghost\"\n        size=\"icon-2xs\"\n        aria-label={copied() ? (local.copiedLabel ?? 'Copied') : (local.copyLabel ?? 'Copy code')}\n        title={failed() ? 'Copying is unavailable in this context' : undefined}\n        onClick={() => void copy()}\n      >\n        <Show when={copied()} fallback={<Copy aria-hidden=\"true\" />}>\n          <Check aria-hidden=\"true\" />\n        </Show>\n      </Button>\n    </div>\n  )\n\n  return (\n    <div\n      class={cn('group/code overflow-hidden rounded-xl border border-border bg-card', local.class)}\n      {...rest}\n      ref={(element) => {\n        // Composed rather than replaced: a caller's ref must survive.\n        if (typeof local.ref === 'function') local.ref(element)\n        else if (local.ref) local.ref = element\n        // Measured rather than assumed: the caller controls the content, so only\n        // the rendered box can say whether the action row has scrolled away.\n        const observer = new ResizeObserver(() => {\n          setTall(element.offsetHeight > (local.tallThreshold ?? TALL_CODE_BLOCK_PX))\n        })\n        observer.observe(element)\n      }}\n    >\n      <div class=\"flex items-center justify-between gap-2 px-3 py-1\">\n        <span class=\"truncate font-mono text-xs text-muted-foreground\">{label()}</span>\n        <Actions />\n      </div>\n      <div\n        class=\"scroll-fade overflow-x-auto\"\n        // A region that scrolls must be focusable, and a tab stop needs a name.\n        tabindex=\"0\"\n        role=\"region\"\n        aria-label={regionLabel()}\n      >\n        <Show\n          when={local.highlight}\n          fallback={\n            <pre class=\"m-0 px-3 py-2\" style={{ 'line-height': local.lineHeight ?? '1.5' }}>\n              <code class=\"font-mono text-xs\">\n                <Show when={local.showLineNumbers} fallback={local.code.replace(/\\n$/, '')}>\n                  <For each={lines()}>\n                    {(line, index) => (\n                      <span class=\"grid grid-cols-[3ch_1fr] gap-3\">\n                        <span\n                          class=\"text-right text-muted-foreground select-none\"\n                          aria-hidden=\"true\"\n                        >\n                          {index() + 1}\n                        </span>\n                        <span>{line || ' '}</span>\n                      </span>\n                    )}\n                  </For>\n                </Show>\n              </code>\n            </pre>\n          }\n        >\n          {(highlight) => <div class=\"px-3 py-2\">{highlight()(local.code)}</div>}\n        </Show>\n        {/*\n          In the scroller's box, and a single line: the indicator must not add\n          height when it disappears, or a streaming block shifts everything below\n          it as it resolves.\n        */}\n        <Show when={!local.complete}>\n          <p class=\"px-3 pb-2 text-xs text-muted-foreground italic\">Generating…</p>\n        </Show>\n      </div>\n      <Show when={tall()}>\n        <div\n          data-code-block-footer=\"\"\n          class=\"flex items-center justify-end border-t border-transparent px-3 py-1 transition-colors group-focus-within/code:border-border group-hover/code:border-border\"\n        >\n          <Actions />\n        </div>\n      </Show>\n    </div>\n  )\n}\n\n/**\n * InlineCode.\n *\n * The `code` inside a sentence. It is a component rather than a class because it\n * has to hold three properties at once: it must not break the line's rhythm\n * (`font-size: 0.9em`, so it tracks the surrounding text), it must wrap rather\n * than overflow a narrow column (`overflow-wrap: anywhere` — an identifier with\n * no spaces is one long token), and it must be legible against whatever surface\n * it lands on, which is why the fill is a token and not a fixed grey.\n */\nexport function InlineCode(props: ComponentProps<'code'>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <code\n      class={cn(\n        'rounded-sm bg-muted px-[0.4em] py-[0.15em] font-mono text-[0.9em] text-foreground [overflow-wrap:anywhere]',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n"],"mappings":"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"}

package/dist/components/ui/code-block/index.d.ts

@@ -0,0 +1,2 @@
+export { CodeBlock, InlineCode, TALL_CODE_BLOCK_PX, type CodeBlockProps } from './code-block';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ui/code-block/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/code-block/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,kBAAkB,EAAE,KAAK,cAAc,EAAE,MAAM,cAAc,CAAA"}

package/dist/components/ui/collapsible/collapsible.d.ts

@@ -0,0 +1,17 @@
+import { Collapsible as KobalteCollapsible } from '@kobalte/core/collapsible';
+import type { ComponentProps } from 'solid-js';
+/**
+ * Collapsible.
+ *
+ * One region that shows and hides. Accordion is this in a list; reach for
+ * Collapsible when there is exactly one, so a caller does not have to build a
+ * one-item accordion whose semantics say "list of one".
+ *
+ * The content animates its height rather than appearing, which is what keeps a
+ * disclosure from reading as a layout jump. Kobalte publishes the measured
+ * height as `--kb-collapsible-content-height`.
+ */
+export declare function Collapsible(props: ComponentProps<typeof KobalteCollapsible>): import("solid-js").JSX.Element;
+export declare function CollapsibleTrigger(props: ComponentProps<typeof KobalteCollapsible.Trigger>): import("solid-js").JSX.Element;
+export declare function CollapsibleContent(props: ComponentProps<typeof KobalteCollapsible.Content>): import("solid-js").JSX.Element;
+//# sourceMappingURL=collapsible.d.ts.map

package/dist/components/ui/collapsible/collapsible.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/collapsible/collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,IAAI,kBAAkB,EAAE,MAAM,2BAA2B,CAAA;AAC7E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAI9C;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,kCAG3E;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAe1F;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC,kCAe1F"}

package/dist/components/ui/collapsible/collapsible.js

@@ -0,0 +1,38 @@
+import { cn } from "../../../lib/utils.js";
+import { createComponent, mergeProps } from "solid-js/web";
+import { splitProps } from "solid-js";
+import { Collapsible } from "@kobalte/core/collapsible";
+//#region src/components/ui/collapsible/collapsible.tsx
+/**
+* Collapsible.
+*
+* One region that shows and hides. Accordion is this in a list; reach for
+* Collapsible when there is exactly one, so a caller does not have to build a
+* one-item accordion whose semantics say "list of one".
+*
+* The content animates its height rather than appearing, which is what keeps a
+* disclosure from reading as a layout jump. Kobalte publishes the measured
+* height as `--kb-collapsible-content-height`.
+*/
+function Collapsible$1(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(Collapsible, mergeProps({ get ["class"]() {
+		return cn("flex w-full flex-col", local.class);
+	} }, rest));
+}
+function CollapsibleTrigger(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(Collapsible.Trigger, mergeProps({ get ["class"]() {
+		return cn("flex items-center gap-1.5 text-sm font-medium", "transition-colors ease-out outline-none", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle", "disabled:pointer-events-none disabled:opacity-50", local.class);
+	} }, rest));
+}
+function CollapsibleContent(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(Collapsible.Content, mergeProps({ get ["class"]() {
+		return cn("overflow-hidden", "data-[expanded]:animate-in data-[expanded]:fade-in-0 data-[expanded]:slide-in-from-top-1", "data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:slide-out-to-top-1", local.class);
+	} }, rest));
+}
+//#endregion
+export { Collapsible$1 as Collapsible, CollapsibleContent, CollapsibleTrigger };
+
+//# sourceMappingURL=collapsible.js.map

package/dist/components/ui/collapsible/collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.js","names":["Collapsible","KobalteCollapsible","ComponentProps","splitProps","cn","props","local","rest","_$createComponent","_$mergeProps","class","CollapsibleTrigger","Trigger","CollapsibleContent","Content","Collapsible","_$createComponent","KobalteCollapsible","_$mergeProps"],"sources":["../../../../src/components/ui/collapsible/collapsible.tsx"],"sourcesContent":["import { Collapsible as KobalteCollapsible } from '@kobalte/core/collapsible'\nimport type { ComponentProps } from 'solid-js'\nimport { splitProps } from 'solid-js'\nimport { cn } from '#lib/utils'\n\n/**\n * Collapsible.\n *\n * One region that shows and hides. Accordion is this in a list; reach for\n * Collapsible when there is exactly one, so a caller does not have to build a\n * one-item accordion whose semantics say \"list of one\".\n *\n * The content animates its height rather than appearing, which is what keeps a\n * disclosure from reading as a layout jump. Kobalte publishes the measured\n * height as `--kb-collapsible-content-height`.\n */\nexport function Collapsible(props: ComponentProps<typeof KobalteCollapsible>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <KobalteCollapsible class={cn('flex w-full flex-col', local.class)} {...rest} />\n}\n\nexport function CollapsibleTrigger(props: ComponentProps<typeof KobalteCollapsible.Trigger>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <KobalteCollapsible.Trigger\n      class={cn(\n        'flex items-center gap-1.5 text-sm font-medium',\n        'transition-colors ease-out outline-none',\n        'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n        'disabled:pointer-events-none disabled:opacity-50',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function CollapsibleContent(props: ComponentProps<typeof KobalteCollapsible.Content>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return (\n    <KobalteCollapsible.Content\n      class={cn(\n        'overflow-hidden',\n        /* Kobalte measures the content and exposes the height; the transition\n           reads it so the panel opens to its real size rather than a guess. */\n        'data-[expanded]:animate-in data-[expanded]:fade-in-0 data-[expanded]:slide-in-from-top-1',\n        'data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:slide-out-to-top-1',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAgBA,SAAgBA,cAAYK,OAAkD;CAC5E,MAAM,CAACC,OAAOC,QAAQJ,WAAWE,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,gBAAQP,aAAkBQ,WAAA,EAAA,KAAA,WAAA;EAAA,OAAQL,GAAG,wBAAwBE,MAAMI,KAAK;CAAC,EAAA,GAAMH,IAAI,CAAA;AACrF;AAEA,SAAgBI,mBAAmBN,OAA0D;CAC3F,MAAM,CAACC,OAAOC,QAAQJ,WAAWE,OAAO,CAAC,OAAO,CAAC;CAEjD,OAAAG,gBACGP,YAAmBW,SAAOH,WAAA,EAAA,KAAA,WAAA;EAAA,OAClBL,GACL,iDACA,2CACA,oFACA,oDACAE,MAAMI,KACR;CAAC,EAAA,GACGH,IAAI,CAAA;AAGd;AAEA,SAAgBM,mBAAmBR,OAA0D;CAC3F,MAAM,CAACC,OAAOC,QAAQJ,WAAWE,OAAO,CAAC,OAAO,CAAC;CACjD,OAAAG,gBACGP,YAAmBa,SAAOL,WAAA,EAAA,KAAA,WAAA;EAAA,OAClBL,GACL,mBAGA,4FACA,uFACAE,MAAMI,KACR;CAAC,EAAA,GACGH,IAAI,CAAA;AAGd"}

package/dist/components/ui/collapsible/index.d.ts

@@ -0,0 +1,2 @@
+export { Collapsible, CollapsibleContent, CollapsibleTrigger } from './collapsible';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ui/collapsible/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/collapsible/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAA"}

package/dist/components/ui/combobox/combobox.d.ts

@@ -0,0 +1,28 @@
+import { Combobox as KobalteCombobox } from '@kobalte/core/combobox';
+import type { ComponentProps } from 'solid-js';
+/**
+ * Combobox.
+ *
+ * A Select whose list is filterable by typing. The difference from Select is
+ * not cosmetic: a Combobox has a text input, so the user can narrow forty
+ * options to one without reading the list. Above roughly ten options the
+ * search is the feature; below it, a Select is quieter and a RadioGroup is
+ * better still.
+ *
+ * Kobalte supplies the filtering, the `aria-activedescendant` wiring, the
+ * keyboard selection and the multiple-selection mode, which is the part a
+ * hand-rolled version reliably gets wrong.
+ */
+export declare function Combobox<Option, OptGroup = never>(props: ComponentProps<typeof KobalteCombobox<Option, OptGroup>>): import("solid-js").JSX.Element;
+export declare function ComboboxControl(props: ComponentProps<typeof KobalteCombobox.Control>): import("solid-js").JSX.Element;
+export declare function ComboboxInput(props: ComponentProps<typeof KobalteCombobox.Input>): import("solid-js").JSX.Element;
+export declare function ComboboxTrigger(props: ComponentProps<typeof KobalteCombobox.Trigger>): import("solid-js").JSX.Element;
+export declare function ComboboxContent(props: ComponentProps<typeof KobalteCombobox.Content>): import("solid-js").JSX.Element;
+export declare function ComboboxItem(props: ComponentProps<typeof KobalteCombobox.Item>): import("solid-js").JSX.Element;
+export declare function ComboboxSection(props: ComponentProps<typeof KobalteCombobox.Section>): import("solid-js").JSX.Element;
+/** The clear affordance for a single-select Combobox with a value. */
+export declare function ComboboxClear(props: {
+    class?: string;
+    onClear: () => void;
+}): import("solid-js").JSX.Element;
+//# sourceMappingURL=combobox.d.ts.map

package/dist/components/ui/combobox/combobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/combobox/combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAEpE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAK9C;;;;;;;;;;;;GAYG;AACH,wBAAgB,QAAQ,CAAC,MAAM,EAAE,QAAQ,GAAG,KAAK,EAC/C,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC,kCAGhE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAgBpF;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,kCAahF;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAoBpF;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAqBpF;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,kCAW9E;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,kCAGpF;AAED,sEAAsE;AACtE,wBAAgB,aAAa,CAAC,KAAK,EAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,kCAkB3E"}

package/dist/components/ui/combobox/combobox.js

@@ -0,0 +1,102 @@
+import { cn } from "../../../lib/utils.js";
+import { menuItem, popoverArrow } from "../../../lib/overlay.js";
+import { className, createComponent, delegateEvents, effect, insert, memo, mergeProps, template } from "solid-js/web";
+import { Check, ChevronDown, X } from "lucide-solid";
+import { Show, splitProps } from "solid-js";
+import { Combobox } from "@kobalte/core/combobox";
+//#region src/components/ui/combobox/combobox.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<button type=button aria-label="Clear selection">`);
+/**
+* Combobox.
+*
+* A Select whose list is filterable by typing. The difference from Select is
+* not cosmetic: a Combobox has a text input, so the user can narrow forty
+* options to one without reading the list. Above roughly ten options the
+* search is the feature; below it, a Select is quieter and a RadioGroup is
+* better still.
+*
+* Kobalte supplies the filtering, the `aria-activedescendant` wiring, the
+* keyboard selection and the multiple-selection mode, which is the part a
+* hand-rolled version reliably gets wrong.
+*/
+function Combobox$1(props) {
+	return createComponent(Combobox, props);
+}
+function ComboboxControl(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(Combobox.Control, mergeProps({ get ["class"]() {
+		return cn("border-input bg-transparent flex h-control-md w-full items-center gap-1.5 rounded-md border px-control-sm", "transition-[color,box-shadow,border-color] ease-out", "focus-within:border-ring focus-within:ring-3 focus-within:ring-primary-subtle", "data-[invalid]:border-destructive data-[invalid]:ring-3 data-[invalid]:ring-destructive-subtle", "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50", local.class);
+	} }, rest));
+}
+function ComboboxInput(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(Combobox.Input, mergeProps({ get ["class"]() {
+		return cn("h-full flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground", "disabled:cursor-not-allowed", local.class);
+	} }, rest));
+}
+function ComboboxTrigger(props) {
+	const [local, rest] = splitProps(props, ["class", "children"]);
+	return createComponent(Combobox.Trigger, mergeProps({ get ["class"]() {
+		return cn("text-muted-foreground flex shrink-0 items-center justify-center rounded-sm outline-none", "transition-colors ease-out hover:text-foreground", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle", "disabled:pointer-events-none disabled:opacity-50", local.class);
+	} }, rest, { get children() {
+		return [memo(() => local.children), createComponent(Combobox.Icon, { get children() {
+			return createComponent(ChevronDown, { "class": "size-4" });
+		} })];
+	} }));
+}
+function ComboboxContent(props) {
+	const [local, rest] = splitProps(props, ["class", "children"]);
+	return createComponent(Combobox.Portal, { get children() {
+		return createComponent(Combobox.Content, mergeProps({ get ["class"]() {
+			return cn("bg-popover text-popover-foreground rounded-xl border border-border shadow-lg", "z-(--z-menu) max-h-72 min-w-(--kb-popper-anchor-width) origin-(--kb-combobox-content-transform-origin) overflow-hidden", "data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95", "data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", "data-expanded:duration-150 data-closed:duration-100", local.class);
+		} }, rest, { get children() {
+			return [createComponent(Combobox.Listbox, { get ["class"]() {
+				return cn("max-h-72 overflow-y-auto", "p-1");
+			} }), createComponent(Combobox.Arrow, {
+				"aria-hidden": "true",
+				"class": popoverArrow
+			})];
+		} }));
+	} });
+}
+function ComboboxItem(props) {
+	const [local, rest] = splitProps(props, ["class", "children"]);
+	return createComponent(Combobox.Item, mergeProps({ get ["class"]() {
+		return cn(menuItem, "pe-8", local.class);
+	} }, rest, { get children() {
+		return [createComponent(Combobox.ItemLabel, { get children() {
+			return local.children;
+		} }), createComponent(Combobox.ItemIndicator, {
+			"class": "absolute end-2 flex size-4 items-center justify-center",
+			get children() {
+				return createComponent(Check, { "class": "size-4" });
+			}
+		})];
+	} }));
+}
+function ComboboxSection(props) {
+	const [local, rest] = splitProps(props, ["class"]);
+	return createComponent(Combobox.Section, mergeProps({ get ["class"]() {
+		return cn("flex flex-col", local.class);
+	} }, rest));
+}
+/** The clear affordance for a single-select Combobox with a value. */
+function ComboboxClear(props) {
+	return createComponent(Show, {
+		get when() {
+			return props.onClear;
+		},
+		get children() {
+			var _el$ = _tmpl$();
+			_el$.$$click = () => props.onClear();
+			insert(_el$, createComponent(X, { "class": "size-3.5" }));
+			effect(() => className(_el$, cn("text-muted-foreground flex size-4 shrink-0 items-center justify-center rounded-sm", "transition-colors ease-out outline-none hover:text-foreground", "focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle", props.class)));
+			return _el$;
+		}
+	});
+}
+delegateEvents(["click"]);
+//#endregion
+export { Combobox$1 as Combobox, ComboboxClear, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxSection, ComboboxTrigger };
+
+//# sourceMappingURL=combobox.js.map

package/dist/components/ui/combobox/combobox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox.js","names":["Combobox","KobalteCombobox","Check","ChevronDown","X","ComponentProps","Show","splitProps","menuContentPadding","menuItem","popoverArrow","cn","props","Option","OptGroup","_$createComponent","ComboboxControl","Control","local","rest","_$mergeProps","class","ComboboxInput","Input","ComboboxTrigger","Trigger","children","_$memo","Icon","ComboboxContent","Content","Portal","Listbox","Arrow","ComboboxItem","Item","ItemLabel","ItemIndicator","ComboboxSection","Section","ComboboxClear","onClear","when","_el$","_tmpl$","$$click","_$insert","_$effect","_$className","_$delegateEvents","Combobox","_$createComponent","KobalteCombobox","_$mergeProps","_$memo","_$className","_$delegateEvents"],"sources":["../../../../src/components/ui/combobox/combobox.tsx"],"sourcesContent":["import { Combobox as KobalteCombobox } from '@kobalte/core/combobox'\nimport { Check, ChevronDown, X } from 'lucide-solid'\nimport type { ComponentProps } from 'solid-js'\nimport { Show, splitProps } from 'solid-js'\nimport { menuContentPadding, menuItem, popoverArrow } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * Combobox.\n *\n * A Select whose list is filterable by typing. The difference from Select is\n * not cosmetic: a Combobox has a text input, so the user can narrow forty\n * options to one without reading the list. Above roughly ten options the\n * search is the feature; below it, a Select is quieter and a RadioGroup is\n * better still.\n *\n * Kobalte supplies the filtering, the `aria-activedescendant` wiring, the\n * keyboard selection and the multiple-selection mode, which is the part a\n * hand-rolled version reliably gets wrong.\n */\nexport function Combobox<Option, OptGroup = never>(\n  props: ComponentProps<typeof KobalteCombobox<Option, OptGroup>>\n) {\n  return <KobalteCombobox {...props} />\n}\n\nexport function ComboboxControl(props: ComponentProps<typeof KobalteCombobox.Control>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <KobalteCombobox.Control\n      class={cn(\n        'border-input bg-transparent flex h-control-md w-full items-center gap-1.5 rounded-md border px-control-sm',\n        'transition-[color,box-shadow,border-color] ease-out',\n        'focus-within:border-ring focus-within:ring-3 focus-within:ring-primary-subtle',\n        'data-[invalid]:border-destructive data-[invalid]:ring-3 data-[invalid]:ring-destructive-subtle',\n        'data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function ComboboxInput(props: ComponentProps<typeof KobalteCombobox.Input>) {\n  const [local, rest] = splitProps(props, ['class'])\n\n  return (\n    <KobalteCombobox.Input\n      class={cn(\n        'h-full flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground',\n        'disabled:cursor-not-allowed',\n        local.class\n      )}\n      {...rest}\n    />\n  )\n}\n\nexport function ComboboxTrigger(props: ComponentProps<typeof KobalteCombobox.Trigger>) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteCombobox.Trigger\n      class={cn(\n        'text-muted-foreground flex shrink-0 items-center justify-center rounded-sm outline-none',\n        'transition-colors ease-out hover:text-foreground',\n        'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n        'disabled:pointer-events-none disabled:opacity-50',\n        local.class\n      )}\n      {...rest}\n    >\n      {local.children}\n      <KobalteCombobox.Icon>\n        <ChevronDown class=\"size-4\" />\n      </KobalteCombobox.Icon>\n    </KobalteCombobox.Trigger>\n  )\n}\n\nexport function ComboboxContent(props: ComponentProps<typeof KobalteCombobox.Content>) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteCombobox.Portal>\n      <KobalteCombobox.Content\n        class={cn(\n          'bg-popover text-popover-foreground rounded-xl border border-border shadow-lg',\n          'z-(--z-menu) max-h-72 min-w-(--kb-popper-anchor-width) origin-(--kb-combobox-content-transform-origin) overflow-hidden',\n          'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95',\n          'data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n          'data-expanded:duration-150 data-closed:duration-100',\n          local.class\n        )}\n        {...rest}\n      >\n        <KobalteCombobox.Listbox class={cn('max-h-72 overflow-y-auto', menuContentPadding)} />\n        <KobalteCombobox.Arrow aria-hidden=\"true\" class={popoverArrow} />\n      </KobalteCombobox.Content>\n    </KobalteCombobox.Portal>\n  )\n}\n\nexport function ComboboxItem(props: ComponentProps<typeof KobalteCombobox.Item>) {\n  const [local, rest] = splitProps(props, ['class', 'children'])\n\n  return (\n    <KobalteCombobox.Item class={cn(menuItem, 'pe-8', local.class)} {...rest}>\n      <KobalteCombobox.ItemLabel>{local.children}</KobalteCombobox.ItemLabel>\n      <KobalteCombobox.ItemIndicator class=\"absolute end-2 flex size-4 items-center justify-center\">\n        <Check class=\"size-4\" />\n      </KobalteCombobox.ItemIndicator>\n    </KobalteCombobox.Item>\n  )\n}\n\nexport function ComboboxSection(props: ComponentProps<typeof KobalteCombobox.Section>) {\n  const [local, rest] = splitProps(props, ['class'])\n  return <KobalteCombobox.Section class={cn('flex flex-col', local.class)} {...rest} />\n}\n\n/** The clear affordance for a single-select Combobox with a value. */\nexport function ComboboxClear(props: { class?: string; onClear: () => void }) {\n  return (\n    <Show when={props.onClear}>\n      <button\n        type=\"button\"\n        aria-label=\"Clear selection\"\n        onClick={() => props.onClear()}\n        class={cn(\n          'text-muted-foreground flex size-4 shrink-0 items-center justify-center rounded-sm',\n          'transition-colors ease-out outline-none hover:text-foreground',\n          'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-primary-subtle',\n          props.class\n        )}\n      >\n        <X class=\"size-3.5\" />\n      </button>\n    </Show>\n  )\n}\n"],"mappings":"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"}

package/dist/components/ui/combobox/index.d.ts

@@ -0,0 +1,2 @@
+export { Combobox, ComboboxClear, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxSection, ComboboxTrigger, } from './combobox';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ui/combobox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/combobox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,aAAa,EACb,eAAe,EACf,eAAe,EACf,aAAa,EACb,YAAY,EACZ,eAAe,EACf,eAAe,GAChB,MAAM,YAAY,CAAA"}

package/dist/components/ui/command/command.d.ts

@@ -0,0 +1,53 @@
+import { CommandDialog as CmdkDialog, CommandEmpty as CmdkEmpty, CommandGroup as CmdkGroup, CommandInput as CmdkInput, CommandItem as CmdkItem, CommandList as CmdkList, CommandLoading as CmdkLoading, CommandRoot as CmdkRoot, CommandSeparator as CmdkSeparator } from 'cmdk-solid';
+import type { ComponentProps } from 'solid-js';
+/**
+ * Command.
+ *
+ * The command palette: a filtered list of everything the user can do, ranked
+ * by fuzzy match. It is the one place in an app where a keyboard-first surface
+ * is the *primary* one, so it carries rules the rest of the system does not:
+ *
+ *   - Every item must be reachable by typing its name. If a user has to
+ *     remember which group it lives in, the palette has failed at its job.
+ *   - Groups exist for reading, not for navigation. The ranking crosses them.
+ *   - The empty state is not an apology — it should offer the closest thing
+ *     the app could guess, or say plainly that nothing matched.
+ *
+ * cmdk-solid supplies the filter, the scoring, the `aria-activedescendant`
+ * wiring and the arrow-key navigation.
+ */
+export declare function Command(props: ComponentProps<typeof CmdkRoot>): import("solid-js").JSX.Element;
+export declare function CommandDialog(props: ComponentProps<typeof CmdkDialog>): import("solid-js").JSX.Element;
+export declare function CommandInput(props: ComponentProps<typeof CmdkInput>): import("solid-js").JSX.Element;
+/**
+ * The scrolling list.
+ *
+ * Two DOM corrections, and both are deliberate. cmdk builds a `role="listbox"`
+ * whose children include two elements ARIA does not allow there:
+ *
+ *   - a bare `<div cmdk-list-sizer>` with no role, wrapped around every group;
+ *   - a `<div cmdk-separator role="separator">`, and `separator` is a menu and
+ *     toolbar role — inside a listbox the only owned elements may be `option`
+ *     and `group`.
+ *
+ * Both are pure presentation: the sizer is layout, and the separator is a
+ * hairline between groups that the groups already structure. `role="presentation"`
+ * is their accurate role rather than a workaround — each is flattened out of the
+ * accessibility tree, and the options inside are reached exactly as before.
+ *
+ * Written onto the mounted nodes rather than through props, because cmdk owns
+ * this markup and does not forward a `ref`; in an effect rather than `onMount`,
+ * because cmdk renders the sizer with the first item, after the list itself.
+ */
+export declare function CommandList(props: ComponentProps<typeof CmdkList>): import("solid-js").JSX.Element;
+export declare function CommandEmpty(props: ComponentProps<typeof CmdkEmpty>): import("solid-js").JSX.Element;
+export declare function CommandGroup(props: ComponentProps<typeof CmdkGroup>): import("solid-js").JSX.Element;
+export declare function CommandItem(props: ComponentProps<typeof CmdkItem>): import("solid-js").JSX.Element;
+export declare function CommandSeparator(props: ComponentProps<typeof CmdkSeparator>): import("solid-js").JSX.Element;
+export declare function CommandLoading(props: ComponentProps<typeof CmdkLoading>): import("solid-js").JSX.Element;
+/** The keyboard hint a palette item usually carries. */
+export declare function CommandShortcut(props: {
+    class?: string;
+    children?: ComponentProps<'span'>['children'];
+}): import("solid-js").JSX.Element;
+//# sourceMappingURL=command.d.ts.map

package/dist/components/ui/command/command.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"command.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/command/command.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,IAAI,UAAU,EAC3B,YAAY,IAAI,SAAS,EACzB,YAAY,IAAI,SAAS,EACzB,YAAY,IAAI,SAAS,EACzB,WAAW,IAAI,QAAQ,EACvB,WAAW,IAAI,QAAQ,EACvB,cAAc,IAAI,WAAW,EAC7B,WAAW,IAAI,QAAQ,EACvB,gBAAgB,IAAI,aAAa,EAElC,MAAM,YAAY,CAAA;AAEnB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAK9C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAY7D;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,UAAU,CAAC,kCAerE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAmBnE;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAgCjE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAcnE;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,SAAS,CAAC,kCAanE;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,kCAajE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,kCAG3E;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,kCAQvE;AAED,wDAAwD;AACxD,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAA;CAC9C,kCAQA"}