pds-dev-kit-web-test 0.3.8 → 0.3.9

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 (23) hide show
  1. package/dist/src/sub/DynamicLayout/DynamicLayout.d.ts +1 -1
  2. package/dist/src/sub/DynamicLayout/DynamicLayout.js +3 -2
  3. package/dist/src/sub/DynamicLayout/dynamicLayoutContext.js +2 -1
  4. package/dist/src/sub/DynamicLayout/pagesPreviewMock.d.ts +6 -60
  5. package/dist/src/sub/DynamicLayout/pagesPreviewMock.js +10 -70
  6. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Button/Button.js +2 -2
  7. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Divider/Divider.js +2 -2
  8. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Image/Image.js +9 -15
  9. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/RichText/RichText.js +2 -2
  10. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Text/Text.js +2 -2
  11. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Twitter/Twitter.js +2 -2
  12. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Youtube/Youtube.js +27 -3
  13. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/index.d.ts +2 -2
  14. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/index.js +0 -3
  15. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/types.d.ts +2 -4
  16. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/types.js +0 -1
  17. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/parseProperties.js +2 -2
  18. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/types.d.ts +1 -4
  19. package/dist/src/sub/DynamicLayout/types.d.ts +1 -0
  20. package/package.json +1 -1
  21. package/release-note.md +2 -2
  22. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/parseEffectPropHoverAnim.d.ts +0 -19
  23. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/parseEffectPropHoverAnim.js +0 -51
package/dist/src/sub/DynamicLayout/DynamicLayout.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  /// <reference types="react" />
2
2
  import type { DynamicLayoutProps } from './types';
3
- declare function DynamicLayout({ device, mode, isPreview, sections, scrollDownTargetSectionId, editingSectionId, navigationHandler, sectionActionHandler, onClickEditSection, programmedSectionComponents }: DynamicLayoutProps): JSX.Element;
3
+ declare function DynamicLayout({ device, mode, isPreview, sections, scrollDownTargetSectionId, editingSectionId, navigationHandler, sectionActionHandler, onClickEditSection, programmedSectionComponents, youtubeAutoplayMode }: DynamicLayoutProps): JSX.Element;
4
4
  export default DynamicLayout;
package/dist/src/sub/DynamicLayout/DynamicLayout.js CHANGED
@@ -25,7 +25,7 @@ var EditModeSectionMatcher_1 = require("./components/EditModeSectionMatcher");
25
25
  var SectionMatcher_1 = require("./components/SectionMatcher");
26
26
  var dynamicLayoutContext_1 = require("./dynamicLayoutContext");
27
27
  function DynamicLayout(_a) {
28
- var device = _a.device, _b = _a.mode, mode = _b === void 0 ? 'NORMAL' : _b, isPreview = _a.isPreview, sections = _a.sections, scrollDownTargetSectionId = _a.scrollDownTargetSectionId, editingSectionId = _a.editingSectionId, navigationHandler = _a.navigationHandler, sectionActionHandler = _a.sectionActionHandler, onClickEditSection = _a.onClickEditSection, programmedSectionComponents = _a.programmedSectionComponents;
28
+ var device = _a.device, _b = _a.mode, mode = _b === void 0 ? 'NORMAL' : _b, isPreview = _a.isPreview, sections = _a.sections, scrollDownTargetSectionId = _a.scrollDownTargetSectionId, editingSectionId = _a.editingSectionId, navigationHandler = _a.navigationHandler, sectionActionHandler = _a.sectionActionHandler, onClickEditSection = _a.onClickEditSection, programmedSectionComponents = _a.programmedSectionComponents, youtubeAutoplayMode = _a.youtubeAutoplayMode;
29
29
  var filteredSortedSection = __spreadArray([], sections, true).filter(function (section) { return section.display; })
30
30
  .sort(function (a, b) { return a.order - b.order; });
31
31
  var iframeSection = filteredSortedSection.find(function (section) { return section.manifest.schema === 'EXP_IFRAME' && section.display; });
@@ -36,7 +36,8 @@ function DynamicLayout(_a) {
36
36
  navigationHandler: navigationHandler,
37
37
  sectionActionHandler: sectionActionHandler,
38
38
  editingSectionId: editingSectionId,
39
- programmedSectionComponents: programmedSectionComponents
39
+ programmedSectionComponents: programmedSectionComponents,
40
+ youtubeAutoplayMode: youtubeAutoplayMode
40
41
  } }, { children: [mode === 'EDIT' && onClickEditSection && ((0, jsx_runtime_1.jsx)(EditModeSectionMatcher_1.EditModeSectionMatcher, { editingSectionId: editingSectionId, scrollDownTargetSectionId: scrollDownTargetSectionId, filteredSortedSection: filteredSortedSection, onClickEditSection: onClickEditSection })), mode !== 'EDIT' &&
41
42
  (iframeSection ? ((0, jsx_runtime_1.jsx)(SectionMatcher_1.SectionMatcher, __assign({}, iframeSection), iframeSection.id)) : (filteredSortedSection.map(function (section) { return (0, jsx_runtime_1.jsx)(SectionMatcher_1.SectionMatcher, __assign({}, section), section.id); })))] })));
42
43
  }
package/dist/src/sub/DynamicLayout/dynamicLayoutContext.js CHANGED
@@ -4,5 +4,6 @@ exports.dynamicLayoutContext = void 0;
4
4
  var react_1 = require("react");
5
5
  exports.dynamicLayoutContext = (0, react_1.createContext)({
6
6
  device: 'DESKTOP',
7
- mode: 'NORMAL'
7
+ mode: 'NORMAL',
8
+ youtubeAutoplayMode: undefined
8
9
  });
package/dist/src/sub/DynamicLayout/pagesPreviewMock.d.ts CHANGED
@@ -166,16 +166,6 @@ export declare const sampleCustomsection1: {
166
166
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: string;
167
167
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': string;
168
168
  };
