reactive-bulma 4.1.4 → 4.2.0

package/dist/components/atoms/Checkbox/index.js

@@ -1,42 +1,48 @@
-import { jsxs as x, jsx as b } from "react/jsx-runtime";
-import { parseClasses as C, parseTestId as l } from "../../../functions/parsers.js";
-const a = (s) => typeof s == "string" ? `-${s == null ? void 0 : s.toString()}` : s !== null ? "-with-component" : "", m = ({
+import { jsxs as C, jsx as f } from "react/jsx-runtime";
+import { parseClasses as m, parseTestId as l } from "../../../functions/parsers.js";
+const a = (s) => typeof s == "string" ? `-${s == null ? void 0 : s.toString()}` : s !== null ? "-with-component" : "", I = ({
   testId: s = null,
   containerTestId: r = null,
   cssClasses: t = null,
   containerCssClasses: o = null,
   style: i = null,
-  containerStyle: n = null,
+  containerStyle: c = null,
   content: e = null,
-  isDisabled: d = null,
-  onChange: c = null
+  name: d,
+  isDisabled: n = null,
+  onClick: u,
+  onChange: p,
+  onBlur: x
 }) => {
-  const u = C([
+  const h = m([
     "checkbox",
     o
-  ]), p = r ?? l({
+  ]), b = r ?? l({
     tag: "checkbox-container",
     parsedClasses: a(e)
-  }), h = s ?? l({
+  }), k = s ?? l({
     tag: "checkbox",
     parsedClasses: a(e)
   });
-  return /* @__PURE__ */ x(
+  return /* @__PURE__ */ C(
     "label",
     {
-      "data-testid": p,
-      className: u,
-      style: n ?? void 0,
+      "data-testid": b,
+      className: h,
+      style: c ?? void 0,
       children: [
-        /* @__PURE__ */ b(
+        /* @__PURE__ */ f(
           "input",
           {
-            "data-testid": h,
+            "data-testid": k,
             type: "checkbox",
+            name: d,
             className: t ?? void 0,
             style: i ?? void 0,
-            disabled: d ?? !1,
-            onChange: c ?? void 0
+            disabled: n ?? !1,
+            onClick: u,
+            onChange: p,
+            onBlur: x
           }
         ),
         e
@@ -45,5 +51,5 @@ const a = (s) => typeof s == "string" ? `-${s == null ? void 0 : s.toString()}`
   );
 };
 export {
-  m as default
+  I as default
 };

package/dist/components/atoms/File/index.js

@@ -1,33 +1,36 @@
 import { jsx as l, jsxs as i } from "react/jsx-runtime";
-import N from "../Icon/index.js";
-import { parseClasses as v, parseTestId as y } from "../../../functions/parsers.js";
-const k = ({
+import j from "../Icon/index.js";
+import { parseClasses as v, parseTestId as E } from "../../../functions/parsers.js";
+const $ = ({
   testId: t = null,
   containerTestId: r = null,
   cssClasses: u = null,
-  containerCssClasses: o = null,
-  style: c = null,
+  containerCssClasses: c = null,
+  style: o = null,
   containerStyle: f = null,
   fileName: e = null,
+  name: p,
   uploadIcon: s = { iconLabel: "upload" },
-  uploadText: p = "Choose a file…",
-  buttonOnRight: d = !1,
-  isFullWidth: m = !1,
-  isBoxed: h = !1,
-  color: C = null,
-  size: g = null,
-  onClick: x = null
+  uploadText: d = "Choose a file…",
+  buttonOnRight: m = !1,
+  isFullWidth: h = !1,
+  isBoxed: C = !1,
+  color: g = null,
+  size: x = null,
+  onClick: b,
+  onChange: I,
+  onBlur: N
 }) => {
   const a = v([
     "file",
     e ? "has-name" : null,
-    d ? "is-right" : null,
-    m ? "is-fullwidth" : null,
-    h ? "is-boxed" : null,
-    C,
+    m ? "is-right" : null,
+    h ? "is-fullwidth" : null,
+    C ? "is-boxed" : null,
     g,
-    o
-  ]), n = r ?? y({
+    x,
+    c
+  ]), n = r ?? E({
     tag: "file",
     parsedClasses: a,
     rules: [
@@ -40,7 +43,7 @@ const k = ({
         replacer: ""
       }
     ]
-  }), b = u ?? "file-input", I = t ?? `${n}-input`;
+  }), y = u ?? "file-input", T = t ?? `${n}-input`;
   return /* @__PURE__ */ l(
     "section",
     {
@@ -51,17 +54,19 @@ const k = ({
         /* @__PURE__ */ l(
           "input",
           {
-            "data-testid": I,
+            "data-testid": T,
             type: "file",
-            name: "resume",
-            className: b,
-            style: c ?? void 0,
-            onClick: x ?? void 0
+            name: p,
+            className: y,
+            style: o ?? void 0,
+            onClick: b,
+            onChange: I,
+            onBlur: N
           }
         ),
         /* @__PURE__ */ i("span", { className: "file-cta", children: [
-          s ? /* @__PURE__ */ l(N, { ...s }) : null,
-          /* @__PURE__ */ l("span", { className: "file-label", children: p })
+          s ? /* @__PURE__ */ l(j, { ...s }) : null,
+          /* @__PURE__ */ l("span", { className: "file-label", children: d })
         ] }),
         e ? /* @__PURE__ */ l("span", { className: "file-name", children: e }) : null
       ] })
@@ -69,5 +74,5 @@ const k = ({
   );
 };
 export {
-  k as default
+  $ as default
 };

package/dist/components/atoms/Input/index.js

@@ -1,50 +1,54 @@
-import { jsx as h } from "react/jsx-runtime";
-import { parseClasses as I, parseTestId as g } from "../../../functions/parsers.js";
-const T = ({
-  testId: n = null,
-  cssClasses: s = null,
-  style: e = null,
+import { jsx as x } from "react/jsx-runtime";
+import { parseClasses as y, parseTestId as T } from "../../../functions/parsers.js";
+const j = ({
+  testId: s = null,
+  cssClasses: e = null,
+  style: n = null,
   type: u,
-  text: t = null,
-  placeholder: a = null,
-  isDisabled: d = !1,
+  value: t = null,
+  name: a,
+  placeholder: d = null,
+  isDisabled: i = !1,
   isReadonly: o = !1,
-  color: i = null,
-  size: r = null,
-  isRounded: p = null,
+  color: r = null,
+  size: p = null,
+  isRounded: f = null,
   isHovered: c = null,
-  isFocused: f = null,
-  onClick: v = null,
-  onChange: m = null
+  isFocused: m = null,
+  onClick: v,
+  onChange: C,
+  onBlur: I
 }) => {
-  const l = I([
+  const l = y([
     "input",
-    i,
     r,
-    p ? "is-rounded" : null,
+    p,
+    f ? "is-rounded" : null,
     c ? "is-hovered" : null,
-    f ? "is-focused" : null,
-    s
-  ]), C = n ?? g({
+    m ? "is-focused" : null,
+    e
+  ]), h = s ?? T({
     tag: "input",
     parsedClasses: l
   });
-  return /* @__PURE__ */ h(
+  return /* @__PURE__ */ x(
     "input",
     {
-      "data-testid": C,
+      "data-testid": h,
       type: u,
-      placeholder: a ?? void 0,
+      placeholder: d ?? void 0,
       defaultValue: t ?? void 0,
-      disabled: d,
+      name: a,
+      disabled: i,
       readOnly: o,
       className: l,
-      style: e ?? void 0,
-      onClick: v ?? void 0,
-      onChange: m ?? void 0
+      style: n ?? void 0,
+      onClick: v,
+      onChange: C,
+      onBlur: I
     }
   );
 };
 export {
-  T as default
+  j as default
 };

package/dist/components/atoms/RadioButton/index.js

@@ -1,71 +1,83 @@
-import { jsx as u, jsxs as c } from "react/jsx-runtime";
-import { parseClasses as m, parseTestId as p } from "../../../functions/parsers.js";
-const C = (s, t) => {
+import { jsx as m, jsxs as f } from "react/jsx-runtime";
+import { useMemo as C } from "react";
+import { parseClasses as B, parseTestId as b } from "../../../functions/parsers.js";
+const h = (d, t) => {
   const {
-    testId: a = null,
-    label: n,
-    name: o,
-    isChecked: l = !1,
-    isDisabled: e = !1,
-    style: d = null,
-    onChange: i
-  } = s, r = a ?? `test-radio-button-item-${t}`;
-  return /* @__PURE__ */ c(
+    testId: r = null,
+    label: e,
+    name: s,
+    isChecked: a = !1,
+    isDisabled: o = !1,
+    style: n = null,
+    onClick: l,
+    onChange: i,
+    onBlur: u
+  } = d, c = r ?? `test-radio-button-item-${t}`;
+  return /* @__PURE__ */ f(
     "label",
     {
       className: "radio",
       children: [
-        /* @__PURE__ */ u(
+        /* @__PURE__ */ m(
           "input",
           {
-            "data-testid": r,
+            "data-testid": c,
             type: "radio",
-            style: d ?? void 0,
-            name: o,
-            defaultChecked: l,
-            disabled: e,
-            onChange: i
+            style: n ?? void 0,
+            name: s,
+            defaultChecked: a,
+            disabled: o,
+            onClick: l,
+            onChange: i,
+            onBlur: u
           }
         ),
-        n
+        e
       ]
     },
     t
   );
-}, b = ({
-  containerTestId: s = null,
+}, T = ({
+  containerTestId: d = null,
   containerCssClasses: t = null,
-  containerStyle: a = null,
-  options: n,
-  name: o,
-  onChange: l = null
+  containerStyle: r = null,
+  options: e,
+  name: s,
+  onClick: a,
+  onChange: o,
+  onBlur: n
 }) => {
-  const e = m([
+  const l = B([
     "control",
     t
-  ]), d = s ?? p({
+  ]), i = d ?? b({
     tag: "container-",
-    parsedClasses: e
-  });
-  return /* @__PURE__ */ u(
+    parsedClasses: l
+  }), u = C(
+    () => e.map(
+      (c, p) => h(
+        {
+          ...c,
+          name: s,
+          onClick: a,
+          onChange: o,
+          onBlur: n
+        },
+        p
+      )
+    ),
+    [e, s, a, o, n]
+  );
+  return /* @__PURE__ */ m(
     "section",
     {
-      "data-testid": d,
-      className: e,
-      style: a ?? void 0,
-      children: n.map(
-        (i, r) => C(
-          {
-            ...i,
-            name: o,
-            onChange: l ?? void 0
-          },
-          r
-        )
-      )
+      "data-testid": i,
+      className: l,
+      style: r ?? void 0,
+      children: u
     }
   );
 };
 export {
-  b as default
+  T as default
 };

package/dist/components/atoms/Select/index.js

@@ -1,39 +1,42 @@
 import { jsx as e } from "react/jsx-runtime";
-import { parseClasses as k, parseTestId as x } from "../../../functions/parsers.js";
-const j = ({
+import { parseClasses as j, parseTestId as k } from "../../../functions/parsers.js";
+const q = ({
   testId: n = null,
   containerTestId: a = null,
   cssClasses: o = null,
-  containerCssClasses: i = null,
-  style: d = null,
+  containerCssClasses: d = null,
+  style: i = null,
   containerStyle: c = null,
   options: u = [],
-  showOptions: r = 1,
+  name: r,
+  showOptions: m = 1,
   isMultiple: s = !1,
   color: p = null,
-  size: m = null,
-  isRounded: f = null,
-  isHovered: h = null,
-  isFocused: v = null,
-  onClick: C = null
+  size: f = null,
+  isRounded: h = null,
+  isHovered: v = null,
+  isFocused: C = null,
+  onClick: S,
+  onChange: I,
+  onBlur: T
 }) => {
-  const t = k([
+  const t = j([
     "select",
     p,
-    m,
+    f,
     s ? "is-multiple" : null,
-    f ? "is-rounded" : null,
-    h ? "is-hovered" : null,
-    v ? "is-focused" : null,
-    i
-  ]), l = n ?? x({
+    h ? "is-rounded" : null,
+    v ? "is-hovered" : null,
+    C ? "is-focused" : null,
+    d
+  ]), l = n ?? k({
     tag: "select",
     parsedClasses: t
-  }), S = a ?? `${l}-container`;
+  }), $ = a ?? `${l}-container`;
   return /* @__PURE__ */ e(
     "section",
     {
-      "data-testid": S,
+      "data-testid": $,
       className: t,
       style: c ?? void 0,
       children: /* @__PURE__ */ e(
@@ -41,18 +44,21 @@ const j = ({
         {
           "data-testid": l,
           className: o ?? void 0,
-          style: d ?? void 0,
+          style: i ?? void 0,
+          name: r,
           multiple: s,
-          size: r,
-          children: u.map(({ id: I, name: T, selected: $ }, g) => /* @__PURE__ */ e(
+          size: m,
+          children: u.map(({ id: g, name: x, selected: y }, N) => /* @__PURE__ */ e(
             "option",
             {
-              "data-testid": `${l}-option-${g}`,
-              defaultChecked: $ ?? !1,
-              onClick: C ?? void 0,
-              children: T
+              "data-testid": `${l}-option-${N}`,
+              defaultChecked: y ?? !1,
+              onClick: S,
+              onChange: I,
+              onBlur: T,
+              children: x
             },
-            I.toString()
+            g.toString()
           ))
         }
       )
@@ -60,5 +66,5 @@ const j = ({
   );
 };
 export {
-  j as default
+  q as default
 };

package/dist/components/atoms/TextArea/index.js

@@ -1,31 +1,32 @@
-import { jsx as g } from "react/jsx-runtime";
-import { parseClasses as C, parseTestId as h } from "../../../functions/parsers.js";
-const y = ({
+import { jsx as C } from "react/jsx-runtime";
+import { parseClasses as h, parseTestId as A } from "../../../functions/parsers.js";
+const E = ({
   testId: l = null,
   cssClasses: s = null,
   style: a = null,
-  text: t = null,
-  cols: r = null,
-  rows: n = null,
-  isDisabled: u = !1,
-  isReadonly: o = !1,
-  isFixedSize: d = !1,
-  color: i = null,
-  size: x = null,
-  isHovered: p = null,
-  isFocused: c = null,
-  onClick: f = null,
-  onChange: m = null
+  value: t = null,
+  name: r,
+  cols: n = null,
+  rows: u = null,
+  isDisabled: o = !1,
+  isReadonly: d = !1,
+  isFixedSize: i = !1,
+  color: x = null,
+  size: p = null,
+  isHovered: c = null,
+  isFocused: f = null,
+  onClick: m = null,
+  onChange: v = null
 }) => {
-  const e = C([
+  const e = h([
     "textarea",
-    i,
     x,
-    p ? "is-hovered" : null,
-    c ? "is-focused" : null,
-    d ? "has-fixed-size" : null,
+    p,
+    c ? "is-hovered" : null,
+    f ? "is-focused" : null,
+    i ? "has-fixed-size" : null,
     s
-  ]), v = l ?? h({
+  ]), g = l ?? A({
     tag: "textarea",
     parsedClasses: e,
     rules: [
@@ -39,22 +40,23 @@ const y = ({
       }
     ]
   });
-  return /* @__PURE__ */ g(
+  return /* @__PURE__ */ C(
     "textarea",
     {
-      "data-testid": v,
+      "data-testid": g,
       defaultValue: t ?? void 0,
-      cols: r ?? void 0,
-      rows: n ?? void 0,
-      disabled: u,
-      readOnly: o,
+      name: r,
+      cols: n ?? void 0,
+      rows: u ?? void 0,
+      disabled: o,
+      readOnly: d,
       className: e,
       style: a ?? void 0,
-      onClick: f ?? void 0,
-      onChange: m ?? void 0
+      onClick: m ?? void 0,
+      onChange: v ?? void 0
     }
   );
 };
 export {
-  y as default
+  E as default
 };

package/dist/components/molecules/Breadcrumbs/index.js

@@ -1,8 +1,9 @@
 import { jsx as r } from "react/jsx-runtime";
 import { parseClasses as p, parseTestId as g } from "../../../functions/parsers.js";
+import "react";
 import f from "../../atoms/BreadcrumbItem/index.js";
 import { generateKey as C } from "../../../functions/generators.js";
-const I = ({
+const B = ({
   testId: a = "breadcrumbs",
   containerTestId: s = null,
   cssClasses: l = null,
@@ -59,5 +60,5 @@ const I = ({
   );
 };
 export {
-  I as default
+  B as default
 };

package/dist/components/molecules/ButtonGroup/index.js

@@ -1,8 +1,9 @@
 import { jsx as l } from "react/jsx-runtime";
 import g from "../../atoms/Button/index.js";
 import { parseClasses as b, parseTestId as h } from "../../../functions/parsers.js";
+import "react";
 import { generateKey as C } from "../../../functions/generators.js";
-const S = ({
+const T = ({
   testId: r = null,
   cssClasses: a = null,
   style: n = null,
@@ -54,5 +55,5 @@ const S = ({
   );
 };
 export {
-  S as default
+  T as default
 };

package/dist/components/molecules/ColumnGroup/index.js

@@ -1,6 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
 import { parseClasses as d, parseTestId as C } from "../../../functions/parsers.js";
 import f from "../../atoms/Column/index.js";
+import "react";
 import { generateKey as v } from "../../../functions/generators.js";
 const G = (l) => {
   switch (l) {
@@ -11,24 +12,24 @@ const G = (l) => {
     default:
       return l;
   }
-}, I = ({
+}, T = ({
   testId: l = null,
   cssClasses: n = null,
   style: t = null,
-  listOfColumns: u,
-  isMobileLayout: o = null,
-  isMultiline: r = null,
+  listOfColumns: o,
+  isMobileLayout: r = null,
+  isMultiline: u = null,
   isVerticallyCentered: i = null,
-  isHorizontallyCentered: a = null,
-  gap: m = void 0
+  isHorizontallyCentered: m = null,
+  gap: a = void 0
 }) => {
   const s = d([
     "columns",
-    r ? "is-multiline" : null,
-    o ? "is-mobile" : null,
+    u ? "is-multiline" : null,
+    r ? "is-mobile" : null,
     i ? "is-vcentered" : null,
-    a ? "is-centered" : null,
-    G(m),
+    m ? "is-centered" : null,
+    G(a),
     n
   ]), c = l ?? C({
     tag: "columns",
@@ -40,7 +41,7 @@ const G = (l) => {
       "data-testid": c,
       className: s,
       style: t ?? void 0,
-      children: u.map((p) => /* @__PURE__ */ e(
+      children: o.map((p) => /* @__PURE__ */ e(
         f,
         {
           ...p
@@ -51,5 +52,5 @@ const G = (l) => {
   );
 };
 export {
-  I as default
+  T as default
 };