ionbase-ui 0.26.0 → 0.28.0

package/dist/meta/contrast.json

@@ -317,26 +317,26 @@
       "min": 3
     },
     {
-      "component": "badge",
-      "context": "ion-badge--error",
+      "component": "alert",
+      "context": "ion-alert--solid&ion-alert--information",
       "state": "default",
-      "fg": "--icon-error",
-      "bg": "--surface-error-subtle",
-      "backdrop": null,
-      "kind": "non-text",
+      "fg": "--text-on-color",
+      "bg": "--surface-information",
+      "backdrop": "--surface-information",
+      "kind": "text",
       "mode": "Dark",
-      "fgHex": "#f56b6b",
-      "bgHex": "#811d1d",
-      "ratio": 3.38,
-      "min": 3
+      "fgHex": "#000000",
+      "bgHex": "#5a4cd6",
+      "ratio": 3.44,
+      "min": 4.5
     },
     {
-      "component": "alert",
-      "context": "ion-alert--solid&ion-alert--information",
+      "component": "avatar",
+      "context": "ion-avatar__indicator--information ion-avatar__indicator--information",
       "state": "default",
       "fg": "--text-on-color",
       "bg": "--surface-information",
-      "backdrop": "--surface-information",
+      "backdrop": null,
       "kind": "text",
       "mode": "Dark",
       "fgHex": "#000000",
@@ -703,10 +703,10 @@
       "bg": "--surface-error-subtle",
       "backdrop": null,
       "kind": "non-text",
-      "mode": "Light",
-      "fgHex": "#dc2828",
-      "bgHex": "#fef1f1",
-      "ratio": 4.36,
+      "mode": "Dark",
+      "fgHex": "#f56b6b",
+      "bgHex": "#650a0a",
+      "ratio": 4.5,
       "min": 3
     },
     {
@@ -737,6 +737,20 @@
       "ratio": 4.58,
       "min": 4.5
     },
+    {
+      "component": "avatar",
+      "context": "ion-avatar__indicator--primary ion-avatar__indicator--primary",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-primary",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#000000",
+      "bgHex": "#286ef0",
+      "ratio": 4.58,
+      "min": 4.5
+    },
     {
       "component": "button",
       "context": "ion-button--primary-brand",
@@ -807,34 +821,6 @@
       "ratio": 4.76,
       "min": 3
     },
-    {
-      "component": "alert",
-      "context": "ion-alert--solid&ion-alert--error",
-      "state": "default",
-      "fg": "--text-on-color",
-      "bg": "--surface-error",
-      "backdrop": "--surface-error",
-      "kind": "text",
-      "mode": "Light",
-      "fgHex": "#ffffff",
-      "bgHex": "#dc2828",
-      "ratio": 4.8,
-      "min": 4.5
-    },
-    {
-      "component": "button",
-      "context": "ion-button--destructive",
-      "state": "default",
-      "fg": "--text-on-color",
-      "bg": "--surface-error",
-      "backdrop": null,
-      "kind": "text",
-      "mode": "Light",
-      "fgHex": "#ffffff",
-      "bgHex": "#dc2828",
-      "ratio": 4.8,
-      "min": 4.5
-    },
     {
       "component": "menu",
       "context": "ion-menu ion-menu__item",
@@ -849,6 +835,34 @@
       "ratio": 4.83,
       "min": 3
     },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--blue",
+      "state": "default",
+      "fg": "--color-blue-600",
+      "bg": "--color-blue-50",
+      "backdrop": "--color-blue-50",
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#1c62e3",
+      "bgHex": "#ebf7ff",
+      "ratio": 4.94,
+      "min": 4.5
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--blue",
+      "state": "default",
+      "fg": "--color-blue-600",
+      "bg": "--color-blue-50",
+      "backdrop": "--color-blue-50",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#1c62e3",
+      "bgHex": "#ebf7ff",
+      "ratio": 4.94,
+      "min": 4.5
+    },
     {
       "component": "badge",
       "context": "ion-badge--primary",
@@ -905,6 +919,62 @@
       "ratio": 4.94,
       "min": 3
     },
