@flanksource/clicky-ui 0.2.4 → 0.2.5

package/dist/components/FormatOptionsDropdown.cjs

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+require("react");
+const Icon = require("../data/Icon.cjs");
+const SplitButton = require("./SplitButton.cjs");
+const UiEye = require("../icons/components/UiEye.cjs");
+const UiFileCode = require("../icons/components/UiFileCode.cjs");
+const UiTable = require("../icons/components/UiTable.cjs");
+const UiComment = require("../icons/components/UiComment.cjs");
+const UiCheck = require("../icons/components/UiCheck.cjs");
+const CLICKY_FORMAT_OPTIONS = [
+  { value: "clicky", label: "Clicky", description: "Rendered Clicky JSON with the rich Clicky viewer", icon: UiEye.UiEye },
+  { value: "json", label: "JSON", description: "Plain JSON for inspecting the raw response body", icon: UiFileCode.UiFileCode },
+  { value: "yaml", label: "YAML", description: "YAML for config-friendly inspection and export", icon: UiFileCode.UiFileCode },
+  { value: "csv", label: "CSV", description: "Comma-separated values for spreadsheets and imports", icon: UiTable.UiTable },
+  { value: "markdown", label: "Markdown", description: "Markdown formatted for docs, comments, and chat", icon: UiFileCode.UiFileCode },
+  { value: "html", label: "HTML", description: "Browser-ready HTML preview of the formatted output", icon: UiFileCode.UiFileCode },
+  { value: "pdf", label: "PDF", description: "Portable document for sharing and printing", icon: UiFileCode.UiFileCode },
+  { value: "pretty", label: "Pretty", description: "Human-readable plain text output from the formatter", icon: UiFileCode.UiFileCode },
+  { value: "excel", label: "Excel", description: "Spreadsheet workbook for offline analysis", icon: UiTable.UiTable },
+  { value: "slack", label: "Slack", description: "Slack Block Kit JSON for chat-native output", icon: UiComment.UiComment }
+];
+function FormatOptionsDropdown({
+  value,
+  onChange,
+  options = CLICKY_FORMAT_OPTIONS,
+  label,
+  variant = "outline",
+  size = "default",
+  className
+}) {
+  const active = options.find((option) => option.value === value);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SplitButton.SplitButton,
+    {
+      label: label ?? (active == null ? void 0 : active.label) ?? value,
+      ...(active == null ? void 0 : active.icon) ? { icon: active.icon } : {},
+      onClick: () => onChange(value),
+      variant,
+      size,
+      title: "Choose format",
+      ...className ? { className } : {},
+      menuClassName: "min-w-[18rem]",
+      items: options.map((option) => ({
+        ...option.icon ? { icon: option.icon } : {},
+        ...option.description ? { title: option.description } : {},
+        label: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-col", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-2 font-medium", children: [
+            option.label,
+            option.value === value && /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiCheck.UiCheck, className: "text-xs text-muted-foreground" })
+          ] }),
+          option.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: option.description })
+        ] }),
+        onSelect: () => onChange(option.value)
+      }))
+    }
+  );
+}
+exports.CLICKY_FORMAT_OPTIONS = CLICKY_FORMAT_OPTIONS;
+exports.FormatOptionsDropdown = FormatOptionsDropdown;
+//# sourceMappingURL=FormatOptionsDropdown.cjs.map

package/dist/components/FormatOptionsDropdown.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormatOptionsDropdown.cjs","sources":["../../src/components/FormatOptionsDropdown.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { type ButtonProps } from \"./button\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiCheck, UiComment, UiEye, UiFileCode, UiTable } from \"../icons\";\nimport { SplitButton } from \"./SplitButton\";\n\nexport type FormatOption = {\n  /** Stable identifier emitted by `onChange`. */\n  value: string;\n  /** Visible label. */\n  label: string;\n  /** Secondary description shown in the menu. */\n  description?: string;\n  /** Icon rendered before the label. */\n  icon?: StaticIconComponent;\n};\n\n/**\n * Clicky output formats with their label, description, and icon. Mirrors the\n * metadata in `Clicky.tsx`'s `getRemoteFormatMeta` so the format picker can live\n * as a standalone component.\n */\nexport const CLICKY_FORMAT_OPTIONS: FormatOption[] = [\n  { value: \"clicky\", label: \"Clicky\", description: \"Rendered Clicky JSON with the rich Clicky viewer\", icon: UiEye },\n  { value: \"json\", label: \"JSON\", description: \"Plain JSON for inspecting the raw response body\", icon: UiFileCode },\n  { value: \"yaml\", label: \"YAML\", description: \"YAML for config-friendly inspection and export\", icon: UiFileCode },\n  { value: \"csv\", label: \"CSV\", description: \"Comma-separated values for spreadsheets and imports\", icon: UiTable },\n  { value: \"markdown\", label: \"Markdown\", description: \"Markdown formatted for docs, comments, and chat\", icon: UiFileCode },\n  { value: \"html\", label: \"HTML\", description: \"Browser-ready HTML preview of the formatted output\", icon: UiFileCode },\n  { value: \"pdf\", label: \"PDF\", description: \"Portable document for sharing and printing\", icon: UiFileCode },\n  { value: \"pretty\", label: \"Pretty\", description: \"Human-readable plain text output from the formatter\", icon: UiFileCode },\n  { value: \"excel\", label: \"Excel\", description: \"Spreadsheet workbook for offline analysis\", icon: UiTable },\n  { value: \"slack\", label: \"Slack\", description: \"Slack Block Kit JSON for chat-native output\", icon: UiComment },\n];\n\nexport type FormatOptionsDropdownProps = {\n  /** Active format value. */\n  value: string;\n  /** Called with the chosen format value. */\n  onChange: (value: string) => void;\n  /** Available formats. Defaults to the clicky output formats. */\n  options?: FormatOption[];\n  /** Override the primary button label. Defaults to the active option's label. */\n  label?: ReactNode;\n  /** Variant forwarded to the split button. */\n  variant?: ButtonProps[\"variant\"];\n  /** Size forwarded to the split button. */\n  size?: ButtonProps[\"size\"];\n  /** Classes applied to the wrapper. */\n  className?: string;\n};\n\nexport function FormatOptionsDropdown({\n  value,\n  onChange,\n  options = CLICKY_FORMAT_OPTIONS,\n  label,\n  variant = \"outline\",\n  size = \"default\",\n  className,\n}: FormatOptionsDropdownProps) {\n  const active = options.find((option) => option.value === value);\n\n  return (\n    <SplitButton\n      label={label ?? active?.label ?? value}\n      {...(active?.icon ? { icon: active.icon } : {})}\n      onClick={() => onChange(value)}\n      variant={variant}\n      size={size}\n      title=\"Choose format\"\n      {...(className ? { className } : {})}\n      menuClassName=\"min-w-[18rem]\"\n      items={options.map((option) => ({\n        ...(option.icon ? { icon: option.icon } : {}),\n        ...(option.description ? { title: option.description } : {}),\n        label: (\n          <span className=\"flex min-w-0 flex-col\">\n            <span className=\"flex items-center gap-2 font-medium\">\n              {option.label}\n              {option.value === value && <Icon icon={UiCheck} className=\"text-xs text-muted-foreground\" />}\n            </span>\n            {option.description && (\n              <span className=\"text-xs text-muted-foreground\">{option.description}</span>\n            )}\n          </span>\n        ),\n        onSelect: () => onChange(option.value),\n      }))}\n    />\n  );\n}\n"],"names":["UiEye","UiFileCode","UiTable","UiComment","jsx","SplitButton","jsxs","Icon","UiCheck"],"mappings":";;;;;;;;;;;AAsBO,MAAM,wBAAwC;AAAA,EACnD,EAAE,OAAO,UAAU,OAAO,UAAU,aAAa,oDAAoD,MAAMA,YAAA;AAAA,EAC3G,EAAE,OAAO,QAAQ,OAAO,QAAQ,aAAa,mDAAmD,MAAMC,sBAAA;AAAA,EACtG,EAAE,OAAO,QAAQ,OAAO,QAAQ,aAAa,kDAAkD,MAAMA,sBAAA;AAAA,EACrG,EAAE,OAAO,OAAO,OAAO,OAAO,aAAa,uDAAuD,MAAMC,gBAAA;AAAA,EACxG,EAAE,OAAO,YAAY,OAAO,YAAY,aAAa,mDAAmD,MAAMD,sBAAA;AAAA,EAC9G,EAAE,OAAO,QAAQ,OAAO,QAAQ,aAAa,sDAAsD,MAAMA,sBAAA;AAAA,EACzG,EAAE,OAAO,OAAO,OAAO,OAAO,aAAa,8CAA8C,MAAMA,sBAAA;AAAA,EAC/F,EAAE,OAAO,UAAU,OAAO,UAAU,aAAa,uDAAuD,MAAMA,sBAAA;AAAA,EAC9G,EAAE,OAAO,SAAS,OAAO,SAAS,aAAa,6CAA6C,MAAMC,gBAAA;AAAA,EAClG,EAAE,OAAO,SAAS,OAAO,SAAS,aAAa,+CAA+C,MAAMC,UAAAA,UAAA;AACtG;AAmBO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP;AACF,GAA+B;AAC7B,QAAM,SAAS,QAAQ,KAAK,CAAC,WAAW,OAAO,UAAU,KAAK;AAE9D,SACEC,2BAAAA;AAAAA,IAACC,YAAAA;AAAAA,IAAA;AAAA,MACC,OAAO,UAAS,iCAAQ,UAAS;AAAA,MAChC,IAAI,iCAAQ,QAAO,EAAE,MAAM,OAAO,KAAA,IAAS,CAAA;AAAA,MAC5C,SAAS,MAAM,SAAS,KAAK;AAAA,MAC7B;AAAA,MACA;AAAA,MACA,OAAM;AAAA,MACL,GAAI,YAAY,EAAE,UAAA,IAAc,CAAA;AAAA,MACjC,eAAc;AAAA,MACd,OAAO,QAAQ,IAAI,CAAC,YAAY;AAAA,QAC9B,GAAI,OAAO,OAAO,EAAE,MAAM,OAAO,KAAA,IAAS,CAAA;AAAA,QAC1C,GAAI,OAAO,cAAc,EAAE,OAAO,OAAO,YAAA,IAAgB,CAAA;AAAA,QACzD,OACEC,2BAAAA,KAAC,QAAA,EAAK,WAAU,yBACd,UAAA;AAAA,UAAAA,2BAAAA,KAAC,QAAA,EAAK,WAAU,uCACb,UAAA;AAAA,YAAA,OAAO;AAAA,YACP,OAAO,UAAU,SAASF,+BAACG,KAAAA,QAAK,MAAMC,QAAAA,SAAS,WAAU,gCAAA,CAAgC;AAAA,UAAA,GAC5F;AAAA,UACC,OAAO,eACNJ,2BAAAA,IAAC,UAAK,WAAU,iCAAiC,iBAAO,YAAA,CAAY;AAAA,QAAA,GAExE;AAAA,QAEF,UAAU,MAAM,SAAS,OAAO,KAAK;AAAA,MAAA,EACrC;AAAA,IAAA;AAAA,EAAA;AAGR;;;"}

