@bodynarf/react.components 1.6.1 → 1.6.3

package/components/icon/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/icon/index.tsx"],"names":[],"mappings":";AAEA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAEjC,2BAA2B;AAC3B,oBAAY,SAAS,GAAG;IACpB;;;;;MAKE;IACF,IAAI,EAAE,MAAM,CAAC;IAEb,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,gBAAgB;IAChB,IAAI,CAAC,EAAE,WAAW,CAAC;CACtB,CAAA;AASD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EACzB,IAAI,EAAE,IAAyB,EAC/B,SAAS,GACZ,EAAE,SAAS,GAAG,GAAG,CAAC,OAAO,CAYzB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,cAAc,SAAS,CAAC"}

package/components/icon/index.js

@@ -1,23 +1,2 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { getClassName } from "@bodynarf/utils";
-import "./icon.scss";
-import { ElementSize } from "..";
-const sizeToClassMap = new Map([
-    [ElementSize.Small, "bbr-icon--size-smal"],
-    [ElementSize.Normal, ""],
-    [ElementSize.Medium, "bbr-icon--size-medium"],
-    [ElementSize.Large, "bbr-icon--size-large"]
-]);
-/**
- * Icon component. Based on bootstrap icons
- */
-export default function Icon({ name, size = ElementSize.Normal, className, }) {
-    const classNames = getClassName([
-        "bbr-icon",
-        "bi",
-        `bi-${name}`,
-        sizeToClassMap.has(size) ? sizeToClassMap.get(size) : "",
-        className
-    ]);
-    return (_jsx("i", { className: classNames }));
-}
+export { default } from "./component";
+export * from "./types";

package/components/icon/types.d.ts

@@ -0,0 +1,16 @@
+import { ElementSize } from "..";
+/** Icon component props */
+export interface IconProps {
+    /**
+     * Icon name. Must be without `bi-`
+     * @example ["Arrow repeat", "arrow-repeat"]
+     * // Icon name to icon class name.
+     * // For class name check bootstrap icons website
+    */
+    name: string;
+    /** Additional classname */
+    className?: string;
+    /** Icon size */
+    size?: ElementSize;
+}
+//# sourceMappingURL=types.d.ts.map

package/components/icon/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/icon/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAEjC,2BAA2B;AAC3B,MAAM,WAAW,SAAS;IACtB;;;;;MAKE;IACF,IAAI,EAAE,MAAM,CAAC;IAEb,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,gBAAgB;IAChB,IAAI,CAAC,EAAE,WAAW,CAAC;CACtB"}

package/components/icon/types.js

@@ -0,0 +1 @@
+export {};

package/components/index.d.ts

@@ -1,11 +1,11 @@
-export * from "./types";
 export * from "./anchor";
 export * from "./button";
 export * from "./dropdown";
 export * from "./icon";
 export * from "./paginator";
-export * from "./primitives";
 export * from "./search";
-export * from "./tag";
 export * from "./tabs";
+export * from "./tag";
+export * from "./primitives";
+export * from "./types";
 //# sourceMappingURL=index.d.ts.map

package/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AAEtB,cAAc,cAAc,CAAC;AAE7B,cAAc,SAAS,CAAC"}

package/components/index.js

@@ -1,10 +1,10 @@
-export * from "./types";
 export * from "./anchor";
 export * from "./button";
 export * from "./dropdown";
 export * from "./icon";
 export * from "./paginator";
-export * from "./primitives";
 export * from "./search";
-export * from "./tag";
 export * from "./tabs";
+export * from "./tag";
+export * from "./primitives";
+export * from "./types";

package/components/paginator/component/index.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { PaginatorProps } from "..";
+/**
+ * Paginator component.
+ * Used for visualization of pagging configuration
+*/
+export default function Paginator({ count, onPageChange, currentPage, position, rounded, size, className, showNextButtons, nearPagesCount }: PaginatorProps): JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/components/paginator/component/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/paginator/component/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAuB,cAAc,EAAE,MAAM,IAAI,CAAC;AAEzD;;;EAGE;AACF,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAC9B,KAAK,EAAE,YAAY,EAAE,WAAW,EAChC,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAClC,eAAe,EAAE,cAAc,EAClC,EAAE,cAAc,GAAG,GAAG,CAAC,OAAO,CA4G9B"}

