@dartech/arsenal-ui 1.4.83 → 1.4.85

package/index.js

@@ -1954,6 +1954,13 @@ const tableThemeOptions = {
           '&:focus': {
             outline: 'none'
           }
+        },
+        actionsCell: {
+          flexWrap: 'wrap',
+          width: '100%',
+          '& > button[aria-label="more"]': {
+            marginLeft: 'auto'
+          }
         }
       }
     }
@@ -8262,7 +8269,9 @@ const SidebarDrawer = ({
   routes,
   id,
   logo,
-  collapsedLogo
+  collapsedLogo,
+  footer,
+  collapsedFooter
 }) => {
   const {
     collapsed,
@@ -8307,14 +8316,34 @@ const SidebarDrawer = ({
             alt: "Lending Hub KZ"
           })]
         }))
-      })), jsx(List, Object.assign({
-        sx: {
-          overflowY: 'auto'
-        }
+      })), jsxs(Box, Object.assign({
+        height: `${logo || title ? 'calc(100vh - 56px)' : 'auto'}`,
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "space-between"
       }, {
-        children: routes.map(route => jsx(SidebarLink$1, {
-          route: route
-        }, route.name))
+        children: [jsx(List, Object.assign({
+          sx: {
+            overflowY: 'auto',
+            '&::-webkit-scrollbar': {
+              width: '8px'
+            },
+            '&::-webkit-scrollbar-thumb': {
+              background: 'rgba(196, 196, 196, 0.8)',
+              borderRadius: '16px',
+              backgroundClip: 'padding-box',
+              border: '2px solid rgba(0, 0, 0, 0)'
+            }
+          }
+        }, {
+          children: routes.map(route => jsx(SidebarLink$1, {
+            route: route
+          }, route.name))
+        })), footer && jsx(Box, Object.assign({
+          borderTop: "1px solid #FFFFFF1F"
+        }, {
+          children: collapsed ? collapsedFooter : footer
+        }))]
       }))]
     }))]
   });
@@ -8327,7 +8356,9 @@ const Sidebar = ({
   title: _title = '',
   id,
   logo,
-  collapsedLogo
+  collapsedLogo,
+  footer,
+  collapsedFooter
 }) => {
   return jsxs(ThemeProvider, Object.assign({
     theme: _theme
@@ -8338,7 +8369,9 @@ const Sidebar = ({
         routes: routes,
         id: id,
         logo: logo,
-        collapsedLogo: collapsedLogo
+        collapsedLogo: collapsedLogo,
+        footer: footer,
+        collapsedFooter: collapsedFooter
       })
     })]
   }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dartech/arsenal-ui",
-  "version": "1.4.83",
+  "version": "1.4.85",
   "author": "DAR",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/src/lib/Sidebar/Sidebar.d.ts

@@ -7,6 +7,8 @@ type Props = {
     id?: string;
     logo?: string;
     collapsedLogo?: string;
+    footer?: React.ReactNode;
+    collapsedFooter?: React.ReactNode;
 };
-export declare const Sidebar: ({ routes, theme, title, id, logo, collapsedLogo, }: Props) => JSX.Element;
+export declare const Sidebar: ({ routes, theme, title, id, logo, collapsedLogo, footer, collapsedFooter, }: Props) => JSX.Element;
 export {};

package/src/lib/Sidebar/SidebarDrawer.d.ts

@@ -6,6 +6,8 @@ type Props = {
     id?: string;
     logo?: string;
     collapsedLogo?: string;
+    footer?: React.ReactNode;
+    collapsedFooter?: React.ReactNode;
 };
-declare const SidebarDrawer: ({ title, routes, id, logo, collapsedLogo }: Props) => JSX.Element;
+declare const SidebarDrawer: ({ title, routes, id, logo, collapsedLogo, footer, collapsedFooter, }: Props) => JSX.Element;
 export default SidebarDrawer;

package/src/theme/tableThemeOptions.d.ts

@@ -145,6 +145,13 @@ declare const tableThemeOptions: {
                         outline: string;
                     };
                 };
+                actionsCell: {
+                    flexWrap: string;
+                    width: string;
+                    '& > button[aria-label="more"]': {
+                        marginLeft: string;
+                    };
+                };
             };
         };
     };