package/dist/components/FormatOptionsDropdown.d.ts

@@ -0,0 +1,37 @@
+import { ReactNode } from 'react';
+import { ButtonProps } from './button';
+import { StaticIconComponent } from '../data/Icon';
+export type FormatOption = {
+    /** Stable identifier emitted by `onChange`. */
+    value: string;
+    /** Visible label. */
+    label: string;
+    /** Secondary description shown in the menu. */
+    description?: string;
+    /** Icon rendered before the label. */
+    icon?: StaticIconComponent;
+};
+/**
+ * Clicky output formats with their label, description, and icon. Mirrors the
+ * metadata in `Clicky.tsx`'s `getRemoteFormatMeta` so the format picker can live
+ * as a standalone component.
+ */
+export declare const CLICKY_FORMAT_OPTIONS: FormatOption[];
+export type FormatOptionsDropdownProps = {
+    /** Active format value. */
+    value: string;
+    /** Called with the chosen format value. */
+    onChange: (value: string) => void;
+    /** Available formats. Defaults to the clicky output formats. */
+    options?: FormatOption[];
+    /** Override the primary button label. Defaults to the active option's label. */
+    label?: ReactNode;
+    /** Variant forwarded to the split button. */
+    variant?: ButtonProps["variant"];
+    /** Size forwarded to the split button. */
+    size?: ButtonProps["size"];
+    /** Classes applied to the wrapper. */
+    className?: string;
+};
+export declare function FormatOptionsDropdown({ value, onChange, options, label, variant, size, className, }: FormatOptionsDropdownProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FormatOptionsDropdown.d.ts.map

package/dist/components/FormatOptionsDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormatOptionsDropdown.d.ts","sourceRoot":"","sources":["../../src/components/FormatOptionsDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAQ,KAAK,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAI9D,MAAM,MAAM,YAAY,GAAG;IACzB,+CAA+C;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,qBAAqB;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sCAAsC;IACtC,IAAI,CAAC,EAAE,mBAAmB,CAAC;CAC5B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,EAAE,YAAY,EAW/C,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACvC,2BAA2B;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,gEAAgE;IAChE,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,gFAAgF;IAChF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC,0CAA0C;IAC1C,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,QAAQ,EACR,OAA+B,EAC/B,KAAK,EACL,OAAmB,EACnB,IAAgB,EAChB,SAAS,GACV,EAAE,0BAA0B,2CA+B5B"}

package/dist/components/FormatOptionsDropdown.js

@@ -0,0 +1,62 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { Icon } from "../data/Icon.js";
+import { SplitButton } from "./SplitButton.js";
+import { UiEye } from "../icons/components/UiEye.js";
+import { UiFileCode } from "../icons/components/UiFileCode.js";
+import { UiTable } from "../icons/components/UiTable.js";
+import { UiComment } from "../icons/components/UiComment.js";
+import { UiCheck } from "../icons/components/UiCheck.js";
+const CLICKY_FORMAT_OPTIONS = [
+  { value: "clicky", label: "Clicky", description: "Rendered Clicky JSON with the rich Clicky viewer", icon: UiEye },
+  { value: "json", label: "JSON", description: "Plain JSON for inspecting the raw response body", icon: UiFileCode },
+  { value: "yaml", label: "YAML", description: "YAML for config-friendly inspection and export", icon: UiFileCode },
+  { value: "csv", label: "CSV", description: "Comma-separated values for spreadsheets and imports", icon: UiTable },
+  { value: "markdown", label: "Markdown", description: "Markdown formatted for docs, comments, and chat", icon: UiFileCode },
+  { value: "html", label: "HTML", description: "Browser-ready HTML preview of the formatted output", icon: UiFileCode },
+  { value: "pdf", label: "PDF", description: "Portable document for sharing and printing", icon: UiFileCode },
+  { value: "pretty", label: "Pretty", description: "Human-readable plain text output from the formatter", icon: UiFileCode },
+  { value: "excel", label: "Excel", description: "Spreadsheet workbook for offline analysis", icon: UiTable },
+  { value: "slack", label: "Slack", description: "Slack Block Kit JSON for chat-native output", icon: UiComment }
+];
+function FormatOptionsDropdown({
+  value,
+  onChange,
+  options = CLICKY_FORMAT_OPTIONS,
+  label,
+  variant = "outline",
+  size = "default",
+  className
+}) {
+  const active = options.find((option) => option.value === value);
+  return /* @__PURE__ */ jsx(
+    SplitButton,
+    {
+      label: label ?? (active == null ? void 0 : active.label) ?? value,
+      ...(active == null ? void 0 : active.icon) ? { icon: active.icon } : {},
+      onClick: () => onChange(value),
+      variant,
+      size,
+      title: "Choose format",
+      ...className ? { className } : {},
+      menuClassName: "min-w-[18rem]",
+      items: options.map((option) => ({
+        ...option.icon ? { icon: option.icon } : {},
+        ...option.description ? { title: option.description } : {},
+        label: /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-col", children: [
+          /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2 font-medium", children: [
+            option.label,
+            option.value === value && /* @__PURE__ */ jsx(Icon, { icon: UiCheck, className: "text-xs text-muted-foreground" })
+          ] }),
+          option.description && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: option.description })
+        ] }),
+        onSelect: () => onChange(option.value)
+      }))
+    }
+  );
+}
+export {
+  CLICKY_FORMAT_OPTIONS,
+  FormatOptionsDropdown
+};
+//# sourceMappingURL=FormatOptionsDropdown.js.map

