@alaskaairux/orion-design-tokens
Advanced tools
Comparing version 2.10.15 to 2.11.0
# Semantic Release Automated Changelog | ||
# [2.11.0](https://github.com/AlaskaAirlines/OrionDesignTokens/compare/v2.10.15...v2.11.0) (2020-05-19) | ||
### Features | ||
* support RGB custom color spec ([3d2486e](https://github.com/AlaskaAirlines/OrionDesignTokens/commit/3d2486e9cd002f9b8f495270d107b5d2fbb13226)) | ||
## [2.10.15](https://github.com/AlaskaAirlines/OrionDesignTokens/compare/v2.10.14...v2.10.15) (2020-05-05) | ||
@@ -4,0 +11,0 @@ |
/** | ||
* Do not edit directly | ||
* Generated on Tue, 05 May 2020 14:50:44 GMT | ||
* Generated on Tue, 19 May 2020 18:21:35 GMT | ||
*/ | ||
@@ -5,0 +5,0 @@ |
/** | ||
* Do not edit directly | ||
* Generated on Tue, 05 May 2020 14:50:44 GMT | ||
* Generated on Tue, 19 May 2020 18:21:35 GMT | ||
*/ | ||
@@ -5,0 +5,0 @@ |
/** | ||
* Do not edit directly | ||
* Generated on Tue, 05 May 2020 14:50:44 GMT | ||
* Generated on Tue, 19 May 2020 18:21:35 GMT | ||
*/ | ||
@@ -5,0 +5,0 @@ |
{ | ||
"name": "@alaskaairux/orion-design-tokens", | ||
"version": "2.10.15", | ||
"version": "2.11.0", | ||
"description": "Alaska Air Orion Design System token repository", | ||
@@ -13,3 +13,5 @@ "homepage": "https://github.com/AlaskaAirlines/OrionDesignTokens", | ||
"license": "Apache-2.0", | ||
"dependencies": {}, | ||
"dependencies": { | ||
"chalk": "^4.0.0" | ||
}, | ||
"devDependencies": { | ||
@@ -29,4 +31,5 @@ "@commitlint/cli": "^8.3.5", | ||
"scripts": { | ||
"postinstall": "node packageScripts/postinstall.js", | ||
"buildTokens": "node scripts/styleDictionary.js", | ||
"ciBuild": "npm-run-all sweep test copyJson buildTokens", | ||
"ciBuild": "npm-run-all sweep test copyJson buildTokens postinstall", | ||
"copyJson": "copyfiles -u 1 -V './src/**/*.json' ./dist", | ||
@@ -33,0 +36,0 @@ "test": "node scripts/jsonTest.js", |
143
README.md
@@ -1,82 +0,24 @@ | ||
<img src="https://resource.alaskaair.net/-/media/2C1969F8FB244C919205CD48429C13AC" alt="Orion Design System Logo" title="Be the change you want to see" width="125" align="right" /> | ||
# Auro Design Tokens | ||
[![Build Status](https://travis-ci.org/AlaskaAirlines/AuroDesignTokens.svg?branch=master)](https://travis-ci.org/AlaskaAirlines/OrionDesignTokens) | ||
![npm (scoped)](https://img.shields.io/npm/v/@alaskaairux/orion-design-tokens.svg?color=orange) | ||
![NPM](https://img.shields.io/npm/l/@alaskaairux/orion-design-tokens.svg?color=blue) | ||
Design tokens represent the design decisions needed to construct and maintain a design system — spacing, color, typography, animation, etc. — represented as data. These can represent anything defined by design: color as an RGB value, and opacity as a number, animation ease, etc. | ||
# Orion Design Tokens | ||
Note that design tokens: | ||
Orion Design Tokens are abstract UI atomic values that make up the greater Orion Design System (ODS). | ||
* May not have a long lifespan | ||
* May alter the value more frequently | ||
* May be used for a wide variety of purposes | ||
The goal of this project is to maintain these core values in such a way as to feed the UI of other engineering efforts, rather than be a manually communicated design dependency. | ||
## Install npm | ||
## Contained within this repository | ||
[![Build Status](https://img.shields.io/travis/AlaskaAirlines/AuroDesignTokens.svg?branch=master&style=for-the-badge)](https://travis-ci.org/github/AlaskaAirlines/AuroDesignTokens) | ||
[![See it on NPM!](https://img.shields.io/npm/v/@alaskaairux/orion-design-tokens.svg?style=for-the-badge&color=orange)](https://www.npmjs.com/package/@alaskaairux/orion-design-tokens) | ||
[![License](https://img.shields.io/npm/l/@alaskaairux/orion-design-tokens.svg?color=blue&style=for-the-badge)](https://www.apache.org/licenses/LICENSE-2.0) | ||
This repository serves two purposes: | ||
1. To maintain the single source of record of the distributed token files | ||
1. Export pre-defined resources for projects to consume | ||
### The ./src dir | ||
Within the project's `src/` dir are the various token values stored in `.json` format. These are the production resources distributed via npm. | ||
## Config filter API | ||
The following table illustrated the different JSON options currently being used to filter the data output. | ||
By default, no tokens are exposed in an output file unless specifically designated by a config filter option. See the table below for the different types of filters currently in use. | ||
| filter | type | description | | ||
|---|---|---| | ||
| attributes {category/type/option} | string | follow the pattern of the [CTI Structure](https://amzn.github.io/style-dictionary/#/properties?id=category-type-item) to determine the value of a category, type or option in the JSON | | ||
| classic | boolean | token filter for `classic` theme values | | ||
| deprecated | boolean | token marked as `deprecated` will be deleted with next MAJOR release version | | ||
| legacy | boolean | token filter for legacy values | | ||
| opacity | boolean | token filter for base colors with an alpha transparency | | ||
| public | boolean | token filter for publicly exposed Design System tokens per the most recent spec | | ||
| redirect | boolean | token filter for legacy values that have a new reference | | ||
* **Classic:** Tokens that reference Alaska CLASSIC themes | ||
* **Legacy:** Tokens established prior to v2.8 release | ||
* **Public:** Currently approved for use Orion Design Tokens | ||
Additional content options are made available within the token data. See the table below for these options and their descriptions. | ||
| option | type | description | | ||
|---|---|---| | ||
| comment | string | comment that will appear in CSS/Sass output | | ||
| reference | string | new token redirect reference | | ||
| usage | string | description of token use | | ||
| wcag | string | WCAG accessibility rating if applicable | | ||
| value | string / number | the value of the token | | ||
## Contributing | ||
Please be sure to follow current Design Token patterns and follow the [CTI Structure](https://amzn.github.io/style-dictionary/#/properties?id=category-type-item). Any submissions to this project that does not follow these guidelines will be considered non-compliant and your submission will be rejected. | ||
Also, please see this repo's [contributing guidelines](https://github.com/AlaskaAirlines/OrionDesignTokens/blob/master/CONTRIBUTING.md). | ||
Before submitting a pull request, please ensure that your JSON is formatted correctly. Testing is easy, you can build out resource files that are not added to the repo's version control. | ||
To mimic a CI Build and ensure a successful build with a merge, please run the following command to test the build pipeline: | ||
```bash | ||
$ npm run ciBuild | ||
``` | ||
**All tests will run with the automated build, but it's a good idea to run tests locally to ensure stability of pull request** | ||
## Install | ||
To install in your project, see instructions from [npmjs.org](https://www.npmjs.com/package/@alaskaairux/orion-design-tokens) | ||
``` | ||
npm i @alaskaairux/orion-design-tokens | ||
``` | ||
## Install pre-processed resources | ||
### Install pre-processed resources | ||
Located in the Orion Design Tokens [npm](https://www.npmjs.com/package/@alaskaairux/orion-design-tokens) in the `./tokens` directory. | ||
The following files are located in the Orion Design Tokens [npm](https://www.npmjs.com/package/@alaskaairux/orion-design-tokens) in the `./dist/tokens` directory. | ||
@@ -87,2 +29,3 @@ ``` | ||
├── CSSCustomProperties.css | ||
├── CSSCustomPropertiesColorRGB.css | ||
├── CSSOpacityProperties.scss | ||
@@ -101,2 +44,3 @@ ├── CSSSizeCustomProperties.css | ||
├── SassCustomProperties.scss | ||
├── SassCustomPropertiesColorRGB.scss | ||
├── SassSizeCustomProperties.scss | ||
@@ -113,2 +57,3 @@ ├── TokenColorVariables.js | ||
| CSSCustomProperties | CSS | custom properties | deprecated | full list of v2.8 release tokens | | ||
| CSSCustomPropertiesColorRGB | CSS | custom properties | current| Filter: color, public<br>custom RGB output | ||
| CSSOpacityProperties | Sass | custom properties | current | filter: opacity | | ||
@@ -126,2 +71,3 @@ | CSSSizeCustomProperties | CSS | custom properties | current | filter: size, public | | ||
| SassCustomProperties | scss | custom properties | current | full list of v2.8 release tokens | | ||
| SassCustomPropertiesColorRGB | Sass | custom properties | current| Filter: color, public<br>custom RGB output | ||
| SassSizeCustomProperties | Sass | custom properties | current | filter: size, public | | ||
@@ -162,6 +108,52 @@ | TokenColorVariables | js module | color data | deprecated | filter: color | | ||
``` | ||
## Contributing | ||
Please be sure to follow current Design Token patterns and follow the [CTI Structure](https://amzn.github.io/style-dictionary/#/properties?id=category-type-item). Any submissions to this project that does not follow these guidelines will be considered non-compliant and your submission will be rejected. | ||
Also, please see this repo's [contributing guidelines](https://github.com/AlaskaAirlines/OrionDesignTokens/blob/master/CONTRIBUTING.md). | ||
Before submitting a pull request, please ensure that your JSON is formatted correctly. Testing is easy, you can build out resource files that are not added to the repo's version control. | ||
To mimic a CI Build and ensure a successful build with a merge, please run the following command to test the build pipeline: | ||
```bash | ||
$ npm run ciBuild | ||
``` | ||
**All tests will run with the automated build, but it's a good idea to run tests locally to ensure stability of pull request** | ||
## Config filter API | ||
The following table illustrated the different JSON options currently being used to filter the data output. | ||
By default, no tokens are exposed in an output file unless specifically designated by a config filter option. See the table below for the different types of filters currently in use. | ||
| filter | type | description | | ||
|---|---|---| | ||
| attributes {category/type/option} | string | follow the pattern of the [CTI Structure](https://amzn.github.io/style-dictionary/#/properties?id=category-type-item) to determine the value of a category, type or option in the JSON | | ||
| classic | boolean | token filter for `classic` theme values | | ||
| deprecated | boolean | token marked as `deprecated` will be deleted with next MAJOR release version | | ||
| legacy | boolean | token filter for legacy values | | ||
| opacity | boolean | token filter for base colors with an alpha transparency | | ||
| public | boolean | token filter for publicly exposed Design System tokens per the most recent spec | | ||
| redirect | boolean | token filter for legacy values that have a new reference | | ||
**Classic:** Tokens that reference Alaska CLASSIC themes | ||
<br>**Legacy:** Tokens established prior to v2.8 release | ||
<br>**Public:** Currently approved for use Orion Design Tokens | ||
Additional content options are made available within the token data. See the table below for these options and their descriptions. | ||
| option | type | description | | ||
|---|---|---| | ||
| comment | string | comment that will appear in CSS/Sass output | | ||
| reference | string | new token redirect reference | | ||
| usage | string | description of token use | | ||
| wcag | string | WCAG accessibility rating if applicable | | ||
| value | string / number | the value of the token | | ||
## Managing deprecated resources | ||
All the Orion tokens are supported with the v2.8 release. All the new Auro tokens have been added to allow for deprecation of Orion tokens. Once v3.0 of the Design Tokens is released, all Orion tokens will be deleted from this repo. | ||
All the Orion tokens are supported with the v2.8 release. All the new Auro tokens have been added to allow for deprecation of Orion tokens. When v3.0 is released, Orion tokens will no longer be supported. | ||
@@ -221,3 +213,2 @@ ### Orion pre-processed resources | ||
## Sass or CSS Custom Properties? | ||
@@ -240,9 +231,1 @@ | ||
Style Dictionary fully supports native platforms and is able to output resources that are usable in both iOS and Android native development. | ||
## | ||
<footer> | ||
Alaska Airlines Orion Design System<br> | ||
Copyright 2019 Alaska Airlines, Inc. or its affiliates. All Rights Reserved. | ||
</footer> |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Install scripts
Supply chain riskInstall scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
645363
72
17400
1
225
1
+ Addedchalk@^4.0.0
+ Addedansi-styles@4.3.0(transitive)
+ Addedchalk@4.1.2(transitive)
+ Addedcolor-convert@2.0.1(transitive)
+ Addedcolor-name@1.1.4(transitive)
+ Addedhas-flag@4.0.0(transitive)
+ Addedsupports-color@7.2.0(transitive)