@xaypay/tui 0.1.6 → 0.1.8

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/tui.config.js CHANGED
@@ -1,11 +1,11 @@
1
1
  import React from 'react'
2
2
 
3
- const boxSizing = 'border-box';
4
- const fontStyle = 'normal';
5
- const fontFamily = 'Arial';
6
- const fontWeight = 500;
3
+ const boxSizing = 'border-box'
4
+ const fontStyle = 'normal'
5
+ const fontFamily = 'Arial'
6
+ const fontWeight = 500
7
7
 
8
- const transparent = 'transparent';
8
+ const transparent = 'transparent'
9
9
 
10
10
  const presetColors = {
11
11
  info: '#F24C4C',
@@ -17,7 +17,7 @@ const presetColors = {
17
17
  warning: '#FECD29',
18
18
  secondary: '#D1D1D1',
19
19
  primary: '#051942',
20
- primarySecond: '#00236A'
20
+ primarySecond: '#00236A',
21
21
  }
22
22
 
23
23
  const fontObject = {
@@ -42,7 +42,7 @@ export default {
42
42
  disabled: false,
43
43
  className: '',
44
44
  transition: 'background-color 240ms, color 240ms',
45
-
45
+
46
46
  box: {
47
47
  sizing: boxSizing,
48
48
  },
@@ -55,18 +55,29 @@ export default {
55
55
  disabledBackground: 'rgba(238, 238, 238, 1)',
56
56
  },
57
57
 
58
- font: {...fontObject},
58
+ font: { ...fontObject },
59
59
 
60
60
  text: {
61
61
  transform: 'none',
62
62
  colors: {
63
63
  hover: '#001745',
64
- }
64
+ },
65
+ },
66
+
67
+ title: {
68
+ width: '',
69
+ color: '',
70
+ radius: '',
71
+ padding: '5px',
72
+ colors: {
73
+ backgroud: '#ccc',
74
+ },
75
+ font: { ...fontObject },
65
76
  },
66
77
 
67
78
  icon: {
68
- marginRight: '10px'
69
- }
79
+ marginRight: '10px',
80
+ },
70
81
  },
71
82
  // default properties for <Input /> component
72
83
  INPUT: {
@@ -93,18 +104,18 @@ export default {
93
104
  background: 'white',
94
105
  backgroundDisable: presetColors.secondary,
95
106
  },
96
-
97
- font: {...fontObject},
98
-
107
+
108
+ font: { ...fontObject },
109
+
99
110
  label: {
100
111
  color: presetColors.dark,
101
112
  display: 'block',
102
113
  lineHeight: '22px',
103
114
  marginBottom: '6px',
104
115
 
105
- font: {...fontObject}
116
+ font: { ...fontObject },
106
117
  },
107
-
118
+
108
119
  error: {
109
120
  left: '0px',
110
121
  color: presetColors.danger,
@@ -113,7 +124,7 @@ export default {
113
124
  marginTop: '10px',
114
125
  lineHeight: '19px',
115
126
 
116
- font: {...fontObject}
127
+ font: { ...fontObject },
117
128
  },
118
129
 
119
130
  tel: {
@@ -126,10 +137,10 @@ export default {
126
137
  color: presetColors.secondary,
127
138
 
128
139
  colors: {
129
- hover: presetColors.dark
130
- }
131
- }
132
- }
140
+ hover: presetColors.dark,
141
+ },
142
+ },
143
+ },
133
144
  },
134
145
  // default properties for <Tooltip /> component
135
146
  TOOLTIP: {
@@ -139,7 +150,7 @@ export default {
139
150
  radius: '3px',
140
151
  className: '',
141
152
  // icon: React.createElement(SvgChecked, { fill: 'red' }),
142
-
153
+
143
154
  parent: {
144
155
  width: '46px',
145
156
  height: '46px',
@@ -147,15 +158,14 @@ export default {
147
158
 
148
159
  colors: {
149
160
  background: transparent,
150
- }
151
-
161
+ },
152
162
  },
153
-
163
+
154
164
  colors: {
155
165
  background: '#03a9f4',
156
166
  },
157
-
158
- font: {...fontObject}
167
+
168
+ font: { ...fontObject },
159
169
  },
160
170
  // default properties for <Typography /> component
161
171
  TYPOGRAPHY: {
@@ -267,7 +277,7 @@ export default {
267
277
  lineHeighth5: 'normal',
268
278
  lineHeighth6: 'normal',
269
279
  lineHeightspan: 'normal',
270
- }
280
+ },
271
281
  },
272
282
  // default properties for <Select /> component