+    {
+      "component": "alert",
+      "context": "ion-alert--solid&ion-alert--error",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-error",
+      "backdrop": "--surface-error",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#000000",
+      "bgHex": "#eb3737",
+      "ratio": 5.13,
+      "min": 4.5
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--green",
+      "state": "default",
+      "fg": "--color-green-600",
+      "bg": "--color-green-50",
+      "backdrop": "--color-green-50",
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#0d7d38",
+      "bgHex": "#f8fefc",
+      "ratio": 5.13,
+      "min": 4.5
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--green",
+      "state": "default",
+      "fg": "--color-green-600",
+      "bg": "--color-green-50",
+      "backdrop": "--color-green-50",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#0d7d38",
+      "bgHex": "#f8fefc",
+      "ratio": 5.13,
+      "min": 4.5
+    },
+    {
+      "component": "avatar",
+      "context": "ion-avatar__indicator--error ion-avatar__indicator--error",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-error",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#000000",
+      "bgHex": "#eb3737",
+      "ratio": 5.13,
+      "min": 4.5
+    },
     {
       "component": "badge",
       "context": "ion-badge--success",
@@ -919,6 +989,20 @@
       "ratio": 5.13,
       "min": 3
     },
+    {
+      "component": "button",
+      "context": "ion-button--destructive",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-error",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#000000",
+      "bgHex": "#eb3737",
+      "ratio": 5.13,
+      "min": 4.5
+    },
     {
       "component": "alert",
       "context": "ion-alert--solid&ion-alert--success",
@@ -933,6 +1017,20 @@
       "ratio": 5.24,
       "min": 4.5
     },
+    {
+      "component": "avatar",
+      "context": "ion-avatar__indicator--success ion-avatar__indicator--success",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-success",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#0d7d38",
+      "ratio": 5.24,
+      "min": 4.5
+    },
     {
       "component": "button",
       "context": "ion-button--success",
@@ -1073,6 +1171,20 @@
       "ratio": 5.38,
       "min": 4.5
     },
+    {
+      "component": "avatar",
+      "context": "ion-avatar__indicator--primary ion-avatar__indicator--primary",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-primary",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#1c62e3",
+      "ratio": 5.38,
+      "min": 4.5
+    },
     {
       "component": "button",
       "context": "ion-button--primary-brand",
@@ -1087,6 +1199,34 @@
       "ratio": 5.38,
       "min": 4.5
     },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--pink",
