@webitel/styleguide 26.8.10 → 26.8.11

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 (20) hide show
  1. package/package.json +5 -1
  2. package/src/lib/styleguide/token-generation/apps/crm/Dark.tokens.json +227 -0
  3. package/src/lib/styleguide/token-generation/apps/crm/Light.tokens.json +227 -0
  4. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/index.css +1 -0
  5. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/bot/dark/index.css +4 -0
  6. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/bot/index.css +2 -0
  7. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/bot/light/index.css +4 -0
  8. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/client/dark/index.css +4 -0
  9. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/client/index.css +2 -0
  10. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/client/light/index.css +4 -0
  11. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/index.css +3 -0
  12. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/operator/dark/index.css +4 -0
  13. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/operator/index.css +2 -0
  14. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/colors/operator/light/index.css +4 -0
  15. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/index.css +2 -0
  16. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/sizes/index.css +1 -0
  17. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/components/timeline/sizes/wrapper/index.css +5 -0
  18. package/src/lib/styleguide/token-generation/apps/crm/dist/crm/index.css +1 -0
  19. package/src/lib/styleguide/token-generation/apps/crm/dist/index.css +1 -0
  20. package/src/lib/styleguide/token-generation/apps/index.css +1 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webitel/styleguide",
3
- "version": "26.8.10",
3
+ "version": "26.8.11",
4
4
  "main": "",
5
5
  "files": [
6
6
  "src/"
@@ -49,6 +49,10 @@
49
49
  "style": "./src/lib/styleguide/token-generation/apps/agent-workspace-app/dist/index.css",
50
50
  "import": "./src/lib/styleguide/token-generation/apps/agent-workspace-app/dist/index.css"
51
51
  },
52
+ "./crm": {
53
+ "style": "./src/lib/styleguide/token-generation/apps/crm/dist/index.css",
54
+ "import": "./src/lib/styleguide/token-generation/apps/crm/dist/index.css"
55
+ },
52
56
  "./applications/auditor": "./src/applications/auditor/main.scss",
53
57
  "./applications/client": "./src/applications/client/main.scss",
54
58
  "./applications/crm": "./src/applications/crm/main.scss",