package/components/paginator/component/index.js

@@ -0,0 +1,47 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useMemo } from "react";
+import { getClassName, isNullOrEmpty } from "@bodynarf/utils";
+import { generatePageNumbers } from "..";
+/**
+ * Paginator component.
+ * Used for visualization of pagging configuration
+*/
+export default function Paginator({ count, onPageChange, currentPage, position, rounded, size, className, showNextButtons, nearPagesCount }) {
+    const page = currentPage || 0;
+    const pageChange = useCallback((event) => {
+        const target = event.target;
+        const pageRaw = target.dataset["page"];
+        if (isNullOrEmpty(pageRaw)) {
+            return;
+        }
+        const page = +pageRaw;
+        if (page !== currentPage && page > 0 && page <= count) {
+            onPageChange(page);
+        }
+    }, [onPageChange, currentPage, count]);
+    const pageNumbers = useMemo(() => generatePageNumbers(page, count, nearPagesCount), [page, count]);
+    const canGoBack = useMemo(() => page > 1, [page]);
+    const canGoForward = useMemo(() => page < count, [page, count]);
+    if (pageNumbers.length <= 1) {
+        return _jsx(_Fragment, {});
+    }
+    const classNames = getClassName([
+        "bbr-paginator",
+        "pagination",
+        paginationPositionToClassMap.has(position || "") ? paginationPositionToClassMap.get(position || "") : "",
+        rounded == true ? "is-rounded" : "",
+        isNullOrEmpty(size) ? "" : `is-${size}`,
+        className
+    ]);
+    return (_jsxs("nav", { className: classNames, role: "navigation", "aria-label": "pagination", children: [showNextButtons === true &&
+                _jsxs(_Fragment, { children: [_jsx("a", { className: `pagination-previous${canGoBack ? "" : " is-disabled"}`, "data-page": page - 1, onClick: pageChange, children: "Previous" }), _jsx("a", { className: `pagination-next${canGoForward ? "" : " is-disabled"}`, "data-page": page + 1, onClick: pageChange, children: "Next page" })] }), _jsxs("ul", { className: "pagination-list", children: [page !== 1 && !pageNumbers.includes(1) &&
+                        _jsxs(_Fragment, { children: [_jsx("li", { children: _jsx("a", { className: "pagination-link", "aria-label": "Goto page 1", "data-page": 1, onClick: pageChange, children: "1" }) }), _jsx("li", { children: _jsx("span", { className: "pagination-ellipsis", children: "\u2026" }) })] }), pageNumbers.map(x => _jsx("li", { children: _jsx("a", { className: `pagination-link${page === x ? " is-current" : ""}`, "aria-label": `Goto page ${x}`, "data-page": x, onClick: pageChange, children: x }) }, x)), page != count && !pageNumbers.includes(count) &&
+                        _jsxs(_Fragment, { children: [_jsx("li", { children: _jsx("span", { className: "pagination-ellipsis", children: "\u2026" }) }), _jsx("li", { children: _jsx("a", { className: "pagination-link", "aria-label": `Goto page ${count}`, "data-page": count, onClick: pageChange, children: count }) })] })] })] }));
+}
+/**
+ * Position setting to css class name map
+ */
+const paginationPositionToClassMap = new Map([
+    ["center", "is-centered"],
+    ["right", "is-right"]
+]);

package/components/paginator/index.d.ts

