@brunosouzas/design-system 0.5.2 → 0.6.0

package/tokens/generated/tokens.css

@@ -8,6 +8,36 @@
   --ds-body-diagram-ring-radius: 70px;
   --ds-body-diagram-start-radius: 11px;
   --ds-body-diagram-width: 800px;
+  --ds-brand-dark-accent: #FF7A45;
+  --ds-brand-dark-accent-text: #FF7A45;
+  --ds-brand-dark-bg: #121110;
+  --ds-brand-dark-border: #3B3834;
+  --ds-brand-dark-border-strong: #ADA79D;
+  --ds-brand-dark-card-bg: #1D1C1A;
+  --ds-brand-dark-failure: #FF6696;
+  --ds-brand-dark-on-accent: #121110;
+  --ds-brand-dark-success: #5BBF86;
+  --ds-brand-dark-text: #F1EEE8;
+  --ds-brand-dark-text-muted: #ADA79D;
+  --ds-brand-dark-track-ai: #1B1F28;
+  --ds-brand-dark-track-delivery: #18231D;
+  --ds-brand-dark-track-integration: #2A1C15;
+  --ds-brand-dark-warning: #EBB34B;
+  --ds-brand-light-accent: #E04E17;
+  --ds-brand-light-accent-text: #B83A0C;
+  --ds-brand-light-bg: #F6F3EC;
+  --ds-brand-light-border: #D7D1C5;
+  --ds-brand-light-border-strong: #5C5852;
+  --ds-brand-light-card-bg: #FFFFFF;
+  --ds-brand-light-failure: #A1124B;
+  --ds-brand-light-on-accent: #FFFFFF;
+  --ds-brand-light-success: #2B7A4B;
+  --ds-brand-light-text: #121212;
+  --ds-brand-light-text-muted: #5C5852;
+  --ds-brand-light-track-ai: #E2E4EC;
+  --ds-brand-light-track-delivery: #DFE8E1;
+  --ds-brand-light-track-integration: #F4E4D8;
+  --ds-brand-light-warning: #8F5F00;
   --ds-cast-agent-neck: #E3E8F5;
   --ds-cast-agent-shine: #E6ECFF;
   --ds-cast-architect-fill: #22B5A4;
@@ -24,6 +54,7 @@
   --ds-cast-emote-pop-damping: 9;
   --ds-cast-emote-pop-mass: 0.7;
   --ds-cast-emote-pop-stiffness: 170;
+  --ds-cast-eyes: #FFC98A;
   --ds-cast-glow: #7FD1FF;
   --ds-cast-ground: #D3DBF5;
   --ds-cast-metal: #C9D2E8;
@@ -38,6 +69,13 @@
   --ds-color-ink: #0A1033;
   --ds-color-panel: #EEF2FF;
   --ds-color-ring: #E0E7FB;
+  --ds-color-state-backend: #FF6B6B;
+  --ds-color-state-blocked: #FF8A3D;
+  --ds-color-state-caller: #8FB2FF;
+  --ds-color-state-fail-fast: #E0661F;
+  --ds-color-state-failure: #E04848;
+  --ds-color-state-healthy: #3DDC84;
+  --ds-color-state-transitional: #FFD25A;
   --ds-color-transitional: #FFD25A;
   --ds-color-white: #FFFFFF;
   --ds-cover-height: 420px;
@@ -47,6 +85,7 @@
   --ds-cover-ring-radius: 90px;
   --ds-cover-ring-step: 28px;
   --ds-cover-ring-width: 2px;
+  --ds-cover-signature-margin: 24px;
   --ds-cover-width: 800px;
   --ds-cover-background-blush-fill: #F6CFE0;
   --ds-cover-background-blush-ring: #ECBAD0;
@@ -86,6 +125,12 @@
   --ds-cover-background-slate-ring: #38466A;
   --ds-cover-background-teal-fill: #1F8A8A;
   --ds-cover-background-teal-ring: #2A9A99;
+  --ds-cover-background-track-ai-fill: #E2E4EC;
+  --ds-cover-background-track-ai-ring: #C7C9D0;
+  --ds-cover-background-track-delivery-fill: #DFE8E1;
+  --ds-cover-background-track-delivery-ring: #C4CCC6;
+  --ds-cover-background-track-integration-fill: #F4E4D8;
+  --ds-cover-background-track-integration-ring: #D7C9BE;
   --ds-cover-background-violet-fill: #5B3CC4;
   --ds-cover-background-violet-ring: #6748CF;
   --ds-cover-background-wine-fill: #6B2340;
