@aurodesignsystem/design-tokens 5.2.1 → 5.3.1

package/dist/hawaiian/SCSSVariables--hawaiian.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Thu, 06 Mar 2025 21:22:14 GMT
+// Generated on Fri, 14 Mar 2025 18:27:56 GMT
 
 $ds-color-border-bold: #adadad;
 $ds-color-border-brand: #d0d0d0;
@@ -55,6 +55,53 @@ $ds-color-texticon-disabled: #d0d0d0;
 $ds-color-texticon-inverse: #ffffff;
 $ds-color-texticon-inverse-disabled: #d0d0d0;
 $ds-color-texticon-muted: #3d3d3d;
+$ds-component-selected-hover: #31295c;
+$ds-component-focused: #463c8f;
+$ds-component-inverse-focused: #ffffff;
+$ds-component-background: #ffffff;
+$ds-component-background-hover: #f2f2f2;
+$ds-component-background-disabled: #dddddd;
+$ds-component-background-muted: #f7f7f7;
+$ds-component-background-strong: #7e7e7e;
+$ds-component-button-primary-text: #ffffff;
+$ds-component-button-primary-border: #ce0c88;
+$ds-component-button-primary-border-hover: #831a57;
+$ds-component-button-primary-background: #ce0c88;
+$ds-component-button-primary-background-hover: #831a57;
+$ds-component-button-primary-background-active: #831a57;
+$ds-component-button-primary-text-inverse: #ce0c88;
+$ds-component-button-primary-border-inverse: #ffffff;
+$ds-component-button-primary-background-inverse: #ffffff;
+$ds-component-button-primary-border-inverse-hover: #fdf1f8;
+$ds-component-button-primary-background-inverse-hover: #fdf1f8;
+$ds-component-button-secondary-text: #ce0c88;
+$ds-component-button-secondary-text-hover: #463c8f;
+$ds-component-button-secondary-border: #d0d0d0;
+$ds-component-button-secondary-border-hover: #d0d0d0;
+$ds-component-button-secondary-background: #ffffff;
+$ds-component-button-secondary-background-hover: #f2f2f2;
+$ds-component-button-secondary-text-inverse: #ffffff;
+$ds-component-button-secondary-border-inverse: #ffffff;
+$ds-component-button-secondary-background-inverse-hover: #0000000d;
+$ds-component-button-tertiary-text: #ce0c88;
+$ds-component-button-tertiary-text-hover: #831a57;
+$ds-component-button-tertiary-background: #0000000d;
+$ds-component-button-tertiary-background-hover: #0000001a;
+$ds-component-button-tertiary-border: #0000000d;
+$ds-component-button-tertiary-border-hover: #0000001a;
+$ds-component-button-tertiary-text-inverse: #ffffff;
+$ds-component-button-tertiary-background-inverse: #ffffff0d;
+$ds-component-button-tertiary-background-inverse-hover: #ffffff1a;
+$ds-component-button-tertiary-border-inverse: #ffffff0d;
+$ds-component-button-tertiary-border-inverse-hover: #ffffff1a;
+$ds-component-boolean-indicator: #ffffff;
+$ds-component-boolean-is-false: #ffffff;
+$ds-component-boolean-is-false-hover: #f2f2f2;
+$ds-component-boolean-is-false-border: #adadad;
+$ds-component-boolean-is-true: #ce0c88;
+$ds-component-boolean-is-true-hover: #831a57;
+$ds-component-boolean-error: #e53339;
+$ds-component-boolean-error-hover: #b1161c;
 $ds-font-weight-display: Semibold;
 $ds-font-weight-body-default: Regular;
 $ds-font-weight-body-large: Regular;

package/dist/hawaiian/SCSSVariablesMapFlat--hawaiian.scss