package/dist/components/FormatOptionsDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormatOptionsDropdown.js","sources":["../../src/components/FormatOptionsDropdown.tsx"],"sourcesContent":["import { type ReactNode } from \"react\";\nimport { type ButtonProps } from \"./button\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiCheck, UiComment, UiEye, UiFileCode, UiTable } from \"../icons\";\nimport { SplitButton } from \"./SplitButton\";\n\nexport type FormatOption = {\n  /** Stable identifier emitted by `onChange`. */\n  value: string;\n  /** Visible label. */\n  label: string;\n  /** Secondary description shown in the menu. */\n  description?: string;\n  /** Icon rendered before the label. */\n  icon?: StaticIconComponent;\n};\n\n/**\n * Clicky output formats with their label, description, and icon. Mirrors the\n * metadata in `Clicky.tsx`'s `getRemoteFormatMeta` so the format picker can live\n * as a standalone component.\n */\nexport const CLICKY_FORMAT_OPTIONS: FormatOption[] = [\n  { value: \"clicky\", label: \"Clicky\", description: \"Rendered Clicky JSON with the rich Clicky viewer\", icon: UiEye },\n  { value: \"json\", label: \"JSON\", description: \"Plain JSON for inspecting the raw response body\", icon: UiFileCode },\n  { value: \"yaml\", label: \"YAML\", description: \"YAML for config-friendly inspection and export\", icon: UiFileCode },\n  { value: \"csv\", label: \"CSV\", description: \"Comma-separated values for spreadsheets and imports\", icon: UiTable },\n  { value: \"markdown\", label: \"Markdown\", description: \"Markdown formatted for docs, comments, and chat\", icon: UiFileCode },\n  { value: \"html\", label: \"HTML\", description: \"Browser-ready HTML preview of the formatted output\", icon: UiFileCode },\n  { value: \"pdf\", label: \"PDF\", description: \"Portable document for sharing and printing\", icon: UiFileCode },\n  { value: \"pretty\", label: \"Pretty\", description: \"Human-readable plain text output from the formatter\", icon: UiFileCode },\n  { value: \"excel\", label: \"Excel\", description: \"Spreadsheet workbook for offline analysis\", icon: UiTable },\n  { value: \"slack\", label: \"Slack\", description: \"Slack Block Kit JSON for chat-native output\", icon: UiComment },\n];\n\nexport type FormatOptionsDropdownProps = {\n  /** Active format value. */\n  value: string;\n  /** Called with the chosen format value. */\n  onChange: (value: string) => void;\n  /** Available formats. Defaults to the clicky output formats. */\n  options?: FormatOption[];\n  /** Override the primary button label. Defaults to the active option's label. */\n  label?: ReactNode;\n  /** Variant forwarded to the split button. */\n  variant?: ButtonProps[\"variant\"];\n  /** Size forwarded to the split button. */\n  size?: ButtonProps[\"size\"];\n  /** Classes applied to the wrapper. */\n  className?: string;\n};\n\nexport function FormatOptionsDropdown({\n  value,\n  onChange,\n  options = CLICKY_FORMAT_OPTIONS,\n  label,\n  variant = \"outline\",\n  size = \"default\",\n  className,\n}: FormatOptionsDropdownProps) {\n  const active = options.find((option) => option.value === value);\n\n  return (\n    <SplitButton\n      label={label ?? active?.label ?? value}\n      {...(active?.icon ? { icon: active.icon } : {})}\n      onClick={() => onChange(value)}\n      variant={variant}\n      size={size}\n      title=\"Choose format\"\n      {...(className ? { className } : {})}\n      menuClassName=\"min-w-[18rem]\"\n      items={options.map((option) => ({\n        ...(option.icon ? { icon: option.icon } : {}),\n        ...(option.description ? { title: option.description } : {}),\n        label: (\n          <span className=\"flex min-w-0 flex-col\">\n            <span className=\"flex items-center gap-2 font-medium\">\n              {option.label}\n              {option.value === value && <Icon icon={UiCheck} className=\"text-xs text-muted-foreground\" />}\n            </span>\n            {option.description && (\n              <span className=\"text-xs text-muted-foreground\">{option.description}</span>\n            )}\n          </span>\n        ),\n        onSelect: () => onChange(option.value),\n      }))}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AAsBO,MAAM,wBAAwC;AAAA,EACnD,EAAE,OAAO,UAAU,OAAO,UAAU,aAAa,oDAAoD,MAAM,MAAA;AAAA,EAC3G,EAAE,OAAO,QAAQ,OAAO,QAAQ,aAAa,mDAAmD,MAAM,WAAA;AAAA,EACtG,EAAE,OAAO,QAAQ,OAAO,QAAQ,aAAa,kDAAkD,MAAM,WAAA;AAAA,EACrG,EAAE,OAAO,OAAO,OAAO,OAAO,aAAa,uDAAuD,MAAM,QAAA;AAAA,EACxG,EAAE,OAAO,YAAY,OAAO,YAAY,aAAa,mDAAmD,MAAM,WAAA;AAAA,EAC9G,EAAE,OAAO,QAAQ,OAAO,QAAQ,aAAa,sDAAsD,MAAM,WAAA;AAAA,EACzG,EAAE,OAAO,OAAO,OAAO,OAAO,aAAa,8CAA8C,MAAM,WAAA;AAAA,EAC/F,EAAE,OAAO,UAAU,OAAO,UAAU,aAAa,uDAAuD,MAAM,WAAA;AAAA,EAC9G,EAAE,OAAO,SAAS,OAAO,SAAS,aAAa,6CAA6C,MAAM,QAAA;AAAA,EAClG,EAAE,OAAO,SAAS,OAAO,SAAS,aAAa,+CAA+C,MAAM,UAAA;AACtG;AAmBO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP;AACF,GAA+B;AAC7B,QAAM,SAAS,QAAQ,KAAK,CAAC,WAAW,OAAO,UAAU,KAAK;AAE9D,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,UAAS,iCAAQ,UAAS;AAAA,MAChC,IAAI,iCAAQ,QAAO,EAAE,MAAM,OAAO,KAAA,IAAS,CAAA;AAAA,MAC5C,SAAS,MAAM,SAAS,KAAK;AAAA,MAC7B;AAAA,MACA;AAAA,MACA,OAAM;AAAA,MACL,GAAI,YAAY,EAAE,UAAA,IAAc,CAAA;AAAA,MACjC,eAAc;AAAA,MACd,OAAO,QAAQ,IAAI,CAAC,YAAY;AAAA,QAC9B,GAAI,OAAO,OAAO,EAAE,MAAM,OAAO,KAAA,IAAS,CAAA;AAAA,QAC1C,GAAI,OAAO,cAAc,EAAE,OAAO,OAAO,YAAA,IAAgB,CAAA;AAAA,QACzD,OACE,qBAAC,QAAA,EAAK,WAAU,yBACd,UAAA;AAAA,UAAA,qBAAC,QAAA,EAAK,WAAU,uCACb,UAAA;AAAA,YAAA,OAAO;AAAA,YACP,OAAO,UAAU,SAAS,oBAAC,QAAK,MAAM,SAAS,WAAU,gCAAA,CAAgC;AAAA,UAAA,GAC5F;AAAA,UACC,OAAO,eACN,oBAAC,UAAK,WAAU,iCAAiC,iBAAO,YAAA,CAAY;AAAA,QAAA,GAExE;AAAA,QAEF,UAAU,MAAM,SAAS,OAAO,KAAK;AAAA,MAAA,EACrC;AAAA,IAAA;AAAA,EAAA;AAGR;"}

package/dist/components/SplitButton.cjs

@@ -0,0 +1,87 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const utils = require("../lib/utils.cjs");
+const button = require("./button.cjs");
+const Icon = require("../data/Icon.cjs");
+const DropdownMenu = require("../overlay/DropdownMenu.cjs");
+const UiChevronUp = require("../icons/components/UiChevronUp.cjs");
+const UiChevronDown = require("../icons/components/UiChevronDown.cjs");
+function SplitButton({
+  label,
+  onClick,
+  items,
+  icon,
+  variant = "default",
+  size = "default",
+  loading = false,
+  disabled = false,
+  align = "right",
+  title,
+  className,
+  menuClassName
+}) {
+  const [open, setOpen] = react.useState(false);
+  if (items.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      button.Button,
+      {
+        variant,
+        size,
+        loading,
+        disabled,
+        onClick,
+        className,
+        children: [
+          icon && /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { ...typeof icon === "string" ? { name: icon } : { icon } }),
+          label
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("inline-flex items-stretch", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      button.Button,
+      {
+        variant,
+        size,
+        loading,
+        disabled,
+        onClick,
+        className: "rounded-r-none",
+        children: [
+          icon && /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { ...typeof icon === "string" ? { name: icon } : { icon } }),
+          label
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      DropdownMenu.DropdownMenu,
+      {
+        items,
+        align,
+        className: "items-stretch",
+        ...menuClassName ? { menuClassName } : {},
+        onOpenChange: setOpen,
+        trigger: /* @__PURE__ */ jsxRuntime.jsx(
+          button.Button,
+          {
+            variant,
+            size: size === "default" ? "icon" : size,
+            disabled,
+            title,
+            "aria-label": title ?? "Open menu",
+            className: utils.cn(
+              "h-auto self-stretch rounded-l-none border-l border-l-current/25 px-2",
+              size !== "icon" && "w-8"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: open ? UiChevronUp.UiChevronUp : UiChevronDown.UiChevronDown })
+          }
+        )
+      }
+    )
+  ] });
+}
+exports.SplitButton = SplitButton;
+//# sourceMappingURL=SplitButton.cjs.map

package/dist/components/SplitButton.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton.cjs","sources":["../../src/components/SplitButton.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Button, type ButtonProps } from \"./button\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiChevronDown, UiChevronUp } from \"../icons\";\nimport { DropdownMenu, type DropdownMenuItem } from \"../overlay/DropdownMenu\";\n\nexport type SplitButtonProps = {\n  /** Content of the primary action button. */\n  label: ReactNode;\n  /** Primary action handler. */\n  onClick: () => void;\n  /** Secondary actions listed in the dropdown menu. */\n  items: DropdownMenuItem[];\n  /** Icon shown before the primary label. */\n  icon?: string | StaticIconComponent;\n  /** Variant forwarded to both halves. */\n  variant?: ButtonProps[\"variant\"];\n  /** Size forwarded to both halves. */\n  size?: ButtonProps[\"size\"];\n  /** Show a spinner and disable the primary half while pending. */\n  loading?: boolean;\n  /** Disable both halves. */\n  disabled?: boolean;\n  /** Horizontal alignment of the menu relative to the trigger. */\n  align?: \"left\" | \"right\";\n  /** Browser tooltip / accessible label for the chevron trigger. */\n  title?: string;\n  /** Classes applied to the wrapper. */\n  className?: string;\n  /** Classes applied to the floating menu. */\n  menuClassName?: string;\n};\n\nexport function SplitButton({\n  label,\n  onClick,\n  items,\n  icon,\n  variant = \"default\",\n  size = \"default\",\n  loading = false,\n  disabled = false,\n  align = \"right\",\n  title,\n  className,\n  menuClassName,\n}: SplitButtonProps) {\n  const [open, setOpen] = useState(false);\n\n  if (items.length === 0) {\n    return (\n      <Button\n        variant={variant}\n        size={size}\n        loading={loading}\n        disabled={disabled}\n        onClick={onClick}\n        className={className}\n      >\n        {icon && <Icon {...(typeof icon === \"string\" ? { name: icon } : { icon })} />}\n        {label}\n      </Button>\n    );\n  }\n\n  return (\n    <div className={cn(\"inline-flex items-stretch\", className)}>\n      <Button\n        variant={variant}\n        size={size}\n        loading={loading}\n        disabled={disabled}\n        onClick={onClick}\n        className=\"rounded-r-none\"\n      >\n        {icon && <Icon {...(typeof icon === \"string\" ? { name: icon } : { icon })} />}\n        {label}\n      </Button>\n      <DropdownMenu\n        items={items}\n        align={align}\n        className=\"items-stretch\"\n        {...(menuClassName ? { menuClassName } : {})}\n        onOpenChange={setOpen}\n        trigger={\n          <Button\n            variant={variant}\n            size={size === \"default\" ? \"icon\" : size}\n            disabled={disabled}\n            title={title}\n            aria-label={title ?? \"Open menu\"}\n            className={cn(\n              \"h-auto self-stretch rounded-l-none border-l border-l-current/25 px-2\",\n              size !== \"icon\" && \"w-8\",\n            )}\n          >\n            <Icon icon={open ? UiChevronUp : UiChevronDown} />\n          </Button>\n        }\n      />\n    </div>\n  );\n}\n"],"names":["useState","jsxs","Button","jsx","Icon","cn","DropdownMenu","UiChevronUp","UiChevronDown"],"mappings":";;;;;;;;;;AAkCO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AACF,GAAqB;AACnB,QAAM,CAAC,MAAM,OAAO,IAAIA,MAAAA,SAAS,KAAK;AAEtC,MAAI,MAAM,WAAW,GAAG;AACtB,WACEC,2BAAAA;AAAAA,MAACC,OAAAA;AAAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC,UAAA;AAAA,UAAA,QAAQC,2BAAAA,IAACC,WAAA,EAAM,GAAI,OAAO,SAAS,WAAW,EAAE,MAAM,KAAA,IAAS,EAAE,KAAA,EAAK,CAAI;AAAA,UAC1E;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AAEA,yCACG,OAAA,EAAI,WAAWC,MAAAA,GAAG,6BAA6B,SAAS,GACvD,UAAA;AAAA,IAAAJ,2BAAAA;AAAAA,MAACC,OAAAA;AAAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAU;AAAA,QAET,UAAA;AAAA,UAAA,QAAQC,2BAAAA,IAACC,WAAA,EAAM,GAAI,OAAO,SAAS,WAAW,EAAE,MAAM,KAAA,IAAS,EAAE,KAAA,EAAK,CAAI;AAAA,UAC1E;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEHD,2BAAAA;AAAAA,MAACG,aAAAA;AAAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAU;AAAA,QACT,GAAI,gBAAgB,EAAE,cAAA,IAAkB,CAAA;AAAA,QACzC,cAAc;AAAA,QACd,SACEH,2BAAAA;AAAAA,UAACD,OAAAA;AAAAA,UAAA;AAAA,YACC;AAAA,YACA,MAAM,SAAS,YAAY,SAAS;AAAA,YACpC;AAAA,YACA;AAAA,YACA,cAAY,SAAS;AAAA,YACrB,WAAWG,MAAAA;AAAAA,cACT;AAAA,cACA,SAAS,UAAU;AAAA,YAAA;AAAA,YAGrB,UAAAF,2BAAAA,IAACC,WAAA,EAAK,MAAM,OAAOG,YAAAA,cAAcC,4BAAA,CAAe;AAAA,UAAA;AAAA,QAAA;AAAA,MAClD;AAAA,IAAA;AAAA,EAEJ,GACF;AAEJ;;"}

