@alfalab/core-components-pure-cell 4.11.6 → 4.12.0
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/{component-50cf799c.js → component-4a29a846.js} +11 -11
- package/component.js +1 -1
- package/components/addon/component.js +1 -1
- package/components/addon/index.css +13 -13
- package/components/addon/index.d.ts +1 -1
- package/components/addon/index.js +1 -1
- package/components/amount/component.js +1 -1
- package/components/amount/index.css +2 -2
- package/components/amount/index.d.ts +1 -1
- package/components/amount/index.js +1 -1
- package/components/amount-title/component.js +1 -1
- package/components/amount-title/index.css +3 -3
- package/components/amount-title/index.d.ts +1 -1
- package/components/amount-title/index.js +1 -1
- package/components/category/component.js +1 -1
- package/components/category/index.css +5 -5
- package/components/category/index.d.ts +1 -1
- package/components/category/index.js +1 -1
- package/components/content/component.js +1 -1
- package/components/content/index.css +3 -3
- package/components/content/index.d.ts +1 -1
- package/components/content/index.js +1 -1
- package/components/footer/component.js +1 -1
- package/components/footer/index.css +4 -4
- package/components/footer/index.d.ts +1 -1
- package/components/footer/index.js +1 -1
- package/components/footer-button/component.js +1 -1
- package/components/footer-button/index.css +2 -2
- package/components/footer-button/index.d.ts +1 -1
- package/components/footer-button/index.js +1 -1
- package/components/footer-text/component.js +1 -1
- package/components/footer-text/index.d.ts +1 -1
- package/components/footer-text/index.js +1 -1
- package/components/graphics/component.js +1 -1
- package/components/graphics/index.css +18 -18
- package/components/graphics/index.d.ts +1 -1
- package/components/graphics/index.js +1 -1
- package/components/main/component.js +1 -1
- package/components/main/index.css +7 -7
- package/components/main/index.d.ts +1 -1
- package/components/main/index.js +1 -1
- package/components/text/component.js +1 -1
- package/components/text/index.css +7 -7
- package/components/text/index.d.ts +1 -1
- package/components/text/index.js +1 -1
- package/esm/{component-7d6886c9.js → component-9fead930.js} +11 -11
- package/esm/component.js +1 -1
- package/esm/components/addon/component.js +1 -1
- package/esm/components/addon/index.css +13 -13
- package/esm/components/addon/index.d.ts +1 -1
- package/esm/components/addon/index.js +1 -1
- package/esm/components/amount/component.js +1 -1
- package/esm/components/amount/index.css +2 -2
- package/esm/components/amount/index.d.ts +1 -1
- package/esm/components/amount/index.js +1 -1
- package/esm/components/amount-title/component.js +1 -1
- package/esm/components/amount-title/index.css +3 -3
- package/esm/components/amount-title/index.d.ts +1 -1
- package/esm/components/amount-title/index.js +1 -1
- package/esm/components/category/component.js +1 -1
- package/esm/components/category/index.css +5 -5
- package/esm/components/category/index.d.ts +1 -1
- package/esm/components/category/index.js +1 -1
- package/esm/components/content/component.js +1 -1
- package/esm/components/content/index.css +3 -3
- package/esm/components/content/index.d.ts +1 -1
- package/esm/components/content/index.js +1 -1
- package/esm/components/footer/component.js +1 -1
- package/esm/components/footer/index.css +4 -4
- package/esm/components/footer/index.d.ts +1 -1
- package/esm/components/footer/index.js +1 -1
- package/esm/components/footer-button/component.js +1 -1
- package/esm/components/footer-button/index.css +2 -2
- package/esm/components/footer-button/index.d.ts +1 -1
- package/esm/components/footer-button/index.js +1 -1
- package/esm/components/footer-text/component.js +1 -1
- package/esm/components/footer-text/index.d.ts +1 -1
- package/esm/components/footer-text/index.js +1 -1
- package/esm/components/graphics/component.js +1 -1
- package/esm/components/graphics/index.css +18 -18
- package/esm/components/graphics/index.d.ts +1 -1
- package/esm/components/graphics/index.js +1 -1
- package/esm/components/main/component.js +1 -1
- package/esm/components/main/index.css +7 -7
- package/esm/components/main/index.d.ts +1 -1
- package/esm/components/main/index.js +1 -1
- package/esm/components/text/component.js +1 -1
- package/esm/components/text/index.css +7 -7
- package/esm/components/text/index.d.ts +1 -1
- package/esm/components/text/index.js +1 -1
- package/esm/index.css +29 -29
- package/esm/index.js +1 -1
- package/index.css +29 -29
- package/index.js +1 -1
- package/modern/{component-f5e0c9cb.js → component-e2f28ea5.js} +11 -11
- package/modern/component.js +1 -1
- package/modern/components/addon/component.js +1 -1
- package/modern/components/addon/index.css +13 -13
- package/modern/components/addon/index.d.ts +1 -1
- package/modern/components/addon/index.js +1 -1
- package/modern/components/amount/component.js +1 -1
- package/modern/components/amount/index.css +2 -2
- package/modern/components/amount/index.d.ts +1 -1
- package/modern/components/amount/index.js +1 -1
- package/modern/components/amount-title/component.js +1 -1
- package/modern/components/amount-title/index.css +3 -3
- package/modern/components/amount-title/index.d.ts +1 -1
- package/modern/components/amount-title/index.js +1 -1
- package/modern/components/category/component.js +1 -1
- package/modern/components/category/index.css +5 -5
- package/modern/components/category/index.d.ts +1 -1
- package/modern/components/category/index.js +1 -1
- package/modern/components/content/component.js +1 -1
- package/modern/components/content/index.css +3 -3
- package/modern/components/content/index.d.ts +1 -1
- package/modern/components/content/index.js +1 -1
- package/modern/components/footer/component.js +1 -1
- package/modern/components/footer/index.css +4 -4
- package/modern/components/footer/index.d.ts +1 -1
- package/modern/components/footer/index.js +1 -1
- package/modern/components/footer-button/component.js +1 -1
- package/modern/components/footer-button/index.css +2 -2
- package/modern/components/footer-button/index.d.ts +1 -1
- package/modern/components/footer-button/index.js +1 -1
- package/modern/components/footer-text/component.js +1 -1
- package/modern/components/footer-text/index.d.ts +1 -1
- package/modern/components/footer-text/index.js +1 -1
- package/modern/components/graphics/component.js +1 -1
- package/modern/components/graphics/index.css +18 -18
- package/modern/components/graphics/index.d.ts +1 -1
- package/modern/components/graphics/index.js +1 -1
- package/modern/components/main/component.js +1 -1
- package/modern/components/main/index.css +7 -7
- package/modern/components/main/index.d.ts +1 -1
- package/modern/components/main/index.js +1 -1
- package/modern/components/text/component.js +1 -1
- package/modern/components/text/index.css +7 -7
- package/modern/components/text/index.d.ts +1 -1
- package/modern/components/text/index.js +1 -1
- package/modern/index.css +29 -29
- package/modern/index.js +1 -1
- package/moderncssm/component-511ba1c0.d.ts +227 -0
- package/moderncssm/component-511ba1c0.js +252 -0
- package/moderncssm/component-8c83a9ca.d.ts +125 -0
- package/moderncssm/component.d.ts +0 -0
- package/moderncssm/component.js +7 -0
- package/moderncssm/components/addon/component.d.ts +0 -0
- package/moderncssm/components/addon/component.js +5 -0
- package/moderncssm/components/addon/index.d.ts +1 -0
- package/moderncssm/components/addon/index.js +1 -0
- package/moderncssm/components/addon/index.module.css +72 -0
- package/moderncssm/components/amount/component.d.ts +0 -0
- package/moderncssm/components/amount/component.js +7 -0
- package/moderncssm/components/amount/index.d.ts +1 -0
- package/moderncssm/components/amount/index.js +1 -0
- package/moderncssm/components/amount/index.module.css +6 -0
- package/moderncssm/components/amount-title/component.d.ts +0 -0
- package/moderncssm/components/amount-title/component.js +7 -0
- package/moderncssm/components/amount-title/index.d.ts +1 -0
- package/moderncssm/components/amount-title/index.js +1 -0
- package/moderncssm/components/amount-title/index.module.css +9 -0
- package/moderncssm/components/category/component.d.ts +0 -0
- package/moderncssm/components/category/component.js +5 -0
- package/moderncssm/components/category/index.d.ts +1 -0
- package/moderncssm/components/category/index.js +1 -0
- package/moderncssm/components/category/index.module.css +26 -0
- package/moderncssm/components/content/component.d.ts +0 -0
- package/moderncssm/components/content/component.js +5 -0
- package/moderncssm/components/content/index.d.ts +1 -0
- package/moderncssm/components/content/index.js +1 -0
- package/moderncssm/components/content/index.module.css +12 -0
- package/moderncssm/components/footer/component.d.ts +0 -0
- package/moderncssm/components/footer/component.js +5 -0
- package/moderncssm/components/footer/index.d.ts +1 -0
- package/moderncssm/components/footer/index.js +1 -0
- package/moderncssm/components/footer/index.module.css +15 -0
- package/moderncssm/components/footer-button/component.d.ts +0 -0
- package/moderncssm/components/footer-button/component.js +5 -0
- package/moderncssm/components/footer-button/index.d.ts +1 -0
- package/moderncssm/components/footer-button/index.js +1 -0
- package/moderncssm/components/footer-button/index.module.css +5 -0
- package/moderncssm/components/footer-text/component.d.ts +0 -0
- package/moderncssm/components/footer-text/component.js +4 -0
- package/moderncssm/components/footer-text/index.d.ts +1 -0
- package/moderncssm/components/footer-text/index.js +1 -0
- package/moderncssm/components/graphics/component.d.ts +0 -0
- package/moderncssm/components/graphics/component.js +5 -0
- package/moderncssm/components/graphics/index.d.ts +1 -0
- package/moderncssm/components/graphics/index.js +1 -0
- package/moderncssm/components/graphics/index.module.css +92 -0
- package/moderncssm/components/main/component.d.ts +0 -0
- package/moderncssm/components/main/component.js +5 -0
- package/moderncssm/components/main/index.d.ts +1 -0
- package/moderncssm/components/main/index.js +1 -0
- package/moderncssm/components/main/index.module.css +57 -0
- package/moderncssm/components/text/component.d.ts +0 -0
- package/moderncssm/components/text/component.js +6 -0
- package/moderncssm/components/text/index.d.ts +1 -0
- package/moderncssm/components/text/index.js +1 -0
- package/moderncssm/components/text/index.module.css +38 -0
- package/moderncssm/components/types.d.ts +21 -0
- package/moderncssm/components/types.js +1 -0
- package/moderncssm/components/typesProps.d.ts +46 -0
- package/moderncssm/components/typesProps.js +1 -0
- package/moderncssm/index.d.ts +2 -0
- package/moderncssm/index.js +1 -0
- package/moderncssm/index.module.css +128 -0
- package/moderncssm/shared/index.d.ts +1 -0
- package/moderncssm/shared/index.js +1 -0
- package/moderncssm/utils.d.ts +20 -0
- package/moderncssm/utils.js +25 -0
- package/moderncssm/vars.css +2 -0
- package/package.json +7 -7
- package/src/components/amount/index.module.css +1 -1
- package/src/components/amount-title/index.module.css +1 -1
- package/src/components/category/index.module.css +1 -1
- package/src/components/content/index.module.css +1 -1
- package/src/components/footer/index.module.css +1 -1
- package/src/components/footer-button/index.module.css +1 -1
- package/src/components/text/index.module.css +1 -1
- package/src/index.module.css +1 -1
- package/src/vars.css +1 -1
- /package/{component-50cf799c.d.ts → component-4a29a846.d.ts} +0 -0
- /package/esm/{component-7d6886c9.d.ts → component-9fead930.d.ts} +0 -0
- /package/modern/{component-f5e0c9cb.d.ts → component-e2f28ea5.d.ts} +0 -0
package/modern/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: icytn */
|
|
2
2
|
:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
3
3
|
} /* deprecated */ :root {
|
|
4
4
|
--color-light-status-info: #2288fa; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
@@ -28,17 +28,17 @@
|
|
|
28
28
|
} :root {
|
|
29
29
|
} :root {
|
|
30
30
|
--focus-color: var(--color-light-status-info);
|
|
31
|
-
} .pure-
|
|
31
|
+
} .pure-cell__component_t6x3e {
|
|
32
32
|
text-align: unset;
|
|
33
33
|
box-sizing: border-box;
|
|
34
|
-
} .pure-
|
|
34
|
+
} .pure-cell__horizontal_t6x3e {
|
|
35
35
|
display: flex;
|
|
36
36
|
width: 100%;
|
|
37
|
-
} .pure-
|
|
37
|
+
} .pure-cell__vertical_t6x3e {
|
|
38
38
|
display: flex;
|
|
39
39
|
align-items: center;
|
|
40
40
|
flex-direction: column;
|
|
41
|
-
} .pure-
|
|
41
|
+
} .pure-cell__button_t6x3e {
|
|
42
42
|
font-family: inherit;
|
|
43
43
|
background: none;
|
|
44
44
|
border: 0;
|
|
@@ -46,57 +46,57 @@
|
|
|
46
46
|
cursor: pointer;
|
|
47
47
|
transition: opacity 0.15s ease-in-out;
|
|
48
48
|
padding: 0
|
|
49
|
-
} .pure-
|
|
49
|
+
} .pure-cell__button_t6x3e.pure-cell__hover_t6x3e {
|
|
50
50
|
opacity: 0.8;
|
|
51
|
-
} .pure-
|
|
51
|
+
} .pure-cell__button_t6x3e.pure-cell__active_t6x3e {
|
|
52
52
|
opacity: 0.6;
|
|
53
|
-
} .pure-
|
|
53
|
+
} .pure-cell__link_t6x3e {
|
|
54
54
|
text-decoration: none;
|
|
55
55
|
color: inherit;
|
|
56
56
|
cursor: pointer;
|
|
57
57
|
transition: opacity 0.15s ease-in-out
|
|
58
|
-
} .pure-
|
|
58
|
+
} .pure-cell__link_t6x3e.pure-cell__hover_t6x3e {
|
|
59
59
|
opacity: 0.8;
|
|
60
|
-
} .pure-
|
|
60
|
+
} .pure-cell__link_t6x3e.pure-cell__active_t6x3e {
|
|
61
61
|
opacity: 0.6;
|
|
62
|
-
} .pure-
|
|
62
|
+
} .pure-cell__none_t6x3e {
|
|
63
63
|
padding: 0;
|
|
64
|
-
} .pure-
|
|
64
|
+
} .pure-cell__airy_t6x3e {
|
|
65
65
|
padding: var(--gap-16) 0;
|
|
66
|
-
} .pure-
|
|
66
|
+
} .pure-cell__default_t6x3e {
|
|
67
67
|
padding: var(--gap-12) 0;
|
|
68
|
-
} .pure-
|
|
68
|
+
} .pure-cell__compact_t6x3e {
|
|
69
69
|
padding: var(--gap-8) 0;
|
|
70
|
-
} .pure-
|
|
70
|
+
} .pure-cell__tiny_t6x3e {
|
|
71
71
|
padding: var(--gap-4) 0;
|
|
72
|
-
} .pure-
|
|
72
|
+
} .pure-cell__noneTop_t6x3e {
|
|
73
73
|
padding-top: 0;
|
|
74
|
-
} .pure-
|
|
74
|
+
} .pure-cell__airyTop_t6x3e {
|
|
75
75
|
padding-top: var(--gap-16);
|
|
76
|
-
} .pure-
|
|
76
|
+
} .pure-cell__defaultTop_t6x3e {
|
|
77
77
|
padding-top: var(--gap-12);
|
|
78
|
-
} .pure-
|
|
78
|
+
} .pure-cell__compactTop_t6x3e {
|
|
79
79
|
padding-top: var(--gap-8);
|
|
80
|
-
} .pure-
|
|
80
|
+
} .pure-cell__tinyTop_t6x3e {
|
|
81
81
|
padding-top: var(--gap-4);
|
|
82
|
-
} .pure-
|
|
82
|
+
} .pure-cell__noneBottom_t6x3e {
|
|
83
83
|
padding-bottom: 0;
|
|
84
|
-
} .pure-
|
|
84
|
+
} .pure-cell__airyBottom_t6x3e {
|
|
85
85
|
padding-bottom: var(--gap-16);
|
|
86
|
-
} .pure-
|
|
86
|
+
} .pure-cell__defaultBottom_t6x3e {
|
|
87
87
|
padding-bottom: var(--gap-12);
|
|
88
|
-
} .pure-
|
|
88
|
+
} .pure-cell__compactBottom_t6x3e {
|
|
89
89
|
padding-bottom: var(--gap-8);
|
|
90
|
-
} .pure-
|
|
90
|
+
} .pure-cell__tinyBottom_t6x3e {
|
|
91
91
|
padding-bottom: var(--gap-4);
|
|
92
|
-
} .pure-
|
|
92
|
+
} .pure-cell__left_t6x3e {
|
|
93
93
|
padding-left: var(--gap-16);
|
|
94
|
-
} .pure-
|
|
94
|
+
} .pure-cell__right_t6x3e {
|
|
95
95
|
padding-right: var(--gap-16);
|
|
96
|
-
} .pure-
|
|
96
|
+
} .pure-cell__both_t6x3e {
|
|
97
97
|
padding-right: var(--gap-16);
|
|
98
98
|
padding-left: var(--gap-16);
|
|
99
|
-
} .pure-
|
|
99
|
+
} .pure-cell__focused_t6x3e {
|
|
100
100
|
outline: 2px solid var(--focus-color);
|
|
101
101
|
outline-offset: 2px;
|
|
102
102
|
}
|
package/modern/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { P as PureCell } from './component-
|
|
1
|
+
export { P as PureCell } from './component-e2f28ea5.js';
|
|
@@ -0,0 +1,227 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { ReactNode, AnchorHTMLAttributes, ButtonHTMLAttributes } from "react";
|
|
4
|
+
import { MainElement, GraphicsElement, FooterElement, ContentElement, AddonElement } from "./components/types";
|
|
5
|
+
import { Color, TitleProps } from "@alfalab/core-components-typography";
|
|
6
|
+
import { ButtonProps } from "@alfalab/core-components-button";
|
|
7
|
+
import { AmountProps as AmountType } from "./components/typesProps";
|
|
8
|
+
type Props = {
|
|
9
|
+
/**
|
|
10
|
+
* Компоненты
|
|
11
|
+
*/
|
|
12
|
+
children: MainElement;
|
|
13
|
+
/**
|
|
14
|
+
* Позволяет изменить расположение блоков внутри main
|
|
15
|
+
*/
|
|
16
|
+
isReverse?: boolean;
|
|
17
|
+
/**
|
|
18
|
+
* Дополнительный класс
|
|
19
|
+
*/
|
|
20
|
+
className?: string;
|
|
21
|
+
/**
|
|
22
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
23
|
+
* Используется модификатор -main
|
|
24
|
+
*/
|
|
25
|
+
dataTestId?: string;
|
|
26
|
+
/**
|
|
27
|
+
* Клик по контенту.
|
|
28
|
+
*/
|
|
29
|
+
onClick?: () => void;
|
|
30
|
+
};
|
|
31
|
+
declare const Main: React.FC<Props>;
|
|
32
|
+
type Props$0 = {
|
|
33
|
+
/**
|
|
34
|
+
* Компоненты
|
|
35
|
+
*/
|
|
36
|
+
children: GraphicsElement;
|
|
37
|
+
/**
|
|
38
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
39
|
+
* Используется модификатор -graphics
|
|
40
|
+
*/
|
|
41
|
+
dataTestId?: string;
|
|
42
|
+
/**
|
|
43
|
+
* Вертикальное выравнивание
|
|
44
|
+
*/
|
|
45
|
+
verticalAlign?: "top" | "center" | "bottom";
|
|
46
|
+
/**
|
|
47
|
+
* Отступ от графики
|
|
48
|
+
*/
|
|
49
|
+
graphicPadding?: "airy" | "default" | "compact" | "tiny" | "none";
|
|
50
|
+
/**
|
|
51
|
+
* Клик по контенту графики.
|
|
52
|
+
*/
|
|
53
|
+
onClick?: () => void;
|
|
54
|
+
};
|
|
55
|
+
declare const Graphics: React.FC<Props$0>;
|
|
56
|
+
type FooterTextProps = {
|
|
57
|
+
/**
|
|
58
|
+
* Цвет текста
|
|
59
|
+
*/
|
|
60
|
+
color?: Color;
|
|
61
|
+
/**
|
|
62
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
63
|
+
* Используется модификатор -footer-title
|
|
64
|
+
*/
|
|
65
|
+
dataTestId?: string;
|
|
66
|
+
/**
|
|
67
|
+
* Дочерние элементы.
|
|
68
|
+
*/
|
|
69
|
+
children?: ReactNode;
|
|
70
|
+
};
|
|
71
|
+
declare const FooterText: React.FC<FooterTextProps>;
|
|
72
|
+
type ComponentProps = Omit<ButtonProps, "dataTestId"> & {
|
|
73
|
+
/**
|
|
74
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
75
|
+
* Используется модификатор -button
|
|
76
|
+
*/
|
|
77
|
+
dataTestId?: string;
|
|
78
|
+
};
|
|
79
|
+
type FooterButtonProps = ComponentProps & Partial<AnchorHTMLAttributes<HTMLAnchorElement> | ButtonHTMLAttributes<HTMLButtonElement>>;
|
|
80
|
+
declare const FooterButton: React.ForwardRefExoticComponent<FooterButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
|
|
81
|
+
type Props$1 = {
|
|
82
|
+
/**
|
|
83
|
+
* Компоненты
|
|
84
|
+
*/
|
|
85
|
+
children: FooterElement;
|
|
86
|
+
/**
|
|
87
|
+
* Вертикальные отступы
|
|
88
|
+
*/
|
|
89
|
+
footerPadding?: "default" | "none";
|
|
90
|
+
/**
|
|
91
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
92
|
+
* Используется модификатор -footer
|
|
93
|
+
*/
|
|
94
|
+
dataTestId?: string;
|
|
95
|
+
};
|
|
96
|
+
declare const Footer: React.FC<Props$1>;
|
|
97
|
+
type Props$2 = {
|
|
98
|
+
/**
|
|
99
|
+
* Компоненты
|
|
100
|
+
*/
|
|
101
|
+
children: ContentElement;
|
|
102
|
+
/**
|
|
103
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
104
|
+
* Используется модификатор -content
|
|
105
|
+
*/
|
|
106
|
+
dataTestId?: string;
|
|
107
|
+
};
|
|
108
|
+
declare const Content: React.FC<Props$2>;
|
|
109
|
+
type Props$3 = {
|
|
110
|
+
/**
|
|
111
|
+
* Наименование категории
|
|
112
|
+
*/
|
|
113
|
+
categoryName: string;
|
|
114
|
+
/**
|
|
115
|
+
* Процент категории
|
|
116
|
+
*/
|
|
117
|
+
categoryPercent?: number;
|
|
118
|
+
/**
|
|
119
|
+
* Слот справа
|
|
120
|
+
*/
|
|
121
|
+
rightAddons?: ReactNode;
|
|
122
|
+
/**
|
|
123
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
124
|
+
* Для наименования категории используется модификатор -category-name,
|
|
125
|
+
* процент категории -category-percent, слота справа -category-right-addon
|
|
126
|
+
*/
|
|
127
|
+
dataTestId?: string;
|
|
128
|
+
};
|
|
129
|
+
declare const Category: React.FC<Props$3>;
|
|
130
|
+
type Props$4 = {
|
|
131
|
+
/**
|
|
132
|
+
* Цвет денежного значения
|
|
133
|
+
* @deprecated Используйте titleProps.color
|
|
134
|
+
*/
|
|
135
|
+
color?: Color;
|
|
136
|
+
/**
|
|
137
|
+
* Пропсы, которые будут прокинуты в компонент типографики
|
|
138
|
+
*/
|
|
139
|
+
titleProps?: TitleProps;
|
|
140
|
+
/**
|
|
141
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
142
|
+
* Для typography используется модификатор -amount-title, для компонента Amount -core-amount-title
|
|
143
|
+
*/
|
|
144
|
+
dataTestId?: string;
|
|
145
|
+
} & Omit<AmountType, "dataTestId">;
|
|
146
|
+
declare const AmountTitle: React.FC<Props$4>;
|
|
147
|
+
type Props$5 = {
|
|
148
|
+
/**
|
|
149
|
+
* Начертание шрифта денежного значения
|
|
150
|
+
*/
|
|
151
|
+
weight?: "bold" | "normal";
|
|
152
|
+
/**
|
|
153
|
+
* Размер денежного значения
|
|
154
|
+
*/
|
|
155
|
+
textView?: "component" | "primary-small";
|
|
156
|
+
/**
|
|
157
|
+
* Цвет денежного значения
|
|
158
|
+
*/
|
|
159
|
+
color?: Color;
|
|
160
|
+
/**
|
|
161
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
162
|
+
* Для typography используется модификатор -amount-text, для компонента Amount -amount
|
|
163
|
+
*/
|
|
164
|
+
dataTestId?: string;
|
|
165
|
+
} & Omit<AmountType, "dataTestId">;
|
|
166
|
+
declare const Amount: React.FC<Props$5>;
|
|
167
|
+
type Props$6 = {
|
|
168
|
+
/**
|
|
169
|
+
* Вертикальное выравнивание
|
|
170
|
+
*/
|
|
171
|
+
verticalAlign?: "auto" | "top" | "center" | "bottom";
|
|
172
|
+
/**
|
|
173
|
+
* Горизонтальные отступы
|
|
174
|
+
*/
|
|
175
|
+
addonPadding?: "default" | "none";
|
|
176
|
+
/**
|
|
177
|
+
* Компоненты
|
|
178
|
+
*/
|
|
179
|
+
children: AddonElement;
|
|
180
|
+
/**
|
|
181
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
182
|
+
* Используется модификатор -addon
|
|
183
|
+
*/
|
|
184
|
+
dataTestId?: string;
|
|
185
|
+
/**
|
|
186
|
+
* Клик по контенту аддона.
|
|
187
|
+
*/
|
|
188
|
+
onClick?: () => void;
|
|
189
|
+
};
|
|
190
|
+
declare const Addon: React.FC<Props$6>;
|
|
191
|
+
type Props$7 = {
|
|
192
|
+
/**
|
|
193
|
+
* Контент
|
|
194
|
+
*/
|
|
195
|
+
children?: ReactNode;
|
|
196
|
+
/**
|
|
197
|
+
* Количество строк
|
|
198
|
+
*/
|
|
199
|
+
rowLimit?: 1 | 2;
|
|
200
|
+
/**
|
|
201
|
+
* Размер текста
|
|
202
|
+
*/
|
|
203
|
+
view?: 'primary-large' | 'primary-medium' | 'primary-small' | 'component' | 'component-primary' | 'secondary-large';
|
|
204
|
+
/**
|
|
205
|
+
* Толщина title
|
|
206
|
+
*/
|
|
207
|
+
titleWeight?: 'regular' | 'bold';
|
|
208
|
+
/**
|
|
209
|
+
* Цвет title
|
|
210
|
+
*/
|
|
211
|
+
titleColor: Color;
|
|
212
|
+
/**
|
|
213
|
+
* Value ячейки
|
|
214
|
+
*/
|
|
215
|
+
value?: ReactNode;
|
|
216
|
+
/**
|
|
217
|
+
* Цвет value
|
|
218
|
+
*/
|
|
219
|
+
valueColor?: Color;
|
|
220
|
+
/**
|
|
221
|
+
* Идентификатор для систем автоматизированного тестирования.
|
|
222
|
+
* Для контента используется модификатор -text_content, для value ячейки -text_value
|
|
223
|
+
*/
|
|
224
|
+
dataTestId?: string;
|
|
225
|
+
};
|
|
226
|
+
declare const Text: React.FC<Props$7>;
|
|
227
|
+
export { Main, Props$0 as Props, Graphics, FooterTextProps, FooterText, FooterButton, Footer, Content, Category, AmountTitle, Amount, Addon, Text };
|
|
@@ -0,0 +1,252 @@
|
|
|
1
|
+
import React, { useContext, forwardRef, useRef, useState } from 'react';
|
|
2
|
+
import mergeRefs from 'react-merge-refs';
|
|
3
|
+
import cn from 'classnames';
|
|
4
|
+
import { Comment } from '@alfalab/core-components-comment/moderncssm';
|
|
5
|
+
import { useFocus } from '@alfalab/hooks';
|
|
6
|
+
import { getDataTestId } from '@alfalab/core-components-shared/moderncssm';
|
|
7
|
+
import { Amount as Amount$1 } from '@alfalab/core-components-amount/moderncssm';
|
|
8
|
+
import { Typography } from '@alfalab/core-components-typography/moderncssm';
|
|
9
|
+
import styles$1 from './components/amount/index.module.css';
|
|
10
|
+
import styles$2 from './components/amount-title/index.module.css';
|
|
11
|
+
import styles$3 from './components/category/index.module.css';
|
|
12
|
+
import styles$4 from './components/content/index.module.css';
|
|
13
|
+
import styles$5 from './components/footer/index.module.css';
|
|
14
|
+
import { Button } from '@alfalab/core-components-button/moderncssm';
|
|
15
|
+
import styles$6 from './components/footer-button/index.module.css';
|
|
16
|
+
import styles$7 from './components/graphics/index.module.css';
|
|
17
|
+
import styles$8 from './components/main/index.module.css';
|
|
18
|
+
import styles$9 from './components/text/index.module.css';
|
|
19
|
+
import styles$a from './index.module.css';
|
|
20
|
+
import styles from './components/addon/index.module.css';
|
|
21
|
+
|
|
22
|
+
const ADDON_COMPONENT = {
|
|
23
|
+
button: 'button',
|
|
24
|
+
section: 'section',
|
|
25
|
+
};
|
|
26
|
+
const Addon = ({ children, verticalAlign = 'top', addonPadding = 'default', dataTestId, onClick, }) => {
|
|
27
|
+
const pureCellContext = useContext(PureCellContext);
|
|
28
|
+
const Component = onClick ? ADDON_COMPONENT.button : ADDON_COMPONENT.section;
|
|
29
|
+
const onMouseEvents = {
|
|
30
|
+
onClick: (e) => {
|
|
31
|
+
e.stopPropagation();
|
|
32
|
+
onClick?.();
|
|
33
|
+
},
|
|
34
|
+
onMouseEnter: () => {
|
|
35
|
+
pureCellContext.unsetMainHover?.();
|
|
36
|
+
},
|
|
37
|
+
onMouseLeave: () => {
|
|
38
|
+
pureCellContext.setMainHover?.();
|
|
39
|
+
},
|
|
40
|
+
onMouseDown: (e) => {
|
|
41
|
+
e.stopPropagation();
|
|
42
|
+
},
|
|
43
|
+
};
|
|
44
|
+
return (React.createElement(Component, { className: cn(styles.component, styles[addonPadding], styles[verticalAlign], {
|
|
45
|
+
[styles.button]: onClick,
|
|
46
|
+
}), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'addon'), ...(onClick && onMouseEvents) }, children));
|
|
47
|
+
};
|
|
48
|
+
|
|
49
|
+
const Amount = ({ weight = 'normal', textView = 'component', color = 'primary', minority, minorUnits = 100, dataTestId, ...restProps }) => {
|
|
50
|
+
const pureCellContext = useContext(PureCellContext);
|
|
51
|
+
return (React.createElement(Typography.Text, { view: textView, dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount-text'), className: cn(styles$1.component), color: color },
|
|
52
|
+
React.createElement(Amount$1, { minority: minority || minorUnits, bold: weight === 'bold' ? 'full' : 'none', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount'), ...restProps })));
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
const AmountTitle = ({ minority, minorUnits = 100, className, color = 'primary', dataTestId, titleProps = {}, ...restProps }) => {
|
|
56
|
+
const pureCellContext = useContext(PureCellContext);
|
|
57
|
+
const titleDefaultProps = {
|
|
58
|
+
tag: 'h4',
|
|
59
|
+
view: 'small',
|
|
60
|
+
color,
|
|
61
|
+
...titleProps,
|
|
62
|
+
};
|
|
63
|
+
return (React.createElement(Typography.TitleResponsive, { ...titleDefaultProps, dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'amount-title'), className: cn(styles$2.component, titleProps.className) },
|
|
64
|
+
React.createElement(Amount$1, { minority: minority || minorUnits, className: cn(styles$2.weight, className), dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'core-amount-title'), ...restProps, bold: 'none' })));
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
const Category = ({ categoryName, categoryPercent, rightAddons, dataTestId, }) => {
|
|
68
|
+
const pureCellContext = useContext(PureCellContext);
|
|
69
|
+
return (React.createElement("div", { className: styles$3.component, "data-test-id": 'cell-pure-category' },
|
|
70
|
+
React.createElement(Typography.Text, { view: 'primary-small', color: 'secondary', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'category-name'), className: styles$3.categoryName }, categoryName),
|
|
71
|
+
categoryPercent !== undefined && (React.createElement(Typography.Text, { tag: 'div', view: 'primary-small', color: 'secondary', className: styles$3.categoryPercent, dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'category-percent') },
|
|
72
|
+
categoryPercent,
|
|
73
|
+
"%")),
|
|
74
|
+
rightAddons !== undefined && (React.createElement("div", { className: styles$3.rightAddon, "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'category-right-addon') }, rightAddons))));
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
const Content = ({ children, dataTestId }) => {
|
|
78
|
+
const { direction, dataTestId: contextDataTestId } = useContext(PureCellContext);
|
|
79
|
+
return (React.createElement("section", { className: cn(styles$4.component, { [styles$4.horizontal]: direction === 'horizontal' }), "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'content') }, children));
|
|
80
|
+
};
|
|
81
|
+
|
|
82
|
+
const Footer = ({ children, footerPadding = 'default', dataTestId }) => {
|
|
83
|
+
const pureCellContext = useContext(PureCellContext);
|
|
84
|
+
return (React.createElement("footer", { className: cn(styles$5.component, styles$5[footerPadding]), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'footer') }, children));
|
|
85
|
+
};
|
|
86
|
+
|
|
87
|
+
const FooterButton = forwardRef(({ children, dataTestId, onClick, onMouseDown, onMouseEnter, onMouseLeave, ...props }, ref) => {
|
|
88
|
+
const pureCellContext = useContext(PureCellContext);
|
|
89
|
+
const handleClick = (e) => {
|
|
90
|
+
e.stopPropagation();
|
|
91
|
+
onClick?.(e);
|
|
92
|
+
};
|
|
93
|
+
const handleMouseEnter = (e) => {
|
|
94
|
+
onMouseEnter?.(e);
|
|
95
|
+
pureCellContext.unsetMainHover?.();
|
|
96
|
+
};
|
|
97
|
+
const handleMouseLeave = (e) => {
|
|
98
|
+
onMouseLeave?.(e);
|
|
99
|
+
pureCellContext.setMainHover?.();
|
|
100
|
+
};
|
|
101
|
+
const handleMouseDown = (e) => {
|
|
102
|
+
onMouseDown?.(e);
|
|
103
|
+
e.stopPropagation();
|
|
104
|
+
};
|
|
105
|
+
return (React.createElement(Button, { ...props, size: 'xxs', dataTestId: getDataTestId(dataTestId || pureCellContext.dataTestId, 'button'), className: styles$6.component, ref: ref, onClick: handleClick, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onMouseDown: handleMouseDown }, children));
|
|
106
|
+
});
|
|
107
|
+
|
|
108
|
+
const FooterText = ({ children, color = 'secondary', dataTestId, }) => {
|
|
109
|
+
const pureCellContext = useContext(PureCellContext);
|
|
110
|
+
return (React.createElement(Typography.Text, { view: 'primary-small', color: color, "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'footer-title') }, children));
|
|
111
|
+
};
|
|
112
|
+
|
|
113
|
+
const GRAPHICS_COMPONENT = {
|
|
114
|
+
button: 'button',
|
|
115
|
+
section: 'section',
|
|
116
|
+
};
|
|
117
|
+
const Graphics = ({ children, dataTestId, verticalAlign = 'top', graphicPadding, onClick, }) => {
|
|
118
|
+
const pureCellContext = useContext(PureCellContext);
|
|
119
|
+
const Component = onClick ? GRAPHICS_COMPONENT.button : GRAPHICS_COMPONENT.section;
|
|
120
|
+
const defaultGraphicPadding = pureCellContext.direction === 'horizontal' ? 'airy' : 'default';
|
|
121
|
+
const onMouseEvents = {
|
|
122
|
+
onClick: (e) => {
|
|
123
|
+
e.stopPropagation();
|
|
124
|
+
onClick?.();
|
|
125
|
+
},
|
|
126
|
+
onMouseEnter: () => {
|
|
127
|
+
pureCellContext.unsetMainHover?.();
|
|
128
|
+
},
|
|
129
|
+
onMouseLeave: () => {
|
|
130
|
+
pureCellContext.setMainHover?.();
|
|
131
|
+
},
|
|
132
|
+
onMouseDown: (e) => {
|
|
133
|
+
e.stopPropagation();
|
|
134
|
+
},
|
|
135
|
+
};
|
|
136
|
+
return (React.createElement(Component, { className: cn(styles$7.component, styles$7[verticalAlign], styles$7[pureCellContext.direction || 'horizontal'], styles$7[graphicPadding || defaultGraphicPadding], { [styles$7.button]: onClick }), "data-test-id": getDataTestId(dataTestId || pureCellContext.dataTestId, 'graphics'), ...(onClick && onMouseEvents) }, children));
|
|
137
|
+
};
|
|
138
|
+
|
|
139
|
+
const MAIN_COMPONENT = {
|
|
140
|
+
button: 'button',
|
|
141
|
+
section: 'section',
|
|
142
|
+
};
|
|
143
|
+
const Main = ({ children, isReverse, className, dataTestId, onClick }) => {
|
|
144
|
+
const { direction = 'horizontal', dataTestId: contextDataTestId, setMainHover, unsetMainHover, } = useContext(PureCellContext);
|
|
145
|
+
const Component = onClick ? MAIN_COMPONENT.button : MAIN_COMPONENT.section;
|
|
146
|
+
const onMouseEvents = {
|
|
147
|
+
onClick: (e) => {
|
|
148
|
+
e.stopPropagation();
|
|
149
|
+
onClick?.();
|
|
150
|
+
},
|
|
151
|
+
onMouseEnter: () => {
|
|
152
|
+
unsetMainHover?.();
|
|
153
|
+
},
|
|
154
|
+
onMouseLeave: () => {
|
|
155
|
+
setMainHover?.();
|
|
156
|
+
},
|
|
157
|
+
onMouseDown: (e) => {
|
|
158
|
+
e.stopPropagation();
|
|
159
|
+
},
|
|
160
|
+
};
|
|
161
|
+
return (React.createElement(Component, { className: cn(styles$8.component, styles$8[direction], {
|
|
162
|
+
[styles$8.reverse]: isReverse,
|
|
163
|
+
}, { [styles$8.button]: onClick }, className), "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'main'), ...(onClick && onMouseEvents) }, children));
|
|
164
|
+
};
|
|
165
|
+
|
|
166
|
+
const Text = ({ children, value, rowLimit, view = 'component-primary', titleWeight, titleColor, valueColor, dataTestId, }) => {
|
|
167
|
+
const { direction = 'horizontal', dataTestId: contextDataTestId } = useContext(PureCellContext);
|
|
168
|
+
const className = rowLimit && styles$9[`rowLimit${rowLimit}`];
|
|
169
|
+
return (React.createElement("div", { className: cn(styles$9.component, {
|
|
170
|
+
[styles$9.vertical]: direction !== 'horizontal',
|
|
171
|
+
}) },
|
|
172
|
+
React.createElement("div", { className: styles$9.title },
|
|
173
|
+
React.createElement(Typography.Text, { view: view, weight: titleWeight, tag: 'div', color: titleColor, className: className, "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'text_content') }, children)),
|
|
174
|
+
value && (React.createElement("div", { className: styles$9.value },
|
|
175
|
+
React.createElement(Typography.Text, { view: view, tag: 'div', color: valueColor, className: className, "data-test-id": getDataTestId(dataTestId || contextDataTestId, 'text_value') }, value)))));
|
|
176
|
+
};
|
|
177
|
+
|
|
178
|
+
/* eslint-disable react/jsx-no-constructed-context-values */
|
|
179
|
+
// eslint-disable-next-line @typescript-eslint/no-redeclare
|
|
180
|
+
const PureCellContext = React.createContext({});
|
|
181
|
+
const PureCellComponent = forwardRef(({ className, dataTestId, onClick, href, tag: Component = (href && 'a') || (onClick && 'button') || 'section', children, horizontalPadding = 'none', verticalPadding = 'none', direction = 'horizontal', ...restProps }, ref) => {
|
|
182
|
+
const cellRef = useRef(null);
|
|
183
|
+
const [focused] = useFocus(cellRef, 'keyboard');
|
|
184
|
+
const [hoverState, setHoverState] = useState(false);
|
|
185
|
+
const [activeState, setActiveState] = useState(false);
|
|
186
|
+
const setHover = () => setHoverState(true);
|
|
187
|
+
const unsetHover = () => setHoverState(false);
|
|
188
|
+
const setActive = () => setActiveState(true);
|
|
189
|
+
const unsetActive = () => setActiveState(false);
|
|
190
|
+
const mouseEvents = {
|
|
191
|
+
onMouseEnter: setHover,
|
|
192
|
+
onMouseLeave: unsetHover,
|
|
193
|
+
onMouseDown: setActive,
|
|
194
|
+
onMouseUp: unsetActive,
|
|
195
|
+
};
|
|
196
|
+
const addClasses = {
|
|
197
|
+
[styles$a.component]: true,
|
|
198
|
+
[styles$a.focused]: focused,
|
|
199
|
+
[styles$a[direction]]: true,
|
|
200
|
+
[styles$a[horizontalPadding]]: true,
|
|
201
|
+
[styles$a.hover]: hoverState,
|
|
202
|
+
[styles$a.active]: activeState,
|
|
203
|
+
};
|
|
204
|
+
const contextState = {
|
|
205
|
+
direction,
|
|
206
|
+
dataTestId,
|
|
207
|
+
setMainHover: setHover,
|
|
208
|
+
unsetMainHover: unsetHover,
|
|
209
|
+
};
|
|
210
|
+
if (typeof verticalPadding === 'string') {
|
|
211
|
+
addClasses[styles$a[verticalPadding]] = typeof verticalPadding === 'string';
|
|
212
|
+
}
|
|
213
|
+
if (typeof verticalPadding === 'object') {
|
|
214
|
+
addClasses[styles$a[`${verticalPadding.top}Top`]] = !!verticalPadding.top;
|
|
215
|
+
addClasses[styles$a[`${verticalPadding.bottom}Bottom`]] = !!verticalPadding.bottom;
|
|
216
|
+
}
|
|
217
|
+
if (href) {
|
|
218
|
+
const { target } = restProps;
|
|
219
|
+
// Для совместимости с react-router-dom, меняем href на to
|
|
220
|
+
const hrefProps = { [typeof Component === 'string' ? 'href' : 'to']: href };
|
|
221
|
+
return (React.createElement(Component, { rel: target === '_blank' ? 'noreferrer noopener' : undefined, ...restProps, ...hrefProps, ref: mergeRefs([cellRef, ref]), className: cn(styles$a.link, addClasses, className), "data-test-id": dataTestId, onClick: onClick, ...mouseEvents },
|
|
222
|
+
React.createElement(PureCellContext.Provider, { value: contextState }, children)));
|
|
223
|
+
}
|
|
224
|
+
if (onClick) {
|
|
225
|
+
return (React.createElement(Component, { ...restProps, ref: mergeRefs([cellRef, ref]), className: cn(styles$a.button, addClasses, className), "data-test-id": dataTestId, onClick: onClick, ...mouseEvents },
|
|
226
|
+
React.createElement(PureCellContext.Provider, { value: contextState }, children)));
|
|
227
|
+
}
|
|
228
|
+
return (React.createElement(Component, { ...restProps, ref: ref, tabIndex: 0, className: cn(addClasses, className), "data-test-id": dataTestId },
|
|
229
|
+
React.createElement(PureCellContext.Provider, { value: contextState }, children)));
|
|
230
|
+
});
|
|
231
|
+
/**
|
|
232
|
+
* Универсальный конструктор для сборки любой ячейки.
|
|
233
|
+
*
|
|
234
|
+
* [Макет](https://www.figma.com/file/KlFOLLkKO8rtvvQE3RXuhq/Click-Library?node-id=43525%3A240018)
|
|
235
|
+
*/
|
|
236
|
+
const PureCell = Object.assign(PureCellComponent, {
|
|
237
|
+
Main,
|
|
238
|
+
Graphics,
|
|
239
|
+
Content,
|
|
240
|
+
Text,
|
|
241
|
+
Amount,
|
|
242
|
+
AmountTitle,
|
|
243
|
+
Addon,
|
|
244
|
+
Footer,
|
|
245
|
+
ExtraSubtitle: FooterText,
|
|
246
|
+
FooterButton,
|
|
247
|
+
Comment,
|
|
248
|
+
Category,
|
|
249
|
+
});
|
|
250
|
+
PureCellComponent.displayName = 'PureCellComponent';
|
|
251
|
+
|
|
252
|
+
export { Addon as A, Category as C, Footer as F, Graphics as G, Main as M, PureCell as P, Text as T, Amount as a, AmountTitle as b, Content as c, FooterButton as d, FooterText as e, PureCellContext as f };
|