+      "state": "default",
+      "fg": "--color-pink-600",
+      "bg": "--color-pink-50",
+      "backdrop": "--color-pink-50",
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#c3135c",
+      "bgHex": "#fdf2f8",
+      "ratio": 5.39,
+      "min": 4.5
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--pink",
+      "state": "default",
+      "fg": "--color-pink-600",
+      "bg": "--color-pink-50",
+      "backdrop": "--color-pink-50",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#c3135c",
+      "bgHex": "#fdf2f8",
+      "ratio": 5.39,
+      "min": 4.5
+    },
     {
       "component": "toast",
       "context": "ion-toast ion-toast__action",
@@ -1116,88 +1256,102 @@
       "min": 4.5
     },
     {
-      "component": "alert",
-      "context": "ion-alert--warning",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--red",
       "state": "default",
-      "fg": "--text-warning",
-      "bg": "--surface-warning-subtle",
-      "backdrop": "--surface-warning-subtle",
+      "fg": "--color-red-600",
+      "bg": "--color-red-50",
+      "backdrop": "--color-red-50",
       "kind": "text",
       "mode": "Light",
-      "fgHex": "#af3e0e",
-      "bgHex": "#fff4e5",
-      "ratio": 5.49,
+      "fgHex": "#c61616",
+      "bgHex": "#fef1f1",
+      "ratio": 5.41,
+      "min": 4.5
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--red",
+      "state": "default",
+      "fg": "--color-red-600",
+      "bg": "--color-red-50",
+      "backdrop": "--color-red-50",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#c61616",
+      "bgHex": "#fef1f1",
+      "ratio": 5.41,
       "min": 4.5
     },
     {
       "component": "badge",
-      "context": "ion-badge--warning",
+      "context": "ion-badge--error",
       "state": "default",
-      "fg": "--icon-warning",
-      "bg": "--surface-warning-subtle",
+      "fg": "--icon-error",
+      "bg": "--surface-error-subtle",
       "backdrop": null,
       "kind": "non-text",
       "mode": "Light",
-      "fgHex": "#af3e0e",
-      "bgHex": "#fff4e5",
-      "ratio": 5.49,
+      "fgHex": "#c61616",
+      "bgHex": "#fef1f1",
+      "ratio": 5.41,
       "min": 3
     },
     {
       "component": "alert",
-      "context": "ion-alert--solid&ion-alert--error",
+      "context": "ion-alert--warning",
       "state": "default",
-      "fg": "--text-on-color",
-      "bg": "--surface-error",
-      "backdrop": "--surface-error",
+      "fg": "--text-warning",
+      "bg": "--surface-warning-subtle",
+      "backdrop": "--surface-warning-subtle",
       "kind": "text",
-      "mode": "Dark",
-      "fgHex": "#000000",
-      "bgHex": "#ef4343",
-      "ratio": 5.55,
+      "mode": "Light",
+      "fgHex": "#af3e0e",
+      "bgHex": "#fff4e5",
+      "ratio": 5.49,
       "min": 4.5
     },
     {
-      "component": "button",
-      "context": "ion-button--destructive",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--orange",
       "state": "default",
-      "fg": "--text-on-color",
-      "bg": "--surface-error",
-      "backdrop": null,
+      "fg": "--color-orange-600",
+      "bg": "--color-orange-50",
+      "backdrop": "--color-orange-50",
       "kind": "text",
-      "mode": "Dark",
-      "fgHex": "#000000",
-      "bgHex": "#ef4343",
-      "ratio": 5.55,
+      "mode": "Light",
+      "fgHex": "#af3e0e",
+      "bgHex": "#fff4e5",
+      "ratio": 5.49,
       "min": 4.5
     },
     {
-      "component": "agent-stop",
-      "context": "ion-agent-stop",
-      "state": "hover",
-      "fg": "--text-error",
-      "bg": "--surface-error-subtle",
-      "backdrop": "--surface-default",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--orange",
+      "state": "default",
+      "fg": "--color-orange-600",
+      "bg": "--color-orange-50",
+      "backdrop": "--color-orange-50",
       "kind": "text",
       "mode": "Dark",
-      "fgHex": "#ffadad",
-      "bgHex": "#811d1d",
-      "ratio": 5.56,
+      "fgHex": "#af3e0e",
+      "bgHex": "#fff4e5",
+      "ratio": 5.49,
       "min": 4.5
     },
     {
-      "component": "alert",
-      "context": "ion-alert--error",
+      "component": "badge",
+      "context": "ion-badge--warning",
       "state": "default",
-      "fg": "--text-error",
-      "bg": "--surface-error-subtle",
-      "backdrop": "--surface-error-subtle",
-      "kind": "text",
-      "mode": "Dark",
-      "fgHex": "#ffadad",
-      "bgHex": "#811d1d",
-      "ratio": 5.56,
-      "min": 4.5
+      "fg": "--icon-warning",
+      "bg": "--surface-warning-subtle",
+      "backdrop": null,
+      "kind": "non-text",
+      "mode": "Light",
+      "fgHex": "#af3e0e",
+      "bgHex": "#fff4e5",
+      "ratio": 5.49,
+      "min": 3
     },
     {
       "component": "alert",
@@ -1214,8 +1368,8 @@
       "min": 4.5
     },
     {
-      "component": "button",
-      "context": "ion-button--success",
+      "component": "avatar",
+      "context": "ion-avatar__indicator--success ion-avatar__indicator--success",
       "state": "default",
       "fg": "--text-on-color",
       "bg": "--surface-success",
@@ -1228,31 +1382,17 @@
       "min": 4.5
     },
     {
-      "component": "agent-stop",
-      "context": "ion-agent-stop",
-      "state": "hover",
-      "fg": "--text-error",
-      "bg": "--surface-error-subtle",
-      "backdrop": "--surface-default",
-      "kind": "text",
-      "mode": "Light",
-      "fgHex": "#ba1c1c",
-      "bgHex": "#fef1f1",
-      "ratio": 5.83,
-      "min": 4.5
-    },
-    {
-      "component": "alert",
-      "context": "ion-alert--error",
+      "component": "button",
+      "context": "ion-button--success",
       "state": "default",
-      "fg": "--text-error",
-      "bg": "--surface-error-subtle",
-      "backdrop": "--surface-error-subtle",
+      "fg": "--text-on-color",
+      "bg": "--surface-success",
+      "backdrop": null,
       "kind": "text",
-      "mode": "Light",
-      "fgHex": "#ba1c1c",
-      "bgHex": "#fef1f1",
-      "ratio": 5.83,
+      "mode": "Dark",
+      "fgHex": "#000000",
+      "bgHex": "#14994e",
+      "ratio": 5.7,
       "min": 4.5
     },
     {
@@ -1271,25 +1411,25 @@
     },
     {
       "component": "avatar",
-      "context": "ion-avatar",
+      "context": "ion-avatar__indicator--warning ion-avatar__indicator--warning",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--text-on-color",
+      "bg": "--surface-warning",
+      "backdrop": null,
       "kind": "text",
       "mode": "Dark",
-      "fgHex": "#9ca3b0",
-      "bgHex": "#1d2735",
-      "ratio": 5.94,
+      "fgHex": "#000000",
+      "bgHex": "#ea5600",
+      "ratio": 5.83,
       "min": 4.5
     },
     {
       "component": "avatar",
-      "context": "ion-avatar--mini",
+      "context": "ion-avatar ion-avatar__media",
       "state": "default",
       "fg": "--text-tertiary",
       "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "backdrop": null,
       "kind": "text",
       "mode": "Dark",
       "fgHex": "#9ca3b0",
@@ -1298,82 +1438,68 @@
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar--sm",
+      "component": "alert",
+      "context": "ion-alert--solid&ion-alert--error",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--text-on-color",
+      "bg": "--surface-error",
+      "backdrop": "--surface-error",
       "kind": "text",
-      "mode": "Dark",
-      "fgHex": "#9ca3b0",
-      "bgHex": "#1d2735",
-      "ratio": 5.94,
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#c61616",
+      "ratio": 5.95,
       "min": 4.5
     },
     {
       "component": "avatar",
-      "context": "ion-avatar--lg",
+      "context": "ion-avatar__indicator--error ion-avatar__indicator--error",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--text-on-color",
+      "bg": "--surface-error",
+      "backdrop": null,
       "kind": "text",
-      "mode": "Dark",
-      "fgHex": "#9ca3b0",
-      "bgHex": "#1d2735",
-      "ratio": 5.94,
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#c61616",
+      "ratio": 5.95,
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar--circle",
+      "component": "button",
+      "context": "ion-button--destructive",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--text-on-color",
+      "bg": "--surface-error",
+      "backdrop": null,
       "kind": "text",
-      "mode": "Dark",
-      "fgHex": "#9ca3b0",
-      "bgHex": "#1d2735",
-      "ratio": 5.94,
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#c61616",
+      "ratio": 5.95,
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar ion-avatar__image",
+      "component": "alert",
+      "context": "ion-alert--solid&ion-alert--warning",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--text-on-color",
+      "bg": "--surface-warning",
+      "backdrop": "--surface-warning",
       "kind": "text",
-      "mode": "Dark",
-      "fgHex": "#9ca3b0",
-      "bgHex": "#1d2735",
-      "ratio": 5.94,
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#af3e0e",
+      "ratio": 5.97,
       "min": 4.5
     },
     {
       "component": "avatar",
-      "context": "ion-avatar ion-avatar__icon",
-      "state": "default",
-      "fg": "--icon-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
-      "kind": "non-text",
-      "mode": "Dark",
-      "fgHex": "#9ca3b0",
-      "bgHex": "#1d2735",
-      "ratio": 5.94,
-      "min": 3
-    },
-    {
-      "component": "alert",
-      "context": "ion-alert--solid&ion-alert--warning",
+      "context": "ion-avatar__indicator--warning ion-avatar__indicator--warning",
       "state": "default",
       "fg": "--text-on-color",
       "bg": "--surface-warning",
-      "backdrop": "--surface-warning",
+      "backdrop": null,
       "kind": "text",
       "mode": "Light",
       "fgHex": "#ffffff",
@@ -1425,17 +1551,31 @@
       "min": 3
     },
     {
-      "component": "button",
-      "context": "ion-button--destructive",
+      "component": "agent-stop",
+      "context": "ion-agent-stop",
       "state": "hover",
-      "fg": "--text-on-color",
-      "bg": "--surface-error-hover",
-      "backdrop": null,
+      "fg": "--text-error",
+      "bg": "--surface-error-subtle",
+      "backdrop": "--surface-default",
       "kind": "text",
       "mode": "Light",
-      "fgHex": "#ffffff",
-      "bgHex": "#ba1c1c",
-      "ratio": 6.42,
+      "fgHex": "#ad1515",
+      "bgHex": "#fef1f1",
+      "ratio": 6.59,
+      "min": 4.5
+    },
+    {
+      "component": "alert",
+      "context": "ion-alert--error",
+      "state": "default",
+      "fg": "--text-error",
+      "bg": "--surface-error-subtle",
+      "backdrop": "--surface-error-subtle",
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#ad1515",
+      "bgHex": "#fef1f1",
+      "ratio": 6.59,
       "min": 4.5
     },
     {
@@ -1492,7 +1632,35 @@
       "fgHex": "#4f3cc8",
       "bgHex": "#f6f1f8",
       "ratio": 6.7,
-      "min": 3
+      "min": 3
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--violet",
+      "state": "default",
+      "fg": "--color-purple-600",
+      "bg": "--color-purple-50",
+      "backdrop": "--color-purple-50",
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#4f3cc8",
+      "bgHex": "#f6f1f8",
+      "ratio": 6.7,
+      "min": 4.5
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--violet",
+      "state": "default",
+      "fg": "--color-purple-600",
+      "bg": "--color-purple-50",
+      "backdrop": "--color-purple-50",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#4f3cc8",
+      "bgHex": "#f6f1f8",
+      "ratio": 6.7,
+      "min": 4.5
     },
     {
       "component": "badge",
@@ -1510,11 +1678,11 @@
     },
     {
       "component": "avatar",
-      "context": "ion-avatar",
+      "context": "ion-avatar ion-avatar__media",
       "state": "default",
       "fg": "--text-tertiary",
       "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "backdrop": null,
       "kind": "text",
       "mode": "Light",
       "fgHex": "#4b5563",
@@ -1523,116 +1691,172 @@
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar--mini",
+      "component": "input",
+      "context": "ion-input ion-input__field",
       "state": "default",
       "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "bg": "--surface-page",
+      "backdrop": "--surface-page",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#9ca3b0",
+      "bgHex": "#131923",
+      "ratio": 6.95,
+      "min": 4.5
+    },
+    {
+      "component": "input",
+      "context": "ion-input ion-input__icon-start",
+      "state": "default",
+      "fg": "--icon-tertiary",
+      "bg": "--surface-page",
+      "backdrop": "--surface-page",
+      "kind": "non-text",
+      "mode": "Dark",
+      "fgHex": "#9ca3b0",
+      "bgHex": "#131923",
+      "ratio": 6.95,
+      "min": 3
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient",
+      "state": "default",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
       "kind": "text",
       "mode": "Light",
       "fgHex": "#4b5563",
-      "bgHex": "#f0f2f4",
-      "ratio": 6.73,
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar--sm",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
       "kind": "text",
-      "mode": "Light",
+      "mode": "Dark",
       "fgHex": "#4b5563",
-      "bgHex": "#f0f2f4",
-      "ratio": 6.73,
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar--lg",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--mini",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
       "kind": "text",
       "mode": "Light",
       "fgHex": "#4b5563",
-      "bgHex": "#f0f2f4",
-      "ratio": 6.73,
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar--circle",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--mini",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
       "kind": "text",
-      "mode": "Light",
+      "mode": "Dark",
       "fgHex": "#4b5563",
-      "bgHex": "#f0f2f4",
-      "ratio": 6.73,
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar ion-avatar__image",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--sm",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
       "kind": "text",
       "mode": "Light",
       "fgHex": "#4b5563",
-      "bgHex": "#f0f2f4",
-      "ratio": 6.73,
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
       "min": 4.5
     },
     {
-      "component": "avatar",
-      "context": "ion-avatar ion-avatar__icon",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--sm",
       "state": "default",
-      "fg": "--icon-tertiary",
-      "bg": "--surface-muted",
-      "backdrop": "--surface-muted",
-      "kind": "non-text",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#4b5563",
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
+      "min": 4.5
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--lg",
+      "state": "default",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
+      "kind": "text",
       "mode": "Light",
       "fgHex": "#4b5563",
-      "bgHex": "#f0f2f4",
-      "ratio": 6.73,
-      "min": 3
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
+      "min": 4.5
     },
     {
-      "component": "input",
-      "context": "ion-input ion-input__field",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--lg",
       "state": "default",
-      "fg": "--text-tertiary",
-      "bg": "--surface-page",
-      "backdrop": "--surface-page",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
       "kind": "text",
       "mode": "Dark",
-      "fgHex": "#9ca3b0",
-      "bgHex": "#131923",
-      "ratio": 6.95,
+      "fgHex": "#4b5563",
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
       "min": 4.5
     },
     {
-      "component": "input",
-      "context": "ion-input ion-input__icon-start",
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--slate",
       "state": "default",
-      "fg": "--icon-tertiary",
-      "bg": "--surface-page",
-      "backdrop": "--surface-page",
-      "kind": "non-text",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#4b5563",
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
+      "min": 4.5
+    },
+    {
+      "component": "avatar-gradient",
+      "context": "ion-avatar-gradient--slate",
+      "state": "default",
+      "fg": "--color-gray-600",
+      "bg": "--color-gray-50",
+      "backdrop": "--color-gray-50",
+      "kind": "text",
       "mode": "Dark",
-      "fgHex": "#9ca3b0",
-      "bgHex": "#131923",
-      "ratio": 6.95,
-      "min": 3
+      "fgHex": "#4b5563",
+      "bgHex": "#f6f8f9",
+      "ratio": 7.09,
+      "min": 4.5
     },
     {
       "component": "input",
@@ -1690,6 +1914,20 @@
       "ratio": 7.2,
       "min": 4.5
     },
