@salutejs/sdds-api-tests 0.19.0-canary.3015.31362075594.0 → 0.19.0-dev.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salutejs/sdds-api-tests",
|
|
3
|
-
"version": "0.19.0-
|
|
3
|
+
"version": "0.19.0-dev.0",
|
|
4
4
|
"description": "API tests for components",
|
|
5
5
|
"author": "Salute Frontend Team <salute.developers@gmail.com>",
|
|
6
6
|
"license": "MIT",
|
|
@@ -13,19 +13,19 @@
|
|
|
13
13
|
"test": "rm -rf tests && node script.mjs && NODE_OPTIONS=--max-old-space-size=8192 tsc --noEmit -p ./tsconfig.typecheck.json"
|
|
14
14
|
},
|
|
15
15
|
"devDependencies": {
|
|
16
|
-
"@salutejs/plasma-b2c": "1.630.0-
|
|
17
|
-
"@salutejs/plasma-giga": "0.357.0-
|
|
18
|
-
"@salutejs/plasma-icons": "1.
|
|
19
|
-
"@salutejs/plasma-web": "1.632.0-
|
|
20
|
-
"@salutejs/sdds-bizcom": "0.362.0-
|
|
21
|
-
"@salutejs/sdds-cs": "0.366.0-
|
|
22
|
-
"@salutejs/sdds-dfa": "0.360.0-
|
|
23
|
-
"@salutejs/sdds-finai": "0.353.0-
|
|
24
|
-
"@salutejs/sdds-insol": "0.357.0-
|
|
25
|
-
"@salutejs/sdds-netology": "0.361.0-
|
|
26
|
-
"@salutejs/sdds-platform-ai": "0.361.0-
|
|
27
|
-
"@salutejs/sdds-scan": "0.360.0-
|
|
28
|
-
"@salutejs/sdds-serv": "0.361.0-
|
|
16
|
+
"@salutejs/plasma-b2c": "1.630.0-dev.0",
|
|
17
|
+
"@salutejs/plasma-giga": "0.357.0-dev.0",
|
|
18
|
+
"@salutejs/plasma-icons": "1.245.0-dev.0",
|
|
19
|
+
"@salutejs/plasma-web": "1.632.0-dev.0",
|
|
20
|
+
"@salutejs/sdds-bizcom": "0.362.0-dev.0",
|
|
21
|
+
"@salutejs/sdds-cs": "0.366.0-dev.0",
|
|
22
|
+
"@salutejs/sdds-dfa": "0.360.0-dev.0",
|
|
23
|
+
"@salutejs/sdds-finai": "0.353.0-dev.0",
|
|
24
|
+
"@salutejs/sdds-insol": "0.357.0-dev.0",
|
|
25
|
+
"@salutejs/sdds-netology": "0.361.0-dev.0",
|
|
26
|
+
"@salutejs/sdds-platform-ai": "0.361.0-dev.0",
|
|
27
|
+
"@salutejs/sdds-scan": "0.360.0-dev.0",
|
|
28
|
+
"@salutejs/sdds-serv": "0.361.0-dev.0",
|
|
29
29
|
"@types/node": "^25.9.1",
|
|
30
30
|
"@types/react": "18.0.28",
|
|
31
31
|
"@types/react-dom": "18.0.11",
|
|
@@ -35,5 +35,5 @@
|
|
|
35
35
|
"publishConfig": {
|
|
36
36
|
"access": "public"
|
|
37
37
|
},
|
|
38
|
-
"gitHead": "
|
|
38
|
+
"gitHead": "52b569a1060e4f09b2d4011cfbdc597e41ecdd6f"
|
|
39
39
|
}
|
package/script.mjs
CHANGED
|
@@ -13,50 +13,50 @@ const config = {
|
|
|
13
13
|
libs: [
|
|
14
14
|
{
|
|
15
15
|
name: '@salutejs/plasma-b2c',
|
|
16
|
-
excludeComponents: ['TextField', 'CodeArea'],
|
|
16
|
+
excludeComponents: ['TextField', 'CodeArea', 'BottomSheet'],
|
|
17
17
|
},
|
|
18
18
|
{
|
|
19
19
|
name: '@salutejs/plasma-web',
|
|
20
|
-
excludeComponents: ['TextField', 'CodeArea'],
|
|
20
|
+
excludeComponents: ['TextField', 'CodeArea', 'BottomSheet'],
|
|
21
21
|
},
|
|
22
22
|
{
|
|
23
23
|
name: '@salutejs/plasma-giga',
|
|
24
24
|
},
|
|
25
25
|
{
|
|
26
26
|
name: '@salutejs/sdds-bizcom',
|
|
27
|
-
excludeComponents: ['CodeArea'],
|
|
27
|
+
excludeComponents: ['CodeArea', 'BottomSheet'],
|
|
28
28
|
},
|
|
29
29
|
{
|
|
30
30
|
name: '@salutejs/sdds-cs',
|
|
31
|
-
excludeComponents: ['Select', 'InformationWrapper', 'CodeArea'],
|
|
31
|
+
excludeComponents: ['Select', 'InformationWrapper', 'CodeArea', 'BottomSheet'],
|
|
32
32
|
},
|
|
33
33
|
{
|
|
34
34
|
name: '@salutejs/sdds-dfa',
|
|
35
|
-
excludeComponents: ['InformationWrapper', 'CodeArea'],
|
|
35
|
+
excludeComponents: ['InformationWrapper', 'CodeArea', 'BottomSheet'],
|
|
36
36
|
},
|
|
37
37
|
{
|
|
38
38
|
name: '@salutejs/sdds-finai',
|
|
39
|
-
excludeComponents: ['CodeArea'],
|
|
39
|
+
excludeComponents: ['CodeArea', 'BottomSheet'],
|
|
40
40
|
},
|
|
41
41
|
{
|
|
42
42
|
name: '@salutejs/sdds-insol',
|
|
43
|
-
excludeComponents: ['CodeArea'],
|
|
43
|
+
excludeComponents: ['CodeArea', 'BottomSheet'],
|
|
44
44
|
},
|
|
45
45
|
{
|
|
46
46
|
name: '@salutejs/sdds-netology',
|
|
47
|
-
excludeComponents: ['CodeArea'],
|
|
47
|
+
excludeComponents: ['CodeArea', 'BottomSheet'],
|
|
48
48
|
},
|
|
49
49
|
{
|
|
50
50
|
name: '@salutejs/sdds-platform-ai',
|
|
51
|
-
excludeComponents: ['CodeArea'],
|
|
51
|
+
excludeComponents: ['CodeArea', 'BottomSheet'],
|
|
52
52
|
},
|
|
53
53
|
{
|
|
54
54
|
name: '@salutejs/sdds-scan',
|
|
55
|
-
excludeComponents: ['CodeArea'],
|
|
55
|
+
excludeComponents: ['CodeArea', 'Sheet', 'BottomSheet'],
|
|
56
56
|
},
|
|
57
57
|
{
|
|
58
58
|
name: '@salutejs/sdds-serv',
|
|
59
|
-
excludeComponents: ['CodeArea'],
|
|
59
|
+
excludeComponents: ['CodeArea', 'BottomSheet'],
|
|
60
60
|
},
|
|
61
61
|
],
|
|
62
62
|
includeComponents: [],
|
|
@@ -0,0 +1,166 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { ComponentProps, ReactNode, CSSProperties, AriaRole } from 'react';
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { describe, it } from 'node:test';
|
|
5
|
+
import { expectTypeOf } from 'expect-type';
|
|
6
|
+
import { BottomSheet } from '@salutejs/plasma-giga';
|
|
7
|
+
|
|
8
|
+
type BottomSheetProps = ComponentProps<typeof BottomSheet>;
|
|
9
|
+
|
|
10
|
+
describe('Basics', () => {
|
|
11
|
+
it('Common', () => {
|
|
12
|
+
// layout
|
|
13
|
+
expectTypeOf<BottomSheetProps>()
|
|
14
|
+
.toHaveProperty('handlePlacement')
|
|
15
|
+
.toEqualTypeOf<'inner' | 'outer' | undefined>();
|
|
16
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('hasClose').toEqualTypeOf<boolean | undefined>();
|
|
17
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('hasHandle').toEqualTypeOf<boolean | undefined>();
|
|
18
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('withOverlay').toEqualTypeOf<boolean | undefined>();
|
|
19
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('withBlur').toEqualTypeOf<boolean | undefined>();
|
|
20
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('withTransition').toEqualTypeOf<boolean | undefined>();
|
|
21
|
+
expectTypeOf<BottomSheetProps>()
|
|
22
|
+
.toHaveProperty('maxHeight')
|
|
23
|
+
.toEqualTypeOf<CSSProperties['maxHeight'] | undefined>();
|
|
24
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('zIndex').toEqualTypeOf<CSSProperties['zIndex'] | undefined>();
|
|
25
|
+
|
|
26
|
+
// state
|
|
27
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('opened').toEqualTypeOf<boolean | undefined>();
|
|
28
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('closeOnEsc').toEqualTypeOf<boolean | undefined>();
|
|
29
|
+
|
|
30
|
+
// content slots
|
|
31
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('children').toEqualTypeOf<ReactNode>();
|
|
32
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('contentBeforeHeader').toEqualTypeOf<ReactNode>();
|
|
33
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('contentHeader').toEqualTypeOf<ReactNode>();
|
|
34
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('contentFooter').toEqualTypeOf<ReactNode>();
|
|
35
|
+
|
|
36
|
+
// callbacks
|
|
37
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('onClose').toEqualTypeOf<(() => void) | undefined>();
|
|
38
|
+
expectTypeOf<BottomSheetProps>()
|
|
39
|
+
.toHaveProperty('onOverlayClick')
|
|
40
|
+
.toEqualTypeOf<((event: React.MouseEvent<HTMLDivElement>) => void) | undefined>();
|
|
41
|
+
expectTypeOf<BottomSheetProps>()
|
|
42
|
+
.toHaveProperty('onEscKeyDown')
|
|
43
|
+
.toEqualTypeOf<((event: KeyboardEvent) => void) | undefined>();
|
|
44
|
+
});
|
|
45
|
+
|
|
46
|
+
it('Variations', () => {
|
|
47
|
+
type View = NonNullable<BottomSheetProps['view']>;
|
|
48
|
+
expectTypeOf<View>().toExtend<string>();
|
|
49
|
+
expectTypeOf<string>().not.toExtend<View>();
|
|
50
|
+
|
|
51
|
+
type Size = NonNullable<BottomSheetProps['size']>;
|
|
52
|
+
expectTypeOf<Size>().toExtend<string>();
|
|
53
|
+
expectTypeOf<string>().not.toExtend<Size>();
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
it('HTMLDivElement', () => {
|
|
57
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('id').toEqualTypeOf<string | undefined>();
|
|
58
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('className').toEqualTypeOf<string | undefined>();
|
|
59
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('style').toEqualTypeOf<CSSProperties | undefined>();
|
|
60
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('aria-label').toEqualTypeOf<string | undefined>();
|
|
61
|
+
expectTypeOf<BottomSheetProps>().toHaveProperty('role').toEqualTypeOf<AriaRole | undefined>();
|
|
62
|
+
expectTypeOf<BottomSheetProps>()
|
|
63
|
+
.toHaveProperty('onClick')
|
|
64
|
+
.toEqualTypeOf<React.MouseEventHandler<HTMLDivElement> | undefined>();
|
|
65
|
+
expectTypeOf<BottomSheetProps>()
|
|
66
|
+
.toHaveProperty('onMouseEnter')
|
|
67
|
+
.toEqualTypeOf<React.MouseEventHandler<HTMLDivElement> | undefined>();
|
|
68
|
+
expectTypeOf<BottomSheetProps>()
|
|
69
|
+
.toHaveProperty('onMouseLeave')
|
|
70
|
+
.toEqualTypeOf<React.MouseEventHandler<HTMLDivElement> | undefined>();
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
|
|
74
|
+
describe('Complex', () => {
|
|
75
|
+
it('Examples', () => {
|
|
76
|
+
expectTypeOf<BottomSheetProps>({});
|
|
77
|
+
expectTypeOf<BottomSheetProps>({ opened: true, onClose: () => {} });
|
|
78
|
+
expectTypeOf<BottomSheetProps>({
|
|
79
|
+
opened: true,
|
|
80
|
+
onClose: () => {},
|
|
81
|
+
onOverlayClick: () => {},
|
|
82
|
+
withOverlay: true,
|
|
83
|
+
withBlur: true,
|
|
84
|
+
});
|
|
85
|
+
expectTypeOf<BottomSheetProps>({
|
|
86
|
+
opened: true,
|
|
87
|
+
contentBeforeHeader: 'Before',
|
|
88
|
+
contentHeader: 'Header',
|
|
89
|
+
contentFooter: 'Footer',
|
|
90
|
+
handlePlacement: 'outer',
|
|
91
|
+
hasClose: true,
|
|
92
|
+
hasHandle: true,
|
|
93
|
+
maxHeight: '80dvh',
|
|
94
|
+
zIndex: 2000,
|
|
95
|
+
});
|
|
96
|
+
});
|
|
97
|
+
});
|
|
98
|
+
|
|
99
|
+
describe('Examples', () => {
|
|
100
|
+
it('Controlled', () => {
|
|
101
|
+
() => {
|
|
102
|
+
const [opened, setOpened] = useState(false);
|
|
103
|
+
|
|
104
|
+
return (
|
|
105
|
+
<BottomSheet opened={opened} onClose={() => setOpened(false)}>
|
|
106
|
+
Content
|
|
107
|
+
</BottomSheet>
|
|
108
|
+
);
|
|
109
|
+
};
|
|
110
|
+
});
|
|
111
|
+
|
|
112
|
+
it('With overlay click', () => {
|
|
113
|
+
() => {
|
|
114
|
+
const [opened, setOpened] = useState(false);
|
|
115
|
+
|
|
116
|
+
return (
|
|
117
|
+
<BottomSheet
|
|
118
|
+
opened={opened}
|
|
119
|
+
onClose={() => setOpened(false)}
|
|
120
|
+
onOverlayClick={() => setOpened(false)}
|
|
121
|
+
withOverlay
|
|
122
|
+
withBlur
|
|
123
|
+
>
|
|
124
|
+
Content
|
|
125
|
+
</BottomSheet>
|
|
126
|
+
);
|
|
127
|
+
};
|
|
128
|
+
});
|
|
129
|
+
|
|
130
|
+
it('With esc', () => {
|
|
131
|
+
() => {
|
|
132
|
+
const [opened, setOpened] = useState(false);
|
|
133
|
+
|
|
134
|
+
return (
|
|
135
|
+
<BottomSheet
|
|
136
|
+
opened={opened}
|
|
137
|
+
onClose={() => setOpened(false)}
|
|
138
|
+
onEscKeyDown={() => setOpened(false)}
|
|
139
|
+
closeOnEsc
|
|
140
|
+
>
|
|
141
|
+
Content
|
|
142
|
+
</BottomSheet>
|
|
143
|
+
);
|
|
144
|
+
};
|
|
145
|
+
});
|
|
146
|
+
|
|
147
|
+
it('With slots', () => {
|
|
148
|
+
() => {
|
|
149
|
+
return (
|
|
150
|
+
<BottomSheet
|
|
151
|
+
opened
|
|
152
|
+
onClose={() => {}}
|
|
153
|
+
contentBeforeHeader={<div>Before</div>}
|
|
154
|
+
contentHeader={<div>Header</div>}
|
|
155
|
+
contentFooter={<div>Footer</div>}
|
|
156
|
+
handlePlacement="outer"
|
|
157
|
+
hasClose
|
|
158
|
+
hasHandle
|
|
159
|
+
maxHeight="80dvh"
|
|
160
|
+
>
|
|
161
|
+
Content
|
|
162
|
+
</BottomSheet>
|
|
163
|
+
);
|
|
164
|
+
};
|
|
165
|
+
});
|
|
166
|
+
});
|
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { ComponentProps, ReactNode, CSSProperties, AriaRole } from 'react';
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { describe, it } from 'node:test';
|
|
5
|
+
import { expectTypeOf } from 'expect-type';
|
|
6
|
+
import { Sheet } from '@salutejs/plasma-b2c';
|
|
7
|
+
|
|
8
|
+
type SheetProps = ComponentProps<typeof Sheet>;
|
|
9
|
+
|
|
10
|
+
describe('Basics', () => {
|
|
11
|
+
it('Common', () => {
|
|
12
|
+
// layout
|
|
13
|
+
expectTypeOf<SheetProps>().toHaveProperty('hasHandle').toEqualTypeOf<boolean | undefined>();
|
|
14
|
+
expectTypeOf<SheetProps>().toHaveProperty('withOverlay').toEqualTypeOf<boolean | undefined>();
|
|
15
|
+
expectTypeOf<SheetProps>().toHaveProperty('withBlur').toEqualTypeOf<boolean | undefined>();
|
|
16
|
+
expectTypeOf<SheetProps>().toHaveProperty('withTransition').toEqualTypeOf<boolean | undefined>();
|
|
17
|
+
expectTypeOf<SheetProps>().toHaveProperty('isHeaderFixed').toEqualTypeOf<boolean | undefined>();
|
|
18
|
+
expectTypeOf<SheetProps>().toHaveProperty('isFooterFixed').toEqualTypeOf<boolean | undefined>();
|
|
19
|
+
expectTypeOf<SheetProps>().toHaveProperty('hasScrollEvents').toEqualTypeOf<boolean | undefined>();
|
|
20
|
+
expectTypeOf<SheetProps>().toHaveProperty('throttleMs').toEqualTypeOf<number | undefined>();
|
|
21
|
+
|
|
22
|
+
// state
|
|
23
|
+
expectTypeOf<SheetProps>().toHaveProperty('opened').toEqualTypeOf<boolean | undefined>();
|
|
24
|
+
expectTypeOf<SheetProps>().toHaveProperty('closeOnEsc').toEqualTypeOf<boolean | undefined>();
|
|
25
|
+
|
|
26
|
+
// content slots
|
|
27
|
+
expectTypeOf<SheetProps>().toHaveProperty('children').toEqualTypeOf<ReactNode>();
|
|
28
|
+
expectTypeOf<SheetProps>().toHaveProperty('contentHeader').toEqualTypeOf<ReactNode>();
|
|
29
|
+
expectTypeOf<SheetProps>().toHaveProperty('contentFooter').toEqualTypeOf<ReactNode>();
|
|
30
|
+
|
|
31
|
+
// callbacks
|
|
32
|
+
expectTypeOf<SheetProps>().toHaveProperty('onClose').toEqualTypeOf<() => void>();
|
|
33
|
+
expectTypeOf<SheetProps>()
|
|
34
|
+
.toHaveProperty('onOverlayClick')
|
|
35
|
+
.toEqualTypeOf<((event: React.MouseEvent<HTMLDivElement>) => void) | undefined>();
|
|
36
|
+
expectTypeOf<SheetProps>()
|
|
37
|
+
.toHaveProperty('onEscKeyDown')
|
|
38
|
+
.toEqualTypeOf<((event: KeyboardEvent) => void) | undefined>();
|
|
39
|
+
});
|
|
40
|
+
|
|
41
|
+
it('Variations', () => {
|
|
42
|
+
type View = NonNullable<SheetProps['view']>;
|
|
43
|
+
expectTypeOf<View>().toExtend<string>();
|
|
44
|
+
expectTypeOf<string>().not.toExtend<View>();
|
|
45
|
+
|
|
46
|
+
type HandlePlacement = NonNullable<SheetProps['handlePlacement']>;
|
|
47
|
+
expectTypeOf<HandlePlacement>().toExtend<string>();
|
|
48
|
+
expectTypeOf<string>().not.toExtend<HandlePlacement>();
|
|
49
|
+
});
|
|
50
|
+
|
|
51
|
+
it('HTMLDivElement', () => {
|
|
52
|
+
expectTypeOf<SheetProps>().toHaveProperty('id').toEqualTypeOf<string | undefined>();
|
|
53
|
+
expectTypeOf<SheetProps>().toHaveProperty('className').toEqualTypeOf<string | undefined>();
|
|
54
|
+
expectTypeOf<SheetProps>().toHaveProperty('style').toEqualTypeOf<CSSProperties | undefined>();
|
|
55
|
+
expectTypeOf<SheetProps>().toHaveProperty('aria-label').toEqualTypeOf<string | undefined>();
|
|
56
|
+
expectTypeOf<SheetProps>().toHaveProperty('role').toEqualTypeOf<AriaRole | undefined>();
|
|
57
|
+
expectTypeOf<SheetProps>()
|
|
58
|
+
.toHaveProperty('onClick')
|
|
59
|
+
.toEqualTypeOf<React.MouseEventHandler<HTMLDivElement> | undefined>();
|
|
60
|
+
expectTypeOf<SheetProps>()
|
|
61
|
+
.toHaveProperty('onMouseEnter')
|
|
62
|
+
.toEqualTypeOf<React.MouseEventHandler<HTMLDivElement> | undefined>();
|
|
63
|
+
expectTypeOf<SheetProps>()
|
|
64
|
+
.toHaveProperty('onMouseLeave')
|
|
65
|
+
.toEqualTypeOf<React.MouseEventHandler<HTMLDivElement> | undefined>();
|
|
66
|
+
});
|
|
67
|
+
});
|
|
68
|
+
|
|
69
|
+
describe('Complex', () => {
|
|
70
|
+
it('Examples', () => {
|
|
71
|
+
expectTypeOf<SheetProps>({ onClose: () => {} });
|
|
72
|
+
expectTypeOf<SheetProps>({ opened: true, onClose: () => {} });
|
|
73
|
+
expectTypeOf<SheetProps>({
|
|
74
|
+
opened: true,
|
|
75
|
+
onClose: () => {},
|
|
76
|
+
onOverlayClick: () => {},
|
|
77
|
+
withOverlay: true,
|
|
78
|
+
withBlur: true,
|
|
79
|
+
});
|
|
80
|
+
expectTypeOf<SheetProps>({
|
|
81
|
+
opened: true,
|
|
82
|
+
onClose: () => {},
|
|
83
|
+
contentHeader: 'Header',
|
|
84
|
+
contentFooter: 'Footer',
|
|
85
|
+
isHeaderFixed: true,
|
|
86
|
+
isFooterFixed: true,
|
|
87
|
+
});
|
|
88
|
+
});
|
|
89
|
+
});
|
|
90
|
+
|
|
91
|
+
describe('Examples', () => {
|
|
92
|
+
it('Controlled', () => {
|
|
93
|
+
() => {
|
|
94
|
+
const [opened, setOpened] = useState(false);
|
|
95
|
+
|
|
96
|
+
return (
|
|
97
|
+
<Sheet opened={opened} onClose={() => setOpened(false)}>
|
|
98
|
+
Content
|
|
99
|
+
</Sheet>
|
|
100
|
+
);
|
|
101
|
+
};
|
|
102
|
+
});
|
|
103
|
+
|
|
104
|
+
it('With overlay click', () => {
|
|
105
|
+
() => {
|
|
106
|
+
const [opened, setOpened] = useState(false);
|
|
107
|
+
|
|
108
|
+
return (
|
|
109
|
+
<Sheet
|
|
110
|
+
opened={opened}
|
|
111
|
+
onClose={() => setOpened(false)}
|
|
112
|
+
onOverlayClick={() => setOpened(false)}
|
|
113
|
+
withOverlay
|
|
114
|
+
withBlur
|
|
115
|
+
>
|
|
116
|
+
Content
|
|
117
|
+
</Sheet>
|
|
118
|
+
);
|
|
119
|
+
};
|
|
120
|
+
});
|
|
121
|
+
|
|
122
|
+
it('With esc', () => {
|
|
123
|
+
() => {
|
|
124
|
+
const [opened, setOpened] = useState(false);
|
|
125
|
+
|
|
126
|
+
return (
|
|
127
|
+
<Sheet
|
|
128
|
+
opened={opened}
|
|
129
|
+
onClose={() => setOpened(false)}
|
|
130
|
+
onEscKeyDown={() => setOpened(false)}
|
|
131
|
+
closeOnEsc
|
|
132
|
+
>
|
|
133
|
+
Content
|
|
134
|
+
</Sheet>
|
|
135
|
+
);
|
|
136
|
+
};
|
|
137
|
+
});
|
|
138
|
+
|
|
139
|
+
it('With header and footer', () => {
|
|
140
|
+
() => {
|
|
141
|
+
return (
|
|
142
|
+
<Sheet
|
|
143
|
+
opened
|
|
144
|
+
onClose={() => {}}
|
|
145
|
+
contentHeader={<div>Header</div>}
|
|
146
|
+
contentFooter={<div>Footer</div>}
|
|
147
|
+
isHeaderFixed
|
|
148
|
+
isFooterFixed
|
|
149
|
+
hasHandle
|
|
150
|
+
>
|
|
151
|
+
Content
|
|
152
|
+
</Sheet>
|
|
153
|
+
);
|
|
154
|
+
};
|
|
155
|
+
});
|
|
156
|
+
});
|