tw-react-components 0.0.144 → 0.0.145

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.cjs.js CHANGED
@@ -2055,7 +2055,11 @@ const Navbar = ({ className, sidebarTriggerClassName, leftSlot, rightSlot, }) =>
2055
2055
 
2056
2056
  const Layout = (_a) => {
2057
2057
  var { children, className } = _a, _b = _a.sidebarProps, { basePath, header, items, footer } = _b, sidebarProps = __rest(_b, ["basePath", "header", "items", "footer"]), { navbarProps } = _a;
2058
- return (jsxRuntime.jsxs(Flex, { className: "h-screen w-screen gap-0 text-black dark:bg-slate-900 dark:text-white", children: [jsxRuntime.jsxs(Sidebar, Object.assign({ collapsible: "icon" }, sidebarProps, { children: [header && (jsxRuntime.jsx(Sidebar.Header, { children: jsxRuntime.jsx(Sidebar.Menu, { children: jsxRuntime.jsx(Sidebar.MenuItem, { children: header }) }) })), jsxRuntime.jsx(Sidebar.Content, { className: "gap-0", children: items.map((item, index) => item.type === 'item' ? (jsxRuntime.jsx(Sidebar.Group, { children: jsxRuntime.jsx(Sidebar.Menu, { children: jsxRuntime.jsx(RenderSideBarItem, Object.assign({ basePath: basePath }, item)) }) }, index)) : (jsxRuntime.jsxs(Sidebar.Group, { children: [item.title && jsxRuntime.jsx(Sidebar.GroupLabel, { children: item.title }), jsxRuntime.jsx(Sidebar.GroupContent, { children: jsxRuntime.jsx(Sidebar.Menu, { children: item.items.map((item, index) => (jsxRuntime.jsx(RenderSideBarItem, Object.assign({ basePath: basePath }, item), index))) }) })] }, index))) }), footer && (jsxRuntime.jsx(Sidebar.Footer, { children: jsxRuntime.jsx(Sidebar.Menu, { children: jsxRuntime.jsx(Sidebar.MenuItem, { children: footer }) }) })), jsxRuntime.jsx(Sidebar.Rail, {})] })), jsxRuntime.jsxs(Flex, { className: "gap-0 overflow-hidden", direction: "column", fullHeight: true, fullWidth: true, children: [navbarProps && jsxRuntime.jsx(Navbar, Object.assign({}, navbarProps)), jsxRuntime.jsx(Flex, { className: cn('overflow-hidden p-3', className), direction: "column", fullWidth: true, fullHeight: true, children: children })] })] }));
2058
+ return (jsxRuntime.jsxs(Flex, { className: "h-screen w-screen gap-0 text-black dark:bg-slate-900 dark:text-white", children: [jsxRuntime.jsxs(Sidebar, Object.assign({ collapsible: "icon" }, sidebarProps, { children: [header && (jsxRuntime.jsx(Sidebar.Header, { children: jsxRuntime.jsx(Sidebar.Menu, { children: jsxRuntime.jsx(Sidebar.MenuItem, { children: header }) }) })), jsxRuntime.jsx(Sidebar.Content, { className: "gap-0", children: items
2059
+ .filter((item) => !item.hidden)
2060
+ .map((item, index) => item.type === 'item' ? (jsxRuntime.jsx(Sidebar.Group, { children: jsxRuntime.jsx(Sidebar.Menu, { children: jsxRuntime.jsx(RenderSideBarItem, Object.assign({ basePath: basePath }, item)) }) }, index)) : (jsxRuntime.jsxs(Sidebar.Group, { children: [item.title && jsxRuntime.jsx(Sidebar.GroupLabel, { children: item.title }), jsxRuntime.jsx(Sidebar.GroupContent, { children: jsxRuntime.jsx(Sidebar.Menu, { children: item.items
2061
+ .filter((subItem) => !subItem.hidden)
2062
+ .map((subItem, index) => (jsxRuntime.jsx(RenderSideBarItem, Object.assign({ basePath: basePath }, subItem), index))) }) })] }, index))) }), footer && (jsxRuntime.jsx(Sidebar.Footer, { children: jsxRuntime.jsx(Sidebar.Menu, { children: jsxRuntime.jsx(Sidebar.MenuItem, { children: footer }) }) })), jsxRuntime.jsx(Sidebar.Rail, {})] })), jsxRuntime.jsxs(Flex, { className: "gap-0 overflow-hidden", direction: "column", fullHeight: true, fullWidth: true, children: [navbarProps && jsxRuntime.jsx(Navbar, Object.assign({}, navbarProps)), jsxRuntime.jsx(Flex, { className: cn('overflow-hidden p-3', className), direction: "column", fullWidth: true, fullHeight: true, children: children })] })] }));
2059
2063
  };
