@particle-academy/react-fancy 5.51.1 → 5.52.0

package/dist/{chunk-Y4UPKJN5.js → chunk-EQ7G5F6K.js}

@@ -10,7 +10,7 @@ var Eyebrow = forwardRef(
         ref,
         "data-react-fancy-eyebrow": "",
         className: cn(
-          "flex items-baseline gap-3 font-mono text-[11.5px] uppercase tracking-wider text-zinc-500 dark:text-zinc-400",
+          "flex items-baseline gap-3 font-mono text-[11.5px] uppercase tracking-wider text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]",
           rule && "border-b border-zinc-200 pb-2 dark:border-zinc-800",
           className
         ),
@@ -18,7 +18,7 @@ var Eyebrow = forwardRef(
         children: [
           children ?? /* @__PURE__ */ jsxs("span", { children: [
             num != null && /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx("b", { className: "font-medium text-zinc-900 dark:text-zinc-100", children: num }),
+              /* @__PURE__ */ jsx("b", { className: "font-medium text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]", children: num }),
               label != null && " \u2014 "
             ] }),
             label
@@ -32,5 +32,5 @@ var Eyebrow = forwardRef(
 Eyebrow.displayName = "Eyebrow";
 
 export { Eyebrow };
-//# sourceMappingURL=chunk-Y4UPKJN5.js.map
-//# sourceMappingURL=chunk-Y4UPKJN5.js.map
+//# sourceMappingURL=chunk-EQ7G5F6K.js.map
+//# sourceMappingURL=chunk-EQ7G5F6K.js.map

package/dist/{chunk-Y4UPKJN5.js.map → chunk-EQ7G5F6K.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Eyebrow/Eyebrow.tsx"],"names":[],"mappings":";;;;AAkBO,IAAM,OAAA,GAAU,UAAA;AAAA,EACrB,CAAC,EAAE,GAAA,EAAK,KAAA,EAAO,KAAA,EAAO,IAAA,GAAO,KAAA,EAAO,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAC3E,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,0BAAA,EAAyB,EAAA;AAAA,QACzB,SAAA,EAAW,EAAA;AAAA,UACT,6GAAA;AAAA,UACA,IAAA,IAAQ,oDAAA;AAAA,UACR;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,QAAA,yBACE,MAAA,EAAA,EACE,QAAA,EAAA;AAAA,YAAA,GAAA,IAAO,wBACN,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,8CAAA,EAAgD,QAAA,EAAA,GAAA,EAAI,CAAA;AAAA,cAChE,SAAS,IAAA,IAAQ;AAAA,aAAA,EACpB,CAAA;AAAA,YAED;AAAA,WAAA,EACH,CAAA;AAAA,UAKD,SAAS,IAAA,oBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,WAAW,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,KACrD;AAAA,EAEJ;AACF;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-Y4UPKJN5.js","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { EyebrowProps } from \"./Eyebrow.types\";\n\n/**\n * The mono running head that opens a section — `01 — SELECTED WORK`, optionally\n * over a hairline rule, with a second item pushed to the far end.\n *\n * Thirty-six surfaces in the Inspiration Gallery carry some version of this. It\n * is a small component for a reason: what they share is the STRUCTURE (a\n * numbered marker, a label, an optional trailing aside, an optional rule) while\n * every one of them restyles the type. So this owns the arrangement and the\n * uppercase mono default, and gets out of the way of `className`.\n *\n * `num` is emphasised rather than styled a fixed colour, because in half the\n * designs it is the only part of the line that is not muted — and expressing\n * that with a `<b>` keeps it meaningful when the styling is replaced wholesale.\n */\nexport const Eyebrow = forwardRef<HTMLDivElement, EyebrowProps>(\n  ({ num, label, aside, rule = false, className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-eyebrow=\"\"\n        className={cn(\n          \"flex items-baseline gap-3 font-mono text-[11.5px] uppercase tracking-wider text-zinc-500 dark:text-zinc-400\",\n          rule && \"border-b border-zinc-200 pb-2 dark:border-zinc-800\",\n          className,\n        )}\n        {...props}\n      >\n        {children ?? (\n          <span>\n            {num != null && (\n              <>\n                <b className=\"font-medium text-zinc-900 dark:text-zinc-100\">{num}</b>\n                {label != null && \" — \"}\n              </>\n            )}\n            {label}\n          </span>\n        )}\n\n        {/* `ml-auto` rather than `justify-between`, so a single-item eyebrow\n            still sits flush left instead of being centred by the gap. */}\n        {aside != null && <span className=\"ml-auto\">{aside}</span>}\n      </div>\n    );\n  },\n);\n\nEyebrow.displayName = \"Eyebrow\";\n"]}
+{"version":3,"sources":["../src/components/Eyebrow/Eyebrow.tsx"],"names":[],"mappings":";;;;AAkBO,IAAM,OAAA,GAAU,UAAA;AAAA,EACrB,CAAC,EAAE,GAAA,EAAK,KAAA,EAAO,KAAA,EAAO,IAAA,GAAO,KAAA,EAAO,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAC3E,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,0BAAA,EAAyB,EAAA;AAAA,QACzB,SAAA,EAAW,EAAA;AAAA,UACT,4MAAA;AAAA,UACA,IAAA,IAAQ,oDAAA;AAAA,UACR;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,QAAA,yBACE,MAAA,EAAA,EACE,QAAA,EAAA;AAAA,YAAA,GAAA,IAAO,wBACN,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,iIAAA,EAAmI,QAAA,EAAA,GAAA,EAAI,CAAA;AAAA,cACnJ,SAAS,IAAA,IAAQ;AAAA,aAAA,EACpB,CAAA;AAAA,YAED;AAAA,WAAA,EACH,CAAA;AAAA,UAKD,SAAS,IAAA,oBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,WAAW,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,KACrD;AAAA,EAEJ;AACF;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-EQ7G5F6K.js","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { EyebrowProps } from \"./Eyebrow.types\";\n\n/**\n * The mono running head that opens a section — `01 — SELECTED WORK`, optionally\n * over a hairline rule, with a second item pushed to the far end.\n *\n * Thirty-six surfaces in the Inspiration Gallery carry some version of this. It\n * is a small component for a reason: what they share is the STRUCTURE (a\n * numbered marker, a label, an optional trailing aside, an optional rule) while\n * every one of them restyles the type. So this owns the arrangement and the\n * uppercase mono default, and gets out of the way of `className`.\n *\n * `num` is emphasised rather than styled a fixed colour, because in half the\n * designs it is the only part of the line that is not muted — and expressing\n * that with a `<b>` keeps it meaningful when the styling is replaced wholesale.\n */\nexport const Eyebrow = forwardRef<HTMLDivElement, EyebrowProps>(\n  ({ num, label, aside, rule = false, className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-eyebrow=\"\"\n        className={cn(\n          \"flex items-baseline gap-3 font-mono text-[11.5px] uppercase tracking-wider text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\",\n          rule && \"border-b border-zinc-200 pb-2 dark:border-zinc-800\",\n          className,\n        )}\n        {...props}\n      >\n        {children ?? (\n          <span>\n            {num != null && (\n              <>\n                <b className=\"font-medium text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]\">{num}</b>\n                {label != null && \" — \"}\n              </>\n            )}\n            {label}\n          </span>\n        )}\n\n        {/* `ml-auto` rather than `justify-between`, so a single-item eyebrow\n            still sits flush left instead of being centred by the gap. */}\n        {aside != null && <span className=\"ml-auto\">{aside}</span>}\n      </div>\n    );\n  },\n);\n\nEyebrow.displayName = \"Eyebrow\";\n"]}

package/dist/{chunk-U7PFHQBN.cjs → chunk-ETNQ4AEQ.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkYLGTDBB2_cjs = require('./chunk-YLGTDBB2.cjs');
+var chunkO3F6DYWR_cjs = require('./chunk-O3F6DYWR.cjs');
 var chunkKJ22KE56_cjs = require('./chunk-KJ22KE56.cjs');
 var chunkL3V3BYVS_cjs = require('./chunk-L3V3BYVS.cjs');
 var chunkSNHU2AI4_cjs = require('./chunk-SNHU2AI4.cjs');
@@ -99,8 +99,8 @@ var Checkbox = react.forwardRef(
           onChange: (e) => setChecked(e.target.checked),
           className: chunkZU5Q77OT_cjs.cn(
             sizeClasses,
-            "cursor-pointer rounded border border-zinc-300 bg-white text-blue-600 transition-[border-color,box-shadow] duration-150 focus:ring-2 focus:ring-blue-500/40 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 dark:border-zinc-700 dark:bg-[#1e1e24]",
-            chunkYLGTDBB2_cjs.dirtyRingClasses(dirty),
+            "cursor-pointer rounded border border-[color:var(--fancy-border-strong,var(--color-zinc-300))] bg-[color:var(--fancy-input,var(--color-white))] text-blue-600 transition-[border-color,box-shadow] duration-150 focus:ring-2 focus:ring-blue-500/40 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 dark:border-[color:var(--fancy-border-strong-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-input-dark,#1e1e24)]",
+            chunkO3F6DYWR_cjs.dirtyRingClasses(dirty),
             error && "border-red-500"
           )
         }
@@ -120,7 +120,7 @@ var Checkbox = react.forwardRef(
             ]
           }
         ),
-        description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-zinc-500 dark:text-zinc-400", children: description }),
+        description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]", children: description }),
         error && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-red-500", children: error })
       ] })
     ] });
