@bodynarf/react.components 1.12.6 → 1.13.0

package/changelog.md

@@ -0,0 +1,54 @@
+# Change log
+All changes will be published here in reverse chronological order
+
+## v1.2.0
+- **Accordion**
+  - Fixed an issue where the height changed incorrectly when the component’s `size` prop was updated.
+  - Fixed an issue where the `onToggle` callback was triggered on the initial render.
+
+- **Anchor**
+  - Component is now marked as deprecated. Use the native `<a>` element instead.
+
+- **Breadcrumbs**
+  - Fixed an issue with applying the positioning prop.
+  - Updated the breadcrumb model (see type definition).
+
+- **Button**
+  - Introduced the `style` prop, which replaces the old `type` prop. Typing has been updated to use `enum ButtonStyle`.
+
+- **Dropdown**
+  - Made the `placeholder` and `hideOnOuterClick` props optional.
+  - Made the `value` prop required, while allowing `undefined`.
+  - Fixed visual styles for the disabled state.
+  - When the item list is empty or when no items are found in search mode, the dropdown displays its text in *italic* and gray.
+
+- **File**
+  - Added missing styles for the disabled state.
+
+- **Icon**
+  - When the `onClick` prop is provided, the `is-clickable` CSS class is now added automatically to make the element interactive (see Bulma documentation).
+  - Updated CSS class names related to button sizes.
+
+- **Multiselect**
+  - Made the `placeholder` and `hideOnOuterClick` props optional.
+
+- **Paginator**
+  - Added error handling for the case when `currentPage > count` (see props).
+  - Made the `currentPage` prop required since it is used for internal rendering.
+
+- **Search**
+  - Fixed an issue where the button did not have rounded corners.
+
+- **Table**
+  - Adjusted prop typings and removed the generic parameter to simplify usage.
+  - Made the `children` prop required since it represents the main content of the table.
+
+- **All input controls**
+  - Updated the `onValueChange` callback signature to support `nullable` values, depending on the component.
+
+- **Checkbox**
+  - Updated requirements for members of the `label` prop.
+  - Fixed a mismatch between the component size and the form label size.
+
+- **Password**
+  - Ensured the show/hide password icon scales when the control size changes.

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

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-import "./style.scss";
-import { AccordionProps } from "..";
-/** Accordion panel */
-declare const Accordion: ({ children, caption, style, size, defaultExpanded, onToggle, className, title, data, }: AccordionProps) => JSX.Element;
-export default Accordion;
+import { FC } from "react";
+import "./style.scss";
+import { AccordionProps } from "..";
+/** Accordion panel */
+declare const Accordion: FC<AccordionProps>;
+export default Accordion;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/accordion/component/index.tsx"],"names":[],"mappings":";AAQA,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,cAAc,EAAE,MAAM,IAAI,CAAC;AAEpC,sBAAsB;AACtB,QAAA,MAAM,SAAS,2FAOZ,cAAc,KAAG,WA+DnB,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/accordion/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA4C,MAAM,OAAO,CAAC;AAQrE,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,cAAc,EAAE,MAAM,IAAI,CAAC;AAEpC,sBAAsB;AACtB,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAoEjC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/components/accordion/component/index.js

