@hh.ru/magritte-ui-media-viewer 1.3.25 → 1.3.27

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.
Files changed (32) hide show
  1. package/index.css +65 -64
  2. package/index.js +1 -1
  3. package/internal/Counter.d.ts +1 -0
  4. package/internal/Counter.js +6 -4
  5. package/internal/Counter.js.map +1 -1
  6. package/internal/GalleryItemBody.js +1 -1
  7. package/internal/PreviewItem.js +1 -1
  8. package/internal/PreviewItemBody.js +1 -1
  9. package/internal/PreviewZoomControl.js +25 -28
  10. package/internal/PreviewZoomControl.js.map +1 -1
  11. package/internal/context.d.ts +1 -1
  12. package/internal/context.js +2 -2
  13. package/internal/context.js.map +1 -1
  14. package/internal/hooks/useGalleryItemController.d.ts +2 -0
  15. package/internal/hooks/useGalleryItemController.js +16 -13
  16. package/internal/hooks/useGalleryItemController.js.map +1 -1
  17. package/media-viewer-Bv0T7HdR.js +5 -0
  18. package/media-viewer-Bv0T7HdR.js.map +1 -0
  19. package/package.json +5 -5
  20. package/public/Footer.js +1 -1
  21. package/public/Gallery.js +4 -2
  22. package/public/Gallery.js.map +1 -1
  23. package/public/GalleryItem.js +1 -1
  24. package/public/Header.js +1 -1
  25. package/public/MediaViewer.js +14 -14
  26. package/public/MediaViewer.js.map +1 -1
  27. package/public/Preview.js +11 -5
  28. package/public/Preview.js.map +1 -1
  29. package/public/Toolbar.js +3 -3
  30. package/public/Toolbar.js.map +1 -1
  31. package/media-viewer-B-JEgTMr.js +0 -5
  32. package/media-viewer-B-JEgTMr.js.map +0 -1
package/index.css CHANGED
@@ -15,7 +15,7 @@
15
15
  .magritte-night-theme{
16
16
  --magritte-color-component-skeleton-background-content-v25-0-1:#5e5e5e3d;
17
17
  }
