@webiny/admin-ui 0.0.0-unstable.6f45466a1d → 0.0.0-unstable.7be00a75a9

package/Sidebar/Sidebar.stories.js

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

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","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":[]}
+{"version":3,"file":"Sidebar/Sidebar.stories.js","sources":["../../src/Sidebar/Sidebar.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\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\";\nimport { AdminUiProvider } from \"~/AdminUiProvider/index.js\";\nimport { HashLink } from \"~/Sidebar/stories/HashLink.js\";\nimport { useHash } from \"~/Sidebar/stories/useHash.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        <AdminUiProvider linkComponent={HashLink}>\n            <SidebarComponent />\n        </AdminUiProvider>\n    )\n};\n\nconst SidebarComponent = () => {\n    const hash = useHash();\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"],"names":["meta","Sidebar","Story","Tooltip","MainMenu","AdminUiProvider","HashLink","SidebarComponent","hash","useHash","sidebarState","setSidebarState","React","SidebarProvider","DropdownMenu","InfoIcon","MoreVertIcon","ApiPlaygroundIcon","DocsIcon","GithubIcon","ChatIcon","Tag","console","AuditLogsIcon","FormBuilderIcon","alert","FileManagerIcon","CmsIcon","VehiclesIcon","CarIcon","GridIcon","PageBuilderIcon"],"mappings":"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"}

package/Sidebar/components/SidebarContent.js

@@ -1,33 +1,23 @@
-import React from "react";
+import react from "react";
 import { cn } from "../../utils.js";
 import { ScrollArea } from "../../ScrollArea/index.js";
 import { useSidebar } from "./SidebarProvider.js";
-const SidebarContent = ({
-  className,
-  children,
-  ...props
-}) => {
-  const {
-    state
-  } = useSidebar();
-  const isExpanded = state === "expanded";
-  if (isExpanded) {
-    // Extract dir and onScroll props to avoid type conflicts with ScrollArea.
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const {
-      dir,
-      onScroll,
-      ...restProps
-    } = props;
-    return /*#__PURE__*/React.createElement(ScrollArea, Object.assign({
-      "data-sidebar": "content",
-      className: cn("flex text-neutral-primary min-h-0 flex-1 flex-col gap-2", className)
-    }, restProps), children);
-  }
-  return /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
-    "data-sidebar": "content",
-    className: cn("flex text-neutral-primary min-h-0 flex-1 flex-col gap-2 overflow-y-auto overflow-x-hidden group-data-[state=collapsed]:overflow-hidden", className)
-  }), children);
+const SidebarContent = ({ className, children, ...props })=>{
+    const { state } = useSidebar();
+    const isExpanded = "expanded" === state;
+    if (isExpanded) {
+        const { dir, onScroll, ...restProps } = props;
+        return /*#__PURE__*/ react.createElement(ScrollArea, {
+            "data-sidebar": "content",
+            className: cn("flex text-neutral-primary min-h-0 flex-1 flex-col gap-2", className),
+            ...restProps
+        }, children);
+    }
+    return /*#__PURE__*/ react.createElement("div", {
+        ...props,
+        "data-sidebar": "content",
+        className: cn("flex text-neutral-primary min-h-0 flex-1 flex-col gap-2 overflow-y-auto overflow-x-hidden group-data-[state=collapsed]:overflow-hidden", className)
+    }, children);
 };
 export { SidebarContent };
 