@@ -129,5 +129,5 @@ var Checkbox = react.forwardRef(
 Checkbox.displayName = "Checkbox";
 
 exports.Checkbox = Checkbox;
-//# sourceMappingURL=chunk-U7PFHQBN.cjs.map
-//# sourceMappingURL=chunk-U7PFHQBN.cjs.map
+//# sourceMappingURL=chunk-ETNQ4AEQ.cjs.map
+//# sourceMappingURL=chunk-ETNQ4AEQ.cjs.map

package/dist/{chunk-U7PFHQBN.cjs.map → chunk-ETNQ4AEQ.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/inputs/Checkbox/Checkbox.tsx"],"names":["forwardRef","useId","useRef","useFieldMode","useInlineEdit","useControllableState","useEffect","jsxs","cn","jsx","dirtyRingClasses"],"mappings":";;;;;;;;;;AAQO,IAAM,QAAA,GAAWA,gBAAA;AAAA,EACtB,CACE;AAAA,IACE,IAAA,GAAO,IAAA;AAAA,IACP,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,EAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAA,EAAS,iBAAA;AAAA,IACT,cAAA,GAAiB,KAAA;AAAA,IACjB,eAAA;AAAA,IACA,aAAA;AAAA,IACA,IAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,MAAM,SAASC,WAAA,EAAM;AACrB,IAAA,MAAM,aAAa,EAAA,IAAM,MAAA;AACzB,IAAA,MAAM,WAAA,GAAcC,aAAgC,IAAI,CAAA;AACxD,IAAA,MAAM,YAAA,GAAeC,+BAAa,IAAI,CAAA;AACtC,IAAA,MAAM,EAAE,aAAa,WAAA,EAAa,SAAA,EAAW,UAAS,GAAIC,+BAAA,CAAc,cAAc,QAAQ,CAAA;AAC9F,IAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIC,sCAAA;AAAA,MAC5B,iBAAA;AAAA,MACA,cAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,MAAM,KAAK,WAAA,CAAY,OAAA;AACvB,MAAA,IAAI,EAAA,EAAI;AACN,QAAA,EAAA,CAAG,gBAAgB,aAAA,IAAiB,KAAA;AAAA,MACtC;AAAA,IACF,CAAA,EAAG,CAAC,aAAa,CAAC,CAAA;AAElB,IAAA,MAAM,WAAA,GAAc;AAAA,MAClB,EAAA,EAAI,aAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI,mBAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI;AAAA,MACJ,IAAI,CAAA;AAEN,IAAA,MAAM,KAAA,GAAQ,aAAA,GAAgB,QAAA,GAAM,OAAA,GAAU,QAAA,GAAM,QAAA;AAEpD,IAAA,uBACEC,eAAA,CAAC,KAAA,EAAA,EAAK,GAAG,IAAA,EAAM,2BAAA,EAA0B,IAAG,SAAA,EAAWC,oBAAA,CAAG,wBAAA,EAA0B,SAAS,CAAA,EAC1F,QAAA,EAAA;AAAA,MAAA,CAAC,WAAA,mBACAC,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,0BAAA,EAAyB,EAAA;AAAA,UACzB,WAAA,EAAU,MAAA;AAAA,UACV,IAAA,EAAM,cAAc,QAAA,GAAW,MAAA;AAAA,UAC/B,QAAA,EAAU,cAAc,CAAA,GAAI,MAAA;AAAA,UAC5B,KAAA,EAAO,cAAc,eAAA,GAAkB,MAAA;AAAA,UACvC,OAAA,EAAS,cAAc,SAAA,GAAY,MAAA;AAAA,UACnC,SAAA,EACE,WAAA,GACI,CAAC,CAAA,KAAM;AACL,YAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAA,CAAE,QAAQ,GAAA,EAAK;AACtC,cAAA,CAAA,CAAE,cAAA,EAAe;AACjB,cAAA,SAAA,EAAU;AAAA,YACZ;AAAA,UACF,CAAA,GACA,MAAA;AAAA,UAEN,SAAA,EAAWD,oBAAA;AAAA,YACT,4EAAA;AAAA,YACA,WAAA;AAAA,YACA,WAAA,IACE;AAAA,WACJ;AAAA,UACA,aAAA,EAAa,cAAc,MAAA,GAAY,MAAA;AAAA,UAEtC,QAAA,EAAA;AAAA;AAAA,OACH,mBAEFC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4BAAA,EACb,QAAA,kBAAAA,cAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,GAAA,EAAK,CAAC,IAAA,KAAS;AACb,YAAA,WAAA,CAAY,OAAA,GAAU,IAAA;AACtB,YAAA,IAAI,OAAO,QAAQ,UAAA,EAAY;AAC7B,cAAA,GAAA,CAAI,IAAI,CAAA;AAAA,YACV,WAAW,GAAA,EAAK;AACd,cAAA,GAAA,CAAI,OAAA,GAAU,IAAA;AAAA,YAChB;AAAA,UACF,CAAA;AAAA,UACA,EAAA,EAAI,UAAA;AAAA,UACJ,IAAA,EAAK,UAAA;AAAA,UACL,IAAA;AAAA,UACA,QAAA;AAAA,UACA,QAAA;AAAA,UACA,OAAA;AAAA,UACA,SAAA,EAAW,WAAA;AAAA,UACX,QAAQ,MAAM;AACZ,YAAA,IAAI,aAAa,QAAA,EAAS;AAAA,UAC5B,CAAA;AAAA,UACA,UAAU,CAAC,CAAA,KAAM,UAAA,CAAW,CAAA,CAAE,OAAO,OAAO,CAAA;AAAA,UAC5C,SAAA,EAAWD,oBAAA;AAAA,YACT,WAAA;AAAA,YACA,uQAAA;AAAA,YACAE,mCAAiB,KAAK,CAAA;AAAA,YACtB,KAAA,IAAS;AAAA;AACX;AAAA,OACF,EACF,CAAA;AAAA,MAAA,CAEE,KAAA,IAAS,WAAA,qBACTH,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,eAAA,EACZ,QAAA,EAAA;AAAA,QAAA,KAAA,oBACCA,eAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,UAAA;AAAA,YACT,SAAA,EAAWC,oBAAA;AAAA,cACT,yDAAA;AAAA,cACA,QAAA,IAAY;AAAA,aACd;AAAA,YAEC,QAAA,EAAA;AAAA,cAAA,KAAA;AAAA,cACA,QAAA,oBAAYC,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uBAAsB,QAAA,EAAA,GAAA,EAAC;AAAA;AAAA;AAAA,SACtD;AAAA,QAED,WAAA,oBACCA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,4CACb,QAAA,EAAA,WAAA,EACH,CAAA;AAAA,QAED,KAAA,oBAASA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wBAAwB,QAAA,EAAA,KAAA,EAAM;AAAA,OAAA,EAC1D;AAAA,KAAA,EAEJ,CAAA;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-U7PFHQBN.cjs","sourcesContent":["import { forwardRef, useEffect, useId, useRef } from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { useControllableState } from \"../../../hooks/use-controllable-state\";\nimport { useFieldMode } from \"../mode/FieldMode.context\";\nimport { useInlineEdit } from \"../mode/useInlineEdit\";\nimport { dirtyRingClasses } from \"../inputs.utils\";\nimport type { CheckboxProps } from \"./Checkbox.types\";\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      size = \"md\",\n      dirty,\n      error,\n      label,\n      description,\n      required,\n      disabled,\n      className,\n      id,\n      name,\n      checked: controlledChecked,\n      defaultChecked = false,\n      onCheckedChange,\n      indeterminate,\n      mode,\n      ...rest\n    },\n    ref,\n  ) => {\n    const autoId = useId();\n    const checkboxId = id ?? autoId;\n    const internalRef = useRef<HTMLInputElement | null>(null);\n    const resolvedMode = useFieldMode(mode);\n    const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);\n    const [checked, setChecked] = useControllableState(\n      controlledChecked,\n      defaultChecked,\n      onCheckedChange,\n    );\n\n    useEffect(() => {\n      const el = internalRef.current;\n      if (el) {\n        el.indeterminate = indeterminate ?? false;\n      }\n    }, [indeterminate]);\n\n    const sizeClasses = {\n      xs: \"h-3.5 w-3.5\",\n      sm: \"h-4 w-4\",\n      md: \"h-[18px] w-[18px]\",\n      lg: \"h-5 w-5\",\n      xl: \"h-6 w-6\",\n    }[size];\n\n    const glyph = indeterminate ? \"—\" : checked ? \"✓\" : \"✕\";\n\n    return (\n      <div {...rest} data-react-fancy-checkbox=\"\" className={cn(\"flex items-start gap-2\", className)}>\n        {!showControl ? (\n          <span\n            data-react-fancy-display=\"\"\n            data-mode=\"view\"\n            role={interactive ? \"button\" : undefined}\n            tabIndex={interactive ? 0 : undefined}\n            title={interactive ? \"Click to edit\" : undefined}\n            onClick={interactive ? enterEdit : undefined}\n            onKeyDown={\n              interactive\n                ? (e) => {\n                    if (e.key === \"Enter\" || e.key === \" \") {\n                      e.preventDefault();\n                      enterEdit();\n                    }\n                  }\n                : undefined\n            }\n            className={cn(\n              \"flex shrink-0 items-center justify-center text-zinc-700 dark:text-zinc-200\",\n              sizeClasses,\n              interactive &&\n                \"cursor-pointer rounded outline-none transition-colors hover:text-zinc-900 focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:text-white\",\n            )}\n            aria-hidden={interactive ? undefined : \"true\"}\n          >\n            {glyph}\n          </span>\n        ) : (\n        <div className=\"relative flex items-center\">\n          <input\n            ref={(node) => {\n              internalRef.current = node;\n              if (typeof ref === \"function\") {\n                ref(node);\n              } else if (ref) {\n                ref.current = node;\n              }\n            }}\n            id={checkboxId}\n            type=\"checkbox\"\n            name={name}\n            disabled={disabled}\n            required={required}\n            checked={checked}\n            autoFocus={interactive}\n            onBlur={() => {\n              if (interactive) exitEdit();\n            }}\n            onChange={(e) => setChecked(e.target.checked)}\n            className={cn(\n              sizeClasses,\n              \"cursor-pointer rounded border border-zinc-300 bg-white text-blue-600 transition-[border-color,box-shadow] duration-150 focus:ring-2 focus:ring-blue-500/40 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 dark:border-zinc-700 dark:bg-[#1e1e24]\",\n              dirtyRingClasses(dirty),\n              error && \"border-red-500\",\n            )}\n          />\n        </div>\n        )}\n        {(label || description) && (\n          <div className=\"flex flex-col\">\n            {label && (\n              <label\n                htmlFor={checkboxId}\n                className={cn(\n                  \"cursor-pointer text-sm text-zinc-700 dark:text-zinc-100\",\n                  disabled && \"cursor-not-allowed opacity-50\",\n                )}\n              >\n                {label}\n                {required && <span className=\"ml-0.5 text-red-500\">*</span>}\n              </label>\n            )}\n            {description && (\n              <span className=\"text-xs text-zinc-500 dark:text-zinc-400\">\n                {description}\n              </span>\n            )}\n            {error && <span className=\"text-xs text-red-500\">{error}</span>}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n\nCheckbox.displayName = \"Checkbox\";\n"]}
+{"version":3,"sources":["../src/components/inputs/Checkbox/Checkbox.tsx"],"names":["forwardRef","useId","useRef","useFieldMode","useInlineEdit","useControllableState","useEffect","jsxs","cn","jsx","dirtyRingClasses"],"mappings":"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","file":"chunk-ETNQ4AEQ.cjs","sourcesContent":["import { forwardRef, useEffect, useId, useRef } from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { useControllableState } from \"../../../hooks/use-controllable-state\";\nimport { useFieldMode } from \"../mode/FieldMode.context\";\nimport { useInlineEdit } from \"../mode/useInlineEdit\";\nimport { dirtyRingClasses } from \"../inputs.utils\";\nimport type { CheckboxProps } from \"./Checkbox.types\";\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      size = \"md\",\n      dirty,\n      error,\n      label,\n      description,\n      required,\n      disabled,\n      className,\n      id,\n      name,\n      checked: controlledChecked,\n      defaultChecked = false,\n      onCheckedChange,\n      indeterminate,\n      mode,\n      ...rest\n    },\n    ref,\n  ) => {\n    const autoId = useId();\n    const checkboxId = id ?? autoId;\n    const internalRef = useRef<HTMLInputElement | null>(null);\n    const resolvedMode = useFieldMode(mode);\n    const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);\n    const [checked, setChecked] = useControllableState(\n      controlledChecked,\n      defaultChecked,\n      onCheckedChange,\n    );\n\n    useEffect(() => {\n      const el = internalRef.current;\n      if (el) {\n        el.indeterminate = indeterminate ?? false;\n      }\n    }, [indeterminate]);\n\n    const sizeClasses = {\n      xs: \"h-3.5 w-3.5\",\n      sm: \"h-4 w-4\",\n      md: \"h-[18px] w-[18px]\",\n      lg: \"h-5 w-5\",\n      xl: \"h-6 w-6\",\n    }[size];\n\n    const glyph = indeterminate ? \"—\" : checked ? \"✓\" : \"✕\";\n\n    return (\n      <div {...rest} data-react-fancy-checkbox=\"\" className={cn(\"flex items-start gap-2\", className)}>\n        {!showControl ? (\n          <span\n            data-react-fancy-display=\"\"\n            data-mode=\"view\"\n            role={interactive ? \"button\" : undefined}\n            tabIndex={interactive ? 0 : undefined}\n            title={interactive ? \"Click to edit\" : undefined}\n            onClick={interactive ? enterEdit : undefined}\n            onKeyDown={\n              interactive\n                ? (e) => {\n                    if (e.key === \"Enter\" || e.key === \" \") {\n                      e.preventDefault();\n                      enterEdit();\n                    }\n                  }\n                : undefined\n            }\n            className={cn(\n              \"flex shrink-0 items-center justify-center text-zinc-700 dark:text-zinc-200\",\n              sizeClasses,\n              interactive &&\n                \"cursor-pointer rounded outline-none transition-colors hover:text-zinc-900 focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:text-white\",\n            )}\n            aria-hidden={interactive ? undefined : \"true\"}\n          >\n            {glyph}\n          </span>\n        ) : (\n        <div className=\"relative flex items-center\">\n          <input\n            ref={(node) => {\n              internalRef.current = node;\n              if (typeof ref === \"function\") {\n                ref(node);\n              } else if (ref) {\n                ref.current = node;\n              }\n            }}\n            id={checkboxId}\n            type=\"checkbox\"\n            name={name}\n            disabled={disabled}\n            required={required}\n            checked={checked}\n            autoFocus={interactive}\n            onBlur={() => {\n              if (interactive) exitEdit();\n            }}\n            onChange={(e) => setChecked(e.target.checked)}\n            className={cn(\n              sizeClasses,\n              \"cursor-pointer rounded border border-[color:var(--fancy-border-strong,var(--color-zinc-300))] bg-[color:var(--fancy-input,var(--color-white))] text-blue-600 transition-[border-color,box-shadow] duration-150 focus:ring-2 focus:ring-blue-500/40 focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 dark:border-[color:var(--fancy-border-strong-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-input-dark,#1e1e24)]\",\n              dirtyRingClasses(dirty),\n              error && \"border-red-500\",\n            )}\n          />\n        </div>\n        )}\n        {(label || description) && (\n          <div className=\"flex flex-col\">\n            {label && (\n              <label\n                htmlFor={checkboxId}\n                className={cn(\n                  \"cursor-pointer text-sm text-zinc-700 dark:text-zinc-100\",\n                  disabled && \"cursor-not-allowed opacity-50\",\n                )}\n              >\n                {label}\n                {required && <span className=\"ml-0.5 text-red-500\">*</span>}\n              </label>\n            )}\n            {description && (\n              <span className=\"text-xs text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\">\n                {description}\n              </span>\n            )}\n            {error && <span className=\"text-xs text-red-500\">{error}</span>}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n\nCheckbox.displayName = \"Checkbox\";\n"]}