169
- CB_EFFECT_PROP_HOVERANIM: {
170
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: number;
171
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null;
172
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: number;
173
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null;
174
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: string;
175
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null;
176
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: string;
177
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': null;
178
- };
179
169
  CB_LAYOUT_PROP_ARRANGE: {
180
170
  CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL: string;
181
171
  'CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE': string;
@@ -333,6 +323,7 @@ export declare const sampleCustomsection1: {
333
323
  'CB_STYLE_PROP_SHADOW_SPEC_Y:MOBILE': null;
334
324
  'CB_STYLE_PROP_SHADOW_SPEC_Y:MOBILE:HOVER': null;
335
325
  };
326
+ CB_EFFECT_PROP_HOVERANIM?: undefined;
336
327
  CB_STYLE_PROP_TEXT?: undefined;
337
328
  CB_CONTENT_PROP_IMAGE?: undefined;
338
329
  CB_STYLE_PROP_IMAGE?: undefined;
@@ -492,17 +483,8 @@ export declare const sampleCustomsection1: {
492
483
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: string;
493
484
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null;
494
485
  };
495
- CB_EFFECT_PROP_HOVERANIM: {
496
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: number;
497
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null;
498
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: number;
499
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null;
500
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: string;
501
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null;
502
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: string;
503
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': string;
504
- };
505
486
  CB_CONTENT_PROP_TEXT?: undefined;
487
+ CB_EFFECT_PROP_HOVERANIM?: undefined;
506
488
  CB_STYLE_PROP_TEXT?: undefined;
507
489
  CB_STYLE_PROP_BTNCOLOR?: undefined;
508
490
  CB_STYLE_PROP_BTNTEXT?: undefined;
@@ -549,16 +531,6 @@ export declare const sampleCustomsection1: {
549
531
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: string;
550
532
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null;
551
533
  };
552
- CB_EFFECT_PROP_HOVERANIM: {
553
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: number;
554
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null;
555
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: number;
556
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null;
557
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: string;
558
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null;
559
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: string;
560
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': null;
561
- };
562
534
  CB_LAYOUT_PROP_ARRANGE: {
563
535
  CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL: string;
564
536
  'CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE': string;
@@ -692,6 +664,7 @@ export declare const sampleCustomsection1: {
692
664
  };
693
665
  CB_CONTENT_PROP_CLINK?: undefined;
694
666
  CB_CONTENT_PROP_TEXT?: undefined;
667
+ CB_EFFECT_PROP_HOVERANIM?: undefined;
695
668
  CB_STYLE_PROP_TEXT?: undefined;
696
669
  CB_STYLE_PROP_BTNCOLOR?: undefined;
697
670
  CB_STYLE_PROP_BTNTEXT?: undefined;
@@ -742,16 +715,6 @@ export declare const sampleCustomsection1: {
742
715
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: string;
743
716
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null;
744
717
  };
745
- CB_EFFECT_PROP_HOVERANIM: {
746
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: string;
747
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': string;
748
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: number;
749
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null;
750
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: number;
751
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null;
752
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: string;
753
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null;
754
- };
755
718
  CB_LAYOUT_PROP_ARRANGE: {
756
719
  CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL: string;
757
720
  'CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE': string;
@@ -853,6 +816,7 @@ export declare const sampleCustomsection1: {
853
816
  };
854
817
  CB_CONTENT_PROP_CLINK?: undefined;
855
818
  CB_CONTENT_PROP_TEXT?: undefined;
819
+ CB_EFFECT_PROP_HOVERANIM?: undefined;
856
820
  CB_STYLE_PROP_TEXT?: undefined;
857
821
  CB_STYLE_PROP_BORDER?: undefined;
858
822
  CB_STYLE_PROP_BTNCOLOR?: undefined;
@@ -900,16 +864,6 @@ export declare const sampleCustomsection1: {
900
864
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: string;
901
865
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null;
902
866
  };
903
- CB_EFFECT_PROP_HOVERANIM: {
904
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: string;
905
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': string;
906
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: number;
907
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null;
908
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: number;
909
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null;
910
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: string;
911
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null;
912
- };
913
867
  CB_LAYOUT_PROP_ARRANGE: {
914
868
  CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL: string;
915
869
  'CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE': string;
@@ -981,6 +935,7 @@ export declare const sampleCustomsection1: {
981
935
  };
982
936
  CB_CONTENT_PROP_CLINK?: undefined;
983
937
  CB_CONTENT_PROP_TEXT?: undefined;
938
+ CB_EFFECT_PROP_HOVERANIM?: undefined;
984
939
  CB_STYLE_PROP_TEXT?: undefined;
985
940
  CB_STYLE_PROP_BORDER?: undefined;
986
941
  CB_STYLE_PROP_BTNCOLOR?: undefined;
@@ -1068,18 +1023,9 @@ export declare const sampleCustomsection1: {
1068
1023
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: string;
1069
1024
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null;
1070
1025
  };
1071
- CB_EFFECT_PROP_HOVERANIM: {
1072
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: string;
1073
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': string;
1074
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: number;
1075
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null;
1076
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: number;
1077
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null;
1078
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: string;
1079
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null;
1080
- };
1081
1026
  CB_CONTENT_PROP_CLINK?: undefined;
1082
1027
  CB_CONTENT_PROP_TEXT?: undefined;
1028
+ CB_EFFECT_PROP_HOVERANIM?: undefined;
1083
1029
  CB_STYLE_PROP_OPACITY?: undefined;
1084
1030
  CB_STYLE_PROP_TEXT?: undefined;
1085
1031
  CB_STYLE_PROP_BORDER?: undefined;
package/dist/src/sub/DynamicLayout/pagesPreviewMock.js CHANGED
@@ -34,21 +34,21 @@ exports.sampleCustomsection1 = {
34
34
  CB_EFFECT_PROP_ENTANIM: {
35
35
  CB_EFFECT_PROP_ENTANIM_SPEC_DURATION: 0.7,
36
36
  'CB_EFFECT_PROP_ENTANIM_SPEC_DURATION:MOBILE': null,
37
- CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT: 10,
37
+ CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT: 1,
38
38
  'CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT:MOBILE': null,
39
39
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: 'EASEINOUT',
40
40
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null,
41
- CB_EFFECT_PROP_ENTANIM_SPEC_TYPE: 'HEARTBEAT',
41
+ CB_EFFECT_PROP_ENTANIM_SPEC_TYPE: 'NONE',
42
42
  'CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE': null
43
43
  },
44
44
  CB_EFFECT_PROP_HOVERANIM: {
45
45
  CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: 0.7,
46
46
  'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null,
47
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: 10,
47
+ CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: 1,
48
48
  'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null,
49
49
  CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: 'EASEINOUT',
50
50
  'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null,
51
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'FADEINBOTTOM',
51
+ CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'NONE',
52
52
  'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': null
53
53
  },
54
54
  CB_LAYOUT_PROP_PADDING: {
@@ -157,16 +157,6 @@ exports.sampleCustomsection1 = {
157
157
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: 'EASEINOUT',
158
158
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': 'EASEINOUT'
159
159
  },
160
- CB_EFFECT_PROP_HOVERANIM: {
161
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: 0.7,
162
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null,
163
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: 10,
164
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null,
165
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: 'EASEINOUT',
166
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null,
167
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'FADEINBOTTOM',
168
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': null
169
- },
170
160
  CB_LAYOUT_PROP_ARRANGE: {
171
161
  CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL: 'CENTER',
172
162
  'CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE': 'MIDDLE',
@@ -469,20 +459,10 @@ exports.sampleCustomsection1 = {
469
459
  'CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE': 'HEARTBEAT',
470
460
  CB_EFFECT_PROP_ENTANIM_SPEC_DURATION: 1,
471
461
  'CB_EFFECT_PROP_ENTANIM_SPEC_DURATION:MOBILE': null,
472
- CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT: 3,
462
+ CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT: 1,
473
463
  'CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT:MOBILE': null,
474
464
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: 'EASEINOUT',
475
465
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null
476
- },
477
- CB_EFFECT_PROP_HOVERANIM: {
478
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: 0.7,
479
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null,
480
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: 10,
481
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null,
482
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: 'EASEINOUT',
483
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null,
484
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'FADEINBOTTOM',
485
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': 'FADEINBOTTOM'
486
466
  }
487
467
  },
488
468
  minVersion: '2023-08-03',
@@ -522,16 +502,6 @@ exports.sampleCustomsection1 = {
522
502
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: 'EASEINOUT',
523
503
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null
524
504
  },
525
- CB_EFFECT_PROP_HOVERANIM: {
526
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: 0.7,
527
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null,
528
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: 10,
529
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null,
530
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: 'EASEINOUT',
531
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null,
532
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'FADEINBOTTOM',
533
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': null
534
- },
535
505
  CB_LAYOUT_PROP_ARRANGE: {
536
506
  CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL: 'BOTTOM',
537
507
  'CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE': 'LEFT',
@@ -705,16 +675,6 @@ exports.sampleCustomsection1 = {
705
675
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: 'EASEINOUT',
706
676
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null
707
677
  },
708
- CB_EFFECT_PROP_HOVERANIM: {
709
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'FADEINBOTTOM',
710
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': 'FADEINBOTTOM',
711
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: 1,
712
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null,
713
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: 1,
714
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null,
715
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: 'EASEINOUT',
716
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null
717
- },
718
678
  CB_LAYOUT_PROP_ARRANGE: {
719
679
  CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL: 'CENTER',
720
680
  'CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE': 'MIDDLE',
@@ -733,16 +693,16 @@ exports.sampleCustomsection1 = {
733
693
  'CB_LAYOUT_PROP_PADDING_SPEC_PADDING:MOBILE': null
734
694
  },
735
695
  CB_PLACEMENT_PROP_PLACEMENT: {
736
- CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS: 2,
696
+ CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS: 8,
737
697
  'CB_PLACEMENT_PROP_PLACEMENT_SPEC_COLS:MOBILE': 1,
738
- CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS: 4,
698
+ CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS: 12,
739
699
  'CB_PLACEMENT_PROP_PLACEMENT_SPEC_ROWS:MOBILE': 3,
740
700
  CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX: 1,
741
701
  'CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTX:MOBILE': 2,
742
702
  CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY: 1,
743
703
  'CB_PLACEMENT_PROP_PLACEMENT_SPEC_STARTY:MOBILE': 2,
744
- CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX: 2,
745
- 'CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX:MOBILE': 2
704
+ CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX: 20,
705
+ 'CB_PLACEMENT_PROP_PLACEMENT_SPEC_ZINDEX:MOBILE': 20
746
706
  },
747
707
  CB_STYLE_PROP_BGCOLOR: {
748
708
  CB_STYLE_PROP_BGCOLOR_SPEC_ANGLE: 90,
@@ -852,16 +812,6 @@ exports.sampleCustomsection1 = {
852
812
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: 'EASEINOUT',
853
813
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null
854
814
  },
855
- CB_EFFECT_PROP_HOVERANIM: {
856
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'FADEINBOTTOM',
857
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': 'FADEINBOTTOM',
858
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: 1,
859
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null,
860
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: 1,
861
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null,
862
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: 'EASEINOUT',
863
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null
864
- },
865
815
  CB_LAYOUT_PROP_ARRANGE: {
866
816
  CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL: 'CENTER',
867
817
  'CB_LAYOUT_PROP_ARRANGE_SPEC_HORIZONTAL:MOBILE': 'MIDDLE',
@@ -1008,16 +958,6 @@ exports.sampleCustomsection1 = {
1008
958
  'CB_EFFECT_PROP_ENTANIM_SPEC_REPEAT:MOBILE': null,
1009
959
  CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC: 'EASEINOUT',
1010
960
  'CB_EFFECT_PROP_ENTANIM_SPEC_TFUNC:MOBILE': null
1011
- },
1012
- CB_EFFECT_PROP_HOVERANIM: {
1013
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'FADEINBOTTOM',
1014
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': 'FADEINBOTTOM',
1015
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: 1,
1016
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': null,
1017
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: 1,
1018
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null,
1019
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: 'EASEINOUT',
1020
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null
1021
961
  }
1022
962
  },
1023
963
  minVersion: '2023-08-03',
@@ -1065,7 +1005,7 @@ exports.sampleCustomsection1 = {
1065
1005
  'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': null,
1066
1006
  CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: 'EASEINOUT',
1067
1007
  'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': null,
1068
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'HEARTBEAT',
1008
+ CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: 'NONE',
1069
1009
  'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': null
1070
1010
  },
1071
1011
  CB_LAYOUT_PROP_PADDING: {
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Button/Button.js CHANGED
@@ -49,7 +49,7 @@ function Button(props) {
49
49
  }), onClickCLINK = _c.onClickCLINK, CLINKCursor = _c.CLINKCursor;
50
50
  var _d = getBTNStyles(props.CB_STYLE_PROP_BTNTEXT, device), btnTextStyle = _d.style, btnTextHoverStyle = _d.hoverStyle;
51
51
  var _e = getBTNColorStyles(CB_STYLE_PROP_BTNCOLOR, device), btnColorStyle = _e.style, btnColorHoverStyle = _e.hoverStyle;
52
- var _f = (0, util_1.parseProperties)(props, device), propsStyle = _f.style, propsHoverStyle = _f.hoverStyle, _g = _f.layout, paddingLeft = _g.paddingLeft, paddingRight = _g.paddingRight, paddingTop = _g.paddingTop, paddingBottom = _g.paddingBottom, layoutStyle = __rest(_g, ["paddingLeft", "paddingRight", "paddingTop", "paddingBottom"]), effect = _f.effect, hoverEffect = _f.hoverEffect;
52
+ var _f = (0, util_1.parseProperties)(props, device), propsStyle = _f.style, propsHoverStyle = _f.hoverStyle, _g = _f.layout, paddingLeft = _g.paddingLeft, paddingRight = _g.paddingRight, paddingTop = _g.paddingTop, paddingBottom = _g.paddingBottom, layoutStyle = __rest(_g, ["paddingLeft", "paddingRight", "paddingTop", "paddingBottom"]), effect = _f.effect;
53
53
  var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
54
54
  var googleFonts = (0, useGoogleFonts_1.getGoogleFontsFromBtnCB)(props.CB_STYLE_PROP_BTNTEXT, device === 'MOBILE');
55
55
  (0, useGoogleFonts_1.useGoogleFonts)({ fonts: googleFonts });
@@ -70,7 +70,7 @@ function Button(props) {
70
70
  paddingRight: paddingRight,
71
71
  paddingBottom: paddingBottom,
72
72
  paddingTop: paddingTop
73
- } }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign(__assign({}, btnTextStyle), propsStyle), layoutStyle), effectCssProperties), btnColorStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign(__assign(__assign({}, btnTextHoverStyle), propsHoverStyle), btnColorHoverStyle), hoverEffect), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
73
+ } }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign(__assign({}, btnTextStyle), propsStyle), layoutStyle), effectCssProperties), btnColorStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign(__assign({}, btnTextHoverStyle), propsHoverStyle), btnColorHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
74
74
  }
