@e1011/es-kit 1.0.216 → 1.0.220
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/dist/hooks/esm/index.css +76 -24
- package/dist/hooks/index.css +76 -24
- package/dist/lib/cjs/index.css +83 -31
- package/dist/lib/cjs/src/core/ui/components/container/CollapsibleContainer.js.map +1 -1
- package/dist/lib/cjs/src/core/ui/components/container/ResizableContainer.js +1 -1
- package/dist/lib/cjs/src/core/ui/components/container/ResizableContainer.js.map +1 -1
- package/dist/lib/cjs/src/core/ui/components/container/layoutBox/LayoutBox.js +2 -0
- package/dist/lib/cjs/src/core/ui/components/container/layoutBox/LayoutBox.js.map +1 -0
- package/dist/lib/cjs/src/core/ui/components/container/{layoutBox.module.scss.js → layoutBox/layoutBox.module.scss.js} +1 -1
- package/dist/lib/cjs/src/core/ui/components/container/layoutBox/layoutBox.types.js.map +1 -0
- package/dist/lib/cjs/src/core/ui/components/container/lazyComponent/LazyComponent.js +2 -0
- package/dist/lib/cjs/src/core/ui/components/container/lazyComponent/LazyComponent.js.map +1 -0
- package/dist/lib/cjs/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js +2 -0
- package/dist/lib/cjs/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js.map +1 -0
- package/dist/lib/cjs/src/core/ui/components/dividers/DividerLine.js.map +1 -1
- package/dist/lib/cjs/src/core/ui/components/error/ErrorBoundary.js +2 -0
- package/dist/lib/cjs/src/core/ui/components/error/ErrorBoundary.js.map +1 -0
- package/dist/lib/cjs/src/core/ui/components/error/errorBoundary.module.scss.js +2 -0
- package/dist/lib/cjs/src/core/ui/components/error/errorBoundary.module.scss.js.map +1 -0
- package/dist/lib/cjs/src/core/ui/components/molecules/layouts/FlowLayout.js +1 -1
- package/dist/lib/cjs/src/core/ui/components/molecules/layouts/FlowLayout.js.map +1 -1
- package/dist/lib/cjs/src/index.js +1 -1
- package/dist/lib/esm/index.css +83 -31
- package/dist/lib/esm/src/core/ui/components/container/CollapsibleContainer.js.map +1 -1
- package/dist/lib/esm/src/core/ui/components/container/ResizableContainer.js +1 -1
- package/dist/lib/esm/src/core/ui/components/container/ResizableContainer.js.map +1 -1
- package/dist/lib/esm/src/core/ui/components/container/layoutBox/LayoutBox.js +2 -0
- package/dist/lib/esm/src/core/ui/components/container/layoutBox/LayoutBox.js.map +1 -0
- package/dist/lib/esm/src/core/ui/components/container/{layoutBox.module.scss.js → layoutBox/layoutBox.module.scss.js} +1 -1
- package/dist/lib/esm/src/core/ui/components/container/layoutBox/layoutBox.types.js.map +1 -0
- package/dist/lib/esm/src/core/ui/components/container/lazyComponent/LazyComponent.js +2 -0
- package/dist/lib/esm/src/core/ui/components/container/lazyComponent/LazyComponent.js.map +1 -0
- package/dist/lib/esm/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js +2 -0
- package/dist/lib/esm/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js.map +1 -0
- package/dist/lib/esm/src/core/ui/components/dividers/DividerLine.js.map +1 -1
- package/dist/lib/esm/src/core/ui/components/error/ErrorBoundary.js +2 -0
- package/dist/lib/esm/src/core/ui/components/error/ErrorBoundary.js.map +1 -0
- package/dist/lib/esm/src/core/ui/components/error/errorBoundary.module.scss.js +2 -0
- package/dist/lib/esm/src/core/ui/components/error/errorBoundary.module.scss.js.map +1 -0
- package/dist/lib/esm/src/core/ui/components/molecules/layouts/FlowLayout.js +1 -1
- package/dist/lib/esm/src/core/ui/components/molecules/layouts/FlowLayout.js.map +1 -1
- package/dist/lib/esm/src/index.js +1 -1
- package/dist/lib/tsconfig.tsbuildinfo +1 -1
- package/dist/types/src/core/ui/components/container/CollapsibleContainer.d.ts +1 -1
- package/dist/types/src/core/ui/components/container/CollapsibleContainer.d.ts.map +1 -1
- package/dist/types/src/core/ui/components/container/ResizableContainer.d.ts +1 -1
- package/dist/types/src/core/ui/components/container/ResizableContainer.d.ts.map +1 -1
- package/dist/types/src/core/ui/components/container/index.d.ts +3 -2
- package/dist/types/src/core/ui/components/container/index.d.ts.map +1 -1
- package/dist/types/src/core/ui/components/container/layoutBox/LayoutBox.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/container/layoutBox/LayoutBox.test.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/container/layoutBox/layoutBox.types.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/container/lazyComponent/LazyComponent.d.ts +25 -0
- package/dist/types/src/core/ui/components/container/lazyComponent/LazyComponent.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/container/lazyComponent/lazyComponent.stories.d.ts +8 -0
- package/dist/types/src/core/ui/components/container/lazyComponent/lazyComponent.stories.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/dividers/DividerLine.d.ts +1 -2
- package/dist/types/src/core/ui/components/dividers/DividerLine.d.ts.map +1 -1
- package/dist/types/src/core/ui/components/error/ErrorBoundary.d.ts +16 -0
- package/dist/types/src/core/ui/components/error/ErrorBoundary.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/error/errorBoundary.stories.d.ts +6 -0
- package/dist/types/src/core/ui/components/error/errorBoundary.stories.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/error/errorBoundary.test.d.ts +5 -0
- package/dist/types/src/core/ui/components/error/errorBoundary.test.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/error/errorBoundary.types.d.ts +11 -0
- package/dist/types/src/core/ui/components/error/errorBoundary.types.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/error/index.d.ts +3 -0
- package/dist/types/src/core/ui/components/error/index.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/index.d.ts +1 -0
- package/dist/types/src/core/ui/components/index.d.ts.map +1 -1
- package/dist/types/src/core/ui/components/molecules/layouts/flowLayout.types.d.ts +1 -1
- package/dist/types/src/core/ui/components/molecules/layouts/flowLayout.types.d.ts.map +1 -1
- package/dist/ui/esm/index.css +83 -31
- package/dist/ui/esm/src/core/ui/components/container/CollapsibleContainer.js.map +1 -1
- package/dist/ui/esm/src/core/ui/components/container/ResizableContainer.js +1 -1
- package/dist/ui/esm/src/core/ui/components/container/ResizableContainer.js.map +1 -1
- package/dist/ui/esm/src/core/ui/components/container/layoutBox/LayoutBox.js +2 -0
- package/dist/ui/esm/src/core/ui/components/container/layoutBox/LayoutBox.js.map +1 -0
- package/dist/ui/esm/src/core/ui/components/container/{layoutBox.module.scss.js → layoutBox/layoutBox.module.scss.js} +1 -1
- package/dist/ui/esm/src/core/ui/components/container/layoutBox/layoutBox.types.js.map +1 -0
- package/dist/ui/esm/src/core/ui/components/container/lazyComponent/LazyComponent.js +2 -0
- package/dist/ui/esm/src/core/ui/components/container/lazyComponent/LazyComponent.js.map +1 -0
- package/dist/ui/esm/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js +2 -0
- package/dist/ui/esm/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js.map +1 -0
- package/dist/ui/esm/src/core/ui/components/dividers/DividerLine.js.map +1 -1
- package/dist/ui/esm/src/core/ui/components/error/ErrorBoundary.js +2 -0
- package/dist/ui/esm/src/core/ui/components/error/ErrorBoundary.js.map +1 -0
- package/dist/ui/esm/src/core/ui/components/error/errorBoundary.module.scss.js +2 -0
- package/dist/ui/esm/src/core/ui/components/error/errorBoundary.module.scss.js.map +1 -0
- package/dist/ui/esm/src/core/ui/components/molecules/layouts/FlowLayout.js +1 -1
- package/dist/ui/esm/src/core/ui/components/molecules/layouts/FlowLayout.js.map +1 -1
- package/dist/ui/esm/src/core/ui/index.js +1 -1
- package/dist/ui/index.css +83 -31
- package/dist/ui/src/core/ui/components/container/CollapsibleContainer.js.map +1 -1
- package/dist/ui/src/core/ui/components/container/ResizableContainer.js +1 -1
- package/dist/ui/src/core/ui/components/container/ResizableContainer.js.map +1 -1
- package/dist/ui/src/core/ui/components/container/layoutBox/LayoutBox.js +2 -0
- package/dist/ui/src/core/ui/components/container/layoutBox/LayoutBox.js.map +1 -0
- package/dist/ui/src/core/ui/components/container/{layoutBox.module.scss.js → layoutBox/layoutBox.module.scss.js} +1 -1
- package/dist/ui/src/core/ui/components/container/layoutBox/layoutBox.types.js.map +1 -0
- package/dist/ui/src/core/ui/components/container/lazyComponent/LazyComponent.js +2 -0
- package/dist/ui/src/core/ui/components/container/lazyComponent/LazyComponent.js.map +1 -0
- package/dist/ui/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js +2 -0
- package/dist/ui/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js.map +1 -0
- package/dist/ui/src/core/ui/components/dividers/DividerLine.js.map +1 -1
- package/dist/ui/src/core/ui/components/error/ErrorBoundary.js +2 -0
- package/dist/ui/src/core/ui/components/error/ErrorBoundary.js.map +1 -0
- package/dist/ui/src/core/ui/components/error/errorBoundary.module.scss.js +2 -0
- package/dist/ui/src/core/ui/components/error/errorBoundary.module.scss.js.map +1 -0
- package/dist/ui/src/core/ui/components/molecules/layouts/FlowLayout.js +1 -1
- package/dist/ui/src/core/ui/components/molecules/layouts/FlowLayout.js.map +1 -1
- package/dist/ui/src/core/ui/index.js +1 -1
- package/dist/utils/esm/index.css +76 -24
- package/dist/utils/index.css +76 -24
- package/package.json +17 -3
- package/dist/lib/cjs/src/core/ui/components/container/LayoutBox.js +0 -2
- package/dist/lib/cjs/src/core/ui/components/container/LayoutBox.js.map +0 -1
- package/dist/lib/cjs/src/core/ui/components/container/layoutBox.types.js.map +0 -1
- package/dist/lib/esm/src/core/ui/components/container/LayoutBox.js +0 -2
- package/dist/lib/esm/src/core/ui/components/container/LayoutBox.js.map +0 -1
- package/dist/lib/esm/src/core/ui/components/container/layoutBox.types.js.map +0 -1
- package/dist/types/src/core/ui/components/container/LayoutBox.d.ts.map +0 -1
- package/dist/types/src/core/ui/components/container/LayoutBox.test.d.ts.map +0 -1
- package/dist/types/src/core/ui/components/container/layoutBox.types.d.ts.map +0 -1
- package/dist/ui/esm/src/core/ui/components/container/LayoutBox.js +0 -2
- package/dist/ui/esm/src/core/ui/components/container/LayoutBox.js.map +0 -1
- package/dist/ui/esm/src/core/ui/components/container/layoutBox.types.js.map +0 -1
- package/dist/ui/src/core/ui/components/container/LayoutBox.js +0 -2
- package/dist/ui/src/core/ui/components/container/LayoutBox.js.map +0 -1
- package/dist/ui/src/core/ui/components/container/layoutBox.types.js.map +0 -1
- /package/dist/lib/cjs/src/core/ui/components/container/{layoutBox.module.scss.js.map → layoutBox/layoutBox.module.scss.js.map} +0 -0
- /package/dist/lib/cjs/src/core/ui/components/container/{layoutBox.types.js → layoutBox/layoutBox.types.js} +0 -0
- /package/dist/lib/esm/src/core/ui/components/container/{layoutBox.module.scss.js.map → layoutBox/layoutBox.module.scss.js.map} +0 -0
- /package/dist/lib/esm/src/core/ui/components/container/{layoutBox.types.js → layoutBox/layoutBox.types.js} +0 -0
- /package/dist/types/src/core/ui/components/container/{LayoutBox.d.ts → layoutBox/LayoutBox.d.ts} +0 -0
- /package/dist/types/src/core/ui/components/container/{LayoutBox.test.d.ts → layoutBox/LayoutBox.test.d.ts} +0 -0
- /package/dist/types/src/core/ui/components/container/{layoutBox.types.d.ts → layoutBox/layoutBox.types.d.ts} +0 -0
- /package/dist/ui/esm/src/core/ui/components/container/{layoutBox.module.scss.js.map → layoutBox/layoutBox.module.scss.js.map} +0 -0
- /package/dist/ui/esm/src/core/ui/components/container/{layoutBox.types.js → layoutBox/layoutBox.types.js} +0 -0
- /package/dist/ui/src/core/ui/components/container/{layoutBox.module.scss.js.map → layoutBox/layoutBox.module.scss.js.map} +0 -0
- /package/dist/ui/src/core/ui/components/container/{layoutBox.types.js → layoutBox/layoutBox.types.js} +0 -0
package/dist/hooks/esm/index.css
CHANGED
|
@@ -28,30 +28,6 @@
|
|
|
28
28
|
width: var(--height);
|
|
29
29
|
height: var(--width);
|
|
30
30
|
}
|
|
31
|
-
.layoutBox-module_layout-box__faPND {
|
|
32
|
-
display: flex;
|
|
33
|
-
position: relative;
|
|
34
|
-
flex-direction: row;
|
|
35
|
-
flex: 0;
|
|
36
|
-
flex-grow: 0;
|
|
37
|
-
flex-shrink: 0;
|
|
38
|
-
flex-basis: auto;
|
|
39
|
-
flex-wrap: nowrap;
|
|
40
|
-
gap: 0;
|
|
41
|
-
text-align: left;
|
|
42
|
-
justify-content: flex-start;
|
|
43
|
-
align-items: flex-start;
|
|
44
|
-
align-self: auto;
|
|
45
|
-
margin: 0;
|
|
46
|
-
padding: 0;
|
|
47
|
-
width: auto;
|
|
48
|
-
height: auto;
|
|
49
|
-
max-width: none;
|
|
50
|
-
max-height: none;
|
|
51
|
-
min-width: 0;
|
|
52
|
-
min-height: 0;
|
|
53
|
-
border-radius: initial;
|
|
54
|
-
}
|
|
55
31
|
.CollapsibleContainer-module_collapsible-container__u0Jmm {
|
|
56
32
|
transform-origin: 0% 0%;
|
|
57
33
|
opacity: 0;
|
|
@@ -85,6 +61,15 @@
|
|
|
85
61
|
max-width: var(--prop-value);
|
|
86
62
|
opacity: 1;
|
|
87
63
|
}
|
|
64
|
+
.errorBoundary-module_errorBoundary__gk9ps {
|
|
65
|
+
background: #EFEFEF;
|
|
66
|
+
width: 100%;
|
|
67
|
+
height: 100%;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.errorBoundary-module_StyledIcon__IYHiU {
|
|
71
|
+
margin-right: 10px;
|
|
72
|
+
}
|
|
88
73
|
.divider-module_divider-line__6CesR {
|
|
89
74
|
position: relative;
|
|
90
75
|
display: block;
|
|
@@ -104,6 +89,73 @@
|
|
|
104
89
|
height: var(--height);
|
|
105
90
|
margin: var(--margin);
|
|
106
91
|
}
|
|
92
|
+
.layoutBox-module_layout-box__ZIID8 {
|
|
93
|
+
display: flex;
|
|
94
|
+
position: relative;
|
|
95
|
+
flex-direction: row;
|
|
96
|
+
flex: 0;
|
|
97
|
+
flex-grow: 0;
|
|
98
|
+
flex-shrink: 0;
|
|
99
|
+
flex-basis: auto;
|
|
100
|
+
flex-wrap: nowrap;
|
|
101
|
+
gap: 0;
|
|
102
|
+
text-align: left;
|
|
103
|
+
justify-content: flex-start;
|
|
104
|
+
align-items: flex-start;
|
|
105
|
+
align-self: auto;
|
|
106
|
+
margin: 0;
|
|
107
|
+
padding: 0;
|
|
108
|
+
width: auto;
|
|
109
|
+
height: auto;
|
|
110
|
+
max-width: none;
|
|
111
|
+
max-height: none;
|
|
112
|
+
min-width: 0;
|
|
113
|
+
min-height: 0;
|
|
114
|
+
border-radius: initial;
|
|
115
|
+
}
|
|
116
|
+
.lazyComponent-module_loader__brMEW {
|
|
117
|
+
position: relative;
|
|
118
|
+
width: 100px;
|
|
119
|
+
height: 100px;
|
|
120
|
+
display: grid;
|
|
121
|
+
place-items: center;
|
|
122
|
+
}
|
|
123
|
+
.lazyComponent-module_loader__brMEW .spinner {
|
|
124
|
+
animation: rotate 2s linear infinite;
|
|
125
|
+
z-index: 2;
|
|
126
|
+
position: absolute;
|
|
127
|
+
top: 50%;
|
|
128
|
+
left: 50%;
|
|
129
|
+
margin: -25px 0 0 -25px;
|
|
130
|
+
width: 50px;
|
|
131
|
+
height: 50px;
|
|
132
|
+
display: grid;
|
|
133
|
+
place-items: center;
|
|
134
|
+
}
|
|
135
|
+
.lazyComponent-module_loader__brMEW .spinner .path {
|
|
136
|
+
stroke: hsl(210, 92%, 44%);
|
|
137
|
+
stroke-linecap: round;
|
|
138
|
+
animation: dash 1.5s ease-in-out infinite;
|
|
139
|
+
}
|
|
140
|
+
@keyframes rotate {
|
|
141
|
+
100% {
|
|
142
|
+
transform: rotate(360deg);
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
@keyframes dash {
|
|
146
|
+
0% {
|
|
147
|
+
stroke-dasharray: 1, 150;
|
|
148
|
+
stroke-dashoffset: 0;
|
|
149
|
+
}
|
|
150
|
+
50% {
|
|
151
|
+
stroke-dasharray: 90, 150;
|
|
152
|
+
stroke-dashoffset: -35;
|
|
153
|
+
}
|
|
154
|
+
100% {
|
|
155
|
+
stroke-dasharray: 90, 150;
|
|
156
|
+
stroke-dashoffset: -124;
|
|
157
|
+
}
|
|
158
|
+
}
|
|
107
159
|
.flowLayout-module_flowLayout__VHpnY {
|
|
108
160
|
overflow: auto;
|
|
109
161
|
}
|
package/dist/hooks/index.css
CHANGED
|
@@ -28,30 +28,6 @@
|
|
|
28
28
|
width: var(--height);
|
|
29
29
|
height: var(--width);
|
|
30
30
|
}
|
|
31
|
-
.layoutBox-module_layout-box__faPND {
|
|
32
|
-
display: flex;
|
|
33
|
-
position: relative;
|
|
34
|
-
flex-direction: row;
|
|
35
|
-
flex: 0;
|
|
36
|
-
flex-grow: 0;
|
|
37
|
-
flex-shrink: 0;
|
|
38
|
-
flex-basis: auto;
|
|
39
|
-
flex-wrap: nowrap;
|
|
40
|
-
gap: 0;
|
|
41
|
-
text-align: left;
|
|
42
|
-
justify-content: flex-start;
|
|
43
|
-
align-items: flex-start;
|
|
44
|
-
align-self: auto;
|
|
45
|
-
margin: 0;
|
|
46
|
-
padding: 0;
|
|
47
|
-
width: auto;
|
|
48
|
-
height: auto;
|
|
49
|
-
max-width: none;
|
|
50
|
-
max-height: none;
|
|
51
|
-
min-width: 0;
|
|
52
|
-
min-height: 0;
|
|
53
|
-
border-radius: initial;
|
|
54
|
-
}
|
|
55
31
|
.CollapsibleContainer-module_collapsible-container__u0Jmm {
|
|
56
32
|
transform-origin: 0% 0%;
|
|
57
33
|
opacity: 0;
|
|
@@ -85,6 +61,15 @@
|
|
|
85
61
|
max-width: var(--prop-value);
|
|
86
62
|
opacity: 1;
|
|
87
63
|
}
|
|
64
|
+
.errorBoundary-module_errorBoundary__gk9ps {
|
|
65
|
+
background: #EFEFEF;
|
|
66
|
+
width: 100%;
|
|
67
|
+
height: 100%;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.errorBoundary-module_StyledIcon__IYHiU {
|
|
71
|
+
margin-right: 10px;
|
|
72
|
+
}
|
|
88
73
|
.divider-module_divider-line__6CesR {
|
|
89
74
|
position: relative;
|
|
90
75
|
display: block;
|
|
@@ -104,6 +89,73 @@
|
|
|
104
89
|
height: var(--height);
|
|
105
90
|
margin: var(--margin);
|
|
106
91
|
}
|
|
92
|
+
.layoutBox-module_layout-box__ZIID8 {
|
|
93
|
+
display: flex;
|
|
94
|
+
position: relative;
|
|
95
|
+
flex-direction: row;
|
|
96
|
+
flex: 0;
|
|
97
|
+
flex-grow: 0;
|
|
98
|
+
flex-shrink: 0;
|
|
99
|
+
flex-basis: auto;
|
|
100
|
+
flex-wrap: nowrap;
|
|
101
|
+
gap: 0;
|
|
102
|
+
text-align: left;
|
|
103
|
+
justify-content: flex-start;
|
|
104
|
+
align-items: flex-start;
|
|
105
|
+
align-self: auto;
|
|
106
|
+
margin: 0;
|
|
107
|
+
padding: 0;
|
|
108
|
+
width: auto;
|
|
109
|
+
height: auto;
|
|
110
|
+
max-width: none;
|
|
111
|
+
max-height: none;
|
|
112
|
+
min-width: 0;
|
|
113
|
+
min-height: 0;
|
|
114
|
+
border-radius: initial;
|
|
115
|
+
}
|
|
116
|
+
.lazyComponent-module_loader__brMEW {
|
|
117
|
+
position: relative;
|
|
118
|
+
width: 100px;
|
|
119
|
+
height: 100px;
|
|
120
|
+
display: grid;
|
|
121
|
+
place-items: center;
|
|
122
|
+
}
|
|
123
|
+
.lazyComponent-module_loader__brMEW .spinner {
|
|
124
|
+
animation: rotate 2s linear infinite;
|
|
125
|
+
z-index: 2;
|
|
126
|
+
position: absolute;
|
|
127
|
+
top: 50%;
|
|
128
|
+
left: 50%;
|
|
129
|
+
margin: -25px 0 0 -25px;
|
|
130
|
+
width: 50px;
|
|
131
|
+
height: 50px;
|
|
132
|
+
display: grid;
|
|
133
|
+
place-items: center;
|
|
134
|
+
}
|
|
135
|
+
.lazyComponent-module_loader__brMEW .spinner .path {
|
|
136
|
+
stroke: hsl(210, 92%, 44%);
|
|
137
|
+
stroke-linecap: round;
|
|
138
|
+
animation: dash 1.5s ease-in-out infinite;
|
|
139
|
+
}
|
|
140
|
+
@keyframes rotate {
|
|
141
|
+
100% {
|
|
142
|
+
transform: rotate(360deg);
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
@keyframes dash {
|
|
146
|
+
0% {
|
|
147
|
+
stroke-dasharray: 1, 150;
|
|
148
|
+
stroke-dashoffset: 0;
|
|
149
|
+
}
|
|
150
|
+
50% {
|
|
151
|
+
stroke-dasharray: 90, 150;
|
|
152
|
+
stroke-dashoffset: -35;
|
|
153
|
+
}
|
|
154
|
+
100% {
|
|
155
|
+
stroke-dasharray: 90, 150;
|
|
156
|
+
stroke-dashoffset: -124;
|
|
157
|
+
}
|
|
158
|
+
}
|
|
107
159
|
.flowLayout-module_flowLayout__VHpnY {
|
|
108
160
|
overflow: auto;
|
|
109
161
|
}
|
package/dist/lib/cjs/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.layoutBox-module_layout-
|
|
1
|
+
.layoutBox-module_layout-box__ZIID8 {
|
|
2
2
|
display: flex;
|
|
3
3
|
position: relative;
|
|
4
4
|
flex-direction: row;
|
|
@@ -22,6 +22,88 @@
|
|
|
22
22
|
min-height: 0;
|
|
23
23
|
border-radius: initial;
|
|
24
24
|
}
|
|
25
|
+
.icon-module_icon-base-parent__nOMvW {
|
|
26
|
+
line-height: 1px !important;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.icon-module_icon-base__S0tHf {
|
|
30
|
+
min-width: var(--min-width);
|
|
31
|
+
min-height: var(--min-height);
|
|
32
|
+
width: var(--width) !important;
|
|
33
|
+
height: var(--height) !important;
|
|
34
|
+
line-height: 1px !important;
|
|
35
|
+
background-color: var(--icon-color);
|
|
36
|
+
color: var(--icon-content-color);
|
|
37
|
+
background-repeat: no-repeat;
|
|
38
|
+
mask-image: var(--icon-url);
|
|
39
|
+
-webkit-mask-image: var(--icon-url);
|
|
40
|
+
mask-repeat: no-repeat;
|
|
41
|
+
-webkit-mask-repeat: no-repeat;
|
|
42
|
+
mask-size: contain;
|
|
43
|
+
-webkit-mask-size: contain;
|
|
44
|
+
mask-position: center;
|
|
45
|
+
-webkit-mask-position: center;
|
|
46
|
+
display: inline-block;
|
|
47
|
+
will-change: transform;
|
|
48
|
+
transform: translate3d(0, 0, 0);
|
|
49
|
+
}
|
|
50
|
+
.icon-module_icon-base__S0tHf svg {
|
|
51
|
+
fill: var(--icon-content-color);
|
|
52
|
+
width: var(--height);
|
|
53
|
+
height: var(--width);
|
|
54
|
+
}
|
|
55
|
+
.errorBoundary-module_errorBoundary__gk9ps {
|
|
56
|
+
background: #EFEFEF;
|
|
57
|
+
width: 100%;
|
|
58
|
+
height: 100%;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.errorBoundary-module_StyledIcon__IYHiU {
|
|
62
|
+
margin-right: 10px;
|
|
63
|
+
}
|
|
64
|
+
.lazyComponent-module_loader__brMEW {
|
|
65
|
+
position: relative;
|
|
66
|
+
width: 100px;
|
|
67
|
+
height: 100px;
|
|
68
|
+
display: grid;
|
|
69
|
+
place-items: center;
|
|
70
|
+
}
|
|
71
|
+
.lazyComponent-module_loader__brMEW .spinner {
|
|
72
|
+
animation: rotate 2s linear infinite;
|
|
73
|
+
z-index: 2;
|
|
74
|
+
position: absolute;
|
|
75
|
+
top: 50%;
|
|
76
|
+
left: 50%;
|
|
77
|
+
margin: -25px 0 0 -25px;
|
|
78
|
+
width: 50px;
|
|
79
|
+
height: 50px;
|
|
80
|
+
display: grid;
|
|
81
|
+
place-items: center;
|
|
82
|
+
}
|
|
83
|
+
.lazyComponent-module_loader__brMEW .spinner .path {
|
|
84
|
+
stroke: hsl(210, 92%, 44%);
|
|
85
|
+
stroke-linecap: round;
|
|
86
|
+
animation: dash 1.5s ease-in-out infinite;
|
|
87
|
+
}
|
|
88
|
+
@keyframes rotate {
|
|
89
|
+
100% {
|
|
90
|
+
transform: rotate(360deg);
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
@keyframes dash {
|
|
94
|
+
0% {
|
|
95
|
+
stroke-dasharray: 1, 150;
|
|
96
|
+
stroke-dashoffset: 0;
|
|
97
|
+
}
|
|
98
|
+
50% {
|
|
99
|
+
stroke-dasharray: 90, 150;
|
|
100
|
+
stroke-dashoffset: -35;
|
|
101
|
+
}
|
|
102
|
+
100% {
|
|
103
|
+
stroke-dasharray: 90, 150;
|
|
104
|
+
stroke-dashoffset: -124;
|
|
105
|
+
}
|
|
106
|
+
}
|
|
25
107
|
.CollapsibleContainer-module_collapsible-container__u0Jmm {
|
|
26
108
|
transform-origin: 0% 0%;
|
|
27
109
|
opacity: 0;
|
|
@@ -74,36 +156,6 @@
|
|
|
74
156
|
height: var(--height);
|
|
75
157
|
margin: var(--margin);
|
|
76
158
|
}
|
|
77
|
-
.icon-module_icon-base-parent__nOMvW {
|
|
78
|
-
line-height: 1px !important;
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
.icon-module_icon-base__S0tHf {
|
|
82
|
-
min-width: var(--min-width);
|
|
83
|
-
min-height: var(--min-height);
|
|
84
|
-
width: var(--width) !important;
|
|
85
|
-
height: var(--height) !important;
|
|
86
|
-
line-height: 1px !important;
|
|
87
|
-
background-color: var(--icon-color);
|
|
88
|
-
color: var(--icon-content-color);
|
|
89
|
-
background-repeat: no-repeat;
|
|
90
|
-
mask-image: var(--icon-url);
|
|
91
|
-
-webkit-mask-image: var(--icon-url);
|
|
92
|
-
mask-repeat: no-repeat;
|
|
93
|
-
-webkit-mask-repeat: no-repeat;
|
|
94
|
-
mask-size: contain;
|
|
95
|
-
-webkit-mask-size: contain;
|
|
96
|
-
mask-position: center;
|
|
97
|
-
-webkit-mask-position: center;
|
|
98
|
-
display: inline-block;
|
|
99
|
-
will-change: transform;
|
|
100
|
-
transform: translate3d(0, 0, 0);
|
|
101
|
-
}
|
|
102
|
-
.icon-module_icon-base__S0tHf svg {
|
|
103
|
-
fill: var(--icon-content-color);
|
|
104
|
-
width: var(--height);
|
|
105
|
-
height: var(--width);
|
|
106
|
-
}
|
|
107
159
|
.flowLayout-module_flowLayout__VHpnY {
|
|
108
160
|
overflow: auto;
|
|
109
161
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CollapsibleContainer.js","sources":["../../../../../../../../src/core/ui/components/container/CollapsibleContainer.tsx"],"sourcesContent":["import { FC, useRef, useState, memo, ReactNode,\n useEffect, useLayoutEffect, useMemo, CSSProperties, PropsWithChildren } from 'react'\n\nimport { useParseProps } from '../../../hooks/useParseProps'\n\nimport classes from './CollapsibleContainer.module.scss'\nimport { LayoutBoxProps } from './layoutBox.types'\n\n\n/**\n * Mapping of element property names for calculating dimensions.\n */\nconst elementPropNameMap: Record<string, string> = {\n width: 'scrollWidth',\n height: 'scrollHeight',\n}\n\n/**\n * Props for the CollapsibleContainer component.\n */\nexport type CollapsibleContainerProps = PropsWithChildren & Omit<LayoutBoxProps, 'ref'> & {\n collapsed?: boolean\n collapseHandler?: (collapsed: boolean) => void\n children?: ReactNode\n className?: string\n horizontal?: boolean\n} & CSSProperties\n\n/**\n * CollapsibleContainer component.\n *\n * @type {React.FC<CollapsibleContainerProps>}\n * @returns {React.ReactElement} The CollapsibleContainer.\n */\nexport const CollapsibleContainer: FC<CollapsibleContainerProps> = memo(({\n collapsed = false, collapseHandler, children, horizontal = false, className = '', id, ...props\n}: CollapsibleContainerProps) => {\n const containerRef = useRef<HTMLDivElement>(null)\n const [contentProp, setContentProp] = useState(0)\n\n const { dataProps, restProps: style } = useParseProps(props)\n\n const vertical = !horizontal\n\n useEffect(() => {\n collapseHandler?.(collapsed)\n }, [collapseHandler, collapsed])\n\n useLayoutEffect(() => {\n if (containerRef?.current) {\n const propName = vertical ? 'height' : 'width'\n\n // TODO test with requestAnimationFrame\n setTimeout(() => {\n if (containerRef?.current) {\n setContentProp((containerRef.current as any)[elementPropNameMap[propName]])\n }\n }, 100)\n }\n }, [containerRef, vertical])\n\n const styleProps: CSSProperties = useMemo(() => ({\n '--prop-name': vertical ? 'height' : 'width',\n '--prop-max-name': vertical ? 'max-height' : 'max-width',\n '--prop-value': `${contentProp}px`,\n ...style,\n } as CSSProperties), [vertical, style, contentProp])\n\n const classNames = useMemo(() => {\n const classNames = [vertical ? classes.vertical : classes.horizontal]\n\n if (collapsed && contentProp && contentProp !== undefined && contentProp !== null) {\n classNames.push(classes.collapsed)\n }\n if (!collapsed && contentProp && contentProp !== undefined && contentProp !== null) {\n classNames.push(classes.expanded)\n }\n return classNames.join(' ')\n }, [collapsed, contentProp, vertical])\n\n return (\n <div\n id={`${(typeof id !== 'undefined' && id) || id}`}\n className={`${classes['collapsible-container']} ${classNames} ${className} `}\n ref={containerRef}\n style={styleProps}\n {...dataProps}\n data-testid={dataProps.dataTestId || dataProps['data-testid'] || id}\n >\n {children}\n </div>\n )\n})\n\nCollapsibleContainer.displayName = 'CollapsibleContainer'\n"],"names":["elementPropNameMap","width","height","CollapsibleContainer","memo","_ref","collapsed","collapseHandler","children","horizontal","className","id","props","containerRef","useRef","contentProp","setContentProp","useState","dataProps","restProps","style","useParseProps","vertical","useEffect","useLayoutEffect","current","propName","setTimeout","styleProps","useMemo","concat","classNames","classes","push","expanded","join","React","createElement","_extends","ref","dataTestId","displayName"],"mappings":"iSAYA,MAAMA,EAA6C,CACjDC,MAAO,cACPC,OAAQ,gBAoBGC,EAAsDC,EAAIA,MAACC,IAEvC,IAFwCC,UACvEA,GAAY,EAAKC,gBAAEA,EAAeC,SAAEA,EAAQC,WAAEA,GAAa,EAAKC,UAAEA,EAAY,GAAEC,GAAEA,KAAOC,GAC/DP,EAC1B,MAAMQ,EAAeC,SAAuB,OACrCC,EAAaC,GAAkBC,EAAQA,SAAC,IAEzCC,UAAEA,EAAWC,UAAWC,GAAUC,EAAAA,cAAcT,GAEhDU,GAAYb,EAElBc,EAAAA,WAAU,KACRhB,SAAAA,EAAkBD,EAAU,GAC3B,CAACC,EAAiBD,IAErBkB,EAAAA,iBAAgB,KACd,GAAIX,SAAAA,EAAcY,QAAS,CACzB,MAAMC,EAAWJ,EAAW,SAAW,QAGvCK,YAAW,KACLd,SAAAA,EAAcY,SAChBT,EAAgBH,EAAaY,QAAgBzB,EAAmB0B,IAClE,GACC,IACL,IACC,CAACb,EAAcS,IAElB,MAAMM,EAA4BC,EAAAA,SAAQ,KAAO,CAC/C,cAAeP,EAAW,SAAW,QACrC,kBAAmBA,EAAW,aAAe,YAC7C,eAAcQ,GAAAA,OAAKf,EAAe,SAC/BK,KACgB,CAACE,EAAUF,EAAOL,IAEjCgB,EAAaF,EAAAA,SAAQ,KACzB,MAAME,EAAa,CAACT,EAAWU,EAAAA,QAAQV,SAAWU,EAAAA,QAAQvB,YAQ1D,OANIH,GAAaS,GAAbT,MAA4BS,GAC9BgB,EAAWE,KAAKD,UAAQ1B,YAErBA,GAAaS,GAAd,MAA6BA,GAC/BgB,EAAWE,KAAKD,UAAQE,UAEnBH,EAAWI,KAAK,IAAI,GAC1B,CAAC7B,EAAWS,EAAaO,IAE5B,OACEc,MAAAC,cAAA,MAAAC,UAAA,CACE3B,GAAE,GAAAmB,YAAoB,IAAPnB,GAAsBA,GAAOA,GAC5CD,UAASoB,GAAAA,OAAKE,EAAAA,QAAQ,yBAAwBF,KAAAA,OAAIC,EAAU,KAAAD,OAAIpB,EAAa,KAC7E6B,IAAK1B,EACLO,MAAOQ,GACHV,EAAS,CACb,cAAaA,EAAUsB,YAActB,EAAU,gBAAkBP,IAEhEH,EACG,IAIVL,EAAqBsC,YAAc"}
|
|
1
|
+
{"version":3,"file":"CollapsibleContainer.js","sources":["../../../../../../../../src/core/ui/components/container/CollapsibleContainer.tsx"],"sourcesContent":["import { FC, useRef, useState, memo, ReactNode,\n useEffect, useLayoutEffect, useMemo, CSSProperties, PropsWithChildren } from 'react'\n\nimport { useParseProps } from '../../../hooks/useParseProps'\n\nimport classes from './CollapsibleContainer.module.scss'\nimport { LayoutBoxProps } from './layoutBox/layoutBox.types'\n\n\n/**\n * Mapping of element property names for calculating dimensions.\n */\nconst elementPropNameMap: Record<string, string> = {\n width: 'scrollWidth',\n height: 'scrollHeight',\n}\n\n/**\n * Props for the CollapsibleContainer component.\n */\nexport type CollapsibleContainerProps = PropsWithChildren & Omit<LayoutBoxProps, 'ref'> & {\n collapsed?: boolean\n collapseHandler?: (collapsed: boolean) => void\n children?: ReactNode\n className?: string\n horizontal?: boolean\n} & CSSProperties\n\n/**\n * CollapsibleContainer component.\n *\n * @type {React.FC<CollapsibleContainerProps>}\n * @returns {React.ReactElement} The CollapsibleContainer.\n */\nexport const CollapsibleContainer: FC<CollapsibleContainerProps> = memo(({\n collapsed = false, collapseHandler, children, horizontal = false, className = '', id, ...props\n}: CollapsibleContainerProps) => {\n const containerRef = useRef<HTMLDivElement>(null)\n const [contentProp, setContentProp] = useState(0)\n\n const { dataProps, restProps: style } = useParseProps(props)\n\n const vertical = !horizontal\n\n useEffect(() => {\n collapseHandler?.(collapsed)\n }, [collapseHandler, collapsed])\n\n useLayoutEffect(() => {\n if (containerRef?.current) {\n const propName = vertical ? 'height' : 'width'\n\n // TODO test with requestAnimationFrame\n setTimeout(() => {\n if (containerRef?.current) {\n setContentProp((containerRef.current as any)[elementPropNameMap[propName]])\n }\n }, 100)\n }\n }, [containerRef, vertical])\n\n const styleProps: CSSProperties = useMemo(() => ({\n '--prop-name': vertical ? 'height' : 'width',\n '--prop-max-name': vertical ? 'max-height' : 'max-width',\n '--prop-value': `${contentProp}px`,\n ...style,\n } as CSSProperties), [vertical, style, contentProp])\n\n const classNames = useMemo(() => {\n const classNames = [vertical ? classes.vertical : classes.horizontal]\n\n if (collapsed && contentProp && contentProp !== undefined && contentProp !== null) {\n classNames.push(classes.collapsed)\n }\n if (!collapsed && contentProp && contentProp !== undefined && contentProp !== null) {\n classNames.push(classes.expanded)\n }\n return classNames.join(' ')\n }, [collapsed, contentProp, vertical])\n\n return (\n <div\n id={`${(typeof id !== 'undefined' && id) || id}`}\n className={`${classes['collapsible-container']} ${classNames} ${className} `}\n ref={containerRef}\n style={styleProps}\n {...dataProps}\n data-testid={dataProps.dataTestId || dataProps['data-testid'] || id}\n >\n {children}\n </div>\n )\n})\n\nCollapsibleContainer.displayName = 'CollapsibleContainer'\n"],"names":["elementPropNameMap","width","height","CollapsibleContainer","memo","_ref","collapsed","collapseHandler","children","horizontal","className","id","props","containerRef","useRef","contentProp","setContentProp","useState","dataProps","restProps","style","useParseProps","vertical","useEffect","useLayoutEffect","current","propName","setTimeout","styleProps","useMemo","concat","classNames","classes","push","expanded","join","React","createElement","_extends","ref","dataTestId","displayName"],"mappings":"iSAYA,MAAMA,EAA6C,CACjDC,MAAO,cACPC,OAAQ,gBAoBGC,EAAsDC,EAAIA,MAACC,IAEvC,IAFwCC,UACvEA,GAAY,EAAKC,gBAAEA,EAAeC,SAAEA,EAAQC,WAAEA,GAAa,EAAKC,UAAEA,EAAY,GAAEC,GAAEA,KAAOC,GAC/DP,EAC1B,MAAMQ,EAAeC,SAAuB,OACrCC,EAAaC,GAAkBC,EAAQA,SAAC,IAEzCC,UAAEA,EAAWC,UAAWC,GAAUC,EAAAA,cAAcT,GAEhDU,GAAYb,EAElBc,EAAAA,WAAU,KACRhB,SAAAA,EAAkBD,EAAU,GAC3B,CAACC,EAAiBD,IAErBkB,EAAAA,iBAAgB,KACd,GAAIX,SAAAA,EAAcY,QAAS,CACzB,MAAMC,EAAWJ,EAAW,SAAW,QAGvCK,YAAW,KACLd,SAAAA,EAAcY,SAChBT,EAAgBH,EAAaY,QAAgBzB,EAAmB0B,IAClE,GACC,IACL,IACC,CAACb,EAAcS,IAElB,MAAMM,EAA4BC,EAAAA,SAAQ,KAAO,CAC/C,cAAeP,EAAW,SAAW,QACrC,kBAAmBA,EAAW,aAAe,YAC7C,eAAcQ,GAAAA,OAAKf,EAAe,SAC/BK,KACgB,CAACE,EAAUF,EAAOL,IAEjCgB,EAAaF,EAAAA,SAAQ,KACzB,MAAME,EAAa,CAACT,EAAWU,EAAAA,QAAQV,SAAWU,EAAAA,QAAQvB,YAQ1D,OANIH,GAAaS,GAAbT,MAA4BS,GAC9BgB,EAAWE,KAAKD,UAAQ1B,YAErBA,GAAaS,GAAd,MAA6BA,GAC/BgB,EAAWE,KAAKD,UAAQE,UAEnBH,EAAWI,KAAK,IAAI,GAC1B,CAAC7B,EAAWS,EAAaO,IAE5B,OACEc,MAAAC,cAAA,MAAAC,UAAA,CACE3B,GAAE,GAAAmB,YAAoB,IAAPnB,GAAsBA,GAAOA,GAC5CD,UAASoB,GAAAA,OAAKE,EAAAA,QAAQ,yBAAwBF,KAAAA,OAAIC,EAAU,KAAAD,OAAIpB,EAAa,KAC7E6B,IAAK1B,EACLO,MAAOQ,GACHV,EAAS,CACb,cAAaA,EAAUsB,YAActB,EAAU,gBAAkBP,IAEhEH,EACG,IAIVL,EAAqBsC,YAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js");require("../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js");var t=require("react"),i=require("../../../hooks/useResize.js"),o=require("./LayoutBox.js");const n={main:{position:"absolute",zIndex:1,left:0,pointerEvents:"none"},empty:{pointerEvents:"none"}},l=t.memo((t=>{let{children:l,debounceDelay:a=250,...r}=t;const[s,u]=i.useResize(a);return React.createElement(o.LayoutBox,e.extends({width:"100%",height:"100%",justify:"center",align:"center",direction:"column"},r),React.createElement(o.LayoutBox,{style:n.main,width:"100%",height:"100%",ref:s}),!l&&React.createElement(o.LayoutBox,{width:"".concat(Math.max((null==u?void 0:u.width)||200,200)||200,"px"),height:"".concat(Math.max((null==u?void 0:u.height)||200,200)||200,"px"),style:n.empty}),l&&(null==l?void 0:l({height:"".concat((null==u?void 0:u.height)||200,"px"),width:"".concat((null==u?void 0:u.width)||200,"px"),measured:!(null==u||!u.height)})))}));l.displayName="ResizableContainer",exports.ResizableContainer=l;
|
|
1
|
+
"use strict";var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js");require("../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js");var t=require("react"),i=require("../../../hooks/useResize.js"),o=require("./layoutBox/LayoutBox.js");const n={main:{position:"absolute",zIndex:1,left:0,pointerEvents:"none"},empty:{pointerEvents:"none"}},l=t.memo((t=>{let{children:l,debounceDelay:a=250,...r}=t;const[s,u]=i.useResize(a);return React.createElement(o.LayoutBox,e.extends({width:"100%",height:"100%",justify:"center",align:"center",direction:"column"},r),React.createElement(o.LayoutBox,{style:n.main,width:"100%",height:"100%",ref:s}),!l&&React.createElement(o.LayoutBox,{width:"".concat(Math.max((null==u?void 0:u.width)||200,200)||200,"px"),height:"".concat(Math.max((null==u?void 0:u.height)||200,200)||200,"px"),style:n.empty}),l&&(null==l?void 0:l({height:"".concat((null==u?void 0:u.height)||200,"px"),width:"".concat((null==u?void 0:u.width)||200,"px"),measured:!(null==u||!u.height)})))}));l.displayName="ResizableContainer",exports.ResizableContainer=l;
|
|
2
2
|
//# sourceMappingURL=ResizableContainer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResizableContainer.js","sources":["../../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"sourcesContent":["import { memo, RefObject, PropsWithChildren, ReactElement, FC } from 'react'\n\nimport { useResize } from '../../../hooks/useResize'\n\nimport { LayoutBox } from './LayoutBox'\nimport { LayoutBoxProps } from './layoutBox.types'\n\n\nexport type ResizableContainerProps = LayoutBoxProps & PropsWithChildren<any> & {\n debounceDelay?: number\n children?: (props: ResizableContainerRenderProps) => ReactElement\n}\n\nexport type ResizableContainerRenderProps = {\n width: number | string\n height: number | string\n measured: boolean\n}\n\nconst styles = {\n main: {\n position: 'absolute',\n zIndex: 1,\n left: 0,\n pointerEvents: 'none',\n },\n empty: {\n pointerEvents: 'none',\n },\n}\n\nexport const ResizableContainer: FC<ResizableContainerProps> = memo<ResizableContainerProps>(\n ({ children, debounceDelay = 250, ...props }: ResizableContainerProps) => {\n const [containerRef, containerSize] = useResize(debounceDelay)\n\n return (\n <LayoutBox\n width='100%'\n height='100%'\n justify='center'\n align='center'\n direction='column'\n {...props}\n >\n <LayoutBox\n style={styles.main}\n width='100%'\n height='100%'\n ref={containerRef as RefObject<HTMLDivElement>}\n />\n {!children && (\n <LayoutBox\n width={`${Math.max(containerSize?.width || 200, 200) || 200}px`}\n height={`${Math.max(containerSize?.height || 200, 200) || 200}px`}\n style={styles.empty}\n />\n )}\n {children && children?.({\n height: `${containerSize?.height || 200}px`,\n width: `${containerSize?.width || 200}px`,\n measured: !!containerSize?.height,\n } as ResizableContainerRenderProps)}\n </LayoutBox>\n )\n },\n)\n\nResizableContainer.displayName = 'ResizableContainer'\n"],"names":["styles","main","position","zIndex","left","pointerEvents","empty","ResizableContainer","memo","_ref","children","debounceDelay","props","containerRef","containerSize","useResize","React","createElement","LayoutBox","_extends","width","height","justify","align","direction","style","ref","concat","Math","max","measured","displayName"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ResizableContainer.js","sources":["../../../../../../../../src/core/ui/components/container/ResizableContainer.tsx"],"sourcesContent":["import { memo, RefObject, PropsWithChildren, ReactElement, FC } from 'react'\n\nimport { useResize } from '../../../hooks/useResize'\n\nimport { LayoutBox } from './layoutBox/LayoutBox'\nimport { LayoutBoxProps } from './layoutBox/layoutBox.types'\n\n\nexport type ResizableContainerProps = LayoutBoxProps & PropsWithChildren<any> & {\n debounceDelay?: number\n children?: (props: ResizableContainerRenderProps) => ReactElement\n}\n\nexport type ResizableContainerRenderProps = {\n width: number | string\n height: number | string\n measured: boolean\n}\n\nconst styles = {\n main: {\n position: 'absolute',\n zIndex: 1,\n left: 0,\n pointerEvents: 'none',\n },\n empty: {\n pointerEvents: 'none',\n },\n}\n\nexport const ResizableContainer: FC<ResizableContainerProps> = memo<ResizableContainerProps>(\n ({ children, debounceDelay = 250, ...props }: ResizableContainerProps) => {\n const [containerRef, containerSize] = useResize(debounceDelay)\n\n return (\n <LayoutBox\n width='100%'\n height='100%'\n justify='center'\n align='center'\n direction='column'\n {...props}\n >\n <LayoutBox\n style={styles.main}\n width='100%'\n height='100%'\n ref={containerRef as RefObject<HTMLDivElement>}\n />\n {!children && (\n <LayoutBox\n width={`${Math.max(containerSize?.width || 200, 200) || 200}px`}\n height={`${Math.max(containerSize?.height || 200, 200) || 200}px`}\n style={styles.empty}\n />\n )}\n {children && children?.({\n height: `${containerSize?.height || 200}px`,\n width: `${containerSize?.width || 200}px`,\n measured: !!containerSize?.height,\n } as ResizableContainerRenderProps)}\n </LayoutBox>\n )\n },\n)\n\nResizableContainer.displayName = 'ResizableContainer'\n"],"names":["styles","main","position","zIndex","left","pointerEvents","empty","ResizableContainer","memo","_ref","children","debounceDelay","props","containerRef","containerSize","useResize","React","createElement","LayoutBox","_extends","width","height","justify","align","direction","style","ref","concat","Math","max","measured","displayName"],"mappings":"gRAmBA,MAAMA,EAAS,CACbC,KAAM,CACJC,SAAU,WACVC,OAAQ,EACRC,KAAM,EACNC,cAAe,QAEjBC,MAAO,CACLD,cAAe,SAINE,EAAkDC,EAAIA,MACjEC,IAA0E,IAAzEC,SAAEA,EAAQC,cAAEA,EAAgB,OAAQC,GAAgCH,EACnE,MAAOI,EAAcC,GAAiBC,EAASA,UAACJ,GAEhD,OACEK,MAAAC,cAACC,EAASA,UAAAC,UAAA,CACRC,MAAM,OACNC,OAAO,OACPC,QAAQ,SACRC,MAAM,SACNC,UAAU,UACNZ,GAEJI,MAAAC,cAACC,EAAAA,UAAS,CACRO,MAAOzB,EAAOC,KACdmB,MAAM,OACNC,OAAO,OACPK,IAAKb,KAELH,GACFM,MAAAC,cAACC,EAAAA,UAAS,CACRE,MAAK,GAAAO,OAAKC,KAAKC,KAAIf,eAAAA,EAAeM,QAAS,IAAK,MAAQ,IAAQ,MAChEC,OAAM,GAAAM,OAAKC,KAAKC,KAAIf,eAAAA,EAAeO,SAAU,IAAK,MAAQ,IAAQ,MAClEI,MAAOzB,EAAOM,QAGfI,IAAYA,aAAAA,EAAAA,EAAW,CACtBW,OAAMM,GAAAA,QAAKb,aAAa,EAAbA,EAAeO,SAAU,IAAO,MAC3CD,MAAKO,GAAAA,QAAKb,aAAa,EAAbA,EAAeM,QAAS,IAAO,MACzCU,WAAYhB,UAAAA,EAAeO,WAEnB,IAKlBd,EAAmBwB,YAAc"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var e=require("../../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),s=require("../../../../hooks/useParseProps.js"),a=require("../../../../utils/helpers/ui.js"),o=require("./layoutBox.module.scss.js"),r=require("./layoutBox.types.js");const l={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},i=e=>e&&l[e]||e,u=t.forwardRef(((l,u)=>{let{id:n,style:d,children:c,tabIndex:x,className:y="",onClick:f,column:m,...p}=l;const{dataProps:j,restProps:P}=s.useParseProps(p),b=t.useMemo((()=>f?{onClick:f,onKeyDown:f,role:"button",tabIndex:-1}:{}),[f]),q=t.useMemo((()=>void 0!==m&&!0===m?r.LayoutDirection.COLUMN:null),[m]),B=t.useMemo((()=>({...P,...P.align?{alignItems:i(P.align)}:{},...P.justify?{justifyContent:i(P.justify)}:{},...P.direction||q?{flexDirection:P.direction||q}:{},...d})),[q,P,d]);return React.createElement("div",e.extends({},n?{id:"".concat(n)}:{},{ref:u,tabIndex:x,className:a.classNames(o.default["layout-box"],y),style:B},j,{"data-testid":j.dataTestId||j["data-testid"]||n},b),c)}));u.displayName="LayoutBoxRefForwarded";const n=t.memo(u);n.displayName="LayoutBox",exports.LayoutBox=n;
|
|
2
|
+
//# sourceMappingURL=LayoutBox.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LayoutBox.js","sources":["../../../../../../../../../src/core/ui/components/container/layoutBox/LayoutBox.tsx"],"sourcesContent":["import { memo, FC, useMemo, CSSProperties, forwardRef, LegacyRef } from 'react'\n\nimport { useParseProps } from '../../../../hooks/useParseProps'\nimport { classNames } from '../../../../utils/helpers/ui'\n\nimport classes from './layoutBox.module.scss'\nimport { LayoutDirection, LayoutBoxProps } from './layoutBox.types'\n\n/**\n * Map of flex values for resolving flex alignment and justification.\n * @type {Record<string, string>}\n */\nconst flexValueMap: Record<string, string> = {\n start: 'flex-start',\n 'flex-start': 'flex-start',\n end: 'flex-end',\n 'flex-end': 'flex-end',\n}\n\n/**\n * Resolves flex alignment and justification properties based on the provided value.\n * @param {string | undefined} value - The value to resolve.\n * @returns {string | undefined} - Resolved flex property value.\n */\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\n/**\n * Forwarded ref version of the LayoutBox component.\n * @param {LayoutBoxProps} props - Props for the LayoutBox component.\n * @param {LegacyRef<HTMLDivElement> | undefined} ref - Ref for accessing the underlying DOM element.\n * @returns {JSX.Element} - Rendered LayoutBox component.\n */\nconst LayoutBoxRefForwarded = forwardRef(({\n id, style, children, tabIndex, className = '', onClick, column, ...props\n}: LayoutBoxProps, ref: LegacyRef<HTMLDivElement> | undefined | null) => {\n const { dataProps, restProps } = useParseProps(props)\n\n /**\n * Memoized onClick event properties.\n * @type {{ onClick?: () => void; onKeyDown?: () => void; role?: string; tabIndex?: number }}\n */\n const onClickProps = useMemo(() => (onClick ? ({\n onClick,\n onKeyDown: onClick,\n role: 'button',\n tabIndex: -1,\n }) : {}), [onClick])\n\n /**\n * Memoized resolved direction based on the column prop.\n * @type {LayoutDirection}\n */\n const resolvedColumn = useMemo(() => ((\n column !== undefined && column === true)\n ? LayoutDirection.COLUMN\n : null), [column])\n\n /**\n * Memoized styles combining parsed props and additional styles.\n * @type {CSSProperties}\n */\n const styles = useMemo(() => (\n {\n ...restProps,\n ...(restProps.align ? { alignItems: resolveFlexProps(restProps.align as string) } : {}),\n ...(restProps.justify ? { justifyContent: resolveFlexProps(restProps.justify as string) } : {}),\n ...(restProps.direction || resolvedColumn ? { flexDirection: restProps.direction || resolvedColumn } : {}),\n ...style,\n }\n ), [resolvedColumn, restProps, style])\n\n return (\n <div\n {...(id ? { id: `${id}` } : {})}\n ref={ref}\n tabIndex={tabIndex}\n className={classNames(\n classes['layout-box'],\n className,\n )}\n style={styles as CSSProperties}\n {...dataProps}\n data-testid={dataProps.dataTestId || dataProps['data-testid'] || id}\n {...onClickProps}\n >\n {children}\n </div>\n )\n})\n\nLayoutBoxRefForwarded.displayName = 'LayoutBoxRefForwarded'\n\n/**\n * Memoized and memoized LayoutBox component.\n * @type {FC<LayoutBoxProps>}\n */\nexport const LayoutBox: FC<LayoutBoxProps> = memo<LayoutBoxProps>(LayoutBoxRefForwarded)\n\nLayoutBox.displayName = 'LayoutBox'\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","LayoutBoxRefForwarded","forwardRef","_ref","ref","id","style","children","tabIndex","className","onClick","column","props","dataProps","restProps","useParseProps","onClickProps","useMemo","onKeyDown","role","resolvedColumn","undefined","LayoutDirection","COLUMN","styles","align","alignItems","justify","justifyContent","direction","flexDirection","React","createElement","_extends","concat","classNames","classes","dataTestId","displayName","LayoutBox","memo"],"mappings":"gRAYA,MAAMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAQRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAQrGC,EAAwBC,EAAUA,YAAC,CAAAC,EAEtBC,KAAsD,IAF/BC,GACxCA,EAAEC,MAAEA,EAAKC,SAAEA,EAAQC,SAAEA,EAAQC,UAAEA,EAAY,GAAEC,QAAEA,EAAOC,OAAEA,KAAWC,GACpDT,EACf,MAAMU,UAAEA,EAASC,UAAEA,GAAcC,EAAAA,cAAcH,GAMzCI,EAAeC,WAAQ,IAAOP,EAAW,CAC7CA,UACAQ,UAAWR,EACXS,KAAM,SACNX,UAAW,GACR,CAAG,GAAE,CAACE,IAMLU,EAAiBH,EAAOA,SAAC,SAClBI,IAAXV,IAAmC,IAAXA,EACtBW,EAAAA,gBAAgBC,OAChB,MAAO,CAACZ,IAMNa,EAASP,EAAAA,SAAQ,KACrB,IACKH,KACCA,EAAUW,MAAQ,CAAEC,WAAY3B,EAAiBe,EAAUW,QAAqB,CAAE,KAClFX,EAAUa,QAAU,CAAEC,eAAgB7B,EAAiBe,EAAUa,UAAuB,CAAE,KAC1Fb,EAAUe,WAAaT,EAAiB,CAAEU,cAAehB,EAAUe,WAAaT,GAAmB,CAAE,KACtGd,KAEJ,CAACc,EAAgBN,EAAWR,IAE/B,OACEyB,MAAAC,oBAAAC,EAAAA,QAAA,CAAA,EACO5B,EAAK,CAAEA,GAAE,GAAA6B,OAAK7B,IAAS,GAAE,CAC9BD,IAAKA,EACLI,SAAUA,EACVC,UAAW0B,EAAAA,WACTC,EAAAA,QAAQ,cACR3B,GAEFH,MAAOkB,GACHX,EAAS,CACb,cAAaA,EAAUwB,YAAcxB,EAAU,gBAAkBR,GAC7DW,GAEHT,EACG,IAIVN,EAAsBqC,YAAc,8BAMvBC,EAAgCC,EAAIA,KAAiBvC,GAElEsC,EAAUD,YAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.default={"layout-box":"layoutBox-module_layout-
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.default={"layout-box":"layoutBox-module_layout-box__ZIID8"};
|
|
2
2
|
//# sourceMappingURL=layoutBox.module.scss.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layoutBox.types.js","sources":["../../../../../../../../../src/core/ui/components/container/layoutBox/layoutBox.types.ts"],"sourcesContent":["import { CSSProperties, LegacyRef, PropsWithChildren } from 'react'\n\n/**\n * Enum representing the possible layout directions.\n */\nexport enum LayoutDirection {\n ROW = 'row',\n COLUMN = 'column',\n}\n\n/**\n * Props for the LayoutBox component.\n */\nexport type LayoutBoxProps = PropsWithChildren & {\n /** Unique identifier for the component. */\n id?: string | number\n /** CSS flex property. */\n flex?: string\n /** CSS flexGrow property. */\n flexGrow?: string | number\n /** Text alignment within the box. */\n alignText?: 'center' | 'right' | 'left'\n /** Direction of the layout (row or column). */\n direction?: LayoutDirection | string\n /** CSS flexShrink property. */\n flexShrink?: string | number\n /** CSS flexBasis property. */\n flexBasis?: string\n /** CSS flexWrap property. */\n flexWrap?: string\n /** CSS justify-content property. */\n justify?: string\n /** CSS align-items property. */\n align?: string\n /** CSS align-self property. */\n alignSelf?: string\n /** CSS margin property. */\n margin?: string\n /** CSS padding property. */\n padding?: string\n /** CSS width property. */\n width?: string\n /** CSS height property. */\n height?: string\n /** CSS maxWidth property. */\n maxWidth?: string\n /** CSS maxHeight property. */\n maxHeight?: string\n /** CSS minWidth property. */\n minWidth?: string\n /** CSS minHeight property. */\n minHeight?: string\n /** Gap between child elements. */\n gap?: string\n /** CSS borderRadius property. */\n borderRadius?: string\n /** Additional inline styles for the component. */\n style?: Record<string, unknown> | null\n /** Additional class name(s) for the component. */\n className?: string\n /** Tab index for keyboard navigation. */\n tabIndex?: number\n /** Ref for accessing the underlying DOM element. */\n ref?: LegacyRef<HTMLDivElement> | undefined | null\n /** Callback function for click event. */\n onClick?: () => void\n /** If true, sets the layout direction to column. */\n column?: boolean\n} & Omit<CSSProperties, 'direction'>;\n"],"names":["LayoutDirection"],"mappings":"aAKYA,IAAAA,WAAAA,GAAe,OAAfA,EAAe,IAAA,MAAfA,EAAe,OAAA,SAAfA,CAAe,EAAA"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var e=require("../../../../../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),t=require("../../error/ErrorBoundary.js"),n=require("./lazyComponent.module.scss.js");const a=React.createElement("div",{className:n.default.loader},React.createElement("svg",{className:"spinner",viewBox:"0 0 50 50"},React.createElement("circle",{className:"path",cx:"25",cy:"25",r:"20",fill:"none",strokeWidth:"5"}))),l={},o=e=>{let r,t="pending";const n=("function"==typeof e?e():e).then((e=>{t="success",r=e}),(e=>{t="error",r=e}));return{read(){if("pending"===t)throw n;if("error"===t)throw r;if("success"===t)return r}}},c=r.memo((e=>{let{children:n,Component:l,LoaderJSX:o,...c}=e;return React.createElement(t.ErrorBoundary,null,React.createElement(r.Suspense,{fallback:o||a},l&&React.createElement(l,c),n&&n))}));c.displayName="LazyComponent";const s=r.memo((e=>{let{pendingPromise:t,promise:n,fallback:a,children:l}=e;const s=r.useRef(t||n&&o(n)),i=r.useMemo((()=>e=>{var r,t;let{children:n}=e;const a=null===(r=s.current)||void 0===r||null===(t=r.read)||void 0===t?void 0:t.call(r);return null!=a&&a.then?null:n}),[]);return React.createElement(c,{LoaderJSX:a},React.createElement(i,null,l))}));s.displayName="PendingBoundary";exports.LazyComponent=c,exports.PendingBoundary=s,exports.createLazyModule=function(t,n){let a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!l[n]){const o=r.lazy(t);l[n]=r.memo((r=>React.createElement(c,e.extends({Component:o},a,r)))),l[n].displayName=n}return l[n]},exports.createLazyModuleWithStore=(t,n,a)=>o=>{if(!l[n]){const s=r.lazy((()=>t(o)));l[n]=r.memo((r=>React.createElement(c,e.extends({Component:s},a,r)))),l[n].displayName=n}return l[n]},exports.wrapPromise=o;
|
|
2
|
+
//# sourceMappingURL=LazyComponent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LazyComponent.js","sources":["../../../../../../../../../src/core/ui/components/container/lazyComponent/LazyComponent.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport { FC, memo, Suspense, lazy, ComponentType, PropsWithChildren, useRef, useMemo } from 'react'\n\nimport { ErrorBoundary } from '../../error/ErrorBoundary'\n\nimport classes from './lazyComponent.module.scss'\n\n\nconst Loader: React.ReactNode = (\n <div className={classes.loader}>\n <svg className='spinner' viewBox='0 0 50 50'>\n <circle className='path' cx='25' cy='25' r='20' fill='none' strokeWidth='5' />\n </svg>\n </div>\n)\n\n\n// not always necessary, since createLayzModule is called once per module,\n// but when nesting, inside loaded modules...\nconst map: Record<string, FC<any>> = {}\n\ntype ReactModule = {\n default: ComponentType<any>\n}\n\nexport type LazyComponentProps = PropsWithChildren<any> & {\n PropsWithChildren?: ComponentType<any>\n LoaderJSX?: JSX.Element\n}\n\nexport type wrapPromiseType = (promise: (() => Promise<any>) | Promise<any>) => { read: () => Promise<unknown> }\n\nexport const wrapPromise: wrapPromiseType = (promise: (() => Promise<any>) | Promise<any>) => {\n let status = 'pending'\n let result: any\n const suspend = (typeof promise === 'function' ? promise() : promise).then(\n (res) => {\n status = 'success'\n result = res\n },\n (err) => {\n status = 'error'\n result = err\n },\n )\n\n return {\n // eslint-disable-next-line consistent-return\n read(): any {\n if (status === 'pending') {\n throw suspend\n } else if (status === 'error') {\n throw result\n } else if (status === 'success') {\n return result\n }\n },\n }\n}\n\n\nexport const LazyComponent: FC<LazyComponentProps>\n= memo<LazyComponentProps>(({ children, Component, LoaderJSX, ...props }: LazyComponentProps) => (\n <ErrorBoundary>\n <Suspense fallback={LoaderJSX || Loader}>\n {Component && <Component {...props} />}\n {children && children}\n </Suspense>\n </ErrorBoundary>\n))\n\nLazyComponent.displayName = 'LazyComponent'\n\nexport type PendingBoundaryProps = PropsWithChildren & {\n fallback?: JSX.Element\n promise?: Promise<unknown>\n pendingPromise?: { read: () => Promise<unknown> }\n}\n\nexport const PendingBoundary: FC<PendingBoundaryProps>\n= memo<PendingBoundaryProps>(({ pendingPromise, promise, fallback, children }: PendingBoundaryProps) => {\n const wrappedPromiseRef = useRef(pendingPromise || (promise && wrapPromise(promise)))\n\n const InnerComponent: FC<PropsWithChildren<any>> = useMemo(() => ({ children }: PropsWithChildren<any>) => {\n const innerPromise = wrappedPromiseRef.current?.read?.()\n\n return innerPromise?.then ? null : children\n }, [])\n\n return (\n <LazyComponent LoaderJSX={fallback}>\n <InnerComponent>{children}</InnerComponent>\n </LazyComponent>\n )\n})\n\nPendingBoundary.displayName = 'PendingBoundary'\n\n\nexport const createLazyModule = (\n lazyResolver: () => Promise<ReactModule>,\n displayName: string,\n defaultProps: Record<string, unknown> = {},\n): FC<unknown> => {\n if (!map[displayName]) {\n const Component = lazy(lazyResolver)\n\n // eslint-disable-next-line react/display-name\n map[displayName] = memo((props) => (<LazyComponent Component={Component} {...defaultProps} {...props} />))\n map[displayName].displayName = displayName\n }\n\n return map[displayName]\n}\n\n\nexport const createLazyModuleWithStore = <T, ComponentType>(\n lazyResolver: (store: T) => Promise<ReactModule>,\n displayName: string,\n defaultProps: Record<string, unknown>,\n): (store: T) => FC<ComponentType> => (store: T) => {\n if (!map[displayName]) {\n const Component = lazy(() => lazyResolver(store))\n\n // eslint-disable-next-line react/display-name\n map[displayName] = memo((props) => (<LazyComponent Component={Component} {...defaultProps} {...props} />))\n map[displayName].displayName = displayName\n }\n\n return map[displayName]\n }\n"],"names":["Loader","React","createElement","className","classes","default","loader","viewBox","cx","cy","r","fill","strokeWidth","map","wrapPromise","promise","result","status","suspend","then","res","err","read","LazyComponent","memo","_ref","children","Component","LoaderJSX","props","ErrorBoundary","Suspense","fallback","displayName","PendingBoundary","_ref2","pendingPromise","wrappedPromiseRef","useRef","InnerComponent","useMemo","_ref3","_wrappedPromiseRef$cu","_wrappedPromiseRef$cu2","innerPromise","current","call","lazyResolver","defaultProps","arguments","length","undefined","lazy","_extends","createLazyModuleWithStore","store"],"mappings":"+LAQA,MAAMA,EACJC,MAAAC,cAAA,MAAA,CAAKC,UAAWC,EAAOC,QAACC,QACtBL,MAAAC,cAAA,MAAA,CAAKC,UAAU,UAAUI,QAAQ,aAC/BN,MAAAC,cAAA,SAAA,CAAQC,UAAU,OAAOK,GAAG,KAAKC,GAAG,KAAKC,EAAE,KAAKC,KAAK,OAAOC,YAAY,QAQxEC,EAA+B,CAAA,EAaxBC,EAAgCC,IAC3C,IACIC,EADAC,EAAS,UAEb,MAAMC,GAA8B,mBAAZH,EAAyBA,IAAYA,GAASI,MACnEC,IACCH,EAAS,UACTD,EAASI,CAAG,IAEbC,IACCJ,EAAS,QACTD,EAASK,CAAG,IAIhB,MAAO,CAELC,IAAAA,GACE,GAAe,YAAXL,EACF,MAAMC,EACD,GAAe,UAAXD,EACT,MAAMD,EACD,GAAe,YAAXC,EACT,OAAOD,CAEX,EACD,EAIUO,EACXC,EAAIA,MAAqBC,IAAA,IAACC,SAAEA,EAAQC,UAAEA,EAASC,UAAEA,KAAcC,GAA2BJ,EAAA,OAC1FxB,MAAAC,cAAC4B,EAAaA,mBACZ7B,MAAAC,cAAC6B,WAAQ,CAACC,SAAUJ,GAAa5B,GAC9B2B,GAAa1B,MAAAC,cAACyB,EAAcE,GAC5BH,GAAYA,GAED,IAGlBH,EAAcU,YAAc,sBAQfC,EACXV,EAAIA,MAAuBW,IAA2E,IAA1EC,eAAEA,EAAcrB,QAAEA,EAAOiB,SAAEA,EAAQN,SAAEA,GAAgCS,EACjG,MAAME,EAAoBC,EAAAA,OAAOF,GAAmBrB,GAAWD,EAAYC,IAErEwB,EAA6CC,WAAQ,IAAMC,IAA0C,IAAAC,EAAAC,EAAA,IAAzCjB,SAAEA,GAAkCe,EACpG,MAAMG,EAAwCF,QAA5BA,EAAGL,EAAkBQ,eAAOF,IAAAD,GAAM,QAANC,EAAzBD,EAA2BpB,YAAI,IAAAqB,OAAA,EAA/BA,EAAAG,KAAAJ,GAErB,OAAOE,SAAAA,EAAczB,KAAO,KAAOO,CAAQ,GAC1C,IAEH,OACEzB,MAAAC,cAACqB,EAAa,CAACK,UAAWI,GACxB/B,MAAAC,cAACqC,EAAgBb,KAAAA,GACH,IAIpBQ,EAAgBD,YAAc,6FAGE,SAC9Bc,EACAd,GAEgB,IADhBe,EAAqCC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,CAAA,EAExC,IAAKpC,EAAIoB,GAAc,CACrB,MAAMN,EAAYyB,OAAKL,GAGvBlC,EAAIoB,GAAeT,QAAMK,GAAW5B,MAAAC,cAACqB,EAAa8B,UAAA,CAAC1B,UAAWA,GAAeqB,EAAkBnB,MAC/FhB,EAAIoB,GAAaA,YAAcA,CACjC,CAEA,OAAOpB,EAAIoB,EACb,oCAGyCqB,CACvCP,EACAd,EACAe,IACqCO,IACnC,IAAK1C,EAAIoB,GAAc,CACrB,MAAMN,EAAYyB,EAAIA,MAAC,IAAML,EAAaQ,KAG1C1C,EAAIoB,GAAeT,QAAMK,GAAW5B,MAAAC,cAACqB,EAAa8B,UAAA,CAAC1B,UAAWA,GAAeqB,EAAkBnB,MAC/FhB,EAAIoB,GAAaA,YAAcA,CACjC,CAEA,OAAOpB,EAAIoB,EAAY"}
|
package/dist/lib/cjs/src/core/ui/components/container/lazyComponent/lazyComponent.module.scss.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"lazyComponent.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DividerLine.js","sources":["../../../../../../../../src/core/ui/components/dividers/DividerLine.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { memo, FC, CSSProperties, useMemo } from 'react'\n\nimport classes from './divider.module.scss'\n\
|
|
1
|
+
{"version":3,"file":"DividerLine.js","sources":["../../../../../../../../src/core/ui/components/dividers/DividerLine.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { memo, FC, CSSProperties, useMemo } from 'react'\n\nimport classes from './divider.module.scss'\n\nexport type DividerProps = {\n orientation?: string\n margin?: string\n vertical?: boolean\n length?: string\n color?: string\n opacity?: number\n left?: string\n width?: string\n height?: string\n className?: string\n}\n\nexport const DividerLine: FC<DividerProps> = memo<DividerProps>(({\n orientation, vertical,\n color = 'var(--divider-line)',\n opacity,\n length = '80%', left = '0',\n width = '1px', height = '1px',\n margin,\n className = '',\n}: DividerProps) => {\n const isVertical = useMemo(() => orientation === 'vertical' || vertical === true, [orientation, vertical])\n\n const styles = useMemo(() => (\n {\n '--width': width,\n '--height': height,\n '--length': length,\n '--opacity': opacity,\n '--color': color,\n '--left': left,\n '--margin': margin || (isVertical ? 'auto 0' : '0 auto'),\n }\n ), [width, height, length, opacity, color, left, margin, isVertical])\n\n const verHorClass = isVertical ? classes.vertical : classes.horizontal\n\n return (\n <div\n className={`${(classes as any)['divider-line']} ${verHorClass} ${className}`}\n style={styles as CSSProperties}\n />\n )\n})\n\nDividerLine.displayName = 'DividerLine'\n\nexport const DividerVertical: FC<DividerProps>\n = memo((props) => <DividerLine vertical length='100%' {...props} />)\nDividerVertical.displayName = 'DividerVertical'\n\nexport const DividerHorizontal: FC<DividerProps>\n = memo((props) => <DividerLine length='100%' {...props} />)\nDividerHorizontal.displayName = 'DividerHorizontal'\n"],"names":["DividerLine","memo","_ref","orientation","vertical","color","opacity","length","left","width","height","margin","className","isVertical","useMemo","styles","verHorClass","classes","horizontal","React","createElement","concat","default","style","displayName","DividerVertical","props","_extends","DividerHorizontal"],"mappings":"kJAkBaA,EAAgCC,EAAIA,MAAeC,IAQ5C,IAR6CC,YAC/DA,EAAWC,SAAEA,EAAQC,MACrBA,EAAQ,sBAAqBC,QAC7BA,EAAOC,OACPA,EAAS,MAAKC,KAAEA,EAAO,IAAGC,MAC1BA,EAAQ,MAAKC,OAAEA,EAAS,MAAKC,OAC7BA,EAAMC,UACNA,EAAY,IACCV,EACb,MAAMW,EAAaC,EAAAA,SAAQ,IAAsB,aAAhBX,IAA2C,IAAbC,GAAmB,CAACD,EAAaC,IAE1FW,EAASD,EAAAA,SAAQ,KACrB,CACE,UAAWL,EACX,WAAYC,EACZ,WAAYH,EACZ,YAAaD,EACb,UAAWD,EACX,SAAUG,EACV,WAAYG,IAAWE,EAAa,SAAW,aAEhD,CAACJ,EAAOC,EAAQH,EAAQD,EAASD,EAAOG,EAAMG,EAAQE,IAEnDG,EAAcH,EAAaI,EAAAA,QAAQb,SAAWa,EAAAA,QAAQC,WAE5D,OACEC,MAAAC,cAAA,MAAA,CACER,UAASS,GAAAA,OAAMJ,EAAOK,QAAS,gBAAeD,KAAAA,OAAIL,EAAW,KAAAK,OAAIT,GACjEW,MAAOR,GACP,IAINf,EAAYwB,YAAc,cAEbC,MAAAA,EACTxB,EAAIA,MAAEyB,GAAUP,MAAAC,cAACpB,EAAW2B,UAAA,CAACvB,UAAQ,EAACG,OAAO,QAAWmB,MAC5DD,EAAgBD,YAAc,kBAEjBI,MAAAA,EACT3B,EAAIA,MAAEyB,GAAUP,MAAAC,cAACpB,EAAW2B,UAAA,CAACpB,OAAO,QAAWmB,MACnDE,EAAkBJ,YAAc"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var e=require("react"),r=require("../container/layoutBox/LayoutBox.js"),t=require("./errorBoundary.module.scss.js"),o=require("../icon/IconBase.js");const a=e.memo((e=>{let{title:a,text:n}=e;return React.createElement(r.LayoutBox,{className:t.default.errorBoundary,direction:"column",flexWrap:"wrap",gap:"2rem",padding:"1rem"},a&&React.createElement("h1",null,a),React.createElement(r.LayoutBox,{align:"center",justify:"space-between",gap:"1rem"},React.createElement(o.IconBase,{className:t.default.StyledIcon,color:"#FF0000",width:"3rem",height:"3rem"},React.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512"},React.createElement("path",{d:"M506.3 417l-213.3-364c-16.33-28-57.54-28-73.98 0l-213.2 364C-10.59 444.9 9.849 480 42.74 480h426.6C502.1 480 522.6 445 506.3 417zM232 168c0-13.25 10.75-24 24-24S280 154.8 280 168v128c0 13.25-10.75 24-23.1 24S232 309.3 232 296V168zM256 416c-17.36 0-31.44-14.08-31.44-31.44c0-17.36 14.07-31.44 31.44-31.44s31.44 14.08 31.44 31.44C287.4 401.9 273.4 416 256 416z"}))),n&&React.createElement(r.LayoutBox,{flexShrink:"0",width:"90%"},n)))}));a.displayName="DefaultErrorComponent";class n extends e.PureComponent{constructor(e){super(e),this.state={hasError:!1}}static getDerivedStateFromError(e){return{hasError:!0,error:e}}componentDidCatch(e,r){this.setState({hasError:!0,error:e,errorInfo:r})}render(){const{ErrorComponent:e=a,title:r,text:t}=this.props,{hasError:o,error:n,errorInfo:c}=this.state;return o?React.createElement(e,{title:r||(null==n?void 0:n.toString())||"Error",text:t||"".concat(JSON.stringify(c,null,2))}):this.props.children}}exports.DefaultErrorComponent=a,exports.ErrorBoundary=n;
|
|
2
|
+
//# sourceMappingURL=ErrorBoundary.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ErrorBoundary.js","sources":["../../../../../../../../src/core/ui/components/error/ErrorBoundary.tsx"],"sourcesContent":["import { FC, memo, PureComponent, ReactNode } from 'react'\n\nimport { IconBase } from '../icon'\nimport { LayoutBox } from '../container/layoutBox/LayoutBox'\n\nimport classes from './errorBoundary.module.scss'\nimport { DefaultErrorComponentProps, ErrorBoundaryProps } from './errorBoundary.types'\n\n\ninterface State {\n error?: Error\n errorInfo?: unknown\n hasError: boolean\n}\n\n\nexport const DefaultErrorComponent: FC<DefaultErrorComponentProps>\n= memo(({ title, text }: DefaultErrorComponentProps) => (\n <LayoutBox className={classes.errorBoundary} direction='column' flexWrap='wrap' gap='2rem' padding='1rem'>\n {title && <h1>{title}</h1>}\n <LayoutBox align='center' justify='space-between' gap='1rem'>\n <IconBase\n className={classes.StyledIcon}\n color='#FF0000'\n width='3rem'\n height='3rem'\n >\n <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'>\n <path d='M506.3 417l-213.3-364c-16.33-28-57.54-28-73.98 0l-213.2 364C-10.59 444.9 9.849 480 42.74 480h426.6C502.1 480 522.6 445 506.3 417zM232 168c0-13.25 10.75-24 24-24S280 154.8 280 168v128c0 13.25-10.75 24-23.1 24S232 309.3 232 296V168zM256 416c-17.36 0-31.44-14.08-31.44-31.44c0-17.36 14.07-31.44 31.44-31.44s31.44 14.08 31.44 31.44C287.4 401.9 273.4 416 256 416z' />\n </svg>\n </IconBase>\n {text && (\n <LayoutBox flexShrink='0' width='90%'>\n {text}\n </LayoutBox>\n )}\n </LayoutBox>\n </LayoutBox>\n))\nDefaultErrorComponent.displayName = 'DefaultErrorComponent'\n\nexport class ErrorBoundary extends PureComponent<ErrorBoundaryProps, State> {\n constructor(props: ErrorBoundaryProps) {\n super(props)\n this.state = { hasError: false }\n }\n\n static getDerivedStateFromError(error: Error): State {\n return { hasError: true, error }\n }\n\n componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void {\n // eslint-disable-next-line no-console\n error && console.error(error)\n // eslint-disable-next-line no-console\n errorInfo && console.error(errorInfo)\n // this.lastError = { error, errorInfo }\n this.setState({ hasError: true, error, errorInfo })\n }\n\n render(): ReactNode {\n const { ErrorComponent = DefaultErrorComponent, title, text } = this.props\n const { hasError, error, errorInfo } = this.state\n\n if (hasError) {\n return (\n <ErrorComponent\n title={title || error?.toString() || 'Error'}\n text={text || `${JSON.stringify(errorInfo, null, 2)}`}\n />\n )\n }\n\n return this.props.children\n }\n}\n"],"names":["DefaultErrorComponent","memo","_ref","title","text","React","createElement","LayoutBox","className","classes","default","errorBoundary","direction","flexWrap","gap","padding","align","justify","IconBase","StyledIcon","color","width","height","xmlns","viewBox","d","flexShrink","displayName","ErrorBoundary","PureComponent","constructor","props","super","this","state","hasError","getDerivedStateFromError","error","componentDidCatch","errorInfo","setState","render","ErrorComponent","toString","concat","JSON","stringify","children"],"mappings":"kKAgBaA,MAAAA,EACXC,EAAIA,MAACC,IAAA,IAACC,MAAEA,EAAKC,KAAEA,GAAkCF,EAAA,OACjDG,MAAAC,cAACC,YAAS,CAACC,UAAWC,EAAOC,QAACC,cAAeC,UAAU,SAASC,SAAS,OAAOC,IAAI,OAAOC,QAAQ,QAChGZ,GAASE,MAAAC,cAAA,KAAA,KAAKH,GACfE,MAAAC,cAACC,YAAS,CAACS,MAAM,SAASC,QAAQ,gBAAgBH,IAAI,QACpDT,MAAAC,cAACY,WAAQ,CACPV,UAAWC,EAAOC,QAACS,WACnBC,MAAM,UACNC,MAAM,OACNC,OAAO,QAEPjB,MAAAC,cAAA,MAAA,CAAKiB,MAAM,6BAA6BC,QAAQ,eAC9CnB,MAAAC,cAAA,OAAA,CAAMmB,EAAE,6WAGXrB,GACCC,MAAAC,cAACC,EAAAA,UAAS,CAACmB,WAAW,IAAIL,MAAM,OAC7BjB,IAIG,IAEdJ,EAAsB2B,YAAc,wBAE7B,MAAMC,UAAsBC,EAAAA,cACjCC,WAAAA,CAAYC,GACVC,MAAMD,GACNE,KAAKC,MAAQ,CAAEC,UAAU,EAC3B,CAEA,+BAAOC,CAAyBC,GAC9B,MAAO,CAAEF,UAAU,EAAME,QAC3B,CAEAC,iBAAAA,CAAkBD,EAAcE,GAM9BN,KAAKO,SAAS,CAAEL,UAAU,EAAME,QAAOE,aACzC,CAEAE,MAAAA,GACE,MAAMC,eAAEA,EAAiB1C,EAAqBG,MAAEA,EAAKC,KAAEA,GAAS6B,KAAKF,OAC/DI,SAAEA,EAAQE,MAAEA,EAAKE,UAAEA,GAAcN,KAAKC,MAE5C,OAAIC,EAEA9B,MAAAC,cAACoC,EAAc,CACbvC,MAAOA,IAASkC,aAAAA,EAAAA,EAAOM,aAAc,QACrCvC,KAAMA,GAAIwC,GAAAA,OAAOC,KAAKC,UAAUP,EAAW,KAAM,MAKhDN,KAAKF,MAAMgB,QACpB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"errorBoundary.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("./flowLayout.module.scss.js"),o=require("../../container/LayoutBox.js"),
|
|
1
|
+
"use strict";var e=require("../../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("./flowLayout.module.scss.js"),o=require("../../container/layoutBox/LayoutBox.js"),l=require("../../../../utils/helpers/ui.js");const r=t.memo((r=>{let{itemDTOs:s,containerProps:n={},defaultItemLayoutProps:u={},numColumns:c=1,className:m="",beforeContent:i,afterContent:d,...p}=r;const y=t.useMemo((()=>c>0?{display:"grid",gridTemplateColumns:"".concat("1fr ".repeat(c)),width:"100%",height:"unset"}:{display:"flex"}),[c]);return React.createElement(o.LayoutBox,e.extends({width:"100%",column:!0,className:l.classNames(a.default.flowLayout,m)},p),i&&React.createElement("span",{className:a.default.beforeContent,tabIndex:-1},i),React.createElement(o.LayoutBox,e.extends({flexWrap:"wrap",gap:"1rem",style:y,width:"100%"},n),s.map((t=>{let{id:a,spanColumn:l,Component:r,layoutProps:s,...n}=t;return React.createElement(o.LayoutBox,e.extends({key:a},u,s,l?{style:{width:"calc(".concat(Math.round(100*l),"% - ").concat(16*l,"px)")}}:{}),React.createElement(r,n))}))),d&&React.createElement("span",{className:a.default.afterContent,tabIndex:-1},d))}));r.displayName="FlowLayout",exports.FlowLayout=r;
|
|
2
2
|
//# sourceMappingURL=FlowLayout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlowLayout.js","sources":["../../../../../../../../../src/core/ui/components/molecules/layouts/FlowLayout.tsx"],"sourcesContent":["import { memo, FC, useMemo } from 'react'\n\nimport { LayoutBox } from '../../container'\nimport { classNames } from '../../../../utils'\n\nimport type { FlowLayoutProps, ItemDTOType } from './flowLayout.types'\nimport classes from './flowLayout.module.scss'\n\n\n/**\n * Renders a flexible flow layout that automatically arranges child components based on specified columns and spacing.\n * This component is highly customizable through its props,\n * allowing for dynamic layouts responsive to the content and screen size.\n *\n * Utilizes a grid layout by default, falling back to flex layout\n * if `numColumns` is not greater than 0. Each item's width\n * and placement can be controlled via `spanColumn` on\n * individual items, with additional layout props provided for fine-tuning.\n *\n * @param {FlowLayoutProps} props The properties to configure the FlowLayout.\n * @param {ItemDTOType[]} props.itemDTOs Array of item DTOs defining the\n * components to render and their layout properties.\n * @param {Partial<LayoutBoxProps>} [props.containerProps={}] Optional.\n * Props to be spread onto the container `LayoutBox`, allowing for custom styles and behaviors.\n * @param {Partial<LayoutBoxProps>} [props.defaultItemLayoutProps={}] Optional.\n * Default layout properties applied to each item, unless overridden by item-specific props.\n * @param {number} [props.numColumns=1] Optional.\n * Defines the number of columns in the grid. Affects item distribution and layout.\n * @param {string} [props.className=''] Optional.\n * Additional CSS class names to apply to the layout container for custom styling.\n * @param {ReactNode} [props.beforeContent] Optional.\n * Content to render before the main items. Useful for titles, descriptions, or custom components.\n * @param {ReactNode} [props.afterContent] Optional.\n Content to render after the main items. Can be used for additional information or actions related to the items.\n * @returns {React.ReactElement} The rendered FlowLayout component.\n */\nexport const FlowLayout: FC<FlowLayoutProps> = memo<FlowLayoutProps>(({\n itemDTOs,\n containerProps = {},\n defaultItemLayoutProps = {},\n numColumns = 1,\n className = '',\n beforeContent,\n afterContent,\n ...props\n}: FlowLayoutProps) => {\n // Calculation for column styles based on the number of columns specified.\n const columnStyles = useMemo(() => (numColumns > 0\n ? {\n display: 'grid',\n gridTemplateColumns: `${'1fr '.repeat(numColumns)}`,\n width: '100%',\n height: 'unset',\n }\n : {\n display: 'flex',\n }\n ), [numColumns])\n\n return (\n <LayoutBox\n width='100%'\n column\n className={classNames(classes.flowLayout, className)}\n {...props}\n >\n {beforeContent && (\n <span className={classes.beforeContent} tabIndex={-1}>\n {beforeContent}\n </span>\n )}\n <LayoutBox\n flexWrap='wrap'\n gap='1rem'\n style={columnStyles}\n width='100%'\n {...containerProps}\n >\n {itemDTOs.map(({ id, spanColumn, Component, layoutProps, ...props }: ItemDTOType) => (\n <LayoutBox\n key={id}\n {...defaultItemLayoutProps}\n {...layoutProps}\n {...(spanColumn\n ? { style: { width: `calc(${Math.round(spanColumn * 100)}% - ${spanColumn * 16}px)` } }\n : {})}\n >\n <Component {...props} />\n </LayoutBox>\n ))}\n </LayoutBox>\n {afterContent && (\n <span className={classes.afterContent} tabIndex={-1}>\n {afterContent}\n </span>\n )}\n </LayoutBox>\n )\n})\n\nexport type FlowLayoutType = typeof FlowLayout;\n\n// Set display name for the component.\nFlowLayout.displayName = 'FlowLayout'\n"],"names":["FlowLayout","memo","_ref","itemDTOs","containerProps","defaultItemLayoutProps","numColumns","className","beforeContent","afterContent","props","columnStyles","useMemo","display","gridTemplateColumns","concat","repeat","width","height","React","createElement","LayoutBox","_extends","column","classNames","classes","flowLayout","default","tabIndex","flexWrap","gap","style","map","_ref2","id","spanColumn","Component","layoutProps","key","Math","round","displayName"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FlowLayout.js","sources":["../../../../../../../../../src/core/ui/components/molecules/layouts/FlowLayout.tsx"],"sourcesContent":["import { memo, FC, useMemo } from 'react'\n\nimport { LayoutBox } from '../../container'\nimport { classNames } from '../../../../utils'\n\nimport type { FlowLayoutProps, ItemDTOType } from './flowLayout.types'\nimport classes from './flowLayout.module.scss'\n\n\n/**\n * Renders a flexible flow layout that automatically arranges child components based on specified columns and spacing.\n * This component is highly customizable through its props,\n * allowing for dynamic layouts responsive to the content and screen size.\n *\n * Utilizes a grid layout by default, falling back to flex layout\n * if `numColumns` is not greater than 0. Each item's width\n * and placement can be controlled via `spanColumn` on\n * individual items, with additional layout props provided for fine-tuning.\n *\n * @param {FlowLayoutProps} props The properties to configure the FlowLayout.\n * @param {ItemDTOType[]} props.itemDTOs Array of item DTOs defining the\n * components to render and their layout properties.\n * @param {Partial<LayoutBoxProps>} [props.containerProps={}] Optional.\n * Props to be spread onto the container `LayoutBox`, allowing for custom styles and behaviors.\n * @param {Partial<LayoutBoxProps>} [props.defaultItemLayoutProps={}] Optional.\n * Default layout properties applied to each item, unless overridden by item-specific props.\n * @param {number} [props.numColumns=1] Optional.\n * Defines the number of columns in the grid. Affects item distribution and layout.\n * @param {string} [props.className=''] Optional.\n * Additional CSS class names to apply to the layout container for custom styling.\n * @param {ReactNode} [props.beforeContent] Optional.\n * Content to render before the main items. Useful for titles, descriptions, or custom components.\n * @param {ReactNode} [props.afterContent] Optional.\n Content to render after the main items. Can be used for additional information or actions related to the items.\n * @returns {React.ReactElement} The rendered FlowLayout component.\n */\nexport const FlowLayout: FC<FlowLayoutProps> = memo<FlowLayoutProps>(({\n itemDTOs,\n containerProps = {},\n defaultItemLayoutProps = {},\n numColumns = 1,\n className = '',\n beforeContent,\n afterContent,\n ...props\n}: FlowLayoutProps) => {\n // Calculation for column styles based on the number of columns specified.\n const columnStyles = useMemo(() => (numColumns > 0\n ? {\n display: 'grid',\n gridTemplateColumns: `${'1fr '.repeat(numColumns)}`,\n width: '100%',\n height: 'unset',\n }\n : {\n display: 'flex',\n }\n ), [numColumns])\n\n return (\n <LayoutBox\n width='100%'\n column\n className={classNames(classes.flowLayout, className)}\n {...props}\n >\n {beforeContent && (\n <span className={classes.beforeContent} tabIndex={-1}>\n {beforeContent}\n </span>\n )}\n <LayoutBox\n flexWrap='wrap'\n gap='1rem'\n style={columnStyles}\n width='100%'\n {...containerProps}\n >\n {itemDTOs.map(({ id, spanColumn, Component, layoutProps, ...props }: ItemDTOType) => (\n <LayoutBox\n key={id}\n {...defaultItemLayoutProps}\n {...layoutProps}\n {...(spanColumn\n ? { style: { width: `calc(${Math.round(spanColumn * 100)}% - ${spanColumn * 16}px)` } }\n : {})}\n >\n <Component {...props} />\n </LayoutBox>\n ))}\n </LayoutBox>\n {afterContent && (\n <span className={classes.afterContent} tabIndex={-1}>\n {afterContent}\n </span>\n )}\n </LayoutBox>\n )\n})\n\nexport type FlowLayoutType = typeof FlowLayout;\n\n// Set display name for the component.\nFlowLayout.displayName = 'FlowLayout'\n"],"names":["FlowLayout","memo","_ref","itemDTOs","containerProps","defaultItemLayoutProps","numColumns","className","beforeContent","afterContent","props","columnStyles","useMemo","display","gridTemplateColumns","concat","repeat","width","height","React","createElement","LayoutBox","_extends","column","classNames","classes","flowLayout","default","tabIndex","flexWrap","gap","style","map","_ref2","id","spanColumn","Component","layoutProps","key","Math","round","displayName"],"mappings":"yPAoCaA,EAAkCC,EAAIA,MAAkBC,IAS9C,IAT+CC,SACpEA,EAAQC,eACRA,EAAiB,CAAE,EAAAC,uBACnBA,EAAyB,CAAE,EAAAC,WAC3BA,EAAa,EAACC,UACdA,EAAY,GAAEC,cACdA,EAAaC,aACbA,KACGC,GACaR,EAEhB,MAAMS,EAAeC,EAAAA,SAAQ,IAAON,EAAa,EAC7C,CACAO,QAAS,OACTC,oBAAmB,GAAAC,OAAK,OAAOC,OAAOV,IACtCW,MAAO,OACPC,OAAQ,SAER,CACAL,QAAS,SAEV,CAACP,IAEJ,OACEa,MAAAC,cAACC,EAASA,UAAAC,UAAA,CACRL,MAAM,OACNM,QAAM,EACNhB,UAAWiB,EAAUA,WAACC,UAAQC,WAAYnB,IACtCG,GAEHF,GACCW,MAAAC,cAAA,OAAA,CAAMb,UAAWkB,EAAOE,QAACnB,cAAeoB,UAAW,GAChDpB,GAGLW,MAAAC,cAACC,EAAAA,UAASC,EAAAA,QAAA,CACRO,SAAS,OACTC,IAAI,OACJC,MAAOpB,EACPM,MAAM,QACFb,GAEHD,EAAS6B,KAAIC,IAAA,IAACC,GAAEA,EAAEC,WAAEA,EAAUC,UAAEA,EAASC,YAAEA,KAAgB3B,GAAoBuB,EAAA,OAC9Ed,MAAAC,cAACC,EAASA,UAAAC,UAAA,CACRgB,IAAKJ,GACD7B,EACAgC,EACCF,EACD,CAAEJ,MAAO,CAAEd,cAAKF,OAAUwB,KAAKC,MAAmB,IAAbL,GAAiBpB,QAAAA,OAAoB,GAAboB,EAAe,SAC5E,CAAA,GAEJhB,MAAAC,cAACgB,EAAc1B,GACL,KAGfD,GACCU,MAAAC,cAAA,OAAA,CAAMb,UAAWkB,EAAOE,QAAClB,aAAcmB,UAAW,GAC/CnB,GAGK,IAOhBT,EAAWyC,YAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("./core/hooks/useApi.js"),r=require("./core/hooks/useToggle.js"),
|
|
1
|
+
"use strict";var e=require("./core/hooks/useApi.js"),r=require("./core/hooks/useToggle.js"),o=require("./core/hooks/useTranslations.js"),t=require("./core/hooks/useOutsideClick.js"),s=require("./core/hooks/useResize.js"),i=require("./core/hooks/useClassNames.js"),a=require("./core/hooks/useParseProps.js"),l=require("./core/hooks/useThemePreference.js"),n=require("./core/utils/helpers/birthnumber.validator.js"),p=require("./core/utils/helpers/birthnumberCZSKvalidator.js"),u=require("./core/utils/helpers/fileValidator.js"),c=require("./core/utils/helpers/date.js"),x=require("./core/utils/helpers/deviceInfo.js"),m=require("./core/utils/helpers/emailMatcher.js"),d=require("./core/utils/helpers/file.js"),h=require("./core/utils/helpers/objectOperations.js"),T=require("./core/utils/helpers/other.js"),C=require("./core/utils/helpers/textValueOperations.js"),j=require("./core/utils/helpers/valueOperations.js"),S=require("./core/utils/helpers/cancelableDelayedFunction.js"),v=require("./core/utils/helpers/ui.js"),y=require("./core/utils/keyExtractor.js"),b=require("./core/utils/date.js"),F=require("./core/utils/webComponents/webComponent.utils.js"),g=require("./core/utils/appState/store/store.vanillajs.js"),q=require("./core/utils/appState/store/store.vanillajs.templates.js"),f=require("./core/utils/appState/store/useStore.react.js"),z=require("./core/constants/ui.constants.js"),D=require("./core/ui/utils/style.js"),I=require("./core/ui/components/container/layoutBox/LayoutBox.js"),L=require("./core/ui/components/container/layoutBox/layoutBox.types.js"),P=require("./core/ui/components/container/lazyComponent/LazyComponent.js"),E=require("./core/ui/components/container/Flex.js"),V=require("./core/ui/components/container/Placeholder.js"),O=require("./core/ui/components/container/CollapsibleContainer.js"),B=require("./core/ui/components/container/ResizableContainer.js"),N=require("./core/ui/components/error/ErrorBoundary.js"),k=require("./core/ui/components/field/Field.js"),R=require("./core/ui/components/dividers/DividerLine.js"),A=require("./core/ui/components/icon/IconBase.js"),w=require("./core/ui/components/icon/Icon.js"),M=require("./core/ui/components/icon/IconWC.js"),W=require("./core/ui/components/molecules/layouts/FlowLayout.js");exports.useApi=e.useApi,exports.useToggle=r.useToggle,exports.createSafeT=o.createSafeT,exports.setUseTranslation=o.setUseTranslation,exports.useTranslations=o.useTranslations,exports.outsideClickHandler=t.outsideClickHandler,exports.useOutsideClick=t.useOutsideClick,exports.useResize=s.useResize,exports.useClassNames=i.useClassNames,exports.useParseProps=a.useParseProps,exports.baseThemes=l.baseThemes,exports.observeThemePreference=l.observeThemePreference,exports.switchColorTheme=l.switchColorTheme,exports.updateColorTheme=l.updateColorTheme,exports.useThemePreference=l.useThemePreference,exports.isBirthNumberValid=n.isBirthNumberValid,exports.getMatch=p.getMatch,exports.isValidFormat=p.isValidFormat,exports.isValidModulo11=p.isValidModulo11,exports.parse=p.parse,exports.regex=p.regex,exports.parseCSVdata=u.parseCSVdata,exports.validateCSVFile=u.validateCSVFile,exports.validateCSVlines=u.validateCSVlines,exports.validateJSONFile=u.validateJSONFile,exports.validateLineCellTrimmed=u.validateLineCellTrimmed,exports.validateLineNumColumns=u.validateLineNumColumns,exports.validateSDFFile=u.validateSDFFile,exports.DATE_FORMAT=c.DATE_FORMAT,exports.formatDateToTimestamp=c.formatDateToTimestamp,exports.getDate=c.getDate,exports.getDeviceId=x.getDeviceId,exports.emailMatch=m.emailMatch,exports.emailMatcher=m.emailMatcher,exports.regexBuilder=m.regexBuilder,exports.cleanCsvLines=d.cleanCsvLines,exports.formatFilePath=d.formatFilePath,exports.arrayToObjectTree=h.arrayToObjectTree,exports.chunkArray=h.chunkArray,exports.duplicatesInArray=h.duplicatesInArray,exports.formatJsonString=h.formatJsonString,exports.formatObj=h.formatObj,exports.formatObj2=h.formatObj2,exports.debounce=T.debounce,exports.delay=T.delay,exports.memoize=T.memoize,exports.memoizeComplex=T.memoizeComplex,exports.memoizer=T.memoizer,exports.nestedTernary=T.nestedTernary,exports.escapeRegExp=C.escapeRegExp,exports.fileNameExt=C.fileNameExt,exports.findStringInText=C.findStringInText,exports.normalizeString=C.normalizeString,exports.removeWhitespaces=C.removeWhitespaces,exports.sanitizeId=C.sanitizeId,exports.sanitizePathId=C.sanitizePathId,exports.toLowerCase=C.toLowerCase,exports.toUpperCase=C.toUpperCase,exports.truncateText=C.truncateText,exports.Operation=j.Operation,exports.decrementValue=j.decrementValue,exports.incerementValue=j.incerementValue,exports.numberDefined=j.numberDefined,exports.numberOperation=j.numberOperation,exports.restrictNumberInLimits=j.restrictNumberInLimits,exports.setValue=j.setValue,exports.cancelableSetInterval=S.cancelableSetInterval,exports.cancelableSetTimeout=S.cancelableSetTimeout,exports.classNames=v.classNames,exports.mapSerReplacer=v.mapSerReplacer,exports.noop=v.noop,exports.parseProps=v.parseProps,exports.keyExtractor=y.keyExtractor,exports.keyExtractorFunction=y.keyExtractorFunction,exports.dateRangeFormat=b.dateRangeFormat,exports.getDateTime=b.getDateTime,exports.getTimeFromNow=b.getTimeFromNow,exports.getTimeFromNowOriginal=b.getTimeFromNowOriginal,exports.getTimeTo=b.getTimeTo,exports.ced=F.ced,exports.createResolveAttribute=F.createResolveAttribute,exports.customElementDefine=F.customElementDefine,exports.resolveAttributes=F.resolveAttributes,exports.createStore=g.createStore,exports.createDataStore=q.createDataStore,exports.useStore=f.useStore,exports.useStoreApi=f.useStoreApi,exports.EventName=z.EventName,exports.calculateColors=D.calculateColors,exports.calculatePercColor=D.calculatePercColor,exports.convertHex=D.convertHex,exports.convertRGB=D.convertRGB,Object.defineProperty(exports,"defaultFontSize",{enumerable:!0,get:function(){return D.defaultFontSize}}),exports.pxToRem=D.pxToRem,exports.resolveStyleValue=D.resolveStyleValue,exports.setDefaultFontSize=D.setDefaultFontSize,exports.toHex=D.toHex,exports.LayoutBox=I.LayoutBox,exports.LayoutDirection=L.LayoutDirection,exports.LazyComponent=P.LazyComponent,exports.PendingBoundary=P.PendingBoundary,exports.createLazyModule=P.createLazyModule,exports.createLazyModuleWithStore=P.createLazyModuleWithStore,exports.wrapPromise=P.wrapPromise,exports.Flex=E.Flex,exports.FlexTight=E.FlexTight,exports.FlexTightStyled=E.FlexTightStyled,exports.FlexWrapper=E.FlexWrapper,exports.Placeholder=V.Placeholder,exports.CollapsibleContainer=O.CollapsibleContainer,exports.ResizableContainer=B.ResizableContainer,exports.DefaultErrorComponent=N.DefaultErrorComponent,exports.ErrorBoundary=N.ErrorBoundary,exports.Field=k.Field,exports.FieldWrapper=k.FieldWrapper,exports.Select=k.Select,exports.setIconColor=k.setIconColor,exports.setIconComponent=k.setIconComponent,exports.DividerHorizontal=R.DividerHorizontal,exports.DividerLine=R.DividerLine,exports.DividerVertical=R.DividerVertical,exports.IconBase=A.IconBase,exports.Icon=w.Icon,exports.ESIcon=M.ESIcon,exports.ESIconBase=M.ESIconBase,exports.FlowLayout=W.FlowLayout;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|