@hero-design/colors 8.42.6-rc2.0 → 8.43.0

package/.turbo/turbo-build.log

@@ -1,10 +1,8 @@
-$ yarn build:js && yarn build:types
-$ rollup -c
 
 src/index.ts → lib/index.js, es/index.js...
 (!) Unresolved dependencies
 https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency
-hex-rgb (imported by ../../node_modules/parse-css-color/dist/index.esm.js, ../../node_modules/mix-css-color/node_modules/parse-css-color/dist/index.esm.js)
+hex-rgb (imported by ../../node_modules/values.js/node_modules/parse-css-color/dist/index.esm.js, ../../node_modules/parse-css-color/dist/index.esm.js)
 (!) Plugin typescript: @rollup/plugin-typescript: outputToFilesystem option is defaulting to true.
 (!) Mixing named and default exports
 https://rollupjs.org/guide/en/#outputexports
@@ -12,5 +10,4 @@ $ rollup -c
 src/index.ts
 
 Consumers of your bundle will have to use chunk['default'] to access their default export, which may not be what you want. Use `output.exports: 'named'` to disable this warning
-created lib/index.js, es/index.js in 5.9s
-$ tsc --emitDeclarationOnly
+created lib/index.js, es/index.js in 13.3s

package/CHANGELOG.md

@@ -1,10 +1,10 @@
 # @hero-design/colors
 
-## 8.42.6-rc2.0
+## 8.43.0
 
-### Patch Changes
+### Minor Changes
 