75
75
  function getBTNStyles(props, device) {
76
76
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Divider/Divider.js CHANGED
@@ -50,7 +50,7 @@ var S_HiddenCover_1 = require("../components/S_HiddenCover");
50
50
  function Divider(props) {
51
51
  var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
52
52
  var CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
53
- var _b = (0, util_1.parseProperties)(props, device), propsStyle = _b.style, propsHoverStyle = _b.hoverStyle, layoutStyle = _b.layout, effect = _b.effect, hoverEffect = _b.hoverEffect;
53
+ var _b = (0, util_1.parseProperties)(props, device), propsStyle = _b.style, propsHoverStyle = _b.hoverStyle, layoutStyle = _b.layout, effect = _b.effect;
54
54
  var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
55
55
  if (mode === 'EDIT') {
56
56
  propsStyle.visibility = 'visible';
@@ -64,7 +64,7 @@ function Divider(props) {
64
64
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
65
65
  var hasEffect = !isNoneEffectType;
66
66
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
67
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: layoutStyle, hoverStyle: {} }, { children: (0, jsx_runtime_1.jsx)(S_DIVIDER, { className: "cb-divider", normalStyle: __assign(__assign({}, propsStyle), effectCssProperties), hoverStyle: __assign(__assign({}, propsHoverStyle), hoverEffect) }) })) }))] }));
67
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: layoutStyle, hoverStyle: {} }, { children: (0, jsx_runtime_1.jsx)(S_DIVIDER, { className: "cb-divider", normalStyle: __assign(__assign({}, propsStyle), effectCssProperties), hoverStyle: __assign({}, propsHoverStyle) }) })) }))] }));
68
68
  }
