@firecms/ui 3.0.0-canary.254 → 3.0.0-canary.256

package/dist/index.umd.js

@@ -742,18 +742,22 @@
       } else {
         onValueChange?.(!value);
       }
-    }, className: cls(size === "small" ? "w-[38px] h-[22px] min-w-[38px] min-h-[22px]" : "w-[42px] h-[26px] min-w-[42px] min-h-[26px]", "outline-none rounded-full relative shadow-sm", value ? disabled ? "bg-white bg-opacity-54 dark:bg-surface-accent-950 border-surface-accent-100 dark:border-surface-accent-700 ring-1 ring-surface-accent-200 dark:ring-surface-accent-700" : "ring-secondary ring-1 bg-secondary dark:bg-secondary" : "bg-white bg-opacity-54 dark:bg-surface-accent-900 ring-1 ring-surface-accent-200 dark:ring-surface-accent-700", className), ...props, children: [
+    }, className: cls(size === "smallest" ? "w-[34px] h-[18px] min-w-[34px] min-h-[18px]" : size === "small" ? "w-[38px] h-[22px] min-w-[38px] min-h-[22px]" : "w-[42px] h-[26px] min-w-[42px] min-h-[26px]", "outline-none rounded-full relative shadow-sm", value ? disabled ? "bg-white bg-opacity-54 dark:bg-surface-accent-950 border-surface-accent-100 dark:border-surface-accent-700 ring-1 ring-surface-accent-200 dark:ring-surface-accent-700" : "ring-secondary ring-1 bg-secondary dark:bg-secondary" : "bg-white bg-opacity-54 dark:bg-surface-accent-900 ring-1 ring-surface-accent-200 dark:ring-surface-accent-700", className), ...props, children: [
       allowIndeterminate && (value === null || value === void 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cls("block rounded-full transition-transform duration-100 transform will-change-auto", disabled ? "bg-surface-accent-400 dark:bg-surface-accent-600" : "bg-surface-accent-400 dark:bg-surface-accent-600", {
         "w-[21px] h-[10px]": size === "medium" || size === "large",
         "w-[19px] h-[8px]": size === "small",
+        "w-[16px] h-[6px]": size === "smallest",
         "translate-x-[10px]": size === "medium" || size === "large",
-        "translate-x-[9px]": size === "small"
+        "translate-x-[9px]": size === "small",
+        "translate-x-[8px]": size === "smallest"
       }) }, "knob"),
       !(allowIndeterminate && (value === null || value === void 0)) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cls("block rounded-full transition-transform duration-100 transform will-change-auto", disabled ? "bg-surface-accent-300 dark:bg-surface-accent-700" : value ? "bg-white" : "bg-surface-accent-600 dark:bg-surface-accent-400", {
         "w-[21px] h-[21px]": size === "medium" || size === "large",
         "w-[19px] h-[19px]": size === "small",
+        "w-[16px] h-[16px]": size === "smallest",
         [value ? "translate-x-[19px]" : "translate-x-[3px]"]: size === "medium" || size === "large",
-        [value ? "translate-x-[17px]" : "translate-x-[2px]"]: size === "small"
+        [value ? "translate-x-[17px]" : "translate-x-[2px]"]: size === "small",
+        [value ? "translate-x-[16px]" : "translate-x-[1px]"]: size === "smallest"
       }) }, "knob")
     ] });
   });
@@ -785,7 +789,7 @@
       "min-h-[32px]": size === "small",
       "min-h-[42px]": size === "medium",
       "min-h-[64px]": size === "large"
