@sproutsocial/racine 9.0.1 → 9.1.1-theme-extension.0

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 (73) hide show
  1. package/CHANGELOG.md +0 -36
  2. package/__flow__/Breadcrumb/styles.js +5 -0
  3. package/__flow__/Button/styles.js +1 -1
  4. package/__flow__/Card/index.stories.js +1 -0
  5. package/__flow__/Card/styles.js +1 -1
  6. package/__flow__/CustomThemeProvider/index.js +16 -0
  7. package/__flow__/Drawer/index.stories.js +3 -3
  8. package/__flow__/Drawer/styles.js +1 -1
  9. package/__flow__/KeyboardKey/styles.js +1 -1
  10. package/__flow__/Listbox/__snapshots__/index.test.js.snap +34 -40
  11. package/__flow__/Menu/__snapshots__/index.test.js.snap +12 -15
  12. package/__flow__/Menu/index.js +7 -3
  13. package/__flow__/Menu/index.stories.js +1 -1
  14. package/__flow__/Menu/styles.js +18 -1
  15. package/__flow__/Modal/__snapshots__/index.test.js.snap +80 -0
  16. package/__flow__/Modal/index.test.js +16 -0
  17. package/__flow__/Modal/styles.js +1 -1
  18. package/__flow__/Popout/index.js +1 -1
  19. package/__flow__/ThemeProvider/index.js +2 -2
  20. package/__flow__/Token/index.js +1 -4
  21. package/__flow__/Token/index.stories.js +0 -11
  22. package/__flow__/Token/styles.js +33 -43
  23. package/__flow__/Tooltip/index.js +1 -1
  24. package/__flow__/index.js +1 -0
  25. package/__flow__/themes/dark/theme.js +156 -180
  26. package/__flow__/themes/default/theme.js +8 -19
  27. package/__flow__/themes/sprout/theme.js +22 -0
  28. package/__flow__/types/system-props.flow.js +2 -1
  29. package/__flow__/utils/extendTheme.js +17 -0
  30. package/commonjs/Breadcrumb/styles.js +1 -1
  31. package/commonjs/Button/styles.js +1 -1
  32. package/commonjs/Card/styles.js +1 -1
  33. package/commonjs/CustomThemeProvider/index.js +23 -0
  34. package/commonjs/Drawer/styles.js +1 -1
  35. package/commonjs/KeyboardKey/styles.js +1 -1
  36. package/commonjs/Menu/index.js +1 -3
  37. package/commonjs/Menu/styles.js +16 -3
  38. package/commonjs/Modal/styles.js +1 -1
  39. package/commonjs/Popout/index.js +1 -1
  40. package/commonjs/Token/index.js +2 -5
  41. package/commonjs/Token/styles.js +50 -19
  42. package/commonjs/Tooltip/index.js +1 -1
  43. package/commonjs/index.js +5 -1
  44. package/commonjs/themes/dark/theme.js +154 -179
  45. package/commonjs/themes/default/theme.js +8 -19
  46. package/commonjs/themes/sprout/theme.js +29 -0
  47. package/commonjs/utils/extendTheme.js +22 -0
  48. package/lib/Breadcrumb/styles.js +1 -1
  49. package/lib/Button/styles.js +1 -1
  50. package/lib/Card/styles.js +1 -1
  51. package/lib/CustomThemeProvider/index.js +12 -0
  52. package/lib/Drawer/styles.js +1 -1
  53. package/lib/KeyboardKey/styles.js +1 -1
  54. package/lib/Menu/index.js +2 -4
  55. package/lib/Menu/styles.js +13 -2
  56. package/lib/Modal/styles.js +1 -1
  57. package/lib/Popout/index.js +1 -1
  58. package/lib/Token/index.js +2 -5
  59. package/lib/Token/styles.js +50 -19
  60. package/lib/Tooltip/index.js +1 -1
  61. package/lib/index.js +1 -0
  62. package/lib/themes/dark/theme.js +153 -174
  63. package/lib/themes/default/theme.js +8 -18
  64. package/lib/themes/sprout/theme.js +19 -0
  65. package/lib/utils/extendTheme.js +12 -0
  66. package/package.json +10 -7
  67. package/__flow__/themes/_themes.scss +0 -138
  68. package/__flow__/themes/utils/interact.js +0 -12
  69. package/commonjs/themes/utils/interact.js +0 -19
  70. package/dist/themes/_themes.scss +0 -138
  71. package/dist/themes/dark.scss +0 -601
  72. package/dist/themes/default.scss +0 -692
  73. package/lib/themes/utils/interact.js +0 -13
