vrfi-design-system 1.1.29 → 1.1.30

package/dist/index.d.ts

@@ -309,7 +309,7 @@ export declare interface CheckboxProps {
     maxRows?: number;
 }
 
-export declare const CheckboxSelectField: ({ name, label, options, selectedOptions, handleCheckboxChange, className, size, type, required, customInput, ...props }: CheckboxSelectFieldProps) => default_2.JSX.Element;
+export declare const CheckboxSelectField: ({ name, label, options, handleCheckboxChange, className, size, type, required, customInput, ...props }: CheckboxSelectFieldProps) => default_2.JSX.Element;
 
 export declare interface CheckboxSelectFieldProps extends SelectPropsBase {
     selectedOptions?: (string | number)[];

package/dist/main.es.js

@@ -64381,7 +64381,7 @@ const ihe = ({
   mode: "onBlur",
   /**
    * This is an open issue in yup
-   * https://github.com/react-hook-form/resolvers/issues/648 
+   * https://github.com/react-hook-form/resolvers/issues/648
    */
   resolver: e ? ahe(e) : void 0,
   ...t
@@ -65704,107 +65704,110 @@ const nEe = ({
   name: e,
   label: t,
   options: n,
-  selectedOptions: r = [],
-  handleCheckboxChange: o = () => {
+  handleCheckboxChange: r = () => {
   },
-  className: a,
-  size: i,
-  type: l,
-  required: s,
-  customInput: A,
-  ...u
+  className: o,
+  size: a,
+  type: i,
+  required: l,
+  customInput: s,
+  ...A
 }) => {
-  const d = (p, m, b) => {
-    const { label: h, value: w } = p;
-    return w ? /* @__PURE__ */ z.jsxs("div", { className: Wi.customSelectOption, children: [
-      /* @__PURE__ */ z.jsx(
-        yne,
-        {
-          checked: m.includes(w),
-          onChange: () => b(String(w)),
-          label: String(h)
-        }
-      ),
-      /* @__PURE__ */ z.jsx("span", { onClick: () => b(String(h)), children: String(h) })
-    ] }) : null;
-  }, f = gt(
-    l === Uo.SECONDARY || i ? [
+  const u = gt(
+    i === Uo.SECONDARY || a ? [
       cr.BUTTON_CLASS,
-      l === Uo.SECONDARY && cr.BUTTON_CLASS_SECONDARY,
-      i && `${cr.BUTTON_CLASS}-${i}`
+      i === Uo.SECONDARY && cr.BUTTON_CLASS_SECONDARY,
+      a && `${cr.BUTTON_CLASS}-${a}`
     ] : cr.DEFAULT,
     !t && cr.HAS_NO_LABEL
-  ), [v, g] = Pt(!1);
+  ), [d, f] = Pt(!1);
   return /* @__PURE__ */ z.jsx(
     Hf,
     {
       name: e,
-      render: ({ field: p, fieldState: m }) => /* @__PURE__ */ z.jsxs(
-        "div",
-        {
-          className: l && `${cr.BUTTON_CLASS_SECONDARY}-${cr.LABEL}`,
-          children: [
+      render: ({ field: v, fieldState: g }) => {
+        const p = v.value || [], m = (h) => {
+          let w;
+          p.includes(h) ? w = p.filter(
+            (C) => C !== h
+          ) : w = [...p, h], v.onChange(w), r(String(h));
+        }, b = (h) => {
+          const { label: w, value: C } = h;
+          return C ? /* @__PURE__ */ z.jsxs("div", { className: Wi.customSelectOption, children: [
             /* @__PURE__ */ z.jsx(
-              $a,
+              yne,
               {
-                type: l === Uo.TERTIARY ? Jv.PRIMARY : void 0,
-                label: t,
-                value: (u == null ? void 0 : u.value) || p.value,
-                required: s,
-                customInput: A,
-                children: /* @__PURE__ */ z.jsx(
-                  Lr,
-                  {
-                    ...p,
-                    value: p.value,
-                    onChange: (b) => p.onChange(b),
-                    mode: kR.MULTIPLE,
-                    maxTagCount: 1,
-                    tagRender: () => /* @__PURE__ */ z.jsx(mi, { children: r.map(
-                      (b) => {
-                        var h;
-                        return (h = n == null ? void 0 : n.find(
-                          (w) => w.value === b
-                        )) == null ? void 0 : h.label;
-                      }
-                    ).join(", ") }),
-                    status: m.invalid ? cr.ERROR : void 0,
-                    options: n,
-                    optionRender: (b) => d(
-                      b,
-                      r,
-                      o
-                    ),
-                    className: gt(
-                      "selectedItemClass",
-                      f,
-                      a,
-                      {
-                        [Wi.tertiary]: l === Uo.TERTIARY,
-                        [Wi.customInputDropdown]: A === !0
-                      }
-                    ),
-                    size: i,
-                    optionFilterProp: cr.LABEL,
-                    onDropdownVisibleChange: g,
-                    suffixIcon: /* @__PURE__ */ z.jsx(
-                      "i",
-                      {
-                        className: gt(
-                          mt.CANDIDATE_DOWN_ARROW,
-                          v && Wi.rotateArrowIcon
-                        )
-                      }
-                    ),
-                    ...u
-                  }
-                )
+                checked: p.includes(C),
+                onChange: () => m(C),
+                label: String(w)
               }
             ),
-            /* @__PURE__ */ z.jsx(ko, { fieldName: e })
-          ]
-        }
-      )
+            /* @__PURE__ */ z.jsx("span", { onClick: () => m(C), children: String(w) })
+          ] }) : null;
+        };
+        return /* @__PURE__ */ z.jsxs(
+          "div",
+          {
+            className: i && `${cr.BUTTON_CLASS_SECONDARY}-${cr.LABEL}`,
+            children: [
+              /* @__PURE__ */ z.jsx(
+                $a,
+                {
+                  type: i === Uo.TERTIARY ? Jv.PRIMARY : void 0,
+                  label: t,
+                  value: (A == null ? void 0 : A.value) || v.value,
+                  required: l,
+                  customInput: s,
+                  children: /* @__PURE__ */ z.jsx(
+                    Lr,
+                    {
+                      ...v,
+                      value: v.value,
+                      onChange: (h) => v.onChange(h),
+                      mode: kR.MULTIPLE,
+                      maxTagCount: 1,
+                      tagRender: () => /* @__PURE__ */ z.jsx(mi, { children: (v.value || []).map(
+                        (h) => {
+                          var w;
+                          return (w = n == null ? void 0 : n.find(
+                            (C) => C.value === h
+                          )) == null ? void 0 : w.label;
+                        }
+                      ).filter(Boolean).join(", ") }),
+                      status: g.invalid ? cr.ERROR : void 0,
+                      options: n,
+                      optionRender: b,
+                      className: gt(
+                        "selectedItemClass",
+                        u,
+                        o,
+                        {
+                          [Wi.tertiary]: i === Uo.TERTIARY,
+                          [Wi.customInputDropdown]: s === !0
+                        }
+                      ),
+                      size: a,
+                      optionFilterProp: cr.LABEL,
+                      onDropdownVisibleChange: f,
+                      suffixIcon: /* @__PURE__ */ z.jsx(
+                        "i",
+                        {
+                          className: gt(
+                            mt.CANDIDATE_DOWN_ARROW,
+                            d && Wi.rotateArrowIcon
+                          )
+                        }
+                      ),
+                      ...A
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ z.jsx(ko, { fieldName: e })
+            ]
+          }
+        );
+      }
     }
   );
 }, mbe = "_applicationHeader_1yznv_24", gbe = "_headerLeft_1yznv_44", pbe = "_headerRight_1yznv_50", hbe = "_candidateProfile_1yznv_56", bbe = "_userProfileDropdown_1yznv_56", Cbe = "_userNameText_1yznv_64", ybe = "_logo_1yznv_71", wbe = "_icon_1yznv_76", xbe = "_jobTrackLabel_1yznv_80", Ebe = "_searchField_1yznv_176", Ga = {