69
69
  var S_DIVIDER = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"], ["\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"])), function (_a) {
70
70
  var normalStyle = _a.normalStyle;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Image/Image.js CHANGED
@@ -60,7 +60,7 @@ function Image(props) {
60
60
  openNewTab: CB_CONTENT_PROP_CLINK_SPEC_NEWTAB,
61
61
  internalSrc: String(CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC)
62
62
  }), onClickCLINK = _c.onClickCLINK, CLINKCursor = _c.CLINKCursor;
63
- var _d = (0, util_1.parseProperties)(props, device), style = _d.style, hoverStyle = _d.hoverStyle, layout = _d.layout, effect = _d.effect, hoverEffect = _d.hoverEffect;
63
+ var _d = (0, util_1.parseProperties)(props, device), style = _d.style, hoverStyle = _d.hoverStyle, layout = _d.layout, effect = _d.effect;
64
64
  var _e = parseImageCBStyle(style, hoverStyle, mode), boxStyle = _e.boxStyle, imgStyle = _e.imgStyle;
65
65
  var isEditModeAndHidden = style.visibility === 'hidden' && mode === 'EDIT';
66
66
  var cbRef = (0, react_1.useRef)(null);
@@ -72,7 +72,7 @@ function Image(props) {
72
72
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
73
73
  var hasEffect = !isNoneEffectType;
74
74
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
75
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_ImageWrapper, __assign({ normalStyle: __assign({}, effectCssProperties), hoveEffect: __assign({}, hoverEffect) }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, layout), { overflow: 'hidden' }), boxStyle.normal), { cursor: CLINKCursor }), hoverStyle: __assign({}, boxStyle.hover), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: (0, jsx_runtime_1.jsx)(S_Image, __assign({ src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, normalStyle: __assign({}, imgStyle.normal), hoverStyle: __assign({}, imgStyle.hover) }, { children: (0, jsx_runtime_1.jsx)("img", { src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, style: { visibility: 'hidden', width: '100%', height: '100%' } }) })) })) })) }))] }));
75
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_ImageWrapper, __assign({ style: __assign({}, effectCssProperties) }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, layout), { overflow: 'hidden' }), boxStyle.normal), { cursor: CLINKCursor }), hoverStyle: __assign({}, boxStyle.hover), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device, onClick: onClickCLINK }, { children: (0, jsx_runtime_1.jsx)(S_Image, __assign({ src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, normalStyle: __assign({}, imgStyle.normal), hoverStyle: __assign({}, imgStyle.hover) }, { children: (0, jsx_runtime_1.jsx)("img", { src: CB_CONTENT_PROP_IMAGE.CB_CONTENT_PROP_IMAGE_SPEC_SELECTOR, style: { visibility: 'hidden', width: '100%', height: '100%' } }) })) })) })) }))] }));
76
76
  }
