@hex-core/components 1.5.0 → 1.7.0

package/dist/speech-recognition.d.ts

@@ -0,0 +1,2 @@
+export { SpeechRecognitionProps_alias_1 as SpeechRecognitionProps } from './_tsup-dts-rollup.js';
+export { SpeechRecognition_alias_1 as SpeechRecognition } from './_tsup-dts-rollup.js';

package/dist/speech-recognition.js

@@ -0,0 +1,152 @@
+"use client";
+import * as React from 'react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function getSpeechRecognitionCtor() {
+  if (typeof window === "undefined") return null;
+  const w = window;
+  return w.SpeechRecognition ?? w.webkitSpeechRecognition ?? null;
+}
+function SpeechRecognition({
+  isListening,
+  onListeningChange,
+  onTranscript,
+  onError,
+  lang = "en-US",
+  continuous = true,
+  interimResults = true,
+  startLabel = "Start dictation",
+  stopLabel = "Stop dictation",
+  notSupportedLabel = "Speech recognition not supported in this browser",
+  disabled,
+  className,
+  ...rest
+}) {
+  const recognitionRef = React.useRef(null);
+  const [isSupported, setIsSupported] = React.useState(true);
+  const onTranscriptRef = React.useRef(onTranscript);
+  const onListeningChangeRef = React.useRef(onListeningChange);
+  const onErrorRef = React.useRef(onError);
+  onTranscriptRef.current = onTranscript;
+  onListeningChangeRef.current = onListeningChange;
+  onErrorRef.current = onError;
+  const mountedRef = React.useRef(true);
+  React.useEffect(
+    () => () => {
+      mountedRef.current = false;
+    },
+    []
+  );
+  const rebuildingRef = React.useRef(false);
+  const isListeningRef = React.useRef(isListening);
+  isListeningRef.current = isListening;
+  React.useEffect(() => {
+    const Ctor = getSpeechRecognitionCtor();
+    setIsSupported(Ctor !== null);
+  }, []);
+  React.useEffect(() => {
+    if (!isListening) return;
+    const Ctor = getSpeechRecognitionCtor();
+    if (!Ctor) return;
+    const instance = new Ctor();
+    instance.continuous = continuous;
+    instance.interimResults = interimResults;
+    instance.lang = lang;
+    instance.onresult = (event) => {
+      if (!mountedRef.current) return;
+      for (let i = event.resultIndex; i < event.results.length; i++) {
+        const result = event.results[i];
+        const transcript = result[0]?.transcript ?? "";
+        if (transcript) onTranscriptRef.current(transcript, result.isFinal);
+      }
+    };
+    instance.onerror = (event) => {
+      if (!mountedRef.current) return;
+      onErrorRef.current?.(event.error, event.message);
+      if (event.error !== "aborted") onListeningChangeRef.current(false);
+    };
+    instance.onend = () => {
+      if (!mountedRef.current) return;
+      if (rebuildingRef.current) return;
+      onListeningChangeRef.current(false);
+    };
+    recognitionRef.current = instance;
+    try {
+      instance.start();
+    } catch (err) {
+      onErrorRef.current?.("start-failed", err instanceof Error ? err.message : String(err));
+      onListeningChangeRef.current(false);
+    }
+    return () => {
+      rebuildingRef.current = isListeningRef.current;
+      instance.onresult = null;
+      instance.onerror = null;
+      instance.onend = null;
+      try {
+        instance.abort();
+      } catch {
+      }
+      recognitionRef.current = null;
+      queueMicrotask(() => {
+        rebuildingRef.current = false;
+      });
+    };
+  }, [isListening, continuous, interimResults, lang]);
+  const tooltip = !isSupported ? notSupportedLabel : isListening ? stopLabel : startLabel;
+  const accessibleName = isSupported ? startLabel : notSupportedLabel;
+  const isDisabled = disabled || !isSupported;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      ...rest,
+      disabled: isDisabled,
+      "aria-label": accessibleName,
+      "aria-pressed": isListening,
+      title: tooltip,
+      onClick: (event) => {
+        rest.onClick?.(event);
+        if (event.defaultPrevented || isDisabled) return;
+        onListeningChange(!isListening);
+      },
+      className: cn(
+        "inline-flex h-9 w-9 items-center justify-center rounded-md border bg-background",
+        "text-foreground transition-colors duration-[var(--duration-normal,200ms)] ease-out",
+        "hover:bg-accent hover:text-accent-foreground",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        isListening && "animate-pulse border-destructive text-destructive",
+        className
+      ),
+      children: /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          "aria-hidden": true,
+          viewBox: "0 0 16 16",
+          width: "14",
+          height: "14",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          children: [
+            /* @__PURE__ */ jsx("rect", { x: "6", y: "2", width: "4", height: "8", rx: "2" }),
+            /* @__PURE__ */ jsx("path", { d: "M3.5 7.5a4.5 4.5 0 0 0 9 0" }),
+            /* @__PURE__ */ jsx("path", { d: "M8 12v2" }),
+            /* @__PURE__ */ jsx("path", { d: "M5.5 14h5" })
+          ]
+        }
+      )
+    }
+  );
+}
+
+export { SpeechRecognition };
+//# sourceMappingURL=speech-recognition.js.map
+//# sourceMappingURL=speech-recognition.js.map