@@ -1,601 +0,0 @@
1
- $dark: (
2
- __esModule: true,
3
- shadows: (
4
- low: 0px 2px 4px #040404FF,
5
- medium: 0px 8px 16px #040404FF,
6
- high: 0px 16px 32px #040404FF
7
- ),
8
- default: (
9
- utils: (
10
-
11
- ),
12
- breakpoints: (900px, 1200px, 1500px, 1800px),
13
- colors: (
14
- app: (
15
- background: (
16
- base: #162020
17
- )
18
- ),
19
- container: (
20
- background: (
21
- base: #273333,
22
- success: #006b40,
23
- warning: #944c0c,
24
- error: #992222,
25
- info: #0c5689,
26
- opportunity: #5e4eba,
27
- danger: #992222,
28
- decorative: (
29
- green: #006b40,
30
- blue: #0c5689,
31
- purple: #5e4eba,
32
- yellow: #944c0c,
33
- orange: #962c0b,
34
- red: #992222,
35
- neutral: #273333
36
- ),
37
- selected: #FFFFFF
38
- ),
39
- border: (
40
- base: #040404,
41
- success: #59cb59,
42
- warning: #ffbc00,
43
- error: #ed4c42,
44
- danger: #ed4c42,
45
- info: #2b87d3,
46
- opportunity: #9180f4,
47
- decorative: (
48
- green: #59cb59,
49
- blue: #2b87d3,
50
- purple: #9180f4,
51
- yellow: #ffbc00,
52
- orange: #f57d33,
53
- red: #ed4c42,
54
- neutral: #929a9b
55
- ),
56
- selected: #FFFFFF
57
- )
58
- ),
59
- button: (
60
- primary: (
61
- background: (
62
- base: #56adf5,
63
- hover: #a1d2f8,
64
- active: #c7e4f9
65
- ),
66
- border: (
67
- base: transparent
68
- ),
69
- text: (
70
- base: #273333,
71
- hover: #162020
72
- )
73
- ),
74
- secondary: (
75
- background: (
76
- base: transparent,
77
- hover: #f3f4f4,
78
- active: #FFFFFF
79
- ),
80
- border: (
81
- base: #FFFFFF
82
- ),
83
- text: (
84
- base: #FFFFFF,
85
- hover: #364141
86
- )
87
- ),
88
- pill: (
89
- background: (
90
- base: transparent,
91
- hover: #162020,
92
- active: #273333
93
- ),
94
- border: (
95
- base: transparent
96
- ),
97
- text: (
98
- base: #f3f4f4,
99
- hover: #FFFFFF
100
- )
101
- ),
102
- destructive: (
103
- background: (
104
- base: #ff7f6e,
105
- hover: #ff9c8f,
106
- active: #ffb8b1
107
- ),
108
- border: (
109
- base: transparent
110
- ),
111
- text: (
112
- base: #273333,
113
- hover: #162020
114
- )
115
- ),
116
- placeholder: (
117
- background: (
118
- base: transparent,
119
- hover: #040404,
120
- active: #040404
121
- ),
122
- border: (
123
- base: #929a9b
124
- ),
125
- text: (
126
- base: #56adf5,
127
- hover: #a1d2f8
128
- )
129
- ),
130
- unstyled: (
131
- background: (
132
- base: transparent
133
- ),
134
- border: (
135
- base: transparent
136
- ),
137
- text: (
138
- base: #c8cccc,
139
- hover: #dee1e1
140
- )
141
- )
142
- ),
143
- link: (
144
- base: #56adf5,
145
- hover: #a1d2f8
146
- ),
147
- text: (
148
- headline: #FFFFFF,
149
- subtext: #c8cccc,
150
- body: #f3f4f4,
151
- inverse: #273333,
152
- error: #ff7f6e
153
- ),
154
- icon: (
155
- base: #f3f4f4,
156
- inverse: #273333,
157
- success: #d7f4d7,
158
- warning: #fdefcd,
159
- error: #ffd5d2,
160
- danger: #ffd5d2,
161
- info: #dcf2ff,
162
- opportunity: #eaeaf9
163
- ),
164
- form: (
165
- background: (
166
- base: #273333,
167
- selected: #FFFFFF
168
- ),
169
- border: (
170
- base: #929a9b,
171
- error: #ed4c42,
172
- warning: #ffbc00,
173
- selected: #FFFFFF
174
- ),
175
- placeholder: (
176
- base: #929a9b
177
- )
178
- ),
179
- listItem: (
180
- background: (
181
- base: transparent,
182
- hover: #364141,
183
- selected: #FFFFFF
184
- )
185
- ),
186
- elevation: (
187
- base: #040404
188
- ),
189
- network: (
190
- twitter: #1da1f2,
191
- twitter_like: #e0245e,
192
- facebook: #217bee,
193
- facebook_audience_network: #58409B,
194
- linkedin: #0A66C2,
195
- instagram: #e4405f,
196
- feedly: #2bb24c,
197
- analytics: #ef6c00,
198
- youtube: #ff0000,
199
- messenger: #0084ff,
200
- snapchat: #fffc00,
201
- pinterest: #E60023,
202
- tumblr: #35465c,
203
- reddit: #ff4500,
204
- tripadvisor: #00B087,
205
- glassdoor: #0CAA41,
206
- google_my_business: #4285F4,
207
- google_business_messages: #1A73EA,
208
- salesforce: #1589EE,
209
- zendesk: #03363D,
210
- hubspot: #FF7A59,
211
- microsoft_dynamics: #002050,
212
- yelp: #FF1A1A,
213
- whatsapp: #25D366,
214
- tiktok: #000000
215
- ),
216
- dataviz: (
217
- map: (
218
- 1: #24e0c5,
219
- 2: #a193f2,
220
- 3: #ff76ae,
221
- 4: #ffcd1c,
222
- 5: #56adf5,
223
- 6: #f282f5,
224
- 7: #75dd66,
225
- 8: #ff9c5d,
226
- 9: #db3e3e,
227
- 10: #0b968f,
228
- 11: #6f5ed3,
229
- 12: #ce3665,
230
- 13: #ba7506,
231
- 14: #2079c3,
232
- 15: #ac44a8,
233
- 16: #0ca750,
234
- 17: #ed7024,
235
- 18: #ff7f6e,
236
- 19: #c2f2bd,
237
- 20: #ffe99a
238
- ),
239
- list: (#24e0c5, #a193f2, #ff76ae, #ffcd1c, #56adf5, #f282f5, #75dd66, #ff9c5d, #db3e3e, #0b968f, #6f5ed3, #ce3665, #ba7506, #2079c3, #ac44a8, #0ca750, #ed7024, #ff7f6e, #c2f2bd, #ffe99a)
240
- ),
241
- neutral: (
242
- 0: #FFFFFF,
243
- 100: #f3f4f4,
244
- 200: #dee1e1,
245
- 300: #c8cccc,
246
- 400: #b0b6b7,
247
- 500: #929a9b,
248
- 600: #6e797a,
249
- 700: #515e5f,
250
- 800: #364141,
251
- 900: #273333,
252
- 1000: #162020
253
- ),
254
- green: (
255
- 0: #ebf9eb,
256
- 100: #d7f4d7,
257
- 200: #c2f2bd,
258
- 300: #98e58e,
259
- 400: #75dd66,
260
- 500: #59cb59,
261
- 600: #2bb656,
262
- 700: #0ca750,
263
- 800: #008b46,
264
- 900: #006b40,
265
- 1000: #08422f,
266
- 1100: #002b20
267
- ),
268
- red: (
269
- 0: #ffeae9,
270
- 100: #ffd5d2,
271
- 200: #ffb8b1,
272
- 300: #ff9c8f,
273
- 400: #ff7f6e,
274
- 500: #f76054,
275
- 600: #ed4c42,
276
- 700: #db3e3e,
277
- 800: #c63434,
278
- 900: #992222,
279
- 1000: #6d1313
280
- ),
281
- blue: (
282
- 0: #e9f8ff,
283
- 100: #dcf2ff,
284
- 200: #c7e4f9,
285
- 300: #a1d2f8,
286
- 400: #56adf5,
287
- 500: #3896e3,
288
- 600: #2b87d3,
289
- 700: #2079c3,
290
- 800: #116daa,
291
- 900: #0c5689,
292
- 1000: #0a3960,
293
- 1100: #002138
294
- ),
295
- teal: (
296
- 0: #e5f9f5,
297
- 100: #cdf7ef,
298
- 200: #b3f2e6,
299
- 300: #7dead5,
300
- 400: #24e0c5,
301
- 500: #08c4b2,
302
- 600: #00a99c,
303
- 700: #0b968f,
304
- 800: #067c7c,
305
- 900: #026661,
306
- 1000: #083f3f,
307
- 1100: #002528
308
- ),
309
- aqua: (
310
- 0: #d9fcfb,
311
- 100: #c5f9f9,
312
- 200: #a5f2f2,
313
- 300: #76e5e2,
314
- 400: #33d6e2,
315
- 500: #17b8ce,
316
- 600: #0797ae,
317
- 700: #0b8599,
318
- 800: #0f6e84,
319
- 900: #035e73,
320
- 1000: #083d4f,
321
- 1100: #002838
322
- ),
323
- purple: (
324
- 0: #f2f2f9,
325
- 100: #eaeaf9,
326
- 200: #d8d7f9,
327
- 300: #c1c1f7,
328
- 400: #a193f2,
329
- 500: #9180f4,
330
- 600: #816fea,
331
- 700: #6f5ed3,
332
- 800: #5e4eba,
333
- 900: #483a9c,
334
- 1000: #2d246b,
335
- 1100: #1d1d38
336
- ),
337
- magenta: (
338
- 0: #fef0ff,
339
- 100: #f9e3fc,
340
- 200: #f4c4f7,
341
- 300: #edadf2,
342
- 400: #f282f5,
343
- 500: #db61db,
344
- 600: #c44eb9,
345
- 700: #ac44a8,
346
- 800: #8f3896,
347
- 900: #6c2277,
348
- 1000: #451551,
349
- 1100: #29192d
350
- ),
351
- yellow: (
352
- 0: #fff8e2,
353
- 100: #fdefcd,
354
- 200: #ffe99a,
355
- 300: #ffe16e,
356
- 400: #ffd943,
357
- 500: #ffcd1c,
358
- 600: #ffbc00,
359
- 700: #dd9903,
360
- 800: #ba7506,
361
- 900: #944c0c,
362
- 1000: #542a00,
363
- 1100: #2d1a05
364
- ),
365
- pink: (
366
- 0: #ffe9f3,
367
- 100: #fcdbeb,
368
- 200: #ffb5d5,
369
- 300: #ff95c1,
370
- 400: #ff76ae,
371
- 500: #ef588b,
372
- 600: #e0447c,
373
- 700: #ce3665,
374
- 800: #b22f5b,
375
- 900: #931847,
376
- 1000: #561231,
377
- 1100: #2b1721
378
- ),
379
- orange: (
380
- 0: #ffede3,
381
- 100: #fcdccc,
382
- 200: #ffc6a4,
383
- 300: #ffb180,
384
- 400: #ff9c5d,
385
- 500: #fc8943,
386
- 600: #f57d33,
387
- 700: #ed7024,
388
- 800: #ce5511,
389
- 900: #962c0b,
390
- 1000: #601700,
391
- 1100: #2d130e
392
- ),
393
- DATAVIZ_COLORS_LIST: (#24e0c5, #a193f2, #ff76ae, #ffcd1c, #56adf5, #f282f5, #75dd66, #ff9c5d, #db3e3e, #0b968f, #6f5ed3, #ce3665, #ba7506, #2079c3, #ac44a8, #0ca750, #ed7024, #ff7f6e, #c2f2bd, #ffe99a),
394
- DATAVIZ_COLORS_MAP: (
395
- 1: #24e0c5,
396
- 2: #a193f2,
397
- 3: #ff76ae,
398
- 4: #ffcd1c,
399
- 5: #56adf5,
400
- 6: #f282f5,
401
- 7: #75dd66,
402
- 8: #ff9c5d,
403
- 9: #db3e3e,
404
- 10: #0b968f,
405
- 11: #6f5ed3,
406
- 12: #ce3665,
407
- 13: #ba7506,
408
- 14: #2079c3,
409
- 15: #ac44a8,
410
- 16: #0ca750,
411
- 17: #ed7024,
412
- 18: #ff7f6e,
413
- 19: #c2f2bd,
414
- 20: #ffe99a
415
- ),
416
- utils: (
417
-
418
- )
419
- ),
420
- typography: (
421
- 100: (
422
- fontSize: 11px,
423
- lineHeight: 18.666666666666668px
424
- ),
425
- 200: (
426
- fontSize: 13px,
427
- lineHeight: 21.333333333333332px
428
- ),
429
- 300: (
430
- fontSize: 16px,
431
- lineHeight: 24px
432
- ),
433
- 400: (
434
- fontSize: 18px,
435
- lineHeight: 26.666666666666668px
436
- ),
437
- 500: (
438
- fontSize: 21px,
439
- lineHeight: 29.333333333333332px
440
- ),
441
- 600: (
442
- fontSize: 24px,
443
- lineHeight: 32px
444
- ),
445
- 700: (
446
- fontSize: 32px,
447
- lineHeight: 40px
448
- ),
449
- 800: (
450
- fontSize: 43px,
451
- lineHeight: 50.666666666666664px
452
- ),
453
- 900: (
454
- fontSize: 57px,
455
- lineHeight: 64px
456
- ),
457
- 1000: (
458
- fontSize: 76px,
459
- lineHeight: 80px
460
- ),
461
- 1100: (
462
- fontSize: 101px,
463
- lineHeight: 101.33333333333333px
464
- ),
465
- 1200: (
466
- fontSize: 135px,
467
- lineHeight: 125.33333333333333px
468
- ),
469
- typography: (
470
- 100: (
471
- fontSize: 11px,
472
- lineHeight: 18.666666666666668px
473
- ),
474
- 200: (
475
- fontSize: 13px,
476
- lineHeight: 21.333333333333332px
477
- ),
478
- 300: (
479
- fontSize: 16px,
480
- lineHeight: 24px
481
- ),
482
- 400: (
483
- fontSize: 18px,
484
- lineHeight: 26.666666666666668px
485
- ),
486
- 500: (
487
- fontSize: 21px,
488
- lineHeight: 29.333333333333332px
489
- ),
490
- 600: (
491
- fontSize: 24px,
492
- lineHeight: 32px
493
- ),
494
- 700: (
495
- fontSize: 32px,
496
- lineHeight: 40px
497
- ),
498
- 800: (
499
- fontSize: 43px,
500
- lineHeight: 50.666666666666664px
501
- ),
502
- 900: (
503
- fontSize: 57px,
504
- lineHeight: 64px
505
- ),
506
- 1000: (
507
- fontSize: 76px,
508
- lineHeight: 80px
509
- ),
510
- 1100: (
511
- fontSize: 101px,
512
- lineHeight: 101.33333333333333px
513
- ),
514
- 1200: (
515
- fontSize: 135px,
516
- lineHeight: 125.33333333333333px
517
- )
518
- )
519
- ),
520
- fontFamily: "system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif",
521
- fontWeights: (
522
- normal: 400,
523
- semibold: 600,
524
- bold: 700,
525
- extrabold: 800
526
- ),
527
- space: (
528
- 0: 0px,
529
- 100: 2px,
530
- 200: 4px,
531
- 300: 8px,
532
- 350: 12px,
533
- 400: 16px,
534
- 450: 24px,
535
- 500: 32px,
536
- 600: 40px,
537
- space: (
538
- 0: 0px,
539
- 100: 2px,
540
- 200: 4px,
541
- 300: 8px,
542
- 350: 12px,
543
- 400: 16px,
544
- 450: 24px,
545
- 500: 32px,
546
- 600: 40px
547
- ),
548
- -space: (
549
- 0: -0px,
550
- 100: -2px,
551
- 200: -4px,
552
- 300: -8px,
553
- 350: -12px,
554
- 400: -16px,
555
- 450: -24px,
556
- 500: -32px,
557
- 600: -40px
558
- )
559
- ),
560
- radii: (
561
- 400: 4px,
562
- 500: 6px,
563
- 600: 8px,
564
- 1000: 999999px,
565
- inner: 6px,
566
- outer: 8px,
567
- pill: 999999px,
568
- radii: (
569
- 400: 4px,
570
- 500: 6px,
571
- 600: 8px,
572
- 1000: 999999px,
573
- inner: 6px,
574
- outer: 8px,
575
- pill: 999999px
576
- )
577
- ),
578
- borders: (
579
- 500: 1px solid
580
- ),
581
- borderWidths: (
582
- 500: 1px
583
- ),
584
- shadows: (
585
- low: 0px 2px 4px #040404FF,
586
- medium: 0px 8px 16px #040404FF,
587
- high: 0px 16px 32px #040404FF
588
- ),
589
- easing: (
590
- ease_in: cubic-bezier(.4, 0, .7, .2),
591
- ease_out: cubic-bezier(0, 0, .2, 1),
592
- ease_inout: cubic-bezier(.4, 0, .2, 1)
593
- ),
594
- duration: (
595
- fast: .15s,
596
- medium: .3s,
597
- slow: .6s
598
- ),
599
- mode: default-dark
600
- )
601
- );