@bodynarf/react.components 1.12.6 → 1.13.1

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

@@ -1,27 +1,27 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback } from "react";
-import { generateGuid, getClassName, isNullOrUndefined, } from "@bodynarf/utils";
-import { ElementSize } from "../../../../../types";
-import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
-import InternalHint from "../../../internal/hint";
-import ComponentWithLabel from "../../../internal/componentWithLabel";
-/** Textual input with describing label */
-const TextWithLabel = ({ onValueChange, readonly, disabled, defaultValue, validationState, name = generateGuid(), size = ElementSize.Normal, style, rounded = false, loading = false, autoFocus = false, label, placeholder, onBlur, className, title, data, hint, }) => {
-    const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
-    const elClassName = getClassName([
-        className,
-        size === ElementSize.Normal ? "" : `is-${size}`,
-        rounded ? "is-rounded" : "",
-        getStyleClassName(style, validationState),
-        "input",
-    ]);
-    const inputContainerClassName = getClassName([
-        "control",
-        loading ? "is-loading" : "",
-    ]);
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "text", id: name, name: name, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, autoFocus: autoFocus, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
-};
-export default TextWithLabel;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { emptyFn, generateGuid, getClassName, isNullOrUndefined, } from "@bodynarf/utils";
+import { ElementSize } from "../../../../../types";
+import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
+import InternalHint from "../../../internal/hint";
+import ComponentWithLabel from "../../../internal/componentWithLabel";
+/** Textual input with describing label */
+const TextWithLabel = ({ onValueChange = emptyFn, readonly, disabled, defaultValue, validationState, name = generateGuid(), size = ElementSize.Normal, style, rounded = false, loading = false, autoFocus = false, label, placeholder, onBlur, className, title, data, hint, }) => {
+    const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
+    const elClassName = getClassName([
+        className,
+        size === ElementSize.Normal ? "" : `is-${size}`,
+        rounded ? "is-rounded" : "",
+        getStyleClassName(style, validationState),
+        "input",
+    ]);
+    const inputContainerClassName = getClassName([
+        "control",
+        loading ? "is-loading" : "",
+    ]);
+    const dataAttributes = isNullOrUndefined(data)
+        ? undefined
+        : mapDataAttributes(data);
+    return (_jsxs(ComponentWithLabel, { id: name, size: size, label: label, children: [_jsx("div", { className: inputContainerClassName, children: _jsx("input", { type: "text", id: name, name: name, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, autoFocus: autoFocus, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
+};
+export default TextWithLabel;

package/components/primitives/text/components/withoutLabel/index.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
-import { TextProps } from "../..";
-/** Textual input without describing label */
-declare const TextWithoutLabel: ({ onValueChange, defaultValue, validationState, readonly, disabled, name, size, style, rounded, loading, autoFocus, placeholder, onBlur, className, title, data, hint, }: TextProps) => JSX.Element;
-export default TextWithoutLabel;
+import { FC } from "react";
+import { TextProps } from "../..";
+/** Textual input without describing label */
+declare const TextWithoutLabel: FC<TextProps>;
+export default TextWithoutLabel;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/text/components/withoutLabel/index.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,6CAA6C;AAC7C,QAAA,MAAM,gBAAgB,6KAWnB,SAAS,KAAG,WAqDd,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/primitives/text/components/withoutLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAe,MAAM,OAAO,CAAC;AAQrD,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,6CAA6C;AAC7C,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,SAAS,CAgEnC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

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

@@ -1,27 +1,27 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback } from "react";
-import { generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
-import { ElementSize } from "../../../../../types";
-import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
-import InternalHint from "../../../internal/hint";
-/** Textual input without describing label */
-const TextWithoutLabel = ({ onValueChange, defaultValue, validationState, readonly = false, disabled = false, name = generateGuid(), size = ElementSize.Normal, style, rounded = false, loading = false, autoFocus = false, placeholder, onBlur, className, title, data, hint, }) => {
-    const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
-    const elClassName = getClassName([
-        className,
-        size === ElementSize.Normal ? "" : `is-${size}`,
-        rounded ? "is-rounded" : "",
-        getStyleClassName(style, validationState),
-        "input",
-    ]);
-    const containerClassName = getClassName([
-        "control",
-        "bbr-input",
-        loading ? "is-loading" : "",
-    ]);
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    return (_jsxs("div", { className: "bbr-field field", children: [_jsx("div", { className: containerClassName, children: _jsx("input", { type: "text", id: name, name: name, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, autoFocus: autoFocus, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
-};
-export default TextWithoutLabel;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { emptyFn, generateGuid, getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import { ElementSize } from "../../../../../types";
+import { getStyleClassName, mapDataAttributes } from "../../../../../utils";
+import InternalHint from "../../../internal/hint";
+/** Textual input without describing label */
+const TextWithoutLabel = ({ onValueChange = emptyFn, defaultValue, validationState, readonly = false, disabled = false, name = generateGuid(), size = ElementSize.Normal, style, rounded = false, loading = false, autoFocus = false, placeholder, onBlur, className, title, data, hint, }) => {
+    const onChange = useCallback((event) => onValueChange(event.target.value), [onValueChange]);
+    const elClassName = getClassName([
+        className,
+        size === ElementSize.Normal ? "" : `is-${size}`,
+        rounded ? "is-rounded" : "",
+        getStyleClassName(style, validationState),
+        "input",
+    ]);
+    const containerClassName = getClassName([
+        "control",
+        "bbr-input",
+        loading ? "is-loading" : "",
+    ]);
+    const dataAttributes = isNullOrUndefined(data)
+        ? undefined
+        : mapDataAttributes(data);
+    return (_jsxs("div", { className: "bbr-field field", children: [_jsx("div", { className: containerClassName, children: _jsx("input", { type: "text", id: name, name: name, onBlur: onBlur, readOnly: readonly, disabled: disabled, onChange: onChange, className: elClassName, placeholder: placeholder, defaultValue: defaultValue, autoFocus: autoFocus, title: title, ...dataAttributes }) }), _jsx(InternalHint, { hint: hint, validationState: validationState })] }));
+};
+export default TextWithoutLabel;

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

@@ -1,3 +1,3 @@
-export { default } from "./component";
-export * from "./types";
+export { default } from "./component";
+export * from "./types";
 //# sourceMappingURL=index.d.ts.map

package/components/primitives/text/index.js

@@ -1,2 +1,2 @@
-export { default } from "./component";
-export * from "./types";
+export { default } from "./component";
+export * from "./types";

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

@@ -1,7 +1,4 @@
-import { BaseInputElementProps } from "../../../types";
-/** Text input component props type */
-export interface TextProps extends BaseInputElementProps<string> {
-    /** Focus out event handler */
-    onBlur?: () => void;
-}
+import { BaseNotNullableInputElementProps, BlurableElement } from "../../../types";
+/** Text input component props type */
+export type TextProps = BaseNotNullableInputElementProps<string> & BlurableElement;
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/text/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAEnD,sCAAsC;AACtC,MAAM,WAAW,SAAU,SAAQ,qBAAqB,CAAC,MAAM,CAAC;IAC5D,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/primitives/text/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gCAAgC,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAE/E,sCAAsC;AACtC,MAAM,MAAM,SAAS,GAAG,gCAAgC,CAAC,MAAM,CAAC,GAAG,eAAe,CAAC"}

package/components/primitives/text/types.js

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

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

@@ -1,6 +1,7 @@
-/// <reference types="react" />
-import "./style.scss";
-import { SearchProps } from "..";
-/** Search component */
-export default function Search({ searchType, onSearch, caption, defaultValue, size, isLoading, rounded, disabled, autoFocus, searchButtonCaption, searchButtonTitle, className, title, data, }: SearchProps): JSX.Element;
+import { FC } from "react";
+import "./style.scss";
+import { SearchProps } from "..";
+/** Search component */
+declare const Search: FC<SearchProps>;
+export default Search;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/search/component/index.tsx"],"names":[],"mappings":";AAQA,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAEjC,uBAAuB;AACvB,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC3B,UAAU,EAAE,QAAQ,EAAE,OAAO,EAC7B,YAAiB,EACjB,IAAyB,EACzB,SAAiB,EAAE,OAAe,EAAE,QAAgB,EACpD,SAAiB,EACjB,mBAA8B,EAAE,iBAAiB,EAEjD,SAAS,EAAE,KAAK,EAAE,IAAI,GACzB,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CAwF3B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/search/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAAyB,MAAM,OAAO,CAAC;AAQ/D,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAEjC,uBAAuB;AACvB,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAkG3B,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/components/search/component/index.js

@@ -1,40 +1,41 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useState } from "react";
-import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
-import { ElementSize } from "../../../types";
-import { mapDataAttributes } from "../../../utils";
-import Button from "../../button";
-import "./style.scss";
-/** Search component */
-export default function Search({ searchType, onSearch, caption, defaultValue = "", size = ElementSize.Normal, isLoading = false, rounded = false, disabled = false, autoFocus = false, searchButtonCaption = "Search", searchButtonTitle, className, title, data, }) {
-    const [searchValue, setSearchValue] = useState(defaultValue);
-    const onChange = useCallback((event) => {
-        const elementValue = event.target.value;
-        if (searchType === "byTyping") {
-            onSearch(elementValue);
-        }
-        setSearchValue(elementValue);
-    }, [onSearch, searchType]);
-    const onSearchButtonClick = useCallback(() => onSearch(searchValue), [onSearch, searchValue]);
-    const elClassName = getClassName([
-        "bbr-search",
-        "control",
-        className,
-        `is-${size}`,
-        isLoading ? "is-loading" : "",
-        searchType === "byButton" ? "is-expanded" : "",
-    ]);
-    const inputClassName = getClassName([
-        "input",
-        "is-unselectable",
-        `is-${size}`,
-        rounded ? "is-rounded" : "",
-    ]);
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    if (searchType === "byButton") {
-        return (_jsxs("div", { className: "field has-addons", children: [_jsx("div", { className: elClassName, children: _jsx("input", { type: "search", disabled: disabled, onChange: onChange, placeholder: caption, autoFocus: autoFocus, defaultValue: searchValue, className: inputClassName, title: title, ...dataAttributes }) }), _jsx("div", { className: "control", children: _jsx(Button, { type: "info", size: size, disabled: disabled, isLoading: isLoading, title: searchButtonTitle, caption: searchButtonCaption, onClick: onSearchButtonClick }) })] }));
-    }
-    return (_jsx("div", { className: elClassName, children: _jsx("input", { type: "search", disabled: disabled, onChange: onChange, placeholder: caption, autoFocus: autoFocus, defaultValue: searchValue, className: inputClassName, title: title, ...dataAttributes }) }));
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useState } from "react";
+import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import { ElementSize } from "../../../types";
+import { mapDataAttributes } from "../../../utils";
+import Button, { ButtonStyle } from "../../button";
+import "./style.scss";
+/** Search component */
+const Search = ({ searchType, onSearch, caption, defaultValue = "", size = ElementSize.Normal, isLoading = false, rounded = false, disabled = false, autoFocus = false, searchButtonCaption = "Search", searchButtonTitle, className, title, data, }) => {
+    const [searchValue, setSearchValue] = useState(defaultValue);
+    const onChange = useCallback((event) => {
+        const elementValue = event.target.value;
+        if (searchType === "byTyping") {
+            onSearch(elementValue);
+        }
+        setSearchValue(elementValue);
+    }, [onSearch, searchType]);
+    const onSearchButtonClick = useCallback(() => onSearch(searchValue), [onSearch, searchValue]);
+    const elClassName = getClassName([
+        "bbr-search",
+        "control",
+        className,
+        `is-${size}`,
+        isLoading ? "is-loading" : "",
+        searchType === "byButton" ? "is-expanded" : "",
+    ]);
+    const inputClassName = getClassName([
+        "input",
+        "is-unselectable",
+        `is-${size}`,
+        rounded ? "is-rounded" : "",
+    ]);
+    const dataAttributes = isNullOrUndefined(data)
+        ? undefined
+        : mapDataAttributes(data);
+    if (searchType === "byButton") {
+        return (_jsxs("div", { className: "field has-addons", children: [_jsx("div", { className: elClassName, children: _jsx("input", { type: "search", disabled: disabled, onChange: onChange, placeholder: caption, autoFocus: autoFocus, defaultValue: searchValue, className: inputClassName, title: title, ...dataAttributes }) }), _jsx("div", { className: "control", children: _jsx(Button, { size: size, disabled: disabled, isLoading: isLoading, style: ButtonStyle.Info, title: searchButtonTitle, caption: searchButtonCaption, onClick: onSearchButtonClick, className: rounded ? "is-rounded" : undefined }) })] }));
+    }
+    return (_jsx("div", { className: elClassName, children: _jsx("input", { type: "search", disabled: disabled, onChange: onChange, placeholder: caption, autoFocus: autoFocus, defaultValue: searchValue, className: inputClassName, title: title, ...dataAttributes }) }));
+};
+export default Search;

package/components/search/index.d.ts

@@ -1,3 +1,3 @@
-export { default } from "./component";
-export * from "./types";
+export { default } from "./component";
+export * from "./types";
 //# sourceMappingURL=index.d.ts.map

package/components/search/index.js

@@ -1,2 +1,2 @@
-export { default } from "./component";
-export * from "./types";
+export { default } from "./component";
+export * from "./types";

package/components/search/types.d.ts

@@ -1,42 +1,42 @@
-import { BaseElementProps, ElementSize } from "../../types";
-/** Search component props type */
-export interface SearchProps extends BaseElementProps {
-    /**
-     * Search type: by typing, starts from minimum characters to search
-     * or by clicking on button next to search bar.
-     * Default `is byTyping`
-    */
-    searchType: "byTyping" | "byButton";
-    /** Search caption */
-    caption: string;
-    /** Search handler */
-    onSearch: (searchPattern: string) => void;
-    /** Initial search value */
-    defaultValue?: string;
-    /** Size of search bar */
-    size?: ElementSize;
-    /** Should search bar be rounded */
-    rounded?: boolean;
-    /** Is search bar disabled */
-    disabled?: boolean;
-    /** Should loading icon be displayed in search bar */
-    isLoading?: boolean;
-    /**
-     * Set focus on search field after render
-     *
-     * !NOTE! Only 1 element at page can have this flag
-     */
-    autoFocus?: boolean;
-    /**
-     * Caption for search button.
-     * Visible only in `searchType = "byButton"`
-     * @default "Search"
-     */
-    searchButtonCaption?: string;
-    /**
-     * Title for search button.
-     * Visible only in `searchType = "byButton"`
-     */
-    searchButtonTitle?: string;
-}
+import { BaseElementProps, ElementSize } from "../../types";
+/** Search component props type */
+export type SearchProps = BaseElementProps & {
+    /**
+     * Search type: by typing, starts from minimum characters to search
+     * or by clicking on button next to search bar.
+     * Default `is byTyping`
+    */
+    searchType: "byTyping" | "byButton";
+    /** Search caption */
+    caption: string;
+    /** Search handler */
+    onSearch: (searchPattern: string) => void;
+    /** Initial search value */
+    defaultValue?: string;
+    /** Size of search bar */
+    size?: ElementSize;
+    /** Should search bar be rounded */
+    rounded?: boolean;
+    /** Is search bar disabled */
+    disabled?: boolean;
+    /** Should loading icon be displayed in search bar */
+    isLoading?: boolean;
+    /**
+     * Set focus on search field after render
+     *
+     * !NOTE! Only 1 element at page can have this flag
+     */
+    autoFocus?: boolean;
+    /**
+     * Caption for search button.
+     * Visible only in `searchType = "byButton"`
+     * @default "Search"
+     */
+    searchButtonCaption?: string;
+    /**
+     * Title for search button.
+     * Visible only in `searchType = "byButton"`
+     */
+    searchButtonTitle?: string;
+};
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/search/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE3D,kCAAkC;AAClC,MAAM,WAAW,WAAY,SAAQ,gBAAgB;IACjD;;;;MAIE;IACF,UAAU,EAAE,UAAU,GAAG,UAAU,CAAC;IAEpC,qBAAqB;IACrB,OAAO,EAAE,MAAM,CAAC;IAEhB,qBAAqB;IACrB,QAAQ,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAE1C,2BAA2B;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,yBAAyB;IACzB,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,mCAAmC;IACnC,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,qDAAqD;IACrD,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC9B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/search/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE3D,kCAAkC;AAClC,MAAM,MAAM,WAAW,GAAG,gBAAgB,GAAG;IACzC;;;;MAIE;IACF,UAAU,EAAE,UAAU,GAAG,UAAU,CAAC;IAEpC,qBAAqB;IACrB,OAAO,EAAE,MAAM,CAAC;IAEhB,qBAAqB;IACrB,QAAQ,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAE1C,2BAA2B;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,yBAAyB;IACzB,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,mCAAmC;IACnC,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,qDAAqD;IACrD,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC"}

package/components/search/types.js

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

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

@@ -1,10 +1,9 @@
-/// <reference types="react" />
-import { TableProps } from "..";
-import "./style.scss";
-/**
- * Tiny table component.
- * If no sorting is use - use `any` as generic param
- */
-declare function Table<TItem>({ headings, hasBorder, hoverable, narrow, fullWidth, zebra, headerBorderless, hasStickyHeader, headerWithBorder, currentSortColumn, onHeaderClick, children, className, title, data, }: TableProps<TItem>): JSX.Element;
-export default Table;
+import { FC } from "react";
+import { TableProps } from "..";
+import "./style.scss";
+/**
+ * Tiny table component
+ */
+declare const Table: FC<TableProps>;
+export default Table;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/table/component/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,IAAI,CAAC;AAChC,OAAO,cAAc,CAAC;AAItB;;;GAGG;AACH,iBAAS,KAAK,CAAC,KAAK,EAAE,EAClB,QAAQ,EAER,SAAiB,EAAE,SAAiB,EAAE,MAAc,EACpD,SAAiB,EAAE,KAAa,EAAE,gBAAwB,EAC1D,eAAuB,EAAE,gBAAwB,EAEjD,iBAAiB,EAAE,aAAa,EAChC,QAAQ,EAER,SAAS,EAAE,KAAK,EAAE,IAAI,GACzB,EAAE,UAAU,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CA4CjC;AAED,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/table/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAM3B,OAAO,EAAE,UAAU,EAAE,MAAM,IAAI,CAAC;AAChC,OAAO,cAAc,CAAC;AAItB;;GAEG;AACH,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAuDzB,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/components/table/component/index.js

@@ -1,29 +1,28 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
-import { mapDataAttributes } from "../../../utils";
-import "./style.scss";
-import TableHeader from "../components/heading";
-/**
- * Tiny table component.
- * If no sorting is use - use `any` as generic param
- */
-function Table({ headings, hasBorder = false, hoverable = false, narrow = false, fullWidth = false, zebra = false, headerBorderless = false, hasStickyHeader = false, headerWithBorder = false, currentSortColumn, onHeaderClick, children, className, title, data, }) {
-    const elClassName = getClassName([
-        "bbr-table",
-        "table",
-        className,
-        hasBorder ? "is-bordered" : "",
-        hoverable ? "is-hoverable" : "",
-        narrow ? "is-narrow" : "",
-        fullWidth ? "is-fullwidth" : "",
-        zebra ? "is-striped" : "",
-        hasStickyHeader ? "has-sticky-header" : "",
-        headerWithBorder ? "has-borderless-header has-shadow-bordered-header" : "",
-        headerBorderless ? "has-borderless-header" : "",
-    ]);
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    return (_jsxs("table", { className: elClassName, title: title, ...dataAttributes, children: [_jsx("thead", { children: _jsx("tr", { children: headings.map((heading, i) => _jsx(TableHeader, { ...heading, onClick: onHeaderClick, sortColumn: currentSortColumn }, i)) }) }), _jsx("tbody", { children: children })] }));
-}
-export default Table;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import { mapDataAttributes } from "../../../utils";
+import "./style.scss";
+import TableHeader from "../components/heading";
+/**
+ * Tiny table component
+ */
+const Table = ({ headings, hasBorder = false, hoverable = false, narrow = false, fullWidth = false, zebra = false, headerBorderless = false, hasStickyHeader = false, headerWithBorder = false, currentSortColumn, onHeaderClick, children, className, title, data, }) => {
+    const elClassName = getClassName([
+        "bbr-table",
+        "table",
+        className,
+        hasBorder ? "is-bordered" : "",
+        hoverable ? "is-hoverable" : "",
+        narrow ? "is-narrow" : "",
+        fullWidth ? "is-fullwidth" : "",
+        zebra ? "is-striped" : "",
+        hasStickyHeader ? "has-sticky-header" : "",
+        headerWithBorder ? "has-borderless-header has-shadow-bordered-header" : "",
+        headerBorderless ? "has-borderless-header" : "",
+    ]);
+    const dataAttributes = isNullOrUndefined(data)
+        ? undefined
+        : mapDataAttributes(data);
+    return (_jsxs("table", { className: elClassName, title: title, ...dataAttributes, children: [_jsx("thead", { children: _jsx("tr", { children: headings.map((heading, i) => _jsx(TableHeader, { item: heading, onClick: onHeaderClick, sortColumn: currentSortColumn }, heading.name ?? i)) }) }), _jsx("tbody", { children: children })] }));
+};
+export default Table;

package/components/table/components/heading/index.d.ts

@@ -1,13 +1,15 @@
-/// <reference types="react" />
-import { SortColumn, TableHeading } from "../../types";
-/** Table heading cell component props */
-export interface TableHeaderProps<TItem> extends TableHeading<TItem> {
-    /** Current sort column */
-    sortColumn?: SortColumn<TItem>;
-    /** Cell click handler */
-    onClick?: (column: TableHeading<TItem>) => void;
-}
-/** Table heading cell */
-declare function TableHeader<TItem>(props: TableHeaderProps<TItem>): JSX.Element;
-export default TableHeader;
+import { FC } from "react";
+import { SortColumn, TableHeading } from "../../types";
+/** Table heading cell component props */
+export type TableHeaderProps = {
+    /** Table heading item */
+    item: TableHeading;
+    /** Current sort column */
+    sortColumn?: SortColumn;
+    /** Cell click handler */
+    onClick?: (column: TableHeading) => void;
+};
+/** Table heading cell */
+declare const TableHeader: FC<TableHeaderProps>;
+export default TableHeader;
 //# sourceMappingURL=index.d.ts.map

package/components/table/components/heading/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/table/components/heading/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEvD,yCAAyC;AACzC,MAAM,WAAW,gBAAgB,CAAC,KAAK,CAAE,SAAQ,YAAY,CAAC,KAAK,CAAC;IAChE,0BAA0B;IAC1B,UAAU,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,CAAC;IAE/B,yBAAyB;IACzB,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;CACnD;AAED,yBAAyB;AACzB,iBAAS,WAAW,CAAC,KAAK,EAAE,KAAK,EAAE,gBAAgB,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAkCvE;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/table/components/heading/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAe,MAAM,OAAO,CAAC;AAMxC,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEvD,yCAAyC;AACzC,MAAM,MAAM,gBAAgB,GAAG;IAC3B,yBAAyB;IACzB,IAAI,EAAE,YAAY,CAAC;IAEnB,0BAA0B;IAC1B,UAAU,CAAC,EAAE,UAAU,CAAC;IAExB,yBAAyB;IACzB,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;CAC5C,CAAC;AAEF,yBAAyB;AACzB,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAqCrC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/components/table/components/heading/index.js

@@ -1,21 +1,21 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback } from "react";
-import { getClassName, isNullish, isNullOrUndefined } from "@bodynarf/utils";
-import Icon from "../../../icon";
-/** Table heading cell */
-function TableHeader(props) {
-    const { className, caption, name, sortable, sortColumn, onClick } = props;
-    const onHeaderClick = useCallback(() => {
-        if (sortable && !isNullOrUndefined(onClick)) {
-            onClick(props);
-        }
-    }, [onClick, props, sortable]);
-    const containerClassName = getClassName([
-        className,
-        sortable ? "is-clickable" : "",
-    ]);
-    return (_jsxs("th", { onClick: onHeaderClick, className: isNullish(containerClassName) ? undefined : containerClassName, children: [_jsx("span", { children: caption }), sortable && sortColumn?.columnName === name
-                &&
-                    _jsx(Icon, { className: "ml-1", name: `sort-alpha-down${sortColumn.ascending ? "" : "-alt"}` })] }));
-}
-export default TableHeader;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback } from "react";
+import { getClassName, isNullish, isNullOrUndefined } from "@bodynarf/utils";
+import Icon from "../../../icon";
+/** Table heading cell */
+const TableHeader = ({ item, sortColumn, onClick }) => {
+    const { className, caption, name, sortable } = item;
+    const onHeaderClick = useCallback(() => {
+        if (sortable && !isNullOrUndefined(onClick)) {
+            onClick(item);
+        }
+    }, [onClick, item, sortable]);
+    const containerClassName = getClassName([
+        className,
+        sortable ? "is-clickable" : "",
+    ]);
+    return (_jsxs("th", { onClick: onHeaderClick, className: isNullish(containerClassName) ? undefined : containerClassName, children: [_jsx("span", { children: caption }), !!sortable && sortColumn?.columnName === name
+                &&
+                    _jsx(Icon, { className: "ml-1", name: `sort-alpha-down${sortColumn.ascending ? "" : "-alt"}` })] }));
+};
+export default TableHeader;

package/components/table/index.d.ts

@@ -1,3 +1,3 @@
-export { default } from "./component";
-export * from "./types";
+export { default } from "./component";
+export * from "./types";
 //# sourceMappingURL=index.d.ts.map

package/components/table/index.js

@@ -1,2 +1,2 @@
-export { default } from "./component";
-export * from "./types";
+export { default } from "./component";
+export * from "./types";