@@ -0,0 +1,227 @@
1
+ {
2
+ "Crm": {
3
+ "Components": {
4
+ "Timeline": {
5
+ "Colors": {
6
+ "Client": {
7
+ "background": {
8
+ "$type": "color",
9
+ "$value": {
10
+ "colorSpace": "srgb",
11
+ "components": [
12
+ 0.17500001192092896,
13
+ 0.15000000596046448,
14
+ 0.02500000037252903
15
+ ],
16
+ "alpha": 1,
17
+ "hex": "#2D2606"
18
+ },
19
+ "$extensions": {
20
+ "com.figma.variableId": "VariableID:9037:2419",
21
+ "com.figma.scopes": [
22
+ "FRAME_FILL",
23
+ "SHAPE_FILL"
24
+ ],
25
+ "com.figma.aliasData": {
26
+ "targetVariableId": "VariableID:ef9831056c64918056ceedb4bfeb0fdac5bf0c49/17801:875",
27
+ "targetVariableName": "yellow/900",
28
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
29
+ "targetVariableSetName": "Color Palette"
30
+ }
31
+ }
32
+ },
33
+ "backgroundHover": {
34
+ "$type": "color",
35
+ "$value": {
36
+ "colorSpace": "srgb",
37
+ "components": [
38
+ 0.10499999672174454,
39
+ 0.09000000357627869,
40
+ 0.014999999664723873
41
+ ],
42
+ "alpha": 1,
43
+ "hex": "#1B1704"
44
+ },
45
+ "$extensions": {
46
+ "com.figma.variableId": "VariableID:9037:2420",
47
+ "com.figma.scopes": [
48
+ "FRAME_FILL",
49
+ "SHAPE_FILL"
50
+ ],
51
+ "com.figma.aliasData": {
52
+ "targetVariableId": "VariableID:11d2bf3f64e9a40b22ec8b3e365ff3888ad649e3/17801:876",
53
+ "targetVariableName": "yellow/950",
54
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
55
+ "targetVariableSetName": "Color Palette"
56
+ }
57
+ }
58
+ }
59
+ },
60
+ "Operator": {
61
+ "background": {
62
+ "$type": "color",
63
+ "$value": {
64
+ "colorSpace": "srgb",
65
+ "components": [
66
+ 0.11999999731779099,
67
+ 0.13500000536441803,
68
+ 0.18000000715255737
69
+ ],
70
+ "alpha": 1,
71
+ "hex": "#1F222E"
72
+ },
73
+ "$extensions": {
74
+ "com.figma.variableId": "VariableID:9037:2424",
75
+ "com.figma.scopes": [
76
+ "FRAME_FILL",
77
+ "SHAPE_FILL"
78
+ ],
79
+ "com.figma.aliasData": {
80
+ "targetVariableId": "VariableID:cd7686b40328115e6c33a25cfa946cbcf2a6d575/17801:619",
81
+ "targetVariableName": "gray/850",
82
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
83
+ "targetVariableSetName": "Color Palette"
84
+ }
85
+ }
86
+ },
87
+ "backgroundHover": {
88
+ "$type": "color",
89
+ "$value": {
90
+ "colorSpace": "srgb",
91
+ "components": [
92
+ 0.08000000566244125,
93
+ 0.09000000357627869,
94
+ 0.11999999731779099
95
+ ],
96
+ "alpha": 1,
97
+ "hex": "#14171F"
98
+ },
99
+ "$extensions": {
100
+ "com.figma.variableId": "VariableID:9037:2425",
101
+ "com.figma.scopes": [
102
+ "FRAME_FILL",
103
+ "SHAPE_FILL"
104
+ ],
105
+ "com.figma.aliasData": {
106
+ "targetVariableId": "VariableID:401d767169e561c1cc64eca7c796d7c13113f928/17801:620",
107
+ "targetVariableName": "gray/900",
108
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
109
+ "targetVariableSetName": "Color Palette"
110
+ }
111
+ }
112
+ }
113
+ },
114
+ "Bot": {
115
+ "background": {
116
+ "$type": "color",
117
+ "$value": {
118
+ "colorSpace": "srgb",
119
+ "components": [
120
+ 0.11999999731779099,
121
+ 0.13500000536441803,
122
+ 0.18000000715255737
123
+ ],
124
+ "alpha": 1,
125
+ "hex": "#1F222E"
126
+ },
127
+ "$extensions": {
128
+ "com.figma.variableId": "VariableID:9037:2426",
129
+ "com.figma.scopes": [
130
+ "FRAME_FILL",
131
+ "SHAPE_FILL"
132
+ ],
133
+ "com.figma.aliasData": {
134
+ "targetVariableId": "VariableID:cd7686b40328115e6c33a25cfa946cbcf2a6d575/17801:619",
135
+ "targetVariableName": "gray/850",
136
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
137
+ "targetVariableSetName": "Color Palette"
138
+ }
139
+ }
140
+ },
141
+ "backgroundHover": {
142
+ "$type": "color",
143
+ "$value": {
144
+ "colorSpace": "srgb",
145
+ "components": [
146
+ 0.08000000566244125,
147
+ 0.09000000357627869,
148
+ 0.11999999731779099
149
+ ],
150
+ "alpha": 1,
151
+ "hex": "#14171F"
152
+ },
153
+ "$extensions": {
154
+ "com.figma.variableId": "VariableID:9037:2427",
155
+ "com.figma.scopes": [
156
+ "FRAME_FILL",
157
+ "SHAPE_FILL"
158
+ ],
159
+ "com.figma.aliasData": {
160
+ "targetVariableId": "VariableID:401d767169e561c1cc64eca7c796d7c13113f928/17801:620",
161
+ "targetVariableName": "gray/900",
162
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
163
+ "targetVariableSetName": "Color Palette"
164
+ }
165
+ }
166
+ }
167
+ }
168
+ },
169
+ "Sizes": {
170
+ "Wrapper": {
171
+ "borderRadius": {
172
+ "$type": "number",
173
+ "$value": 8,
174
+ "$extensions": {
175
+ "com.figma.variableId": "VariableID:9037:2421",
176
+ "com.figma.scopes": [
177
+ "CORNER_RADIUS"
178
+ ],
179
+ "com.figma.aliasData": {
180
+ "targetVariableId": "VariableID:d14f6335de0b2475c1896442a6b8ab8c97830d6f/22153:5616",
181
+ "targetVariableName": "Primitive/Sizes/Border-radius/lg",
182
+ "targetVariableSetId": "VariableCollectionId:09e157ed1d3dbde6798411cbb7cf14a8b93841e3/22153:5519",
183
+ "targetVariableSetName": "Components"
184
+ }
185
+ }
186
+ },
187
+ "padding": {
188
+ "$type": "number",
189
+ "$value": 16,
190
+ "$extensions": {
191
+ "com.figma.variableId": "VariableID:9037:2422",
192
+ "com.figma.scopes": [
193
+ "GAP"
194
+ ],
195
+ "com.figma.aliasData": {
196
+ "targetVariableId": "VariableID:2faf6cb942b067ca0a1aea500f5b16b25f785339/22153:5757",
197
+ "targetVariableName": "Primitive/Sizes/Paddings/sm",
198
+ "targetVariableSetId": "VariableCollectionId:09e157ed1d3dbde6798411cbb7cf14a8b93841e3/22153:5519",
199
+ "targetVariableSetName": "Components"
200
+ }
201
+ }
202
+ },
203
+ "gap": {
204
+ "$type": "number",
205
+ "$value": 8,
206
+ "$extensions": {
207
+ "com.figma.variableId": "VariableID:9037:2423",
208
+ "com.figma.scopes": [
209
+ "GAP"
210
+ ],
211
+ "com.figma.aliasData": {
212
+ "targetVariableId": "VariableID:e1e1f4d5089302aeea5d1a661419d75abcf1dc94/22153:5860",
213
+ "targetVariableName": "Primitive/Sizes/Gap/xs",
214
+ "targetVariableSetId": "VariableCollectionId:09e157ed1d3dbde6798411cbb7cf14a8b93841e3/22153:5519",
215
+ "targetVariableSetName": "Components"
216
+ }
217
+ }
218
+ }
219
+ }
220
+ }
221
+ }
222
+ }
223
+ },
224
+ "$extensions": {
225
+ "com.figma.modeName": "Dark"
226
+ }
227
+ }
@@ -0,0 +1,227 @@
1
+ {
2
+ "Crm": {
3
+ "Components": {
4
+ "Timeline": {
5
+ "Colors": {
6
+ "Client": {
7
+ "background": {
8
+ "$type": "color",
9
+ "$value": {
10
+ "colorSpace": "srgb",
11
+ "components": [
12
+ 0.987500011920929,
13
+ 0.9750000238418579,
14
+ 0.9124999642372131
15
+ ],
16
+ "alpha": 1,
17
+ "hex": "#FCF9E9"
18
+ },
19
+ "$extensions": {
20
+ "com.figma.variableId": "VariableID:9037:2419",
21
+ "com.figma.scopes": [
22
+ "FRAME_FILL",
23
+ "SHAPE_FILL"
24
+ ],
25
+ "com.figma.aliasData": {
26
+ "targetVariableId": "VariableID:25a7da2f8904fa6f3bb1755d472d75772c42c765/17801:858",
27
+ "targetVariableName": "yellow/50",
28
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
29
+ "targetVariableSetName": "Color Palette"
30
+ }
31
+ }
32
+ },
33
+ "backgroundHover": {
34
+ "$type": "color",
35
+ "$value": {
36
+ "colorSpace": "srgb",
37
+ "components": [
38
+ 0.9750000238418579,
39
+ 0.949999988079071,
40
+ 0.824999988079071
41
+ ],
42
+ "alpha": 1,
43
+ "hex": "#F9F2D2"
44
+ },
45
+ "$extensions": {
46
+ "com.figma.variableId": "VariableID:9037:2420",
47
+ "com.figma.scopes": [
48
+ "FRAME_FILL",
49
+ "SHAPE_FILL"
50
+ ],
51
+ "com.figma.aliasData": {
52
+ "targetVariableId": "VariableID:838e28d41b5a55f54836e064c24be16f155973e7/17801:859",
53
+ "targetVariableName": "yellow/100",
54
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
55
+ "targetVariableSetName": "Color Palette"
56
+ }
57
+ }
58
+ }
59
+ },
60
+ "Operator": {
61
+ "background": {
62
+ "$type": "color",
63
+ "$value": {
64
+ "colorSpace": "srgb",
65
+ "components": [
66
+ 0.9399999976158142,
67
+ 0.9449999928474426,
68
+ 0.9599999785423279
69
+ ],
70
+ "alpha": 1,
71
+ "hex": "#F0F1F5"
72
+ },
73
+ "$extensions": {
74
+ "com.figma.variableId": "VariableID:9037:2424",
75
+ "com.figma.scopes": [
76
+ "FRAME_FILL",
77
+ "SHAPE_FILL"
78
+ ],
79
+ "com.figma.aliasData": {
80
+ "targetVariableId": "VariableID:9a41a873e931b4276f0e16fe0df89ca66e68d929/17801:610",
81
+ "targetVariableName": "gray/50",
82
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
83
+ "targetVariableSetName": "Color Palette"
84
+ }
85
+ }
86
+ },
87
+ "backgroundHover": {
88
+ "$type": "color",
89
+ "$value": {
90
+ "colorSpace": "srgb",
91
+ "components": [
92
+ 0.8799999952316284,
93
+ 0.8899999856948853,
94
+ 0.9200000166893005
95
+ ],
96
+ "alpha": 1,
97
+ "hex": "#E0E3EB"
98
+ },
99
+ "$extensions": {
100
+ "com.figma.variableId": "VariableID:9037:2425",
101
+ "com.figma.scopes": [
102
+ "FRAME_FILL",
103
+ "SHAPE_FILL"
104
+ ],
105
+ "com.figma.aliasData": {
106
+ "targetVariableId": "VariableID:dde24776dc609df336560efaafb57da6f399a2ec/17801:611",
107
+ "targetVariableName": "gray/100",
108
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
109
+ "targetVariableSetName": "Color Palette"
110
+ }
111
+ }
112
+ }
113
+ },
114
+ "Bot": {
115
+ "background": {
116
+ "$type": "color",
117
+ "$value": {
118
+ "colorSpace": "srgb",
119
+ "components": [
120
+ 0.9399999976158142,
121
+ 0.9449999928474426,
122
+ 0.9599999785423279
123
+ ],
124
+ "alpha": 1,
125
+ "hex": "#F0F1F5"
126
+ },
127
+ "$extensions": {
128
+ "com.figma.variableId": "VariableID:9037:2426",
129
+ "com.figma.scopes": [
130
+ "FRAME_FILL",
131
+ "SHAPE_FILL"
132
+ ],
133
+ "com.figma.aliasData": {
134
+ "targetVariableId": "VariableID:9a41a873e931b4276f0e16fe0df89ca66e68d929/17801:610",
135
+ "targetVariableName": "gray/50",
136
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
137
+ "targetVariableSetName": "Color Palette"
138
+ }
139
+ }
140
+ },
141
+ "backgroundHover": {
142
+ "$type": "color",
143
+ "$value": {
144
+ "colorSpace": "srgb",
145
+ "components": [
146
+ 0.8799999952316284,
147
+ 0.8899999856948853,
148
+ 0.9200000166893005
149
+ ],
150
+ "alpha": 1,
151
+ "hex": "#E0E3EB"
152
+ },
153
+ "$extensions": {
154
+ "com.figma.variableId": "VariableID:9037:2427",
155
+ "com.figma.scopes": [
156
+ "FRAME_FILL",
157
+ "SHAPE_FILL"
158
+ ],
159
+ "com.figma.aliasData": {
160
+ "targetVariableId": "VariableID:dde24776dc609df336560efaafb57da6f399a2ec/17801:611",
161
+ "targetVariableName": "gray/100",
162
+ "targetVariableSetId": "VariableCollectionId:299d5ffa23fd6718056c6de9acf60987ca454648/17798:2177",
163
+ "targetVariableSetName": "Color Palette"
164
+ }
165
+ }
166
+ }
167
+ }
168
+ },
169
+ "Sizes": {
170
+ "Wrapper": {
171
+ "borderRadius": {
172
+ "$type": "number",
173
+ "$value": 8,
174
+ "$extensions": {
175
+ "com.figma.variableId": "VariableID:9037:2421",
176
+ "com.figma.scopes": [
177
+ "CORNER_RADIUS"
178
+ ],
179
+ "com.figma.aliasData": {
180
+ "targetVariableId": "VariableID:d14f6335de0b2475c1896442a6b8ab8c97830d6f/22153:5616",
181
+ "targetVariableName": "Primitive/Sizes/Border-radius/lg",
182
+ "targetVariableSetId": "VariableCollectionId:09e157ed1d3dbde6798411cbb7cf14a8b93841e3/22153:5519",
183
+ "targetVariableSetName": "Components"
184
+ }
185
+ }
186
+ },
187
+ "padding": {
188
+ "$type": "number",
189
+ "$value": 16,
190
+ "$extensions": {
191
+ "com.figma.variableId": "VariableID:9037:2422",
192
+ "com.figma.scopes": [
193
+ "GAP"
194
+ ],
195
+ "com.figma.aliasData": {
196
+ "targetVariableId": "VariableID:2faf6cb942b067ca0a1aea500f5b16b25f785339/22153:5757",
197
+ "targetVariableName": "Primitive/Sizes/Paddings/sm",
198
+ "targetVariableSetId": "VariableCollectionId:09e157ed1d3dbde6798411cbb7cf14a8b93841e3/22153:5519",
199
+ "targetVariableSetName": "Components"
200
+ }
201
+ }
202
+ },
203
+ "gap": {
204
+ "$type": "number",
205
+ "$value": 8,
206
+ "$extensions": {
207
+ "com.figma.variableId": "VariableID:9037:2423",
208
+ "com.figma.scopes": [
209
+ "GAP"
210
+ ],
211
+ "com.figma.aliasData": {
212
+ "targetVariableId": "VariableID:e1e1f4d5089302aeea5d1a661419d75abcf1dc94/22153:5860",
213
+ "targetVariableName": "Primitive/Sizes/Gap/xs",
214
+ "targetVariableSetId": "VariableCollectionId:09e157ed1d3dbde6798411cbb7cf14a8b93841e3/22153:5519",
215
+ "targetVariableSetName": "Components"
216
+ }
217
+ }
218
+ }
219
+ }
220
+ }
221
+ }
222
+ }
223
+ },
224
+ "$extensions": {
225
+ "com.figma.modeName": "Light"
226
+ }
227
+ }
@@ -0,0 +1 @@
1
+ @import "./timeline/index.css";
@@ -0,0 +1,4 @@
1
+ :root.theme--dark {
2
+ --wt-crm-components-timeline-colors-bot-background: #1F222E;
3
+ --wt-crm-components-timeline-colors-bot-background-hover: #14171F;
4
+ }
@@ -0,0 +1,2 @@
1
+ @import "./dark/index.css";
2
+ @import "./light/index.css";
@@ -0,0 +1,4 @@
1
+ :root {
2
+ --wt-crm-components-timeline-colors-bot-background: #F0F1F5;
3
+ --wt-crm-components-timeline-colors-bot-background-hover: #E0E3EB;
4
+ }
@@ -0,0 +1,4 @@
1
+ :root.theme--dark {
2
+ --wt-crm-components-timeline-colors-client-background: #2D2606;
3
+ --wt-crm-components-timeline-colors-client-background-hover: #1B1704;
4
+ }
@@ -0,0 +1,2 @@
1
+ @import "./dark/index.css";
2
+ @import "./light/index.css";
@@ -0,0 +1,4 @@
1
+ :root {
2
+ --wt-crm-components-timeline-colors-client-background: #FCF9E9;
3
+ --wt-crm-components-timeline-colors-client-background-hover: #F9F2D2;
4
+ }
@@ -0,0 +1,3 @@
1
+ @import "./bot/index.css";
2
+ @import "./client/index.css";
3
+ @import "./operator/index.css";
@@ -0,0 +1,4 @@
1
+ :root.theme--dark {
2
+ --wt-crm-components-timeline-colors-operator-background: #1F222E;
3
+ --wt-crm-components-timeline-colors-operator-background-hover: #14171F;
4
+ }
@@ -0,0 +1,2 @@
1
+ @import "./dark/index.css";
2
+ @import "./light/index.css";
@@ -0,0 +1,4 @@
1
+ :root {
2
+ --wt-crm-components-timeline-colors-operator-background: #F0F1F5;
3
+ --wt-crm-components-timeline-colors-operator-background-hover: #E0E3EB;
4
+ }
@@ -0,0 +1,2 @@
1
+ @import "./colors/index.css";
2
+ @import "./sizes/index.css";
@@ -0,0 +1,5 @@
1
+ :root {
2
+ --wt-crm-components-timeline-sizes-wrapper-border-radius: 8px;
3
+ --wt-crm-components-timeline-sizes-wrapper-padding: 16px;
4
+ --wt-crm-components-timeline-sizes-wrapper-gap: 8px;
5
+ }
@@ -0,0 +1 @@
1
+ @import "./components/index.css";
@@ -0,0 +1 @@
1
+ @import "./crm/index.css";
@@ -1 +1,2 @@
1
1
  @import "./agent-workspace-app/dist/index.css";
2
+ @import "./crm/dist/index.css";