@@ -1,34 +1,4 @@
-/// <reference types="react" />
-import { ElementSize } from "..";
-export declare type PaginatorProps = {
-    /** Amount of pages */
-    count: number;
-    /** Page change handler */
-    onPageChange: (page: number) => void;
-    /** Current page */
-    currentPage?: number;
-    /**
-     * Page numbers position.
-     * Usefull with `showNextButtons = true`
-    */
-    position?: "left" | "center" | "right";
-    /** Buttons should have rounded borders */
-    rounded?: boolean;
-    /** Size of paginator component elements */
-    size?: ElementSize;
-    /** Additional class names */
-    className?: string;
-    /** Display "Previous" \ "Next" buttons */
-    showNextButtons?: boolean;
-    /**
-     * Max amount of pages from left & right from current page. `3` by default
-     * @description If set to 2 it will show `[1, 2], 3, [4, 5]`
-    */
-    nearPagesCount?: number;
-};
-/**
- * Paginator component.
- * Used for visualization of pagging configuration
-*/
-export default function Paginator({ count, onPageChange, currentPage, position, rounded, size, className, showNextButtons, nearPagesCount }: PaginatorProps): JSX.Element;
+export { default } from "./component";
+export * from "./types";
+export * from "./utils";
 //# sourceMappingURL=index.d.ts.map

package/components/paginator/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/paginator/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAIjC,oBAAY,cAAc,GAAG;IACzB,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IAEd,0BAA0B;IAC1B,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAErC,mBAAmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;MAGE;IACF,QAAQ,CAAC,EACP,MAAM,GACN,QAAQ,GACR,OAAO,CACR;IAED,0CAA0C;IAC1C,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,0CAA0C;IAC1C,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;MAGE;IACF,cAAc,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAA;AAED;;;EAGE;AACF,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAC9B,KAAK,EAAE,YAAY,EAAE,WAAW,EAChC,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAClC,eAAe,EAAE,cAAc,EAClC,EAAE,cAAc,GAAG,GAAG,CAAC,OAAO,CA4G9B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/paginator/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}

package/components/paginator/index.js

@@ -1,47 +1,3 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useMemo } from "react";
-import { getClassName, isNullOrEmpty } from "@bodynarf/utils";
-import { generatePageNumbers } from "./utils";
-/**
- * Paginator component.
- * Used for visualization of pagging configuration
-*/
-export default function Paginator({ count, onPageChange, currentPage, position, rounded, size, className, showNextButtons, nearPagesCount }) {
-    const page = currentPage || 0;
-    const pageChange = useCallback((event) => {
-        const target = event.target;
-        const pageRaw = target.dataset["page"];
-        if (isNullOrEmpty(pageRaw)) {
-            return;
-        }
-        const page = +pageRaw;
-        if (page !== currentPage && page > 0 && page <= count) {
-            onPageChange(page);
-        }
-    }, [onPageChange, currentPage, count]);
-    const pageNumbers = useMemo(() => generatePageNumbers(page, count, nearPagesCount), [page, count]);
-    const canGoBack = useMemo(() => page > 1, [page]);
-    const canGoForward = useMemo(() => page < count, [page, count]);
-    if (pageNumbers.length <= 1) {
-        return _jsx(_Fragment, {});
-    }
-    const classNames = getClassName([
-        "bbr-paginator",
-        "pagination",
-        paginationPositionToClassMap.has(position || "") ? paginationPositionToClassMap.get(position || "") : "",
-        rounded == true ? "is-rounded" : "",
-        isNullOrEmpty(size) ? "" : `is-${size}`,
-        className
-    ]);
-    return (_jsxs("nav", { className: classNames, role: "navigation", "aria-label": "pagination", children: [showNextButtons === true &&
-                _jsxs(_Fragment, { children: [_jsx("a", { className: `pagination-previous${canGoBack ? "" : " is-disabled"}`, "data-page": page - 1, onClick: pageChange, children: "Previous" }), _jsx("a", { className: `pagination-next${canGoForward ? "" : " is-disabled"}`, "data-page": page + 1, onClick: pageChange, children: "Next page" })] }), _jsxs("ul", { className: "pagination-list", children: [page !== 1 && !pageNumbers.includes(1) &&
-                        _jsxs(_Fragment, { children: [_jsx("li", { children: _jsx("a", { className: "pagination-link", "aria-label": "Goto page 1", "data-page": 1, onClick: pageChange, children: "1" }) }), _jsx("li", { children: _jsx("span", { className: "pagination-ellipsis", children: "\u2026" }) })] }), pageNumbers.map(x => _jsx("li", { children: _jsx("a", { className: `pagination-link${page === x ? " is-current" : ""}`, "aria-label": `Goto page ${x}`, "data-page": x, onClick: pageChange, children: x }) }, x)), page != count && !pageNumbers.includes(count) &&
-                        _jsxs(_Fragment, { children: [_jsx("li", { children: _jsx("span", { className: "pagination-ellipsis", children: "\u2026" }) }), _jsx("li", { children: _jsx("a", { className: "pagination-link", "aria-label": `Goto page ${count}`, "data-page": count, onClick: pageChange, children: count }) })] })] })] }));
-}
-/**
- * Position setting to css class name map
- */
-const paginationPositionToClassMap = new Map([
-    ["center", "is-centered"],
-    ["right", "is-right"]
-]);
+export { default } from "./component";
+export * from "./types";
+export * from "./utils";

