@fixefy/fixefy-ui-utils 0.2.4 → 0.2.5

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.
@@ -1,760 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "default", {
6
- enumerable: true,
7
- get: function() {
8
- return getPageContext;
9
- }
10
- });
11
- const _styles = require("@mui/material/styles");
12
- const _styles1 = require("@mui/styles");
13
- const _jss = require("jss");
14
- function _define_property(obj, key, value) {
15
- if (key in obj) {
16
- Object.defineProperty(obj, key, {
17
- value: value,
18
- enumerable: true,
19
- configurable: true,
20
- writable: true
21
- });
22
- } else {
23
- obj[key] = value;
24
- }
25
- return obj;
26
- }
27
- function _object_spread(target) {
28
- for(var i = 1; i < arguments.length; i++){
29
- var source = arguments[i] != null ? arguments[i] : {};
30
- var ownKeys = Object.keys(source);
31
- if (typeof Object.getOwnPropertySymbols === "function") {
32
- ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
33
- return Object.getOwnPropertyDescriptor(source, sym).enumerable;
34
- }));
35
- }
36
- ownKeys.forEach(function(key) {
37
- _define_property(target, key, source[key]);
38
- });
39
- }
40
- return target;
41
- }
42
- function ownKeys(object, enumerableOnly) {
43
- var keys = Object.keys(object);
44
- if (Object.getOwnPropertySymbols) {
45
- var symbols = Object.getOwnPropertySymbols(object);
46
- if (enumerableOnly) {
47
- symbols = symbols.filter(function(sym) {
48
- return Object.getOwnPropertyDescriptor(object, sym).enumerable;
49
- });
50
- }
51
- keys.push.apply(keys, symbols);
52
- }
53
- return keys;
54
- }
55
- function _object_spread_props(target, source) {
56
- source = source != null ? source : {};
57
- if (Object.getOwnPropertyDescriptors) {
58
- Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
59
- } else {
60
- ownKeys(Object(source)).forEach(function(key) {
61
- Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
62
- });
63
- }
64
- return target;
65
- }
66
- const theme = (0, _styles.createTheme)({
67
- palette: {
68
- background: {
69
- paper: '#fff'
70
- },
71
- common: {
72
- black: '#323232',
73
- white: '#FFFFFF'
74
- },
75
- colors: {
76
- red: '#EB5757',
77
- lightRed: '#FEF6F6',
78
- orange: '#F2994A',
79
- lightOrange: '#FEF7F1',
80
- orangeHover: '#EC7A30',
81
- orangeFocused: '#E65C15',
82
- gold: '#C4A603',
83
- lightGold: '#FAF7E6',
84
- yellow: '#F2D74C',
85
- lightYellow: '#FEFCEE',
86
- yellowHover: '#ECC631',
87
- yellowFocused: '#E6B517',
88
- green1: '#88C00D',
89
- lightGreen1: '#F6FAEC',
90
- green2: '#27AE60',
91
- lightGreen2: '#EEF9F2',
92
- green2Hover: '#169242',
93
- green2Focused: '#067724',
94
- green3: '#6FCF97',
95
- blue: '#2D9CDB',
96
- lightBlue: '#F3F9FD',
97
- blueHover: '#2D9CDB',
98
- blueFocused: '#085FBC',
99
- blue1: '#56CCF2',
100
- lightBlue1: '#F1FBFE',
101
- blue1Hover: '#39B8EC',
102
- blue1Focused: '#1DA3E6',
103
- purple: '#BB6BD9',
104
- lightPurple: '#FBF6FD'
105
- },
106
- greyscale: {
107
- dark: '#636363',
108
- main: '#ababab',
109
- light: '#e2e2e2',
110
- contrastText: '#f7f7f7',
111
- '500': '#5C6467',
112
- '400': '#8B9092',
113
- '300': '#C5C8C9',
114
- '200': '#F0F0F0',
115
- '100': '#F7F7F7'
116
- },
117
- redscale: {
118
- main: '#EB5757',
119
- '500': '#EE6868',
120
- '400': '#F08989',
121
- '300': '#F4AAAA',
122
- '200': '#F8CCCC',
123
- '100': '#FEF6F6'
124
- },
125
- orangescale: {
126
- '700': '#E65C15',
127
- '600': '#EC7A30',
128
- main: '#F2994A',
129
- '100': '#FEF7F1'
130
- },
131
- goldscale: {
132
- main: '#C4A603',
133
- '100': '#FAF7E6'
134
- },
135
- yellowscale: {
136
- '700': '#E6B517',
137
- '600': '#ECC631',
138
- main: '#F2D74C',
139
- '100': '#FEFCEE'
140
- },
141
- purplescale: {
142
- main: '#BB6BD9',
143
- '100': '#FBF6FD'
144
- },
145
- green1scale: {
146
- main: '#88C00D',
147
- '100': '#F6FAEC'
148
- },
149
- green2scale: {
150
- '700': '#067724',
151
- '600': '#169242',
152
- main: '#27AE60',
153
- '100': '#EEF9F2'
154
- },
155
- green3scale: {
156
- main: '#6FCF97'
157
- },
158
- blue1scale: {
159
- '700': '#1DA3E6',
160
- '600': '#39B8EC',
161
- main: '#56CCF2',
162
- '100': '#F1FBFE'
163
- },
164
- blue2scale: {
165
- '700': '#085FBC',
166
- '600': '#1A7ECC',
167
- main: '#2D9CDB',
168
- '100': '#F3F9FD'
169
- },
170
- error: {
171
- main: '#f44336'
172
- },
173
- pending: {
174
- main: '#e7cc0e',
175
- dark: '#B09000'
176
- },
177
- primary: {
178
- main: '#365c65',
179
- '100': '#C6DDE2',
180
- '300': '#87ACB6',
181
- '500': '#568793',
182
- '700': '#3C636C',
183
- '800': '#2F4F57'
184
- },
185
- priority: {
186
- critical: '#EB5757',
187
- high: '#F2994A',
188
- low: '#2D9CDB',
189
- medium: '#88C00D',
190
- marginal: '#56CCF2'
191
- },
192
- typography: {
193
- title: '#172326',
194
- delete: '#EB5757'
195
- },
196
- statistics: {
197
- value: '#568793',
198
- label: '#8B9092'
199
- },
200
- success: {
201
- main: '#88c00d'
202
- },
203
- uploader: {
204
- processing: {
205
- border: '',
206
- bg: ''
207
- },
208
- pause: {
209
- border: '',
210
- bg: ''
211
- }
212
- },
213
- score: {
214
- excellent: '#27AE60',
215
- high: '#88C00D',
216
- medium: '#F2C94C',
217
- low: '#F2994A',
218
- bad: '#ED323B'
219
- },
220
- status: {
221
- active: {
222
- border: '#96B5BC',
223
- background: '#F7F9FA'
224
- },
225
- approve: {
226
- border: '#88C00D',
227
- background: '#F9FCF3'
228
- },
229
- approved: {
230
- border: '#27AE60',
231
- background: '#EEF9F2'
232
- },
233
- challenge: {
234
- border: '#F7C08F',
235
- background: '#FEFAF6'
236
- },
237
- challenged: {
238
- border: '#F7C08F',
239
- background: '#FEFAF6'
240
- },
241
- declined: {
242
- border: '#F48085',
243
- background: '#FEF5F5'
244
- },
245
- discrepancy: {
246
- border: '#CEBA61',
247
- background: '#FBFAF2'
248
- },
249
- duplicate: {
250
- border: '#CEBA61',
251
- background: '#FBFAF2'
252
- },
253
- duplicated: {
254
- border: '#CEBA61',
255
- background: '#FBFAF2'
256
- },
257
- gold: {
258
- border: '#C4A603',
259
- background: '#FEFDF3'
260
- },
261
- in_dispute: {
262
- border: '#F2994A',
263
- background: '#FEF7F1'
264
- },
265
- in_progress: {
266
- border: '#56CCF2',
267
- background: '#F1FBFE'
268
- },
269
- in_review: {
270
- border: '#BB6BD9',
271
- background: '#FAF6FE'
272
- },
273
- no_pricing: {
274
- border: '#BBBBBB',
275
- background: '#FAFAFA'
276
- },
277
- pending: {
278
- border: '#ECC631',
279
- background: '#FEFDF3'
280
- }
281
- },
282
- tag: {
283
- approved: {
284
- border: '#27AE60',
285
- background: '#27AE60'
286
- },
287
- pending: {
288
- border: '#ECC631',
289
- background: '#ECC631'
290
- },
291
- created: {
292
- border: '#87ACB6',
293
- background: '#87ACB6'
294
- },
295
- declined: {
296
- border: '#EB5757',
297
- background: '#EB5757'
298
- },
299
- in_dispute: {
300
- border: '#EC6AC8',
301
- background: '#EC6AC8'
302
- },
303
- in_progress: {
304
- border: '#56CCF2',
305
- background: '#56CCF2'
306
- },
307
- paid: {
308
- border: '#BB6BD9',
309
- background: '#BB6BD9'
310
- },
311
- closed: {
312
- border: '#8B9092',
313
- background: '#8B9092'
314
- },
315
- refunded: {
316
- border: '#BB6BD9',
317
- background: '#BB6BD9'
318
- },
319
- low: {
320
- border: '#56CCF2',
321
- background: '#88C00D'
322
- }
323
- },
324
- invoiceState: {
325
- approved: {
326
- border: '#27AE60',
327
- background: '#27AE60',
328
- light: '#D4EFDF'
329
- },
330
- created: {
331
- border: '#87ACB6',
332
- background: '#87ACB6'
333
- },
334
- declined: {
335
- border: '#EB5757',
336
- background: '#EB5757'
337
- },
338
- in_dispute: {
339
- border: '#F2994A',
340
- background: '#F2994A',
341
- light: '#FCEBDB'
342
- },
343
- in_progress: {
344
- border: '#56CCF2',
345
- background: '#56CCF2'
346
- },
347
- paid: {
348
- border: '#BB6BD9',
349
- background: '#BB6BD9'
350
- },
351
- closed: {
352
- border: '#8B9092',
353
- background: '#8B9092'
354
- }
355
- },
356
- reconcilationState: {
357
- created: {
358
- border: '#87ACB6',
359
- background: '#87ACB6'
360
- },
361
- in_progress: {
362
- border: '#56CCF2',
363
- background: '#56CCF2'
364
- },
365
- pending: {
366
- border: '#ECC631',
367
- background: '#ECC631'
368
- },
369
- approved: {
370
- border: '#27AE60',
371
- background: '#27AE60'
372
- },
373
- declined: {
374
- border: '#EB5757',
375
- background: '#EB5757'
376
- },
377
- refunded: {
378
- border: '#BB6BD9',
379
- background: '#BB6BD9'
380
- },
381
- closed: {
382
- border: '#8B9092',
383
- background: '#8B9092'
384
- }
385
- },
386
- trends: {
387
- positive: '#88C00D',
388
- negative: '#F2994A',
389
- critical: '#ED323B',
390
- percent: '#56CCF2',
391
- sum: '#BB6BD9'
392
- },
393
- invoiceAnalysis: {
394
- underCharges: '#87ACB6',
395
- overCharges: '#C6DDE2',
396
- matching: '#568793',
397
- invalid: '#EB5757'
398
- },
399
- snackbar: {
400
- info: {
401
- icon: '#56CCF2',
402
- border: '#56CCF2'
403
- },
404
- success: {
405
- icon: '#27AE60',
406
- border: '#27AE60'
407
- },
408
- error: {
409
- icon: '#ED323B',
410
- border: '#ED323B'
411
- },
412
- warn: {
413
- icon: '#F7DD8D',
414
- border: '#F2C94C'
415
- },
416
- critical: {
417
- icon: '#ED323B',
418
- border: '#ED323B'
419
- },
420
- silent: {
421
- icon: '#56CCF2',
422
- border: '#56CCF2'
423
- },
424
- alert: {
425
- icon: '#56CCF2',
426
- border: '#56CCF2'
427
- }
428
- },
429
- notificationStatus: {
430
- unread: '#F7F9FA'
431
- }
432
- },
433
- components: {
434
- MuiButton: {
435
- defaultProps: {
436
- disableRipple: true
437
- },
438
- variants: [
439
- {
440
- props: {
441
- variant: 'contained'
442
- },
443
- style: ({ theme })=>({
444
- background: theme.palette.primary[500],
445
- color: theme.palette.common.white,
446
- boxShadow: 'none',
447
- '&:hover': {
448
- background: theme.palette.primary['700'],
449
- boxShadow: 'none'
450
- },
451
- '&:focus': {
452
- background: theme.palette.primary['800'],
453
- boxShadow: 'none'
454
- },
455
- '&:disabled': {
456
- background: theme.palette.primary[500],
457
- color: theme.palette.common.white
458
- }
459
- })
460
- },
461
- {
462
- props: {
463
- variant: 'contained:rounded'
464
- },
465
- style: ({ theme })=>({
466
- borderRadius: 100,
467
- background: theme.palette.primary[500],
468
- color: theme.palette.common.white,
469
- '&:hover': {
470
- background: theme.palette.primary['700']
471
- },
472
- '&:focus': {
473
- background: theme.palette.primary['800']
474
- },
475
- '&:disabled': {
476
- background: theme.palette.primary[500],
477
- color: theme.palette.common.white
478
- }
479
- })
480
- },
481
- {
482
- props: {
483
- variant: 'outlined'
484
- },
485
- style: ({ theme })=>({
486
- borderRadius: 100,
487
- color: theme.palette.primary[500],
488
- borderColor: theme.palette.primary[500],
489
- '&:hover': {
490
- color: theme.palette.primary['700'],
491
- borderColor: theme.palette.primary['700'],
492
- background: 'transparent'
493
- },
494
- '&:focus': {
495
- color: theme.palette.primary['800'],
496
- borderColor: theme.palette.primary['800'],
497
- background: 'transparent'
498
- },
499
- '&:disabled': {
500
- color: theme.palette.primary[500],
501
- border: `1px solid ${theme.palette.primary[500]}`
502
- }
503
- })
504
- },
505
- {
506
- props: {
507
- variant: 'text'
508
- },
509
- style: ({ theme })=>({
510
- color: theme.palette.primary[500],
511
- '&:hover': {
512
- color: theme.palette.primary['700'],
513
- background: 'transparent'
514
- },
515
- '&:focus': {
516
- color: theme.palette.primary['800'],
517
- borderColor: theme.palette.primary['800'],
518
- background: 'transparent'
519
- },
520
- '&:disabled': {
521
- color: theme.palette.primary[500]
522
- }
523
- })
524
- }
525
- ],
526
- styleOverrides: {
527
- root: {
528
- fontWeight: 600,
529
- fontSize: 12,
530
- lineHeight: '24px',
531
- letterSpacing: '0.5px',
532
- height: 40
533
- }
534
- }
535
- },
536
- MuiInputBase: {
537
- styleOverrides: {
538
- //@ts-ignore
539
- root: ({ theme })=>({
540
- background: theme.palette.common.white,
541
- padding: theme.spacing(1, 2),
542
- height: 40,
543
- boxSizing: 'border-box',
544
- borderRadius: 4,
545
- border: '1px solid transparent',
546
- transition: '.2s',
547
- '&:focus-within': {
548
- borderColor: theme.palette.primary[100],
549
- '& input': {
550
- caretColor: theme.palette.primary[500]
551
- }
552
- },
553
- '&.Mui-error': {
554
- borderColor: theme.palette.redscale.main
555
- },
556
- 'label + &': {
557
- marginTop: theme.spacing(2.2),
558
- background: theme.palette.common.white
559
- },
560
- '& input': {
561
- color: theme.palette.typography.title,
562
- '&:placeholder': {
563
- color: theme.palette.greyscale[400]
564
- }
565
- },
566
- '&.MuiInputBase-adornedStart': {
567
- '& input': {
568
- paddingLeft: theme.spacing(2)
569
- }
570
- },
571
- '&.MuiInputBase-adornedEnd': {
572
- '& input': {
573
- paddingRight: theme.spacing(2)
574
- }
575
- }
576
- })
577
- }
578
- }
579
- },
580
- typography: {
581
- fontFamily: [
582
- 'Open Sans',
583
- 'OpenSans'
584
- ].join(','),
585
- body1: {
586
- fontWeight: 'normal',
587
- fontStyle: 'normal',
588
- fontSize: 14,
589
- lineHeight: '24px',
590
- letterSpacing: '0.15px'
591
- },
592
- button: {
593
- paddingLeft: 24,
594
- paddingRight: 24,
595
- color: 'white',
596
- fontWeight: 500,
597
- fontStyle: 'normal',
598
- fontSize: 14,
599
- lineHeight: '24px',
600
- letterSpacing: '0.5px'
601
- },
602
- table: {
603
- fontWeight: 'normal',
604
- fontStyle: 'normal',
605
- fontSize: 12,
606
- lineHeight: '16px',
607
- letterSpacing: '0.1px'
608
- },
609
- table2: {
610
- fontWeight: 900,
611
- fontStyle: 'normal',
612
- fontSize: 12,
613
- lineHeight: '16px',
614
- letterSpacing: '0.1px'
615
- },
616
- overLineCaption: {
617
- fontWeight: 'normal',
618
- fontStyle: 'normal',
619
- fontSize: 11,
620
- lineHeight: '16px',
621
- letterSpacing: '0.1px'
622
- },
623
- link: {
624
- fontWeight: 'normal',
625
- fontStyle: 'italic',
626
- fontSize: 12,
627
- lineHeight: '20px',
628
- letterSpacing: '0.15px'
629
- },
630
- h1: {
631
- fontWeight: 300,
632
- fontStyle: 'normal',
633
- fontSize: 59,
634
- lineHeight: '80px',
635
- letterSpacing: '-0.5px'
636
- },
637
- h2: {
638
- fontWeight: 'normal',
639
- fontStyle: 'normal',
640
- fontSize: 44,
641
- lineHeight: '64px',
642
- letterSpacing: '0px'
643
- },
644
- h3: {
645
- fontWeight: 'normal',
646
- fontStyle: 'normal',
647
- fontSize: 33,
648
- lineHeight: '48px',
649
- letterSpacing: '0.25px'
650
- },
651
- h4: {
652
- fontWeight: 'normal',
653
- fontStyle: 'normal',
654
- fontSize: 25,
655
- lineHeight: '40px',
656
- letterSpacing: '0px'
657
- },
658
- h5: {
659
- fontWeight: 500,
660
- fontStyle: 'normal',
661
- fontSize: 19,
662
- lineHeight: '28px',
663
- letterSpacing: '0.15px'
664
- },
665
- subtitle1: {
666
- fontWeight: 'normal',
667
- fontStyle: 'normal',
668
- fontSize: 16,
669
- lineHeight: '24px',
670
- letterSpacing: '0.15px'
671
- },
672
- subtitle2: {
673
- fontWeight: 500,
674
- fontStyle: 'normal',
675
- fontSize: 14,
676
- lineHeight: '24px',
677
- letterSpacing: '0.1px'
678
- }
679
- },
680
- sizes: {
681
- sideMenu: {
682
- width: 70,
683
- itemHeight: 60,
684
- logoHeight: 60,
685
- paddingTop: 20,
686
- marginBottom: 20
687
- },
688
- hex: 80,
689
- hex_node: 60,
690
- hex_event: 60,
691
- hex_service: 60,
692
- hex_structure: 30,
693
- header: {
694
- iconTray: 200,
695
- height: 60
696
- }
697
- }
698
- });
699
- const lightTheme = (0, _styles.createTheme)(_object_spread_props(_object_spread({}, theme), {
700
- //@ts-ignore
701
- palette: _object_spread_props(_object_spread({}, theme.palette), {
702
- mode: 'light',
703
- text: {
704
- primary: 'rgba(0, 0, 0, 0.87)',
705
- secondary: 'rgba(0, 0, 0, 0.54)',
706
- disabled: 'rgba(0, 0, 0, 0.38)'
707
- },
708
- divider: '#F0F0F0',
709
- background: {
710
- paper: '#fff',
711
- default: '#fafafa'
712
- }
713
- })
714
- }));
715
- const darkTheme = (0, _styles.createTheme)(_object_spread_props(_object_spread({}, theme), {
716
- //@ts-ignore
717
- palette: _object_spread_props(_object_spread({}, theme.palette), {
718
- mode: 'dark',
719
- text: {
720
- primary: '#fff',
721
- secondary: 'rgba(255, 255, 255, 0.7)',
722
- disabled: 'rgba(255, 255, 255, 0.5)'
723
- },
724
- divider: 'rgba(255, 255, 255, 0.12)',
725
- background: {
726
- paper: '#323232',
727
- default: '#303030'
728
- }
729
- })
730
- }));
731
- // A theme with custom primary and secondary color.
732
- // It's optional.
733
- function createPageContext(darkMode = false) {
734
- // const theme = darkMode ? darkTheme : lightTheme;
735
- return {
736
- theme: darkMode ? darkTheme : lightTheme,
737
- darkMode,
738
- // This is needed in order to deduplicate the injection of CSS in the page.
739
- sheetsManager: new Map(),
740
- // This is needed in order to inject the critical CSS.
741
- jss: (0, _jss.create)(_object_spread({}, (0, _styles1.jssPreset)())),
742
- sheetsRegistry: new _jss.SheetsRegistry(),
743
- // The standard class name generator.
744
- generateClassName: (0, _styles1.createGenerateClassName)()
745
- };
746
- }
747
- let pageContext;
748
- function getPageContext(darkMode) {
749
- // Make sure to create a new context for every server-side request so that data
750
- // isn't shared between connections (which would be bad).
751
- //@ts-ignore
752
- if (!process.browser) {
753
- return createPageContext(darkMode);
754
- }
755
- // Reuse context on the client-side.
756
- if (!pageContext) {
757
- pageContext = createPageContext(darkMode);
758
- }
759
- return pageContext;
760
- }