@@ -1,35 +1,33 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { emptyFn, getClassName, isNullOrUndefined } from "@bodynarf/utils";
-import { ElementSize } from "../../../types";
-import { mapDataAttributes } from "../../../utils";
-import Icon from "../../icon";
-import "./style.scss";
-/** Accordion panel */
-const Accordion = ({ children, caption, style, size = ElementSize.Normal, defaultExpanded = false, onToggle = emptyFn, className, title, data, }) => {
-    const expandablePanelRef = useRef(null);
-    const [isExpanded, setIsExpanded] = useState(defaultExpanded);
-    const [maxHeight, setMaxHeight] = useState(defaultExpanded ? undefined : 0);
-    const toggleCollapse = useCallback(() => setMaxHeight(isExpanded ? 0 : expandablePanelRef.current.scrollHeight), [isExpanded]);
-    useEffect(() => {
-        if (defaultExpanded && !isNullOrUndefined(expandablePanelRef.current)) {
-            setMaxHeight(expandablePanelRef.current.scrollHeight);
-        }
-    }, [defaultExpanded]);
-    useEffect(() => setIsExpanded(maxHeight !== 0), [maxHeight]);
-    useEffect(() => {
-        onToggle.call(undefined, !isExpanded);
-    }, [isExpanded, onToggle]);
-    const elClassName = getClassName([
-        "bbr-accordion",
-        "message",
-        isNullOrUndefined(style) ? "" : `is-${style}`,
-        isNullOrUndefined(size) ? "" : `is-${size}`,
-        className,
-    ]);
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    return (_jsxs("article", { className: elClassName, "aria-expanded": isExpanded, ...dataAttributes, children: [_jsxs("div", { className: "message-header is-unselectable", onClick: toggleCollapse, children: [_jsx("span", { title: title, children: caption }), _jsx(Icon, { name: "arrow-down", size: size })] }), _jsx("div", { className: "message-body", ref: expandablePanelRef, style: { maxHeight: `${maxHeight}px` }, children: _jsx("div", { className: "message-body__content", children: children }) })] }));
-};
-export default Accordion;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { emptyFn, getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import { ElementSize } from "../../../types";
+import { mapDataAttributes } from "../../../utils";
+import Icon from "../../icon";
+import "./style.scss";
+/** Accordion panel */
+const Accordion = ({ children, caption, style, size = ElementSize.Normal, defaultExpanded = false, onToggle = emptyFn, className, title, data, }) => {
+    const expandablePanelRef = useRef(null);
+    const [isExpanded, setIsExpanded] = useState(defaultExpanded);
+    const [maxHeight, setMaxHeight] = useState(defaultExpanded ? undefined : 0);
+    const toggleCollapse = useCallback(() => setMaxHeight(isExpanded ? 0 : expandablePanelRef.current.scrollHeight), [isExpanded]);
+    useEffect(() => {
+        if (defaultExpanded && !isNullOrUndefined(expandablePanelRef.current)) {
+            setMaxHeight(expandablePanelRef.current.scrollHeight);
+        }
+    }, [defaultExpanded, size]);
+    useEffect(() => setIsExpanded(maxHeight !== 0), [maxHeight]);
+    useEffect(() => onToggle.call(undefined, !isExpanded), [isExpanded, onToggle]);
+    const elClassName = getClassName([
+        "bbr-accordion",
+        "message",
+        isNullOrUndefined(style) ? "" : `is-${style}`,
+        isNullOrUndefined(size) ? "" : `is-${size}`,
+        className,
+    ]);
+    const dataAttributes = isNullOrUndefined(data)
+        ? undefined
+        : mapDataAttributes(data);
+    return (_jsxs("article", { className: elClassName, "aria-expanded": isExpanded, ...dataAttributes, children: [_jsxs("div", { className: "message-header is-unselectable", onClick: toggleCollapse, children: [_jsx("span", { title: title, children: caption }), _jsx(Icon, { name: "arrow-down", size: size })] }), _jsx("div", { className: "message-body", ref: expandablePanelRef, style: { maxHeight: `${maxHeight}px` }, children: _jsx("div", { className: "message-body__content", children: children }) })] }));
+};
+export default Accordion;

package/components/accordion/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/accordion/index.js

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

package/components/accordion/types.d.ts

@@ -1,18 +1,17 @@
-/// <reference types="react" />
-import { BaseElementProps, ElementColor, ElementSize } from "../../types";
-/** Accordion panel props type */
-export interface AccordionProps extends BaseElementProps {
-    /** Content that should be collapsed inside */
-    children: React.ReactNode;
-    /** Collapsible panel caption */
-    caption: string;
-    /** Default expanded state */
-    defaultExpanded?: boolean;
-    /** Panel size */
-    size?: ElementSize;
-    /** Color */
-    style?: ElementColor;
-    /** Extra handler for toggling visibility. Doesn't affect component logic */
-    onToggle?: (collapsed: boolean) => void;
-}
+import { BaseElementProps, ElementColor, ElementSize } from "../../types";
+/** Accordion panel props type */
+export interface AccordionProps extends BaseElementProps {
+    /** Content that should be collapsed inside */
+    children: React.ReactNode;
+    /** Collapsible panel caption */
+    caption: string;
+    /** Default expanded state */
+    defaultExpanded?: boolean;
+    /** Panel size */
+    size?: ElementSize;
+    /** Color */
+    style?: ElementColor;
+    /** Extra handler for toggling visibility. Doesn't affect component logic */
+    onToggle?: (collapsed: boolean) => void;
+}
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAEzE,iCAAiC;AACjC,MAAM,WAAW,cAAe,SAAQ,gBAAgB;IACpD,8CAA8C;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,gCAAgC;IAChC,OAAO,EAAE,MAAM,CAAC;IAEhB,6BAA6B;IAC7B,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,iBAAiB;IACjB,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,YAAY;IACZ,KAAK,CAAC,EAAE,YAAY,CAAC;IAErB,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC3C"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAEzE,iCAAiC;AACjC,MAAM,WAAW,cAAe,SAAQ,gBAAgB;IACpD,8CAA8C;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,gCAAgC;IAChC,OAAO,EAAE,MAAM,CAAC;IAEhB,6BAA6B;IAC7B,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,iBAAiB;IACjB,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,YAAY;IACZ,KAAK,CAAC,EAAE,YAAY,CAAC;IAErB,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC3C"}