package/components/paginator/types.d.ts

@@ -0,0 +1,28 @@
+import { ElementSize } from "..";
+export interface PaginatorProps {
+    /** Amount of pages */
+    count: number;
+    /** Page change handler */
+    onPageChange: (page: number) => void;
+    /** Current page */
+    currentPage?: number;
+    /**
+     * Page numbers position.
+     * Usefull with `showNextButtons = true`
+    */
+    position?: "left" | "center" | "right";
+    /** Buttons should have rounded borders */
+    rounded?: boolean;
+    /** Size of paginator component elements */
+    size?: ElementSize;
+    /** Additional class names */
+    className?: string;
+    /** Display "Previous" \ "Next" buttons */
+    showNextButtons?: boolean;
+    /**
+     * Max amount of pages from left & right from current page. `3` by default
+     * @description If set to 2 it will show `[1, 2], 3, [4, 5]`
+    */
+    nearPagesCount?: number;
+}
+//# sourceMappingURL=types.d.ts.map

package/components/paginator/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/paginator/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAEjC,MAAM,WAAW,cAAc;IAC3B,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IAEd,0BAA0B;IAC1B,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAErC,mBAAmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;MAGE;IACF,QAAQ,CAAC,EACP,MAAM,GACN,QAAQ,GACR,OAAO,CACR;IAED,0CAA0C;IAC1C,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,0CAA0C;IAC1C,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;MAGE;IACF,cAAc,CAAC,EAAE,MAAM,CAAC;CAC3B"}

package/components/paginator/types.js

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import "./style.scss";
+import { CheckBoxProps } from "..";
+/** Boolean input component */
+declare const CheckBox: ({ label, onValueChange, defaultValue, name, disabled, rounded, size, style, block, withoutBorder, hasBackgroundColor, fixBackgroundColor, isFormLabel, }: CheckBoxProps) => JSX.Element;
+export default CheckBox;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/checkbox/component/index.tsx"],"names":[],"mappings":";AAIA,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,aAAa,EAAE,MAAM,IAAI,CAAC;AAEnC,8BAA8B;AAC9B,QAAA,MAAM,QAAQ,6JAMX,aAAa,KAAG,WAoFlB,CAAC;AAEF,eAAe,QAAQ,CAAC"}

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

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import "./style.scss";
+/** Boolean input component */
+const CheckBox = ({ label, onValueChange, defaultValue, name, disabled, rounded, size, style, block, withoutBorder, hasBackgroundColor, fixBackgroundColor, isFormLabel, }) => {
+    const onChecked = useCallback((event) => onValueChange(event.target.checked), [onValueChange]);
+    const id = name || generateGuid();
+    const className = getClassName([
+        "is-checkradio",
+        "m-check-radio",
+        (hasBackgroundColor ?? false) ? "has-background-color" : "",
+        (fixBackgroundColor ?? false) && (hasBackgroundColor ?? false) ? "m-has-background-color" : "",
+        isNullOrUndefined(size) ? "" : size === "normal" ? "" : `is-${size}`,
+        (rounded ?? false) ? "is-circle" : "",
+        isNullOrUndefined(style) ? "" : `is-${style}`,
+        (block ?? false) ? "is-block" : "",
+        (withoutBorder ?? false) ? "has-no-border" : "",
+    ]);
+    if (!isNullOrUndefined(label) && isFormLabel === true) {
+        const labelClassName = getClassName([
+            "label",
+            label.className
+        ]);
+        const labelContainerClassName = getClassName([
+            "field-label",
+            label.horizontalContainerClassName
+        ]);
+        const fieldContainerClassName = getClassName([
+            "field-body",
+            label.horizontalFieldContainerClassName
+        ]);
+        return (_jsxs("div", { className: "bbr-input field is-horizontal", children: [_jsx("div", { className: labelContainerClassName, children: _jsx("label", { className: labelClassName, children: label.caption }) }), _jsx("div", { className: fieldContainerClassName, children: _jsxs("div", { className: "field", children: [_jsx("input", { type: "checkbox", name: id, id: id, disabled: disabled, onChange: onChecked, className: className, defaultChecked: defaultValue }), _jsx("label", { htmlFor: id })] }) })] }));
+    }
+    return (_jsxs("div", { className: "bbr-input field", children: [_jsx("input", { type: "checkbox", name: id, id: id, disabled: disabled, onChange: onChecked, className: className, defaultChecked: defaultValue }), _jsx("label", { htmlFor: id, children: label?.caption })] }));
+};
+export default CheckBox;

