@redis-ui/components 42.7.0 → 43.0.2

package/dist/AutoCompleteSelect/AutoCompleteSelect.cjs

@@ -32,7 +32,13 @@ const AutoCompleteSelect = React__default.default.forwardRef(({
     highlightedIndex,
     onClickOutside,
     onInputFocus
-  } = useAutoCompleteSelect.default(options, open, value, setOpen, onChange);
+  } = useAutoCompleteSelect.default({
+    options,
+    open,
+    value,
+    setOpen,
+    onChange
+  });
   React.useImperativeHandle(ref, () => inputElRef.current, [inputElRef]);
   const onInputClick = () => {
     if (options.length || value) {

package/dist/AutoCompleteSelect/AutoCompleteSelect.js

@@ -28,7 +28,13 @@ const AutoCompleteSelect = React__default.forwardRef(({
     highlightedIndex,
     onClickOutside,
     onInputFocus
-  } = useAutoCompleteSelect(options, open, value, setOpen, onChange);
+  } = useAutoCompleteSelect({
+    options,
+    open,
+    value,
+    setOpen,
+    onChange
+  });
   useImperativeHandle(ref, () => inputElRef.current, [inputElRef]);
   const onInputClick = () => {
     if (options.length || value) {

package/dist/AutoCompleteSelect/hooks/useAutoCompleteSelect.cjs

@@ -1,7 +1,13 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const React = require("react");
-const useAutoCompleteSelect = (options, open, value, setOpen, onChange) => {
+const useAutoCompleteSelect = ({
+  options,
+  open,
+  value,
+  setOpen,
+  onChange
+}) => {
   const inputElRef = React.useRef(null);
   const [highlightedIndex, setHighlightedIndex] = React.useState(-1);
   const suggestedOptions = React.useMemo(() => {

package/dist/AutoCompleteSelect/hooks/useAutoCompleteSelect.d.ts

@@ -1,6 +1,13 @@
 import React from 'react';
 import { AutoCompleteOnChange, AutoCompleteOption } from '../AutoCompleteSelect.types';
-declare const useAutoCompleteSelect: (options: AutoCompleteOption[], open: boolean, value: string, setOpen: React.Dispatch<React.SetStateAction<boolean>>, onChange: AutoCompleteOnChange) => {
+interface UseAutoCompleteSelectParams {
+    options: AutoCompleteOption[];
+    open: boolean;
+    value: string;
+    setOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    onChange: AutoCompleteOnChange;
+}
+declare const useAutoCompleteSelect: ({ options, open, value, setOpen, onChange }: UseAutoCompleteSelectParams) => {
     handleKeyDown: (e: React.KeyboardEvent<HTMLInputElement>) => void;
     inputElRef: React.RefObject<HTMLInputElement>;
     onItemClick: (val: string) => void;

package/dist/AutoCompleteSelect/hooks/useAutoCompleteSelect.js

@@ -1,5 +1,11 @@
 import { useRef, useState, useMemo, useEffect, useCallback } from "react";
-const useAutoCompleteSelect = (options, open, value, setOpen, onChange) => {
+const useAutoCompleteSelect = ({
+  options,
+  open,
+  value,
+  setOpen,
+  onChange
+}) => {
   const inputElRef = useRef(null);
   const [highlightedIndex, setHighlightedIndex] = useState(-1);
   const suggestedOptions = useMemo(() => {

package/dist/BoxSelectionGroup/components/Item/components/BoxStateIndicator/BoxStateIndicator.cjs

@@ -15,10 +15,14 @@ const BoxStateIndicator = ({
     tabIndex: -1,
     disabled: isDisabled
   });
-  if (!indicator) return null;
-  if (noninteractive) return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, {
-    children: indicator
-  });
+  if (!indicator) {
+    return null;
+  }
+  if (noninteractive) {
+    return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, {
+      children: indicator
+    });
+  }
   return (
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
     jsxRuntime.jsxRuntimeExports.jsx("div", {

package/dist/BoxSelectionGroup/components/Item/components/BoxStateIndicator/BoxStateIndicator.js

@@ -13,10 +13,14 @@ const BoxStateIndicator = ({
     tabIndex: -1,
     disabled: isDisabled
   });
-  if (!indicator) return null;
-  if (noninteractive) return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {
-    children: indicator
-  });
+  if (!indicator) {
+    return null;
+  }
+  if (noninteractive) {
+    return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {
+      children: indicator
+    });
+  }
   return (
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
     jsxRuntimeExports.jsx("div", {

package/dist/BoxSelectionGroup/components/Item/components/Compose/Compose.style.cjs

@@ -23,20 +23,34 @@ const getStateStyle = (theme, isChecked = false) => {
     ${Button_style_utils.getButtonStatesStyle(stateColors, maps)};
 
     & ${BottomActiveBorder} {
-      ${css_utils.styleFromTokens(markerMaps, stateColors.normal)}
+      ${css_utils.styleFromTokens({
+    tokenMaps: markerMaps,
+    tokens: stateColors.normal
+  })}
     }
 
     &:hover ${BottomActiveBorder} {
-      ${css_utils.styleFromTokens(markerMaps, stateColors.hover, stateColors.normal)}
+      ${css_utils.styleFromTokens({
+    tokenMaps: markerMaps,
+    tokens: stateColors.hover,
+    fallbackTokens: stateColors.normal
+  })}
     }
 
     &:disabled {
       > * {
-        ${css_utils.styleFromTokens([css_utils.tokenMaps.opacity], stateColors.disabled)}
+        ${css_utils.styleFromTokens({
+    tokenMaps: [css_utils.tokenMaps.opacity],
+    tokens: stateColors.disabled
+  })}
       }
 
       ${BottomActiveBorder} {
-        ${css_utils.styleFromTokens(markerMaps, stateColors.disabled, stateColors.normal)}
+        ${css_utils.styleFromTokens({
+    tokenMaps: markerMaps,
+    tokens: stateColors.disabled,
+    fallbackTokens: stateColors.normal
+  })}
         opacity: 1;
       }
     }

package/dist/BoxSelectionGroup/components/Item/components/Compose/Compose.style.js

@@ -19,20 +19,34 @@ const getStateStyle = (theme, isChecked = false) => {
     ${getButtonStatesStyle(stateColors, maps)};
 
     & ${BottomActiveBorder} {
-      ${styleFromTokens(markerMaps, stateColors.normal)}
+      ${styleFromTokens({
+    tokenMaps: markerMaps,
+    tokens: stateColors.normal
+  })}
     }
 
     &:hover ${BottomActiveBorder} {
-      ${styleFromTokens(markerMaps, stateColors.hover, stateColors.normal)}
+      ${styleFromTokens({
+    tokenMaps: markerMaps,
+    tokens: stateColors.hover,
+    fallbackTokens: stateColors.normal
+  })}
     }
 
     &:disabled {
       > * {
-        ${styleFromTokens([tokenMaps.opacity], stateColors.disabled)}
+        ${styleFromTokens({
+    tokenMaps: [tokenMaps.opacity],
+    tokens: stateColors.disabled
+  })}
       }
 
       ${BottomActiveBorder} {
-        ${styleFromTokens(markerMaps, stateColors.disabled, stateColors.normal)}
+        ${styleFromTokens({
+    tokenMaps: markerMaps,
+    tokens: stateColors.disabled,
+    fallbackTokens: stateColors.normal
+  })}
         opacity: 1;
       }
     }

package/dist/BoxSelectionGroup/hooks/useBoxSelectionGroup.cjs

@@ -24,7 +24,9 @@ const useBoxSelectionGroup = ({
       newValue: newBox.value,
       singleSelect
     });
-    if (newSelection !== selection) setSelection(newSelection);
+    if (newSelection !== selection) {
+      setSelection(newSelection);
+    }
   }, [selection, setSelection, singleSelect]);
   const isSelected = React.useCallback((val) => (selection == null ? void 0 : selection.some((sel) => sel === val)) || false, [selection]);
   return React.useMemo(() => ({

package/dist/BoxSelectionGroup/hooks/useBoxSelectionGroup.js

@@ -22,7 +22,9 @@ const useBoxSelectionGroup = ({
       newValue: newBox.value,
       singleSelect
     });
-    if (newSelection !== selection) setSelection(newSelection);
+    if (newSelection !== selection) {
+      setSelection(newSelection);
+    }
   }, [selection, setSelection, singleSelect]);
   const isSelected = useCallback((val) => (selection == null ? void 0 : selection.some((sel) => sel === val)) || false, [selection]);
   return useMemo(() => ({

package/dist/Breadcrumbs/Breadcrumbs.cjs

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("../node_modules/react/jsx-runtime.cjs");
+const React = require("react");
+const Compose = require("./components/Compose/Compose.cjs");
+const List = require("./components/List/List.cjs");
+const Item = require("./components/Item/Item.cjs");
+const Link = require("./components/Link/Link.cjs");
+const Separator = require("./components/Separator/Separator.cjs");
+const Current = require("./components/Current/Current.cjs");
+const Breadcrumbs = Object.assign(({
+  items,
+  separator = "/",
+  "aria-label": ariaLabel,
+  ...restProps
+}) => jsxRuntime.jsxRuntimeExports.jsx(Breadcrumbs.Compose, {
+  "aria-label": ariaLabel,
+  ...restProps,
+  children: jsxRuntime.jsxRuntimeExports.jsx(Breadcrumbs.List, {
+    children: items.map((item, index) => {
+      const isLast = index === items.length - 1;
+      return (
+        // eslint-disable-next-line react/no-array-index-key
+        jsxRuntime.jsxRuntimeExports.jsxs(React.Fragment, {
+          children: [jsxRuntime.jsxRuntimeExports.jsx(Breadcrumbs.Item, {
+            children: isLast ? jsxRuntime.jsxRuntimeExports.jsx(Breadcrumbs.Current, {
+              children: item.label
+            }) : jsxRuntime.jsxRuntimeExports.jsx(Breadcrumbs.Link, {
+              href: item.href,
+              onClick: item.onClick,
+              children: item.label
+            })
+          }), !isLast && jsxRuntime.jsxRuntimeExports.jsx(Breadcrumbs.Item, {
+            children: jsxRuntime.jsxRuntimeExports.jsx(Breadcrumbs.Separator, {
+              children: separator
+            })
+          })]
+        }, `${index}-${item.href ?? ""}`)
+      );
+    })
+  })
+}), {
+  Compose: Compose.default,
+  List: List.default,
+  Item: Item.default,
+  Link: Link.default,
+  Separator: Separator.default,
+  Current: Current.default
+});
+const Breadcrumbs$1 = Breadcrumbs;
+exports.default = Breadcrumbs$1;

package/dist/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,10 @@
+import { BreadcrumbsProps } from './Breadcrumbs.types';
+declare const Breadcrumbs: (({ items, separator, "aria-label": ariaLabel, ...restProps }: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element) & {
+    Compose: ({ "aria-label": ariaLabel, children, ...restProps }: import("./Breadcrumbs.types").BreadcrumbsComposeProps & import("./Breadcrumbs.types").RestBreadcrumbsComposeProps) => import("react/jsx-runtime").JSX.Element;
+    List: ({ children, ...restProps }: import("./Breadcrumbs.types").BreadcrumbsListProps) => import("react/jsx-runtime").JSX.Element;
+    Item: ({ children, ...restProps }: import("./Breadcrumbs.types").BreadcrumbsItemProps) => import("react/jsx-runtime").JSX.Element;
+    Link: import("react").ForwardRefExoticComponent<import(".").BreadcrumbsLinkProps & import("react").RefAttributes<HTMLAnchorElement>>;
+    Separator: ({ children, ...restProps }: import(".").BreadcrumbsSeparatorProps) => import("react/jsx-runtime").JSX.Element;
+    Current: ({ children, ...restProps }: import(".").BreadcrumbsCurrentProps) => import("react/jsx-runtime").JSX.Element;
+};
+export default Breadcrumbs;

package/dist/Breadcrumbs/Breadcrumbs.js

@@ -0,0 +1,51 @@
+import { j as jsxRuntimeExports } from "../node_modules/react/jsx-runtime.js";
+import { Fragment } from "react";
+import Compose from "./components/Compose/Compose.js";
+import List from "./components/List/List.js";
+import Item from "./components/Item/Item.js";
+import Link from "./components/Link/Link.js";
+import Separator from "./components/Separator/Separator.js";
+import Current from "./components/Current/Current.js";
+const Breadcrumbs = Object.assign(({
+  items,
+  separator = "/",
+  "aria-label": ariaLabel,
+  ...restProps
+}) => jsxRuntimeExports.jsx(Breadcrumbs.Compose, {
+  "aria-label": ariaLabel,
+  ...restProps,
+  children: jsxRuntimeExports.jsx(Breadcrumbs.List, {
+    children: items.map((item, index) => {
+      const isLast = index === items.length - 1;
+      return (
+        // eslint-disable-next-line react/no-array-index-key
+        jsxRuntimeExports.jsxs(Fragment, {
+          children: [jsxRuntimeExports.jsx(Breadcrumbs.Item, {
+            children: isLast ? jsxRuntimeExports.jsx(Breadcrumbs.Current, {
+              children: item.label
+            }) : jsxRuntimeExports.jsx(Breadcrumbs.Link, {
+              href: item.href,
+              onClick: item.onClick,
+              children: item.label
+            })
+          }), !isLast && jsxRuntimeExports.jsx(Breadcrumbs.Item, {
+            children: jsxRuntimeExports.jsx(Breadcrumbs.Separator, {
+              children: separator
+            })
+          })]
+        }, `${index}-${item.href ?? ""}`)
+      );
+    })
+  })
+}), {
+  Compose,
+  List,
+  Item,
+  Link,
+  Separator,
+  Current
+});
+const Breadcrumbs$1 = Breadcrumbs;
+export {
+  Breadcrumbs$1 as default
+};

package/dist/Breadcrumbs/Breadcrumbs.types.d.ts

@@ -0,0 +1,17 @@
+import type { ReactNode } from 'react';
+import type { ChildFree } from '../Helpers/common.types';
+import type { BreadcrumbsComposeProps, RestBreadcrumbsComposeProps } from './components/Compose/Compose.types';
+import type { BreadcrumbsListProps } from './components/List/List.types';
+import type { BreadcrumbsItemProps } from './components/Item/Item.types';
+export type BreadcrumbItem = {
+    label: ReactNode;
+    href?: string;
+    onClick?: () => void;
+};
+export interface BreadcrumbsProps extends BreadcrumbsComposeProps, ChildFree<RestBreadcrumbsComposeProps> {
+    items: BreadcrumbItem[];
+    separator?: ReactNode;
+}
+export type { BreadcrumbsComposeProps, RestBreadcrumbsComposeProps };
+export type { BreadcrumbsListProps };
+export type { BreadcrumbsItemProps };

package/dist/Breadcrumbs/components/Compose/Compose.cjs

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("../../../node_modules/react/jsx-runtime.cjs");
+const Compose_style = require("./Compose.style.cjs");
+const Compose = ({
+  "aria-label": ariaLabel = "Breadcrumb",
+  children,
+  ...restProps
+}) => jsxRuntime.jsxRuntimeExports.jsx(Compose_style.BreadcrumbsNav, {
+  "aria-label": ariaLabel,
+  ...restProps,
+  children
+});
+exports.default = Compose;

package/dist/Breadcrumbs/components/Compose/Compose.d.ts

@@ -0,0 +1,3 @@
+import { BreadcrumbsComposeProps, RestBreadcrumbsComposeProps } from './Compose.types';
+declare const Compose: ({ "aria-label": ariaLabel, children, ...restProps }: BreadcrumbsComposeProps & RestBreadcrumbsComposeProps) => import("react/jsx-runtime").JSX.Element;
+export default Compose;

package/dist/Breadcrumbs/components/Compose/Compose.js

@@ -0,0 +1,14 @@
+import { j as jsxRuntimeExports } from "../../../node_modules/react/jsx-runtime.js";
+import { BreadcrumbsNav } from "./Compose.style.js";
+const Compose = ({
+  "aria-label": ariaLabel = "Breadcrumb",
+  children,
+  ...restProps
+}) => jsxRuntimeExports.jsx(BreadcrumbsNav, {
+  "aria-label": ariaLabel,
+  ...restProps,
+  children
+});
+export {
+  Compose as default
+};

package/dist/Breadcrumbs/components/Compose/Compose.style.cjs

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const _styled = require("styled-components");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
+const BreadcrumbsNav = _styled__default.default.nav.withConfig({
+  displayName: "Composestyle__BreadcrumbsNav",
+  componentId: "RedisUI__sc-ifaw7a-0"
+})(["display:flex;align-items:center;"]);
+exports.BreadcrumbsNav = BreadcrumbsNav;

package/dist/Breadcrumbs/components/Compose/Compose.style.d.ts

@@ -0,0 +1 @@
+export declare const BreadcrumbsNav: import("styled-components").StyledComponent<"nav", any, {}, never>;

package/dist/Breadcrumbs/components/Compose/Compose.style.js

@@ -0,0 +1,8 @@
+import _styled from "styled-components";
+const BreadcrumbsNav = _styled.nav.withConfig({
+  displayName: "Composestyle__BreadcrumbsNav",
+  componentId: "RedisUI__sc-ifaw7a-0"
+})(["display:flex;align-items:center;"]);
+export {
+  BreadcrumbsNav
+};

package/dist/Breadcrumbs/components/Compose/Compose.types.d.ts

@@ -0,0 +1,5 @@
+import { ComposeElementProps } from '../../../Helpers/common.types';
+export interface BreadcrumbsComposeProps {
+    'aria-label'?: string;
+}
+export type RestBreadcrumbsComposeProps = ComposeElementProps<HTMLElement>;

package/dist/Breadcrumbs/components/Current/Current.cjs

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("../../../node_modules/react/jsx-runtime.cjs");
+const Current_style = require("./Current.style.cjs");
+const Current = ({
+  children,
+  ...restProps
+}) => jsxRuntime.jsxRuntimeExports.jsx(Current_style.BreadcrumbsCurrent, {
+  "aria-current": "page",
+  ...restProps,
+  children
+});
+exports.default = Current;

package/dist/Breadcrumbs/components/Current/Current.d.ts

@@ -0,0 +1,3 @@
+import { BreadcrumbsCurrentProps } from './Current.types';
+declare const Current: ({ children, ...restProps }: BreadcrumbsCurrentProps) => import("react/jsx-runtime").JSX.Element;
+export default Current;

package/dist/Breadcrumbs/components/Current/Current.js

@@ -0,0 +1,13 @@
+import { j as jsxRuntimeExports } from "../../../node_modules/react/jsx-runtime.js";
+import { BreadcrumbsCurrent } from "./Current.style.js";
+const Current = ({
+  children,
+  ...restProps
+}) => jsxRuntimeExports.jsx(BreadcrumbsCurrent, {
+  "aria-current": "page",
+  ...restProps,
+  children
+});
+export {
+  Current as default
+};

package/dist/Breadcrumbs/components/Current/Current.style.cjs

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const _styled = require("styled-components");
+const redisUiStyles = require("@redislabsdev/redis-ui-styles");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
+const BreadcrumbsCurrent = _styled__default.default.span.withConfig({
+  displayName: "Currentstyle__BreadcrumbsCurrent",
+  componentId: "RedisUI__sc-50sq3s-0"
+})(["color:", ";font-family:", ";font-size:", ";font-weight:", ";"], () => redisUiStyles.useTheme().components.breadcrumbs.current.textColor, () => redisUiStyles.useTheme().components.typography.body.fontFamily, () => redisUiStyles.useTheme().components.typography.body.fontSizes.M, () => redisUiStyles.useTheme().components.breadcrumbs.current.fontWeight);
+exports.BreadcrumbsCurrent = BreadcrumbsCurrent;

package/dist/Breadcrumbs/components/Current/Current.style.d.ts

@@ -0,0 +1 @@
+export declare const BreadcrumbsCurrent: import("styled-components").StyledComponent<"span", any, {}, never>;

package/dist/Breadcrumbs/components/Current/Current.style.js

@@ -0,0 +1,9 @@
+import _styled from "styled-components";
+import { useTheme } from "@redislabsdev/redis-ui-styles";
+const BreadcrumbsCurrent = _styled.span.withConfig({
+  displayName: "Currentstyle__BreadcrumbsCurrent",
+  componentId: "RedisUI__sc-50sq3s-0"
+})(["color:", ";font-family:", ";font-size:", ";font-weight:", ";"], () => useTheme().components.breadcrumbs.current.textColor, () => useTheme().components.typography.body.fontFamily, () => useTheme().components.typography.body.fontSizes.M, () => useTheme().components.breadcrumbs.current.fontWeight);
+export {
+  BreadcrumbsCurrent
+};

package/dist/Breadcrumbs/components/Current/Current.types.d.ts

@@ -0,0 +1,4 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface BreadcrumbsCurrentProps extends HTMLAttributes<HTMLSpanElement> {
+    children: ReactNode;
+}

package/dist/Breadcrumbs/components/Item/Item.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("../../../node_modules/react/jsx-runtime.cjs");
+const Item_style = require("./Item.style.cjs");
+const Item = ({
+  children,
+  ...restProps
+}) => jsxRuntime.jsxRuntimeExports.jsx(Item_style.BreadcrumbsItem, {
+  ...restProps,
+  children
+});
+exports.default = Item;

package/dist/Breadcrumbs/components/Item/Item.d.ts

@@ -0,0 +1,3 @@
+import { BreadcrumbsItemProps } from './Item.types';
+declare const Item: ({ children, ...restProps }: BreadcrumbsItemProps) => import("react/jsx-runtime").JSX.Element;
+export default Item;

package/dist/Breadcrumbs/components/Item/Item.js

@@ -0,0 +1,12 @@
+import { j as jsxRuntimeExports } from "../../../node_modules/react/jsx-runtime.js";
+import { BreadcrumbsItem } from "./Item.style.js";
+const Item = ({
+  children,
+  ...restProps
+}) => jsxRuntimeExports.jsx(BreadcrumbsItem, {
+  ...restProps,
+  children
+});
+export {
+  Item as default
+};

package/dist/Breadcrumbs/components/Item/Item.style.cjs

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const _styled = require("styled-components");
+const redisUiStyles = require("@redislabsdev/redis-ui-styles");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
+const BreadcrumbsItem = _styled__default.default.li.withConfig({
+  displayName: "Itemstyle__BreadcrumbsItem",
+  componentId: "RedisUI__sc-1ivwbux-0"
+})(["display:flex;align-items:center;gap:", ";"], () => redisUiStyles.useTheme().components.breadcrumbs.gap);
+exports.BreadcrumbsItem = BreadcrumbsItem;

package/dist/Breadcrumbs/components/Item/Item.style.d.ts

@@ -0,0 +1 @@
+export declare const BreadcrumbsItem: import("styled-components").StyledComponent<"li", any, {}, never>;

package/dist/Breadcrumbs/components/Item/Item.style.js

@@ -0,0 +1,9 @@
+import _styled from "styled-components";
+import { useTheme } from "@redislabsdev/redis-ui-styles";
+const BreadcrumbsItem = _styled.li.withConfig({
+  displayName: "Itemstyle__BreadcrumbsItem",
+  componentId: "RedisUI__sc-1ivwbux-0"
+})(["display:flex;align-items:center;gap:", ";"], () => useTheme().components.breadcrumbs.gap);
+export {
+  BreadcrumbsItem
+};

package/dist/Breadcrumbs/components/Item/Item.types.d.ts

@@ -0,0 +1,2 @@
+import { ComposeElementProps } from '../../../Helpers/common.types';
+export type BreadcrumbsItemProps = ComposeElementProps<HTMLLIElement>;

package/dist/Breadcrumbs/components/Link/Link.cjs

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const jsxRuntime = require("../../../node_modules/react/jsx-runtime.cjs");
+const React = require("react");
+const Link_style = require("./Link.style.cjs");
+const getFalse = () => false;
+const Link = React.forwardRef(({
+  children,
+  href,
+  onClick,
+  disabled,
+  ...restProps
+}, ref) => {
+  const commonProps = {
+    ref,
+    tabIndex: disabled ? -1 : 0
+  };
+  const hrefProps = {
+    ...href ? {
+      href
+    } : null,
+    ...onClick ? {
+      role: href ? void 0 : "button",
+      onClick,
+      onKeyDown: (e) => {
+        var _a;
+        if (e.key === "Enter") {
+          e.preventDefault();
+          e.stopPropagation();
+          (_a = e.currentTarget) == null ? void 0 : _a.click();
+        }
+      }
+    } : null
+  };
+  const disabledProps = disabled ? {
+    disabled: true,
+    tabIndex: -1,
+    href: void 0,
+    onClick: getFalse,
+    onKeyDown: getFalse,
+    "aria-disabled": true
+  } : null;
+  return jsxRuntime.jsxRuntimeExports.jsx(Link_style.BreadcrumbsLink, {
+    ...commonProps,
+    ...hrefProps,
+    ...restProps,
+    ...disabledProps,
+    children
+  });
+});
+Link.displayName = "Breadcrumbs.Link";
+exports.default = Link;

package/dist/Breadcrumbs/components/Link/Link.d.ts

@@ -0,0 +1,3 @@
+import { BreadcrumbsLinkProps } from './Link.types';
+declare const Link: import("react").ForwardRefExoticComponent<BreadcrumbsLinkProps & import("react").RefAttributes<HTMLAnchorElement>>;
+export default Link;