@itilite/lumina-ui 1.0.1 → 1.0.21

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/README.md CHANGED
@@ -22,6 +22,43 @@ npm install react antd
22
22
 
23
23
  ## Usage
24
24
 
25
+ ### Prerequisites
26
+
27
+ This component library requires Tailwind CSS to be set up in your consuming application. The components use Tailwind utility classes and will not be styled without it.
28
+
29
+ #### Setting up Tailwind CSS in your app
30
+
31
+ 1. Install Tailwind CSS:
32
+ ```bash
33
+ npm install -D tailwindcss postcss autoprefixer
34
+ npx tailwindcss init
35
+ ```
36
+
37
+ 2. Configure Tailwind to scan your app (you don't need to scan the component library):
38
+ ```js
39
+ // tailwind.config.js
40
+ module.exports = {
41
+ content: [
42
+ "./src/**/*.{js,ts,jsx,tsx}",
43
+ // No need to scan node_modules - component utilities are pre-compiled
44
+ ],
45
+ theme: {
46
+ extend: {},
47
+ },
48
+ plugins: [],
49
+ }
50
+ ```
51
+
52
+ 3. Add Tailwind directives to your main CSS file:
53
+ ```css
54
+ /* app.css or index.css */
55
+ @tailwind base;
56
+ @tailwind components;
57
+ @tailwind utilities;
58
+ ```
59
+
60
+ **Important:** The component library includes only the Tailwind utilities it uses. Your app must provide the base/reset styles via `@tailwind base`.
61
+
25
62
  ### Importing Components
26
63
 
27
64
  You can import components individually (recommended for tree-shaking):
@@ -29,21 +66,20 @@ You can import components individually (recommended for tree-shaking):
29
66
  ```tsx
30
67
  import { Button } from '@itilite/lumina-ui/button';
31
68
  import { Checkbox } from '@itilite/lumina-ui/checkbox';
32
- import '@itilite/lumina-ui/styles.css';
69
+ import '@itilite/lumina-ui/styles.css'; // Import component styles
33
70
  ```
34
71
 
35
72
  Or import all components from the main entry point:
36
73
 
37
74
  ```tsx
38
75
  import { Button, Checkbox } from '@itilite/lumina-ui';
39
- import '@itilite/lumina-ui/styles.css';
76
+ import '@itilite/lumina-ui/styles.css'; // Import component styles
40
77
  ```
41
78
 
42
79
  ### Button Component
43
80
 
44
81
  ```tsx
45
82
  import { Button } from '@itilite/lumina-ui/button';
46
- import '@itilite/lumina-ui/styles.css';
47
83
 
48
84
  function App() {
49
85
  return (
@@ -58,7 +94,6 @@ function App() {
58
94
 
59
95
  ```tsx
60
96
  import { Checkbox } from '@itilite/lumina-ui/checkbox';
61
- import '@itilite/lumina-ui/styles.css';
62
97
 
63
98
  function App() {
64
99
  return (
@@ -69,13 +104,11 @@ function App() {
69
104
  }
70
105
  ```
71
106
 
72
- ## Styling
107
+ ## Requirements
73
108
 
74
- The package exports a `styles.css` file that includes all component styles. Import it in your application:
75
-
76
- ```tsx
77
- import '@itilite/lumina-ui/styles.css';
78
- ```
109
+ - **Tailwind CSS**: This library requires Tailwind CSS to be configured in your consuming application
110
+ - **React**: 18+
111
+ - **Ant Design**: 5.13.1
79
112
 
80
113
  ## Available Components
81
114
 
package/dist/styles.css CHANGED
@@ -1,533 +1,100 @@
1
- /* src/styles.css */
2
- *,
3
- ::before,
4
- ::after {
5
- --tw-border-spacing-x: 0;
6
- --tw-border-spacing-y: 0;
7
- --tw-translate-x: 0;
8
- --tw-translate-y: 0;
9
- --tw-rotate: 0;
10
- --tw-skew-x: 0;
11
- --tw-skew-y: 0;
12
- --tw-scale-x: 1;
13
- --tw-scale-y: 1;
14
- --tw-pan-x: ;
15
- --tw-pan-y: ;
16
- --tw-pinch-zoom: ;
17
- --tw-scroll-snap-strictness: proximity;
18
- --tw-gradient-from-position: ;
19
- --tw-gradient-via-position: ;
20
- --tw-gradient-to-position: ;
21
- --tw-ordinal: ;
22
- --tw-slashed-zero: ;
23
- --tw-numeric-figure: ;
24
- --tw-numeric-spacing: ;
25
- --tw-numeric-fraction: ;
26
- --tw-ring-inset: ;
27
- --tw-ring-offset-width: 0px;
28
- --tw-ring-offset-color: #fff;
29
- --tw-ring-color: rgb(59 130 246 / 0.5);
30
- --tw-ring-offset-shadow: 0 0 #0000;
31
- --tw-ring-shadow: 0 0 #0000;
32
- --tw-shadow: 0 0 #0000;
33
- --tw-shadow-colored: 0 0 #0000;
34
- --tw-blur: ;
35
- --tw-brightness: ;
36
- --tw-contrast: ;
37
- --tw-grayscale: ;
38
- --tw-hue-rotate: ;
39
- --tw-invert: ;
40
- --tw-saturate: ;
41
- --tw-sepia: ;
42
- --tw-drop-shadow: ;
43
- --tw-backdrop-blur: ;
44
- --tw-backdrop-brightness: ;
45
- --tw-backdrop-contrast: ;
46
- --tw-backdrop-grayscale: ;
47
- --tw-backdrop-hue-rotate: ;
48
- --tw-backdrop-invert: ;
49
- --tw-backdrop-opacity: ;
50
- --tw-backdrop-saturate: ;
51
- --tw-backdrop-sepia: ;
52
- --tw-contain-size: ;
53
- --tw-contain-layout: ;
54
- --tw-contain-paint: ;
55
- --tw-contain-style: ;
56
- }
57
- ::backdrop {
58
- --tw-border-spacing-x: 0;
59
- --tw-border-spacing-y: 0;
60
- --tw-translate-x: 0;
61
- --tw-translate-y: 0;
62
- --tw-rotate: 0;
63
- --tw-skew-x: 0;
64
- --tw-skew-y: 0;
65
- --tw-scale-x: 1;
66
- --tw-scale-y: 1;
67
- --tw-pan-x: ;
68
- --tw-pan-y: ;
69
- --tw-pinch-zoom: ;
70
- --tw-scroll-snap-strictness: proximity;
71
- --tw-gradient-from-position: ;
72
- --tw-gradient-via-position: ;
73
- --tw-gradient-to-position: ;
74
- --tw-ordinal: ;
75
- --tw-slashed-zero: ;
76
- --tw-numeric-figure: ;
77
- --tw-numeric-spacing: ;
78
- --tw-numeric-fraction: ;
79
- --tw-ring-inset: ;
80
- --tw-ring-offset-width: 0px;
81
- --tw-ring-offset-color: #fff;
82
- --tw-ring-color: rgb(59 130 246 / 0.5);
83
- --tw-ring-offset-shadow: 0 0 #0000;
84
- --tw-ring-shadow: 0 0 #0000;
85
- --tw-shadow: 0 0 #0000;
86
- --tw-shadow-colored: 0 0 #0000;
87
- --tw-blur: ;
88
- --tw-brightness: ;
89
- --tw-contrast: ;
90
- --tw-grayscale: ;
91
- --tw-hue-rotate: ;
92
- --tw-invert: ;
93
- --tw-saturate: ;
94
- --tw-sepia: ;
95
- --tw-drop-shadow: ;
96
- --tw-backdrop-blur: ;
97
- --tw-backdrop-brightness: ;
98
- --tw-backdrop-contrast: ;
99
- --tw-backdrop-grayscale: ;
100
- --tw-backdrop-hue-rotate: ;
101
- --tw-backdrop-invert: ;
102
- --tw-backdrop-opacity: ;
103
- --tw-backdrop-saturate: ;
104
- --tw-backdrop-sepia: ;
105
- --tw-contain-size: ;
106
- --tw-contain-layout: ;
107
- --tw-contain-paint: ;
108
- --tw-contain-style: ;
109
- }
110
- *,
111
- ::before,
112
- ::after {
113
- box-sizing: border-box;
114
- border-width: 0;
115
- border-style: solid;
116
- border-color: #e5e7eb;
117
- }
118
- ::before,
119
- ::after {
120
- --tw-content: "";
121
- }
122
- html,
123
- :host {
124
- line-height: 1.5;
125
- -webkit-text-size-adjust: 100%;
126
- -moz-tab-size: 4;
127
- -o-tab-size: 4;
128
- tab-size: 4;
129
- font-family:
130
- ui-sans-serif,
131
- system-ui,
132
- sans-serif,
133
- "Apple Color Emoji",
134
- "Segoe UI Emoji",
135
- "Segoe UI Symbol",
136
- "Noto Color Emoji";
137
- font-feature-settings: normal;
138
- font-variation-settings: normal;
139
- -webkit-tap-highlight-color: transparent;
140
- }
141
- body {
142
- margin: 0;
143
- line-height: inherit;
144
- }
145
- hr {
146
- height: 0;
147
- color: inherit;
148
- border-top-width: 1px;
149
- }
150
- abbr:where([title]) {
151
- -webkit-text-decoration: underline dotted;
152
- text-decoration: underline dotted;
153
- }
154
- h1,
155
- h2,
156
- h3,
157
- h4,
158
- h5,
159
- h6 {
160
- font-size: inherit;
161
- font-weight: inherit;
162
- }
163
- a {
164
- color: inherit;
165
- text-decoration: inherit;
166
- }
167
- b,
168
- strong {
169
- font-weight: bolder;
170
- }
171
- code,
172
- kbd,
173
- samp,
174
- pre {
175
- font-family:
176
- ui-monospace,
177
- SFMono-Regular,
178
- Menlo,
179
- Monaco,
180
- Consolas,
181
- "Liberation Mono",
182
- "Courier New",
183
- monospace;
184
- font-feature-settings: normal;
185
- font-variation-settings: normal;
186
- font-size: 1em;
187
- }
188
- small {
189
- font-size: 80%;
190
- }
191
- sub,
192
- sup {
193
- font-size: 75%;
194
- line-height: 0;
195
- position: relative;
196
- vertical-align: baseline;
197
- }
198
- sub {
199
- bottom: -0.25em;
200
- }
201
- sup {
202
- top: -0.5em;
203
- }
204
- table {
205
- text-indent: 0;
206
- border-color: inherit;
207
- border-collapse: collapse;
208
- }
209
- button,
210
- input,
211
- optgroup,
212
- select,
213
- textarea {
214
- font-family: inherit;
215
- font-feature-settings: inherit;
216
- font-variation-settings: inherit;
217
- font-size: 100%;
218
- font-weight: inherit;
219
- line-height: inherit;
220
- letter-spacing: inherit;
221
- color: inherit;
222
- margin: 0;
223
- padding: 0;
224
- }
225
- button,
226
- select {
227
- text-transform: none;
228
- }
229
- button,
230
- input:where([type=button]),
231
- input:where([type=reset]),
232
- input:where([type=submit]) {
233
- -webkit-appearance: button;
234
- background-color: transparent;
235
- background-image: none;
236
- }
237
- :-moz-focusring {
238
- outline: auto;
239
- }
240
- :-moz-ui-invalid {
241
- box-shadow: none;
242
- }
243
- progress {
244
- vertical-align: baseline;
245
- }
246
- ::-webkit-inner-spin-button,
247
- ::-webkit-outer-spin-button {
248
- height: auto;
249
- }
250
- [type=search] {
251
- -webkit-appearance: textfield;
252
- outline-offset: -2px;
253
- }
254
- ::-webkit-search-decoration {
255
- -webkit-appearance: none;
256
- }
257
- ::-webkit-file-upload-button {
258
- -webkit-appearance: button;
259
- font: inherit;
260
- }
261
- summary {
262
- display: list-item;
263
- }
264
- blockquote,
265
- dl,
266
- dd,
267
- h1,
268
- h2,
269
- h3,
270
- h4,
271
- h5,
272
- h6,
273
- hr,
274
- figure,
275
- p,
276
- pre {
277
- margin: 0;
278
- }
279
- fieldset {
280
- margin: 0;
281
- padding: 0;
282
- }
283
- legend {
284
- padding: 0;
285
- }
286
- ol,
287
- ul,
288
- menu {
289
- list-style: none;
290
- margin: 0;
291
- padding: 0;
292
- }
293
- dialog {
294
- padding: 0;
295
- }
296
- textarea {
297
- resize: vertical;
298
- }
299
- input::-moz-placeholder,
300
- textarea::-moz-placeholder {
301
- opacity: 1;
302
- color: #9ca3af;
303
- }
304
- input::placeholder,
305
- textarea::placeholder {
306
- opacity: 1;
307
- color: #9ca3af;
308
- }
309
- button,
310
- [role=button] {
311
- cursor: pointer;
312
- }
313
- :disabled {
314
- cursor: default;
315
- }
316
- img,
317
- svg,
318
- video,
319
- canvas,
320
- audio,
321
- iframe,
322
- embed,
323
- object {
324
- display: block;
325
- vertical-align: middle;
326
- }
327
- img,
328
- video {
329
- max-width: 100%;
330
- height: auto;
331
- }
332
- [hidden]:where(:not([hidden=until-found])) {
333
- display: none;
334
- }
335
1
  .tw-right-6 {
336
- right: 1.5rem;
2
+ right: 1.5rem
337
3
  }
338
4
  .tw-top-6 {
339
- top: 1.5rem;
5
+ top: 1.5rem
340
6
  }
341
7
  .tw-flex {
342
- display: flex;
8
+ display: flex
343
9
  }
344
10
  .tw-h-2 {
345
- height: 0.5rem;
11
+ height: 0.5rem
346
12
  }
347
13
  .tw-h-3 {
348
- height: 0.75rem;
14
+ height: 0.75rem
349
15
  }
350
16
  .tw-cursor-not-allowed {
351
- cursor: not-allowed;
17
+ cursor: not-allowed
352
18
  }
353
19
  .tw-items-end {
354
- align-items: flex-end;
20
+ align-items: flex-end
355
21
  }
356
22
  .tw-items-center {
357
- align-items: center;
23
+ align-items: center
358
24
  }
359
25
  .tw-justify-center {
360
- justify-content: center;
26
+ justify-content: center
361
27
  }
362
28
  .tw-gap-1 {
363
- gap: 0.25rem;
29
+ gap: 0.25rem
364
30
  }
365
31
  .tw-rounded-full {
366
- border-radius: 9999px;
32
+ border-radius: 9999px
367
33
  }
368
34
  .tw-rounded-lg {
369
- border-radius: 0.5rem;
35
+ border-radius: 0.5rem
370
36
  }
371
37
  .tw-border {
372
- border-width: 1px;
38
+ border-width: 1px
373
39
  }
374
40
  .tw-border-0 {
375
- border-width: 0px;
41
+ border-width: 0px
376
42
  }
377
43
  .tw-border-solid {
378
- border-style: solid;
44
+ border-style: solid
379
45
  }
380
46
  .tw-bg-transparent {
381
- background-color: transparent;
47
+ background-color: transparent
382
48
  }
383
49
  .tw-object-cover {
384
- -o-object-fit: cover;
385
- object-fit: cover;
50
+ -o-object-fit: cover;
51
+ object-fit: cover
386
52
  }
387
53
  .tw-p-2 {
388
- padding: 0.5rem;
54
+ padding: 0.5rem
389
55
  }
390
56
  .tw-p-4 {
391
- padding: 1rem;
57
+ padding: 1rem
392
58
  }
393
59
  .tw-text-font-size-10 {
394
- font-size: 0.625rem;
60
+ font-size: 0.625rem
395
61
  }
396
62
  .tw-text-font-size-50 {
397
- font-size: 1.25rem;
63
+ font-size: 1.25rem
398
64
  }
399
65
  .tw-font-medium {
400
- font-weight: 500;
66
+ font-weight: 500
401
67
  }
402
68
  .tw-leading-7 {
403
- line-height: 1.75rem;
69
+ line-height: 1.75rem
404
70
  }
405
71
  .tw-text-color-border-dark-subtle {
406
- --tw-text-opacity: 1;
407
- color: rgb(33 40 55 / var(--tw-text-opacity, 1));
72
+ --tw-text-opacity: 1;
73
+ color: rgb(33 40 55 / var(--tw-text-opacity, 1))
408
74
  }
409
75
  .tw-text-color-surface-dark {
410
- --tw-text-opacity: 1;
411
- color: rgb(17 24 39 / var(--tw-text-opacity, 1));
76
+ --tw-text-opacity: 1;
77
+ color: rgb(17 24 39 / var(--tw-text-opacity, 1))
412
78
  }
413
79
  .tw-text-color-text-primary {
414
- --tw-text-opacity: 1;
415
- color: rgb(236 93 37 / var(--tw-text-opacity, 1));
80
+ --tw-text-opacity: 1;
81
+ color: rgb(236 93 37 / var(--tw-text-opacity, 1))
416
82
  }
417
83
  .tw-text-white {
418
- --tw-text-opacity: 1;
419
- color: rgb(255 255 255 / var(--tw-text-opacity, 1));
84
+ --tw-text-opacity: 1;
85
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1))
420
86
  }
421
87
  .tw-opacity-40 {
422
- opacity: 0.4;
88
+ opacity: 0.4
423
89
  }
424
90
  @media (min-width: 576px) {
425
- .sm\:tw-p-6 {
426
- padding: 1.5rem;
427
- }
91
+ .sm\:tw-p-6 {
92
+ padding: 1.5rem
93
+ }
428
94
  }
429
95
 
430
96
 
431
97
  /* CSS Modules */
432
- /* src/atom/Switch/Switch.module.scss */
433
- .Switch-module__switch___fUHZL.ant-switch.ant-switch-small {
434
- height: 0.75rem;
435
- min-width: 1.5rem
436
- }
437
- .Switch-module__switch___fUHZL.ant-switch.ant-switch-small .ant-switch-handle {
438
- height: 0.5rem;
439
- width: 0.5rem
440
- }
441
- .Switch-module__switch___fUHZL.ant-switch.ant-switch-checked {
442
- --tw-bg-opacity: 1;
443
- background-color: rgb(236 93 37 / var(--tw-bg-opacity, 1))
444
- }
445
- .Switch-module__switch___fUHZL.ant-switch.ant-switch-checked:hover {
446
- --tw-bg-opacity: 1;
447
- background-color: rgb(236 93 37 / var(--tw-bg-opacity, 1))
448
- }
449
-
450
- /* src/atom/Tooltip/Tooltip.module.scss */
451
- .Tooltip-module__light___H5oCc .ant-tooltip-content .ant-tooltip-inner {
452
- background-color: white !important;
453
- color: #111827;
454
- border-radius: 0.5rem;
455
- padding: 0.625rem;
456
- --tw-text-opacity: 1;
457
- color: rgb(33 40 55 / var(--tw-text-opacity, 1));
458
- }
459
- .Tooltip-module__light___H5oCc .ant-tooltip-arrow:before {
460
- background-color: white !important;
461
- }
462
-
463
- /* src/atom/Radio/Radio.module.scss */
464
- .Radio-module__radio___1CPAk {
465
- display: flex;
466
- align-items: center;
467
- }
468
- .Radio-module__radio___1CPAk.Radio-module__size_small___nRXgM .ant-radio .ant-radio-inner {
469
- height: 16px;
470
- width: 16px;
471
- }
472
- .Radio-module__radio___1CPAk.Radio-module__size_medium___uSzPl .ant-radio .ant-radio-inner {
473
- height: 20px;
474
- width: 20px;
475
- }
476
- .Radio-module__radio___1CPAk.Radio-module__size_large___ubpHs .ant-radio .ant-radio-inner {
477
- height: 24px;
478
- width: 24px;
479
- }
480
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked .ant-radio-inner {
481
- border-color: #EC5D25;
482
- background-color: #EC5D25;
483
- }
484
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked:hover .ant-radio-inner {
485
- border-color: #B94710;
486
- background-color: #B94710;
487
- }
488
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked:focus-visible {
489
- outline: 2px solid #0A65E7;
490
- }
491
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z {
492
- cursor: not-allowed;
493
- }
494
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z .ant-radio-checked .ant-radio-inner {
495
- border-color: #B6BAC3;
496
- background-color: #B6BAC3;
497
- }
498
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z .ant-radio-checked .ant-radio-inner::after {
499
- transform: scale(0.375);
500
- background-color: #FFFFFF;
501
- }
502
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio .ant-radio-inner {
503
- border-color: #B6BAC3;
504
- }
505
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio:hover .ant-radio-inner {
506
- border-color: #6B7280;
507
- }
508
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio:focus-visible {
509
- outline: 2px solid #0A65E7;
510
- }
511
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7.Radio-module__disabled___AF98Z {
512
- cursor: not-allowed;
513
- }
514
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7.Radio-module__disabled___AF98Z .ant-radio .ant-radio-inner {
515
- border-color: #B6BAC3;
516
- background-color: #F9FAFB;
517
- }
518
- .Radio-module__radio___1CPAk.Radio-module__variant_normal___FQkTC {
519
- color: #363E4F;
520
- font-weight: 400;
521
- font-size: 0.875rem;
522
- line-height: 20px;
523
- }
524
- .Radio-module__radio___1CPAk.Radio-module__variant_emphasized___Fgpv6 {
525
- color: #363E4F;
526
- font-weight: 500;
527
- font-size: 0.875rem;
528
- line-height: 20px;
529
- }
530
-
531
98
  /* src/atom/Button/Button.module.scss */
532
99
  .Button-module__button___cLCyl {
533
100
  display: flex;
@@ -718,6 +285,74 @@ video {
718
285
  outline: none;
719
286
  }
720
287
 
288
+ /* src/atom/Radio/Radio.module.scss */
289
+ .Radio-module__radio___1CPAk {
290
+ display: flex;
291
+ align-items: center;
292
+ }
293
+ .Radio-module__radio___1CPAk.Radio-module__size_small___nRXgM .ant-radio .ant-radio-inner {
294
+ height: 16px;
295
+ width: 16px;
296
+ }
297
+ .Radio-module__radio___1CPAk.Radio-module__size_medium___uSzPl .ant-radio .ant-radio-inner {
298
+ height: 20px;
299
+ width: 20px;
300
+ }
301
+ .Radio-module__radio___1CPAk.Radio-module__size_large___ubpHs .ant-radio .ant-radio-inner {
302
+ height: 24px;
303
+ width: 24px;
304
+ }
305
+ .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked .ant-radio-inner {
306
+ border-color: #EC5D25;
307
+ background-color: #EC5D25;
308
+ }
309
+ .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked:hover .ant-radio-inner {
310
+ border-color: #B94710;
311
+ background-color: #B94710;
312
+ }
313
+ .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked:focus-visible {
314
+ outline: 2px solid #0A65E7;
315
+ }
316
+ .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z {
317
+ cursor: not-allowed;
318
+ }
319
+ .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z .ant-radio-checked .ant-radio-inner {
320
+ border-color: #B6BAC3;
321
+ background-color: #B6BAC3;
322
+ }
323
+ .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z .ant-radio-checked .ant-radio-inner::after {
324
+ transform: scale(0.375);
325
+ background-color: #FFFFFF;
326
+ }
327
+ .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio .ant-radio-inner {
328
+ border-color: #B6BAC3;
329
+ }
330
+ .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio:hover .ant-radio-inner {
331
+ border-color: #6B7280;
332
+ }
333
+ .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio:focus-visible {
334
+ outline: 2px solid #0A65E7;
335
+ }
336
+ .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7.Radio-module__disabled___AF98Z {
337
+ cursor: not-allowed;
338
+ }
339
+ .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7.Radio-module__disabled___AF98Z .ant-radio .ant-radio-inner {
340
+ border-color: #B6BAC3;
341
+ background-color: #F9FAFB;
342
+ }
343
+ .Radio-module__radio___1CPAk.Radio-module__variant_normal___FQkTC {
344
+ color: #363E4F;
345
+ font-weight: 400;
346
+ font-size: 0.875rem;
347
+ line-height: 20px;
348
+ }
349
+ .Radio-module__radio___1CPAk.Radio-module__variant_emphasized___Fgpv6 {
350
+ color: #363E4F;
351
+ font-weight: 500;
352
+ font-size: 0.875rem;
353
+ line-height: 20px;
354
+ }
355
+
721
356
  /* src/atom/Checkbox/Checkbox.module.scss */
722
357
  .Checkbox-module__checkbox___xxg5L {
723
358
  display: flex;
@@ -816,6 +451,37 @@ video {
816
451
  background: white;
817
452
  }
818
453
 
454
+ /* src/atom/Tooltip/Tooltip.module.scss */
455
+ .Tooltip-module__light___H5oCc .ant-tooltip-content .ant-tooltip-inner {
456
+ background-color: white !important;
457
+ color: #111827;
458
+ border-radius: 0.5rem;
459
+ padding: 0.625rem;
460
+ --tw-text-opacity: 1;
461
+ color: rgb(33 40 55 / var(--tw-text-opacity, 1));
462
+ }
463
+ .Tooltip-module__light___H5oCc .ant-tooltip-arrow:before {
464
+ background-color: white !important;
465
+ }
466
+
467
+ /* src/atom/Switch/Switch.module.scss */
468
+ .Switch-module__switch___fUHZL.ant-switch.ant-switch-small {
469
+ height: 0.75rem;
470
+ min-width: 1.5rem
471
+ }
472
+ .Switch-module__switch___fUHZL.ant-switch.ant-switch-small .ant-switch-handle {
473
+ height: 0.5rem;
474
+ width: 0.5rem
475
+ }
476
+ .Switch-module__switch___fUHZL.ant-switch.ant-switch-checked {
477
+ --tw-bg-opacity: 1;
478
+ background-color: rgb(236 93 37 / var(--tw-bg-opacity, 1))
479
+ }
480
+ .Switch-module__switch___fUHZL.ant-switch.ant-switch-checked:hover {
481
+ --tw-bg-opacity: 1;
482
+ background-color: rgb(236 93 37 / var(--tw-bg-opacity, 1))
483
+ }
484
+
819
485
  /* src/atom/Modal/Modal.module.scss */
820
486
  .Modal-module__modal___PKrAi.Modal-module__footerMargintopDisable___4B6u- .Modal-module__ant-modal-footer___HKsDR {
821
487
  margin-top: 0;
@@ -887,470 +553,4 @@ video {
887
553
  }
888
554
  .Modal-module__modal___PKrAi .ant-btn-primary {
889
555
  margin-inline-start: 0.5rem;
890
- }
891
-
892
- /* CSS Modules */
893
-
894
-
895
- /* CSS Modules */
896
- /* src/atom/Tooltip/Tooltip.module.scss */
897
- .Tooltip-module__light___H5oCc .ant-tooltip-content .ant-tooltip-inner {
898
- background-color: white !important;
899
- color: #111827;
900
- border-radius: 0.5rem;
901
- padding: 0.625rem;
902
- --tw-text-opacity: 1;
903
- color: rgb(33 40 55 / var(--tw-text-opacity, 1));
904
- }
905
- .Tooltip-module__light___H5oCc .ant-tooltip-arrow:before {
906
- background-color: white !important;
907
- }
908
-
909
- /* src/atom/Button/Button.module.scss */
910
- .Button-module__button___cLCyl {
911
- display: flex;
912
- align-items: center;
913
- justify-content: center;
914
- gap: 0.25rem;
915
- border-radius: 0.5rem;
916
- }
917
- .Button-module__button___cLCyl.Button-module__size_large___S-mbU {
918
- height: 56px;
919
- padding-left: 1rem;
920
- padding-right: 1rem;
921
- }
922
- .Button-module__button___cLCyl.Button-module__size_large___S-mbU.Button-module__shape_circle___sPUS5 {
923
- width: 56px;
924
- }
925
- .Button-module__button___cLCyl.Button-module__size_normal___qJUMj {
926
- height: 40px;
927
- padding-left: 0.75rem;
928
- padding-right: 0.75rem;
929
- }
930
- .Button-module__button___cLCyl.Button-module__size_normal___qJUMj.Button-module__shape_circle___sPUS5 {
931
- width: 40px;
932
- }
933
- .Button-module__button___cLCyl.Button-module__size_small___IUeei {
934
- height: 32px;
935
- padding-left: 0.5rem;
936
- padding-right: 0.5rem;
937
- }
938
- .Button-module__button___cLCyl.Button-module__size_small___IUeei.Button-module__shape_circle___sPUS5 {
939
- width: 32px;
940
- }
941
- .Button-module__button___cLCyl.Button-module__type_primary___Tauz- {
942
- --tw-bg-opacity: 1;
943
- background-color: rgb(236 93 37 / var(--tw-bg-opacity, 1));
944
- border-width: 1px;
945
- border-style: solid;
946
- --tw-border-opacity: 1;
947
- border-color: rgb(236 93 37 / var(--tw-border-opacity, 1));
948
- box-shadow: 0 1px 0 0 rgba(17, 24, 39, 0.1);
949
- }
950
- .Button-module__button___cLCyl.Button-module__type_primary___Tauz-.ant-btn-primary:hover, .Button-module__button___cLCyl.Button-module__type_primary___Tauz-.ant-btn-primary:active {
951
- --tw-bg-opacity: 1;
952
- background-color: rgb(236 93 37 / var(--tw-bg-opacity, 1));
953
- box-shadow: 0px 2px 4px 0px rgba(17, 24, 39, 0.1);
954
- }
955
- .Button-module__button___cLCyl.Button-module__type_primary___Tauz-:focus-visible {
956
- outline: 2px solid rgba(236, 93, 37, 0.3803921569);
957
- }
958
- .Button-module__button___cLCyl.Button-module__type_primary___Tauz-.Button-module__variant_subtle___BMbbd {
959
- --tw-text-opacity: 1;
960
- color: rgb(236 93 37 / var(--tw-text-opacity, 1));
961
- }
962
- .Button-module__button___cLCyl.Button-module__type_primary___Tauz-.Button-module__variant_subtle___BMbbd:hover {
963
- --tw-text-opacity: 1;
964
- color: rgb(236 93 37 / var(--tw-text-opacity, 1));
965
- }
966
- .Button-module__button___cLCyl.Button-module__type_primary___Tauz-.Button-module__variant_text___Pc5Ia, .Button-module__button___cLCyl.Button-module__type_primary___Tauz-.Button-module__variant_link___Cj1O9 {
967
- --tw-text-opacity: 1;
968
- color: rgb(236 93 37 / var(--tw-text-opacity, 1));
969
- }
970
- .Button-module__button___cLCyl.Button-module__type_primary___Tauz-.Button-module__variant_text___Pc5Ia:hover, .Button-module__button___cLCyl.Button-module__type_primary___Tauz-.Button-module__variant_link___Cj1O9:hover {
971
- --tw-text-opacity: 1;
972
- color: rgb(236 93 37 / var(--tw-text-opacity, 1));
973
- }
974
- .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA {
975
- border-width: 1px;
976
- border-style: solid;
977
- --tw-bg-opacity: 1;
978
- background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
979
- --tw-border-opacity: 1;
980
- border-color: rgb(17 24 39 / var(--tw-border-opacity, 1));
981
- box-shadow: 0 1px 0 0 rgba(17, 24, 39, 0.1);
982
- }
983
- .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.ant-btn-primary:hover, .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.ant-btn-primary:active {
984
- --tw-bg-opacity: 1;
985
- background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
986
- box-shadow: 0px 2px 4px 0px rgba(17, 24, 39, 0.1);
987
- }
988
- .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.ant-btn-primary:focus-visible {
989
- outline: 2px solid rgba(236, 93, 37, 0.3803921569);
990
- }
991
- .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.Button-module__variant_subtle___BMbbd {
992
- --tw-text-opacity: 1;
993
- color: rgb(17 24 39 / var(--tw-text-opacity, 1));
994
- }
995
- .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.Button-module__variant_subtle___BMbbd:hover {
996
- --tw-text-opacity: 1;
997
- color: rgb(17 24 39 / var(--tw-text-opacity, 1));
998
- }
999
- .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.Button-module__variant_text___Pc5Ia, .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.Button-module__variant_link___Cj1O9 {
1000
- --tw-text-opacity: 1;
1001
- color: rgb(17 24 39 / var(--tw-text-opacity, 1));
1002
- }
1003
- .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.Button-module__variant_text___Pc5Ia:hover, .Button-module__button___cLCyl.Button-module__type_secondary___CLmrA.Button-module__variant_link___Cj1O9:hover {
1004
- --tw-text-opacity: 1;
1005
- color: rgb(17 24 39 / var(--tw-text-opacity, 1));
1006
- }
1007
- .Button-module__button___cLCyl.Button-module__type_critical___6ILOp {
1008
- border-width: 1px;
1009
- --tw-bg-opacity: 1;
1010
- background-color: rgb(207 34 49 / var(--tw-bg-opacity, 1));
1011
- border-style: solid;
1012
- --tw-border-opacity: 1;
1013
- border-color: rgb(207 34 49 / var(--tw-border-opacity, 1));
1014
- box-shadow: 0 1px 0 0 rgba(17, 24, 39, 0.1);
1015
- }
1016
- .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.ant-btn-primary:hover, .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.ant-btn-primary:active {
1017
- --tw-bg-opacity: 1;
1018
- background-color: rgb(207 34 49 / var(--tw-bg-opacity, 1));
1019
- box-shadow: 0px 2px 4px 0px rgba(17, 24, 39, 0.1);
1020
- }
1021
- .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.ant-btn-primary:focus-visible {
1022
- outline: 2px solid rgba(236, 93, 37, 0.3803921569);
1023
- }
1024
- .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.Button-module__variant_subtle___BMbbd {
1025
- --tw-text-opacity: 1;
1026
- color: rgb(207 34 49 / var(--tw-text-opacity, 1));
1027
- }
1028
- .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.Button-module__variant_subtle___BMbbd:hover {
1029
- --tw-text-opacity: 1;
1030
- color: rgb(207 34 49 / var(--tw-text-opacity, 1));
1031
- }
1032
- .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.Button-module__variant_text___Pc5Ia, .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.Button-module__variant_link___Cj1O9 {
1033
- --tw-text-opacity: 1;
1034
- color: rgb(207 34 49 / var(--tw-text-opacity, 1));
1035
- }
1036
- .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.Button-module__variant_text___Pc5Ia:hover, .Button-module__button___cLCyl.Button-module__type_critical___6ILOp.Button-module__variant_link___Cj1O9:hover {
1037
- --tw-text-opacity: 1;
1038
- color: rgb(207 34 49 / var(--tw-text-opacity, 1));
1039
- }
1040
- .Button-module__button___cLCyl.Button-module__variant_subtle___BMbbd {
1041
- --tw-bg-opacity: 1;
1042
- background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
1043
- border-width: 1px;
1044
- border-style: solid;
1045
- --tw-border-opacity: 1;
1046
- border-color: rgb(211 216 223 / var(--tw-border-opacity, 1));
1047
- box-shadow: 0px 1px 0px 0px rgba(17, 24, 39, 0.1);
1048
- }
1049
- .Button-module__button___cLCyl.Button-module__variant_subtle___BMbbd.ant-btn-default:hover {
1050
- box-shadow: 0px 2px 4px 0px rgba(17, 24, 39, 0.15);
1051
- --tw-border-opacity: 1;
1052
- border-color: rgb(211 216 223 / var(--tw-border-opacity, 1));
1053
- }
1054
- .Button-module__button___cLCyl.Button-module__variant_subtle___BMbbd.ant-btn-default:focus-visible {
1055
- outline: 2px solid rgba(236, 93, 37, 0.3803921569);
1056
- }
1057
- .Button-module__button___cLCyl.Button-module__variant_text___Pc5Ia {
1058
- background-color: transparent;
1059
- border-width: 0px;
1060
- border-style: none;
1061
- box-shadow: none;
1062
- }
1063
- .Button-module__button___cLCyl.Button-module__variant_text___Pc5Ia.ant-btn-default:hover {
1064
- box-shadow: 0px 2px 4px 0px rgba(17, 24, 39, 0.15);
1065
- border-style: none;
1066
- --tw-bg-opacity: 1;
1067
- background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
1068
- }
1069
- .Button-module__button___cLCyl.Button-module__variant_text___Pc5Ia.ant-btn-default:active {
1070
- --tw-bg-opacity: 1;
1071
- background-color: rgb(241 243 245 / var(--tw-bg-opacity, 1));
1072
- }
1073
- .Button-module__button___cLCyl.Button-module__variant_text___Pc5Ia.ant-btn:focus-visible {
1074
- outline: 2px solid rgba(236, 93, 37, 0.2);
1075
- }
1076
- .Button-module__button___cLCyl.Button-module__variant_link___Cj1O9 {
1077
- background-color: transparent;
1078
- padding: 0px;
1079
- border-width: 0px;
1080
- border-style: none;
1081
- height: auto;
1082
- box-shadow: none;
1083
- }
1084
- .Button-module__button___cLCyl.Button-module__variant_link___Cj1O9.ant-btn-default:hover.Button-module__onHoverUnderline___LOfXo {
1085
- text-decoration: underline;
1086
- }
1087
- .Button-module__button___cLCyl.Button-module__variant_link___Cj1O9.ant-btn-default:hover {
1088
- box-shadow: none;
1089
- border-style: none;
1090
- background-color: transparent;
1091
- }
1092
- .Button-module__button___cLCyl.Button-module__variant_link___Cj1O9.ant-btn-default:active {
1093
- background-color: transparent;
1094
- }
1095
- .Button-module__button___cLCyl.Button-module__variant_link___Cj1O9.ant-btn:focus-visible {
1096
- outline: none;
1097
- }
1098
-
1099
- /* src/atom/Modal/Modal.module.scss */
1100
- .Modal-module__modal___PKrAi.Modal-module__footerMargintopDisable___4B6u- .Modal-module__ant-modal-footer___HKsDR {
1101
- margin-top: 0;
1102
- margin-top: 0px;
1103
- }
1104
- .Modal-module__modal___PKrAi .ant-modal-footer .primaryFooter {
1105
- padding: 24px;
1106
- padding: 1.5rem;
1107
- display: flex;
1108
- justify-content: flex-end;
1109
- }
1110
- .Modal-module__modal___PKrAi .ant-modal-footer .primaryFooter .Modal-module__okBtn___Ut8e5,
1111
- .Modal-module__modal___PKrAi .ant-modal-footer .primaryFooter .Modal-module__cancelBtn___i0Rm8 {
1112
- min-width: 92px;
1113
- }
1114
- .Modal-module__modal___PKrAi .ant-modal-footer .secondaryFooter {
1115
- padding: 24px;
1116
- padding: 1.5rem;
1117
- padding-top: 0px;
1118
- display: flex;
1119
- justify-content: flex-end;
1120
- }
1121
- .Modal-module__modal___PKrAi .ant-modal-footer .secondaryFooter .Modal-module__okBtn___Ut8e5,
1122
- .Modal-module__modal___PKrAi .ant-modal-footer .secondaryFooter .Modal-module__cancelBtn___i0Rm8 {
1123
- width: 50%;
1124
- }
1125
- .Modal-module__modal___PKrAi .ant-modal-content {
1126
- padding: 0;
1127
- border-radius: 0.75rem;
1128
- padding: 0px;
1129
- }
1130
- .Modal-module__modal___PKrAi .ant-modal-content .ant-modal-header {
1131
- margin-bottom: 0px;
1132
- padding: 1rem;
1133
- }
1134
- @media (min-width: 576px) {
1135
- .Modal-module__modal___PKrAi .ant-modal-content .ant-modal-header {
1136
- padding: 1.5rem;
1137
- }
1138
- }
1139
- .Modal-module__modal___PKrAi .ant-modal-content .ant-modal-header .ant-modal-title {
1140
- justify-content: flex-start;
1141
- padding-right: 1.25rem;
1142
- font-size: 1.25rem;
1143
- font-weight: 500;
1144
- line-height: 1.75rem;
1145
- --tw-text-opacity: 1;
1146
- color: rgb(17 24 39 / var(--tw-text-opacity, 1));
1147
- }
1148
- .Modal-module__modal___PKrAi .ant-modal-content .ant-modal-close {
1149
- display: flex;
1150
- align-items: flex-end;
1151
- justify-content: center;
1152
- }
1153
- .Modal-module__modal___PKrAi .ant-modal-content .ant-modal-close .ant-modal-close-x {
1154
- display: flex;
1155
- align-items: center;
1156
- justify-content: center;
1157
- }
1158
- .Modal-module__modal___PKrAi .ant-modal-content .ant-modal-body {
1159
- padding: 0 1.5rem 1.5rem;
1160
- max-height: 80vh;
1161
- overflow: auto;
1162
- }
1163
- .Modal-module__modal___PKrAi .ant-modal-content .ant-modal-close {
1164
- top: 1.5rem;
1165
- right: 1.5rem;
1166
- padding-bottom: 0.25rem;
1167
- }
1168
- .Modal-module__modal___PKrAi .ant-btn-primary {
1169
- margin-inline-start: 0.5rem;
1170
- }
1171
-
1172
- /* src/atom/Radio/Radio.module.scss */
1173
- .Radio-module__radio___1CPAk {
1174
- display: flex;
1175
- align-items: center;
1176
- }
1177
- .Radio-module__radio___1CPAk.Radio-module__size_small___nRXgM .ant-radio .ant-radio-inner {
1178
- height: 16px;
1179
- width: 16px;
1180
- }
1181
- .Radio-module__radio___1CPAk.Radio-module__size_medium___uSzPl .ant-radio .ant-radio-inner {
1182
- height: 20px;
1183
- width: 20px;
1184
- }
1185
- .Radio-module__radio___1CPAk.Radio-module__size_large___ubpHs .ant-radio .ant-radio-inner {
1186
- height: 24px;
1187
- width: 24px;
1188
- }
1189
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked .ant-radio-inner {
1190
- border-color: #EC5D25;
1191
- background-color: #EC5D25;
1192
- }
1193
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked:hover .ant-radio-inner {
1194
- border-color: #B94710;
1195
- background-color: #B94710;
1196
- }
1197
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu .ant-radio-checked:focus-visible {
1198
- outline: 2px solid #0A65E7;
1199
- }
1200
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z {
1201
- cursor: not-allowed;
1202
- }
1203
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z .ant-radio-checked .ant-radio-inner {
1204
- border-color: #B6BAC3;
1205
- background-color: #B6BAC3;
1206
- }
1207
- .Radio-module__radio___1CPAk.Radio-module__type_checked___BvPpu.Radio-module__disabled___AF98Z .ant-radio-checked .ant-radio-inner::after {
1208
- transform: scale(0.375);
1209
- background-color: #FFFFFF;
1210
- }
1211
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio .ant-radio-inner {
1212
- border-color: #B6BAC3;
1213
- }
1214
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio:hover .ant-radio-inner {
1215
- border-color: #6B7280;
1216
- }
1217
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7 .ant-radio:focus-visible {
1218
- outline: 2px solid #0A65E7;
1219
- }
1220
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7.Radio-module__disabled___AF98Z {
1221
- cursor: not-allowed;
1222
- }
1223
- .Radio-module__radio___1CPAk.Radio-module__type_unchecked___Xrb-7.Radio-module__disabled___AF98Z .ant-radio .ant-radio-inner {
1224
- border-color: #B6BAC3;
1225
- background-color: #F9FAFB;
1226
- }
1227
- .Radio-module__radio___1CPAk.Radio-module__variant_normal___FQkTC {
1228
- color: #363E4F;
1229
- font-weight: 400;
1230
- font-size: 0.875rem;
1231
- line-height: 20px;
1232
- }
1233
- .Radio-module__radio___1CPAk.Radio-module__variant_emphasized___Fgpv6 {
1234
- color: #363E4F;
1235
- font-weight: 500;
1236
- font-size: 0.875rem;
1237
- line-height: 20px;
1238
- }
1239
-
1240
- /* src/atom/Switch/Switch.module.scss */
1241
- .Switch-module__switch___fUHZL.ant-switch.ant-switch-small {
1242
- height: 0.75rem;
1243
- min-width: 1.5rem
1244
- }
1245
- .Switch-module__switch___fUHZL.ant-switch.ant-switch-small .ant-switch-handle {
1246
- height: 0.5rem;
1247
- width: 0.5rem
1248
- }
1249
- .Switch-module__switch___fUHZL.ant-switch.ant-switch-checked {
1250
- --tw-bg-opacity: 1;
1251
- background-color: rgb(236 93 37 / var(--tw-bg-opacity, 1))
1252
- }
1253
- .Switch-module__switch___fUHZL.ant-switch.ant-switch-checked:hover {
1254
- --tw-bg-opacity: 1;
1255
- background-color: rgb(236 93 37 / var(--tw-bg-opacity, 1))
1256
- }
1257
-
1258
- /* src/atom/Checkbox/Checkbox.module.scss */
1259
- .Checkbox-module__checkbox___xxg5L {
1260
- display: flex;
1261
- align-items: center;
1262
- }
1263
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__size_small___Kknlo .ant-checkbox .ant-checkbox-inner {
1264
- height: 16px;
1265
- width: 16px;
1266
- }
1267
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__size_medium___V6Ah8 .ant-checkbox .ant-checkbox-inner {
1268
- height: 20px;
1269
- width: 20px;
1270
- }
1271
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__size_medium___V6Ah8 .ant-checkbox .ant-checkbox-inner::after {
1272
- inset-inline-start: 27%;
1273
- }
1274
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__size_large___eWjFY .ant-checkbox .ant-checkbox-inner {
1275
- height: 24px;
1276
- width: 24px;
1277
- }
1278
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__size_large___eWjFY .ant-checkbox .ant-checkbox-inner::after {
1279
- inset-inline-start: 33%;
1280
- }
1281
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_checked___5742T .ant-checkbox-checked .ant-checkbox-inner {
1282
- border-color: #ec5d25;
1283
- background-color: #ec5d25;
1284
- }
1285
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_checked___5742T.ant-checkbox-wrapper:hover
1286
- .ant-checkbox-checked:not(.ant-checkbox-disabled)
1287
- .ant-checkbox-inner {
1288
- --tw-bg-opacity: 1;
1289
- background-color: rgb(185 71 16 / var(--tw-bg-opacity, 1));
1290
- }
1291
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_checked___5742T .ant-checkbox-checked:focus-visible {
1292
- outline: 2px solid #0a65e7;
1293
- }
1294
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_checked___5742T.Checkbox-module__disabled___v-RG1 {
1295
- cursor: not-allowed;
1296
- }
1297
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_checked___5742T.Checkbox-module__disabled___v-RG1 .ant-checkbox-checked .ant-checkbox-inner {
1298
- opacity: 0.5;
1299
- border-color: #ec5d25;
1300
- background-color: #ec5d25;
1301
- }
1302
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_checked___5742T.Checkbox-module__disabled___v-RG1 .ant-checkbox-checked .ant-checkbox-inner::after {
1303
- border-color: #ffffff;
1304
- }
1305
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_unchecked___QFMpP .ant-checkbox .ant-checkbox-inner {
1306
- border-color: #b6bac3;
1307
- }
1308
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_unchecked___QFMpP .ant-checkbox:hover .ant-checkbox-inner {
1309
- border-color: #6b7280;
1310
- }
1311
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_unchecked___QFMpP .ant-checkbox:focus-visible {
1312
- outline: 2px solid #0a65e7;
1313
- }
1314
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_unchecked___QFMpP.Checkbox-module__disabled___v-RG1 {
1315
- cursor: not-allowed;
1316
- }
1317
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__type_unchecked___QFMpP.Checkbox-module__disabled___v-RG1 .ant-checkbox .ant-checkbox-inner {
1318
- border-color: #b6bac3;
1319
- background-color: #f9fafb;
1320
- }
1321
- .Checkbox-module__checkbox___xxg5L .ant-checkbox-disabled + span {
1322
- color: #363e4f;
1323
- }
1324
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__variant_normal___faYKo {
1325
- color: #363e4f;
1326
- font-weight: 400;
1327
- font-size: 0.875rem;
1328
- line-height: 20px;
1329
- }
1330
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__variant_emphasized___-koYj {
1331
- color: #363e4f;
1332
- font-weight: 500;
1333
- font-size: 0.875rem;
1334
- line-height: 20px;
1335
- }
1336
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__variant_indeterminate___J5Xcc.Checkbox-module__disabled___v-RG1 .ant-checkbox-indeterminate .ant-checkbox-inner {
1337
- opacity: 0.5;
1338
- border-color: #ec5d25;
1339
- background-color: #ec5d25;
1340
- }
1341
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__variant_indeterminate___J5Xcc.Checkbox-module__disabled___v-RG1 .ant-checkbox-indeterminate .ant-checkbox-inner::after {
1342
- border-color: #ffffff;
1343
- }
1344
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__variant_indeterminate___J5Xcc .ant-checkbox-indeterminate .ant-checkbox-inner {
1345
- border-color: #ec5d25 !important;
1346
- background-color: #ec5d25 !important;
1347
- }
1348
- .Checkbox-module__checkbox___xxg5L.Checkbox-module__variant_indeterminate___J5Xcc .ant-checkbox-indeterminate .ant-checkbox-inner::after {
1349
- inset-inline-start: 50%;
1350
- width: 60%;
1351
- height: 3px;
1352
- border-radius: 4px;
1353
- background: white;
1354
- }
1355
-
1356
- /* CSS Modules */
556
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itilite/lumina-ui",
3
- "version": "1.0.1",
3
+ "version": "1.0.21",
4
4
  "description": "Itilite Lumina Design System UI Components",
5
5
  "sideEffects": false,
6
6
  "license": "MIT",
@@ -47,6 +47,11 @@
47
47
  "import": "./dist/Tooltip.mjs",
48
48
  "require": "./dist/Tooltip.js"
49
49
  },
50
+ "./avatar": {
51
+ "types": "./dist/Avatar.d.ts",
52
+ "import": "./dist/Avatar.mjs",
53
+ "require": "./dist/Avatar.js"
54
+ },
50
55
  "./styles.css": "./dist/styles.css"
51
56
  },
52
57
  "repository": {
@@ -93,7 +98,7 @@
93
98
  "postcss-modules": "^6.0.1",
94
99
  "react": "^18.2.0",
95
100
  "sass": "^1.69.5",
96
- "tailwindcss": "^3.4.0",
101
+ "tailwindcss": "^3.2.4",
97
102
  "tsup": "^8.0.2",
98
103
  "typescript": "5.5.4"
99
104
  },
@@ -1,83 +0,0 @@
1
- // src/atom/Avatar/Avatar.tsx
2
- import clsx from "clsx";
3
- import { jsx } from "react/jsx-runtime";
4
- var COLOR_MAP = {
5
- A: "#6455BF",
6
- B: "#C46273",
7
- C: "#52A79E",
8
- D: "#DF8654",
9
- E: "#B8639F",
10
- F: "#6455BF",
11
- G: "#C46273",
12
- H: "#52A79E",
13
- I: "#DF8654",
14
- J: "#B8639F",
15
- K: "#6455BF",
16
- L: "#C46273",
17
- M: "#52A79E",
18
- N: "#DF8654",
19
- O: "#B8639F",
20
- P: "#6455BF",
21
- Q: "#C46273",
22
- R: "#52A79E",
23
- S: "#DF8654",
24
- T: "#B8639F",
25
- U: "#6455BF",
26
- V: "#C46273",
27
- W: "#52A79E",
28
- X: "#DF8654",
29
- Y: "#B8639F",
30
- Z: "#6455BF",
31
- 0: "#6455BF",
32
- 1: "#C46273",
33
- 6: "#C46273",
34
- 2: "#52A79E",
35
- 7: "#52A79E",
36
- 3: "#DF8654",
37
- 8: "#DF8654",
38
- 4: "#B8639F",
39
- 9: "#B8639F"
40
- };
41
- function Avatar({
42
- img,
43
- className,
44
- name,
45
- height = 28,
46
- width = 28,
47
- size = "normal"
48
- }) {
49
- return /* @__PURE__ */ jsx(
50
- "div",
51
- {
52
- style: { height, width },
53
- className: "tw-rounded-full tw-flex tw-items-center",
54
- children: !img && name ? /* @__PURE__ */ jsx(
55
- "div",
56
- {
57
- style: { backgroundColor: COLOR_MAP[name[0]] },
58
- className: clsx(
59
- { "tw-text-font-size-10": size === "small" },
60
- `tw-text-white tw-font-medium tw-rounded-full tw-flex tw-items-center tw-justify-center `,
61
- className
62
- ),
63
- children: name[0]
64
- }
65
- ) : img ? /* @__PURE__ */ jsx(
66
- "img",
67
- {
68
- src: img,
69
- style: { height, width },
70
- alt: name,
71
- className: clsx("tw-rounded-full tw-object-cover", className)
72
- }
73
- ) : null
74
- }
75
- );
76
- }
77
- Avatar.displayName = "Avatar";
78
- var Avatar_default = Avatar;
79
-
80
- export {
81
- Avatar,
82
- Avatar_default
83
- };
package/dist/styles.d.mts DELETED
@@ -1,2 +0,0 @@
1
-
2
- export { }
package/dist/styles.d.ts DELETED
@@ -1,2 +0,0 @@
1
-
2
- export { }