package/dist/components/SplitButton.d.ts

@@ -0,0 +1,32 @@
+import { ReactNode } from 'react';
+import { ButtonProps } from './button';
+import { StaticIconComponent } from '../data/Icon';
+import { DropdownMenuItem } from '../overlay/DropdownMenu';
+export type SplitButtonProps = {
+    /** Content of the primary action button. */
+    label: ReactNode;
+    /** Primary action handler. */
+    onClick: () => void;
+    /** Secondary actions listed in the dropdown menu. */
+    items: DropdownMenuItem[];
+    /** Icon shown before the primary label. */
+    icon?: string | StaticIconComponent;
+    /** Variant forwarded to both halves. */
+    variant?: ButtonProps["variant"];
+    /** Size forwarded to both halves. */
+    size?: ButtonProps["size"];
+    /** Show a spinner and disable the primary half while pending. */
+    loading?: boolean;
+    /** Disable both halves. */
+    disabled?: boolean;
+    /** Horizontal alignment of the menu relative to the trigger. */
+    align?: "left" | "right";
+    /** Browser tooltip / accessible label for the chevron trigger. */
+    title?: string;
+    /** Classes applied to the wrapper. */
+    className?: string;
+    /** Classes applied to the floating menu. */
+    menuClassName?: string;
+};
+export declare function SplitButton({ label, onClick, items, icon, variant, size, loading, disabled, align, title, className, menuClassName, }: SplitButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SplitButton.d.ts.map

package/dist/components/SplitButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton.d.ts","sourceRoot":"","sources":["../../src/components/SplitButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAQ,KAAK,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAE9D,OAAO,EAAgB,KAAK,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE9E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,4CAA4C;IAC5C,KAAK,EAAE,SAAS,CAAC;IACjB,8BAA8B;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,qDAAqD;IACrD,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,2CAA2C;IAC3C,IAAI,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACpC,wCAAwC;IACxC,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC,qCAAqC;IACrC,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,iEAAiE;IACjE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,KAAK,EACL,IAAI,EACJ,OAAmB,EACnB,IAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,KAAe,EACf,KAAK,EACL,SAAS,EACT,aAAa,GACd,EAAE,gBAAgB,2CAwDlB"}

package/dist/components/SplitButton.js

@@ -0,0 +1,87 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { cn } from "../lib/utils.js";
+import { Button } from "./button.js";
+import { Icon } from "../data/Icon.js";
+import { DropdownMenu } from "../overlay/DropdownMenu.js";
+import { UiChevronUp } from "../icons/components/UiChevronUp.js";
+import { UiChevronDown } from "../icons/components/UiChevronDown.js";
+function SplitButton({
+  label,
+  onClick,
+  items,
+  icon,
+  variant = "default",
+  size = "default",
+  loading = false,
+  disabled = false,
+  align = "right",
+  title,
+  className,
+  menuClassName
+}) {
+  const [open, setOpen] = useState(false);
+  if (items.length === 0) {
+    return /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant,
+        size,
+        loading,
+        disabled,
+        onClick,
+        className,
+        children: [
+          icon && /* @__PURE__ */ jsx(Icon, { ...typeof icon === "string" ? { name: icon } : { icon } }),
+          label
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { className: cn("inline-flex items-stretch", className), children: [
+    /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant,
+        size,
+        loading,
+        disabled,
+        onClick,
+        className: "rounded-r-none",
+        children: [
+          icon && /* @__PURE__ */ jsx(Icon, { ...typeof icon === "string" ? { name: icon } : { icon } }),
+          label
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      DropdownMenu,
+      {
+        items,
+        align,
+        className: "items-stretch",
+        ...menuClassName ? { menuClassName } : {},
+        onOpenChange: setOpen,
+        trigger: /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant,
+            size: size === "default" ? "icon" : size,
+            disabled,
+            title,
+            "aria-label": title ?? "Open menu",
+            className: cn(
+              "h-auto self-stretch rounded-l-none border-l border-l-current/25 px-2",
+              size !== "icon" && "w-8"
+            ),
+            children: /* @__PURE__ */ jsx(Icon, { icon: open ? UiChevronUp : UiChevronDown })
+          }
+        )
+      }
+    )
+  ] });
+}
+export {
+  SplitButton
+};
+//# sourceMappingURL=SplitButton.js.map

package/dist/components/SplitButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton.js","sources":["../../src/components/SplitButton.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Button, type ButtonProps } from \"./button\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiChevronDown, UiChevronUp } from \"../icons\";\nimport { DropdownMenu, type DropdownMenuItem } from \"../overlay/DropdownMenu\";\n\nexport type SplitButtonProps = {\n  /** Content of the primary action button. */\n  label: ReactNode;\n  /** Primary action handler. */\n  onClick: () => void;\n  /** Secondary actions listed in the dropdown menu. */\n  items: DropdownMenuItem[];\n  /** Icon shown before the primary label. */\n  icon?: string | StaticIconComponent;\n  /** Variant forwarded to both halves. */\n  variant?: ButtonProps[\"variant\"];\n  /** Size forwarded to both halves. */\n  size?: ButtonProps[\"size\"];\n  /** Show a spinner and disable the primary half while pending. */\n  loading?: boolean;\n  /** Disable both halves. */\n  disabled?: boolean;\n  /** Horizontal alignment of the menu relative to the trigger. */\n  align?: \"left\" | \"right\";\n  /** Browser tooltip / accessible label for the chevron trigger. */\n  title?: string;\n  /** Classes applied to the wrapper. */\n  className?: string;\n  /** Classes applied to the floating menu. */\n  menuClassName?: string;\n};\n\nexport function SplitButton({\n  label,\n  onClick,\n  items,\n  icon,\n  variant = \"default\",\n  size = \"default\",\n  loading = false,\n  disabled = false,\n  align = \"right\",\n  title,\n  className,\n  menuClassName,\n}: SplitButtonProps) {\n  const [open, setOpen] = useState(false);\n\n  if (items.length === 0) {\n    return (\n      <Button\n        variant={variant}\n        size={size}\n        loading={loading}\n        disabled={disabled}\n        onClick={onClick}\n        className={className}\n      >\n        {icon && <Icon {...(typeof icon === \"string\" ? { name: icon } : { icon })} />}\n        {label}\n      </Button>\n    );\n  }\n\n  return (\n    <div className={cn(\"inline-flex items-stretch\", className)}>\n      <Button\n        variant={variant}\n        size={size}\n        loading={loading}\n        disabled={disabled}\n        onClick={onClick}\n        className=\"rounded-r-none\"\n      >\n        {icon && <Icon {...(typeof icon === \"string\" ? { name: icon } : { icon })} />}\n        {label}\n      </Button>\n      <DropdownMenu\n        items={items}\n        align={align}\n        className=\"items-stretch\"\n        {...(menuClassName ? { menuClassName } : {})}\n        onOpenChange={setOpen}\n        trigger={\n          <Button\n            variant={variant}\n            size={size === \"default\" ? \"icon\" : size}\n            disabled={disabled}\n            title={title}\n            aria-label={title ?? \"Open menu\"}\n            className={cn(\n              \"h-auto self-stretch rounded-l-none border-l border-l-current/25 px-2\",\n              size !== \"icon\" && \"w-8\",\n            )}\n          >\n            <Icon icon={open ? UiChevronUp : UiChevronDown} />\n          </Button>\n        }\n      />\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAkCO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AACF,GAAqB;AACnB,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AAEtC,MAAI,MAAM,WAAW,GAAG;AACtB,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC,UAAA;AAAA,UAAA,QAAQ,oBAAC,MAAA,EAAM,GAAI,OAAO,SAAS,WAAW,EAAE,MAAM,KAAA,IAAS,EAAE,KAAA,EAAK,CAAI;AAAA,UAC1E;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AAEA,8BACG,OAAA,EAAI,WAAW,GAAG,6BAA6B,SAAS,GACvD,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAU;AAAA,QAET,UAAA;AAAA,UAAA,QAAQ,oBAAC,MAAA,EAAM,GAAI,OAAO,SAAS,WAAW,EAAE,MAAM,KAAA,IAAS,EAAE,KAAA,EAAK,CAAI;AAAA,UAC1E;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEH;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAU;AAAA,QACT,GAAI,gBAAgB,EAAE,cAAA,IAAkB,CAAA;AAAA,QACzC,cAAc;AAAA,QACd,SACE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA,MAAM,SAAS,YAAY,SAAS;AAAA,YACpC;AAAA,YACA;AAAA,YACA,cAAY,SAAS;AAAA,YACrB,WAAW;AAAA,cACT;AAAA,cACA,SAAS,UAAU;AAAA,YAAA;AAAA,YAGrB,UAAA,oBAAC,MAAA,EAAK,MAAM,OAAO,cAAc,cAAA,CAAe;AAAA,UAAA;AAAA,QAAA;AAAA,MAClD;AAAA,IAAA;AAAA,EAEJ,GACF;AAEJ;"}

