@tidbcloud/uikit 2.0.0-beta.7 → 2.0.0-beta.9

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @tidbcloud/uikit
2
2
 
3
+ ## 2.0.0-beta.9
4
+
5
+ ### Minor Changes
6
+
7
+ - Update button styles and typography colors
8
+
9
+ ## 2.0.0-beta.8
10
+
11
+ ### Minor Changes
12
+
13
+ - add new theming color
14
+
3
15
  ## 2.0.0-beta.7
4
16
 
5
17
  ### Patch Changes
@@ -1,9 +1,9 @@
1
1
  import { default as React } from 'react';
2
2
  import { BoxProps } from '../../primitive/index.js';
3
- import { Colors } from '../../theme/index.js';
3
+ import { Color } from '../../theme/index.js';
4
4
 
5
5
  export interface DotProps extends BoxProps {
6
- color: keyof typeof Colors;
6
+ color: Color;
7
7
  size?: number;
8
8
  }
9
9
  export declare const Dot: React.FC<DotProps>;
@@ -1,9 +1,9 @@
1
1
  import { default as React } from 'react';
2
2
  import { BoxProps } from '../../primitive/index.js';
3
- import { Colors } from '../../theme/index.js';
3
+ import { Color } from '../../theme/index.js';
4
4
 
5
5
  export interface DotProps extends BoxProps {
6
- color: keyof typeof Colors;
6
+ color: Color;
7
7
  size?: number;
8
8
  }
9
9
  export declare const Dot: React.FC<DotProps>;
@@ -9,7 +9,7 @@ const TYPOGRAPHY_STYLES_MAP = {
9
9
  weight: 700,
10
10
  size: 18,
11
11
  lh: "28px",
12
- color: "gray.8"
12
+ color: "carbon.8"
13
13
  },
