reactive-bulma 4.3.27 → 4.4.0

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

@@ -1,44 +1,68 @@
-import { jsx as a } from "react/jsx-runtime";
-import { parseClasses as r, parseTestId as s } from "../../../functions/parsers.js";
-const f = ({
+import { jsxs as g, jsx as c } from "react/jsx-runtime";
+import { useMemo as e } from "react";
+import { parseClasses as i, parseTestId as p } from "../../../functions/parsers.js";
+import j from "../Icon/index.js";
+const y = ({
   testId: l = null,
-  containerTestId: d = null,
-  cssClasses: n = null,
-  containerCssClasses: e = null,
-  style: m = null,
-  containerStyle: c = null,
-  text: u,
-  isActiveItem: i = null,
+  containerTestId: t = null,
+  cssClasses: d = null,
+  containerCssClasses: r = null,
+  style: u = null,
+  containerStyle: I = null,
+  text: n,
+  icon: m = null,
+  isActiveItem: o = null,
   onClick: b = null
 }) => {
-  const o = r([
-    "breadcrumb-item-container",
-    i ? "is-active" : null,
-    e
-  ]), t = r(["breadcrumbItem", n]), I = d ?? s({
-    tag: "breadcrumb-item-container",
-    parsedClasses: e ?? ""
-  }), p = l ?? s({ tag: "breadcrumbItem", parsedClasses: t });
-  return /* @__PURE__ */ a(
+  const f = e(
+    () => i([
+      "breadcrumb-item-container",
+      o ? "is-active" : null,
+      r
+    ]),
+    [o, r]
+  ), a = e(
+    () => i(["breadcrumbItem", d]),
+    [d]
+  ), h = e(
+    () => t ?? p({
+      tag: "breadcrumb-item-container",
+      parsedClasses: r ?? ""
+    }),
+    [t, r]
+  ), s = e(
+    () => l ?? p({
+      tag: "breadcrumbItem",
+      parsedClasses: a
+    }),
+    [l, a]
+  ), v = e(
+    () => /* @__PURE__ */ g(
+      "a",
+      {
+        "data-testid": s,
+        className: a,
+        style: u ?? void 0,
+        "aria-hidden": "true",
+        onClick: b ?? void 0,
+        children: [
+          m ? /* @__PURE__ */ c(j, { ...m }) : null,
+          n
+        ]
+      }
+    ),
+    [s, a, u, b, m, n]
+  );
+  return /* @__PURE__ */ c(
     "li",
     {
-      "data-testid": I,
-      className: o,
-      style: c ?? void 0,
-      children: /* @__PURE__ */ a(
-        "a",
-        {
-          "data-testid": p,
-          className: t,
-          style: m ?? void 0,
-          "aria-hidden": "true",
-          onClick: b ?? void 0,
-          children: u
-        }
-      )
+      "data-testid": h,
+      className: f,
+      style: I ?? void 0,
+      children: v
     }
   );
 };
 export {
-  f as default
+  y as default
 };

package/dist/components/atoms/BreadcrumbItem/index.stories.d.ts

@@ -4,3 +4,4 @@ declare const _default: Meta<typeof BreadcrumbItem>;
 export default _default;
 export declare const BasicExample: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').BreadcrumbItemProps>;
 export declare const IsActiveItem: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').BreadcrumbItemProps>;
+export declare const WithIcon: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').BreadcrumbItemProps>;

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

@@ -1,46 +1,84 @@
-import { jsx as v } from "react/jsx-runtime";
-import { parseClasses as h, parseTestId as x } from "../../../functions/parsers.js";
+import { jsx as $ } from "react/jsx-runtime";
+import { useMemo as L } from "react";
+import { COMMON_CLASSES as l } from "../../../constants/classes.js";
+import { parseClasses as U, parseTestId as c } from "../../../functions/parsers.js";
 const j = ({
   testId: s = null,
-  cssClasses: t = null,
-  style: e = null,
-  type: n = "button",
-  text: a = null,
-  isDisabled: u = !1,
-  color: o = null,
-  isLightColor: i = !1,
-  isInvertedColor: d = !1,
-  isOutlined: r = !1,
-  isRounded: f = !1,
-  isLoading: c = !1,
-  isStatic: b = !1,
-  isSelected: p = !1,
-  size: m = null,
-  onClick: C = null
+  cssClasses: e = null,
+  style: f = null,
+  type: O = "button",
+  isAnAnchor: v = !1,
+  anchorHref: A = null,
+  text: o = null,
+  isDisabled: r = !1,
+  color: n = null,
+  colorMode: u = null,
+  isInvertedColor: m = !1,
+  isOutlined: E = !1,
+  isRounded: I = !1,
+  isLoading: d = !1,
+  isStatic: N = !1,
+  isSelected: S = !1,
+  isFullWidth: T = !1,
+  isResponsive: b = !1,
+  size: t = null,
+  onClick: p = null
 }) => {
-  const l = h([
-    "button",
-    o,
-    i ? "is-light" : null,
-    d ? "is-inverted" : null,
-    r ? "is-outlined" : null,
-    f ? "is-rounded" : null,
-    c ? "is-loading" : null,
-    b ? "is-static" : null,
-    p ? "is-selected" : null,
-    m,
-    t
-  ]), g = s ?? x({ tag: "button", parsedClasses: l });
-  return /* @__PURE__ */ v(
+  const C = "button", a = L(
+    () => U([
+      C,
+      n ? `${l.IS}${n}` : null,
+      u ? `${l.IS}${u}` : null,
+      m ? l.INVERTED : null,
+      E ? l.OUTLINED : null,
+      I ? l.ROUNDED : null,
+      d ? l.LOADING : null,
+      N ? l.STATIC : null,
+      S ? l.SELECTED : null,
+      T ? l.FULL_WIDTH : null,
+      b ? l.RESPONSIVE : null,
+      t ? `${l.IS}${t}` : null,
+      e
+    ]),
+    [
+      n,
+      u,
+      m,
+      E,
+      I,
+      d,
+      N,
+      S,
+      T,
+      b,
+      t,
+      e
+    ]
+  ), D = L(
+    () => s ?? c({ tag: C, parsedClasses: a }),
+    [s, a]
+  );
+  return v ? /* @__PURE__ */ $(
+    "a",
+    {
+      "data-testid": D,
+      className: a,
+      style: f ?? void 0,
+      "aria-disabled": r,
+      href: A ?? void 0,
+      onClick: p ?? void 0,
+      children: o
+    }
+  ) : /* @__PURE__ */ $(
     "button",
     {
-      "data-testid": g,
-      type: n,
-      className: l,
-      style: e ?? void 0,
-      disabled: u ?? !1,
-      onClick: C ?? void 0,
-      children: a
+      "data-testid": D,
+      type: O,
+      className: a,
+      style: f ?? void 0,
+      disabled: r,
+      onClick: p ?? void 0,
+      children: o
     }
   );
 };

package/dist/components/atoms/Button/index.stories.d.ts

@@ -4,11 +4,16 @@ declare const _default: Meta<typeof Button>;
 export default _default;
 export declare const NoText: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const WithText: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
+export declare const AsAnAnchor: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const Colored: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
+export declare const LightColor: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
+export declare const DarkColor: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const InvertedColor: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const OutlinedColor: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const Rounded: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const LoadingState: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const LargeSize: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
+export declare const FullWidth: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
+export declare const Responsive: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const Disabled: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;
 export declare const Static: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').ButtonProps>;

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

@@ -1,60 +1,67 @@
-import { jsxs as y, jsx as t } from "react/jsx-runtime";
-import { parseClasses as f, parseTestId as c } from "../../../functions/parsers.js";
-const l = (e) => e ? "-with-component" : "", v = ({
-  testId: e = null,
+import { jsxs as C, jsx as l } from "react/jsx-runtime";
+import { useMemo as t } from "react";
+import { parseClasses as g, parseTestId as n } from "../../../functions/parsers.js";
+const a = (s) => s ? "-with-component" : "", I = ({
+  testId: s = null,
   containerTestId: o = null,
-  cssClasses: a = null,
-  containerCssClasses: n = null,
-  style: d = null,
-  containerStyle: i = null,
-  label: s = null,
-  isChecked: r,
+  cssClasses: d = null,
+  containerCssClasses: c = null,
+  style: i = null,
+  containerStyle: r = null,
+  label: e = null,
+  isChecked: p,
   name: h,
-  isDisabled: p = !1,
-  onClick: x,
-  onChange: k,
-  onBlur: b
+  isDisabled: x = !1,
+  onClick: k,
+  onChange: u,
+  onBlur: m
 }) => {
-  const u = f([
-    "checkbox",
-    n
-  ]), C = o ?? c({
-    tag: "checkbox-container",
-    parsedClasses: l(s)
-  }), m = e ?? c({
-    tag: "checkbox",
-    parsedClasses: l(s)
-  });
-  return /* @__PURE__ */ y(
+  const b = t(
+    () => g(["checkbox", c]),
+    [c]
+  ), f = t(
+    () => o ?? n({
+      tag: "checkbox-container",
+      parsedClasses: a(e)
+    }),
+    [o, e]
+  ), y = t(
+    () => s ?? n({
+      tag: "checkbox",
+      parsedClasses: a(e)
+    }),
+    [s, e]
+  );
+  return /* @__PURE__ */ C(
     "label",
     {
-      "data-testid": C,
-      className: u,
-      style: i ?? void 0,
+      "data-testid": f,
+      className: b,
+      style: r ?? void 0,
       children: [
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ l(
           "input",
           {
-            "data-testid": m,
+            "data-testid": y,
             type: "checkbox",
             name: h,
-            className: a ?? void 0,
-            style: d ?? void 0,
-            defaultChecked: r,
-            disabled: p,
-            onClick: x,
-            onChange: k,
-            onBlur: b
+            className: d ?? void 0,
+            style: i ?? void 0,
+            defaultChecked: p,
+            disabled: x,
+            onClick: k,
+            onChange: u,
+            onBlur: m
           }
         ),
-        /* @__PURE__ */ t("p", { style: {
+        /* @__PURE__ */ l("p", { style: {
           display: "inline-block",
           marginLeft: "5px"
-        }, children: s })
+        }, children: e })
       ]
     }
   );
 };
 export {
-  v as default
+  I as default
 };

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

@@ -1,31 +1,32 @@
-import { jsx as m } from "react/jsx-runtime";
-import { parseClasses as c, parseTestId as d } from "../../../functions/parsers.js";
-const f = ({
-  testId: s = null,
-  cssClasses: n = null,
+import { jsx as d } from "react/jsx-runtime";
+import { COMMON_CLASSES as l } from "../../../constants/classes.js";
+import { parseClasses as p, parseTestId as C } from "../../../functions/parsers.js";
+const O = ({
+  testId: a = null,
+  cssClasses: u = null,
   style: e = null,
-  children: o = null,
-  size: t = null,
-  offset: a = null,
-  isNarrow: u = !1
+  children: m = null,
+  size: s = null,
+  offset: n = null,
+  isNarrow: r = !1
 }) => {
-  const l = c([
-    "column",
-    t,
-    a,
-    u ? "is-narrow" : null,
-    n
-  ]), r = s ?? d({ tag: "column", parsedClasses: l });
-  return /* @__PURE__ */ m(
+  const o = "column", t = p([
+    o,
+    s ? `${l.IS}${s}` : null,
+    n ? `${l.OFFSET}${n}` : null,
+    r ? `${l.NARROW}` : null,
+    u
+  ]), c = a ?? C({ tag: o, parsedClasses: t });
+  return /* @__PURE__ */ d(
     "section",
     {
-      "data-testid": r,
-      className: l,
+      "data-testid": c,
+      className: t,
       style: e ?? void 0,
-      children: o
+      children: m
     }
   );
 };
 export {
-  f as default
+  O as default
 };

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

@@ -1,26 +1,31 @@
-import { jsx as n } from "react/jsx-runtime";
-import { parseClasses as r, parseTestId as u } from "../../../functions/parsers.js";
-const c = ({
-  testId: s = null,
-  cssClasses: l = null,
-  style: t = null,
-  size: a = null,
-  onClick: d = null
+import { jsx as r } from "react/jsx-runtime";
+import { COMMON_CLASSES as u } from "../../../constants/classes.js";
+import { parseClasses as m, parseTestId as p } from "../../../functions/parsers.js";
+const f = ({
+  testId: t = null,
+  cssClasses: a = null,
+  style: o = null,
+  size: e = null,
+  onClick: n = null
 }) => {
-  const e = r(["delete", a, l]), o = s ?? u({
-    tag: "delete",
-    parsedClasses: e
+  const s = "delete", l = m([
+    s,
+    e ? `${u.IS}${e}` : null,
+    a
+  ]), d = t ?? p({
+    tag: s,
+    parsedClasses: l
   });
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ r(
     "button",
     {
-      "data-testid": o,
-      className: e,
-      style: t ?? void 0,
-      onClick: d ?? void 0
+      "data-testid": d,
+      className: l,
+      style: o ?? void 0,
+      onClick: n ?? void 0
     }
   );
 };
 export {
-  c as default
+  f as default
 };

package/dist/components/atoms/GridCell/index.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { GridCellProps } from '../../../interfaces/atomProps';
+declare const GridCell: React.FC<GridCellProps>;
+export default GridCell;

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

@@ -0,0 +1,40 @@
+import { jsx as c } from "react/jsx-runtime";
+import { COMMON_CLASSES as m } from "../../../constants/classes.js";
+import { parseClasses as f, parseTestId as p } from "../../../functions/parsers.js";
+const M = ({
+  testId: a = null,
+  cssClasses: d = null,
+  style: o = null,
+  children: C = null,
+  position: l = null,
+  colStart: s = null,
+  rowStart: e = null,
+  colStartFromEnd: n = null,
+  rowStartFromEnd: u = null,
+  colSpan: i = null,
+  rowSpan: r = null
+}) => {
+  const t = f([
+    "cell",
+    l ? `${m.IS}${l}` : null,
+    s ? `is-col-start-${s}` : null,
+    e ? `is-row-start-${e}` : null,
+    n ? `is-col-from-end-${n}` : null,
+    u ? `is-row-from-end-${u}` : null,
+    i ? `is-col-span-${i}` : null,
+    r ? `is-row-span-${r}` : null,
+    d
+  ]), $ = a ?? p({ tag: "cell", parsedClasses: t });
+  return /* @__PURE__ */ c(
+    "section",
+    {
+      "data-testid": $,
+      className: t,
+      style: o ?? void 0,
+      children: C
+    }
+  );
+};
+export {
+  M as default
+};

package/dist/components/atoms/GridCell/index.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta } from '@storybook/react';
+import { default as GridCell } from '.';
+declare const _default: Meta<typeof GridCell>;
+export default _default;
+export declare const BasicExample: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('../../../interfaces/atomProps').GridCellProps>;