-- [#2371](https://github.com/Thinkei/hero-design/pull/2371) [`f8ca1d311`](https://github.com/Thinkei/hero-design/commit/f8ca1d311e914166f43824e447828bbf5a0278e2) Thanks [@phucdph](https://github.com/phucdph)! - Initialize RC version
+- [#3262](https://github.com/Thinkei/hero-design/pull/3262) [`f50df7c5d`](https://github.com/Thinkei/hero-design/commit/f50df7c5de8f7df3514bd1813e31c75fcc4a456a) Thanks [@phucdph](https://github.com/phucdph)! - [ANG-2824] Add Accent Colors
 
 ## 8.42.5
 

package/es/index.js

@@ -799,6 +799,7 @@ const palette$b = {
   dodgerBlue: ultramarineBlue$2.base,
   dodgerBlueDark15: ultramarineBlue$2.darken15,
   dodgerBlueDark30: ultramarineBlue$2.darken30,
+  dodgerBlueDark60: ultramarineBlue$2.darken60,
   dodgerBlueLight30: ultramarineBlue$2.lighten30,
   dodgerBlueLight45: ultramarineBlue$2.lighten45,
   dodgerBlueLight60: ultramarineBlue$2.lighten60,
@@ -807,8 +808,10 @@ const palette$b = {
   green: green.base,
   greenDark15: green.darken15,
   greenDark30: green.darken30,
+  greenDark60: green.darken60,
   greenDark75: green.darken75,
   greenLight30: green.lighten30,
+  greenLight45: green.lighten45,
   greenLight75: green.lighten75,
   greenLight90: green.lighten90,
   grey: grey$2.base,
@@ -817,6 +820,7 @@ const palette$b = {
   greyDark45: grey$2.darken45,
   greyDark60: grey$2.darken60,
   greyDark75: grey$2.darken75,
+  greyLight30: grey$2.lighten30,
   greyLight45: grey$2.lighten45,
   greyLight60: grey$2.lighten60,
   greyLight75: grey$2.lighten75,
@@ -826,21 +830,26 @@ const palette$b = {
   grotesqueGreen: grotesqueGreen.base,
   grotesqueGreenDark30: grotesqueGreen.darken30,
   grotesqueGreenDark45: grotesqueGreen.darken45,
+  grotesqueGreenDark60: grotesqueGreen.darken60,
   grotesqueGreenLight30: grotesqueGreen.lighten30,
+  grotesqueGreenLight45: grotesqueGreen.lighten45,
   grotesqueGreenLight60: grotesqueGreen.lighten60,
   grotesqueGreenLight75: grotesqueGreen.lighten75,
   grotesqueGreenLight90: grotesqueGreen.lighten90,
   orange: deepSaffron$2.base,
   orangeDark15: deepSaffron$2.darken15,
   orangeDark30: deepSaffron$2.darken30,
+  orangeDark60: deepSaffron$2.darken60,
   orangeDark75: deepSaffron$2.darken75,
   orangeLight30: deepSaffron$2.lighten30,
+  orangeLight45: deepSaffron$2.lighten45,
   orangeLight75: deepSaffron$2.lighten75,
   orangeLight90: deepSaffron$2.lighten90,
   pink: pink.base,
   pinkDark15: pink.darken15,
   pinkDark30: pink.darken30,
   pinkDark45: pink.darken45,
+  pinkDark60: pink.darken60,
   pinkDark75: pink.darken75,
   pinkLight30: pink.lighten30,
   pinkLight45: pink.lighten45,
@@ -849,7 +858,10 @@ const palette$b = {
   purple: purple.base,
   purpleDark15: purple.darken15,
   purpleDark30: purple.darken30,
+  purpleDark60: purple.darken60,
   purpleLight30: purple.lighten30,
+  purpleLight45: purple.lighten45,
+  purpleLight75: purple.lighten75,
   red: vermilion$2.base,
   redDark15: vermilion$2.darken15,
   redDark30: vermilion$2.darken30,
@@ -865,6 +877,7 @@ const palette$b = {
   redLight90: vermilion$2.lighten90,
   smalt: smalt.base,
   smaltDark30: smalt.darken30,
+  smaltDark60: smalt.darken60,
   smaltDark75: smalt.darken75,
   smaltLight30: smalt.lighten30,
   smaltLight45: smalt.lighten45,
@@ -886,6 +899,7 @@ const palette$b = {
   yellow: yellow.base,
   yellowDark15: yellow.darken15,
   yellowDark30: yellow.darken30,
+  yellowDark60: yellow.darken60,
   yellowDark75: yellow.darken75,
   yellowLight30: yellow.lighten30,
   yellowLight45: yellow.lighten45,

package/eslint.config.js

@@ -0,0 +1,23 @@
+const { FlatCompat } = require('@eslint/eslintrc');
+const { includeIgnoreFile } = require('@eslint/compat');
+const path = require('path');
+
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+});
+
+const gitignorePath = path.resolve(__dirname, '../../.gitignore');
+
+module.exports = [
+  ...compat.extends('hd'),
+  includeIgnoreFile(gitignorePath),
+  {
+    files: ['**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx'],
+    languageOptions: {
+      parserOptions: {
+        tsconfigRootDir: __dirname,
+        project: ['./tsconfig.json'],
+      },
+    },
+  },
+];

package/lib/index.js

@@ -807,6 +807,7 @@ const palette$b = {
   dodgerBlue: ultramarineBlue$2.base,
   dodgerBlueDark15: ultramarineBlue$2.darken15,
   dodgerBlueDark30: ultramarineBlue$2.darken30,
+  dodgerBlueDark60: ultramarineBlue$2.darken60,
   dodgerBlueLight30: ultramarineBlue$2.lighten30,
   dodgerBlueLight45: ultramarineBlue$2.lighten45,
   dodgerBlueLight60: ultramarineBlue$2.lighten60,
@@ -815,8 +816,10 @@ const palette$b = {
   green: green.base,
   greenDark15: green.darken15,
   greenDark30: green.darken30,
+  greenDark60: green.darken60,
   greenDark75: green.darken75,
   greenLight30: green.lighten30,
+  greenLight45: green.lighten45,
   greenLight75: green.lighten75,
   greenLight90: green.lighten90,
   grey: grey$2.base,
@@ -825,6 +828,7 @@ const palette$b = {
   greyDark45: grey$2.darken45,
   greyDark60: grey$2.darken60,
   greyDark75: grey$2.darken75,
+  greyLight30: grey$2.lighten30,
   greyLight45: grey$2.lighten45,
   greyLight60: grey$2.lighten60,
   greyLight75: grey$2.lighten75,
@@ -834,21 +838,26 @@ const palette$b = {
   grotesqueGreen: grotesqueGreen.base,
   grotesqueGreenDark30: grotesqueGreen.darken30,
   grotesqueGreenDark45: grotesqueGreen.darken45,
+  grotesqueGreenDark60: grotesqueGreen.darken60,
   grotesqueGreenLight30: grotesqueGreen.lighten30,
+  grotesqueGreenLight45: grotesqueGreen.lighten45,
   grotesqueGreenLight60: grotesqueGreen.lighten60,
   grotesqueGreenLight75: grotesqueGreen.lighten75,
   grotesqueGreenLight90: grotesqueGreen.lighten90,
   orange: deepSaffron$2.base,
   orangeDark15: deepSaffron$2.darken15,
   orangeDark30: deepSaffron$2.darken30,
+  orangeDark60: deepSaffron$2.darken60,
   orangeDark75: deepSaffron$2.darken75,
   orangeLight30: deepSaffron$2.lighten30,
+  orangeLight45: deepSaffron$2.lighten45,
   orangeLight75: deepSaffron$2.lighten75,
   orangeLight90: deepSaffron$2.lighten90,
   pink: pink.base,
   pinkDark15: pink.darken15,
   pinkDark30: pink.darken30,
   pinkDark45: pink.darken45,
+  pinkDark60: pink.darken60,
   pinkDark75: pink.darken75,
   pinkLight30: pink.lighten30,
   pinkLight45: pink.lighten45,
@@ -857,7 +866,10 @@ const palette$b = {
   purple: purple.base,
   purpleDark15: purple.darken15,
   purpleDark30: purple.darken30,
+  purpleDark60: purple.darken60,
   purpleLight30: purple.lighten30,
+  purpleLight45: purple.lighten45,
+  purpleLight75: purple.lighten75,
   red: vermilion$2.base,
   redDark15: vermilion$2.darken15,
   redDark30: vermilion$2.darken30,
@@ -873,6 +885,7 @@ const palette$b = {
   redLight90: vermilion$2.lighten90,
   smalt: smalt.base,
   smaltDark30: smalt.darken30,
+  smaltDark60: smalt.darken60,
   smaltDark75: smalt.darken75,
   smaltLight30: smalt.lighten30,
   smaltLight45: smalt.lighten45,
@@ -894,6 +907,7 @@ const palette$b = {
   yellow: yellow.base,
   yellowDark15: yellow.darken15,
   yellowDark30: yellow.darken30,
+  yellowDark60: yellow.darken60,
   yellowDark75: yellow.darken75,
   yellowLight30: yellow.lighten30,
   yellowLight45: yellow.lighten45,

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@hero-design/colors",
-  "version": "8.42.6-rc2.0",
+  "version": "8.43.0",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
   "types": "types/index.d.ts",
   "scripts": {
-    "lint": "eslint src --ext .js,.jsx,.ts,.tsx --ignore-path ../../.gitignore",
+    "lint": "eslint src",
     "type-check": "tsc --noEmit",
     "dev": "rollup -c -w",
     "build:js": "rollup -c",
@@ -19,13 +19,17 @@
     "values.js": "^2.1.1"
   },
   "devDependencies": {
+    "@eslint/compat": "^1.1.1",
+    "@eslint/eslintrc": "^3.1.0",
     "@rollup/plugin-babel": "^5.3.1",
     "@rollup/plugin-commonjs": "^20.0.0",
     "@rollup/plugin-node-resolve": "^13.1.3",
     "@rollup/plugin-typescript": "^8.3.1",
-    "eslint-config-hd": "8.42.5-rc2.0",
-    "prettier-config-hd": "8.42.5-rc2.0",
-    "rollup": "^2.70.1"
+    "eslint": "^8.56.0",
+    "eslint-config-hd": "8.42.4",
+    "prettier-config-hd": "8.42.4",
+    "rollup": "^2.70.1",
+    "typescript": "4.8.4"
   },
   "prettier": "prettier-config-hd"
 }

package/src/defaultWebPalette/index.ts

@@ -34,6 +34,7 @@ const palette = {
   dodgerBlue: ultramarineBlue.base,
   dodgerBlueDark15: ultramarineBlue.darken15,
   dodgerBlueDark30: ultramarineBlue.darken30,
+  dodgerBlueDark60: ultramarineBlue.darken60,
   dodgerBlueLight30: ultramarineBlue.lighten30,
   dodgerBlueLight45: ultramarineBlue.lighten45,
   dodgerBlueLight60: ultramarineBlue.lighten60,
@@ -42,8 +43,10 @@ const palette = {
   green: green.base,
   greenDark15: green.darken15,
   greenDark30: green.darken30,
+  greenDark60: green.darken60,
   greenDark75: green.darken75,
   greenLight30: green.lighten30,
+  greenLight45: green.lighten45,
   greenLight75: green.lighten75,
   greenLight90: green.lighten90,
   grey: grey.base,
@@ -52,6 +55,7 @@ const palette = {
   greyDark45: grey.darken45,
   greyDark60: grey.darken60,
   greyDark75: grey.darken75,
+  greyLight30: grey.lighten30,
   greyLight45: grey.lighten45,
   greyLight60: grey.lighten60,
   greyLight75: grey.lighten75,
@@ -61,21 +65,26 @@ const palette = {
   grotesqueGreen: grotesqueGreen.base,
   grotesqueGreenDark30: grotesqueGreen.darken30,
   grotesqueGreenDark45: grotesqueGreen.darken45,
+  grotesqueGreenDark60: grotesqueGreen.darken60,
   grotesqueGreenLight30: grotesqueGreen.lighten30,
+  grotesqueGreenLight45: grotesqueGreen.lighten45,
   grotesqueGreenLight60: grotesqueGreen.lighten60,
   grotesqueGreenLight75: grotesqueGreen.lighten75,
   grotesqueGreenLight90: grotesqueGreen.lighten90,
   orange: deepSaffron.base,
   orangeDark15: deepSaffron.darken15,
   orangeDark30: deepSaffron.darken30,
+  orangeDark60: deepSaffron.darken60,
   orangeDark75: deepSaffron.darken75,
   orangeLight30: deepSaffron.lighten30,
+  orangeLight45: deepSaffron.lighten45,
   orangeLight75: deepSaffron.lighten75,
   orangeLight90: deepSaffron.lighten90,
   pink: pink.base,
   pinkDark15: pink.darken15,
   pinkDark30: pink.darken30,
   pinkDark45: pink.darken45,
+  pinkDark60: pink.darken60,
   pinkDark75: pink.darken75,
   pinkLight30: pink.lighten30,
   pinkLight45: pink.lighten45,
@@ -84,7 +93,10 @@ const palette = {
   purple: purple.base,
   purpleDark15: purple.darken15,
   purpleDark30: purple.darken30,
+  purpleDark60: purple.darken60,
   purpleLight30: purple.lighten30,
+  purpleLight45: purple.lighten45,
+  purpleLight75: purple.lighten75,
   red: vermilion.base,
   redDark15: vermilion.darken15,
   redDark30: vermilion.darken30,
@@ -100,6 +112,7 @@ const palette = {
   redLight90: vermilion.lighten90,
   smalt: smalt.base,
   smaltDark30: smalt.darken30,
+  smaltDark60: smalt.darken60,
   smaltDark75: smalt.darken75,
   smaltLight30: smalt.lighten30,
   smaltLight45: smalt.lighten45,
@@ -121,6 +134,7 @@ const palette = {
   yellow: yellow.base,
   yellowDark15: yellow.darken15,
   yellowDark30: yellow.darken30,
+  yellowDark60: yellow.darken60,
   yellowDark75: yellow.darken75,
   yellowLight30: yellow.lighten30,
   yellowLight45: yellow.lighten45,

package/types/colorScales/createColorScales.d.ts

@@ -1,7 +1,7 @@
 declare const STEPS: readonly [5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 55, 60, 65, 70, 75, 80, 85, 90, 95];
-type LIGHTEN_STEPS = `lighten${typeof STEPS[number]}`;
-type DARKEN_STEPS = `darken${typeof STEPS[number]}`;
-type ColorScales = {
+declare type LIGHTEN_STEPS = `lighten${typeof STEPS[number]}`;
+declare type DARKEN_STEPS = `darken${typeof STEPS[number]}`;
+declare type ColorScales = {
     base: string;
 } & {
     [k in LIGHTEN_STEPS | DARKEN_STEPS]: string;

package/types/defaultWebPalette/index.d.ts

@@ -17,6 +17,7 @@ declare const palette: {
     dodgerBlue: string;
     dodgerBlueDark15: string;
     dodgerBlueDark30: string;
+    dodgerBlueDark60: string;
     dodgerBlueLight30: string;
     dodgerBlueLight45: string;
     dodgerBlueLight60: string;
@@ -25,8 +26,10 @@ declare const palette: {
     green: string;
     greenDark15: string;
     greenDark30: string;
+    greenDark60: string;
     greenDark75: string;
     greenLight30: string;
+    greenLight45: string;
     greenLight75: string;
     greenLight90: string;
     grey: string;
@@ -35,6 +38,7 @@ declare const palette: {
     greyDark45: string;
     greyDark60: string;
     greyDark75: string;
+    greyLight30: string;
     greyLight45: string;
     greyLight60: string;
     greyLight75: string;
@@ -44,21 +48,26 @@ declare const palette: {
     grotesqueGreen: string;
     grotesqueGreenDark30: string;
     grotesqueGreenDark45: string;
+    grotesqueGreenDark60: string;
     grotesqueGreenLight30: string;
+    grotesqueGreenLight45: string;
     grotesqueGreenLight60: string;
     grotesqueGreenLight75: string;
     grotesqueGreenLight90: string;
     orange: string;
     orangeDark15: string;
     orangeDark30: string;
+    orangeDark60: string;
     orangeDark75: string;
     orangeLight30: string;
+    orangeLight45: string;
     orangeLight75: string;
     orangeLight90: string;
     pink: string;
     pinkDark15: string;
     pinkDark30: string;
     pinkDark45: string;
+    pinkDark60: string;
     pinkDark75: string;
     pinkLight30: string;
     pinkLight45: string;
@@ -67,7 +76,10 @@ declare const palette: {
     purple: string;
     purpleDark15: string;
     purpleDark30: string;
+    purpleDark60: string;
     purpleLight30: string;
+    purpleLight45: string;
+    purpleLight75: string;
     red: string;
     redDark15: string;
     redDark30: string;
@@ -83,6 +95,7 @@ declare const palette: {
     redLight90: string;
     smalt: string;
     smaltDark30: string;
+    smaltDark60: string;
     smaltDark75: string;
     smaltLight30: string;
     smaltLight45: string;
@@ -104,6 +117,7 @@ declare const palette: {
     yellow: string;
     yellowDark15: string;
     yellowDark30: string;
+    yellowDark60: string;
     yellowDark75: string;
     yellowLight30: string;
     yellowLight45: string;

package/types/eBensWebPalette/index.d.ts

@@ -20,6 +20,7 @@ declare const palette: {
     dodgerBlue: string;
     dodgerBlueDark15: string;
     dodgerBlueDark30: string;
+    dodgerBlueDark60: string;
     dodgerBlueLight30: string;
     dodgerBlueLight45: string;
     dodgerBlueLight60: string;
@@ -28,8 +29,10 @@ declare const palette: {
     green: string;
     greenDark15: string;
     greenDark30: string;
+    greenDark60: string;
     greenDark75: string;
     greenLight30: string;
+    greenLight45: string;
     greenLight75: string;
     greenLight90: string;
     grey: string;
@@ -38,6 +41,7 @@ declare const palette: {
     greyDark45: string;
     greyDark60: string;
     greyDark75: string;
+    greyLight30: string;
     greyLight45: string;
     greyLight60: string;
     greyLight75: string;
@@ -47,21 +51,26 @@ declare const palette: {
     grotesqueGreen: string;
     grotesqueGreenDark30: string;
     grotesqueGreenDark45: string;
+    grotesqueGreenDark60: string;
     grotesqueGreenLight30: string;
+    grotesqueGreenLight45: string;
     grotesqueGreenLight60: string;
     grotesqueGreenLight75: string;
     grotesqueGreenLight90: string;
     orange: string;
     orangeDark15: string;
     orangeDark30: string;
+    orangeDark60: string;
     orangeDark75: string;
     orangeLight30: string;
+    orangeLight45: string;
     orangeLight75: string;
     orangeLight90: string;
     pink: string;
     pinkDark15: string;
     pinkDark30: string;
     pinkDark45: string;
+    pinkDark60: string;
     pinkDark75: string;
     pinkLight30: string;
     pinkLight45: string;
@@ -70,7 +79,10 @@ declare const palette: {
     purple: string;
     purpleDark15: string;
     purpleDark30: string;
+    purpleDark60: string;
     purpleLight30: string;
+    purpleLight45: string;
+    purpleLight75: string;
     red: string;
     redDark15: string;
     redDark30: string;
@@ -86,6 +98,7 @@ declare const palette: {
     redLight90: string;
     smalt: string;
     smaltDark30: string;
+    smaltDark60: string;
     smaltDark75: string;
     smaltLight30: string;
     smaltLight45: string;
@@ -107,6 +120,7 @@ declare const palette: {
     yellow: string;
     yellowDark15: string;
     yellowDark30: string;
+    yellowDark60: string;
     yellowDark75: string;
     yellowLight30: string;
     yellowLight45: string;

package/types/jobsWebPalette/index.d.ts

@@ -24,6 +24,7 @@ declare const palette: {
     dodgerBlue: string;
     dodgerBlueDark15: string;
     dodgerBlueDark30: string;
+    dodgerBlueDark60: string;
     dodgerBlueLight30: string;
     dodgerBlueLight45: string;
     dodgerBlueLight60: string;
@@ -32,8 +33,10 @@ declare const palette: {
     green: string;
     greenDark15: string;
     greenDark30: string;
+    greenDark60: string;
     greenDark75: string;
     greenLight30: string;
+    greenLight45: string;
     greenLight75: string;
     greenLight90: string;
     grey: string;
@@ -42,6 +45,7 @@ declare const palette: {
     greyDark45: string;
     greyDark60: string;
     greyDark75: string;
+    greyLight30: string;
     greyLight45: string;
     greyLight60: string;
     greyLight75: string;
@@ -51,21 +55,26 @@ declare const palette: {
     grotesqueGreen: string;
     grotesqueGreenDark30: string;
     grotesqueGreenDark45: string;
+    grotesqueGreenDark60: string;
     grotesqueGreenLight30: string;
+    grotesqueGreenLight45: string;
     grotesqueGreenLight60: string;
     grotesqueGreenLight75: string;
     grotesqueGreenLight90: string;
     orange: string;
     orangeDark15: string;
     orangeDark30: string;
+    orangeDark60: string;
     orangeDark75: string;
     orangeLight30: string;
+    orangeLight45: string;
     orangeLight75: string;
     orangeLight90: string;
     pink: string;
     pinkDark15: string;
     pinkDark30: string;
     pinkDark45: string;
+    pinkDark60: string;
     pinkDark75: string;
     pinkLight30: string;
     pinkLight45: string;
@@ -74,7 +83,10 @@ declare const palette: {
     purple: string;
     purpleDark15: string;
     purpleDark30: string;
+    purpleDark60: string;
     purpleLight30: string;
+    purpleLight45: string;
+    purpleLight75: string;
     red: string;
     redDark15: string;
     redDark30: string;
@@ -90,6 +102,7 @@ declare const palette: {
     redLight90: string;
     smalt: string;
     smaltDark30: string;
+    smaltDark60: string;
     smaltDark75: string;
     smaltLight30: string;
     smaltLight45: string;
@@ -111,6 +124,7 @@ declare const palette: {
     yellow: string;
     yellowDark15: string;
     yellowDark30: string;
+    yellowDark60: string;
     yellowDark75: string;
     yellowLight30: string;
     yellowLight45: string;