-    }, size === "small" ? "pl-2" : "pl-4", size === "small" ? "pr-4" : "pr-6", position === "end" ? "flex-row-reverse" : "flex-row", fullWidth ? "w-full" : "", className), onClick: disabled ? void 0 : (e) => {
+    }, size === "small" || size === "smallest" ? "pl-2" : "pl-4", size === "small" || size === "smallest" ? "pr-4" : "pr-6", position === "end" ? "flex-row-reverse" : "flex-row", fullWidth ? "w-full" : "", className), onClick: disabled ? void 0 : (e) => {
       if (props.allowIndeterminate) {
         if (value === null || value === void 0) onValueChange?.(true);
         else if (value) onValueChange?.(false);
@@ -795,7 +799,7 @@
       }
     }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(BooleanSwitch, { value, ref: refInput, size, className: cls(invisible && focus ? focusedClasses : "", inputClassName), disabled, ...props }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cls("flex-grow", position === "end" ? "mr-4" : "ml-4", size === "small" ? "text-sm" : "text-base"), children: label })
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cls("flex-grow", position === "end" ? "mr-4" : "ml-4", size === "small" || size === "smallest" ? "text-sm" : "text-base"), children: label })
     ] });
   };
   const ButtonInner = React.forwardRef((t0, ref) => {
@@ -28007,7 +28011,7 @@
     full: "max-w-full min-w-full w-full"
   };
   const Dialog = (t0) => {
-    const $ = reactCompilerRuntime.c(39);
+    const $ = reactCompilerRuntime.c(42);
     const {
       open,
       onOpenChange,
@@ -28023,17 +28027,19 @@
       onOpenAutoFocus,
       onEscapeKeyDown,
       onPointerDownOutside,
-      onInteractOutside
+      onInteractOutside,
+      disableInitialFocus: t5
     } = t0;
     const fullWidth = t1 === void 0 ? true : t1;
     const scrollable = t2 === void 0 ? true : t2;
     const maxWidth = t3 === void 0 ? "lg" : t3;
     const modal = t4 === void 0 ? true : t4;
+    const disableInitialFocus = t5 === void 0 ? true : t5;
     const [displayed, setDisplayed] = React.useState(false);
-    let t5;
     let t6;
+    let t7;
     if ($[0] !== open) {
-      t5 = () => {
+      t6 = () => {
         if (!open) {
           const timeout = setTimeout(() => {
             setDisplayed(false);
@@ -28044,126 +28050,140 @@
           return _temp$2;
         }
       };
-      t6 = [open];
+      t7 = [open];
       $[0] = open;
-      $[1] = t5;
-      $[2] = t6;
+      $[1] = t6;
+      $[2] = t7;
     } else {
-      t5 = $[1];
-      t6 = $[2];
+      t6 = $[1];
+      t7 = $[2];
     }
-    React.useEffect(t5, t6);
-    const t7 = displayed || open;
-    let t8;
+    React.useEffect(t6, t7);
+    const t8 = displayed || open;
+    let t9;
     if ($[3] !== containerClassName) {
-      t8 = cls("fixed inset-0 z-30", containerClassName);
+      t9 = cls("fixed inset-0 z-30", containerClassName);
       $[3] = containerClassName;
-      $[4] = t8;
+      $[4] = t9;
     } else {
-      t8 = $[4];
+      t9 = $[4];
     }
-    const t9 = displayed && open ? "opacity-100" : "opacity-0";
-    let t10;
-    if ($[5] !== t9) {
-      t10 = cls("fixed inset-0 transition-opacity z-20 ease-in-out duration-200 bg-black bg-opacity-50 dark:bg-opacity-60 backdrop-blur-sm ", t9, "z-20 fixed top-0 left-0 w-full h-full flex justify-center items-center");
-      $[5] = t9;
-      $[6] = t10;
+    const t10 = displayed && open ? "opacity-100" : "opacity-0";
+    let t11;
+    if ($[5] !== t10) {
+      t11 = cls("fixed inset-0 transition-opacity z-20 ease-in-out duration-200 bg-black bg-opacity-50 dark:bg-opacity-60 backdrop-blur-sm ", t10, "z-20 fixed top-0 left-0 w-full h-full flex justify-center items-center");
+      $[5] = t10;
+      $[6] = t11;
     } else {
-      t10 = $[6];
+      t11 = $[6];
     }
-    const t11 = displayed ? "auto" : "none";
-    let t12;
-    if ($[7] !== t11) {
-      t12 = {
-        pointerEvents: t11
+    const t12 = displayed ? "auto" : "none";
+    let t13;
+    if ($[7] !== t12) {
+      t13 = {
+        pointerEvents: t12
       };
-      $[7] = t11;
-      $[8] = t12;
+      $[7] = t12;
+      $[8] = t13;
     } else {
-      t12 = $[8];
+      t13 = $[8];
     }
-    let t13;
-    if ($[9] !== t10 || $[10] !== t12) {
-      t13 = /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Overlay, { className: t10, style: t12 });
-      $[9] = t10;
-      $[10] = t12;
-      $[11] = t13;
+    let t14;
+    if ($[9] !== t11 || $[10] !== t13) {
+      t14 = /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Overlay, { className: t11, style: t13 });
+      $[9] = t11;
+      $[10] = t13;
+      $[11] = t14;
     } else {
-      t13 = $[11];
+      t14 = $[11];
     }
-    let t14;
-    if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
-      t14 = cls("h-full outline-none flex justify-center items-center z-40 opacity-100 transition-all duration-200 ease-in-out");
-      $[12] = t14;
-    } else {
-      t14 = $[12];
-    }
-    const t15 = fullWidth && !fullScreen ? "w-11/12" : void 0;
-    const t16 = fullHeight && !fullScreen ? "h-full" : void 0;
-    const t17 = fullScreen ? "h-screen w-screen" : "max-h-[90vh] shadow-xl";
-    const t18 = scrollable && "overflow-y-auto";
-    const t19 = displayed && open ? "opacity-100" : "opacity-0";
-    const t20 = maxWidth && !fullScreen ? widthClasses[maxWidth] : void 0;
-    let t21;
-    if ($[13] !== className || $[14] !== t15 || $[15] !== t16 || $[16] !== t17 || $[17] !== t18 || $[18] !== t19 || $[19] !== t20) {
-      t21 = cls(paperMixin, "z-30", "relative", "outline-none focus:outline-none", t15, t16, "text-surface-accent-900 dark:text-white", "justify-center items-center", t17, "ease-in-out duration-200", t18, t19, t20, className);
-      $[13] = className;
+    let t15;
+    if ($[12] !== disableInitialFocus || $[13] !== onOpenAutoFocus) {
+      t15 = (e) => {
+        if (disableInitialFocus) {
+          e.preventDefault();
+        }
+        onOpenAutoFocus?.(e);
+      };
+      $[12] = disableInitialFocus;
+      $[13] = onOpenAutoFocus;
       $[14] = t15;
-      $[15] = t16;
-      $[16] = t17;
-      $[17] = t18;
-      $[18] = t19;
-      $[19] = t20;
-      $[20] = t21;
     } else {
-      t21 = $[20];
+      t15 = $[14];
     }
-    let t22;
-    if ($[21] !== children || $[22] !== t21) {
-      t22 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: t21, children });
-      $[21] = children;
-      $[22] = t21;
-      $[23] = t22;
+    let t16;
+    if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+      t16 = cls("h-full outline-none flex justify-center items-center z-40 opacity-100 transition-all duration-200 ease-in-out");
+      $[15] = t16;
     } else {
-      t22 = $[23];
+      t16 = $[15];
     }
+    const t17 = fullWidth && !fullScreen ? "w-11/12" : void 0;
+    const t18 = fullHeight && !fullScreen ? "h-full" : void 0;
+    const t19 = fullScreen ? "h-screen w-screen" : "max-h-[90vh] shadow-xl";
+    const t20 = scrollable && "overflow-y-auto";
+    const t21 = displayed && open ? "opacity-100" : "opacity-0";
+    const t22 = maxWidth && !fullScreen ? widthClasses[maxWidth] : void 0;
     let t23;
-    if ($[24] !== onEscapeKeyDown || $[25] !== onInteractOutside || $[26] !== onOpenAutoFocus || $[27] !== onPointerDownOutside || $[28] !== t22) {
-      t23 = /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Content, { onEscapeKeyDown, onOpenAutoFocus, onPointerDownOutside, onInteractOutside, className: t14, children: t22 });
-      $[24] = onEscapeKeyDown;
-      $[25] = onInteractOutside;
-      $[26] = onOpenAutoFocus;
-      $[27] = onPointerDownOutside;
-      $[28] = t22;
-      $[29] = t23;
-    } else {
-      t23 = $[29];
+    if ($[16] !== className || $[17] !== t17 || $[18] !== t18 || $[19] !== t19 || $[20] !== t20 || $[21] !== t21 || $[22] !== t22) {
+      t23 = cls(paperMixin, "z-30", "relative", "outline-none focus:outline-none", t17, t18, "text-surface-accent-900 dark:text-white", "justify-center items-center", t19, "ease-in-out duration-200", t20, t21, t22, className);
+      $[16] = className;
+      $[17] = t17;
+      $[18] = t18;
+      $[19] = t19;
+      $[20] = t20;
+      $[21] = t21;
+      $[22] = t22;
+      $[23] = t23;
+    } else {
+      t23 = $[23];
     }
     let t24;
-    if ($[30] !== t13 || $[31] !== t23 || $[32] !== t8) {
-      t24 = /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: t8, children: [
-        t13,
-        t23
-      ] }) });
-      $[30] = t13;
-      $[31] = t23;
-      $[32] = t8;
-      $[33] = t24;
+    if ($[24] !== children || $[25] !== t23) {
+      t24 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: t23, children });
+      $[24] = children;
+      $[25] = t23;
+      $[26] = t24;
     } else {
-      t24 = $[33];
+      t24 = $[26];
     }
     let t25;