package/dist/speech-recognition.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/ai/speech-recognition/speech-recognition.tsx"],"names":[],"mappings":"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","file":"speech-recognition.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names with Tailwind CSS conflict resolution.\n * @param inputs - Class values (strings, arrays, objects) to merge\n * @returns A single merged class string with Tailwind conflicts resolved\n */\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../lib/utils.js\";\n\n/**\n * Browser SpeechRecognition wrapper. Renders a mic toggle button that\n * starts/stops the Web Speech API and emits transcript chunks.\n *\n * Headless on data: `isListening` + `onListeningChange` are required so\n * the consumer keeps state where it fits (a `useChat` hook, redux,\n * local state). `onTranscript` fires per result with `isFinal` so the\n * consumer can append finalized phrases and replace interim ones.\n *\n * Falls back to a disabled button labeled `notSupportedLabel` when the\n * browser lacks `SpeechRecognition` (Firefox as of 2026, older Safari).\n *\n * @example\n * const [listening, setListening] = useState(false);\n * const [text, setText] = useState(\"\");\n * <SpeechRecognition\n *   isListening={listening}\n *   onListeningChange={setListening}\n *   onTranscript={(chunk, isFinal) => {\n *     if (isFinal) setText((t) => t + chunk);\n *   }}\n * />\n */\ntype SpeechRecognitionConstructor = new () => SpeechRecognitionInstance;\n\ninterface SpeechRecognitionResultLike {\n\treadonly isFinal: boolean;\n\treadonly length: number;\n\treadonly [index: number]: { readonly transcript: string };\n}\n\ninterface SpeechRecognitionResultListLike {\n\treadonly length: number;\n\treadonly [index: number]: SpeechRecognitionResultLike;\n}\n\ninterface SpeechRecognitionEventLike {\n\treadonly resultIndex: number;\n\treadonly results: SpeechRecognitionResultListLike;\n}\n\ninterface SpeechRecognitionErrorEventLike {\n\treadonly error: string;\n\treadonly message?: string;\n}\n\ninterface SpeechRecognitionInstance {\n\tcontinuous: boolean;\n\tinterimResults: boolean;\n\tlang: string;\n\tonresult: ((event: SpeechRecognitionEventLike) => void) | null;\n\tonerror: ((event: SpeechRecognitionErrorEventLike) => void) | null;\n\tonend: (() => void) | null;\n\tstart(): void;\n\tstop(): void;\n\tabort(): void;\n}\n\nfunction getSpeechRecognitionCtor(): SpeechRecognitionConstructor | null {\n\tif (typeof window === \"undefined\") return null;\n\tconst w = window as unknown as {\n\t\tSpeechRecognition?: SpeechRecognitionConstructor;\n\t\twebkitSpeechRecognition?: SpeechRecognitionConstructor;\n\t};\n\treturn w.SpeechRecognition ?? w.webkitSpeechRecognition ?? null;\n}\n\nexport interface SpeechRecognitionProps\n\textends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"onError\"> {\n\t/** Controlled listening state. */\n\tisListening: boolean;\n\t/** Called when listening starts/stops (user toggle or browser auto-end). */\n\tonListeningChange: (listening: boolean) => void;\n\t/** Called per transcript chunk. `isFinal` indicates a finalized phrase. */\n\tonTranscript: (text: string, isFinal: boolean) => void;\n\t/** Called on browser error (e.g. \"not-allowed\", \"no-speech\", \"network\"). */\n\tonError?: (error: string, message?: string) => void;\n\t/** BCP-47 language tag. Default `\"en-US\"`. */\n\tlang?: string;\n\t/** Keep listening across pauses. Default `true`. */\n\tcontinuous?: boolean;\n\t/** Emit interim (in-progress) results. Default `true`. */\n\tinterimResults?: boolean;\n\t/** Accessible name when idle. Default `\"Start dictation\"`. */\n\tstartLabel?: string;\n\t/** Accessible name when listening. Default `\"Stop dictation\"`. */\n\tstopLabel?: string;\n\t/** Accessible name + tooltip when the browser lacks the API. */\n\tnotSupportedLabel?: string;\n}\n\n/**\n * Renders a mic toggle button wired to the Web Speech API.\n * @param props - controlled listening state + transcript callback\n * @returns A button element that toggles speech recognition\n */\nfunction SpeechRecognition({\n\tisListening,\n\tonListeningChange,\n\tonTranscript,\n\tonError,\n\tlang = \"en-US\",\n\tcontinuous = true,\n\tinterimResults = true,\n\tstartLabel = \"Start dictation\",\n\tstopLabel = \"Stop dictation\",\n\tnotSupportedLabel = \"Speech recognition not supported in this browser\",\n\tdisabled,\n\tclassName,\n\t...rest\n}: SpeechRecognitionProps) {\n\tconst recognitionRef = React.useRef<SpeechRecognitionInstance | null>(null);\n\tconst [isSupported, setIsSupported] = React.useState(true);\n\n\t// \"Latest ref\" pattern, assigned synchronously in render so a Web Speech\n\t// callback firing between commit and a useEffect can never see stale\n\t// closures. React permits ref mutation during render when the assignment\n\t// is purely a latest-value mirror.\n\tconst onTranscriptRef = React.useRef(onTranscript);\n\tconst onListeningChangeRef = React.useRef(onListeningChange);\n\tconst onErrorRef = React.useRef(onError);\n\tonTranscriptRef.current = onTranscript;\n\tonListeningChangeRef.current = onListeningChange;\n\tonErrorRef.current = onError;\n\n\t// Mounted guard: the engine fires onend asynchronously, sometimes after\n\t// the React tree has been torn down. Without this, a stale handler can\n\t// invoke setState on an unmounted parent.\n\tconst mountedRef = React.useRef(true);\n\tReact.useEffect(\n\t\t() => () => {\n\t\t\tmountedRef.current = false;\n\t\t},\n\t\t[],\n\t);\n\n\t// Set when the lifecycle effect's cleanup runs because of a prop change\n\t// (lang/continuous/interimResults), not user-initiated stop. The about-\n\t// to-fire onend should NOT bubble back as `onListeningChange(false)` in\n\t// that case — the new effect run is about to re-create the engine.\n\tconst rebuildingRef = React.useRef(false);\n\t// Latest `isListening` mirror so cleanup can read the NEW value (closure\n\t// captures OLD). NEW=true means this is a prop-change rebuild; NEW=false\n\t// means the user stopped.\n\tconst isListeningRef = React.useRef(isListening);\n\tisListeningRef.current = isListening;\n\n\t// SSR: ctor lookup must run after mount.\n\tReact.useEffect(() => {\n\t\tconst Ctor = getSpeechRecognitionCtor();\n\t\tsetIsSupported(Ctor !== null);\n\t}, []);\n\n\t// Toggle the engine on `isListening` change. Recreate per session so a\n\t// stuck session can't leak — Chrome's recognition is single-use after\n\t// onend in some failure modes.\n\tReact.useEffect(() => {\n\t\tif (!isListening) return;\n\n\t\tconst Ctor = getSpeechRecognitionCtor();\n\t\tif (!Ctor) return;\n\n\t\tconst instance = new Ctor();\n\t\tinstance.continuous = continuous;\n\t\tinstance.interimResults = interimResults;\n\t\tinstance.lang = lang;\n\n\t\tinstance.onresult = (event) => {\n\t\t\tif (!mountedRef.current) return;\n\t\t\tfor (let i = event.resultIndex; i < event.results.length; i++) {\n\t\t\t\tconst result = event.results[i];\n\t\t\t\tconst transcript = result[0]?.transcript ?? \"\";\n\t\t\t\tif (transcript) onTranscriptRef.current(transcript, result.isFinal);\n\t\t\t}\n\t\t};\n\t\tinstance.onerror = (event) => {\n\t\t\tif (!mountedRef.current) return;\n\t\t\tonErrorRef.current?.(event.error, event.message);\n\t\t\t// \"aborted\" is a normal stop signal — don't toggle off twice.\n\t\t\tif (event.error !== \"aborted\") onListeningChangeRef.current(false);\n\t\t};\n\t\tinstance.onend = () => {\n\t\t\tif (!mountedRef.current) return;\n\t\t\t// Skip the off-toggle when cleanup is from a prop-change rebuild;\n\t\t\t// the next effect run will re-start with the new options.\n\t\t\tif (rebuildingRef.current) return;\n\t\t\tonListeningChangeRef.current(false);\n\t\t};\n\n\t\trecognitionRef.current = instance;\n\t\ttry {\n\t\t\tinstance.start();\n\t\t} catch (err) {\n\t\t\t// Chrome throws if start() is called twice; surface as an error\n\t\t\t// rather than letting it crash the React tree.\n\t\t\tonErrorRef.current?.(\"start-failed\", err instanceof Error ? err.message : String(err));\n\t\t\tonListeningChangeRef.current(false);\n\t\t}\n\n\t\treturn () => {\n\t\t\t// Mark this teardown as a rebuild iff isListening is STILL true\n\t\t\t// in the latest render (only lang/continuous/interimResults\n\t\t\t// changed). On a real user-stop the NEW isListening is false and\n\t\t\t// any synchronous onend-from-abort should toggle parent state.\n\t\t\trebuildingRef.current = isListeningRef.current;\n\t\t\tinstance.onresult = null;\n\t\t\tinstance.onerror = null;\n\t\t\tinstance.onend = null;\n\t\t\ttry {\n\t\t\t\tinstance.abort();\n\t\t\t} catch {\n\t\t\t\t// abort() throws if the engine never started; safe to ignore.\n\t\t\t}\n\t\t\trecognitionRef.current = null;\n\t\t\t// Reset on next microtask so a follow-up effect run sees a clean slate.\n\t\t\tqueueMicrotask(() => {\n\t\t\t\trebuildingRef.current = false;\n\t\t\t});\n\t\t};\n\t}, [isListening, continuous, interimResults, lang]);\n\n\tconst tooltip = !isSupported\n\t\t? notSupportedLabel\n\t\t: isListening\n\t\t\t? stopLabel\n\t\t\t: startLabel;\n\t// aria-label is stable when supported so screen readers don't re-announce\n\t// the entire button on each toggle. State is conveyed via aria-pressed.\n\t// Only the unsupported case swaps the accessible name.\n\tconst accessibleName = isSupported ? startLabel : notSupportedLabel;\n\tconst isDisabled = disabled || !isSupported;\n\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\t{...rest}\n\t\t\tdisabled={isDisabled}\n\t\t\taria-label={accessibleName}\n\t\t\taria-pressed={isListening}\n\t\t\ttitle={tooltip}\n\t\t\tonClick={(event) => {\n\t\t\t\trest.onClick?.(event);\n\t\t\t\tif (event.defaultPrevented || isDisabled) return;\n\t\t\t\tonListeningChange(!isListening);\n\t\t\t}}\n\t\t\tclassName={cn(\n\t\t\t\t\"inline-flex h-9 w-9 items-center justify-center rounded-md border bg-background\",\n\t\t\t\t\"text-foreground transition-colors duration-[var(--duration-normal,200ms)] ease-out\",\n\t\t\t\t\"hover:bg-accent hover:text-accent-foreground\",\n\t\t\t\t\"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n\t\t\t\t\"disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tisListening && \"animate-pulse border-destructive text-destructive\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t<svg\n\t\t\t\taria-hidden\n\t\t\t\tviewBox=\"0 0 16 16\"\n\t\t\t\twidth=\"14\"\n\t\t\t\theight=\"14\"\n\t\t\t\tfill=\"none\"\n\t\t\t\tstroke=\"currentColor\"\n\t\t\t\tstrokeWidth=\"1.5\"\n\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\tstrokeLinejoin=\"round\"\n\t\t\t>\n\t\t\t\t<rect x=\"6\" y=\"2\" width=\"4\" height=\"8\" rx=\"2\" />\n\t\t\t\t<path d=\"M3.5 7.5a4.5 4.5 0 0 0 9 0\" />\n\t\t\t\t<path d=\"M8 12v2\" />\n\t\t\t\t<path d=\"M5.5 14h5\" />\n\t\t\t</svg>\n\t\t</button>\n\t);\n}\n\nexport { SpeechRecognition };\n"]}