+    {
+      "component": "button",
+      "context": "ion-button--destructive",
+      "state": "hover",
+      "fg": "--text-on-color",
+      "bg": "--surface-error-hover",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#ad1515",
+      "ratio": 7.25,
+      "min": 4.5
+    },
     {
       "component": "button",
       "context": "ion-button--success",
@@ -1704,6 +1942,34 @@
       "ratio": 7.34,
       "min": 4.5
     },
+    {
+      "component": "agent-stop",
+      "context": "ion-agent-stop",
+      "state": "hover",
+      "fg": "--text-error",
+      "bg": "--surface-error-subtle",
+      "backdrop": "--surface-default",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#ffadad",
+      "bgHex": "#650a0a",
+      "ratio": 7.39,
+      "min": 4.5
+    },
+    {
+      "component": "alert",
+      "context": "ion-alert--error",
+      "state": "default",
+      "fg": "--text-error",
+      "bg": "--surface-error-subtle",
+      "backdrop": "--surface-error-subtle",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#ffadad",
+      "bgHex": "#650a0a",
+      "ratio": 7.39,
+      "min": 4.5
+    },
     {
       "component": "alert",
       "context": "ion-alert--solid&ion-alert--information",
@@ -1718,6 +1984,20 @@
       "ratio": 7.47,
       "min": 4.5
     },