package/components/accordion/types.js

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

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

@@ -1,6 +1,8 @@
-/// <reference types="react" />
-import "./style.scss";
-import { AnchorProps } from "..";
-/** Anchor component */
-export default function Anchor(props: AnchorProps): JSX.Element;
+import "./style.scss";
+import { AnchorProps } from "..";
+/**
+ * Anchor component
+ * @deprecated Since v1.12.7. Use html element with custom formatting
+ */
+export default function Anchor(props: AnchorProps): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/anchor/component/index.tsx"],"names":[],"mappings":";AAEA,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAIjC,uBAAuB;AACvB,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CA6B9D"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/anchor/component/index.tsx"],"names":[],"mappings":"AAEA,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,WAAW,EAAE,MAAM,IAAI,CAAC;AAIjC;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CA6B9D"}

package/components/anchor/component/index.js

@@ -1,20 +1,23 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { isNullOrUndefined, getClassName } from "@bodynarf/utils";
-import "./style.scss";
-import SimpleAnchor from "../components/simpleAnchor";
-import AnchorWithIcon from "../components/anchorWithIcon";
-/** Anchor component */
-export default function Anchor(props) {
-    if (isNullOrUndefined(props.caption) && isNullOrUndefined(props.icon)) {
-        throw new Error("No anchor content provided");
-    }
-    const className = getClassName([
-        "bbr-anchor",
-        props.className,
-        props.disableHovering === true ? "bbr-anchor--unhoverable" : ""
-    ]);
-    if (isNullOrUndefined(props.icon)) {
-        return (_jsx(SimpleAnchor, { ...props, className: className }));
-    }
-    return (_jsx(AnchorWithIcon, { ...props, icon: props.icon, className: className }));
-}
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isNullOrUndefined, getClassName } from "@bodynarf/utils";
+import "./style.scss";
+import SimpleAnchor from "../components/simpleAnchor";
+import AnchorWithIcon from "../components/anchorWithIcon";
+/**
+ * Anchor component
+ * @deprecated Since v1.12.7. Use html element with custom formatting
+ */
+export default function Anchor(props) {
+    if (isNullOrUndefined(props.caption) && isNullOrUndefined(props.icon)) {
+        throw new Error("No anchor content provided");
+    }
+    const className = getClassName([
+        "bbr-anchor",
+        props.className,
+        props.disableHovering === true ? "bbr-anchor--unhoverable" : ""
+    ]);
+    if (isNullOrUndefined(props.icon)) {
+        return (_jsx(SimpleAnchor, { ...props, className: className }));
+    }
+    return (_jsx(AnchorWithIcon, { ...props, icon: props.icon, className: className }));
+}

package/components/anchor/components/anchorWithIcon/index.d.ts

@@ -1,11 +1,11 @@
-import { ElementIcon } from "../../../../types";
-import { AnchorProps } from "../..";
-/** Props type of `AnchorWithIcon` */
-interface AnchorWithIconProps extends Omit<AnchorProps, "icon"> {
-    /** Configuration of icon */
-    icon: ElementIcon;
-}
-/** Anchor with icon component */
-declare const AnchorWithIcon: ({ href, caption, target, icon, onClick, className, title, data, }: AnchorWithIconProps) => JSX.Element;
-export default AnchorWithIcon;
+import { ElementIcon } from "../../../../types";
+import { AnchorProps } from "../..";
+/** Props type of `AnchorWithIcon` */
+interface AnchorWithIconProps extends Omit<AnchorProps, "icon"> {
+    /** Configuration of icon */
+    icon: ElementIcon;
+}
+/** Anchor with icon component */
+declare const AnchorWithIcon: ({ href, caption, target, icon, onClick, className, title, data, }: AnchorWithIconProps) => JSX.Element;
+export default AnchorWithIcon;
 //# sourceMappingURL=index.d.ts.map

