@apexcura/ui-components 0.0.11-Beta141 → 0.0.11-Beta142

package/dist/index.css

@@ -338,6 +338,12 @@ video {
 .m-\[10px\] {
   margin: 10px;
 }
+.ml-\[-7px\] {
+  margin-left: -7px;
+}
+.mt-\[-10px\] {
+  margin-top: -10px;
+}
 .flex {
   display: flex;
 }
@@ -350,53 +356,62 @@ video {
 .w-\[126px\] {
   width: 126px;
 }
+.w-full {
+  width: 100%;
+}
+.justify-between {
+  justify-content: space-between;
+}
 .rounded-\[8px\] {
   border-radius: 8px;
 }
 .rounded-full {
   border-radius: 9999px;
 }
-.\!border {
-  border-width: 1px !important;
-}
 .border {
   border-width: 1px;
 }
 .border-none {
   border-style: none;
 }
-.\!border-\[\#B8A4DE\] {
-  --tw-border-opacity: 1 !important;
-  border-color: rgb(184 164 222 / var(--tw-border-opacity)) !important;
+.border-\[\#919191\] {
+  --tw-border-opacity: 1;
+  border-color: rgb(145 145 145 / var(--tw-border-opacity));
 }
-.border-\[\#E2D6F8\] {
+.border-\[\#B8A4DE\] {
   --tw-border-opacity: 1;
-  border-color: rgb(226 214 248 / var(--tw-border-opacity));
+  border-color: rgb(184 164 222 / var(--tw-border-opacity));
 }
-.\!bg-\[\#E2D6F8\] {
-  --tw-bg-opacity: 1 !important;
-  background-color: rgb(226 214 248 / var(--tw-bg-opacity)) !important;
+.bg-\[\#E2D6F8\] {
+  --tw-bg-opacity: 1;
+  background-color: rgb(226 214 248 / var(--tw-bg-opacity));
 }
-.bg-purple-800 {
+.bg-\[\#F2F2F2\] {
   --tw-bg-opacity: 1;
-  background-color: rgb(107 33 168 / var(--tw-bg-opacity));
+  background-color: rgb(242 242 242 / var(--tw-bg-opacity));
 }
-.bg-red-500 {
+.bg-purple-800 {
   --tw-bg-opacity: 1;
-  background-color: rgb(239 68 68 / var(--tw-bg-opacity));
+  background-color: rgb(107 33 168 / var(--tw-bg-opacity));
 }
 .p-\[6px\] {
   padding: 6px;
 }
+.pl-\[3px\] {
+  padding-left: 3px;
+}
 .text-center {
   text-align: center;
 }
+.text-\[10px\] {
+  font-size: 10px;
+}
 .italic {
   font-style: italic;
 }
-.\!text-black {
-  --tw-text-opacity: 1 !important;
-  color: rgb(0 0 0 / var(--tw-text-opacity)) !important;
+.text-black {
+  --tw-text-opacity: 1;
+  color: rgb(0 0 0 / var(--tw-text-opacity));
 }
 .text-white {
   --tw-text-opacity: 1;
@@ -465,3 +480,7 @@ video {
 :where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper:first-child {
   border-inline-start: 1px solid rgb(145 145 145);
 }
+.hover\:bg-\[\#F2F2F2\]:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(242 242 242 / var(--tw-bg-opacity));
+}

package/dist/index.d.mts

@@ -40,8 +40,6 @@ type ElementType = {
     icon?: React.JSX.Element;
     placement?: string;
     profileImage?: string;
-    subContainerClassName?: string;
-    countClassName?: string;
     buttonClassName?: string;
     profileImageClassName?: string;
     profileSubClassName?: string;

package/dist/index.d.ts

@@ -40,8 +40,6 @@ type ElementType = {
     icon?: React.JSX.Element;
     placement?: string;
     profileImage?: string;
-    subContainerClassName?: string;
-    countClassName?: string;
     buttonClassName?: string;
     profileImageClassName?: string;
     profileSubClassName?: string;

package/dist/index.js

@@ -188,8 +188,8 @@ var SelectElement = (props) => {
 var import_react6 = __toESM(require("react"));
 var import_antd6 = require("antd");
 var containerClassName = " ";
-var radioDefaultStyle = "bg-red-500 m-[10px]";
-var radioSelectedDefaultStyle = "!bg-[#E2D6F8] !border !border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center !text-black shadow-[0px_0px_1px_1px_#919191]";
+var radioDefaultStyle = "bg-[#F2F2F2] border border-[#919191] rounded-[8px] m-[10px] hover:bg-[#F2F2F2] text-center text-black shadow-[0px_0px_1px_1px_#919191]";
+var radioSelectedDefaultStyle = "bg-[#E2D6F8] border border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center text-black shadow-[0px_0px_1px_1px_#919191]";
 var RadioElement = (props) => {
   const [isDisabled, setIsDisabled] = (0, import_react6.useState)(props.disabled);
   const [selectedValue, setSelectedValue] = (0, import_react6.useState)(props.value);
@@ -540,7 +540,7 @@ var Sidebar = (props) => {
     }
   };
   return /* @__PURE__ */ import_react14.default.createElement("div", { className: props.className, key: props.name }, /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("img", { src: props.img, alt: "logo" })), /* @__PURE__ */ import_react14.default.createElement("ul", { className: props.listClassName }, props.items?.map((item) => {
-    return /* @__PURE__ */ import_react14.default.createElement("li", { onChange: () => {
+    return /* @__PURE__ */ import_react14.default.createElement("li", { onClick: () => {
       handleChange(item);
     }, key: item.label, className: `${props.listItemClassName} ${item.active && props.activeClassName}` }, /* @__PURE__ */ import_react14.default.createElement("span", null, item.icon), /* @__PURE__ */ import_react14.default.createElement("span", null, item.label));
   })));
@@ -554,7 +554,7 @@ var import_react15 = __toESM(require("react"));
 var import_antd12 = require("antd");
 var Notification = (props) => /* @__PURE__ */ import_react15.default.createElement(import_antd12.Popover, { className: props.notification.className, content: props.notification.items?.map((eachItem) => {
   return /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("p", null, eachItem.text), /* @__PURE__ */ import_react15.default.createElement("p", null, eachItem.time));
-}), trigger: "focus", placement: "bottomRight" }, /* @__PURE__ */ import_react15.default.createElement(import_antd12.Button, { className: props.notification.buttonClassName }, /* @__PURE__ */ import_react15.default.createElement("span", null, props.notification.icon), /* @__PURE__ */ import_react15.default.createElement("span", { className: props.notification.countClassName }, props.notification.count)));
+}), trigger: "focus", placement: "bottomRight" }, /* @__PURE__ */ import_react15.default.createElement(import_antd12.Badge, { count: props.notification.count }), /* @__PURE__ */ import_react15.default.createElement(import_antd12.Avatar, { ...props.notification.icon }));
 
 // src/Components/Profile.tsx
 var import_react16 = __toESM(require("react"));
@@ -562,8 +562,9 @@ var Profile = (props) => /* @__PURE__ */ import_react16.default.createElement("d
 
 // src/Components/Navbar.tsx
 var Navbar = (props) => {
-  const test = "flex flex-end bg-red-500 border border-[#E2D6F8]";
-  return /* @__PURE__ */ import_react17.default.createElement("div", { className: `${test} ${props.subContainerClassName}` }, /* @__PURE__ */ import_react17.default.createElement("span", { className: props.dashboard.className }, props.dashboard.label), /* @__PURE__ */ import_react17.default.createElement("div", { className: props.subContainerClassName }, /* @__PURE__ */ import_react17.default.createElement(Notification, { ...props }), /* @__PURE__ */ import_react17.default.createElement(Profile, { ...props })));
+  const test = "w-full flex justify-between";
+  const dashboradClass = "text-xl,text-default-600";
+  return /* @__PURE__ */ import_react17.default.createElement("div", { className: `${test}` }, /* @__PURE__ */ import_react17.default.createElement("div", { className: `${dashboradClass} ${props.dashboard.className}` }, props.dashboard.label), /* @__PURE__ */ import_react17.default.createElement("div", { className: "flex" }, /* @__PURE__ */ import_react17.default.createElement(Notification, { ...props }), /* @__PURE__ */ import_react17.default.createElement(Profile, { ...props })));
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/index.mjs

@@ -139,8 +139,8 @@ var SelectElement = (props) => {
 import React6, { useState as useState2 } from "react";
 import { Radio } from "antd";
 var containerClassName = " ";
-var radioDefaultStyle = "bg-red-500 m-[10px]";
-var radioSelectedDefaultStyle = "!bg-[#E2D6F8] !border !border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center !text-black shadow-[0px_0px_1px_1px_#919191]";
+var radioDefaultStyle = "bg-[#F2F2F2] border border-[#919191] rounded-[8px] m-[10px] hover:bg-[#F2F2F2] text-center text-black shadow-[0px_0px_1px_1px_#919191]";
+var radioSelectedDefaultStyle = "bg-[#E2D6F8] border border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center text-black shadow-[0px_0px_1px_1px_#919191]";
 var RadioElement = (props) => {
   const [isDisabled, setIsDisabled] = useState2(props.disabled);
   const [selectedValue, setSelectedValue] = useState2(props.value);
@@ -491,7 +491,7 @@ var Sidebar = (props) => {
     }
   };
   return /* @__PURE__ */ React13.createElement("div", { className: props.className, key: props.name }, /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("img", { src: props.img, alt: "logo" })), /* @__PURE__ */ React13.createElement("ul", { className: props.listClassName }, props.items?.map((item) => {
-    return /* @__PURE__ */ React13.createElement("li", { onChange: () => {
+    return /* @__PURE__ */ React13.createElement("li", { onClick: () => {
       handleChange(item);
     }, key: item.label, className: `${props.listItemClassName} ${item.active && props.activeClassName}` }, /* @__PURE__ */ React13.createElement("span", null, item.icon), /* @__PURE__ */ React13.createElement("span", null, item.label));
   })));
@@ -502,10 +502,10 @@ import React16 from "react";
 
 // src/Components/Notofication.tsx
 import React14 from "react";
-import { Button as Button4, Popover } from "antd";
+import { Popover, Avatar, Badge } from "antd";
 var Notification = (props) => /* @__PURE__ */ React14.createElement(Popover, { className: props.notification.className, content: props.notification.items?.map((eachItem) => {
   return /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("p", null, eachItem.text), /* @__PURE__ */ React14.createElement("p", null, eachItem.time));
-}), trigger: "focus", placement: "bottomRight" }, /* @__PURE__ */ React14.createElement(Button4, { className: props.notification.buttonClassName }, /* @__PURE__ */ React14.createElement("span", null, props.notification.icon), /* @__PURE__ */ React14.createElement("span", { className: props.notification.countClassName }, props.notification.count)));
+}), trigger: "focus", placement: "bottomRight" }, /* @__PURE__ */ React14.createElement(Badge, { count: props.notification.count }), /* @__PURE__ */ React14.createElement(Avatar, { ...props.notification.icon }));
 
 // src/Components/Profile.tsx
 import React15 from "react";
@@ -513,8 +513,9 @@ var Profile = (props) => /* @__PURE__ */ React15.createElement("div", { classNam
 
 // src/Components/Navbar.tsx
 var Navbar = (props) => {
-  const test = "flex flex-end bg-red-500 border border-[#E2D6F8]";
-  return /* @__PURE__ */ React16.createElement("div", { className: `${test} ${props.subContainerClassName}` }, /* @__PURE__ */ React16.createElement("span", { className: props.dashboard.className }, props.dashboard.label), /* @__PURE__ */ React16.createElement("div", { className: props.subContainerClassName }, /* @__PURE__ */ React16.createElement(Notification, { ...props }), /* @__PURE__ */ React16.createElement(Profile, { ...props })));
+  const test = "w-full flex justify-between";
+  const dashboradClass = "text-xl,text-default-600";
+  return /* @__PURE__ */ React16.createElement("div", { className: `${test}` }, /* @__PURE__ */ React16.createElement("div", { className: `${dashboradClass} ${props.dashboard.className}` }, props.dashboard.label), /* @__PURE__ */ React16.createElement("div", { className: "flex" }, /* @__PURE__ */ React16.createElement(Notification, { ...props }), /* @__PURE__ */ React16.createElement(Profile, { ...props })));
 };
 export {
   AddMoreTable,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.11-Beta141",
+  "version": "0.0.11-Beta142",
   "description": "Apex cura React components library",
   "keywords": [
     "apex cura",