77
77
  function parseImageCBStyle(style, hoverStyle, mode) {
78
78
  var boxStyle = {
@@ -113,32 +113,26 @@ function parseImageCBStyle(style, hoverStyle, mode) {
113
113
  };
114
114
  return { boxStyle: boxStyle, imgStyle: imgStyle };
115
115
  }
116
- var S_ImageWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"], ["\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"])), function (_a) {
117
- var normalStyle = _a.normalStyle;
118
- return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), __assign({}, normalStyle));
119
- }, function (_a) {
120
- var hoveEffect = _a.hoveEffect;
121
- return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), __assign({}, hoveEffect));
122
- });
123
- var S_Image = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n background-image: ", ";\n background-repeat: no-repeat;\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n\n & img {\n ", ";\n }\n\n &:hover img {\n ", ";\n }\n"], ["\n background-image: ", ";\n background-repeat: no-repeat;\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n\n & img {\n ", ";\n }\n\n &:hover img {\n ", ";\n }\n"])), function (_a) {
116
+ var S_ImageWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 100%;\n width: 100%;\n"], ["\n height: 100%;\n width: 100%;\n"])));
117
+ var S_Image = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-image: ", ";\n background-repeat: no-repeat;\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n\n & img {\n ", ";\n }\n\n &:hover img {\n ", ";\n }\n"], ["\n background-image: ", ";\n background-repeat: no-repeat;\n height: 100%;\n width: 100%;\n\n ", ";\n\n &:hover {\n ", ";\n }\n\n & img {\n ", ";\n }\n\n &:hover img {\n ", ";\n }\n"])), function (_a) {
124
118
  var src = _a.src;
125
119
  return "url(".concat(src, ")");
126
120
  }, function (_a) {
127
121
  var normalStyle = _a.normalStyle;
128
- return (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), __assign(__assign({}, normalStyle), { backgroundPosition: normalStyle.backgroundPosition }));
122
+ return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), __assign(__assign({}, normalStyle), { backgroundPosition: normalStyle.backgroundPosition }));
129
123
  }, function (_a) {
130
124
  var hoverStyle = _a.hoverStyle;
131
- return (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), __assign(__assign({}, hoverStyle), { backgroundPosition: hoverStyle.backgroundPosition }));
125
+ return (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), __assign(__assign({}, hoverStyle), { backgroundPosition: hoverStyle.backgroundPosition }));
132
126
  }, function (_a) {
133
127
  var normalStyle = _a.normalStyle;
134
128
  var isContain = normalStyle.backgroundSize === 'contain';
135
- return (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n object-fit: ", ";\n "], ["\n object-fit: ", ";\n "])), isContain ? 'contain' : 'cover');
129
+ return (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n object-fit: ", ";\n "], ["\n object-fit: ", ";\n "])), isContain ? 'contain' : 'cover');
136
130
  }, function (_a) {
137
131
  var hoverStyle = _a.hoverStyle, normalStyle = _a.normalStyle;
138
132
  var isContain = hoverStyle.backgroundSize
139
133
  ? hoverStyle.backgroundSize === 'contain'
140
134
  : normalStyle.backgroundSize === 'contain';
141
- return (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n object-fit: ", ";\n "], ["\n object-fit: ", ";\n "])), isContain ? 'contain' : 'cover');
135
+ return (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n object-fit: ", ";\n "], ["\n object-fit: ", ";\n "])), isContain ? 'contain' : 'cover');
142
136
  });
143
137
  exports.default = Image;
144
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
138
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/RichText/RichText.js CHANGED
@@ -33,7 +33,7 @@ var S_HiddenCover_1 = require("../components/S_HiddenCover");
33
33
  function RichText(props) {
34
34
  var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
35
35
  var CB_STYLE_PROP_BGCOLOR = props.CB_STYLE_PROP_BGCOLOR, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
36
- var _b = (0, util_1.parseProperties)(props, device), propsStyle = _b.style, propsHoverStyle = _b.hoverStyle, layoutStyle = _b.layout, effect = _b.effect, hoverEffect = _b.hoverEffect;
36
+ var _b = (0, util_1.parseProperties)(props, device), propsStyle = _b.style, propsHoverStyle = _b.hoverStyle, layoutStyle = _b.layout, effect = _b.effect;
37
37
  var _c = getBGColorStyles(CB_STYLE_PROP_BGCOLOR, device), bgColorStyle = _c.style, bgColorHoverStyle = _c.hoverStyle;
38
38
  var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
39
39
  if (mode === 'EDIT') {
@@ -48,7 +48,7 @@ function RichText(props) {
48
48
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
49
49
  var hasEffect = !isNoneEffectType;
50
50
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
51
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign(__assign({}, propsHoverStyle), bgColorHoverStyle), hoverEffect), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(S_RichTextWrapper, { children: (0, jsx_runtime_1.jsx)(RichText_1.RichText, { text: props.CB_CONTENT_PROP_TEXTEDIT.CB_CONTENT_PROP_TEXTEDIT_SPEC_EDITOR }) }) })) }))] }));
51
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign({}, propsHoverStyle), bgColorHoverStyle), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(S_RichTextWrapper, { children: (0, jsx_runtime_1.jsx)(RichText_1.RichText, { text: props.CB_CONTENT_PROP_TEXTEDIT.CB_CONTENT_PROP_TEXTEDIT_SPEC_EDITOR }) }) })) }))] }));
52
52
  }
53
53
  function getBGColorStyles(props, device) {
54
54
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Text/Text.js CHANGED
@@ -37,7 +37,7 @@ function Text(props) {
37
37
  internalSrc: String(CB_CONTENT_PROP_CLINK_SPEC_INTERNALSRC)
38
38
  }), CLINKCursor = _c.CLINKCursor, onClickCLINK = _c.onClickCLINK;
39
39
  var _d = getTextStyles(props.CB_STYLE_PROP_TEXT, device), textStyle = _d.style, textHoverStyle = _d.hoverStyle;
40
- var _e = (0, util_1.parseProperties)(props, device), propsStyle = _e.style, propsHoverStyle = _e.hoverStyle, layoutStyle = _e.layout, effect = _e.effect, hoverEffect = _e.hoverEffect;
40
+ var _e = (0, util_1.parseProperties)(props, device), propsStyle = _e.style, propsHoverStyle = _e.hoverStyle, layoutStyle = _e.layout, effect = _e.effect;
41
41
  var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
42
42
  var googleFonts = (0, getGoogleFonts_1.getGoogleFontsFromTextCB)(props.CB_STYLE_PROP_TEXT, device === 'MOBILE');
43
43
  (0, useGoogleFonts_1.default)({ fonts: googleFonts });
@@ -53,7 +53,7 @@ function Text(props) {
53
53
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
54
54
  var hasEffect = !isNoneEffectType;
55
55
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
56
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), hoverEffect), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
56
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_Box_1.S_CB_Box, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, textStyle), propsStyle), layoutStyle), effectCssProperties), { whiteSpace: 'pre-wrap', wordBreak: 'break-word', cursor: CLINKCursor }), hoverStyle: __assign(__assign(__assign({}, textHoverStyle), propsHoverStyle), { whiteSpace: 'pre-wrap', wordBreak: 'break-word' }), onClick: onClickCLINK }, { children: props.CB_CONTENT_PROP_TEXT.CB_CONTENT_PROP_TEXT_SPEC_TEXT })) }))] }));
57
57
  }