@@ -176,6 +221,10 @@
   --ds-site-light-text: #444444;
   --ds-site-light-text-dark: #040404;
   --ds-site-light-text-light: #717171;
+  --ds-surface-dark-backdrop-credit: #9AA6D6;
+  --ds-surface-dark-backdrop-park: #183F52;
+  --ds-surface-dark-backdrop-water: #1E3175;
+  --ds-surface-dark-backdrop-water-edge: #2A3F8A;
   --ds-surface-dark-background: #14215A;
   --ds-surface-dark-grid: #1C2D74;
   --ds-surface-dark-muted: #8F9BD0;
@@ -185,6 +234,10 @@
   --ds-surface-dark-shadow: #4C5CB8;
   --ds-surface-dark-text: #EEF2FF;
   --ds-surface-dark-zone-opacity: 0.22;
+  --ds-surface-light-backdrop-credit: #5A6385;
+  --ds-surface-light-backdrop-park: #D4F2DF;
+  --ds-surface-light-backdrop-water: #C9D8FF;
+  --ds-surface-light-backdrop-water-edge: #B5C7F5;
   --ds-surface-light-background: #EEF2FF;
   --ds-surface-light-grid: #E0E7FB;
   --ds-surface-light-muted: #5B6694;

package/tokens/generated/tokens.json

@@ -11,6 +11,42 @@
     "startRadius": 11,
     "width": 800
   },
+  "brand": {
+    "dark": {
+      "accent": "#FF7A45",
+      "accentText": "#FF7A45",
+      "bg": "#121110",
+      "border": "#3B3834",
+      "borderStrong": "#ADA79D",
+      "cardBg": "#1D1C1A",
+      "failure": "#FF6696",
+      "onAccent": "#121110",
+      "success": "#5BBF86",
+      "text": "#F1EEE8",
+      "textMuted": "#ADA79D",
+      "trackAi": "#1B1F28",
+      "trackDelivery": "#18231D",
+      "trackIntegration": "#2A1C15",
+      "warning": "#EBB34B"
+    },
+    "light": {
+      "accent": "#E04E17",
+      "accentText": "#B83A0C",
+      "bg": "#F6F3EC",
+      "border": "#D7D1C5",
+      "borderStrong": "#5C5852",
+      "cardBg": "#FFFFFF",
+      "failure": "#A1124B",
+      "onAccent": "#FFFFFF",
+      "success": "#2B7A4B",
+      "text": "#121212",
+      "textMuted": "#5C5852",
+      "trackAi": "#E2E4EC",
+      "trackDelivery": "#DFE8E1",
+      "trackIntegration": "#F4E4D8",
+      "warning": "#8F5F00"
+    }
+  },
   "cast": {
     "agent": {
       "neck": "#E3E8F5",
@@ -40,6 +76,7 @@
       "mass": 0.7,
       "stiffness": 170
     },
+    "eyes": "#FFC98A",
     "glow": "#7FD1FF",
     "ground": "#D3DBF5",
     "metal": "#C9D2E8",
@@ -58,6 +95,15 @@
     "ink": "#0A1033",
     "panel": "#EEF2FF",
     "ring": "#E0E7FB",
+    "state": {
+      "backend": "#FF6B6B",
+      "blocked": "#FF8A3D",
+      "caller": "#8FB2FF",
+      "failFast": "#E0661F",
+      "failure": "#E04848",
+      "healthy": "#3DDC84",
+      "transitional": "#FFD25A"
+    },
     "transitional": "#FFD25A",
     "white": "#FFFFFF"
   },
@@ -69,6 +115,7 @@
     "ringRadius": 90,
     "ringStep": 28,
     "ringWidth": 2,
+    "signatureMargin": 24,
     "width": 800
   },
   "coverBackground": {
@@ -148,6 +195,18 @@
       "fill": "#1F8A8A",
       "ring": "#2A9A99"
     },
