nexaas-ui-components 1.0.65 → 1.0.67

package/dist/index.cjs

@@ -148,27 +148,33 @@ var variants = {
 var paddingConfig = {
   xxs: {
     normal: "",
-    icon: ""
+    icon: "",
+    iconOnly: ""
   },
   xxsm: {
     normal: "p-[5px]",
-    icon: "p-[5px]"
+    icon: "p-[5px]",
+    iconOnly: "p-[5px]"
   },
   xs: {
     normal: "p-2",
-    icon: "p-2"
+    icon: "p-2",
+    iconOnly: "p-2"
   },
   sm: {
     normal: "px-3 py-[6px]",
-    icon: "py-[6px] pl-2 pr-3"
+    icon: "py-[6px] pl-2 pr-3",
+    iconOnly: "p-[6px]"
   },
   md: {
     normal: "py-2 px-4",
-    icon: "py-2 pl-3 pr-4"
+    icon: "py-2 pl-3 pr-4",
+    iconOnly: "p-2"
   },
   lg: {
     normal: "py-3 px-4",
-    icon: "p-3 pr-4"
+    icon: "p-3 pr-4",
+    iconOnly: "p-3"
   }
 };
 var Button = ({
@@ -181,7 +187,7 @@ var Button = ({
   const applyGap = props.icon && props.children;
   const appliedVariant = variants[variant].text;
   const appliedSize = sizes[size];
-  const appliedPadding = props.icon ? paddingConfig[size].icon : paddingConfig[size].normal;
+  const appliedPadding = props.icon ? props.children ? paddingConfig[size].icon : paddingConfig[size].iconOnly : paddingConfig[size].normal;
   const gapText = applyGap ? "gap-[6px]" : "gap-0";
   React5.useEffect(() => {
     if (!hotkey || !props.onClick) return;
@@ -212,7 +218,8 @@ var Button = ({
     {
       className: clsx9__default.default("inline-flex gap-[8px]", {
         "flex-col items-center": hotkeyPosition === "top" || hotkeyPosition === "bottom",
-        "flex-row items-center": hotkeyPosition === "left" || hotkeyPosition === "right"
+        "flex-row items-center": hotkeyPosition === "left" || hotkeyPosition === "right",
+        "cursor-not-allowed": props.disabled || props.loading
       }),
       children: [
         hotkey && (hotkeyPosition === "top" || hotkeyPosition === "left") && /* @__PURE__ */ jsxRuntime.jsx(
@@ -236,7 +243,7 @@ var Button = ({
           ${appliedSize.text} 
           ${appliedPadding} 
           ${gapText} 
-          whitespace-nowrap group rounded-lg font-bold disabled:shadow-none active:shadow-none flex items-center
+          whitespace-nowrap group rounded-lg font-bold disabled:shadow-none active:shadow-none flex items-center disabled:pointer-events-none
         `,
             children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
               props.icon && /* @__PURE__ */ jsxRuntime.jsx(
@@ -569,7 +576,7 @@ var Input = ({
         {
           onClick: () => setShowPassword(!showPassword),
           className: clsx9__default.default(
-            " text-label cursor-pointer text-[20px] absolute right-2 top-[11px]",
+            "uil text-label cursor-pointer text-[20px] absolute right-2 top-1/2 -translate-y-1/2",
             {
               "uil-eye-slash": showPassword,
               "uil-eye": !showPassword
@@ -2660,23 +2667,33 @@ var ModalDialog = ({
         shouldCloseOnEsc: closeOnOverlayClick,
         style: customStyles6,
         contentLabel: "Example Modal",
-        children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx9__default.default(sizes3[size]), children: [
-          showHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pb-[6px] border-b border-b-neutral-200 flex items-center justify-between", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-[24px] font-bold flex items-center gap-2", children: [
-              alertType && /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx9__default.default([alertTypes[alertType]], "text-[30px]"), children: icon }),
+        closeTimeoutMS: 200,
+        children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx9__default.default("modal-inner", sizes3[size]), children: [
+          showHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b border-b-neutral-200 flex items-center justify-between ", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "font-title text-t-sm font-bold flex items-center gap-2", children: [
+              alertType && /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: clsx9__default.default(
+                    alertTypes[alertType],
+                    "w-[26px] h-[26px] text-[26px] flex items-center justify-center shrink-0"
+                  ),
+                  children: icon
+                }
+              ),
               title
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "inline", children: /* @__PURE__ */ jsxRuntime.jsx(
               Button,
               {
                 onClick: onCancel,
                 variant: "ghost",
-                size: "xs",
-                icon: /* @__PURE__ */ jsxRuntime.jsx("i", { className: "uil uil-times" })
+                size: "md",
+                icon: /* @__PURE__ */ jsxRuntime.jsx("i", { className: "uil uil-times text-neutral-400" })
               }
-            )
+            ) })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { children }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children }),
           showFooter && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-6  flex w-full items-center justify-between", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               "div",
@@ -6600,54 +6617,55 @@ var SkeletonRegister = ({ loading, ...props }) => {
 };
 var variants5 = {
   success: {
-    small: "bg-success-600",
-    big: "bg-success-100"
+    small: "bg-success-500",
+    big: "border border-[1px] border-success-500"
   },
   dangerous: {
-    small: "bg-dangerous-600",
-    big: "bg-dangerous-100"
+    small: "bg-dangerous-500",
+    big: "border border-[1px] border-dangerous-500"
   },
   warning: {
-    small: "bg-warning-600",
-    big: "bg-warning-100"
+    small: "bg-warning-500",
+    big: "border border-[1px] border-warning-500"
   },
   info: {
     small: "bg-blue-500",
-    big: "bg-blue-100"
+    big: "border border-[1px] border-blue-500"
   },
   gray: {
     small: "bg-neutral-300",
-    big: "bg-neutral-100"
+    big: "border border-[1px] border-neutral-300"
   }
 };
-var StatusBall = ({ label, variant = "info" }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          className: clsx9__default.default(
-            {
-              [variants5[variant].big]: true
-            },
-            "h-3 w-3 rounded-full"
-          )
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          className: clsx9__default.default(
-            {
-              [variants5[variant].small]: true
-            },
-            "h-2 w-2 rounded-full absolute z-30 top-[2px] left-[2px]"
-          )
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-p-md text-paragraph font-normal", children: label })
+var StatusBall = ({
+  label,
+  variant = "info",
+  labelPosition = "right"
+}) => {
+  const ball = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative shrink-0 h-3 w-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: clsx9__default.default(variants5[variant].big, "h-3 w-3 rounded-full")
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: clsx9__default.default(
+          variants5[variant].small,
+          "h-[8px] w-[8px] rounded-full absolute z-30 top-[2px] left-[2px]"
+        )
+      }
+    )
   ] });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center gap-2", children: labelPosition === "right" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    ball,
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-p-md text-paragraph font-normal", children: label })
+  ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-p-md text-paragraph font-normal", children: label }),
+    ball
+  ] }) });
 };
 var Tabs = ({
   tabs,