@isettingkit/business-rules 0.1.34 → 0.1.35

package/dist/index.es.d.ts

@@ -18,6 +18,8 @@ export declare interface IBusinessRuleCard {
 
 declare interface IBusinessRules {
     controls?: boolean;
+    customTitleContentAddCard?: string;
+    customMessageEmptyDecisions?: string;
     decisions: IRuleDecision[];
     textValues: IRulesFormTextValues;
     decisionTemplate: IRuleDecision;

package/dist/index.es.js

@@ -1,23 +1,23 @@
-import { jsxs as c, Fragment as N, jsx as i } from "react/jsx-runtime";
-import { ValueDataType as D, ValueHowToSetUp as T, DecisionConditionRender as $ } from "@isettingkit/input";
-import { Stack as d } from "@inubekit/stack";
+import { jsxs as c, Fragment as k, jsx as i } from "react/jsx-runtime";
+import { ValueDataType as D, ValueHowToSetUp as T, DecisionConditionRender as q } from "@isettingkit/input";
+import { Stack as s } from "@inubekit/stack";
 import { Divider as w } from "@inubekit/divider";
-import { Button as z } from "@inubekit/button";
+import { Button as O } from "@inubekit/button";
 import { useState as F, useEffect as te } from "react";
 import { Text as f } from "@inubekit/text";
-import { Date as q } from "@inubekit/date";
+import { Date as j } from "@inubekit/date";
 import { Checkbox as ie } from "@inubekit/checkbox";
-import { Toggle as G } from "@inubekit/toggle";
-import { inube as x } from "@inubekit/foundations";
+import { Toggle as Q } from "@inubekit/toggle";
+import { inube as y } from "@inubekit/foundations";
 import b, { keyframes as ne } from "styled-components";
 import { useFormik as ae } from "formik";
-import { mixed as B, object as L, number as I, string as U, date as O, lazy as j } from "yup";
+import { mixed as Y, object as L, number as U, string as $, lazy as H, date as M } from "yup";
 import { DecisionViewConditionRenderer as A } from "@isettingkit/view";
-import { SkeletonLine as C } from "@inubekit/skeleton";
-import { MdOutlineDelete as re, MdClear as oe, MdAdd as le } from "react-icons/md";
-import { Icon as Q } from "@inubekit/icon";
-import { createPortal as de } from "react-dom";
-import { Blanket as se } from "@inubekit/blanket";
+import { SkeletonLine as E } from "@inubekit/skeleton";
+import { MdOutlineDelete as oe, MdClear as re, MdAdd as le } from "react-icons/md";
+import { Icon as W } from "@inubekit/icon";
+import { createPortal as se } from "react-dom";
+import { Blanket as de } from "@inubekit/blanket";
 import { Grid as ce } from "@inubekit/grid";
 import { useMediaQuery as he } from "@inubekit/hooks";
 const ue = (t) => {
@@ -25,20 +25,20 @@ const ue = (t) => {
     onHandleStartChange: e,
     onHandleEndChange: n,
     onCheckClosedChange: a,
-    labelStart: r,
-    labelEnd: o,
-    checkedClosed: s = !1,
-    required: h = !1,
-    valueStart: u = "",
+    labelStart: o,
+    labelEnd: r,
+    checkedClosed: d = !1,
+    required: u = !1,
+    valueStart: h = "",
     valueEnd: l = "",
     messageStart: p = "",
     messageEnd: m = "",
     statusStart: g = "pending",
-    statusEnd: k = "pending"
-  } = t, [S, J] = F(s), [K, X] = F(u), [Z, ee] = F(l);
-  return /* @__PURE__ */ c(N, { children: [
-    /* @__PURE__ */ c(d, { direction: "row", justifyContent: "space-between", margin: "10px 0", children: [
-      /* @__PURE__ */ i(d, { children: /* @__PURE__ */ i(
+    statusEnd: C = "pending"
+  } = t, [S, V] = F(d), [I, X] = F(h), [Z, ee] = F(l);
+  return /* @__PURE__ */ c(k, { children: [
+    /* @__PURE__ */ c(s, { direction: "row", justifyContent: "space-between", margin: "10px 0", children: [
+      /* @__PURE__ */ i(s, { children: /* @__PURE__ */ i(
         f,
         {
           appearance: "gray",
@@ -50,7 +50,7 @@ const ue = (t) => {
         }
       ) }),
       /* @__PURE__ */ i(
-        d,
+        s,
         {
           alignContent: "center",
           justifyContent: "center",
@@ -60,8 +60,8 @@ const ue = (t) => {
             ie,
             {
               label: "Cerrada",
-              onChange: ({ target: y }) => {
-                J(y.checked), a && a(y.checked);
+              onChange: ({ target: v }) => {
+                V(v.checked), a && a(v.checked);
               },
               checked: S,
               value: ""
@@ -70,34 +70,34 @@ const ue = (t) => {
         }
       )
     ] }),
-    /* @__PURE__ */ c(d, { justifyContent: "space-between", gap: "24px", children: [
-      /* @__PURE__ */ i(d, { width: "189px", children: /* @__PURE__ */ i(
-        q,
+    /* @__PURE__ */ c(s, { justifyContent: "space-between", gap: "24px", children: [
+      /* @__PURE__ */ i(s, { width: "189px", children: /* @__PURE__ */ i(
+        j,
         {
           id: "dateStart",
-          label: r,
-          onChange: (y) => {
-            X(y.target.value), e(y);
+          label: o,
+          onChange: (v) => {
+            X(v.target.value), e(v);
           },
-          value: K,
-          required: h,
+          value: I,
+          required: u,
           size: "compact",
           status: g,
           message: p
         }
       ) }),
-      S && /* @__PURE__ */ i(d, { width: "189px", children: /* @__PURE__ */ i(
-        q,
+      S && /* @__PURE__ */ i(s, { width: "189px", children: /* @__PURE__ */ i(
+        j,
         {
           id: "dateEnd",
-          label: o,
-          onChange: (y) => {
-            ee(y.target.value), n(y);
+          label: r,
+          onChange: (v) => {
+            ee(v.target.value), n(v);
           },
           value: Z,
-          required: h,
+          required: u,
           size: "compact",
-          status: k,
+          status: C,
           message: m
         }
       ) })
@@ -106,7 +106,7 @@ const ue = (t) => {
 }, pe = b.div`
   & > div {
     border-radius: 8px;
-    border: 1px solid ${x.palette.neutral.N30};
+    border: 1px solid ${y.palette.neutral.N30};
   }
 `, me = b.div`
   width: 100%;
@@ -130,32 +130,32 @@ const ue = (t) => {
     checked: e,
     children: n,
     handleToggleChange: a,
-    id: r,
-    labelToggle: o,
-    name: s,
-    valueToggle: h = ""
-  } = t, [u, l] = F(e), p = (m) => {
+    id: o,
+    labelToggle: r,
+    name: d,
+    valueToggle: u = ""
+  } = t, [h, l] = F(e), p = (m) => {
     l(m.target.checked), a(m);
   };
   return te(() => {
     l(e);
-  }, [e]), /* @__PURE__ */ c(N, { children: [
-    /* @__PURE__ */ i(d, { children: /* @__PURE__ */ i(
-      G,
+  }, [e]), /* @__PURE__ */ c(k, { children: [
+    /* @__PURE__ */ i(s, { children: /* @__PURE__ */ i(
+      Q,
       {
-        checked: u,
-        id: r,
-        name: s,
+        checked: h,
+        id: o,
+        name: d,
         onChange: p,
         size: "small",
-        value: h,
-        children: /* @__PURE__ */ i(f, { size: "medium", type: "label", weight: "bold", children: o })
+        value: u,
+        children: /* @__PURE__ */ i(f, { size: "medium", type: "label", weight: "bold", children: r })
       }
     ) }),
-    u && /* @__PURE__ */ i(N, { children: n })
+    h && /* @__PURE__ */ i(k, { children: n })
   ] });
 }, be = (t) => ({
-  schema: B().test(
+  schema: Y().test(
     "isArrayOrString",
     "Must be an array of strings/numbers or a single string",
     (e) => Array.isArray(e) ? e.every(
@@ -164,7 +164,7 @@ const ue = (t) => {
   ),
   value: t
 }), Te = (t) => ({
-  schema: B().test(
+  schema: Y().test(
     "isArrayOrString",
     "Must be an array of strings/numbers or a single string",
     (e) => Array.isArray(e) ? e.every(
@@ -176,40 +176,40 @@ const ue = (t) => {
   const e = (t == null ? void 0 : t.from) ?? 0, n = (t == null ? void 0 : t.to) ?? 0;
   return {
     schema: L({
-      from: I().required("Range From is required").max(n, "'Range From' cannot be greater than 'Range To'").min(0, "'Range From' cannot be less than 0"),
-      to: I().min(0, "To value must be greater than or equal to 0").required("To value is required").test(
+      from: U().required("Range From is required").max(n, "'Range From' cannot be greater than 'Range To'").min(0, "'Range From' cannot be less than 0"),
+      to: U().min(0, "To value must be greater than or equal to 0").required("To value is required").test(
         "is-greater",
         "To value must be greater than From value",
         function(a) {
-          const { from: r } = this.parent;
-          return a > r;
+          const { from: o } = this.parent;
+          return a > o;
         }
       )
     }),
     value: { from: e, to: n }
   };
-}, V = (t, e) => e === D.PERCENTAGE ? {
-  schema: I().required("Percentage is required").min(0, "Percentage cannot be less than 0").max(100, "Percentage cannot be greater than 100"),
+}, R = (t, e) => e === D.PERCENTAGE ? {
+  schema: U().required("Percentage is required").min(0, "Percentage cannot be less than 0").max(100, "Percentage cannot be greater than 100"),
   value: t
 } : {
-  schema: U().required("Required"),
+  schema: $().required("Required"),
   value: t
-}, ye = (t) => ({
-  schema: U().required("Required").test(
+}, ve = (t) => ({
+  schema: $().required("Required").test(
     "non-empty",
     "Value cannot be empty",
     (e) => e != null && e.trim() !== ""
   ),
   value: t
-}), xe = {
+}), ye = {
   [T.LIST_OF_VALUES]: be,
   [T.LIST_OF_VALUES_MULTI]: Te,
   [T.RANGE]: fe,
-  [T.GREATER_THAN]: V,
-  [T.LESS_THAN]: V,
-  [T.EQUAL]: V
-}, H = (t) => xe[t] || ye;
-function ve({ decision: t, onSubmitEvent: e }) {
+  [T.GREATER_THAN]: R,
+  [T.LESS_THAN]: R,
+  [T.EQUAL]: R
+}, P = (t) => ye[t] || ve;
+function xe({ decision: t, onSubmitEvent: e }) {
   const n = {
     ruleName: t.ruleName || "",
     decisionDataType: t.decisionDataType || D.ALPHABETICAL,
@@ -221,30 +221,30 @@ function ve({ decision: t, onSubmitEvent: e }) {
     conditionThatEstablishesTheDecision: {},
     checkClosed: !1
   }, a = L({
-    ruleName: U().required("Name is required"),
-    effectiveFrom: O().required("effective From date is required"),
-    validUntil: O().when(
+    ruleName: $().required("Name is required"),
+    effectiveFrom: M().required("effective From date is required"),
+    validUntil: M().when(
       "checkClosed",
-      (s, h, { parent: u }) => (u == null ? void 0 : u.checkClosed) ? h.required("valid Until date is required").test(
+      (d, u, { parent: h }) => (h == null ? void 0 : h.checkClosed) ? u.required("valid Until date is required").test(
         "is-after-startDate",
         "valid Until date must be greater than or equal to Start date",
         function(p) {
           const m = this.parent.effectiveFrom;
           return !m || !p ? !0 : new Date(p) >= new Date(m);
         }
-      ) : h.notRequired()
+      ) : u.notRequired()
     ),
-    value: j(() => H(r.values.howToSetTheDecision)(
-      r.values.value,
-      r.values.decisionDataType
+    value: H(() => P(o.values.howToSetTheDecision)(
+      o.values.value,
+      o.values.decisionDataType
     ).schema),
-    conditionThatEstablishesTheDecision: j((s, { parent: h }) => {
+    conditionThatEstablishesTheDecision: H((d, { parent: u }) => {
       var p;
-      if ((h == null ? void 0 : h.toggleNone) && Object.keys(h.conditionThatEstablishesTheDecision || {}).length > 0) return L().shape({});
+      if ((u == null ? void 0 : u.toggleNone) && Object.keys(u.conditionThatEstablishesTheDecision || {}).length > 0) return L().shape({});
       const l = (p = t.conditionThatEstablishesTheDecision) == null ? void 0 : p.reduce(
         (m, g) => {
-          if (r.values.conditionThatEstablishesTheDecision[g.conditionName] !== void 0) {
-            const S = H(g.howToSetTheCondition);
+          if (o.values.conditionThatEstablishesTheDecision[g.conditionName] !== void 0) {
+            const S = P(g.howToSetTheCondition);
             m[g.conditionName] = S(
               g.value,
               g.conditionDataType
@@ -262,43 +262,43 @@ function ve({ decision: t, onSubmitEvent: e }) {
         ) : !1
       );
     })
-  }), r = ae({
+  }), o = ae({
     initialValues: n,
     validationSchema: a,
     validateOnBlur: !0,
-    onSubmit: (s) => {
-      var u;
-      const h = {
+    onSubmit: (d) => {
+      var h;
+      const u = {
         ...t,
-        ruleName: s.ruleName,
-        decisionDataType: s.decisionDataType,
-        howToSetTheDecision: s.howToSetTheDecision,
-        value: s.value,
-        effectiveFrom: s.effectiveFrom,
-        validUntil: s.validUntil,
-        conditionThatEstablishesTheDecision: (u = t.conditionThatEstablishesTheDecision) == null ? void 0 : u.filter((l) => {
-          const p = s.conditionThatEstablishesTheDecision[l.conditionName];
+        ruleName: d.ruleName,
+        decisionDataType: d.decisionDataType,
+        howToSetTheDecision: d.howToSetTheDecision,
+        value: d.value,
+        effectiveFrom: d.effectiveFrom,
+        validUntil: d.validUntil,
+        conditionThatEstablishesTheDecision: (h = t.conditionThatEstablishesTheDecision) == null ? void 0 : h.filter((l) => {
+          const p = d.conditionThatEstablishesTheDecision[l.conditionName];
           return p != null && p !== "";
         }).map((l) => ({
           ...l,
-          value: s.conditionThatEstablishesTheDecision[l.conditionName]
+          value: d.conditionThatEstablishesTheDecision[l.conditionName]
         }))
       };
-      e(h);
+      e(u);
     }
   });
-  return { formik: r, handleToggleNoneChange: (s) => {
-    var h;
-    r.setFieldValue("toggleNone", s), (h = t.conditionThatEstablishesTheDecision) == null || h.forEach((u) => {
-      if (s)
-        r.setFieldValue(
-          `conditionThatEstablishesTheDecision.${u.conditionName}`,
+  return { formik: o, handleToggleNoneChange: (d) => {
+    var u;
+    o.setFieldValue("toggleNone", d), (u = t.conditionThatEstablishesTheDecision) == null || u.forEach((h) => {
+      if (d)
+        o.setFieldValue(
+          `conditionThatEstablishesTheDecision.${h.conditionName}`,
           void 0
         );
       else {
-        const l = u.howToSetTheCondition === T.LIST_OF_VALUES_MULTI ? [] : "";
-        r.setFieldValue(
-          `conditionThatEstablishesTheDecision.${u.conditionName}`,
+        const l = h.howToSetTheCondition === T.LIST_OF_VALUES_MULTI ? [] : "";
+        o.setFieldValue(
+          `conditionThatEstablishesTheDecision.${h.conditionName}`,
           l
         );
       }
@@ -306,26 +306,26 @@ function ve({ decision: t, onSubmitEvent: e }) {
   } };
 }
 const we = (t) => {
-  var u;
-  const { decision: e, onSubmitEvent: n, textValues: a, onCancel: r } = t, { formik: o, handleToggleNoneChange: s } = ve({
+  var h;
+  const { decision: e, onSubmitEvent: n, textValues: a, onCancel: o } = t, { formik: r, handleToggleNoneChange: d } = xe({
     decision: e,
     onSubmitEvent: n
-  }), h = {
+  }), u = {
     ruleName: e.ruleName,
     labelName: e.labelName,
     howToSetTheCondition: e.howToSetTheDecision,
     decisionDataType: e.decisionDataType,
     listOfPossibleValues: e.listOfPossibleValues
   };
-  return /* @__PURE__ */ i("form", { onSubmit: o.handleSubmit, children: /* @__PURE__ */ c(d, { direction: "column", gap: "24px", children: [
-    $({
-      condition: h,
-      formik: o,
+  return /* @__PURE__ */ i("form", { onSubmit: r.handleSubmit, children: /* @__PURE__ */ c(s, { direction: "column", gap: "24px", children: [
+    q({
+      condition: u,
+      formik: r,
       isDecision: !0
     }),
     /* @__PURE__ */ i(w, { dashed: !0 }),
     /* @__PURE__ */ i(pe, { children: /* @__PURE__ */ i(me, { children: /* @__PURE__ */ c(
-      d,
+      s,
       {
         direction: "column",
         padding: "6px 12px",
@@ -333,7 +333,7 @@ const we = (t) => {
         height: "272px",
         children: [
           /* @__PURE__ */ c(
-            d,
+            s,
             {
               justifyContent: "space-between",
               alignItems: "center",
@@ -341,11 +341,11 @@ const we = (t) => {
               children: [
                 /* @__PURE__ */ i(f, { type: "title", size: "small", weight: "bold", appearance: "gray", children: a.factsThatConditionIt }),
                 /* @__PURE__ */ i(
-                  G,
+                  Q,
                   {
                     id: "toggleNone",
-                    onChange: () => s(!o.values.toggleNone),
-                    checked: o.values.toggleNone,
+                    onChange: () => d(!r.values.toggleNone),
+                    checked: r.values.toggleNone,
                     size: "small",
                     children: /* @__PURE__ */ i(f, { size: "medium", type: "label", weight: "bold", children: a.none })
                   }
@@ -353,33 +353,33 @@ const we = (t) => {
               ]
             }
           ),
-          /* @__PURE__ */ i(d, { direction: "column", gap: "20px", children: (u = e.conditionThatEstablishesTheDecision) == null ? void 0 : u.map(
+          /* @__PURE__ */ i(s, { direction: "column", gap: "20px", children: (h = e.conditionThatEstablishesTheDecision) == null ? void 0 : h.map(
             (l) => l.hidden ? null : /* @__PURE__ */ i(
               ge,
               {
                 id: `toggle-${l.conditionName}`,
                 name: `toggle.${l.conditionName}`,
                 labelToggle: l.labelName,
-                checked: !o.values.toggleNone && o.values.conditionThatEstablishesTheDecision[l.conditionName] !== void 0,
+                checked: !r.values.toggleNone && r.values.conditionThatEstablishesTheDecision[l.conditionName] !== void 0,
                 handleToggleChange: (p) => {
                   if (!p.target.checked)
-                    o.setFieldValue(
+                    r.setFieldValue(
                       `conditionThatEstablishesTheDecision.${l.conditionName}`,
                       void 0
-                    ), o.setFieldTouched(
+                    ), r.setFieldTouched(
                       `conditionThatEstablishesTheDecision.${l.conditionName}`,
                       !1,
                       !1
                     );
                   else {
                     const g = l.howToSetTheCondition === T.LIST_OF_VALUES_MULTI ? [] : "";
-                    o.setFieldValue(
+                    r.setFieldValue(
                       `conditionThatEstablishesTheDecision.${l.conditionName}`,
                       g
                     );
                   }
                 },
-                children: $({ condition: l, formik: o })
+                children: q({ condition: l, formik: r })
               },
               l.conditionName
             )
@@ -393,33 +393,33 @@ const we = (t) => {
       {
         labelStart: a.termStart,
         labelEnd: a.termEnd,
-        valueStart: o.values.effectiveFrom,
-        valueEnd: o.values.validUntil,
-        messageStart: o.errors.effectiveFrom,
-        messageEnd: o.errors.validUntil,
-        statusStart: o.touched.effectiveFrom ? o.errors.effectiveFrom ? "invalid" : "valid" : void 0,
-        statusEnd: o.touched.validUntil ? o.errors.validUntil ? "invalid" : "valid" : void 0,
-        onHandleStartChange: (l) => o.setFieldValue("effectiveFrom", l.target.value),
-        onHandleEndChange: (l) => o.setFieldValue("validUntil", l.target.value),
+        valueStart: r.values.effectiveFrom,
+        valueEnd: r.values.validUntil,
+        messageStart: r.errors.effectiveFrom,
+        messageEnd: r.errors.validUntil,
+        statusStart: r.touched.effectiveFrom ? r.errors.effectiveFrom ? "invalid" : "valid" : void 0,
+        statusEnd: r.touched.validUntil ? r.errors.validUntil ? "invalid" : "valid" : void 0,
+        onHandleStartChange: (l) => r.setFieldValue("effectiveFrom", l.target.value),
+        onHandleEndChange: (l) => r.setFieldValue("validUntil", l.target.value),
         onCheckClosedChange: (l) => {
-          o.setFieldValue("checkClosed", l), l && o.setFieldValue("validUntil", "");
+          r.setFieldValue("checkClosed", l), l && r.setFieldValue("validUntil", "");
         },
-        checkedClosed: o.values.checkClosed
+        checkedClosed: r.values.checkClosed
       }
     ),
     /* @__PURE__ */ i(w, {}),
-    o.errors.conditionThatEstablishesTheDecision && o.submitCount > 0 && /* @__PURE__ */ i(f, { type: "label", size: "medium", appearance: "danger", children: String(o.errors.conditionThatEstablishesTheDecision) }),
-    /* @__PURE__ */ c(d, { direction: "row", justifyContent: "end", gap: "16px", children: [
-      /* @__PURE__ */ i(z, { appearance: "gray", onClick: r, children: a.cancel }),
-      /* @__PURE__ */ i(z, { type: "submit", children: a.confirm })
+    r.errors.conditionThatEstablishesTheDecision && r.submitCount > 0 && /* @__PURE__ */ i(f, { type: "label", size: "medium", appearance: "danger", children: String(r.errors.conditionThatEstablishesTheDecision) }),
+    /* @__PURE__ */ c(s, { direction: "row", justifyContent: "end", gap: "16px", children: [
+      /* @__PURE__ */ i(O, { appearance: "gray", onClick: o, children: a.cancel }),
+      /* @__PURE__ */ i(O, { type: "submit", children: a.confirm })
     ] })
   ] }) });
-}, M = b.div`
+}, G = b.div`
   & > div {
     border-radius: 8px;
-    border: 1px solid ${x.palette.neutral.N30};
+    border: 1px solid ${y.palette.neutral.N30};
   }
-`, P = b.div`
+`, B = b.div`
   width: 100%;
   height: 100%;
   overflow-y: auto;
@@ -441,38 +441,38 @@ const we = (t) => {
   from: t.from ?? "",
   to: t.to ?? ""
 }), Ee = (t) => t.value, Ne = (t) => t.value, ke = (t) => t.value;
-var v = /* @__PURE__ */ ((t) => (t.EQUAL = "EqualTo", t.GREATER_THAN = "GreaterThan", t.LESS_THAN = "LessThan", t.LIST_OF_VALUES = "ListOfValues", t.LIST_OF_VALUES_MULTI = "ListOfValuesMulti", t.RANGE = "Range", t))(v || {});
+var x = /* @__PURE__ */ ((t) => (t.EQUAL = "EqualTo", t.GREATER_THAN = "GreaterThan", t.LESS_THAN = "LessThan", t.LIST_OF_VALUES = "ListOfValues", t.LIST_OF_VALUES_MULTI = "ListOfValuesMulti", t.RANGE = "Range", t))(x || {});
 const Ae = (t) => t.value, Fe = {
-  [v.LIST_OF_VALUES]: Se,
-  [v.LIST_OF_VALUES_MULTI]: De,
-  [v.RANGE]: Ce,
-  [v.GREATER_THAN]: Ee,
-  [v.LESS_THAN]: Ne,
-  [v.EQUAL]: ke
+  [x.LIST_OF_VALUES]: Se,
+  [x.LIST_OF_VALUES_MULTI]: De,
+  [x.RANGE]: Ce,
+  [x.GREATER_THAN]: Ee,
+  [x.LESS_THAN]: Ne,
+  [x.EQUAL]: ke
 };
-function E(t) {
+function N(t) {
   const e = t == null ? void 0 : t.value, n = typeof e == "object" && e !== null && !Array.isArray(e), a = Fe[t == null ? void 0 : t.howToSetTheDecision] || Ae;
   return n && a(e) || e || void 0;
 }
-const Y = (t) => {
-  const { decision: e, loading: n = !1, textValues: a } = t, r = {
+const J = (t) => {
+  const { decision: e, loading: n = !1, textValues: a } = t, o = {
     labelName: (e == null ? void 0 : e.labelName) || "",
     decisionDataType: (e == null ? void 0 : e.decisionDataType) || "alphabetical",
-    value: E(e),
+    value: N(e),
     howToSetTheDecision: (e == null ? void 0 : e.howToSetTheDecision) || "EqualTo"
   };
-  return !n && e && a ? /* @__PURE__ */ c(d, { direction: "column", gap: "12px", children: [
-    e && /* @__PURE__ */ i(d, { direction: "column", alignItems: "center", children: /* @__PURE__ */ i(
+  return !n && e && a ? /* @__PURE__ */ c(s, { direction: "column", gap: "12px", children: [
+    e && /* @__PURE__ */ i(s, { direction: "column", alignItems: "center", children: /* @__PURE__ */ i(
       A,
       {
-        element: r,
-        valueData: E(r),
+        element: o,
+        valueData: N(o),
         type: "decision"
       }
     ) }, e.ruleName),
     /* @__PURE__ */ i(w, { dashed: !0 }),
-    /* @__PURE__ */ i(P, { children: /* @__PURE__ */ c(
-      d,
+    /* @__PURE__ */ i(B, { children: /* @__PURE__ */ c(
+      s,
       {
         direction: "column",
         gap: "12px",
@@ -490,18 +490,18 @@ const Y = (t) => {
               children: a.factsThatConditionIt
             }
           ),
-          e.conditionThatEstablishesTheDecision && e.conditionThatEstablishesTheDecision.map((o) => o.hidden ? null : /* @__PURE__ */ i(M, { children: /* @__PURE__ */ i(d, { direction: "column", padding: "8px", children: /* @__PURE__ */ i(
+          e.conditionThatEstablishesTheDecision && e.conditionThatEstablishesTheDecision.map((r) => r.hidden ? null : /* @__PURE__ */ i(G, { children: /* @__PURE__ */ i(s, { direction: "column", padding: "8px", children: /* @__PURE__ */ i(
             A,
             {
               element: {
-                ...o,
-                value: o.value
+                ...r,
+                value: r.value
               },
-              valueData: E(o)
+              valueData: N(r)
             }
-          ) }) }, o.conditionName)),
+          ) }) }, r.conditionName)),
           /* @__PURE__ */ i(w, { dashed: !0 }),
-          /* @__PURE__ */ c(d, { direction: "column", gap: "12px", children: [
+          /* @__PURE__ */ c(s, { direction: "column", gap: "12px", children: [
             (e == null ? void 0 : e.effectiveFrom) && (e == null ? void 0 : e.validUntil) && /* @__PURE__ */ i(
               A,
               {
@@ -511,7 +511,7 @@ const Y = (t) => {
                   howToSetTheDecision: T.RANGE,
                   decisionDataType: D.DATE
                 },
-                valueData: E({
+                valueData: N({
                   labelName: a.terms,
                   value: {
                     from: String(e.effectiveFrom),
@@ -533,7 +533,7 @@ const Y = (t) => {
                   howToSetTheDecision: T.EQUAL,
                   decisionDataType: D.DATE
                 },
-                valueData: E({
+                valueData: N({
                   labelName: a.terms,
                   value: String(e.effectiveFrom),
                   howToSetTheDecision: T.EQUAL,
@@ -547,41 +547,41 @@ const Y = (t) => {
         ]
       }
     ) })
-  ] }) : /* @__PURE__ */ c(d, { direction: "column", gap: "12px", children: [
-    /* @__PURE__ */ c(d, { direction: "column", alignItems: "center", gap: "4px", children: [
-      /* @__PURE__ */ i(C, { animated: !0, width: "180px" }),
-      /* @__PURE__ */ i(C, { animated: !0, width: "85px" })
+  ] }) : /* @__PURE__ */ c(s, { direction: "column", gap: "12px", children: [
+    /* @__PURE__ */ c(s, { direction: "column", alignItems: "center", gap: "4px", children: [
+      /* @__PURE__ */ i(E, { animated: !0, width: "180px" }),
+      /* @__PURE__ */ i(E, { animated: !0, width: "85px" })
     ] }, "loading"),
-    /* @__PURE__ */ c(d, { direction: "column", gap: "12px", alignItems: "center", children: [
+    /* @__PURE__ */ c(s, { direction: "column", gap: "12px", alignItems: "center", children: [
       /* @__PURE__ */ i(w, { dashed: !0 }),
-      /* @__PURE__ */ i(C, { animated: !0, width: "150px" })
+      /* @__PURE__ */ i(E, { animated: !0, width: "150px" })
     ] }),
-    /* @__PURE__ */ i(P, { children: /* @__PURE__ */ i(
-      d,
+    /* @__PURE__ */ i(B, { children: /* @__PURE__ */ i(
+      s,
       {
         direction: "column",
         gap: "12px",
         justifyContent: "space-between",
         height: "203px",
-        children: Array.from({ length: 5 }).map((o, s) => /* @__PURE__ */ i(M, { children: /* @__PURE__ */ c(
-          d,
+        children: Array.from({ length: 5 }).map((r, d) => /* @__PURE__ */ i(G, { children: /* @__PURE__ */ c(
+          s,
           {
             direction: "column",
             gap: "12px",
             alignItems: "start",
             padding: "8px",
             children: [
-              /* @__PURE__ */ i(C, { animated: !0, width: "180px" }),
-              /* @__PURE__ */ i(C, { animated: !0, width: "85px" })
+              /* @__PURE__ */ i(E, { animated: !0, width: "180px" }),
+              /* @__PURE__ */ i(E, { animated: !0, width: "85px" })
             ]
           }
-        ) }, `condition-${s}`))
+        ) }, `condition-${d}`))
       }
     ) })
   ] });
 }, Le = b.div`
   border-radius: 8px;
-  border: 1px solid ${x.palette.neutral.N30};
+  border: 1px solid ${y.palette.neutral.N30};
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
@@ -610,21 +610,21 @@ b.div`
     border-radius: 8px;
   }
 `;
-const _ = (t) => {
-  const { children: e, controls: n = !0, handleDelete: a, id: r } = t;
-  return /* @__PURE__ */ i(Le, { children: /* @__PURE__ */ c(d, { direction: "column", gap: "16px", padding: "12px 16px", children: [
+const z = (t) => {
+  const { children: e, controls: n = !0, handleDelete: a, id: o } = t;
+  return /* @__PURE__ */ i(Le, { children: /* @__PURE__ */ c(s, { direction: "column", gap: "16px", padding: "12px 16px", children: [
     e,
-    n && /* @__PURE__ */ c(N, { children: [
+    n && /* @__PURE__ */ c(k, { children: [
       /* @__PURE__ */ i(w, {}),
-      /* @__PURE__ */ i(d, { gap: "16px", justifyContent: "end", children: /* @__PURE__ */ i(
-        Q,
+      /* @__PURE__ */ i(s, { gap: "16px", justifyContent: "end", children: /* @__PURE__ */ i(
+        W,
         {
           cursorHover: !0,
           appearance: "dark",
           size: "24px",
-          icon: /* @__PURE__ */ i(re, {}),
+          icon: /* @__PURE__ */ i(oe, {}),
           onClick: () => {
-            a(r);
+            a(o);
           }
         }
       ) })
@@ -638,7 +638,7 @@ const _ = (t) => {
 `, Ie = b.div`
   background-color: ${({ theme: t }) => {
   var e, n;
-  return ((n = (e = t == null ? void 0 : t.palette) == null ? void 0 : e.neutral) == null ? void 0 : n.N0) || x.palette.neutral.N0;
+  return ((n = (e = t == null ? void 0 : t.palette) == null ? void 0 : e.neutral) == null ? void 0 : n.N0) || y.palette.neutral.N0;
 }};
   max-width: 450px;
   max-height: 90vh;
@@ -667,20 +667,20 @@ const _ = (t) => {
     border-radius: 8px;
   }
 `, Re = (t) => {
-  const { children: e, portalId: n, onCloseModal: a, title: r } = t, o = document.getElementById(n);
-  if (!o)
+  const { children: e, portalId: n, onCloseModal: a, title: o } = t, r = document.getElementById(n);
+  if (!r)
     throw new Error(
       "The portal node is not defined. This can occur when the specific node used to render the portal has not been defined correctly."
     );
-  return de(
-    /* @__PURE__ */ i(Ve, { children: /* @__PURE__ */ i(se, { children: /* @__PURE__ */ i(Ie, { children: /* @__PURE__ */ c(d, { direction: "column", gap: "24px", children: [
-      /* @__PURE__ */ i(d, { direction: "column", gap: "24px", children: /* @__PURE__ */ c(d, { alignItems: "center", justifyContent: "space-between", children: [
-        /* @__PURE__ */ i(f, { type: "title", size: "large", appearance: "dark", weight: "bold", children: r }),
-        /* @__PURE__ */ i(oe, { size: "24px", cursor: "pointer", onClick: a })
+  return se(
+    /* @__PURE__ */ i(Ve, { children: /* @__PURE__ */ i(de, { children: /* @__PURE__ */ i(Ie, { children: /* @__PURE__ */ c(s, { direction: "column", gap: "24px", children: [
+      /* @__PURE__ */ i(s, { direction: "column", gap: "24px", children: /* @__PURE__ */ c(s, { alignItems: "center", justifyContent: "space-between", children: [
+        /* @__PURE__ */ i(f, { type: "title", size: "large", appearance: "dark", weight: "bold", children: o }),
+        /* @__PURE__ */ i(re, { size: "24px", cursor: "pointer", onClick: a })
       ] }) }),
       e
     ] }) }) }) }),
-    o
+    r
   );
 }, Ue = ne`
   from {
@@ -691,7 +691,7 @@ const _ = (t) => {
     opacity: 1;
     transform: translateY(0);
   }
-`, W = b.div`
+`, K = b.div`
   width: 100%;
   height: 100%;
   & > div {
@@ -700,7 +700,7 @@ const _ = (t) => {
 `;
 b.div`
   border-radius: 8px;
-  border: 1px solid ${x.palette.neutral.N30};
+  border: 1px solid ${y.palette.neutral.N30};
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
@@ -733,16 +733,16 @@ const _e = b.div`
 `, $e = b.div`
   & > div > div {
     border-radius: 8px;
-    border: 1px solid ${x.palette.neutral.N30};
+    border: 1px solid ${y.palette.neutral.N30};
     box-sizing: border-box;
     box-shadow: 0px 4px 8px 3px rgba(0, 0, 0, 0.1);
   }
 `, ze = b.div`
   & > div {
-    background-color: ${x.palette.neutral.N30};
+    background-color: ${y.palette.neutral.N10};
     justify-content: center;
   }
-  min-height: 300px;
+  min-height: 350px;
   width: 100%;
   height: 100%;
   padding-bottom: 12px;
@@ -750,7 +750,7 @@ const _e = b.div`
 b.div`
   & > div {
     border-radius: 8px;
-    border: 1px solid ${x.palette.neutral.N30};
+    border: 1px solid ${y.palette.neutral.N30};
   }
 `;
 function qe({
@@ -758,14 +758,14 @@ function qe({
   handleOpenModal: e
 }) {
   return /* @__PURE__ */ i(
-    _,
+    z,
     {
       id: `loading-card-${t}`,
       handleDelete: () => {
       },
       handleView: () => e ? e() : null,
       controls: !1,
-      children: /* @__PURE__ */ i(Y, { loading: !0 })
+      children: /* @__PURE__ */ i(J, { loading: !0 })
     },
     `loading-card-${t}`
   );
@@ -775,43 +775,44 @@ function Oe({
   controls: e,
   handleOpenModal: n,
   handleDelete: a,
-  textValues: r
+  textValues: o
 }) {
-  return t ? /* @__PURE__ */ i(W, { children: /* @__PURE__ */ c(d, { direction: "column", gap: "4px", width: "100%", padding: "0 0 12px 0", children: [
+  return t ? /* @__PURE__ */ i(K, { children: /* @__PURE__ */ c(s, { direction: "column", gap: "4px", width: "100%", padding: "0 0 12px 0", children: [
     /* @__PURE__ */ i(f, { type: "title", size: "medium", appearance: "gray", weight: "bold", children: t.decisionId }),
     /* @__PURE__ */ i(
-      _,
+      z,
       {
         id: t.decisionId,
         handleDelete: () => a ? a(t.decisionId) : null,
         handleView: () => n ? n(t) : null,
         controls: e,
-        children: /* @__PURE__ */ i(Y, { decision: t, textValues: r })
+        children: /* @__PURE__ */ i(J, { decision: t, textValues: o })
       }
     )
   ] }) }, t.decisionId) : null;
 }
 function je({
   index: t,
-  handleOpenModal: e
+  handleOpenModal: e,
+  customTitleContentAddCard: n
 }) {
-  return /* @__PURE__ */ i(W, { children: /* @__PURE__ */ c(d, { direction: "column", gap: "4px", width: "100%", height: "100%", children: [
+  return /* @__PURE__ */ i(K, { children: /* @__PURE__ */ c(s, { direction: "column", gap: "4px", width: "100%", height: "100%", children: [
     /* @__PURE__ */ i(f, { type: "title", size: "medium", appearance: "gray", weight: "bold", children: "Nueva decisión" }),
     /* @__PURE__ */ i(
       ze,
       {
         onClick: () => e ? e() : null,
         children: /* @__PURE__ */ i(
-          _,
+          z,
           {
             id: `add-decision-${t}`,
             handleDelete: () => {
             },
             handleView: () => e ? e() : null,
             controls: !1,
-            children: /* @__PURE__ */ c(d, { direction: "column", gap: "12px", alignItems: "center", children: [
-              /* @__PURE__ */ i(Q, { appearance: "gray", icon: /* @__PURE__ */ i(le, {}), size: "35px" }),
-              /* @__PURE__ */ i(f, { appearance: "gray", type: "body", size: "large", children: "Agregar decisión" })
+            children: /* @__PURE__ */ c(s, { direction: "column", gap: "12px", alignItems: "center", children: [
+              /* @__PURE__ */ i(W, { appearance: "gray", icon: /* @__PURE__ */ i(le, {}), size: "35px" }),
+              /* @__PURE__ */ i(f, { appearance: "gray", type: "body", size: "large", children: n || "Agregar decisión" })
             ] })
           }
         )
@@ -824,67 +825,75 @@ const He = {
   decision: Oe,
   add: je
 };
-function R(t) {
+function _(t) {
   const { type: e } = t, n = He[e];
   return n ? n(t) : null;
 }
 function Me({
   controls: t,
-  decisions: e,
-  loading: n,
-  handleOpenModal: a,
+  customTitleContentAddCard: e,
+  decisions: n,
+  loading: a,
+  handleOpenModal: o,
   handleDelete: r,
-  textValues: o
+  textValues: d
 }) {
-  const s = n ? Array.from({ length: 3 }).map(
-    (u, l) => R({
+  const u = a ? Array.from({ length: 3 }).map(
+    (l, p) => _({
       type: "loading",
-      index: l,
+      index: p,
       controls: t,
-      loading: n,
-      handleOpenModal: a,
+      customTitleContentAddCard: e,
+      loading: a,
+      handleOpenModal: o,
       handleDelete: r,
-      textValues: o
+      textValues: d
     })
-  ) : e.map(
-    (u) => R({
+  ) : n.map(
+    (l) => _({
       type: "decision",
-      decision: u,
+      decision: l,
       controls: t,
-      loading: n,
-      handleOpenModal: a,
+      customTitleContentAddCard: e,
+      loading: a,
+      handleOpenModal: o,
       handleDelete: r,
-      textValues: o
+      textValues: d
     })
-  ), h = (e.length === 0 || e.length < Math.floor(window.innerWidth / 300)) && !n && t;
-  return { renderedCards: s, shouldRenderAddCard: h };
+  ), h = (n.length === 0 || n.length < Math.floor(window.innerWidth / 300)) && !a && t;
+  return { renderedCards: u, shouldRenderAddCard: h };
 }
 const gt = (t) => {
   const {
     controls: e = !0,
-    decisions: n,
-    textValues: a,
-    decisionTemplate: r,
-    isModalOpen: o,
-    selectedDecision: s,
-    loading: h,
-    handleOpenModal: u,
-    handleCloseModal: l,
-    handleSubmitForm: p,
-    handleDelete: m
-  } = t, g = he("(max-width: 681px)"), { renderedCards: k, shouldRenderAddCard: S } = Me({
+    customTitleContentAddCard: n,
+    customMessageEmptyDecisions: a,
+    decisions: o,
+    textValues: r,
+    decisionTemplate: d,
+    isModalOpen: u,
+    selectedDecision: h,
+    loading: l,
+    handleOpenModal: p,
+    handleCloseModal: m,
+    handleSubmitForm: g,
+    handleDelete: C
+  } = t, S = he("(max-width: 681px)"), { renderedCards: V, shouldRenderAddCard: I } = Me({
     controls: e,
-    decisions: n,
-    loading: h,
-    handleOpenModal: u,
-    handleDelete: m,
-    textValues: a
+    customTitleContentAddCard: n,
+    decisions: o,
+    loading: l,
+    handleOpenModal: p,
+    handleDelete: C,
+    textValues: r
   });
-  return /* @__PURE__ */ c(N, { children: [
-    /* @__PURE__ */ i($e, { children: /* @__PURE__ */ i(_e, { children: /* @__PURE__ */ c(d, { direction: "column", gap: "16px", padding: "6px", children: [
-      n.length === 0 && !h && /* @__PURE__ */ c(f, { as: "span", type: "label", size: "large", appearance: "gray", children: [
-        "Aún no tienes definidas tasas de interés efectivas. Presiona",
-        /* @__PURE__ */ i(
+  return /* @__PURE__ */ c(k, { children: [
+    /* @__PURE__ */ i($e, { children: /* @__PURE__ */ i(_e, { children: /* @__PURE__ */ c(s, { direction: "column", gap: "16px", padding: "6px", children: [
+      o.length === 0 && !l && /* @__PURE__ */ c(f, { as: "span", type: "label", size: "large", appearance: "gray", children: [
+        a || "Aún NO tienes definidas tasas de interés efectivas",
+        ". Presiona",
+        " ",
+        /* @__PURE__ */ c(
           f,
           {
             as: "span",
@@ -892,9 +901,14 @@ const gt = (t) => {
             size: "large",
             appearance: "gray",
             weight: "bold",
-            children: "“+ Agregar decisión”"
+            children: [
+              "“",
+              n || "+ Agregar decisión",
+              "”"
+            ]
           }
         ),
+        " ",
         "para empezar."
       ] }),
       /* @__PURE__ */ c(
@@ -908,35 +922,36 @@ const gt = (t) => {
           autoRows: "1fr",
           justifyItems: "center",
           padding: "6px",
-          height: g ? "auto" : "484px",
+          height: S ? "auto" : "484px",
           children: [
-            k,
-            S && R({
+            V,
+            I && _({
               type: "add",
-              index: n.length,
+              index: o.length,
               controls: e,
-              loading: h,
-              handleOpenModal: u,
-              handleDelete: m,
-              textValues: a
+              customTitleContentAddCard: n,
+              loading: l,
+              handleOpenModal: p,
+              handleDelete: C,
+              textValues: r
             })
           ]
         }
       )
     ] }) }) }),
-    o && /* @__PURE__ */ i(
+    u && /* @__PURE__ */ i(
       Re,
       {
         portalId: "modal-portal",
-        onCloseModal: l,
-        title: s ? "Editar Decisión" : "Nueva decisión",
+        onCloseModal: m,
+        title: h ? "Editar Decisión" : "Nueva decisión",
         children: /* @__PURE__ */ i(
           we,
           {
-            decision: s || r,
-            onSubmitEvent: p,
-            textValues: a,
-            onCancel: () => l ? l() : () => {
+            decision: h || d,
+            onSubmitEvent: g,
+            textValues: r,
+            onCancel: () => m ? m() : () => {
             }
           }
         )
@@ -946,7 +961,7 @@ const gt = (t) => {
 }, bt = (t) => {
   var a;
   const e = { ...t }, n = (a = e.conditionThatEstablishesTheDecision) == null ? void 0 : a.find(
-    (r) => r.switchPlaces
+    (o) => o.switchPlaces
   );
   return n ? {
     ...e,
@@ -956,13 +971,13 @@ const gt = (t) => {
     value: n.value,
     howToSetTheDecision: n.howToSetTheCondition,
     conditionThatEstablishesTheDecision: e.conditionThatEstablishesTheDecision.map(
-      (r) => r.conditionName === n.conditionName ? { ...r, hidden: !0 } : r
+      (o) => o.conditionName === n.conditionName ? { ...o, hidden: !0 } : o
     )
   } : e;
 }, Tt = (t) => t.map((e) => {
   var a;
   const n = (a = e.conditionThatEstablishesTheDecision) == null ? void 0 : a.find(
-    (r) => r.switchPlaces
+    (o) => o.switchPlaces
   );
   return n ? {
     ...e,
@@ -972,7 +987,7 @@ const gt = (t) => {
     value: n.value,
     howToSetTheDecision: n.howToSetTheCondition,
     conditionThatEstablishesTheDecision: e.conditionThatEstablishesTheDecision.map(
-      (r) => r.conditionName === n.conditionName ? { ...r, hidden: !0 } : r
+      (o) => o.conditionName === n.conditionName ? { ...o, hidden: !0 } : o
     )
   } : e;
 }), ft = (t, e) => {
@@ -991,10 +1006,10 @@ const gt = (t) => {
       (a) => a.hidden ? { ...n } : a
     )
   };
-}, yt = (t) => t.map((e) => {
+}, vt = (t) => t.map((e) => {
   var a;
   const n = (a = e.conditionThatEstablishesTheDecision) == null ? void 0 : a.find(
-    (r) => r.hidden
+    (o) => o.hidden
   );
   return n ? {
     ...e,
@@ -1004,18 +1019,18 @@ const gt = (t) => {
     value: e.value,
     howToSetTheDecision: e.howToSetTheDecision,
     conditionThatEstablishesTheDecision: e.conditionThatEstablishesTheDecision.map(
-      (r) => r.hidden ? { ...n, hidden: !1 } : r
+      (o) => o.hidden ? { ...n, hidden: !1 } : o
     )
   } : e;
 });
 export {
-  _ as BusinessRuleCard,
-  Y as BusinessRuleView,
+  z as BusinessRuleCard,
+  J as BusinessRuleView,
   gt as BusinessRules,
   Re as ModalRules,
   we as RulesForm,
   ft as revertSortedDataSampleSwitchPlaces,
-  yt as revertSortedDataSwitchPlaces,
+  vt as revertSortedDataSwitchPlaces,
   bt as sortDisplayDataSampleSwitchPlaces,
   Tt as sortDisplayDataSwitchPlaces
 };

package/package.json

@@ -10,7 +10,7 @@
   ],
   "description": "",
   "private": false,
-  "version": "0.1.34",
+  "version": "0.1.35",
   "type": "module",
   "exports": {
     ".": {