package/components/primitives/checkbox/index.d.ts

@@ -1,29 +1,3 @@
-/// <reference types="react" />
-import "./checkbox.scss";
-import { BaseInputElementProps } from "..";
-export interface CheckBoxProps extends BaseInputElementProps<boolean> {
-    /** Is full colored checkbox */
-    block?: boolean;
-    /** Remove the checkbox border */
-    withoutBorder?: boolean;
-    /**
-     * Checkbox has background color.
-     * Only works if style is set
-    */
-    hasBackgroundColor?: boolean;
-    /**
-     * Set unchecked background as transparent.
-     * Only used with `hasBackgroundColor` set as `true`
-     * @example `{ style: ElementColor.Info, hasBackgrounColor: true, fixBackgroundColor: true }` -
-    */
-    fixBackgroundColor?: boolean;
-    /**
-     * Display component with label as form element.
-     * Label will be placed at left
-     */
-    isFormLabel?: boolean;
-}
-/** Boolean input component */
-declare const CheckBox: ({ label, onValueChange, defaultValue, name, disabled, rounded, size, style, block, withoutBorder, hasBackgroundColor, fixBackgroundColor, isFormLabel, }: CheckBoxProps) => JSX.Element;
-export default CheckBox;
+export { default } from "./component";
+export * from "./types";
 //# sourceMappingURL=index.d.ts.map

package/components/primitives/checkbox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/checkbox/index.tsx"],"names":[],"mappings":";AAIA,OAAO,iBAAiB,CAAC;AAEzB,OAAO,EAAE,qBAAqB,EAAE,MAAM,IAAI,CAAC;AAE3C,MAAM,WAAW,aAAc,SAAQ,qBAAqB,CAAC,OAAO,CAAC;IACjE,+BAA+B;IAC/B,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,iCAAiC;IACjC,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;MAGE;IACF,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;;;MAIE;IACF,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,8BAA8B;AAC9B,QAAA,MAAM,QAAQ,6JAMX,aAAa,KAAG,WAoFlB,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,cAAc,SAAS,CAAC"}

package/components/primitives/checkbox/index.js

