@wireapp/react-ui-kit 9.52.1 → 9.53.0

package/lib/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.d.ts

@@ -1,9 +1,10 @@
-import { MouseEvent as ReactMouseEvent } from 'react';
+import { MouseEvent as ReactMouseEvent, ReactNode } from 'react';
 interface BreadcrumbItemProps {
     name: string;
+    icon?: ReactNode;
     isActive: boolean;
     onClick: (event: ReactMouseEvent<HTMLButtonElement, MouseEvent>) => void;
 }
-export declare const BreadcrumbItem: ({ name, isActive, onClick }: BreadcrumbItemProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const BreadcrumbItem: ({ name, icon, isActive, onClick }: BreadcrumbItemProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=BreadcrumbItem.d.ts.map

package/lib/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../../../src/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,UAAU,IAAI,eAAe,EAAC,MAAM,OAAO,CAAC;AAIpD,UAAU,mBAAmB;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CAC1E;AAED,eAAO,MAAM,cAAc,gCAA+B,mBAAmB,qDAY5E,CAAC"}
+{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../../../src/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,UAAU,IAAI,eAAe,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAI/D,UAAU,mBAAmB;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CAC1E;AAED,eAAO,MAAM,cAAc,sCAAqC,mBAAmB,qDAgBlF,CAAC"}

package/lib/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.BreadcrumbItem = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const BreadcrumbItem_styles_1 = require("./BreadcrumbItem.styles");
-const BreadcrumbItem = ({ name, isActive, onClick }) => {
-    return ((0, jsx_runtime_1.jsx)("li", { css: BreadcrumbItem_styles_1.listItemStyles, children: isActive ? ((0, jsx_runtime_1.jsx)("span", { css: BreadcrumbItem_styles_1.activeItemStyles, children: name })) : ((0, jsx_runtime_1.jsx)("button", { type: "button", css: BreadcrumbItem_styles_1.buttonStyles, onClick: onClick, children: name })) }));
+const BreadcrumbItem = ({ name, icon, isActive, onClick }) => {
+    return ((0, jsx_runtime_1.jsx)("li", { css: BreadcrumbItem_styles_1.listItemStyles, children: isActive ? ((0, jsx_runtime_1.jsxs)("span", { css: BreadcrumbItem_styles_1.activeItemStyles, children: [icon, name] })) : ((0, jsx_runtime_1.jsxs)("button", { type: "button", css: BreadcrumbItem_styles_1.buttonStyles, onClick: onClick, children: [icon, name] })) }));
 };
 exports.BreadcrumbItem = BreadcrumbItem;

package/lib/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbItem.styles.d.ts","sourceRoot":"","sources":["../../../../src/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.styles.ts"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,eAAO,MAAM,cAAc,EAAE,SAI5B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,SAW1B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,SAK9B,CAAC"}
+{"version":3,"file":"BreadcrumbItem.styles.d.ts","sourceRoot":"","sources":["../../../../src/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.styles.ts"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,eAAO,MAAM,cAAc,EAAE,SAI5B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,SAc1B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,SAO9B,CAAC"}

package/lib/Misc/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.styles.js

@@ -32,12 +32,17 @@ exports.buttonStyles = {
     cursor: 'pointer',
     fontSize: '14px',
     color: colors_v2_1.COLOR_V2.GRAY_70,
+    display: 'flex',
+    alignItems: 'center',
+    gap: '8px',
     '&:hover': {
         color: 'var(--main-color)',
     },
 };
 exports.activeItemStyles = {
-    display: 'inline-block',
+    display: 'inline-flex',
+    alignItems: 'center',
+    gap: '8px',
     padding: '0 8px',
     fontSize: '14px',
     color: 'var(--main-color)',

package/lib/Misc/Breadcrumbs/Breadcrumbs.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 interface BreadcrumbsProps {
     /**
      * Maximum number of items to display before combining middle items into a dropdown.
@@ -6,6 +7,7 @@ interface BreadcrumbsProps {
     maxNotCombinedItems?: number;
     items: Array<{
         name: string;
+        icon?: ReactNode;
     }>;
     onItemClick: (item: {
         name: string;

package/lib/Misc/Breadcrumbs/Breadcrumbs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../../src/Misc/Breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"AA0BA,UAAU,gBAAgB;IACxB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B,KAAK,EAAE,KAAK,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAC,CAAC,CAAC;IAE7B,WAAW,EAAE,CAAC,IAAI,EAAE;QAAC,IAAI,EAAE,MAAM,CAAA;KAAC,KAAK,IAAI,CAAC;CAC7C;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,WAAW,iDAIrB,gBAAgB,qDA6ClB,CAAC"}
+{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../../src/Misc/Breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAShC,UAAU,gBAAgB;IACxB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B,KAAK,EAAE,KAAK,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,SAAS,CAAA;KAAC,CAAC,CAAC;IAE/C,WAAW,EAAE,CAAC,IAAI,EAAE;QAAC,IAAI,EAAE,MAAM,CAAA;KAAC,KAAK,IAAI,CAAC;CAC7C;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,WAAW,iDAIrB,gBAAgB,qDAoDlB,CAAC"}

package/lib/Misc/Breadcrumbs/Breadcrumbs.js

@@ -2,24 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Breadcrumbs = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-/*
- * Wire
- * Copyright (C) 2025 Wire Swiss GmbH
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see http://www.gnu.org/licenses/.
- *
- */
 const BreadcrumbItem_1 = require("./BreadcrumbItem/BreadcrumbItem");
 const BreadcrumbLeaf_1 = require("./BreadcrumbLeaf/BreadcrumbLeaf");
 const Breadcrumbs_styles_1 = require("./Breadcrumbs.styles");
@@ -37,13 +19,13 @@ const DEFAULT_MAX_VISIBLE_BREADCRUMBS = 4;
  */
 const Breadcrumbs = ({ maxNotCombinedItems = DEFAULT_MAX_VISIBLE_BREADCRUMBS, items, onItemClick, }) => {
     if (items.length <= maxNotCombinedItems) {
-        return ((0, jsx_runtime_1.jsx)("ol", { css: Breadcrumbs_styles_1.listStyles, children: items.map((crumb, index) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [index > 0 && (0, jsx_runtime_1.jsx)(BreadcrumbLeaf_1.BreadcrumbLeaf, {}), (0, jsx_runtime_1.jsx)(BreadcrumbItem_1.BreadcrumbItem, { name: crumb.name, isActive: index === items.length - 1, onClick: () => onItemClick(crumb) }, crumb.name)] }))) }));
+        return ((0, jsx_runtime_1.jsx)("ol", { css: Breadcrumbs_styles_1.listStyles, children: items.map((crumb, index) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [index > 0 && (0, jsx_runtime_1.jsx)(BreadcrumbLeaf_1.BreadcrumbLeaf, {}), (0, jsx_runtime_1.jsx)(BreadcrumbItem_1.BreadcrumbItem, { name: crumb.name, icon: crumb.icon, isActive: index === items.length - 1, onClick: () => onItemClick(crumb) }, crumb.name)] }))) }));
     }
     const firstCrumb = items[0];
     // eslint-disable-next-line no-magic-numbers
     const lastTwoCrumbs = items.slice(-2);
     // eslint-disable-next-line no-magic-numbers
     const middleCrumbs = items.slice(1, -2);
-    return ((0, jsx_runtime_1.jsxs)("ol", { css: Breadcrumbs_styles_1.listStyles, children: [(0, jsx_runtime_1.jsx)(BreadcrumbItem_1.BreadcrumbItem, { name: firstCrumb.name, isActive: false, onClick: () => onItemClick(firstCrumb) }), (0, jsx_runtime_1.jsx)(BreadcrumbLeaf_1.BreadcrumbLeaf, {}), (0, jsx_runtime_1.jsx)(CombainedBreadcrumbs_1.CombainedBreadcrumbs, { items: middleCrumbs, onItemClick: onItemClick }), (0, jsx_runtime_1.jsx)(BreadcrumbLeaf_1.BreadcrumbLeaf, {}), lastTwoCrumbs.map((crumb, index) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [index > 0 && (0, jsx_runtime_1.jsx)(BreadcrumbLeaf_1.BreadcrumbLeaf, {}), (0, jsx_runtime_1.jsx)(BreadcrumbItem_1.BreadcrumbItem, { name: crumb.name, isActive: index === lastTwoCrumbs.length - 1, onClick: () => onItemClick(crumb) }, crumb.name)] })))] }));
+    return ((0, jsx_runtime_1.jsxs)("ol", { css: Breadcrumbs_styles_1.listStyles, children: [(0, jsx_runtime_1.jsx)(BreadcrumbItem_1.BreadcrumbItem, { name: firstCrumb.name, icon: firstCrumb.icon, isActive: false, onClick: () => onItemClick(firstCrumb) }), (0, jsx_runtime_1.jsx)(BreadcrumbLeaf_1.BreadcrumbLeaf, {}), (0, jsx_runtime_1.jsx)(CombainedBreadcrumbs_1.CombainedBreadcrumbs, { items: middleCrumbs, onItemClick: onItemClick }), (0, jsx_runtime_1.jsx)(BreadcrumbLeaf_1.BreadcrumbLeaf, {}), lastTwoCrumbs.map((crumb, index) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [index > 0 && (0, jsx_runtime_1.jsx)(BreadcrumbLeaf_1.BreadcrumbLeaf, {}), (0, jsx_runtime_1.jsx)(BreadcrumbItem_1.BreadcrumbItem, { name: crumb.name, icon: crumb.icon, isActive: index === lastTwoCrumbs.length - 1, onClick: () => onItemClick(crumb) }, crumb.name)] })))] }));
 };
 exports.Breadcrumbs = Breadcrumbs;