package/dist/{chunk-23PAOCQQ.cjs → chunk-EXQ33MJR.cjs}

@@ -89,7 +89,7 @@ function DropdownItems({ children, className }) {
       "data-react-fancy-dropdown": "",
       role: "menu",
       className: chunkZU5Q77OT_cjs.cn(
-        "fixed z-50 min-w-[8rem] rounded-xl border border-zinc-200 bg-white p-1 shadow-lg dark:border-zinc-700 dark:bg-zinc-900",
+        "fixed z-50 min-w-[8rem] rounded-xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] p-1 shadow-lg dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]",
         animClass,
         className
       ),
@@ -117,7 +117,7 @@ function DropdownItem({
       "aria-disabled": disabled,
       className: chunkZU5Q77OT_cjs.cn(
         "flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors",
-        danger ? "text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-950" : "text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800",
+        danger ? "text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-950" : "text-[color:var(--fancy-text-soft,var(--color-zinc-700))] hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]",
         disabled && "cursor-not-allowed opacity-50",
         className
       ),
@@ -138,7 +138,7 @@ function DropdownSeparator({ className }) {
       "data-react-fancy-dropdown-separator": "",
       role: "separator",
       className: chunkZU5Q77OT_cjs.cn(
-        "my-1 h-px bg-zinc-200 dark:bg-zinc-700",
+        "my-1 h-px bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]",
         className
       )
     }
@@ -168,5 +168,5 @@ var Dropdown = Object.assign(DropdownRoot, {
 
 exports.Dropdown = Dropdown;
 exports.useDropdown = useDropdown;
-//# sourceMappingURL=chunk-23PAOCQQ.cjs.map
-//# sourceMappingURL=chunk-23PAOCQQ.cjs.map
+//# sourceMappingURL=chunk-EXQ33MJR.cjs.map
+//# sourceMappingURL=chunk-EXQ33MJR.cjs.map

package/dist/{chunk-23PAOCQQ.cjs.map → chunk-EXQ33MJR.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Dropdown/Dropdown.context.ts","../src/components/Dropdown/DropdownTrigger.tsx","../src/components/Dropdown/DropdownItems.tsx","../src/components/Dropdown/DropdownItem.tsx","../src/components/Dropdown/DropdownSeparator.tsx","../src/components/Dropdown/Dropdown.tsx"],"names":["createContext","useContext","jsx","useRef","useFloatingPosition","useCallback","useOutsideClick","useEscapeKey","useAnimation","useEffect","Portal","cn","useState","useMemo"],"mappings":"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","file":"chunk-23PAOCQQ.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { DropdownContextValue } from \"./Dropdown.types\";\n\nexport const DropdownContext = createContext<DropdownContextValue | null>(null);\n\nexport function useDropdown(): DropdownContextValue {\n  const ctx = useContext(DropdownContext);\n  if (!ctx) {\n    throw new Error(\n      \"Dropdown compound components must be used within <Dropdown>\",\n    );\n  }\n  return ctx;\n}\n","import { useDropdown } from \"./Dropdown.context\";\nimport type { DropdownTriggerProps } from \"./Dropdown.types\";\n\nexport function DropdownTrigger({ children }: DropdownTriggerProps) {\n  const { setOpen, open, anchorRef } = useDropdown();\n\n  return (\n    <span\n      ref={anchorRef as React.RefObject<HTMLSpanElement>}\n      data-react-fancy-dropdown-trigger=\"\"\n      className=\"inline-flex\"\n      onClick={() => setOpen(!open)}\n      aria-expanded={open}\n      aria-haspopup=\"menu\"\n    >\n      {children}\n    </span>\n  );\n}\n\nDropdownTrigger.displayName = \"DropdownTrigger\";\n","import { useCallback, useEffect, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { useDropdown } from \"./Dropdown.context\";\nimport { useFloatingPosition } from \"../../hooks/use-floating-position\";\nimport { useOutsideClick } from \"../../hooks/use-outside-click\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { DropdownItemsProps } from \"./Dropdown.types\";\n\nexport function DropdownItems({ children, className }: DropdownItemsProps) {\n  const { open, setOpen, anchorRef, activeIndex, setActiveIndex, placement, offset } =\n    useDropdown();\n  const floatingRef = useRef<HTMLDivElement>(null);\n  const outsideRef = useRef<HTMLDivElement>(null);\n\n  const position = useFloatingPosition(anchorRef, floatingRef, {\n    placement,\n    offset,\n    enabled: open,\n  });\n\n  const close = useCallback(() => {\n    setOpen(false);\n    setActiveIndex(-1);\n  }, [setOpen, setActiveIndex]);\n\n  useOutsideClick(outsideRef, close, open, anchorRef);\n  useEscapeKey(close, open);\n\n  const { mounted, className: animClass, ref: animRef } = useAnimation({\n    open,\n    enterClass: \"fancy-scale-in\",\n    exitClass: \"fancy-fade-out\",\n  });\n\n  useEffect(() => {\n    if (!open || !floatingRef.current) return;\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      const items = floatingRef.current?.querySelectorAll<HTMLElement>(\n        '[role=\"menuitem\"]:not([aria-disabled=\"true\"])',\n      );\n      if (!items?.length) return;\n\n      if (e.key === \"ArrowDown\") {\n        e.preventDefault();\n        const next = activeIndex < items.length - 1 ? activeIndex + 1 : 0;\n        setActiveIndex(next);\n        items[next]?.focus();\n      } else if (e.key === \"ArrowUp\") {\n        e.preventDefault();\n        const prev = activeIndex > 0 ? activeIndex - 1 : items.length - 1;\n        setActiveIndex(prev);\n        items[prev]?.focus();\n      }\n    };\n\n    document.addEventListener(\"keydown\", handleKeyDown);\n    return () => document.removeEventListener(\"keydown\", handleKeyDown);\n  }, [open, activeIndex, setActiveIndex]);\n\n  if (!mounted) return null;\n\n  return (\n    <Portal>\n      <div\n        ref={(node) => {\n          outsideRef.current = node;\n          floatingRef.current = node;\n          (animRef as React.MutableRefObject<HTMLElement | null>).current = node;\n        }}\n        data-react-fancy-dropdown=\"\"\n        role=\"menu\"\n        className={cn(\n          \"fixed z-50 min-w-[8rem] rounded-xl border border-zinc-200 bg-white p-1 shadow-lg dark:border-zinc-700 dark:bg-zinc-900\",\n          animClass,\n          className,\n        )}\n        style={{ left: position.x, top: position.y }}\n      >\n        {children}\n      </div>\n    </Portal>\n  );\n}\n\nDropdownItems.displayName = \"DropdownItems\";\n","import { cn } from \"../../utils/cn\";\nimport { useDropdown } from \"./Dropdown.context\";\nimport type { DropdownItemProps } from \"./Dropdown.types\";\n\nexport function DropdownItem({\n  children,\n  onClick,\n  disabled = false,\n  danger = false,\n  className,\n}: DropdownItemProps) {\n  const { setOpen } = useDropdown();\n\n  return (\n    <button\n      data-react-fancy-dropdown-item=\"\"\n      type=\"button\"\n      role=\"menuitem\"\n      disabled={disabled}\n      aria-disabled={disabled}\n      className={cn(\n        \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n        danger\n          ? \"text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-950\"\n          : \"text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800\",\n        disabled && \"cursor-not-allowed opacity-50\",\n        className,\n      )}\n      onClick={() => {\n        if (disabled) return;\n        onClick?.();\n        setOpen(false);\n      }}\n    >\n      {children}\n    </button>\n  );\n}\n\nDropdownItem.displayName = \"DropdownItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { DropdownSeparatorProps } from \"./Dropdown.types\";\n\nexport function DropdownSeparator({ className }: DropdownSeparatorProps) {\n  return (\n    <div\n      data-react-fancy-dropdown-separator=\"\"\n      role=\"separator\"\n      className={cn(\n        \"my-1 h-px bg-zinc-200 dark:bg-zinc-700\",\n        className,\n      )}\n    />\n  );\n}\n\nDropdownSeparator.displayName = \"DropdownSeparator\";\n","import { useMemo, useRef, useState } from \"react\";\nimport { DropdownContext } from \"./Dropdown.context\";\nimport { DropdownTrigger } from \"./DropdownTrigger\";\nimport { DropdownItems } from \"./DropdownItems\";\nimport { DropdownItem } from \"./DropdownItem\";\nimport { DropdownSeparator } from \"./DropdownSeparator\";\nimport type { DropdownProps } from \"./Dropdown.types\";\n\nfunction DropdownRoot({\n  children,\n  placement = \"bottom-start\",\n  offset = 4,\n}: DropdownProps) {\n  const [open, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState(-1);\n  const anchorRef = useRef<HTMLElement>(null);\n\n  const ctx = useMemo(\n    () => ({ open, setOpen, anchorRef, activeIndex, setActiveIndex, placement, offset }),\n    [open, anchorRef, activeIndex, placement, offset],\n  );\n\n  return (\n    <DropdownContext.Provider value={ctx}>{children}</DropdownContext.Provider>\n  );\n}\n\nexport const Dropdown = Object.assign(DropdownRoot, {\n  Trigger: DropdownTrigger,\n  Items: DropdownItems,\n  Item: DropdownItem,\n  Separator: DropdownSeparator,\n});\n"]}
+{"version":3,"sources":["../src/components/Dropdown/Dropdown.context.ts","../src/components/Dropdown/DropdownTrigger.tsx","../src/components/Dropdown/DropdownItems.tsx","../src/components/Dropdown/DropdownItem.tsx","../src/components/Dropdown/DropdownSeparator.tsx","../src/components/Dropdown/Dropdown.tsx"],"names":["createContext","useContext","jsx","useRef","useFloatingPosition","useCallback","useOutsideClick","useEscapeKey","useAnimation","useEffect","Portal","cn","useState","useMemo"],"mappings":"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","file":"chunk-EXQ33MJR.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { DropdownContextValue } from \"./Dropdown.types\";\n\nexport const DropdownContext = createContext<DropdownContextValue | null>(null);\n\nexport function useDropdown(): DropdownContextValue {\n  const ctx = useContext(DropdownContext);\n  if (!ctx) {\n    throw new Error(\n      \"Dropdown compound components must be used within <Dropdown>\",\n    );\n  }\n  return ctx;\n}\n","import { useDropdown } from \"./Dropdown.context\";\nimport type { DropdownTriggerProps } from \"./Dropdown.types\";\n\nexport function DropdownTrigger({ children }: DropdownTriggerProps) {\n  const { setOpen, open, anchorRef } = useDropdown();\n\n  return (\n    <span\n      ref={anchorRef as React.RefObject<HTMLSpanElement>}\n      data-react-fancy-dropdown-trigger=\"\"\n      className=\"inline-flex\"\n      onClick={() => setOpen(!open)}\n      aria-expanded={open}\n      aria-haspopup=\"menu\"\n    >\n      {children}\n    </span>\n  );\n}\n\nDropdownTrigger.displayName = \"DropdownTrigger\";\n","import { useCallback, useEffect, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { useDropdown } from \"./Dropdown.context\";\nimport { useFloatingPosition } from \"../../hooks/use-floating-position\";\nimport { useOutsideClick } from \"../../hooks/use-outside-click\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { DropdownItemsProps } from \"./Dropdown.types\";\n\nexport function DropdownItems({ children, className }: DropdownItemsProps) {\n  const { open, setOpen, anchorRef, activeIndex, setActiveIndex, placement, offset } =\n    useDropdown();\n  const floatingRef = useRef<HTMLDivElement>(null);\n  const outsideRef = useRef<HTMLDivElement>(null);\n\n  const position = useFloatingPosition(anchorRef, floatingRef, {\n    placement,\n    offset,\n    enabled: open,\n  });\n\n  const close = useCallback(() => {\n    setOpen(false);\n    setActiveIndex(-1);\n  }, [setOpen, setActiveIndex]);\n\n  useOutsideClick(outsideRef, close, open, anchorRef);\n  useEscapeKey(close, open);\n\n  const { mounted, className: animClass, ref: animRef } = useAnimation({\n    open,\n    enterClass: \"fancy-scale-in\",\n    exitClass: \"fancy-fade-out\",\n  });\n\n  useEffect(() => {\n    if (!open || !floatingRef.current) return;\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      const items = floatingRef.current?.querySelectorAll<HTMLElement>(\n        '[role=\"menuitem\"]:not([aria-disabled=\"true\"])',\n      );\n      if (!items?.length) return;\n\n      if (e.key === \"ArrowDown\") {\n        e.preventDefault();\n        const next = activeIndex < items.length - 1 ? activeIndex + 1 : 0;\n        setActiveIndex(next);\n        items[next]?.focus();\n      } else if (e.key === \"ArrowUp\") {\n        e.preventDefault();\n        const prev = activeIndex > 0 ? activeIndex - 1 : items.length - 1;\n        setActiveIndex(prev);\n        items[prev]?.focus();\n      }\n    };\n\n    document.addEventListener(\"keydown\", handleKeyDown);\n    return () => document.removeEventListener(\"keydown\", handleKeyDown);\n  }, [open, activeIndex, setActiveIndex]);\n\n  if (!mounted) return null;\n\n  return (\n    <Portal>\n      <div\n        ref={(node) => {\n          outsideRef.current = node;\n          floatingRef.current = node;\n          (animRef as React.MutableRefObject<HTMLElement | null>).current = node;\n        }}\n        data-react-fancy-dropdown=\"\"\n        role=\"menu\"\n        className={cn(\n          \"fixed z-50 min-w-[8rem] rounded-xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] p-1 shadow-lg dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]\",\n          animClass,\n          className,\n        )}\n        style={{ left: position.x, top: position.y }}\n      >\n        {children}\n      </div>\n    </Portal>\n  );\n}\n\nDropdownItems.displayName = \"DropdownItems\";\n","import { cn } from \"../../utils/cn\";\nimport { useDropdown } from \"./Dropdown.context\";\nimport type { DropdownItemProps } from \"./Dropdown.types\";\n\nexport function DropdownItem({\n  children,\n  onClick,\n  disabled = false,\n  danger = false,\n  className,\n}: DropdownItemProps) {\n  const { setOpen } = useDropdown();\n\n  return (\n    <button\n      data-react-fancy-dropdown-item=\"\"\n      type=\"button\"\n      role=\"menuitem\"\n      disabled={disabled}\n      aria-disabled={disabled}\n      className={cn(\n        \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n        danger\n          ? \"text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-950\"\n          : \"text-[color:var(--fancy-text-soft,var(--color-zinc-700))] hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]\",\n        disabled && \"cursor-not-allowed opacity-50\",\n        className,\n      )}\n      onClick={() => {\n        if (disabled) return;\n        onClick?.();\n        setOpen(false);\n      }}\n    >\n      {children}\n    </button>\n  );\n}\n\nDropdownItem.displayName = \"DropdownItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { DropdownSeparatorProps } from \"./Dropdown.types\";\n\nexport function DropdownSeparator({ className }: DropdownSeparatorProps) {\n  return (\n    <div\n      data-react-fancy-dropdown-separator=\"\"\n      role=\"separator\"\n      className={cn(\n        \"my-1 h-px bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n        className,\n      )}\n    />\n  );\n}\n\nDropdownSeparator.displayName = \"DropdownSeparator\";\n","import { useMemo, useRef, useState } from \"react\";\nimport { DropdownContext } from \"./Dropdown.context\";\nimport { DropdownTrigger } from \"./DropdownTrigger\";\nimport { DropdownItems } from \"./DropdownItems\";\nimport { DropdownItem } from \"./DropdownItem\";\nimport { DropdownSeparator } from \"./DropdownSeparator\";\nimport type { DropdownProps } from \"./Dropdown.types\";\n\nfunction DropdownRoot({\n  children,\n  placement = \"bottom-start\",\n  offset = 4,\n}: DropdownProps) {\n  const [open, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState(-1);\n  const anchorRef = useRef<HTMLElement>(null);\n\n  const ctx = useMemo(\n    () => ({ open, setOpen, anchorRef, activeIndex, setActiveIndex, placement, offset }),\n    [open, anchorRef, activeIndex, placement, offset],\n  );\n\n  return (\n    <DropdownContext.Provider value={ctx}>{children}</DropdownContext.Provider>\n  );\n}\n\nexport const Dropdown = Object.assign(DropdownRoot, {\n  Trigger: DropdownTrigger,\n  Items: DropdownItems,\n  Item: DropdownItem,\n  Separator: DropdownSeparator,\n});\n"]}

package/dist/{chunk-HKRB2Z6R.cjs → chunk-FGI2EC32.cjs}

@@ -24,17 +24,17 @@ function ModalHeader({ children, className }) {
     {
       "data-react-fancy-modal-header": "",
       className: chunkZU5Q77OT_cjs.cn(
-        "flex items-center justify-between border-b border-zinc-200 px-6 py-4 dark:border-zinc-700",
+        "flex items-center justify-between border-b border-[color:var(--fancy-border,var(--color-zinc-200))] px-6 py-4 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]",
         className
       ),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-semibold text-zinc-900 dark:text-zinc-100", children }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-semibold text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]", children }),
         /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
             type: "button",
             onClick: close,
-            className: "rounded-lg p-1 text-zinc-400 transition-colors hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300",
+            className: "rounded-lg p-1 text-zinc-400 transition-colors hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] hover:text-zinc-600 dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:hover:text-zinc-300",
             "aria-label": "Close",
             children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 20 })
           }
