reactive-bulma 4.3.3 → 4.3.5

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

@@ -12,8 +12,8 @@ const j = ({
   isReadonly: o = !1,
   color: r = null,
   size: p = null,
-  isRounded: f = null,
-  isHovered: c = null,
+  isRounded: c = null,
+  isHovered: f = null,
   isFocused: m = null,
   onClick: v,
   onChange: C,
@@ -23,8 +23,8 @@ const j = ({
     "input",
     r,
     p,
-    f ? "is-rounded" : null,
-    c ? "is-hovered" : null,
+    c ? "is-rounded" : null,
+    f ? "is-hovered" : null,
     m ? "is-focused" : null,
     e
   ]), h = s ?? T({
@@ -37,7 +37,7 @@ const j = ({
       "data-testid": h,
       type: u,
       placeholder: d ?? void 0,
-      defaultValue: t ?? void 0,
+      value: t ?? void 0,
       name: a,
       disabled: i,
       readOnly: o,

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

@@ -1,6 +1,6 @@
 import { jsx as e } from "react/jsx-runtime";
 import { parseClasses as j, parseTestId as k } from "../../../functions/parsers.js";
-const q = ({
+const w = ({
   testId: a = null,
   containerTestId: o = null,
   cssClasses: i = null,
@@ -12,7 +12,7 @@ const q = ({
   selectedValues: m,
   name: f,
   showOptions: v = 1,
-  isMultiple: t = !1,
+  isMultiple: s = !1,
   color: S = null,
   size: h = null,
   isRounded: $ = null,
@@ -22,24 +22,24 @@ const q = ({
   onChange: I,
   onBlur: T
 }) => {
-  const s = j([
+  const t = j([
     "select",
     S,
     h,
-    t ? "is-multiple" : null,
+    s ? "is-multiple" : null,
     $ ? "is-rounded" : null,
     g ? "is-hovered" : null,
     y ? "is-focused" : null,
     d
   ]), l = a ?? k({
     tag: "select",
-    parsedClasses: s
+    parsedClasses: t
   }), x = o ?? `${l}-container`;
   return /* @__PURE__ */ e(
     "section",
     {
       "data-testid": x,
-      className: s,
+      className: t,
       style: c ?? void 0,
       children: /* @__PURE__ */ e(
         "select",
@@ -47,10 +47,10 @@ const q = ({
           "data-testid": l,
           className: i ?? void 0,
           style: u ?? void 0,
-          defaultValue: m,
+          value: m,
           name: f,
           disabled: r ?? !1,
-          multiple: t,
+          multiple: s,
           size: v,
           onClick: C,
           onChange: I,
@@ -70,5 +70,5 @@ const q = ({
   );
 };
 export {
-  q as default
+  w as default
 };

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

@@ -7,16 +7,16 @@ const E = ({
   value: t = null,
   name: r,
   cols: n = null,
-  rows: u = null,
-  isDisabled: o = !1,
+  rows: o = null,
+  isDisabled: u = !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
+  onClick: v = null,
+  onChange: m = null
 }) => {
   const e = h([
     "textarea",
@@ -44,16 +44,16 @@ const E = ({
     "textarea",
     {
       "data-testid": g,
-      defaultValue: t ?? void 0,
+      value: t ?? void 0,
       name: r,
       cols: n ?? void 0,
-      rows: u ?? void 0,
-      disabled: o,
+      rows: o ?? void 0,
+      disabled: u,
       readOnly: d,
       className: e,
       style: a ?? void 0,
-      onClick: m ?? void 0,
-      onChange: v ?? void 0
+      onClick: v ?? void 0,
+      onChange: m ?? void 0
     }
   );
 };

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

@@ -1,5 +1,5 @@
-import { jsxs as f, Fragment as p, jsx as s } from "react/jsx-runtime";
-import { useMemo as n } from "react";
+import { jsxs as f, Fragment as p, jsx as o } from "react/jsx-runtime";
+import { useMemo as m } from "react";
 import { parseClasses as u, parseTestId as I } from "../../../functions/parsers.js";
 import T from "../../atoms/TextArea/index.js";
 import h from "../../atoms/Select/index.js";
@@ -8,7 +8,7 @@ import C from "../../atoms/RadioButton/index.js";
 import E from "../InputControl/index.js";
 import { FormFieldType as l } from "../../../interfaces/moleculeProps.js";
 const x = (r, t) => {
-  const e = r !== null ? /* @__PURE__ */ s(
+  const e = r !== null ? /* @__PURE__ */ o(
     "label",
     {
       "data-testid": "test-form-field-label",
@@ -16,55 +16,55 @@ const x = (r, t) => {
       children: r
     }
   ) : null;
-  return t ? /* @__PURE__ */ s("section", { className: "field-label", children: e }) : e;
+  return t ? /* @__PURE__ */ o("section", { className: "field-label", children: e }) : e;
 }, F = ({
   testId: r,
   type: t,
   input: e
 }) => {
-  const o = {
-    testId: r ?? `test-form-field-${t}`,
+  const s = {
+    testId: (e == null ? void 0 : e.testId) ?? r ?? `test-form-field-${t}`,
     containerTestId: r ?? `test-form-field-container-${t}`
   };
   switch (t) {
     case l.INPUT:
-      return /* @__PURE__ */ s(
+      return /* @__PURE__ */ o(
         E,
         {
           ...e,
-          ...o
+          ...s
         }
       );
     case l.SELECT:
-      return /* @__PURE__ */ s(
+      return /* @__PURE__ */ o(
         h,
         {
           ...e,
-          ...o
+          ...s
         }
       );
     case l.CHECKBOX:
-      return /* @__PURE__ */ s(
+      return /* @__PURE__ */ o(
         b,
         {
           ...e,
-          ...o
+          ...s
         }
       );
     case l.RADIOBUTTON:
-      return /* @__PURE__ */ s(
+      return /* @__PURE__ */ o(
         C,
         {
           ...e,
-          ...o
+          ...s
         }
       );
     case l.TEXTAREA:
-      return /* @__PURE__ */ s(
+      return /* @__PURE__ */ o(
         T,
         {
           ...e,
-          ...o
+          ...s
         }
       );
   }
@@ -75,7 +75,7 @@ const x = (r, t) => {
     parsedClasses: t,
     rules: [{ regExp: /help|is/gm, replacer: "" }]
   });
-  return /* @__PURE__ */ s(
+  return /* @__PURE__ */ o(
     "p",
     {
       "data-testid": e,
@@ -87,17 +87,17 @@ const x = (r, t) => {
   testId: r = null,
   labelText: t,
   type: e,
-  input: o,
-  helper: m,
-  isHorizontal: a
+  input: s,
+  helper: a,
+  isHorizontal: n
 }) => {
-  const c = n(
-    () => x(t, a),
-    [t, a]
-  ), d = n(
-    () => F({ testId: r ?? void 0, type: e, input: o }),
-    [r, e, o]
-  ), i = n(() => N(m), [m]);
+  const c = m(
+    () => x(t, n),
+    [t, n]
+  ), d = m(
+    () => F({ testId: r ?? void 0, type: e, input: s }),
+    [r, e, s]
+  ), i = m(() => N(a), [a]);
   return /* @__PURE__ */ f(p, { children: [
     c,
     d,

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

@@ -1,36 +1,35 @@
-import { jsxs as s, jsx as a } from "react/jsx-runtime";
+import { jsxs as e, jsx as a } from "react/jsx-runtime";
 import { parseClasses as n, parseTestId as t } from "../../../functions/parsers.js";
 import "react";
-import b from "../../atoms/Image/index.js";
-import B from "../../atoms/NavBarItem/index.js";
-const x = ({
+import b from "../../atoms/NavBarItem/index.js";
+const C = ({
   testId: d = null,
   cssClasses: l = null,
   style: i = null,
   brandConfig: o,
-  isBurgerActive: m = !1
+  isBurgerActive: u = !1
 }) => {
-  const r = n(["navbar-brand", l]), u = d ?? t({ tag: "navbar-brand", parsedClasses: r }), e = n([
+  const r = n(["navbar-brand", l]), c = d ?? t({ tag: "navbar-brand", parsedClasses: r }), s = n([
     "navbar-burger",
-    m ? "is-active" : null
-  ]), c = t({
+    u ? "is-active" : null
+  ]), p = t({
     tag: "navbar-burger",
-    parsedClasses: e
-  }), { children: p, ...v } = o;
-  return /* @__PURE__ */ s(
+    parsedClasses: s
+  }), { children: m, ...v } = o;
+  return /* @__PURE__ */ e(
     "section",
     {
-      "data-testid": u,
+      "data-testid": c,
       className: r,
       style: i ?? void 0,
       children: [
-        /* @__PURE__ */ a(B, { ...v, children: /* @__PURE__ */ a(b, { ...p }) }),
-        /* @__PURE__ */ s(
+        /* @__PURE__ */ a(b, { ...v, children: m }),
+        /* @__PURE__ */ e(
           "a",
           {
             role: "button",
-            "data-testid": c,
-            className: e,
+            "data-testid": p,
+            className: s,
             "aria-label": "menu",
             "aria-expanded": "false",
             children: [
@@ -45,5 +44,5 @@ const x = ({
   );
 };
 export {
-  x as default
+  C as default
 };

package/dist/interfaces/commonProps.d.ts

@@ -16,17 +16,17 @@ export interface ElementProps {
 }
 export interface ComposedElementProps extends ElementProps, ContainerProps {
 }
-export interface ClickeableProps {
+export interface ClickeableProps<ElementType = Element, EventType = MouseEvent> {
     /** `Function` Reffers to each time the user click the element. Alone does not nothing, but can be reused for other components */
-    onClick?: (event: React.MouseEvent) => void;
+    onClick?: (event: React.MouseEvent<ElementType, EventType>) => void;
 }
-export interface ChangeableProps {
+export interface ChangeableProps<ElementType = Element> {
     /** `Function` Reffers to each time the user press a key. Alone does not nothing, but can be reused for other components */
-    onChange?: (event: React.ChangeEvent) => void;
+    onChange?: (event: React.ChangeEvent<ElementType>) => void;
 }
-export interface BlureableProps {
+export interface BlureableProps<ElementType = Element, RelatedTargetType = Element> {
     /** `Function` Reffers to each time the user focus out the element. Alone does not nothing, but can be reused for other components */
-    onBlur?: (event: React.FocusEvent) => void;
+    onBlur?: (event: React.FocusEvent<ElementType, RelatedTargetType>) => void;
 }
 export interface InteractiveProps extends ClickeableProps, ChangeableProps, BlureableProps {
 }

package/dist/interfaces/moleculeProps.d.ts

@@ -1,5 +1,5 @@
 import { ClickeableProps, ComposedElementProps, ElementProps } from './commonProps';
-import { BreadcrumbItemProps, ButtonProps, CheckBoxProps, ColumnProps, DeleteProps, DropdownItemProps, IconProps, ImageProps, InputProps, MenuItemProps, NavBarItemProps, PaginationItemProps, RadioButtonProps, SelectProps, TabItemProps, TableCellProps, TableHeadCellProps, TextAreaProps } from './atomProps';
+import { BreadcrumbItemProps, ButtonProps, CheckBoxProps, ColumnProps, DeleteProps, DropdownItemProps, IconProps, InputProps, MenuItemProps, NavBarItemProps, PaginationItemProps, RadioButtonProps, SelectProps, TabItemProps, TableCellProps, TableHeadCellProps, TextAreaProps } from './atomProps';
 import { BasicColorType, RightCenteredAlignType, BreadcrumbSeparatorType, ColumnGapType, SizeWithoutNormalType, TabsFormatType, MediumAndLargeSizeType, RightLeftAlignType } from '../types/styleTypes';
 import { ChildrenType, SingleChildType, PanelBlockItemType } from '../types/domTypes';
 export interface ButtonGroupProps extends ElementProps {
@@ -210,7 +210,7 @@ export interface NavBarDropdownProps extends ComposedElementProps {
     hasBoxedMenu?: boolean;
 }
 interface BrandConfigProps extends Omit<NavBarItemProps, 'children'> {
-    children: ImageProps;
+    children: SingleChildType;
 }
 export interface NavBarBrandProps extends ElementProps {
     /** `Attribute` `Required` Configuration object to inject a `NavBarItem` with a Image configuration as its children */

package/dist/types/domTypes.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 export type ButtonType = 'submit' | 'reset' | 'button';
-export type InputType = 'text' | 'password' | 'email' | 'tel' | 'number';
+export type InputType = 'text' | 'password' | 'email' | 'tel' | 'number' | 'date';
 export type DropdownItemType = 'item' | 'link' | 'divider';
 export type PanelBlockItemType = 'icon' | 'control' | 'button';
 export type ChildrenType = string | React.ReactElement | React.ReactElement[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "reactive-bulma",
-  "version": "4.3.3",
+  "version": "4.3.5",
   "type": "module",
   "description": "A component library based on React, Bulma, Typescript and Vite",
   "keywords": [
@@ -88,25 +88,26 @@
     "@types/node": "^22.10.2",
     "@types/react": "^19.0.2",
     "@types/react-dom": "^19.0.2",
-    "@typescript-eslint/eslint-plugin": "^8.18.1",
-    "@typescript-eslint/parser": "^8.18.1",
+    "@typescript-eslint/eslint-plugin": "^8.18.2",
+    "@typescript-eslint/parser": "^8.18.2",
     "@vitejs/plugin-react": "^4.3.4",
     "babel-jest": "^29.7.0",
     "babel-loader": "^9.2.1",
     "bulma": "^0.9.4",
     "eslint": "^9.17.0",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-react": "^7.37.2",
+    "eslint-plugin-react": "^7.37.3",
     "eslint-plugin-react-hooks": "^5.1.0",
     "eslint-plugin-react-refresh": "^0.4.16",
     "eslint-plugin-storybook": "^0.11.1",
     "glob": "^11.0.0",
     "globals": "^15.14.0",
+    "husky": "^9.1.7",
     "hygen": "^6.2.11",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "lint-staged": "^15.2.11",
-    "npm-check-updates": "^17.1.12",
+    "lint-staged": "^15.3.0",
+    "npm-check-updates": "^17.1.13",
     "prettier": "^3.4.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
@@ -114,8 +115,8 @@
     "storybook": "^8.4.7",
     "tslib": "^2.8.1",
     "typescript": "~5.7.2",
-    "typescript-eslint": "^8.18.1",
-    "vite": "^6.0.5",
+    "typescript-eslint": "^8.18.2",
+    "vite": "^6.0.6",
     "vite-plugin-dts": "^4.4.0"
   },
   "lint-staged": {