+    {
+      "component": "avatar",
+      "context": "ion-avatar__indicator--information ion-avatar__indicator--information",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-information",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#4f3cc8",
+      "ratio": 7.47,
+      "min": 4.5
+    },
     {
       "component": "toast",
       "context": "ion-toast ion-toast__icon",
@@ -1928,20 +2208,6 @@
       "ratio": 7.65,
       "min": 4.5
     },
-    {
-      "component": "agent-stop",
-      "context": "ion-agent-stop",
-      "state": "pressed",
-      "fg": "--text-default",
-      "bg": "--surface-error-subtle-hover",
-      "backdrop": "--surface-default",
-      "kind": "text",
-      "mode": "Dark",
-      "fgHex": "#f6f8f9",
-      "bgHex": "#981b1b",
-      "ratio": 7.86,
-      "min": 4.5
-    },
     {
       "component": "button",
       "context": "ion-button--success",
@@ -2026,20 +2292,6 @@
       "ratio": 8.28,
       "min": 3
     },
-    {
-      "component": "button",
-      "context": "ion-button--destructive",
-      "state": "pressed",
-      "fg": "--text-on-color",
-      "bg": "--surface-error-pressed",
-      "backdrop": null,
-      "kind": "text",
-      "mode": "Light",
-      "fgHex": "#ffffff",
-      "bgHex": "#981b1b",
-      "ratio": 8.37,
-      "min": 4.5
-    },
     {
       "component": "approval-gate",
       "context": "ion-approval-gate__action--approve ion-approval-gate__action--approve",
@@ -2521,6 +2773,20 @@
       "ratio": 9.53,
       "min": 4.5
     },