package/lib/Misc/Breadcrumbs/Breadcrumbs.stories.d.ts

@@ -5,4 +5,6 @@ export default meta;
 type Story = StoryObj<typeof Breadcrumbs>;
 export declare const Default: Story;
 export declare const WithCombinedItems: Story;
+export declare const WithIcons: Story;
+export declare const WithIconsAndCombinedItems: Story;
 //# sourceMappingURL=Breadcrumbs.stories.d.ts.map

package/lib/Misc/Breadcrumbs/Breadcrumbs.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.stories.d.ts","sourceRoot":"","sources":["../../../src/Misc/Breadcrumbs/Breadcrumbs.stories.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,IAAI,EAAE,QAAQ,EAAC,MAAM,oBAAoB,CAAC;AAElD,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAE1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAMlC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAE1C,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC"}
+{"version":3,"file":"Breadcrumbs.stories.d.ts","sourceRoot":"","sources":["../../../src/Misc/Breadcrumbs/Breadcrumbs.stories.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,IAAI,EAAE,QAAQ,EAAC,MAAM,oBAAoB,CAAC;AAElD,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAI1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAMlC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAE1C,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAOvB,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAavC,CAAC"}

package/lib/Misc/Breadcrumbs/Breadcrumbs.stories.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.WithCombinedItems = exports.Default = void 0;
+exports.WithIconsAndCombinedItems = exports.WithIcons = exports.WithCombinedItems = exports.Default = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const Breadcrumbs_1 = require("./Breadcrumbs");
+const Icon_1 = require("../../Icon");
 const meta = {
     component: Breadcrumbs_1.Breadcrumbs,
     title: 'Misc/Breadcrumbs',
@@ -17,3 +18,15 @@ exports.Default = {
 exports.WithCombinedItems = {
     render: () => ((0, jsx_runtime_1.jsx)(Breadcrumbs_1.Breadcrumbs, { items: [{ name: 'Home' }, { name: 'Folder' }, { name: 'Subfolder 1' }, { name: 'Subfolder 2' }, { name: 'Subfolder 3' }], onItemClick: () => { } })),
 };
+exports.WithIcons = {
+    render: () => ((0, jsx_runtime_1.jsx)(Breadcrumbs_1.Breadcrumbs, { items: [{ name: 'Home' }, { name: 'Folder', icon: (0, jsx_runtime_1.jsx)(Icon_1.TrashIcon, {}) }, { name: 'Subfolder' }], onItemClick: () => { } })),
+};
+exports.WithIconsAndCombinedItems = {
+    render: () => ((0, jsx_runtime_1.jsx)(Breadcrumbs_1.Breadcrumbs, { items: [
+            { name: 'Home' },
+            { name: 'Folder', icon: (0, jsx_runtime_1.jsx)(Icon_1.TrashIcon, {}) },
+            { name: 'Subfolder 1' },
+            { name: 'Subfolder 2' },
+            { name: 'Subfolder 3' },
+        ], onItemClick: () => { } })),
+};

package/lib/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.d.ts

@@ -1,6 +1,8 @@
+import { ReactNode } from 'react';
 interface CombainedBreadcrumbsProps {
     items: Array<{
         name: string;
+        icon?: ReactNode;
     }>;
     onItemClick: (item: {
         name: string;

package/lib/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CombainedBreadcrumbs.d.ts","sourceRoot":"","sources":["../../../../src/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.tsx"],"names":[],"mappings":"AAuBA,UAAU,yBAAyB;IACjC,KAAK,EAAE,KAAK,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAC,CAAC,CAAC;IAC7B,WAAW,EAAE,CAAC,IAAI,EAAE;QAAC,IAAI,EAAE,MAAM,CAAA;KAAC,KAAK,IAAI,CAAC;CAC7C;AAED,eAAO,MAAM,oBAAoB,2BAA0B,yBAAyB,qDAmBnF,CAAC"}
+{"version":3,"file":"CombainedBreadcrumbs.d.ts","sourceRoot":"","sources":["../../../../src/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAMhC,UAAU,yBAAyB;IACjC,KAAK,EAAE,KAAK,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,SAAS,CAAA;KAAC,CAAC,CAAC;IAC/C,WAAW,EAAE,CAAC,IAAI,EAAE;QAAC,IAAI,EAAE,MAAM,CAAA;KAAC,KAAK,IAAI,CAAC;CAC7C;AAED,eAAO,MAAM,oBAAoB,2BAA0B,yBAAyB,qDAsBnF,CAAC"}

package/lib/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.js

@@ -2,27 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CombainedBreadcrumbs = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-/*
- * Wire
- * Copyright (C) 2025 Wire Swiss GmbH
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see http://www.gnu.org/licenses/.
- *
- */
 const CombainedBreadcrumbs_styles_1 = require("./CombainedBreadcrumbs.styles");
 const DropdownMenu_1 = require("../../../Modal/DropdownMenu");
 const CombainedBreadcrumbs = ({ items, onItemClick }) => {
-    return ((0, jsx_runtime_1.jsxs)(DropdownMenu_1.DropdownMenu, { children: [(0, jsx_runtime_1.jsx)(DropdownMenu_1.DropdownMenu.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)("button", { type: "button", css: CombainedBreadcrumbs_styles_1.buttonStyles, children: "..." }) }) }), (0, jsx_runtime_1.jsx)(DropdownMenu_1.DropdownMenu.Content, { children: items.map(crumb => ((0, jsx_runtime_1.jsx)(DropdownMenu_1.DropdownMenu.Item, { onClick: () => onItemClick(crumb), children: crumb.name }, crumb.name))) })] }));
+    return ((0, jsx_runtime_1.jsxs)(DropdownMenu_1.DropdownMenu, { children: [(0, jsx_runtime_1.jsx)(DropdownMenu_1.DropdownMenu.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)("button", { type: "button", css: CombainedBreadcrumbs_styles_1.buttonStyles, children: "..." }) }) }), (0, jsx_runtime_1.jsx)(DropdownMenu_1.DropdownMenu.Content, { children: items.map(crumb => ((0, jsx_runtime_1.jsx)(DropdownMenu_1.DropdownMenu.Item, { onClick: () => onItemClick(crumb), children: (0, jsx_runtime_1.jsxs)("div", { css: CombainedBreadcrumbs_styles_1.itemStyles, children: [crumb.icon, crumb.name] }) }, crumb.name))) })] }));
 };
 exports.CombainedBreadcrumbs = CombainedBreadcrumbs;