@@ -1,7 +1,7 @@
 
 /*
   Do not edit directly
-  Generated on Thu, 06 Mar 2025 21:22:14 GMT
+  Generated on Fri, 14 Mar 2025 18:27:56 GMT
 */
 
 $auroTokens: (
@@ -58,6 +58,53 @@ $auroTokens: (
   'ds-color-texticon-inverse': (#ffffff),
   'ds-color-texticon-inverse-disabled': (#d0d0d0),
   'ds-color-texticon-muted': (#3d3d3d),
+  'ds-component-selected-hover': (#31295c),
+  'ds-component-focused': (#463c8f),
+  'ds-component-inverse-focused': (#ffffff),
+  'ds-component-background': (#ffffff),
+  'ds-component-background-hover': (#f2f2f2),
+  'ds-component-background-disabled': (#dddddd),
+  'ds-component-background-muted': (#f7f7f7),
+  'ds-component-background-strong': (#7e7e7e),
+  'ds-component-button-primary-text': (#ffffff),
+  'ds-component-button-primary-border': (#ce0c88),
+  'ds-component-button-primary-border-hover': (#831a57),
+  'ds-component-button-primary-background': (#ce0c88),
+  'ds-component-button-primary-background-hover': (#831a57),
+  'ds-component-button-primary-background-active': (#831a57),
+  'ds-component-button-primary-text-inverse': (#ce0c88),
+  'ds-component-button-primary-border-inverse': (#ffffff),
+  'ds-component-button-primary-background-inverse': (#ffffff),
+  'ds-component-button-primary-border-inverse-hover': (#fdf1f8),
+  'ds-component-button-primary-background-inverse-hover': (#fdf1f8),
+  'ds-component-button-secondary-text': (#ce0c88),
+  'ds-component-button-secondary-text-hover': (#463c8f),
+  'ds-component-button-secondary-border': (#d0d0d0),
+  'ds-component-button-secondary-border-hover': (#d0d0d0),
+  'ds-component-button-secondary-background': (#ffffff),
+  'ds-component-button-secondary-background-hover': (#f2f2f2),
+  'ds-component-button-secondary-text-inverse': (#ffffff),
+  'ds-component-button-secondary-border-inverse': (#ffffff),
+  'ds-component-button-secondary-background-inverse-hover': (#0000000d),
+  'ds-component-button-tertiary-text': (#ce0c88),
+  'ds-component-button-tertiary-text-hover': (#831a57),
+  'ds-component-button-tertiary-background': (#0000000d),
+  'ds-component-button-tertiary-background-hover': (#0000001a),
+  'ds-component-button-tertiary-border': (#0000000d),
+  'ds-component-button-tertiary-border-hover': (#0000001a),
+  'ds-component-button-tertiary-text-inverse': (#ffffff),
+  'ds-component-button-tertiary-background-inverse': (#ffffff0d),
+  'ds-component-button-tertiary-background-inverse-hover': (#ffffff1a),
+  'ds-component-button-tertiary-border-inverse': (#ffffff0d),
+  'ds-component-button-tertiary-border-inverse-hover': (#ffffff1a),
+  'ds-component-boolean-indicator': (#ffffff),
+  'ds-component-boolean-is-false': (#ffffff),
+  'ds-component-boolean-is-false-hover': (#f2f2f2),
+  'ds-component-boolean-is-false-border': (#adadad),
+  'ds-component-boolean-is-true': (#ce0c88),
+  'ds-component-boolean-is-true-hover': (#831a57),
+  'ds-component-boolean-error': (#e53339),
+  'ds-component-boolean-error-hover': (#b1161c),
   'ds-font-weight-display': (Semibold),
   'ds-font-weight-body-default': (Regular),
   'ds-font-weight-body-large': (Regular),

package/dist/hawaiian/primitives--hawaiian.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Thu, 06 Mar 2025 21:22:14 GMT
+// Generated on Fri, 14 Mar 2025 18:27:56 GMT
 
 $hi-color-status-help-100: #e8f2f8;
 $hi-color-status-help-200: #dbe6f0;

package/dist/transparent/CSSCustomProperties--transparent.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 06 Mar 2025 21:22:14 GMT
+ * Generated on Fri, 14 Mar 2025 18:27:56 GMT
  */
 
 :root {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aurodesignsystem/design-tokens",
-  "version": "5.2.1",
+  "version": "5.3.1",
   "description": "Alaska Air Auro Design System token repository",
   "homepage": "https://github.com/AlaskaAirlines/DesignTokens",
   "author": "Alaska Airlines Product design and engineering",
@@ -15,7 +15,8 @@
     "node": ">=20"
   },
   "dependencies": {
-    "chalk": "^5.3.0"
+    "chalk": "^5.3.0",
+    "postcss": "^8.5.3"
   },
   "devDependencies": {
     "@commitlint/cli": "^19.5.0",

package/src/themes/alaska/component.json

@@ -0,0 +1,392 @@
+{
+  "component": {
+    "selected": {
+      "hover": {
+        "value": "{color.brand.primaryBold.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Selected hover state color",
+        "deprecated": false
+      }
+    },
+    "focused": {
+      "value": "{color.brand.primary.value}",
+      "type": "semantic",
+      "public": true,
+      "default": true,
+      "usage": "Focused component color",
+      "deprecated": false
+    },
+    "inverseFocused": {
+      "value": "{color.white.value}",
+      "type": "semantic",
+      "public": true,
+      "default": true,
+      "usage": "Inverse focused component color",
+      "deprecated": false
+    },
+    "background": {
+      "value": "{color.white.value}",
+      "type": "semantic",
+      "public": true,
+      "default": true,
+      "usage": "Component background color",
+      "deprecated": false
+    },
+    "backgroundHover": {
+      "value": "{color.gray.100.value}",
+      "type": "semantic",
+      "public": true,
+      "default": true,
+      "usage": "Component background hover color",
+      "deprecated": false
+    },
+    "backgroundDisabled": {
+      "value": "{color.gray.200.value}",
+      "type": "semantic",
+      "public": true,
+      "default": true,
+      "usage": "Component background disabled color",
+      "deprecated": false
+    },
+    "backgroundMuted": {
+      "value": "{color.gray.50.value}",
+      "type": "semantic",
+      "public": true,
+      "default": true,
+      "usage": "Component background muted color",
+      "deprecated": false
+    },
+    "backgroundStrong": {
+      "value": "{color.gray.600.value}",
+      "type": "semantic",
+      "public": true,
+      "default": true,
+      "usage": "Component background strong color",
+      "deprecated": false
+    },
+    "button": {
+      "primary": {
+        "text": {
+          "value": "{color.white.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button text color",
+          "deprecated": false
+        },
+        "border": {
+          "value": "{color.brand.primary.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button border color",
+          "deprecated": false
+        },
+        "borderHover": {
+          "value": "{color.brand.primaryBold.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button border hover color",
+          "deprecated": false
+        },
+        "background": {
+          "value": "{color.brand.primary.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button background color",
+          "deprecated": false
+        },
+        "backgroundHover": {
+          "value": "{color.brand.primaryBold.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button background hover color",
+          "deprecated": false
+        },
+        "backgroundActive": {
+          "value": "{color.brand.primaryBold.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button background active color",
+          "deprecated": false
+        },
+        "textInverse": {
+          "value": "{color.brand.primary.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button inverse text color",
+          "deprecated": false
+        },
+        "borderInverse": {
+          "value": "{color.white.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button inverse border color",
+          "deprecated": false
+        },
+        "backgroundInverse": {
+          "value": "{color.white.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button inverse background color",
+          "deprecated": false
+        },
+        "borderInverseHover": {
+          "value": "{color.brand.primaryMuted.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button inverse border hover color",
+          "deprecated": false
+        },
+        "backgroundInverseHover": {
+          "value": "{color.brand.primaryMuted.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Primary button inverse background hover color",
+          "deprecated": false
+        }
+      },
+      "secondary": {
+        "text": {
+          "value": "{color.brand.primary.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button text color",
+          "deprecated": false
+        },
+        "textHover": {
+          "value": "{color.brand.primaryBold.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button text hover color",
+          "deprecated": false
+        },
+        "border": {
+          "value": "{color.brand.primary.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button border color",
+          "deprecated": false
+        },
+        "borderHover": {
+          "value": "{color.brand.primaryBold.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button border hover color",
+          "deprecated": false
+        },
+        "background": {
+          "value": "{transparency.white.80.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button background color",
+          "deprecated": false
+        },
+        "backgroundHover": {
+          "value": "{transparency.white.50.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button background hover color",
+          "deprecated": false
+        },
+        "textInverse": {
+          "value": "{color.white.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button inverse text color",
+          "deprecated": false
+        },
+        "borderInverse": {
+          "value": "{color.white.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button inverse border color",
+          "deprecated": false
+        },
+        "backgroundInverseHover": {
+          "value": "{transparency.white.80.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Secondary button inverse background hover color",
+          "deprecated": false
+        }
+      },
+      "tertiary": {
+        "text": {
+          "value": "{color.brand.primary.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button text color",
+          "deprecated": false
+        },
+        "textHover": {
+          "value": "{color.brand.primaryBold.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button text hover color",
+          "deprecated": false
+        },
+        "background": {
+          "value": "{transparency.black.5.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button background color",
+          "deprecated": false
+        },
+        "backgroundHover": {
+          "value": "{transparency.black.10.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button background hover color",
+          "deprecated": false
+        },
+        "border": {
+          "value": "{transparency.black.5.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button border color",
+          "deprecated": false
+        },
+        "borderHover": {
+          "value": "{transparency.black.10.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button border hover color",
+          "deprecated": false
+        },
+        "textInverse": {
+          "value": "{color.white.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button inverse text color",
+          "deprecated": false
+        },
+        "backgroundInverse": {
+          "value": "{transparency.white.5.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button inverse background color",
+          "deprecated": false
+        },
+        "backgroundInverseHover": {
+          "value": "{transparency.white.10.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button inverse background hover color",
+          "deprecated": false
+        },
+        "borderInverse": {
+          "value": "{transparency.white.5.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button inverse border color",
+          "deprecated": false
+        },
+        "borderInverseHover": {
+          "value": "{transparency.white.10.value}",
+          "type": "semantic",
+          "public": true,
+          "default": true,
+          "usage": "Tertiary button inverse border hover color",
+          "deprecated": false
+        }
+      }
+    },
+    "boolean": {
+      "indicator": {
+        "value": "{color.white.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Boolean indicator color",
+        "deprecated": false
+      },
+      "isFalse": {
+        "value": "{color.surface.default.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Boolean false state color",
+        "deprecated": false
+      },
+      "isFalseHover": {
+        "value": "{color.gray.100.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Boolean false hover state color",
+        "deprecated": false
+      },
+      "isFalseBorder": {
+        "value": "{color.border.bold.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Boolean false border color",
+        "deprecated": false
+      },
+      "isTrue": {
+        "value": "{color.brand.primary.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Boolean true state color",
+        "deprecated": false
+      },
+      "isTrueHover": {
+        "value": "{color.brand.primaryBold.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Boolean true hover state color",
+        "deprecated": false
+      },
+      "error": {
+        "value": "{color.status.error.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Boolean error state color",
+        "deprecated": false
+      },
+      "errorHover": {
+        "value": "{color.status.error.800.value}",
+        "type": "semantic",
+        "public": true,
+        "default": true,
+        "usage": "Boolean error hover state color",
+        "deprecated": false
+      }
+    }
+  }
+}