@synerise/ds-cascader 1.1.25 → 1.1.27

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.1.27](https://github.com/Synerise/synerise-design/compare/@synerise/ds-cascader@1.1.26...@synerise/ds-cascader@1.1.27) (2026-03-24)
+
+**Note:** Version bump only for package @synerise/ds-cascader
+
+## [1.1.26](https://github.com/Synerise/synerise-design/compare/@synerise/ds-cascader@1.1.25...@synerise/ds-cascader@1.1.26) (2026-03-20)
+
+**Note:** Version bump only for package @synerise/ds-cascader
+
 ## [1.1.25](https://github.com/Synerise/synerise-design/compare/@synerise/ds-cascader@1.1.24...@synerise/ds-cascader@1.1.25) (2026-03-09)
 
 **Note:** Version bump only for package @synerise/ds-cascader

package/README.md

@@ -54,7 +54,7 @@ const rootCategory = {
 | Property               | Description                                                     | Type                                        | Default |
 | ---------------------- | --------------------------------------------------------------- | ------------------------------------------- | ------- |
 | categorySuffix         | Suffix element displayed when hovering on category              | string / React.ReactNode                    | -       |
-| maxHeight              | Max height of the content in pixels (In order to enable scroll) | number /string                              | -       |
+| maxHeight              | Max height of the content in pixels (In order to enable scroll) | number                                      | -       |
 | contentStyles          | Additional styles applied to the content                        | React.CSSProperties                         | -       |
 | onCategorySelect       | Callback executed when category is selected                     | (item: Category, selected: boolean) => void | -       |
 | rootCategory           | Root (default) category displayed in dropdown                   | Category                                    | -       |
@@ -67,5 +67,5 @@ const rootCategory = {
 | Property | Description                                                                     | Type            | Default |
 | -------- | ------------------------------------------------------------------------------- | --------------- | ------- |
 | id       | Unique id of category                                                           | React.ReactText | -       |
-| name     | Name of the category                                                            | number          | -       |
+| name     | Name of the category                                                            | string          | -       |
 | path     | Path of the category. Each element of an array represents one level of nesting. | string[]        | -       |

package/dist/Cascader.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import { type CascaderProps } from './Cascader.types';
+import { default as React } from 'react';
+import { CascaderProps } from './Cascader.types';
 export declare const Cascader: ({ rootCategory, searchClearTooltip, searchInputPlaceholder, onCategorySelect, categorySuffix, maxHeight, contentStyles, selectedCategoriesIds, }: CascaderProps) => React.JSX.Element;
 export default Cascader;

package/dist/Cascader.js

@@ -1,89 +1,75 @@
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { theme } from '@synerise/ds-core';
-import Icon, { SearchM } from '@synerise/ds-icon';
-import SearchBar from '@synerise/ds-search-bar';
-import { useResize } from '@synerise/ds-utils';
-import * as S from './Cascader.styles';
-import BreadcrumbsList from './Elements/BreadcrumbsList/BreadcrumbsList';
-import CategoriesList from './Elements/CategoriesList/CategoriesList';
-import Navigation from './Elements/Navigation/Navigation';
-import { filterPaths, getAllPaths, hasNestedCategories, searchCategoryWithId } from './utils';
-var VERTICAL_PADDING_OFFSET = 8;
-var BREADCRUMB_ITEM_HEIGHT = 50;
-var CATEGORY_ITEM_HEIGHT = 32;
-export var Cascader = function Cascader(_ref) {
-  var _categoriesContainer$;
-  var rootCategory = _ref.rootCategory,
-    searchClearTooltip = _ref.searchClearTooltip,
-    searchInputPlaceholder = _ref.searchInputPlaceholder,
-    onCategorySelect = _ref.onCategorySelect,
-    categorySuffix = _ref.categorySuffix,
-    maxHeight = _ref.maxHeight,
-    contentStyles = _ref.contentStyles,
-    selectedCategoriesIds = _ref.selectedCategoriesIds;
-  var _useState = useState(''),
-    searchQuery = _useState[0],
-    setSearchQuery = _useState[1];
-  var _useState2 = useState(rootCategory),
-    activeCategory = _useState2[0],
-    setActiveCategory = _useState2[1];
-  var _useState3 = useState([]),
-    paths = _useState3[0],
-    setPaths = _useState3[1];
-  var _useState4 = useState([]),
-    filteredPaths = _useState4[0],
-    setFilteredPaths = _useState4[1];
-  var _useState5 = useState([]),
-    enteredCategories = _useState5[0],
-    setEnteredCategories = _useState5[1];
-  var _useState6 = useState(0),
-    scrollTop = _useState6[0],
-    setScrollTop = _useState6[1];
-  var _useState7 = useState(selectedCategoriesIds || []),
-    selectedIds = _useState7[0],
-    setSelectedIds = _useState7[1];
-  var searchResultsContainer = useRef();
-  var categoriesContainer = useRef();
-  var _useResize = useResize(searchResultsContainer),
-    height = _useResize.height;
-  var previousCategory = enteredCategories[enteredCategories.length - 2];
-  var isSearching = !!paths && searchQuery.length > 0;
-  var categoriesMaxHeight = maxHeight ? Math.floor((maxHeight - Number(categoriesContainer == null || (_categoriesContainer$ = categoriesContainer.current) == null ? void 0 : _categoriesContainer$.offsetTop)) / CATEGORY_ITEM_HEIGHT) * CATEGORY_ITEM_HEIGHT + VERTICAL_PADDING_OFFSET : undefined;
-  var calculateVisibleRows = useMemo(function () {
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useRef, useMemo, useEffect, useCallback } from "react";
+import { theme } from "@synerise/ds-core";
+import Icon, { SearchM } from "@synerise/ds-icon";
+import SearchBar from "@synerise/ds-search-bar";
+import { useResize } from "@synerise/ds-utils";
+import { Wrapper, InputWrapper, SearchResults, CascaderScrollbar } from "./Cascader.styles.js";
+import { BreadcrumbsList } from "./Elements/BreadcrumbsList/BreadcrumbsList.js";
+import { CategoriesList } from "./Elements/CategoriesList/CategoriesList.js";
+import { Navigation } from "./Elements/Navigation/Navigation.js";
+import { getAllPaths, searchCategoryWithId, filterPaths, hasNestedCategories } from "./utils.js";
+const VERTICAL_PADDING_OFFSET = 8;
+const BREADCRUMB_ITEM_HEIGHT = 50;
+const CATEGORY_ITEM_HEIGHT = 32;
+const Cascader = ({
+  rootCategory,
+  searchClearTooltip,
+  searchInputPlaceholder,
+  onCategorySelect,
+  categorySuffix,
+  maxHeight,
+  contentStyles,
+  selectedCategoriesIds
+}) => {
+  const [searchQuery, setSearchQuery] = useState("");
+  const [activeCategory, setActiveCategory] = useState(rootCategory);
+  const [paths, setPaths] = useState([]);
+  const [filteredPaths, setFilteredPaths] = useState([]);
+  const [enteredCategories, setEnteredCategories] = useState([]);
+  const [scrollTop, setScrollTop] = useState(0);
+  const [selectedIds, setSelectedIds] = useState(selectedCategoriesIds || []);
+  const searchResultsContainer = useRef();
+  const categoriesContainer = useRef();
+  const {
+    height
+  } = useResize(searchResultsContainer);
+  const previousCategory = enteredCategories[enteredCategories.length - 2];
+  const isSearching = !!paths && searchQuery.length > 0;
+  const categoriesMaxHeight = maxHeight ? Math.floor((maxHeight - Number(categoriesContainer?.current?.offsetTop)) / CATEGORY_ITEM_HEIGHT) * CATEGORY_ITEM_HEIGHT + VERTICAL_PADDING_OFFSET : void 0;
+  const calculateVisibleRows = useMemo(() => {
     return Math.floor((height - VERTICAL_PADDING_OFFSET) / BREADCRUMB_ITEM_HEIGHT);
   }, [height]);
-  useEffect(function () {
-    var allPaths = getAllPaths(rootCategory, []);
+  useEffect(() => {
+    const allPaths = getAllPaths(rootCategory, []);
     setPaths(allPaths);
     if (activeCategory.id === rootCategory.id || !activeCategory.id) {
       setActiveCategory(rootCategory);
     }
   }, [rootCategory, activeCategory.id]);
-  useEffect(function () {
+  useEffect(() => {
     setSelectedIds(selectedCategoriesIds);
   }, [selectedCategoriesIds]);
-  var onItemSelect = function onItemSelect(item) {
-    var newSelectedList;
-    var itemAlreadySelected = selectedIds.indexOf(item.id) !== -1;
+  const onItemSelect = (item) => {
+    let newSelectedList;
+    const itemAlreadySelected = selectedIds.indexOf(item.id) !== -1;
     if (!itemAlreadySelected) {
-      newSelectedList = [].concat(selectedIds, [item.id]);
+      newSelectedList = [...selectedIds, item.id];
       onCategorySelect && onCategorySelect(item, true);
     } else {
-      newSelectedList = selectedIds.filter(function (id) {
-        return id !== item.id;
-      });
+      newSelectedList = selectedIds.filter((id) => id !== item.id);
       onCategorySelect && onCategorySelect(item, false);
     }
-    setSelectedIds([].concat(newSelectedList));
+    setSelectedIds([...newSelectedList]);
   };
-  var onCategoryClick = function onCategoryClick(category) {
-    var entered = {
+  const onCategoryClick = (category) => {
+    const entered = {
       id: category.id,
       name: category.name,
       path: category.path
     };
-    var updatedEnteredCategories = [].concat(enteredCategories, [entered]);
-    var hasMoreCategories = hasNestedCategories(category);
+    const updatedEnteredCategories = [...enteredCategories, entered];
+    const hasMoreCategories = hasNestedCategories(category);
     if (hasMoreCategories) {
       setActiveCategory(category);
       setEnteredCategories(updatedEnteredCategories);
@@ -91,16 +77,14 @@ export var Cascader = function Cascader(_ref) {
       onItemSelect(category);
     }
   };
-  var onPathClick = useCallback(function (pathName) {
-    var chosenCategory = enteredCategories.find(function (enteredCategory) {
-      return enteredCategory.name === pathName;
-    });
-    var updatedEnteredCategories;
+  const onPathClick = useCallback((pathName) => {
+    const chosenCategory = enteredCategories.find((enteredCategory) => enteredCategory.name === pathName);
+    let updatedEnteredCategories;
     if (chosenCategory) {
       updatedEnteredCategories = enteredCategories.slice(0, enteredCategories.indexOf(chosenCategory) + 1);
     }
-    if (chosenCategory != null && chosenCategory.id) {
-      var nextActiveCategory = searchCategoryWithId(rootCategory, chosenCategory.id);
+    if (chosenCategory?.id) {
+      const nextActiveCategory = searchCategoryWithId(rootCategory, chosenCategory.id);
       if (nextActiveCategory) {
         setActiveCategory(nextActiveCategory);
       }
@@ -109,86 +93,44 @@ export var Cascader = function Cascader(_ref) {
     }
     setEnteredCategories(updatedEnteredCategories || []);
   }, [rootCategory, enteredCategories]);
-  var onHomeIconClick = useCallback(function () {
+  const onHomeIconClick = useCallback(() => {
     setActiveCategory(rootCategory);
     setEnteredCategories([]);
   }, [rootCategory]);
-  var filterPathsBySearchQuery = useCallback(function (value) {
+  const filterPathsBySearchQuery = useCallback((value) => {
     if (paths) {
-      var filtered = filterPaths(paths, value.toLowerCase());
+      const filtered = filterPaths(paths, value.toLowerCase());
       setFilteredPaths(filtered);
     } else {
       setFilteredPaths([]);
     }
   }, [paths]);
-  var handleBreadCrumbClick = function handleBreadCrumbClick(breadcrumb) {
-    var selectedCategory = searchCategoryWithId(rootCategory, breadcrumb == null ? void 0 : breadcrumb.id);
+  const handleBreadCrumbClick = (breadcrumb) => {
+    const selectedCategory = searchCategoryWithId(rootCategory, breadcrumb?.id);
     selectedCategory ? onItemSelect(selectedCategory) : onItemSelect(breadcrumb);
   };
-  var backActionVisible = useMemo(function () {
-    return !searchQuery && !!previousCategory && !!previousCategory.name && enteredCategories.length > 1;
-  }, [enteredCategories.length, previousCategory, searchQuery]);
-  return /*#__PURE__*/React.createElement(S.Wrapper, {
-    className: "ds-cascader"
-  }, /*#__PURE__*/React.createElement(S.InputWrapper, null, /*#__PURE__*/React.createElement(SearchBar, {
-    onSearchChange: function onSearchChange(value) {
+  const backActionVisible = useMemo(() => !searchQuery && !!previousCategory && !!previousCategory.name && enteredCategories.length > 1, [enteredCategories.length, previousCategory, searchQuery]);
+  return /* @__PURE__ */ jsxs(Wrapper, { className: "ds-cascader", children: [
+    /* @__PURE__ */ jsx(InputWrapper, { children: /* @__PURE__ */ jsx(SearchBar, { onSearchChange: (value) => {
       setSearchQuery(value);
       filterPathsBySearchQuery(value);
-    },
-    placeholder: searchInputPlaceholder || '',
-    value: searchQuery,
-    iconLeft: /*#__PURE__*/React.createElement(Icon, {
-      component: /*#__PURE__*/React.createElement(SearchM, null),
-      color: theme.palette['grey-600']
-    }),
-    onClearInput: function onClearInput() {
-      return setSearchQuery('');
-    },
-    clearTooltip: searchClearTooltip
-  })), /*#__PURE__*/React.createElement(S.SearchResults, {
-    visible: !isSearching || filteredPaths && (filteredPaths == null ? void 0 : filteredPaths.length) > 0,
-    ref: searchResultsContainer,
-    style: contentStyles
-  }, isSearching && filteredPaths && /*#__PURE__*/React.createElement(S.CascaderScrollbar, {
-    maxHeight: maxHeight,
-    searching: isSearching,
-    absolute: isSearching,
-    onScroll: function onScroll(_ref2) {
-      var currentTarget = _ref2.currentTarget;
-      setScrollTop(currentTarget.scrollTop);
-    }
-  }, /*#__PURE__*/React.createElement(BreadcrumbsList, {
-    width: "calc(100% - 8px)",
-    visibleRows: calculateVisibleRows,
-    rowHeight: BREADCRUMB_ITEM_HEIGHT,
-    paths: filteredPaths,
-    highlight: searchQuery,
-    onBreadCrumbClick: handleBreadCrumbClick,
-    scrollTop: scrollTop,
-    selectedIds: selectedIds
-  })), /*#__PURE__*/React.createElement(Navigation, {
-    backActionVisible: backActionVisible,
-    breadcrumbVisible: !searchQuery && !!activeCategory.path,
-    onPathClick: onPathClick,
-    onHomeIconClick: onHomeIconClick,
-    previousCategory: previousCategory,
-    activeCategory: activeCategory
-  }), !searchQuery && /*#__PURE__*/React.createElement("div", {
-    ref: categoriesContainer
-  }, /*#__PURE__*/React.createElement(S.CascaderScrollbar, {
-    maxHeight: categoriesMaxHeight,
-    searching: isSearching,
-    absolute: isSearching,
-    onScroll: function onScroll(_ref3) {
-      var currentTarget = _ref3.currentTarget;
-      setScrollTop(currentTarget.scrollTop);
-    }
-  }, /*#__PURE__*/React.createElement(CategoriesList, {
-    rootCategory: activeCategory,
-    onCategoryClick: onCategoryClick,
-    suffixel: categorySuffix,
-    onSuffixelClick: onItemSelect,
-    selectedIds: selectedIds
-  })))));
+    }, placeholder: searchInputPlaceholder || "", value: searchQuery, iconLeft: /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(SearchM, {}), color: theme.palette["grey-600"] }), onClearInput: () => setSearchQuery(""), clearTooltip: searchClearTooltip }) }),
+    /* @__PURE__ */ jsxs(SearchResults, { visible: !isSearching || filteredPaths && filteredPaths?.length > 0, ref: searchResultsContainer, style: contentStyles, children: [
+      isSearching && filteredPaths && /* @__PURE__ */ jsx(CascaderScrollbar, { maxHeight, searching: isSearching, absolute: isSearching, onScroll: ({
+        currentTarget
+      }) => {
+        setScrollTop(currentTarget.scrollTop);
+      }, children: /* @__PURE__ */ jsx(BreadcrumbsList, { width: "calc(100% - 8px)", visibleRows: calculateVisibleRows, rowHeight: BREADCRUMB_ITEM_HEIGHT, paths: filteredPaths, highlight: searchQuery, onBreadCrumbClick: handleBreadCrumbClick, scrollTop, selectedIds }) }),
+      /* @__PURE__ */ jsx(Navigation, { backActionVisible, breadcrumbVisible: !searchQuery && !!activeCategory.path, onPathClick, onHomeIconClick, previousCategory, activeCategory }),
+      !searchQuery && /* @__PURE__ */ jsx("div", { ref: categoriesContainer, children: /* @__PURE__ */ jsx(CascaderScrollbar, { maxHeight: categoriesMaxHeight, searching: isSearching, absolute: isSearching, onScroll: ({
+        currentTarget
+      }) => {
+        setScrollTop(currentTarget.scrollTop);
+      }, children: /* @__PURE__ */ jsx(CategoriesList, { rootCategory: activeCategory, onCategoryClick, suffixel: categorySuffix, onSuffixelClick: onItemSelect, selectedIds }) }) })
+    ] })
+  ] });
+};
+export {
+  Cascader,
+  Cascader as default
 };
-export default Cascader;

package/dist/Cascader.styles.d.ts

@@ -1,10 +1,10 @@
-export declare const InputWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SearchResults: import("styled-components").StyledComponent<"div", any, {
+export declare const InputWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const SearchResults: import('styled-components').StyledComponent<"div", any, {
     visible?: boolean;
 }, never>;
-export declare const CascaderScrollbar: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<(import("@synerise/ds-scrollbar").ScrollbarProps | import("@synerise/ds-scrollbar").VirtualScrollbarProps) & import("react").RefAttributes<HTMLElement>>, any, {
+export declare const CascaderScrollbar: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<(import('@synerise/ds-scrollbar').ScrollbarProps | import('@synerise/ds-scrollbar').VirtualScrollbarProps) & import('react').RefAttributes<HTMLElement>>, any, {
     searching?: boolean;
 }, never>;
-export declare const Wrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BreadcrumbPrefix: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const DividerContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Wrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const BreadcrumbPrefix: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const DividerContainer: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/Cascader.styles.js

@@ -1,32 +1,34 @@
-import styled from 'styled-components';
-import Scrollbar from '@synerise/ds-scrollbar';
-export var InputWrapper = styled.div.withConfig({
+import styled from "styled-components";
+import Scrollbar from "@synerise/ds-scrollbar";
+const InputWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Cascaderstyles__InputWrapper",
   componentId: "sc-endrj4-0"
 })(["box-shadow:0 16px 32px 0 rgba(35,41,54,0.05);"]);
-export var SearchResults = styled.div.withConfig({
+const SearchResults = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Cascaderstyles__SearchResults",
   componentId: "sc-endrj4-1"
-})(["display:", ";width:100%;background:", ";border-radius:0 0 3px 3px;padding:8px 0 8px 8px;box-shadow:0 16px 32px 0 rgba(35,41,54,0.05);z-index:10;"], function (props) {
-  return !props.visible ? 'none' : 'block';
-}, function (props) {
-  return props.theme.palette.white;
-});
-export var CascaderScrollbar = styled(Scrollbar).withConfig({
+})(["display:", ";width:100%;background:", ";border-radius:0 0 3px 3px;padding:8px 0 8px 8px;box-shadow:0 16px 32px 0 rgba(35,41,54,0.05);z-index:10;"], (props) => !props.visible ? "none" : "block", (props) => props.theme.palette.white);
+const CascaderScrollbar = /* @__PURE__ */ styled(Scrollbar).withConfig({
   displayName: "Cascaderstyles__CascaderScrollbar",
   componentId: "sc-endrj4-2"
-})(["padding-right:", ";"], function (props) {
-  return props.searching ? "0" : '8px';
-});
-export var Wrapper = styled.div.withConfig({
+})(["padding-right:", ";"], (props) => props.searching ? `0` : "8px");
+const Wrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Cascaderstyles__Wrapper",
   componentId: "sc-endrj4-3"
 })(["&&{.ant-menu-inline,.-inline{border-right:none;}}"]);
-export var BreadcrumbPrefix = styled.div.withConfig({
+const BreadcrumbPrefix = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Cascaderstyles__BreadcrumbPrefix",
   componentId: "sc-endrj4-4"
 })([""]);
-export var DividerContainer = styled.div.withConfig({
+const DividerContainer = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Cascaderstyles__DividerContainer",
   componentId: "sc-endrj4-5"
-})(["padding:8px;"]);
+})(["padding:8px;"]);
+export {
+  BreadcrumbPrefix,
+  CascaderScrollbar,
+  DividerContainer,
+  InputWrapper,
+  SearchResults,
+  Wrapper
+};

package/dist/Cascader.types.d.ts

@@ -1,4 +1,4 @@
-import type { CSSProperties, ReactNode, ReactText } from 'react';
+import { CSSProperties, ReactNode, ReactText } from 'react';
 export type Texts = 'searchPlaceholder';
 export type Category = {
     id: ReactText;

package/dist/Cascader.types.js

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

package/dist/Elements/BackAction/BackAction.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import { type BackActionProps } from './BackAction.types';
+import { default as React } from 'react';
+import { BackActionProps } from './BackAction.types';
 export declare const BackAction: ({ label, onClick }: BackActionProps) => React.JSX.Element;
 export default BackAction;

package/dist/Elements/BackAction/BackAction.js

@@ -1,17 +1,19 @@
-import React from 'react';
-import Divider from '@synerise/ds-divider';
-import Icon, { ArrowLeftM } from '@synerise/ds-icon';
-import { DividerContainer } from '../../Cascader.styles';
-import * as S from './BackAction.styles';
-export var BackAction = function BackAction(_ref) {
-  var label = _ref.label,
-    onClick = _ref.onClick;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(S.BackActionWrapper, null, /*#__PURE__*/React.createElement(S.ContentWrapper, {
-    onClick: onClick
-  }, /*#__PURE__*/React.createElement(S.IconWrapper, null, /*#__PURE__*/React.createElement(Icon, {
-    component: /*#__PURE__*/React.createElement(ArrowLeftM, null)
-  })), /*#__PURE__*/React.createElement(S.Label, null, label))), /*#__PURE__*/React.createElement(DividerContainer, null, /*#__PURE__*/React.createElement(Divider, {
-    dashed: true
-  })));
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import Divider from "@synerise/ds-divider";
+import Icon, { ArrowLeftM } from "@synerise/ds-icon";
+import { DividerContainer } from "../../Cascader.styles.js";
+import { BackActionWrapper, ContentWrapper, IconWrapper, Label } from "./BackAction.styles.js";
+const BackAction = ({
+  label,
+  onClick
+}) => /* @__PURE__ */ jsxs(Fragment, { children: [
+  /* @__PURE__ */ jsx(BackActionWrapper, { children: /* @__PURE__ */ jsxs(ContentWrapper, { onClick, children: [
+    /* @__PURE__ */ jsx(IconWrapper, { children: /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(ArrowLeftM, {}) }) }),
+    /* @__PURE__ */ jsx(Label, { children: label })
+  ] }) }),
+  /* @__PURE__ */ jsx(DividerContainer, { children: /* @__PURE__ */ jsx(Divider, { dashed: true }) })
+] });
+export {
+  BackAction,
+  BackAction as default
 };
-export default BackAction;

package/dist/Elements/BackAction/BackAction.styles.d.ts

@@ -1,4 +1,4 @@
-export declare const Label: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const IconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BackActionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Label: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const IconWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const BackActionWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const ContentWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/Elements/BackAction/BackAction.styles.js

@@ -1,25 +1,23 @@
-import styled from 'styled-components';
-export var Label = styled.div.withConfig({
+import styled from "styled-components";
+const Label = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BackActionstyles__Label",
   componentId: "sc-mg8442-0"
-})(["font-weight:500;font-size:14px;transition:color 0.3s ease;color:", ";"], function (props) {
-  return props.theme.palette['grey-700'];
-});
-export var IconWrapper = styled.div.withConfig({
+})(["font-weight:500;font-size:14px;transition:color 0.3s ease;color:", ";"], (props) => props.theme.palette["grey-700"]);
+const IconWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BackActionstyles__IconWrapper",
   componentId: "sc-mg8442-1"
-})(["margin-right:12px;svg{transition:fill 0.3s ease;fill:", ";}"], function (props) {
-  return props.theme.palette['grey-700'];
-});
-export var BackActionWrapper = styled.div.withConfig({
+})(["margin-right:12px;svg{transition:fill 0.3s ease;fill:", ";}"], (props) => props.theme.palette["grey-700"]);
+const BackActionWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BackActionstyles__BackActionWrapper",
   componentId: "sc-mg8442-2"
-})(["padding:0 8px;&:hover{", "{color:", ";}", "{color:", ";}}"], Label, function (props) {
-  return props.theme.palette['blue-600'];
-}, IconWrapper, function (props) {
-  return props.theme.palette['blue-600'];
-});
-export var ContentWrapper = styled.div.withConfig({
+})(["padding:0 8px;&:hover{", "{color:", ";}", "{color:", ";}}"], Label, (props) => props.theme.palette["blue-600"], IconWrapper, (props) => props.theme.palette["blue-600"]);
+const ContentWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BackActionstyles__ContentWrapper",
   componentId: "sc-mg8442-3"
-})(["padding:8px 0;display:flex;align-items:center;cursor:pointer;"]);
+})(["padding:8px 0;display:flex;align-items:center;cursor:pointer;"]);
+export {
+  BackActionWrapper,
+  ContentWrapper,
+  IconWrapper,
+  Label
+};

package/dist/Elements/BackAction/BackAction.types.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import { ReactNode } from 'react';
 export type BackActionProps = {
     label: ReactNode;
     onClick: () => void;

package/dist/Elements/BackAction/BackAction.types.js

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

package/dist/Elements/BottomAction/BottomAction.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import { type BottomActionProps } from './BottomAction.types';
+import { default as React } from 'react';
+import { BottomActionProps } from './BottomAction.types';
 export declare const BottomAction: ({ onClickAction, children, icon, }: BottomActionProps) => React.JSX.Element;
 export default BottomAction;

package/dist/Elements/BottomAction/BottomAction.js

@@ -1,14 +1,15 @@
-import React from 'react';
-import Icon from '@synerise/ds-icon';
-import * as S from './BottomAction.styles';
-export var BottomAction = function BottomAction(_ref) {
-  var onClickAction = _ref.onClickAction,
-    children = _ref.children,
-    icon = _ref.icon;
-  return /*#__PURE__*/React.createElement(S.BottomAction, {
-    onClick: onClickAction
-  }, icon && /*#__PURE__*/React.createElement(S.IconWrapper, null, /*#__PURE__*/React.createElement(Icon, {
-    component: icon
-  })), /*#__PURE__*/React.createElement(S.TextWrapper, null, children));
+import { jsxs, jsx } from "react/jsx-runtime";
+import Icon from "@synerise/ds-icon";
+import { BottomAction as BottomAction$1, IconWrapper, TextWrapper } from "./BottomAction.styles.js";
+const BottomAction = ({
+  onClickAction,
+  children,
+  icon
+}) => /* @__PURE__ */ jsxs(BottomAction$1, { onClick: onClickAction, children: [
+  icon && /* @__PURE__ */ jsx(IconWrapper, { children: /* @__PURE__ */ jsx(Icon, { component: icon }) }),
+  /* @__PURE__ */ jsx(TextWrapper, { children })
+] });
+export {
+  BottomAction,
+  BottomAction as default
 };
-export default BottomAction;

package/dist/Elements/BottomAction/BottomAction.styles.d.ts

@@ -1,3 +1,3 @@
-export declare const IconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TextWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BottomAction: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const IconWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TextWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const BottomAction: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/Elements/BottomAction/BottomAction.styles.js

@@ -1,21 +1,18 @@
-import styled from 'styled-components';
-export var IconWrapper = styled.div.withConfig({
+import styled from "styled-components";
+const IconWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BottomActionstyles__IconWrapper",
   componentId: "sc-rp021x-0"
-})(["margin-right:4px;svg{fill:", ";}"], function (props) {
-  return props.theme.palette['grey-600'];
-});
-export var TextWrapper = styled.div.withConfig({
+})(["margin-right:4px;svg{fill:", ";}"], (props) => props.theme.palette["grey-600"]);
+const TextWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BottomActionstyles__TextWrapper",
   componentId: "sc-rp021x-1"
 })(["line-height:12px;"]);
-export var BottomAction = styled.div.withConfig({
+const BottomAction = /* @__PURE__ */ styled.div.withConfig({
   displayName: "BottomActionstyles__BottomAction",
   componentId: "sc-rp021x-2"
-})(["background-color:", ";padding:0 16px;height:52px;display:flex;align-items:center;color:", ";font-weight:500;border-width:1px 0 0 0;border-color:", ";border-style:solid;margin-top:8px;cursor:pointer;"], function (props) {
-  return props.theme.palette['grey-050'];
-}, function (props) {
-  return props.theme.palette['grey-600'];
-}, function (props) {
-  return props.theme.palette['grey-100'];
-});
+})(["background-color:", ";padding:0 16px;height:52px;display:flex;align-items:center;color:", ";font-weight:500;border-width:1px 0 0 0;border-color:", ";border-style:solid;margin-top:8px;cursor:pointer;"], (props) => props.theme.palette["grey-050"], (props) => props.theme.palette["grey-600"], (props) => props.theme.palette["grey-100"]);
+export {
+  BottomAction,
+  IconWrapper,
+  TextWrapper
+};

package/dist/Elements/BottomAction/BottomAction.types.d.ts

@@ -1,4 +1,4 @@
-import type { ReactElement, ReactNode } from 'react';
+import { ReactElement, ReactNode } from 'react';
 export type BottomActionProps = {
     onClickAction: () => void;
     icon?: ReactElement;

package/dist/Elements/BottomAction/BottomAction.types.js

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

package/dist/Elements/Breadcrumb/Breadcrumb.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import { type BreadcrumbProps } from './Breadcrumb.types';
+import { default as React } from 'react';
+import { BreadcrumbProps } from './Breadcrumb.types';
 export declare const Breadcrumb: ({ path, disabled, highlight, description, onPathClick, compact, startWithArrow, gradientOverlap, highlightActivePath, className, prefixel, isNavigation, ...rest }: BreadcrumbProps) => React.JSX.Element;
 export default Breadcrumb;