package/lib/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.styles.d.ts

@@ -1,3 +1,4 @@
 import { CSSObject } from '@emotion/react';
 export declare const buttonStyles: CSSObject;
+export declare const itemStyles: CSSObject;
 //# sourceMappingURL=CombainedBreadcrumbs.styles.d.ts.map

package/lib/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CombainedBreadcrumbs.styles.d.ts","sourceRoot":"","sources":["../../../../src/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.styles.ts"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,eAAO,MAAM,YAAY,EAAE,SAW1B,CAAC"}
+{"version":3,"file":"CombainedBreadcrumbs.styles.d.ts","sourceRoot":"","sources":["../../../../src/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.styles.ts"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAIzC,eAAO,MAAM,YAAY,EAAE,SAW1B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,SAIxB,CAAC"}

package/lib/Misc/Breadcrumbs/CombainedBreadcrumbs/CombainedBreadcrumbs.styles.js

@@ -18,7 +18,7 @@
  *
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.buttonStyles = void 0;
+exports.itemStyles = exports.buttonStyles = void 0;
 const colors_v2_1 = require("../../../Identity/colors-v2");
 exports.buttonStyles = {
     background: 'none',
@@ -31,3 +31,8 @@ exports.buttonStyles = {
         color: 'var(--main-color)',
     },
 };
+exports.itemStyles = {
+    display: 'flex',
+    alignItems: 'center',
+    gap: '8px',
+};

package/package.json

@@ -78,6 +78,6 @@
     "test:watch": "jest --watch",
     "test:update": "jest --updateSnapshot"
   },
-  "version": "9.52.1",
-  "gitHead": "567107c5f43d16864e6548c3b61d6a112f238f3d"
+  "version": "9.53.0",
+  "gitHead": "2c0176605d098e616d7b0be09bf417ca4683c615"
 }