package/dist/tag.d.ts

@@ -0,0 +1,3 @@
+export { TagProps_alias_1 as TagProps } from './_tsup-dts-rollup.js';
+export { Tag_alias_1 as Tag } from './_tsup-dts-rollup.js';
+export { tagVariants_alias_1 as tagVariants } from './_tsup-dts-rollup.js';

package/dist/tag.js

@@ -0,0 +1,107 @@
+"use client";
+import { cva } from 'class-variance-authority';
+import * as React from 'react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/primitives/tag/tag.tsx
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var tagVariants = cva(
+  [
+    "inline-flex items-center gap-[var(--gap-xs,0.25rem)] rounded-full border px-2.5 py-0.5 text-xs font-medium",
+    "transition-all duration-[var(--duration-normal,200ms)] ease-out",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground",
+        secondary: "border-foreground/15 bg-secondary text-secondary-foreground hover:border-foreground/20",
+        destructive: "border-transparent bg-destructive text-destructive-foreground",
+        outline: "border-foreground/20 text-foreground hover:border-foreground/30"
+      }
+    },
+    defaultVariants: { variant: "default" }
+  }
+);
+function extractStringLabel(children) {
+  const parts = [];
+  const visit = (node) => {
+    if (node === null || node === void 0 || typeof node === "boolean") return;
+    if (typeof node === "string") {
+      parts.push(node);
+      return;
+    }
+    if (typeof node === "number") {
+      parts.push(String(node));
+      return;
+    }
+    if (Array.isArray(node)) {
+      for (const item of node) visit(item);
+      return;
+    }
+    if (React.isValidElement(node)) {
+      const props = node.props;
+      visit(props.children);
+    }
+  };
+  visit(children);
+  const joined = parts.join(" ").replace(/\s+/g, " ").trim();
+  return joined.length > 0 ? joined : null;
+}
+function Tag({
+  className,
+  variant,
+  icon,
+  onRemove,
+  removeLabel,
+  children,
+  ref,
+  ...props
+}) {
+  const labelText = extractStringLabel(children);
+  const ariaLabel = removeLabel ?? (labelText ? `Remove ${labelText}` : "Remove");
+  return /* @__PURE__ */ jsxs("span", { ref, className: cn(tagVariants({ variant }), className), ...props, children: [
+    icon ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "-ml-0.5 [&_svg]:size-3 [&_svg]:shrink-0", children: icon }) : null,
+    /* @__PURE__ */ jsx("span", { children }),
+    onRemove ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: onRemove,
+        "aria-label": ariaLabel,
+        className: cn(
+          "-mr-0.5 inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full",
+          "transition-colors duration-[var(--duration-normal,200ms)] ease-out",
+          "hover:bg-foreground/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
+          "active:scale-[0.92]"
+        ),
+        children: /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            className: "size-3",
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+              /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+            ]
+          }
+        )
+      }
+    ) : null
+  ] });
+}
+
+export { Tag, tagVariants };
+//# sourceMappingURL=tag.js.map
+//# sourceMappingURL=tag.js.map

