@livechat/design-system-react-components 1.0.0-alpha.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 (131) hide show
  1. package/dist/dsrc.cjs.js +15 -0
  2. package/dist/dsrc.es.js +4415 -0
  3. package/dist/dsrc.umd.js +15 -0
  4. package/dist/shadow/shadow.css +7 -0
  5. package/dist/shadow/shadow.css.map +1 -0
  6. package/dist/shadow/spacing.css +18 -0
  7. package/dist/shadow/spacing.css.map +1 -0
  8. package/dist/spacing/shadow.css +7 -0
  9. package/dist/spacing/shadow.css.map +1 -0
  10. package/dist/spacing/spacing.css +18 -0
  11. package/dist/spacing/spacing.css.map +1 -0
  12. package/dist/src/components/Alert/Alert.d.ts +9 -0
  13. package/dist/src/components/Alert/index.d.ts +1 -0
  14. package/dist/src/components/Avatar/Avatar.d.ts +19 -0
  15. package/dist/src/components/Avatar/Avatar.helpers.d.ts +2 -0
  16. package/dist/src/components/Avatar/index.d.ts +1 -0
  17. package/dist/src/components/Badge/Badge.d.ts +9 -0
  18. package/dist/src/components/Badge/Badge.helpers.d.ts +1 -0
  19. package/dist/src/components/Badge/index.d.ts +1 -0
  20. package/dist/src/components/Button/Button.d.ts +14 -0
  21. package/dist/src/components/Button/index.d.ts +2 -0
  22. package/dist/src/components/Card/Card.d.ts +12 -0
  23. package/dist/src/components/Card/index.d.ts +2 -0
  24. package/dist/src/components/Checkbox/Checkbox.d.ts +7 -0
  25. package/dist/src/components/Checkbox/index.d.ts +1 -0
  26. package/dist/src/components/DatePicker/DatePicker.d.ts +4 -0
  27. package/dist/src/components/DatePicker/DatePickerNavbar.d.ts +4 -0
  28. package/dist/src/components/DatePicker/RangeDatePicker.d.ts +16 -0
  29. package/dist/src/components/DatePicker/helpers.d.ts +39 -0
  30. package/dist/src/components/DatePicker/hooks.d.ts +6 -0
  31. package/dist/src/components/DatePicker/index.d.ts +2 -0
  32. package/dist/src/components/DatePicker/types.d.ts +100 -0
  33. package/dist/src/components/FieldDescription/FieldDescription.d.ts +3 -0
  34. package/dist/src/components/FieldDescription/index.d.ts +1 -0
  35. package/dist/src/components/FieldError/FieldError.d.ts +3 -0
  36. package/dist/src/components/FieldError/index.d.ts +1 -0
  37. package/dist/src/components/FieldGroup/FieldGroup.d.ts +8 -0
  38. package/dist/src/components/FieldGroup/index.d.ts +1 -0
  39. package/dist/src/components/FileUploadProgress/FileUploadProgress.d.ts +15 -0
  40. package/dist/src/components/FileUploadProgress/FileUploadProgressActions.d.ts +9 -0
  41. package/dist/src/components/FileUploadProgress/index.d.ts +2 -0
  42. package/dist/src/components/Form/Form.d.ts +7 -0
  43. package/dist/src/components/Form/index.d.ts +2 -0
  44. package/dist/src/components/FormField/FormField.d.ts +13 -0
  45. package/dist/src/components/FormField/index.d.ts +1 -0
  46. package/dist/src/components/FormGroup/FormGroup.d.ts +7 -0
  47. package/dist/src/components/FormGroup/index.d.ts +1 -0
  48. package/dist/src/components/Icon/Icon.d.ts +14 -0
  49. package/dist/src/components/Icon/index.d.ts +1 -0
  50. package/dist/src/components/Input/Input.d.ts +14 -0
  51. package/dist/src/components/Input/index.d.ts +1 -0
  52. package/dist/src/components/Link/Link.d.ts +14 -0
  53. package/dist/src/components/Link/index.d.ts +1 -0
  54. package/dist/src/components/Loader/Loader.d.ts +10 -0
  55. package/dist/src/components/Loader/index.d.ts +1 -0
  56. package/dist/src/components/Modal/Modal.d.ts +9 -0
  57. package/dist/src/components/Modal/ModalBase.d.ts +7 -0
  58. package/dist/src/components/Modal/ModalCloseButton.d.ts +6 -0
  59. package/dist/src/components/Modal/ModalPortal.d.ts +7 -0
  60. package/dist/src/components/Modal/index.d.ts +8 -0
  61. package/dist/src/components/NumericInput/NumericInput.d.ts +14 -0
  62. package/dist/src/components/NumericInput/index.d.ts +1 -0
  63. package/dist/src/components/Picker/Picker.d.ts +23 -0
  64. package/dist/src/components/Picker/PickerList.d.ts +23 -0
  65. package/dist/src/components/Picker/Trigger.d.ts +15 -0
  66. package/dist/src/components/Picker/TriggerBody.d.ts +16 -0
  67. package/dist/src/components/Picker/constants.d.ts +21 -0
  68. package/dist/src/components/Picker/index.d.ts +2 -0
  69. package/dist/src/components/Popover/Popover.d.ts +12 -0
  70. package/dist/src/components/Popover/index.d.ts +1 -0
  71. package/dist/src/components/Progress/ProgressBar.d.ts +9 -0
  72. package/dist/src/components/Progress/ProgressCircle.d.ts +9 -0
  73. package/dist/src/components/Progress/constants.d.ts +4 -0
  74. package/dist/src/components/Progress/helpers.d.ts +3 -0
  75. package/dist/src/components/Progress/index.d.ts +2 -0
  76. package/dist/src/components/PromoBanner/PromoBanner.d.ts +13 -0
  77. package/dist/src/components/PromoBanner/index.d.ts +1 -0
  78. package/dist/src/components/RadioButton/RadioButton.d.ts +7 -0
  79. package/dist/src/components/RadioButton/index.d.ts +1 -0
  80. package/dist/src/components/Search/Search.d.ts +12 -0
  81. package/dist/src/components/Search/index.d.ts +1 -0
  82. package/dist/src/components/SegmentedControl/SegmentedControl.d.ts +18 -0
  83. package/dist/src/components/SegmentedControl/index.d.ts +2 -0
  84. package/dist/src/components/Switch/Switch.d.ts +17 -0
  85. package/dist/src/components/Switch/index.d.ts +1 -0
  86. package/dist/src/components/Tab/Tab.d.ts +15 -0
  87. package/dist/src/components/Tab/TabsWrapper.d.ts +3 -0
  88. package/dist/src/components/Tab/index.d.ts +2 -0
  89. package/dist/src/components/Tag/Tag.d.ts +14 -0
  90. package/dist/src/components/Tag/index.d.ts +1 -0
  91. package/dist/src/components/TagInput/EditableTag.d.ts +11 -0
  92. package/dist/src/components/TagInput/EditableTagContent.d.ts +11 -0
  93. package/dist/src/components/TagInput/EmailTagInput.d.ts +5 -0
  94. package/dist/src/components/TagInput/TagInput.d.ts +13 -0
  95. package/dist/src/components/TagInput/index.d.ts +4 -0
  96. package/dist/src/components/Textarea/Textarea.d.ts +6 -0
  97. package/dist/src/components/Textarea/index.d.ts +1 -0
  98. package/dist/src/components/Toast/Toast.d.ts +16 -0
  99. package/dist/src/components/Toast/ToastWrapper.d.ts +20 -0
  100. package/dist/src/components/Toast/index.d.ts +2 -0
  101. package/dist/src/components/Tooltip/Info.d.ts +8 -0
  102. package/dist/src/components/Tooltip/Interactive.d.ts +14 -0
  103. package/dist/src/components/Tooltip/Simple.d.ts +4 -0
  104. package/dist/src/components/Tooltip/SpotlightOverlay.d.ts +7 -0
  105. package/dist/src/components/Tooltip/Tooltip.d.ts +22 -0
  106. package/dist/src/components/Tooltip/UserGuide.d.ts +12 -0
  107. package/dist/src/components/Tooltip/helpers.d.ts +2 -0
  108. package/dist/src/components/Tooltip/index.d.ts +5 -0
  109. package/dist/src/components/Tooltip/virtualElementReference.d.ts +9 -0
  110. package/dist/src/components/Typography/Heading.d.ts +11 -0
  111. package/dist/src/components/Typography/Text.d.ts +15 -0
  112. package/dist/src/components/Typography/index.d.ts +2 -0
  113. package/dist/src/components/UploadBar/UploadBar.d.ts +16 -0
  114. package/dist/src/components/UploadBar/index.d.ts +1 -0
  115. package/dist/src/foundations/shadow-token.d.ts +5 -0
  116. package/dist/src/foundations/spacing-token.d.ts +16 -0
  117. package/dist/src/index.d.ts +41 -0
  118. package/dist/src/themes/design-token.d.ts +226 -0
  119. package/dist/src/utils/constants.d.ts +1 -0
  120. package/dist/src/utils/index.d.ts +1 -0
  121. package/dist/src/utils/keyCodes.d.ts +12 -0
  122. package/dist/src/utils/noop.d.ts +1 -0
  123. package/dist/src/vite-env.d.ts +1 -0
  124. package/dist/style.css +1 -0
  125. package/dist/themes/dark.css +236 -0
  126. package/dist/themes/dark.css.map +1 -0
  127. package/dist/themes/legacy.css +237 -0
  128. package/dist/themes/legacy.css.map +1 -0
  129. package/dist/themes/light.css +236 -0
  130. package/dist/themes/light.css.map +1 -0
  131. package/package.json +83 -0