-    if ($[34] !== modal || $[35] !== onOpenChange || $[36] !== t24 || $[37] !== t7) {
-      t25 = /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Root, { open: t7, modal, onOpenChange, children: t24 });
-      $[34] = modal;
-      $[35] = onOpenChange;
-      $[36] = t24;
-      $[37] = t7;
-      $[38] = t25;
+    if ($[27] !== onEscapeKeyDown || $[28] !== onInteractOutside || $[29] !== onPointerDownOutside || $[30] !== t15 || $[31] !== t24) {
+      t25 = /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Content, { onEscapeKeyDown, onOpenAutoFocus: t15, onPointerDownOutside, onInteractOutside, className: t16, children: t24 });
+      $[27] = onEscapeKeyDown;
+      $[28] = onInteractOutside;
+      $[29] = onPointerDownOutside;
+      $[30] = t15;
+      $[31] = t24;
+      $[32] = t25;
+    } else {
+      t25 = $[32];
+    }
+    let t26;
+    if ($[33] !== t14 || $[34] !== t25 || $[35] !== t9) {
+      t26 = /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: t9, children: [
+        t14,
+        t25
+      ] }) });
+      $[33] = t14;
+      $[34] = t25;
+      $[35] = t9;
+      $[36] = t26;
+    } else {
+      t26 = $[36];
+    }
+    let t27;
+    if ($[37] !== modal || $[38] !== onOpenChange || $[39] !== t26 || $[40] !== t8) {
+      t27 = /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Root, { open: t8, modal, onOpenChange, children: t26 });
+      $[37] = modal;
+      $[38] = onOpenChange;
+      $[39] = t26;
+      $[40] = t8;
+      $[41] = t27;
     } else {
-      t25 = $[38];
+      t27 = $[41];
     }
-    return t25;
+    return t27;
   };
   function _temp$2() {
   }