+    "trackAi": {
+      "fill": "#E2E4EC",
+      "ring": "#C7C9D0"
+    },
+    "trackDelivery": {
+      "fill": "#DFE8E1",
+      "ring": "#C4CCC6"
+    },
+    "trackIntegration": {
+      "fill": "#F4E4D8",
+      "ring": "#D7C9BE"
+    },
     "violet": {
       "fill": "#5B3CC4",
       "ring": "#6748CF"
@@ -275,6 +334,10 @@
   },
   "surface": {
     "dark": {
+      "backdropCredit": "#9AA6D6",
+      "backdropPark": "#183F52",
+      "backdropWater": "#1E3175",
+      "backdropWaterEdge": "#2A3F8A",
       "background": "#14215A",
       "grid": "#1C2D74",
       "muted": "#8F9BD0",
@@ -286,6 +349,10 @@
       "zoneOpacity": 0.22
     },
     "light": {
+      "backdropCredit": "#5A6385",
+      "backdropPark": "#D4F2DF",
+      "backdropWater": "#C9D8FF",
+      "backdropWaterEdge": "#B5C7F5",
       "background": "#EEF2FF",
       "grid": "#E0E7FB",
       "muted": "#5B6694",

package/tokens/generated/tokens.ts

@@ -13,6 +13,42 @@ export const tokens = {
     "startRadius": 11,
     "width": 800
   },
+  "brand": {
+    "dark": {
+      "accent": "#FF7A45",
+      "accentText": "#FF7A45",
+      "bg": "#121110",
+      "border": "#3B3834",
+      "borderStrong": "#ADA79D",
+      "cardBg": "#1D1C1A",
+      "failure": "#FF6696",
+      "onAccent": "#121110",
+      "success": "#5BBF86",
+      "text": "#F1EEE8",
+      "textMuted": "#ADA79D",
+      "trackAi": "#1B1F28",
+      "trackDelivery": "#18231D",
+      "trackIntegration": "#2A1C15",
+      "warning": "#EBB34B"
+    },
+    "light": {
+      "accent": "#E04E17",
+      "accentText": "#B83A0C",
+      "bg": "#F6F3EC",
+      "border": "#D7D1C5",
+      "borderStrong": "#5C5852",
+      "cardBg": "#FFFFFF",
+      "failure": "#A1124B",
+      "onAccent": "#FFFFFF",
+      "success": "#2B7A4B",
+      "text": "#121212",
+      "textMuted": "#5C5852",
+      "trackAi": "#E2E4EC",
+      "trackDelivery": "#DFE8E1",
+      "trackIntegration": "#F4E4D8",
+      "warning": "#8F5F00"
+    }
+  },
   "cast": {
     "agent": {
       "neck": "#E3E8F5",
@@ -42,6 +78,7 @@ export const tokens = {
       "mass": 0.7,
       "stiffness": 170
     },
+    "eyes": "#FFC98A",
     "glow": "#7FD1FF",
     "ground": "#D3DBF5",
     "metal": "#C9D2E8",
@@ -60,6 +97,15 @@ export const tokens = {
     "ink": "#0A1033",
     "panel": "#EEF2FF",
     "ring": "#E0E7FB",
+    "state": {
+      "backend": "#FF6B6B",
+      "blocked": "#FF8A3D",
+      "caller": "#8FB2FF",
+      "failFast": "#E0661F",
+      "failure": "#E04848",
+      "healthy": "#3DDC84",
+      "transitional": "#FFD25A"
+    },
     "transitional": "#FFD25A",
     "white": "#FFFFFF"
   },
@@ -71,6 +117,7 @@ export const tokens = {
     "ringRadius": 90,
     "ringStep": 28,
     "ringWidth": 2,
+    "signatureMargin": 24,
     "width": 800
   },
   "coverBackground": {
@@ -150,6 +197,18 @@ export const tokens = {
       "fill": "#1F8A8A",
       "ring": "#2A9A99"
     },
+    "trackAi": {
+      "fill": "#E2E4EC",
+      "ring": "#C7C9D0"
+    },
+    "trackDelivery": {
+      "fill": "#DFE8E1",
+      "ring": "#C4CCC6"
+    },
+    "trackIntegration": {
+      "fill": "#F4E4D8",
+      "ring": "#D7C9BE"
+    },
     "violet": {
       "fill": "#5B3CC4",
       "ring": "#6748CF"
@@ -277,6 +336,10 @@ export const tokens = {
   },
   "surface": {
     "dark": {
+      "backdropCredit": "#9AA6D6",
+      "backdropPark": "#183F52",
+      "backdropWater": "#1E3175",
+      "backdropWaterEdge": "#2A3F8A",
       "background": "#14215A",
       "grid": "#1C2D74",
       "muted": "#8F9BD0",
@@ -288,6 +351,10 @@ export const tokens = {
       "zoneOpacity": 0.22
     },
     "light": {
+      "backdropCredit": "#5A6385",
+      "backdropPark": "#D4F2DF",
+      "backdropWater": "#C9D8FF",
+      "backdropWaterEdge": "#B5C7F5",
       "background": "#EEF2FF",
       "grid": "#E0E7FB",
       "muted": "#5B6694",