@gravity-ui/page-constructor 1.2.3-alpha.4 → 1.2.3-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.
@@ -16,8 +16,8 @@ const b = (0, utils_1.block)('header-block');
16
16
  const Background = ({ background, isMobile }) => {
17
17
  const { url, image, fullWidthMedia, video, color } = background;
18
18
  const imageObject = url ? (0, utils_3.getMediaImage)(url) : image;
19
- return (react_1.default.createElement("div", { className: b('background', { media: true, 'full-width-media': fullWidthMedia }) },
20
- react_1.default.createElement(components_1.Media, Object.assign({}, background, { className: b('background-media'), imageClassName: b('image'), videoClassName: b('video'), isBackground: true, color: color, parallax: false, video: isMobile ? undefined : video, image: imageObject }))));
19
+ const renderMedia = !isMobile || (typeof image === 'object' && 'mobile' in image);
20
+ return (react_1.default.createElement("div", { className: b('background', { media: true, 'full-width-media': fullWidthMedia }), style: { backgroundColor: color } }, renderMedia && (react_1.default.createElement(components_1.Media, Object.assign({}, background, { className: b('background-media'), imageClassName: b('image'), videoClassName: b('video'), isBackground: true, parallax: false, video: isMobile ? undefined : video, image: imageObject })))));
21
21
  };
