@alfalab/core-components-modal 9.9.1 → 9.9.3
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.js +6 -4
- package/components/content/Component.js +3 -3
- package/components/content/desktop.css +11 -8
- package/components/content/index.css +8 -5
- package/components/content/mobile.css +7 -4
- package/components/controls/Component.js +2 -2
- package/components/controls/index.css +2 -2
- package/components/footer/Component.js +4 -4
- package/components/footer/desktop.css +13 -10
- package/components/footer/index.css +7 -4
- package/components/footer/layout.css +20 -17
- package/components/footer/mobile.css +7 -4
- package/components/header/Component.js +3 -3
- package/components/header/desktop.css +19 -16
- package/components/header/index.css +7 -4
- package/components/header/mobile.css +38 -15
- package/cssm/Component.js +3 -1
- package/cssm/components/content/desktop.module.css +4 -1
- package/cssm/components/content/index.module.css +4 -1
- package/cssm/components/content/mobile.module.css +4 -1
- package/cssm/components/footer/desktop.module.css +4 -1
- package/cssm/components/footer/index.module.css +3 -0
- package/cssm/components/footer/layout.module.css +3 -0
- package/cssm/components/footer/mobile.module.css +4 -1
- package/cssm/components/header/desktop.module.css +4 -1
- package/cssm/components/header/index.module.css +3 -0
- package/cssm/components/header/mobile.module.css +37 -14
- package/cssm/desktop/desktop.module.css +4 -1
- package/cssm/mobile/mobile.module.css +31 -10
- package/cssm/vars.css +3 -0
- package/desktop/desktop.css +13 -10
- package/esm/Component.js +6 -4
- package/esm/components/content/Component.js +3 -3
- package/esm/components/content/desktop.css +11 -8
- package/esm/components/content/index.css +8 -5
- package/esm/components/content/mobile.css +7 -4
- package/esm/components/controls/Component.js +2 -2
- package/esm/components/controls/index.css +2 -2
- package/esm/components/footer/Component.js +4 -4
- package/esm/components/footer/desktop.css +13 -10
- package/esm/components/footer/index.css +7 -4
- package/esm/components/footer/layout.css +20 -17
- package/esm/components/footer/mobile.css +7 -4
- package/esm/components/header/Component.js +3 -3
- package/esm/components/header/desktop.css +19 -16
- package/esm/components/header/index.css +7 -4
- package/esm/components/header/mobile.css +38 -15
- package/esm/desktop/desktop.css +13 -10
- package/esm/layout.module-03b8ec62.js +4 -0
- package/esm/mobile/mobile.css +32 -11
- package/esm/transitions.css +8 -8
- package/layout.module-a0f31939.js +6 -0
- package/mobile/mobile.css +32 -11
- package/modern/Component.js +7 -3
- package/modern/components/content/Component.js +3 -3
- package/modern/components/content/desktop.css +11 -8
- package/modern/components/content/index.css +8 -5
- package/modern/components/content/mobile.css +7 -4
- package/modern/components/controls/Component.js +2 -2
- package/modern/components/controls/index.css +2 -2
- package/modern/components/footer/Component.js +4 -4
- package/modern/components/footer/desktop.css +13 -10
- package/modern/components/footer/index.css +7 -4
- package/modern/components/footer/layout.css +20 -17
- package/modern/components/footer/mobile.css +7 -4
- package/modern/components/header/Component.js +3 -3
- package/modern/components/header/desktop.css +19 -16
- package/modern/components/header/index.css +7 -4
- package/modern/components/header/mobile.css +38 -15
- package/modern/desktop/desktop.css +13 -10
- package/modern/layout.module-71ff5b2a.js +4 -0
- package/modern/mobile/mobile.css +32 -11
- package/modern/transitions.css +8 -8
- package/moderncssm/Component.js +4 -0
- package/moderncssm/components/header/mobile.module.css +9 -5
- package/moderncssm/mobile/mobile.module.css +10 -2
- package/package.json +5 -5
- package/src/Component.tsx +4 -0
- package/src/components/header/mobile.module.css +5 -0
- package/src/mobile/mobile.module.css +8 -0
- package/transitions.css +8 -8
- package/esm/layout.module-d9a82675.js +0 -4
- package/layout.module-1610875a.js +0 -6
- package/modern/layout.module-0d520ad0.js +0 -4
package/modern/mobile/mobile.css
CHANGED
|
@@ -1,24 +1,38 @@
|
|
|
1
|
-
/* hash:
|
|
1
|
+
/* hash: ub42k */
|
|
2
|
+
:root {
|
|
3
|
+
--sat: env(safe-area-inset-top, var(--gap-0));
|
|
4
|
+
--sab: env(safe-area-inset-bottom, var(--gap-0));
|
|
5
|
+
}
|
|
2
6
|
: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
|
-
}
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
+
}
|
|
8
|
+
/* deprecated */
|
|
9
|
+
: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 */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
10
|
+
}
|
|
11
|
+
: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 */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
12
|
+
}
|
|
13
|
+
: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 */
|
|
14
|
+
}
|
|
15
|
+
:root {
|
|
7
16
|
|
|
8
17
|
/* Hard */
|
|
9
18
|
|
|
10
19
|
/* Up */
|
|
11
20
|
|
|
12
21
|
/* Hard up */
|
|
13
|
-
}
|
|
22
|
+
}
|
|
23
|
+
:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
|
|
14
24
|
|
|
15
25
|
/* новые значения, используйте их */
|
|
16
|
-
}
|
|
26
|
+
}
|
|
27
|
+
: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 */
|
|
17
28
|
|
|
18
29
|
/* новые значения, используйте их */
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
30
|
+
|
|
31
|
+
/* no-unit может приводить к проблемам в calc (#1559) */
|
|
32
|
+
/* stylelint-disable-next-line length-zero-no-unit */
|
|
33
|
+
}
|
|
34
|
+
/* сбрасывает синюю подсветку при нажатии */
|
|
35
|
+
:root {
|
|
22
36
|
|
|
23
37
|
/* sizes */
|
|
24
38
|
|
|
@@ -31,8 +45,15 @@
|
|
|
31
45
|
/* mobile */
|
|
32
46
|
|
|
33
47
|
/* paddings */
|
|
34
|
-
}
|
|
48
|
+
}
|
|
49
|
+
.modal__component_151fe {
|
|
35
50
|
flex: 1;
|
|
36
51
|
width: 100%;
|
|
37
52
|
max-width: 600px;
|
|
38
53
|
}
|
|
54
|
+
@media (display-mode: standalone) {
|
|
55
|
+
.modal__content_151fe {
|
|
56
|
+
padding-top: var(--sat);
|
|
57
|
+
padding-bottom: var(--sab)
|
|
58
|
+
}
|
|
59
|
+
}
|
package/modern/transitions.css
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
/* hash:
|
|
2
|
-
.
|
|
3
|
-
.
|
|
1
|
+
/* hash: r79ii */
|
|
2
|
+
.modal__appear_r62x6,
|
|
3
|
+
.modal__enter_r62x6 {
|
|
4
4
|
opacity: 0;
|
|
5
5
|
transform: translateY(15px);
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
-
.
|
|
9
|
-
.
|
|
8
|
+
.modal__appearActive_r62x6,
|
|
9
|
+
.modal__enterActive_r62x6 {
|
|
10
10
|
opacity: 1;
|
|
11
11
|
transform: translateY(0);
|
|
12
12
|
transition: opacity 200ms ease-in, transform 200ms ease-in;
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
.
|
|
15
|
+
.modal__exit_r62x6 {
|
|
16
16
|
opacity: 1;
|
|
17
17
|
transform: translateY(0);
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
.
|
|
21
|
-
.
|
|
20
|
+
.modal__exitActive_r62x6,
|
|
21
|
+
.modal__exitDone_r62x6 {
|
|
22
22
|
opacity: 0;
|
|
23
23
|
transform: translateY(15px);
|
|
24
24
|
transition: opacity 200ms ease-out, transform 200ms ease-out;
|
package/moderncssm/Component.js
CHANGED
|
@@ -49,6 +49,10 @@ const Modal = forwardRef(({ size = 500, fixedPosition, fullscreen, children, cla
|
|
|
49
49
|
...transitionProps,
|
|
50
50
|
},
|
|
51
51
|
className: cn(className, mobileStyles.component),
|
|
52
|
+
contentProps: {
|
|
53
|
+
...restProps.contentProps,
|
|
54
|
+
className: cn(mobileStyles.content, restProps.contentProps?.className),
|
|
55
|
+
},
|
|
52
56
|
};
|
|
53
57
|
const contextValue = useMemo(() => ({ size: componentSize, view, dataTestId }), [componentSize, view, dataTestId]);
|
|
54
58
|
return (React.createElement(ResponsiveContext.Provider, { value: contextValue },
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--sat: env(safe-area-inset-top, var(--gap-0));
|
|
3
|
+
}
|
|
1
4
|
/* */
|
|
2
|
-
|
|
3
5
|
:root {
|
|
4
6
|
|
|
5
7
|
/* sizes */
|
|
@@ -20,15 +22,17 @@
|
|
|
20
22
|
/* paddings */
|
|
21
23
|
--modal-header-mobile-paddings: var(--gap-4) var(--gap-8);
|
|
22
24
|
}
|
|
23
|
-
|
|
24
25
|
.header {
|
|
25
26
|
padding: var(--modal-header-mobile-paddings);
|
|
26
27
|
}
|
|
27
|
-
|
|
28
28
|
.sticky {
|
|
29
|
-
top: var(--gap-0)
|
|
29
|
+
top: var(--gap-0)
|
|
30
30
|
}
|
|
31
|
-
|
|
31
|
+
@media (display-mode: standalone) {
|
|
32
|
+
.sticky {
|
|
33
|
+
top: var(--sat)
|
|
34
|
+
}
|
|
35
|
+
}
|
|
32
36
|
.content {
|
|
33
37
|
font-size: var(--modal-header-mobile-font-size);
|
|
34
38
|
line-height: var(--modal-header-mobile-line-height);
|
|
@@ -1,5 +1,8 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--sat: env(safe-area-inset-top, var(--gap-0));
|
|
3
|
+
--sab: env(safe-area-inset-bottom, var(--gap-0));
|
|
4
|
+
}
|
|
1
5
|
/* */
|
|
2
|
-
|
|
3
6
|
:root {
|
|
4
7
|
|
|
5
8
|
/* sizes */
|
|
@@ -14,9 +17,14 @@
|
|
|
14
17
|
|
|
15
18
|
/* paddings */
|
|
16
19
|
}
|
|
17
|
-
|
|
18
20
|
.component {
|
|
19
21
|
flex: 1;
|
|
20
22
|
width: 100%;
|
|
21
23
|
max-width: 600px;
|
|
22
24
|
}
|
|
25
|
+
@media (display-mode: standalone) {
|
|
26
|
+
.content {
|
|
27
|
+
padding-top: var(--sat);
|
|
28
|
+
padding-bottom: var(--sab)
|
|
29
|
+
}
|
|
30
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alfalab/core-components-modal",
|
|
3
|
-
"version": "9.9.
|
|
3
|
+
"version": "9.9.3",
|
|
4
4
|
"description": "Modal component",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
@@ -12,9 +12,9 @@
|
|
|
12
12
|
},
|
|
13
13
|
"sideEffects": false,
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@alfalab/core-components-base-modal": "^5.8.
|
|
16
|
-
"@alfalab/core-components-navigation-bar-private": "^0.5.
|
|
17
|
-
"@alfalab/core-components-shared": "^0.
|
|
15
|
+
"@alfalab/core-components-base-modal": "^5.8.9",
|
|
16
|
+
"@alfalab/core-components-navigation-bar-private": "^0.5.8",
|
|
17
|
+
"@alfalab/core-components-shared": "^0.15.0",
|
|
18
18
|
"@alfalab/core-components-mq": "^4.4.1",
|
|
19
19
|
"classnames": "^2.5.1",
|
|
20
20
|
"react-merge-refs": "^1.1.0",
|
|
@@ -24,5 +24,5 @@
|
|
|
24
24
|
"react": "^16.9.0 || ^17.0.1 || ^18.0.0"
|
|
25
25
|
},
|
|
26
26
|
"themesVersion": "13.7.0",
|
|
27
|
-
"varsVersion": "9.
|
|
27
|
+
"varsVersion": "9.18.0"
|
|
28
28
|
}
|
package/src/Component.tsx
CHANGED
|
@@ -81,6 +81,10 @@ export const Modal = forwardRef<HTMLDivElement, ModalDesktopProps & { view: View
|
|
|
81
81
|
...transitionProps,
|
|
82
82
|
},
|
|
83
83
|
className: cn(className, mobileStyles.component),
|
|
84
|
+
contentProps: {
|
|
85
|
+
...restProps.contentProps,
|
|
86
|
+
className: cn(mobileStyles.content, restProps.contentProps?.className),
|
|
87
|
+
},
|
|
84
88
|
};
|
|
85
89
|
|
|
86
90
|
const contextValue = useMemo(
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
@import '@alfalab/core-components-vars/src/safe-area.css';
|
|
1
2
|
@import '../vars.css';
|
|
2
3
|
|
|
3
4
|
.component {
|
|
@@ -5,3 +6,10 @@
|
|
|
5
6
|
width: 100%;
|
|
6
7
|
max-width: 600px;
|
|
7
8
|
}
|
|
9
|
+
|
|
10
|
+
.content {
|
|
11
|
+
@media (display-mode: standalone) {
|
|
12
|
+
padding-top: var(--sat);
|
|
13
|
+
padding-bottom: var(--sab);
|
|
14
|
+
}
|
|
15
|
+
}
|
package/transitions.css
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
/* hash:
|
|
2
|
-
.
|
|
3
|
-
.
|
|
1
|
+
/* hash: r79ii */
|
|
2
|
+
.modal__appear_r62x6,
|
|
3
|
+
.modal__enter_r62x6 {
|
|
4
4
|
opacity: 0;
|
|
5
5
|
transform: translateY(15px);
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
-
.
|
|
9
|
-
.
|
|
8
|
+
.modal__appearActive_r62x6,
|
|
9
|
+
.modal__enterActive_r62x6 {
|
|
10
10
|
opacity: 1;
|
|
11
11
|
transform: translateY(0);
|
|
12
12
|
transition: opacity 200ms ease-in, transform 200ms ease-in;
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
.
|
|
15
|
+
.modal__exit_r62x6 {
|
|
16
16
|
opacity: 1;
|
|
17
17
|
transform: translateY(0);
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
.
|
|
21
|
-
.
|
|
20
|
+
.modal__exitActive_r62x6,
|
|
21
|
+
.modal__exitDone_r62x6 {
|
|
22
22
|
opacity: 0;
|
|
23
23
|
transform: translateY(15px);
|
|
24
24
|
transition: opacity 200ms ease-out, transform 200ms ease-out;
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var layoutStyles = {"column":"modal__column_ztfdt","gap-16":"modal__gap-16_ztfdt","gap-24":"modal__gap-24_ztfdt","gap-32":"modal__gap-32_ztfdt","start":"modal__start_ztfdt","center":"modal__center_ztfdt","space-between":"modal__space-between_ztfdt"};
|
|
2
|
-
require('./components/footer/layout.css')
|
|
3
|
-
|
|
4
|
-
export { layoutStyles as l };
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var layoutStyles = {"column":"modal__column_ztfdt","gap-16":"modal__gap-16_ztfdt","gap-24":"modal__gap-24_ztfdt","gap-32":"modal__gap-32_ztfdt","start":"modal__start_ztfdt","center":"modal__center_ztfdt","space-between":"modal__space-between_ztfdt"};
|
|
4
|
-
require('./components/footer/layout.css')
|
|
5
|
-
|
|
6
|
-
exports.layoutStyles = layoutStyles;
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
const layoutStyles = {"column":"modal__column_ztfdt","gap-16":"modal__gap-16_ztfdt","gap-24":"modal__gap-24_ztfdt","gap-32":"modal__gap-32_ztfdt","start":"modal__start_ztfdt","center":"modal__center_ztfdt","space-between":"modal__space-between_ztfdt"};
|
|
2
|
-
require('./components/footer/layout.css')
|
|
3
|
-
|
|
4
|
-
export { layoutStyles as l };
|