package/dist/tag.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/primitives/tag/tag.tsx"],"names":[],"mappings":"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","file":"tag.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names with Tailwind CSS conflict resolution.\n * @param inputs - Class values (strings, arrays, objects) to merge\n * @returns A single merged class string with Tailwind conflicts resolved\n */\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","import { type VariantProps, cva } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../../lib/utils.js\";\n\nconst tagVariants = cva(\n\t[\n\t\t\"inline-flex items-center gap-[var(--gap-xs,0.25rem)] rounded-full border px-2.5 py-0.5 text-xs font-medium\",\n\t\t\"transition-all duration-[var(--duration-normal,200ms)] ease-out\",\n\t\t\"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n\t].join(\" \"),\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: \"border-transparent bg-primary text-primary-foreground\",\n\t\t\t\tsecondary:\n\t\t\t\t\t\"border-foreground/15 bg-secondary text-secondary-foreground hover:border-foreground/20\",\n\t\t\t\tdestructive: \"border-transparent bg-destructive text-destructive-foreground\",\n\t\t\t\toutline: \"border-foreground/20 text-foreground hover:border-foreground/30\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: { variant: \"default\" },\n\t},\n);\n\nexport interface TagProps\n\textends Omit<React.HTMLAttributes<HTMLSpanElement>, \"onRemove\">,\n\t\tVariantProps<typeof tagVariants> {\n\t/** Forwarded ref onto the root span element. */\n\tref?: React.Ref<HTMLSpanElement>;\n\t/** Optional leading icon (`<svg>` or component). Sized 12×12. */\n\ticon?: React.ReactNode;\n\t/**\n\t * Click handler for the close button. When provided, an inline ✕ button\n\t * is rendered after the children with an `aria-label` derived from the\n\t * children's string content (or a generic \"Remove\" if no string can be\n\t * extracted). Pass undefined for a non-interactive Tag — at that point,\n\t * prefer Badge directly.\n\t */\n\tonRemove?: () => void;\n\t/** Override the auto-derived `aria-label` on the close button. */\n\tremoveLabel?: string;\n}\n\n/**\n * Walk a `React.ReactNode` tree depth-first and collect all string +\n * number leaves into a single space-separated label. Used to derive\n * the close button's `aria-label` even when children are JSX\n * (`<strong>Bold</strong>` → `\"Bold\"`).\n *\n * @param children - React children passed to `<Tag>`.\n * @returns Concatenated string content, or null if no string leaves found.\n */\nfunction extractStringLabel(children: React.ReactNode): string | null {\n\tconst parts: string[] = [];\n\tconst visit = (node: React.ReactNode): void => {\n\t\tif (node === null || node === undefined || typeof node === \"boolean\") return;\n\t\tif (typeof node === \"string\") {\n\t\t\tparts.push(node);\n\t\t\treturn;\n\t\t}\n\t\tif (typeof node === \"number\") {\n\t\t\tparts.push(String(node));\n\t\t\treturn;\n\t\t}\n\t\tif (Array.isArray(node)) {\n\t\t\tfor (const item of node) visit(item);\n\t\t\treturn;\n\t\t}\n\t\tif (React.isValidElement(node)) {\n\t\t\tconst props = node.props as { children?: React.ReactNode };\n\t\t\tvisit(props.children);\n\t\t}\n\t};\n\tvisit(children);\n\tconst joined = parts.join(\" \").replace(/\\s+/g, \" \").trim();\n\treturn joined.length > 0 ? joined : null;\n}\n\n/**\n * An interactive tag / chip primitive — Badge with an optional dismiss\n * affordance. Mirrors {@link Badge}'s CVA variants so the visual sibling\n * is obvious; adds a built-in close button when `onRemove` is provided.\n *\n * For non-interactive labels (status indicators, counts) use {@link Badge}\n * directly. For \"click to filter\" state-bearing chips, use Toggle or\n * ToggleGroup — Tag is for \"this token represents a value the user can\n * dismiss\" (filters, multi-select selections, draft attachments).\n *\n * @example\n * ```tsx\n * <Tag variant=\"secondary\" onRemove={() => removeFilter(\"urgent\")}>\n *   Urgent\n * </Tag>\n * ```\n *\n * @returns A span containing the label + optional icon + optional close button.\n */\nfunction Tag({\n\tclassName,\n\tvariant,\n\ticon,\n\tonRemove,\n\tremoveLabel,\n\tchildren,\n\tref,\n\t...props\n}: TagProps) {\n\tconst labelText = extractStringLabel(children);\n\tconst ariaLabel = removeLabel ?? (labelText ? `Remove ${labelText}` : \"Remove\");\n\n\treturn (\n\t\t<span ref={ref} className={cn(tagVariants({ variant }), className)} {...props}>\n\t\t\t{icon ? (\n\t\t\t\t<span aria-hidden=\"true\" className=\"-ml-0.5 [&_svg]:size-3 [&_svg]:shrink-0\">\n\t\t\t\t\t{icon}\n\t\t\t\t</span>\n\t\t\t) : null}\n\t\t\t<span>{children}</span>\n\t\t\t{onRemove ? (\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={onRemove}\n\t\t\t\t\taria-label={ariaLabel}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"-mr-0.5 inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full\",\n\t\t\t\t\t\t\"transition-colors duration-[var(--duration-normal,200ms)] ease-out\",\n\t\t\t\t\t\t\"hover:bg-foreground/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1\",\n\t\t\t\t\t\t\"active:scale-[0.92]\",\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<svg\n\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\tstrokeWidth=\"2.5\"\n\t\t\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\t\t\tstrokeLinejoin=\"round\"\n\t\t\t\t\t\tclassName=\"size-3\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n\t\t\t\t\t\t<line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n\t\t\t\t\t</svg>\n\t\t\t\t</button>\n\t\t\t) : null}\n\t\t</span>\n\t);\n}\n\nexport { Tag, tagVariants };\n"]}

