@bodynarf/react.components 1.13.5 → 1.13.6

package/components/primitives/checkbox/component/index.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from "react";
-import { emptyFn, generateGuid, getClassName, isNullish, isNullOrUndefined } from "@bodynarf/utils";
+import { emptyFn, generateGuid, getClassName, isNotNullish, isNullish } from "@bodynarf/utils";
 import { ElementSize } from "../../../../types";
-import { mapDataAttributes } from "../../../../utils";
+import { getElementColorClassName, getSizeClassName, mapDataAttributes } from "../../../../utils";
 import ComponentWithLabel from "../../internal/componentWithLabel";
 import "./style.scss";
 // todo: https://justboil.github.io/bulma-checkbox/
@@ -15,29 +15,27 @@ const CheckBox = ({ onValueChange = emptyFn, defaultValue, label, name = generat
         className,
         hasBackgroundColor ? "has-background-color" : "",
         fixBackgroundColor && hasBackgroundColor ? "m-has-background-color" : "",
-        size === ElementSize.Normal ? "" : `is-${size}`,
+        getSizeClassName(size, ElementSize.Normal),
         rounded ? "is-circle" : "",
-        isNullOrUndefined(style) ? "" : `is-${style}`,
+        getElementColorClassName(style),
         block ? "is-block" : "",
         withoutBorder ? "has-no-border" : "",
     ]);
-    const dataAttributes = isNullish(data)
-        ? undefined
-        : mapDataAttributes(data);
-    if (!isNullish(label) && isFormLabel) {
+    const dataAttributes = mapDataAttributes(data);
+    if (isNotNullish(label) && isFormLabel) {
         return (_jsxs(ComponentWithLabel, { id: name, size: size, label: {
                 ...label,
                 horizontal: label.horizontal ?? false,
                 horizontalContainerClassName: getClassName([label.horizontalContainerClassName, "p-0"]),
-            }, children: [_jsx("input", { type: "checkbox", id: name, name: name, disabled: disabled, onChange: onChecked, className: elClassName, defaultChecked: defaultValue, ...dataAttributes }), _jsx("label", { title: title, htmlFor: name, className: "is-empty" })] }));
+            }, children: [_jsx("input", { id: name, name: name, type: "checkbox", disabled: disabled, ...dataAttributes, onChange: onChecked, className: elClassName, defaultChecked: defaultValue }), _jsx("label", { title: title, htmlFor: name, className: "is-empty" })] }));
     }
-    const isEmptyLabel = isNullOrUndefined(label);
+    const isEmptyLabel = isNullish(label);
     const labelClassName = isEmptyLabel
         ? "is-empty"
         : undefined;
     const labelDataAttributes = isNullish(label?.data)
         ? undefined
         : mapDataAttributes(label.data);
-    return (_jsxs("div", { className: "bbr-field bbr-input field mr-2", children: [_jsx("input", { type: "checkbox", id: name, name: name, disabled: disabled, onChange: onChecked, className: elClassName, defaultChecked: defaultValue, ...dataAttributes }), _jsx("label", { htmlFor: name, className: labelClassName, title: isEmptyLabel ? title : label?.title, ...labelDataAttributes, children: label?.caption })] }));
+    return (_jsxs("div", { className: "bbr-field bbr-input field mr-2", children: [_jsx("input", { id: name, name: name, type: "checkbox", disabled: disabled, ...dataAttributes, onChange: onChecked, className: elClassName, defaultChecked: defaultValue }), _jsx("label", { htmlFor: name, ...labelDataAttributes, className: labelClassName, title: isEmptyLabel ? title : label?.title, children: label?.caption })] }));
 };
 export default CheckBox;

package/components/primitives/color/component/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/color/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,gBAAgB,EAAE,MAAM,IAAI,CAAC;AAItC,6BAA6B;AAC7B,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAGO,CACxC;AAEL,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/color/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,gBAAgB,EAAE,MAAM,IAAI,CAAC;AAItC,6BAA6B;AAC7B,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAU7B,CACJ;AAEL,eAAe,WAAW,CAAC"}

package/components/primitives/color/component/index.js

@@ -1,10 +1,14 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { isNullOrUndefined } from "@bodynarf/utils";
+import { isNullish } from "@bodynarf/utils";
 import "./style.scss";
 import ColorPickerWithoutLabel from "../components/withoutLabel";
 import ColorPickerWithLabel from "../components/withLabel";
 /** Color picker component */
-const ColorPicker = (props) => isNullOrUndefined(props.label)
+const ColorPicker = (props) => 
+// eslint-disable-next-line react/destructuring-assignment
+isNullish(props.label)
     ? _jsx(ColorPickerWithoutLabel, { ...props })
-    : _jsx(ColorPickerWithLabel, { ...props });
+    : (_jsx(ColorPickerWithLabel, { ...props, 
+        // eslint-disable-next-line react/destructuring-assignment
+        label: props.label }));
 export default ColorPicker;

package/components/primitives/color/components/picker/index.d.ts

@@ -2,17 +2,17 @@ import { ChangeEvent, FC } from "react";
 import { BaseInputElementProps } from "../../../../../types";
 import { ColorPickerPreviewConfig } from "../..";
 /** Props of `ColorPickerControl` */