@@ -1,38 +1,2 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback } from "react";
-import { generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
-import "./checkbox.scss";
-;
-/** Boolean input component */
-const CheckBox = ({ label, onValueChange, defaultValue, name, disabled, rounded, size, style, block, withoutBorder, hasBackgroundColor, fixBackgroundColor, isFormLabel, }) => {
-    const onChecked = useCallback((event) => onValueChange(event.target.checked), [onValueChange]);
-    const id = name || generateGuid();
-    const className = getClassName([
-        "is-checkradio",
-        "m-check-radio",
-        (hasBackgroundColor ?? false) ? "has-background-color" : "",
-        (fixBackgroundColor ?? false) && (hasBackgroundColor ?? false) ? "m-has-background-color" : "",
-        isNullOrUndefined(size) ? "" : size === "normal" ? "" : `is-${size}`,
-        (rounded ?? false) ? "is-circle" : "",
-        isNullOrUndefined(style) ? "" : `is-${style}`,
-        (block ?? false) ? "is-block" : "",
-        (withoutBorder ?? false) ? "has-no-border" : "",
-    ]);
-    if (!isNullOrUndefined(label) && isFormLabel === true) {
-        const labelClassName = getClassName([
-            "label",
-            label.className
-        ]);
-        const labelContainerClassName = getClassName([
-            "field-label",
-            label.horizontalContainerClassName
-        ]);
-        const fieldContainerClassName = getClassName([
-            "field-body",
-            label.horizontalFieldContainerClassName
-        ]);
-        return (_jsxs("div", { className: "bbr-input field is-horizontal", children: [_jsx("div", { className: labelContainerClassName, children: _jsx("label", { className: labelClassName, children: label.caption }) }), _jsx("div", { className: fieldContainerClassName, children: _jsxs("div", { className: "field", children: [_jsx("input", { type: "checkbox", name: id, id: id, disabled: disabled, onChange: onChecked, className: className, defaultChecked: defaultValue }), _jsx("label", { htmlFor: id })] }) })] }));
-    }
-    return (_jsxs("div", { className: "bbr-input field", children: [_jsx("input", { type: "checkbox", name: id, id: id, disabled: disabled, onChange: onChecked, className: className, defaultChecked: defaultValue }), _jsx("label", { htmlFor: id, children: label?.caption })] }));
-};
-export default CheckBox;
+export { default } from "./component";
+export * from "./types";

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

@@ -0,0 +1,25 @@
+import { BaseInputElementProps } from "..";
+/** Checkbox component props type */
+export interface CheckBoxProps extends BaseInputElementProps<boolean> {
+    /** Is full colored checkbox */
+    block?: boolean;
+    /** Remove the checkbox border */
+    withoutBorder?: boolean;
+    /**
+     * Checkbox has background color.
+     * Only works if style is set
+    */
+    hasBackgroundColor?: boolean;
+    /**
+     * Set unchecked background as transparent.
+     * Only used with `hasBackgroundColor` set as `true`
+     * @example `{ style: ElementColor.Info, hasBackgrounColor: true, fixBackgroundColor: true }` -
+    */
+    fixBackgroundColor?: boolean;
+    /**
+     * Display component with label as form element.
+     * Label will be placed at left
+     */
+    isFormLabel?: boolean;
+}
+//# sourceMappingURL=types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/checkbox/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,IAAI,CAAC;AAE3C,oCAAoC;AACpC,MAAM,WAAW,aAAc,SAAQ,qBAAqB,CAAC,OAAO,CAAC;IACjE,+BAA+B;IAC/B,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,iCAAiC;IACjC,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;MAGE;IACF,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;;;MAIE;IACF,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB"}

package/components/primitives/checkbox/types.js

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,6 @@
+import "../../../../common.scss";
+import { DateProps } from "../..";
+/** Date input component */
+declare const DatePicker: ({ defaultValue, onValueChange, readonly, disabled, validationState, name, size, className, rounded, loading, style, label, onBlur }: DateProps) => JSX.Element;
+export default DatePicker;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/primitives/date/component/index.tsx"],"names":[],"mappings":"AAIA,OAAO,yBAAyB,CAAC;AAIjC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,2BAA2B;AAC3B,QAAA,MAAM,UAAU,wIAMb,SAAS,KAAG,WA4Gd,CAAC;AAEF,eAAe,UAAU,CAAC"}

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

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { generateGuid, getClassName, getValueOrDefault, isStringEmpty } from "@bodynarf/utils";
+import "../../../../common.scss";
+import { ElementSize } from "../../..";
+import { getValidationValues } from "../../../../utils";
+/** Date input component */
+const DatePicker = ({ defaultValue, onValueChange, readonly, disabled, validationState, name, size, className, rounded, loading, style, label, onBlur }) => {
+    const onChange = useCallback((event) => onValueChange(isStringEmpty(event.target.value)
+        ? undefined
+        : new Date(event.target.value)), [onValueChange]);
+    const id = name || generateGuid();
+    const elSizeClassName = "is-{0}".format(getValueOrDefault(size, ElementSize.Normal));
+    const [isValidationDefined, styleClassName, validationMessages] = getValidationValues(style, validationState);
+    const elClassName = getClassName([
+        className,
+        elSizeClassName,
+        styleClassName,
+        rounded === true ? "is-rounded" : "",
+        "input",
+    ]);
+    const inputContainerClassName = getClassName([
+        "control",
+        loading === true ? "is-loading" : "",
+    ]);
+    const stingifiedDefValue = defaultValue?.toISOString().split("T")[0];
+    const labelClassName = getClassName([
+        "label",
+        !label.horizontal ? elSizeClassName : "",
+        label.className
+    ]);
+    if (label.horizontal) {
+        const labelContainerClassName = getClassName([
+            "field-label",
+            elSizeClassName,
+            label.horizontalContainerClassName
+        ]);
+        const fieldContainerClassName = getClassName([
+            "field-body",
+            label.horizontalFieldContainerClassName
+        ]);
+        return (_jsxs("div", { className: "bbr-input field is-horizontal", children: [_jsx("div", { className: labelContainerClassName, children: _jsx("label", { className: labelClassName, htmlFor: id, children: label.caption }) }), _jsx("div", { className: fieldContainerClassName, children: _jsxs("div", { className: "field", children: [_jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "date", className: elClassName, readOnly: readonly, disabled: disabled, defaultValue: stingifiedDefValue, onChange: onChange, onBlur: onBlur, name: id, id: id }) }), isValidationDefined && validationMessages.length > 0 &&
+                                _jsx("p", { className: `help m-help ${styleClassName}`, children: validationMessages.join("\n") })] }) })] }));
+    }
+    return (_jsxs("div", { className: "bbr-input field", children: [_jsx("label", { className: labelClassName, htmlFor: id, children: label.caption }), _jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "date", className: elClassName, readOnly: readonly, disabled: disabled, defaultValue: stingifiedDefValue, onChange: onChange, onBlur: onBlur, name: id, id: id }) }), isValidationDefined && validationMessages.length > 0 &&
+                _jsx("p", { className: `help m-help ${styleClassName}`, children: validationMessages.join("\n") })] }));
+};
+export default DatePicker;

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

