@commercelayer/app-elements 5.5.0 → 5.5.2

package/dist/{RuleEngineComponent-BJQQwo47.js → RuleEngineComponent-5tn0awai.js}

@@ -1,9 +1,9 @@
 "use client";
-import { t as k, b as H, d as Z, j as t, i as E, g as G, e as Q, f as h, h as j, k as $, D as P, l as S, n as v, B as z, o as T, p as U, q as ee, r as te, s as ae, v as C, I as le, C as ne } from "./main-ClKWD_hr.js";
+import { t as k, b as Z, d as G, j as t, i as E, g as Q, e as P, f as g, h as j, k as V, D as z, l as S, n as p, B as U, o as T, p as K, q as ee, r as te, s as ae, v as $, I as le, C as ne } from "./main-CMTD8EIQ.js";
 import "react-hook-form";
-import I, { useReducer as se, useCallback as w, useMemo as re, createContext as ie, useContext as ue, useState as g, useEffect as N, useRef as ce } from "react";
+import I, { useReducer as se, useCallback as w, useMemo as re, createContext as ie, useContext as ue, useState as x, useEffect as N, useRef as ce } from "react";
 import { a as de } from "./fetchCoreResourcesSuggestions-CZkDwjO2.js";
-import { p as A } from "./parseISO-DltoM17h.js";
+import { p as A } from "./parseISO-Du6lRb2h.js";
 function q(e, a) {
   const l = e.match(
     /(\d{4})-(\d{2})-(\d{2})[T ](\d{2}):(\d{2}):(\d{2})(?:\.(\d{0,7}))?(?:Z|(.)(\d{2}):?(\d{2})?)?/
@@ -22,12 +22,12 @@ function q(e, a) {
   ) : k(NaN, a == null ? void 0 : a.in);
 }
 function D(e, a, l) {
-  return e == null ? e : H(e, a, l);
+  return e == null ? e : Z(e, a, l);
 }
 function M(e, a) {
-  return e == null ? !0 : Z(e, a);
+  return e == null ? !0 : G(e, a);
 }
-const K = ie(
+const W = ie(
   void 0
 );
 function oe(e, a) {
@@ -37,7 +37,7 @@ function oe(e, a) {
       const i = { ...e.value };
       if (a.value === null)
         if (/\.\d+$/.test(a.path)) {
-          const u = a.path.replace(/\.\d+$/, ""), s = parseInt(((l = a.path.match(/\d+$/)) == null ? void 0 : l[0]) ?? "0", 10), r = G(i, u);
+          const u = a.path.replace(/\.\d+$/, ""), s = parseInt(((l = a.path.match(/\d+$/)) == null ? void 0 : l[0]) ?? "0", 10), r = Q(i, u);
           Array.isArray(r) && (r.splice(s, 1), D(i, u, r), r.length === 0 && u.endsWith(".nested.conditions") && M(i, u.replace(/\.conditions$/, "")));
         } else
           M(i, a.path);
@@ -97,15 +97,15 @@ function fe({
     }),
     [l, u, s, r]
   );
-  return /* @__PURE__ */ t.jsx(K.Provider, { value: n, children: e });
+  return /* @__PURE__ */ t.jsx(W.Provider, { value: n, children: e });
 }
-function p() {
-  const e = ue(K);
+function y() {
+  const e = ue(W);
   if (e === void 0)
     throw new Error("useRuleEngine must be used within a RuleEngineProvider");
   return e;
 }
-const W = Q([
+const X = P([
   "blank",
   "present",
   "null",
@@ -114,20 +114,21 @@ const W = Q([
 function R(e) {
   return null;
 }
-function xe({
+function me({
   item: e,
   pathPrefix: a
 }) {
   var i, u, s, r;
-  const { setPath: l } = p();
+  const { setPath: l } = y();
   if (e == null)
     return null;
   switch (e.type) {
     case "buy_x_pay_y":
       return /* @__PURE__ */ t.jsxs("div", { className: "w-36 flex items-center gap-0.5", children: [
         /* @__PURE__ */ t.jsx(
-          h,
+          g,
           {
+            name: `${a}.value.x`,
             type: "number",
             suffix: "X",
             defaultValue: (i = e.value) == null ? void 0 : i.x,
@@ -140,8 +141,9 @@ function xe({
           }
         ),
         /* @__PURE__ */ t.jsx(
-          h,
+          g,
           {
+            name: `${a}.value.y`,
             type: "number",
             suffix: "Y",
             defaultValue: (u = e.value) == null ? void 0 : u.y,
@@ -157,8 +159,9 @@ function xe({
     case "every_x_discount_y":
       return /* @__PURE__ */ t.jsxs("div", { className: "w-36 flex items-center gap-0.5", children: [
         /* @__PURE__ */ t.jsx(
-          h,
+          g,
           {
+            name: `${a}.value.x`,
             type: "number",
             suffix: "X",
             defaultValue: (s = e.value) == null ? void 0 : s.x,
@@ -171,8 +174,9 @@ function xe({
           }
         ),
         /* @__PURE__ */ t.jsx(
-          h,
+          g,
           {
+            name: `${a}.value.y`,
             type: "number",
             suffix: "Y",
             defaultValue: (r = e.value) == null ? void 0 : r.y,
@@ -188,8 +192,9 @@ function xe({
     case "fixed_amount":
     case "fixed_price":
       return /* @__PURE__ */ t.jsx("div", { className: "w-36", children: /* @__PURE__ */ t.jsx(
-        h,
+        g,
         {
+          name: `${a}.value`,
           type: "number",
           defaultValue: e.value,
           min: 0,
@@ -205,8 +210,9 @@ function xe({
     case "percentage": {
       const n = (e.value * 100).toFixed(2);
       return /* @__PURE__ */ t.jsx("div", { className: "w-24", children: /* @__PURE__ */ t.jsx(
-        h,
+        g,
         {
+          name: `${a}.value`,
           type: "number",
           defaultValue: n.endsWith(".00") ? n.slice(0, -3) : n,
           min: 0,
@@ -225,7 +231,7 @@ function xe({
       return R();
   }
 }
-function he({
+function ge({
   item: e,
   index: a,
   onDelete: l
@@ -233,7 +239,7 @@ function he({
   const {
     setPath: i,
     state: { selectedRuleIndex: u }
-  } = p(), s = {
+  } = y(), s = {
     percentage: "Percentage discount",
     fixed_amount: "Fixed amount",
     fixed_price: "Fixed price",
@@ -245,6 +251,7 @@ function he({
       /* @__PURE__ */ t.jsx("div", { className: "flex-1", children: /* @__PURE__ */ t.jsx(
         j,
         {
+          name: `${r}.type`,
           defaultValue: e != null ? {
             label: s[e.type],
             value: e.type
@@ -253,15 +260,16 @@ function he({
             ([n, d]) => ({ value: n, label: d })
           ),
           onSelect: (n) => {
-            $(n) && i(`${r}.type`, n.value);
+            V(n) && i(`${r}.type`, n.value);
           }
         }
       ) }),
-      /* @__PURE__ */ t.jsx(xe, { item: e, pathPrefix: r }),
+      /* @__PURE__ */ t.jsx(me, { item: e, pathPrefix: r }),
       /* @__PURE__ */ t.jsx("div", { className: "text-black font-bold text-sm", children: "ON" }),
       /* @__PURE__ */ t.jsx("div", { className: "flex-1", children: /* @__PURE__ */ t.jsx(
-        h,
+        g,
         {
+          name: `${r}.selector`,
           type: "text",
           defaultValue: e != null ? e.selector : void 0,
           onChange: (n) => {
@@ -271,10 +279,10 @@ function he({
       ) })
     ] }),
     l != null && /* @__PURE__ */ t.jsx(
-      P,
+      z,
       {
         className: "w-8 border-l border-gray-100 flex items-center justify-center self-stretch",
-        dropdownLabel: /* @__PURE__ */ t.jsx("button", { className: "flex items-center justify-center self-stretch flex-grow", children: /* @__PURE__ */ t.jsx(v, { name: "dotsThreeVertical", size: 16, weight: "bold" }) }),
+        dropdownLabel: /* @__PURE__ */ t.jsx("button", { className: "flex items-center justify-center self-stretch flex-grow", children: /* @__PURE__ */ t.jsx(p, { name: "dotsThreeVertical", size: 16, weight: "bold" }) }),
         dropdownItems: /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsx(
           S,
           {
@@ -288,16 +296,16 @@ function he({
     )
   ] }) });
 }
-function ge({
+function xe({
   actions: e
 }) {
-  const [a, l] = g(0), {
+  const [a, l] = x(0), {
     setPath: i,
     state: { selectedRuleIndex: u }
-  } = p();
+  } = y();
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx("div", { children: e == null ? void 0 : e.map((s, r, n) => /* @__PURE__ */ t.jsx(
-      he,
+      ge,
       {
         item: s,
         index: r,
@@ -308,7 +316,7 @@ function ge({
       `${u}-${r}-${a}`
     )) }),
     /* @__PURE__ */ t.jsx("div", { className: "mt-6", children: /* @__PURE__ */ t.jsxs(
-      z,
+      U,
       {
         size: "small",
         variant: "secondary",
@@ -320,15 +328,15 @@ function ge({
           );
         },
         children: [
-          /* @__PURE__ */ t.jsx(v, { name: "plusCircle" }),
+          /* @__PURE__ */ t.jsx(p, { name: "plusCircle" }),
           " Add action"
         ]
       }
     ) })
   ] });
 }
-function X(e) {
-  const [a, l] = g(void 0);
+function Y(e) {
+  const [a, l] = x(void 0);
   return N(() => {
     (e == null ? void 0 : e.field) != null && de(e.field).then((i) => {
       l(i);
@@ -337,7 +345,7 @@ function X(e) {
     });
   }, [e == null ? void 0 : e.field]), { infos: a };
 }
-function Y(e) {
+function B(e) {
   if (typeof e == "string")
     return T(q(e)) ? "datetime" : "string";
   if (typeof e == "number")
@@ -352,16 +360,17 @@ function Y(e) {
   }
   return "string";
 }
-function me({
+function he({
   item: e,
   pathPrefix: a
 }) {
   var s, r;
-  const { setPath: l } = p(), { infos: i } = X(e);
+  const { setPath: l } = y(), { infos: i } = Y(e);
   let u = (s = i == null ? void 0 : i.field) == null ? void 0 : s.type;
-  return u == null && (u = Y(e == null ? void 0 : e.value)), /* @__PURE__ */ t.jsx(
+  return u == null && (u = B(e == null ? void 0 : e.value)), /* @__PURE__ */ t.jsx(
     j,
     {
+      name: `${a}.matcher`,
       value: e != null ? {
         label: ((r = O.find((n) => n.matcher === e.matcher && (u != null && n.fieldTypes.includes(u) || u == null))) == null ? void 0 : r.label) ?? // eslint-disable-next-line no-irregular-whitespace
         (e.matcher != null ? `⚠️   ${e.matcher}` : ""),
@@ -369,7 +378,7 @@ function me({
       } : void 0,
       initialValues: O.filter(({ fieldTypes: n, visible: d }) => d !== !1 && n.includes(u)).map(({ matcher: n, label: d }) => ({ value: n, label: d })),
       onSelect: (n) => {
-        $(n) && (l(`${a}.matcher`, n.value), W.includes(
+        V(n) && (l(`${a}.matcher`, n.value), X.includes(
           n.value
         ) && l(`${a}.value`, null));
       }
@@ -642,7 +651,7 @@ function be({
   return (typeof e != "object" || Array.isArray(e) || e === null) && (e = {
     in_and: []
   }), /* @__PURE__ */ t.jsx("div", { children: Object.entries(e).map(([l, i], u) => /* @__PURE__ */ t.jsx(
-    pe,
+    ye,
     {
       pathPrefix: a,
       defaultValue: i,
@@ -651,12 +660,12 @@ function be({
     `${a}.${u}`
   )) });
 }
-function pe({
+function ye({
   initialMatcher: e,
   defaultValue: a,
   pathPrefix: l
 }) {
-  const [i, u] = g(e), [s, r] = g(e), [n, d] = g(a), { setPath: c } = p();
+  const [i, u] = x(e), [s, r] = x(e), [n, d] = x(a), { setPath: c } = y();
   return N(() => {
     i !== s && (c(`${l}.${i}`, null), u(s)), c(`${l}.${s}`, n);
   }, [s, n, c]), /* @__PURE__ */ t.jsxs("div", { className: "flex gap-2 last-of-type:mt-2", children: [
@@ -673,7 +682,7 @@ function pe({
           })
         ),
         onSelect: (o) => {
-          $(o) && r(o.value);
+          V(o) && r(o.value);
         }
       }
     ) }),
@@ -688,7 +697,7 @@ function pe({
         })),
         initialValues: [],
         onSelect: (o) => {
-          U(o) && d(
+          K(o) && d(
             o.map(
               (f) => typeof f.value == "boolean" ? f.value.toString() : f.value
             )
@@ -698,18 +707,18 @@ function pe({
     ) })
   ] });
 }
-function ye({
+function ve({
   value: e,
   onChange: a
 }) {
-  const [l, i] = g(
+  const [l, i] = x(
     Array.isArray(e) && typeof e[0] == "number" ? e[0] : null
-  ), [u, s] = g(
+  ), [u, s] = x(
     Array.isArray(e) && typeof e[1] == "number" ? e[1] : null
   );
   return /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-4", children: [
     /* @__PURE__ */ t.jsx("div", { className: "flex-grow", children: /* @__PURE__ */ t.jsx(
-      h,
+      g,
       {
         type: "number",
         placeholder: "Min",
@@ -722,7 +731,7 @@ function ye({
     ) }),
     /* @__PURE__ */ t.jsx("span", { className: "text-gray-300", children: "to" }),
     /* @__PURE__ */ t.jsx("div", { className: "flex-grow", children: /* @__PURE__ */ t.jsx(
-      h,
+      g,
       {
         type: "number",
         placeholder: "Max",
@@ -735,18 +744,18 @@ function ye({
     ) })
   ] });
 }
-function ve({
+function pe({
   value: e,
   onChange: a
 }) {
-  const [l, i] = g(
+  const [l, i] = x(
     Array.isArray(e) && typeof e[0] == "string" ? e[0] : null
-  ), [u, s] = g(
+  ), [u, s] = x(
     Array.isArray(e) && typeof e[1] == "string" ? e[1] : null
   );
   return /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-4", children: [
     /* @__PURE__ */ t.jsx("div", { className: "flex-grow", children: /* @__PURE__ */ t.jsx(
-      h,
+      g,
       {
         type: "text",
         placeholder: "Min",
@@ -759,7 +768,7 @@ function ve({
     ) }),
     /* @__PURE__ */ t.jsx("span", { className: "text-gray-300", children: "to" }),
     /* @__PURE__ */ t.jsx("div", { className: "flex-grow", children: /* @__PURE__ */ t.jsx(
-      h,
+      g,
       {
         type: "text",
         placeholder: "Max",
@@ -777,14 +786,14 @@ function je({
   pathPrefix: a
 }) {
   var d;
-  const { setPath: l } = p(), { infos: i } = X(e), u = `${a}.value`;
-  if (e == null || W.includes(
+  const { setPath: l } = y(), { infos: i } = Y(e), u = `${a}.value`;
+  if (e == null || X.includes(
     e.matcher
   ))
     return null;
   const s = e;
   let r = (d = i == null ? void 0 : i.field) == null ? void 0 : d.type;
-  r == null && (r = Y(s.value)), (typeof s.value == "string" && /^{{.*}}$/.test(s.value) || Array.isArray(s.value) && s.value.some(
+  r == null && (r = B(s.value)), (typeof s.value == "string" && /^{{.*}}$/.test(s.value) || Array.isArray(s.value) && s.value.some(
     (c) => typeof c == "string" && /^{{.*}}$/.test(c)
   )) && (r = "string");
   let n = null;
@@ -890,7 +899,7 @@ function je({
     }
     case "numberRange":
       return /* @__PURE__ */ t.jsx(
-        ye,
+        ve,
         {
           value: s.value,
           onChange: (c) => {
@@ -900,7 +909,7 @@ function je({
       );
     case "textRange":
       return /* @__PURE__ */ t.jsx(
-        ve,
+        pe,
         {
           value: s.value,
           onChange: (c) => {
@@ -929,7 +938,7 @@ function je({
           })) : [],
           initialValues: [],
           onSelect: (c) => {
-            U(c) && l(
+            K(c) && l(
               `${a}.value`,
               c.map((o) => {
                 if (r === "integer") {
@@ -944,8 +953,9 @@ function je({
       );
     case "number":
       return /* @__PURE__ */ t.jsx(
-        h,
+        g,
         {
+          name: `${a}.value`,
           type: "number",
           defaultValue: typeof s.value == "number" ? s.value : "",
           placeholder: "Enter value",
@@ -961,6 +971,7 @@ function je({
       return /* @__PURE__ */ t.jsx(
         j,
         {
+          name: `${a}.value`,
           defaultValue: typeof s.value == "boolean" ? {
             label: s.value ? "Yes" : "No",
             value: s.value
@@ -970,15 +981,16 @@ function je({
             { label: "No", value: !1 }
           ],
           onSelect: (c) => {
-            $(c) && l(u, c.value);
+            V(c) && l(u, c.value);
           }
         }
       );
     case "text":
     case null:
       return /* @__PURE__ */ t.jsx(
-        h,
+        g,
         {
+          name: `${a}.value`,
           type: "text",
           defaultValue: typeof s.value == "string" ? s.value : JSON.stringify(s.value),
           placeholder: "Enter value",
@@ -997,7 +1009,7 @@ function Ne({
   pathPrefix: l,
   onDelete: i
 }) {
-  const { setPath: u } = p(), s = [];
+  const { setPath: u } = y(), s = [];
   return a < 2 && (s[0] ?? (s[0] = []), s[0].push(
     /* @__PURE__ */ t.jsx(
       S,
@@ -1026,8 +1038,9 @@ function Ne({
     /* @__PURE__ */ t.jsx("div", { className: "flex items-center justify-between gap-2 flex-grow p-2", children: /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col gap-2 flex-grow", children: [
       /* @__PURE__ */ t.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
         /* @__PURE__ */ t.jsx("div", { className: "flex-1", children: /* @__PURE__ */ t.jsx(
-          h,
+          g,
           {
+            name: `${l}.field`,
             type: "text",
             defaultValue: e != null ? e.field : void 0,
             onChange: (r) => {
@@ -1038,15 +1051,15 @@ function Ne({
             }
           }
         ) }),
-        /* @__PURE__ */ t.jsx("div", { className: "flex-14", children: /* @__PURE__ */ t.jsx(me, { item: e, pathPrefix: l }) })
+        /* @__PURE__ */ t.jsx("div", { className: "flex-14", children: /* @__PURE__ */ t.jsx(he, { item: e, pathPrefix: l }) })
       ] }),
       /* @__PURE__ */ t.jsx(je, { item: e, pathPrefix: l })
     ] }) }),
     s.length > 0 && /* @__PURE__ */ t.jsx(
-      P,
+      z,
       {
         className: "w-8 border-l border-gray-100 flex items-center justify-center self-stretch",
-        dropdownLabel: /* @__PURE__ */ t.jsx("button", { className: "flex items-center justify-center self-stretch flex-grow", children: /* @__PURE__ */ t.jsx(v, { name: "dotsThreeVertical", size: 16, weight: "bold" }) }),
+        dropdownLabel: /* @__PURE__ */ t.jsx("button", { className: "flex items-center justify-center self-stretch flex-grow", children: /* @__PURE__ */ t.jsx(p, { name: "dotsThreeVertical", size: 16, weight: "bold" }) }),
         dropdownItems: s.map((r, n, d) => /* @__PURE__ */ t.jsxs(I.Fragment, { children: [
           r.map((c, o) => /* @__PURE__ */ t.jsx(I.Fragment, { children: c }, o)),
           n < d.length - 1 && /* @__PURE__ */ t.jsx(ae, {})
@@ -1055,7 +1068,7 @@ function Ne({
     )
   ] });
 }
-function B({
+function H({
   item: e,
   children: a,
   nestingLevel: l = 0,
@@ -1064,11 +1077,11 @@ function B({
   var o, f;
   const {
     state: { selectedRuleIndex: u }
-  } = p(), s = ((o = e == null ? void 0 : e.conditions_logic) == null ? void 0 : o.toLowerCase()) ?? "and", { setPath: r } = p(), [n, d] = g(0), c = l > 0;
+  } = y(), s = ((o = e == null ? void 0 : e.conditions_logic) == null ? void 0 : o.toLowerCase()) ?? "and", { setPath: r } = y(), [n, d] = x(0), c = l > 0;
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: C("query-group", {
+      className: $("query-group", {
         "p-4 border border-gray-200 rounded-md": c
       }),
       children: [
@@ -1077,10 +1090,10 @@ function B({
           /* @__PURE__ */ t.jsxs(
             "select",
             {
-              onChange: (x) => {
+              onChange: (m) => {
                 r(
                   `${i}.conditions_logic`,
-                  x.currentTarget.value
+                  m.currentTarget.value
                 );
               },
               defaultValue: s,
@@ -1097,32 +1110,32 @@ function B({
               ]
             }
           ),
-          /* @__PURE__ */ t.jsx("div", { className: "border-l border-gray-200 ml-3 pt-3", children: (f = e == null ? void 0 : e.conditions) == null ? void 0 : f.map((x, m, b) => {
-            const y = m === b.length - 1;
+          /* @__PURE__ */ t.jsx("div", { className: "border-l border-gray-200 ml-3 pt-3", children: (f = e == null ? void 0 : e.conditions) == null ? void 0 : f.map((m, h, b) => {
+            const v = h === b.length - 1;
             return /* @__PURE__ */ t.jsxs(
               "div",
               {
                 className: "flex items-center mb-4 last:mb-0 relative",
                 children: [
-                  /* @__PURE__ */ t.jsx(_e, { rounded: y }),
+                  /* @__PURE__ */ t.jsx(_e, { rounded: v }),
                   /* @__PURE__ */ t.jsx("div", { className: "ml-4 w-full", children: /* @__PURE__ */ t.jsx(
-                    B,
+                    H,
                     {
-                      item: (x == null ? void 0 : x.nested) ?? void 0,
-                      nestingLevel: (x == null ? void 0 : x.nested) != null ? l + 1 : 0,
-                      pathPrefix: `${i}.conditions.${m}.nested`,
+                      item: (m == null ? void 0 : m.nested) ?? void 0,
+                      nestingLevel: (m == null ? void 0 : m.nested) != null ? l + 1 : 0,
+                      pathPrefix: `${i}.conditions.${h}.nested`,
                       children: /* @__PURE__ */ t.jsx(
                         "div",
                         {
-                          className: C({
-                            "mb-4": (x == null ? void 0 : x.nested) != null
+                          className: $({
+                            "mb-4": (m == null ? void 0 : m.nested) != null
                           }),
                           children: /* @__PURE__ */ t.jsx(
                             Ne,
                             {
-                              item: x,
+                              item: m,
                               nestingLevel: l,
-                              pathPrefix: `${i}.conditions.${m}`,
+                              pathPrefix: `${i}.conditions.${h}`,
                               onDelete: b.length > 1 || l > 0 ? () => {
                                 d((_) => _ + 1);
                               } : void 0
@@ -1134,7 +1147,7 @@ function B({
                   ) })
                 ]
               },
-              `${u}-${m}-${n}`
+              `${u}-${h}-${n}`
             );
           }) })
         ] })
@@ -1155,7 +1168,7 @@ function we() {
   const {
     setPath: e,
     state: { value: a, selectedRuleIndex: l }
-  } = p(), [i, u] = g(
+  } = y(), [i, u] = x(
     ((s = a.rules[l]) == null ? void 0 : s.name) ?? ""
   );
   return N(() => {
@@ -1184,7 +1197,7 @@ function we() {
 }
 const L = {
   rules: []
-}, V = (e) => {
+}, C = (e) => {
   try {
     return JSON.parse(e ?? JSON.stringify(L));
   } catch {
@@ -1198,36 +1211,36 @@ const L = {
   }
 };
 function Ae(e) {
-  const [a, l] = g(
-    V(e.value ?? e.defaultValue)
+  const [a, l] = x(
+    C(e.value ?? e.defaultValue)
   );
   return N(
     function() {
-      a.rules.length === 0 && l(V(e.value));
+      a.rules.length === 0 && l(C(e.value));
     },
     [e.value]
-  ), /* @__PURE__ */ t.jsx(fe, { initialValue: { rules: a.rules }, children: /* @__PURE__ */ t.jsx(Ce, { ...e }) });
+  ), /* @__PURE__ */ t.jsx(fe, { initialValue: { rules: a.rules }, children: /* @__PURE__ */ t.jsx($e, { ...e }) });
 }
-function Ce(e) {
+function $e(e) {
   const {
     state: { value: a, selectedRuleIndex: l },
     setSelectedRuleIndex: i,
     setValue: u,
     setPath: s
-  } = p(), [r, n] = g(
+  } = y(), [r, n] = x(
     e.defaultCodeEditorVisible ?? !1
-  ), d = a.rules[l], c = ce(null), [o, f] = g(0);
+  ), d = a.rules[l], c = ce(null), [o, f] = x(0);
   N(
     function() {
-      var b, y, _;
-      E(V((b = c.current) == null ? void 0 : b.getValue()), a) || (y = c.current) == null || y.setValue(JSON.stringify(a, null, 2)), (_ = e.onChange) == null || _.call(e, a);
+      var b, v, _;
+      E(C((b = c.current) == null ? void 0 : b.getValue()), a) || (v = c.current) == null || v.setValue(JSON.stringify(a, null, 2)), (_ = e.onChange) == null || _.call(e, a);
     },
     [a]
   );
-  const x = w(
-    (m) => {
-      const b = V(m);
-      c.current != null && c.current.hasTextFocus() && Te(m) && !E(b, a) && (u(b), f((y) => y + 1));
+  const m = w(
+    (h) => {
+      const b = C(h);
+      c.current != null && c.current.hasTextFocus() && Te(h) && !E(b, a) && (u(b), f((v) => v + 1));
     },
     [a]
   );
@@ -1245,26 +1258,26 @@ function Ce(e) {
             children: [
               /* @__PURE__ */ t.jsxs("header", { className: "w-full bg-white border-b border-gray-200 py-3 px-8 flex text-[13px] gap-4 text-gray-400 font-semibold items-center", children: [
                 /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-4 flex-wrap", children: [
-                  a.rules.map((m, b) => {
-                    const y = `#${(b + 1).toString().padStart(2, "0")}`;
+                  a.rules.map((h, b) => {
+                    const v = `#${(b + 1).toString().padStart(2, "0")}`;
                     return /* @__PURE__ */ t.jsx(
                       "button",
                       {
-                        className: C("font-bold", {
+                        className: $("font-bold", {
                           "text-black": l === b
                         }),
                         onClick: () => {
                           i(b);
                         },
-                        children: y
+                        children: v
                       },
-                      m.id
+                      `${l}-${h.id}`
                     );
                   }),
                   /* @__PURE__ */ t.jsx(
                     "button",
                     {
-                      className: C("font-bold", {
+                      className: $("font-bold", {
                         "text-black": !0
                       }),
                       onClick: () => {
@@ -1274,7 +1287,7 @@ function Ce(e) {
                           conditions: [null]
                         }), i(a.rules.length);
                       },
-                      children: /* @__PURE__ */ t.jsx(v, { name: "plus", size: 16, className: "shrink-0" })
+                      children: /* @__PURE__ */ t.jsx(p, { name: "plus", size: 16, className: "shrink-0" })
                     }
                   )
                 ] }),
@@ -1285,40 +1298,40 @@ function Ce(e) {
                     onClick: () => {
                       n(!r);
                     },
-                    children: /* @__PURE__ */ t.jsx(v, { name: "sidebarSimple", size: 16, color: "#101111" })
+                    children: /* @__PURE__ */ t.jsx(p, { name: "sidebarSimple", size: 16, color: "#101111" })
                   }
                 ) })
               ] }),
-              /* @__PURE__ */ t.jsxs($e, { children: [
+              /* @__PURE__ */ t.jsxs(Ve, { children: [
                 /* @__PURE__ */ t.jsxs("div", { className: "mb-8 flex items-center gap-2", children: [
                   /* @__PURE__ */ t.jsx(we, {}),
-                  /* @__PURE__ */ t.jsx(v, { name: "pencilSimple", size: 16, className: "shrink-0" })
+                  /* @__PURE__ */ t.jsx(p, { name: "pencilSimple", size: 16, className: "shrink-0" })
                 ] }),
-                /* @__PURE__ */ t.jsx(J, { title: "Actions", icon: "lightning", children: /* @__PURE__ */ t.jsx(ge, { actions: d == null ? void 0 : d.actions }) }),
-                /* @__PURE__ */ t.jsx(Ve, { children: "when" }),
+                /* @__PURE__ */ t.jsx(J, { title: "Actions", icon: "lightning", children: /* @__PURE__ */ t.jsx(xe, { actions: d == null ? void 0 : d.actions }) }),
+                /* @__PURE__ */ t.jsx(Ce, { children: "when" }),
                 /* @__PURE__ */ t.jsxs(J, { title: "Conditions", icon: "treeView", children: [
                   /* @__PURE__ */ t.jsx(
-                    B,
+                    H,
                     {
                       item: d,
                       pathPrefix: `rules.${l}`
                     }
                   ),
                   /* @__PURE__ */ t.jsx("div", { className: "mt-6", children: /* @__PURE__ */ t.jsxs(
-                    z,
+                    U,
                     {
                       size: "small",
                       variant: "secondary",
                       alignItems: "center",
                       onClick: () => {
-                        var m;
+                        var h;
                         s(
-                          `rules.${l}.conditions.${((m = d == null ? void 0 : d.conditions) == null ? void 0 : m.length) ?? 0}`,
+                          `rules.${l}.conditions.${((h = d == null ? void 0 : d.conditions) == null ? void 0 : h.length) ?? 0}`,
                           void 0
                         );
                       },
                       children: [
-                        /* @__PURE__ */ t.jsx(v, { name: "plusCircle" }),
+                        /* @__PURE__ */ t.jsx(p, { name: "plusCircle" }),
                         " Add condition"
                       ]
                     }
@@ -1339,14 +1352,14 @@ function Ce(e) {
             jsonSchema: "order-rules",
             defaultValue: JSON.stringify(a, null, 2),
             noRounding: !0,
-            onChange: x
+            onChange: m
           }
         ) })
       ] })
     }
   );
 }
-function Ve({ children: e }) {
+function Ce({ children: e }) {
   return /* @__PURE__ */ t.jsxs("div", { className: "text-gray-500 flex items-center justify-center flex-col", children: [
     /* @__PURE__ */ t.jsx("div", { className: "h-6 w-[2px] bg-gray-200" }),
     /* @__PURE__ */ t.jsx("span", { className: "font-bold my-1 bg-gray-200 px-3 relative uppercase rounded h-[25px] items-center flex text-sm", children: e }),
@@ -1360,13 +1373,13 @@ function J({
 }) {
   return /* @__PURE__ */ t.jsxs("div", { className: "rounded-md bg-white shadow-sm", children: [
     /* @__PURE__ */ t.jsxs("div", { className: "flex items-center space-x-4 py-4 border-b border-gray-100", children: [
-      /* @__PURE__ */ t.jsx("div", { className: "w-8 h-8 -ml-4 bg-white rounded-full border border-gray-200 flex items-center justify-center shadow-sm shadow-primary-200", children: /* @__PURE__ */ t.jsx(v, { name: l }) }),
+      /* @__PURE__ */ t.jsx("div", { className: "w-8 h-8 -ml-4 bg-white rounded-full border border-gray-200 flex items-center justify-center shadow-sm shadow-primary-200", children: /* @__PURE__ */ t.jsx(p, { name: l }) }),
       /* @__PURE__ */ t.jsx("h2", { className: "text-lg font-semibold", children: a })
     ] }),
     /* @__PURE__ */ t.jsx("div", { className: "p-6", children: e })
   ] });
 }
-function $e({
+function Ve({
   children: e
 }) {
   return /* @__PURE__ */ t.jsx("div", { className: "h-full w-full bg-gray-50 p-8 [background-image:radial-gradient(#d6d6d6_1px,transparent_1px)] [background-size:16px_16px] overflow-auto", children: /* @__PURE__ */ t.jsx("div", { className: "max-w-[900px] mx-auto", children: e }) });