package/dist/components/icon-menu-picker.cjs

@@ -131,7 +131,7 @@ function IconMenuPickerInner({
           triggerClassName
         ),
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: selected.icon, className: showLabel ? "shrink-0 text-foreground" : void 0 }),
+          /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: selected.icon, ...showLabel ? { className: "shrink-0 text-foreground" } : {} }),
           showLabel && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate text-left capitalize", children: `${ariaLabel}: ${selected.label}` }),
             /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiChevronDown.UiChevronDown, className: "shrink-0 text-muted-foreground" })

package/dist/components/icon-menu-picker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"icon-menu-picker.cjs","sources":["../../src/components/icon-menu-picker.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiCheck, UiChevronDown } from \"../icons\";\nimport { Button } from \"./button\";\n\nexport type IconMenuOption<T extends string> = {\n  value: T;\n  icon: StaticIconComponent;\n  label: string;\n  description?: string;\n};\n\nexport type IconMenuPickerProps<T extends string> = {\n  value: T;\n  onChange: (next: T) => void;\n  options: IconMenuOption<T>[];\n  ariaLabel: string;\n  triggerTitle?: string | undefined;\n  footer?: ReactNode | undefined;\n  showLabel?: boolean | undefined;\n  className?: string | undefined;\n  triggerClassName?: string | undefined;\n  menuClassName?: string | undefined;\n};\n\nfunction IconMenuPickerInner<T extends string>(\n  {\n    value,\n    onChange,\n    options,\n    ariaLabel,\n    triggerTitle,\n    footer,\n    showLabel,\n    className,\n    triggerClassName,\n    menuClassName,\n  }: IconMenuPickerProps<T>,\n  ref: React.Ref<HTMLDivElement>,\n) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n  const [open, setOpen] = useState(false);\n\n  useImperativeHandle(ref, () => rootRef.current as HTMLDivElement);\n\n  const activeIndex = useMemo(\n    () =>\n      Math.max(\n        0,\n        options.findIndex((option) => option.value === value),\n      ),\n    [options, value],\n  );\n\n  const close = useCallback((returnFocus: boolean) => {\n    setOpen(false);\n    if (returnFocus) triggerRef.current?.focus();\n  }, []);\n\n  const select = useCallback(\n    (next: T) => {\n      onChange(next);\n      close(true);\n    },\n    [close, onChange],\n  );\n\n  useEffect(() => {\n    if (!open) return;\n\n    const onPointerDown = (event: PointerEvent) => {\n      if (event.button !== 0) return;\n      if (!rootRef.current?.contains(event.target as Node)) {\n        close(false);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        event.preventDefault();\n        close(true);\n      }\n    };\n\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [close, open]);\n\n  useEffect(() => {\n    if (!open) return;\n    const node = itemRefs.current[activeIndex];\n    node?.focus();\n  }, [activeIndex, open]);\n\n  const focusItem = (index: number) => {\n    const wrapped = (index + options.length) % options.length;\n    itemRefs.current[wrapped]?.focus();\n  };\n\n  const onMenuKeyDown = (event: ReactKeyboardEvent<HTMLDivElement>) => {\n    const focusedIndex = itemRefs.current.findIndex((node) => node === document.activeElement);\n    if (event.key === \"ArrowDown\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) + 1);\n      return;\n    }\n    if (event.key === \"ArrowUp\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) - 1);\n      return;\n    }\n    if (event.key === \"Home\") {\n      event.preventDefault();\n      focusItem(0);\n      return;\n    }\n    if (event.key === \"End\") {\n      event.preventDefault();\n      focusItem(options.length - 1);\n      return;\n    }\n    if (event.key === \"Tab\") {\n      close(false);\n    }\n  };\n\n  const onTriggerKeyDown = (event: ReactKeyboardEvent<HTMLButtonElement>) => {\n    if (event.key === \"ArrowDown\" || event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  const selected = options[activeIndex];\n  if (!selected) {\n    throw new Error(`IconMenuPicker: value \"${value}\" not found in options for ${ariaLabel}`);\n  }\n\n  return (\n    <div ref={rootRef} className={cn(\"relative inline-flex\", showLabel && \"w-full\", className)}>\n      <Button\n        ref={triggerRef}\n        type=\"button\"\n        variant=\"ghost\"\n        size={showLabel ? \"default\" : \"icon\"}\n        aria-label={ariaLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        title={triggerTitle ?? `${ariaLabel}: ${selected.label}`}\n        onClick={() => setOpen((current) => !current)}\n        onKeyDown={onTriggerKeyDown}\n        className={cn(\n          \"text-muted-foreground hover:text-foreground\",\n          showLabel && \"w-full justify-start\",\n          triggerClassName,\n        )}\n      >\n        <Icon icon={selected.icon} className={showLabel ? \"shrink-0 text-foreground\" : undefined} />\n        {showLabel && (\n          <>\n            <span className=\"min-w-0 flex-1 truncate text-left capitalize\">\n              {`${ariaLabel}: ${selected.label}`}\n            </span>\n            <Icon icon={UiChevronDown} className=\"shrink-0 text-muted-foreground\" />\n          </>\n        )}\n      </Button>\n      {open && (\n        <div\n          role=\"menu\"\n          aria-label={ariaLabel}\n          onKeyDown={onMenuKeyDown}\n          className={cn(\n            \"absolute left-0 top-[calc(100%+0.375rem)] z-50 min-w-[12rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n            menuClassName,\n          )}\n        >\n          {options.map((option, index) => {\n            const active = option.value === value;\n            return (\n              <button\n                key={option.value}\n                ref={(node) => {\n                  itemRefs.current[index] = node;\n                }}\n                type=\"button\"\n                role=\"menuitemradio\"\n                aria-checked={active}\n                tabIndex={active ? 0 : -1}\n                onClick={() => select(option.value)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" || event.key === \" \") {\n                    event.preventDefault();\n                    select(option.value);\n                  }\n                }}\n                className={cn(\n                  \"flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm transition-colors\",\n                  \"hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none\",\n                  active && \"text-foreground\",\n                )}\n              >\n                <Icon icon={option.icon} className=\"shrink-0 text-muted-foreground\" />\n                <span className=\"min-w-0 flex-1 truncate capitalize\">{option.label}</span>\n                {active ? (\n                  <Icon icon={UiCheck} className=\"shrink-0 text-foreground\" />\n                ) : (\n                  <span className=\"inline-block size-4 shrink-0\" aria-hidden />\n                )}\n              </button>\n            );\n          })}\n          {footer ? (\n            <div className=\"mt-1 border-t border-border/60 px-2 py-1.5 text-[11px] text-muted-foreground\">\n              {footer}\n            </div>\n          ) : null}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const IconMenuPicker = forwardRef(IconMenuPickerInner) as <T extends string>(\n  props: IconMenuPickerProps<T> & { ref?: React.Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":["useRef","useState","useImperativeHandle","useMemo","useCallback","useEffect","jsxs","cn","Button","jsx","Icon","Fragment","UiChevronDown","UiCheck","forwardRef"],"mappings":"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"}
+{"version":3,"file":"icon-menu-picker.cjs","sources":["../../src/components/icon-menu-picker.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiCheck, UiChevronDown } from \"../icons\";\nimport { Button } from \"./button\";\n\nexport type IconMenuOption<T extends string> = {\n  value: T;\n  icon: StaticIconComponent;\n  label: string;\n  description?: string;\n};\n\nexport type IconMenuPickerProps<T extends string> = {\n  value: T;\n  onChange: (next: T) => void;\n  options: IconMenuOption<T>[];\n  ariaLabel: string;\n  triggerTitle?: string | undefined;\n  footer?: ReactNode | undefined;\n  showLabel?: boolean | undefined;\n  className?: string | undefined;\n  triggerClassName?: string | undefined;\n  menuClassName?: string | undefined;\n};\n\nfunction IconMenuPickerInner<T extends string>(\n  {\n    value,\n    onChange,\n    options,\n    ariaLabel,\n    triggerTitle,\n    footer,\n    showLabel,\n    className,\n    triggerClassName,\n    menuClassName,\n  }: IconMenuPickerProps<T>,\n  ref: React.Ref<HTMLDivElement>,\n) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n  const [open, setOpen] = useState(false);\n\n  useImperativeHandle(ref, () => rootRef.current as HTMLDivElement);\n\n  const activeIndex = useMemo(\n    () =>\n      Math.max(\n        0,\n        options.findIndex((option) => option.value === value),\n      ),\n    [options, value],\n  );\n\n  const close = useCallback((returnFocus: boolean) => {\n    setOpen(false);\n    if (returnFocus) triggerRef.current?.focus();\n  }, []);\n\n  const select = useCallback(\n    (next: T) => {\n      onChange(next);\n      close(true);\n    },\n    [close, onChange],\n  );\n\n  useEffect(() => {\n    if (!open) return;\n\n    const onPointerDown = (event: PointerEvent) => {\n      if (event.button !== 0) return;\n      if (!rootRef.current?.contains(event.target as Node)) {\n        close(false);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        event.preventDefault();\n        close(true);\n      }\n    };\n\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [close, open]);\n\n  useEffect(() => {\n    if (!open) return;\n    const node = itemRefs.current[activeIndex];\n    node?.focus();\n  }, [activeIndex, open]);\n\n  const focusItem = (index: number) => {\n    const wrapped = (index + options.length) % options.length;\n    itemRefs.current[wrapped]?.focus();\n  };\n\n  const onMenuKeyDown = (event: ReactKeyboardEvent<HTMLDivElement>) => {\n    const focusedIndex = itemRefs.current.findIndex((node) => node === document.activeElement);\n    if (event.key === \"ArrowDown\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) + 1);\n      return;\n    }\n    if (event.key === \"ArrowUp\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) - 1);\n      return;\n    }\n    if (event.key === \"Home\") {\n      event.preventDefault();\n      focusItem(0);\n      return;\n    }\n    if (event.key === \"End\") {\n      event.preventDefault();\n      focusItem(options.length - 1);\n      return;\n    }\n    if (event.key === \"Tab\") {\n      close(false);\n    }\n  };\n\n  const onTriggerKeyDown = (event: ReactKeyboardEvent<HTMLButtonElement>) => {\n    if (event.key === \"ArrowDown\" || event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  const selected = options[activeIndex];\n  if (!selected) {\n    throw new Error(`IconMenuPicker: value \"${value}\" not found in options for ${ariaLabel}`);\n  }\n\n  return (\n    <div ref={rootRef} className={cn(\"relative inline-flex\", showLabel && \"w-full\", className)}>\n      <Button\n        ref={triggerRef}\n        type=\"button\"\n        variant=\"ghost\"\n        size={showLabel ? \"default\" : \"icon\"}\n        aria-label={ariaLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        title={triggerTitle ?? `${ariaLabel}: ${selected.label}`}\n        onClick={() => setOpen((current) => !current)}\n        onKeyDown={onTriggerKeyDown}\n        className={cn(\n          \"text-muted-foreground hover:text-foreground\",\n          showLabel && \"w-full justify-start\",\n          triggerClassName,\n        )}\n      >\n        <Icon icon={selected.icon} {...(showLabel ? { className: \"shrink-0 text-foreground\" } : {})} />\n        {showLabel && (\n          <>\n            <span className=\"min-w-0 flex-1 truncate text-left capitalize\">\n              {`${ariaLabel}: ${selected.label}`}\n            </span>\n            <Icon icon={UiChevronDown} className=\"shrink-0 text-muted-foreground\" />\n          </>\n        )}\n      </Button>\n      {open && (\n        <div\n          role=\"menu\"\n          aria-label={ariaLabel}\n          onKeyDown={onMenuKeyDown}\n          className={cn(\n            \"absolute left-0 top-[calc(100%+0.375rem)] z-50 min-w-[12rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n            menuClassName,\n          )}\n        >\n          {options.map((option, index) => {\n            const active = option.value === value;\n            return (\n              <button\n                key={option.value}\n                ref={(node) => {\n                  itemRefs.current[index] = node;\n                }}\n                type=\"button\"\n                role=\"menuitemradio\"\n                aria-checked={active}\n                tabIndex={active ? 0 : -1}\n                onClick={() => select(option.value)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" || event.key === \" \") {\n                    event.preventDefault();\n                    select(option.value);\n                  }\n                }}\n                className={cn(\n                  \"flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm transition-colors\",\n                  \"hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none\",\n                  active && \"text-foreground\",\n                )}\n              >\n                <Icon icon={option.icon} className=\"shrink-0 text-muted-foreground\" />\n                <span className=\"min-w-0 flex-1 truncate capitalize\">{option.label}</span>\n                {active ? (\n                  <Icon icon={UiCheck} className=\"shrink-0 text-foreground\" />\n                ) : (\n                  <span className=\"inline-block size-4 shrink-0\" aria-hidden />\n                )}\n              </button>\n            );\n          })}\n          {footer ? (\n            <div className=\"mt-1 border-t border-border/60 px-2 py-1.5 text-[11px] text-muted-foreground\">\n              {footer}\n            </div>\n          ) : null}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const IconMenuPicker = forwardRef(IconMenuPickerInner) as <T extends string>(\n  props: IconMenuPickerProps<T> & { ref?: React.Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":["useRef","useState","useImperativeHandle","useMemo","useCallback","useEffect","jsxs","cn","Button","jsx","Icon","Fragment","UiChevronDown","UiCheck","forwardRef"],"mappings":";;;;;;;;;AAoCA,SAAS,oBACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GACA,KACA;AACA,QAAM,UAAUA,MAAAA,OAAuB,IAAI;AAC3C,QAAM,aAAaA,MAAAA,OAA0B,IAAI;AACjD,QAAM,WAAWA,MAAAA,OAAqC,EAAE;AACxD,QAAM,CAAC,MAAM,OAAO,IAAIC,MAAAA,SAAS,KAAK;AAEtCC,QAAAA,oBAAoB,KAAK,MAAM,QAAQ,OAAyB;AAEhE,QAAM,cAAcC,MAAAA;AAAAA,IAClB,MACE,KAAK;AAAA,MACH;AAAA,MACA,QAAQ,UAAU,CAAC,WAAW,OAAO,UAAU,KAAK;AAAA,IAAA;AAAA,IAExD,CAAC,SAAS,KAAK;AAAA,EAAA;AAGjB,QAAM,QAAQC,kBAAY,CAAC,gBAAyB;;AAClD,YAAQ,KAAK;AACb,QAAI,YAAa,kBAAW,YAAX,mBAAoB;AAAA,EACvC,GAAG,CAAA,CAAE;AAEL,QAAM,SAASA,MAAAA;AAAAA,IACb,CAAC,SAAY;AACX,eAAS,IAAI;AACb,YAAM,IAAI;AAAA,IACZ;AAAA,IACA,CAAC,OAAO,QAAQ;AAAA,EAAA;AAGlBC,QAAAA,UAAU,MAAM;AACd,QAAI,CAAC,KAAM;AAEX,UAAM,gBAAgB,CAAC,UAAwB;;AAC7C,UAAI,MAAM,WAAW,EAAG;AACxB,UAAI,GAAC,aAAQ,YAAR,mBAAiB,SAAS,MAAM,UAAiB;AACpD,cAAM,KAAK;AAAA,MACb;AAAA,IACF;AAEA,UAAM,YAAY,CAAC,UAAyB;AAC1C,UAAI,MAAM,QAAQ,UAAU;AAC1B,cAAM,eAAA;AACN,cAAM,IAAI;AAAA,MACZ;AAAA,IACF;AAEA,aAAS,iBAAiB,eAAe,aAAa;AACtD,aAAS,iBAAiB,WAAW,SAAS;AAC9C,WAAO,MAAM;AACX,eAAS,oBAAoB,eAAe,aAAa;AACzD,eAAS,oBAAoB,WAAW,SAAS;AAAA,IACnD;AAAA,EACF,GAAG,CAAC,OAAO,IAAI,CAAC;AAEhBA,QAAAA,UAAU,MAAM;AACd,QAAI,CAAC,KAAM;AACX,UAAM,OAAO,SAAS,QAAQ,WAAW;AACzC,iCAAM;AAAA,EACR,GAAG,CAAC,aAAa,IAAI,CAAC;AAEtB,QAAM,YAAY,CAAC,UAAkB;;AACnC,UAAM,WAAW,QAAQ,QAAQ,UAAU,QAAQ;AACnD,mBAAS,QAAQ,OAAO,MAAxB,mBAA2B;AAAA,EAC7B;AAEA,QAAM,gBAAgB,CAAC,UAA8C;AACnE,UAAM,eAAe,SAAS,QAAQ,UAAU,CAAC,SAAS,SAAS,SAAS,aAAa;AACzF,QAAI,MAAM,QAAQ,aAAa;AAC7B,YAAM,eAAA;AACN,iBAAW,eAAe,IAAI,cAAc,gBAAgB,CAAC;AAC7D;AAAA,IACF;AACA,QAAI,MAAM,QAAQ,WAAW;AAC3B,YAAM,eAAA;AACN,iBAAW,eAAe,IAAI,cAAc,gBAAgB,CAAC;AAC7D;AAAA,IACF;AACA,QAAI,MAAM,QAAQ,QAAQ;AACxB,YAAM,eAAA;AACN,gBAAU,CAAC;AACX;AAAA,IACF;AACA,QAAI,MAAM,QAAQ,OAAO;AACvB,YAAM,eAAA;AACN,gBAAU,QAAQ,SAAS,CAAC;AAC5B;AAAA,IACF;AACA,QAAI,MAAM,QAAQ,OAAO;AACvB,YAAM,KAAK;AAAA,IACb;AAAA,EACF;AAEA,QAAM,mBAAmB,CAAC,UAAiD;AACzE,QAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC3E,YAAM,eAAA;AACN,cAAQ,IAAI;AAAA,IACd;AAAA,EACF;AAEA,QAAM,WAAW,QAAQ,WAAW;AACpC,MAAI,CAAC,UAAU;AACb,UAAM,IAAI,MAAM,0BAA0B,KAAK,8BAA8B,SAAS,EAAE;AAAA,EAC1F;AAEA,SACEC,2BAAAA,KAAC,OAAA,EAAI,KAAK,SAAS,WAAWC,SAAG,wBAAwB,aAAa,UAAU,SAAS,GACvF,UAAA;AAAA,IAAAD,2BAAAA;AAAAA,MAACE,OAAAA;AAAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,MAAM,YAAY,YAAY;AAAA,QAC9B,cAAY;AAAA,QACZ,iBAAc;AAAA,QACd,iBAAe;AAAA,QACf,OAAO,gBAAgB,GAAG,SAAS,KAAK,SAAS,KAAK;AAAA,QACtD,SAAS,MAAM,QAAQ,CAAC,YAAY,CAAC,OAAO;AAAA,QAC5C,WAAW;AAAA,QACX,WAAWD,MAAAA;AAAAA,UACT;AAAA,UACA,aAAa;AAAA,UACb;AAAA,QAAA;AAAA,QAGF,UAAA;AAAA,UAAAE,2BAAAA,IAACC,KAAAA,MAAA,EAAK,MAAM,SAAS,MAAO,GAAI,YAAY,EAAE,WAAW,2BAAA,IAA+B,CAAA,EAAC,CAAI;AAAA,UAC5F,aACCJ,2BAAAA,KAAAK,qBAAA,EACE,UAAA;AAAA,YAAAF,2BAAAA,IAAC,QAAA,EAAK,WAAU,gDACb,UAAA,GAAG,SAAS,KAAK,SAAS,KAAK,GAAA,CAClC;AAAA,YACAA,2BAAAA,IAACC,KAAAA,MAAA,EAAK,MAAME,cAAAA,eAAe,WAAU,iCAAA,CAAiC;AAAA,UAAA,EAAA,CACxE;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAGH,QACCN,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,cAAY;AAAA,QACZ,WAAW;AAAA,QACX,WAAWC,MAAAA;AAAAA,UACT;AAAA,UACA;AAAA,QAAA;AAAA,QAGD,UAAA;AAAA,UAAA,QAAQ,IAAI,CAAC,QAAQ,UAAU;AAC9B,kBAAM,SAAS,OAAO,UAAU;AAChC,mBACED,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,KAAK,CAAC,SAAS;AACb,2BAAS,QAAQ,KAAK,IAAI;AAAA,gBAC5B;AAAA,gBACA,MAAK;AAAA,gBACL,MAAK;AAAA,gBACL,gBAAc;AAAA,gBACd,UAAU,SAAS,IAAI;AAAA,gBACvB,SAAS,MAAM,OAAO,OAAO,KAAK;AAAA,gBAClC,WAAW,CAAC,UAAU;AACpB,sBAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,0BAAM,eAAA;AACN,2BAAO,OAAO,KAAK;AAAA,kBACrB;AAAA,gBACF;AAAA,gBACA,WAAWC,MAAAA;AAAAA,kBACT;AAAA,kBACA;AAAA,kBACA,UAAU;AAAA,gBAAA;AAAA,gBAGZ,UAAA;AAAA,kBAAAE,2BAAAA,IAACC,KAAAA,MAAA,EAAK,MAAM,OAAO,MAAM,WAAU,kCAAiC;AAAA,kBACpED,2BAAAA,IAAC,QAAA,EAAK,WAAU,sCAAsC,iBAAO,OAAM;AAAA,kBAClE,SACCA,2BAAAA,IAACC,KAAAA,MAAA,EAAK,MAAMG,QAAAA,SAAS,WAAU,2BAAA,CAA2B,IAE1DJ,2BAAAA,IAAC,QAAA,EAAK,WAAU,gCAA+B,eAAW,KAAA,CAAC;AAAA,gBAAA;AAAA,cAAA;AAAA,cA1BxD,OAAO;AAAA,YAAA;AAAA,UA8BlB,CAAC;AAAA,UACA,SACCA,2BAAAA,IAAC,OAAA,EAAI,WAAU,gFACZ,kBACH,IACE;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACN,GAEJ;AAEJ;AAEO,MAAM,iBAAiBK,MAAAA,WAAW,mBAAmB;;"}

package/dist/components/icon-menu-picker.js

@@ -129,7 +129,7 @@ function IconMenuPickerInner({
           triggerClassName
         ),
         children: [
-          /* @__PURE__ */ jsx(Icon, { icon: selected.icon, className: showLabel ? "shrink-0 text-foreground" : void 0 }),
+          /* @__PURE__ */ jsx(Icon, { icon: selected.icon, ...showLabel ? { className: "shrink-0 text-foreground" } : {} }),
           showLabel && /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-left capitalize", children: `${ariaLabel}: ${selected.label}` }),
             /* @__PURE__ */ jsx(Icon, { icon: UiChevronDown, className: "shrink-0 text-muted-foreground" })

package/dist/components/icon-menu-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-menu-picker.js","sources":["../../src/components/icon-menu-picker.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiCheck, UiChevronDown } from \"../icons\";\nimport { Button } from \"./button\";\n\nexport type IconMenuOption<T extends string> = {\n  value: T;\n  icon: StaticIconComponent;\n  label: string;\n  description?: string;\n};\n\nexport type IconMenuPickerProps<T extends string> = {\n  value: T;\n  onChange: (next: T) => void;\n  options: IconMenuOption<T>[];\n  ariaLabel: string;\n  triggerTitle?: string | undefined;\n  footer?: ReactNode | undefined;\n  showLabel?: boolean | undefined;\n  className?: string | undefined;\n  triggerClassName?: string | undefined;\n  menuClassName?: string | undefined;\n};\n\nfunction IconMenuPickerInner<T extends string>(\n  {\n    value,\n    onChange,\n    options,\n    ariaLabel,\n    triggerTitle,\n    footer,\n    showLabel,\n    className,\n    triggerClassName,\n    menuClassName,\n  }: IconMenuPickerProps<T>,\n  ref: React.Ref<HTMLDivElement>,\n) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n  const [open, setOpen] = useState(false);\n\n  useImperativeHandle(ref, () => rootRef.current as HTMLDivElement);\n\n  const activeIndex = useMemo(\n    () =>\n      Math.max(\n        0,\n        options.findIndex((option) => option.value === value),\n      ),\n    [options, value],\n  );\n\n  const close = useCallback((returnFocus: boolean) => {\n    setOpen(false);\n    if (returnFocus) triggerRef.current?.focus();\n  }, []);\n\n  const select = useCallback(\n    (next: T) => {\n      onChange(next);\n      close(true);\n    },\n    [close, onChange],\n  );\n\n  useEffect(() => {\n    if (!open) return;\n\n    const onPointerDown = (event: PointerEvent) => {\n      if (event.button !== 0) return;\n      if (!rootRef.current?.contains(event.target as Node)) {\n        close(false);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        event.preventDefault();\n        close(true);\n      }\n    };\n\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [close, open]);\n\n  useEffect(() => {\n    if (!open) return;\n    const node = itemRefs.current[activeIndex];\n    node?.focus();\n  }, [activeIndex, open]);\n\n  const focusItem = (index: number) => {\n    const wrapped = (index + options.length) % options.length;\n    itemRefs.current[wrapped]?.focus();\n  };\n\n  const onMenuKeyDown = (event: ReactKeyboardEvent<HTMLDivElement>) => {\n    const focusedIndex = itemRefs.current.findIndex((node) => node === document.activeElement);\n    if (event.key === \"ArrowDown\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) + 1);\n      return;\n    }\n    if (event.key === \"ArrowUp\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) - 1);\n      return;\n    }\n    if (event.key === \"Home\") {\n      event.preventDefault();\n      focusItem(0);\n      return;\n    }\n    if (event.key === \"End\") {\n      event.preventDefault();\n      focusItem(options.length - 1);\n      return;\n    }\n    if (event.key === \"Tab\") {\n      close(false);\n    }\n  };\n\n  const onTriggerKeyDown = (event: ReactKeyboardEvent<HTMLButtonElement>) => {\n    if (event.key === \"ArrowDown\" || event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  const selected = options[activeIndex];\n  if (!selected) {\n    throw new Error(`IconMenuPicker: value \"${value}\" not found in options for ${ariaLabel}`);\n  }\n\n  return (\n    <div ref={rootRef} className={cn(\"relative inline-flex\", showLabel && \"w-full\", className)}>\n      <Button\n        ref={triggerRef}\n        type=\"button\"\n        variant=\"ghost\"\n        size={showLabel ? \"default\" : \"icon\"}\n        aria-label={ariaLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        title={triggerTitle ?? `${ariaLabel}: ${selected.label}`}\n        onClick={() => setOpen((current) => !current)}\n        onKeyDown={onTriggerKeyDown}\n        className={cn(\n          \"text-muted-foreground hover:text-foreground\",\n          showLabel && \"w-full justify-start\",\n          triggerClassName,\n        )}\n      >\n        <Icon icon={selected.icon} className={showLabel ? \"shrink-0 text-foreground\" : undefined} />\n        {showLabel && (\n          <>\n            <span className=\"min-w-0 flex-1 truncate text-left capitalize\">\n              {`${ariaLabel}: ${selected.label}`}\n            </span>\n            <Icon icon={UiChevronDown} className=\"shrink-0 text-muted-foreground\" />\n          </>\n        )}\n      </Button>\n      {open && (\n        <div\n          role=\"menu\"\n          aria-label={ariaLabel}\n          onKeyDown={onMenuKeyDown}\n          className={cn(\n            \"absolute left-0 top-[calc(100%+0.375rem)] z-50 min-w-[12rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n            menuClassName,\n          )}\n        >\n          {options.map((option, index) => {\n            const active = option.value === value;\n            return (\n              <button\n                key={option.value}\n                ref={(node) => {\n                  itemRefs.current[index] = node;\n                }}\n                type=\"button\"\n                role=\"menuitemradio\"\n                aria-checked={active}\n                tabIndex={active ? 0 : -1}\n                onClick={() => select(option.value)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" || event.key === \" \") {\n                    event.preventDefault();\n                    select(option.value);\n                  }\n                }}\n                className={cn(\n                  \"flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm transition-colors\",\n                  \"hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none\",\n                  active && \"text-foreground\",\n                )}\n              >\n                <Icon icon={option.icon} className=\"shrink-0 text-muted-foreground\" />\n                <span className=\"min-w-0 flex-1 truncate capitalize\">{option.label}</span>\n                {active ? (\n                  <Icon icon={UiCheck} className=\"shrink-0 text-foreground\" />\n                ) : (\n                  <span className=\"inline-block size-4 shrink-0\" aria-hidden />\n                )}\n              </button>\n            );\n          })}\n          {footer ? (\n            <div className=\"mt-1 border-t border-border/60 px-2 py-1.5 text-[11px] text-muted-foreground\">\n              {footer}\n            </div>\n          ) : null}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const IconMenuPicker = forwardRef(IconMenuPickerInner) as <T extends string>(\n  props: IconMenuPickerProps<T> & { ref?: React.Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"icon-menu-picker.js","sources":["../../src/components/icon-menu-picker.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiCheck, UiChevronDown } from \"../icons\";\nimport { Button } from \"./button\";\n\nexport type IconMenuOption<T extends string> = {\n  value: T;\n  icon: StaticIconComponent;\n  label: string;\n  description?: string;\n};\n\nexport type IconMenuPickerProps<T extends string> = {\n  value: T;\n  onChange: (next: T) => void;\n  options: IconMenuOption<T>[];\n  ariaLabel: string;\n  triggerTitle?: string | undefined;\n  footer?: ReactNode | undefined;\n  showLabel?: boolean | undefined;\n  className?: string | undefined;\n  triggerClassName?: string | undefined;\n  menuClassName?: string | undefined;\n};\n\nfunction IconMenuPickerInner<T extends string>(\n  {\n    value,\n    onChange,\n    options,\n    ariaLabel,\n    triggerTitle,\n    footer,\n    showLabel,\n    className,\n    triggerClassName,\n    menuClassName,\n  }: IconMenuPickerProps<T>,\n  ref: React.Ref<HTMLDivElement>,\n) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n  const [open, setOpen] = useState(false);\n\n  useImperativeHandle(ref, () => rootRef.current as HTMLDivElement);\n\n  const activeIndex = useMemo(\n    () =>\n      Math.max(\n        0,\n        options.findIndex((option) => option.value === value),\n      ),\n    [options, value],\n  );\n\n  const close = useCallback((returnFocus: boolean) => {\n    setOpen(false);\n    if (returnFocus) triggerRef.current?.focus();\n  }, []);\n\n  const select = useCallback(\n    (next: T) => {\n      onChange(next);\n      close(true);\n    },\n    [close, onChange],\n  );\n\n  useEffect(() => {\n    if (!open) return;\n\n    const onPointerDown = (event: PointerEvent) => {\n      if (event.button !== 0) return;\n      if (!rootRef.current?.contains(event.target as Node)) {\n        close(false);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        event.preventDefault();\n        close(true);\n      }\n    };\n\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [close, open]);\n\n  useEffect(() => {\n    if (!open) return;\n    const node = itemRefs.current[activeIndex];\n    node?.focus();\n  }, [activeIndex, open]);\n\n  const focusItem = (index: number) => {\n    const wrapped = (index + options.length) % options.length;\n    itemRefs.current[wrapped]?.focus();\n  };\n\n  const onMenuKeyDown = (event: ReactKeyboardEvent<HTMLDivElement>) => {\n    const focusedIndex = itemRefs.current.findIndex((node) => node === document.activeElement);\n    if (event.key === \"ArrowDown\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) + 1);\n      return;\n    }\n    if (event.key === \"ArrowUp\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) - 1);\n      return;\n    }\n    if (event.key === \"Home\") {\n      event.preventDefault();\n      focusItem(0);\n      return;\n    }\n    if (event.key === \"End\") {\n      event.preventDefault();\n      focusItem(options.length - 1);\n      return;\n    }\n    if (event.key === \"Tab\") {\n      close(false);\n    }\n  };\n\n  const onTriggerKeyDown = (event: ReactKeyboardEvent<HTMLButtonElement>) => {\n    if (event.key === \"ArrowDown\" || event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  const selected = options[activeIndex];\n  if (!selected) {\n    throw new Error(`IconMenuPicker: value \"${value}\" not found in options for ${ariaLabel}`);\n  }\n\n  return (\n    <div ref={rootRef} className={cn(\"relative inline-flex\", showLabel && \"w-full\", className)}>\n      <Button\n        ref={triggerRef}\n        type=\"button\"\n        variant=\"ghost\"\n        size={showLabel ? \"default\" : \"icon\"}\n        aria-label={ariaLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        title={triggerTitle ?? `${ariaLabel}: ${selected.label}`}\n        onClick={() => setOpen((current) => !current)}\n        onKeyDown={onTriggerKeyDown}\n        className={cn(\n          \"text-muted-foreground hover:text-foreground\",\n          showLabel && \"w-full justify-start\",\n          triggerClassName,\n        )}\n      >\n        <Icon icon={selected.icon} {...(showLabel ? { className: \"shrink-0 text-foreground\" } : {})} />\n        {showLabel && (\n          <>\n            <span className=\"min-w-0 flex-1 truncate text-left capitalize\">\n              {`${ariaLabel}: ${selected.label}`}\n            </span>\n            <Icon icon={UiChevronDown} className=\"shrink-0 text-muted-foreground\" />\n          </>\n        )}\n      </Button>\n      {open && (\n        <div\n          role=\"menu\"\n          aria-label={ariaLabel}\n          onKeyDown={onMenuKeyDown}\n          className={cn(\n            \"absolute left-0 top-[calc(100%+0.375rem)] z-50 min-w-[12rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n            menuClassName,\n          )}\n        >\n          {options.map((option, index) => {\n            const active = option.value === value;\n            return (\n              <button\n                key={option.value}\n                ref={(node) => {\n                  itemRefs.current[index] = node;\n                }}\n                type=\"button\"\n                role=\"menuitemradio\"\n                aria-checked={active}\n                tabIndex={active ? 0 : -1}\n                onClick={() => select(option.value)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" || event.key === \" \") {\n                    event.preventDefault();\n                    select(option.value);\n                  }\n                }}\n                className={cn(\n                  \"flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm transition-colors\",\n                  \"hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none\",\n                  active && \"text-foreground\",\n                )}\n              >\n                <Icon icon={option.icon} className=\"shrink-0 text-muted-foreground\" />\n                <span className=\"min-w-0 flex-1 truncate capitalize\">{option.label}</span>\n                {active ? (\n                  <Icon icon={UiCheck} className=\"shrink-0 text-foreground\" />\n                ) : (\n                  <span className=\"inline-block size-4 shrink-0\" aria-hidden />\n                )}\n              </button>\n            );\n          })}\n          {footer ? (\n            <div className=\"mt-1 border-t border-border/60 px-2 py-1.5 text-[11px] text-muted-foreground\">\n              {footer}\n            </div>\n          ) : null}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const IconMenuPicker = forwardRef(IconMenuPickerInner) as <T extends string>(\n  props: IconMenuPickerProps<T> & { ref?: React.Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":[],"mappings":"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"}