273
283
  SELECT: {
@@ -281,7 +291,7 @@ export default {
281
291
  shadow: `0 0 0 2px ${presetColors.secondary}`, // like border
282
292
  shadowHover: `0 0 0 2px ${presetColors.dark}`, // like border
283
293
  },
284
-
294
+
285
295
  label: {
286
296
  color: presetColors.dark,
287
297
  display: 'block',
@@ -289,7 +299,7 @@ export default {
289
299
  marginBottom: '6px',
290
300
  textTransform: 'none',
291
301
 
292
- font: {...fontObject}
302
+ font: { ...fontObject },
293
303
  },
294
304
 
295
305
  selected: {
@@ -300,8 +310,7 @@ export default {
300
310
  minHeight: '46px',
301
311
  lineHeight: '22px',
302
312
  transition: 'border-color 240ms',
303
-
304
-
313
+
305
314
  box: {
306
315
  sizing: boxSizing,
307
316
  },
@@ -312,7 +321,7 @@ export default {
312
321
  backgroundDisable: presetColors.secondary,
313
322
  },
314
323
 
315
- font: {...fontObject}
324
+ font: { ...fontObject },
316
325
  },
317
326
 
318
327
  options: {
@@ -333,18 +342,18 @@ export default {
333
342
  minHeight: '46px',
334
343
  lineHeight: '25px',
335
344
  marginBottom: '2px',
336
-
345
+
337
346
  box: {
338
347
  sizing: boxSizing,
339
348
  },
340
-
349
+
341
350
  colors: {
342
351
  hover: presetColors.primarySecond,
343
352
  backgroud: '#ffffff',
344
353
  backgroudHover: 'unset',
345
354
  },
346
355
 
347
- font: {...fontObject}
356
+ font: { ...fontObject },
348
357
  },
349
358
  },
350
359
 
@@ -354,11 +363,11 @@ export default {
354
363
  zIndex: 10,
355
364
 
356
365
  box: {
357
- shadow: `0 0 0 2px ${presetColors.danger}`
366
+ shadow: `0 0 0 2px ${presetColors.danger}`,
358
367
  },
359
368
 
360
- font: {...fontObject}
361
- }
369
+ font: { ...fontObject },
370
+ },
362
371
  },
363
372
  // default properties for <Textarea /> component
364
373
  TEXTAREA: {
@@ -394,21 +403,21 @@ export default {
394
403
  display: 'block',
395
404
  marginBottom: '10px',
396
405
 
397
- font: {...fontObject}
406
+ font: { ...fontObject },
398
407
  },
399
408
 
400
- font: {...fontObject},
409
+ font: { ...fontObject },
401
410
 
402
411
  error: {
403
412
  color: '#E40E00',
404
413
  marginTop: '10px',
405
414
 
406
415
  box: {
407
- shadow: `0 0 0 2px ${presetColors.danger}` // like border
416
+ shadow: `0 0 0 2px ${presetColors.danger}`, // like border
408
417
  },
409
418
 
410
- font: {...fontObject}
411
- }
419
+ font: { ...fontObject },
420
+ },
412
421
  },
413
422
  // default properties for <NewAutocomplete /> component
414
423
  AUTOCOMPLETE: {
@@ -431,7 +440,7 @@ export default {
431
440
  shadowHover: `0 0 0 2px ${presetColors.dark}`, // like border
432
441
  shadowActive: `0 0 0 2px ${presetColors.primarySecond}`, // like border
433
442
  },
434
- font: {...fontObject},
443
+ font: { ...fontObject },
435
444
 
436
445
  parent: {
437
446
  display: 'flex',
@@ -450,7 +459,7 @@ export default {
450
459
  marginBottom: '6px',
451
460
  textTransform: 'none',
452
461
 
453
- font: {...fontObject}
462
+ font: { ...fontObject },
454
463
  },
455
464
 
456
465
  contentBottom: {
@@ -488,28 +497,28 @@ export default {
488
497
  backgroundHover: 'initial',
489
498
  },
490
499
 
491
- font: {...fontObject}
500
+ font: { ...fontObject },
492
501
  },
493
-
502
+
494
503
  colors: {
495
504
  background: presetColors.extraLight,
496
505
  },
497
-
506
+
498
507
  box: {
499
508
  shadow: '0 0 10px rgba(60, 57, 62, 0.08)',
500
509
  sizing: boxSizing,
501
- }
510
+ },
502
511
  },
503
512
 
504
513
  error: {
505
514
  color: presetColors.danger,
506
515
  marginTop: '10px',
507
516
 
508
- font: {...fontObject},
517
+ font: { ...fontObject },
509
518
 
510
519
  box: {
511
- shadow: `0 0 0 2px ${presetColors.danger}` // like border
512
- }
520
+ shadow: `0 0 0 2px ${presetColors.danger}`, // like border
521
+ },
513
522
  },
514
523
 
515
524
  innerError: {
@@ -517,18 +526,18 @@ export default {
517
526
 
518
527
  colors: {
519
528
  background: 'gray',
520
- }
521
- }
529
+ },
530
+ },
522
531
  },