@@ -1,14 +1,3 @@
-/// <reference types="react" />
-import "../../../common.scss";
-import { BaseInputElementProps, InputLabel } from "../..";
-/** Date input conponent props type */
-export declare type DateProps = Omit<BaseInputElementProps<Date | undefined>, "placeholder"> & {
-    /** Label configuration */
-    label: InputLabel;
-    /** Focus out event handler */
-    onBlur?: () => void;
-};
-/** Date input component */
-declare const DatePicker: ({ defaultValue, onValueChange, readonly, disabled, validationState, name, size, className, rounded, loading, style, label, onBlur }: DateProps) => JSX.Element;
-export default DatePicker;
+export { default } from "./component";
+export * from "./types";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/date/index.tsx"],"names":[],"mappings":";AAIA,OAAO,sBAAsB,CAAC;AAE9B,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAe,MAAM,OAAO,CAAC;AAGvE,sCAAsC;AACtC,oBAAY,SAAS,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,GAAG,SAAS,CAAC,EAAE,aAAa,CAAC,GAAG;IACnF,0BAA0B;IAC1B,KAAK,EAAE,UAAU,CAAC;IAElB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,CAAA;AAED,2BAA2B;AAC3B,QAAA,MAAM,UAAU,wIAMb,SAAS,KAAG,WA4Gd,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/date/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,cAAc,SAAS,CAAC"}

package/components/primitives/date/index.js