package/dist/components.cjs

@@ -1,6 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const button = require("./components/button.cjs");
+const SplitButton = require("./components/SplitButton.cjs");
+const FormatOptionsDropdown = require("./components/FormatOptionsDropdown.cjs");
 const DateField = require("./components/DateField.cjs");
 const DatePicker = require("./components/DatePicker.cjs");
 const DateTimePicker = require("./components/DateTimePicker.cjs");
@@ -9,6 +11,7 @@ const RangeSlider = require("./components/RangeSlider.cjs");
 const FilterBar = require("./components/FilterBar.cjs");
 const MultiSelect = require("./components/MultiSelect.cjs");
 const select = require("./components/select.cjs");
+const Combobox = require("./components/Combobox.cjs");
 const themeSwitcher = require("./components/theme-switcher.cjs");
 const densitySwitcher = require("./components/density-switcher.cjs");
 const iconMenuPicker = require("./components/icon-menu-picker.cjs");
@@ -19,6 +22,9 @@ const HoverCard = require("./overlay/HoverCard.cjs");
 const Modal = require("./overlay/Modal.cjs");
 exports.Button = button.Button;
 exports.buttonVariants = button.buttonVariants;
+exports.SplitButton = SplitButton.SplitButton;
+exports.CLICKY_FORMAT_OPTIONS = FormatOptionsDropdown.CLICKY_FORMAT_OPTIONS;
+exports.FormatOptionsDropdown = FormatOptionsDropdown.FormatOptionsDropdown;
 exports.DateField = DateField.DateField;
 exports.DatePicker = DatePicker.DatePicker;
 exports.DateTimePicker = DateTimePicker.DateTimePicker;
@@ -27,6 +33,7 @@ exports.RangeSlider = RangeSlider.RangeSlider;
 exports.FilterBar = FilterBar.FilterBar;
 exports.MultiSelect = MultiSelect.MultiSelect;
 exports.Select = select.Select;
+exports.Combobox = Combobox.Combobox;
 exports.ThemeSwitcher = themeSwitcher.ThemeSwitcher;
 exports.DensitySwitcher = densitySwitcher.DensitySwitcher;
 exports.IconMenuPicker = iconMenuPicker.IconMenuPicker;

package/dist/components.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"components.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"components.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}