package/components/anchor/components/anchorWithIcon/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/anchor/components/anchorWithIcon/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAmB,MAAM,YAAY,CAAC;AAI1D,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,qCAAqC;AACrC,UAAU,mBAAoB,SAAQ,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC;IAC3D,4BAA4B;IAC5B,IAAI,EAAE,WAAW,CAAC;CACrB;AAED,iCAAiC;AACjC,QAAA,MAAM,cAAc,sEAMjB,mBAAmB,KAAG,WA6CxB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/anchor/components/anchorWithIcon/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAmB,MAAM,YAAY,CAAC;AAI1D,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,qCAAqC;AACrC,UAAU,mBAAoB,SAAQ,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC;IAC3D,4BAA4B;IAC5B,IAAI,EAAE,WAAW,CAAC;CACrB;AAED,iCAAiC;AACjC,QAAA,MAAM,cAAc,GAAI,mEAMrB,mBAAmB,KAAG,GAAG,CAAC,OA6C5B,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/components/anchor/components/anchorWithIcon/index.js

@@ -1,24 +1,24 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getClassName, isNullOrEmpty, isNullOrUndefined } from "@bodynarf/utils";
-import { ElementPosition } from "../../../../types";
-import { mapDataAttributes } from "../../../../utils";
-import Icon from "../../../icon";
-/** Anchor with icon component */
-const AnchorWithIcon = ({ href, caption, target, icon, onClick, className, title, data, }) => {
-    const iconClassName = isNullOrEmpty(caption)
-        ? icon.className
-        : getClassName([
-            icon.className,
-            icon.position === ElementPosition.Right
-                ? "bbr-icon--right"
-                : "bbr-icon--left"
-        ]);
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    if (icon.position === ElementPosition.Right) {
-        return (_jsxs("a", { href: href, target: target, onClick: onClick, className: className, title: title, ...dataAttributes, children: [caption, _jsx(Icon, { ...icon, className: iconClassName })] }));
-    }
-    return (_jsxs("a", { href: href, target: target, onClick: onClick, className: className, title: title, ...dataAttributes, children: [_jsx(Icon, { ...icon, className: iconClassName }), caption] }));
-};
-export default AnchorWithIcon;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getClassName, isNullOrEmpty, isNullOrUndefined } from "@bodynarf/utils";
+import { ElementPosition } from "../../../../types";
+import { mapDataAttributes } from "../../../../utils";
+import Icon from "../../../icon";
+/** Anchor with icon component */
+const AnchorWithIcon = ({ href, caption, target, icon, onClick, className, title, data, }) => {
+    const iconClassName = isNullOrEmpty(caption)
+        ? icon.className
+        : getClassName([
+            icon.className,
+            icon.position === ElementPosition.Right
+                ? "bbr-icon--right"
+                : "bbr-icon--left"
+        ]);
+    const dataAttributes = isNullOrUndefined(data)
+        ? undefined
+        : mapDataAttributes(data);
+    if (icon.position === ElementPosition.Right) {
+        return (_jsxs("a", { href: href, target: target, onClick: onClick, className: className, title: title, ...dataAttributes, children: [caption, _jsx(Icon, { ...icon, className: iconClassName })] }));
+    }
+    return (_jsxs("a", { href: href, target: target, onClick: onClick, className: className, title: title, ...dataAttributes, children: [_jsx(Icon, { ...icon, className: iconClassName }), caption] }));
+};
+export default AnchorWithIcon;

package/components/anchor/components/simpleAnchor/index.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
-import { AnchorProps } from "../..";
-/** Simple anchor component, without icon */
-declare const SimpleAnchor: ({ href, className, caption, target, onClick, title, data, }: AnchorProps) => JSX.Element;
-export default SimpleAnchor;
+import { AnchorProps } from "../..";
+/** Simple anchor component, without icon */
+declare const SimpleAnchor: ({ href, className, caption, target, onClick, title, data, }: AnchorProps) => JSX.Element;
+export default SimpleAnchor;
 //# sourceMappingURL=index.d.ts.map