18
- .magritte-media-viewer___KnrXP_1-3-25{
18
+ .magritte-media-viewer___KnrXP_1-3-27{
19
19
  position:fixed;
20
20
  inset:0;
21
21
  display:grid;
@@ -27,7 +27,7 @@
27
27
  --media-viewer-background-opacity:calc(1 - var(--magritte-ui-media-viewer-close-progress));
28
28
  --magritte-ui-nav-bar-background-color-override:var(--magritte-color-background-overlay-toolbar-v25-0-1);
29
29
  }
30
- .magritte-media-viewer___KnrXP_1-3-25::before{
30
+ .magritte-media-viewer___KnrXP_1-3-27::before{
31
31
  content:'';
32
32
  position:absolute;
33
33
  inset:0;
@@ -35,13 +35,13 @@
35
35
  opacity:var(--media-viewer-background-opacity);
36
36
  pointer-events:none;
37
37
  }
38
- .magritte-gallery-placeholder___rUoGL_1-3-25{
38
+ .magritte-gallery-placeholder___rUoGL_1-3-27{
39
39
  display:flex;
40
40
  align-items:stretch;
41
41
  grid-row:2;
42
42
  min-height:0;
43
43
  }
44
- .magritte-media-viewer-gallery___P0SnN_1-3-25{
44
+ .magritte-media-viewer-gallery___P0SnN_1-3-27{
45
45
  display:grid;
46
46
  flex-grow:1;
47
47
  contain:layout size;
@@ -50,16 +50,16 @@
50
50
  inset:0;
51
51
  }
52
52
  @media (min-width: 1020px){
53
- body.magritte-old-layout .magritte-media-viewer-gallery___P0SnN_1-3-25{
53
+ body.magritte-old-layout .magritte-media-viewer-gallery___P0SnN_1-3-27{
54
54
  position:relative;
55
55
  }
56
56
  }
57
57
  @media (min-width: 1024px){
58
- body:not(.magritte-old-layout) .magritte-media-viewer-gallery___P0SnN_1-3-25{
58
+ body:not(.magritte-old-layout) .magritte-media-viewer-gallery___P0SnN_1-3-27{
59
59
  position:relative;
60
60
  }
61
61
  }
62
- .magritte-gallery-item___Js0Z5_1-3-25{
62
+ .magritte-gallery-item___Js0Z5_1-3-27{
63
63
  position:relative;
64
64
  grid-area:1 / 1;
65
65
  contain:size;
@@ -68,7 +68,7 @@
68
68
  overflow-y:visible;
69
69
  opacity:calc(1 - var(--magritte-ui-media-viewer-image-close-progress, 0));
70
70
  }
71
- .magritte-gallery-item-transform-container___N8-sA_1-3-25{
71
+ .magritte-gallery-item-transform-container___N8-sA_1-3-27{
72
72
  position:absolute;
73
73
  top:50%;
74
74
  left:50%;
@@ -76,44 +76,45 @@
76
76
  will-change:transform;
77
77
  touch-action:none;
78
78
  }
79
- .magritte-preview-counter___uP2Hc_1-3-25{
79
+ .magritte-preview-counter___uP2Hc_1-3-27{
80
80
  min-width:0;
81
81
  text-align:center;
82
82
  }
83
83
  @media (min-width: 1020px){
84
- body.magritte-old-layout .magritte-preview-counter___uP2Hc_1-3-25{
84
+ body.magritte-old-layout .magritte-preview-counter___uP2Hc_1-3-27{
85
85
  text-align:left;
86
86
  }
87
87
  }
88
88
  @media (min-width: 1024px){
89
- body:not(.magritte-old-layout) .magritte-preview-counter___uP2Hc_1-3-25{
89
+ body:not(.magritte-old-layout) .magritte-preview-counter___uP2Hc_1-3-27{
90
90
  text-align:left;
91
91
  }
92
92
  }
93
- .magritte-preview-counter___uP2Hc_1-3-25.magritte-with-description___-w7ld_1-3-25{
93
+ .magritte-preview-counter___uP2Hc_1-3-27.magritte-with-description___-w7ld_1-3-27{
94
94
  cursor:pointer;
95
95
  }
96
- .magritte-counter-number___gUpMp_1-3-25{
96
+ .magritte-counter-number___gUpMp_1-3-27{
97
97
  display:block;
98
98
  transform:translateY(calc(18px * 0.5));
99
99
  transition:transform var(--magritte-semantic-animation-time-m-duration-v25-0-1) var(--magritte-semantic-animation-ease-base-timing-function-v25-0-1);
100
100
  }
101
- .magritte-with-description___-w7ld_1-3-25 .magritte-counter-number___gUpMp_1-3-25{
101
+ .magritte-with-description___-w7ld_1-3-27 .magritte-counter-number___gUpMp_1-3-27{
102
102
  transform:translateY(0);
103
103
  }
104
- .magritte-no-description-placeholder___qc6h2_1-3-25{
104
+ .magritte-no-description-placeholder___qc6h2_1-3-27{
105
105
  display:block;
106
106
  height:18px;
107
107
  padding:0;
108
108
  }
109
- .magritte-preview-zoom-control___026jA_1-3-25{
109
+ .magritte-preview-zoom-control___026jA_1-3-27{
110
110
  display:flex;
111
111
  flex-direction:row;
112
112
  gap:2px;
113
113
  align-items:center;
114
114
  justify-self:end;
115
+ grid-column:3;
115
116
  }
116
- .magritte-preview-container___nwjNY_1-3-25{
117
+ .magritte-preview-container___nwjNY_1-3-27{
117
118
  display:grid;
118
119
  grid-template-columns:1fr auto 1fr;
119
120
  gap:16px;
@@ -124,16 +125,16 @@
124
125
  z-index:10;
125
126
  }
126
127
  @media (min-width: 1020px){
127
- body.magritte-old-layout .magritte-preview-container___nwjNY_1-3-25{
128
+ body.magritte-old-layout .magritte-preview-container___nwjNY_1-3-27{
128
129
  padding:16px 24px;
129
130
  }
130
131
  }
131
132
  @media (min-width: 1024px){
132
- body:not(.magritte-old-layout) .magritte-preview-container___nwjNY_1-3-25{
133
+ body:not(.magritte-old-layout) .magritte-preview-container___nwjNY_1-3-27{
133
134
  padding:16px 24px;
134
135
  }
135
136
  }
136
- .magritte-preview___0Ge4C_1-3-25{
137
+ .magritte-preview___0Ge4C_1-3-27{
137
138
  display:flex;
138
139
  flex-direction:row;
139
140
  touch-action:none;
@@ -141,18 +142,18 @@
141
142
  min-width:0;
142
143
  }
143
144
  @media (min-width: 1020px){
144
- body.magritte-old-layout .magritte-preview___0Ge4C_1-3-25{
145
+ body.magritte-old-layout .magritte-preview___0Ge4C_1-3-27{
145
146
  max-width:calc(((40 + 8) * (var(--media-viewer-max-visible-items) - 1) + 80) * 1px);
146
147
  overflow:hidden;
147
148
  }
148
149
  }
149
150
  @media (min-width: 1024px){
150
- body:not(.magritte-old-layout) .magritte-preview___0Ge4C_1-3-25{
151
+ body:not(.magritte-old-layout) .magritte-preview___0Ge4C_1-3-27{
151
152
  max-width:calc(((40 + 8) * (var(--media-viewer-max-visible-items) - 1) + 80) * 1px);
152
153
  overflow:hidden;
153
154
  }
154
155
  }
155
- .magritte-preview-list___SAXLZ_1-3-25{
156
+ .magritte-preview-list___SAXLZ_1-3-27{
156
157
  margin-left:50%;
157
158
  contain:layout paint;
158
159
  display:flex;
@@ -162,18 +163,18 @@
162
163
  flex:0 0 auto;
163
164
  }
164
165
  @media (min-width: 1020px){
165
- body.magritte-old-layout .magritte-preview-list___SAXLZ_1-3-25{
166
+ body.magritte-old-layout .magritte-preview-list___SAXLZ_1-3-27{
166
167
  margin:0;
167
168
  gap:8px;
168
169
  }
169
170
  }
170
171
  @media (min-width: 1024px){
171
- body:not(.magritte-old-layout) .magritte-preview-list___SAXLZ_1-3-25{
172
+ body:not(.magritte-old-layout) .magritte-preview-list___SAXLZ_1-3-27{
172
173
  margin:0;
173
174
  gap:8px;
174
175
  }
175
176
  }
176
- .magritte-preview-item___gz5f2_1-3-25{
177
+ .magritte-preview-item___gz5f2_1-3-27{
177
178
  contain:layout paint size;
178
179
  position:relative;
179
180
  flex-shrink:0;
@@ -187,33 +188,33 @@
187
188
  background-color:var(--magritte-color-component-skeleton-background-content-v25-0-1);
188
189
  }
189
190
  @media (min-width: 1020px){
190
- body.magritte-old-layout .magritte-preview-item___gz5f2_1-3-25{
191
+ body.magritte-old-layout .magritte-preview-item___gz5f2_1-3-27{
191
192
  height:80px;
192
193
  border-radius:8px;
193
194
  }
194
195
  }
195
196
  @media (min-width: 1024px){
196
- body:not(.magritte-old-layout) .magritte-preview-item___gz5f2_1-3-25{
197
+ body:not(.magritte-old-layout) .magritte-preview-item___gz5f2_1-3-27{
197
198
  height:80px;
198
199
  border-radius:8px;
199
200
  }
200
201
  }
201
- .magritte-preview-item-container___JDVsk_1-3-25{
202
+ .magritte-preview-item-container___JDVsk_1-3-27{
202
203
  contain:layout paint size;
203
204
  overflow:hidden;
204
205
  scale:1;
205
206
  }
206
207
  @media (min-width: 1020px){
207
- body.magritte-old-layout .magritte-preview-item-container___JDVsk_1-3-25{
208
+ body.magritte-old-layout .magritte-preview-item-container___JDVsk_1-3-27{
208
209
  scale:1.66666667;
209
210
  }
210
211
  }
211
212
  @media (min-width: 1024px){
212
- body:not(.magritte-old-layout) .magritte-preview-item-container___JDVsk_1-3-25{
213
+ body:not(.magritte-old-layout) .magritte-preview-item-container___JDVsk_1-3-27{
213
214
  scale:1.66666667;
214
215
  }
215
216
  }
216
- .magritte-preview-item-container___JDVsk_1-3-25 *{
217
+ .magritte-preview-item-container___JDVsk_1-3-27 *{
217
218
  touch-action:none;
218
219
  position:absolute;
219
220
  top:0;
@@ -223,7 +224,7 @@
223
224
  height:100%;
224
225
  user-select:none;
225
226
  }
226
- .magritte-media-viewer-toolbar___2C8nr_1-3-25{
227
+ .magritte-media-viewer-toolbar___2C8nr_1-3-27{
227
228
  background:var(--magritte-color-background-overlay-toolbar-v25-0-1);
228
229
  padding:0 8px;
229
230
  display:grid;
@@ -234,30 +235,30 @@
234
235
  grid-row:4;
235
236
  z-index:10;
236
237
  }
237
- .magritte-media-viewer-toolbar___2C8nr_1-3-25.magritte-no-description___NebrT_1-3-25{
238
+ .magritte-media-viewer-toolbar___2C8nr_1-3-27.magritte-no-description___NebrT_1-3-27{
238
239
  display:flex;
239
240
  justify-content:space-between;
240
241
  }
241
242
  @media (min-width: 1020px){
242
- body.magritte-old-layout .magritte-media-viewer-toolbar___2C8nr_1-3-25{
243
+ body.magritte-old-layout .magritte-media-viewer-toolbar___2C8nr_1-3-27{
243
244
  display:none;
244
245
  }
245
246
  }
246
247
  @media (min-width: 1024px){
247
- body:not(.magritte-old-layout) .magritte-media-viewer-toolbar___2C8nr_1-3-25{
248
+ body:not(.magritte-old-layout) .magritte-media-viewer-toolbar___2C8nr_1-3-27{
248
249
  display:none;
249
250
  }
250
251
  }
251
- .magritte-media-viewer-toolbar-left___YzkJt_1-3-25,
252
- .magritte-media-viewer-toolbar-right___kBER9_1-3-25{
252
+ .magritte-media-viewer-toolbar-left___YzkJt_1-3-27,
253
+ .magritte-media-viewer-toolbar-right___kBER9_1-3-27{
253
254
  display:flex;
254
255
  gap:4px;
255
256
  }
256
- .magritte-media-viewer-toolbar-right___kBER9_1-3-25{
257
+ .magritte-media-viewer-toolbar-right___kBER9_1-3-27{
257
258
  justify-content:end;
258
259
  }
259
- .magritte-prev-button___WMYjR_1-3-25,
260
- .magritte-next-button___f8hJT_1-3-25{
260
+ .magritte-prev-button___WMYjR_1-3-27,
261
+ .magritte-next-button___f8hJT_1-3-27{
261
262
  cursor:pointer;
262
263
  position:absolute;
263
264
  top:0;
@@ -265,40 +266,40 @@
265
266
  width:48px;
266
267
  opacity:var(--media-viewer-background-opacity);
267
268
  }
268
- .magritte-prev-button___WMYjR_1-3-25:active,
269
- .magritte-next-button___f8hJT_1-3-25:active{
269
+ .magritte-prev-button___WMYjR_1-3-27:active,
270
+ .magritte-next-button___f8hJT_1-3-27:active{
270
271
  background:linear-gradient(90deg, var(--magritte-gradient-component-media-viewer-background-fade-v25-0-1));
271
272
  }
272
273
  @media (min-width: 1020px){
273
- body.magritte-old-layout .magritte-prev-button___WMYjR_1-3-25,
274
- body.magritte-old-layout .magritte-next-button___f8hJT_1-3-25{
274
+ body.magritte-old-layout .magritte-prev-button___WMYjR_1-3-27,
275
+ body.magritte-old-layout .magritte-next-button___f8hJT_1-3-27{
275
276
  width:88px;
276
277
  }
277
- body.magritte-old-layout .magritte-prev-button___WMYjR_1-3-25:active,
278
- body.magritte-old-layout .magritte-next-button___f8hJT_1-3-25:active{
278
+ body.magritte-old-layout .magritte-prev-button___WMYjR_1-3-27:active,
279
+ body.magritte-old-layout .magritte-next-button___f8hJT_1-3-27:active{
279
280
  background:none;
280
281
  }
281
282
  }
282
283
  @media (min-width: 1024px){
283
- body:not(.magritte-old-layout) .magritte-prev-button___WMYjR_1-3-25,
284
- body:not(.magritte-old-layout) .magritte-next-button___f8hJT_1-3-25{
284
+ body:not(.magritte-old-layout) .magritte-prev-button___WMYjR_1-3-27,
285
+ body:not(.magritte-old-layout) .magritte-next-button___f8hJT_1-3-27{
285
286
  width:88px;
286
287
  }
287
- body:not(.magritte-old-layout) .magritte-prev-button___WMYjR_1-3-25:active,
288
- body:not(.magritte-old-layout) .magritte-next-button___f8hJT_1-3-25:active{
288
+ body:not(.magritte-old-layout) .magritte-prev-button___WMYjR_1-3-27:active,
289
+ body:not(.magritte-old-layout) .magritte-next-button___f8hJT_1-3-27:active{
289
290
  background:none;
290
291
  }
291
292
  }
292
- .magritte-prev-button___WMYjR_1-3-25{
293
+ .magritte-prev-button___WMYjR_1-3-27{
293
294
  left:0;
294
295
  }
295
- .magritte-prev-button___WMYjR_1-3-25:active{
296
+ .magritte-prev-button___WMYjR_1-3-27:active{
296
297
  background:linear-gradient(270deg, var(--magritte-gradient-component-media-viewer-background-fade-v25-0-1));
297
298
  }
298
- .magritte-next-button___f8hJT_1-3-25{
299
+ .magritte-next-button___f8hJT_1-3-27{
299
300
  right:0;
300
301
  }
301
- .magritte-slide-button___sY8LB_1-3-25{
302
+ .magritte-slide-button___sY8LB_1-3-27{
302
303
  display:flex;
303
304
  background:none;
304
305
  padding:0;
@@ -308,7 +309,7 @@
308
309
  position:absolute;
309
310
  inset:0;
310
311
  }
311
- .magritte-preview-placeholder___yuhW1_1-3-25{
312
+ .magritte-preview-placeholder___yuhW1_1-3-27{
312
313
  --magritte-media-viewer-preview-width:24px;
313
314
  --magritte-media-viewer-preview-gap:2px;
314
315
  flex:0 0 auto;
@@ -317,24 +318,24 @@
317
318
  flex-grow:0;
318
319
  }
319
320
  @media (min-width: 1020px){
320
- body.magritte-old-layout .magritte-preview-placeholder___yuhW1_1-3-25{
321
+ body.magritte-old-layout .magritte-preview-placeholder___yuhW1_1-3-27{
321
322
  --magritte-media-viewer-preview-width:40px;
322
323
  --magritte-media-viewer-preview-gap:8px;
323
324
  }
324
325
  }
325
326
  @media (min-width: 1024px){
326
- body:not(.magritte-old-layout) .magritte-preview-placeholder___yuhW1_1-3-25{
327
+ body:not(.magritte-old-layout) .magritte-preview-placeholder___yuhW1_1-3-27{
327
328
  --magritte-media-viewer-preview-width:40px;
328
329
  --magritte-media-viewer-preview-gap:8px;
329
330
  }
330
331
  }
331
- .magritte-gallery-item-loader___70TDe_1-3-25{
332
+ .magritte-gallery-item-loader___70TDe_1-3-27{
332
333
  position:absolute;
333
334
  top:50%;
334
335
  left:50%;
335
336
  transform:translate(-50%, -50%);
336
337
  }
337
- .magritte-gallery-item-error-container___Z-HyZ_1-3-25{
338
+ .magritte-gallery-item-error-container___Z-HyZ_1-3-27{
338
339
  display:flex;
339
340
  flex-direction:column;
340
341
  align-items:center;
@@ -348,10 +349,10 @@
348
349
  width:100%;
349
350
  box-sizing:border-box;
350
351
  }
351
- .magritte-description-bottom-sheet-content___swnEV_1-3-25{
352
+ .magritte-description-bottom-sheet-content___swnEV_1-3-27{
352
353
  padding:8px 0;
353
354
  }
354
- .magritte-header___egZXt_1-3-25{
355
+ .magritte-header___egZXt_1-3-27{
355
356
  grid-row:1;
356
357
  z-index:2;
357
358
  opacity:var(--media-viewer-toolbars-opacity);
@@ -359,13 +360,13 @@
359
360
  --magritte-ui-nav-bar-title-color-override:var(--magritte-color-text-constant-v25-0-1);
360
361
  --magritte-ui-nav-bar-subtitle-color-override:var(--magritte-color-text-constant-secondary-v25-0-1);
361
362
  }
362
- .magritte-footer___rOH-M_1-3-25{
363
+ .magritte-footer___rOH-M_1-3-27{
363
364
  grid-row:3;
364
365
  z-index:2;
365
366
  opacity:var(--media-viewer-toolbars-opacity);
366
367
  transform:translateY(calc(var(--magritte-ui-media-viewer-hide-tools-progress) * 100%));
367
368
  }
368
- .magritte-description___dYc-E_1-3-25{
369
+ .magritte-description___dYc-E_1-3-27{
369
370
  display:inline-block;
370
371
  max-width:100%;
371
372
  }
package/index.js CHANGED
@@ -18,7 +18,7 @@ import './internal/utils.js';
18
18
  import './internal/hooks/useTapToToggleTools.js';
19
19
  import './internal/hooks/useVirtualization.js';
20
20
  import './public/Footer.js';
21
- import './media-viewer-B-JEgTMr.js';
21
+ import './media-viewer-Bv0T7HdR.js';
22
22
  import './public/Gallery.js';
23
23
  import '@hh.ru/magritte-common-resize';
24
24
  import '@hh.ru/magritte-ui-icon/icon';
package/internal/Counter.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import { type FC, type ReactElement } from 'react';
2
2
  import type { GalleryItemProps } from '@hh.ru/magritte-ui-media-viewer/internal/GalleryItemBody';
3
+ export declare const hasCounterContent: (items: ReactElement<GalleryItemProps>[]) => boolean;
3
4
  export declare const Counter: FC<{
4
5
  items: ReactElement<GalleryItemProps>[];
5
6
  }>;
package/internal/Counter.js CHANGED
@@ -8,12 +8,13 @@ import { BottomSheet } from '@hh.ru/magritte-ui-bottom-sheet';
8
8
  import { useMediaViewerContext } from './context.js';
9
9
  import { TooltipHover } from '@hh.ru/magritte-ui-tooltip';
10
10
  import { Text } from '@hh.ru/magritte-ui-typography';
11
- import { s as styles } from '../media-viewer-B-JEgTMr.js';
11
+ import { s as styles } from '../media-viewer-Bv0T7HdR.js';
12
12
  import './ImagesLoader.js';
13
13
  import './utils.js';
14
14
  import '@hh.ru/magritte-design-tokens/core-tokens';
15
15
  import './animations.js';
16
16
 
17
+ const hasCounterContent = (items) => items.length > 1 || items.some((item) => !!item.props.description);
17
18
  const Counter = ({ items }) => {
18
19
  const globalContext = useMediaViewerContext();
19
20
  const [currentItemIndex, setCurrentItemIndex] = useState(Math.round(globalContext.currentSlideIndex.get()));
@@ -25,13 +26,14 @@ const Counter = ({ items }) => {
25
26
  setCurrentItemIndex(Math.round(newIndex));
26
27
  });
27
28
  const ofTrl = useTranslation('MediaViewer', 'of');
28
- if (items.length <= 1) {
29
+ if (!hasCounterContent(items)) {
29
30
  return null;
30
31
  }
32
+ const showCounterNumber = items.length > 1;
31
33
  return (jsxs("div", { className: classNames(styles.previewCounter, { [styles.withDescription]: !!description }), onClick: () => {
32
34
  setShowDescription(!!description);
33
- }, children: [jsx("span", { className: styles.counterNumber, "aria-atomic": "true", "aria-live": "polite", children: jsx(Text, { style: "constant", typography: "subtitle-1-semibold", ellipsis: true, children: `${currentItemIndex + 1} ${ofTrl} ${items.length}` }) }), !!description && (jsxs(Fragment, { children: [jsx("span", { ref: elementRef, className: styles.description, children: jsx(Text, { style: "constant-secondary", typography: "label-4-regular", ellipsis: true, children: description }) }), jsx(TooltipHover, { placement: 'top-center', activatorRef: elementRef, size: "small", onClose: () => setShowDescription(false), ignoreIntersections: false, children: description }), jsx(BottomSheet, { visible: showDescription, onClose: () => setShowDescription(false), children: jsx("div", { className: styles.descriptionBottomSheetContent, children: jsx(Text, { style: "primary", typography: "paragraph-2-regular", children: description }) }) })] })), !description && jsx("span", { className: styles.noDescriptionPlaceholder })] }));
35
+ }, children: [showCounterNumber && (jsx("span", { className: styles.counterNumber, "aria-atomic": "true", "aria-live": "polite", children: jsx(Text, { style: "constant", typography: "subtitle-1-semibold", ellipsis: true, children: `${currentItemIndex + 1} ${ofTrl} ${items.length}` }) })), !!description && (jsxs(Fragment, { children: [jsx("span", { ref: elementRef, className: styles.description, children: jsx(Text, { style: "constant-secondary", typography: "label-4-regular", ellipsis: true, children: description }) }), jsx(TooltipHover, { placement: 'top-center', activatorRef: elementRef, size: "small", onClose: () => setShowDescription(false), ignoreIntersections: false, children: description }), jsx(BottomSheet, { visible: showDescription, onClose: () => setShowDescription(false), children: jsx("div", { className: styles.descriptionBottomSheetContent, children: jsx(Text, { style: "primary", typography: "paragraph-2-regular", children: description }) }) })] })), !description && jsx("span", { className: styles.noDescriptionPlaceholder })] }));
34
36
  };
35
37
 
36
- export { Counter };
38
+ export { Counter, hasCounterContent };
37
39
  //# sourceMappingURL=Counter.js.map
package/internal/Counter.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Counter.js","sources":["src/internal/Counter.tsx"],"sourcesContent":["import { type FC, type ReactElement, useRef, useState } from 'react';\nimport classNames from 'classnames';\nimport { useMotionValueEvent } from 'motion/react';\n\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { BottomSheet } from '@hh.ru/magritte-ui-bottom-sheet';\nimport type { GalleryItemProps } from '@hh.ru/magritte-ui-media-viewer/internal/GalleryItemBody';\nimport { useMediaViewerContext } from '@hh.ru/magritte-ui-media-viewer/internal/context';\nimport { TooltipHover } from '@hh.ru/magritte-ui-tooltip';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from '../public/media-viewer.less';\n\nexport const Counter: FC<{ items: ReactElement<GalleryItemProps>[] }> = ({ items }) => {\n const globalContext = useMediaViewerContext();\n const [currentItemIndex, setCurrentItemIndex] = useState(Math.round(globalContext.currentSlideIndex.get()));\n const [showDescription, setShowDescription] = useState(false);\n const description = items[currentItemIndex]?.props.description;\n const elementRef = useRef<HTMLDivElement>(null);\n\n useMotionValueEvent(globalContext.currentSlideIndex, 'change', (newIndex) => {\n setShowDescription(false);\n setCurrentItemIndex(Math.round(newIndex));\n });\n\n const ofTrl = useTranslation('MediaViewer', 'of');\n\n if (items.length <= 1) {\n return null;\n }\n\n return (\n <div\n className={classNames(styles.previewCounter, { [styles.withDescription]: !!description })}\n onClick={() => {\n setShowDescription(!!description);\n }}\n >\n <span className={styles.counterNumber} aria-atomic=\"true\" aria-live=\"polite\">\n <Text\n style=\"constant\"\n typography=\"subtitle-1-semibold\"\n ellipsis\n >{`${currentItemIndex + 1} ${ofTrl} ${items.length}`}</Text>\n </span>\n {!!description && (\n <>\n <span ref={elementRef} className={styles.description}>\n <Text style=\"constant-secondary\" typography=\"label-4-regular\" ellipsis>\n {description}\n </Text>\n </span>\n <TooltipHover\n placement={'top-center'}\n activatorRef={elementRef}\n size=\"small\"\n onClose={() => setShowDescription(false)}\n ignoreIntersections={false}\n >\n {description}\n </TooltipHover>\n <BottomSheet visible={showDescription} onClose={() => setShowDescription(false)}>\n <div className={styles.descriptionBottomSheetContent}>\n <Text style=\"primary\" typography=\"paragraph-2-regular\">\n {description}\n </Text>\n </div>\n </BottomSheet>\n </>\n )}\n {!description && <span className={styles.noDescriptionPlaceholder}></span>}\n </div>\n );\n};\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
1
+ {"version":3,"file":"Counter.js","sources":["src/internal/Counter.tsx"],"sourcesContent":["import { type FC, type ReactElement, useRef, useState } from 'react';\nimport classNames from 'classnames';\nimport { useMotionValueEvent } from 'motion/react';\n\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { BottomSheet } from '@hh.ru/magritte-ui-bottom-sheet';\nimport type { GalleryItemProps } from '@hh.ru/magritte-ui-media-viewer/internal/GalleryItemBody';\nimport { useMediaViewerContext } from '@hh.ru/magritte-ui-media-viewer/internal/context';\nimport { TooltipHover } from '@hh.ru/magritte-ui-tooltip';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from '../public/media-viewer.less';\n\nexport const hasCounterContent = (items: ReactElement<GalleryItemProps>[]): boolean =>\n items.length > 1 || items.some((item) => !!item.props.description);\n\nexport const Counter: FC<{ items: ReactElement<GalleryItemProps>[] }> = ({ items }) => {\n const globalContext = useMediaViewerContext();\n const [currentItemIndex, setCurrentItemIndex] = useState(Math.round(globalContext.currentSlideIndex.get()));\n const [showDescription, setShowDescription] = useState(false);\n const description = items[currentItemIndex]?.props.description;\n const elementRef = useRef<HTMLDivElement>(null);\n\n useMotionValueEvent(globalContext.currentSlideIndex, 'change', (newIndex) => {\n setShowDescription(false);\n setCurrentItemIndex(Math.round(newIndex));\n });\n\n const ofTrl = useTranslation('MediaViewer', 'of');\n\n if (!hasCounterContent(items)) {\n return null;\n }\n\n const showCounterNumber = items.length > 1;\n\n return (\n <div\n className={classNames(styles.previewCounter, { [styles.withDescription]: !!description })}\n onClick={() => {\n setShowDescription(!!description);\n }}\n >\n {showCounterNumber && (\n <span className={styles.counterNumber} aria-atomic=\"true\" aria-live=\"polite\">\n <Text\n style=\"constant\"\n typography=\"subtitle-1-semibold\"\n ellipsis\n >{`${currentItemIndex + 1} ${ofTrl} ${items.length}`}</Text>\n </span>\n )}\n {!!description && (\n <>\n <span ref={elementRef} className={styles.description}>\n <Text style=\"constant-secondary\" typography=\"label-4-regular\" ellipsis>\n {description}\n </Text>\n </span>\n <TooltipHover\n placement={'top-center'}\n activatorRef={elementRef}\n size=\"small\"\n onClose={() => setShowDescription(false)}\n ignoreIntersections={false}\n >\n {description}\n </TooltipHover>\n <BottomSheet visible={showDescription} onClose={() => setShowDescription(false)}>\n <div className={styles.descriptionBottomSheetContent}>\n <Text style=\"primary\" typography=\"paragraph-2-regular\">\n {description}\n </Text>\n </div>\n </BottomSheet>\n </>\n )}\n {!description && <span className={styles.noDescriptionPlaceholder}></span>}\n </div>\n );\n};\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":";;;;;;;;;;;;;;;AAaO,MAAM,iBAAiB,GAAG,CAAC,KAAuC,KACrE,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE;MAE1D,OAAO,GAAoD,CAAC,EAAE,KAAK,EAAE,KAAI;AAClF,IAAA,MAAM,aAAa,GAAG,qBAAqB,EAAE,CAAC;IAC9C,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IAC5G,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9D,MAAM,WAAW,GAAG,KAAK,CAAC,gBAAgB,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;AAC/D,IAAA,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEhD,mBAAmB,CAAC,aAAa,CAAC,iBAAiB,EAAE,QAAQ,EAAE,CAAC,QAAQ,KAAI;QACxE,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC1B,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;AAC9C,KAAC,CAAC,CAAC;IAEH,MAAM,KAAK,GAAG,cAAc,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;AAElD,IAAA,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE;AAC3B,QAAA,OAAO,IAAI,CAAC;KACf;AAED,IAAA,MAAM,iBAAiB,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;IAE3C,QACIA,IACI,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,cAAc,EAAE,EAAE,CAAC,MAAM,CAAC,eAAe,GAAG,CAAC,CAAC,WAAW,EAAE,CAAC,EACzF,OAAO,EAAE,MAAK;AACV,YAAA,kBAAkB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC;AACtC,SAAC,aAEA,iBAAiB,KACdC,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,aAAa,iBAAc,MAAM,EAAA,WAAA,EAAW,QAAQ,EAAA,QAAA,EACxEA,IAAC,IAAI,EAAA,EACD,KAAK,EAAC,UAAU,EAChB,UAAU,EAAC,qBAAqB,EAChC,QAAQ,EAAA,IAAA,EAAA,QAAA,EACV,CAAG,EAAA,gBAAgB,GAAG,CAAC,CAAA,CAAA,EAAI,KAAK,CAAI,CAAA,EAAA,KAAK,CAAC,MAAM,CAAA,CAAE,EAAQ,CAAA,EAAA,CACzD,CACV,EACA,CAAC,CAAC,WAAW,KACVD,IAAA,CAAAE,QAAA,EAAA,EAAA,QAAA,EAAA,CACID,GAAM,CAAA,MAAA,EAAA,EAAA,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA,QAAA,EAChDA,GAAC,CAAA,IAAI,IAAC,KAAK,EAAC,oBAAoB,EAAC,UAAU,EAAC,iBAAiB,EAAC,QAAQ,kBACjE,WAAW,EAAA,CACT,GACJ,EACPA,GAAA,CAAC,YAAY,EACT,EAAA,SAAS,EAAE,YAAY,EACvB,YAAY,EAAE,UAAU,EACxB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,MAAM,kBAAkB,CAAC,KAAK,CAAC,EACxC,mBAAmB,EAAE,KAAK,EAEzB,QAAA,EAAA,WAAW,EACD,CAAA,EACfA,IAAC,WAAW,EAAA,EAAC,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC,KAAK,CAAC,YAC3EA,GAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,6BAA6B,EAAA,QAAA,EAChDA,GAAC,CAAA,IAAI,IAAC,KAAK,EAAC,SAAS,EAAC,UAAU,EAAC,qBAAqB,EAAA,QAAA,EACjD,WAAW,EAAA,CACT,GACL,EACI,CAAA,CAAA,EAAA,CACf,CACN,EACA,CAAC,WAAW,IAAIA,GAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,wBAAwB,EAAS,CAAA,CAAA,EAAA,CACxE,EACR;AACN;;;;"}
package/internal/GalleryItemBody.js CHANGED
@@ -14,7 +14,7 @@ import { usePinchToZoom } from './hooks/usePinchToZoom.js';
14
14
  import { useWheelToZoom } from './hooks/useWheelToZoom.js';
15
15
  import { lerp, clamp } from './utils.js';
16
16
  import { Text } from '@hh.ru/magritte-ui-typography';
17
- import { s as styles } from '../media-viewer-B-JEgTMr.js';
17
+ import { s as styles } from '../media-viewer-Bv0T7HdR.js';
18
18
  import './ImagesLoader.js';
19
19
  import '@use-gesture/react';
20
20
 
package/internal/PreviewItem.js CHANGED
@@ -9,7 +9,7 @@ import '@hh.ru/magritte-ui-breakpoint';
9
9
  import './utils.js';
10
10
  import '@hh.ru/magritte-design-tokens/core-tokens';
11
11
  import './animations.js';
12
- import '../media-viewer-B-JEgTMr.js';
12
+ import '../media-viewer-Bv0T7HdR.js';
13
13
  import './ImagesLoader.js';
14
14
 
15
15
  const PreviewItem = ({ index, ...props }) => {
package/internal/PreviewItemBody.js CHANGED
@@ -5,7 +5,7 @@ import { useMotionValue, useTransform, useMotionValueEvent, animate, motion } fr
5
5
  import { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';
6
6
  import { useMediaViewerContext, usePreviewContext } from './context.js';
7
7
  import { useDetectDiscreteChange, clamp } from './utils.js';
8
- import { s as styles } from '../media-viewer-B-JEgTMr.js';
8
+ import { s as styles } from '../media-viewer-Bv0T7HdR.js';
9
9
  import './ImagesLoader.js';
10
10
  import '@hh.ru/magritte-design-tokens/core-tokens';
11
11
  import './animations.js';
package/internal/PreviewZoomControl.js CHANGED
@@ -9,11 +9,10 @@ import { EASE_BASE } from './animations.js';
9
9
  import { useMediaViewerContext } from './context.js';
10
10
  import { useInitOnce, findNextValue, getDimensionsAfterRotation, clampOffset } from './utils.js';
11
11
  import { Text } from '@hh.ru/magritte-ui-typography';
12
- import { s as styles } from '../media-viewer-B-JEgTMr.js';
12
+ import { s as styles } from '../media-viewer-Bv0T7HdR.js';
13
13
  import './ImagesLoader.js';
14
14
 
15
- const getCurrentControllerLimits = (globalContext) => {
16
- const controller = globalContext.currentSlideController.get();
15
+ const getControllerLimits = (controller) => {
17
16
  if (!controller) {
18
17
  return null;
19
18
  }
@@ -33,7 +32,7 @@ const PreviewZoomControl = () => {
33
32
  const updateZoom = useInitOnce(() => (newZoom) => {
34
33
  setZoom(newZoom ? Math.round(newZoom * 100) : null);
35
34
  });
36
- const [zoomLimits, setZoomLimits] = useState(() => getCurrentControllerLimits(globalContext));
35
+ const [zoomLimits, setZoomLimits] = useState(() => getControllerLimits(globalContext.currentSlideController.get()));
37
36
  const prevControllerUnsubRef = useRef([]);
38
37
  const zoomInTrl = useTranslation('MediaViewer', 'zoomIn');
39
38
  const zoomOutTrl = useTranslation('MediaViewer', 'zoomOut');
@@ -66,32 +65,30 @@ const PreviewZoomControl = () => {
66
65
  });
67
66
  };
68
67
  useEffect(() => {
69
- const subs = [
70
- globalContext.currentSlideController.on('change', (controller) => {
71
- if (!controller) {
72
- return;
73
- }
74
- const scale = controller.scale.get() || null;
75
- updateZoom(scale);
76
- // слушаем всегда только один контроллер, от предыдущего надо отписаться
77
- prevControllerUnsubRef.current.forEach((unsub) => unsub());
78
- prevControllerUnsubRef.current = [
79
- controller.scale.on('change', updateZoom),
80
- controller.zoomStops.on('change', () => setZoomLimits(getCurrentControllerLimits(globalContext))),
81
- ];
82
- setZoomLimits(getCurrentControllerLimits(globalContext));
83
- }),
84
- () => prevControllerUnsubRef.current.forEach((unsub) => unsub()),
85
- ];
86
- const currentController = globalContext.currentSlideController.get();
87
- if (currentController) {
68
+ // Контроллер активного слайда привязывается к контексту в эффекте GalleryItem, а Gallery в разметке
69
+ // всегда идёт до Preview — значит на момент этого эффекта масштаб уже может быть посчитан, и его
70
+ // надо прочитать, а не ждать следующего изменения
71
+ const listenController = (controller) => {
72
+ // слушаем всегда только один контроллер, от предыдущего надо отписаться
73
+ prevControllerUnsubRef.current.forEach((unsub) => unsub());
74
+ prevControllerUnsubRef.current = [];
75
+ updateZoom(controller?.scale.get() || null);
76
+ setZoomLimits(getControllerLimits(controller));
77
+ if (!controller) {
78
+ return;
79
+ }
88
80
  prevControllerUnsubRef.current = [
89
- currentController.scale.on('change', updateZoom),
90
- currentController.zoomStops.on('change', () => setZoomLimits(getCurrentControllerLimits(globalContext))),
81
+ controller.scale.on('change', updateZoom),
82
+ controller.zoomStops.on('change', () => setZoomLimits(getControllerLimits(controller))),
91
83
  ];
92
- setZoomLimits(getCurrentControllerLimits(globalContext));
93
- }
94
- return () => subs.forEach((unsub) => unsub?.());
84
+ };
85
+ listenController(globalContext.currentSlideController.get());
86
+ const unsubscribeFromContext = globalContext.currentSlideController.on('change', listenController);
87
+ return () => {
88
+ unsubscribeFromContext();
89
+ prevControllerUnsubRef.current.forEach((unsub) => unsub());
90
+ prevControllerUnsubRef.current = [];
91
+ };
95
92
  }, [globalContext, updateZoom]);
96
93
  return (jsxs("div", { className: styles.previewZoomControl, children: [jsx(MagnifierMinusOutlinedSize24, { initialColor: "constant", padding: 8, disabled: zoom !== null && (zoomLimits === null || zoom <= Math.round(zoomLimits?.min * 100)), onClick: () => {
97
94
  applyNextZoom('out');
package/internal/PreviewZoomControl.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PreviewZoomControl.js","sources":["src/internal/PreviewZoomControl.tsx"],"sourcesContent":["import { type FC, useState, useRef, useEffect } from 'react';\nimport { animate } from 'motion/react';\n\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport CoreTokens from '@hh.ru/magritte-design-tokens/core-tokens';\nimport { MagnifierMinusOutlinedSize24, MagnifierPlusOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { EASE_BASE } from '@hh.ru/magritte-ui-media-viewer/internal/animations';\nimport { type MediaViewerContextValue, useMediaViewerContext } from '@hh.ru/magritte-ui-media-viewer/internal/context';\nimport {\n findNextValue,\n getDimensionsAfterRotation,\n clampOffset,\n useInitOnce,\n} from '@hh.ru/magritte-ui-media-viewer/internal/utils';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from '../public/media-viewer.less';\n\nconst getCurrentControllerLimits = (globalContext: MediaViewerContextValue) => {\n const controller = globalContext.currentSlideController.get();\n if (!controller) {\n return null;\n }\n const rotation = controller.rotation.get();\n const zoomStops = controller.zoomStops.get()[rotation % 2];\n return {\n min: zoomStops?.[0] ?? Number.NEGATIVE_INFINITY,\n max: zoomStops?.[zoomStops.length - 1] ?? Number.POSITIVE_INFINITY,\n };\n};\n\nexport const PreviewZoomControl: FC = () => {\n const globalContext = useMediaViewerContext();\n const [zoom, setZoom] = useState<number | null>(() => {\n const zoom = globalContext.currentSlideController.get()?.scale.get() || null;\n return zoom ? Math.round(zoom * 100) : null;\n });\n const updateZoom = useInitOnce(() => (newZoom: number | null) => {\n setZoom(newZoom ? Math.round(newZoom * 100) : null);\n });\n\n const [zoomLimits, setZoomLimits] = useState<{ min: number; max: number } | null>(() =>\n getCurrentControllerLimits(globalContext)\n );\n const prevControllerUnsubRef = useRef<VoidFunction[]>([]);\n const zoomInTrl = useTranslation('MediaViewer', 'zoomIn');\n const zoomOutTrl = useTranslation('MediaViewer', 'zoomOut');\n\n const applyNextZoom = (direction: 'in' | 'out') => {\n const controller = globalContext.currentSlideController.get();\n const contentSize = controller?.contentSize.get();\n const viewPortDimensions = globalContext.viewPortDimensions.get();\n const rotation = controller?.rotation.get() ?? 0;\n if (!controller || !contentSize || !viewPortDimensions) {\n return;\n }\n const nextZoom = findNextValue(\n controller.zoomStops.get()[rotation % 2],\n controller.scale.get() ?? 1,\n direction === 'in'\n );\n\n controller.scale.stop();\n controller.offsetX.stop();\n controller.offsetY.stop();\n\n const sizeAfterRotation = getDimensionsAfterRotation(contentSize, rotation);\n const clampedOffsetX = clampOffset(\n controller.offsetX.get(),\n sizeAfterRotation.width * nextZoom,\n viewPortDimensions.width\n );\n const clampedOffsetY = clampOffset(\n controller.offsetY.get(),\n sizeAfterRotation.height * nextZoom,\n viewPortDimensions.height\n );\n\n animate(controller.scale, nextZoom, {\n duration: CoreTokens['magritte-semantic-animation-time-m'].duration / 1000,\n ease: EASE_BASE,\n });\n animate(controller.offsetX, clampedOffsetX, {\n duration: CoreTokens['magritte-semantic-animation-time-m'].duration / 1000,\n ease: EASE_BASE,\n });\n animate(controller.offsetY, clampedOffsetY, {\n duration: CoreTokens['magritte-semantic-animation-time-m'].duration / 1000,\n ease: EASE_BASE,\n });\n };\n\n useEffect(() => {\n const subs = [\n globalContext.currentSlideController.on('change', (controller) => {\n if (!controller) {\n return;\n }\n const scale = controller.scale.get() || null;\n updateZoom(scale);\n // слушаем всегда только один контроллер, от предыдущего надо отписаться\n prevControllerUnsubRef.current.forEach((unsub) => unsub());\n prevControllerUnsubRef.current = [\n controller.scale.on('change', updateZoom),\n controller.zoomStops.on('change', () => setZoomLimits(getCurrentControllerLimits(globalContext))),\n ];\n setZoomLimits(getCurrentControllerLimits(globalContext));\n }),\n () => prevControllerUnsubRef.current.forEach((unsub) => unsub()),\n ];\n\n const currentController = globalContext.currentSlideController.get();\n if (currentController) {\n prevControllerUnsubRef.current = [\n currentController.scale.on('change', updateZoom),\n currentController.zoomStops.on('change', () =>\n setZoomLimits(getCurrentControllerLimits(globalContext))\n ),\n ];\n setZoomLimits(getCurrentControllerLimits(globalContext));\n }\n return () => subs.forEach((unsub) => unsub?.());\n }, [globalContext, updateZoom]);\n\n return (\n <div className={styles.previewZoomControl}>\n <MagnifierMinusOutlinedSize24\n initialColor=\"constant\"\n padding={8}\n disabled={zoom !== null && (zoomLimits === null || zoom <= Math.round(zoomLimits?.min * 100))}\n onClick={() => {\n applyNextZoom('out');\n }}\n borderRadius=\"halfHeight\"\n aria-label={zoomOutTrl}\n />\n <Text style=\"constant\" typography=\"label-2-regular\">\n {`${zoom ?? 100}%`}\n </Text>\n <MagnifierPlusOutlinedSize24\n initialColor=\"constant\"\n padding={8}\n disabled={zoom !== null && (zoomLimits === null || zoom >= Math.round(zoomLimits?.max * 100))}\n onClick={() => {\n applyNextZoom('in');\n }}\n borderRadius=\"halfHeight\"\n aria-label={zoomInTrl}\n />\n </div>\n );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"PreviewZoomControl.js","sources":["src/internal/PreviewZoomControl.tsx"],"sourcesContent":["import { type FC, useState, useRef, useEffect } from 'react';\nimport { animate } from 'motion/react';\n\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport CoreTokens from '@hh.ru/magritte-design-tokens/core-tokens';\nimport { MagnifierMinusOutlinedSize24, MagnifierPlusOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { EASE_BASE } from '@hh.ru/magritte-ui-media-viewer/internal/animations';\nimport { useMediaViewerContext } from '@hh.ru/magritte-ui-media-viewer/internal/context';\nimport { type GalleryItemController } from '@hh.ru/magritte-ui-media-viewer/internal/hooks/useGalleryItemController';\nimport {\n findNextValue,\n getDimensionsAfterRotation,\n clampOffset,\n useInitOnce,\n} from '@hh.ru/magritte-ui-media-viewer/internal/utils';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from '../public/media-viewer.less';\n\nconst getControllerLimits = (controller: GalleryItemController | null) => {\n if (!controller) {\n return null;\n }\n const rotation = controller.rotation.get();\n const zoomStops = controller.zoomStops.get()[rotation % 2];\n return {\n min: zoomStops?.[0] ?? Number.NEGATIVE_INFINITY,\n max: zoomStops?.[zoomStops.length - 1] ?? Number.POSITIVE_INFINITY,\n };\n};\n\nexport const PreviewZoomControl: FC = () => {\n const globalContext = useMediaViewerContext();\n const [zoom, setZoom] = useState<number | null>(() => {\n const zoom = globalContext.currentSlideController.get()?.scale.get() || null;\n return zoom ? Math.round(zoom * 100) : null;\n });\n const updateZoom = useInitOnce(() => (newZoom: number | null) => {\n setZoom(newZoom ? Math.round(newZoom * 100) : null);\n });\n\n const [zoomLimits, setZoomLimits] = useState<{ min: number; max: number } | null>(() =>\n getControllerLimits(globalContext.currentSlideController.get())\n );\n const prevControllerUnsubRef = useRef<VoidFunction[]>([]);\n const zoomInTrl = useTranslation('MediaViewer', 'zoomIn');\n const zoomOutTrl = useTranslation('MediaViewer', 'zoomOut');\n\n const applyNextZoom = (direction: 'in' | 'out') => {\n const controller = globalContext.currentSlideController.get();\n const contentSize = controller?.contentSize.get();\n const viewPortDimensions = globalContext.viewPortDimensions.get();\n const rotation = controller?.rotation.get() ?? 0;\n if (!controller || !contentSize || !viewPortDimensions) {\n return;\n }\n const nextZoom = findNextValue(\n controller.zoomStops.get()[rotation % 2],\n controller.scale.get() ?? 1,\n direction === 'in'\n );\n\n controller.scale.stop();\n controller.offsetX.stop();\n controller.offsetY.stop();\n\n const sizeAfterRotation = getDimensionsAfterRotation(contentSize, rotation);\n const clampedOffsetX = clampOffset(\n controller.offsetX.get(),\n sizeAfterRotation.width * nextZoom,\n viewPortDimensions.width\n );\n const clampedOffsetY = clampOffset(\n controller.offsetY.get(),\n sizeAfterRotation.height * nextZoom,\n viewPortDimensions.height\n );\n\n animate(controller.scale, nextZoom, {\n duration: CoreTokens['magritte-semantic-animation-time-m'].duration / 1000,\n ease: EASE_BASE,\n });\n animate(controller.offsetX, clampedOffsetX, {\n duration: CoreTokens['magritte-semantic-animation-time-m'].duration / 1000,\n ease: EASE_BASE,\n });\n animate(controller.offsetY, clampedOffsetY, {\n duration: CoreTokens['magritte-semantic-animation-time-m'].duration / 1000,\n ease: EASE_BASE,\n });\n };\n\n useEffect(() => {\n // Контроллер активного слайда привязывается к контексту в эффекте GalleryItem, а Gallery в разметке\n // всегда идёт до Preview — значит на момент этого эффекта масштаб уже может быть посчитан, и его\n // надо прочитать, а не ждать следующего изменения\n const listenController = (controller: GalleryItemController | null) => {\n // слушаем всегда только один контроллер, от предыдущего надо отписаться\n prevControllerUnsubRef.current.forEach((unsub) => unsub());\n prevControllerUnsubRef.current = [];\n\n updateZoom(controller?.scale.get() || null);\n setZoomLimits(getControllerLimits(controller));\n\n if (!controller) {\n return;\n }\n\n prevControllerUnsubRef.current = [\n controller.scale.on('change', updateZoom),\n controller.zoomStops.on('change', () => setZoomLimits(getControllerLimits(controller))),\n ];\n };\n\n listenController(globalContext.currentSlideController.get());\n const unsubscribeFromContext = globalContext.currentSlideController.on('change', listenController);\n\n return () => {\n unsubscribeFromContext();\n prevControllerUnsubRef.current.forEach((unsub) => unsub());\n prevControllerUnsubRef.current = [];\n };\n }, [globalContext, updateZoom]);\n\n return (\n <div className={styles.previewZoomControl}>\n <MagnifierMinusOutlinedSize24\n initialColor=\"constant\"\n padding={8}\n disabled={zoom !== null && (zoomLimits === null || zoom <= Math.round(zoomLimits?.min * 100))}\n onClick={() => {\n applyNextZoom('out');\n }}\n borderRadius=\"halfHeight\"\n aria-label={zoomOutTrl}\n />\n <Text style=\"constant\" typography=\"label-2-regular\">\n {`${zoom ?? 100}%`}\n </Text>\n <MagnifierPlusOutlinedSize24\n initialColor=\"constant\"\n padding={8}\n disabled={zoom !== null && (zoomLimits === null || zoom >= Math.round(zoomLimits?.max * 100))}\n onClick={() => {\n applyNextZoom('in');\n }}\n borderRadius=\"halfHeight\"\n aria-label={zoomInTrl}\n />\n </div>\n );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}