14
14
  display: {
15
15
  weight: 700,
@@ -25,31 +25,31 @@ const TYPOGRAPHY_STYLES_MAP = {
25
25
  weight: 700,
26
26
  size: 16,
27
27
  lh: "24px",
28
- color: "gray.7"
28
+ color: "carbon.7"
29
29
  },
30
30
  body1: {
31
31
  weight: 400,
32
32
  size: 14,
33
33
  lh: "20px",
34
- color: "gray.7"
34
+ color: "carbon.7"
35
35
  },
36
36
  body2: {
37
37
  weight: 500,
38
38
  size: 14,
39
39
  lh: "20px",
40
- color: "gray.8"
40
+ color: "carbon.8"
41
41
  },
42
42
  body3: {
43
43
  weight: 600,
44
44
  size: 14,
45
45
  lh: "20px",
46
- color: "gray.9"
46
+ color: "carbon.9"
47
47
  },
48
48
  btn: {
49
49
  weight: 700,
50
50
  size: 14,
51
51
  lh: "20px",
52
- color: "gray.8"
52
+ color: "carbon.8"
53
53
  },
54
54
  comment3: {
55
55
  size: 12,
@@ -61,103 +61,103 @@ const TYPOGRAPHY_STYLES_MAP = {
61
61
  size: 24,
62
62
  lh: "32px",
63
63
  weight: 700,
64
- color: "gray.9"
64
+ color: "carbon.9"
65
65
  },
66
66
  "headline-md": {
67
67
  size: 20,
68
68
  lh: "30px",
69
69
  weight: 700,
70
- color: "gray.9"
70
+ color: "carbon.9"
71
71
  },
72
72
  "headline-sm": {
73
73
  size: 18,
74
74
  lh: "28px",
75
75
  weight: 700,
76
- color: "gray.9"
76
+ color: "carbon.9"
77
77
  },
78
78
  "title-lg": {
79
79
  size: 16,
80
80
  lh: "24px",
81
81
  weight: 700,
82
- color: "gray.9"
82
+ color: "carbon.9"
83
83
  },
84
84
  "title-md": {
85
85
  size: 14,
86
86
  lh: "20px",
87
87
  weight: 700,
88
- color: "gray.9"
88
+ color: "carbon.9"
89
89
  },
90
90
  "title-sm": {
91
91
  size: 12,
92
92
  lh: "18px",
93
93
  weight: 700,
94
- color: "gray.9"
94
+ color: "carbon.9"
95
95
  },
96
96
  "action-lg": {
97
97
  size: 16,
98
98
  lh: "24px",
99
99
  weight: 600,
100
- color: "cyan.7"
100
+ color: "peacock.7"
101
101
  },
102
102
  "action-md": {
103
103
  size: 14,
104
104
  lh: "20px",
105
105
  weight: 600,
106
- color: "cyan.7"
106
+ color: "peacock.7"
107
107
  },
108
108
  "action-sm": {
109
109
  size: 12,
110
110
  lh: "18px",
111
111
  weight: 600,
112
- color: "cyan.7"
112
+ color: "peacock.7"
113
113
  },
114
114
  "label-lg": {
115
115
  size: 14,
116
116
  lh: "20px",
117
117
  weight: 500,
118
- color: "gray.8"
118
+ color: "carbon.8"
119
119
  },
120
120
  "label-md": {
121
121
  size: 13,
122
122
  lh: "18px",
123
123
  weight: 500,
124
- color: "gray.8"
124
+ color: "carbon.8"
125
125
  },
126
126
  "label-sm": {
127
127
  size: 12,
128
128
  lh: "18px",
129
129
  weight: 500,
130
- color: "gray.8"
130
+ color: "carbon.8"
131
131
  },
132
132
  "label-xs": {
133
133
  size: 11,
134
134
  lh: "16px",
135
135
  weight: 500,
136
- color: "gray.8"
136
+ color: "carbon.8"
137
137
  },
138
138
  "body-lg": {
139
139
  size: 14,
140
140
  lh: "20px",
141
141
  weight: 400,
142
- color: "gray.7"
142
+ color: "carbon.8"
143
143
  },
144
144
  "body-md": {
145
145
  size: 13,
146
146
  lh: "18px",
147
147
  weight: 400,
148
- color: "gray.7"
148
+ color: "carbon.8"
149
149
  },
150
150
  "body-sm": {
151
151
  size: 12,
152
152
  lh: "18px",
153
153
  weight: 400,
154
- color: "gray.7"
154
+ color: "carbon.8"
155
155
  },
156
156
  "body-xs": {
157
157
  size: 11,
158
158
  lh: "16px",
159
159
  weight: 400,
160
- color: "gray.7"
160
+ color: "carbon.8"
161
161
  }
162
162
  };
163
163
  const _Typography = React.forwardRef(({ children, variant, ...rest }, ref) => {
@@ -7,7 +7,7 @@ const TYPOGRAPHY_STYLES_MAP = {
7
7
  weight: 700,
8
8
  size: 18,
9
9
  lh: "28px",
10
- color: "gray.8"
10
+ color: "carbon.8"
11
11
  },
12
12
  display: {
13
13
  weight: 700,
@@ -23,31 +23,31 @@ const TYPOGRAPHY_STYLES_MAP = {
23
23
  weight: 700,
24
24
  size: 16,
25
25
  lh: "24px",
26
- color: "gray.7"
26
+ color: "carbon.7"
27
27
  },
28
28
  body1: {
29
29
  weight: 400,
30
30
  size: 14,
31
31
  lh: "20px",
32
- color: "gray.7"
32
+ color: "carbon.7"
33
33
  },
34
34
  body2: {
35
35
  weight: 500,
36
36
  size: 14,
37
37
  lh: "20px",
38
- color: "gray.8"
38
+ color: "carbon.8"
39
39
  },
40
40
  body3: {
41
41
  weight: 600,
42
42
  size: 14,
43
43
  lh: "20px",
44
- color: "gray.9"
44
+ color: "carbon.9"
45
45
  },
46
46
  btn: {
47
47
  weight: 700,
48
48
  size: 14,
49
49
  lh: "20px",
50
- color: "gray.8"
50
+ color: "carbon.8"
51
51
  },
52
52
  comment3: {
53
53
  size: 12,
@@ -59,103 +59,103 @@ const TYPOGRAPHY_STYLES_MAP = {
59
59
  size: 24,
60
60
  lh: "32px",
61
61
  weight: 700,
62
- color: "gray.9"
62
+ color: "carbon.9"
63
63
  },
64
64
  "headline-md": {
65
65
  size: 20,
66
66
  lh: "30px",
67
67
  weight: 700,
68
- color: "gray.9"
68
+ color: "carbon.9"
69
69
  },
70
70
  "headline-sm": {
71
71
  size: 18,
72
72
  lh: "28px",
73
73
  weight: 700,
74
- color: "gray.9"
74
+ color: "carbon.9"
75
75
  },
76
76
  "title-lg": {
77
77
  size: 16,
78
78
  lh: "24px",
79
79
  weight: 700,
80
- color: "gray.9"
80
+ color: "carbon.9"
81
81
  },
82
82
  "title-md": {
83
83
  size: 14,
84
84
  lh: "20px",
85
85
  weight: 700,
86
- color: "gray.9"
86
+ color: "carbon.9"
87
87
  },
88
88
  "title-sm": {
89
89
  size: 12,
90
90
  lh: "18px",
91
91
  weight: 700,
92
- color: "gray.9"
92
+ color: "carbon.9"
93
93
  },
94
94
  "action-lg": {
95
95
  size: 16,
96
96
  lh: "24px",
97
97
  weight: 600,
98
- color: "cyan.7"
98
+ color: "peacock.7"
99
99
  },
100
100
  "action-md": {
101
101
  size: 14,
102
102
  lh: "20px",
103
103
  weight: 600,
104
- color: "cyan.7"
104
+ color: "peacock.7"
105
105
  },
106
106
  "action-sm": {
107
107
  size: 12,
108
108
  lh: "18px",
109
109
  weight: 600,
110
- color: "cyan.7"
110
+ color: "peacock.7"
111
111
  },
112
112
  "label-lg": {
113
113
  size: 14,
114
114
  lh: "20px",
115
115
  weight: 500,
116
- color: "gray.8"
116
+ color: "carbon.8"
117
117
  },
118
118
  "label-md": {
119
119
  size: 13,
120
120
  lh: "18px",
121
121
  weight: 500,
122
- color: "gray.8"
122
+ color: "carbon.8"
123
123
  },
124
124
  "label-sm": {
125
125
  size: 12,
126
126
  lh: "18px",
127
127
  weight: 500,
128
- color: "gray.8"
128
+ color: "carbon.8"
129
129
  },
130
130
  "label-xs": {
131
131
  size: 11,
132
132
  lh: "16px",
133
133
  weight: 500,
134
- color: "gray.8"
134
+ color: "carbon.8"
135
135
  },
136
136
  "body-lg": {
137
137
  size: 14,
138
138
  lh: "20px",
139
139
  weight: 400,
140
- color: "gray.7"
140
+ color: "carbon.8"
141
141
  },
142
142
  "body-md": {
143
143
  size: 13,
144
144
  lh: "18px",
145
145
  weight: 400,
146
- color: "gray.7"
146
+ color: "carbon.8"
147
147
  },
148
148
  "body-sm": {
149
149
  size: 12,
150
150
  lh: "18px",
151
151
  weight: 400,
152
- color: "gray.7"
152
+ color: "carbon.8"
153
153
  },
154
154
  "body-xs": {
155
155
  size: 11,
156
156
  lh: "16px",
157
157
  weight: 400,
158
- color: "gray.7"
158
+ color: "carbon.8"
159
159
  }
160
160
  };
161
161
  const _Typography = forwardRef(({ children, variant, ...rest }, ref) => {