@aivenio/aquarium 5.2.0 → 5.3.0

package/dist/src/atoms/Toast/Toast.js

@@ -22,11 +22,11 @@ export const toastStyles = tv({
             default: {
                 base: 'bg-inverse text-opposite-default',
                 dismiss: '[&>button]:text-muted',
-                action: '[&>*]:text-primary-inactive hover:[&>*]:text-primary-muted',
+                action: '[&>*]:text-primary-inactive hover:[&>*]:text-primary-graphic',
             },
             danger: {
-                base: 'bg-danger-intense text-white',
-                dismiss: '[&>button]:text-danger-muted',
+                base: 'bg-danger-graphic text-white',
+                dismiss: '[&>button]:text-danger-graphic',
                 action: '[&>*]:text-white hover:[&>*]:text-white',
             },
         },
@@ -53,4 +53,4 @@ const Action = (_a) => {
 };
 Toast.Action = Action;
 Toast.Dismiss = Dismiss;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVG9hc3QuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvYXRvbXMvVG9hc3QvVG9hc3QudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7O0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQztBQWdCdkMsTUFBTSxDQUFDLE1BQU0sV0FBVyxHQUFHLEVBQUUsQ0FBQztJQUM1QixLQUFLLEVBQUU7UUFDTCxJQUFJLEVBQUUsNEdBQTRHO1FBQ2xILE9BQU8sRUFBRSxxQkFBcUI7UUFDOUIsTUFBTSxFQUFFLDZFQUE2RTtLQUN0RjtJQUNELFFBQVEsRUFBRTtRQUNSLE9BQU8sRUFBRTtZQUNQLE9BQU8sRUFBRTtnQkFDUCxJQUFJLEVBQUUsa0NBQWtDO2dCQUN4QyxPQUFPLEVBQUUsdUJBQXVCO2dCQUNoQyxNQUFNLEVBQUUsNERBQTREO2FBQ3JFO1lBQ0QsTUFBTSxFQUFFO2dCQUNOLElBQUksRUFBRSw4QkFBOEI7Z0JBQ3BDLE9BQU8sRUFBRSw4QkFBOEI7Z0JBQ3ZDLE1BQU0sRUFBRSx5Q0FBeUM7YUFDbEQ7U0FDRjtRQUNELFNBQVMsRUFBRTtZQUNULElBQUksRUFBRSxFQUFFO1lBQ1IsS0FBSyxFQUFFLEVBQUUsT0FBTyxFQUFFLFVBQVUsRUFBRTtTQUMvQjtLQUNGO0NBQ0YsQ0FBQyxDQUFDO0FBRUgsTUFBTSxDQUFDLE1BQU0sS0FBSyxHQUF5RCxDQUFDLEVBSzNFLEVBQUUsRUFBRTtRQUx1RSxFQUMxRSxRQUFRLEVBQ1IsU0FBUyxFQUNULE9BQU8sT0FFUixFQURJLElBQUksY0FKbUUsb0NBSzNFLENBRFE7SUFFUCxNQUFNLEVBQUUsSUFBSSxFQUFFLEdBQUcsV0FBVyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsQ0FBQztJQUMxQyxPQUFPLENBQ0wsNkNBQVMsSUFBSSxJQUFFLFNBQVMsRUFBRSxJQUFJLENBQUMsRUFBRSxTQUFTLEVBQUUsQ0FBQyxLQUMxQyxRQUFRLENBQ0wsQ0FDUCxDQUFDO0FBQ0osQ0FBQyxDQUFDO0FBRUYsTUFBTSxPQUFPLEdBQW9DLENBQUMsRUFBb0QsRUFBRSxFQUFFO1FBQXhELEVBQUUsUUFBUSxFQUFFLFNBQVMsRUFBRSxPQUFPLEVBQUUsU0FBUyxPQUFXLEVBQU4sSUFBSSxjQUFsRCxpREFBb0QsQ0FBRjtJQUNsRyxNQUFNLEVBQUUsT0FBTyxFQUFFLEdBQUcsV0FBVyxDQUFDLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxDQUFDLENBQUM7SUFDeEQsT0FBTyxDQUNMLDZDQUFTLElBQUksSUFBRSxTQUFTLEVBQUUsT0FBTyxDQUFDLEVBQUUsU0FBUyxFQUFFLENBQUMsS0FDN0MsUUFBUSxDQUNMLENBQ1AsQ0FBQztBQUNKLENBQUMsQ0FBQztBQUVGLE1BQU0sTUFBTSxHQUFvQyxDQUFDLEVBQXlDLEVBQUUsRUFBRTtRQUE3QyxFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsT0FBTyxPQUFXLEVBQU4sSUFBSSxjQUF2QyxvQ0FBeUMsQ0FBRjtJQUN0RixNQUFNLEVBQUUsTUFBTSxFQUFFLEdBQUcsV0FBVyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsQ0FBQztJQUM1QyxPQUFPLENBQ0wsNkNBQVMsSUFBSSxJQUFFLFNBQVMsRUFBRSxNQUFNLENBQUMsRUFBRSxTQUFTLEVBQUUsQ0FBQyxLQUM1QyxRQUFRLENBQ0wsQ0FDUCxDQUFDO0FBQ0osQ0FBQyxDQUFDO0FBRUYsS0FBSyxDQUFDLE1BQU0sR0FBRyxNQUFNLENBQUM7QUFDdEIsS0FBSyxDQUFDLE9BQU8sR0FBRyxPQUFPLENBQUMifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVG9hc3QuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvYXRvbXMvVG9hc3QvVG9hc3QudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7O0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQztBQWdCdkMsTUFBTSxDQUFDLE1BQU0sV0FBVyxHQUFHLEVBQUUsQ0FBQztJQUM1QixLQUFLLEVBQUU7UUFDTCxJQUFJLEVBQUUsNEdBQTRHO1FBQ2xILE9BQU8sRUFBRSxxQkFBcUI7UUFDOUIsTUFBTSxFQUFFLDZFQUE2RTtLQUN0RjtJQUNELFFBQVEsRUFBRTtRQUNSLE9BQU8sRUFBRTtZQUNQLE9BQU8sRUFBRTtnQkFDUCxJQUFJLEVBQUUsa0NBQWtDO2dCQUN4QyxPQUFPLEVBQUUsdUJBQXVCO2dCQUNoQyxNQUFNLEVBQUUsOERBQThEO2FBQ3ZFO1lBQ0QsTUFBTSxFQUFFO2dCQUNOLElBQUksRUFBRSw4QkFBOEI7Z0JBQ3BDLE9BQU8sRUFBRSxnQ0FBZ0M7Z0JBQ3pDLE1BQU0sRUFBRSx5Q0FBeUM7YUFDbEQ7U0FDRjtRQUNELFNBQVMsRUFBRTtZQUNULElBQUksRUFBRSxFQUFFO1lBQ1IsS0FBSyxFQUFFLEVBQUUsT0FBTyxFQUFFLFVBQVUsRUFBRTtTQUMvQjtLQUNGO0NBQ0YsQ0FBQyxDQUFDO0FBRUgsTUFBTSxDQUFDLE1BQU0sS0FBSyxHQUF5RCxDQUFDLEVBSzNFLEVBQUUsRUFBRTtRQUx1RSxFQUMxRSxRQUFRLEVBQ1IsU0FBUyxFQUNULE9BQU8sT0FFUixFQURJLElBQUksY0FKbUUsb0NBSzNFLENBRFE7SUFFUCxNQUFNLEVBQUUsSUFBSSxFQUFFLEdBQUcsV0FBVyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsQ0FBQztJQUMxQyxPQUFPLENBQ0wsNkNBQVMsSUFBSSxJQUFFLFNBQVMsRUFBRSxJQUFJLENBQUMsRUFBRSxTQUFTLEVBQUUsQ0FBQyxLQUMxQyxRQUFRLENBQ0wsQ0FDUCxDQUFDO0FBQ0osQ0FBQyxDQUFDO0FBRUYsTUFBTSxPQUFPLEdBQW9DLENBQUMsRUFBb0QsRUFBRSxFQUFFO1FBQXhELEVBQUUsUUFBUSxFQUFFLFNBQVMsRUFBRSxPQUFPLEVBQUUsU0FBUyxPQUFXLEVBQU4sSUFBSSxjQUFsRCxpREFBb0QsQ0FBRjtJQUNsRyxNQUFNLEVBQUUsT0FBTyxFQUFFLEdBQUcsV0FBVyxDQUFDLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxDQUFDLENBQUM7SUFDeEQsT0FBTyxDQUNMLDZDQUFTLElBQUksSUFBRSxTQUFTLEVBQUUsT0FBTyxDQUFDLEVBQUUsU0FBUyxFQUFFLENBQUMsS0FDN0MsUUFBUSxDQUNMLENBQ1AsQ0FBQztBQUNKLENBQUMsQ0FBQztBQUVGLE1BQU0sTUFBTSxHQUFvQyxDQUFDLEVBQXlDLEVBQUUsRUFBRTtRQUE3QyxFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsT0FBTyxPQUFXLEVBQU4sSUFBSSxjQUF2QyxvQ0FBeUMsQ0FBRjtJQUN0RixNQUFNLEVBQUUsTUFBTSxFQUFFLEdBQUcsV0FBVyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsQ0FBQztJQUM1QyxPQUFPLENBQ0wsNkNBQVMsSUFBSSxJQUFFLFNBQVMsRUFBRSxNQUFNLENBQUMsRUFBRSxTQUFTLEVBQUUsQ0FBQyxLQUM1QyxRQUFRLENBQ0wsQ0FDUCxDQUFDO0FBQ0osQ0FBQyxDQUFDO0FBRUYsS0FBSyxDQUFDLE1BQU0sR0FBRyxNQUFNLENBQUM7QUFDdEIsS0FBSyxDQUFDLE9BQU8sR0FBRyxPQUFPLENBQUMifQ==

package/dist/src/molecules/Badge/Badge.js

@@ -43,7 +43,7 @@ const NotificationBadge = (_a) => {
     var { children, top = '-2px', right = '-2px' } = _a, props = __rest(_a, ["children", "top", "right"]);
     return (React.createElement("div", Object.assign({}, props, { className: "Aquarium-Badge.Notification relative inline-flex text-default" }),
         children,
-        React.createElement("span", { style: { top, right }, className: "absolute rounded-full w-[6px] h-[6px] bg-danger-intense" })));
+        React.createElement("span", { style: { top, right }, className: "absolute rounded-full w-[6px] h-[6px] bg-danger-graphic" })));
 };
 const DotBadge = (_a) => {
     var { dense = false } = _a, props = __rest(_a, ["dense"]);

package/dist/src/molecules/TagLabel/TagLabel.js

@@ -16,7 +16,7 @@ const getVariantClassNames = (variant = 'primary') => {
         case 'neutral':
             return 'bg-medium';
         case 'danger':
-            return 'bg-danger-intense';
+            return 'bg-danger-graphic';
         case 'success':
             return 'bg-success-intense';
         case 'primary':

package/dist/src/tokens/tokens.json

@@ -49,18 +49,21 @@
         "info": {
             "muted": "rgba(224,245,254,1)",
             "default": "rgba(3,153,227,1)",
+            "graphic": "rgba(3,153,227,1)",
             "intense": "rgba(1,116,186,1)",
             "inverse": "rgba(3,153,227,1)"
         },
         "success": {
             "muted": "rgba(236,247,237,1)",
             "default": "rgba(0,179,0,1)",
+            "graphic": "rgba(0,179,0,1)",
             "intense": "rgba(0,142,0,1)",
             "inverse": "rgba(0,179,0,1)"
         },
         "warning": {
             "muted": "rgba(255,248,234,1)",
             "default": "rgba(255,179,0,1)",
+            "graphic": "rgba(255,179,0,1)",
             "intense": "rgba(255,144,3,1)",
             "inverse": "rgba(255,179,0,1)"
         },
@@ -68,6 +71,7 @@
             "muted": "rgba(255,203,210,1)",
             "default": "rgba(255,173,179,1)",
             "intense": "rgba(230,39,40,1)",
+            "graphic": "rgba(230,39,40,1)",
             "inverse": "rgba(216,0,5,1)"
         },
         "status": {
@@ -291,30 +295,35 @@
             "inactive": "rgba(185,197,239,1)",
             "active": "rgba(34,47,149,1)",
             "muted": "rgba(129,142,236,1)",
+            "graphic": "rgba(129,142,236,1)",
             "default": "rgba(88,101,205,1)",
             "intense": "rgba(53,69,190,1)"
         },
         "info": {
             "inactive": "rgba(180,229,251,1)",
             "muted": "rgba(76,194,247,1)",
+            "graphic": "rgba(76,194,247,1)",
             "default": "rgba(3,153,227,1)",
             "intense": "rgba(1,116,186,1)"
         },
         "success": {
             "inactive": "rgba(203,255,201,1)",
             "muted": "rgba(137,235,128,1)",
+            "graphic": "rgba(137,235,128,1)",
             "default": "rgba(0,179,0,1)",
             "intense": "rgba(0,142,0,1)"
         },
         "warning": {
             "inactive": "rgba(254,235,178,1)",
             "muted": "rgba(253,212,77,1)",
+            "graphic": "rgba(253,212,77,1)",
             "default": "rgba(253,159,0,1)",
             "intense": "rgba(254,109,0,1)"
         },
         "danger": {
             "inactive": "rgba(255,203,210,1)",
             "muted": "rgba(255,173,179,1)",
+            "graphic": "rgba(255,173,179,1)",
             "default": "rgba(230,39,40,1)",
             "intense": "rgba(197,0,1,1)"
         }

package/dist/styles.css

@@ -674,19 +674,23 @@ video {
   --aquarium-background-color-action-primary-button-disabled: var(--aquarium-colors-primary-40);
   --aquarium-background-color-info-muted: var(--aquarium-colors-info-10);
   --aquarium-background-color-info-default: var(--aquarium-colors-info-70);
+  --aquarium-background-color-info-graphic: var(--aquarium-colors-info-70);
   --aquarium-background-color-info-intense: var(--aquarium-colors-info-90);
   --aquarium-background-color-info-inverse: var(--aquarium-colors-info-70);
   --aquarium-background-color-success-muted: var(--aquarium-colors-success-5);
   --aquarium-background-color-success-default: var(--aquarium-colors-success-70);
+  --aquarium-background-color-success-graphic: var(--aquarium-colors-success-70);
   --aquarium-background-color-success-intense: var(--aquarium-colors-success-90);
   --aquarium-background-color-success-inverse: var(--aquarium-colors-success-70);
   --aquarium-background-color-warning-muted: var(--aquarium-colors-warning-5);
   --aquarium-background-color-warning-default: var(--aquarium-colors-warning-70);
+  --aquarium-background-color-warning-graphic: var(--aquarium-colors-warning-70);
   --aquarium-background-color-warning-intense: var(--aquarium-colors-warning-90);
   --aquarium-background-color-warning-inverse: var(--aquarium-colors-warning-70);
   --aquarium-background-color-danger-muted: var(--aquarium-colors-error-10);
   --aquarium-background-color-danger-default: var(--aquarium-colors-error-20);
   --aquarium-background-color-danger-intense: var(--aquarium-colors-error-50);
+  --aquarium-background-color-danger-graphic: var(--aquarium-colors-error-50);
   --aquarium-background-color-danger-inverse: var(--aquarium-colors-error-70);
   --aquarium-background-color-status-announcement: var(--aquarium-colors-primary-5);
   --aquarium-background-color-status-info: var(--aquarium-colors-info-10);
@@ -724,22 +728,27 @@ video {
   --aquarium-text-color-primary-inactive: var(--aquarium-colors-primary-40);
   --aquarium-text-color-primary-active: var(--aquarium-colors-primary-90);
   --aquarium-text-color-primary-muted: var(--aquarium-colors-primary-60);
+  --aquarium-text-color-primary-graphic: var(--aquarium-colors-primary-60);
   --aquarium-text-color-primary-default: var(--aquarium-colors-primary-70);
   --aquarium-text-color-primary-intense: var(--aquarium-colors-primary-80);
   --aquarium-text-color-info-inactive: var(--aquarium-colors-info-20);
   --aquarium-text-color-info-muted: var(--aquarium-colors-info-40);
+  --aquarium-text-color-info-graphic: var(--aquarium-colors-info-40);
   --aquarium-text-color-info-default: var(--aquarium-colors-info-70);
   --aquarium-text-color-info-intense: var(--aquarium-colors-info-90);
   --aquarium-text-color-success-inactive: var(--aquarium-colors-success-10);
   --aquarium-text-color-success-muted: var(--aquarium-colors-success-30);
+  --aquarium-text-color-success-graphic: var(--aquarium-colors-success-30);
   --aquarium-text-color-success-default: var(--aquarium-colors-success-70);
   --aquarium-text-color-success-intense: var(--aquarium-colors-success-90);
   --aquarium-text-color-warning-inactive: var(--aquarium-colors-warning-20);
   --aquarium-text-color-warning-muted: var(--aquarium-colors-warning-40);
+  --aquarium-text-color-warning-graphic: var(--aquarium-colors-warning-40);
   --aquarium-text-color-warning-default: var(--aquarium-colors-warning-80);
   --aquarium-text-color-warning-intense: var(--aquarium-colors-warning-100);
   --aquarium-text-color-danger-inactive: var(--aquarium-colors-error-10);
   --aquarium-text-color-danger-muted: var(--aquarium-colors-error-20);
+  --aquarium-text-color-danger-graphic: var(--aquarium-colors-error-20);
   --aquarium-text-color-danger-default: var(--aquarium-colors-error-50);
   --aquarium-text-color-danger-intense: var(--aquarium-colors-error-80);
   --aquarium-box-shadow-24dp: var(--aquarium-elevations-24dp);
@@ -2324,6 +2333,10 @@ video {
   background-color: rgba(255,173,179,1);
   background-color: var(--aquarium-background-color-danger-default);
 }
+.bg-danger-graphic{
+  background-color: rgba(230,39,40,1);
+  background-color: var(--aquarium-background-color-danger-graphic);
+}
 .bg-danger-intense{
   background-color: rgba(230,39,40,1);
   background-color: var(--aquarium-background-color-danger-intense);
@@ -2492,6 +2505,10 @@ video {
   background-color: rgba(3,153,227,1);
   background-color: var(--aquarium-background-color-info-default);
 }
+.bg-info-graphic{
+  background-color: rgba(3,153,227,1);
+  background-color: var(--aquarium-background-color-info-graphic);
+}
 .bg-info-intense{
   background-color: rgba(1,116,186,1);
   background-color: var(--aquarium-background-color-info-intense);
@@ -2728,6 +2745,10 @@ video {
   background-color: rgba(0,179,0,1);
   background-color: var(--aquarium-background-color-success-default);
 }
+.bg-success-graphic{
+  background-color: rgba(0,179,0,1);
+  background-color: var(--aquarium-background-color-success-graphic);
+}
 .bg-success-intense{
   background-color: rgba(0,142,0,1);
   background-color: var(--aquarium-background-color-success-intense);
@@ -2796,6 +2817,10 @@ video {
   background-color: rgba(255,179,0,1);
   background-color: var(--aquarium-background-color-warning-default);
 }
+.bg-warning-graphic{
+  background-color: rgba(255,179,0,1);
+  background-color: var(--aquarium-background-color-warning-graphic);
+}
 .bg-warning-intense{
   background-color: rgba(255,144,3,1);
   background-color: var(--aquarium-background-color-warning-intense);
@@ -3126,6 +3151,10 @@ video {
   color: rgba(230,39,40,1);
   color: var(--aquarium-text-color-danger-default);
 }
+.text-danger-graphic{
+  color: rgba(255,173,179,1);
+  color: var(--aquarium-text-color-danger-graphic);
+}
 .text-danger-inactive{
   color: rgba(255,203,210,1);
   color: var(--aquarium-text-color-danger-inactive);
@@ -3294,6 +3323,10 @@ video {
   color: rgba(3,153,227,1);
   color: var(--aquarium-text-color-info-default);
 }
+.text-info-graphic{
+  color: rgba(76,194,247,1);
+  color: var(--aquarium-text-color-info-graphic);
+}
 .text-info-inactive{
   color: rgba(180,229,251,1);
   color: var(--aquarium-text-color-info-inactive);
@@ -3374,6 +3407,10 @@ video {
   color: rgba(88,101,205,1);
   color: var(--aquarium-text-color-primary-default);
 }
+.text-primary-graphic{
+  color: rgba(129,142,236,1);
+  color: var(--aquarium-text-color-primary-graphic);
+}
 .text-primary-inactive{
   color: rgba(185,197,239,1);
   color: var(--aquarium-text-color-primary-inactive);
@@ -3486,6 +3523,10 @@ video {
   color: rgba(0,179,0,1);
   color: var(--aquarium-text-color-success-default);
 }
+.text-success-graphic{
+  color: rgba(137,235,128,1);
+  color: var(--aquarium-text-color-success-graphic);
+}
 .text-success-inactive{
   color: rgba(203,255,201,1);
   color: var(--aquarium-text-color-success-inactive);
@@ -3554,6 +3595,10 @@ video {
   color: rgba(253,159,0,1);
   color: var(--aquarium-text-color-warning-default);
 }
+.text-warning-graphic{
+  color: rgba(253,212,77,1);
+  color: var(--aquarium-text-color-warning-graphic);
+}
 .text-warning-inactive{
   color: rgba(254,235,178,1);
   color: var(--aquarium-text-color-warning-inactive);
@@ -3783,19 +3828,23 @@ input[type="number"].no-arrows{
   --aquarium-background-color-action-primary-button-disabled: color-mix(in srgb, var(--aquarium-colors-primary-60) 50%, transparent);
   --aquarium-background-color-info-muted: var(--aquarium-colors-info-100);
   --aquarium-background-color-info-default: var(--aquarium-colors-info-90);
+  --aquarium-background-color-info-graphic: var(--aquarium-colors-info-90);
   --aquarium-background-color-info-intense: var(--aquarium-colors-info-40);
   --aquarium-background-color-info-inverse: var(--aquarium-colors-info-30);
   --aquarium-background-color-success-muted: var(--aquarium-colors-success-100);
   --aquarium-background-color-success-default: var(--aquarium-colors-success-90);
+  --aquarium-background-color-success-graphic: var(--aquarium-colors-success-90);
   --aquarium-background-color-success-intense: var(--aquarium-colors-success-80);
   --aquarium-background-color-success-inverse: var(--aquarium-colors-success-50);
   --aquarium-background-color-warning-muted: var(--aquarium-colors-warning-100);
   --aquarium-background-color-warning-default: var(--aquarium-colors-warning-90);
+  --aquarium-background-color-warning-graphic: var(--aquarium-colors-warning-90);
   --aquarium-background-color-warning-intense: var(--aquarium-colors-warning-40);
   --aquarium-background-color-warning-inverse: var(--aquarium-colors-warning-50);
   --aquarium-background-color-danger-muted: var(--aquarium-colors-error-90);
   --aquarium-background-color-danger-default: var(--aquarium-colors-error-80);
   --aquarium-background-color-danger-intense: var(--aquarium-colors-error-40);
+  --aquarium-background-color-danger-graphic: var(--aquarium-colors-error-40);
   --aquarium-background-color-danger-inverse: var(--aquarium-colors-error-30);
   --aquarium-background-color-status-announcement: color-mix(in srgb, var(--aquarium-colors-primary-90) 30%, transparent);
   --aquarium-background-color-status-info: color-mix(in srgb, var(--aquarium-colors-info-100) 30%, transparent);
@@ -3811,22 +3860,27 @@ input[type="number"].no-arrows{
   --aquarium-text-color-primary-inactive: var(--aquarium-colors-grey-60);
   --aquarium-text-color-primary-active: var(--aquarium-colors-primary-60);
   --aquarium-text-color-primary-muted: var(--aquarium-colors-primary-90);
+  --aquarium-text-color-primary-graphic: var(--aquarium-colors-primary-90);
   --aquarium-text-color-primary-default: var(--aquarium-colors-primary-60);
   --aquarium-text-color-primary-intense: var(--aquarium-colors-primary-40);
   --aquarium-text-color-info-inactive: var(--aquarium-colors-info-100);
   --aquarium-text-color-info-muted: var(--aquarium-colors-info-100);
+  --aquarium-text-color-info-graphic: var(--aquarium-colors-info-100);
   --aquarium-text-color-info-default: var(--aquarium-colors-info-70);
   --aquarium-text-color-info-intense: var(--aquarium-colors-info-90);
   --aquarium-text-color-success-inactive: var(--aquarium-colors-success-100);
   --aquarium-text-color-success-muted: var(--aquarium-colors-success-100);
+  --aquarium-text-color-success-graphic: var(--aquarium-colors-success-100);
   --aquarium-text-color-success-default: var(--aquarium-colors-success-90);
   --aquarium-text-color-success-intense: var(--aquarium-colors-success-70);
   --aquarium-text-color-warning-inactive: var(--aquarium-colors-warning-100);
   --aquarium-text-color-warning-muted: var(--aquarium-colors-warning-100);
+  --aquarium-text-color-warning-graphic: var(--aquarium-colors-warning-100);
   --aquarium-text-color-warning-default: var(--aquarium-colors-warning-70);
   --aquarium-text-color-warning-intense: var(--aquarium-colors-warning-90);
   --aquarium-text-color-danger-inactive: var(--aquarium-colors-error-100);
   --aquarium-text-color-danger-muted: var(--aquarium-colors-error-100);
+  --aquarium-text-color-danger-graphic: var(--aquarium-colors-error-100);
   --aquarium-text-color-danger-default: var(--aquarium-colors-error-50);
   --aquarium-text-color-danger-intense: var(--aquarium-colors-error-30);
 
@@ -4201,9 +4255,9 @@ input[type="number"].no-arrows{
   border-color: transparent;
   border-color: var(--aquarium-colors-transparent);
 }
-.peer\/switch:checked ~ .peer-checked\/switch\:text-primary-muted{
+.peer\/switch:checked ~ .peer-checked\/switch\:text-primary-graphic{
   color: rgba(129,142,236,1);
-  color: var(--aquarium-text-color-primary-muted);
+  color: var(--aquarium-text-color-primary-graphic);
 }
 .peer:checked ~ .peer-checked\:text-primary-default{
   color: rgba(88,101,205,1);
@@ -4703,13 +4757,13 @@ input[type="number"].no-arrows{
   background-color: rgba(34,47,149,1);
   background-color: var(--aquarium-background-color-primary-inverse);
 }
-.group:where([data-rac])[data-invalid][data-pressed] .group-invalid\:group-pressed\:bg-danger-intense{
+.group:where([data-rac])[data-invalid][data-pressed] .group-invalid\:group-pressed\:bg-danger-graphic{
   background-color: rgba(230,39,40,1);
-  background-color: var(--aquarium-background-color-danger-intense);
+  background-color: var(--aquarium-background-color-danger-graphic);
 }
-.group:where(:not([data-rac])):invalid[data-pressed] .group-invalid\:group-pressed\:bg-danger-intense{
+.group:where(:not([data-rac])):invalid[data-pressed] .group-invalid\:group-pressed\:bg-danger-graphic{
   background-color: rgba(230,39,40,1);
-  background-color: var(--aquarium-background-color-danger-intense);
+  background-color: var(--aquarium-background-color-danger-graphic);
 }
 .selected\:bg-primary-graphic[data-selected]{
   background-color: rgba(53,69,190,1);
@@ -4909,9 +4963,9 @@ input[type="number"].no-arrows{
   background-color: rgba(247,247,250,1);
   background-color: var(--aquarium-background-color-muted);
 }
-.hover\:\[\&\>\*\]\:text-primary-muted>*:where([data-rac])[data-hovered]{
+.hover\:\[\&\>\*\]\:text-primary-graphic>*:where([data-rac])[data-hovered]{
   color: rgba(129,142,236,1);
-  color: var(--aquarium-text-color-primary-muted);
+  color: var(--aquarium-text-color-primary-graphic);
 }
 .hover\:\[\&\>\*\]\:text-white>*:where([data-rac])[data-hovered]{
   color: white;
@@ -4921,9 +4975,9 @@ input[type="number"].no-arrows{
   background-color: rgba(247,247,250,1);
   background-color: var(--aquarium-background-color-muted);
 }
-.hover\:\[\&\>\*\]\:text-primary-muted>*:where(:not([data-rac])):hover{
+.hover\:\[\&\>\*\]\:text-primary-graphic>*:where(:not([data-rac])):hover{
   color: rgba(129,142,236,1);
-  color: var(--aquarium-text-color-primary-muted);
+  color: var(--aquarium-text-color-primary-graphic);
 }
 .hover\:\[\&\>\*\]\:text-white>*:where(:not([data-rac])):hover{
   color: white;
@@ -4948,9 +5002,9 @@ input[type="number"].no-arrows{
   padding-top: 0px;
   padding-bottom: 0px;
 }
-.\[\&\>button\]\:text-danger-muted>button{
+.\[\&\>button\]\:text-danger-graphic>button{
   color: rgba(255,173,179,1);
-  color: var(--aquarium-text-color-danger-muted);
+  color: var(--aquarium-text-color-danger-graphic);
 }
 .\[\&\>button\]\:text-muted>button{
   color: rgba(120,120,133,1);

package/dist/system.cjs

@@ -5479,6 +5479,7 @@ var tailwind_theme_default = {
       "100": "var(--aquarium-colors-warning-100)",
       muted: "var(--aquarium-background-color-warning-muted)",
       default: "var(--aquarium-background-color-warning-default)",
+      graphic: "var(--aquarium-background-color-warning-graphic)",
       intense: "var(--aquarium-background-color-warning-intense)",
       inverse: "var(--aquarium-background-color-warning-inverse)"
     },
@@ -5497,6 +5498,7 @@ var tailwind_theme_default = {
       "100": "var(--aquarium-colors-success-100)",
       muted: "var(--aquarium-background-color-success-muted)",
       default: "var(--aquarium-background-color-success-default)",
+      graphic: "var(--aquarium-background-color-success-graphic)",
       intense: "var(--aquarium-background-color-success-intense)",
       inverse: "var(--aquarium-background-color-success-inverse)"
     },
@@ -5515,6 +5517,7 @@ var tailwind_theme_default = {
       "100": "var(--aquarium-colors-info-100)",
       muted: "var(--aquarium-background-color-info-muted)",
       default: "var(--aquarium-background-color-info-default)",
+      graphic: "var(--aquarium-background-color-info-graphic)",
       intense: "var(--aquarium-background-color-info-intense)",
       inverse: "var(--aquarium-background-color-info-inverse)"
     },
@@ -5589,6 +5592,7 @@ var tailwind_theme_default = {
       muted: "var(--aquarium-background-color-danger-muted)",
       default: "var(--aquarium-background-color-danger-default)",
       intense: "var(--aquarium-background-color-danger-intense)",
+      graphic: "var(--aquarium-background-color-danger-graphic)",
       inverse: "var(--aquarium-background-color-danger-inverse)"
     },
     status: {
@@ -5636,6 +5640,7 @@ var tailwind_theme_default = {
       "100": "var(--aquarium-colors-warning-100)",
       inactive: "var(--aquarium-text-color-warning-inactive)",
       muted: "var(--aquarium-text-color-warning-muted)",
+      graphic: "var(--aquarium-text-color-warning-graphic)",
       default: "var(--aquarium-text-color-warning-default)",
       intense: "var(--aquarium-text-color-warning-intense)"
     },
@@ -5654,6 +5659,7 @@ var tailwind_theme_default = {
       "100": "var(--aquarium-colors-success-100)",
       inactive: "var(--aquarium-text-color-success-inactive)",
       muted: "var(--aquarium-text-color-success-muted)",
+      graphic: "var(--aquarium-text-color-success-graphic)",
       default: "var(--aquarium-text-color-success-default)",
       intense: "var(--aquarium-text-color-success-intense)"
     },
@@ -5672,6 +5678,7 @@ var tailwind_theme_default = {
       "100": "var(--aquarium-colors-info-100)",
       inactive: "var(--aquarium-text-color-info-inactive)",
       muted: "var(--aquarium-text-color-info-muted)",
+      graphic: "var(--aquarium-text-color-info-graphic)",
       default: "var(--aquarium-text-color-info-default)",
       intense: "var(--aquarium-text-color-info-intense)"
     },
@@ -5719,6 +5726,7 @@ var tailwind_theme_default = {
       inactive: "var(--aquarium-text-color-primary-inactive)",
       active: "var(--aquarium-text-color-primary-active)",
       muted: "var(--aquarium-text-color-primary-muted)",
+      graphic: "var(--aquarium-text-color-primary-graphic)",
       default: "var(--aquarium-text-color-primary-default)",
       intense: "var(--aquarium-text-color-primary-intense)"
     },
@@ -5730,6 +5738,7 @@ var tailwind_theme_default = {
     danger: {
       inactive: "var(--aquarium-text-color-danger-inactive)",
       muted: "var(--aquarium-text-color-danger-muted)",
+      graphic: "var(--aquarium-text-color-danger-graphic)",
       default: "var(--aquarium-text-color-danger-default)",
       intense: "var(--aquarium-text-color-danger-intense)"
     }
@@ -6119,18 +6128,21 @@ var tokens_default = {
     info: {
       muted: "rgba(224,245,254,1)",
       default: "rgba(3,153,227,1)",
+      graphic: "rgba(3,153,227,1)",
       intense: "rgba(1,116,186,1)",
       inverse: "rgba(3,153,227,1)"
     },
     success: {
       muted: "rgba(236,247,237,1)",
       default: "rgba(0,179,0,1)",
+      graphic: "rgba(0,179,0,1)",
       intense: "rgba(0,142,0,1)",
       inverse: "rgba(0,179,0,1)"
     },
     warning: {
       muted: "rgba(255,248,234,1)",
       default: "rgba(255,179,0,1)",
+      graphic: "rgba(255,179,0,1)",
       intense: "rgba(255,144,3,1)",
       inverse: "rgba(255,179,0,1)"
     },
@@ -6138,6 +6150,7 @@ var tokens_default = {
       muted: "rgba(255,203,210,1)",
       default: "rgba(255,173,179,1)",
       intense: "rgba(230,39,40,1)",
+      graphic: "rgba(230,39,40,1)",
       inverse: "rgba(216,0,5,1)"
     },
     status: {
@@ -6361,30 +6374,35 @@ var tokens_default = {
       inactive: "rgba(185,197,239,1)",
       active: "rgba(34,47,149,1)",
       muted: "rgba(129,142,236,1)",
+      graphic: "rgba(129,142,236,1)",
       default: "rgba(88,101,205,1)",
       intense: "rgba(53,69,190,1)"
     },
     info: {
       inactive: "rgba(180,229,251,1)",
       muted: "rgba(76,194,247,1)",
+      graphic: "rgba(76,194,247,1)",
       default: "rgba(3,153,227,1)",
       intense: "rgba(1,116,186,1)"
     },
     success: {
       inactive: "rgba(203,255,201,1)",
       muted: "rgba(137,235,128,1)",
+      graphic: "rgba(137,235,128,1)",
       default: "rgba(0,179,0,1)",
       intense: "rgba(0,142,0,1)"
     },
     warning: {
       inactive: "rgba(254,235,178,1)",
       muted: "rgba(253,212,77,1)",
+      graphic: "rgba(253,212,77,1)",
       default: "rgba(253,159,0,1)",
       intense: "rgba(254,109,0,1)"
     },
     danger: {
       inactive: "rgba(255,203,210,1)",
       muted: "rgba(255,173,179,1)",
+      graphic: "rgba(255,173,179,1)",
       default: "rgba(230,39,40,1)",
       intense: "rgba(197,0,1,1)"
     }
@@ -7213,11 +7231,11 @@ var toastStyles = (0, import_tailwind_variants4.tv)({
       default: {
         base: "bg-inverse text-opposite-default",
         dismiss: "[&>button]:text-muted",
-        action: "[&>*]:text-primary-inactive hover:[&>*]:text-primary-muted"
+        action: "[&>*]:text-primary-inactive hover:[&>*]:text-primary-graphic"
       },
       danger: {
-        base: "bg-danger-intense text-white",
-        dismiss: "[&>button]:text-danger-muted",
+        base: "bg-danger-graphic text-white",
+        dismiss: "[&>button]:text-danger-graphic",
         action: "[&>*]:text-white hover:[&>*]:text-white"
       }
     },
@@ -8163,7 +8181,7 @@ var createBadge = (type, displayName) => {
   return Component;
 };
 var NotificationBadge = ({ children, top = "-2px", right = "-2px", ...props }) => {
-  return /* @__PURE__ */ import_react33.default.createElement("div", { ...props, className: "Aquarium-Badge.Notification relative inline-flex text-default" }, children, /* @__PURE__ */ import_react33.default.createElement("span", { style: { top, right }, className: "absolute rounded-full w-[6px] h-[6px] bg-danger-intense" }));
+  return /* @__PURE__ */ import_react33.default.createElement("div", { ...props, className: "Aquarium-Badge.Notification relative inline-flex text-default" }, children, /* @__PURE__ */ import_react33.default.createElement("span", { style: { top, right }, className: "absolute rounded-full w-[6px] h-[6px] bg-danger-graphic" }));
 };
 var DotBadge = ({ dense = false, ...props }) => {
   return /* @__PURE__ */ import_react33.default.createElement(
@@ -15275,7 +15293,7 @@ var cell = (0, import_tailwind_variants23.tv)({
         "group-hover:bg-primary-graphic",
         "group-invalid:group-hover:bg-danger-default",
         "group-pressed:bg-primary-inverse",
-        "group-invalid:group-pressed:bg-danger-intense"
+        "group-invalid:group-pressed:bg-danger-graphic"
       ],
       cap: "text-white bg-primary-graphic group-invalid:bg-danger-default"
     },
@@ -17296,10 +17314,10 @@ var progressBarIndicatorClasses = (0, import_tailwind_variants28.tv)({
   base: "h-2 rounded-full transition-all ease-in-out delay-150",
   variants: {
     status: {
-      info: "bg-info-default",
-      warning: "bg-warning-default",
-      success: "bg-success-default",
-      error: "bg-danger-intense"
+      info: "bg-info-graphic",
+      warning: "bg-warning-graphic",
+      success: "bg-success-graphic",
+      error: "bg-danger-graphic"
     }
   }
 });
@@ -17463,7 +17481,7 @@ var switchStyles = (0, import_tailwind_variants29.tv)({
   slots: {
     wrapper: "relative inline-flex justify-center items-center self-center group",
     input: "appearance-none peer/switch rounded-full inline-block w-[34px] h-[20px] transition duration-300 outline-none focusable cursor-pointer disabled:cursor-not-allowed",
-    thumb: "pointer-events-none rounded-full absolute inline-flex justify-center items-center transition duration-300 h-4 w-4 transform peer-checked/switch:translate-x-5 bg-white left-2 peer-checked/switch:left-1 text-inactive peer-checked/switch:text-primary-muted"
+    thumb: "pointer-events-none rounded-full absolute inline-flex justify-center items-center transition duration-300 h-4 w-4 transform peer-checked/switch:translate-x-5 bg-white left-2 peer-checked/switch:left-1 text-inactive peer-checked/switch:text-primary-graphic"
   },
   variants: {
     disabled: {
@@ -17540,7 +17558,7 @@ var getVariantClassNames = (variant = "primary") => {
     case "neutral":
       return "bg-medium";
     case "danger":
-      return "bg-danger-intense";
+      return "bg-danger-graphic";
     case "success":
       return "bg-success-intense";
     case "primary":
@@ -17791,7 +17809,7 @@ var connectorStyles = (0, import_tailwind_variants31.tv)({
   },
   variants: {
     completed: {
-      true: { connector: "bg-success-default" },
+      true: { connector: "bg-success-graphic" },
       false: { connector: "bg-intense" }
     },
     dense: {
@@ -17840,7 +17858,7 @@ var stepStyles = (0, import_tailwind_variants31.tv)({
       slots: ["indicator"],
       dense: false,
       state: "completed",
-      class: "border-2 text-white bg-success-default border-success-intense"
+      class: "border-2 text-white bg-success-graphic border-success-intense"
     },
     // Dense variants
     {