@nextui-org/theme 2.3.0-beta.6 → 2.3.0-beta.8

package/dist/{chunk-SKCOO5MF.mjs → chunk-MO6TCUI5.mjs}

@@ -10,11 +10,11 @@ var alert = tv({
   slots: {
     base: "flex flex-grow flex-row w-full items-start py-3 px-4 gap-x-1",
     mainWrapper: "h-full flex-grow min-h-10 ms-2 flex flex-col box-border items-start text-inherit",
-    title: "w-full font-medium block text-inherit leading-5",
+    title: "text-small w-full font-medium block text-inherit leading-5",
     description: "pl-[1px] text-small font-normal text-inherit",
-    closeButton: "relative text-inherit",
-    iconWrapper: "flex items-center justify-center w-9 h-9 rounded-full",
-    alertIcon: "fill-current w-6"
+    closeButton: "relative text-inherit translate-x-1 -translate-y-1",
+    iconWrapper: "flex-none relative w-9 h-9 rounded-full",
+    alertIcon: "fill-current w-6 absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
   },
   variants: {
     color: {
@@ -65,7 +65,7 @@ var alert = tv({
     },
     hasDescription: {
       false: {
-        base: "items-center",
+        base: "items-start",
         mainWrapper: "justify-center"
       }
     }
@@ -126,97 +126,101 @@ var alert = tv({
       variant: ["flat", "faded"],
       color: "default",
       class: {
-        base: [colorVariants.flat.default, "text-default-foreground"],
+        base: [
+          colorVariants.flat.default,
+          "bg-default-100 dark:bg-default-50/50",
+          "text-default-foreground"
+        ],
         description: "text-default-600",
         closeButton: "text-default-400",
-        iconWrapper: "bg-default-50 dark:bg-default-100"
+        iconWrapper: "bg-default-50 dark:bg-default-100 border-default-200"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "primary",
       class: {
-        base: colorVariants.flat.primary,
-        closeButton: "text-primary-400 data-[hover]:bg-primary-100",
-        iconWrapper: "bg-primary-50 dark:bg-primary-100"
+        base: [colorVariants.flat.primary, "bg-primary-50 dark:bg-primary-50/50"],
+        closeButton: "text-primary-500 data-[hover]:bg-primary-200",
+        iconWrapper: "bg-primary-50 dark:bg-primary-100 border-primary-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "secondary",
       class: {
-        base: colorVariants.flat.secondary,
-        closeButton: "text-secondary-400 data-[hover]:bg-secondary-100",
-        iconWrapper: "bg-secondary-50 dark:bg-secondary-100"
+        base: [colorVariants.flat.secondary, "bg-secondary-50 dark:bg-secondary-50/50"],
+        closeButton: "text-secondary-500 data-[hover]:bg-secondary-200",
+        iconWrapper: "bg-secondary-50 dark:bg-secondary-100 border-secondary-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "success",
       class: {
-        base: colorVariants.flat.success,
-        closeButton: "text-success-400 data-[hover]:bg-success-100",
-        iconWrapper: "bg-success-50 dark:bg-success-100"
+        base: [colorVariants.flat.success, "bg-success-50 dark:bg-success-50/50"],
+        closeButton: "text-success-500 data-[hover]:bg-success-200",
+        iconWrapper: "bg-success-50 dark:bg-success-100 border-success-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "warning",
       class: {
-        base: colorVariants.flat.warning,
+        base: [colorVariants.flat.warning, "bg-warning-50 dark:bg-warning-50/50"],
         closeButton: "text-warning-500 data-[hover]:bg-warning-200",
-        iconWrapper: "bg-warning-50 dark:bg-warning-100"
+        iconWrapper: "bg-warning-50 dark:bg-warning-100 border-warning-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "danger",
       class: {
-        base: colorVariants.flat.danger,
-        closeButton: "text-danger-400 data-[hover]:bg-danger-100",
-        iconWrapper: "bg-danger-50 dark:bg-danger-100"
+        base: [colorVariants.flat.danger, "bg-danger-50 dark:bg-danger-50/50"],
+        closeButton: "text-danger-500 data-[hover]:bg-danger-200",
+        iconWrapper: "bg-danger-50 dark:bg-danger-100 border-danger-100"
       }
     },
     {
       variant: "faded",
       color: "default",
       class: {
-        base: "border-default"
+        base: "border-default-300 dark:border-default-200"
       }
     },
     {
       variant: "faded",
       color: "primary",
       class: {
-        base: "border-primary"
+        base: "border-primary-200 dark:border-primary-100"
       }
     },
     {
       variant: "faded",
       color: "secondary",
       class: {
-        base: "border-secondary"
+        base: "border-secondary-200"
       }
     },
     {
       variant: "faded",
       color: "success",
       class: {
-        base: "border-success"
+        base: "border-success-300 dark:border-success-100"
       }
     },
     {
       variant: "faded",
       color: "warning",
       class: {
-        base: "border-warning"
+        base: "border-warning-300 dark:border-warning-100"
       }
     },
     {
       variant: "faded",
       color: "danger",
       class: {
-        base: "border-danger"
+        base: "border-danger-200 dark:border-danger-100"
       }
     },
     {
@@ -274,6 +278,12 @@ var alert = tv({
         iconWrapper: "shadow-small"
       }
     },
+    {
+      variant: ["flat", "faded"],
+      class: {
+        iconWrapper: "shadow-small border-1"
+      }
+    },
     {
       variant: "bordered",
       color: "default",

package/dist/components/alert.js

@@ -149,11 +149,11 @@ var alert = tv({
   slots: {
     base: "flex flex-grow flex-row w-full items-start py-3 px-4 gap-x-1",
     mainWrapper: "h-full flex-grow min-h-10 ms-2 flex flex-col box-border items-start text-inherit",
-    title: "w-full font-medium block text-inherit leading-5",
+    title: "text-small w-full font-medium block text-inherit leading-5",
     description: "pl-[1px] text-small font-normal text-inherit",
-    closeButton: "relative text-inherit",
-    iconWrapper: "flex items-center justify-center w-9 h-9 rounded-full",
-    alertIcon: "fill-current w-6"
+    closeButton: "relative text-inherit translate-x-1 -translate-y-1",
+    iconWrapper: "flex-none relative w-9 h-9 rounded-full",
+    alertIcon: "fill-current w-6 absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
   },
   variants: {
     color: {
@@ -204,7 +204,7 @@ var alert = tv({
     },
     hasDescription: {
       false: {
-        base: "items-center",
+        base: "items-start",
         mainWrapper: "justify-center"
       }
     }
@@ -265,97 +265,101 @@ var alert = tv({
       variant: ["flat", "faded"],
       color: "default",
       class: {
-        base: [colorVariants.flat.default, "text-default-foreground"],
+        base: [
+          colorVariants.flat.default,
+          "bg-default-100 dark:bg-default-50/50",
+          "text-default-foreground"
+        ],
         description: "text-default-600",
         closeButton: "text-default-400",
-        iconWrapper: "bg-default-50 dark:bg-default-100"
+        iconWrapper: "bg-default-50 dark:bg-default-100 border-default-200"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "primary",
       class: {
-        base: colorVariants.flat.primary,
-        closeButton: "text-primary-400 data-[hover]:bg-primary-100",
-        iconWrapper: "bg-primary-50 dark:bg-primary-100"
+        base: [colorVariants.flat.primary, "bg-primary-50 dark:bg-primary-50/50"],
+        closeButton: "text-primary-500 data-[hover]:bg-primary-200",
+        iconWrapper: "bg-primary-50 dark:bg-primary-100 border-primary-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "secondary",
       class: {
-        base: colorVariants.flat.secondary,
-        closeButton: "text-secondary-400 data-[hover]:bg-secondary-100",
-        iconWrapper: "bg-secondary-50 dark:bg-secondary-100"
+        base: [colorVariants.flat.secondary, "bg-secondary-50 dark:bg-secondary-50/50"],
+        closeButton: "text-secondary-500 data-[hover]:bg-secondary-200",
+        iconWrapper: "bg-secondary-50 dark:bg-secondary-100 border-secondary-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "success",
       class: {
-        base: colorVariants.flat.success,
-        closeButton: "text-success-400 data-[hover]:bg-success-100",
-        iconWrapper: "bg-success-50 dark:bg-success-100"
+        base: [colorVariants.flat.success, "bg-success-50 dark:bg-success-50/50"],
+        closeButton: "text-success-500 data-[hover]:bg-success-200",
+        iconWrapper: "bg-success-50 dark:bg-success-100 border-success-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "warning",
       class: {
-        base: colorVariants.flat.warning,
+        base: [colorVariants.flat.warning, "bg-warning-50 dark:bg-warning-50/50"],
         closeButton: "text-warning-500 data-[hover]:bg-warning-200",
-        iconWrapper: "bg-warning-50 dark:bg-warning-100"
+        iconWrapper: "bg-warning-50 dark:bg-warning-100 border-warning-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "danger",
       class: {
-        base: colorVariants.flat.danger,
-        closeButton: "text-danger-400 data-[hover]:bg-danger-100",
-        iconWrapper: "bg-danger-50 dark:bg-danger-100"
+        base: [colorVariants.flat.danger, "bg-danger-50 dark:bg-danger-50/50"],
+        closeButton: "text-danger-500 data-[hover]:bg-danger-200",
+        iconWrapper: "bg-danger-50 dark:bg-danger-100 border-danger-100"
       }
     },
     {
       variant: "faded",
       color: "default",
       class: {
-        base: "border-default"
+        base: "border-default-300 dark:border-default-200"
       }
     },
     {
       variant: "faded",
       color: "primary",
       class: {
-        base: "border-primary"
+        base: "border-primary-200 dark:border-primary-100"
       }
     },
     {
       variant: "faded",
       color: "secondary",
       class: {
-        base: "border-secondary"
+        base: "border-secondary-200"
       }
     },
     {
       variant: "faded",
       color: "success",
       class: {
-        base: "border-success"
+        base: "border-success-300 dark:border-success-100"
       }
     },
     {
       variant: "faded",
       color: "warning",
       class: {
-        base: "border-warning"
+        base: "border-warning-300 dark:border-warning-100"
       }
     },
     {
       variant: "faded",
       color: "danger",
       class: {
-        base: "border-danger"
+        base: "border-danger-200 dark:border-danger-100"
       }
     },
     {
@@ -413,6 +417,12 @@ var alert = tv({
         iconWrapper: "shadow-small"
       }
     },
+    {
+      variant: ["flat", "faded"],
+      class: {
+        iconWrapper: "shadow-small border-1"
+      }
+    },
     {
       variant: "bordered",
       color: "default",

package/dist/components/alert.mjs

@@ -1,6 +1,6 @@
 import {
   alert
-} from "../chunk-SKCOO5MF.mjs";
+} from "../chunk-MO6TCUI5.mjs";
 import "../chunk-IV3K5WDK.mjs";
 import "../chunk-GQT3YUX3.mjs";
 import "../chunk-46U6G7UJ.mjs";

package/dist/components/index.js

@@ -8839,11 +8839,11 @@ var alert = tv({
   slots: {
     base: "flex flex-grow flex-row w-full items-start py-3 px-4 gap-x-1",
     mainWrapper: "h-full flex-grow min-h-10 ms-2 flex flex-col box-border items-start text-inherit",
-    title: "w-full font-medium block text-inherit leading-5",
+    title: "text-small w-full font-medium block text-inherit leading-5",
     description: "pl-[1px] text-small font-normal text-inherit",
-    closeButton: "relative text-inherit",
-    iconWrapper: "flex items-center justify-center w-9 h-9 rounded-full",
-    alertIcon: "fill-current w-6"
+    closeButton: "relative text-inherit translate-x-1 -translate-y-1",
+    iconWrapper: "flex-none relative w-9 h-9 rounded-full",
+    alertIcon: "fill-current w-6 absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
   },
   variants: {
     color: {
@@ -8894,7 +8894,7 @@ var alert = tv({
     },
     hasDescription: {
       false: {
-        base: "items-center",
+        base: "items-start",
         mainWrapper: "justify-center"
       }
     }
@@ -8955,97 +8955,101 @@ var alert = tv({
       variant: ["flat", "faded"],
       color: "default",
       class: {
-        base: [colorVariants.flat.default, "text-default-foreground"],
+        base: [
+          colorVariants.flat.default,
+          "bg-default-100 dark:bg-default-50/50",
+          "text-default-foreground"
+        ],
         description: "text-default-600",
         closeButton: "text-default-400",
-        iconWrapper: "bg-default-50 dark:bg-default-100"
+        iconWrapper: "bg-default-50 dark:bg-default-100 border-default-200"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "primary",
       class: {
-        base: colorVariants.flat.primary,
-        closeButton: "text-primary-400 data-[hover]:bg-primary-100",
-        iconWrapper: "bg-primary-50 dark:bg-primary-100"
+        base: [colorVariants.flat.primary, "bg-primary-50 dark:bg-primary-50/50"],
+        closeButton: "text-primary-500 data-[hover]:bg-primary-200",
+        iconWrapper: "bg-primary-50 dark:bg-primary-100 border-primary-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "secondary",
       class: {
-        base: colorVariants.flat.secondary,
-        closeButton: "text-secondary-400 data-[hover]:bg-secondary-100",
-        iconWrapper: "bg-secondary-50 dark:bg-secondary-100"
+        base: [colorVariants.flat.secondary, "bg-secondary-50 dark:bg-secondary-50/50"],
+        closeButton: "text-secondary-500 data-[hover]:bg-secondary-200",
+        iconWrapper: "bg-secondary-50 dark:bg-secondary-100 border-secondary-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "success",
       class: {
-        base: colorVariants.flat.success,
-        closeButton: "text-success-400 data-[hover]:bg-success-100",
-        iconWrapper: "bg-success-50 dark:bg-success-100"
+        base: [colorVariants.flat.success, "bg-success-50 dark:bg-success-50/50"],
+        closeButton: "text-success-500 data-[hover]:bg-success-200",
+        iconWrapper: "bg-success-50 dark:bg-success-100 border-success-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "warning",
       class: {
-        base: colorVariants.flat.warning,
+        base: [colorVariants.flat.warning, "bg-warning-50 dark:bg-warning-50/50"],
         closeButton: "text-warning-500 data-[hover]:bg-warning-200",
-        iconWrapper: "bg-warning-50 dark:bg-warning-100"
+        iconWrapper: "bg-warning-50 dark:bg-warning-100 border-warning-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "danger",
       class: {
-        base: colorVariants.flat.danger,
-        closeButton: "text-danger-400 data-[hover]:bg-danger-100",
-        iconWrapper: "bg-danger-50 dark:bg-danger-100"
+        base: [colorVariants.flat.danger, "bg-danger-50 dark:bg-danger-50/50"],
+        closeButton: "text-danger-500 data-[hover]:bg-danger-200",
+        iconWrapper: "bg-danger-50 dark:bg-danger-100 border-danger-100"
       }
     },
     {
       variant: "faded",
       color: "default",
       class: {
-        base: "border-default"
+        base: "border-default-300 dark:border-default-200"
       }
     },
     {
       variant: "faded",
       color: "primary",
       class: {
-        base: "border-primary"
+        base: "border-primary-200 dark:border-primary-100"
       }
     },
     {
       variant: "faded",
       color: "secondary",
       class: {
-        base: "border-secondary"
+        base: "border-secondary-200"
       }
     },
     {
       variant: "faded",
       color: "success",
       class: {
-        base: "border-success"
+        base: "border-success-300 dark:border-success-100"
       }
     },
     {
       variant: "faded",
       color: "warning",
       class: {
-        base: "border-warning"
+        base: "border-warning-300 dark:border-warning-100"
       }
     },
     {
       variant: "faded",
       color: "danger",
       class: {
-        base: "border-danger"
+        base: "border-danger-200 dark:border-danger-100"
       }
     },
     {
@@ -9103,6 +9107,12 @@ var alert = tv({
         iconWrapper: "shadow-small"
       }
     },
+    {
+      variant: ["flat", "faded"],
+      class: {
+        iconWrapper: "shadow-small border-1"
+      }
+    },
     {
       variant: "bordered",
       color: "default",

package/dist/components/index.mjs

@@ -121,7 +121,7 @@ import {
 } from "../chunk-HIFLYEAM.mjs";
 import {
   alert
-} from "../chunk-SKCOO5MF.mjs";
+} from "../chunk-MO6TCUI5.mjs";
 import {
   autocomplete
 } from "../chunk-2TAKWWRG.mjs";

package/dist/index.js

@@ -8884,11 +8884,11 @@ var alert = tv({
   slots: {
     base: "flex flex-grow flex-row w-full items-start py-3 px-4 gap-x-1",
     mainWrapper: "h-full flex-grow min-h-10 ms-2 flex flex-col box-border items-start text-inherit",
-    title: "w-full font-medium block text-inherit leading-5",
+    title: "text-small w-full font-medium block text-inherit leading-5",
     description: "pl-[1px] text-small font-normal text-inherit",
-    closeButton: "relative text-inherit",
-    iconWrapper: "flex items-center justify-center w-9 h-9 rounded-full",
-    alertIcon: "fill-current w-6"
+    closeButton: "relative text-inherit translate-x-1 -translate-y-1",
+    iconWrapper: "flex-none relative w-9 h-9 rounded-full",
+    alertIcon: "fill-current w-6 absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
   },
   variants: {
     color: {
@@ -8939,7 +8939,7 @@ var alert = tv({
     },
     hasDescription: {
       false: {
-        base: "items-center",
+        base: "items-start",
         mainWrapper: "justify-center"
       }
     }
@@ -9000,97 +9000,101 @@ var alert = tv({
       variant: ["flat", "faded"],
       color: "default",
       class: {
-        base: [colorVariants.flat.default, "text-default-foreground"],
+        base: [
+          colorVariants.flat.default,
+          "bg-default-100 dark:bg-default-50/50",
+          "text-default-foreground"
+        ],
         description: "text-default-600",
         closeButton: "text-default-400",
-        iconWrapper: "bg-default-50 dark:bg-default-100"
+        iconWrapper: "bg-default-50 dark:bg-default-100 border-default-200"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "primary",
       class: {
-        base: colorVariants.flat.primary,
-        closeButton: "text-primary-400 data-[hover]:bg-primary-100",
-        iconWrapper: "bg-primary-50 dark:bg-primary-100"
+        base: [colorVariants.flat.primary, "bg-primary-50 dark:bg-primary-50/50"],
+        closeButton: "text-primary-500 data-[hover]:bg-primary-200",
+        iconWrapper: "bg-primary-50 dark:bg-primary-100 border-primary-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "secondary",
       class: {
-        base: colorVariants.flat.secondary,
-        closeButton: "text-secondary-400 data-[hover]:bg-secondary-100",
-        iconWrapper: "bg-secondary-50 dark:bg-secondary-100"
+        base: [colorVariants.flat.secondary, "bg-secondary-50 dark:bg-secondary-50/50"],
+        closeButton: "text-secondary-500 data-[hover]:bg-secondary-200",
+        iconWrapper: "bg-secondary-50 dark:bg-secondary-100 border-secondary-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "success",
       class: {
-        base: colorVariants.flat.success,
-        closeButton: "text-success-400 data-[hover]:bg-success-100",
-        iconWrapper: "bg-success-50 dark:bg-success-100"
+        base: [colorVariants.flat.success, "bg-success-50 dark:bg-success-50/50"],
+        closeButton: "text-success-500 data-[hover]:bg-success-200",
+        iconWrapper: "bg-success-50 dark:bg-success-100 border-success-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "warning",
       class: {
-        base: colorVariants.flat.warning,
+        base: [colorVariants.flat.warning, "bg-warning-50 dark:bg-warning-50/50"],
         closeButton: "text-warning-500 data-[hover]:bg-warning-200",
-        iconWrapper: "bg-warning-50 dark:bg-warning-100"
+        iconWrapper: "bg-warning-50 dark:bg-warning-100 border-warning-100"
       }
     },
     {
       variant: ["flat", "faded"],
       color: "danger",
       class: {
-        base: colorVariants.flat.danger,
-        closeButton: "text-danger-400 data-[hover]:bg-danger-100",
-        iconWrapper: "bg-danger-50 dark:bg-danger-100"
+        base: [colorVariants.flat.danger, "bg-danger-50 dark:bg-danger-50/50"],
+        closeButton: "text-danger-500 data-[hover]:bg-danger-200",
+        iconWrapper: "bg-danger-50 dark:bg-danger-100 border-danger-100"
       }
     },
     {
       variant: "faded",
       color: "default",
       class: {
-        base: "border-default"
+        base: "border-default-300 dark:border-default-200"
       }
     },
     {
       variant: "faded",
       color: "primary",
       class: {
-        base: "border-primary"
+        base: "border-primary-200 dark:border-primary-100"
       }
     },
     {
       variant: "faded",
       color: "secondary",
       class: {
-        base: "border-secondary"
+        base: "border-secondary-200"
       }
     },
     {
       variant: "faded",
       color: "success",
       class: {
-        base: "border-success"
+        base: "border-success-300 dark:border-success-100"
       }
     },
     {
       variant: "faded",
       color: "warning",
       class: {
-        base: "border-warning"
+        base: "border-warning-300 dark:border-warning-100"
       }
     },
     {
       variant: "faded",
       color: "danger",
       class: {
-        base: "border-danger"
+        base: "border-danger-200 dark:border-danger-100"
       }
     },
     {
@@ -9148,6 +9152,12 @@ var alert = tv({
         iconWrapper: "shadow-small"
       }
     },
+    {
+      variant: ["flat", "faded"],
+      class: {
+        iconWrapper: "shadow-small border-1"
+      }
+    },
     {
       variant: "bordered",
       color: "default",

package/dist/index.mjs

@@ -121,7 +121,7 @@ import {
 } from "./chunk-HIFLYEAM.mjs";
 import {
   alert
-} from "./chunk-SKCOO5MF.mjs";
+} from "./chunk-MO6TCUI5.mjs";
 import {
   autocomplete
 } from "./chunk-2TAKWWRG.mjs";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/theme",
-  "version": "2.3.0-beta.6",
+  "version": "2.3.0-beta.8",
   "description": "The default theme for NextUI components",
   "keywords": [
     "theme",