+    {
+      "component": "agent-stop",
+      "context": "ion-agent-stop",
+      "state": "pressed",
+      "fg": "--text-default",
+      "bg": "--surface-error-subtle-hover",
+      "backdrop": "--surface-default",
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#f6f8f9",
+      "bgHex": "#850e0e",
+      "ratio": 9.54,
+      "min": 4.5
+    },
     {
       "component": "toast",
       "context": "ion-toast ion-toast__action",
@@ -2887,6 +3153,20 @@
       "ratio": 10.15,
       "min": 3
     },
+    {
+      "component": "button",
+      "context": "ion-button--destructive",
+      "state": "pressed",
+      "fg": "--text-on-color",
+      "bg": "--surface-error-pressed",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#850e0e",
+      "ratio": 10.16,
+      "min": 4.5
+    },
     {
       "component": "table",
       "context": "ion-table",
@@ -3523,6 +3803,20 @@
       "ratio": 15.07,
       "min": 4.5
     },
+    {
+      "component": "avatar",
+      "context": "ion-avatar__indicator--neutral ion-avatar__indicator--neutral",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-inverse",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Light",
+      "fgHex": "#ffffff",
+      "bgHex": "#1d2735",
+      "ratio": 15.07,
+      "min": 4.5
+    },
     {
       "component": "button",
       "context": "ion-button--primary-neutral",
@@ -4504,6 +4798,20 @@
       "ratio": 21,
       "min": 4.5
     },
+    {
+      "component": "avatar",
+      "context": "ion-avatar__indicator--neutral ion-avatar__indicator--neutral",
+      "state": "default",
+      "fg": "--text-on-color",
+      "bg": "--surface-inverse",
+      "backdrop": null,
+      "kind": "text",
+      "mode": "Dark",
+      "fgHex": "#000000",
+      "bgHex": "#ffffff",
+      "ratio": 21,
+      "min": 4.5
+    },
     {
       "component": "button",
       "context": "ion-button--primary-neutral",