@webiny/admin-ui 0.0.0-unstable.61c048f412 → 0.0.0-unstable.6f45466a1d

package/Sidebar/Sidebar.stories.js

@@ -44,14 +44,10 @@ const SidebarComponent = () => {
   const {
     hash
   } = useLocation();
-  const [sidebarState, setSidebarState] = React.useState({
-    pinned: false,
-    expandedSections: [],
-    pinnedItems: []
-  });
+  const [pinnedItems, setPinnedItems] = React.useState([]);
   return /*#__PURE__*/React.createElement(SidebarProvider, {
-    state: sidebarState,
-    onChangeState: setSidebarState
+    pinnedItems: pinnedItems,
+    onChangePinnedItems: setPinnedItems
   }, /*#__PURE__*/React.createElement(Sidebar, {
     title: "Webiny",
     icon: /*#__PURE__*/React.createElement(Sidebar.Icon, {

package/Sidebar/Sidebar.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","BrowserRouter","Route","Routes","useLocation","ReactComponent","AuditLogsIcon","FormBuilderIcon","CmsIcon","PageBuilderIcon","InfoIcon","ChatIcon","GithubIcon","DocsIcon","ApiPlaygroundIcon","MoreVertIcon","FileManagerIcon","GridIcon","CarIcon","VehiclesIcon","Sidebar","SidebarProvider","DropdownMenu","Tag","Tooltip","meta","title","component","parameters","layout","argTypes","decorators","Story","createElement","Provider","MainMenu","render","path","element","SidebarComponent","hash","sidebarState","setSidebarState","useState","pinned","expandedSections","pinnedItems","state","onChangeState","icon","Icon","src","alt","label","footer","trigger","Item","text","action","Action","className","Separator","variant","content","Link","pinnable","onClick","console","log","to","active","alert","pinnedIcon","Group","disabled"],"sources":["Sidebar.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { BrowserRouter, Route, Routes, useLocation } from \"react-router\";\nimport { ReactComponent as AuditLogsIcon } from \"@webiny/icons/assignment.svg\";\nimport { ReactComponent as FormBuilderIcon } from \"@webiny/icons/check_box.svg\";\nimport { ReactComponent as CmsIcon } from \"@webiny/icons/web.svg\";\nimport { ReactComponent as PageBuilderIcon } from \"@webiny/icons/table_chart.svg\";\nimport { ReactComponent as InfoIcon } from \"@webiny/icons/info.svg\";\nimport { ReactComponent as ChatIcon } from \"@webiny/icons/chat.svg\";\nimport { ReactComponent as GithubIcon } from \"@webiny/icons/gite.svg\";\nimport { ReactComponent as DocsIcon } from \"@webiny/icons/summarize.svg\";\nimport { ReactComponent as ApiPlaygroundIcon } from \"@webiny/icons/swap_horiz.svg\";\nimport { ReactComponent as MoreVertIcon } from \"@webiny/icons/more_vert.svg\";\nimport { ReactComponent as FileManagerIcon } from \"@webiny/icons/insert_drive_file.svg\";\nimport { ReactComponent as GridIcon } from \"@webiny/icons/grid_4x4.svg\";\nimport { ReactComponent as CarIcon } from \"@webiny/icons/car_rental.svg\";\nimport { ReactComponent as VehiclesIcon } from \"@webiny/icons/expand.svg\";\nimport { Sidebar } from \"./Sidebar.js\";\nimport { SidebarProvider } from \"~/Sidebar/components/SidebarProvider.js\";\nimport { DropdownMenu } from \"~/DropdownMenu/index.js\";\nimport { Tag } from \"~/Tag/index.js\";\nimport { Tooltip } from \"~/Tooltip/index.js\";\n\nconst meta: Meta<typeof Sidebar> = {\n    title: \"Components/Sidebar\",\n    component: Sidebar,\n\n    parameters: {\n        layout: \"fullscreen\"\n    },\n\n    // We removed this because in the \"all stories\" view, the menu gets visually\n    // broken because of the fixed positioning of the sidebar. This is not a problem\n    // when the story is viewed in isolation.\n    // tags: [\"autodocs\"],\n\n    argTypes: {},\n    decorators: [\n        Story => (\n            <Tooltip.Provider>\n                <Story />\n            </Tooltip.Provider>\n        )\n    ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Sidebar>;\n\nexport const MainMenu: Story = {\n    render: () => (\n        <BrowserRouter>\n            <Routes>\n                <Route path={\"*\"} element={<SidebarComponent />} />\n            </Routes>\n        </BrowserRouter>\n    )\n};\n\nconst SidebarComponent = () => {\n    const { hash } = useLocation();\n\n    const [sidebarState, setSidebarState] = React.useState<{\n        pinned: boolean;\n        expandedSections: string[];\n        pinnedItems: string[];\n    }>({\n        pinned: false,\n        expandedSections: [],\n        pinnedItems: []\n    });\n\n    return (\n        <SidebarProvider state={sidebarState} onChangeState={setSidebarState}>\n            <Sidebar\n                title={\"Webiny\"}\n                icon={\n                    <Sidebar.Icon\n                        element={<img src=\"/images/wby-logo.png\" alt=\"Webiny\" />}\n                        label={\"Webiny\"}\n                    />\n                }\n                footer={\n                    <DropdownMenu\n                        trigger={\n                            <Sidebar.Item\n                                icon={<Sidebar.Item.Icon label=\"Settings\" element={<InfoIcon />} />}\n                                text={\"Support\"}\n                                action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                            />\n                        }\n                        className={\"w-[225px]\"}\n                    >\n                        <DropdownMenu.Item text={\"API Playground\"} icon={<ApiPlaygroundIcon />} />\n                        <DropdownMenu.Item text={\"Documentation\"} icon={<DocsIcon />} />\n                        <DropdownMenu.Item text={\"GitHub\"} icon={<GithubIcon />} />\n                        <DropdownMenu.Item text={\"Slack\"} icon={<ChatIcon />} />\n                        <DropdownMenu.Separator />\n                        <DropdownMenu.Item\n                            text={\n                                <div className={\"flex items-center\"}>\n                                    Webiny 6.0.0\n                                    <Tag\n                                        variant={\"accent\"}\n                                        content={\"WCP \"}\n                                        className={\"ml-sm-extra\"}\n                                    />\n                                </div>\n                            }\n                        />\n                    </DropdownMenu>\n                }\n            >\n                <Sidebar.Link\n                    pinnable\n                    text={\"Audit Logs\"}\n                    action={\n                        <Sidebar.Item.Action\n                            element={<MoreVertIcon />}\n                            onClick={() => console.log(\"More action clicked\")}\n                        />\n                    }\n                    to={\"#audit-logs\"}\n                    active={hash === \"#audit-logs\"}\n                    icon={<Sidebar.Item.Icon label=\"Audit Logs\" element={<AuditLogsIcon />} />}\n                />\n                <Sidebar.Link\n                    pinnable\n                    text={\"Form Builder\"}\n                    to={\"#form-builder\"}\n                    active={hash === \"#form-builder\"}\n                    icon={<Sidebar.Item.Icon label=\"Form Builder\" element={<FormBuilderIcon />} />}\n                />\n                <Sidebar.Item\n                    pinnable\n                    text={\"File Manager\"}\n                    onClick={() => {\n                        alert(\"File Manager clicked\");\n                    }}\n                    icon={<Sidebar.Item.Icon label=\"File Manager\" element={<FileManagerIcon />} />}\n                />\n                <Sidebar.Item\n                    text={\"Content\"}\n                    icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<CmsIcon />} />}\n                >\n                    <Sidebar.Item\n                        text={\"Vehicles\"}\n                        icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<VehiclesIcon />} />}\n                        action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                    >\n                        <Sidebar.Link\n                            pinnable\n                            pinnedIcon={\n                                <Sidebar.Item.Icon label=\"File Manager\" element={<CarIcon />} />\n                            }\n                            text={\"Cars\"}\n                            to={\"#cms-cars\"}\n                            active={hash === \"#cms-cars\"}\n                        />\n                        <Sidebar.Link\n                            pinnable\n                            text={\"Planes\"}\n                            to={\"#cms-planes\"}\n                            active={hash === \"#cms-planes\"}\n                        />\n                    </Sidebar.Item>{\" \"}\n                    <Sidebar.Item\n                        text={\"Ungrouped\"}\n                        icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<GridIcon />} />}\n                        action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                    >\n                        <Sidebar.Link\n                            text={\"Articles\"}\n                            to={\"#cms-articles\"}\n                            active={hash === \"#cms-articles\"}\n                        />\n                        <Sidebar.Link\n                            text={\"Settings\"}\n                            to={\"#cms-settings\"}\n                            active={hash === \"#cms-settings\"}\n                        />\n                    </Sidebar.Item>\n                </Sidebar.Item>\n                <Sidebar.Item\n                    text={\"Headless CMS\"}\n                    icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<CmsIcon />} />}\n                >\n                    <Sidebar.Group text={\"Content Models\"} />\n                    <Sidebar.Link\n                        pinnable\n                        text={\"Groups\"}\n                        to={\"#cms-groups\"}\n                        active={hash === \"#cms-groups\"}\n                    />\n                    <Sidebar.Link\n                        pinnable\n                        text={\"Models\"}\n                        to={\"#cms-models\"}\n                        active={hash === \"#cms-models\"}\n                    />\n                </Sidebar.Item>\n                <Sidebar.Item\n                    text={\"Page Builder\"}\n                    icon={<Sidebar.Item.Icon label=\"Page Builder\" element={<PageBuilderIcon />} />}\n                >\n                    <Sidebar.Group text={\"Blocks\"} />\n                    <Sidebar.Link\n                        text={\"Blocks\"}\n                        to={\"#pb-blocks\"}\n                        active={hash === \"#pb-blocks\"}\n                    />\n                    <Sidebar.Link\n                        text={\"Categories\"}\n                        to={\"#pb-blocks-categories\"}\n                        active={hash === \"#pb-blocks-categories\"}\n                    />\n\n                    <Sidebar.Group text={\"Pages\"} active={hash === `#pb-pages`} />\n                    <Sidebar.Link\n                        to={\"#pb-pages-categories\"}\n                        text={\"Categories\"}\n                        active={hash === `#pb-pages-categories`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-menus\"}\n                        text={\"Menus\"}\n                        active={hash === `#pb-pages-menus`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-pages\"}\n                        text={\"Pages\"}\n                        active={hash === `#pb-pages-pages`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-templates\"}\n                        text={\"Templates\"}\n                        disabled={true}\n                        active={hash === `#pb-pages-templates`}\n                    />\n                </Sidebar.Item>\n            </Sidebar>\n        </SidebarProvider>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","BrowserRouter","Route","Routes","useLocation","ReactComponent","AuditLogsIcon","FormBuilderIcon","CmsIcon","PageBuilderIcon","InfoIcon","ChatIcon","GithubIcon","DocsIcon","ApiPlaygroundIcon","MoreVertIcon","FileManagerIcon","GridIcon","CarIcon","VehiclesIcon","Sidebar","SidebarProvider","DropdownMenu","Tag","Tooltip","meta","title","component","parameters","layout","argTypes","decorators","Story","createElement","Provider","MainMenu","render","path","element","SidebarComponent","hash","pinnedItems","setPinnedItems","useState","onChangePinnedItems","icon","Icon","src","alt","label","footer","trigger","Item","text","action","Action","className","Separator","variant","content","Link","pinnable","onClick","console","log","to","active","alert","pinnedIcon","Group","disabled"],"sources":["Sidebar.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { BrowserRouter, Route, Routes, useLocation } from \"react-router\";\nimport { ReactComponent as AuditLogsIcon } from \"@webiny/icons/assignment.svg\";\nimport { ReactComponent as FormBuilderIcon } from \"@webiny/icons/check_box.svg\";\nimport { ReactComponent as CmsIcon } from \"@webiny/icons/web.svg\";\nimport { ReactComponent as PageBuilderIcon } from \"@webiny/icons/table_chart.svg\";\nimport { ReactComponent as InfoIcon } from \"@webiny/icons/info.svg\";\nimport { ReactComponent as ChatIcon } from \"@webiny/icons/chat.svg\";\nimport { ReactComponent as GithubIcon } from \"@webiny/icons/gite.svg\";\nimport { ReactComponent as DocsIcon } from \"@webiny/icons/summarize.svg\";\nimport { ReactComponent as ApiPlaygroundIcon } from \"@webiny/icons/swap_horiz.svg\";\nimport { ReactComponent as MoreVertIcon } from \"@webiny/icons/more_vert.svg\";\nimport { ReactComponent as FileManagerIcon } from \"@webiny/icons/insert_drive_file.svg\";\nimport { ReactComponent as GridIcon } from \"@webiny/icons/grid_4x4.svg\";\nimport { ReactComponent as CarIcon } from \"@webiny/icons/car_rental.svg\";\nimport { ReactComponent as VehiclesIcon } from \"@webiny/icons/expand.svg\";\nimport { Sidebar } from \"./Sidebar.js\";\nimport { SidebarProvider } from \"~/Sidebar/components/SidebarProvider.js\";\nimport { DropdownMenu } from \"~/DropdownMenu/index.js\";\nimport { Tag } from \"~/Tag/index.js\";\nimport { Tooltip } from \"~/Tooltip/index.js\";\n\nconst meta: Meta<typeof Sidebar> = {\n    title: \"Components/Sidebar\",\n    component: Sidebar,\n\n    parameters: {\n        layout: \"fullscreen\"\n    },\n\n    // We removed this because in the \"all stories\" view, the menu gets visually\n    // broken because of the fixed positioning of the sidebar. This is not a problem\n    // when the story is viewed in isolation.\n    // tags: [\"autodocs\"],\n\n    argTypes: {},\n    decorators: [\n        Story => (\n            <Tooltip.Provider>\n                <Story />\n            </Tooltip.Provider>\n        )\n    ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Sidebar>;\n\nexport const MainMenu: Story = {\n    render: () => (\n        <BrowserRouter>\n            <Routes>\n                <Route path={\"*\"} element={<SidebarComponent />} />\n            </Routes>\n        </BrowserRouter>\n    )\n};\n\nconst SidebarComponent = () => {\n    const { hash } = useLocation();\n\n    const [pinnedItems, setPinnedItems] = React.useState<string[]>([]);\n\n    return (\n        <SidebarProvider pinnedItems={pinnedItems} onChangePinnedItems={setPinnedItems}>\n            <Sidebar\n                title={\"Webiny\"}\n                icon={\n                    <Sidebar.Icon\n                        element={<img src=\"/images/wby-logo.png\" alt=\"Webiny\" />}\n                        label={\"Webiny\"}\n                    />\n                }\n                footer={\n                    <DropdownMenu\n                        trigger={\n                            <Sidebar.Item\n                                icon={<Sidebar.Item.Icon label=\"Settings\" element={<InfoIcon />} />}\n                                text={\"Support\"}\n                                action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                            />\n                        }\n                        className={\"w-[225px]\"}\n                    >\n                        <DropdownMenu.Item text={\"API Playground\"} icon={<ApiPlaygroundIcon />} />\n                        <DropdownMenu.Item text={\"Documentation\"} icon={<DocsIcon />} />\n                        <DropdownMenu.Item text={\"GitHub\"} icon={<GithubIcon />} />\n                        <DropdownMenu.Item text={\"Slack\"} icon={<ChatIcon />} />\n                        <DropdownMenu.Separator />\n                        <DropdownMenu.Item\n                            text={\n                                <div className={\"flex items-center\"}>\n                                    Webiny 6.0.0\n                                    <Tag\n                                        variant={\"accent\"}\n                                        content={\"WCP \"}\n                                        className={\"ml-sm-extra\"}\n                                    />\n                                </div>\n                            }\n                        />\n                    </DropdownMenu>\n                }\n            >\n                <Sidebar.Link\n                    pinnable\n                    text={\"Audit Logs\"}\n                    action={\n                        <Sidebar.Item.Action\n                            element={<MoreVertIcon />}\n                            onClick={() => console.log(\"More action clicked\")}\n                        />\n                    }\n                    to={\"#audit-logs\"}\n                    active={hash === \"#audit-logs\"}\n                    icon={<Sidebar.Item.Icon label=\"Audit Logs\" element={<AuditLogsIcon />} />}\n                />\n                <Sidebar.Link\n                    pinnable\n                    text={\"Form Builder\"}\n                    to={\"#form-builder\"}\n                    active={hash === \"#form-builder\"}\n                    icon={<Sidebar.Item.Icon label=\"Form Builder\" element={<FormBuilderIcon />} />}\n                />\n                <Sidebar.Item\n                    pinnable\n                    text={\"File Manager\"}\n                    onClick={() => {\n                        alert(\"File Manager clicked\");\n                    }}\n                    icon={<Sidebar.Item.Icon label=\"File Manager\" element={<FileManagerIcon />} />}\n                />\n                <Sidebar.Item\n                    text={\"Content\"}\n                    icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<CmsIcon />} />}\n                >\n                    <Sidebar.Item\n                        text={\"Vehicles\"}\n                        icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<VehiclesIcon />} />}\n                        action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                    >\n                        <Sidebar.Link\n                            pinnable\n                            pinnedIcon={\n                                <Sidebar.Item.Icon label=\"File Manager\" element={<CarIcon />} />\n                            }\n                            text={\"Cars\"}\n                            to={\"#cms-cars\"}\n                            active={hash === \"#cms-cars\"}\n                        />\n                        <Sidebar.Link\n                            pinnable\n                            text={\"Planes\"}\n                            to={\"#cms-planes\"}\n                            active={hash === \"#cms-planes\"}\n                        />\n                    </Sidebar.Item>{\" \"}\n                    <Sidebar.Item\n                        text={\"Ungrouped\"}\n                        icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<GridIcon />} />}\n                        action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                    >\n                        <Sidebar.Link\n                            text={\"Articles\"}\n                            to={\"#cms-articles\"}\n                            active={hash === \"#cms-articles\"}\n                        />\n                        <Sidebar.Link\n                            text={\"Settings\"}\n                            to={\"#cms-settings\"}\n                            active={hash === \"#cms-settings\"}\n                        />\n                    </Sidebar.Item>\n                </Sidebar.Item>\n                <Sidebar.Item\n                    text={\"Headless CMS\"}\n                    icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<CmsIcon />} />}\n                >\n                    <Sidebar.Group text={\"Content Models\"} />\n                    <Sidebar.Link\n                        pinnable\n                        text={\"Groups\"}\n                        to={\"#cms-groups\"}\n                        active={hash === \"#cms-groups\"}\n                    />\n                    <Sidebar.Link\n                        pinnable\n                        text={\"Models\"}\n                        to={\"#cms-models\"}\n                        active={hash === \"#cms-models\"}\n                    />\n                </Sidebar.Item>\n                <Sidebar.Item\n                    text={\"Page Builder\"}\n                    icon={<Sidebar.Item.Icon label=\"Page Builder\" element={<PageBuilderIcon />} />}\n                >\n                    <Sidebar.Group text={\"Blocks\"} />\n                    <Sidebar.Link\n                        text={\"Blocks\"}\n                        to={\"#pb-blocks\"}\n                        active={hash === \"#pb-blocks\"}\n                    />\n                    <Sidebar.Link\n                        text={\"Categories\"}\n                        to={\"#pb-blocks-categories\"}\n                        active={hash === \"#pb-blocks-categories\"}\n                    />\n\n                    <Sidebar.Group text={\"Pages\"} active={hash === `#pb-pages`} />\n                    <Sidebar.Link\n                        to={\"#pb-pages-categories\"}\n                        text={\"Categories\"}\n                        active={hash === `#pb-pages-categories`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-menus\"}\n                        text={\"Menus\"}\n                        active={hash === `#pb-pages-menus`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-pages\"}\n                        text={\"Pages\"}\n                        active={hash === `#pb-pages-pages`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-templates\"}\n                        text={\"Templates\"}\n                        disabled={true}\n                        active={hash === `#pb-pages-templates`}\n                    />\n                </Sidebar.Item>\n            </Sidebar>\n        </SidebarProvider>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/Sidebar/components/SidebarCache.d.ts

@@ -0,0 +1,9 @@
+type CachedSidebarState = {
+    pinned: boolean;
+    expandedSections: string[];
+};
+export declare class SidebarCache {
+    static get(): CachedSidebarState;
+    static set(state: CachedSidebarState): void;
+}
+export {};

package/Sidebar/components/SidebarCache.js

@@ -0,0 +1,23 @@
+import { SIDEBAR_LS_KEY } from "./constants.js";
+const DEFAULT_CACHED_STATE = {
+  pinned: false,
+  expandedSections: []
+};
+export class SidebarCache {
+  static get() {
+    const item = window.localStorage.getItem(SIDEBAR_LS_KEY);
+    if (!item) {
+      return DEFAULT_CACHED_STATE;
+    }
+    try {
+      return JSON.parse(item) || DEFAULT_CACHED_STATE;
+    } catch {
+      return DEFAULT_CACHED_STATE;
+    }
+  }
+  static set(state) {
+    window.localStorage.setItem(SIDEBAR_LS_KEY, JSON.stringify(state));
+  }
+}
+
+//# sourceMappingURL=SidebarCache.js.map

package/Sidebar/components/SidebarCache.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SIDEBAR_LS_KEY","DEFAULT_CACHED_STATE","pinned","expandedSections","SidebarCache","get","item","window","localStorage","getItem","JSON","parse","set","state","setItem","stringify"],"sources":["SidebarCache.ts"],"sourcesContent":["import { SIDEBAR_LS_KEY } from \"./constants.js\";\n\ntype CachedSidebarState = {\n    pinned: boolean;\n    expandedSections: string[];\n};\n\nconst DEFAULT_CACHED_STATE: CachedSidebarState = {\n    pinned: false,\n    expandedSections: []\n};\n\nexport class SidebarCache {\n    static get(): CachedSidebarState {\n        const item = window.localStorage.getItem(SIDEBAR_LS_KEY);\n        if (!item) {\n            return DEFAULT_CACHED_STATE;\n        }\n\n        try {\n            return JSON.parse(item) || DEFAULT_CACHED_STATE;\n        } catch {\n            return DEFAULT_CACHED_STATE;\n        }\n    }\n\n    static set(state: CachedSidebarState) {\n        window.localStorage.setItem(SIDEBAR_LS_KEY, JSON.stringify(state));\n    }\n}\n"],"mappings":"AAAA,SAASA,cAAc;AAOvB,MAAMC,oBAAwC,GAAG;EAC7CC,MAAM,EAAE,KAAK;EACbC,gBAAgB,EAAE;AACtB,CAAC;AAED,OAAO,MAAMC,YAAY,CAAC;EACtB,OAAOC,GAAGA,CAAA,EAAuB;IAC7B,MAAMC,IAAI,GAAGC,MAAM,CAACC,YAAY,CAACC,OAAO,CAACT,cAAc,CAAC;IACxD,IAAI,CAACM,IAAI,EAAE;MACP,OAAOL,oBAAoB;IAC/B;IAEA,IAAI;MACA,OAAOS,IAAI,CAACC,KAAK,CAACL,IAAI,CAAC,IAAIL,oBAAoB;IACnD,CAAC,CAAC,MAAM;MACJ,OAAOA,oBAAoB;IAC/B;EACJ;EAEA,OAAOW,GAAGA,CAACC,KAAyB,EAAE;IAClCN,MAAM,CAACC,YAAY,CAACM,OAAO,CAACd,cAAc,EAAEU,IAAI,CAACK,SAAS,CAACF,KAAK,CAAC,CAAC;EACtE;AACJ","ignoreList":[]}

package/Sidebar/components/SidebarProvider.d.ts

@@ -27,17 +27,12 @@ type SidebarContext = {
 };
 declare const SidebarContext: React.Context<SidebarContext | null>;
 declare function useSidebar(): SidebarContext;
-type SidebarCachedState = {
-    pinned: boolean;
-    expandedSections: string[];
-    pinnedItems: string[];
-};
 type SidebarProviderProps = React.HTMLAttributes<HTMLDivElement> & {
-    state?: SidebarCachedState;
-    onChangeState?: (state: SidebarCachedState) => void;
+    pinnedItems?: string[];
+    onChangePinnedItems?: (pinnedItems: string[]) => void;
 };
 declare const SidebarProvider: {
-    ({ className, children, state: cachedState, onChangeState, ...props }: SidebarProviderProps): React.JSX.Element;
+    ({ className, children, pinnedItems, onChangePinnedItems, ...props }: SidebarProviderProps): React.JSX.Element;
     displayName: string;
 };
 export { SidebarProvider, useSidebar, type PinnedItemData };

package/Sidebar/components/SidebarProvider.js

@@ -1,6 +1,7 @@
 import React from "react";
 import { cn } from "../../utils.js";
 import { SIDEBAR_TRANSITION_DURATION } from "./constants.js";
+import { SidebarCache } from "./SidebarCache.js";
 const SidebarContext = /*#__PURE__*/React.createContext(null);
 function useSidebar() {
   const context = React.useContext(SidebarContext);
@@ -9,55 +10,37 @@ function useSidebar() {
   }
   return context;
 }
-const createInitialSidebarState = state => {
-  const pinned = state?.pinned ?? false;
-  const expandedSections = state?.expandedSections ?? [];
-  const pinnedItems = state?.pinnedItems ?? [];
+const createInitialSidebarState = () => {
+  const {
+    pinned,
+    expandedSections
+  } = SidebarCache.get();
   return {
     expanded: pinned,
     // If pinned, we want the sidebar to be open by default.
     pinned,
     expandedSections,
-    pinnedItems,
     transition: null
   };
 };
 const SidebarProvider = ({
   className,
   children,
-  state: cachedState,
-  onChangeState,
+  pinnedItems = [],
+  onChangePinnedItems,
   ...props
 }) => {
-  const [sidebarState, setSidebarState] = React.useState(() => createInitialSidebarState(cachedState));
+  const [sidebarState, setSidebarState] = React.useState(createInitialSidebarState);
   const [pinnedItemsData, setPinnedItemsData] = React.useState(new Map());
 
   // With this timeout, we prevent the sidebar glitching (quickly opening/closing) during mouse enter/leave events.
   const timeoutRef = React.useRef(null);
-  const isInitialMount = React.useRef(true);
   const {
     expanded,
     transition,
     pinned,
-    expandedSections,
-    pinnedItems
+    expandedSections
   } = sidebarState;
-
-  // Sync state changes to parent via useEffect
-  React.useEffect(() => {
-    // Skip the initial mount to avoid unnecessary state sync
-    if (isInitialMount.current) {
-      isInitialMount.current = false;
-      return;
-    }
-    if (onChangeState) {
-      onChangeState({
-        pinned,
-        expandedSections,
-        pinnedItems
-      });
-    }
-  }, [pinned, expandedSections, pinnedItems, onChangeState]);
   const setExpanded = React.useCallback(value => {
     const newValue = typeof value === "function" ? value(expanded) : value;
     setSidebarState(state => ({
@@ -82,6 +65,10 @@ const SidebarProvider = ({
       ...state,
       pinned: newValue
     }));
+    SidebarCache.set({
+      pinned: newValue,
+      expandedSections
+    });
   }, [pinned]);
   const toggleExpanded = React.useCallback(() => {
     return setExpanded(prev => !prev);
@@ -93,6 +80,10 @@ const SidebarProvider = ({
   const toggleSectionExpanded = React.useCallback(sectionId => {
     setSidebarState(state => {
       const expandedSections = state.expandedSections.includes(sectionId) ? state.expandedSections.filter(id => id !== sectionId) : [...state.expandedSections, sectionId];
+      SidebarCache.set({
+        pinned: state.pinned,
+        expandedSections
+      });
       return {
         ...state,
         expandedSections
@@ -103,14 +94,12 @@ const SidebarProvider = ({
     return expandedSections.includes(sectionId);
   }, [expandedSections]);
   const toggleItemPinned = React.useCallback(itemId => {
-    setSidebarState(state => {
-      const newPinnedItems = state.pinnedItems.includes(itemId) ? state.pinnedItems.filter(id => id !== itemId) : [...state.pinnedItems, itemId];
-      return {
-        ...state,
-        pinnedItems: newPinnedItems
-      };
-    });
-  }, [setSidebarState]);
+    if (!onChangePinnedItems) {
+      return;
+    }
+    const newPinnedItems = pinnedItems.includes(itemId) ? pinnedItems.filter(id => id !== itemId) : [...pinnedItems, itemId];
+    onChangePinnedItems(newPinnedItems);
+  }, [pinnedItems, onChangePinnedItems]);
   const isItemPinned = React.useCallback(itemId => {
     return pinnedItems.includes(itemId);
   }, [pinnedItems]);

package/Sidebar/components/SidebarProvider.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cn","SIDEBAR_TRANSITION_DURATION","SidebarContext","createContext","useSidebar","context","useContext","Error","createInitialSidebarState","state","pinned","expandedSections","pinnedItems","expanded","transition","SidebarProvider","className","children","cachedState","onChangeState","props","sidebarState","setSidebarState","useState","pinnedItemsData","setPinnedItemsData","Map","timeoutRef","useRef","isInitialMount","useEffect","current","setExpanded","useCallback","value","newValue","window","clearTimeout","setTimeout","setPinned","toggleExpanded","prev","togglePinned","toggleSectionExpanded","sectionId","includes","filter","id","isSectionExpanded","toggleItemPinned","itemId","newPinnedItems","isItemPinned","registerPinnedItem","data","newMap","set","unregisterPinnedItem","delete","getPinnedItemsData","map","get","item","undefined","contextValue","useMemo","createElement","Provider","Object","assign","displayName"],"sources":["SidebarProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { SIDEBAR_TRANSITION_DURATION } from \"./constants.js\";\n\ntype PinnedItemData = {\n    id: string;\n    text: React.ReactNode;\n    icon?: React.ReactNode;\n    to?: string;\n    onClick?: React.MouseEventHandler;\n    active?: boolean;\n};\n\ntype SidebarContext = {\n    state: \"expanded\" | \"collapsed\";\n    expanded: boolean;\n    expandedSections: string[];\n    pinned: boolean;\n    transition: null | \"expanding\" | \"collapsing\";\n    setExpanded: (expanded: boolean) => void;\n    toggleExpanded: () => void;\n    togglePinned: () => void;\n    toggleSectionExpanded: (sectionId: string) => void;\n    isSectionExpanded: (sectionId: string) => boolean;\n    pinnedItems: string[];\n    toggleItemPinned: (itemId: string) => void;\n    isItemPinned: (itemId: string) => boolean;\n    registerPinnedItem: (data: PinnedItemData) => void;\n    unregisterPinnedItem: (itemId: string) => void;\n    getPinnedItemsData: () => PinnedItemData[];\n};\n\nconst SidebarContext = React.createContext<SidebarContext | null>(null);\n\nfunction useSidebar() {\n    const context = React.useContext(SidebarContext);\n    if (!context) {\n        throw new Error(\"useSidebar must be used within a SidebarProvider.\");\n    }\n\n    return context;\n}\n\ntype SidebarCachedState = {\n    pinned: boolean;\n    expandedSections: string[];\n    pinnedItems: string[];\n};\n\ntype SidebarProviderProps = React.HTMLAttributes<HTMLDivElement> & {\n    state?: SidebarCachedState;\n    onChangeState?: (state: SidebarCachedState) => void;\n};\n\ninterface SidebarState {\n    expanded: boolean;\n    transition: null | \"expanding\" | \"collapsing\";\n    pinned: boolean;\n    expandedSections: string[];\n    pinnedItems: string[];\n}\n\nconst createInitialSidebarState = (state?: SidebarCachedState): SidebarState => {\n    const pinned = state?.pinned ?? false;\n    const expandedSections = state?.expandedSections ?? [];\n    const pinnedItems = state?.pinnedItems ?? [];\n    return {\n        expanded: pinned, // If pinned, we want the sidebar to be open by default.\n        pinned,\n        expandedSections,\n        pinnedItems,\n        transition: null\n    };\n};\n\nconst SidebarProvider = ({\n    className,\n    children,\n    state: cachedState,\n    onChangeState,\n    ...props\n}: SidebarProviderProps) => {\n    const [sidebarState, setSidebarState] = React.useState<SidebarState>(() =>\n        createInitialSidebarState(cachedState)\n    );\n    const [pinnedItemsData, setPinnedItemsData] = React.useState<Map<string, PinnedItemData>>(\n        new Map()\n    );\n\n    // With this timeout, we prevent the sidebar glitching (quickly opening/closing) during mouse enter/leave events.\n    const timeoutRef = React.useRef<number | null>(null);\n    const isInitialMount = React.useRef(true);\n\n    const { expanded, transition, pinned, expandedSections, pinnedItems } = sidebarState;\n\n    // Sync state changes to parent via useEffect\n    React.useEffect(() => {\n        // Skip the initial mount to avoid unnecessary state sync\n        if (isInitialMount.current) {\n            isInitialMount.current = false;\n            return;\n        }\n\n        if (onChangeState) {\n            onChangeState({\n                pinned,\n                expandedSections,\n                pinnedItems\n            });\n        }\n    }, [pinned, expandedSections, pinnedItems, onChangeState]);\n\n    const setExpanded = React.useCallback(\n        (value: boolean | ((value: boolean) => boolean)) => {\n            const newValue = typeof value === \"function\" ? value(expanded) : value;\n            setSidebarState(state => ({\n                ...state,\n                expanded: newValue,\n                transition: newValue ? \"expanding\" : \"collapsing\"\n            }));\n\n            if (timeoutRef.current) {\n                window.clearTimeout(timeoutRef.current);\n                timeoutRef.current = null;\n            }\n\n            timeoutRef.current = window.setTimeout(() => {\n                setSidebarState(state => ({\n                    ...state,\n                    transition: null\n                }));\n            }, SIDEBAR_TRANSITION_DURATION);\n        },\n        [expanded]\n    );\n\n    const setPinned = React.useCallback(\n        (value: boolean | ((value: boolean) => boolean)) => {\n            const newValue = typeof value === \"function\" ? value(pinned) : value;\n            setSidebarState(state => ({\n                ...state,\n                pinned: newValue\n            }));\n        },\n        [pinned]\n    );\n\n    const toggleExpanded = React.useCallback(() => {\n        return setExpanded(prev => !prev);\n    }, [setExpanded]); // Helper to toggle the sidebar.\n\n    const togglePinned = React.useCallback(() => {\n        return setPinned(prev => !prev);\n    }, [setPinned]);\n\n    const toggleSectionExpanded = React.useCallback(\n        (sectionId: string) => {\n            setSidebarState(state => {\n                const expandedSections = state.expandedSections.includes(sectionId)\n                    ? state.expandedSections.filter(id => id !== sectionId)\n                    : [...state.expandedSections, sectionId];\n\n                return {\n                    ...state,\n                    expandedSections\n                };\n            });\n        },\n        [setSidebarState]\n    );\n\n    const isSectionExpanded = React.useCallback(\n        (sectionId: string) => {\n            return expandedSections.includes(sectionId);\n        },\n        [expandedSections]\n    );\n\n    const toggleItemPinned = React.useCallback(\n        (itemId: string) => {\n            setSidebarState(state => {\n                const newPinnedItems = state.pinnedItems.includes(itemId)\n                    ? state.pinnedItems.filter(id => id !== itemId)\n                    : [...state.pinnedItems, itemId];\n\n                return {\n                    ...state,\n                    pinnedItems: newPinnedItems\n                };\n            });\n        },\n        [setSidebarState]\n    );\n\n    const isItemPinned = React.useCallback(\n        (itemId: string) => {\n            return pinnedItems.includes(itemId);\n        },\n        [pinnedItems]\n    );\n\n    const registerPinnedItem = React.useCallback((data: PinnedItemData) => {\n        setPinnedItemsData(prev => {\n            const newMap = new Map(prev);\n            newMap.set(data.id, data);\n            return newMap;\n        });\n    }, []);\n\n    const unregisterPinnedItem = React.useCallback((itemId: string) => {\n        setPinnedItemsData(prev => {\n            const newMap = new Map(prev);\n            newMap.delete(itemId);\n            return newMap;\n        });\n    }, []);\n\n    const getPinnedItemsData = React.useCallback(() => {\n        // Sort by the order in pinnedItems array to maintain consistent ordering\n        return pinnedItems\n            .map(id => pinnedItemsData.get(id))\n            .filter((item): item is PinnedItemData => item !== undefined);\n    }, [pinnedItemsData, pinnedItems]);\n\n    // We add a state so that we can do data-state=\"expanded\" or \"collapsed\".\n    // This makes it easier to style the sidebar with Tailwind classes.\n    const state = expanded ? \"expanded\" : \"collapsed\";\n\n    const contextValue = React.useMemo<SidebarContext>(\n        () => ({\n            state,\n            transition,\n            expanded,\n            expandedSections,\n            pinned,\n            setExpanded,\n            toggleExpanded,\n            toggleSectionExpanded,\n            setPinned,\n            togglePinned,\n            isSectionExpanded,\n            pinnedItems,\n            toggleItemPinned,\n            isItemPinned,\n            registerPinnedItem,\n            unregisterPinnedItem,\n            getPinnedItemsData\n        }),\n        [\n            state,\n            transition,\n            expanded,\n            expandedSections,\n            pinned,\n            setExpanded,\n            setPinned,\n            toggleExpanded,\n            togglePinned,\n            pinnedItems,\n            toggleItemPinned,\n            isItemPinned,\n            registerPinnedItem,\n            unregisterPinnedItem,\n            getPinnedItemsData\n        ]\n    );\n\n    return (\n        <SidebarContext.Provider value={contextValue}>\n            <div\n                data-sidebar={\"provider\"}\n                {...props}\n                className={cn(\"group/sidebar-wrapper flex min-h-svh w-full\", className)}\n            >\n                {children}\n            </div>\n        </SidebarContext.Provider>\n    );\n};\nSidebarProvider.displayName = \"SidebarProvider\";\n\nexport { SidebarProvider, useSidebar, type PinnedItemData };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","cn","SIDEBAR_TRANSITION_DURATION","SidebarCache","SidebarContext","createContext","useSidebar","context","useContext","Error","createInitialSidebarState","pinned","expandedSections","get","expanded","transition","SidebarProvider","className","children","pinnedItems","onChangePinnedItems","props","sidebarState","setSidebarState","useState","pinnedItemsData","setPinnedItemsData","Map","timeoutRef","useRef","setExpanded","useCallback","value","newValue","state","current","window","clearTimeout","setTimeout","setPinned","set","toggleExpanded","prev","togglePinned","toggleSectionExpanded","sectionId","includes","filter","id","isSectionExpanded","toggleItemPinned","itemId","newPinnedItems","isItemPinned","registerPinnedItem","data","newMap","unregisterPinnedItem","delete","getPinnedItemsData","map","item","undefined","contextValue","useMemo","createElement","Provider","Object","assign","displayName"],"sources":["SidebarProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { SIDEBAR_TRANSITION_DURATION } from \"./constants.js\";\nimport { SidebarCache } from \"./SidebarCache.js\";\n\ntype PinnedItemData = {\n    id: string;\n    text: React.ReactNode;\n    icon?: React.ReactNode;\n    to?: string;\n    onClick?: React.MouseEventHandler;\n    active?: boolean;\n};\n\ntype SidebarContext = {\n    state: \"expanded\" | \"collapsed\";\n    expanded: boolean;\n    expandedSections: string[];\n    pinned: boolean;\n    transition: null | \"expanding\" | \"collapsing\";\n    setExpanded: (expanded: boolean) => void;\n    toggleExpanded: () => void;\n    togglePinned: () => void;\n    toggleSectionExpanded: (sectionId: string) => void;\n    isSectionExpanded: (sectionId: string) => boolean;\n    pinnedItems: string[];\n    toggleItemPinned: (itemId: string) => void;\n    isItemPinned: (itemId: string) => boolean;\n    registerPinnedItem: (data: PinnedItemData) => void;\n    unregisterPinnedItem: (itemId: string) => void;\n    getPinnedItemsData: () => PinnedItemData[];\n};\n\nconst SidebarContext = React.createContext<SidebarContext | null>(null);\n\nfunction useSidebar() {\n    const context = React.useContext(SidebarContext);\n    if (!context) {\n        throw new Error(\"useSidebar must be used within a SidebarProvider.\");\n    }\n\n    return context;\n}\n\ntype SidebarProviderProps = React.HTMLAttributes<HTMLDivElement> & {\n    pinnedItems?: string[];\n    onChangePinnedItems?: (pinnedItems: string[]) => void;\n};\n\ninterface SidebarState {\n    expanded: boolean;\n    transition: null | \"expanding\" | \"collapsing\";\n    pinned: boolean;\n    expandedSections: string[];\n}\n\nconst createInitialSidebarState = (): SidebarState => {\n    const { pinned, expandedSections } = SidebarCache.get();\n    return {\n        expanded: pinned, // If pinned, we want the sidebar to be open by default.\n        pinned,\n        expandedSections,\n        transition: null\n    };\n};\n\nconst SidebarProvider = ({\n    className,\n    children,\n    pinnedItems = [],\n    onChangePinnedItems,\n    ...props\n}: SidebarProviderProps) => {\n    const [sidebarState, setSidebarState] = React.useState<SidebarState>(createInitialSidebarState);\n    const [pinnedItemsData, setPinnedItemsData] = React.useState<Map<string, PinnedItemData>>(\n        new Map()\n    );\n\n    // With this timeout, we prevent the sidebar glitching (quickly opening/closing) during mouse enter/leave events.\n    const timeoutRef = React.useRef<number | null>(null);\n\n    const { expanded, transition, pinned, expandedSections } = sidebarState;\n\n    const setExpanded = React.useCallback(\n        (value: boolean | ((value: boolean) => boolean)) => {\n            const newValue = typeof value === \"function\" ? value(expanded) : value;\n            setSidebarState(state => ({\n                ...state,\n                expanded: newValue,\n                transition: newValue ? \"expanding\" : \"collapsing\"\n            }));\n\n            if (timeoutRef.current) {\n                window.clearTimeout(timeoutRef.current);\n                timeoutRef.current = null;\n            }\n\n            timeoutRef.current = window.setTimeout(() => {\n                setSidebarState(state => ({\n                    ...state,\n                    transition: null\n                }));\n            }, SIDEBAR_TRANSITION_DURATION);\n        },\n        [expanded]\n    );\n\n    const setPinned = React.useCallback(\n        (value: boolean | ((value: boolean) => boolean)) => {\n            const newValue = typeof value === \"function\" ? value(pinned) : value;\n            setSidebarState(state => ({\n                ...state,\n                pinned: newValue\n            }));\n\n            SidebarCache.set({ pinned: newValue, expandedSections });\n        },\n        [pinned]\n    );\n\n    const toggleExpanded = React.useCallback(() => {\n        return setExpanded(prev => !prev);\n    }, [setExpanded]); // Helper to toggle the sidebar.\n\n    const togglePinned = React.useCallback(() => {\n        return setPinned(prev => !prev);\n    }, [setPinned]);\n\n    const toggleSectionExpanded = React.useCallback(\n        (sectionId: string) => {\n            setSidebarState(state => {\n                const expandedSections = state.expandedSections.includes(sectionId)\n                    ? state.expandedSections.filter(id => id !== sectionId)\n                    : [...state.expandedSections, sectionId];\n\n                SidebarCache.set({ pinned: state.pinned, expandedSections });\n\n                return {\n                    ...state,\n                    expandedSections\n                };\n            });\n        },\n        [setSidebarState]\n    );\n\n    const isSectionExpanded = React.useCallback(\n        (sectionId: string) => {\n            return expandedSections.includes(sectionId);\n        },\n        [expandedSections]\n    );\n\n    const toggleItemPinned = React.useCallback(\n        (itemId: string) => {\n            if (!onChangePinnedItems) {\n                return;\n            }\n\n            const newPinnedItems = pinnedItems.includes(itemId)\n                ? pinnedItems.filter(id => id !== itemId)\n                : [...pinnedItems, itemId];\n\n            onChangePinnedItems(newPinnedItems);\n        },\n        [pinnedItems, onChangePinnedItems]\n    );\n\n    const isItemPinned = React.useCallback(\n        (itemId: string) => {\n            return pinnedItems.includes(itemId);\n        },\n        [pinnedItems]\n    );\n\n    const registerPinnedItem = React.useCallback((data: PinnedItemData) => {\n        setPinnedItemsData(prev => {\n            const newMap = new Map(prev);\n            newMap.set(data.id, data);\n            return newMap;\n        });\n    }, []);\n\n    const unregisterPinnedItem = React.useCallback((itemId: string) => {\n        setPinnedItemsData(prev => {\n            const newMap = new Map(prev);\n            newMap.delete(itemId);\n            return newMap;\n        });\n    }, []);\n\n    const getPinnedItemsData = React.useCallback(() => {\n        // Sort by the order in pinnedItems array to maintain consistent ordering\n        return pinnedItems\n            .map(id => pinnedItemsData.get(id))\n            .filter((item): item is PinnedItemData => item !== undefined);\n    }, [pinnedItemsData, pinnedItems]);\n\n    // We add a state so that we can do data-state=\"expanded\" or \"collapsed\".\n    // This makes it easier to style the sidebar with Tailwind classes.\n    const state = expanded ? \"expanded\" : \"collapsed\";\n\n    const contextValue = React.useMemo<SidebarContext>(\n        () => ({\n            state,\n            transition,\n            expanded,\n            expandedSections,\n            pinned,\n            setExpanded,\n            toggleExpanded,\n            toggleSectionExpanded,\n            setPinned,\n            togglePinned,\n            isSectionExpanded,\n            pinnedItems,\n            toggleItemPinned,\n            isItemPinned,\n            registerPinnedItem,\n            unregisterPinnedItem,\n            getPinnedItemsData\n        }),\n        [\n            state,\n            transition,\n            expanded,\n            expandedSections,\n            pinned,\n            setExpanded,\n            setPinned,\n            toggleExpanded,\n            togglePinned,\n            pinnedItems,\n            toggleItemPinned,\n            isItemPinned,\n            registerPinnedItem,\n            unregisterPinnedItem,\n            getPinnedItemsData\n        ]\n    );\n\n    return (\n        <SidebarContext.Provider value={contextValue}>\n            <div\n                data-sidebar={\"provider\"}\n                {...props}\n                className={cn(\"group/sidebar-wrapper flex min-h-svh w-full\", className)}\n            >\n                {children}\n            </div>\n        </SidebarContext.Provider>\n    );\n};\nSidebarProvider.displayName = \"SidebarProvider\";\n\nexport { SidebarProvider, useSidebar, type PinnedItemData };\n"],"mappings":"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","ignoreList":[]}

package/Sidebar/components/items/SidebarMenuRootItem.js

@@ -53,7 +53,7 @@ const SidebarMenuItemBase = ({
     return buttonProps.icon || parentIcon;
   }, [buttonProps.pinnedIcon, buttonProps.icon, parentIcon]);
 
-  // Register when pinned, unregister when unpinned
+  // Register on mount if already pinned, unregister on unmount
   // Re-register when active state changes to keep pinned items in sync
   useEffect(() => {
     if (pinnable && isPinned) {
@@ -65,10 +65,12 @@ const SidebarMenuItemBase = ({
         onClick: buttonProps.onClick,
         active: buttonProps.active
       });
-    } else if (pinnable && !isPinned) {
-      // Only unregister if this item is explicitly unpinned
-      sidebar.unregisterPinnedItem(menuItemId);
     }
+    return () => {
+      if (pinnable) {
+        sidebar.unregisterPinnedItem(menuItemId);
+      }
+    };
   }, [pinnable, isPinned, pinnedItemIcon, menuItemId, buttonProps.active]);
   const pinAction = useMemo(() => {
     if (!pinnable) {

package/Sidebar/components/items/SidebarMenuRootItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useMemo","useState","useEffect","cn","makeDecoratable","withStaticProps","SidebarMenuRootButton","SidebarMenuItemIcon","SidebarMenuItemAction","SidebarMenuSub","Collapsible","Icon","ReactComponent","KeyboardArrowRightIcon","PinIcon","UnPinIcon","useSidebarMenu","useSidebar","SidebarMenuItemBase","children","className","pinnable","action","buttonProps","currentLevel","parentIcon","sidebar","showChevron","setShowChevron","menuItemId","btoa","text","isSectionExpanded","expandedSections","toggleSectionExpanded","expanded","timer","setTimeout","clearTimeout","undefined","isPinned","isItemPinned","pinnedItemIcon","pinnedIcon","icon","registerPinnedItem","id","to","onClick","active","unregisterPinnedItem","pinAction","handlePinClick","e","stopPropagation","preventDefault","toggleItemPinned","pinButton","createElement","element","showOnHover","sidebarMenuButton","Object","assign","chevron","label","size","color","collapsibleAction","Root","open","onOpenChange","Trigger","asChild","Content","forceMount","DecoratableSidebarMenuItem","SidebarMenuRootItem","Action"],"sources":["SidebarMenuRootItem.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState, useEffect } from \"react\";\nimport { cn, makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { SidebarMenuRootButton } from \"./SidebarMenuRootButton.js\";\nimport { SidebarMenuItemIcon } from \"./SidebarMenuItemIcon.js\";\nimport { SidebarMenuItemAction } from \"./SidebarMenuItemAction.js\";\nimport { SidebarMenuSub } from \"./SidebarMenuSub.js\";\nimport { Collapsible } from \"radix-ui\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as KeyboardArrowRightIcon } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { ReactComponent as PinIcon } from \"@webiny/icons/push_pin.svg\";\nimport { ReactComponent as UnPinIcon } from \"@webiny/icons/push_pin_off.svg\";\nimport { type SidebarMenuItemProps } from \"./SidebarMenuItem.js\";\nimport { useSidebarMenu } from \"~/Sidebar/components/items/SidebarMenuProvider.js\";\nimport { useSidebar } from \"~/Sidebar/index.js\";\n\nconst SidebarMenuItemBase = ({\n    children,\n    className,\n    pinnable,\n    action,\n    ...buttonProps\n}: SidebarMenuItemProps) => {\n    const { currentLevel, parentIcon } = useSidebarMenu();\n    const sidebar = useSidebar();\n    const [showChevron, setShowChevron] = useState(false);\n\n    const menuItemId = useMemo(() => {\n        return btoa(`sidebar-item-${currentLevel}-${buttonProps.text}`);\n    }, [buttonProps.text, currentLevel]);\n\n    const isSectionExpanded = useMemo(() => {\n        return sidebar.isSectionExpanded(menuItemId);\n    }, [sidebar.expandedSections]);\n\n    const toggleSectionExpanded = useCallback(() => {\n        sidebar.toggleSectionExpanded(menuItemId);\n    }, [isSectionExpanded]);\n\n    useEffect(() => {\n        if (sidebar.expanded) {\n            const timer = setTimeout(() => {\n                setShowChevron(true);\n            }, 100);\n            return () => clearTimeout(timer);\n        }\n        setShowChevron(false);\n        return undefined;\n    }, [sidebar.expanded]);\n\n    const isPinned = sidebar.isItemPinned(menuItemId);\n\n    // Icon to use when this item is pinned\n    const pinnedItemIcon = useMemo(() => {\n        if (buttonProps.pinnedIcon) {\n            return buttonProps.pinnedIcon;\n        }\n\n        return buttonProps.icon || parentIcon;\n    }, [buttonProps.pinnedIcon, buttonProps.icon, parentIcon]);\n\n    // Register when pinned, unregister when unpinned\n    // Re-register when active state changes to keep pinned items in sync\n    useEffect(() => {\n        if (pinnable && isPinned) {\n            sidebar.registerPinnedItem({\n                id: menuItemId,\n                text: buttonProps.text,\n                icon: pinnedItemIcon,\n                to: buttonProps.to,\n                onClick: buttonProps.onClick,\n                active: buttonProps.active\n            });\n        } else if (pinnable && !isPinned) {\n            // Only unregister if this item is explicitly unpinned\n            sidebar.unregisterPinnedItem(menuItemId);\n        }\n    }, [pinnable, isPinned, pinnedItemIcon, menuItemId, buttonProps.active]);\n\n    const pinAction = useMemo(() => {\n        if (!pinnable) {\n            return action;\n        }\n\n        const handlePinClick = (e: React.MouseEvent) => {\n            e.stopPropagation();\n            e.preventDefault();\n\n            if (isPinned) {\n                sidebar.unregisterPinnedItem(menuItemId);\n            } else {\n                sidebar.registerPinnedItem({\n                    id: menuItemId,\n                    text: buttonProps.text,\n                    icon: pinnedItemIcon,\n                    to: buttonProps.to,\n                    onClick: buttonProps.onClick,\n                    active: buttonProps.active\n                });\n            }\n\n            sidebar.toggleItemPinned(menuItemId);\n        };\n\n        const pinButton = (\n            <SidebarMenuItemAction\n                element={isPinned ? <UnPinIcon /> : <PinIcon />}\n                onClick={handlePinClick}\n                showOnHover={true}\n            />\n        );\n\n        // If there's a custom action, combine them\n        // Don't modify the custom action - it should keep its original behavior\n        if (action) {\n            return (\n                <div className=\"flex items-center gap-xs\">\n                    {pinButton}\n                    {action}\n                </div>\n            );\n        }\n\n        return pinButton;\n    }, [pinnable, isPinned, pinnedItemIcon, action, sidebar, menuItemId]);\n\n    const sidebarMenuButton = useMemo(() => {\n        if (!children) {\n            return <SidebarMenuRootButton {...buttonProps} action={pinAction} />;\n        }\n\n        const chevron = showChevron ? (\n            <Icon\n                label={\"Expand / Collapse\"}\n                size={\"sm\"}\n                className={\n                    \"ml-auto transition-transform duration-100 group-data-[state=open]/menu-item-collapsible:rotate-180 group-data-[state=collapsed]:hidden\"\n                }\n                color={\"neutral-strong\"}\n                data-sidebar={\"menu-item-expanded-indicator\"}\n                icon={<KeyboardArrowRightIcon />}\n            />\n        ) : null;\n\n        const collapsibleAction = pinnable ? (\n            <div className=\"flex items-center gap-xs\">\n                {pinAction}\n                {chevron}\n            </div>\n        ) : (\n            chevron\n        );\n\n        return (\n            <Collapsible.Root\n                className={cn(\"w-full group/menu-item-collapsible\")}\n                open={isSectionExpanded}\n                onOpenChange={toggleSectionExpanded}\n            >\n                <Collapsible.Trigger asChild>\n                    <SidebarMenuRootButton {...buttonProps} action={collapsibleAction} />\n                </Collapsible.Trigger>\n                <Collapsible.Content forceMount className={\"hidden data-[state=open]:block!\"}>\n                    <SidebarMenuSub parentIcon={buttonProps.icon}>{children}</SidebarMenuSub>\n                </Collapsible.Content>\n            </Collapsible.Root>\n        );\n    }, [\n        children,\n        buttonProps,\n        menuItemId,\n        isSectionExpanded,\n        toggleSectionExpanded,\n        showChevron,\n        pinnable,\n        pinAction\n    ]);\n\n    return (\n        <li\n            data-sidebar=\"menu-item\"\n            className={cn(\n                \"group/menu-item relative px-xs-plus\",\n\n                // When the sidebar is collapsed, this ensures that the sidebar menu item is highlighted\n                // if it contains an active child (no matter how deep in the hierarchy).\n                \"group-data-[state=collapsed]:[&:has([data-active=true])_[data-sidebar=menu-button]_svg]:fill-neutral-xstrong!\",\n                \"group-data-[state=collapsed]:[&:has([data-active=true])_[data-sidebar=menu-button]]:bg-neutral-dark/5!\",\n                className\n            )}\n        >\n            {sidebarMenuButton}\n        </li>\n    );\n};\n\nconst DecoratableSidebarMenuItem = makeDecoratable(\"SidebarMenuItem\", SidebarMenuItemBase);\n\nconst SidebarMenuRootItem = withStaticProps(DecoratableSidebarMenuItem, {\n    Icon: SidebarMenuItemIcon,\n    Action: SidebarMenuItemAction\n});\n\nexport { SidebarMenuRootItem, type SidebarMenuItemProps };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useMemo","useState","useEffect","cn","makeDecoratable","withStaticProps","SidebarMenuRootButton","SidebarMenuItemIcon","SidebarMenuItemAction","SidebarMenuSub","Collapsible","Icon","ReactComponent","KeyboardArrowRightIcon","PinIcon","UnPinIcon","useSidebarMenu","useSidebar","SidebarMenuItemBase","children","className","pinnable","action","buttonProps","currentLevel","parentIcon","sidebar","showChevron","setShowChevron","menuItemId","btoa","text","isSectionExpanded","expandedSections","toggleSectionExpanded","expanded","timer","setTimeout","clearTimeout","undefined","isPinned","isItemPinned","pinnedItemIcon","pinnedIcon","icon","registerPinnedItem","id","to","onClick","active","unregisterPinnedItem","pinAction","handlePinClick","e","stopPropagation","preventDefault","toggleItemPinned","pinButton","createElement","element","showOnHover","sidebarMenuButton","Object","assign","chevron","label","size","color","collapsibleAction","Root","open","onOpenChange","Trigger","asChild","Content","forceMount","DecoratableSidebarMenuItem","SidebarMenuRootItem","Action"],"sources":["SidebarMenuRootItem.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState, useEffect } from \"react\";\nimport { cn, makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { SidebarMenuRootButton } from \"./SidebarMenuRootButton.js\";\nimport { SidebarMenuItemIcon } from \"./SidebarMenuItemIcon.js\";\nimport { SidebarMenuItemAction } from \"./SidebarMenuItemAction.js\";\nimport { SidebarMenuSub } from \"./SidebarMenuSub.js\";\nimport { Collapsible } from \"radix-ui\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as KeyboardArrowRightIcon } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { ReactComponent as PinIcon } from \"@webiny/icons/push_pin.svg\";\nimport { ReactComponent as UnPinIcon } from \"@webiny/icons/push_pin_off.svg\";\nimport { type SidebarMenuItemProps } from \"./SidebarMenuItem.js\";\nimport { useSidebarMenu } from \"~/Sidebar/components/items/SidebarMenuProvider.js\";\nimport { useSidebar } from \"~/Sidebar/index.js\";\n\nconst SidebarMenuItemBase = ({\n    children,\n    className,\n    pinnable,\n    action,\n    ...buttonProps\n}: SidebarMenuItemProps) => {\n    const { currentLevel, parentIcon } = useSidebarMenu();\n    const sidebar = useSidebar();\n    const [showChevron, setShowChevron] = useState(false);\n\n    const menuItemId = useMemo(() => {\n        return btoa(`sidebar-item-${currentLevel}-${buttonProps.text}`);\n    }, [buttonProps.text, currentLevel]);\n\n    const isSectionExpanded = useMemo(() => {\n        return sidebar.isSectionExpanded(menuItemId);\n    }, [sidebar.expandedSections]);\n\n    const toggleSectionExpanded = useCallback(() => {\n        sidebar.toggleSectionExpanded(menuItemId);\n    }, [isSectionExpanded]);\n\n    useEffect(() => {\n        if (sidebar.expanded) {\n            const timer = setTimeout(() => {\n                setShowChevron(true);\n            }, 100);\n            return () => clearTimeout(timer);\n        }\n        setShowChevron(false);\n        return undefined;\n    }, [sidebar.expanded]);\n\n    const isPinned = sidebar.isItemPinned(menuItemId);\n\n    // Icon to use when this item is pinned\n    const pinnedItemIcon = useMemo(() => {\n        if (buttonProps.pinnedIcon) {\n            return buttonProps.pinnedIcon;\n        }\n\n        return buttonProps.icon || parentIcon;\n    }, [buttonProps.pinnedIcon, buttonProps.icon, parentIcon]);\n\n    // Register on mount if already pinned, unregister on unmount\n    // Re-register when active state changes to keep pinned items in sync\n    useEffect(() => {\n        if (pinnable && isPinned) {\n            sidebar.registerPinnedItem({\n                id: menuItemId,\n                text: buttonProps.text,\n                icon: pinnedItemIcon,\n                to: buttonProps.to,\n                onClick: buttonProps.onClick,\n                active: buttonProps.active\n            });\n        }\n\n        return () => {\n            if (pinnable) {\n                sidebar.unregisterPinnedItem(menuItemId);\n            }\n        };\n    }, [pinnable, isPinned, pinnedItemIcon, menuItemId, buttonProps.active]);\n\n    const pinAction = useMemo(() => {\n        if (!pinnable) {\n            return action;\n        }\n\n        const handlePinClick = (e: React.MouseEvent) => {\n            e.stopPropagation();\n            e.preventDefault();\n\n            if (isPinned) {\n                sidebar.unregisterPinnedItem(menuItemId);\n            } else {\n                sidebar.registerPinnedItem({\n                    id: menuItemId,\n                    text: buttonProps.text,\n                    icon: pinnedItemIcon,\n                    to: buttonProps.to,\n                    onClick: buttonProps.onClick,\n                    active: buttonProps.active\n                });\n            }\n\n            sidebar.toggleItemPinned(menuItemId);\n        };\n\n        const pinButton = (\n            <SidebarMenuItemAction\n                element={isPinned ? <UnPinIcon /> : <PinIcon />}\n                onClick={handlePinClick}\n                showOnHover={true}\n            />\n        );\n\n        // If there's a custom action, combine them\n        // Don't modify the custom action - it should keep its original behavior\n        if (action) {\n            return (\n                <div className=\"flex items-center gap-xs\">\n                    {pinButton}\n                    {action}\n                </div>\n            );\n        }\n\n        return pinButton;\n    }, [pinnable, isPinned, pinnedItemIcon, action, sidebar, menuItemId]);\n\n    const sidebarMenuButton = useMemo(() => {\n        if (!children) {\n            return <SidebarMenuRootButton {...buttonProps} action={pinAction} />;\n        }\n\n        const chevron = showChevron ? (\n            <Icon\n                label={\"Expand / Collapse\"}\n                size={\"sm\"}\n                className={\n                    \"ml-auto transition-transform duration-100 group-data-[state=open]/menu-item-collapsible:rotate-180 group-data-[state=collapsed]:hidden\"\n                }\n                color={\"neutral-strong\"}\n                data-sidebar={\"menu-item-expanded-indicator\"}\n                icon={<KeyboardArrowRightIcon />}\n            />\n        ) : null;\n\n        const collapsibleAction = pinnable ? (\n            <div className=\"flex items-center gap-xs\">\n                {pinAction}\n                {chevron}\n            </div>\n        ) : (\n            chevron\n        );\n\n        return (\n            <Collapsible.Root\n                className={cn(\"w-full group/menu-item-collapsible\")}\n                open={isSectionExpanded}\n                onOpenChange={toggleSectionExpanded}\n            >\n                <Collapsible.Trigger asChild>\n                    <SidebarMenuRootButton {...buttonProps} action={collapsibleAction} />\n                </Collapsible.Trigger>\n                <Collapsible.Content forceMount className={\"hidden data-[state=open]:block!\"}>\n                    <SidebarMenuSub parentIcon={buttonProps.icon}>{children}</SidebarMenuSub>\n                </Collapsible.Content>\n            </Collapsible.Root>\n        );\n    }, [\n        children,\n        buttonProps,\n        menuItemId,\n        isSectionExpanded,\n        toggleSectionExpanded,\n        showChevron,\n        pinnable,\n        pinAction\n    ]);\n\n    return (\n        <li\n            data-sidebar=\"menu-item\"\n            className={cn(\n                \"group/menu-item relative px-xs-plus\",\n\n                // When the sidebar is collapsed, this ensures that the sidebar menu item is highlighted\n                // if it contains an active child (no matter how deep in the hierarchy).\n                \"group-data-[state=collapsed]:[&:has([data-active=true])_[data-sidebar=menu-button]_svg]:fill-neutral-xstrong!\",\n                \"group-data-[state=collapsed]:[&:has([data-active=true])_[data-sidebar=menu-button]]:bg-neutral-dark/5!\",\n                className\n            )}\n        >\n            {sidebarMenuButton}\n        </li>\n    );\n};\n\nconst DecoratableSidebarMenuItem = makeDecoratable(\"SidebarMenuItem\", SidebarMenuItemBase);\n\nconst SidebarMenuRootItem = withStaticProps(DecoratableSidebarMenuItem, {\n    Icon: SidebarMenuItemIcon,\n    Action: SidebarMenuItemAction\n});\n\nexport { SidebarMenuRootItem, type SidebarMenuItemProps };\n"],"mappings":"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","ignoreList":[]}

package/Sidebar/components/items/SidebarMenuSubItem.js

@@ -43,7 +43,7 @@ const SidebarMenuSubItem = ({
     return buttonProps.icon || parentIcon;
   }, [buttonProps.pinnedIcon, buttonProps.icon, parentIcon]);
 
-  // Register when pinned, unregister when unpinned
+  // Register on mount if already pinned, unregister on unmount
   // Re-register when active state changes to keep pinned items in sync
   React.useEffect(() => {
     if (pinnable && isPinned) {
@@ -55,10 +55,12 @@ const SidebarMenuSubItem = ({
         onClick: buttonProps.onClick,
         active: buttonProps.active
       });
-    } else if (pinnable && !isPinned) {
-      // Only unregister if this item is explicitly unpinned
-      sidebar.unregisterPinnedItem(menuItemId);
     }
+    return () => {
+      if (pinnable) {
+        sidebar.unregisterPinnedItem(menuItemId);
+      }
+    };
   }, [pinnable, isPinned, pinnedItemIcon, menuItemId, buttonProps.active]);
   const pinAction = useMemo(() => {
     if (!pinnable) {

package/Sidebar/components/items/SidebarMenuSubItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useMemo","useState","cn","Collapsible","SidebarMenuSubButton","SidebarMenuSubItemIndentation","SidebarMenuSub","Icon","ReactComponent","KeyboardArrowRightIcon","PinIcon","UnPinIcon","useSidebarMenu","useSidebar","SidebarMenuItemAction","SidebarMenuSubItem","children","className","pinnable","action","buttonProps","currentLevel","parentIcon","sidebar","showChevron","setShowChevron","menuItemId","btoa","text","isSectionExpanded","expandedSections","toggleSectionExpanded","isPinned","isItemPinned","pinnedItemIcon","pinnedIcon","icon","registerPinnedItem","id","to","onClick","active","unregisterPinnedItem","pinAction","handlePinClick","e","stopPropagation","preventDefault","toggleItemPinned","pinButton","createElement","element","showOnHover","expanded","timer","setTimeout","clearTimeout","undefined","sidebarMenuSubButton","Fragment","lvl","variant","Object","assign","chevron","label","size","color","collapsibleAction","Root","open","onOpenChange","Trigger","asChild","Content"],"sources":["SidebarMenuSubItem.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { Collapsible } from \"radix-ui\";\nimport { SidebarMenuSubButton } from \"./SidebarMenuSubButton.js\";\nimport { SidebarMenuSubItemIndentation } from \"./SidebarMenuSubItemIndentation.js\";\nimport { SidebarMenuSub } from \"./SidebarMenuSub.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as KeyboardArrowRightIcon } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { ReactComponent as PinIcon } from \"@webiny/icons/push_pin.svg\";\nimport { ReactComponent as UnPinIcon } from \"@webiny/icons/push_pin_off.svg\";\nimport { useSidebarMenu } from \"./SidebarMenuProvider.js\";\nimport { type SidebarMenuItemProps } from \"./SidebarMenuItem.js\";\nimport { useSidebar } from \"~/Sidebar/index.js\";\nimport { SidebarMenuItemAction } from \"./SidebarMenuItemAction.js\";\n\nconst SidebarMenuSubItem = ({\n    children,\n    className,\n    pinnable,\n    action,\n    ...buttonProps\n}: SidebarMenuItemProps) => {\n    const { currentLevel, parentIcon } = useSidebarMenu();\n    const sidebar = useSidebar();\n    const [showChevron, setShowChevron] = useState(false);\n\n    const menuItemId = useMemo(() => {\n        return btoa(`sidebar-item-${currentLevel}-${buttonProps.text}`);\n    }, [buttonProps.text, currentLevel]);\n\n    const isSectionExpanded = useMemo(() => {\n        return sidebar.isSectionExpanded(menuItemId);\n    }, [sidebar.expandedSections]);\n\n    const toggleSectionExpanded = useCallback(() => {\n        sidebar.toggleSectionExpanded(menuItemId);\n    }, [isSectionExpanded]);\n\n    const isPinned = sidebar.isItemPinned(menuItemId);\n\n    // Icon to use when this item is pinned\n    const pinnedItemIcon = useMemo(() => {\n        if (buttonProps.pinnedIcon) {\n            return buttonProps.pinnedIcon;\n        }\n\n        return buttonProps.icon || parentIcon;\n    }, [buttonProps.pinnedIcon, buttonProps.icon, parentIcon]);\n\n    // Register when pinned, unregister when unpinned\n    // Re-register when active state changes to keep pinned items in sync\n    React.useEffect(() => {\n        if (pinnable && isPinned) {\n            sidebar.registerPinnedItem({\n                id: menuItemId,\n                text: buttonProps.text,\n                icon: pinnedItemIcon,\n                to: buttonProps.to,\n                onClick: buttonProps.onClick,\n                active: buttonProps.active\n            });\n        } else if (pinnable && !isPinned) {\n            // Only unregister if this item is explicitly unpinned\n            sidebar.unregisterPinnedItem(menuItemId);\n        }\n    }, [pinnable, isPinned, pinnedItemIcon, menuItemId, buttonProps.active]);\n\n    const pinAction = useMemo(() => {\n        if (!pinnable) {\n            return action;\n        }\n\n        const handlePinClick = (e: React.MouseEvent) => {\n            e.stopPropagation();\n            e.preventDefault();\n\n            if (isPinned) {\n                sidebar.unregisterPinnedItem(menuItemId);\n            } else {\n                sidebar.registerPinnedItem({\n                    id: menuItemId,\n                    text: buttonProps.text,\n                    icon: pinnedItemIcon,\n                    to: buttonProps.to,\n                    onClick: buttonProps.onClick,\n                    active: buttonProps.active\n                });\n            }\n\n            sidebar.toggleItemPinned(menuItemId);\n        };\n\n        const pinButton = (\n            <SidebarMenuItemAction\n                element={isPinned ? <UnPinIcon /> : <PinIcon />}\n                onClick={handlePinClick}\n                showOnHover={true}\n            />\n        );\n\n        // If there's a custom action, combine them\n        // Don't modify the custom action - it should keep its original behavior\n        if (action) {\n            return (\n                <div className=\"flex items-center gap-xs\">\n                    {pinButton}\n                    {action}\n                </div>\n            );\n        }\n\n        return pinButton;\n    }, [pinnable, isPinned, pinnedItemIcon, action, sidebar, menuItemId]);\n\n    useEffect(() => {\n        if (sidebar.expanded) {\n            const timer = setTimeout(() => {\n                setShowChevron(true);\n            }, 100);\n            return () => clearTimeout(timer);\n        }\n        setShowChevron(false);\n        return undefined;\n    }, [sidebar.expanded]);\n\n    const sidebarMenuSubButton = useMemo(() => {\n        if (!children) {\n            return (\n                <>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <SidebarMenuSubButton {...buttonProps} action={pinAction} />\n                </>\n            );\n        }\n\n        const chevron = showChevron ? (\n            <Icon\n                label={\"Expand / Collapse\"}\n                size={\"sm\"}\n                className={\n                    \"ml-auto transition-transform duration-100 group-data-[state=open]/menu-sub-item-collapsible:rotate-180 group-data-[state=collapsed]:hidden\"\n                }\n                color={\"neutral-strong\"}\n                data-sidebar={\"menu-item-expanded-indicator\"}\n                icon={<KeyboardArrowRightIcon />}\n            />\n        ) : null;\n\n        const collapsibleAction = pinnable ? (\n            <div className=\"flex items-center gap-xs\">\n                {pinAction}\n                {chevron}\n            </div>\n        ) : (\n            chevron\n        );\n\n        return (\n            <Collapsible.Root\n                className=\"w-full group/menu-sub-item-collapsible\"\n                open={isSectionExpanded}\n                onOpenChange={toggleSectionExpanded}\n            >\n                <div className={\"flex items-center\"}>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <Collapsible.Trigger asChild>\n                        <SidebarMenuSubButton\n                            {...buttonProps}\n                            action={collapsibleAction}\n                            className={\n                                \"group-data-[state=open]/menu-sub-item-collapsible:font-semibold!\"\n                            }\n                        />\n                    </Collapsible.Trigger>\n                </div>\n                <Collapsible.Content>\n                    <SidebarMenuSub parentIcon={buttonProps.icon}>{children}</SidebarMenuSub>\n                </Collapsible.Content>\n            </Collapsible.Root>\n        );\n    }, [\n        children,\n        buttonProps,\n        currentLevel,\n        menuItemId,\n        isSectionExpanded,\n        toggleSectionExpanded,\n        showChevron,\n        pinnable,\n        pinAction\n    ]);\n\n    return (\n        <li\n            data-sidebar=\"menu-sub-item\"\n            className={cn(\"group/menu-sub-item relative flex\", className)}\n        >\n            {sidebarMenuSubButton}\n        </li>\n    );\n};\n\nexport { SidebarMenuSubItem };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useEffect","useMemo","useState","cn","Collapsible","SidebarMenuSubButton","SidebarMenuSubItemIndentation","SidebarMenuSub","Icon","ReactComponent","KeyboardArrowRightIcon","PinIcon","UnPinIcon","useSidebarMenu","useSidebar","SidebarMenuItemAction","SidebarMenuSubItem","children","className","pinnable","action","buttonProps","currentLevel","parentIcon","sidebar","showChevron","setShowChevron","menuItemId","btoa","text","isSectionExpanded","expandedSections","toggleSectionExpanded","isPinned","isItemPinned","pinnedItemIcon","pinnedIcon","icon","registerPinnedItem","id","to","onClick","active","unregisterPinnedItem","pinAction","handlePinClick","e","stopPropagation","preventDefault","toggleItemPinned","pinButton","createElement","element","showOnHover","expanded","timer","setTimeout","clearTimeout","undefined","sidebarMenuSubButton","Fragment","lvl","variant","Object","assign","chevron","label","size","color","collapsibleAction","Root","open","onOpenChange","Trigger","asChild","Content"],"sources":["SidebarMenuSubItem.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { Collapsible } from \"radix-ui\";\nimport { SidebarMenuSubButton } from \"./SidebarMenuSubButton.js\";\nimport { SidebarMenuSubItemIndentation } from \"./SidebarMenuSubItemIndentation.js\";\nimport { SidebarMenuSub } from \"./SidebarMenuSub.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as KeyboardArrowRightIcon } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { ReactComponent as PinIcon } from \"@webiny/icons/push_pin.svg\";\nimport { ReactComponent as UnPinIcon } from \"@webiny/icons/push_pin_off.svg\";\nimport { useSidebarMenu } from \"./SidebarMenuProvider.js\";\nimport { type SidebarMenuItemProps } from \"./SidebarMenuItem.js\";\nimport { useSidebar } from \"~/Sidebar/index.js\";\nimport { SidebarMenuItemAction } from \"./SidebarMenuItemAction.js\";\n\nconst SidebarMenuSubItem = ({\n    children,\n    className,\n    pinnable,\n    action,\n    ...buttonProps\n}: SidebarMenuItemProps) => {\n    const { currentLevel, parentIcon } = useSidebarMenu();\n    const sidebar = useSidebar();\n    const [showChevron, setShowChevron] = useState(false);\n\n    const menuItemId = useMemo(() => {\n        return btoa(`sidebar-item-${currentLevel}-${buttonProps.text}`);\n    }, [buttonProps.text, currentLevel]);\n\n    const isSectionExpanded = useMemo(() => {\n        return sidebar.isSectionExpanded(menuItemId);\n    }, [sidebar.expandedSections]);\n\n    const toggleSectionExpanded = useCallback(() => {\n        sidebar.toggleSectionExpanded(menuItemId);\n    }, [isSectionExpanded]);\n\n    const isPinned = sidebar.isItemPinned(menuItemId);\n\n    // Icon to use when this item is pinned\n    const pinnedItemIcon = useMemo(() => {\n        if (buttonProps.pinnedIcon) {\n            return buttonProps.pinnedIcon;\n        }\n\n        return buttonProps.icon || parentIcon;\n    }, [buttonProps.pinnedIcon, buttonProps.icon, parentIcon]);\n\n    // Register on mount if already pinned, unregister on unmount\n    // Re-register when active state changes to keep pinned items in sync\n    React.useEffect(() => {\n        if (pinnable && isPinned) {\n            sidebar.registerPinnedItem({\n                id: menuItemId,\n                text: buttonProps.text,\n                icon: pinnedItemIcon,\n                to: buttonProps.to,\n                onClick: buttonProps.onClick,\n                active: buttonProps.active\n            });\n        }\n\n        return () => {\n            if (pinnable) {\n                sidebar.unregisterPinnedItem(menuItemId);\n            }\n        };\n    }, [pinnable, isPinned, pinnedItemIcon, menuItemId, buttonProps.active]);\n\n    const pinAction = useMemo(() => {\n        if (!pinnable) {\n            return action;\n        }\n\n        const handlePinClick = (e: React.MouseEvent) => {\n            e.stopPropagation();\n            e.preventDefault();\n\n            if (isPinned) {\n                sidebar.unregisterPinnedItem(menuItemId);\n            } else {\n                sidebar.registerPinnedItem({\n                    id: menuItemId,\n                    text: buttonProps.text,\n                    icon: pinnedItemIcon,\n                    to: buttonProps.to,\n                    onClick: buttonProps.onClick,\n                    active: buttonProps.active\n                });\n            }\n\n            sidebar.toggleItemPinned(menuItemId);\n        };\n\n        const pinButton = (\n            <SidebarMenuItemAction\n                element={isPinned ? <UnPinIcon /> : <PinIcon />}\n                onClick={handlePinClick}\n                showOnHover={true}\n            />\n        );\n\n        // If there's a custom action, combine them\n        // Don't modify the custom action - it should keep its original behavior\n        if (action) {\n            return (\n                <div className=\"flex items-center gap-xs\">\n                    {pinButton}\n                    {action}\n                </div>\n            );\n        }\n\n        return pinButton;\n    }, [pinnable, isPinned, pinnedItemIcon, action, sidebar, menuItemId]);\n\n    useEffect(() => {\n        if (sidebar.expanded) {\n            const timer = setTimeout(() => {\n                setShowChevron(true);\n            }, 100);\n            return () => clearTimeout(timer);\n        }\n        setShowChevron(false);\n        return undefined;\n    }, [sidebar.expanded]);\n\n    const sidebarMenuSubButton = useMemo(() => {\n        if (!children) {\n            return (\n                <>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <SidebarMenuSubButton {...buttonProps} action={pinAction} />\n                </>\n            );\n        }\n\n        const chevron = showChevron ? (\n            <Icon\n                label={\"Expand / Collapse\"}\n                size={\"sm\"}\n                className={\n                    \"ml-auto transition-transform duration-100 group-data-[state=open]/menu-sub-item-collapsible:rotate-180 group-data-[state=collapsed]:hidden\"\n                }\n                color={\"neutral-strong\"}\n                data-sidebar={\"menu-item-expanded-indicator\"}\n                icon={<KeyboardArrowRightIcon />}\n            />\n        ) : null;\n\n        const collapsibleAction = pinnable ? (\n            <div className=\"flex items-center gap-xs\">\n                {pinAction}\n                {chevron}\n            </div>\n        ) : (\n            chevron\n        );\n\n        return (\n            <Collapsible.Root\n                className=\"w-full group/menu-sub-item-collapsible\"\n                open={isSectionExpanded}\n                onOpenChange={toggleSectionExpanded}\n            >\n                <div className={\"flex items-center\"}>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <Collapsible.Trigger asChild>\n                        <SidebarMenuSubButton\n                            {...buttonProps}\n                            action={collapsibleAction}\n                            className={\n                                \"group-data-[state=open]/menu-sub-item-collapsible:font-semibold!\"\n                            }\n                        />\n                    </Collapsible.Trigger>\n                </div>\n                <Collapsible.Content>\n                    <SidebarMenuSub parentIcon={buttonProps.icon}>{children}</SidebarMenuSub>\n                </Collapsible.Content>\n            </Collapsible.Root>\n        );\n    }, [\n        children,\n        buttonProps,\n        currentLevel,\n        menuItemId,\n        isSectionExpanded,\n        toggleSectionExpanded,\n        showChevron,\n        pinnable,\n        pinAction\n    ]);\n\n    return (\n        <li\n            data-sidebar=\"menu-sub-item\"\n            className={cn(\"group/menu-sub-item relative flex\", className)}\n        >\n            {sidebarMenuSubButton}\n        </li>\n    );\n};\n\nexport { SidebarMenuSubItem };\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/admin-ui",
-	"version": "0.0.0-unstable.61c048f412",
+	"version": "0.0.0-unstable.6f45466a1d",
 	"type": "module",
 	"main": "index.js",
 	"repository": {
@@ -16,9 +16,9 @@
 		"@monaco-editor/react": "4.7.0",
 		"@radix-ui/react-scroll-area": "1.2.10",
 		"@tanstack/react-table": "8.21.3",
-		"@webiny/icons": "0.0.0-unstable.61c048f412",
-		"@webiny/react-composition": "0.0.0-unstable.61c048f412",
-		"@webiny/utils": "0.0.0-unstable.61c048f412",
+		"@webiny/icons": "0.0.0-unstable.6f45466a1d",
+		"@webiny/react-composition": "0.0.0-unstable.6f45466a1d",
+		"@webiny/utils": "0.0.0-unstable.6f45466a1d",
 		"bytes": "3.1.2",
 		"class-variance-authority": "0.7.1",
 		"clsx": "2.1.1",
@@ -52,8 +52,8 @@
 		"@types/react-color": "2.17.12",
 		"@types/react-custom-scrollbars": "4.0.13",
 		"@types/react-virtualized": "9.22.3",
-		"@webiny/build-tools": "0.0.0-unstable.61c048f412",
-		"@webiny/project": "0.0.0-unstable.61c048f412",
+		"@webiny/build-tools": "0.0.0-unstable.6f45466a1d",
+		"@webiny/project": "0.0.0-unstable.6f45466a1d",
 		"chalk": "4.1.2",
 		"css-loader": "7.1.3",
 		"eslint-plugin-storybook": "9.1.17",
@@ -86,5 +86,5 @@
 			]
 		}
 	},
-	"gitHead": "61c048f412d6b4aa70c1d105aab21e3fa69730f3"
+	"gitHead": "6f45466a1d9fb94f6156923501eb90ac303b81a5"
 }