22
22
  const FullWidthBackground = ({ background }) => (react_1.default.createElement("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : background.color } }));
23
23
  const HeaderBlock = (props) => {
@@ -34,7 +34,7 @@ const HeaderBlock = (props) => {
34
34
  const backgroundThemed = background && (0, utils_1.getThemedValue)(background, theme);
35
35
  const imageThemed = image && (0, utils_1.getThemedValue)(image, theme);
36
36
  const videoThemed = video && (0, utils_1.getThemedValue)(video, theme);
37
- const fullWidth = backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidth;
37
+ const fullWidth = (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidth) || (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidthMedia);
38
38
  return (react_1.default.createElement("header", { className: b({ ['has-media']: hasRightSideImage, ['full-width']: fullWidth }, className) },
39
39
  backgroundThemed && fullWidth && react_1.default.createElement(FullWidthBackground, { background: backgroundThemed }),
40
40
  backgroundThemed && react_1.default.createElement(Background, { background: backgroundThemed, isMobile: isMobile }),
@@ -1,3 +1,143 @@
1
+ export declare const HeaderBackgroundProps: {
2
+ type: string;
3
+ additionalProperties: boolean;
4
+ required: never[];
5
+ properties: {
6
+ fullWidth: {
7
+ type: string;
8
+ };
9
+ fullWidthMedia: {
10
+ type: string;
11
+ };
12
+ color: {
13
+ type: string;
14
+ };
15
+ image: {
16
+ anyOf: ({
17
+ oneOf: ({
18
+ type: string;
19
+ properties: {
20
+ when: {
21
+ type: string;
22
+ };
23
+ };
24
+ } | {
25
+ type: string;
26
+ pattern: string;
27
+ })[];
28
+ } | {
29
+ type: string;
30
+ items: {
31
+ oneOf: ({
32
+ type: string;
33
+ properties: {
34
+ when: {
35
+ type: string;
36
+ };
37
+ };
38
+ } | {
39
+ type: string;
40
+ pattern: string;
41
+ })[];
42
+ };
43
+ })[];
44
+ };
45
+ video: {
46
+ type: string;
47
+ additionalProperties: boolean;
48
+ required: string[];
49
+ properties: {
50
+ src: {
51
+ type: string;
52
+ items: {
53
+ type: string;
54
+ };
55
+ };
56
+ loop: {
57
+ anyOf: ({
58
+ type: string;
59
+ additionalProperties: boolean;
60
+ required: string[];
61
+ properties: {
62
+ start: {
63
+ type: string;
64
+ };
65
+ end: {
66
+ type: string;
67
+ };
68
+ };
69
+ } | {
70
+ type: string;
71
+ })[];
72
+ };
73
+ type: {
74
+ type: string;
75
+ enum: string[];
76
+ };
77
+ muted: {
78
+ type: string;
79
+ };
80
+ playing: {
81
+ type: string;
82
+ };
83
+ elapsedTime: {
84
+ type: string;
85
+ };
86
+ playIcon: {
87
+ type: string;
88
+ additionalProperties: boolean;
89
+ properties: {
90
+ type: {
91
+ type: string;
92
+ enum: string[];
93
+ };
94
+ theme: {
95
+ type: string;
96
+ enum: string[];
97
+ };
98
+ text: {
99
+ type: string;
100
+ };
101
+ };
102
+ };
103
+ controls: {
104
+ type: string;
105
+ enum: string[];
106
+ };
107
+ };
108
+ };
109
+ youtube: {
110
+ type: string;
111
+ };
112
+ parallax: {
113
+ type: string;
114
+ };
115
+ height: {
116
+ type: string;
117
+ };
118
+ previewImg: {
119
+ type: string;
120
+ };
121
+ dataLens: {
122
+ oneOf: ({
123
+ type: string;
124
+ additionalProperties: boolean;
125
+ required: string[];
126
+ properties: {
127
+ id: {
128
+ type: string;
129
+ };
130
+ theme: {
131
+ type: string;
132
+ enum: string[];
133
+ };
134
+ };
135
+ } | {
136
+ type: string;
137
+ })[];
138
+ };
139
+ };
140
+ };
1
141
  export declare const HeaderProperties: {
2
142
  title: {
3
143
  type: string;
@@ -140,31 +280,21 @@ export declare const HeaderProperties: {
140
280
  };
141
281
  background: {
142
282
  oneOf: ({
143
- fullWidth: {
144
- type: string;
145
- };
146
- fullWidthMedia: {
147
- type: string;
148
- };
149
- color: {
150
- type: string;
151
- };
152
- image: {
153
- anyOf: ({
154
- oneOf: ({
155
- type: string;
156
- properties: {
157
- when: {
158
- type: string;
159
- };
160
- };
161
- } | {
162
- type: string;
163
- pattern: string;
164
- })[];
165
- } | {
283
+ type: string;
284
+ additionalProperties: boolean;
285
+ required: never[];
286
+ properties: {
287
+ fullWidth: {
166
288
  type: string;
167
- items: {
289
+ };
290
+ fullWidthMedia: {
291
+ type: string;
292
+ };
293
+ color: {
294
+ type: string;
295
+ };
296
+ image: {
297
+ anyOf: ({
168
298
  oneOf: ({
169
299
  type: string;
170
300
  properties: {
@@ -176,103 +306,118 @@ export declare const HeaderProperties: {
176
306
  type: string;
177
307
  pattern: string;
178
308
  })[];
179
- };
180
- })[];
181
- };
182
- video: {
183
- type: string;
184
- additionalProperties: boolean;
185
- required: string[];
186
- properties: {
187
- src: {
309
+ } | {
188
310
  type: string;
189
311
  items: {
312
+ oneOf: ({
313
+ type: string;
314
+ properties: {
315
+ when: {
316
+ type: string;
317
+ };
318
+ };
319
+ } | {
320
+ type: string;
321
+ pattern: string;
322
+ })[];
323
+ };
324
+ })[];
325
+ };
326
+ video: {
327
+ type: string;
328
+ additionalProperties: boolean;
329
+ required: string[];
330
+ properties: {
331
+ src: {
190
332
  type: string;
333
+ items: {
334
+ type: string;
335
+ };
191
336
  };
192
- };
193
- loop: {
194
- anyOf: ({
337
+ loop: {
338
+ anyOf: ({
339
+ type: string;
340
+ additionalProperties: boolean;
341
+ required: string[];
342
+ properties: {
343
+ start: {
344
+ type: string;
345
+ };
346
+ end: {
347
+ type: string;
348
+ };
349
+ };
350
+ } | {
351
+ type: string;
352
+ })[];
353
+ };
354
+ type: {
355
+ type: string;
356
+ enum: string[];
357
+ };
358
+ muted: {
359
+ type: string;
360
+ };
361
+ playing: {
362
+ type: string;
363
+ };
364
+ elapsedTime: {
365
+ type: string;
366
+ };
367
+ playIcon: {
195
368
  type: string;
196
369
  additionalProperties: boolean;
197
- required: string[];
198
370
  properties: {
199
- start: {
371
+ type: {
200
372
  type: string;
373
+ enum: string[];
201
374
  };
202
- end: {
375
+ theme: {
376
+ type: string;
377
+ enum: string[];
378
+ };
379
+ text: {
203
380
  type: string;
204
381
  };
205
382
  };
206
- } | {
383
+ };
384
+ controls: {
207
385
  type: string;
208
- })[];
209
- };
210
- type: {
211
- type: string;
212
- enum: string[];
213
- };
214
- muted: {
215
- type: string;
216
- };
217
- playing: {
218
- type: string;
219
- };
220
- elapsedTime: {
221
- type: string;
386
+ enum: string[];
387
+ };
222
388
  };
223
- playIcon: {
389
+ };
390
+ youtube: {
391
+ type: string;
392
+ };
393
+ parallax: {
394
+ type: string;
395
+ };
396
+ height: {
397
+ type: string;
398
+ };
399
+ previewImg: {
400
+ type: string;
401
+ };
402
+ dataLens: {
403
+ oneOf: ({
224
404
  type: string;
225
405
  additionalProperties: boolean;
406
+ required: string[];
226
407
  properties: {
227
- type: {
408
+ id: {
228
409
  type: string;
229
- enum: string[];
230
410
  };
231
411
  theme: {
232
412
  type: string;
233
413
  enum: string[];
234
414
  };
235
- text: {
236
- type: string;
237
- };
238
415
  };
239
- };
240
- controls: {
416
+ } | {
241
417
  type: string;
242
- enum: string[];
243
- };
418
+ })[];
244
419
  };
245
420
  };
246
- youtube: {
247
- type: string;
248
- };
249
- parallax: {
250
- type: string;
251
- };
252
- height: {
253
- type: string;
254
- };
255
- previewImg: {
256
- type: string;
257
- };
258
- dataLens: {
259
- oneOf: ({
260
- type: string;
261
- additionalProperties: boolean;
262
- required: string[];
263
- properties: {
264
- id: {
265
- type: string;
266
- };
267
- theme: {
268
- type: string;
269
- enum: string[];
270
- };
271
- };
272
- } | {
273
- type: string;
274
- })[];
275
- };
276
421
  } | {
277
422
  type: string;
278
423
  additionalProperties: boolean;
@@ -461,31 +606,21 @@ export declare const HeaderBlock: {
461
606
  };
462
607
  background: {
463
608
  oneOf: ({
464
- fullWidth: {
465
- type: string;
466
- };
467
- fullWidthMedia: {
468
- type: string;
469
- };
470
- color: {
471
- type: string;
472
- };
473
- image: {
474
- anyOf: ({
475
- oneOf: ({
476
- type: string;
477
- properties: {
478
- when: {
479
- type: string;
480
- };
481
- };
482
- } | {
483
- type: string;
484
- pattern: string;
485
- })[];
486
- } | {
609
+ type: string;
610
+ additionalProperties: boolean;
611
+ required: never[];
612
+ properties: {
613
+ fullWidth: {
487
614
  type: string;
488
- items: {
615
+ };
616
+ fullWidthMedia: {
617
+ type: string;
618
+ };
619
+ color: {
620
+ type: string;
621
+ };
622
+ image: {
623
+ anyOf: ({
489
624
  oneOf: ({
490
625
  type: string;
491
626
  properties: {
@@ -497,103 +632,118 @@ export declare const HeaderBlock: {
497
632
  type: string;
498
633
  pattern: string;
499
634
  })[];
500
- };
501
- })[];
502
- };
503
- video: {
504
- type: string;
505
- additionalProperties: boolean;
506
- required: string[];
507
- properties: {
508
- src: {
635
+ } | {
509
636
  type: string;
510
637
  items: {
638
+ oneOf: ({
639
+ type: string;
640
+ properties: {
641
+ when: {
642
+ type: string;
643
+ };
644
+ };
645
+ } | {
646
+ type: string;
647
+ pattern: string;
648
+ })[];
649
+ };
650
+ })[];
651
+ };
652
+ video: {
653
+ type: string;
654
+ additionalProperties: boolean;
655
+ required: string[];
656
+ properties: {
657
+ src: {
658
+ type: string;
659
+ items: {
660
+ type: string;
661
+ };
662
+ };
663
+ loop: {
664
+ anyOf: ({
665
+ type: string;
666
+ additionalProperties: boolean;
667
+ required: string[];
668
+ properties: {
669
+ start: {
670
+ type: string;
671
+ };
672
+ end: {
673
+ type: string;
674
+ };
675
+ };
676
+ } | {
677
+ type: string;
678
+ })[];
679
+ };
680
+ type: {
511
681
  type: string;
682
+ enum: string[];
512
683
  };
513
- };
514
- loop: {
515
- anyOf: ({
684
+ muted: {
685
+ type: string;
686
+ };
687
+ playing: {
688
+ type: string;
689
+ };
690
+ elapsedTime: {
691
+ type: string;
692
+ };
693
+ playIcon: {
516
694
  type: string;
517
695
  additionalProperties: boolean;
518
- required: string[];
519
696
  properties: {
520
- start: {
697
+ type: {
521
698
  type: string;
699
+ enum: string[];
522
700
  };
523
- end: {
701
+ theme: {
702
+ type: string;
703
+ enum: string[];
704
+ };
705
+ text: {
524
706
  type: string;
525
707
  };
526
708
  };
527
- } | {
709
+ };
710
+ controls: {
528
711
  type: string;
529
- })[];
530
- };
531
- type: {
532
- type: string;
533
- enum: string[];
534
- };
535
- muted: {
536
- type: string;
537
- };
538
- playing: {
539
- type: string;
540
- };
541
- elapsedTime: {
542
- type: string;
712
+ enum: string[];
713
+ };
543
714
  };
544
- playIcon: {
715
+ };
716
+ youtube: {
717
+ type: string;
718
+ };
719
+ parallax: {
720
+ type: string;
721
+ };
722
+ height: {
723
+ type: string;
724
+ };
725
+ previewImg: {
726
+ type: string;
727
+ };
728
+ dataLens: {
729
+ oneOf: ({
545
730
  type: string;
546
731
  additionalProperties: boolean;
732
+ required: string[];
547
733
  properties: {
548
- type: {
734
+ id: {
549
735
  type: string;
550
- enum: string[];
551
736
  };
552
737
  theme: {
553
738
  type: string;
554
739
  enum: string[];
555
740
  };
556
- text: {
557
- type: string;
558
- };
559
741
  };
560
- };
561
- controls: {
742
+ } | {
562
743
  type: string;
563
- enum: string[];
564
- };
744
+ })[];
565
745
  };
566
746
  };
567
- youtube: {
568
- type: string;
569
- };
570
- parallax: {
571
- type: string;
572
- };
573
- height: {
574
- type: string;
575
- };
576
- previewImg: {
577
- type: string;
578
- };
579
- dataLens: {
580
- oneOf: ({
581
- type: string;
582
- additionalProperties: boolean;
583
- required: string[];
584
- properties: {
585
- id: {
586
- type: string;
587
- };
588
- theme: {
589
- type: string;
590
- enum: string[];
591
- };
592
- };
593
- } | {
594
- type: string;
595
- })[];
596
- };
597
747
  } | {
598
748
  type: string;
599
749
  additionalProperties: boolean;
@@ -1,9 +1,15 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.HeaderBlock = exports.HeaderProperties = void 0;
3
+ exports.HeaderBlock = exports.HeaderProperties = exports.HeaderBackgroundProps = void 0;
4
4
  const common_1 = require("../../schema/validators/common");
5
5
  const utils_1 = require("../../schema/validators/utils");
6
6
  const schema_1 = require("../../components/Image/schema");
7
+ exports.HeaderBackgroundProps = {
8
+ type: 'object',
9
+ additionalProperties: false,
10
+ required: [],
11
+ properties: Object.assign(Object.assign({}, common_1.MediaProps), { fullWidth: { type: 'boolean' }, fullWidthMedia: { type: 'boolean' } }),
12
+ };
7
13
  exports.HeaderProperties = {
8
14
  title: {
9
15
  type: 'string',
@@ -45,7 +51,7 @@ exports.HeaderProperties = {
45
51
  type: 'string',
46
52
  enum: ['s', 'm', 'l', 'xl'],
47
53
  },
48
- background: (0, common_1.withTheme)(Object.assign(Object.assign({}, common_1.MediaProps), { fullWidth: { type: 'boolean' }, fullWidthMedia: { type: 'boolean' } })),
54
+ background: (0, common_1.withTheme)(exports.HeaderBackgroundProps),
49
55
  theme: {
50
56
  type: 'string',
51
57
  enum: ['default', 'dark'],