package/components/anchor/components/simpleAnchor/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/anchor/components/simpleAnchor/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,4CAA4C;AAC5C,QAAA,MAAM,YAAY,gEAKf,WAAW,KAAG,WAkBhB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/anchor/components/simpleAnchor/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,4CAA4C;AAC5C,QAAA,MAAM,YAAY,GAAI,6DAKnB,WAAW,KAAG,GAAG,CAAC,OAkBpB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/components/anchor/components/simpleAnchor/index.js

@@ -1,11 +1,11 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { isNullOrUndefined } from "@bodynarf/utils";
-import { mapDataAttributes } from "../../../../utils";
-/** Simple anchor component, without icon */
-const SimpleAnchor = ({ href, className, caption, target, onClick, title, data, }) => {
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    return (_jsx("a", { href: href, target: target, onClick: onClick, className: className, title: title, ...dataAttributes, children: caption }));
-};
-export default SimpleAnchor;
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isNullOrUndefined } from "@bodynarf/utils";
+import { mapDataAttributes } from "../../../../utils";
+/** Simple anchor component, without icon */
+const SimpleAnchor = ({ href, className, caption, target, onClick, title, data, }) => {
+    const dataAttributes = isNullOrUndefined(data)
+        ? undefined
+        : mapDataAttributes(data);
+    return (_jsx("a", { href: href, target: target, onClick: onClick, className: className, title: title, ...dataAttributes, children: caption }));
+};
+export default SimpleAnchor;

package/components/anchor/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/anchor/index.js

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

package/components/anchor/types.d.ts

@@ -1,17 +1,20 @@
-import { BaseElementProps, ElementIcon } from "../../types";
-/** Anchor component props type */
-export interface AnchorProps extends BaseElementProps {
-    /** Configuration od inner icon */
-    icon?: ElementIcon;
-    /** Should css hovering effects be disabled */
-    disableHovering?: boolean;
-    /** Link destination */
-    href?: string;
-    /** Link caption  */
-    caption?: string;
-    /** Where to open the linked document */
-    target?: "_blank" | "_top";
-    /** Click handler */
-    onClick?: () => void;
-}
+import { BaseElementProps, ElementIcon } from "../../types";
+/**
+ * Anchor component props type
+ * @deprecated Since v1.2.0. Use html element with custom formatting
+ */
+export interface AnchorProps extends BaseElementProps {
+    /** Configuration od inner icon */
+    icon?: ElementIcon;
+    /** Should css hovering effects be disabled */
+    disableHovering?: boolean;
+    /** Link destination */
+    href?: string;
+    /** Link caption  */
+    caption?: string;
+    /** Where to open the linked document */
+    target?: "_blank" | "_top";
+    /** Click handler */
+    onClick?: () => void;
+}
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/anchor/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE3D,kCAAkC;AAClC,MAAM,WAAW,WAAY,SAAQ,gBAAgB;IACjD,kCAAkC;IAClC,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,8CAA8C;IAC9C,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,uBAAuB;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,wCAAwC;IACxC,MAAM,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAE3B,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/anchor/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE3D;;;GAGG;AACH,MAAM,WAAW,WAAY,SAAQ,gBAAgB;IACjD,kCAAkC;IAClC,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB,8CAA8C;IAC9C,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,uBAAuB;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,wCAAwC;IACxC,MAAM,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAE3B,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB"}

package/components/anchor/types.js

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

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

@@ -1,9 +1,9 @@
-import { FC } from "react";
-import { BreadcrumbsProps } from "..";
-/**
- * Breadcrumbs navigation panel
- * @description If items are not specified, an empty component will be displayed.
-*/
-declare const BreadCrumbs: FC<BreadcrumbsProps>;
-export default BreadCrumbs;
+import { FC } from "react";
+import { BreadcrumbsProps } from "..";
+/**
+ * Breadcrumbs navigation panel
+ * @description If items are not specified, an empty component will be displayed.
+*/
+declare const BreadCrumbs: FC<BreadcrumbsProps>;
+export default BreadCrumbs;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/breadcrumbs/component/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAQ3B,OAAO,EAAc,gBAAgB,EAAE,MAAM,IAAI,CAAC;AAElD;;;EAGE;AACF,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA4CrC,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/breadcrumbs/component/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAa,MAAM,OAAO,CAAC;AAQtC,OAAO,EAAc,gBAAgB,EAAE,MAAM,IAAI,CAAC;AAIlD;;;EAGE;AACF,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA4CrC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/components/breadcrumbs/component/index.js