2060
2064
  const RenderSideBarItem = ({ basePath = '/', pathname, title, Icon, items, }) => {
2061
2065
  const location = reactRouterDom.useLocation();
@@ -2064,7 +2068,9 @@ const RenderSideBarItem = ({ basePath = '/', pathname, title, Icon, items, }) =>
2064
2068
  return (jsxRuntime.jsxs(Sidebar.MenuItem, { children: [jsxRuntime.jsx(Sidebar.MenuButton, { asChild: true, tooltip: title, isActive: isLinkStartsWithPathname(currentPath, pathname) &&
2065
2069
  (!items ||
2066
2070
  (!open &&
2067
- items.some((item) => isLinkStartsWithPathname(currentPath, `${pathname}/${item.pathname}`)))), children: jsxRuntime.jsxs(reactRouterDom.Link, { to: pathname, className: "font-medium", children: [Icon && jsxRuntime.jsx(Icon, {}), title] }) }), items && (jsxRuntime.jsx(Sidebar.MenuSub, { children: items.map((subItem, index) => (jsxRuntime.jsx(Sidebar.MenuSubItem, { children: jsxRuntime.jsx(Sidebar.MenuSubButton, { asChild: true, isActive: isLinkStartsWithPathname(currentPath, `${pathname}/${subItem.pathname}`), children: jsxRuntime.jsx(reactRouterDom.Link, { to: `${pathname}/${subItem.pathname}`, children: subItem.title }) }) }, index))) }))] }));
2071
+ items.some((item) => isLinkStartsWithPathname(currentPath, `${pathname}/${item.pathname}`)))), children: jsxRuntime.jsxs(reactRouterDom.Link, { to: pathname, className: "font-medium", children: [Icon && jsxRuntime.jsx(Icon, {}), title] }) }), items && (jsxRuntime.jsx(Sidebar.MenuSub, { children: items
2072
+ .filter((subItem) => !subItem.hidden)
2073
+ .map((subItem, index) => (jsxRuntime.jsx(Sidebar.MenuSubItem, { children: jsxRuntime.jsx(Sidebar.MenuSubButton, { asChild: true, isActive: isLinkStartsWithPathname(currentPath, `${pathname}/${subItem.pathname}`), children: jsxRuntime.jsx(reactRouterDom.Link, { to: `${pathname}/${subItem.pathname}`, children: subItem.title }) }) }, index))) }))] }));
2068
2074
  };
