@adiba-banking-cloud/backoffice 0.0.12 → 0.0.14

package/build/index.cjs.js/index.js

@@ -11397,15 +11397,15 @@ const Icons = _ref => {
   let {
     name = "Home",
     size = 16,
+    variant = "Linear",
     stroke = 1,
-    variant = "Outline",
     color
   } = _ref;
   const Element = IconSax__namespace[name];
   return /*#__PURE__*/React.createElement(Element, {
-    size: size,
-    variant: variant,
-    color: color,
+    size,
+    color,
+    variant,
     style: {
       strokeWidth: stroke
     }
@@ -11611,14 +11611,16 @@ const UserMenuTarget = _ref => {
   }), /*#__PURE__*/React.createElement(core.Stack, {
     gap: 0,
     align: "flex-start",
-    visibleFrom: "md"
+    visibleFrom: "md",
+    fw: 300
   }, /*#__PURE__*/React.createElement(core.Text, {
+    fw: 300,
     size: "sm"
   }, name), /*#__PURE__*/React.createElement(core.Text, {
     c: "dimmed",
     size: "xs"
   }, username)), /*#__PURE__*/React.createElement(Icons, {
-    name: "ArrowRight2",
+    name: "ArrowDown2",
     size: 12
   }))));
 };
@@ -11636,12 +11638,16 @@ const UserMenuDropdown = _ref => {
         c: section === null || section === void 0 ? void 0 : section.color,
         key: "menu-item-".concat(key),
         h: height,
-        leftSection: /*#__PURE__*/React.createElement(Icons, item.icon),
+        leftSection: /*#__PURE__*/React.createElement(Icons, _extends({}, item.icon, {
+          stroke: 0.5
+        })),
         rightSection: item !== null && item !== void 0 && item.disclosure ? /*#__PURE__*/React.createElement(Icons, {
           name: "ArrowRight2",
-          size: 12
+          size: 12,
+          stroke: 0.5
         }) : item.badge ? /*#__PURE__*/React.createElement(core.Badge, {
-          color: item === null || item === void 0 || (_item$badge = item.badge) === null || _item$badge === void 0 ? void 0 : _item$badge.color
+          color: item === null || item === void 0 || (_item$badge = item.badge) === null || _item$badge === void 0 ? void 0 : _item$badge.color,
+          size: "sm"
         }, item === null || item === void 0 || (_item$badge2 = item.badge) === null || _item$badge2 === void 0 ? void 0 : _item$badge2.text) : undefined,
         onClick: () => item.callbackFn ? item.callbackFn() : void 0
       }, /*#__PURE__*/React.createElement(core.Text, {
@@ -11651,11 +11657,12 @@ const UserMenuDropdown = _ref => {
     });
     if (index) items.push(/*#__PURE__*/React.createElement(core.Divider, {
       key: "divider-".concat(index),
-      my: "xs"
+      my: 2
     }));
     if (section !== null && section !== void 0 && section.title) items.push(/*#__PURE__*/React.createElement(core.Menu.Label, {
-      key: "label-".concat(index),
-      pt: "xs"
+      fz: 10,
+      fw: 600,
+      key: "label-".concat(index)
     }, section.title));
     items.push(...sectionItems);
     return items;
@@ -11701,11 +11708,11 @@ const SideMenu = _ref => {
     onClick
   } = _ref;
   return /*#__PURE__*/React.createElement(React.Fragment, null, sidemenu.map(item => {
-    var _item$children;
+    var _item$children, _item$children2;
     return /*#__PURE__*/React.createElement(core.NavLink, {
-      mt: "xs",
+      className: "backoffice-sidemenu",
+      mt: "sm",
       fw: 300,
-      c: color,
       style: {
         borderRadius: radius
       },
@@ -11715,8 +11722,9 @@ const SideMenu = _ref => {
       variant,
       onClick,
       leftSection: item.icon ? /*#__PURE__*/React.createElement(Icons, item.icon) : undefined,
-      label: item.label
-    }, (_item$children = item.children) !== null && _item$children !== void 0 && _item$children.length ? item.children.map(subitem => /*#__PURE__*/React.createElement(core.NavLink, {
+      label: item.label,
+      href: (_item$children = item.children) !== null && _item$children !== void 0 && _item$children.length ? undefined : item.href
+    }, (_item$children2 = item.children) !== null && _item$children2 !== void 0 && _item$children2.length ? item.children.map(subitem => /*#__PURE__*/React.createElement(core.NavLink, {
       label: subitem.label,
       active: subitem.active,
       color,

package/build/index.esm.js/index.js

@@ -11376,15 +11376,15 @@ const Icons = _ref => {
   let {
     name = "Home",
     size = 16,
+    variant = "Linear",
     stroke = 1,
-    variant = "Outline",
     color
   } = _ref;
   const Element = IconSax[name];
   return /*#__PURE__*/React.createElement(Element, {
-    size: size,
-    variant: variant,
-    color: color,
+    size,
+    color,
+    variant,
     style: {
       strokeWidth: stroke
     }
@@ -11590,14 +11590,16 @@ const UserMenuTarget = _ref => {
   }), /*#__PURE__*/React.createElement(Stack, {
     gap: 0,
     align: "flex-start",
-    visibleFrom: "md"
+    visibleFrom: "md",
+    fw: 300
   }, /*#__PURE__*/React.createElement(Text, {
+    fw: 300,
     size: "sm"
   }, name), /*#__PURE__*/React.createElement(Text, {
     c: "dimmed",
     size: "xs"
   }, username)), /*#__PURE__*/React.createElement(Icons, {
-    name: "ArrowRight2",
+    name: "ArrowDown2",
     size: 12
   }))));
 };
@@ -11615,12 +11617,16 @@ const UserMenuDropdown = _ref => {
         c: section === null || section === void 0 ? void 0 : section.color,
         key: "menu-item-".concat(key),
         h: height,
-        leftSection: /*#__PURE__*/React.createElement(Icons, item.icon),
+        leftSection: /*#__PURE__*/React.createElement(Icons, _extends({}, item.icon, {
+          stroke: 0.5
+        })),
         rightSection: item !== null && item !== void 0 && item.disclosure ? /*#__PURE__*/React.createElement(Icons, {
           name: "ArrowRight2",
-          size: 12
+          size: 12,
+          stroke: 0.5
         }) : item.badge ? /*#__PURE__*/React.createElement(Badge, {
-          color: item === null || item === void 0 || (_item$badge = item.badge) === null || _item$badge === void 0 ? void 0 : _item$badge.color
+          color: item === null || item === void 0 || (_item$badge = item.badge) === null || _item$badge === void 0 ? void 0 : _item$badge.color,
+          size: "sm"
         }, item === null || item === void 0 || (_item$badge2 = item.badge) === null || _item$badge2 === void 0 ? void 0 : _item$badge2.text) : undefined,
         onClick: () => item.callbackFn ? item.callbackFn() : void 0
       }, /*#__PURE__*/React.createElement(Text, {
@@ -11630,11 +11636,12 @@ const UserMenuDropdown = _ref => {
     });
     if (index) items.push(/*#__PURE__*/React.createElement(Divider, {
       key: "divider-".concat(index),
-      my: "xs"
+      my: 2
     }));
     if (section !== null && section !== void 0 && section.title) items.push(/*#__PURE__*/React.createElement(Menu.Label, {
-      key: "label-".concat(index),
-      pt: "xs"
+      fz: 10,
+      fw: 600,
+      key: "label-".concat(index)
     }, section.title));
     items.push(...sectionItems);
     return items;
@@ -11680,11 +11687,11 @@ const SideMenu = _ref => {
     onClick
   } = _ref;
   return /*#__PURE__*/React.createElement(React.Fragment, null, sidemenu.map(item => {
-    var _item$children;
+    var _item$children, _item$children2;
     return /*#__PURE__*/React.createElement(NavLink, {
-      mt: "xs",
+      className: "backoffice-sidemenu",
+      mt: "sm",
       fw: 300,
-      c: color,
       style: {
         borderRadius: radius
       },
@@ -11694,8 +11701,9 @@ const SideMenu = _ref => {
       variant,
       onClick,
       leftSection: item.icon ? /*#__PURE__*/React.createElement(Icons, item.icon) : undefined,
-      label: item.label
-    }, (_item$children = item.children) !== null && _item$children !== void 0 && _item$children.length ? item.children.map(subitem => /*#__PURE__*/React.createElement(NavLink, {
+      label: item.label,
+      href: (_item$children = item.children) !== null && _item$children !== void 0 && _item$children.length ? undefined : item.href
+    }, (_item$children2 = item.children) !== null && _item$children2 !== void 0 && _item$children2.length ? item.children.map(subitem => /*#__PURE__*/React.createElement(NavLink, {
       label: subitem.label,
       active: subitem.active,
       color,

package/build/styles.css

@@ -1 +1 @@
-svg>path{stroke-width:inherit}
+svg>path{stroke-width:inherit}.backoffice-sidemenu.mantine-NavLink-root{padding:.25rem}.backoffice-sidemenu.mantine-NavLink-root[data-active] .mantine-NavLink-section:first-child{background:var(--mantine-color-adiba-4)}.backoffice-sidemenu.mantine-NavLink-root .mantine-NavLink-section:first-child{border-radius:9999px;display:flex;height:2rem;width:2rem}

package/build/typings/components/general/icons/Icons.types.d.ts

@@ -3,6 +3,6 @@ export interface IconsProps {
     name: keyof typeof IconSax;
     size?: number;
     color?: string;
-    stroke?: number | string;
+    stroke?: string | number;
     variant?: "Linear" | "Outline" | "Broken" | "Bold" | "Bulk" | "TwoTone";
 }

package/build/typings/components/menus/side/Side.d.ts

@@ -1,3 +1,4 @@
 import React from "react";
 import { SideMenuProps } from "./Side.types";
+import './Side.css';
 export declare const SideMenu: React.FC<SideMenuProps>;

package/build/typings/components/menus/side/Side.types.d.ts

@@ -10,6 +10,7 @@ export interface SideMenuProps {
 export interface SideMenuItemProps {
     active?: boolean;
     id: string;
+    href?: string;
     icon?: IconsProps;
     label: string;
     variant?: "filled" | "light" | "subtle";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@adiba-banking-cloud/backoffice",
   "author": "TUROG Technologies",
-  "version": "0.0.12",
+  "version": "0.0.14",
   "description": "An ADIBA component library for backoffice and dashboard applications",
   "license": "ISC",
   "main": "build/index.cjs.js",