523
532
  // default properties for <Captcha /> component
524
533
  CAPTCHA: {
525
534
  className: '',
526
-
535
+
527
536
  label: {
528
537
  color: presetColors.dark,
529
538
 
530
- font: {...fontObject}
531
- }
539
+ font: { ...fontObject },
540
+ },
532
541
  },
533
542
  // default properties for <File /> component
534
543
  FILE: {
@@ -538,7 +547,7 @@ export default {
538
547
  maxWidth: '440px',
539
548
  className: '',
540
549
 
541
- areaImage: {
550
+ areaImage: {
542
551
  width: '27.8rem',
543
552
  height: 'auto',
544
553
  },
@@ -547,7 +556,7 @@ export default {
547
556
  upload: 'Բեռնել',
548
557
  uploadColor: presetColors.success,
549
558
  putFileHere: 'Տեղադրել ֆայլը այստեղ',
550
-
559
+
551
560
  sizeText: 'Առավելագույնը',
552
561
  timeForRemoveError: 4000,
553
562
  extentionsRowMarginTop: '40px',
@@ -559,7 +568,7 @@ export default {
559
568
 
560
569
  colors: {
561
570
  hover: presetColors.primarySecond,
562
- }
571
+ },
563
572
  },
564
573
 
565
574
  colors: {
@@ -570,15 +579,15 @@ export default {
570
579
  label: {
571
580
  color: '#4A4A4D',
572
581
 
573
- font: {...fontObject}
582
+ font: { ...fontObject },
574
583
  },
575
584
 
576
- font: {...fontObject},
585
+ font: { ...fontObject },
577
586
 
578
587
  error: {
579
588
  color: presetColors.danger,
580
589
 
581
- font: {...fontObject},
590
+ font: { ...fontObject },
582
591
 
583
592
  format: 'ֆայլի սխալ ֆորմատ',
584
593
  maxSize: 'Առավելագույն ծավալ',
@@ -595,7 +604,7 @@ export default {
595
604
  loading: presetColors.primary,
596
605
  },
597
606
 
598
- font: {...fontObject}
607
+ font: { ...fontObject },
599
608
  },
600
609
 
601
610
  uploadBtn: {
@@ -609,7 +618,7 @@ export default {
609
618
  backgroundHover: 'rgba(0, 35, 106, 1)',
610
619
  },
611
620
 
612
- font: {...fontObject}
621
+ font: { ...fontObject },
613
622
  },
614
623
 
615
624
  listItem: {
@@ -622,29 +631,28 @@ export default {
622
631
  backgroundError: '#F6F8F8',
623
632
  },
624
633
 
625
- font: {...fontObject},
634
+ font: { ...fontObject },
626
635
 
627
636
  error: {
628
637
  color: '#E40E00',
629
- font: {...fontObject}
630
- }
638
+ font: { ...fontObject },
639
+ },
631
640
  },
632
641
 
633
642
  icon: {
634
- // comment here for example,
635
-
636
- // pdf: React.createElement(SvgChecked, { fill: 'green' }),
637
- // png: React.createElement(SvgChecked, { fill: 'green' }),
638
- // jpg: React.createElement(SvgChecked, { fill: 'green' }),
639
- // jpeg: React.createElement(SvgChecked, { fill: 'green' }),
640
- // heic: React.createElement(SvgChecked, { fill: 'green' }),
641
- // wrong: React.createElement(SvgChecked, { fill: 'green' }),
642
- // upload: React.createElement(SvgChecked, { fill: 'green' }),
643
- // required: React.createElement(SvgChecked, { fill: 'green' }),
644
- // removeFile: React.createElement(SvgChecked, { fill: 'green' }),
645
- // deleteComponent: React.createElement(SvgChecked, { fill: 'green' }),
643
+ // comment here for example,
644
+ // pdf: React.createElement(SvgChecked, { fill: 'green' }),
645
+ // png: React.createElement(SvgChecked, { fill: 'green' }),
646
+ // jpg: React.createElement(SvgChecked, { fill: 'green' }),
647
+ // jpeg: React.createElement(SvgChecked, { fill: 'green' }),
648
+ // heic: React.createElement(SvgChecked, { fill: 'green' }),
649
+ // wrong: React.createElement(SvgChecked, { fill: 'green' }),
650
+ // upload: React.createElement(SvgChecked, { fill: 'green' }),
651
+ // required: React.createElement(SvgChecked, { fill: 'green' }),
652
+ // removeFile: React.createElement(SvgChecked, { fill: 'green' }),
653
+ // deleteComponent: React.createElement(SvgChecked, { fill: 'green' }),
646
654
  // deleteItem: React.createElement(SvgUnchecked, { fill: 'green' }),
647
- }
655
+ },
648
656
  },
649
657
  // default properties for <Modal /> component
650
658
  MODAL: {
@@ -676,7 +684,7 @@ export default {
676
684
  header: {
677
685
  color: presetColors.primarySecond,
678
686
  height: '30px',
679
- font: {...fontObject}
687
+ font: { ...fontObject },
680
688
  },
681
689
 
682
690
  image: {
@@ -689,41 +697,41 @@ export default {
689
697
  },
690
698
 
691
699
  icon: {
692
- // zoom: React.createElement(SvgChecked, { fill: 'green' }),
693
- // prev: React.createElement(SvgChecked, { fill: 'green' }),
694
- // next: React.createElement(SvgChecked, { fill: 'green' }),
695
- // close: React.createElement(SvgChecked, { fill: 'green' }),
696
- // closeSlide: React.createElement(SvgChecked, { fill: 'green' }),
700
+ // zoom: React.createElement(SvgChecked, { fill: 'green' }),
701
+ // prev: React.createElement(SvgChecked, { fill: 'green' }),
702
+ // next: React.createElement(SvgChecked, { fill: 'green' }),
703
+ // close: React.createElement(SvgChecked, { fill: 'green' }),
704
+ // closeSlide: React.createElement(SvgChecked, { fill: 'green' }),
697
705
  },
698
- closeAreaBackgroundColor: 'linear-gradient(to bottom, rgb(60, 57, 62), rgba(60, 57, 62, 0))' // for close div background color
706
+ closeAreaBackgroundColor: 'linear-gradient(to bottom, rgb(60, 57, 62), rgba(60, 57, 62, 0))', // for close div background color
699
707
  },
700
708
  // default properties for <Checkbox /> component
701
709
  CHECKBOX: {
702
710
  className: '',
703
711
  marginBottom: '10px',
704
712
 
705
- colors: {
713
+ colors: {
706
714
  checked: presetColors.primarySecond,
707
715
  unChecked: presetColors.secondary,
708
716
  },
709
717
 
710
718
  label: {
711
719
  marginLeft: '10px',
712
- }
720
+ },
713
721
 
714
- // checkedIcon: React.createElement(SvgChecked, { fill: 'green' }),
722
+ // checkedIcon: React.createElement(SvgChecked, { fill: 'green' }),
715
723
  // unCheckedIcon: React.createElement(<SvgUnchecked fill="#E00" />),
716
724
  },
717
725
  // default properties for <Table /> component
718
726
  TABLE: {
719
727
  className: '',
720
728
  textAlign: 'center',
721
-
729
+
722
730
  column: {
723
731
  maxWidth: '',
724
732
  minWidth: '',
725
733
  },
726
-
734
+
727
735
  head: {
728
736
  color: presetColors.extraLight,
729
737
  radius: '14px',
@@ -733,7 +741,7 @@ export default {
733
741
  background: presetColors.primarySecond,
734
742
  },
735
743
 
736
- font: {...fontObject}
744
+ font: { ...fontObject },
737
745
  },
738
746
 
739
747
  body: {
@@ -758,16 +766,16 @@ export default {
758
766
  },
759
767
 
760
768
  border: '1px solid',
761
- borderColor: presetColors.light
769
+ borderColor: presetColors.light,
762
770
  },
763
771
 
764
- font: {...fontObject}
772
+ font: { ...fontObject },
765
773
  },
766
-
774
+
767
775
  openList: {
768
776
  color: '#A3A5A9',
769
- font: {...fontObject}
770
- }
777
+ font: { ...fontObject },
778
+ },
771
779
  },
772
780
  // default properties for <Pagination /> component
773
781
  PAGINATION: {
@@ -779,10 +787,10 @@ export default {
779
787
  icon: {
780
788
  // info: React.createElement(SvgChecked, { just: 'must' }),
781
789
  // warn: React.createElement(SvgUnchecked, { just: 'must' }),
782
- // close: React.createElement(SvgChecked, { fill: 'green' }),
783
- // error: React.createElement(SvgChecked, { fill: 'green' }),
784
- // success: React.createElement(SvgChecked, { fill: 'green' }),
785
- }
790
+ // close: React.createElement(SvgChecked, { fill: 'green' }),
791
+ // error: React.createElement(SvgChecked, { fill: 'green' }),
792
+ // success: React.createElement(SvgChecked, { fill: 'green' }),
793
+ },
786
794
  },
787
795
  // default properties for <Stepper /> component
788
796
  STEPPER: {
@@ -810,7 +818,7 @@ export default {
810
818
  color: '#3C3D46',
811
819
  lineHeight: '21px',
812
820
 
813
- font: {...fontObject}
814
- }
821
+ font: { ...fontObject },
822
+ },
815
823
  },
816
824
  }