@aurodesignsystem/design-tokens - npm Package Compare versions

Comparing version 4.0.0 to 4.1.0

CHANGELOG.md

 # Semantic Release Automated Changelog
 
+# [4.1.0](https://github.com/AlaskaAirlines/AuroDesignTokens/compare/v4.0.0...v4.1.0) (2023-09-14)
+
+
+### Features
+
+* edit tokens for better control of output ([9a1521b](https://github.com/AlaskaAirlines/AuroDesignTokens/commit/9a1521b68472c6ce664e555fb12c8d39565cc2c6))
+
 # [4.0.0](https://github.com/AlaskaAirlines/AuroDesignTokens/compare/v3.15.5...v4.0.0) (2023-09-13)
@@ -4,0 +11,0 @@

dist/tokens/JSVariables--color.js

 /**
  * Do not edit directly
- * Generated on Wed, 13 Sep 2023 17:26:39 GMT
+ * Generated on Thu, 14 Sep 2023 15:47:12 GMT
  */
@@ -5,0 +5,0 @@

package.json

 {
   "name": "@aurodesignsystem/design-tokens",
-  "version": "4.0.0",
+  "version": "4.1.0",
   "description": "Alaska Air Auro Design System token repository",
@@ -5,0 +5,0 @@ "homepage": "https://github.com/AlaskaAirlines/DesignTokens",

README.md

@@ -6,7 +6,7 @@ # Auro Design Tokens
 [![Build Status](https://img.shields.io/github/actions/workflow/status/AlaskaAirlines/AuroDesignTokens/testPublish.yml?branch=master&style=for-the-badge)](https://github.com/AlaskaAirlines/AuroDesignTokens/actions/workflows/testPublish.yml)
-[![See it on NPM!](https://img.shields.io/npm/v/@alaskaairux/design-tokens.svg?style=for-the-badge&color=orange)](https://www.npmjs.com/package/@alaskaairux/design-tokens)
-[![License](https://img.shields.io/npm/l/@alaskaairux/design-tokens.svg?color=blue&style=for-the-badge)](https://www.apache.org/licenses/LICENSE-2.0)
+[![See it on NPM!](https://img.shields.io/npm/v/@aurodesignsystem/design-tokens.svg?style=for-the-badge&color=orange)](https://www.npmjs.com/package/@aurodesignsystem/design-tokens)
+[![License](https://img.shields.io/npm/l/@aurodesignsystem/design-tokens.svg?color=blue&style=for-the-badge)](https://www.apache.org/licenses/LICENSE-2.0)
 
 ```
-$ npm i @alaskaairux/design-tokens
+$ npm i @aurodesignsystem/design-tokens
 ```
@@ -16,3 +16,3 @@
 
-Located in the `./dist/tokens` directory of the [npm](https://www.npmjs.com/package/@alaskaairux/design-tokens).
+Located in the `./dist/tokens` directory of the [npm](https://www.npmjs.com/package/@aurodesignsystem/design-tokens).
 
@@ -22,4 +22,2 @@ ```
    ├── CSSCustomProperties.css
-   ├── CSSCustomPropertiesColorRGB.css
-   ├── CSSOpacityProperties.scss
    ├── CSSSizeCustomProperties.css
@@ -30,3 +28,2 @@ ├── JSData--color.js
    ├── JSVariables--color.js
-   ├── SCSSOpacityVariables.scss
    ├── SCSSVariableMap.scss
@@ -36,4 +33,11 @@ ├── SCSSVariables.scss
    ├── SassCustomProperties.scss
-   ├── SassCustomPropertiesColorRGB.scss
-   └── SassSizeCustomProperties.scss
+   ├── SassSizeCustomProperties.scss
+   └── darkmode
+      ├── CSSCustomProperties.css
+      ├── JSDataColor.js
+      ├── JSObject--allDarkTokens.js
+      ├── JSVariablesColor.js
+      ├── SCSSVariables.scss
+      ├── SCSSVariablesMapFlat.scss
+      └── SassCustomProperties.scss
 ```
@@ -46,4 +50,2 @@
 | CSSCustomProperties | CSS | custom properties | current | full list of v3.0x release tokens |
-| CSSCustomPropertiesColorRGB | CSS | custom properties | current| Filter: color, public<br>custom RGB output
-| CSSOpacityProperties | Sass | custom properties | current | filter: opacity |
 | CSSSizeCustomProperties | CSS | custom properties | current | filter: size, public |
@@ -54,3 +56,2 @@ | JSData--color | JS module | color data | current | filter: color, current |
 | JSVariables--color | js es6 | color data | current | filter: color |
-| SCSSOpacityVariables | Sass | Sass variables | current | filter: opacity |
 | SCSSVariableMap | Sass | Sass variable map | current | filter: size, public |
@@ -60,3 +61,2 @@ | SCSSVariables | scss | Sass variables | current | full list of v3.0x release tokens |
 | SassCustomProperties | scss | custom properties | current | full list of v3.0x release tokens |
-| SassCustomPropertiesColorRGB | Sass | custom properties | current| Filter: color, public<br>custom RGB output
 | SassSizeCustomProperties | Sass | custom properties | current | filter: size, public |
@@ -68,7 +68,7 @@
 ```scss
-@import "~@alaskaairux/design-tokens/dist/tokens/SCSSVariables";
+@import "~@aurodesignsystem/design-tokens/dist/tokens/SCSSVariables";
 
 // or
 
-@import "~@alaskaairux/design-tokens/dist/tokens/SassCustomProperties";
+@import "~@aurodesignsystem/design-tokens/dist/tokens/SassCustomProperties";
 ```
@@ -81,3 +81,3 @@
 ```js
-import "@alaskaairux/design-tokens/dist/tokens/CSSCustomProperties.css"
+import "@aurodesignsystem/design-tokens/dist/tokens/CSSCustomProperties.css"
 ```
@@ -89,6 +89,6 @@
 
-Within a webpacked application or a `type="module"` script:
+Within a webpack supported application or a `type="module"` script:
 
 ```js
-import { AuroColorAlertNotificationOnLight, AuroColorBorderErrorOnLight } from '@alaskaairux/design-tokens/dist/tokens/JSVariables--color.js';
+import { AuroColorAlertNotificationOnLight, AuroColorBorderErrorOnLight } from '@aurodesignsystem/design-tokens/dist/tokens/JSVariables--color.js';
 ```
@@ -98,12 +98,6 @@
 
-Using unpkg.com, every file in the dist directory can be accessed.
+Using the `https://cdn.jsdelivr.net/npm/` CDN,  every file in the dist directory can be accessed like so.
 
 ```html
-<link rel="stylesheet" href="https://unpkg.com/@alaskaairux/design-tokens@latest/dist/tokens/CSSCustomProperties.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm//@aurodesignsystem/design-tokens@latest/dist/tokens/CSSCustomProperties.css">
 ```
-
-For specifically the CSSCustomProperties.css file, a faster CDN resource is available.
-
-```html
-<link rel="stylesheet" href="https://p2pcontent-fd-prod.azurefd.net/auro/tokens/CSSCustomProperties.css">
-```

src/color-darkmode/base.json

@@ -5,137 +5,17 @@ {
       "white": {
-        "value": "ffffff",
+        "value": "000000",
         "comment": "{comments.color.base.value.comment}",
         "public": true,
-        "deprecated": false
+        "deprecated": false,
+        "darkmode": true
       },
-      "white-opacity-40": {
-        "value": "ffffff66",
-        "comment": "white @ 40%",
-        "public": true,
-        "opacity": true,
-        "deprecated": false
-      },
       "black": {
-        "value": "000000",
+        "value": "ffffff",
         "comment": "{comments.color.base.value.comment}",
         "public": true,
-        "deprecated": false
-      },
-      "black-opacity-15": {
-        "value": "00000026",
-        "comment": "black @ 15%",
-        "public": true,
-        "opacity": true,
-        "deprecated": false
-      },
-      "gray": {
-        "100": {
-          "value": "f8f8f8",
-          "version": "3.1.0",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "reference": "color-brand-gray-100",
-          "comment": "{comments.reference.comment} color-brand-gray-100"
-        },
-        "200": {
-          "value": "dbdbdb",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-gray-200",
-          "comment": "{comments.reference.comment} color-brand-gray-200"
-        },
-        "300": {
-          "value": "b2b2b2",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-gray-300",
-          "comment": "{comments.reference.comment} color-brand-gray-300"
-        },
-        "400": {
-          "value": "767676",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-gray-400",
-          "comment": "{comments.reference.comment} color-brand-gray-400"
-        },
-        "500": {
-          "value": "222222",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-gray-500",
-          "comment": "{comments.reference.comment} color-brand-gray-500"
-        }
-      },
-      "neutral": {
-        "400": {
-          "value": "9fabbb",
-          "public": false,
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-neutral-400",
-          "comment": "{comments.reference.comment} color-brand-neutral-400"
-        },
-        "500": {
-          "value": "626b79",
-          "public": false,
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-neutral-500",
-          "comment": "{comments.reference.comment} color-brand-neutral-500"
-        }
+        "deprecated": false,
+        "darkmode": true
       }
-    },
-    "state": {
-      "error": {
-        "100": {
-          "value": "ff999b",
-          "public": true,
-          "deprecated": false
-        },
-        "500": {
-          "value": "df0b37",
-          "public": true,
-          "deprecated": false
-        }
-      },
-      "success": {
-        "100": {
-          "value": "69cf96",
-          "public": true,
-          "deprecated": false
-        },
-        "500": {
-          "value": "00805d",
-          "public": true,
-          "deprecated": false
-        }
-      },
-      "warning": {
-        "500": {
-          "value": "de750c",
-          "public": true,
-          "deprecated": false
-        }
-      }
     }
   }
 }

src/color-darkmode/border.json

@@ -8,2 +8,3 @@ {
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -15,42 +16,2 @@ "usage": "Primary border color on dark background",
       },
-      "active": {
-        "default": {
-          "value": "{color.brand.breeze.300.value}",
-          "public": true,
-          "default": true,
-          "usage": "Active border color on dark backgrounds",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
-      "error": {
-        "default": {
-          "value": "{color.state.error.100.value}",
-          "public": true,
-          "default": true,
-          "usage": "Error states border color on dark background",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
-      "disabled": {
-        "default": {
-          "value": "{color.base.gray.200.value}",
-          "public": true,
-          "default": true,
-          "usage": "Disabled border color on dark background",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
-      "Focus": {
-        "default": {
-          "value": "{color.base.white.value}",
-          "public": true,
-          "default": true,
-          "usage": "Focus border color for dark backgrounds",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
       "divider": {
@@ -60,2 +21,3 @@ "default": {
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -62,0 +24,0 @@ "usage": "Strict use as divider between elements on dark backgrounds",

src/color-darkmode/icon.json

@@ -8,2 +8,3 @@ {
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -19,2 +20,3 @@ "usage": "Primary color for icons on dark backgrounds",
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -25,22 +27,2 @@ "usage": "Emphasis or lightest icon color on dark backgrounds",
         }
-      },
-      "accent": {
-        "default": {
-          "value": "{color.brand.breeze.300.value}",
-          "public": true,
-          "default": true,
-          "usage": "Accent color for icon color on dark backgrounds",
-          "wcag": "AA",
-          "deprecated": false
-        }
-      },
-      "disabled": {
-        "default": {
-          "value": "{color.base.white-opacity-40.value}",
-          "public": true,
-          "default": true,
-          "usage": "Disabled icon color on dark backgrounds",
-          "wcag": "n/a",
-          "deprecated": false
-        }
       }
@@ -47,0 +29,0 @@ }

src/color-darkmode/text.json

@@ -8,2 +8,3 @@ {
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -19,2 +20,3 @@ "usage": "Primary color for body and header text on dark backgrounds",
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -30,2 +32,3 @@ "usage": "Secondary color for body text on dark backgrounds",
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -41,2 +44,3 @@ "usage": "Link text color on light backgrounds",
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -48,12 +52,2 @@ "usage": "Error text color on dark backgrounds",
       },
-      "disabled": {
-        "default": {
-          "value": "{color.base.gray.200.value}",
-          "public": true,
-          "default": true,
-          "usage": "Disabled text color on dark backgrounds",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
       "emphasis": {
@@ -63,2 +57,3 @@ "default": {
           "public": true,
+          "darkmode": true,
           "default": true,
@@ -65,0 +60,0 @@ "usage": "Emphasized text color on dark backgrounds",

src/color-darkmode/tier.json

@@ -9,2 +9,3 @@ {
             "public": true,
+            "darkmode": true,
             "default": true,
@@ -20,2 +21,3 @@ "usage": "MVP tier color for Alaska Airlines",
             "public": true,
+            "darkmode": true,
             "default": true,
@@ -27,28 +29,2 @@ "usage": "MVP Gold tier color for Alaska Airlines",
         }
-      },
-      "oneworld": {
-        "emerald": {
-            "value": "{color.brand.emerald.value}",
-            "public": true,
-            "onLight": true,
-            "usage": "Emerald tier color for Oneworld",
-            "wcag": "n/a",
-            "deprecated": false
-        },
-        "sapphire": {
-            "value": "{color.brand.sapphire.value}",
-            "public": true,
-            "default": true,
-            "usage": "Sapphire tier color for Oneworld",
-            "wcag": "n/a",
-            "deprecated": false
-        },
-        "ruby": {
-            "value": "{color.brand.ruby.value}",
-            "public": true,
-            "default": true,
-            "usage": "Ruby tier color for Oneworld",
-            "wcag": "n/a",
-            "deprecated": false
-        }
       }
@@ -55,0 +31,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

635349

decreased by-41.23%

Number of package files

52

decreased by-25.71%

Lines of code

18639

decreased by-39.93%

Number of lines in readme file

92

decreased by-6.12%

No dependency changes