@hopper-ui/tokens 3.0.0 → 3.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/README.md +4 -9
  3. package/dist/dark/tokens.css +13 -4
  4. package/dist/tokens.css +18 -10
  5. package/package.json +5 -10
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @hopper-ui/tokens
2
2
 
3
+ ## 3.1.1
4
+
5
+ ### Patch Changes
6
+
7
+ - a31b7e2: Updated the heading small line height token to the right core token
8
+
9
+ ## 3.1.0
10
+
11
+ ### Minor Changes
12
+
13
+ - 70c40a8: Update to color tokens and new color tokens
14
+
3
15
  ## 3.0.0
4
16
 
5
17
  ### Major Changes
package/README.md CHANGED
@@ -29,17 +29,12 @@ npm install -D @hopper-ui/tokens
29
29
 
30
30
  ## Usage
31
31
 
32
- The tokens are available in the `dist` folder. You can import the tokens in your project by doing:
32
+ View the [user's documentation](https://hopper.workleap.design/).
33
33
 
34
- ```css
35
- @import '@hopper-ui/tokens/tokens.css';
36
- ```
34
+ ## 🤝 Contributing
37
35
 
38
- for the dark mode, you can import them by doing:
39
- ```css
40
- @import '@hopper-ui/tokens/dark/tokens.css';
41
- ```
36
+ View the [contributor's documentation](https://github.com/gsoft-inc/wl-hopper/blob/main/CONTRIBUTING.md).
42
37
 
43
38
  ## License
44
39
 
45
- Copyright © 2023, GSoft inc. This code is licensed under the Apache License, Version 2.0. You may obtain a copy of this license at https://github.com/gsoft-inc/gsoft-license/blob/master/LICENSE.
40
+ Copyright © 2023, Workleap. This code is licensed under the Apache License, Version 2.0. You may obtain a copy of this license at https://github.com/gsoft-inc/workleap-license/blob/master/LICENSE.
package/dist/dark/tokens.css CHANGED
@@ -64,8 +64,9 @@
64
64
  --hop-primary-surface-active: var(--hop-sapphire-800);
65
65
  --hop-decorative-option9-border: var(--hop-rock-400);
66
66
  --hop-decorative-option9-icon: var(--hop-samoyed);
67
- --hop-decorative-option9-surface-weakest: var(--hop-rock-25);
68
- --hop-decorative-option9-surface-weak: var(--hop-rock-50);
67
+ --hop-decorative-option9-surface-weakest: var(--hop-rock-200);
68
+ --hop-decorative-option9-surface-weak: var(--hop-rock-300);
69
+ --hop-decorative-option9-surface-weak-hover: var(--hop-rock-400);
69
70
  --hop-decorative-option9-surface-strong: var(--hop-rock-800);
70
71
  --hop-decorative-option9-surface-hover: var(--hop-rock-500);
71
72
  --hop-decorative-option9-surface: var(--hop-rock-400);
@@ -75,6 +76,7 @@
75
76
  --hop-decorative-option8-icon: var(--hop-amanita-900);
76
77
  --hop-decorative-option8-surface-weakest: var(--hop-amanita-25);
77
78
  --hop-decorative-option8-surface-weak: var(--hop-amanita-50);
79
+ --hop-decorative-option8-surface-weak-hover: var(--hop-amanita-75);
78
80
  --hop-decorative-option8-surface-strong: var(--hop-amanita-100);
79
81
  --hop-decorative-option8-surface-hover: var(--hop-amanita-200);
80
82
  --hop-decorative-option8-text-weak: var(--hop-amanita-300);
@@ -84,8 +86,9 @@
84
86
  --hop-decorative-option7-icon: var(--hop-toad-900);
85
87
  --hop-decorative-option7-surface-weakest: var(--hop-toad-25);
86
88
  --hop-decorative-option7-surface-weak: var(--hop-toad-50);
87
- --hop-decorative-option7-surface-strong: var(--hop-toad-75);
88
- --hop-decorative-option7-surface-hover: var(--hop-toad-75);
89
+ --hop-decorative-option7-surface-weak-hover: var(--hop-toad-75);
90
+ --hop-decorative-option7-surface-strong: var(--hop-toad-100);
91
+ --hop-decorative-option7-surface-hover: var(--hop-toad-100);
89
92
  --hop-decorative-option7-surface: var(--hop-toad-50);
90
93
  --hop-decorative-option7-text-weak: var(--hop-toad-500);
91
94
  --hop-decorative-option7-text: var(--hop-toad-900);
@@ -93,6 +96,7 @@
93
96
  --hop-decorative-option5-text: var(--hop-coastal-900);
94
97
  --hop-decorative-option5-surface-weakest: var(--hop-coastal-25);
95
98
  --hop-decorative-option5-surface-weak: var(--hop-coastal-50);
99
+ --hop-decorative-option5-surface-weak-hover: var(--hop-coastal-75);
96
100
  --hop-decorative-option5-surface-strong: var(--hop-coastal-100);
97
101
  --hop-decorative-option5-surface-hover: var(--hop-coastal-100);
98
102
  --hop-decorative-option5-surface: var(--hop-coastal-75);
@@ -100,6 +104,7 @@
100
104
  --hop-decorative-option5-icon: var(--hop-coastal-900);
101
105
  --hop-decorative-option6-surface-weakest: var(--hop-sunken-treasure-25);
102
106
  --hop-decorative-option6-surface-weak: var(--hop-sunken-treasure-50);
107
+ --hop-decorative-option6-surface-weak-hover: var(--hop-sunken-treasure-75);
103
108
  --hop-decorative-option6-surface-strong: var(--hop-sunken-treasure-100);
104
109
  --hop-decorative-option6-surface-hover: var(--hop-sunken-treasure-100);
105
110
  --hop-decorative-option6-surface: var(--hop-sunken-treasure-75);
@@ -109,6 +114,7 @@
109
114
  --hop-decorative-option6-text-weak: var(--hop-sunken-treasure-200);
110
115
  --hop-decorative-option4-surface-weakest: var(--hop-moss-25);
111
116
  --hop-decorative-option4-surface-weak: var(--hop-moss-50);
117
+ --hop-decorative-option4-surface-weak-hover: var(--hop-moss-75);
112
118
  --hop-decorative-option4-surface-strong: var(--hop-moss-100);
113
119
  --hop-decorative-option4-surface-hover: var(--hop-moss-100);
114
120
  --hop-decorative-option4-surface: var(--hop-moss-75);
@@ -119,6 +125,7 @@
119
125
  --hop-decorative-option3-surface-strong: var(--hop-koi-200);
120
126
  --hop-decorative-option3-surface-weakest: var(--hop-koi-25);
121
127
  --hop-decorative-option3-surface-weak: var(--hop-koi-50);
128
+ --hop-decorative-option3-surface-weak-hover: var(--hop-koi-75);
122
129
  --hop-decorative-option3-surface-hover: var(--hop-koi-200);
123
130
  --hop-decorative-option3-surface: var(--hop-koi-100);
124
131
  --hop-decorative-option3-border: var(--hop-koi-400);
@@ -127,6 +134,7 @@
127
134
  --hop-decorative-option3-text-weak: var(--hop-koi-300);
128
135
  --hop-decorative-option2-surface-weakest: var(--hop-quetzal-25);
129
136
  --hop-decorative-option2-surface-weak: var(--hop-quetzal-50);
137
+ --hop-decorative-option2-surface-weak-hover: var(--hop-quetzal-75);
130
138
  --hop-decorative-option2-surface-strong: var(--hop-quetzal-100);
131
139
  --hop-decorative-option2-surface-hover: var(--hop-quetzal-100);
132
140
  --hop-decorative-option2-surface: var(--hop-quetzal-75);
@@ -137,6 +145,7 @@
137
145
  --hop-decorative-option1-surface-strong: var(--hop-sapphire-200);
138
146
  --hop-decorative-option1-surface-weakest: var(--hop-sapphire-25);
139
147
  --hop-decorative-option1-surface-weak: var(--hop-sapphire-50);
148
+ --hop-decorative-option1-surface-weak-hover: var(--hop-sapphire-75);
140
149
  --hop-decorative-option1-surface-hover: var(--hop-sapphire-200);
141
150
  --hop-decorative-option1-surface: var(--hop-sapphire-100);
142
151
  --hop-decorative-option1-text-weak: var(--hop-sapphire-300);
package/dist/tokens.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 03 Nov 2023 13:22:45 GMT
3
+ * Generated on Wed, 06 Dec 2023 19:36:37 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -583,7 +583,7 @@
583
583
  --hop-heading-xs-font-weight: var(--hop-font-weight-410);
584
584
  --hop-heading-xs-font-size: var(--hop-font-size-160);
585
585
  --hop-heading-xs-font-family: var(--hop-font-family-primary);
586
- --hop-heading-sm-line-height: var(--hop-line-height-1-50);
586
+ --hop-heading-sm-line-height: var(--hop-line-height-1-33);
587
587
  --hop-heading-sm-font-weight: var(--hop-font-weight-580);
588
588
  --hop-heading-sm-font-size: var(--hop-font-size-180);
589
589
  --hop-heading-sm-font-family: var(--hop-font-family-primary);
@@ -694,7 +694,7 @@
694
694
  --hop-warning-icon-weakest: var(--hop-koi-100);
695
695
  --hop-neutral-surface-weakest: var(--hop-rock-25);
696
696
  --hop-neutral-border-weakest: var(--hop-rock-50);
697
- --hop-neutral-surface-weak-hover: var(--hop-rock-50);
697
+ --hop-neutral-surface-weak-hover: var(--hop-rock-75);
698
698
  --hop-neutral-border-active: var(--hop-rock-800);
699
699
  --hop-neutral-border-hover: var(--hop-rock-300);
700
700
  --hop-neutral-icon-active: var(--hop-samoyed);
@@ -733,6 +733,7 @@
733
733
  --hop-decorative-option1-surface-hover: var(--hop-sapphire-200);
734
734
  --hop-decorative-option1-surface-strong: var(--hop-sapphire-200);
735
735
  --hop-decorative-option1-surface-weakest: var(--hop-sapphire-25);
736
+ --hop-decorative-option1-surface-weak-hover: var(--hop-sapphire-75);
736
737
  --hop-decorative-option1-surface-weak: var(--hop-sapphire-50);
737
738
  --hop-decorative-option2-border: var(--hop-quetzal-100);
738
739
  --hop-decorative-option2-icon: var(--hop-quetzal-900);
@@ -741,17 +742,19 @@
741
742
  --hop-decorative-option2-surface-hover: var(--hop-quetzal-100);
742
743
  --hop-decorative-option2-surface: var(--hop-quetzal-75);
743
744
  --hop-decorative-option2-surface-strong: var(--hop-quetzal-100);
745
+ --hop-decorative-option2-surface-weak-hover: var(--hop-quetzal-75);
744
746
  --hop-decorative-option2-surface-weak: var(--hop-quetzal-50);
745
747
  --hop-decorative-option2-surface-weakest: var(--hop-quetzal-25);
746
748
  --hop-decorative-option3-border: var(--hop-koi-100);
747
749
  --hop-decorative-option3-text-weak: var(--hop-koi-300);
748
750
  --hop-decorative-option3-text: var(--hop-koi-900);
749
751
  --hop-decorative-option3-icon: var(--hop-koi-900);
750
- --hop-decorative-option3-surface: var(--hop-koi-200);
752
+ --hop-decorative-option3-surface: var(--hop-koi-100);
751
753
  --hop-decorative-option3-surface-hover: var(--hop-koi-200);
752
754
  --hop-decorative-option3-surface-strong: var(--hop-koi-200);
753
755
  --hop-decorative-option3-surface-weakest: var(--hop-koi-25);
754
- --hop-decorative-option3-surface-weak: var(--hop-koi-100);
756
+ --hop-decorative-option3-surface-weak-hover: var(--hop-koi-75);
757
+ --hop-decorative-option3-surface-weak: var(--hop-koi-50);
755
758
  --hop-decorative-option4-border: var(--hop-moss-100);
756
759
  --hop-decorative-option4-text: var(--hop-moss-900);
757
760
  --hop-decorative-option4-text-weak: var(--hop-moss-400);
@@ -759,6 +762,7 @@
759
762
  --hop-decorative-option4-surface: var(--hop-moss-75);
760
763
  --hop-decorative-option4-surface-hover: var(--hop-moss-100);
761
764
  --hop-decorative-option4-surface-strong: var(--hop-moss-100);
765
+ --hop-decorative-option4-surface-weak-hover: var(--hop-moss-75);
762
766
  --hop-decorative-option4-surface-weak: var(--hop-moss-50);
763
767
  --hop-decorative-option4-surface-weakest: var(--hop-moss-25);
764
768
  --hop-decorative-option6-border: var(--hop-sunken-treasure-100);
@@ -768,6 +772,7 @@
768
772
  --hop-decorative-option6-surface: var(--hop-sunken-treasure-75);
769
773
  --hop-decorative-option6-surface-strong: var(--hop-sunken-treasure-100);
770
774
  --hop-decorative-option6-surface-hover: var(--hop-sunken-treasure-100);
775
+ --hop-decorative-option6-surface-weak-hover: var(--hop-sunken-treasure-75);
771
776
  --hop-decorative-option6-surface-weak: var(--hop-sunken-treasure-50);
772
777
  --hop-decorative-option6-surface-weakest: var(--hop-sunken-treasure-25);
773
778
  --hop-decorative-option5-border: var(--hop-coastal-100);
@@ -783,8 +788,9 @@
783
788
  --hop-decorative-option7-text: var(--hop-toad-900);
784
789
  --hop-decorative-option7-text-weak: var(--hop-toad-500);
785
790
  --hop-decorative-option7-surface: var(--hop-toad-75);
786
- --hop-decorative-option7-surface-hover: var(--hop-toad-75);
787
- --hop-decorative-option7-surface-strong: var(--hop-toad-75);
791
+ --hop-decorative-option7-surface-hover: var(--hop-toad-100);
792
+ --hop-decorative-option7-surface-strong: var(--hop-toad-100);
793
+ --hop-decorative-option7-surface-weak-hover: var(--hop-toad-75);
788
794
  --hop-decorative-option7-surface-weak: var(--hop-toad-50);
789
795
  --hop-decorative-option7-surface-weakest: var(--hop-toad-25);
790
796
  --hop-decorative-option7-icon: var(--hop-toad-900);
@@ -793,15 +799,17 @@
793
799
  --hop-decorative-option8-surface: var(--hop-amanita-75);
794
800
  --hop-decorative-option8-text-weak: var(--hop-amanita-300);
795
801
  --hop-decorative-option8-surface-strong: var(--hop-amanita-100);
796
- --hop-decorative-option8-surface-hover: var(--hop-amanita-200);
802
+ --hop-decorative-option8-surface-hover: var(--hop-amanita-100);
803
+ --hop-decorative-option8-surface-weak-hover: var(--hop-amanita-75);
797
804
  --hop-decorative-option8-surface-weak: var(--hop-amanita-50);
798
805
  --hop-decorative-option8-surface-weakest: var(--hop-amanita-25);
799
806
  --hop-decorative-option8-icon: var(--hop-amanita-900);
800
807
  --hop-decorative-option9-border: var(--hop-rock-100);
801
808
  --hop-decorative-option9-text-weak: var(--hop-rock-300);
802
809
  --hop-decorative-option9-text: var(--hop-samoyed);
803
- --hop-decorative-option9-surface-weakest: var(--hop-rock-25);
804
- --hop-decorative-option9-surface-weak: var(--hop-rock-50);
810
+ --hop-decorative-option9-surface-weakest: var(--hop-rock-200);
811
+ --hop-decorative-option9-surface-weak-hover: var(--hop-rock-400);
812
+ --hop-decorative-option9-surface-weak: var(--hop-rock-300);
805
813
  --hop-decorative-option9-surface-hover: var(--hop-rock-500);
806
814
  --hop-decorative-option9-surface-strong: var(--hop-rock-800);
807
815
  --hop-decorative-option9-surface: var(--hop-rock-400);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@hopper-ui/tokens",
3
3
  "author": "Workleap",
4
- "version": "3.0.0",
4
+ "version": "3.1.1",
5
5
  "description": "The tokens package.",
6
6
  "license": "Apache-2.0",
7
7
  "repository": {
@@ -29,15 +29,13 @@
29
29
  "CHANGELOG.md",
30
30
  "README.md"
31
31
  ],
32
- "dependencies": {
33
- "style-dictionary": "3.9.0"
34
- },
35
32
  "devDependencies": {
36
- "@types/node": "20.8.10",
33
+ "@types/node": "20.9.0",
37
34
  "@workleap/eslint-plugin": "3.0.0",
38
35
  "@workleap/tsup-configs": "3.0.1",
39
36
  "@workleap/typescript-configs": "3.0.2",
40
- "tsup": "7.2.0",
37
+ "style-dictionary": "3.9.0",
38
+ "tsx": "4.1.2",
41
39
  "typescript": "5.2.2"
42
40
  },
43
41
  "sideEffects": false,
@@ -46,9 +44,6 @@
46
44
  },
47
45
  "scripts": {
48
46
  "clean:dist": "pnpm dlx rimraf dist",
49
- "clean:build": "pnpm dlx rimraf build",
50
- "build:ts": "tsup",
51
- "build:tokens": "node build/build.js",
52
- "build": "pnpm run build:ts && pnpm run build:tokens && pnpm run clean:build"
47
+ "build": "tsx src/style-dictionary/build.ts"
53
48
  }
54
49
  }