@@ -1,37 +1,38 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
-import { mapDataAttributes } from "../../../utils";
-import { ElementPosition, ElementSize } from "../../../types";
-import Icon from "../../icon";
-/**
- * Breadcrumbs navigation panel
- * @description If items are not specified, an empty component will be displayed.
-*/
-const BreadCrumbs = ({ items, position = ElementPosition.Left, size = ElementSize.Normal, separator = "arrow", elementGenerator = ((bc) => _jsx(BreadCrumbItem, { item: bc })), className, title, data, }) => {
-    if (items.length <= 1) {
-        return _jsx(_Fragment, {});
-    }
-    const elClassName = getClassName([
-        "bbr-breadcrumbs",
-        "breadcrumb",
-        className,
-        size === ElementSize.Normal ? undefined : `is-${size}`,
-        `has-${separator}-separator`,
-        position === ElementPosition.Left ? undefined : `is-${position}`,
-    ]);
-    const dataAttributes = isNullOrUndefined(data)
-        ? undefined
-        : mapDataAttributes(data);
-    return (_jsx("nav", { className: elClassName, "aria-label": "breadcrumbs", title: title, ...dataAttributes, children: _jsx("ul", { children: items.map(breadCrumb => _jsx("li", { className: breadCrumb.active ? "is-active" : undefined, children: elementGenerator(breadCrumb) }, breadCrumb.path)) }) }));
-};
-export default BreadCrumbs;
-/** Template for single breadcrumb */
-const BreadCrumbItem = ({ item, icon }) => {
-    if (isNullOrUndefined(icon)) {
-        return (_jsx("a", { href: item.path, "aria-current": item.active ? "page" : undefined, children: item.caption }));
-    }
-    if (icon?.position === ElementPosition.Right) {
-        return (_jsxs("a", { href: item.path, "aria-current": item.active ? "page" : undefined, children: [item.caption, _jsx(Icon, { ...icon })] }));
-    }
-    return (_jsxs("a", { href: item.path, "aria-current": item.active ? "page" : undefined, children: [_jsx(Icon, { ...icon }), item.caption] }));
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getClassName, isNullOrUndefined } from "@bodynarf/utils";
+import { getPositionClassName, mapDataAttributes } from "../../../utils";
+import { ElementPosition, ElementSize } from "../../../types";
+import Icon from "../../icon";
+const defaultElementGenerator = ((bc) => _jsx(BreadCrumbItem, { item: bc }));
+/**
+ * Breadcrumbs navigation panel
+ * @description If items are not specified, an empty component will be displayed.
+*/
+const BreadCrumbs = ({ items, position = ElementPosition.Left, size = ElementSize.Normal, separator = "arrow", elementGenerator = defaultElementGenerator, className, title, data, }) => {
+    if (items.length <= 1) {
+        return null;
+    }
+    const elClassName = getClassName([
+        "bbr-breadcrumbs",
+        "breadcrumb",
+        className,
+        size === ElementSize.Normal ? undefined : `is-${size}`,
+        `has-${separator}-separator`,
+        getPositionClassName(position),
+    ]);
+    const dataAttributes = isNullOrUndefined(data)
+        ? undefined
+        : mapDataAttributes(data);
+    return (_jsx("nav", { className: elClassName, "aria-label": "breadcrumbs", title: title, ...dataAttributes, children: _jsx("ul", { children: items.map((breadCrumb, i, a) => _jsx("li", { className: i === a.length - 1 ? "is-active" : undefined, children: elementGenerator(breadCrumb) }, breadCrumb.href ?? breadCrumb.path)) }) }));
+};
+export default BreadCrumbs;
+/** Template for single breadcrumb */
+const BreadCrumbItem = ({ item, icon }) => {
+    if (isNullOrUndefined(icon)) {
+        return (_jsx("a", { href: item.href ?? item.path, children: item.caption }));
+    }
+    if (icon?.position === ElementPosition.Right) {
+        return (_jsxs("a", { href: item.href ?? item.path, children: [item.caption, _jsx(Icon, { ...icon })] }));
+    }
+    return (_jsxs("a", { href: item.href ?? item.path, children: [_jsx(Icon, { ...icon }), item.caption] }));
+};

package/components/breadcrumbs/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/breadcrumbs/index.js

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