@fixefy/fixefy-ui-utils 0.0.334 → 0.0.335

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.
@@ -0,0 +1,760 @@
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: '#F2994A',
301
+ background: '#FEF7F1'
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
+ }