@@ -51,7 +51,7 @@ function ModalBody({ children, className }) {
     // `flex-1` alone would push the panel through its own max-height and the
     // scrollbar would never appear. This is what permits the overflow that
     // `overflow-y-auto` then handles.
-    /* @__PURE__ */ jsxRuntime.jsx("div", { "data-react-fancy-modal-body": "", className: chunkZU5Q77OT_cjs.cn("min-h-0 flex-1 overflow-y-auto px-6 py-4 text-zinc-700 dark:text-zinc-300", className), children })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { "data-react-fancy-modal-body": "", className: chunkZU5Q77OT_cjs.cn("min-h-0 flex-1 overflow-y-auto px-6 py-4 text-[color:var(--fancy-text-soft,var(--color-zinc-700))] dark:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))]", className), children })
   );
 }
 ModalBody.displayName = "ModalBody";
@@ -61,7 +61,7 @@ function ModalFooter({ children, className }) {
     {
       "data-react-fancy-modal-footer": "",
       className: chunkZU5Q77OT_cjs.cn(
-        "flex items-center justify-end gap-3 border-t border-zinc-200 px-6 py-4 dark:border-zinc-700",
+        "flex items-center justify-end gap-3 border-t border-[color:var(--fancy-border,var(--color-zinc-200))] px-6 py-4 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]",
         className
       ),
       children
@@ -126,7 +126,7 @@ function ModalRoot({
         "aria-modal": "true",
         ...rest,
         className: chunkZU5Q77OT_cjs.cn(
-          "relative flex w-full flex-col overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-xl dark:border-zinc-700 dark:bg-zinc-900",
+          "relative flex w-full flex-col overflow-hidden rounded-2xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] shadow-xl dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]",
           SIZE_MAP[size],
           animClass,
           className
@@ -144,5 +144,5 @@ var Modal = Object.assign(ModalRoot, {
 
 exports.Modal = Modal;
 exports.useModal = useModal;
-//# sourceMappingURL=chunk-HKRB2Z6R.cjs.map
-//# sourceMappingURL=chunk-HKRB2Z6R.cjs.map
+//# sourceMappingURL=chunk-FGI2EC32.cjs.map
+//# sourceMappingURL=chunk-FGI2EC32.cjs.map

package/dist/chunk-FGI2EC32.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Modal/Modal.context.ts","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalBody.tsx","../src/components/Modal/ModalFooter.tsx","../src/components/Modal/Modal.tsx"],"names":["createContext","useContext","jsxs","cn","jsx","X","useRef","useCallback","useEscapeKey","useFocusTrap","useEffect","useAnimation","useMemo","Portal"],"mappings":"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","file":"chunk-FGI2EC32.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ModalContextValue } from \"./Modal.types\";\n\nexport const ModalContext = createContext<ModalContextValue | null>(null);\n\nexport function useModal(): ModalContextValue {\n  const ctx = useContext(ModalContext);\n  if (!ctx) {\n    throw new Error(\"Modal compound components must be used within <Modal>\");\n  }\n  return ctx;\n}\n","import { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useModal } from \"./Modal.context\";\nimport type { ModalHeaderProps } from \"./Modal.types\";\n\nexport function ModalHeader({ children, className }: ModalHeaderProps) {\n  const { close } = useModal();\n\n  return (\n    <div\n      data-react-fancy-modal-header=\"\"\n      className={cn(\n        \"flex items-center justify-between border-b border-[color:var(--fancy-border,var(--color-zinc-200))] px-6 py-4 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n        className,\n      )}\n    >\n      <div className=\"text-lg font-semibold text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]\">{children}</div>\n      <button\n        type=\"button\"\n        onClick={close}\n        className=\"rounded-lg p-1 text-zinc-400 transition-colors hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] hover:text-zinc-600 dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:hover:text-zinc-300\"\n        aria-label=\"Close\"\n      >\n        <X size={20} />\n      </button>\n    </div>\n  );\n}\n\nModalHeader.displayName = \"ModalHeader\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalBodyProps } from \"./Modal.types\";\n\nexport function ModalBody({ children, className }: ModalBodyProps) {\n  return (\n    // `min-h-0` is load-bearing, not decoration. A flex child defaults to\n    // `min-height: auto`, which refuses to shrink below its content — so\n    // `flex-1` alone would push the panel through its own max-height and the\n    // scrollbar would never appear. This is what permits the overflow that\n    // `overflow-y-auto` then handles.\n    <div data-react-fancy-modal-body=\"\" className={cn(\"min-h-0 flex-1 overflow-y-auto px-6 py-4 text-[color:var(--fancy-text-soft,var(--color-zinc-700))] dark:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))]\", className)}>\n      {children}\n    </div>\n  );\n}\n\nModalBody.displayName = \"ModalBody\";\n","import { cn } from \"../../utils/cn\";\nimport type { ModalFooterProps } from \"./Modal.types\";\n\nexport function ModalFooter({ children, className }: ModalFooterProps) {\n  return (\n    <div\n      data-react-fancy-modal-footer=\"\"\n      className={cn(\n        \"flex items-center justify-end gap-3 border-t border-[color:var(--fancy-border,var(--color-zinc-200))] px-6 py-4 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\nModalFooter.displayName = \"ModalFooter\";\n","import { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { ModalContext } from \"./Modal.context\";\nimport { ModalHeader } from \"./ModalHeader\";\nimport { ModalBody } from \"./ModalBody\";\nimport { ModalFooter } from \"./ModalFooter\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { ModalProps } from \"./Modal.types\";\n\n/**\n * Every size is capped against the VIEWPORT, not just the width.\n *\n * Only `full` used to carry a max-height. The other four were width-constrained\n * and vertically unbounded, so a modal with long content simply grew past the\n * bottom of the screen and the rest became unreachable — no scrollbar, because\n * there was no overflow to scroll: the box got taller instead.\n *\n * `ModalBody` already had `flex-1 overflow-y-auto` and the panel already had\n * `overflow-hidden`. The scrolling machinery was complete and inert, waiting on\n * the one constraint that makes it engage.\n *\n * `dvh` over `vh` deliberately: on mobile browsers `100vh` is the tallest the\n * viewport ever gets, ignoring the address bar, so a `vh`-capped modal still\n * runs under the chrome on exactly the devices with least room. `dvh` tracks\n * the visible height. The `vh` fallback is listed first for any engine that\n * does not know `dvh` yet — an unknown unit drops the declaration, so ordering\n * is what keeps the old behaviour rather than none.\n */\nconst VIEWPORT_CAP = \"max-h-[calc(100vh-2rem)] max-h-[calc(100dvh-2rem)]\";\n\nconst SIZE_MAP = {\n  sm: `max-w-sm ${VIEWPORT_CAP}`,\n  md: `max-w-lg ${VIEWPORT_CAP}`,\n  lg: `max-w-2xl ${VIEWPORT_CAP}`,\n  xl: `max-w-4xl ${VIEWPORT_CAP}`,\n  full: `max-w-[calc(100vw-2rem)] ${VIEWPORT_CAP}`,\n} as const;\n\nfunction ModalRoot({\n  children,\n  open,\n  onClose,\n  size = \"md\",\n  className,\n  ...rest\n}: ModalProps) {\n  const panelRef = useRef<HTMLDivElement>(null);\n\n  const close = useCallback(() => onClose(), [onClose]);\n  useEscapeKey(close, open);\n  useFocusTrap(panelRef, open);\n\n  // Body scroll lock\n  useEffect(() => {\n    if (open) {\n      const original = document.body.style.overflow;\n      document.body.style.overflow = \"hidden\";\n      return () => {\n        document.body.style.overflow = original;\n      };\n    }\n  }, [open]);\n\n  const { mounted, className: animClass, ref: animRef } = useAnimation({\n    open,\n    enterClass: \"fancy-slide-up\",\n    exitClass: \"fancy-fade-out\",\n  });\n\n  const ctx = useMemo(() => ({ open, close }), [open, close]);\n\n  if (!mounted) return null;\n\n  return (\n    <ModalContext.Provider value={ctx}>\n      <Portal>\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n          {/* Backdrop */}\n          <div\n            className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n            onClick={close}\n            aria-hidden=\"true\"\n          />\n          {/* Panel */}\n          <div\n            ref={(node) => {\n              panelRef.current = node;\n              (animRef as React.MutableRefObject<HTMLElement | null>).current =\n                node;\n            }}\n            data-react-fancy-modal=\"\"\n            role=\"dialog\"\n            aria-modal=\"true\"\n            {...rest}\n            className={cn(\n              \"relative flex w-full flex-col overflow-hidden rounded-2xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] shadow-xl dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]\",\n              SIZE_MAP[size],\n              animClass,\n              className,\n            )}\n          >\n            {children}\n          </div>\n        </div>\n      </Portal>\n    </ModalContext.Provider>\n  );\n}\n\nexport const Modal = Object.assign(ModalRoot, {\n  Header: ModalHeader,\n  Body: ModalBody,\n  Footer: ModalFooter,\n});\n"]}

package/dist/{chunk-AASQ6L6X.cjs → chunk-FNIHCNVD.cjs}

@@ -21,7 +21,7 @@ var Skeleton = react.forwardRef(
         "aria-hidden": "true",
         "data-react-fancy-skeleton": "",
         className: chunkZU5Q77OT_cjs.cn(
-          "animate-pulse bg-zinc-200 dark:bg-zinc-700",
+          "animate-pulse bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]",
           shape === "rect" && "rounded-lg",
           shape === "circle" && "rounded-full aspect-square",
           shape === "text" && "rounded h-4 w-full",
@@ -35,5 +35,5 @@ var Skeleton = react.forwardRef(
 Skeleton.displayName = "Skeleton";
 
 exports.Skeleton = Skeleton;
-//# sourceMappingURL=chunk-AASQ6L6X.cjs.map
-//# sourceMappingURL=chunk-AASQ6L6X.cjs.map
+//# sourceMappingURL=chunk-FNIHCNVD.cjs.map
+//# sourceMappingURL=chunk-FNIHCNVD.cjs.map

package/dist/{chunk-AASQ6L6X.cjs.map → chunk-FNIHCNVD.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"names":["forwardRef","jsx","cn"],"mappings":";;;;;;AAIA,SAAS,aAAa,KAAA,EAAwD;AAC5E,EAAA,IAAI,KAAA,KAAU,QAAW,OAAO,MAAA;AAChC,EAAA,OAAO,OAAO,KAAA,KAAU,QAAA,GAAW,CAAA,EAAG,KAAK,CAAA,EAAA,CAAA,GAAO,KAAA;AACpD;AAEO,IAAM,QAAA,GAAWA,gBAAA;AAAA,EACtB,CAAC,EAAE,KAAA,GAAQ,MAAA,EAAQ,OAAO,MAAA,EAAQ,SAAA,IAAa,GAAA,KAAQ;AACrD,IAAA,MAAM,KAAA,GAA6B;AAAA,MACjC,KAAA,EAAO,aAAa,KAAK,CAAA;AAAA,MACzB,MAAA,EAAQ,aAAa,MAAM;AAAA,KAC7B;AAEA,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,aAAA,EAAY,MAAA;AAAA,QACZ,2BAAA,EAA0B,EAAA;AAAA,QAC1B,SAAA,EAAWC,oBAAA;AAAA,UACT,4CAAA;AAAA,UACA,UAAU,MAAA,IAAU,YAAA;AAAA,UACpB,UAAU,QAAA,IAAY,4BAAA;AAAA,UACtB,UAAU,MAAA,IAAU,oBAAA;AAAA,UACpB;AAAA,SACF;AAAA,QACA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-AASQ6L6X.cjs","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { SkeletonProps } from \"./Skeleton.types\";\n\nfunction toStyleValue(value: string | number | undefined): string | undefined {\n  if (value === undefined) return undefined;\n  return typeof value === \"number\" ? `${value}px` : value;\n}\n\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(\n  ({ shape = \"rect\", width, height, className }, ref) => {\n    const style: React.CSSProperties = {\n      width: toStyleValue(width),\n      height: toStyleValue(height),\n    };\n\n    return (\n      <div\n        ref={ref}\n        aria-hidden=\"true\"\n        data-react-fancy-skeleton=\"\"\n        className={cn(\n          \"animate-pulse bg-zinc-200 dark:bg-zinc-700\",\n          shape === \"rect\" && \"rounded-lg\",\n          shape === \"circle\" && \"rounded-full aspect-square\",\n          shape === \"text\" && \"rounded h-4 w-full\",\n          className,\n        )}\n        style={style}\n      />\n    );\n  },\n);\n\nSkeleton.displayName = \"Skeleton\";\n"]}
+{"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"names":["forwardRef","jsx","cn"],"mappings":";;;;;;AAIA,SAAS,aAAa,KAAA,EAAwD;AAC5E,EAAA,IAAI,KAAA,KAAU,QAAW,OAAO,MAAA;AAChC,EAAA,OAAO,OAAO,KAAA,KAAU,QAAA,GAAW,CAAA,EAAG,KAAK,CAAA,EAAA,CAAA,GAAO,KAAA;AACpD;AAEO,IAAM,QAAA,GAAWA,gBAAA;AAAA,EACtB,CAAC,EAAE,KAAA,GAAQ,MAAA,EAAQ,OAAO,MAAA,EAAQ,SAAA,IAAa,GAAA,KAAQ;AACrD,IAAA,MAAM,KAAA,GAA6B;AAAA,MACjC,KAAA,EAAO,aAAa,KAAK,CAAA;AAAA,MACzB,MAAA,EAAQ,aAAa,MAAM;AAAA,KAC7B;AAEA,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,aAAA,EAAY,MAAA;AAAA,QACZ,2BAAA,EAA0B,EAAA;AAAA,QAC1B,SAAA,EAAWC,oBAAA;AAAA,UACT,mIAAA;AAAA,UACA,UAAU,MAAA,IAAU,YAAA;AAAA,UACpB,UAAU,QAAA,IAAY,4BAAA;AAAA,UACtB,UAAU,MAAA,IAAU,oBAAA;AAAA,UACpB;AAAA,SACF;AAAA,QACA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-FNIHCNVD.cjs","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { SkeletonProps } from \"./Skeleton.types\";\n\nfunction toStyleValue(value: string | number | undefined): string | undefined {\n  if (value === undefined) return undefined;\n  return typeof value === \"number\" ? `${value}px` : value;\n}\n\nexport const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(\n  ({ shape = \"rect\", width, height, className }, ref) => {\n    const style: React.CSSProperties = {\n      width: toStyleValue(width),\n      height: toStyleValue(height),\n    };\n\n    return (\n      <div\n        ref={ref}\n        aria-hidden=\"true\"\n        data-react-fancy-skeleton=\"\"\n        className={cn(\n          \"animate-pulse bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n          shape === \"rect\" && \"rounded-lg\",\n          shape === \"circle\" && \"rounded-full aspect-square\",\n          shape === \"text\" && \"rounded h-4 w-full\",\n          className,\n        )}\n        style={style}\n      />\n    );\n  },\n);\n\nSkeleton.displayName = \"Skeleton\";\n"]}

package/dist/{chunk-PCTZNK2Z.js → chunk-FVDQNQKA.js}

@@ -1,4 +1,4 @@
-import { mergeExtensions, htmlToMarkdown, ContentRenderer, extensionEditorClasses, proseClasses, detectFormat } from './chunk-K6EJLBBQ.js';
+import { mergeExtensions, htmlToMarkdown, ContentRenderer, extensionEditorClasses, proseClasses, detectFormat } from './chunk-N5XMBHX7.js';
 import { CodeView } from './chunk-FBWUXSKH.js';
 import { sanitizeHtml } from './chunk-6TBRBN7H.js';
 import { useFieldMode } from './chunk-NRXK42LO.js';
@@ -33,7 +33,7 @@ function EditorSourceToggle({
       "data-react-fancy-editor-source-toggle": "",
       className: cn(
         "inline-flex h-8 items-center justify-center rounded-md px-2 font-mono text-xs transition-colors",
-        showSource ? "bg-zinc-200 dark:bg-zinc-700" : "hover:bg-zinc-100 dark:hover:bg-zinc-800",
+        showSource ? "bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]" : "hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]",
         className
       ),
       children: icon
@@ -60,7 +60,7 @@ function EditorToolbar({
     {
       "data-react-fancy-editor-toolbar": "",
       className: cn(
-        "flex shrink-0 items-center gap-0.5 border-b border-zinc-200 px-2 py-1.5 dark:border-zinc-700",
+        "flex shrink-0 items-center gap-0.5 border-b border-[color:var(--fancy-border,var(--color-zinc-200))] px-2 py-1.5 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]",
         className
       ),
       children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -79,7 +79,7 @@ function EditorToolbar({
             title: action.label,
             className: cn(
               "inline-flex h-8 w-8 items-center justify-center rounded-md text-sm transition-colors",
-              action.active ? "bg-zinc-200 dark:bg-zinc-700" : "hover:bg-zinc-100 dark:hover:bg-zinc-800",
+              action.active ? "bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]" : "hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]",
               showSource && "cursor-not-allowed opacity-40 hover:bg-transparent"
             ),
             children: action.icon
@@ -97,7 +97,7 @@ function EditorToolbarSeparator() {
     "span",
     {
       "data-react-fancy-editor-toolbar-separator": "",
-      className: "mx-1 h-5 w-px bg-zinc-200 dark:bg-zinc-700"
+      className: "mx-1 h-5 w-px bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]"
     }
   );
 }
@@ -300,7 +300,7 @@ function EditorRoot({
         "data-react-fancy-editor": "",
         "data-mode": "view",
         className: cn(
-          "overflow-hidden rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900",
+          "overflow-hidden rounded-xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]",
           className
         ),
         children: /* @__PURE__ */ jsx(
@@ -323,7 +323,7 @@ function EditorRoot({
       "data-react-fancy-editor": "",
       "data-mode": "edit",
       className: cn(
-        "flex flex-col overflow-hidden rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900",
+        "flex flex-col overflow-hidden rounded-xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]",
         className
       ),
       children
@@ -340,5 +340,5 @@ var Editor = Object.assign(EditorRoot, {
 });
 
 export { Editor, useEditor };
-//# sourceMappingURL=chunk-PCTZNK2Z.js.map
-//# sourceMappingURL=chunk-PCTZNK2Z.js.map
+//# sourceMappingURL=chunk-FVDQNQKA.js.map
+//# sourceMappingURL=chunk-FVDQNQKA.js.map

package/dist/chunk-FVDQNQKA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Editor/Editor.context.ts","../src/components/Editor/EditorSourceToggle.tsx","../src/components/Editor/EditorToolbar.tsx","../src/components/Editor/EditorToolbarSeparator.tsx","../src/components/Editor/EditorContent.tsx","../src/components/Editor/Editor.tsx"],"names":["jsx","useRef","useEffect","useMemo"],"mappings":"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","file":"chunk-FVDQNQKA.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { RefObject } from \"react\";\nimport type { RenderExtension } from \"../ContentRenderer/extensions\";\n\nexport interface EditorContextValue {\n  contentRef: RefObject<HTMLDivElement | null>;\n  exec: (command: string, arg?: string) => void;\n  insertText: (text: string) => void;\n  wrapSelection: (before: string, after: string) => void;\n  outputFormat: \"html\" | \"markdown\";\n  lineSpacing: number;\n  placeholder?: string;\n  /** Merged render extensions (global + instance). */\n  extensions: RenderExtension[];\n  /** Whether the raw-source view (textarea) is showing instead of the rich-text surface. */\n  showSource: boolean;\n  /** Toggle/set the raw-source view. */\n  setShowSource: (showSource: boolean) => void;\n  /** Initial HTML content to load into the editor on mount */\n  _initialHtml: string;\n  /** @internal Called by EditorContent on input events */\n  _onInput: () => void;\n  /** @internal Raw source value (`value` in `outputFormat`), for the source textarea. */\n  _sourceValue: string;\n  /** @internal Commit an edit made directly in the source textarea. */\n  _onSourceInput: (value: string) => void;\n}\n\nexport const EditorContext = createContext<EditorContextValue | null>(null);\n\nexport function useEditor(): EditorContextValue {\n  const ctx = useContext(EditorContext);\n  if (!ctx) {\n    throw new Error(\"useEditor must be used within an <Editor> component\");\n  }\n  return ctx;\n}\n","import { cn } from \"../../utils/cn\";\nimport { useEditor } from \"./Editor.context\";\nimport type { EditorSourceToggleProps } from \"./Editor.types\";\n\n/**\n * Toolbar button that reveals the raw HTML/Markdown behind the editor. Reads\n * `showSource` / `setShowSource` from context, so it works in the default\n * toolbar and in any custom toolbar composed with `useEditor()`.\n */\nexport function EditorSourceToggle({\n  className,\n  icon = \"</>\",\n  title = \"Source\",\n  activeTitle = \"Rich text\",\n}: EditorSourceToggleProps) {\n  const { showSource, setShowSource } = useEditor();\n\n  return (\n    <button\n      type=\"button\"\n      onClick={() => setShowSource(!showSource)}\n      title={showSource ? activeTitle : title}\n      aria-pressed={showSource}\n      data-react-fancy-editor-source-toggle=\"\"\n      className={cn(\n        \"inline-flex h-8 items-center justify-center rounded-md px-2 font-mono text-xs transition-colors\",\n        showSource\n          ? \"bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]\"\n          : \"hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]\",\n        className,\n      )}\n    >\n      {icon}\n    </button>\n  );\n}\n\nEditorSourceToggle.displayName = \"EditorSourceToggle\";\n","import { cn } from \"../../utils/cn\";\nimport { useEditor } from \"./Editor.context\";\nimport { EditorSourceToggle } from \"./EditorSourceToggle\";\nimport type { EditorToolbarProps } from \"./Editor.types\";\n\nconst DEFAULT_ACTIONS = [\n  { icon: \"B\", label: \"Bold\", command: \"bold\" },\n  { icon: \"I\", label: \"Italic\", command: \"italic\" },\n  { icon: \"U\", label: \"Underline\", command: \"underline\" },\n  { icon: \"S\", label: \"Strikethrough\", command: \"strikeThrough\" },\n];\n\nexport function EditorToolbar({\n  actions = DEFAULT_ACTIONS,\n  onAction,\n  children,\n  className,\n  showSourceToggle = true,\n}: EditorToolbarProps) {\n  const { exec, showSource } = useEditor();\n\n  return (\n    <div\n      data-react-fancy-editor-toolbar=\"\"\n      className={cn(\n        \"flex shrink-0 items-center gap-0.5 border-b border-[color:var(--fancy-border,var(--color-zinc-200))] px-2 py-1.5 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n        className,\n      )}\n    >\n      {children ?? (\n        <>\n          {actions.map((action) => (\n            <button\n              key={`${action.command}-${action.commandArg ?? \"\"}`}\n              type=\"button\"\n              // Rich-text commands don't apply to the raw-source textarea.\n              disabled={showSource}\n              onClick={() => {\n                if (onAction) {\n                  onAction(action.command);\n                } else {\n                  exec(action.command, action.commandArg);\n                }\n              }}\n              title={action.label}\n              className={cn(\n                \"inline-flex h-8 w-8 items-center justify-center rounded-md text-sm transition-colors\",\n                action.active\n                  ? \"bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]\"\n                  : \"hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]\",\n                showSource && \"cursor-not-allowed opacity-40 hover:bg-transparent\",\n              )}\n            >\n              {action.icon}\n            </button>\n          ))}\n          {showSourceToggle && <EditorSourceToggle className=\"ml-auto\" />}\n        </>\n      )}\n    </div>\n  );\n}\n\nEditorToolbar.displayName = \"EditorToolbar\";\n","export function EditorToolbarSeparator() {\n  return (\n    <span\n      data-react-fancy-editor-toolbar-separator=\"\"\n      className=\"mx-1 h-5 w-px bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]\"\n    />\n  );\n}\n\nEditorToolbarSeparator.displayName = \"EditorToolbarSeparator\";\n","import { useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { CodeView } from \"../CodeView\";\nimport { useEditor } from \"./Editor.context\";\nimport { proseClasses, extensionEditorClasses } from \"./editor.utils\";\nimport type { EditorContentProps } from \"./Editor.types\";\n\nexport function EditorContent({ className, maxHeight, sourceClassName }: EditorContentProps) {\n  const {\n    contentRef,\n    lineSpacing,\n    placeholder,\n    extensions,\n    outputFormat,\n    showSource,\n    _initialHtml,\n    _onInput,\n    _sourceValue,\n    _onSourceInput,\n  } = useEditor();\n  // Tracks which seed HTML is currently in the contentEditable. Seeding on the\n  // seed VALUE (not a one-shot boolean) re-seeds when the source view rewrites\n  // `value`, while still never re-seeding on plain keystrokes — typing leaves\n  // `_initialHtml` untouched, so `seededHtml.current === _initialHtml` holds.\n  const seededHtml = useRef<string | null>(null);\n\n  useEffect(() => {\n    // Source view replaces the contentEditable in the tree, so it unmounts.\n    // Forget what we seeded — the div that returns is a fresh, empty one and\n    // must always be re-seeded, even if `value` was left untouched.\n    if (showSource) {\n      seededHtml.current = null;\n      return;\n    }\n    const el = contentRef.current;\n    if (el && seededHtml.current !== _initialHtml) {\n      el.innerHTML = _initialHtml;\n      seededHtml.current = _initialHtml;\n    }\n  }, [contentRef, _initialHtml, showSource]);\n\n  const extClasses = useMemo(\n    () => extensionEditorClasses(extensions),\n    [extensions],\n  );\n\n  if (showSource) {\n    // Raw-source view — a syntax-highlighted code surface (HTML highlighted;\n    // markdown/plain un-highlighted), built on the shared fancy-file-commons\n    // primitives. It's a DIRECT child of the flex-column editor root (no\n    // wrapper — a nested flex box collapses the fill), so `flex-auto` makes it\n    // fill the editor body when height-constrained and grow with content\n    // (≥ minHeight) when not. `maxHeight` caps + scrolls.\n    return (\n      <CodeView\n        value={_sourceValue}\n        onChange={_onSourceInput}\n        language={outputFormat === \"html\" ? \"html\" : \"plaintext\"}\n        placeholder={placeholder}\n        maxHeight={maxHeight}\n        className={cn(\"min-h-0 flex-auto\", sourceClassName)}\n      />\n    );\n  }\n\n  return (\n    <div\n      ref={contentRef}\n      contentEditable\n      suppressContentEditableWarning\n      data-react-fancy-editor-content=\"\"\n      data-placeholder={placeholder}\n      onInput={_onInput}\n      style={{\n        lineHeight: lineSpacing,\n        maxHeight: maxHeight ? `${maxHeight}px` : undefined,\n      }}\n      className={cn(\n        \"min-h-[120px] flex-auto overflow-y-auto px-4 py-3 text-sm outline-none\",\n        \"focus:outline-none\",\n        proseClasses,\n        extClasses,\n        \"empty:before:content-[attr(data-placeholder)] empty:before:text-zinc-400 empty:before:pointer-events-none\",\n        className,\n      )}\n    />\n  );\n}\n\nEditorContent.displayName = \"EditorContent\";\n","import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { marked } from \"marked\";\nimport { cn } from \"../../utils/cn\";\nimport { sanitizeHtml } from \"../../utils/sanitize\";\nimport { useControllableState } from \"../../hooks\";\nimport { EditorContext } from \"./Editor.context\";\nimport { EditorToolbar } from \"./EditorToolbar\";\nimport { EditorToolbarSeparator } from \"./EditorToolbarSeparator\";\nimport { EditorSourceToggle } from \"./EditorSourceToggle\";\nimport { EditorContent } from \"./EditorContent\";\nimport { htmlToMarkdown, detectFormat } from \"./editor.utils\";\nimport { mergeExtensions } from \"../ContentRenderer/extensions\";\nimport { ContentRenderer } from \"../ContentRenderer/ContentRenderer\";\nimport { useFieldMode } from \"../inputs/mode/FieldMode.context\";\nimport type { EditorProps } from \"./Editor.types\";\n\nfunction toHtml(\n  value: string,\n  outputFormat: \"html\" | \"markdown\",\n  unsafe: boolean,\n  valueFormat: \"markdown\" | \"html\" | \"auto\" = \"auto\",\n): string {\n  if (!value) return \"\";\n  const raw = (() => {\n    // An explicit valueFormat is authoritative — the sniff misclassifies\n    // markdown that merely MENTIONS HTML-ish snippets (`<code>`, `<table`),\n    // collapsing it into an innerHTML wall of text (#10).\n    const format =\n      valueFormat !== \"auto\"\n        ? valueFormat\n        : outputFormat === \"html\"\n          ? \"html\"\n          : detectFormat(value);\n    if (format === \"html\") return value;\n    return (marked.parse(value, { async: false }) as string).trim();\n  })();\n  return unsafe ? raw : sanitizeHtml(raw);\n}\n\nfunction EditorRoot({\n  children,\n  className,\n  value: controlledValue,\n  defaultValue = \"\",\n  onChange,\n  outputFormat = \"html\",\n  valueFormat = \"auto\",\n  lineSpacing = 1.6,\n  placeholder,\n  mode: modeProp,\n  extensions: instanceExtensions,\n  unsafe = false,\n  showSource: showSourceProp,\n  defaultShowSource = false,\n  onShowSourceChange,\n}: EditorProps) {\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const [value, setValue] = useControllableState(controlledValue, defaultValue, onChange);\n  const [showSource, setShowSource] = useControllableState(\n    showSourceProp,\n    defaultShowSource,\n    onShowSourceChange,\n  );\n  // View/edit mode — same resolution as the inputs: prop → <Form> context → \"edit\".\n  const mode = useFieldMode(modeProp);\n  const isView = mode === \"view\";\n\n  // The value this editor last emitted through `onChange`. An incoming `value`\n  // equal to it is our own keystroke echoing back; anything else came from\n  // OUTSIDE — an async load, a host reset, a form repopulating.\n  const lastEmitted = useRef<string | null>(null);\n\n  // Bumped only on an external `value` change, so the seed memo below recomputes\n  // for those and stays put while the user types. Without this, `value` was\n  // excluded from the deps to avoid re-seeding on keystrokes, which also meant a\n  // value arriving after mount was silently dropped and the editor stayed blank\n  // forever (#15).\n  const [externalSeed, setExternalSeed] = useState(0);\n  useEffect(() => {\n    if (value !== lastEmitted.current) setExternalSeed((n) => n + 1);\n  }, [value]);\n\n  const initialHtml = useMemo(\n    () => toHtml(value, outputFormat, unsafe, valueFormat),\n    // Seed the contentEditable from the LIVE value when (re)entering edit mode —\n    // and when returning from the raw-source view, which may have rewritten the\n    // value out from under the rich-text surface. `value` itself stays out of\n    // the deps so typing never re-seeds (which would fight the caret);\n    // `externalSeed` covers the externally-driven case instead.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [isView, outputFormat, unsafe, valueFormat, showSource, externalSeed],\n  );\n\n  const extensions = useMemo(\n    () => mergeExtensions(instanceExtensions),\n    [instanceExtensions],\n  );\n\n  const getOutputValue = useCallback(\n    (html: string): string => {\n      return outputFormat === \"markdown\" ? htmlToMarkdown(html) : html;\n    },\n    [outputFormat],\n  );\n\n  const handleInput = useCallback(() => {\n    const el = contentRef.current;\n    if (!el) return;\n    const next = getOutputValue(el.innerHTML);\n    // Record what we emitted BEFORE publishing it, so the value coming back in\n    // is recognised as our own and does not trigger a re-seed mid-keystroke.\n    lastEmitted.current = next;\n    setValue(next);\n  }, [setValue, getOutputValue]);\n\n  const exec = useCallback(\n    (command: string, arg?: string) => {\n      const el = contentRef.current;\n      if (!el) return;\n      el.focus();\n      document.execCommand(command, false, arg);\n      handleInput();\n    },\n    [handleInput],\n  );\n\n  const insertText = useCallback(\n    (text: string) => {\n      const el = contentRef.current;\n      if (!el) return;\n      el.focus();\n      document.execCommand(\"insertText\", false, text);\n      handleInput();\n    },\n    [handleInput],\n  );\n\n  // The source textarea edits `value` directly — it is already the canonical\n  // source in `outputFormat` (html or markdown), so no conversion round-trip.\n  const handleSourceInput = useCallback(\n    (next: string) => {\n      // Also an internal emission — record it so typing in the source view is\n      // not mistaken for an external change on every keystroke.\n      lastEmitted.current = next;\n      setValue(next);\n    },\n    [setValue],\n  );\n\n  const wrapSelection = useCallback(\n    (before: string, after: string) => {\n      const sel = window.getSelection();\n      if (!sel || sel.rangeCount === 0) return;\n      const range = sel.getRangeAt(0);\n      const selectedText = range.toString();\n      const el = contentRef.current;\n      if (!el) return;\n      el.focus();\n      document.execCommand(\"insertText\", false, `${before}${selectedText}${after}`);\n      handleInput();\n    },\n    [handleInput],\n  );\n\n  const contextValue = {\n    contentRef,\n    exec,\n    insertText,\n    wrapSelection,\n    outputFormat,\n    lineSpacing,\n    placeholder,\n    extensions,\n    showSource,\n    setShowSource,\n    _initialHtml: initialHtml,\n    _onInput: handleInput,\n    _sourceValue: value,\n    _onSourceInput: handleSourceInput,\n  };\n\n  // View mode — render the value read-only through ContentRenderer, matching the\n  // editor's own format (markdown/html), instead of the editable toolbar+content\n  // tree. Driven by `mode` / a `<Form mode=\"view\">`, exactly like the inputs.\n  if (isView) {\n    return (\n      <div\n        data-react-fancy-editor=\"\"\n        data-mode=\"view\"\n        className={cn(\n          \"overflow-hidden rounded-xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]\",\n          className,\n        )}\n      >\n        <ContentRenderer\n          value={value}\n          format={valueFormat !== \"auto\" ? valueFormat : outputFormat}\n          lineSpacing={lineSpacing}\n          extensions={instanceExtensions}\n          unsafe={unsafe}\n          className=\"px-4 py-3\"\n        />\n      </div>\n    );\n  }\n\n  return (\n    <EditorContext.Provider value={contextValue}>\n      <div\n        data-react-fancy-editor=\"\"\n        data-mode=\"edit\"\n        className={cn(\n          \"flex flex-col overflow-hidden rounded-xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]\",\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </EditorContext.Provider>\n  );\n}\n\nconst ToolbarWithSeparator = Object.assign(EditorToolbar, {\n  Separator: EditorToolbarSeparator,\n});\n\nexport const Editor = Object.assign(EditorRoot, {\n  Toolbar: ToolbarWithSeparator,\n  Content: EditorContent,\n  SourceToggle: EditorSourceToggle,\n});\n"]}

package/dist/{chunk-O6GTY53I.cjs → chunk-FVQO75KY.cjs}

@@ -15,7 +15,7 @@ var StatList = react.forwardRef(
         "data-react-fancy-stat-list": "",
         "data-align": align,
         className: chunkZU5Q77OT_cjs.cn(
-          "flex flex-col gap-0.5 font-mono text-[11.5px] text-zinc-500 dark:text-zinc-400",
+          "flex flex-col gap-0.5 font-mono text-[11.5px] text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]",
           align === "right" ? "items-end text-right" : "items-start text-left",
           className
         ),
@@ -24,7 +24,7 @@ var StatList = react.forwardRef(
           {
             "data-stat": item.key ?? (typeof item.label === "string" ? item.label : void 0),
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("b", { className: "font-medium text-zinc-900 dark:text-zinc-100", children: item.value }),
+              /* @__PURE__ */ jsxRuntime.jsx("b", { className: "font-medium text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]", children: item.value }),
               " ",
               item.label
             ]
@@ -38,5 +38,5 @@ var StatList = react.forwardRef(
 StatList.displayName = "StatList";
 
 exports.StatList = StatList;
-//# sourceMappingURL=chunk-O6GTY53I.cjs.map
-//# sourceMappingURL=chunk-O6GTY53I.cjs.map
+//# sourceMappingURL=chunk-FVQO75KY.cjs.map
+//# sourceMappingURL=chunk-FVQO75KY.cjs.map

package/dist/{chunk-O6GTY53I.cjs.map → chunk-FVQO75KY.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/StatList/StatList.tsx"],"names":["forwardRef","jsx","cn","jsxs"],"mappings":";;;;;;AAoBO,IAAM,QAAA,GAAWA,gBAAA;AAAA,EACtB,CAAC,EAAE,KAAA,EAAO,KAAA,GAAQ,SAAS,SAAA,EAAW,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACxD,IAAA,IAAI,KAAA,CAAM,MAAA,KAAW,CAAA,EAAG,OAAO,IAAA;AAE/B,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACC,GAAG,KAAA;AAAA,QACJ,4BAAA,EAA2B,EAAA;AAAA,QAC3B,YAAA,EAAY,KAAA;AAAA,QACZ,SAAA,EAAWC,oBAAA;AAAA,UACT,gFAAA;AAAA,UACA,KAAA,KAAU,UAAU,sBAAA,GAAyB,uBAAA;AAAA,UAC7C;AAAA,SACF;AAAA,QAEC,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,EAAM,CAAA,qBAChBC,eAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YAEC,WAAA,EAAW,KAAK,GAAA,KAAQ,OAAO,KAAK,KAAA,KAAU,QAAA,GAAW,KAAK,KAAA,GAAQ,MAAA,CAAA;AAAA,YAEtE,QAAA,EAAA;AAAA,8BAAAF,cAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,8CAAA,EAAgD,QAAA,EAAA,IAAA,CAAK,KAAA,EAAM,CAAA;AAAA,cAAK,GAAA;AAAA,cAC5E,IAAA,CAAK;AAAA;AAAA,WAAA;AAAA,UAJD,KAAK,GAAA,KAAQ,OAAO,KAAK,KAAA,KAAU,QAAA,GAAW,KAAK,KAAA,GAAQ,CAAA;AAAA,SAMnE;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-O6GTY53I.cjs","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { StatListProps } from \"./StatList.types\";\n\n/**\n * The mono figure stack — `70 packages / 261 components / MIT licensed`.\n *\n * The Inspiration index and `/packages` each hand-rolled this from tokens, which\n * is the gallery working as intended: it stress-tests the kit, and what it\n * hand-rolls is the gap list. The list only pays off when the gap comes back\n * here, otherwise every surface keeps a copy and they drift apart.\n *\n * Takes `items` as DATA rather than children. What those surfaces repeat is a\n * shape, not a layout, so there is nothing to assemble at the call site — and a\n * data prop is what an agent can emit, which children are not.\n *\n * The value is a `<b>` rather than a colour, because in most of these stacks the\n * figure is the only part that is not muted, and expressing that structurally\n * keeps it meaningful when a design replaces the styling wholesale.\n */\nexport const StatList = forwardRef<HTMLDivElement, StatListProps>(\n  ({ items, align = \"right\", className, ...props }, ref) => {\n    if (items.length === 0) return null;\n\n    return (\n      <div\n        ref={ref}\n        {...props}\n        data-react-fancy-stat-list=\"\"\n        data-align={align}\n        className={cn(\n          \"flex flex-col gap-0.5 font-mono text-[11.5px] text-zinc-500 dark:text-zinc-400\",\n          align === \"right\" ? \"items-end text-right\" : \"items-start text-left\",\n          className,\n        )}\n      >\n        {items.map((item, i) => (\n          <span\n            key={item.key ?? (typeof item.label === \"string\" ? item.label : i)}\n            data-stat={item.key ?? (typeof item.label === \"string\" ? item.label : undefined)}\n          >\n            <b className=\"font-medium text-zinc-900 dark:text-zinc-100\">{item.value}</b>{\" \"}\n            {item.label}\n          </span>\n        ))}\n      </div>\n    );\n  },\n);\n\nStatList.displayName = \"StatList\";\n"]}
+{"version":3,"sources":["../src/components/StatList/StatList.tsx"],"names":["forwardRef","jsx","cn","jsxs"],"mappings":";;;;;;AAoBO,IAAM,QAAA,GAAWA,gBAAA;AAAA,EACtB,CAAC,EAAE,KAAA,EAAO,KAAA,GAAQ,SAAS,SAAA,EAAW,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACxD,IAAA,IAAI,KAAA,CAAM,MAAA,KAAW,CAAA,EAAG,OAAO,IAAA;AAE/B,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACC,GAAG,KAAA;AAAA,QACJ,4BAAA,EAA2B,EAAA;AAAA,QAC3B,YAAA,EAAY,KAAA;AAAA,QACZ,SAAA,EAAWC,oBAAA;AAAA,UACT,+KAAA;AAAA,UACA,KAAA,KAAU,UAAU,sBAAA,GAAyB,uBAAA;AAAA,UAC7C;AAAA,SACF;AAAA,QAEC,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,EAAM,CAAA,qBAChBC,eAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YAEC,WAAA,EAAW,KAAK,GAAA,KAAQ,OAAO,KAAK,KAAA,KAAU,QAAA,GAAW,KAAK,KAAA,GAAQ,MAAA,CAAA;AAAA,YAEtE,QAAA,EAAA;AAAA,8BAAAF,cAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,iIAAA,EAAmI,QAAA,EAAA,IAAA,CAAK,KAAA,EAAM,CAAA;AAAA,cAAK,GAAA;AAAA,cAC/J,IAAA,CAAK;AAAA;AAAA,WAAA;AAAA,UAJD,KAAK,GAAA,KAAQ,OAAO,KAAK,KAAA,KAAU,QAAA,GAAW,KAAK,KAAA,GAAQ,CAAA;AAAA,SAMnE;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-FVQO75KY.cjs","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { StatListProps } from \"./StatList.types\";\n\n/**\n * The mono figure stack — `70 packages / 261 components / MIT licensed`.\n *\n * The Inspiration index and `/packages` each hand-rolled this from tokens, which\n * is the gallery working as intended: it stress-tests the kit, and what it\n * hand-rolls is the gap list. The list only pays off when the gap comes back\n * here, otherwise every surface keeps a copy and they drift apart.\n *\n * Takes `items` as DATA rather than children. What those surfaces repeat is a\n * shape, not a layout, so there is nothing to assemble at the call site — and a\n * data prop is what an agent can emit, which children are not.\n *\n * The value is a `<b>` rather than a colour, because in most of these stacks the\n * figure is the only part that is not muted, and expressing that structurally\n * keeps it meaningful when a design replaces the styling wholesale.\n */\nexport const StatList = forwardRef<HTMLDivElement, StatListProps>(\n  ({ items, align = \"right\", className, ...props }, ref) => {\n    if (items.length === 0) return null;\n\n    return (\n      <div\n        ref={ref}\n        {...props}\n        data-react-fancy-stat-list=\"\"\n        data-align={align}\n        className={cn(\n          \"flex flex-col gap-0.5 font-mono text-[11.5px] text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\",\n          align === \"right\" ? \"items-end text-right\" : \"items-start text-left\",\n          className,\n        )}\n      >\n        {items.map((item, i) => (\n          <span\n            key={item.key ?? (typeof item.label === \"string\" ? item.label : i)}\n            data-stat={item.key ?? (typeof item.label === \"string\" ? item.label : undefined)}\n          >\n            <b className=\"font-medium text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]\">{item.value}</b>{\" \"}\n            {item.label}\n          </span>\n        ))}\n      </div>\n    );\n  },\n);\n\nStatList.displayName = \"StatList\";\n"]}

package/dist/{chunk-FCSR2WVS.js → chunk-FWAVMWMP.js}

@@ -62,7 +62,7 @@ var BrandRoot = forwardRef(
               "span",
               {
                 className: cn(
-                  "truncate font-bold text-zinc-900 dark:text-zinc-100",
+                  "truncate font-bold text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]",
                   nameClasses[size]
                 ),
                 children: name
@@ -72,7 +72,7 @@ var BrandRoot = forwardRef(
               "span",
               {
                 className: cn(
-                  "truncate text-zinc-500 dark:text-zinc-400",
+                  "truncate text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]",
                   taglineClasses[size]
                 ),
                 children: tagline
@@ -88,5 +88,5 @@ BrandRoot.displayName = "Brand";
 var Brand = Object.assign(BrandRoot, { Mark: BrandMark });
 
 export { Brand, BrandMark };
-//# sourceMappingURL=chunk-FCSR2WVS.js.map
-//# sourceMappingURL=chunk-FCSR2WVS.js.map
+//# sourceMappingURL=chunk-FWAVMWMP.js.map
+//# sourceMappingURL=chunk-FWAVMWMP.js.map

package/dist/{chunk-FCSR2WVS.js.map → chunk-FWAVMWMP.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Brand/BrandMark.tsx","../src/components/Brand/Brand.tsx"],"names":["forwardRef","jsx"],"mappings":"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","file":"chunk-FCSR2WVS.js","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { BrandMarkProps } from \"./Brand.types\";\n\nconst sizeClasses: Record<Exclude<NonNullable<BrandMarkProps[\"size\"]>, number>, string> = {\n  sm: \"h-6 w-6 rounded-md text-[11px]\",\n  md: \"h-8 w-8 rounded-lg text-sm\",\n  lg: \"h-11 w-11 rounded-xl text-lg\",\n};\n\n/**\n * The square logo tile — a glyph centred in a rounded, coloured square.\n *\n * `Brand` has always taken its mark as a caller-supplied `logo` node, which is\n * exactly why every page that wanted one rebuilt the same square: fixed size,\n * rounded, grid-centred, bold, white, and `shrink-0` so a flex row never\n * squashes it. Four surfaces carried that block inline.\n *\n * ## It ships no brand colour, deliberately\n *\n * The default is a neutral zinc tile. A component library inventing your brand\n * gradient would be wrong, and would be the first thing every consumer had to\n * override — so the FILL is `className`'s job and only the geometry lives here.\n * That is also what the duplicated code actually had in common: each copy\n * already pulled its gradient from a token class and hand-rolled the box.\n */\nexport const BrandMark = forwardRef<HTMLSpanElement, BrandMarkProps>(\n  ({ glyph, size = \"md\", className, style, ...props }, ref) => {\n    const numeric = typeof size === \"number\";\n\n    return (\n      <span\n        ref={ref}\n        data-react-fancy-brand-mark=\"\"\n        aria-hidden={props[\"aria-label\"] ? undefined : true}\n        className={cn(\n          \"grid shrink-0 place-items-center font-bold leading-none text-white select-none\",\n          numeric ? \"rounded-lg\" : sizeClasses[size],\n          // Overridable default: a mark with no `className` still reads as a\n          // mark rather than as an invisible box.\n          \"bg-zinc-900 dark:bg-zinc-100 dark:text-zinc-900\",\n          className,\n        )}\n        style={numeric ? { height: size, width: size, fontSize: Math.round(size * 0.5), ...style } : style}\n        {...props}\n      >\n        {glyph}\n      </span>\n    );\n  },\n);\n\nBrandMark.displayName = \"BrandMark\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { BrandMark } from \"./BrandMark\";\nimport type { BrandProps } from \"./Brand.types\";\n\nconst gapClasses: Record<NonNullable<BrandProps[\"size\"]>, string> = {\n  sm: \"gap-2\",\n  md: \"gap-3\",\n  lg: \"gap-4\",\n};\n\nconst nameClasses: Record<NonNullable<BrandProps[\"size\"]>, string> = {\n  sm: \"text-sm\",\n  md: \"text-base\",\n  lg: \"text-xl\",\n};\n\nconst taglineClasses: Record<NonNullable<BrandProps[\"size\"]>, string> = {\n  sm: \"text-xs\",\n  md: \"text-sm\",\n  lg: \"text-base\",\n};\n\nconst BrandRoot = forwardRef<HTMLDivElement, BrandProps>(\n  ({ logo, name, tagline, size = \"md\", className }, ref) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-brand=\"\"\n        className={cn(\"flex items-center\", gapClasses[size], className)}\n      >\n        {logo && <div className=\"shrink-0\">{logo}</div>}\n        {(name || tagline) && (\n          <div className=\"flex min-w-0 flex-col\">\n            {name && (\n              <span\n                className={cn(\n                  \"truncate font-bold text-zinc-900 dark:text-zinc-100\",\n                  nameClasses[size],\n                )}\n              >\n                {name}\n              </span>\n            )}\n            {tagline && (\n              <span\n                className={cn(\n                  \"truncate text-zinc-500 dark:text-zinc-400\",\n                  taglineClasses[size],\n                )}\n              >\n                {tagline}\n              </span>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n\nBrandRoot.displayName = \"Brand\";\n\nexport const Brand = Object.assign(BrandRoot, { Mark: BrandMark });\n"]}
+{"version":3,"sources":["../src/components/Brand/BrandMark.tsx","../src/components/Brand/Brand.tsx"],"names":["forwardRef","jsx"],"mappings":"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","file":"chunk-FWAVMWMP.js","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { BrandMarkProps } from \"./Brand.types\";\n\nconst sizeClasses: Record<Exclude<NonNullable<BrandMarkProps[\"size\"]>, number>, string> = {\n  sm: \"h-6 w-6 rounded-md text-[11px]\",\n  md: \"h-8 w-8 rounded-lg text-sm\",\n  lg: \"h-11 w-11 rounded-xl text-lg\",\n};\n\n/**\n * The square logo tile — a glyph centred in a rounded, coloured square.\n *\n * `Brand` has always taken its mark as a caller-supplied `logo` node, which is\n * exactly why every page that wanted one rebuilt the same square: fixed size,\n * rounded, grid-centred, bold, white, and `shrink-0` so a flex row never\n * squashes it. Four surfaces carried that block inline.\n *\n * ## It ships no brand colour, deliberately\n *\n * The default is a neutral zinc tile. A component library inventing your brand\n * gradient would be wrong, and would be the first thing every consumer had to\n * override — so the FILL is `className`'s job and only the geometry lives here.\n * That is also what the duplicated code actually had in common: each copy\n * already pulled its gradient from a token class and hand-rolled the box.\n */\nexport const BrandMark = forwardRef<HTMLSpanElement, BrandMarkProps>(\n  ({ glyph, size = \"md\", className, style, ...props }, ref) => {\n    const numeric = typeof size === \"number\";\n\n    return (\n      <span\n        ref={ref}\n        data-react-fancy-brand-mark=\"\"\n        aria-hidden={props[\"aria-label\"] ? undefined : true}\n        className={cn(\n          \"grid shrink-0 place-items-center font-bold leading-none text-white select-none\",\n          numeric ? \"rounded-lg\" : sizeClasses[size],\n          // Overridable default: a mark with no `className` still reads as a\n          // mark rather than as an invisible box.\n          \"bg-zinc-900 dark:bg-zinc-100 dark:text-zinc-900\",\n          className,\n        )}\n        style={numeric ? { height: size, width: size, fontSize: Math.round(size * 0.5), ...style } : style}\n        {...props}\n      >\n        {glyph}\n      </span>\n    );\n  },\n);\n\nBrandMark.displayName = \"BrandMark\";\n","import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { BrandMark } from \"./BrandMark\";\nimport type { BrandProps } from \"./Brand.types\";\n\nconst gapClasses: Record<NonNullable<BrandProps[\"size\"]>, string> = {\n  sm: \"gap-2\",\n  md: \"gap-3\",\n  lg: \"gap-4\",\n};\n\nconst nameClasses: Record<NonNullable<BrandProps[\"size\"]>, string> = {\n  sm: \"text-sm\",\n  md: \"text-base\",\n  lg: \"text-xl\",\n};\n\nconst taglineClasses: Record<NonNullable<BrandProps[\"size\"]>, string> = {\n  sm: \"text-xs\",\n  md: \"text-sm\",\n  lg: \"text-base\",\n};\n\nconst BrandRoot = forwardRef<HTMLDivElement, BrandProps>(\n  ({ logo, name, tagline, size = \"md\", className }, ref) => {\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-brand=\"\"\n        className={cn(\"flex items-center\", gapClasses[size], className)}\n      >\n        {logo && <div className=\"shrink-0\">{logo}</div>}\n        {(name || tagline) && (\n          <div className=\"flex min-w-0 flex-col\">\n            {name && (\n              <span\n                className={cn(\n                  \"truncate font-bold text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]\",\n                  nameClasses[size],\n                )}\n              >\n                {name}\n              </span>\n            )}\n            {tagline && (\n              <span\n                className={cn(\n                  \"truncate text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\",\n                  taglineClasses[size],\n                )}\n              >\n                {tagline}\n              </span>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n\nBrandRoot.displayName = \"Brand\";\n\nexport const Brand = Object.assign(BrandRoot, { Mark: BrandMark });\n"]}