@@ -1,48 +1,2 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback } from "react";
-import { generateGuid, getClassName, getValueOrDefault, isStringEmpty } from "@bodynarf/utils";
-import "../../../common.scss";
-import { ElementSize } from "../..";
-import { getValidationValues } from "../../../utils";
-/** Date input component */
-const DatePicker = ({ defaultValue, onValueChange, readonly, disabled, validationState, name, size, className, rounded, loading, style, label, onBlur }) => {
-    const onChange = useCallback((event) => onValueChange(isStringEmpty(event.target.value)
-        ? undefined
-        : new Date(event.target.value)), [onValueChange]);
-    const id = name || generateGuid();
-    const elSizeClassName = "is-{0}".format(getValueOrDefault(size, ElementSize.Normal));
-    const [isValidationDefined, styleClassName, validationMessages] = getValidationValues(style, validationState);
-    const elClassName = getClassName([
-        className,
-        elSizeClassName,
-        styleClassName,
-        rounded === true ? "is-rounded" : "",
-        "input",
-    ]);
-    const inputContainerClassName = getClassName([
-        "control",
-        loading === true ? "is-loading" : "",
-    ]);
-    const stingifiedDefValue = defaultValue?.toISOString().split("T")[0];
-    const labelClassName = getClassName([
-        "label",
-        !label.horizontal ? elSizeClassName : "",
-        label.className
-    ]);
-    if (label.horizontal) {
-        const labelContainerClassName = getClassName([
-            "field-label",
-            elSizeClassName,
-            label.horizontalContainerClassName
-        ]);
-        const fieldContainerClassName = getClassName([
-            "field-body",
-            label.horizontalFieldContainerClassName
-        ]);
-        return (_jsxs("div", { className: "bbr-input field is-horizontal", children: [_jsx("div", { className: labelContainerClassName, children: _jsx("label", { className: labelClassName, htmlFor: id, children: label.caption }) }), _jsx("div", { className: fieldContainerClassName, children: _jsxs("div", { className: "field", children: [_jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "date", className: elClassName, readOnly: readonly, disabled: disabled, defaultValue: stingifiedDefValue, onChange: onChange, onBlur: onBlur, name: id, id: id }) }), isValidationDefined && validationMessages.length > 0 &&
-                                _jsx("p", { className: `help m-help ${styleClassName}`, children: validationMessages.join("\n") })] }) })] }));
-    }
-    return (_jsxs("div", { className: "bbr-input field", children: [_jsx("label", { className: labelClassName, htmlFor: id, children: label.caption }), _jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "date", className: elClassName, readOnly: readonly, disabled: disabled, defaultValue: stingifiedDefValue, onChange: onChange, onBlur: onBlur, name: id, id: id }) }), isValidationDefined && validationMessages.length > 0 &&
-                _jsx("p", { className: `help m-help ${styleClassName}`, children: validationMessages.join("\n") })] }));
-};
-export default DatePicker;
+export { default } from "./component";
+export * from "./types";

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

@@ -0,0 +1,9 @@
+import { BaseInputElementProps, InputLabel } from "..";
+/** Date input conponent props type */
+export interface DateProps extends Omit<BaseInputElementProps<Date | undefined>, "placeholder"> {
+    /** Label configuration */
+    label: InputLabel;
+    /** Focus out event handler */
+    onBlur?: () => void;
+}
+//# sourceMappingURL=types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/date/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAE,MAAM,IAAI,CAAC;AAEvD,sCAAsC;AACtC,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,qBAAqB,CAAC,IAAI,GAAG,SAAS,CAAC,EAAE,aAAa,CAAC;IAC3F,0BAA0B;IAC1B,KAAK,EAAE,UAAU,CAAC;IAElB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB"}

package/components/primitives/date/types.js

@@ -0,0 +1 @@
+export {};

package/components/primitives/index.d.ts

@@ -1,6 +1,8 @@
+export * from "./checkbox";
 export * from "./date";
 export * from "./multiline";
+export * from "./number";
+export * from "./password";
 export * from "./text";
-export * from "./checkbox";
 export * from "./types";
 //# sourceMappingURL=index.d.ts.map