-export type ColorPickerControlProps = Omit<BaseInputElementProps<string>, "placeholder" | "rounded" | "readonly" | "loading" | "className"> & {
+export type ColorPickerControlProps = Omit<BaseInputElementProps<string>, "placeholder" | "rounded" | "readonly" | "loading" | "className" | "onKeyDown" | "onKeyUp"> & {
     /** Current color value */
     value: string;
     /** Control unique identifier */
     id: string;
     /** Class names of control */
     elementClassName: string;
-    /** Handler of control value change*/
-    onValueChange: (event: ChangeEvent<HTMLInputElement>) => void;
     /** Preview element configuration */
     previewConfig?: ColorPickerPreviewConfig;
+    /** Handler of control value change*/
+    onValueChange: (event: ChangeEvent<HTMLInputElement>) => void;
 };
 /** Color picker container component */
 declare const ColorPickerControl: FC<ColorPickerControlProps>;

package/components/primitives/color/components/picker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/color/components/picker/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAIxC,OAAO,EAAmB,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAIpE,OAAO,EAA4B,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAE3E,oCAAoC;AACpC,MAAM,MAAM,uBAAuB,GAAG,IAAI,CACtC,qBAAqB,CAAC,MAAM,CAAC,EAC3B,aAAa,GACb,SAAS,GAAG,UAAU,GACtB,SAAS,GAAG,WAAW,CAC5B,GAAG;IACA,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IAEd,gCAAgC;IAChC,EAAE,EAAE,MAAM,CAAC;IAEX,6BAA6B;IAC7B,gBAAgB,EAAE,MAAM,CAAC;IAEzB,qCAAqC;IACrC,aAAa,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAE9D,oCAAoC;IACpC,aAAa,CAAC,EAAE,wBAAwB,CAAC;CAC5C,CAAC;AAEF,uCAAuC;AACvC,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAmDnD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/color/components/picker/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAIxC,OAAO,EAAmB,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAIpE,OAAO,EAA4B,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAE3E,oCAAoC;AACpC,MAAM,MAAM,uBAAuB,GAAG,IAAI,CACtC,qBAAqB,CAAC,MAAM,CAAC,EAC3B,aAAa,GACb,SAAS,GAAG,UAAU,GACtB,SAAS,GAAG,WAAW,GACvB,WAAW,GAAG,SAAS,CAC5B,GAAG;IACA,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IAEd,gCAAgC;IAChC,EAAE,EAAE,MAAM,CAAC;IAEX,6BAA6B;IAC7B,gBAAgB,EAAE,MAAM,CAAC;IAEzB,oCAAoC;IACpC,aAAa,CAAC,EAAE,wBAAwB,CAAC;IAEzC,qCAAqC;IACrC,aAAa,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACjE,CAAC;AAEF,uCAAuC;AACvC,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAgDnD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/components/primitives/color/components/picker/index.js

@@ -1,27 +1,26 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { getClassName, getFontColorFromString, isNullOrUndefined } from "@bodynarf/utils";
+import { getClassName, getFontColorFromString, isNotNullish, isNullish } from "@bodynarf/utils";
 import { ElementPosition } from "../../../../../types";
-import { mapDataAttributes } from "../../../../../utils";
+import { getSizeClassName, mapDataAttributes } from "../../../../../utils";
 import InternalHint from "../../../internal/hint";
 /** Color picker container component */
 const ColorPickerControl = ({ value, defaultValue, onValueChange, elementClassName, disabled = false, autoFocus = false, previewConfig, size, id, title, data, hint, validationState, }) => {
-    if (!isNullOrUndefined(previewConfig)) {
-        return (_jsx(PickerWithPreview, { id: id, size: size, value: value, disabled: disabled, defaultValue: defaultValue, onValueChange: onValueChange, previewConfig: previewConfig, elementClassName: elementClassName, data: data, title: title }));
+    if (isNotNullish(previewConfig)) {
+        return (_jsx(PickerWithPreview, { id: id, size: size, data: data, value: value, title: title, disabled: disabled, defaultValue: defaultValue, onValueChange: onValueChange, previewConfig: previewConfig, elementClassName: elementClassName }));
     }
-    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "control bbr-input", children: _jsx("input", { type: "color", id: id, name: id, disabled: disabled, autoFocus: autoFocus, onChange: onValueChange, defaultValue: defaultValue, className: elementClassName, ...data, title: title }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "control bbr-input", children: _jsx("input", { id: id, name: id, ...data, type: "color", title: title, disabled: disabled, autoFocus: autoFocus, onChange: onValueChange, defaultValue: defaultValue, className: elementClassName }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
 };
 export default ColorPickerControl;
 /** Picker sub component with preview */
-// eslint-disable-next-line react/no-multi-comp
 const PickerWithPreview = ({ elementClassName, disabled, size, defaultValue, onValueChange, value, autoFocus = false, id, title, data, previewConfig, hint, validationState, }) => {
     const classNames = getClassName([
         "bbr-color-picker__preview",
         "button",
         "is-outlined",
-        isNullOrUndefined(size) ? "" : `is-${size}`
+        getSizeClassName(size)
     ]);
     const color = getFontColorFromString(value);
-    const dataAttributes = isNullOrUndefined(data)
+    const dataAttributes = isNullish(data)
         ? undefined
         : mapDataAttributes(data);
     const controlContainerClassName = getClassName([
@@ -31,7 +30,7 @@ const PickerWithPreview = ({ elementClassName, disabled, size, defaultValue, onV
         previewConfig.position === ElementPosition.Left ? "ml-1" : "mr-1",
     ]);
     if (previewConfig.position === ElementPosition.Right) {
-        return (_jsxs("div", { className: "is-flex is-flex-direction-row is-flex-wrap-nowrap is-justify-content-start", children: [_jsx("div", { className: controlContainerClassName, children: _jsx("input", { type: "color", id: id, name: id, disabled: disabled, autoFocus: autoFocus, onChange: onValueChange, defaultValue: defaultValue, className: elementClassName, title: title, ...dataAttributes }) }), _jsx("button", { type: "button", className: classNames, style: {
+        return (_jsxs("div", { className: "is-flex is-flex-direction-row is-flex-wrap-nowrap is-justify-content-start", children: [_jsx("div", { className: controlContainerClassName, children: _jsx("input", { id: id, name: id, type: "color", title: title, disabled: disabled, ...dataAttributes, autoFocus: autoFocus, onChange: onValueChange, defaultValue: defaultValue, className: elementClassName }) }), _jsx("button", { type: "button", className: classNames, style: {
                         "--color-picker__background-color": value,
                         "--color-picker__color": color,
                     }, children: value }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
@@ -39,5 +38,5 @@ const PickerWithPreview = ({ elementClassName, disabled, size, defaultValue, onV
     return (_jsxs("div", { className: "is-flex is-flex-direction-row is-flex-wrap-nowrap is-justify-content-start", children: [_jsx("button", { type: "button", className: classNames, style: {
                     "--color-picker__background-color": value,
                     "--color-picker__color": color,
-                }, children: value }), _jsx("div", { className: controlContainerClassName, children: _jsx("input", { type: "color", id: id, name: id, disabled: disabled, autoFocus: autoFocus, onChange: onValueChange, defaultValue: defaultValue, className: elementClassName, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
+                }, children: value }), _jsx("div", { className: controlContainerClassName, children: _jsx("input", { id: id, name: id, type: "color", title: title, disabled: disabled, ...dataAttributes, autoFocus: autoFocus, onChange: onValueChange, defaultValue: defaultValue, className: elementClassName }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
 };

package/components/primitives/color/components/withLabel/index.d.ts

@@ -1,6 +1,7 @@
 import { FC } from "react";
+import { BaseInputWithLabel } from "../../../../../types";
 import { ColorPickerProps } from "../..";
 /** Color picker component with form label */
-declare const ColorPickerWithLabel: FC<ColorPickerProps>;
+declare const ColorPickerWithLabel: FC<BaseInputWithLabel<ColorPickerProps>>;
 export default ColorPickerWithLabel;
 //# sourceMappingURL=index.d.ts.map

package/components/primitives/color/components/withLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/color/components/withLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAoC,MAAM,OAAO,CAAC;AAQ1E,OAAO,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAGzC,6CAA6C;AAC7C,QAAA,MAAM,oBAAoB,EAAE,EAAE,CAAC,gBAAgB,CA4D9C,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/color/components/withLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAoC,MAAM,OAAO,CAAC;AAI1E,OAAO,EAAE,kBAAkB,EAAe,MAAM,YAAY,CAAC;AAI7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAGzC,6CAA6C;AAC7C,QAAA,MAAM,oBAAoB,EAAE,EAAE,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CA0DlE,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/components/primitives/color/components/withLabel/index.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from "react";
-import { generateGuid, getClassName, hexToRgb, isNullOrUndefined, rgbToHex, whiteHex } from "@bodynarf/utils";
+import { generateGuid, getClassName, hexToRgb, isNullish, rgbToHex, whiteHex } from "@bodynarf/utils";
 import { ElementSize } from "../../../../../types";
-import { getStyleClassName } from "../../../../../utils";
+import { getSizeClassName, getStyleClassName } from "../../../../../utils";
 import ComponentWithLabel from "../../../internal/componentWithLabel";
 import ColorPickerControl from "../picker";
 /** Color picker component with form label */
 const ColorPickerWithLabel = ({ preview, name = generateGuid(), defaultValue, onValueChange, validationState, disabled = false, rounded = false, size = ElementSize.Normal, autoFocus = false, label, hint, className, title, data, }) => {
-    const defaultColor = isNullOrUndefined(defaultValue)
+    const defaultColor = isNullish(defaultValue)
         ? whiteHex
         : rgbToHex(defaultValue);
     const [value, setValue] = useState(defaultColor);
@@ -17,9 +17,9 @@ const ColorPickerWithLabel = ({ preview, name = generateGuid(), defaultValue, on
         className,
         rounded ? "is-rounded" : "",
         getStyleClassName(undefined, validationState),
-        size === ElementSize.Normal ? "" : `is-${size}`,
+        getSizeClassName(size),
         "input",
     ]);
-    return (_jsx(ComponentWithLabel, { id: name, size: size, label: label, children: _jsx(ColorPickerControl, { id: name, value: value, disabled: disabled, autoFocus: autoFocus, previewConfig: preview, onValueChange: onChange, defaultValue: defaultColor, elementClassName: elClassName, hint: hint, validationState: validationState, data: data, title: title }) }));
+    return (_jsx(ComponentWithLabel, { id: name, size: size, label: label, children: _jsx(ColorPickerControl, { id: name, hint: hint, data: data, value: value, title: title, disabled: disabled, autoFocus: autoFocus, previewConfig: preview, onValueChange: onChange, defaultValue: defaultColor, elementClassName: elClassName, validationState: validationState }) }));
 };
 export default ColorPickerWithLabel;

package/components/primitives/color/components/withoutLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/color/components/withoutLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAoC,MAAM,OAAO,CAAC;AAI1E,OAAO,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAGzC,gDAAgD;AAChD,QAAA,MAAM,uBAAuB,EAAE,EAAE,CAAC,gBAAgB,CAwDjD,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/color/components/withoutLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAoC,MAAM,OAAO,CAAC;AAM1E,OAAO,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAGzC,gDAAgD;AAChD,QAAA,MAAM,uBAAuB,EAAE,EAAE,CAAC,gBAAgB,CAsDjD,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/components/primitives/color/components/withoutLabel/index.js

@@ -1,10 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from "react";
-import { generateGuid, getClassName, hexToRgb, isNullOrUndefined, rgbToHex, whiteHex } from "@bodynarf/utils";
+import { generateGuid, getClassName, hexToRgb, isNullish, rgbToHex, whiteHex } from "@bodynarf/utils";
+import { getSizeClassName } from "../../../../../utils";
 import ColorPickerControl from "../picker";
 /** Color picker component without form label */
 const ColorPickerWithoutLabel = ({ preview, name = generateGuid(), defaultValue, onValueChange, validationState, disabled = false, rounded = false, size, autoFocus = false, className, title, data, hint, }) => {
-    const defaultColor = isNullOrUndefined(defaultValue)
+    const defaultColor = isNullish(defaultValue)
         ? whiteHex
         : rgbToHex(defaultValue);
     const [value, setValue] = useState(defaultColor);
@@ -13,9 +14,9 @@ const ColorPickerWithoutLabel = ({ preview, name = generateGuid(), defaultValue,
     const elClassName = getClassName([
         className,
         rounded ? "is-rounded" : "",
-        isNullOrUndefined(size) ? "" : `is-${size}`,
+        getSizeClassName(size),
         "input",
     ]);
-    return (_jsx("div", { className: "bbr-color-picker", children: _jsx(ColorPickerControl, { id: name, value: value, disabled: disabled, autoFocus: autoFocus, previewConfig: preview, onValueChange: onChange, defaultValue: defaultColor, elementClassName: elClassName, data: data, title: title, hint: hint, validationState: validationState }) }));
+    return (_jsx("div", { className: "bbr-color-picker", children: _jsx(ColorPickerControl, { id: name, data: data, hint: hint, value: value, title: title, disabled: disabled, autoFocus: autoFocus, previewConfig: preview, onValueChange: onChange, defaultValue: defaultColor, elementClassName: elClassName, validationState: validationState }) }));
 };
 export default ColorPickerWithoutLabel;

package/components/primitives/color/types.d.ts

@@ -2,7 +2,7 @@ import { CSSProperties } from "react";
 import { Color } from "@bodynarf/utils";
 import { ElementFloatPosition, BaseNotNullableInputElementProps } from "../../../types";
 /** Color picker props type */
-export interface ColorPickerProps extends Omit<BaseNotNullableInputElementProps<Color>, "style" | "loading" | "readonly" | "placeholder"> {
+export interface ColorPickerProps extends Omit<BaseNotNullableInputElementProps<Color>, "style" | "loading" | "readonly" | "placeholder" | "onKeyDown" | "onKeyUp"> {
     /**
      * Preview text configuration.
      * If provided - outlined button-like element will be rendered near picker according to configuration

package/components/primitives/color/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/color/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAExC,OAAO,EAAE,oBAAoB,EAAE,gCAAgC,EAAE,MAAM,YAAY,CAAC;AAEpF,8BAA8B;AAC9B,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,gCAAgC,CAAC,KAAK,CAAC,EAChF,OAAO,GAAG,SAAS,GACnB,UAAU,GAAG,aAAa,CAC/B;IACG;;;OAGG;IACH,OAAO,CAAC,EAAE,wBAAwB,CAAC;CACtC;AAED,yCAAyC;AACzC,MAAM,WAAW,wBAAyB,SAAQ,aAAa;IAC3D,gDAAgD;IAChD,kCAAkC,EAAE,MAAM,CAAC;IAE3C,sDAAsD;IACtD,uBAAuB,EAAE,MAAM,CAAC;CACnC;AAED,6DAA6D;AAC7D,MAAM,WAAW,wBAAwB;IACrC,mCAAmC;IACnC,QAAQ,EAAE,oBAAoB,CAAC;CAClC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/color/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAExC,OAAO,EAAE,oBAAoB,EAAE,gCAAgC,EAAE,MAAM,YAAY,CAAC;AAEpF,8BAA8B;AAC9B,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,gCAAgC,CAAC,KAAK,CAAC,EAChF,OAAO,GAAG,SAAS,GACnB,UAAU,GAAG,aAAa,GAC1B,WAAW,GAAG,SAAS,CAC5B;IACG;;;OAGG;IACH,OAAO,CAAC,EAAE,wBAAwB,CAAC;CACtC;AAED,yCAAyC;AACzC,MAAM,WAAW,wBAAyB,SAAQ,aAAa;IAC3D,gDAAgD;IAChD,kCAAkC,EAAE,MAAM,CAAC;IAE3C,sDAAsD;IACtD,uBAAuB,EAAE,MAAM,CAAC;CACnC;AAED,6DAA6D;AAC7D,MAAM,WAAW,wBAAwB;IACrC,mCAAmC;IACnC,QAAQ,EAAE,oBAAoB,CAAC;CAClC"}

package/components/primitives/date/component/index.d.ts

@@ -1,7 +1,8 @@
 import { FC } from "react";
+import { LabeledElement } from "../../../../types";
 import "./style.scss";
 import { DateProps } from "../..";
 /** Date input component */
-declare const DatePicker: FC<DateProps>;
+declare const DatePicker: FC<Omit<DateProps, "label"> & LabeledElement>;
 export default DatePicker;
 //# sourceMappingURL=index.d.ts.map

package/components/primitives/date/component/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/date/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AASrD,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,2BAA2B;AAC3B,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,SAAS,CAuE7B,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/date/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AAIrD,OAAO,EAAe,cAAc,EAAE,MAAM,YAAY,CAAC;AAKzD,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,2BAA2B;AAC3B,QAAA,MAAM,UAAU,EAAE,EAAE,CAChB,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,cAAc,CA0ExC,CAAC;AAEN,eAAe,UAAU,CAAC"}

package/components/primitives/date/component/index.js

@@ -1,19 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from "react";
-import { emptyFn, generateGuid, getClassName, isNullOrUndefined, isStringEmpty } from "@bodynarf/utils";
+import { emptyFn, generateGuid, getClassName, isNullish, isStringEmpty } from "@bodynarf/utils";
 import { ElementSize } from "../../../../types";
-import { getStyleClassName, mapDataAttributes } from "../../../../utils";
+import { getSizeClassName, getStyleClassName, mapDataAttributes } from "../../../../utils";
 import ComponentWithLabel from "../../internal/componentWithLabel";
 import InternalHint from "../../internal/hint";
 import "./style.scss";
 /** Date input component */
-const DatePicker = ({ defaultValue, onValueChange = emptyFn, validationState, name = generateGuid(), style, size = ElementSize.Normal, readonly = false, disabled = false, rounded = false, loading = false, autoFocus = false, label, onBlur, className, title, data, hint, }) => {
+const DatePicker = ({ defaultValue, onValueChange = emptyFn, validationState, name = generateGuid(), style, size = ElementSize.Normal, readonly = false, disabled = false, rounded = false, loading = false, autoFocus = false, label, onBlur, onKeyDown, onKeyUp, className, title, data, hint, }) => {
     const onChange = useCallback((event) => onValueChange(isStringEmpty(event.target.value)
         ? undefined
         : new Date(event.target.value)), [onValueChange]);
     const elClassName = getClassName([
         className,
-        size === ElementSize.Normal ? "" : `is-${size}`,
+        getSizeClassName(size, ElementSize.Normal),
         getStyleClassName(style, validationState),
         rounded ? "is-rounded" : "",
         "input",
@@ -23,9 +23,9 @@ const DatePicker = ({ defaultValue, onValueChange = emptyFn, validationState, na
         loading ? "is-loading" : "",
     ]);
     const stringifiedDefValue = defaultValue?.toISOString().split("T")[0];
-    const dataAttributes = isNullOrUndefined(data)
+    const dataAttributes = isNullish(data)
         ? undefined
         : mapDataAttributes(data);
-    return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "date", id: name, name: name, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, className: elClassName, defaultValue: stringifiedDefValue, autoFocus: autoFocus, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
+    return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("input", { id: name, type: "date", name: name, title: title, onBlur: onBlur, onKeyUp: onKeyUp, readOnly: readonly, disabled: disabled, onChange: onChange, ...dataAttributes, onKeyDown: onKeyDown, autoFocus: autoFocus, className: elClassName, defaultValue: stringifiedDefValue }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
 };
 export default DatePicker;

package/components/primitives/date/types.d.ts

@@ -1,4 +1,4 @@
-import { BaseInputElementProps, BaseNullableInputElementProps, BlurableElement } from "../../../types";
+import { BaseInputElementProps, BaseNullableInputElementProps, BlurableElement, KeyboardElement } from "../../../types";
 /** Date input component props type */
-export type DateProps = Omit<BaseNullableInputElementProps<Date>, "placeholder" | "label"> & BlurableElement & Required<Pick<BaseInputElementProps<unknown>, "label">>;
+export type DateProps = Omit<BaseNullableInputElementProps<Date>, "placeholder" | "label"> & BlurableElement & KeyboardElement & Required<Pick<BaseInputElementProps<unknown>, "label">>;
 //# sourceMappingURL=types.d.ts.map

package/components/primitives/date/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/date/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,6BAA6B,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAEnG,sCAAsC;AACtC,MAAM,MAAM,SAAS,GAAG,IAAI,CACxB,6BAA6B,CAAC,IAAI,CAAC,EACnC,aAAa,GAAG,OAAO,CAC1B,GAAG,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/date/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,6BAA6B,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAEpH,sCAAsC;AACtC,MAAM,MAAM,SAAS,GACf,IAAI,CACF,6BAA6B,CAAC,IAAI,CAAC,EACnC,aAAa,GAAG,OAAO,CAC1B,GAAG,eAAe,GACjB,eAAe,GACf,QAAQ,CAAC,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CACxD"}

package/components/primitives/internal/componentWithLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/internal/componentWithLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAG7D,4CAA4C;AAC5C,MAAM,MAAM,uBAAuB,GAAG;IAClC,0BAA0B;IAC1B,KAAK,EAAE,kBAAkB,CAAC;IAE1B,qBAAqB;IACrB,IAAI,EAAE,WAAW,CAAC;IAElB,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IAEX,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,CAAC;AAEF,iDAAiD;AACjD,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAqEnD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/internal/componentWithLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAG7D,4CAA4C;AAC5C,MAAM,MAAM,uBAAuB,GAAG;IAClC,0BAA0B;IAC1B,KAAK,EAAE,kBAAkB,CAAC;IAE1B,qBAAqB;IACrB,IAAI,EAAE,WAAW,CAAC;IAElB,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IAEX,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,CAAC;AAEF,iDAAiD;AACjD,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAmEnD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/components/primitives/internal/componentWithLabel/index.js

@@ -23,8 +23,8 @@ const ComponentWithLabel = ({ label, id, size, children, }) => {
             "field-body",
             label.horizontalFieldContainerClassName
         ]);
-        return (_jsxs("div", { className: "bbr-field bbr-input field is-horizontal", children: [_jsx("div", { className: labelContainerClassName, children: _jsx("label", { htmlFor: id, className: labelClassName, title: label.title, ...dataAttributes, children: label.caption }) }), _jsx("div", { className: fieldContainerClassName, children: _jsx("div", { className: "field", children: children }) })] }));
+        return (_jsxs("div", { className: "bbr-field bbr-input field is-horizontal", children: [_jsx("div", { className: labelContainerClassName, children: _jsx("label", { htmlFor: id, title: label.title, ...dataAttributes, className: labelClassName, children: label.caption }) }), _jsx("div", { className: fieldContainerClassName, children: _jsx("div", { className: "field", children: children }) })] }));
     }
-    return (_jsxs("div", { className: "bbr-field bbr-input field", children: [_jsx("label", { htmlFor: id, className: labelClassName, title: label.title, ...dataAttributes, children: label.caption }), children] }));
+    return (_jsxs("div", { className: "bbr-field bbr-input field", children: [_jsx("label", { htmlFor: id, title: label.title, ...dataAttributes, className: labelClassName, children: label.caption }), children] }));
 };
 export default ComponentWithLabel;

package/components/primitives/internal/hint/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/internal/hint/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,qBAAqB,EAAqE,MAAM,YAAY,CAAC;AAGtH,OAAO,cAAc,CAAC;AAEtB,8BAA8B;AAC9B,KAAK,SAAS,GAAG,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,iBAAiB,GAAG,MAAM,CAAC,CAAC;AAElF,qEAAqE;AACrE,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,SAAS,CAkD/B,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/internal/hint/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,qBAAqB,EAAqE,MAAM,YAAY,CAAC;AAGtH,OAAO,cAAc,CAAC;AAEtB,8BAA8B;AAC9B,KAAK,SAAS,GAAG,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,iBAAiB,GAAG,MAAM,CAAC,CAAC;AAElF,qEAAqE;AACrE,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,SAAS,CAmD/B,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/components/primitives/internal/hint/index.js

@@ -1,14 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import { getClassName, isNotNullish, isNullish } from "@bodynarf/utils";
 import { ElementPosition, ElementSize, ValidationStatus } from "../../../../types";
 import Icon from "../../../icon";
 import "./style.scss";
 /** Hint component for internal use (as form input elements hints) */
 const InternalHint = ({ validationState, hint, }) => {
-    if (isNullOrUndefined(validationState) && isNullOrUndefined(hint)) {
+    if (isNullish(validationState) && isNullish(hint)) {
         return null;
     }
-    const validationStateDefined = !isNullOrUndefined(validationState)
+    const validationStateDefined = isNotNullish(validationState)
         && validationState.status !== ValidationStatus.None
         && (validationState.messages ?? []).length > 0;
     if (validationStateDefined) {
@@ -17,7 +17,7 @@ const InternalHint = ({ validationState, hint, }) => {
             : "is-danger";
         return (_jsx("p", { className: `help m-help bbr-hint ${validationClassName}`, children: (validationState.messages ?? []).join("\n") }));
     }
-    if (isNullOrUndefined(hint)) {
+    if (isNullish(hint)) {
         return null;
     }
     const className = getClassName([
@@ -27,8 +27,8 @@ const InternalHint = ({ validationState, hint, }) => {
         (hint.grey ?? false) ? "has-text-grey" : undefined,
         (hint.italic ?? false) ? "is-italic" : undefined,
     ]);
-    if (!isNullOrUndefined(hint.icon)) {
-        return (_jsx(HintWithIcon, { ...hint, className: className }));
+    if (isNotNullish(hint.icon)) {
+        return (_jsx(HintWithIcon, { icon: hint.icon, className: className, content: hint.content }));
     }
     return (_jsx("p", { className: className, children: hint.content }));
 };

package/components/primitives/multiline/component/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/multiline/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,cAAc,EAAE,MAAM,IAAI,CAAC;AAIpC,wCAAwC;AACxC,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAKjC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/multiline/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,cAAc,EAAE,MAAM,IAAI,CAAC;AAIpC,wCAAwC;AACxC,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAYjC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/components/primitives/multiline/component/index.js

@@ -1,11 +1,14 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { isNullOrUndefined } from "@bodynarf/utils";
+import { isNullish } from "@bodynarf/utils";
 import MultilineWithoutLabel from "../components/withoutLabel";
 import MultilineWithLabel from "../components/withLabel";
 /** Multiline textual input component */
 const Multiline = (props) => {
-    return isNullOrUndefined(props.label)
+    // eslint-disable-next-line react/destructuring-assignment
+    return isNullish(props.label)
         ? _jsx(MultilineWithoutLabel, { ...props })
-        : _jsx(MultilineWithLabel, { ...props });
+        : (_jsx(MultilineWithLabel, { ...props, 
+            // eslint-disable-next-line react/destructuring-assignment
+            label: props.label }));
 };
 export default Multiline;

package/components/primitives/multiline/components/withLabel/index.d.ts

@@ -1,6 +1,7 @@
 import { FC } from "react";
+import { LabeledElement } from "../../../../../types";
 import { MultilineProps } from "../..";
 /** Multiline textual input component with describing label */
-declare const MultilineWithLabel: FC<MultilineProps>;
+declare const MultilineWithLabel: FC<Omit<MultilineProps, "label"> & LabeledElement>;
 export default MultilineWithLabel;
 //# sourceMappingURL=index.d.ts.map

package/components/primitives/multiline/components/withLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/multiline/components/withLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AASrD,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,8DAA8D;AAC9D,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,cAAc,CAiE1C,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/multiline/components/withLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AAIrD,OAAO,EAAe,cAAc,EAAE,MAAM,YAAY,CAAC;AAKzD,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,8DAA8D;AAC9D,QAAA,MAAM,kBAAkB,EAAE,EAAE,CACxB,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,GAAG,cAAc,CAqE7C,CAAC;AAEN,eAAe,kBAAkB,CAAC"}

package/components/primitives/multiline/components/withLabel/index.js

@@ -1,16 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from "react";
-import { emptyFn, generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import { emptyFn, generateGuid, getClassName, isNullish } from "@bodynarf/utils";
 import { ElementSize } from "../../../../../types";
-import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
+import { getSizeClassName, getStyleClassName, mapDataAttributes } from "../../../../../utils";
 import ComponentWithLabel from "../../../internal/componentWithLabel";
 import InternalHint from "../../../internal/hint";
 /** Multiline textual input component with describing label */
-const MultilineWithLabel = ({ defaultValue, onValueChange = emptyFn, validationState, name = generateGuid(), size = ElementSize.Normal, style, label, placeholder, readonly = false, disabled = false, loading = false, fixed = false, autoFocus = false, rows, onBlur, className, title, data, hint, }) => {
+const MultilineWithLabel = ({ defaultValue, onValueChange = emptyFn, validationState, name = generateGuid(), size = ElementSize.Normal, style, label, placeholder, readonly = false, disabled = false, loading = false, fixed = false, autoFocus = false, rows, onBlur, onKeyDown, onKeyUp, className, title, data, hint, }) => {
     const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
     const elClassName = getClassName([
         className,
-        size === ElementSize.Normal ? "" : `is-${size}`,
+        getSizeClassName(size, ElementSize.Normal),
         getStyleClassName(style, validationState),
         "textarea",
         fixed ? "has-fixed-size" : "",
@@ -19,9 +19,9 @@ const MultilineWithLabel = ({ defaultValue, onValueChange = emptyFn, validationS
         "control",
         loading ? "is-loading" : "",
     ]);
-    const dataAttributes = isNullOrUndefined(data)
+    const dataAttributes = isNullish(data)
         ? undefined
         : mapDataAttributes(data);
-    return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("textarea", { id: name, name: name, rows: rows, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, autoFocus: autoFocus, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
+    return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("textarea", { id: name, name: name, rows: rows, title: title, onBlur: onBlur, onKeyUp: onKeyUp, disabled: disabled, onChange: onChange, readOnly: readonly, ...dataAttributes, autoFocus: autoFocus, onKeyDown: onKeyDown, className: elClassName, placeholder: placeholder, defaultValue: defaultValue }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
 };
 export default MultilineWithLabel;

package/components/primitives/multiline/components/withoutLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/multiline/components/withoutLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AAQrD,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,gEAAgE;AAChE,QAAA,MAAM,qBAAqB,EAAE,EAAE,CAAC,cAAc,CAgE7C,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/multiline/components/withoutLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AAQrD,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,gEAAgE;AAChE,QAAA,MAAM,qBAAqB,EAAE,EAAE,CAAC,cAAc,CAiE7C,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/components/primitives/multiline/components/withoutLabel/index.js

@@ -1,15 +1,15 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from "react";
-import { emptyFn, generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import { emptyFn, generateGuid, getClassName } from "@bodynarf/utils";
 import { ElementSize } from "../../../../../types";
-import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
+import { getSizeClassName, getStyleClassName, mapDataAttributes } from "../../../../../utils";
 import InternalHint from "../../../internal/hint";
 /** Multiline textual input component without describing label*/
-const MultilineWithoutLabel = ({ defaultValue, onValueChange = emptyFn, validationState, name = generateGuid(), size = ElementSize.Normal, style, placeholder, readonly = false, disabled = false, loading = false, fixed = false, autoFocus = false, rows, onBlur, className, title, data, hint, }) => {
+const MultilineWithoutLabel = ({ defaultValue, onValueChange = emptyFn, validationState, name = generateGuid(), size = ElementSize.Normal, style, placeholder, readonly = false, disabled = false, loading = false, fixed = false, autoFocus = false, rows, onBlur, onKeyDown, onKeyUp, className, title, data, hint, }) => {
     const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
     const elClassName = getClassName([
         className,
-        size === ElementSize.Normal ? "" : `is-${size}`,
+        getSizeClassName(size, ElementSize.Normal),
         getStyleClassName(style, validationState),
         "textarea",
         fixed ? "has-fixed-size" : "",
@@ -19,9 +19,7 @@ const MultilineWithoutLabel = ({ defaultValue, onValueChange = emptyFn, validati
         "bbr-input",
         loading ? "is-loading" : "",
     ]);
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    return (_jsxs("div", { className: "bbr-field field", children: [_jsx("div", { className: inputContainerClassName, children: _jsx("textarea", { id: name, name: name, rows: rows, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, autoFocus: autoFocus, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
+    const dataAttributes = mapDataAttributes(data);
+    return (_jsxs("div", { className: "bbr-field field", children: [_jsx("div", { className: inputContainerClassName, children: _jsx("textarea", { id: name, name: name, rows: rows, title: title, onBlur: onBlur, onKeyUp: onKeyUp, disabled: disabled, onChange: onChange, readOnly: readonly, ...dataAttributes, autoFocus: autoFocus, onKeyDown: onKeyDown, className: elClassName, placeholder: placeholder, defaultValue: defaultValue }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
 };
 export default MultilineWithoutLabel;

package/components/primitives/multiline/types.d.ts

@@ -1,6 +1,6 @@
-import { BaseNotNullableInputElementProps, BlurableElement } from "../../../types";
+import { BaseNotNullableInputElementProps, BlurableElement, KeyboardElement } from "../../../types";
 /** Multiline textual input component props type */
-export type MultilineProps = Omit<BaseNotNullableInputElementProps<string>, "rounded"> & BlurableElement & {
+export type MultilineProps = Omit<BaseNotNullableInputElementProps<string>, "rounded"> & BlurableElement & KeyboardElement & {
     /** Is input should be resizable */
     fixed?: boolean;
     /** Number of initial rows count */

package/components/primitives/multiline/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/multiline/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gCAAgC,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAE/E,mDAAmD;AACnD,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,gCAAgC,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC,GAChF,eAAe,GACf;IACE,mCAAmC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/multiline/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gCAAgC,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAEhG,mDAAmD;AACnD,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,gCAAgC,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC,GAChF,eAAe,GACf,eAAe,GACf;IACE,mCAAmC;IACnC,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC"}

package/components/primitives/number/component/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/number/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAIjC,6BAA6B;AAC7B,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAI3B,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/number/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAIjC,6BAA6B;AAC7B,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAW3B,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/components/primitives/number/component/index.js

@@ -1,11 +1,14 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { isNullOrUndefined } from "@bodynarf/utils";
+import { isNullish } from "@bodynarf/utils";
 import NumberWithLabel from "../components/withLabel";
 import NumberWithoutLabel from "../components/withoutLabel";
 /** Number input component */
 const Number = (props) => {
-    return isNullOrUndefined(props.label)
+    // eslint-disable-next-line react/destructuring-assignment
+    return isNullish(props.label)
         ? _jsx(NumberWithoutLabel, { ...props })
-        : _jsx(NumberWithLabel, { ...props });
+        : (_jsx(NumberWithLabel, { ...props, 
+            // eslint-disable-next-line react/destructuring-assignment
+            label: props.label }));
 };
 export default Number;

package/components/primitives/number/components/withLabel/index.d.ts

@@ -1,6 +1,7 @@
 import { FC } from "react";
+import { LabeledElement } from "../../../../../types";
 import { NumberProps } from "../..";
 /** Number component with label */
-declare const NumberWithLabel: FC<NumberProps>;
+declare const NumberWithLabel: FC<Omit<NumberProps, "label"> & LabeledElement>;
 export default NumberWithLabel;
 //# sourceMappingURL=index.d.ts.map

package/components/primitives/number/components/withLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/number/components/withLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AASrD,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,kCAAkC;AAClC,QAAA,MAAM,eAAe,EAAE,EAAE,CAAC,WAAW,CAmEpC,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/number/components/withLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AAIrD,OAAO,EAAe,cAAc,EAAE,MAAM,YAAY,CAAC;AAKzD,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,kCAAkC;AAClC,QAAA,MAAM,eAAe,EAAE,EAAE,CACrB,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC,GAAG,cAAc,CAsE1C,CAAC;AAEN,eAAe,eAAe,CAAC"}