58
58
  function getTextStyles(props, device) {
59
59
  var availableSpecCodes = [
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Twitter/Twitter.js CHANGED
@@ -24,7 +24,7 @@ function Twitter(props) {
24
24
  var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
25
25
  var CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
26
26
  var CB_CONTENT_PROP_TWITTER_SPEC_SRC = props.CB_CONTENT_PROP_TWITTER.CB_CONTENT_PROP_TWITTER_SPEC_SRC, CB_STYLE_PROP_TWITTER_SPEC_THEME = props.CB_STYLE_PROP_TWITTER.CB_STYLE_PROP_TWITTER_SPEC_THEME, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW;
27
- var _b = (0, util_1.parseProperties)(props, device), style = _b.style, hoverStyle = _b.hoverStyle, layout = _b.layout, effect = _b.effect, hoverEffect = _b.hoverEffect;
27
+ var _b = (0, util_1.parseProperties)(props, device), style = _b.style, hoverStyle = _b.hoverStyle, layout = _b.layout, effect = _b.effect;
28
28
  var userId = CB_CONTENT_PROP_TWITTER_SPEC_SRC.replace('https://twitter.com/', '');
29
29
  var theme = CB_STYLE_PROP_TWITTER_SPEC_THEME.toLowerCase();
30
30
  if ('display' in layout) {
@@ -47,6 +47,6 @@ function Twitter(props) {
47
47
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
48
48
  var hasEffect = !isNoneEffectType;
49
49
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
50
- return ((0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), { overflowY: 'auto' }), editModeStyle), hoverStyle: __assign(__assign({}, hoverStyle), hoverEffect), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(ComponentBlocks_1.TwitterTimeline, { userId: userId, theme: theme }, twitterTimelineKey) })) })));
50
+ return ((0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign(__assign({}, style), layout), effectCssProperties), { overflowY: 'auto' }), editModeStyle), hoverStyle: hoverStyle, cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: (0, jsx_runtime_1.jsx)(ComponentBlocks_1.TwitterTimeline, { userId: userId, theme: theme }, twitterTimelineKey) })) })));
51
51
  }
52
52
  exports.default = Twitter;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Youtube/Youtube.js CHANGED
@@ -24,18 +24,19 @@ var DynamicLayout_1 = require("../../../../../../../DynamicLayout");
24
24
  var hooks_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/hooks");
25
25
  var colorUtil_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/newUtils/colorUtil");
26
26
  var util_1 = require("../../../../../../../DynamicLayout/sections/CustomSection/util");
27
+ var utils_1 = require("../../../../../../../DynamicLayout/utils");
27
28
  var styled_components_1 = __importDefault(require("styled-components"));
28
29
  var S_CB_AnimationObserverBox_1 = require("../components/S_CB_AnimationObserverBox");
29
30
  var S_CB_BoxWithShadow_1 = require("../components/S_CB_BoxWithShadow");
30
31
  var S_HiddenCover_1 = require("../components/S_HiddenCover");
31
32
  var parseYoutubeContentProp_1 = __importDefault(require("./parseYoutubeContentProp"));
32
33
  function Youtube(props) {
33
- var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode;
34
+ var _a = (0, react_1.useContext)(DynamicLayout_1.dynamicLayoutContext), device = _a.device, mode = _a.mode, youtubeAutoplayMode = _a.youtubeAutoplayMode;
34
35
  var CB_CONTENT_PROP_YOUTUBE = props.CB_CONTENT_PROP_YOUTUBE, CB_STYLE_PROP_BGCOLOR = props.CB_STYLE_PROP_BGCOLOR, CB_STYLE_PROP_SHADOW = props.CB_STYLE_PROP_SHADOW, CB_EFFECT_PROP_ENTANIM = props.CB_EFFECT_PROP_ENTANIM;
35
36
  var _b = (0, parseYoutubeContentProp_1.default)(CB_CONTENT_PROP_YOUTUBE), youtubeSrc = _b.youtubeSrc, thumbnailSrc = _b.thumbnailSrc, id = _b.id;
36
37
  var isEditMode = mode === 'EDIT';
37
38
  var _c = getBGColorStyles(CB_STYLE_PROP_BGCOLOR, device), bgColorStyle = _c.style, bgColorHoverStyle = _c.hoverStyle;
38
- var _d = (0, util_1.parseProperties)(props, device), propsStyle = _d.style, propsHoverStyle = _d.hoverStyle, layoutStyle = _d.layout, effect = _d.effect, hoverEffect = _d.hoverEffect;
39
+ var _d = (0, util_1.parseProperties)(props, device), propsStyle = _d.style, propsHoverStyle = _d.hoverStyle, layoutStyle = _d.layout, effect = _d.effect;
39
40
  var isEditModeAndHidden = propsStyle.visibility === 'hidden' && mode === 'EDIT';
40
41
  if (mode === 'EDIT') {
41
42
  propsStyle.visibility = 'visible';
@@ -49,7 +50,13 @@ function Youtube(props) {
49
50
  : CB_EFFECT_PROP_ENTANIM['CB_EFFECT_PROP_ENTANIM_SPEC_TYPE:MOBILE'] === 'NONE';
50
51
  var hasEffect = !isNoneEffectType;
51
52
  var effectVisibleStyle = hasEffect ? { opacity: isVisible ? 1 : 0 } : {};
52
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign(__assign({}, propsHoverStyle), bgColorHoverStyle), hoverEffect), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: isEditMode ? ((0, jsx_runtime_1.jsxs)(S_ThumbnailBox, { children: [(0, jsx_runtime_1.jsx)(YoutubeButton, {}), (0, jsx_runtime_1.jsx)(S_Thumbnail, { src: thumbnailSrc })] })) : ((0, jsx_runtime_1.jsx)(S_Iframe, { title: id, src: youtubeSrc, allow: "accelerometer; encrypted-media; gyroscope; picture-in-picture" })) })) }))] }));
53
+ var autoplayEntry = (0, hooks_1.useIntersectionObserver)(cbRef, {
54
+ freezeOnceVisible: true
55
+ });
56
+ var shouldAutoPlay = youtubeAutoplayMode === 'ALWAYS' ||
57
+ (youtubeAutoplayMode === 'VIEWPORT' && isVisible) ||
58
+ (youtubeAutoplayMode === 'VIEWPORT-FREEZE' && (autoplayEntry === null || autoplayEntry === void 0 ? void 0 : autoplayEntry.isIntersecting));
59
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isEditModeAndHidden && (0, jsx_runtime_1.jsx)(S_HiddenCover_1.S_HiddenCover, {}), (0, jsx_runtime_1.jsx)(S_CB_AnimationObserverBox_1.S_CB_AnimationObserverBox, __assign({ ref: hasEffect ? cbRef : null, effectVisibleStyle: effectVisibleStyle }, { children: (0, jsx_runtime_1.jsx)(S_CB_BoxWithShadow_1.S_CB_BoxWithShadow, __assign({ className: "cb-layout-box", normalStyle: __assign(__assign(__assign(__assign({}, propsStyle), layoutStyle), effectCssProperties), bgColorStyle), hoverStyle: __assign(__assign({}, propsHoverStyle), bgColorHoverStyle), cbStylePropsShadowSpecs: CB_STYLE_PROP_SHADOW, device: device }, { children: isEditMode ? ((0, jsx_runtime_1.jsxs)(S_ThumbnailBox, { children: [(0, jsx_runtime_1.jsx)(YoutubeButton, {}), (0, jsx_runtime_1.jsx)(S_Thumbnail, { src: thumbnailSrc })] })) : ((0, jsx_runtime_1.jsx)(S_Iframe, { title: id, src: shouldAutoPlay ? getAutoplaySrc(youtubeSrc) : youtubeSrc, allow: "accelerometer; encrypted-media; gyroscope; picture-in-picture" })) })) }))] }));
53
60
  }
