@shoplflow/base 0.12.0 → 0.12.2

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 (11) hide show
  1. package/dist/{index.d.cts → index.d.mts} +5 -5
  2. package/dist/index.d.ts +5 -5
  3. package/dist/index.js +284 -254
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +1702 -0
  6. package/dist/index.mjs.map +1 -0
  7. package/package.json +6 -4
  8. package/dist/index.cjs +0 -2361
  9. package/dist/index.cjs.map +0 -1
  10. /package/dist/styles/{global.d.cts → global.d.mts} +0 -0
  11. /package/dist/styles/{reset.d.cts → reset.d.mts} +0 -0
package/dist/index.cjs DELETED
@@ -1,2361 +0,0 @@
1
- "use strict";
2
- function _array_like_to_array(arr, len) {
3
- if (len == null || len > arr.length) len = arr.length;
4
- for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
5
- return arr2;
6
- }
7
- function _array_with_holes(arr) {
8
- if (Array.isArray(arr)) return arr;
9
- }
10
- function _array_without_holes(arr) {
11
- if (Array.isArray(arr)) return _array_like_to_array(arr);
12
- }
13
- function _define_property(obj, key, value) {
14
- if (key in obj) {
15
- Object.defineProperty(obj, key, {
16
- value: value,
17
- enumerable: true,
18
- configurable: true,
19
- writable: true
20
- });
21
- } else {
22
- obj[key] = value;
23
- }
24
- return obj;
25
- }
26
- function _iterable_to_array(iter) {
27
- if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
28
- }
29
- function _iterable_to_array_limit(arr, i) {
30
- var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
31
- if (_i == null) return;
32
- var _arr = [];
33
- var _n = true;
34
- var _d = false;
35
- var _s, _e;
36
- try {
37
- for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
38
- _arr.push(_s.value);
39
- if (i && _arr.length === i) break;
40
- }
41
- } catch (err) {
42
- _d = true;
43
- _e = err;
44
- } finally{
45
- try {
46
- if (!_n && _i["return"] != null) _i["return"]();
47
- } finally{
48
- if (_d) throw _e;
49
- }
50
- }
51
- return _arr;
52
- }
53
- function _non_iterable_rest() {
54
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
55
- }
56
- function _non_iterable_spread() {
57
- throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
58
- }
59
- function _object_spread(target) {
60
- for(var i = 1; i < arguments.length; i++){
61
- var source = arguments[i] != null ? arguments[i] : {};
62
- var ownKeys = Object.keys(source);
63
- if (typeof Object.getOwnPropertySymbols === "function") {
64
- ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
65
- return Object.getOwnPropertyDescriptor(source, sym).enumerable;
66
- }));
67
- }
68
- ownKeys.forEach(function(key) {
69
- _define_property(target, key, source[key]);
70
- });
71
- }
72
- return target;
73
- }
74
- function ownKeys(object, enumerableOnly) {
75
- var keys = Object.keys(object);
76
- if (Object.getOwnPropertySymbols) {
77
- var symbols = Object.getOwnPropertySymbols(object);
78
- if (enumerableOnly) {
79
- symbols = symbols.filter(function(sym) {
80
- return Object.getOwnPropertyDescriptor(object, sym).enumerable;
81
- });
82
- }
83
- keys.push.apply(keys, symbols);
84
- }
85
- return keys;
86
- }
87
- function _object_spread_props(target, source) {
88
- source = source != null ? source : {};
89
- if (Object.getOwnPropertyDescriptors) {
90
- Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
91
- } else {
92
- ownKeys(Object(source)).forEach(function(key) {
93
- Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
94
- });
95
- }
96
- return target;
97
- }
98
- function _object_without_properties(source, excluded) {
99
- if (source == null) return {};
100
- var target = _object_without_properties_loose(source, excluded);
101
- var key, i;
102
- if (Object.getOwnPropertySymbols) {
103
- var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
104
- for(i = 0; i < sourceSymbolKeys.length; i++){
105
- key = sourceSymbolKeys[i];
106
- if (excluded.indexOf(key) >= 0) continue;
107
- if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
108
- target[key] = source[key];
109
- }
110
- }
111
- return target;
112
- }
113
- function _object_without_properties_loose(source, excluded) {
114
- if (source == null) return {};
115
- var target = {};
116
- var sourceKeys = Object.keys(source);
117
- var key, i;
118
- for(i = 0; i < sourceKeys.length; i++){
119
- key = sourceKeys[i];
120
- if (excluded.indexOf(key) >= 0) continue;
121
- target[key] = source[key];
122
- }
123
- return target;
124
- }
125
- function _sliced_to_array(arr, i) {
126
- return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
127
- }
128
- function _tagged_template_literal(strings, raw) {
129
- if (!raw) {
130
- raw = strings.slice(0);
131
- }
132
- return Object.freeze(Object.defineProperties(strings, {
133
- raw: {
134
- value: Object.freeze(raw)
135
- }
136
- }));
137
- }
138
- function _to_consumable_array(arr) {
139
- return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
140
- }
141
- function _unsupported_iterable_to_array(o, minLen) {
142
- if (!o) return;
143
- if (typeof o === "string") return _array_like_to_array(o, minLen);
144
- var n = Object.prototype.toString.call(o).slice(8, -1);
145
- if (n === "Object" && o.constructor) n = o.constructor.name;
146
- if (n === "Map" || n === "Set") return Array.from(n);
147
- if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
148
- }
149
- function _templateObject() {
150
- var data = _tagged_template_literal([
151
- "\n display: flex;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n z-index: 20000;\n width: 100%;\n height: 100%;\n background: rgba(51, 51, 51, 0.6);\n"
152
- ]);
153
- _templateObject = function _templateObject() {
154
- return data;
155
- };
156
- return data;
157
- }
158
- function _templateObject1() {
159
- var data = _tagged_template_literal([
160
- "\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n z-index: 101;\n padding: 32px 20px;\n width: 100%;\n height: 100%;\n"
161
- ]);
162
- _templateObject1 = function _templateObject() {
163
- return data;
164
- };
165
- return data;
166
- }
167
- function _templateObject2() {
168
- var data = _tagged_template_literal([
169
- "\n display: flex;\n width: ",
170
- ";\n height: ",
171
- ";\n flex-direction: ",
172
- ";\n align-items: ",
173
- ";\n justify-content: ",
174
- ";\n gap: ",
175
- ";\n flex-wrap: ",
176
- ";\n flex: ",
177
- ";\n background: ",
178
- ";\n border-radius: ",
179
- ";\n animation: 0.2s all ease-in-out;\n"
180
- ]);
181
- _templateObject2 = function _templateObject() {
182
- return data;
183
- };
184
- return data;
185
- }
186
- function _templateObject3() {
187
- var data = _tagged_template_literal([
188
- "\n display: -webkit-box;\n line-clamp: ",
189
- ";\n -webkit-line-clamp: ",
190
- ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n "
191
- ]);
192
- _templateObject3 = function _templateObject() {
193
- return data;
194
- };
195
- return data;
196
- }
197
- function _templateObject4() {
198
- var data = _tagged_template_literal([
199
- "\n text-decoration: ",
200
- ";\n "
201
- ]);
202
- _templateObject4 = function _templateObject() {
203
- return data;
204
- };
205
- return data;
206
- }
207
- function _templateObject5() {
208
- var data = _tagged_template_literal([
209
- "\n opacity: ",
210
- ";\n "
211
- ]);
212
- _templateObject5 = function _templateObject() {
213
- return data;
214
- };
215
- return data;
216
- }
217
- function _templateObject6() {
218
- var data = _tagged_template_literal([
219
- "\n word-break: ",
220
- ";\n "
221
- ]);
222
- _templateObject6 = function _templateObject() {
223
- return data;
224
- };
225
- return data;
226
- }
227
- function _templateObject7() {
228
- var data = _tagged_template_literal([
229
- "\n display: ",
230
- ";\n align-items: center;\n color: ",
231
- ";\n ",
232
- ";\n text-align: ",
233
- ";\n white-space: ",
234
- ";\n ",
235
- ";\n ",
236
- "\n ",
237
- ";\n"
238
- ]);
239
- _templateObject7 = function _templateObject() {
240
- return data;
241
- };
242
- return data;
243
- }
244
- function _templateObject8() {
245
- var data = _tagged_template_literal([
246
- "\n padding-top: 16px;\n padding-bottom: 24px;\n "
247
- ]);
248
- _templateObject8 = function _templateObject() {
249
- return data;
250
- };
251
- return data;
252
- }
253
- function _templateObject9() {
254
- var data = _tagged_template_literal([
255
- "\n padding-top: 24px;\n padding-bottom: 24px;\n "
256
- ]);
257
- _templateObject9 = function _templateObject() {
258
- return data;
259
- };
260
- return data;
261
- }
262
- function _templateObject10() {
263
- var data = _tagged_template_literal([
264
- "\n display: flex;\n flex-direction: column;\n border-radius: ",
265
- ";\n background: ",
266
- ";\n box-shadow: ",
267
- ";\n overflow: hidden;\n flex-grow: 1;\n height: ",
268
- ";\n min-height: 180px;\n max-height: 1200px;\n width: ",
269
- "px;\n max-width: ",
270
- "px;\n"
271
- ]);
272
- _templateObject10 = function _templateObject() {
273
- return data;
274
- };
275
- return data;
276
- }
277
- function _templateObject11() {
278
- var data = _tagged_template_literal([
279
- "\n display: flex;\n width: 100%;\n min-height: 64px;\n justify-content: space-between;\n align-items: center;\n padding: 12px 16px 12px 24px;\n gap: 10px;\n"
280
- ]);
281
- _templateObject11 = function _templateObject() {
282
- return data;
283
- };
284
- return data;
285
- }
286
- function _templateObject12() {
287
- var data = _tagged_template_literal([
288
- "\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n flex-direction: column;\n background: ",
289
- ";\n min-height: 112px;\n min-height: ",
290
- ";\n flex: 1;\n ",
291
- "\n"
292
- ]);
293
- _templateObject12 = function _templateObject() {
294
- return data;
295
- };
296
- return data;
297
- }
298
- function _templateObject13() {
299
- var data = _tagged_template_literal([
300
- "\n display: flex;\n flex-direction: column;\n width: 100%;\n max-width: ",
301
- "px;\n box-sizing: border-box;\n padding: 0 24px;\n overflow: hidden;\n background: ",
302
- ";\n"
303
- ]);
304
- _templateObject13 = function _templateObject() {
305
- return data;
306
- };
307
- return data;
308
- }
309
- function _templateObject14() {
310
- var data = _tagged_template_literal([
311
- "\n display: flex;\n width: 100%;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n padding: 16px 24px;\n gap: 12px;\n border-top: 1px solid ",
312
- ";\n background: ",
313
- ";\n"
314
- ]);
315
- _templateObject14 = function _templateObject() {
316
- return data;
317
- };
318
- return data;
319
- }
320
- function _templateObject15() {
321
- var data = _tagged_template_literal([
322
- "\n width: 32px;\n height: 32px;\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n opacity: ",
323
- ";\n\n &:hover {\n background: ",
324
- ";\n }\n"
325
- ]);
326
- _templateObject15 = function _templateObject() {
327
- return data;
328
- };
329
- return data;
330
- }
331
- function _templateObject16() {
332
- var data = _tagged_template_literal([
333
- "\n appearance: none;\n border: none;\n border-radius: 12px;\n width: 28px;\n height: 18px;\n cursor: pointer;\n position: relative;\n display: flex;\n align-items: center;\n background: ",
334
- ";\n padding: 2px;\n margin: 0;\n\n // slider\n &:before {\n content: '';\n left: 2px;\n display: block;\n position: absolute;\n width: 14px;\n height: 14px;\n background: ",
335
- ";\n border-radius: 50%;\n transition: left 0.2s ease-in-out;\n }\n\n // selected\n &:checked {\n background: ",
336
- ";\n &:before {\n left: 12px;\n }\n }\n\n // disabled\n &:disabled {\n cursor: auto;\n }\n"
337
- ]);
338
- _templateObject16 = function _templateObject() {
339
- return data;
340
- };
341
- return data;
342
- }
343
- function _templateObject17() {
344
- var data = _tagged_template_literal([
345
- "\n opacity: 50%;\n cursor: not-allowed;\n "
346
- ]);
347
- _templateObject17 = function _templateObject() {
348
- return data;
349
- };
350
- return data;
351
- }
352
- function _templateObject18() {
353
- var data = _tagged_template_literal([
354
- "\n border-radius: ",
355
- ";\n "
356
- ]);
357
- _templateObject18 = function _templateObject() {
358
- return data;
359
- };
360
- return data;
361
- }
362
- function _templateObject19() {
363
- var data = _tagged_template_literal([
364
- "\n background: ",
365
- ";\n & > span {\n color: ",
366
- ";\n }\n &:hover {\n background: ",
367
- ";\n }\n "
368
- ]);
369
- _templateObject19 = function _templateObject() {
370
- return data;
371
- };
372
- return data;
373
- }
374
- function _templateObject20() {
375
- var data = _tagged_template_literal([
376
- "\n padding: 7px 12px;\n gap: 4px;\n background: ",
377
- ";\n border-radius: ",
378
- ";\n & > span {\n color: ",
379
- ";\n }\n &:hover {\n background: ",
380
- ";\n }\n\n ",
381
- ";\n ",
382
- ";\n"
383
- ]);
384
- _templateObject20 = function _templateObject() {
385
- return data;
386
- };
387
- return data;
388
- }
389
- function _templateObject21() {
390
- var data = _tagged_template_literal([
391
- "\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n width: fit-content;\n user-select: none;\n cursor: pointer;\n ",
392
- ";\n ",
393
- ";\n"
394
- ]);
395
- _templateObject21 = function _templateObject() {
396
- return data;
397
- };
398
- return data;
399
- }
400
- function _templateObject22() {
401
- var data = _tagged_template_literal([
402
- "\n background: ",
403
- ";\n border: 1px solid ",
404
- ";\n border-radius: ",
405
- ";\n &:hover {\n border: 1px solid ",
406
- ";\n }\n & > span {\n color: ",
407
- ";\n }\n"
408
- ]);
409
- _templateObject22 = function _templateObject() {
410
- return data;
411
- };
412
- return data;
413
- }
414
- function _templateObject23() {
415
- var data = _tagged_template_literal([
416
- "\n padding: 4px 8px;\n "
417
- ]);
418
- _templateObject23 = function _templateObject() {
419
- return data;
420
- };
421
- return data;
422
- }
423
- function _templateObject24() {
424
- var data = _tagged_template_literal([
425
- "\n padding: 7px 12px;\n "
426
- ]);
427
- _templateObject24 = function _templateObject() {
428
- return data;
429
- };
430
- return data;
431
- }
432
- function _templateObject25() {
433
- var data = _tagged_template_literal([
434
- "\n padding: 7px 12px;\n "
435
- ]);
436
- _templateObject25 = function _templateObject() {
437
- return data;
438
- };
439
- return data;
440
- }
441
- function _templateObject26() {
442
- var data = _tagged_template_literal([
443
- "\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n width: fit-content;\n gap: 4px;\n cursor: pointer;\n background: ",
444
- ";\n ",
445
- ";\n ",
446
- ";\n ",
447
- ";\n"
448
- ]);
449
- _templateObject26 = function _templateObject() {
450
- return data;
451
- };
452
- return data;
453
- }
454
- function _templateObject27() {
455
- var data = _tagged_template_literal([
456
- "\n border: 1px solid ",
457
- ";\n background-color: ",
458
- ";\n :hover {\n background-color: ",
459
- ";\n }\n "
460
- ]);
461
- _templateObject27 = function _templateObject() {
462
- return data;
463
- };
464
- return data;
465
- }
466
- function _templateObject28() {
467
- var data = _tagged_template_literal([
468
- "\n border: 1px solid ",
469
- ";\n background-color: ",
470
- ";\n :hover {\n background-color: ",
471
- ";\n }\n "
472
- ]);
473
- _templateObject28 = function _templateObject() {
474
- return data;
475
- };
476
- return data;
477
- }
478
- function _templateObject29() {
479
- var data = _tagged_template_literal([
480
- "\n border: 1px solid ",
481
- ";\n background-color: ",
482
- ";\n :hover {\n background-color: ",
483
- ";\n }\n "
484
- ]);
485
- _templateObject29 = function _templateObject() {
486
- return data;
487
- };
488
- return data;
489
- }
490
- function _templateObject30() {
491
- var data = _tagged_template_literal([
492
- "\n border: 1px solid transparent;\n background-color: transparent;\n :hover {\n background-color: ",
493
- ";\n }\n "
494
- ]);
495
- _templateObject30 = function _templateObject() {
496
- return data;
497
- };
498
- return data;
499
- }
500
- function _templateObject31() {
501
- var data = _tagged_template_literal([
502
- "\n border: 1px solid ",
503
- ";\n background-color: ",
504
- ";\n "
505
- ]);
506
- _templateObject31 = function _templateObject() {
507
- return data;
508
- };
509
- return data;
510
- }
511
- function _templateObject32() {
512
- var data = _tagged_template_literal([
513
- "\n min-width: 72px;\n min-height: 40px;\n "
514
- ]);
515
- _templateObject32 = function _templateObject() {
516
- return data;
517
- };
518
- return data;
519
- }
520
- function _templateObject33() {
521
- var data = _tagged_template_literal([
522
- "\n min-width: 54px;\n min-height: 32px;\n "
523
- ]);
524
- _templateObject33 = function _templateObject() {
525
- return data;
526
- };
527
- return data;
528
- }
529
- function _templateObject34() {
530
- var data = _tagged_template_literal([
531
- "\n min-width: 72px;\n min-height: 40px;\n "
532
- ]);
533
- _templateObject34 = function _templateObject() {
534
- return data;
535
- };
536
- return data;
537
- }
538
- function _templateObject35() {
539
- var data = _tagged_template_literal([
540
- "\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n padding: 0 12px;\n border-radius: 6px;\n cursor: pointer;\n ",
541
- ";\n ",
542
- ";\n ",
543
- ";\n"
544
- ]);
545
- _templateObject35 = function _templateObject() {
546
- return data;
547
- };
548
- return data;
549
- }
550
- function _templateObject36() {
551
- var data = _tagged_template_literal([
552
- "\n width: 40px;\n min-width: 40px;\n height: 40px;\n min-height: 40px;\n "
553
- ]);
554
- _templateObject36 = function _templateObject() {
555
- return data;
556
- };
557
- return data;
558
- }
559
- function _templateObject37() {
560
- var data = _tagged_template_literal([
561
- "\n width: 32px;\n min-width: 32px;\n height: 32px;\n min-height: 32px;\n "
562
- ]);
563
- _templateObject37 = function _templateObject() {
564
- return data;
565
- };
566
- return data;
567
- }
568
- function _templateObject38() {
569
- var data = _tagged_template_literal([
570
- "\n width: 40px;\n min-width: 40px;\n height: 40px;\n min-height: 40px;\n "
571
- ]);
572
- _templateObject38 = function _templateObject() {
573
- return data;
574
- };
575
- return data;
576
- }
577
- function _templateObject39() {
578
- var data = _tagged_template_literal([
579
- "\n border: 1px solid ",
580
- ";\n &:hover {\n background-color: ",
581
- ";\n }\n "
582
- ]);
583
- _templateObject39 = function _templateObject() {
584
- return data;
585
- };
586
- return data;
587
- }
588
- function _templateObject40() {
589
- var data = _tagged_template_literal([
590
- "\n border: 1px solid transparent;\n &:hover {\n background-color: ",
591
- ";\n }\n "
592
- ]);
593
- _templateObject40 = function _templateObject() {
594
- return data;
595
- };
596
- return data;
597
- }
598
- function _templateObject41() {
599
- var data = _tagged_template_literal([
600
- "\n border: 1px solid ",
601
- ";\n &:hover {\n background-color: ",
602
- ";\n }\n "
603
- ]);
604
- _templateObject41 = function _templateObject() {
605
- return data;
606
- };
607
- return data;
608
- }
609
- function _templateObject42() {
610
- var data = _tagged_template_literal([
611
- "\n display: flex;\n flex-shrink: 0;\n border-radius: ",
612
- ";\n justify-content: center;\n align-items: center;\n background-color: ",
613
- ";\n cursor: pointer;\n ",
614
- ";\n ",
615
- ";\n ",
616
- ";\n & > svg {\n width: 20px;\n height: 20px;\n }\n"
617
- ]);
618
- _templateObject42 = function _templateObject() {
619
- return data;
620
- };
621
- return data;
622
- }
623
- function _templateObject43() {
624
- var data = _tagged_template_literal([
625
- "\n background: ",
626
- ";\n & > span {\n color: ",
627
- ";\n }\n & > svg > path {\n fill: ",
628
- ";\n }\n"
629
- ]);
630
- _templateObject43 = function _templateObject() {
631
- return data;
632
- };
633
- return data;
634
- }
635
- function _templateObject44() {
636
- var data = _tagged_template_literal([
637
- "\n background: ",
638
- ";\n & > span {\n align-self: center;\n color: ",
639
- ";\n }\n & > svg > path {\n fill: ",
640
- ";\n }\n"
641
- ]);
642
- _templateObject44 = function _templateObject() {
643
- return data;
644
- };
645
- return data;
646
- }
647
- function _templateObject45() {
648
- var data = _tagged_template_literal([
649
- "\n display: flex;\n justify-content: flex-start;\n align-items: start;\n padding: 6px 8px;\n gap: 4px;\n border-radius: ",
650
- ";\n ",
651
- "\n ",
652
- "\n"
653
- ]);
654
- _templateObject45 = function _templateObject() {
655
- return data;
656
- };
657
- return data;
658
- }
659
- function _templateObject46() {
660
- var data = _tagged_template_literal([
661
- "\n display: flex;\n min-height: 20px;\n min-width: 20px;\n"
662
- ]);
663
- _templateObject46 = function _templateObject() {
664
- return data;
665
- };
666
- return data;
667
- }
668
- function _templateObject47() {
669
- var data = _tagged_template_literal([
670
- "\n padding: 2px 0;\n"
671
- ]);
672
- _templateObject47 = function _templateObject() {
673
- return data;
674
- };
675
- return data;
676
- }
677
- function _templateObject48() {
678
- var data = _tagged_template_literal([
679
- "\n width: ",
680
- ";\n min-width: ",
681
- ";\n height: ",
682
- ";\n min-height: ",
683
- ";\n\n & > path {\n fill: ",
684
- ";\n }\n"
685
- ]);
686
- _templateObject48 = function _templateObject() {
687
- return data;
688
- };
689
- return data;
690
- }
691
- function _templateObject49() {
692
- var data = _tagged_template_literal([
693
- "\n padding: 4px 8px 4px 12px;\n background-color: transparent;\n width: 100%;\n border: none;\n box-sizing: border-box;\n &::placeholder {\n color: ",
694
- ";\n }\n"
695
- ]);
696
- _templateObject49 = function _templateObject() {
697
- return data;
698
- };
699
- return data;
700
- }
701
- function _templateObject50() {
702
- var data = _tagged_template_literal([
703
- "\n display: flex;\n flex-direction: row;\n align-items: center;\n"
704
- ]);
705
- _templateObject50 = function _templateObject() {
706
- return data;
707
- };
708
- return data;
709
- }
710
- function _templateObject51() {
711
- var data = _tagged_template_literal([
712
- "\n display: flex;\n width: 100%;\n justify-content: flex-end;\n align-items: center;\n gap: 2px;\n"
713
- ]);
714
- _templateObject51 = function _templateObject() {
715
- return data;
716
- };
717
- return data;
718
- }
719
- function _templateObject52() {
720
- var data = _tagged_template_literal([
721
- "\n display: flex;\n align-items: center;\n width: 100%;\n flex-direction: ",
722
- ";\n justify-content: space-between;\n min-height: 40px;\n margin: 1px;\n gap: 8px;\n box-shadow: 0 0 0 1px ",
723
- ";\n border-radius: 6px;\n background-color: ",
724
- ";\n overflow: hidden;\n ",
725
- ";\n"
726
- ]);
727
- _templateObject52 = function _templateObject() {
728
- return data;
729
- };
730
- return data;
731
- }
732
- function _templateObject53() {
733
- var data = _tagged_template_literal([
734
- "\n display: flex;\n width: 100%;\n flex-direction: row;\n padding: 8px 12px;\n gap: 8px;\n background-color: ",
735
- ";\n"
736
- ]);
737
- _templateObject53 = function _templateObject() {
738
- return data;
739
- };
740
- return data;
741
- }
742
- function _templateObject54() {
743
- var data = _tagged_template_literal([
744
- "\n padding: 8px 12px 0 12px;\n background-color: transparent;\n resize: none;\n width: 100%;\n height: ",
745
- ";\n flex: 1;\n word-break: break-all;\n ",
746
- ";\n &::placeholder {\n color: ",
747
- ";\n }\n"
748
- ]);
749
- _templateObject54 = function _templateObject() {
750
- return data;
751
- };
752
- return data;
753
- }
754
- function _templateObject55() {
755
- var data = _tagged_template_literal([
756
- "\n width: 32px;\n height: 32px;\n padding: 7px;\n"
757
- ]);
758
- _templateObject55 = function _templateObject() {
759
- return data;
760
- };
761
- return data;
762
- }
763
- function _templateObject56() {
764
- var data = _tagged_template_literal([
765
- "\n display: flex;\n width: 16px;\n height: 16px;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n border-radius: ",
766
- ";\n border: none;\n background: ",
767
- ";\n cursor: pointer;\n transition:\n transform 0.1s ease-out,\n background 0.1s ease;\n\n &:hover {\n background: ",
768
- ";\n }\n"
769
- ]);
770
- _templateObject56 = function _templateObject() {
771
- return data;
772
- };
773
- return data;
774
- }
775
- var React3 = require("react");
776
- var styled5 = require("@emotion/styled");
777
- var framerMotion = require("framer-motion");
778
- var jsxRuntime = require("react/jsx-runtime");
779
- var reactDom = require("react-dom");
780
- var utils = require("@shoplflow/utils");
781
- var react = require("@emotion/react");
782
- var Scrollbars = require("react-custom-scrollbars-2");
783
- var ShoplAssets = require("@shoplflow/shopl-assets");
784
- var HadaAssets = require("@shoplflow/hada-assets");
785
- function _interopDefault(e) {
786
- return e && e.__esModule ? e : {
787
- default: e
788
- };
789
- }
790
- function _interopNamespace(e) {
791
- if (e && e.__esModule) return e;
792
- var n = Object.create(null);
793
- if (e) {
794
- Object.keys(e).forEach(function(k) {
795
- if (k !== "default") {
796
- var d = Object.getOwnPropertyDescriptor(e, k);
797
- Object.defineProperty(n, k, d.get ? d : {
798
- enumerable: true,
799
- get: function get() {
800
- return e[k];
801
- }
802
- });
803
- }
804
- });
805
- }
806
- n.default = e;
807
- return Object.freeze(n);
808
- }
809
- var React3__default = /*#__PURE__*/ _interopDefault(React3);
810
- var styled5__default = /*#__PURE__*/ _interopDefault(styled5);
811
- var Scrollbars__default = /*#__PURE__*/ _interopDefault(Scrollbars);
812
- var ShoplAssets__namespace = /*#__PURE__*/ _interopNamespace(ShoplAssets);
813
- var HadaAssets__namespace = /*#__PURE__*/ _interopNamespace(HadaAssets);
814
- // src/hooks/useDomain.ts
815
- exports.useDomain = function() {
816
- var domain = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "SHOPL";
817
- var _React3_useState = _sliced_to_array(React3.useState(void 0), 2), domainType = _React3_useState[0], setDomainType = _React3_useState[1];
818
- React3.useEffect(function() {
819
- if (domain) {
820
- setDomainType(domain);
821
- }
822
- }, [
823
- domain
824
- ]);
825
- React3.useEffect(function() {
826
- if (!domainType) {
827
- return;
828
- }
829
- document.documentElement.dataset.shoplflow = domainType === null || domainType === void 0 ? void 0 : domainType.toLowerCase();
830
- }, [
831
- domainType
832
- ]);
833
- return [
834
- domainType
835
- ];
836
- };
837
- exports.getDomain = function() {
838
- return document.documentElement.dataset.shoplflow;
839
- };
840
- // src/animation/fadeInOut.ts
841
- var fadeInOut = {
842
- initial: {
843
- opacity: 0
844
- },
845
- animate: {
846
- opacity: 1,
847
- transition: {
848
- duration: 0.1
849
- }
850
- },
851
- exit: {
852
- opacity: 0,
853
- transition: {
854
- duration: 0.1
855
- }
856
- }
857
- };
858
- var BackDropStyled = styled5__default.default(framerMotion.motion.div)(_templateObject());
859
- var BackDrop = function(param) {
860
- var children = param.children;
861
- return /* @__PURE__ */ jsxRuntime.jsx(BackDropStyled, {
862
- variants: fadeInOut,
863
- initial: "initial",
864
- animate: "animate",
865
- exit: "exit",
866
- "data-shoplflow": "BackDrop",
867
- children: children
868
- });
869
- };
870
- var BackDrop_default = BackDrop;
871
- var ModalHandlerContext = React3.createContext({
872
- addModal: utils.noop,
873
- removeModal: utils.noop
874
- });
875
- var ModalContext = React3.createContext([]);
876
- var SpaceMarginWrapper = styled5__default.default(framerMotion.motion.div)(_templateObject1());
877
- var ModalPortal = function() {
878
- var modal = React3.useContext(ModalContext);
879
- return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
880
- children: reactDom.createPortal(/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, {
881
- children: modal.map(function(item, index) {
882
- return /* @__PURE__ */ jsxRuntime.jsx(BackDrop_default, {
883
- children: /* @__PURE__ */ jsxRuntime.jsx(SpaceMarginWrapper, {
884
- children: item.component
885
- })
886
- }, index);
887
- })
888
- }), document.body)
889
- });
890
- };
891
- exports.ModalProvider = ModalPortal;
892
- var ModalProvider = function(param) {
893
- var children = param.children;
894
- var _React3_useState = _sliced_to_array(React3.useState([]), 2), openedModals = _React3_useState[0], setOpenedModals = _React3_useState[1];
895
- var addModal = function(component, id) {
896
- setOpenedModals(function(modals) {
897
- if (modals) {
898
- return _to_consumable_array(modals).concat([
899
- {
900
- component: component,
901
- id: id
902
- }
903
- ]);
904
- }
905
- return [
906
- {
907
- component: component,
908
- id: id
909
- }
910
- ];
911
- });
912
- };
913
- var removeModal = function(props) {
914
- var _ref = props || {
915
- id: void 0,
916
- deps: void 0
917
- }, id = _ref.id, deps = _ref.deps;
918
- var isIncludeAllProps = Boolean(id && deps);
919
- var isIncludeId = Boolean(id);
920
- var isNotIncludeAllProps = !id && Boolean(utils.isNullOrUndefined(deps));
921
- var isIncludeDeps = Boolean(Boolean(!utils.isNullOrUndefined(deps)) && !id);
922
- if (isIncludeAllProps) {
923
- throw new Error("id와 deps는 동시에 사용할 수 없습니다.");
924
- }
925
- if (isIncludeId) {
926
- setOpenedModals(function(modal) {
927
- var filterModal = modal.filter(function(modal2) {
928
- return modal2.id !== id;
929
- });
930
- return _to_consumable_array(filterModal);
931
- });
932
- return;
933
- }
934
- if (isNotIncludeAllProps || deps === 1) {
935
- setOpenedModals(function(modal) {
936
- var removeModal2 = modal.slice(0, -1);
937
- return _to_consumable_array(removeModal2);
938
- });
939
- return;
940
- }
941
- if (isIncludeDeps) {
942
- if (deps === 0 || deps === void 0) {
943
- return;
944
- }
945
- setOpenedModals(function(modal) {
946
- var removeDeps = modal.slice(0, -deps);
947
- return _to_consumable_array(removeDeps);
948
- });
949
- return;
950
- }
951
- };
952
- var dispatch = React3.useMemo(function() {
953
- return {
954
- addModal: addModal,
955
- removeModal: removeModal
956
- };
957
- }, []);
958
- return /* @__PURE__ */ jsxRuntime.jsx(ModalContext.Provider, {
959
- value: openedModals,
960
- children: /* @__PURE__ */ jsxRuntime.jsx(ModalHandlerContext.Provider, {
961
- value: dispatch,
962
- children: children
963
- })
964
- });
965
- };
966
- var ModalProvider_default = ModalProvider;
967
- var ShoplflowProvider = function(param) {
968
- var children = param.children, _param_domain = param.domain, domain = _param_domain === void 0 ? "SHOPL" : _param_domain;
969
- exports.useDomain(domain);
970
- return /* @__PURE__ */ jsxRuntime.jsxs(ModalProvider_default, {
971
- children: [
972
- /* @__PURE__ */ jsxRuntime.jsx(exports.ModalProvider, {}),
973
- children
974
- ]
975
- });
976
- };
977
- exports.ShoplflowProvider = ShoplflowProvider;
978
- exports.useHandleModal = function() {
979
- var _React3_useContext = React3.useContext(ModalHandlerContext), addModal = _React3_useContext.addModal, removeModal = _React3_useContext.removeModal;
980
- return {
981
- addModal: addModal,
982
- removeModal: removeModal
983
- };
984
- };
985
- exports.useModalValue = function() {
986
- var modal = React3.useContext(ModalContext);
987
- return {
988
- modal: modal
989
- };
990
- };
991
- // src/styles/tokens.ts
992
- var fontWeightRegular = "var(--font-weight-regular)";
993
- var fontWeightMedium = "var(--font-weight-medium)";
994
- var fontWeightBold = "var(--font-weight-bold)";
995
- exports.fontWeightTokens = {
996
- fontWeightRegular: fontWeightRegular,
997
- fontWeightMedium: fontWeightMedium,
998
- fontWeightBold: fontWeightBold
999
- };
1000
- var borderRadius04 = "var(--border-radius04)";
1001
- var borderRadius06 = "var(--border-radius06)";
1002
- var borderRadius08 = "var(--border-radius08)";
1003
- var borderRadius12 = "var(--border-radius12)";
1004
- var borderRadius16 = "var(--border-radius16)";
1005
- var borderRadius20 = "var(--border-radius20)";
1006
- exports.borderRadiusTokens = {
1007
- borderRadius04: borderRadius04,
1008
- borderRadius06: borderRadius06,
1009
- borderRadius08: borderRadius08,
1010
- borderRadius12: borderRadius12,
1011
- borderRadius16: borderRadius16,
1012
- borderRadius20: borderRadius20
1013
- };
1014
- var coolgray300 = "var(--coolgray300)";
1015
- var coolgray200 = "var(--coolgray200)";
1016
- var coolgray100 = "var(--coolgray100)";
1017
- var coolgray50 = "var(--coolgray50)";
1018
- var navy400 = "var(--navy400)";
1019
- var navy300 = "var(--navy300)";
1020
- var neutral0 = "var(--neutral0)";
1021
- var neutral100 = "var(--neutral100)";
1022
- var neutral150 = "var(--neutral150)";
1023
- var neutral200 = "var(--neutral200)";
1024
- var neutral300 = "var(--neutral300)";
1025
- var neutral350 = "var(--neutral350)";
1026
- var neutral400 = "var(--neutral400)";
1027
- var neutral500 = "var(--neutral500)";
1028
- var neutral600 = "var(--neutral600)";
1029
- var neutral700 = "var(--neutral700)";
1030
- var neutral400_5 = "var(--neutral400_5)";
1031
- var red300 = "var(--red300)";
1032
- var red200 = "var(--red200)";
1033
- var red100 = "var(--red100)";
1034
- var ocean300 = "var(--ocean300)";
1035
- var ocean200 = "var(--ocean200)";
1036
- var ocean100 = "var(--ocean100)";
1037
- var purple400 = "var(--purple400)";
1038
- var purple300 = "var(--purple300)";
1039
- var purple100 = "var(--purple100)";
1040
- var yellow300 = "var(--yellow300)";
1041
- var yellow200 = "var(--yellow200)";
1042
- var yellow100 = "var(--yellow100)";
1043
- var green300 = "var(--green300)";
1044
- var green200 = "var(--green200)";
1045
- var green100 = "var(--green100)";
1046
- var shopl400 = "var(--shopl400)";
1047
- var shopl300 = "var(--shopl300)";
1048
- var shopl200 = "var(--shopl200)";
1049
- var shopl150 = "var(--shopl150)";
1050
- var shopl100 = "var(--shopl100)";
1051
- var hada400 = "var(--hada400)";
1052
- var hada300 = "var(--hada300)";
1053
- var hada200 = "var(--hada200)";
1054
- var hada150 = "var(--hada150)";
1055
- var hada100 = "var(--hada100)";
1056
- var background = "var(--background)";
1057
- var primary100 = "var(--primary100)";
1058
- var primary150 = "var(--primary150)";
1059
- var primary200 = "var(--primary200)";
1060
- var primary300 = "var(--primary300)";
1061
- var primary400 = "var(--primary400)";
1062
- exports.colorTokens = {
1063
- coolgray300: coolgray300,
1064
- coolgray200: coolgray200,
1065
- coolgray100: coolgray100,
1066
- coolgray50: coolgray50,
1067
- navy400: navy400,
1068
- navy300: navy300,
1069
- neutral0: neutral0,
1070
- neutral100: neutral100,
1071
- neutral150: neutral150,
1072
- neutral200: neutral200,
1073
- neutral300: neutral300,
1074
- neutral350: neutral350,
1075
- neutral400: neutral400,
1076
- neutral500: neutral500,
1077
- neutral600: neutral600,
1078
- neutral700: neutral700,
1079
- neutral400_5: neutral400_5,
1080
- red300: red300,
1081
- red200: red200,
1082
- red100: red100,
1083
- ocean300: ocean300,
1084
- ocean200: ocean200,
1085
- ocean100: ocean100,
1086
- purple400: purple400,
1087
- purple300: purple300,
1088
- purple100: purple100,
1089
- yellow300: yellow300,
1090
- yellow200: yellow200,
1091
- yellow100: yellow100,
1092
- green300: green300,
1093
- green200: green200,
1094
- green100: green100,
1095
- shopl400: shopl400,
1096
- shopl300: shopl300,
1097
- shopl200: shopl200,
1098
- shopl150: shopl150,
1099
- shopl100: shopl100,
1100
- hada400: hada400,
1101
- hada300: hada300,
1102
- hada200: hada200,
1103
- hada150: hada150,
1104
- hada100: hada100,
1105
- background: background,
1106
- primary100: primary100,
1107
- primary150: primary150,
1108
- primary200: primary200,
1109
- primary300: primary300,
1110
- primary400: primary400
1111
- };
1112
- var spacing04 = "var(--spacing04)";
1113
- var spacing06 = "var(--spacing06)";
1114
- var spacing08 = "var(--spacing08)";
1115
- var spacing12 = "var(--spacing12)";
1116
- var spacing16 = "var(--spacing16)";
1117
- var spacing20 = "var(--spacing20)";
1118
- var spacing24 = "var(--spacing24)";
1119
- var spacing30 = "var(--spacing30)";
1120
- var spacing32 = "var(--spacing32)";
1121
- var spacing40 = "var(--spacing40)";
1122
- exports.spacingTokens = {
1123
- spacing04: spacing04,
1124
- spacing06: spacing06,
1125
- spacing08: spacing08,
1126
- spacing12: spacing12,
1127
- spacing16: spacing16,
1128
- spacing20: spacing20,
1129
- spacing24: spacing24,
1130
- spacing30: spacing30,
1131
- spacing32: spacing32,
1132
- spacing40: spacing40
1133
- };
1134
- var dropShadow = "var(--dropShadow)";
1135
- exports.boxShadowTokens = {
1136
- dropShadow: dropShadow
1137
- };
1138
- var heading1_700 = ".heading1_700";
1139
- var heading1_400 = ".heading1_400";
1140
- var heading2_700 = ".heading2_700";
1141
- var heading2_400 = ".heading2_400";
1142
- var heading3_700 = ".heading3_700";
1143
- var heading3_400 = ".heading3_400";
1144
- var title1_700 = ".title1_700";
1145
- var title1_400 = ".title1_400";
1146
- var title2_700 = ".title2_700";
1147
- var title2_500 = ".title2_500";
1148
- var title2_400 = ".title2_400";
1149
- var body1_700 = ".body1_700";
1150
- var body1_500 = ".body1_500";
1151
- var body1_400 = ".body1_400";
1152
- var body2_700 = ".body2_700";
1153
- var body2_500 = ".body2_500";
1154
- var body2_400 = ".body2_400";
1155
- var body3_400 = ".body3_400";
1156
- var body3_500 = ".body3_500";
1157
- var caption_400 = ".caption_400";
1158
- exports.typographyTokens = {
1159
- heading1_700: heading1_700,
1160
- heading1_400: heading1_400,
1161
- heading2_700: heading2_700,
1162
- heading2_400: heading2_400,
1163
- heading3_700: heading3_700,
1164
- heading3_400: heading3_400,
1165
- title1_700: title1_700,
1166
- title1_400: title1_400,
1167
- title2_700: title2_700,
1168
- title2_500: title2_500,
1169
- title2_400: title2_400,
1170
- body1_700: body1_700,
1171
- body1_500: body1_500,
1172
- body1_400: body1_400,
1173
- body2_700: body2_700,
1174
- body2_500: body2_500,
1175
- body2_400: body2_400,
1176
- body3_400: body3_400,
1177
- body3_500: body3_500,
1178
- caption_400: caption_400
1179
- };
1180
- exports.StyledStack = styled5__default.default.div(_templateObject2(), function(param) {
1181
- var width = param.width;
1182
- return width;
1183
- }, function(param) {
1184
- var height = param.height;
1185
- return height;
1186
- }, function(param) {
1187
- var direction = param.direction;
1188
- return direction;
1189
- }, function(param) {
1190
- var align = param.align;
1191
- return align;
1192
- }, function(param) {
1193
- var justify = param.justify;
1194
- return justify;
1195
- }, function(param) {
1196
- var spacing = param.spacing;
1197
- return spacing && exports.spacingTokens[spacing];
1198
- }, function(param) {
1199
- var flexWrap = param.flexWrap;
1200
- return flexWrap;
1201
- }, function(param) {
1202
- var flex = param.flex;
1203
- return flex;
1204
- }, function(param) {
1205
- var background2 = param.background;
1206
- return background2 ? exports.colorTokens[background2] : "transparent";
1207
- }, function(param) {
1208
- var radius = param.radius;
1209
- return radius && exports.borderRadiusTokens[radius];
1210
- });
1211
- var createStackComponent = function(stackOption) {
1212
- var _stackOption_direction, _stackOption_align, _stackOption_justify, _stackOption_width, _stackOption_height, _stackOption_flexWrap, _stackOption_flex;
1213
- return React3.forwardRef(function Stack2(_param, ref) {
1214
- var _param_as = _param.as, as = _param_as === void 0 ? "div" : _param_as, _param_spacing = _param.spacing, spacing = _param_spacing === void 0 ? stackOption === null || stackOption === void 0 ? void 0 : stackOption.spacing : _param_spacing, _param_direction = _param.direction, direction = _param_direction === void 0 ? (_stackOption_direction = stackOption === null || stackOption === void 0 ? void 0 : stackOption.direction) !== null && _stackOption_direction !== void 0 ? _stackOption_direction : "column" : _param_direction, _param_align = _param.align, align = _param_align === void 0 ? (_stackOption_align = stackOption === null || stackOption === void 0 ? void 0 : stackOption.align) !== null && _stackOption_align !== void 0 ? _stackOption_align : "flex-start" : _param_align, _param_justify = _param.justify, justify = _param_justify === void 0 ? (_stackOption_justify = stackOption === null || stackOption === void 0 ? void 0 : stackOption.justify) !== null && _stackOption_justify !== void 0 ? _stackOption_justify : "flex-start" : _param_justify, _param_width = _param.width, width = _param_width === void 0 ? (_stackOption_width = stackOption === null || stackOption === void 0 ? void 0 : stackOption.width) !== null && _stackOption_width !== void 0 ? _stackOption_width : "initial" : _param_width, _param_height = _param.height, height = _param_height === void 0 ? (_stackOption_height = stackOption === null || stackOption === void 0 ? void 0 : stackOption.height) !== null && _stackOption_height !== void 0 ? _stackOption_height : "initial" : _param_height, _param_flexWrap = _param.flexWrap, flexWrap = _param_flexWrap === void 0 ? (_stackOption_flexWrap = stackOption === null || stackOption === void 0 ? void 0 : stackOption.flexWrap) !== null && _stackOption_flexWrap !== void 0 ? _stackOption_flexWrap : "initial" : _param_flexWrap, _param_flex = _param.flex, flex = _param_flex === void 0 ? (_stackOption_flex = stackOption === null || stackOption === void 0 ? void 0 : stackOption.flex) !== null && _stackOption_flex !== void 0 ? _stackOption_flex : "initial" : _param_flex, _param_radius = _param.radius, radius = _param_radius === void 0 ? stackOption === null || stackOption === void 0 ? void 0 : stackOption.radius : _param_radius, tmp = _param.background, background2 = tmp === void 0 ? stackOption === null || stackOption === void 0 ? void 0 : stackOption.background : tmp, rest = _object_without_properties(_param, [
1215
- "as",
1216
- "spacing",
1217
- "direction",
1218
- "align",
1219
- "justify",
1220
- "width",
1221
- "height",
1222
- "flexWrap",
1223
- "flex",
1224
- "radius",
1225
- "background"
1226
- ]);
1227
- return /* @__PURE__ */ jsxRuntime.jsx(exports.StyledStack, _object_spread_props(_object_spread({
1228
- as: as,
1229
- spacing: spacing,
1230
- ref: ref,
1231
- direction: direction,
1232
- align: align,
1233
- justify: justify,
1234
- width: width,
1235
- height: height,
1236
- flexWrap: flexWrap,
1237
- flex: flex,
1238
- background: background2,
1239
- radius: radius
1240
- }, rest), {
1241
- "data-shoplflow": "Stack",
1242
- children: rest.children
1243
- }));
1244
- });
1245
- };
1246
- var Stack = createStackComponent();
1247
- Stack.Vertical = createStackComponent({
1248
- direction: "column"
1249
- });
1250
- Stack.Horizontal = createStackComponent({
1251
- direction: "row"
1252
- });
1253
- exports.MotionStack = framerMotion.motion(Stack);
1254
- exports.MotionStack.Vertical = framerMotion.motion(Stack.Vertical);
1255
- exports.MotionStack.Horizontal = framerMotion.motion(Stack.Horizontal);
1256
- exports.Stack = Stack;
1257
- var setEllipsis = function(maxLines) {
1258
- return react.css(_templateObject3(), maxLines, maxLines);
1259
- };
1260
- var StyledText = styled5__default.default.span(_templateObject7(), function(param) {
1261
- var display = param.display;
1262
- return display && display;
1263
- }, function(param) {
1264
- var color = param.color;
1265
- return color && exports.colorTokens[color];
1266
- }, function(param) {
1267
- var lineClamp = param.lineClamp;
1268
- return lineClamp && setEllipsis(lineClamp);
1269
- }, function(param) {
1270
- var textAlign = param.textAlign;
1271
- return textAlign && textAlign;
1272
- }, function(param) {
1273
- var whiteSpace = param.whiteSpace;
1274
- return whiteSpace && whiteSpace;
1275
- }, function(param) {
1276
- var textDecorations = param.textDecorations;
1277
- return textDecorations && react.css(_templateObject4(), textDecorations);
1278
- }, function(param) {
1279
- var opacity = param.opacity;
1280
- return opacity && react.css(_templateObject5(), opacity);
1281
- }, function(param) {
1282
- var wordBreak = param.wordBreak;
1283
- return wordBreak && react.css(_templateObject6(), wordBreak);
1284
- });
1285
- var Text = React3.forwardRef(function(_param, ref) {
1286
- var children = _param.children, _param_typography = _param.typography, typography = _param_typography === void 0 ? "body1_400" : _param_typography, whiteSpace = _param.whiteSpace, _param_color = _param.color, color = _param_color === void 0 ? "neutral700" : _param_color, _param_display = _param.display, display = _param_display === void 0 ? "inline-block" : _param_display, _param_textAlign = _param.textAlign, textAlign = _param_textAlign === void 0 ? "start" : _param_textAlign, className = _param.className, as = _param.as, rest = _object_without_properties(_param, [
1287
- "children",
1288
- "typography",
1289
- "whiteSpace",
1290
- "color",
1291
- "display",
1292
- "textAlign",
1293
- "className",
1294
- "as"
1295
- ]);
1296
- return /* @__PURE__ */ jsxRuntime.jsx(StyledText, _object_spread_props(_object_spread({
1297
- ref: ref,
1298
- whiteSpace: whiteSpace,
1299
- className: className ? "".concat(typography, " ").concat(className) : typography,
1300
- color: color,
1301
- display: display,
1302
- textAlign: textAlign,
1303
- as: as
1304
- }, rest), {
1305
- "data-shoplflow": "Text",
1306
- children: children
1307
- }));
1308
- });
1309
- exports.Text = Text;
1310
- var MODAL_SIZE_XXS = 400;
1311
- var MODAL_SIZE_XS = 500;
1312
- var MODAL_SIZE_S = 560;
1313
- var MODAL_SIZE_M = 640;
1314
- var MODAL_SIZE_L = 768;
1315
- var MODAL_SIZE_XL = 1040;
1316
- var MODAL_SIZE_XXL = 1280;
1317
- var getModalWidthFromSize = function(size) {
1318
- switch(size){
1319
- case "XXS":
1320
- return MODAL_SIZE_XXS;
1321
- case "XS":
1322
- return MODAL_SIZE_XS;
1323
- case "S":
1324
- return MODAL_SIZE_S;
1325
- case "M":
1326
- return MODAL_SIZE_M;
1327
- case "L":
1328
- return MODAL_SIZE_L;
1329
- case "XL":
1330
- return MODAL_SIZE_XL;
1331
- case "XXL":
1332
- return MODAL_SIZE_XXL;
1333
- default:
1334
- return MODAL_SIZE_M;
1335
- }
1336
- };
1337
- var getModalBodyTopBottomPadding = function(isIncludeHeader) {
1338
- if (isIncludeHeader) {
1339
- return react.css(_templateObject8());
1340
- }
1341
- return react.css(_templateObject9());
1342
- };
1343
- var Container = styled5__default.default.div(_templateObject10(), exports.borderRadiusTokens.borderRadius08, exports.colorTokens.neutral0, exports.boxShadowTokens.dropShadow, function(param) {
1344
- var height = param.height;
1345
- return height ? "".concat(height, "px") : "initial";
1346
- }, function(param) {
1347
- var sizeVar = param.sizeVar;
1348
- return getModalWidthFromSize(sizeVar);
1349
- }, function(param) {
1350
- var sizeVar = param.sizeVar;
1351
- return getModalWidthFromSize(sizeVar);
1352
- });
1353
- var HeaderContainer = styled5__default.default.div(_templateObject11());
1354
- var BodyContainer = styled5__default.default.div(_templateObject12(), exports.colorTokens.neutral0, function(param) {
1355
- var height = param.height;
1356
- return height;
1357
- }, function(param) {
1358
- var isIncludeHeader = param.isIncludeHeader;
1359
- return getModalBodyTopBottomPadding(isIncludeHeader);
1360
- });
1361
- var ModalBodyContent = styled5__default.default.div(_templateObject13(), function(param) {
1362
- var sizeVar = param.sizeVar;
1363
- return getModalWidthFromSize(sizeVar);
1364
- }, exports.colorTokens.neutral0);
1365
- var FooterContainer = styled5__default.default.div(_templateObject14(), exports.colorTokens.neutral300, exports.colorTokens.neutral0);
1366
- // src/components/Modal/Modal.types.ts
1367
- exports.ModalSize = {
1368
- XXS: "XXS",
1369
- XS: "XS",
1370
- S: "S",
1371
- M: "M",
1372
- L: "L",
1373
- XL: "XL",
1374
- XXL: "XXL"
1375
- };
1376
- exports.MODAL_HEADER_KEY = Symbol("MODAL_HEADER");
1377
- exports.MODAL_FOOTER_KEY = Symbol("MODAL_FOOTER");
1378
- var ModalContainer = function(_param) {
1379
- var children = _param.children, _param_outsideClick = _param.outsideClick, outsideClick = _param_outsideClick === void 0 ? utils.noop : _param_outsideClick, rest = _object_without_properties(_param, [
1380
- "children",
1381
- "outsideClick"
1382
- ]);
1383
- var ref = utils.useParentElementClick(outsideClick);
1384
- var childrenArray = React3__default.default.Children.toArray(children);
1385
- var findHeader = childrenArray.find(function(child) {
1386
- if (!React3__default.default.isValidElement(child)) {
1387
- return child;
1388
- }
1389
- if (child.type[exports.MODAL_HEADER_KEY]) {
1390
- return child;
1391
- }
1392
- });
1393
- var findFooter = childrenArray.find(function(child) {
1394
- if (!React3__default.default.isValidElement(child)) {
1395
- return child;
1396
- }
1397
- if (child.type[exports.MODAL_FOOTER_KEY]) {
1398
- return child;
1399
- }
1400
- });
1401
- var addPropInChildren = React3__default.default.Children.map(childrenArray, function(child) {
1402
- if (!React3__default.default.isValidElement(child)) {
1403
- return child;
1404
- }
1405
- return React3__default.default.cloneElement(child, {
1406
- isIncludeHeader: Boolean(findHeader),
1407
- isIncludeFooter: Boolean(findFooter),
1408
- sizeVar: rest.sizeVar,
1409
- height: rest.height
1410
- });
1411
- });
1412
- return /* @__PURE__ */ jsxRuntime.jsx(Container, _object_spread_props(_object_spread({
1413
- ref: ref
1414
- }, rest), {
1415
- "data-shoplflow": "Modal",
1416
- children: addPropInChildren
1417
- }));
1418
- };
1419
- var ModalContainer_default = ModalContainer;
1420
- var ModalFooter = function(param) {
1421
- var children = param.children;
1422
- return /* @__PURE__ */ jsxRuntime.jsx(FooterContainer, {
1423
- children: children
1424
- });
1425
- };
1426
- ModalFooter[exports.MODAL_FOOTER_KEY] = true;
1427
- var ModalFooter_default = ModalFooter;
1428
- var ModalBody = function(param) {
1429
- var children = param.children, _param_isIncludeHeader = param.isIncludeHeader, isIncludeHeader = _param_isIncludeHeader === void 0 ? false : _param_isIncludeHeader, _param_isIncludeFooter = param.isIncludeFooter, isIncludeFooter = _param_isIncludeFooter === void 0 ? false : _param_isIncludeFooter, sizeVar = param.sizeVar, modalContainerHeight = param.height;
1430
- var _utils_useResizeObserver = utils.useResizeObserver(document.body, {
1431
- trackHeight: true
1432
- }), windowHeight = _utils_useResizeObserver.height;
1433
- var headerHeight = 64;
1434
- var footerHeight = 64;
1435
- var topBottomMargin = 64;
1436
- var getHeaderFooterHeight = React3.useCallback(function() {
1437
- var result = 0;
1438
- if (isIncludeHeader) {
1439
- result += headerHeight;
1440
- }
1441
- if (isIncludeFooter) {
1442
- result += footerHeight;
1443
- }
1444
- return result;
1445
- }, [
1446
- isIncludeFooter,
1447
- isIncludeHeader
1448
- ]);
1449
- var headerFooterHeight = React3.useMemo(function() {
1450
- return getHeaderFooterHeight();
1451
- }, [
1452
- getHeaderFooterHeight
1453
- ]);
1454
- var setAutoHeightMin = function() {
1455
- if (modalContainerHeight) {
1456
- return modalContainerHeight - headerFooterHeight;
1457
- } else {
1458
- return "100%";
1459
- }
1460
- };
1461
- var heightUnderMaxHeight = windowHeight - topBottomMargin - headerFooterHeight;
1462
- var heightOverMaxHeight = 1200 - topBottomMargin - headerFooterHeight;
1463
- return /* @__PURE__ */ jsxRuntime.jsx(BodyContainer, {
1464
- isIncludeHeader: isIncludeHeader,
1465
- height: setAutoHeightMin(),
1466
- children: /* @__PURE__ */ jsxRuntime.jsx(Scrollbars__default.default, {
1467
- id: "scrollbar",
1468
- autoHeight: !modalContainerHeight,
1469
- autoHeightMin: setAutoHeightMin(),
1470
- autoHeightMax: windowHeight > 1200 ? heightOverMaxHeight : heightUnderMaxHeight,
1471
- autoHide: true,
1472
- autoHideTimeout: 1e3,
1473
- autoHideDuration: 200,
1474
- style: {
1475
- height: "100%",
1476
- overflow: "hidden"
1477
- },
1478
- children: /* @__PURE__ */ jsxRuntime.jsx(ModalBodyContent, {
1479
- isIncludeHeader: isIncludeHeader,
1480
- sizeVar: sizeVar,
1481
- children: children
1482
- })
1483
- })
1484
- });
1485
- };
1486
- var ModalBody_default = ModalBody;
1487
- var ModalHeader = function(param) {
1488
- var children = param.children;
1489
- return /* @__PURE__ */ jsxRuntime.jsx(HeaderContainer, {
1490
- children: children
1491
- });
1492
- };
1493
- ModalHeader[exports.MODAL_HEADER_KEY] = true;
1494
- var ModalHeader_default = ModalHeader;
1495
- // src/components/Modal/index.ts
1496
- exports.Modal = {
1497
- Container: ModalContainer_default,
1498
- Header: ModalHeader_default,
1499
- Body: ModalBody_default,
1500
- Footer: ModalFooter_default
1501
- };
1502
- var SwitchContainer = styled5__default.default.div(_templateObject15(), function(param) {
1503
- var isDisabled = param.isDisabled;
1504
- return isDisabled && 0.3;
1505
- }, function(param) {
1506
- var isDisabled = param.isDisabled;
1507
- return !isDisabled && exports.colorTokens.neutral400_5;
1508
- });
1509
- var StyledSwitch = styled5__default.default.input(_templateObject16(), exports.colorTokens.neutral350, exports.colorTokens.neutral0, function(param) {
1510
- var activeColor = param.activeColor;
1511
- return exports.colorTokens[activeColor];
1512
- });
1513
- var useOnToggle = function(selected, defaultSelected) {
1514
- var _React3_useState = _sliced_to_array(React3.useState(false), 2), isToggle = _React3_useState[0], setIsToggle = _React3_useState[1];
1515
- var isControlled = selected !== void 0;
1516
- var handleToggle = function() {
1517
- !isControlled && setIsToggle(function(prev) {
1518
- return !prev;
1519
- });
1520
- };
1521
- React3.useEffect(function() {
1522
- if (isControlled) {
1523
- setIsToggle(selected);
1524
- }
1525
- }, [
1526
- isControlled,
1527
- selected
1528
- ]);
1529
- React3.useEffect(function() {
1530
- if (defaultSelected) {
1531
- setIsToggle(defaultSelected);
1532
- }
1533
- }, [
1534
- defaultSelected,
1535
- isControlled
1536
- ]);
1537
- return [
1538
- isToggle,
1539
- handleToggle
1540
- ];
1541
- };
1542
- var Switch = function(_param) {
1543
- var onChange = _param.onChange, isSelected = _param.isSelected, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, _param_activeColor = _param.activeColor, activeColor = _param_activeColor === void 0 ? "primary300" : _param_activeColor, _param_defaultSelected = _param.defaultSelected, defaultSelected = _param_defaultSelected === void 0 ? false : _param_defaultSelected, rest = _object_without_properties(_param, [
1544
- "onChange",
1545
- "isSelected",
1546
- "disabled",
1547
- "activeColor",
1548
- "defaultSelected"
1549
- ]);
1550
- var _useOnToggle = _sliced_to_array(useOnToggle(isSelected, defaultSelected), 2), isToggled = _useOnToggle[0], handleToggle = _useOnToggle[1];
1551
- var handleOnChange = function(e) {
1552
- handleToggle();
1553
- onChange && onChange(e);
1554
- };
1555
- return /* @__PURE__ */ jsxRuntime.jsx(SwitchContainer, {
1556
- isDisabled: disabled,
1557
- children: /* @__PURE__ */ jsxRuntime.jsx(StyledSwitch, _object_spread_props(_object_spread({
1558
- type: "checkbox",
1559
- checked: isToggled,
1560
- disabled: disabled,
1561
- onChange: handleOnChange,
1562
- activeColor: activeColor
1563
- }, rest), {
1564
- "data-shoplflow": "Switch"
1565
- }))
1566
- });
1567
- };
1568
- exports.Switch = Switch;
1569
- // src/components/Chips/ChipToggle/ChipToggle.types.ts
1570
- exports.ChipToggleStyleVariants = {
1571
- SOLID: "SOLID"
1572
- };
1573
- exports.ChipToggleSizeVariants = {
1574
- S: "S",
1575
- XS: "XS"
1576
- };
1577
- var getDisabledStyle = function(disabled) {
1578
- if (!disabled) {
1579
- return;
1580
- }
1581
- return react.css(_templateObject17());
1582
- };
1583
- // src/components/Chips/ChipToggle/ChipToggle.styled.ts
1584
- var getLineTypographyBySizeVar = function(sizeVar) {
1585
- switch(sizeVar){
1586
- case "XS":
1587
- return "body3_400";
1588
- case "S":
1589
- return "body2_400";
1590
- default:
1591
- return "body2_400";
1592
- }
1593
- };
1594
- var solidStyle = function(param) {
1595
- var isSelected = param.isSelected, color = param.color, radius = param.radius;
1596
- return react.css(_templateObject20(), exports.colorTokens.neutral150, exports.borderRadiusTokens.borderRadius06, exports.colorTokens.neutral400, exports.colorTokens.neutral200, radius && react.css(_templateObject18(), exports.borderRadiusTokens.borderRadius16), isSelected && react.css(_templateObject19(), exports.colorTokens[color], exports.colorTokens["neutral0"], exports.colorTokens[color]));
1597
- };
1598
- var StyledChip = styled5__default.default.button(_templateObject21(), function(props) {
1599
- return props.styleVar === "SOLID" && solidStyle(props);
1600
- }, function(param) {
1601
- var disabled = param.disabled;
1602
- return getDisabledStyle(disabled);
1603
- });
1604
- var ChipToggle = function(_param) {
1605
- var text = _param.text, isSelected = _param.isSelected, defaultSelected = _param.defaultSelected, _param_color = _param.color, color = _param_color === void 0 ? "neutral600" : _param_color, _param_styleVar = _param.styleVar, styleVar = _param_styleVar === void 0 ? exports.ChipToggleStyleVariants.SOLID : _param_styleVar, sizeVar = _param.sizeVar, leftSource = _param.leftSource, rightSource = _param.rightSource, _param_onClick = _param.onClick, onClick = _param_onClick === void 0 ? utils.noop : _param_onClick, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, rest = _object_without_properties(_param, [
1606
- "text",
1607
- "isSelected",
1608
- "defaultSelected",
1609
- "color",
1610
- "styleVar",
1611
- "sizeVar",
1612
- "leftSource",
1613
- "rightSource",
1614
- "onClick",
1615
- "disabled"
1616
- ]);
1617
- var _useOnToggle = _sliced_to_array(useOnToggle(isSelected, defaultSelected), 2), isToggled = _useOnToggle[0], handleToggle = _useOnToggle[1];
1618
- var handleClick = function(e) {
1619
- !disabled && handleToggle();
1620
- !disabled && onClick && onClick(e);
1621
- };
1622
- return /* @__PURE__ */ jsxRuntime.jsxs(StyledChip, _object_spread_props(_object_spread({}, rest), {
1623
- color: color,
1624
- isSelected: isToggled,
1625
- styleVar: styleVar,
1626
- sizeVar: sizeVar,
1627
- onClick: handleClick,
1628
- disabled: disabled,
1629
- "data-shoplflow": "ChipToggle",
1630
- children: [
1631
- leftSource,
1632
- /* @__PURE__ */ jsxRuntime.jsx(exports.Text, {
1633
- typography: getLineTypographyBySizeVar(sizeVar),
1634
- children: text
1635
- }),
1636
- rightSource
1637
- ]
1638
- }));
1639
- };
1640
- exports.ChipToggle = ChipToggle;
1641
- // src/utils/getNextColor.ts
1642
- var getNextColor = function(color) {
1643
- var step = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 1;
1644
- var colorName = color.replace(/[0-9]|_/g, "");
1645
- var colorNumber = color.replace(/[a-z]|_/g, "");
1646
- var nextColorNumber = Number(colorNumber) + 100 * step;
1647
- var nextColorToken = "".concat(colorName).concat(nextColorNumber);
1648
- var colorKeysOfColorName = Object.keys(exports.colorTokens).filter(function(colorToken) {
1649
- return colorToken.includes(colorName);
1650
- }).sort(function(a, b) {
1651
- return Number(a.replace(/[a-z]|_/g, "")) - Number(b.replace(/[a-z]|_/g, ""));
1652
- });
1653
- var colorTokenKeys = Object.keys(exports.colorTokens);
1654
- var findColorToken = colorTokenKeys.find(function(colorToken) {
1655
- return colorToken === nextColorToken;
1656
- });
1657
- var lastColorToken = colorKeysOfColorName[colorKeysOfColorName.length - 1];
1658
- return findColorToken ? findColorToken : lastColorToken;
1659
- };
1660
- // src/components/Chips/ChipButton/ChipButton.styled.ts
1661
- var getLineTypographyBySizeVar2 = function(sizeVar) {
1662
- switch(sizeVar){
1663
- case "XS":
1664
- return "caption_400";
1665
- case "S":
1666
- return "body3_400";
1667
- default:
1668
- return "body3_400";
1669
- }
1670
- };
1671
- var lineStyle = function(param) {
1672
- var color = param.color;
1673
- return react.css(_templateObject22(), exports.colorTokens.neutral0, exports.colorTokens[color], exports.borderRadiusTokens.borderRadius20, exports.colorTokens[getNextColor(color, 2)], exports.colorTokens[getNextColor(color, 4)]);
1674
- };
1675
- var getStyleBySizeVar = function(sizeVar) {
1676
- switch(sizeVar){
1677
- case "XS":
1678
- return react.css(_templateObject23());
1679
- case "S":
1680
- return react.css(_templateObject24());
1681
- default:
1682
- return react.css(_templateObject25());
1683
- }
1684
- };
1685
- var StyledChipButton = styled5__default.default.button(_templateObject26(), function(param) {
1686
- var background2 = param.background;
1687
- return background2 && exports.colorTokens[background2];
1688
- }, function(param) {
1689
- var sizeVar = param.sizeVar;
1690
- return getStyleBySizeVar(sizeVar);
1691
- }, function(props) {
1692
- return props.styleVar === "LINE" && lineStyle(props);
1693
- }, function(param) {
1694
- var disabled = param.disabled;
1695
- return getDisabledStyle(disabled);
1696
- });
1697
- // src/components/Chips/ChipButton/ChipButton.types.ts
1698
- exports.ChipButtonStyleVariants = {
1699
- LINE: "LINE"
1700
- };
1701
- exports.ChipButtonSizeVariants = {
1702
- S: "S",
1703
- XS: "XS"
1704
- };
1705
- var ChipButton = function(_param) {
1706
- var _param_styleVar = _param.styleVar, styleVar = _param_styleVar === void 0 ? exports.ChipButtonStyleVariants.LINE : _param_styleVar, _param_color = _param.color, color = _param_color === void 0 ? "neutral200" : _param_color, _param_sizeVar = _param.sizeVar, sizeVar = _param_sizeVar === void 0 ? exports.ChipButtonSizeVariants.S : _param_sizeVar, text = _param.text, _param_onClick = _param.onClick, onClick = _param_onClick === void 0 ? utils.noop : _param_onClick, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, rest = _object_without_properties(_param, [
1707
- "styleVar",
1708
- "color",
1709
- "sizeVar",
1710
- "text",
1711
- "onClick",
1712
- "disabled"
1713
- ]);
1714
- var handleOnClick = function(e) {
1715
- !disabled && onClick(e);
1716
- };
1717
- return /* @__PURE__ */ jsxRuntime.jsx(StyledChipButton, _object_spread_props(_object_spread({
1718
- styleVar: styleVar,
1719
- color: color
1720
- }, rest), {
1721
- onClick: handleOnClick,
1722
- disabled: disabled,
1723
- "data-shoplflow": "ChipButton",
1724
- children: /* @__PURE__ */ jsxRuntime.jsx(exports.Text, {
1725
- typography: getLineTypographyBySizeVar2(sizeVar),
1726
- children: text
1727
- })
1728
- }));
1729
- };
1730
- exports.ChipButton = ChipButton;
1731
- var getStyleByStyleVar = function(styleVar, disabled) {
1732
- switch(styleVar){
1733
- case "PRIMARY":
1734
- return react.css(_templateObject27(), exports.colorTokens.primary400, exports.colorTokens.primary300, !disabled && exports.colorTokens.primary400);
1735
- case "SECONDARY":
1736
- return react.css(_templateObject28(), exports.colorTokens.neutral350, exports.colorTokens.neutral0, !disabled && exports.colorTokens.neutral100);
1737
- case "SOLID":
1738
- return react.css(_templateObject29(), exports.colorTokens.coolgray100, exports.colorTokens.coolgray50, !disabled && exports.colorTokens.coolgray100);
1739
- case "GHOST":
1740
- return react.css(_templateObject30(), !disabled && exports.colorTokens.neutral400_5);
1741
- default:
1742
- return react.css(_templateObject31(), exports.colorTokens.primary400, exports.colorTokens.primary300);
1743
- }
1744
- };
1745
- var getStyleBySizeVar2 = function(sizeVar) {
1746
- switch(sizeVar){
1747
- case "M":
1748
- return react.css(_templateObject32());
1749
- case "S":
1750
- return react.css(_templateObject33());
1751
- default:
1752
- return react.css(_templateObject34());
1753
- }
1754
- };
1755
- var StyledButton = styled5__default.default.button(_templateObject35(), function(param) {
1756
- var styleVar = param.styleVar, disabled = param.disabled;
1757
- return getStyleByStyleVar(styleVar, disabled);
1758
- }, function(param) {
1759
- var sizeVar = param.sizeVar;
1760
- return getStyleBySizeVar2(sizeVar);
1761
- }, function(param) {
1762
- var disabled = param.disabled;
1763
- return getDisabledStyle(disabled);
1764
- });
1765
- var Button = React3.forwardRef(function(_param, ref) {
1766
- var _param_styleVar = _param.styleVar, styleVar = _param_styleVar === void 0 ? "PRIMARY" : _param_styleVar, _param_sizeVar = _param.sizeVar, sizeVar = _param_sizeVar === void 0 ? "M" : _param_sizeVar, style = _param.style, color = _param.color, as = _param.as, children = _param.children, leftSource = _param.leftSource, rightSource = _param.rightSource, rest = _object_without_properties(_param, [
1767
- "styleVar",
1768
- "sizeVar",
1769
- "style",
1770
- "color",
1771
- "as",
1772
- "children",
1773
- "leftSource",
1774
- "rightSource"
1775
- ]);
1776
- return /* @__PURE__ */ jsxRuntime.jsxs(StyledButton, _object_spread_props(_object_spread({
1777
- styleVar: styleVar,
1778
- sizeVar: sizeVar,
1779
- className: styleVar,
1780
- style: style,
1781
- as: as,
1782
- ref: ref,
1783
- color: color
1784
- }, rest), {
1785
- "data-shoplflow": "Button",
1786
- children: [
1787
- leftSource,
1788
- /* @__PURE__ */ jsxRuntime.jsx(exports.Text, {
1789
- wordBreak: "keep-all",
1790
- whiteSpace: "nowrap",
1791
- color: styleVar === "PRIMARY" ? "neutral0" : "neutral700",
1792
- typography: sizeVar === "M" ? "body1_400" : "body2_400",
1793
- children: children
1794
- }),
1795
- rightSource
1796
- ]
1797
- }));
1798
- });
1799
- exports.Button = Button;
1800
- // src/components/Buttons/Button/Button.types.ts
1801
- exports.buttonSizeVar = {
1802
- S: "S",
1803
- M: "M"
1804
- };
1805
- exports.buttonStyleVar = {
1806
- PRIMARY: "PRIMARY",
1807
- SECONDARY: "SECONDARY",
1808
- SOLID: "SOLID",
1809
- GHOST: "GHOST"
1810
- };
1811
- var getWidthAndHeightFromSizeVar = function(sizeVar) {
1812
- switch(sizeVar){
1813
- case "M":
1814
- return react.css(_templateObject36());
1815
- case "S":
1816
- return react.css(_templateObject37());
1817
- default:
1818
- return react.css(_templateObject38());
1819
- }
1820
- };
1821
- var getStyleByStyleVar2 = function(styleVar) {
1822
- switch(styleVar){
1823
- case "SOLID":
1824
- return react.css(_templateObject39(), exports.colorTokens.neutral200, exports.colorTokens.neutral100);
1825
- case "GHOST":
1826
- return react.css(_templateObject40(), exports.colorTokens.neutral400_5);
1827
- default:
1828
- return react.css(_templateObject41(), exports.colorTokens.neutral200, exports.colorTokens.neutral100);
1829
- }
1830
- };
1831
- var StyledIconButton = styled5__default.default.button(_templateObject42(), exports.borderRadiusTokens.borderRadius06, exports.colorTokens.neutral0, function(param) {
1832
- var styleVar = param.styleVar;
1833
- return getStyleByStyleVar2(styleVar);
1834
- }, function(param) {
1835
- var sizeVar = param.sizeVar;
1836
- return getWidthAndHeightFromSizeVar(sizeVar);
1837
- }, function(param) {
1838
- var disabled = param.disabled;
1839
- return getDisabledStyle(disabled);
1840
- });
1841
- var IconButton = React3.forwardRef(function(_param, ref) {
1842
- var styleVar = _param.styleVar, sizeVar = _param.sizeVar, disabled = _param.disabled, as = _param.as, children = _param.children, rest = _object_without_properties(_param, [
1843
- "styleVar",
1844
- "sizeVar",
1845
- "disabled",
1846
- "as",
1847
- "children"
1848
- ]);
1849
- return /* @__PURE__ */ jsxRuntime.jsx(StyledIconButton, _object_spread_props(_object_spread({
1850
- styleVar: styleVar,
1851
- sizeVar: sizeVar,
1852
- disabled: disabled,
1853
- as: as,
1854
- ref: ref
1855
- }, rest), {
1856
- "data-shoplflow": "IconButton",
1857
- children: children
1858
- }));
1859
- });
1860
- exports.IconButton = IconButton;
1861
- // src/components/Buttons/IconButton/IconButton.types.ts
1862
- exports.iconButtonSizeVar = {
1863
- S: "S",
1864
- M: "M"
1865
- };
1866
- exports.iconButtonStyleVar = {
1867
- SOLID: "SOLID",
1868
- GHOST: "GHOST"
1869
- };
1870
- var informationStyle = react.css(_templateObject43(), exports.colorTokens.neutral100, exports.colorTokens.neutral600, exports.colorTokens.neutral600);
1871
- var alertStyle = react.css(_templateObject44(), exports.colorTokens.red100, exports.colorTokens.red300, exports.colorTokens.red300);
1872
- var StyledCallout = styled5__default.default.div(_templateObject45(), exports.borderRadiusTokens.borderRadius08, function(param) {
1873
- var styleVar = param.styleVar;
1874
- return styleVar === "INFORMATION" && informationStyle;
1875
- }, function(param) {
1876
- var styleVar = param.styleVar;
1877
- return styleVar === "ALERT" && alertStyle;
1878
- });
1879
- var StyledCalloutIcon = styled5__default.default.svg(_templateObject46());
1880
- styled5__default.default.div(_templateObject47());
1881
- var Callout = function(_param) {
1882
- var children = _param.children, _param_styleVar = _param.styleVar, styleVar = _param_styleVar === void 0 ? "INFORMATION" : _param_styleVar, rest = _object_without_properties(_param, [
1883
- "children",
1884
- "styleVar"
1885
- ]);
1886
- return /* @__PURE__ */ jsxRuntime.jsx(StyledCallout, _object_spread_props(_object_spread({}, rest), {
1887
- styleVar: styleVar,
1888
- "data-shoplflow": "Callout",
1889
- children: children
1890
- }));
1891
- };
1892
- var CalloutText = function(_param) {
1893
- var children = _param.children, rest = _object_without_properties(_param, [
1894
- "children"
1895
- ]);
1896
- return /* @__PURE__ */ jsxRuntime.jsx(exports.Text, _object_spread_props(_object_spread({}, rest), {
1897
- typography: "body3_400",
1898
- children: children
1899
- }));
1900
- };
1901
- var CalloutIcon = function(param) {
1902
- var iconSource = param.iconSource;
1903
- return /* @__PURE__ */ jsxRuntime.jsx(StyledCalloutIcon, {
1904
- as: iconSource
1905
- });
1906
- };
1907
- Callout.Text = CalloutText;
1908
- Callout.Icon = CalloutIcon;
1909
- exports.Callout = Callout;
1910
- // src/components/Callout/Callout.types.ts
1911
- exports.CalloutTypes = {
1912
- INFORMATION: "INFORMATION",
1913
- ALERT: "ALERT"
1914
- };
1915
- // src/components/Icon/Icon.types.ts
1916
- exports.IconSizeVariants = {
1917
- X_SMALL: "X_SMALL",
1918
- SMALL: "SMALL",
1919
- MEDIUM: "MEDIUM",
1920
- LARGE: "LARGE",
1921
- X_LARGE: "X_LARGE"
1922
- };
1923
- // src/components/Icon/Icon.styled.ts
1924
- var getIconSize = function(size) {
1925
- switch(size){
1926
- case exports.IconSizeVariants.X_SMALL:
1927
- return "12px";
1928
- case exports.IconSizeVariants.SMALL:
1929
- return "20px";
1930
- case exports.IconSizeVariants.MEDIUM:
1931
- return "24px";
1932
- case exports.IconSizeVariants.LARGE:
1933
- return "30px";
1934
- case exports.IconSizeVariants.X_LARGE:
1935
- return "36px";
1936
- default:
1937
- return "24px";
1938
- }
1939
- };
1940
- exports.StyledIcon = styled5__default.default.svg(_templateObject48(), function(param) {
1941
- var sizeVar = param.sizeVar;
1942
- return sizeVar && getIconSize(sizeVar);
1943
- }, function(param) {
1944
- var sizeVar = param.sizeVar;
1945
- return sizeVar && getIconSize(sizeVar);
1946
- }, function(param) {
1947
- var sizeVar = param.sizeVar;
1948
- return sizeVar && getIconSize(sizeVar);
1949
- }, function(param) {
1950
- var sizeVar = param.sizeVar;
1951
- return sizeVar && getIconSize(sizeVar);
1952
- }, function(param) {
1953
- var color = param.color;
1954
- return color && exports.colorTokens[color];
1955
- });
1956
- var Icon = React3.forwardRef(function(_param, ref) {
1957
- var iconSource = _param.iconSource, rest = _object_without_properties(_param, [
1958
- "iconSource"
1959
- ]);
1960
- return /* @__PURE__ */ jsxRuntime.jsx(exports.StyledIcon, _object_spread_props(_object_spread({
1961
- as: iconSource,
1962
- ref: ref
1963
- }, rest), {
1964
- "data-shoplflow": "Icon"
1965
- }));
1966
- });
1967
- exports.Icon = Icon;
1968
- var StyledInput = styled5__default.default.input(_templateObject49(), exports.colorTokens.neutral350);
1969
- var RightElementWrapper = styled5__default.default.div(_templateObject50());
1970
- var Wrapper = styled5__default.default.div(_templateObject51());
1971
- var TextCounter = function(param) {
1972
- var currentLength = param.currentLength, maxLength = param.maxLength;
1973
- return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper, {
1974
- children: [
1975
- /* @__PURE__ */ jsxRuntime.jsx(exports.Text, {
1976
- typography: "caption_400",
1977
- color: "neutral400",
1978
- children: currentLength
1979
- }),
1980
- /* @__PURE__ */ jsxRuntime.jsx(exports.Text, {
1981
- typography: "caption_400",
1982
- color: "neutral350",
1983
- children: "/"
1984
- }),
1985
- /* @__PURE__ */ jsxRuntime.jsx(exports.Text, {
1986
- typography: "caption_400",
1987
- color: "neutral350",
1988
- children: maxLength
1989
- })
1990
- ]
1991
- });
1992
- };
1993
- var TextCounter_default = TextCounter;
1994
- React3.createContext({
1995
- domain: "SHOPL",
1996
- handleToggleTheme: function() {}
1997
- });
1998
- // src/styles/IconAssets.tsx
1999
- var assetFunction = function(iconName, domainProps) {
2000
- var domain = domainProps !== null && domainProps !== void 0 ? domainProps : exports.getDomain();
2001
- var HadaIcon = HadaAssets__namespace[iconName];
2002
- var ShoplIcon = ShoplAssets__namespace[iconName];
2003
- return domain === "hada" ? HadaIcon : ShoplIcon;
2004
- };
2005
- function assignRef(ref, value) {
2006
- if (ref == null) {
2007
- return;
2008
- }
2009
- if (typeof ref === "function") {
2010
- ref(value);
2011
- return;
2012
- }
2013
- try {
2014
- ref.current = value;
2015
- } catch (error) {
2016
- throw new Error("Cannot assign value '".concat(value, "' to ref '").concat(ref, "'"));
2017
- }
2018
- }
2019
- function mergeRefs() {
2020
- for(var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++){
2021
- refs[_key] = arguments[_key];
2022
- }
2023
- return function(node) {
2024
- refs.forEach(function(ref) {
2025
- assignRef(ref, node);
2026
- });
2027
- };
2028
- }
2029
- function useMergeRefs() {
2030
- for(var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++){
2031
- refs[_key] = arguments[_key];
2032
- }
2033
- return React3.useMemo(function() {
2034
- return mergeRefs.apply(void 0, _to_consumable_array(refs));
2035
- }, refs);
2036
- }
2037
- var getBorderColorByStatus = function(param) {
2038
- var isFocused = param.isFocused, isError = param.isError, isHovered = param.isHovered, disabled = param.disabled;
2039
- if (!disabled) {
2040
- if (isError) {
2041
- return exports.colorTokens.red300;
2042
- }
2043
- if (isFocused) {
2044
- return exports.colorTokens.primary300;
2045
- }
2046
- if (isHovered) {
2047
- return exports.colorTokens.neutral700;
2048
- }
2049
- }
2050
- return exports.colorTokens.neutral300;
2051
- };
2052
- var InputWrapper = styled5__default.default.label(_templateObject52(), function(param) {
2053
- var direction = param.direction;
2054
- return direction || "row";
2055
- }, function(props) {
2056
- return getBorderColorByStatus(props);
2057
- }, exports.colorTokens.neutral0, function(param) {
2058
- var disabled = param.disabled;
2059
- return getDisabledStyle(disabled);
2060
- });
2061
- React3.forwardRef(function(_param, ref) {
2062
- var onFocus = _param.onFocus, onBlur = _param.onBlur, onChange = _param.onChange, onClear = _param.onClear, defaultValue = _param.defaultValue, value = _param.value, isError = _param.isError, disabled = _param.disabled, initialType = _param.type, maxLength = _param.maxLength, className = _param.className, rest = _object_without_properties(_param, [
2063
- "onFocus",
2064
- "onBlur",
2065
- "onChange",
2066
- "onClear",
2067
- "defaultValue",
2068
- "value",
2069
- "isError",
2070
- "disabled",
2071
- "type",
2072
- "maxLength",
2073
- "className"
2074
- ]);
2075
- var _React3_useState = _sliced_to_array(React3.useState(""), 2), text = _React3_useState[0], setText = _React3_useState[1];
2076
- var _React3_useState1 = _sliced_to_array(React3.useState(false), 2), isFocused = _React3_useState1[0], setIsFocused = _React3_useState1[1];
2077
- var _React3_useState2 = _sliced_to_array(React3.useState("text"), 2), type = _React3_useState2[0], setType = _React3_useState2[1];
2078
- var _React3_useState3 = _sliced_to_array(React3.useState(false), 2), isHovered = _React3_useState3[0], setIsHovered = _React3_useState3[1];
2079
- var uniqueId = React3.useId();
2080
- var inputRef = React3__default.default.useRef(null);
2081
- var refs = useMergeRefs(ref, inputRef);
2082
- var convertToString = React3.useCallback(function(value2) {
2083
- if (typeof value2 !== "number") {
2084
- return typeof value2 === "string" ? value2 : value2.join("");
2085
- }
2086
- return String(value2);
2087
- }, []);
2088
- var sliceText = React3.useCallback(function(value2) {
2089
- if (maxLength && value2.length > maxLength) {
2090
- return value2.slice(0, maxLength);
2091
- }
2092
- return value2;
2093
- }, [
2094
- maxLength
2095
- ]);
2096
- var handleOnMouseEnter = function() {
2097
- setIsHovered(true);
2098
- };
2099
- var handleOnMouseLeave = function() {
2100
- setIsHovered(false);
2101
- };
2102
- var handleOnFocus = function(event) {
2103
- onFocus && onFocus(event);
2104
- setIsFocused(true);
2105
- };
2106
- var handleOnBlur = function(event) {
2107
- onBlur && onBlur(event);
2108
- !isHovered && setIsFocused(false);
2109
- };
2110
- var handleOnChange = function(event) {
2111
- onChange && onChange(event);
2112
- var slicedText = sliceText(event.target.value);
2113
- setText(slicedText);
2114
- };
2115
- var handleOnClear = function() {
2116
- onClear && onClear();
2117
- if (inputRef.current) {
2118
- setText("");
2119
- inputRef.current.value = "";
2120
- }
2121
- };
2122
- var handleTogglePasswordType = function() {
2123
- if (type === "password") {
2124
- setType("text");
2125
- } else {
2126
- setType("password");
2127
- }
2128
- };
2129
- React3.useEffect(function() {
2130
- if (defaultValue) {
2131
- var convertString = convertToString(defaultValue);
2132
- var slicedText = sliceText(convertString);
2133
- setText(slicedText);
2134
- }
2135
- }, [
2136
- convertToString,
2137
- defaultValue,
2138
- maxLength,
2139
- sliceText
2140
- ]);
2141
- React3.useEffect(function() {
2142
- if (value) {
2143
- var convertString = convertToString(value);
2144
- var slicedText = sliceText(convertString);
2145
- setText(slicedText);
2146
- }
2147
- }, [
2148
- convertToString,
2149
- maxLength,
2150
- sliceText,
2151
- value
2152
- ]);
2153
- React3.useEffect(function() {
2154
- setType(initialType);
2155
- }, [
2156
- initialType
2157
- ]);
2158
- return /* @__PURE__ */ jsxRuntime.jsxs(InputWrapper, {
2159
- htmlFor: uniqueId,
2160
- isFocused: isFocused,
2161
- disabled: disabled,
2162
- isError: isError,
2163
- isHovered: isHovered,
2164
- onMouseEnter: handleOnMouseEnter,
2165
- onMouseLeave: handleOnMouseLeave,
2166
- "data-shoplflow": "input",
2167
- children: [
2168
- /* @__PURE__ */ jsxRuntime.jsx(StyledInput, _object_spread({
2169
- className: "".concat(exports.typographyTokens.body1_400, " ").concat(className),
2170
- onFocus: handleOnFocus,
2171
- onBlur: handleOnBlur,
2172
- onChange: handleOnChange,
2173
- maxLength: maxLength,
2174
- disabled: disabled,
2175
- value: text,
2176
- type: type,
2177
- id: uniqueId,
2178
- ref: refs
2179
- }, rest)),
2180
- /* @__PURE__ */ jsxRuntime.jsxs(RightElementWrapper, {
2181
- children: [
2182
- maxLength && isFocused && /* @__PURE__ */ jsxRuntime.jsx(TextCounter_default, {
2183
- currentLength: String(text).length,
2184
- maxLength: maxLength
2185
- }),
2186
- isFocused && Boolean(String(text).length > 0) && /* @__PURE__ */ jsxRuntime.jsx(exports.IconButton, {
2187
- sizeVar: "S",
2188
- onClick: handleOnClear,
2189
- styleVar: "GHOST",
2190
- children: /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, {
2191
- iconSource: assetFunction("DeleteIcon"),
2192
- color: "neutral600"
2193
- })
2194
- }),
2195
- initialType === "password" && /* @__PURE__ */ jsxRuntime.jsx(exports.IconButton, {
2196
- sizeVar: "S",
2197
- onClick: handleTogglePasswordType,
2198
- styleVar: "GHOST",
2199
- children: /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, {
2200
- color: "neutral600",
2201
- iconSource: assetFunction(type === "password" ? "ViewOffIcon" : "ViewOnIcon")
2202
- })
2203
- })
2204
- ]
2205
- })
2206
- ]
2207
- });
2208
- });
2209
- var BottomElementWrapper = styled5__default.default.div(_templateObject53(), exports.colorTokens.neutral0);
2210
- var StyledTextarea = styled5__default.default.textarea(_templateObject54(), function(param) {
2211
- var minHeight = param.minHeight;
2212
- return minHeight ? "".concat(minHeight, "px") : "300px";
2213
- }, function(param) {
2214
- var disabled = param.disabled;
2215
- return getDisabledStyle(disabled);
2216
- }, exports.colorTokens.neutral350);
2217
- var TextArea = React3.forwardRef(function(_param, ref) {
2218
- var name = _param.name, maxLength = _param.maxLength, placeholder = _param.placeholder, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, _param_isError = _param.isError, isError = _param_isError === void 0 ? false : _param_isError, onChange = _param.onChange, value = _param.value, defaultValue = _param.defaultValue, onBlur = _param.onBlur, onFocus = _param.onFocus, _param_minHeight = _param.minHeight, minHeight = _param_minHeight === void 0 ? 100 : _param_minHeight, rest = _object_without_properties(_param, [
2219
- "name",
2220
- "maxLength",
2221
- "placeholder",
2222
- "disabled",
2223
- "isError",
2224
- "onChange",
2225
- "value",
2226
- "defaultValue",
2227
- "onBlur",
2228
- "onFocus",
2229
- "minHeight"
2230
- ]);
2231
- var _React3_useState = _sliced_to_array(React3.useState(""), 2), text = _React3_useState[0], setText = _React3_useState[1];
2232
- var _React3_useState1 = _sliced_to_array(React3.useState(false), 2), isFocused = _React3_useState1[0], setIsFocused = _React3_useState1[1];
2233
- var _React3_useState2 = _sliced_to_array(React3.useState(false), 2), isHovered = _React3_useState2[0], setIsHovered = _React3_useState2[1];
2234
- var handleOnMouseEnter = function() {
2235
- setIsHovered(true);
2236
- };
2237
- var handleOnMouseLeave = function() {
2238
- setIsHovered(false);
2239
- };
2240
- var handleOnFocus = function(event) {
2241
- onFocus && onFocus(event);
2242
- setIsFocused(true);
2243
- };
2244
- var handleOnBlur = function(event) {
2245
- onBlur && onBlur(event);
2246
- !isHovered && setIsFocused(false);
2247
- };
2248
- var handleOnChange = function(event) {
2249
- onChange && onChange(event);
2250
- setText(event.target.value);
2251
- };
2252
- var convertToString = function(value2) {
2253
- if (typeof value2 !== "number") {
2254
- return typeof value2 === "string" ? value2 : value2.join("");
2255
- }
2256
- return String(value2);
2257
- };
2258
- React3.useEffect(function() {
2259
- if (defaultValue) {
2260
- var convertString = convertToString(defaultValue);
2261
- if (maxLength && convertString.length > maxLength) {
2262
- setText(convertString);
2263
- }
2264
- setText(convertString);
2265
- }
2266
- }, [
2267
- defaultValue,
2268
- maxLength
2269
- ]);
2270
- React3.useEffect(function() {
2271
- if (value) {
2272
- var convertString = convertToString(value);
2273
- if (maxLength && convertString.length > maxLength) {
2274
- setText(convertString);
2275
- }
2276
- setText(convertToString(value));
2277
- }
2278
- }, [
2279
- maxLength,
2280
- value
2281
- ]);
2282
- var uniqueId = React3.useId();
2283
- return /* @__PURE__ */ jsxRuntime.jsxs(InputWrapper, {
2284
- htmlFor: uniqueId,
2285
- isFocused: isFocused,
2286
- disabled: disabled,
2287
- isHovered: isHovered,
2288
- isError: isError,
2289
- direction: "column",
2290
- onMouseEnter: handleOnMouseEnter,
2291
- onMouseLeave: handleOnMouseLeave,
2292
- "data-shoplflow": "text-area",
2293
- children: [
2294
- /* @__PURE__ */ jsxRuntime.jsx(StyledTextarea, _object_spread({
2295
- className: "body1_400",
2296
- placeholder: placeholder,
2297
- onFocus: handleOnFocus,
2298
- onBlur: handleOnBlur,
2299
- onChange: handleOnChange,
2300
- name: name,
2301
- id: uniqueId,
2302
- value: value,
2303
- ref: ref,
2304
- maxLength: maxLength,
2305
- disabled: disabled,
2306
- minHeight: minHeight
2307
- }, rest)),
2308
- /* @__PURE__ */ jsxRuntime.jsx(BottomElementWrapper, {
2309
- children: maxLength && /* @__PURE__ */ jsxRuntime.jsx(TextCounter_default, {
2310
- currentLength: String(text).length,
2311
- maxLength: maxLength
2312
- })
2313
- })
2314
- ]
2315
- });
2316
- });
2317
- exports.TextArea = TextArea;
2318
- var Container2 = styled5__default.default.div(_templateObject55());
2319
- var IconButton2 = styled5__default.default.button(_templateObject56(), exports.borderRadiusTokens.borderRadius04, function(param) {
2320
- var color = param.color;
2321
- return exports.colorTokens[color];
2322
- }, function(param) {
2323
- var color = param.color;
2324
- return exports.colorTokens[getNextColor(color, 1)];
2325
- });
2326
- var MinusButton = React3.forwardRef(function(_param, ref) {
2327
- var onClick = _param.onClick, _param_color = _param.color, color = _param_color === void 0 ? "neutral300" : _param_color, rest = _object_without_properties(_param, [
2328
- "onClick",
2329
- "color"
2330
- ]);
2331
- return /* @__PURE__ */ jsxRuntime.jsx(Container2, {
2332
- "data-shoplflow": "minusButton",
2333
- children: /* @__PURE__ */ jsxRuntime.jsx(IconButton2, _object_spread_props(_object_spread({
2334
- color: color,
2335
- onClick: onClick,
2336
- ref: ref
2337
- }, rest), {
2338
- children: /* @__PURE__ */ jsxRuntime.jsxs("svg", {
2339
- width: "16",
2340
- height: "16",
2341
- viewBox: "0 0 16 16",
2342
- fill: "none",
2343
- xmlns: "http://www.w3.org/2000/svg",
2344
- children: [
2345
- /* @__PURE__ */ jsxRuntime.jsx("path", {
2346
- d: "M0 4C0 1.79086 1.79086 0 4 0H12C14.2091 0 16 1.79086 16 4V12C16 14.2091 14.2091 16 12 16H4C1.79086 16 0 14.2091 0 12V4Z",
2347
- fill: "none"
2348
- }),
2349
- /* @__PURE__ */ jsxRuntime.jsx("path", {
2350
- fillRule: "evenodd",
2351
- clipRule: "evenodd",
2352
- d: "M3 8C3 7.44772 3.44772 7 4 7H12C12.5523 7 13 7.44772 13 8C13 8.55228 12.5523 9 12 9H4C3.44772 9 3 8.55228 3 8Z",
2353
- fill: "white"
2354
- })
2355
- ]
2356
- })
2357
- }))
2358
- });
2359
- });
2360
- exports.MinusButton = MinusButton; //# sourceMappingURL=out.js.map
2361
- //# sourceMappingURL=index.cjs.map