package/dist/toolbar.d.ts

@@ -0,0 +1,8 @@
+export { ToolbarProps_alias_1 as ToolbarProps } from './_tsup-dts-rollup.js';
+export { Toolbar_alias_1 as Toolbar } from './_tsup-dts-rollup.js';
+export { ToolbarButton_alias_1 as ToolbarButton } from './_tsup-dts-rollup.js';
+export { ToolbarLink_alias_1 as ToolbarLink } from './_tsup-dts-rollup.js';
+export { ToolbarSeparator_alias_1 as ToolbarSeparator } from './_tsup-dts-rollup.js';
+export { ToolbarToggleGroup_alias_1 as ToolbarToggleGroup } from './_tsup-dts-rollup.js';
+export { ToolbarToggleItem_alias_1 as ToolbarToggleItem } from './_tsup-dts-rollup.js';
+export { toolbarVariants_alias_1 as toolbarVariants } from './_tsup-dts-rollup.js';

package/dist/toolbar.js

@@ -0,0 +1,120 @@
+"use client";
+import * as ToolbarPrimitive from '@radix-ui/react-toolbar';
+import { cva } from 'class-variance-authority';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx } from 'react/jsx-runtime';
+
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var toolbarVariants = cva("flex items-center gap-[var(--gap-xs,0.25rem)] rounded-md border border-border bg-card p-[var(--space-1,0.25rem)]", {
+  variants: {
+    orientation: {
+      horizontal: "flex-row",
+      vertical: "flex-col items-stretch"
+    }
+  },
+  defaultVariants: { orientation: "horizontal" }
+});
+var toolbarItemBaseClasses = [
+  "inline-flex items-center justify-center gap-[var(--gap-xs,0.25rem)] rounded-sm",
+  "px-[var(--space-2,0.5rem)] h-[var(--control-height-sm,2.25rem)] text-sm font-medium",
+  "text-foreground/80 hover:text-foreground hover:bg-accent",
+  "transition-colors duration-[var(--duration-normal,200ms)] ease-out",
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
+  "disabled:pointer-events-none disabled:opacity-50",
+  "data-[state=on]:bg-accent data-[state=on]:text-accent-foreground",
+  "active:scale-[0.98]",
+  "[&_svg]:size-4 [&_svg]:shrink-0"
+].join(" ");
+function Toolbar({ className, orientation = "horizontal", ref, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ToolbarPrimitive.Root,
+    {
+      ref,
+      orientation,
+      className: cn(toolbarVariants({ orientation }), className),
+      ...props
+    }
+  );
+}
+function ToolbarButton({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ToolbarPrimitive.Button,
+    {
+      ref,
+      className: cn(toolbarItemBaseClasses, className),
+      ...props
+    }
+  );
+}
+function ToolbarLink({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ToolbarPrimitive.Link,
+    {
+      ref,
+      className: cn(toolbarItemBaseClasses, "underline-offset-4 hover:underline", className),
+      ...props
+    }
+  );
+}
+function ToolbarToggleGroup({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ToolbarPrimitive.ToggleGroup,
+    {
+      ref,
+      className: cn("flex items-center gap-[var(--gap-xs,0.25rem)]", className),
+      ...props
+    }
+  );
+}
+function ToolbarToggleItem({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ToolbarPrimitive.ToggleItem,
+    {
+      ref,
+      className: cn(toolbarItemBaseClasses, className),
+      ...props
+    }
+  );
+}
+function ToolbarSeparator({
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ToolbarPrimitive.Separator,
+    {
+      ref,
+      className: cn(
+        "shrink-0 bg-border",
+        "data-[orientation=horizontal]:h-4 data-[orientation=horizontal]:w-px data-[orientation=horizontal]:mx-[var(--space-1,0.25rem)]",
+        "data-[orientation=vertical]:w-4 data-[orientation=vertical]:h-px data-[orientation=vertical]:my-[var(--space-1,0.25rem)]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+export { Toolbar, ToolbarButton, ToolbarLink, ToolbarSeparator, ToolbarToggleGroup, ToolbarToggleItem, toolbarVariants };
+//# sourceMappingURL=toolbar.js.map
+//# sourceMappingURL=toolbar.js.map

package/dist/toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/components/toolbar/toolbar.tsx"],"names":[],"mappings":"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","file":"toolbar.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names with Tailwind CSS conflict resolution.\n * @param inputs - Class values (strings, arrays, objects) to merge\n * @returns A single merged class string with Tailwind conflicts resolved\n */\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport * as ToolbarPrimitive from \"@radix-ui/react-toolbar\";\nimport { cva } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../../lib/utils.js\";\n\nconst toolbarVariants = cva(\"flex items-center gap-[var(--gap-xs,0.25rem)] rounded-md border border-border bg-card p-[var(--space-1,0.25rem)]\", {\n\tvariants: {\n\t\torientation: {\n\t\t\thorizontal: \"flex-row\",\n\t\t\tvertical: \"flex-col items-stretch\",\n\t\t},\n\t},\n\tdefaultVariants: { orientation: \"horizontal\" },\n});\n\nconst toolbarItemBaseClasses = [\n\t\"inline-flex items-center justify-center gap-[var(--gap-xs,0.25rem)] rounded-sm\",\n\t\"px-[var(--space-2,0.5rem)] h-[var(--control-height-sm,2.25rem)] text-sm font-medium\",\n\t\"text-foreground/80 hover:text-foreground hover:bg-accent\",\n\t\"transition-colors duration-[var(--duration-normal,200ms)] ease-out\",\n\t\"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1\",\n\t\"disabled:pointer-events-none disabled:opacity-50\",\n\t\"data-[state=on]:bg-accent data-[state=on]:text-accent-foreground\",\n\t\"active:scale-[0.98]\",\n\t\"[&_svg]:size-4 [&_svg]:shrink-0\",\n].join(\" \");\n\n/**\n * Toolbar root props. `aria-label` is required — Radix Toolbar.Root\n * mounts as a `role=\"toolbar\"` landmark, and AT users will hear an\n * unlabelled \"toolbar\" landmark when no visible heading sits adjacent.\n * If a visible heading IS present, pair it via `aria-labelledby` instead.\n */\nexport interface ToolbarProps\n\textends Omit<\n\t\tReact.ComponentPropsWithoutRef<typeof ToolbarPrimitive.Root>,\n\t\t\"aria-label\"\n\t> {\n\t/** Forwarded ref onto the Radix `Toolbar.Root`. */\n\tref?: React.Ref<React.ElementRef<typeof ToolbarPrimitive.Root>>;\n\t/** Required accessible name for the toolbar landmark. */\n\t\"aria-label\": string;\n}\n\n/**\n * Root toolbar element. Wraps Radix `Toolbar.Root` with the canonical\n * Hex Core token + visual styling. Pass children consisting of\n * `ToolbarButton`, `ToolbarToggleGroup`, `ToolbarSeparator`, and\n * `ToolbarLink` — Radix handles arrow-key roving focus across them\n * automatically.\n *\n * @example\n * ```tsx\n * <Toolbar aria-label=\"Editor controls\">\n *   <ToolbarButton onClick={onUndo}>Undo</ToolbarButton>\n *   <ToolbarButton onClick={onRedo}>Redo</ToolbarButton>\n *   <ToolbarSeparator />\n *   <ToolbarToggleGroup type=\"single\" defaultValue=\"left\">\n *     <ToolbarToggleItem value=\"left\">Left</ToolbarToggleItem>\n *     <ToolbarToggleItem value=\"center\">Center</ToolbarToggleItem>\n *     <ToolbarToggleItem value=\"right\">Right</ToolbarToggleItem>\n *   </ToolbarToggleGroup>\n * </Toolbar>\n * ```\n */\nfunction Toolbar({ className, orientation = \"horizontal\", ref, ...props }: ToolbarProps) {\n\treturn (\n\t\t<ToolbarPrimitive.Root\n\t\t\tref={ref}\n\t\t\torientation={orientation}\n\t\t\tclassName={cn(toolbarVariants({ orientation }), className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/** A push button inside the toolbar. */\nfunction ToolbarButton({\n\tclassName,\n\tref,\n\t...props\n}: React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.Button> & {\n\tref?: React.Ref<React.ElementRef<typeof ToolbarPrimitive.Button>>;\n}) {\n\treturn (\n\t\t<ToolbarPrimitive.Button\n\t\t\tref={ref}\n\t\t\tclassName={cn(toolbarItemBaseClasses, className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/** A link inside the toolbar — renders an `<a>` with toolbar focus semantics. */\nfunction ToolbarLink({\n\tclassName,\n\tref,\n\t...props\n}: React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.Link> & {\n\tref?: React.Ref<React.ElementRef<typeof ToolbarPrimitive.Link>>;\n}) {\n\treturn (\n\t\t<ToolbarPrimitive.Link\n\t\t\tref={ref}\n\t\t\tclassName={cn(toolbarItemBaseClasses, \"underline-offset-4 hover:underline\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/** A group of mutually-exclusive (`type='single'`) or independent (`type='multiple'`) toggle items. */\nfunction ToolbarToggleGroup({\n\tclassName,\n\tref,\n\t...props\n}: React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToggleGroup> & {\n\tref?: React.Ref<React.ElementRef<typeof ToolbarPrimitive.ToggleGroup>>;\n}) {\n\treturn (\n\t\t<ToolbarPrimitive.ToggleGroup\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"flex items-center gap-[var(--gap-xs,0.25rem)]\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/** Individual toggle item — exposes `data-state=\"on\"` for the on style. */\nfunction ToolbarToggleItem({\n\tclassName,\n\tref,\n\t...props\n}: React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToggleItem> & {\n\tref?: React.Ref<React.ElementRef<typeof ToolbarPrimitive.ToggleItem>>;\n}) {\n\treturn (\n\t\t<ToolbarPrimitive.ToggleItem\n\t\t\tref={ref}\n\t\t\tclassName={cn(toolbarItemBaseClasses, className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/** A vertical (or horizontal, in vertical toolbars) divider. */\nfunction ToolbarSeparator({\n\tclassName,\n\tref,\n\t...props\n}: React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.Separator> & {\n\tref?: React.Ref<React.ElementRef<typeof ToolbarPrimitive.Separator>>;\n}) {\n\treturn (\n\t\t<ToolbarPrimitive.Separator\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"shrink-0 bg-border\",\n\t\t\t\t\"data-[orientation=horizontal]:h-4 data-[orientation=horizontal]:w-px data-[orientation=horizontal]:mx-[var(--space-1,0.25rem)]\",\n\t\t\t\t\"data-[orientation=vertical]:w-4 data-[orientation=vertical]:h-px data-[orientation=vertical]:my-[var(--space-1,0.25rem)]\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport {\n\tToolbar,\n\tToolbarButton,\n\tToolbarLink,\n\tToolbarSeparator,\n\tToolbarToggleGroup,\n\tToolbarToggleItem,\n\ttoolbarVariants,\n};\n"]}

package/dist/tree.d.ts

@@ -0,0 +1,3 @@
+export { TreeNode_alias_1 as TreeNode } from './_tsup-dts-rollup.js';
+export { TreeProps_alias_1 as TreeProps } from './_tsup-dts-rollup.js';
+export { Tree_alias_1 as Tree } from './_tsup-dts-rollup.js';