@sima-land/moleculas 16.0.0-alpha.3 → 16.0.0-alpha.5
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/common/components/media-modal/__mocks__/index.d.ts +3 -4
- package/common/components/media-modal/__mocks__/index.js +223 -139
- package/common/components/media-modal/index.d.ts +6 -4
- package/common/components/media-modal/index.js +7 -4
- package/common/components/media-modal/layout.js +39 -3
- package/common/components/media-modal/layout.module.scss +8 -9
- package/common/components/media-modal/parts/all-round-view.d.ts +8 -0
- package/common/components/media-modal/parts/all-round-view.js +78 -0
- package/common/components/media-modal/parts/all-round-view.module.scss +30 -0
- package/common/components/media-modal/parts/{media.d.ts → media-content.d.ts} +7 -1
- package/common/components/media-modal/parts/{media.js → media-content.js} +16 -31
- package/common/components/media-modal/parts/{media.module.scss → media-content.module.scss} +7 -27
- package/common/components/media-modal/parts/media-view.d.ts +13 -0
- package/common/components/media-modal/parts/media-view.js +62 -0
- package/common/components/media-modal/parts/media-view.module.scss +30 -0
- package/common/components/media-modal/parts/product-brief.d.ts +2 -1
- package/common/components/media-modal/parts/product-brief.js +18 -3
- package/common/components/media-modal/parts/product-brief.module.scss +47 -0
- package/common/components/media-modal/parts/review.d.ts +5 -3
- package/common/components/media-modal/parts/review.js +28 -8
- package/common/components/media-modal/parts/review.module.scss +58 -42
- package/common/components/media-modal/parts/scroll-section.d.ts +4 -2
- package/common/components/media-modal/parts/scroll-section.js +5 -2
- package/common/components/media-modal/parts/scroll-section.module.scss +18 -4
- package/common/components/media-modal/parts/thumbnail.d.ts +22 -0
- package/common/components/media-modal/parts/thumbnail.js +65 -0
- package/common/components/media-modal/parts/thumbnail.module.scss +134 -0
- package/common/components/media-modal/parts/thumbnails.d.ts +5 -19
- package/common/components/media-modal/parts/thumbnails.js +35 -33
- package/common/components/media-modal/parts/thumbnails.module.scss +0 -88
- package/common/components/media-modal/types.d.ts +7 -4
- package/common/components/media-modal/utils.d.ts +31 -0
- package/common/components/media-modal/utils.js +73 -1
- package/common/components/modifier/index.d.ts +3 -1
- package/common/components/modifier/index.js +3 -2
- package/common/components/modifier/modifiers.module.scss +31 -0
- package/common/icons/touch-x.svg +6 -0
- package/desktop/components/gallery-modal/components/all-round-view.d.ts +5 -1
- package/desktop/components/gallery-modal/components/all-round-view.js +9 -6
- package/desktop/components/gallery-modal/components/image-overlay.js +1 -1
- package/desktop/components/gallery-modal/components/image-overlay.module.scss +1 -0
- package/package.json +1 -1
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { MediaData } from '../types';
|
|
2
|
-
export declare const
|
|
3
|
-
|
|
4
|
-
};
|
|
1
|
+
import { MediaData, MediaVideo } from '../types';
|
|
2
|
+
export declare const mixed: MediaData[];
|
|
3
|
+
export declare const videos: MediaVideo[];
|
|
@@ -1,141 +1,225 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.
|
|
4
|
-
exports.
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
3
|
+
exports.videos = exports.mixed = void 0;
|
|
4
|
+
exports.mixed = [
|
|
5
|
+
{
|
|
6
|
+
type: '360',
|
|
7
|
+
data: {
|
|
8
|
+
photos: [
|
|
9
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/0/700.jpg',
|
|
10
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/1/700.jpg',
|
|
11
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/2/700.jpg',
|
|
12
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/3/700.jpg',
|
|
13
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/4/700.jpg',
|
|
14
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/5/700.jpg',
|
|
15
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/6/700.jpg',
|
|
16
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/7/700.jpg',
|
|
17
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/8/700.jpg',
|
|
18
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/9/700.jpg',
|
|
19
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/10/700.jpg',
|
|
20
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/11/700.jpg',
|
|
21
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/12/700.jpg',
|
|
22
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/13/700.jpg',
|
|
23
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/14/700.jpg',
|
|
24
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/15/700.jpg',
|
|
25
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/16/700.jpg',
|
|
26
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/17/700.jpg',
|
|
27
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/18/700.jpg',
|
|
28
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/19/700.jpg',
|
|
29
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/20/700.jpg',
|
|
30
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/21/700.jpg',
|
|
31
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/22/700.jpg',
|
|
32
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/23/700.jpg',
|
|
33
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/24/700.jpg',
|
|
34
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/25/700.jpg',
|
|
35
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/26/700.jpg',
|
|
36
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/27/700.jpg',
|
|
37
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/28/700.jpg',
|
|
38
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/29/700.jpg',
|
|
39
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/30/700.jpg',
|
|
40
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/31/700.jpg',
|
|
41
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/32/700.jpg',
|
|
42
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/33/700.jpg',
|
|
43
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/34/700.jpg',
|
|
44
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/35/700.jpg',
|
|
45
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/36/700.jpg',
|
|
46
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/37/700.jpg',
|
|
47
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/38/700.jpg',
|
|
48
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/39/700.jpg',
|
|
49
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/40/700.jpg',
|
|
50
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/41/700.jpg',
|
|
51
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/42/700.jpg',
|
|
52
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/43/700.jpg',
|
|
53
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/44/700.jpg',
|
|
54
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/45/700.jpg',
|
|
55
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/46/700.jpg',
|
|
56
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/47/700.jpg',
|
|
57
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/48/700.jpg',
|
|
58
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/49/700.jpg',
|
|
59
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/50/700.jpg',
|
|
60
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/51/700.jpg',
|
|
61
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/52/700.jpg',
|
|
62
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/53/700.jpg',
|
|
63
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/54/700.jpg',
|
|
64
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/55/700.jpg',
|
|
65
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/56/700.jpg',
|
|
66
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/57/700.jpg',
|
|
67
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/58/700.jpg',
|
|
68
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/59/700.jpg',
|
|
69
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/60/700.jpg',
|
|
70
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/61/700.jpg',
|
|
71
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/62/700.jpg',
|
|
72
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/63/700.jpg',
|
|
73
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/64/700.jpg',
|
|
74
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/65/700.jpg',
|
|
75
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/66/700.jpg',
|
|
76
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/67/700.jpg',
|
|
77
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/68/700.jpg',
|
|
78
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/69/700.jpg',
|
|
79
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/70/700.jpg',
|
|
80
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/71/700.jpg',
|
|
81
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/72/700.jpg',
|
|
82
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/73/700.jpg',
|
|
83
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/74/700.jpg',
|
|
84
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/75/700.jpg',
|
|
85
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/76/700.jpg',
|
|
86
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/77/700.jpg',
|
|
87
|
+
'https://cdn2.static1-sima-land.com/3d/3243668/78/700.jpg',
|
|
88
|
+
],
|
|
89
|
+
},
|
|
90
|
+
},
|
|
91
|
+
{
|
|
92
|
+
type: 'video',
|
|
93
|
+
data: {
|
|
94
|
+
src: 'https://cdn2.static1-sima-land.com/flv/3404953.mp4',
|
|
95
|
+
},
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
type: 'image',
|
|
99
|
+
data: {
|
|
100
|
+
alt: 'Сапоги детские MINAKU, цвет синий, размер 31 - Фото 1',
|
|
101
|
+
src: 'https://loremflickr.com/240/240?random=1',
|
|
102
|
+
},
|
|
103
|
+
},
|
|
104
|
+
{
|
|
105
|
+
type: 'image',
|
|
106
|
+
data: {
|
|
107
|
+
alt: 'Фото из отзыва, не квадратное',
|
|
108
|
+
src: 'https://loremflickr.com/240/240?random=2',
|
|
109
|
+
},
|
|
110
|
+
},
|
|
111
|
+
{
|
|
112
|
+
type: 'image',
|
|
113
|
+
data: {
|
|
114
|
+
alt: 'Сапоги детские MINAKU, цвет синий, размер 31 - Фото 2',
|
|
115
|
+
src: 'https://loremflickr.com/240/240?random=3',
|
|
116
|
+
},
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
type: 'image',
|
|
120
|
+
data: {
|
|
121
|
+
alt: 'Сапоги детские MINAKU, цвет синий, размер 31 - Фото 3',
|
|
122
|
+
src: 'https://loremflickr.com/240/240?random=4',
|
|
123
|
+
},
|
|
124
|
+
},
|
|
125
|
+
{
|
|
126
|
+
type: 'image',
|
|
127
|
+
data: {
|
|
128
|
+
alt: 'Сапоги детские MINAKU, цвет синий, размер 31 - Фото 4',
|
|
129
|
+
src: 'https://loremflickr.com/240/240?random=5',
|
|
130
|
+
},
|
|
131
|
+
},
|
|
132
|
+
{
|
|
133
|
+
type: 'image',
|
|
134
|
+
data: {
|
|
135
|
+
alt: 'Сапоги детские MINAKU, цвет синий, размер 31 - Фото 5',
|
|
136
|
+
src: 'https://loremflickr.com/240/240?random=6',
|
|
137
|
+
},
|
|
138
|
+
},
|
|
139
|
+
];
|
|
140
|
+
exports.videos = [
|
|
141
|
+
{
|
|
142
|
+
type: 'video',
|
|
143
|
+
data: {
|
|
144
|
+
src: 'https://cdn2.static1-sima-land.com/flv/3404953.mp4',
|
|
145
|
+
thumbnail: 'https://loremflickr.com/240/240?random=6',
|
|
146
|
+
},
|
|
147
|
+
},
|
|
148
|
+
{
|
|
149
|
+
type: 'video',
|
|
150
|
+
data: {
|
|
151
|
+
src: 'https://cdn2.static1-sima-land.com/flv/6907296.mp4',
|
|
152
|
+
thumbnail: 'https://loremflickr.com/240/240?random=7',
|
|
153
|
+
},
|
|
154
|
+
},
|
|
155
|
+
{
|
|
156
|
+
type: 'video',
|
|
157
|
+
data: {
|
|
158
|
+
src: 'https://cdn2.static1-sima-land.com/flv/3619217.mp4',
|
|
159
|
+
thumbnail: 'https://loremflickr.com/240/240?random=8',
|
|
160
|
+
},
|
|
161
|
+
},
|
|
162
|
+
{
|
|
163
|
+
type: 'video',
|
|
164
|
+
data: {
|
|
165
|
+
src: 'https://cdn2.static1-sima-land.com/flv/4093038.mp4',
|
|
166
|
+
thumbnail: 'https://loremflickr.com/240/240?random=9',
|
|
167
|
+
},
|
|
168
|
+
},
|
|
169
|
+
{
|
|
170
|
+
type: 'video',
|
|
171
|
+
data: {
|
|
172
|
+
src: 'https://cdn2.static1-sima-land.com/flv/3404953.mp4',
|
|
173
|
+
thumbnail: 'https://loremflickr.com/240/240?random=10',
|
|
174
|
+
},
|
|
175
|
+
},
|
|
176
|
+
{
|
|
177
|
+
type: 'video',
|
|
178
|
+
data: {
|
|
179
|
+
src: 'https://cdn2.static1-sima-land.com/flv/6907296.mp4',
|
|
180
|
+
thumbnail: 'https://loremflickr.com/240/240?random=11',
|
|
181
|
+
},
|
|
182
|
+
},
|
|
183
|
+
{
|
|
184
|
+
type: 'video',
|
|
185
|
+
data: {
|
|
186
|
+
src: 'https://cdn2.static1-sima-land.com/flv/3619217.mp4',
|
|
187
|
+
thumbnail: 'https://loremflickr.com/240/240?random=12',
|
|
188
|
+
},
|
|
189
|
+
},
|
|
190
|
+
{
|
|
191
|
+
type: 'video',
|
|
192
|
+
data: {
|
|
193
|
+
src: 'https://cdn2.static1-sima-land.com/flv/4093038.mp4',
|
|
194
|
+
thumbnail: 'https://loremflickr.com/240/240?random=13',
|
|
195
|
+
},
|
|
196
|
+
},
|
|
197
|
+
{
|
|
198
|
+
type: 'video',
|
|
199
|
+
data: {
|
|
200
|
+
src: 'https://cdn2.static1-sima-land.com/flv/3404953.mp4',
|
|
201
|
+
thumbnail: 'https://loremflickr.com/240/240?random=14',
|
|
202
|
+
},
|
|
203
|
+
},
|
|
204
|
+
{
|
|
205
|
+
type: 'video',
|
|
206
|
+
data: {
|
|
207
|
+
src: 'https://cdn2.static1-sima-land.com/flv/6907296.mp4',
|
|
208
|
+
thumbnail: 'https://loremflickr.com/240/240?random=15',
|
|
209
|
+
},
|
|
210
|
+
},
|
|
211
|
+
{
|
|
212
|
+
type: 'video',
|
|
213
|
+
data: {
|
|
214
|
+
src: 'https://cdn2.static1-sima-land.com/flv/3619217.mp4',
|
|
215
|
+
thumbnail: 'https://loremflickr.com/240/240?random=16',
|
|
216
|
+
},
|
|
217
|
+
},
|
|
218
|
+
{
|
|
219
|
+
type: 'video',
|
|
220
|
+
data: {
|
|
221
|
+
src: 'https://cdn2.static1-sima-land.com/flv/4093038.mp4',
|
|
222
|
+
thumbnail: 'https://loremflickr.com/240/240?random=17',
|
|
223
|
+
},
|
|
224
|
+
},
|
|
225
|
+
];
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import { MediaLayout, MediaHeader, MediaMain, MediaAside, MediaFooter } from './layout';
|
|
2
2
|
import { Preset, HeaderLayout } from './parts';
|
|
3
3
|
import { ScrollSection } from './parts/scroll-section';
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
4
|
+
import { Thumbnail, ThumbnailProps } from './parts/thumbnail';
|
|
5
|
+
import { Thumbnails, ThumbnailsProps } from './parts/thumbnails';
|
|
6
|
+
import { MediaContentProps, MediaContent } from './parts/media-content';
|
|
7
|
+
import { MediaViewProps, MediaView } from './parts/media-view';
|
|
6
8
|
import { ReviewProps, Review } from './parts/review';
|
|
7
9
|
import { ProductBriefProps, ProductBrief } from './parts/product-brief';
|
|
8
|
-
export type { MediaContentProps, ThumbnailsProps, ProductBriefProps,
|
|
9
|
-
export { MediaLayout, MediaHeader, MediaMain, MediaAside, MediaFooter, MediaContent, HeaderLayout, Thumbnails, Thumbnail, Review, ProductBrief, Preset, ScrollSection, };
|
|
10
|
+
export type { MediaContentProps, MediaViewProps, ThumbnailProps, ThumbnailsProps, ReviewProps, ProductBriefProps, };
|
|
11
|
+
export { MediaLayout, MediaHeader, MediaMain, MediaAside, MediaFooter, MediaContent, MediaView, HeaderLayout, Thumbnails, Thumbnail, Review, ProductBrief, Preset, ScrollSection, };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.ScrollSection = exports.Preset = exports.ProductBrief = exports.Review = exports.Thumbnail = exports.Thumbnails = exports.HeaderLayout = exports.MediaContent = exports.MediaFooter = exports.MediaAside = exports.MediaMain = exports.MediaHeader = exports.MediaLayout = void 0;
|
|
3
|
+
exports.ScrollSection = exports.Preset = exports.ProductBrief = exports.Review = exports.Thumbnail = exports.Thumbnails = exports.HeaderLayout = exports.MediaView = exports.MediaContent = exports.MediaFooter = exports.MediaAside = exports.MediaMain = exports.MediaHeader = exports.MediaLayout = void 0;
|
|
4
4
|
const layout_1 = require("./layout");
|
|
5
5
|
Object.defineProperty(exports, "MediaLayout", { enumerable: true, get: function () { return layout_1.MediaLayout; } });
|
|
6
6
|
Object.defineProperty(exports, "MediaHeader", { enumerable: true, get: function () { return layout_1.MediaHeader; } });
|
|
@@ -12,11 +12,14 @@ Object.defineProperty(exports, "Preset", { enumerable: true, get: function () {
|
|
|
12
12
|
Object.defineProperty(exports, "HeaderLayout", { enumerable: true, get: function () { return parts_1.HeaderLayout; } });
|
|
13
13
|
const scroll_section_1 = require("./parts/scroll-section");
|
|
14
14
|
Object.defineProperty(exports, "ScrollSection", { enumerable: true, get: function () { return scroll_section_1.ScrollSection; } });
|
|
15
|
+
const thumbnail_1 = require("./parts/thumbnail");
|
|
16
|
+
Object.defineProperty(exports, "Thumbnail", { enumerable: true, get: function () { return thumbnail_1.Thumbnail; } });
|
|
15
17
|
const thumbnails_1 = require("./parts/thumbnails");
|
|
16
|
-
Object.defineProperty(exports, "Thumbnail", { enumerable: true, get: function () { return thumbnails_1.Thumbnail; } });
|
|
17
18
|
Object.defineProperty(exports, "Thumbnails", { enumerable: true, get: function () { return thumbnails_1.Thumbnails; } });
|
|
18
|
-
const
|
|
19
|
-
Object.defineProperty(exports, "MediaContent", { enumerable: true, get: function () { return
|
|
19
|
+
const media_content_1 = require("./parts/media-content");
|
|
20
|
+
Object.defineProperty(exports, "MediaContent", { enumerable: true, get: function () { return media_content_1.MediaContent; } });
|
|
21
|
+
const media_view_1 = require("./parts/media-view");
|
|
22
|
+
Object.defineProperty(exports, "MediaView", { enumerable: true, get: function () { return media_view_1.MediaView; } });
|
|
20
23
|
const review_1 = require("./parts/review");
|
|
21
24
|
Object.defineProperty(exports, "Review", { enumerable: true, get: function () { return review_1.Review; } });
|
|
22
25
|
const product_brief_1 = require("./parts/product-brief");
|
|
@@ -1,12 +1,36 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
2
25
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
26
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
27
|
};
|
|
5
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
29
|
exports.MediaFooter = exports.MediaAside = exports.MediaMain = exports.MediaHeader = exports.MediaLayout = void 0;
|
|
7
|
-
const react_1 =
|
|
30
|
+
const react_1 = __importStar(require("react"));
|
|
8
31
|
const define_slots_1 = require("@sima-land/ui-nucleons/helpers/define-slots");
|
|
9
32
|
const layout_1 = require("@sima-land/ui-nucleons/layout");
|
|
33
|
+
const utils_1 = require("./utils");
|
|
10
34
|
const bind_1 = __importDefault(require("classnames/bind"));
|
|
11
35
|
const layout_module_scss_1 = __importDefault(require("./layout.module.scss"));
|
|
12
36
|
const cx = bind_1.default.bind(layout_module_scss_1.default);
|
|
@@ -16,18 +40,30 @@ const cx = bind_1.default.bind(layout_module_scss_1.default);
|
|
|
16
40
|
* @return Элемент.
|
|
17
41
|
*/
|
|
18
42
|
function MediaLayout({ children }) {
|
|
43
|
+
var _a;
|
|
44
|
+
const mobile = ['mxs', 'ms', 'mm', 'ml'];
|
|
19
45
|
const { header, main, aside, footer } = (0, define_slots_1.defineSlots)(children, {
|
|
20
46
|
header: MediaHeader,
|
|
21
47
|
main: MediaMain,
|
|
22
48
|
aside: MediaAside,
|
|
23
49
|
footer: MediaFooter,
|
|
24
50
|
});
|
|
25
|
-
const
|
|
51
|
+
const [vh, setVh] = (0, react_1.useState)(null);
|
|
52
|
+
const mainRef = (0, react_1.useRef)(null);
|
|
53
|
+
const mainRect = (0, utils_1.useClientRect)(mainRef);
|
|
54
|
+
(0, utils_1.useVisualViewport)(viewport => {
|
|
55
|
+
setVh(viewport.height / 100);
|
|
56
|
+
});
|
|
57
|
+
const mainStyle = {
|
|
58
|
+
'--vh': (_a = `${vh}px`) !== null && _a !== void 0 ? _a : '1vh',
|
|
59
|
+
'--media-width': `${mainRect.width}px`,
|
|
60
|
+
'--media-height': `${mainRect.height}px`,
|
|
61
|
+
};
|
|
26
62
|
return (react_1.default.createElement("div", { className: layout_module_scss_1.default.layout },
|
|
27
63
|
header && (react_1.default.createElement(layout_1.Layout, { disabledOn: mobile, className: layout_module_scss_1.default.header }, header)),
|
|
28
64
|
react_1.default.createElement(layout_1.Layout, { disabledOn: mobile, className: layout_module_scss_1.default.body },
|
|
29
65
|
aside && react_1.default.createElement("div", { className: layout_module_scss_1.default.aside }, aside),
|
|
30
|
-
react_1.default.createElement("div", { className: layout_module_scss_1.default.main }, main)),
|
|
66
|
+
react_1.default.createElement("div", { ref: mainRef, className: layout_module_scss_1.default.main, style: mainStyle }, main)),
|
|
31
67
|
footer && (react_1.default.createElement(layout_1.Layout, { disabledOn: mobile, className: layout_module_scss_1.default.footer },
|
|
32
68
|
react_1.default.createElement("div", { className: cx('footer-inner', aside && 'with-aside') }, footer)))));
|
|
33
69
|
}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
.layout {
|
|
5
5
|
display: flex;
|
|
6
6
|
flex-direction: column;
|
|
7
|
-
min-height: calc(
|
|
7
|
+
min-height: calc((100 * var(--vh, 1vh)) - var(--modal-header-height));
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
.body {
|
|
@@ -13,8 +13,14 @@
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
.main {
|
|
16
|
+
--media-width: var(--square-size);
|
|
17
|
+
--media-height: var(--square-size);
|
|
18
|
+
display: flex;
|
|
19
|
+
justify-content: center;
|
|
20
|
+
flex-direction: column;
|
|
21
|
+
flex-grow: 1;
|
|
16
22
|
position: relative; // ВАЖНО: что иметь возможность заполнить доступную область содержимым
|
|
17
|
-
min-height: 50vh;
|
|
23
|
+
min-height: max(50vh, 240px);
|
|
18
24
|
}
|
|
19
25
|
|
|
20
26
|
@include breakpoints.down('xs') {
|
|
@@ -30,10 +36,6 @@
|
|
|
30
36
|
margin-bottom: 24px;
|
|
31
37
|
}
|
|
32
38
|
}
|
|
33
|
-
.main {
|
|
34
|
-
min-height: max(50vh, 240px);
|
|
35
|
-
flex-grow: 1;
|
|
36
|
-
}
|
|
37
39
|
.aside + .main {
|
|
38
40
|
margin-bottom: 24px;
|
|
39
41
|
}
|
|
@@ -66,9 +68,6 @@
|
|
|
66
68
|
.aside + .main {
|
|
67
69
|
margin-left: 16px;
|
|
68
70
|
}
|
|
69
|
-
.main {
|
|
70
|
-
flex-grow: 1;
|
|
71
|
-
}
|
|
72
71
|
.body + .footer {
|
|
73
72
|
margin-top: 32px;
|
|
74
73
|
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { AllRoundViewProps } from '../../../../desktop/components/gallery-modal/components/all-round-view';
|
|
3
|
+
/**
|
|
4
|
+
* Просмотр 360.
|
|
5
|
+
* @param props Свойства.
|
|
6
|
+
* @return Элемент.
|
|
7
|
+
*/
|
|
8
|
+
export declare function AllRoundView(props: AllRoundViewProps): JSX.Element | null;
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
28
|
+
t[p] = s[p];
|
|
29
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
30
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
31
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
32
|
+
t[p[i]] = s[p[i]];
|
|
33
|
+
}
|
|
34
|
+
return t;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
exports.AllRoundView = void 0;
|
|
41
|
+
const react_1 = __importStar(require("react"));
|
|
42
|
+
const breakpoint_1 = require("@sima-land/ui-nucleons/hooks/breakpoint");
|
|
43
|
+
const all_round_view_1 = require("../../../../desktop/components/gallery-modal/components/all-round-view");
|
|
44
|
+
const utils_1 = require("../utils");
|
|
45
|
+
const touch_x_svg_1 = __importDefault(require("../../../icons/touch-x.svg"));
|
|
46
|
+
const all_round_view_module_scss_1 = __importDefault(require("./all-round-view.module.scss"));
|
|
47
|
+
/**
|
|
48
|
+
* Просмотр 360.
|
|
49
|
+
* @param props Свойства.
|
|
50
|
+
* @return Элемент.
|
|
51
|
+
*/
|
|
52
|
+
function AllRoundView(props) {
|
|
53
|
+
const mounted = (0, utils_1.useMounted)();
|
|
54
|
+
const desktop = (0, breakpoint_1.useBreakpoint)('xs+');
|
|
55
|
+
if (!mounted) {
|
|
56
|
+
return null;
|
|
57
|
+
}
|
|
58
|
+
return react_1.default.createElement(AfterMount, Object.assign({ desktop: desktop }, props));
|
|
59
|
+
}
|
|
60
|
+
exports.AllRoundView = AllRoundView;
|
|
61
|
+
/**
|
|
62
|
+
* Внутренний компонент который будет выведен только после монтирования.
|
|
63
|
+
* @param props Свойства.
|
|
64
|
+
* @return Элемент.
|
|
65
|
+
*/
|
|
66
|
+
function AfterMount(_a) {
|
|
67
|
+
var { desktop } = _a, props = __rest(_a, ["desktop"]);
|
|
68
|
+
const [state, setState] = (0, react_1.useState)(() => (desktop ? 'autoplay' : 'default'));
|
|
69
|
+
const [tutorial, setTutorial] = (0, react_1.useState)(() => !desktop);
|
|
70
|
+
const acceptTutorial = (0, react_1.useCallback)(() => {
|
|
71
|
+
setTutorial(false);
|
|
72
|
+
setState('autoplay');
|
|
73
|
+
}, []);
|
|
74
|
+
return (react_1.default.createElement("div", { className: all_round_view_module_scss_1.default.root },
|
|
75
|
+
!desktop && tutorial && (react_1.default.createElement("div", { className: all_round_view_module_scss_1.default.tutorial, onPointerUp: acceptTutorial },
|
|
76
|
+
react_1.default.createElement(touch_x_svg_1.default, null))),
|
|
77
|
+
react_1.default.createElement(all_round_view_1.AllRoundView, Object.assign({}, props, { controls: desktop, state: state, onStateChange: setState }))));
|
|
78
|
+
}
|