package/Sidebar/components/SidebarContent.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cn","ScrollArea","useSidebar","SidebarContent","className","children","props","state","isExpanded","dir","onScroll","restProps","createElement","Object","assign"],"sources":["SidebarContent.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { ScrollArea } from \"~/ScrollArea/index.js\";\nimport { useSidebar } from \"./SidebarProvider.js\";\n\nconst SidebarContent = ({ className, children, ...props }: React.ComponentProps<\"div\">) => {\n    const { state } = useSidebar();\n    const isExpanded = state === \"expanded\";\n\n    if (isExpanded) {\n        // Extract dir and onScroll props to avoid type conflicts with ScrollArea.\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        const { dir, onScroll, ...restProps } = props;\n        return (\n            <ScrollArea\n                data-sidebar=\"content\"\n                className={cn(\"flex text-neutral-primary min-h-0 flex-1 flex-col gap-2\", className)}\n                {...restProps}\n            >\n                {children}\n            </ScrollArea>\n        );\n    }\n\n    return (\n        <div\n            {...props}\n            data-sidebar=\"content\"\n            className={cn(\n                \"flex text-neutral-primary min-h-0 flex-1 flex-col gap-2 overflow-y-auto overflow-x-hidden group-data-[state=collapsed]:overflow-hidden\",\n                className\n            )}\n        >\n            {children}\n        </div>\n    );\n};\n\nexport { SidebarContent };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,EAAE;AACX,SAASC,UAAU;AACnB,SAASC,UAAU;AAEnB,MAAMC,cAAc,GAAGA,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAE,GAAGC;AAAmC,CAAC,KAAK;EACvF,MAAM;IAAEC;EAAM,CAAC,GAAGL,UAAU,CAAC,CAAC;EAC9B,MAAMM,UAAU,GAAGD,KAAK,KAAK,UAAU;EAEvC,IAAIC,UAAU,EAAE;IACZ;IACA;IACA,MAAM;MAAEC,GAAG;MAAEC,QAAQ;MAAE,GAAGC;IAAU,CAAC,GAAGL,KAAK;IAC7C,oBACIP,KAAA,CAAAa,aAAA,CAACX,UAAU,EAAAY,MAAA,CAAAC,MAAA;MACP,gBAAa,SAAS;MACtBV,SAAS,EAAEJ,EAAE,CAAC,yDAAyD,EAAEI,SAAS;IAAE,GAChFO,SAAS,GAEZN,QACO,CAAC;EAErB;EAEA,oBACIN,KAAA,CAAAa,aAAA,QAAAC,MAAA,CAAAC,MAAA,KACQR,KAAK;IACT,gBAAa,SAAS;IACtBF,SAAS,EAAEJ,EAAE,CACT,wIAAwI,EACxII,SACJ;EAAE,IAEDC,QACA,CAAC;AAEd,CAAC;AAED,SAASF,cAAc","ignoreList":[]}
+{"version":3,"file":"Sidebar/components/SidebarContent.js","sources":["../../../src/Sidebar/components/SidebarContent.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { ScrollArea } from \"~/ScrollArea/index.js\";\nimport { useSidebar } from \"./SidebarProvider.js\";\n\nconst SidebarContent = ({ className, children, ...props }: React.ComponentProps<\"div\">) => {\n    const { state } = useSidebar();\n    const isExpanded = state === \"expanded\";\n\n    if (isExpanded) {\n        // Extract dir and onScroll props to avoid type conflicts with ScrollArea.\n        // oxlint-disable-next-line typescript/no-unused-vars\n        const { dir, onScroll, ...restProps } = props;\n        return (\n            <ScrollArea\n                data-sidebar=\"content\"\n                className={cn(\"flex text-neutral-primary min-h-0 flex-1 flex-col gap-2\", className)}\n                {...restProps}\n            >\n                {children}\n            </ScrollArea>\n        );\n    }\n\n    return (\n        <div\n            {...props}\n            data-sidebar=\"content\"\n            className={cn(\n                \"flex text-neutral-primary min-h-0 flex-1 flex-col gap-2 overflow-y-auto overflow-x-hidden group-data-[state=collapsed]:overflow-hidden\",\n                className\n            )}\n        >\n            {children}\n        </div>\n    );\n};\n\nexport { SidebarContent };\n"],"names":["SidebarContent","className","children","props","state","useSidebar","isExpanded","dir","onScroll","restProps","ScrollArea","cn"],"mappings":";;;;AAKA,MAAMA,iBAAiB,CAAC,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GAAGC,OAAoC;IAClF,MAAM,EAAEC,KAAK,EAAE,GAAGC;IAClB,MAAMC,aAAaF,AAAU,eAAVA;IAEnB,IAAIE,YAAY;QAGZ,MAAM,EAAEC,GAAG,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GAAGN;QACxC,OAAO,WAAP,GACI,oBAACO,YAAUA;YACP,gBAAa;YACb,WAAWC,GAAG,2DAA2DV;YACxE,GAAGQ,SAAS;WAEZP;IAGb;IAEA,OAAO,WAAP,GACI,oBAAC;QACI,GAAGC,KAAK;QACT,gBAAa;QACb,WAAWQ,GACP,0IACAV;OAGHC;AAGb"}