2069
2075
  function isLinkStartsWithPathname(link, pathname) {
2070
2076
  return pathname === '' ? link === pathname : link.startsWith(pathname);
package/index.esm.js CHANGED
@@ -2028,7 +2028,11 @@ const Navbar = ({ className, sidebarTriggerClassName, leftSlot, rightSlot, }) =>
2028
2028
 
2029
2029
  const Layout = (_a) => {
2030
2030
  var { children, className } = _a, _b = _a.sidebarProps, { basePath, header, items, footer } = _b, sidebarProps = __rest(_b, ["basePath", "header", "items", "footer"]), { navbarProps } = _a;
2031
- return (jsxs(Flex, { className: "h-screen w-screen gap-0 text-black dark:bg-slate-900 dark:text-white", children: [jsxs(Sidebar, Object.assign({ collapsible: "icon" }, sidebarProps, { children: [header && (jsx(Sidebar.Header, { children: jsx(Sidebar.Menu, { children: jsx(Sidebar.MenuItem, { children: header }) }) })), jsx(Sidebar.Content, { className: "gap-0", children: items.map((item, index) => item.type === 'item' ? (jsx(Sidebar.Group, { children: jsx(Sidebar.Menu, { children: jsx(RenderSideBarItem, Object.assign({ basePath: basePath }, item)) }) }, index)) : (jsxs(Sidebar.Group, { children: [item.title && jsx(Sidebar.GroupLabel, { children: item.title }), jsx(Sidebar.GroupContent, { children: jsx(Sidebar.Menu, { children: item.items.map((item, index) => (jsx(RenderSideBarItem, Object.assign({ basePath: basePath }, item), index))) }) })] }, index))) }), footer && (jsx(Sidebar.Footer, { children: jsx(Sidebar.Menu, { children: jsx(Sidebar.MenuItem, { children: footer }) }) })), jsx(Sidebar.Rail, {})] })), jsxs(Flex, { className: "gap-0 overflow-hidden", direction: "column", fullHeight: true, fullWidth: true, children: [navbarProps && jsx(Navbar, Object.assign({}, navbarProps)), jsx(Flex, { className: cn('overflow-hidden p-3', className), direction: "column", fullWidth: true, fullHeight: true, children: children })] })] }));
2031
+ return (jsxs(Flex, { className: "h-screen w-screen gap-0 text-black dark:bg-slate-900 dark:text-white", children: [jsxs(Sidebar, Object.assign({ collapsible: "icon" }, sidebarProps, { children: [header && (jsx(Sidebar.Header, { children: jsx(Sidebar.Menu, { children: jsx(Sidebar.MenuItem, { children: header }) }) })), jsx(Sidebar.Content, { className: "gap-0", children: items
2032
+ .filter((item) => !item.hidden)
2033
+ .map((item, index) => item.type === 'item' ? (jsx(Sidebar.Group, { children: jsx(Sidebar.Menu, { children: jsx(RenderSideBarItem, Object.assign({ basePath: basePath }, item)) }) }, index)) : (jsxs(Sidebar.Group, { children: [item.title && jsx(Sidebar.GroupLabel, { children: item.title }), jsx(Sidebar.GroupContent, { children: jsx(Sidebar.Menu, { children: item.items
2034
+ .filter((subItem) => !subItem.hidden)
2035
+ .map((subItem, index) => (jsx(RenderSideBarItem, Object.assign({ basePath: basePath }, subItem), index))) }) })] }, index))) }), footer && (jsx(Sidebar.Footer, { children: jsx(Sidebar.Menu, { children: jsx(Sidebar.MenuItem, { children: footer }) }) })), jsx(Sidebar.Rail, {})] })), jsxs(Flex, { className: "gap-0 overflow-hidden", direction: "column", fullHeight: true, fullWidth: true, children: [navbarProps && jsx(Navbar, Object.assign({}, navbarProps)), jsx(Flex, { className: cn('overflow-hidden p-3', className), direction: "column", fullWidth: true, fullHeight: true, children: children })] })] }));
2032
2036
  };
2033
2037
  const RenderSideBarItem = ({ basePath = '/', pathname, title, Icon, items, }) => {
2034
2038
  const location = useLocation();
@@ -2037,7 +2041,9 @@ const RenderSideBarItem = ({ basePath = '/', pathname, title, Icon, items, }) =>
2037
2041
  return (jsxs(Sidebar.MenuItem, { children: [jsx(Sidebar.MenuButton, { asChild: true, tooltip: title, isActive: isLinkStartsWithPathname(currentPath, pathname) &&
2038
2042
  (!items ||
2039
2043
  (!open &&
2040
- items.some((item) => isLinkStartsWithPathname(currentPath, `${pathname}/${item.pathname}`)))), children: jsxs(Link, { to: pathname, className: "font-medium", children: [Icon && jsx(Icon, {}), title] }) }), items && (jsx(Sidebar.MenuSub, { children: items.map((subItem, index) => (jsx(Sidebar.MenuSubItem, { children: jsx(Sidebar.MenuSubButton, { asChild: true, isActive: isLinkStartsWithPathname(currentPath, `${pathname}/${subItem.pathname}`), children: jsx(Link, { to: `${pathname}/${subItem.pathname}`, children: subItem.title }) }) }, index))) }))] }));
2044
+ items.some((item) => isLinkStartsWithPathname(currentPath, `${pathname}/${item.pathname}`)))), children: jsxs(Link, { to: pathname, className: "font-medium", children: [Icon && jsx(Icon, {}), title] }) }), items && (jsx(Sidebar.MenuSub, { children: items
2045
+ .filter((subItem) => !subItem.hidden)
2046
+ .map((subItem, index) => (jsx(Sidebar.MenuSubItem, { children: jsx(Sidebar.MenuSubButton, { asChild: true, isActive: isLinkStartsWithPathname(currentPath, `${pathname}/${subItem.pathname}`), children: jsx(Link, { to: `${pathname}/${subItem.pathname}`, children: subItem.title }) }) }, index))) }))] }));
2041
2047
  };
2042
2048
  function isLinkStartsWithPathname(link, pathname) {
2043
2049
  return pathname === '' ? link === pathname : link.startsWith(pathname);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "tw-react-components",
3
3
  "description": "A set of React components build with TailwindCSS to make a nice dashboard.",
4
- "version": "0.0.144",
4
+ "version": "0.0.145",
5
5
  "license": "MIT",
6
6
  "homepage": "https://bacali95.github.io/tw-react-components",
7
7
  "author": {
@@ -17,6 +17,7 @@ export type SidebarProps = ComponentProps<typeof Sidebar> & {
17
17
  } & SidebarItem) | {
18
18
  type: 'group';
19
19
  title?: string;
20
+ hidden?: boolean;
20
21
  items: SidebarItem[];
21
22
  })[];
22
23
  footer?: ReactNode;