@lax-wp/design-system 0.8.18 → 0.8.20

package/dist/index.es.js

@@ -12067,8 +12067,12 @@ const FM = ({
   disabled: i = !1,
   errorMessage: s
 }) => {
-  const [o, a] = R(!1), c = ce(!1), d = (u) => {
-    u.stopPropagation(), e?.("");
+  const [o, a] = R(!1), c = ce(!1), d = ce(null), u = ce(!1);
+  ee(() => {
+    u.current && !o && d.current?.focus(), u.current = o;
+  }, [o]);
+  const h = (f) => {
+    f.stopPropagation(), e?.("");
   };
   return /* @__PURE__ */ l(
     aa,
@@ -12076,10 +12080,10 @@ const FM = ({
       arrow: !1,
       placement: "bottom",
       trigger: "click",
-      getPopupContainer: (u) => u?.parentElement || document.body,
+      getPopupContainer: (f) => f?.parentElement || document.body,
       open: o,
-      onOpenChange: (u) => {
-        u ? (c.current && a(!0), c.current = !1) : a(!1);
+      onOpenChange: (f) => {
+        f ? (c.current && a(!0), c.current = !1) : a(!1);
       },
       content: /* @__PURE__ */ l(j7, { onChange: e, selectedIcon: A, setOpen: a }),
       children: /* @__PURE__ */ k("div", { className: "flex flex-col gap-1", children: [
@@ -12087,19 +12091,20 @@ const FM = ({
         /* @__PURE__ */ k(
           "button",
           {
+            ref: d,
             type: "button",
             id: `btn-icon-picker-icon-${A ? "selected" : "unselected"}`,
             className: `min-w-[83px] py-1.5 px-3 rounded-md border ${i ? "cursor-not-allowed opacity-60 bg-neutral-50 dark:bg-black-800" : "bg-white dark:bg-black-800"} ${s ? "border-red-500" : "focus:border-primary-200 "} flex items-center justify-between gap-2`,
             disabled: i,
-            onClick: (u) => {
+            onClick: (f) => {
               if (i) {
-                u.preventDefault(), u.stopPropagation();
+                f.preventDefault(), f.stopPropagation();
                 return;
               }
-              u.detail > 0 && (c.current = !0);
+              f.detail > 0 && (c.current = !0);
             },
-            onKeyDown: (u) => {
-              u.key === "Enter" && (u.preventDefault(), o || u.currentTarget.closest("form")?.querySelector('button[type="submit"]')?.click());
+            onKeyDown: (f) => {
+              f.key === "Enter" && (f.preventDefault(), o || f.currentTarget.closest("form")?.querySelector('button[type="submit"]')?.click());
             },
             children: [
               A ? /* @__PURE__ */ l(V0, { iconName: A, sx: { width: 20, height: 20 }, className: "text-neutral-900 dark:text-white" }) : /* @__PURE__ */ l(
@@ -12116,7 +12121,7 @@ const FM = ({
                 {
                   sx: { width: 20, height: 20 },
                   className: "hover:bg-neutral-100 dark:hover:bg-black-800 rounded-full transition-colors cursor-pointer text-neutral-400 dark:text-neutral-500",
-                  onClick: d
+                  onClick: h
                 }
               ) : null
             ]
@@ -12688,30 +12693,30 @@ const KM = ({
       const Z = typeof t == "string" && Y7(t);
       if (p && typeof t == "object")
         return t;
-      if (t || n === "boolean" && t === 0 || n === "currency" && Number(t) >= 0) {
+      if (t || n?.toLowerCase() === "boolean" && t === 0 || n?.toLowerCase() === "currency" && Number(t) >= 0) {
         if ((t === !0 || t === "True") && !m)
           return "Yes";
         if ((t === !1 || t === "False") && !m)
           return "No";
-        if (n === "url")
+        if (n?.toLowerCase() === "url")
           return /* @__PURE__ */ l("a", { href: t, className: "text-primary-600 truncate", children: t });
-        if (n === "boolean")
+        if (n?.toLowerCase() === "boolean")
           return sh(t);
-        if (n === "currency")
+        if (n?.toLowerCase() === "currency")
           return Ga(t, o?.currency_code) || "-";
-        if (n === "datetime") {
+        if (n?.toLowerCase() === "datetime") {
           const re = typeof t == "string" && t.includes("Z") ? t.replace(/\.000Z$/, "Z") : t;
           return ks(re, {
             skipTimezone: !1,
             withTime: !0
           });
-        } else if (n === "date" || Z) {
+        } else if (n?.toLowerCase() === "date" || Z) {
           const re = typeof t == "string" && t.includes("Z") ? t.replace(/\.000Z$/, "Z") : t;
           return ks(re, {
             skipTimezone: !0,
             withTime: !1
           });
-        } else return n === "percentage" ? `${t}%` : typeof t == "string" && t.length > 100 ? /* @__PURE__ */ k("p", { children: [
+        } else return n?.toLowerCase() === "percentage" ? `${t}%` : typeof t == "string" && t.length > 100 ? /* @__PURE__ */ k("p", { children: [
           t.slice(0, N ? 100 : t.length),
           N ? "... " : " ",
           /* @__PURE__ */ l(
@@ -12818,7 +12823,7 @@ const KM = ({
                   /* @__PURE__ */ l("span", { className: "line-through", children: h }),
                   /* @__PURE__ */ l("span", { children: K() })
                 ] }) : c || u ? /* @__PURE__ */ l("mark", { className: q("rounded-md py-0.5 px-1", Ae()), children: K() }) : K(),
-                n === "currency" && y !== 0 && y !== void 0 && y !== null && /* @__PURE__ */ k(
+                n?.toLowerCase() === "currency" && y !== 0 && y !== void 0 && y !== null && /* @__PURE__ */ k(
                   rt.span,
                   {
                     initial: { opacity: 0, y: 2 },
@@ -12866,13 +12871,13 @@ const KM = ({
               size: "extra-small",
               className: "pt-0.5",
               appearance: "body",
-              children: /* @__PURE__ */ l("mark", { className: "rounded-md py-0.5 px-1 bg-error-100", children: /* @__PURE__ */ l("del", { children: h || n === "boolean" && h === "0" ? h === "True" ? "Yes" : h === "False" ? "No" : n === "boolean" ? sh(h) : n === "currency" ? Ga(h, o?.currency_code) : n === "date" ? ks(h, {
+              children: /* @__PURE__ */ l("mark", { className: "rounded-md py-0.5 px-1 bg-error-100", children: /* @__PURE__ */ l("del", { children: h || n?.toLowerCase() === "boolean" && h === "0" ? h === "True" ? "Yes" : h === "False" ? "No" : n?.toLowerCase() === "boolean" ? sh(h) : n?.toLowerCase() === "currency" ? Ga(h, o?.currency_code) : n?.toLowerCase() === "date" ? ks(h, {
                 skipTimezone: !0,
                 withTime: !1
-              }) : n === "datetime" ? ks(h, {
+              }) : n?.toLowerCase() === "datetime" ? ks(h, {
                 skipTimezone: !0,
                 withTime: !0
-              }) : n === "percentage" ? `${h}%` : h.length > 100 ? /* @__PURE__ */ k("p", { children: [
+              }) : n?.toLowerCase() === "percentage" ? `${h}%` : h.length > 100 ? /* @__PURE__ */ k("p", { children: [
                 h.slice(0, N ? 100 : h.length),
                 N ? "... " : " ",
                 /* @__PURE__ */ l(