54
61
  function getBGColorStyles(props, device) {
55
62
  var availableSpecCodes = [
@@ -71,5 +78,22 @@ var S_YoutubeButton = styled_components_1.default.div(templateObject_4 || (templ
71
78
  function YoutubeButton() {
72
79
  return ((0, jsx_runtime_1.jsx)(S_YoutubeButton, { children: (0, jsx_runtime_1.jsxs)("svg", __assign({ height: "100%", version: "1.1", viewBox: "0 0 68 48", width: "100%" }, { children: [(0, jsx_runtime_1.jsx)("path", { className: "ytp-large-play-button-bg", d: "M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z", fill: "#f00" }), (0, jsx_runtime_1.jsx)("path", { d: "M 45,24 27,14 27,34", fill: "#fff" })] })) }));
73
80
  }
81
+ function getAutoplaySrc(youtubeSrc) {
82
+ try {
83
+ var url = new URL(youtubeSrc);
84
+ if (url.hostname.includes('youtube.com') || url.hostname.includes('youtu.be')) {
85
+ var id = utils_1.YouTubeLinkParser.getId(youtubeSrc);
86
+ url.searchParams.set('autoplay', '1');
87
+ url.searchParams.set('mute', '1');
88
+ url.searchParams.set('loop', '1');
89
+ url.searchParams.set('playlist', "".concat(id));
90
+ return url.href;
91
+ }
92
+ return 'Invalid YouTube URL';
93
+ }
94
+ catch (error) {
95
+ return 'Invalid URL';
96
+ }
97
+ }
74
98
  exports.default = Youtube;
75
99
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { NamedEffectPropType } from './types';
2
- import type { Device, StyleAndHoverStyle } from '../types';
3
- export declare function parseEffectProperties(namedProps: NamedEffectPropType, device: Device): Partial<StyleAndHoverStyle>;
2
+ import type { Device, StyleType } from '../types';
3
+ export declare function parseEffectProperties(namedProps: NamedEffectPropType, device: Device): StyleType;
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/index.js CHANGED
@@ -5,15 +5,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.parseEffectProperties = void 0;
7
7
  var parseEffectPropEntAnim_1 = __importDefault(require("./parseEffectPropEntAnim"));
8
- var parseEffectPropHoverAnim_1 = __importDefault(require("./parseEffectPropHoverAnim"));
9
8
  var types_1 = require("./types");
10
9
  function parseEffectProperties(namedProps, device) {
11
10
  var name = namedProps.name;
12
11
  switch (name) {
13
12
  case types_1.CB_EFFECT_PROP_KEYS.CB_EFFECT_PROP_ENTANIM:
14
13
  return (0, parseEffectPropEntAnim_1.default)(namedProps, device);
15
- case types_1.CB_EFFECT_PROP_KEYS.CB_EFFECT_PROP_HOVERANIM:
16
- return (0, parseEffectPropHoverAnim_1.default)(namedProps, device);
17
14
  }
18
15
  }
19
16
  exports.parseEffectProperties = parseEffectProperties;
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/types.d.ts CHANGED
@@ -1,7 +1,5 @@
1
1
  import type { NAMED_CB_EFFECT_ENTANIM_PROPS } from './parseEffectPropEntAnim';
2
- import type { NAMED_CB_EFFECT_HOVERANIM_PROPS } from './parseEffectPropHoverAnim';
3
2
  export declare enum CB_EFFECT_PROP_KEYS {
4
- CB_EFFECT_PROP_ENTANIM = "CB_EFFECT_PROP_ENTANIM",
5
- CB_EFFECT_PROP_HOVERANIM = "CB_EFFECT_PROP_HOVERANIM"
3
+ CB_EFFECT_PROP_ENTANIM = "CB_EFFECT_PROP_ENTANIM"
6
4
  }
7
- export type NamedEffectPropType = NAMED_CB_EFFECT_ENTANIM_PROPS | NAMED_CB_EFFECT_HOVERANIM_PROPS;
5
+ export type NamedEffectPropType = NAMED_CB_EFFECT_ENTANIM_PROPS;
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/types.js CHANGED
@@ -4,5 +4,4 @@ exports.CB_EFFECT_PROP_KEYS = void 0;
4
4
  var CB_EFFECT_PROP_KEYS;
5
5
  (function (CB_EFFECT_PROP_KEYS) {
6
6
  CB_EFFECT_PROP_KEYS["CB_EFFECT_PROP_ENTANIM"] = "CB_EFFECT_PROP_ENTANIM";
7
- CB_EFFECT_PROP_KEYS["CB_EFFECT_PROP_HOVERANIM"] = "CB_EFFECT_PROP_HOVERANIM";
8
7
  })(CB_EFFECT_PROP_KEYS = exports.CB_EFFECT_PROP_KEYS || (exports.CB_EFFECT_PROP_KEYS = {}));
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/parseProperties.js CHANGED
@@ -39,8 +39,8 @@ function parseProperties(properties, device) {
39
39
  return __assign(__assign({}, acc), { style: __assign(__assign({}, acc.style), style) });
40
40
  }
41
41
  if (normalizedProperty.name in types_2.CB_EFFECT_PROP_KEYS) {
42
- var _b = (0, effectPropParsers_1.parseEffectProperties)(normalizedProperty, device), style = _b.style, hoverStyle = _b.hoverStyle;
43
- return __assign(__assign({}, acc), { effect: __assign(__assign({}, acc.effect), style), hoverEffect: __assign(__assign({}, acc.hoverEffect), hoverStyle) });
42
+ var style = (0, effectPropParsers_1.parseEffectProperties)(normalizedProperty, device).style;
43
+ return __assign(__assign({}, acc), { effect: __assign(__assign({}, acc.effect), style) });
44
44
  }
45
45
  return acc;
46
46
  }, {
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/types.d.ts CHANGED
@@ -115,11 +115,9 @@ export type CB_YOUTUBE_PROPERTIES_TYPE = CB_GENERAL_PROPERTIES_TYPE & {
115
115
  export type StyleType = {
116
116
  style: CSSProperties;
117
117
  };
118
- export type HoverStyle = {
118
+ export type StyleAndHoverStyle = StyleType & {
119
119
  hoverStyle: CSSProperties;
120
120
  };
121
- export type StyleAndHoverStyle = StyleType & HoverStyle;
122
- export type StyleOrHoverStyle = StyleType | HoverStyle;
123
121
  export type OverlayStyle = {
124
122
  overlayStyle: CSSProperties;
125
123
  };
@@ -130,7 +128,6 @@ export type ParserResult = {
130
128
  hoverStyle: CSSProperties;
131
129
  layout: CSSProperties;
132
130
  effect: CSSProperties;
133
- hoverEffect?: CSSProperties;
134
131
  content: Record<string, unknown>;
135
132
  };
136
133
  export type JsonPropertiesParserResult = Omit<ParserResult, 'hoverStyle'> & OverlayStyle;
package/dist/src/sub/DynamicLayout/types.d.ts CHANGED
@@ -224,6 +224,7 @@ export type DynamicLayoutProps = {
224
224
  sectionActionHandler?: (action: TypeOfSectionAction) => void;
225
225
  programmedSectionComponents?: IProgrammedSectionComponents;
226
226
  width?: number;
227
+ youtubeAutoplayMode?: 'ALWAYS' | 'VIEWPORT-FREEZE' | 'VIEWPORT';
227
228
  };
228
229
  export type NavHandlerAction = {
229
230
  openNewTab: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "0.3.8",
3
+ "version": "0.3.9",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # pds-dev-kit-web-test Release Notes
2
- ## [v0.3.8]
2
+ ## [v0.3.9]
3
3
  ## 기준 pds-dev-kit-web 버전 @2.2.34
4
4
  ### sub
5
5
  * DynamicLayout
6
- * hover effect 추가
6
+ * youtube CB autoplay mode 3가지 개발
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/parseEffectPropHoverAnim.d.ts DELETED
@@ -1,19 +0,0 @@
1
- import type { Device, HoverStyle } from '../types';
2
- import type { CB_EFFECT_PROP_KEYS } from './types';
3
- export type NAMED_CB_EFFECT_HOVERANIM_PROPS = {
4
- name: CB_EFFECT_PROP_KEYS.CB_EFFECT_PROP_HOVERANIM;
5
- specs: CB_EFFECT_PROP_HOVERANIM_SPECS;
6
- };
7
- export default function parseEffectPropHOVERANIM(namedProps: NAMED_CB_EFFECT_HOVERANIM_PROPS, device: Device): HoverStyle;
8
- export type CB_EFFECT_PROP_HOVERANIM_BASE = {
9
- CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION: number;
10
- CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT: number;
11
- CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC: string;
12
- CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE: string;
13
- };
14
- export type CB_EFFECT_PROP_HOVERANIM_SPECS = CB_EFFECT_PROP_HOVERANIM_BASE & Partial<{
15
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION:MOBILE': number | undefined;
16
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT:MOBILE': number | undefined;
17
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC:MOBILE': string | undefined;
18
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE:MOBILE': string | undefined;
19
- }>;
package/dist/src/sub/DynamicLayout/sections/CustomSection/util/effectPropParsers/parseEffectPropHoverAnim.js DELETED
@@ -1,51 +0,0 @@
1
- "use strict";
2
- var __assign = (this && this.__assign) || function () {
3
- __assign = Object.assign || function(t) {
4
- for (var s, i = 1, n = arguments.length; i < n; i++) {
5
- s = arguments[i];
6
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
- t[p] = s[p];
8
- }
9
- return t;
10
- };
11
- return __assign.apply(this, arguments);
12
- };
13
- Object.defineProperty(exports, "__esModule", { value: true });
14
- var constants_1 = require("./constants");
15
- function parseEffectPropHOVERANIM(namedProps, device) {
16
- var specs = namedProps.specs;
17
- var animationCssProperties = AVAILABLE_SPECS.reduce(function (acc, cur) {
18
- var _a;
19
- var baseKey = device === 'DESKTOP' ? cur : "".concat(cur, ":MOBILE");
20
- var value = specs[baseKey];
21
- return __assign(__assign({}, acc), (_a = {}, _a[cur] = value, _a));
22
- }, {});
23
- return { hoverStyle: { animation: valueGenerator(animationCssProperties) } };
24
- }
25
- exports.default = parseEffectPropHOVERANIM;
26
- function valueGenerator(valueSet) {
27
- var _a;
28
- var CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE = valueSet.CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE, CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION = valueSet.CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION, CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC = valueSet.CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC, CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT = valueSet.CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT;
29
- var animationName = (_a = constants_1.animations.find(function (animation) { return animation.name === CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE; })) === null || _a === void 0 ? void 0 : _a.value;
30
- return "".concat(animationName, " ").concat(CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION, "s ").concat(tFuncMatcher(CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC), " 0s ").concat(CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT === -1 ? 'infinite' : CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT);
31
- }
32
- function tFuncMatcher(type) {
33
- switch (type) {
34
- case 'EASEINOUT':
35
- return 'ease-in-out';
36
- case 'EASEIN':
37
- return 'ease-in';
38
- case 'EASEOUT':
39
- return 'ease-out';
40
- case 'NONE':
41
- return 'linear';
42
- default:
43
- return '';
44
- }
45
- }
46
- var AVAILABLE_SPECS = [
47
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_DURATION',
48
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_REPEAT',
49
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TFUNC',
50
- 'CB_EFFECT_PROP_HOVERANIM_SPEC_TYPE'
51
- ];