@@ -0,0 +1,237 @@
1
+ :root,
2
+ .lc-legacy-theme {
3
+ --background: #fff;
4
+ --background-01: #fff;
5
+ --background-02: #fff;
6
+ --background-03: #f1f1f2;
7
+ --surface-basic-default: #fff;
8
+ --surface-primary-default: #fff;
9
+ --surface-basic-subtle: #f1f6f8;
10
+ --surface-secondary-default: #f1f6f8;
11
+ --surface-secondary-hover: #e0e8eb;
12
+ --surface-secondary-active: #dae4eb;
13
+ --surface-secondary-disabled: #eaedf0;
14
+ --surface-basic-hover: #e0e8eb;
15
+ --surface-primary-hover: #f3f6f7;
16
+ --surface-basic-active: #dae4eb;
17
+ --surface-primary-active: #ebf1f4;
18
+ --surface-primary-active-colored: rgb(66 132 245 / 25%);
19
+ --surface-basic-disabled: #eaedf0;
20
+ --surface-primary-disabled: #f9fafb;
21
+ --surface-tertiary-default: #e4e8ec;
22
+ --surface-secondary-subtle: #e4e8ec;
23
+ --surface-moderate-default: #bdc7d1;
24
+ --surface-moderate-hover: #b7c2cd;
25
+ --surface-moderate-active: #b1bdc9;
26
+ --surface-tertiary-hover: #c2c2c6;
27
+ --surface-tertiary-active: #bababe;
28
+ --surface-tertiary-disabled: #e4e8ec;
29
+ --surface-feedback-info: #e5f3ff;
30
+ --surface-accent-emphasis-low-info: #e6f3ff;
31
+ --surface-feedback-negative: #fbeaed;
32
+ --surface-accent-emphasis-low-negative: #fbeaed;
33
+ --surface-feedback-warning: #fff8e0;
34
+ --surface-accent-emphasis-low-warning: #fff8e0;
35
+ --surface-feedback-positive: #e6f4ec;
36
+ --surface-accent-emphasis-low-positive: #e6f4ec;
37
+ --surface-accent-emphasis-low-purple: #eee8ff;
38
+ --surface-accent-emphasis-min-info: #f4faff;
39
+ --surface-accent-emphasis-min-negative: #fff8f8;
40
+ --surface-accent-emphasis-min-warning: #fff9ed;
41
+ --surface-accent-emphasis-min-positive: #f3fcf4;
42
+ --surface-accent-emphasis-min-purple: #faf8ff;
43
+ --surface-invert-default: #424d57;
44
+ --surface-invert-primary: #424d57;
45
+ --surface-invert-subtle: #677179;
46
+ --surface-invert-secondary: #677179;
47
+ --surface-invert-disabled: #a0a6ab;
48
+ --surface-locked-default: #fff;
49
+ --surface-locked-hover: #efeff0;
50
+ --surface-locked-active: #daedff;
51
+ --surface-locked-disabled: rgb(255 255 255 / 70%);
52
+ --surface-locked-white: #fff;
53
+ --surface-locked-black: #000;
54
+ --surface-accent-emphasis-high-info: #4284f5;
55
+ --surface-accent-emphasis-high-negative: #d74747;
56
+ --surface-accent-emphasis-high-warning: #fbbd04;
57
+ --surface-accent-emphasis-high-positive: #22aa61;
58
+ --surface-accent-emphasis-high-purple: #9642f5;
59
+ --surface-overlay: rgb(0 0 0 / 70%);
60
+ --surface-other-overlay: rgb(0 0 0 / 70%);
61
+ --surface-other-agent: #4284f5;
62
+ --surface-other-skeleton: #e5e8ec;
63
+ --content-default: #424d57;
64
+ --content-basic-primary: #424d57;
65
+ --content-subtle: #677179;
66
+ --content-basic-secondary: #677179;
67
+ --content-disabled: #a0a6ab;
68
+ --content-basic-disabled: #a0a6ab;
69
+ --content-basic-negative: #930002;
70
+ --content-basic-warning: #755b00;
71
+ --content-basic-positive: #005321;
72
+ --content-basic-info: #003fa4;
73
+ --content-basic-purple: #6100bd;
74
+ --content-basic-gradient-01: linear-gradient(
75
+ 254.49deg,
76
+ #b99aff -0.38%,
77
+ #68afff 94.44%
78
+ );
79
+ --content-white-locked: #fff;
80
+ --content-locked-white: #fff;
81
+ --content-black-locked: #424d57;
82
+ --content-locked-black: #000;
83
+ --content-locked-default: #424d57;
84
+ --content-locked-hover: #131317;
85
+ --content-locked-active: #003fa4;
86
+ --content-locked-disabled: #8d8d95;
87
+ --content-invert-default: #fff;
88
+ --content-invert-primary: #fff;
89
+ --content-invert-subtle: rgb(255 255 255 / 70%);
90
+ --content-invert-secondary: rgb(255 255 255 / 70%);
91
+ --content-invert-disabled: rgb(255 255 255 / 50%);
92
+ --content-invert-gradient-01: linear-gradient(
93
+ 254.49deg,
94
+ #b99aff -0.38%,
95
+ #68afff 94.44%
96
+ );
97
+ --border-default: #bdc7d1;
98
+ --border-basic-primary: #bdc7d1;
99
+ --border-basic-secondary: #e4e8ec;
100
+ --border-subtle: #e4e8ec;
101
+ --border-basic-tertiary: #e9edf0;
102
+ --border-hover: #a0a6ab;
103
+ --border-basic-hover: #a0a6ab;
104
+ --border-disabled: #dee3e8;
105
+ --border-basic-disabled: #dee3e8;
106
+ --border-basic-negative: #930002;
107
+ --border-basic-warning: #755b00;
108
+ --border-basic-positive: #005321;
109
+ --border-basic-info: #003fa4;
110
+ --border-basic-purple: #6100bd;
111
+ --border-invert-default: rgb(255 255 255 / 70%);
112
+ --border-invert-primary: rgb(255 255 255 / 70%);
113
+ --border-invert-subtle: rgb(255 255 255 / 30%);
114
+ --border-invert-secondary: rgb(255 255 255 / 30%);
115
+ --border-invert-hover: #fff;
116
+ --border-invert-disabled: rgb(255 255 255 / 50%);
117
+ --color-action-active: #295fbc;
118
+ --action-primary-active: #295fbc;
119
+ --color-action-hover: #4379d6;
120
+ --action-primary-hover: #4379d6;
121
+ --color-action-default: #4284f5;
122
+ --action-primary-default: #4284f5;
123
+ --color-action-default-rgb: 66, 132, 245;
124
+ --color-action-disabled: #a3c3fa;
125
+ --action-primary-disabled: #a3c3fa;
126
+ --color-negative-active: #94383a;
127
+ --action-negative-active: #94383a;
128
+ --color-negative-hover: #b94648;
129
+ --action-negative-hover: #b94648;
130
+ --color-negative-default: #d74747;
131
+ --action-negative-default: #d74747;
132
+ --color-negative-disabled: #eba3a3;
133
+ --action-negative-disabled: #eba3a3;
134
+ --color-warning-default: #fbbd04;
135
+ --action-warning-default: #fbbd04;
136
+ --color-warning-hover: #f99a01;
137
+ --action-warning-hover: #f99a01;
138
+ --color-positive-default: #22aa61;
139
+ --action-positive-default: #22aa61;
140
+ --color-positive-hover: #0d874a;
141
+ --action-positive-hover: #0d874a;
142
+ --color-positive-disabled: #90d5c4;
143
+ --action-positive-disabled: #90d5c4;
144
+ --action-neutral-default: #bdc7d1;
145
+ --action-neutral-hover: #a0a6ab;
146
+ --action-neutral-disabled: #dee3e8;
147
+ --color-bot: #6b5aba;
148
+ --surface-other-bot: #6b5aba;
149
+ --color-black: #424d57;
150
+ --color-white: #fff;
151
+ --decor-blue900: #003288;
152
+ --decor-blue800: #003fa4;
153
+ --decor-blue700: #004bc2;
154
+ --decor-blue600: #0059e1;
155
+ --decor-blue500: #06f;
156
+ --decor-blue400: #328dff;
157
+ --decor-blue300: #68afff;
158
+ --decor-blue200: #9dceff;
159
+ --decor-blue100: #daedff;
160
+ --decor-blue50: #f4faff;
161
+ --decor-orange900: #6c1d00;
162
+ --decor-orange800: #842600;
163
+ --decor-orange700: #9c2e00;
164
+ --decor-orange600: #b43700;
165
+ --decor-orange500: #d54300;
166
+ --decor-orange400: #ff5100;
167
+ --decor-orange300: #ff8a77;
168
+ --decor-orange200: #ffb8af;
169
+ --decor-orange100: #ffe5e3;
170
+ --decor-orange50: #fff8f7;
171
+ --decor-yellow900: #493700;
172
+ --decor-yellow800: #755b00;
173
+ --decor-yellow700: #c9a100;
174
+ --decor-yellow600: #e8bb00;
175
+ --decor-yellow500: #f3c600;
176
+ --decor-yellow400: #d1aa00;
177
+ --decor-yellow300: #fed65e;
178
+ --decor-yellow200: #fedc89;
179
+ --decor-yellow100: #fff2d6;
180
+ --decor-yellow50: #fff9ed;
181
+ --decor-gray950: #131317;
182
+ --decor-gray900: #1b1b20;
183
+ --decor-gray800: #29292f;
184
+ --decor-gray700: #3b3b43;
185
+ --decor-gray600: #4e4e58;
186
+ --decor-gray500: #62626d;
187
+ --decor-gray400: #767680;
188
+ --decor-gray300: #8d8d95;
189
+ --decor-gray200: #ababb1;
190
+ --decor-gray150: #c9c9cd;
191
+ --decor-gray100: #c9c9cd;
192
+ --decor-gray75: #eeeeef;
193
+ --decor-gray50: #e2e2e4;
194
+ --decor-gray40: #eeeeef;
195
+ --decor-gray20: #fcfcfc;
196
+ --decor-green900: #00431a;
197
+ --decor-green800: #005321;
198
+ --decor-green700: #006329;
199
+ --decor-green600: #007331;
200
+ --decor-green500: #00893c;
201
+ --decor-green400: #00a449;
202
+ --decor-green300: #00c057;
203
+ --decor-green200: #7edd92;
204
+ --decor-green100: #e4f4ed;
205
+ --decor-green50: #f3fcf4;
206
+ --decor-red900: #790002;
207
+ --decor-red800: #930002;
208
+ --decor-red700: #ae0003;
209
+ --decor-red600: #ca0005;
210
+ --decor-red500: #ee0007;
211
+ --decor-red400: #ff4c4d;
212
+ --decor-red300: #ff8889;
213
+ --decor-red200: #ffb7b7;
214
+ --decor-red100: #ffe5e5;
215
+ --decor-red50: #fff8f8;
216
+ --decor-purple900: #50009c;
217
+ --decor-purple800: #6100bd;
218
+ --decor-purple700: #7400df;
219
+ --decor-purple600: #8609ff;
220
+ --decor-purple500: #9146ff;
221
+ --decor-purple400: #a372ff;
222
+ --decor-purple300: #b99aff;
223
+ --decor-purple200: #d1c0ff;
224
+ --decor-purple100: #eee8ff;
225
+ --decor-purple50: #faf8ff;
226
+ --products-livechat: #fe5100;
227
+ --products-helpdesk: #00c057;
228
+ --products-chatbot: #06f;
229
+ --products-knowledgebase: #9146ff;
230
+ --illustrations-primary: #ffd000;
231
+ --illustrations-secondary: #e2e2e4;
232
+ --illustrations-stroke: #1b1b20;
233
+ --tag-surface-01: #e4e8ec;
234
+ --tag-content-01: #424d57;
235
+ }
236
+
237
+ /*# sourceMappingURL=legacy.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../src/themes/legacy.scss"],"names":[],"mappings":"AAAA;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAAA;AAAA;AAAA;AAAA;EAKA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAAA;AAAA;AAAA;AAAA;EAKA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA","file":"legacy.css"}
@@ -0,0 +1,236 @@
1
+ .lc-light-theme {
2
+ --background: #fff;
3
+ --background-01: #fff;
4
+ --background-02: #fff;
5
+ --background-03: #f1f1f2;
6
+ --surface-basic-default: #fff;
7
+ --surface-primary-default: #fff;
8
+ --surface-basic-subtle: #f6f6f7;
9
+ --surface-secondary-default: #f1f1f2;
10
+ --surface-secondary-hover: #e8e8ea;
11
+ --surface-secondary-active: #dfdfe1;
12
+ --surface-secondary-disabled: #f6f6f7;
13
+ --surface-basic-hover: #e2e2e4;
14
+ --surface-primary-hover: #f6f6f6;
15
+ --surface-basic-active: #c9c9cd;
16
+ --surface-primary-active: #ececec;
17
+ --surface-primary-active-colored: rgb(0 102 255 / 25%);
18
+ --surface-basic-disabled: #f6f6f7;
19
+ --surface-primary-disabled: #f6f6f7;
20
+ --surface-tertiary-default: #e2e2e4;
21
+ --surface-secondary-subtle: #e4e8ec;
22
+ --surface-moderate-default: #c9c9cd;
23
+ --surface-moderate-hover: #c2c2c6;
24
+ --surface-moderate-active: #bababe;
25
+ --surface-tertiary-hover: #dadadc;
26
+ --surface-tertiary-active: #d1d1d4;
27
+ --surface-tertiary-disabled: #eeeeef;
28
+ --surface-feedback-info: #daedff;
29
+ --surface-accent-emphasis-low-info: #daedff;
30
+ --surface-feedback-negative: #ffe5e5;
31
+ --surface-accent-emphasis-low-negative: #ffe5e5;
32
+ --surface-feedback-warning: #fff2d6;
33
+ --surface-accent-emphasis-low-warning: #ffe9bc;
34
+ --surface-feedback-positive: #e4f4ed;
35
+ --surface-accent-emphasis-low-positive: #d1f4d5;
36
+ --surface-accent-emphasis-low-purple: #eee8ff;
37
+ --surface-accent-emphasis-min-info: #f4faff;
38
+ --surface-accent-emphasis-min-negative: #fff8f8;
39
+ --surface-accent-emphasis-min-warning: #fff9ed;
40
+ --surface-accent-emphasis-min-positive: #f3fcf4;
41
+ --surface-accent-emphasis-min-purple: #faf8ff;
42
+ --surface-invert-default: #1b1b20;
43
+ --surface-invert-primary: #1b1b20;
44
+ --surface-invert-subtle: #4e4e58;
45
+ --surface-invert-secondary: #3b3b43;
46
+ --surface-invert-disabled: #8d8d95;
47
+ --surface-locked-default: #fff;
48
+ --surface-locked-hover: #eeeeef;
49
+ --surface-locked-active: #daedff;
50
+ --surface-locked-disabled: rgb(255 255 255 / 70%);
51
+ --surface-locked-white: #fff;
52
+ --surface-locked-black: #000;
53
+ --surface-accent-emphasis-high-info: #06f;
54
+ --surface-accent-emphasis-high-negative: #ca0005;
55
+ --surface-accent-emphasis-high-warning: #e8bb00;
56
+ --surface-accent-emphasis-high-positive: #00893c;
57
+ --surface-accent-emphasis-high-purple: #9146ff;
58
+ --surface-overlay: rgb(19 19 23 / 70%);
59
+ --surface-other-overlay: rgb(19 19 23 / 70%);
60
+ --surface-other-agent: #06f;
61
+ --surface-other-skeleton: #e2e2e4;
62
+ --content-default: #131317;
63
+ --content-basic-primary: #131317;
64
+ --content-subtle: #62626d;
65
+ --content-basic-secondary: #4e4e58;
66
+ --content-disabled: #8d8d95;
67
+ --content-basic-disabled: #8d8d95;
68
+ --content-basic-negative: #ca0005;
69
+ --content-basic-warning: #755b00;
70
+ --content-basic-positive: #005321;
71
+ --content-basic-info: #003fa4;
72
+ --content-basic-purple: #6100bd;
73
+ --content-basic-gradient-01: linear-gradient(
74
+ 254.49deg,
75
+ #b99aff -0.38%,
76
+ #68afff 94.44%
77
+ );
78
+ --content-white-locked: #fff;
79
+ --content-locked-white: #fff;
80
+ --content-black-locked: #131317;
81
+ --content-locked-black: #000;
82
+ --content-locked-default: #131317;
83
+ --content-locked-hover: #131317;
84
+ --content-locked-active: #003fa4;
85
+ --content-locked-disabled: #8d8d95;
86
+ --content-invert-default: #fff;
87
+ --content-invert-primary: #fff;
88
+ --content-invert-subtle: rgb(255 255 255 / 70%);
89
+ --content-invert-secondary: rgb(255 255 255 / 70%);
90
+ --content-invert-disabled: rgb(255 255 255 / 50%);
91
+ --content-invert-gradient-01: linear-gradient(
92
+ 254.49deg,
93
+ #b99aff -0.38%,
94
+ #68afff 94.44%
95
+ );
96
+ --border-default: #c9c9cd;
97
+ --border-basic-primary: #c9c9cd;
98
+ --border-basic-secondary: #e2e2e4;
99
+ --border-subtle: #eeeeef;
100
+ --border-basic-tertiary: #e5e5e6;
101
+ --border-hover: #ababb1;
102
+ --border-basic-hover: #ababb1;
103
+ --border-disabled: #e2e2e4;
104
+ --border-basic-disabled: #e2e2e4;
105
+ --border-basic-negative: #ca0005;
106
+ --border-basic-warning: #755b00;
107
+ --border-basic-positive: #005321;
108
+ --border-basic-info: #003fa4;
109
+ --border-basic-purple: #6100bd;
110
+ --border-invert-default: rgb(255 255 255 / 70%);
111
+ --border-invert-primary: rgb(255 255 255 / 70%);
112
+ --border-invert-subtle: rgb(255 255 255 / 30%);
113
+ --border-invert-secondary: rgb(255 255 255 / 30%);
114
+ --border-invert-hover: #fff;
115
+ --border-invert-disabled: rgb(255 255 255 / 50%);
116
+ --color-action-active: #003fa4;
117
+ --action-primary-active: #b7cbea;
118
+ --color-action-hover: #004bc2;
119
+ --action-primary-hover: #064db9;
120
+ --color-action-default: #06f;
121
+ --action-primary-default: #06f;
122
+ --color-action-default-rgb: 0, 102, 255;
123
+ --color-action-disabled: #9dceff;
124
+ --action-primary-disabled: rgb(0 102 255 / 20%);
125
+ --color-negative-active: #930002;
126
+ --action-negative-active: #6f090e;
127
+ --color-negative-hover: #ae0003;
128
+ --action-negative-hover: #8d0004;
129
+ --color-negative-default: #ca0005;
130
+ --action-negative-default: #ca0005;
131
+ --color-negative-disabled: #eba3a3;
132
+ --action-negative-disabled: rgb(202 0 5 / 20%);
133
+ --color-warning-default: #e8bb00;
134
+ --action-warning-default: #e8bb00;
135
+ --color-warning-hover: #c9a100;
136
+ --action-warning-hover: #a88907;
137
+ --color-positive-default: #00893c;
138
+ --action-positive-default: #00893c;
139
+ --color-positive-hover: #006329;
140
+ --action-positive-hover: #066631;
141
+ --color-positive-disabled: #d1f4d5;
142
+ --action-positive-disabled: rgb(0 137 60 / 20%);
143
+ --action-neutral-default: #8d8d95;
144
+ --action-neutral-hover: #68686f;
145
+ --action-neutral-disabled: rgb(141 141 149 / 20%);
146
+ --color-bot: #50009c;
147
+ --surface-other-bot: #50009c;
148
+ --color-black: #131317;
149
+ --color-white: #fff;
150
+ --decor-blue900: #003288;
151
+ --decor-blue800: #003fa4;
152
+ --decor-blue700: #004bc2;
153
+ --decor-blue600: #0059e1;
154
+ --decor-blue500: #06f;
155
+ --decor-blue400: #328dff;
156
+ --decor-blue300: #68afff;
157
+ --decor-blue200: #9dceff;
158
+ --decor-blue100: #daedff;
159
+ --decor-blue50: #f4faff;
160
+ --decor-orange900: #6c1d00;
161
+ --decor-orange800: #842600;
162
+ --decor-orange700: #9c2e00;
163
+ --decor-orange600: #b43700;
164
+ --decor-orange500: #d54300;
165
+ --decor-orange400: #ff5100;
166
+ --decor-orange300: #ff8a77;
167
+ --decor-orange200: #ffb8af;
168
+ --decor-orange100: #ffe5e3;
169
+ --decor-orange50: #fff8f7;
170
+ --decor-yellow900: #493700;
171
+ --decor-yellow800: #755b00;
172
+ --decor-yellow700: #c9a100;
173
+ --decor-yellow600: #e8bb00;
174
+ --decor-yellow500: #f3c600;
175
+ --decor-yellow400: #d1aa00;
176
+ --decor-yellow300: #fed65e;
177
+ --decor-yellow200: #fedc89;
178
+ --decor-yellow100: #fff2d6;
179
+ --decor-yellow50: #fff9ed;
180
+ --decor-gray950: #131317;
181
+ --decor-gray900: #1b1b20;
182
+ --decor-gray800: #29292f;
183
+ --decor-gray700: #3b3b43;
184
+ --decor-gray600: #4e4e58;
185
+ --decor-gray500: #62626d;
186
+ --decor-gray400: #767680;
187
+ --decor-gray300: #8d8d95;
188
+ --decor-gray200: #ababb1;
189
+ --decor-gray150: #c9c9cd;
190
+ --decor-gray100: #c9c9cd;
191
+ --decor-gray75: #eeeeef;
192
+ --decor-gray50: #e2e2e4;
193
+ --decor-gray40: #eeeeef;
194
+ --decor-gray20: #fcfcfc;
195
+ --decor-green900: #00431a;
196
+ --decor-green800: #005321;
197
+ --decor-green700: #006329;
198
+ --decor-green600: #007331;
199
+ --decor-green500: #00893c;
200
+ --decor-green400: #00a449;
201
+ --decor-green300: #00c057;
202
+ --decor-green200: #7edd92;
203
+ --decor-green100: #e4f4ed;
204
+ --decor-green50: #f3fcf4;
205
+ --decor-red900: #790002;
206
+ --decor-red800: #930002;
207
+ --decor-red700: #ae0003;
208
+ --decor-red600: #ca0005;
209
+ --decor-red500: #ee0007;
210
+ --decor-red400: #ff4c4d;
211
+ --decor-red300: #ff8889;
212
+ --decor-red200: #ffb7b7;
213
+ --decor-red100: #ffe5e5;
214
+ --decor-red50: #fff8f8;
215
+ --decor-purple900: #50009c;
216
+ --decor-purple800: #6100bd;
217
+ --decor-purple700: #7400df;
218
+ --decor-purple600: #8609ff;
219
+ --decor-purple500: #9146ff;
220
+ --decor-purple400: #a372ff;
221
+ --decor-purple300: #b99aff;
222
+ --decor-purple200: #d1c0ff;
223
+ --decor-purple100: #eee8ff;
224
+ --decor-purple50: #faf8ff;
225
+ --products-livechat: #fe5100;
226
+ --products-helpdesk: #00c057;
227
+ --products-chatbot: #06f;
228
+ --products-knowledgebase: #9146ff;
229
+ --illustrations-primary: #ffd000;
230
+ --illustrations-secondary: #e2e2e4;
231
+ --illustrations-stroke: #1b1b20;
232
+ --tag-surface-01: #e2e2e4;
233
+ --tag-content-01: #131317;
234
+ }
235
+
236
+ /*# sourceMappingURL=light.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../src/themes/light.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAAA;AAAA;AAAA;AAAA;EAKA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAAA;AAAA;AAAA;AAAA;EAKA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA","file":"light.css"}
package/package.json ADDED
@@ -0,0 +1,83 @@
1
+ {
2
+ "name": "@livechat/design-system-react-components",
3
+ "version": "1.0.0-alpha.0",
4
+ "description": "",
5
+ "publishConfig": {
6
+ "access": "public"
7
+ },
8
+ "author": "",
9
+ "license": "ISC",
10
+ "main": "./dist/dsrc.cjs.js",
11
+ "module": "./dist/dsrc.es.js",
12
+ "unpkg": "./dist/dsrc.umd.js",
13
+ "types": "./dist/src/index.d.ts",
14
+ "files": [
15
+ "dist"
16
+ ],
17
+ "scripts": {
18
+ "dev": "run-p dev:*",
19
+ "dev:storybook": "start-storybook -p 6006 --quiet",
20
+ "dev:lib": "vite build -w",
21
+ "dev:styles": "npm run build:styles -- --watch",
22
+ "build": "run-s build:*",
23
+ "build:lib": "tsc && vite build",
24
+ "build:styles": "sass src/themes:dist/themes; sass src/foundations:dist/spacing; sass src/foundations:dist/shadow",
25
+ "build-storybook": "export SET NODE_OPTIONS=--openssl-legacy-provider && build-storybook",
26
+ "chromatic": "dotenv -e ../../.env chromatic -- --exit-zero-on-changes",
27
+ "lint": "eslint src --ext js,jsx,ts,tsx",
28
+ "test": "vitest run",
29
+ "test:watch": "vitest watch",
30
+ "test:coverage": "vitest run --coverage"
31
+ },
32
+ "peerDependencies": {
33
+ "react": ">= 17.0.2",
34
+ "react-dom": ">= 17.0.2"
35
+ },
36
+ "devDependencies": {
37
+ "@babel/core": "^7.17.7",
38
+ "@storybook/addon-a11y": "^6.5.16",
39
+ "@storybook/addon-actions": "^6.4.22",
40
+ "@storybook/addon-docs": "^6.4.22",
41
+ "@storybook/addon-essentials": "^6.4.22",
42
+ "@storybook/addon-links": "^6.4.22",
43
+ "@storybook/builder-vite": "^0.1.28",
44
+ "@storybook/core-common": "^6.4.22",
45
+ "@storybook/react": "^6.4.22",
46
+ "@testing-library/jest-dom": "^5.16.2",
47
+ "@testing-library/react": "^12.1.4",
48
+ "@testing-library/user-event": "^13.5.0",
49
+ "@types/lodash.debounce": "^4.0.6",
50
+ "@types/lodash.escape": "^4.0.6",
51
+ "@types/react": "^17.0.33",
52
+ "@types/react-dom": "^17.0.10",
53
+ "@types/react-transition-group": "^4.4.4",
54
+ "@vitejs/plugin-react": "^1.0.7",
55
+ "babel-loader": "^8.2.3",
56
+ "chromatic": "^5.9.2",
57
+ "jsdom": "^19.0.0",
58
+ "react": "^17.0.2",
59
+ "react-dom": "^17.0.2",
60
+ "sass": "^1.49.9",
61
+ "storybook-addon-themes": "^6.1.0",
62
+ "typescript": "^4.5.4",
63
+ "vite": "^2.8.0",
64
+ "vite-plugin-dts": "^0.9.10",
65
+ "vitest": "^0.6.3"
66
+ },
67
+ "dependencies": {
68
+ "@emotion/css": "^11.9.0",
69
+ "@floating-ui/react-dom": "^0.7.0",
70
+ "@floating-ui/react-dom-interactions": "^0.6.1",
71
+ "@livechat/data-utils": "^0.2.16",
72
+ "@livechat/design-system-icons": "^1.0.0-alpha.35",
73
+ "@popperjs/core": "^2.11.2",
74
+ "clsx": "^1.1.1",
75
+ "date-fns": "^2.28.0",
76
+ "lodash.debounce": "^4.0.8",
77
+ "lodash.escape": "^4.0.1",
78
+ "polished": "^4.1.3",
79
+ "react-day-picker": "^7.4.10",
80
+ "react-transition-group": "^4.4.2"
81
+ },
82
+ "gitHead": "fd3402a9f35d24b90f9affe9f3026103a1b73aab"
83
+ }