@rolster/react-components 18.25.2 → 18.25.4
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/cjs/assets/{index-B6PshrCZ.css → index-C4DYcbf0.css} +21 -19
- package/dist/cjs/index.js +2 -2
- package/dist/cjs/index.js.map +1 -1
- package/dist/es/assets/{index-B6PshrCZ.css → index-C4DYcbf0.css} +21 -19
- package/dist/es/index.js +2 -2
- package/dist/es/index.js.map +1 -1
- package/dist/esm/components/organisms/BottomSheet/BottomSheet.d.ts +2 -2
- package/dist/esm/components/organisms/BottomSheet/BottomSheet.js +1 -1
- package/dist/esm/components/organisms/Modal/Modal.css +1 -0
- package/dist/esm/components/organisms/Modal/Modal.css.map +1 -1
- package/dist/esm/components/organisms/ModalSheet/ModalSheet.css +20 -19
- package/dist/esm/components/organisms/ModalSheet/ModalSheet.css.map +1 -1
- package/package.json +1 -1
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { RlsComponent } from '../../definitions';
|
|
2
2
|
import './BottomSheet.css';
|
|
3
|
-
interface
|
|
3
|
+
interface BottomSheetProps extends RlsComponent {
|
|
4
4
|
className?: string;
|
|
5
5
|
onAutoClose?: () => void;
|
|
6
6
|
visible?: boolean;
|
|
7
7
|
}
|
|
8
|
-
export declare function
|
|
8
|
+
export declare function RlsBottomSheet({ children, className, onAutoClose, visible, rlsTheme }: BottomSheetProps): import("react").ReactPortal;
|
|
9
9
|
export {};
|
|
@@ -3,7 +3,7 @@ import { useCallback, useMemo } from 'react';
|
|
|
3
3
|
import ReactDOM from 'react-dom';
|
|
4
4
|
import { renderClassStatus } from '../../../helpers/css';
|
|
5
5
|
import './BottomSheet.css';
|
|
6
|
-
export function
|
|
6
|
+
export function RlsBottomSheet({ children, className, onAutoClose, visible, rlsTheme }) {
|
|
7
7
|
const classNameSheet = useMemo(() => {
|
|
8
8
|
return renderClassStatus('rls-bottom-sheet', { visible }, className);
|
|
9
9
|
}, [className, visible]);
|
|
@@ -30,6 +30,7 @@
|
|
|
30
30
|
display: flex;
|
|
31
31
|
max-width: var(--rlc-modal-max-width, calc(100% - var(--rls-sizing-x8)));
|
|
32
32
|
height: var(--pvt-component-height);
|
|
33
|
+
max-height: calc(100% - var(--rls-sizing-x12));
|
|
33
34
|
flex-direction: column;
|
|
34
35
|
opacity: var(--pvt-component-opacity);
|
|
35
36
|
visibility: var(--pvt-component-visibility);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../../../../../src/components/organisms/Modal/Modal.scss"],"names":[],"mappings":"AAOA,WACE,wDACA,6BACA,2BACA,mCAEA,0BACA,+BAEA,eACA,aACA,SACA,UACA,WACA,YACA,8BACA,kBACA,mBACA,uBAEA,oBACE,oCACA,6BACA,2BACA,kDACA,4BACA,0BAEA,mBAGF,sBACE,kBACA,aACA,wEACA,mCACA,sBACA,qCACA,2CACA,6BACA,mCACA,iEACA,yCACA,gKAKF,qBACE,kBACA,cACA,SACA,UACA,WACA,kCACA,oCACA,UACA,yCACA,0BACA","file":"Modal.css"}
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../../../../../src/components/organisms/Modal/Modal.scss"],"names":[],"mappings":"AAOA,WACE,wDACA,6BACA,2BACA,mCAEA,0BACA,+BAEA,eACA,aACA,SACA,UACA,WACA,YACA,8BACA,kBACA,mBACA,uBAEA,oBACE,oCACA,6BACA,2BACA,kDACA,4BACA,0BAEA,mBAGF,sBACE,kBACA,aACA,wEACA,mCACA,8CACA,sBACA,qCACA,2CACA,6BACA,mCACA,iEACA,yCACA,gKAKF,qBACE,kBACA,cACA,SACA,UACA,WACA,kCACA,oCACA,UACA,yCACA,0BACA","file":"Modal.css"}
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
.rls-modal-sheet {
|
|
2
2
|
--pvt-component-transform: translateY(150px) scale(0.6);
|
|
3
|
-
--pvt-component-transform-visible: translateY(0) scale(1);
|
|
4
3
|
--pvt-component-bottom: initial;
|
|
5
4
|
--pvt-component-max-width: var(
|
|
6
5
|
--rlc-modal-sheet-max-width,
|
|
7
6
|
calc(100% - var(--rls-sizing-x8))
|
|
8
7
|
);
|
|
9
8
|
--pvt-component-height: 0rem;
|
|
10
|
-
--pvt-component-max-height:
|
|
9
|
+
--pvt-component-max-height: calc(100% - var(--rls-sizing-x12));
|
|
11
10
|
--pvt-component-border-radius: var(--rls-sizing-x4);
|
|
12
11
|
--pvt-component-opacity: 0;
|
|
13
12
|
--pvt-component-visibility: hidden;
|
|
@@ -28,7 +27,7 @@
|
|
|
28
27
|
--pvt-component-visibility: visible;
|
|
29
28
|
--pvt-component-height: auto;
|
|
30
29
|
--pvt-component-opacity: 1;
|
|
31
|
-
--pvt-component-transform:
|
|
30
|
+
--pvt-component-transform: translateY(0) scale(1);
|
|
32
31
|
--pvt-backdrop-bottom: 0rem;
|
|
33
32
|
--pvt-backdrop-opacity: 1;
|
|
34
33
|
visibility: visible;
|
|
@@ -65,25 +64,9 @@
|
|
|
65
64
|
transition: opacity 120ms 0ms var(--rls-deceleration-curve),
|
|
66
65
|
bottom 120ms 0ms var(--rls-deceleration-curve);
|
|
67
66
|
}
|
|
68
|
-
@media screen and (max-width: 640px) and (max-height: 960px) {
|
|
69
|
-
.rls-modal-sheet {
|
|
70
|
-
--pvt-component-max-height: calc(100% - 32rem);
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
@media screen and (max-width: 640px) and (max-height: 720px) {
|
|
74
|
-
.rls-modal-sheet {
|
|
75
|
-
--pvt-component-max-height: calc(100% - 24rem);
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
@media screen and (max-width: 640px) and (max-height: 560px) {
|
|
79
|
-
.rls-modal-sheet {
|
|
80
|
-
--pvt-component-max-height: calc(100% - 16rem);
|
|
81
|
-
}
|
|
82
|
-
}
|
|
83
67
|
@media screen and (max-width: 640px) {
|
|
84
68
|
.rls-modal-sheet {
|
|
85
69
|
--pvt-component-transform: translateY(100%);
|
|
86
|
-
--pvt-component-transform-visible: translateY(0);
|
|
87
70
|
--pvt-component-bottom: 0px;
|
|
88
71
|
--pvt-component-max-width: 240rem;
|
|
89
72
|
--pvt-component-max-height: 75%;
|
|
@@ -91,6 +74,9 @@
|
|
|
91
74
|
0rem 0rem;
|
|
92
75
|
align-items: initial;
|
|
93
76
|
}
|
|
77
|
+
.rls-modal-sheet--visible {
|
|
78
|
+
--pvt-component-transform: translateY(0);
|
|
79
|
+
}
|
|
94
80
|
.rls-modal-sheet__component::before {
|
|
95
81
|
display: block;
|
|
96
82
|
content: '';
|
|
@@ -100,4 +86,19 @@
|
|
|
100
86
|
background: var(--rls-app-color-300);
|
|
101
87
|
margin: var(--rls-sizing-x3) auto;
|
|
102
88
|
}
|
|
89
|
+
}
|
|
90
|
+
@media screen and (max-width: 640px) and (max-height: 960px) {
|
|
91
|
+
.rls-modal-sheet {
|
|
92
|
+
--pvt-component-max-height: calc(100% - 32rem);
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
@media screen and (max-width: 640px) and (max-height: 720px) {
|
|
96
|
+
.rls-modal-sheet {
|
|
97
|
+
--pvt-component-max-height: calc(100% - 24rem);
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
@media screen and (max-width: 640px) and (max-height: 560px) {
|
|
101
|
+
.rls-modal-sheet {
|
|
102
|
+
--pvt-component-max-height: calc(100% - 16rem);
|
|
103
|
+
}
|
|
103
104
|
} /*# sourceMappingURL=ModalSheet.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../../../../../src/components/organisms/ModalSheet/ModalSheet.scss"],"names":[],"mappings":"AAOA,iBACE,wDACA,
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../../../../../src/components/organisms/ModalSheet/ModalSheet.scss"],"names":[],"mappings":"AAOA,iBACE,wDACA,gCACA,iGAIA,6BACA,+DACA,oDACA,2BACA,mCAEA,0BACA,+BAEA,eACA,aACA,SACA,UACA,WACA,YACA,8BACA,kBACA,mBACA,uBAEA,0BACE,oCACA,6BACA,2BACA,kDACA,4BACA,0BAEA,mBAGF,4BACE,kBACA,aACA,mCACA,yCACA,mCACA,2CACA,sBACA,qCACA,2CACA,6BACA,iDACA,uEACA,yCACA,gKAKF,2BACE,kBACA,cACA,SACA,UACA,WACA,kCACA,oCACA,UACA,yCACA,0BACA,0GAKJ,qCACE,iBACE,4CACA,4BACA,kCACA,gCACA,mFAGA,oBAEA,0BACE,yCAIA,oCACE,cACA,WACA,4BACA,4BACA,mCACA,oCACA,kCAMR,4DACE,iBACE,gDAIJ,4DACE,iBACE,gDAIJ,4DACE,iBACE","file":"ModalSheet.css"}
|