pds-dev-kit-web-test 2.5.411 → 2.5.413

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 (213) hide show
  1. package/dist/index.d.ts +2 -2
  2. package/dist/index.js +2 -3
  3. package/dist/src/common/assets/icons/fill/Video.js +1 -1
  4. package/dist/src/common/assets/icons/fill/VideoOff.js +1 -1
  5. package/dist/src/common/assets/icons/fill/VideoType.js +1 -1
  6. package/dist/src/common/assets/icons/fill/index.d.ts +0 -3
  7. package/dist/src/common/assets/icons/fill/index.js +1 -7
  8. package/dist/src/common/assets/icons/line/Video.js +1 -1
  9. package/dist/src/common/assets/icons/line/VideoOff.js +1 -1
  10. package/dist/src/common/assets/icons/line/VideoType.js +1 -1
  11. package/dist/src/common/assets/icons/line/index.d.ts +0 -12
  12. package/dist/src/common/assets/icons/line/index.js +1 -25
  13. package/dist/src/common/components/ThreeBarProgress/ThreeBarProgress.d.ts +1 -2
  14. package/dist/src/common/components/ThreeBarProgress/ThreeBarProgress.js +4 -48
  15. package/dist/src/common/services/i18n/resources/en.json +1 -9
  16. package/dist/src/common/services/i18n/resources/es.json +1 -9
  17. package/dist/src/common/services/i18n/resources/fil.json +1 -9
  18. package/dist/src/common/services/i18n/resources/index.d.ts +0 -56
  19. package/dist/src/common/services/i18n/resources/ja.json +1 -9
  20. package/dist/src/common/services/i18n/resources/ko.json +1 -9
  21. package/dist/src/common/services/i18n/resources/zh-cn.json +1 -9
  22. package/dist/src/common/services/i18n/resources/zh-tw.json +1 -9
  23. package/dist/src/common/styles/colorSet/PaletteColor_Dark.json +1 -9
  24. package/dist/src/common/styles/colorSet/PaletteColor_light.json +1 -9
  25. package/dist/src/common/styles/colorSet/UIColor.json +1 -14
  26. package/dist/src/common/styles/colorSet/index.d.ts +2 -31
  27. package/dist/src/common/styles/colorSet/index.js +2 -2
  28. package/dist/src/common/styles/colorSet/ui-type.d.ts +0 -13
  29. package/dist/src/desktop/components/AdminListItem/AdminListItem.d.ts +0 -1
  30. package/dist/src/desktop/components/AdminListItem/AdminListItem.js +13 -27
  31. package/dist/src/desktop/components/BasicListItem/BasicListItem.d.ts +1 -4
  32. package/dist/src/desktop/components/BasicListItem/BasicListItem.js +4 -26
  33. package/dist/src/desktop/components/BasicListItem/Contents.d.ts +1 -3
  34. package/dist/src/desktop/components/BasicListItem/Contents.js +2 -2
  35. package/dist/src/desktop/components/BasicListItem/RightBox/IconButton.d.ts +0 -1
  36. package/dist/src/desktop/components/BasicListItem/RightBox/IconButton.js +2 -2
  37. package/dist/src/desktop/components/Checkbox/Checkbox.d.ts +1 -3
  38. package/dist/src/desktop/components/Checkbox/Checkbox.js +3 -17
  39. package/dist/src/desktop/components/Chip/Chip.d.ts +1 -1
  40. package/dist/src/desktop/components/Chip/Chip.js +5 -50
  41. package/dist/src/desktop/components/Radio/Radio.js +2 -2
  42. package/dist/src/desktop/components/TextField/TextField.js +15 -41
  43. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTU.js +2 -2
  44. package/dist/src/mobile/components/BasicListItem/BasicListItem.d.ts +1 -4
  45. package/dist/src/mobile/components/BasicListItem/BasicListItem.js +4 -26
  46. package/dist/src/mobile/components/BasicListItem/Contents.d.ts +1 -3
  47. package/dist/src/mobile/components/BasicListItem/Contents.js +2 -2
  48. package/dist/src/mobile/components/BasicListItem/RightBox/IconButton.d.ts +0 -1
  49. package/dist/src/mobile/components/BasicListItem/RightBox/IconButton.js +2 -2
  50. package/dist/src/mobile/components/Checkbox/Checkbox.d.ts +1 -3
  51. package/dist/src/mobile/components/Checkbox/Checkbox.js +3 -17
  52. package/dist/src/mobile/components/Chip/Chip.d.ts +1 -1
  53. package/dist/src/mobile/components/Chip/Chip.js +5 -50
  54. package/dist/src/mobile/components/Radio/Radio.js +2 -2
  55. package/dist/src/mobile/components/TextField/TextField.js +15 -41
  56. package/dist/src/mobile/components/TextLabel/TextLabel.d.ts +1 -6
  57. package/dist/src/mobile/components/TextLabel/TextLabel.js +3 -83
  58. package/dist/src/mobile/components/index.d.ts +1 -2
  59. package/dist/src/mobile/components/index.js +1 -3
  60. package/dist/src/mobile/index.d.ts +1 -1
  61. package/dist/src/mobile/index.js +2 -3
  62. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFA.js +1 -1
  63. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFB.js +1 -1
  64. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFC.js +1 -1
  65. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFD.js +1 -1
  66. package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFE.js +1 -1
  67. package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMA.js +1 -1
  68. package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMB.js +1 -1
  69. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPA.js +1 -1
  70. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPB.js +1 -1
  71. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPC.js +1 -1
  72. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPD.js +1 -1
  73. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPE.js +1 -1
  74. package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPF.js +1 -1
  75. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSA.js +1 -1
  76. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSB.js +1 -1
  77. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSC.js +1 -1
  78. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSD.js +1 -1
  79. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSE.js +1 -1
  80. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSF.js +1 -1
  81. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSG.js +1 -1
  82. package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSH.js +1 -1
  83. package/dist/src/sub/AdminList/AdminListItem/AdminListItem.js +3 -3
  84. package/dist/src/sub/DynamicLayout/CompositionEditor/CompositionEditor.d.ts +1 -1
  85. package/dist/src/sub/DynamicLayout/CompositionEditor/CompositionEditor.js +4 -4
  86. package/dist/src/sub/DynamicLayout/CompositionRenderer/Composition.d.ts +1 -1
  87. package/dist/src/sub/DynamicLayout/CompositionRenderer/Composition.js +2 -2
  88. package/dist/src/sub/DynamicLayout/CompositionRenderer/createCompositions.d.ts +2 -2
  89. package/dist/src/sub/DynamicLayout/CompositionRenderer/createCompositions.js +10 -36
  90. package/dist/src/sub/DynamicLayout/components/EditModeSectionMatcher/SectionBox.js +1 -4
  91. package/dist/src/sub/DynamicLayout/components/Section/components/CustomSectionBackgroundMedia.js +1 -12
  92. package/dist/src/sub/DynamicLayout/components/Section/util/parseSectionBackgroundMediaData.js +1 -3
  93. package/dist/src/sub/DynamicLayout/components/pdsOriginal/common/styles/colorSet/PaletteColor_Dark.json +4 -152
  94. package/dist/src/sub/DynamicLayout/components/pdsOriginal/common/styles/colorSet/PaletteColor_light.json +2 -150
  95. package/dist/src/sub/DynamicLayout/components/pdsOriginal/common/styles/colorSet/SemanticColor.json +1 -45
  96. package/dist/src/sub/DynamicLayout/components/pdsOriginal/common/styles/colorSet/UIColor.json +9 -262
  97. package/dist/src/sub/DynamicLayout/components/pdsOriginal/common/styles/colorSet/index.d.ts +0 -593
  98. package/dist/src/sub/DynamicLayout/components/pdsOriginal/common/styles/colorSet/ui-type.d.ts +0 -253
  99. package/dist/src/sub/DynamicLayout/compositionActionTypes.d.ts +4 -4
  100. package/dist/src/sub/DynamicLayout/mock_composition.js +0 -4
  101. package/dist/src/sub/DynamicLayout/mock_contentsCarousel.d.ts +2 -1
  102. package/dist/src/sub/DynamicLayout/mock_contentsCarousel.js +274 -1047
  103. package/dist/src/sub/DynamicLayout/mock_contentsList.d.ts +2 -1
  104. package/dist/src/sub/DynamicLayout/mock_contentsList.js +222 -1008
  105. package/dist/src/sub/DynamicLayout/mock_slideBanner.d.ts +2 -810
  106. package/dist/src/sub/DynamicLayout/mock_slideBanner.js +268 -772
  107. package/dist/src/sub/DynamicLayout/mocks.d.ts +776 -2
  108. package/dist/src/sub/DynamicLayout/mocks.js +11 -4266
  109. package/dist/src/sub/DynamicLayout/sectionActionTypes.d.ts +4 -4
  110. package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.d.ts +1 -1
  111. package/dist/src/sub/DynamicLayout/sections/CustomSection/CustomSection.js +4 -4
  112. package/dist/src/sub/DynamicLayout/sections/CustomSection/FlexGridItem.js +15 -11
  113. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/ComponentBlockMatcher.js +0 -3
  114. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Button/Button.js +4 -25
  115. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.js +26 -102
  116. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarouselCore.js +1 -21
  117. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigation.js +96 -16
  118. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomPagination.d.ts +2 -7
  119. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomPagination.js +20 -26
  120. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomProgressbar.js +23 -46
  121. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/contentsCarouselUtils.js +98 -84
  122. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/types.d.ts +6 -6
  123. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/ContentsList.js +20 -32
  124. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/components/CustomPagination.d.ts +3 -3
  125. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/components/CustomPagination.js +132 -59
  126. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/contentsListUtils.js +30 -24
  127. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/types.d.ts +1 -1
  128. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Image/Image.js +5 -13
  129. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/SlideBanner.js +13 -88
  130. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomNavigation.js +96 -16
  131. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomPagination.d.ts +2 -7
  132. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomPagination.js +20 -26
  133. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomProgressbar.js +23 -46
  134. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/slideBannerUtils.js +67 -64
  135. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/types.d.ts +6 -6
  136. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/Text/Text.js +4 -10
  137. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/types.d.ts +7 -16
  138. package/dist/src/sub/DynamicLayout/sections/CustomSection/newUtils/group.d.ts +1 -1
  139. package/dist/src/sub/DynamicLayout/sections/CustomSection/types.d.ts +4 -11
  140. package/dist/src/sub/DynamicLayout/sections/CustomSection/types.js +0 -1
  141. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/parsePlacement.d.ts +1 -1
  142. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/parsePlacement.js +2 -2
  143. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/parseProperties.d.ts +2 -2
  144. package/dist/src/sub/DynamicLayout/sections/CustomSection/util/types.d.ts +2 -15
  145. package/dist/src/sub/DynamicLayout/sections/FlexGridCustomSection.d.ts +1 -1
  146. package/dist/src/sub/DynamicLayout/sections/FlexGridCustomSection.js +1 -1
  147. package/dist/src/sub/DynamicLayout/types.d.ts +1 -10
  148. package/package.json +3 -2
  149. package/release-note.md +3 -3
  150. package/dist/src/common/assets/icons/fill/Cam.d.ts +0 -4
  151. package/dist/src/common/assets/icons/fill/Cam.js +0 -30
  152. package/dist/src/common/assets/icons/fill/CamOff.d.ts +0 -4
  153. package/dist/src/common/assets/icons/fill/CamOff.js +0 -30
  154. package/dist/src/common/assets/icons/fill/VideoStop.d.ts +0 -4
  155. package/dist/src/common/assets/icons/fill/VideoStop.js +0 -30
  156. package/dist/src/common/assets/icons/line/Cam.d.ts +0 -4
  157. package/dist/src/common/assets/icons/line/Cam.js +0 -30
  158. package/dist/src/common/assets/icons/line/CamOff.d.ts +0 -4
  159. package/dist/src/common/assets/icons/line/CamOff.js +0 -30
  160. package/dist/src/common/assets/icons/line/CheckBox.d.ts +0 -4
  161. package/dist/src/common/assets/icons/line/CheckBox.js +0 -30
  162. package/dist/src/common/assets/icons/line/Dropdown.d.ts +0 -4
  163. package/dist/src/common/assets/icons/line/Dropdown.js +0 -30
  164. package/dist/src/common/assets/icons/line/Radio.d.ts +0 -4
  165. package/dist/src/common/assets/icons/line/Radio.js +0 -30
  166. package/dist/src/common/assets/icons/line/SectionQuestion32.d.ts +0 -4
  167. package/dist/src/common/assets/icons/line/SectionQuestion32.js +0 -30
  168. package/dist/src/common/assets/icons/line/SectionQuestion40.d.ts +0 -4
  169. package/dist/src/common/assets/icons/line/SectionQuestion40.js +0 -30
  170. package/dist/src/common/assets/icons/line/SectionQuestionnaire32.d.ts +0 -4
  171. package/dist/src/common/assets/icons/line/SectionQuestionnaire32.js +0 -30
  172. package/dist/src/common/assets/icons/line/SectionQuestionnaire40.d.ts +0 -4
  173. package/dist/src/common/assets/icons/line/SectionQuestionnaire40.js +0 -30
  174. package/dist/src/common/assets/icons/line/TextLong.d.ts +0 -4
  175. package/dist/src/common/assets/icons/line/TextLong.js +0 -30
  176. package/dist/src/common/assets/icons/line/TextShort.d.ts +0 -4
  177. package/dist/src/common/assets/icons/line/TextShort.js +0 -30
  178. package/dist/src/common/assets/icons/line/VideoStop.d.ts +0 -4
  179. package/dist/src/common/assets/icons/line/VideoStop.js +0 -30
  180. package/dist/src/common/utils/dateHelper.d.ts +0 -13
  181. package/dist/src/common/utils/dateHelper.js +0 -87
  182. package/dist/src/mobile/components/DatePicker/DatePicker.d.ts +0 -16
  183. package/dist/src/mobile/components/DatePicker/DatePicker.js +0 -156
  184. package/dist/src/mobile/components/DatePicker/DatePickerHeader.d.ts +0 -14
  185. package/dist/src/mobile/components/DatePicker/DatePickerHeader.js +0 -27
  186. package/dist/src/mobile/components/DatePicker/Day.d.ts +0 -13
  187. package/dist/src/mobile/components/DatePicker/Day.js +0 -94
  188. package/dist/src/mobile/components/DatePicker/index.d.ts +0 -1
  189. package/dist/src/mobile/components/DatePicker/index.js +0 -8
  190. package/dist/src/mobile/components/DatePicker/utils.d.ts +0 -16
  191. package/dist/src/mobile/components/DatePicker/utils.js +0 -68
  192. package/dist/src/sub/DynamicLayout/components/Section/components/VideoBGMedia.d.ts +0 -8
  193. package/dist/src/sub/DynamicLayout/components/Section/components/VideoBGMedia.js +0 -77
  194. package/dist/src/sub/DynamicLayout/mock_video.d.ts +0 -368
  195. package/dist/src/sub/DynamicLayout/mock_video.js +0 -371
  196. package/dist/src/sub/DynamicLayout/mock_video_cb.d.ts +0 -368
  197. package/dist/src/sub/DynamicLayout/mock_video_cb.js +0 -371
  198. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/navigationConfigs.d.ts +0 -3
  199. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/navigationConfigs.js +0 -209
  200. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/progressConfigs.d.ts +0 -27
  201. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/progressConfigs.js +0 -96
  202. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/components/paginationConfigs.d.ts +0 -23
  203. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/components/paginationConfigs.js +0 -176
  204. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/navigationConfigs.d.ts +0 -3
  205. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/navigationConfigs.js +0 -209
  206. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.d.ts +0 -27
  207. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.js +0 -96
  208. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/VideoPlayer.d.ts +0 -5
  209. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/VideoPlayer.js +0 -148
  210. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/helper.d.ts +0 -4
  211. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/helper.js +0 -25
  212. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/index.d.ts +0 -1
  213. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/VideoPlayer/index.js +0 -8
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MPE = function (_a) {
45
45
  var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
46
- return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE" }, { children: content1 })) }))) })));
46
+ return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE" }, { children: content1 })) }))) })));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MPF = function (_a) {
45
45
  var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey;
46
- return ((0, jsx_runtime_1.jsxs)(S_Box, { children: [(0, jsx_runtime_1.jsx)(S_ContentsContainer1, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType }, { children: content1 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer2, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, containerColor: containerColor, overrideContainer2ColorKey: overrideContainer2ColorKey }, { children: isLoadingContainer2 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content2, __assign({ "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType }, { children: content2 })) }))) }))] }));
46
+ return ((0, jsx_runtime_1.jsxs)(S_Box, { children: [(0, jsx_runtime_1.jsx)(S_ContentsContainer1, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType }, { children: content1 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer2, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, containerColor: containerColor, overrideContainer2ColorKey: overrideContainer2ColorKey }, { children: isLoadingContainer2 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content2, __assign({ "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType }, { children: content2 })) }))) }))] }));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MSA = function (_a) {
45
45
  var content1 = _a.content1, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, container1Ref = _a.container1Ref;
46
- return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey, ref: container1Ref }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA" }, { children: content1 })) }))) })));
46
+ return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey, ref: container1Ref }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA" }, { children: content1 })) }))) })));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MSB = function (_a) {
45
45
  var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
46
- return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB" }, { children: content1 })) }))) })));
46
+ return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB" }, { children: content1 })) }))) })));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MSC = function (_a) {
45
45
  var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey;
46
- return ((0, jsx_runtime_1.jsxs)(S_Box, { children: [(0, jsx_runtime_1.jsx)(S_ContentsContainer1, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType }, { children: content1 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer2, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, containerColor: containerColor, overrideContainer2ColorKey: overrideContainer2ColorKey }, { children: isLoadingContainer2 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content2, __assign({ "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType }, { children: content2 })) }))) }))] }));
46
+ return ((0, jsx_runtime_1.jsxs)(S_Box, { children: [(0, jsx_runtime_1.jsx)(S_ContentsContainer1, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType }, { children: content1 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer2, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, containerColor: containerColor, overrideContainer2ColorKey: overrideContainer2ColorKey }, { children: isLoadingContainer2 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content2, __assign({ "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType }, { children: content2 })) }))) }))] }));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MSD = function (_a) {
45
45
  var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
46
- return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD" }, { children: content1 })) }))) })));
46
+ return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD" }, { children: content1 })) }))) })));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MSE = function (_a) {
45
45
  var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
46
- return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE" }, { children: content1 })) }))) })));
46
+ return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE" }, { children: content1 })) }))) })));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MSF = function (_a) {
45
45
  var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2, overrideContainer1ColorKey = _a.overrideContainer1ColorKey, overrideContainer2ColorKey = _a.overrideContainer2ColorKey;
46
- return ((0, jsx_runtime_1.jsxs)(S_Box, { children: [(0, jsx_runtime_1.jsx)(S_ContentsContainer1, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType }, { children: content1 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer2, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, containerColor: containerColor, overrideContainer2ColorKey: overrideContainer2ColorKey }, { children: isLoadingContainer2 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content2, __assign({ "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType }, { children: content2 })) }))) }))] }));
46
+ return ((0, jsx_runtime_1.jsxs)(S_Box, { children: [(0, jsx_runtime_1.jsx)(S_ContentsContainer1, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea1, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType }, { children: content1 })) }))) })), (0, jsx_runtime_1.jsx)(S_ContentsContainer2, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, containerColor: containerColor, overrideContainer2ColorKey: overrideContainer2ColorKey }, { children: isLoadingContainer2 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea2, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content2, __assign({ "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType }, { children: content2 })) }))) }))] }));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MSG = function (_a) {
45
45
  var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
46
- return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG" }, { children: content1 })) }))) })));
46
+ return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG" }, { children: content1 })) }))) })));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -43,7 +43,7 @@ var styled_components_1 = __importStar(require("styled-components"));
43
43
  var components_1 = require("../../../../../../common/components");
44
44
  var MSH = function (_a) {
45
45
  var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
46
- return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, { size: "small" })) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH" }, { children: content1 })) }))) })));
46
+ return ((0, jsx_runtime_1.jsx)(S_ContentsContainer, __assign({ "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH", containerColor: containerColor, overrideContainer1ColorKey: overrideContainer1ColorKey }, { children: isLoadingContainer1 ? ((0, jsx_runtime_1.jsx)(components_1.ThreeBarProgress, {})) : ((0, jsx_runtime_1.jsx)(S_ContentsArea, __assign({ "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH", areaColor: areaColor }, { children: (0, jsx_runtime_1.jsx)(S_Content1, __assign({ "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH" }, { children: content1 })) }))) })));
47
47
  };
48
48
  var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
49
49
  var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
@@ -171,11 +171,11 @@ var hoverQuickActionBtnBox = (0, styled_components_1.css)(templateObject_10 || (
171
171
  var theme = _a.theme;
172
172
  return theme.ui_cpnt_datatable_textbutton_base_02;
173
173
  });
174
- var fixedQuickActionBtnBox = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: flex;\n position: relative;\n"], ["\n align-items: center;\n background-color: ", ";\n display: flex;\n position: relative;\n"])), function (_a) {
174
+ var fixedQuickActionBtnBox = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: flex;\n visibility: hidden;\n"], ["\n align-items: center;\n background-color: ", ";\n display: flex;\n visibility: hidden;\n"])), function (_a) {
175
175
  var theme = _a.theme;
176
176
  return theme.ui_cpnt_datatable_textbutton_base_01;
177
177
  });
178
- var S_QuickActionButtonBox = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n opacity: 0;\n padding-left: ", ";\n padding-right: ", ";\n pointer-events: none;\n\n ", ";\n"], ["\n opacity: 0;\n padding-left: ", ";\n padding-right: ", ";\n pointer-events: none;\n\n ", ";\n"])), function (_a) {
178
+ var S_QuickActionButtonBox = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"], ["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"])), function (_a) {
179
179
  var theme = _a.theme;
180
180
  return theme.spacing.spacingC;
181
181
  }, function (_a) {
@@ -252,7 +252,7 @@ var S_SelectionColumn = styled_components_1.default.div(templateObject_24 || (te
252
252
  var hoverAdminListItem = (0, styled_components_1.css)(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n align-items: center;\n position: relative;\n"], ["\n align-items: center;\n position: relative;\n"])));
253
253
  var fixedAdminListItem = (0, styled_components_1.css)(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n justify-content: space-between;\n"], ["\n justify-content: space-between;\n"])));
254
254
  var flexibleHideColumnStyle = (0, styled_components_1.css)(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"], ["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"])));
255
- var S_AdminListItem = styled_components_1.default.div(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: flex;\n padding-left: ", ";\n\n ", "\n\n ", ";\n ", "\n\n :hover {\n background-color: ", ";\n\n ", " {\n display: ", ";\n opacity: 1;\n pointer-events: auto;\n }\n }\n\n &:last-child {\n margin-bottom: 88px;\n }\n\n ", "\n"], ["\n align-items: center;\n background-color: ", ";\n display: flex;\n padding-left: ", ";\n\n ", "\n\n ", ";\n ", "\n\n :hover {\n background-color: ", ";\n\n ", " {\n display: ", ";\n opacity: 1;\n pointer-events: auto;\n }\n }\n\n &:last-child {\n margin-bottom: 88px;\n }\n\n ", "\n"])), function (_a) {
255
+ var S_AdminListItem = styled_components_1.default.div(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: flex;\n padding-left: ", ";\n\n ", "\n\n ", ";\n ", "\n\n :hover {\n background-color: ", ";\n\n ", " {\n display: ", ";\n visibility: visible;\n }\n }\n\n &:last-child {\n margin-bottom: 88px;\n }\n\n ", "\n"], ["\n align-items: center;\n background-color: ", ";\n display: flex;\n padding-left: ", ";\n\n ", "\n\n ", ";\n ", "\n\n :hover {\n background-color: ", ";\n\n ", " {\n display: ", ";\n visibility: visible;\n }\n }\n\n &:last-child {\n margin-bottom: 88px;\n }\n\n ", "\n"])), function (_a) {
256
256
  var theme = _a.theme, isSelected = _a.isSelected;
257
257
  return isSelected ? theme.ui_cpnt_datatable_base_selected : theme.ui_cpnt_datatable_base_default;
258
258
  }, function (_a) {
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import type { TypeOfCompositionAction } from '../compositionActionTypes';
3
3
  import type { CustomSectionShortcutKeysType, IComposition } from '../types';
4
- import type { Layout } from 'publ-echo/dist/lib/GridLayoutEditor/types';
4
+ import type { Layout } from 'publ-echo-test/dist/lib/GridLayoutEditor/types';
5
5
  export type LayoutsType = {
6
6
  sm: Layout;
7
7
  lg: Layout;
@@ -52,9 +52,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
52
52
  Object.defineProperty(exports, "__esModule", { value: true });
53
53
  var jsx_runtime_1 = require("react/jsx-runtime");
54
54
  /* eslint-disable @typescript-eslint/no-unused-vars */
55
- var publ_echo_1 = require("publ-echo");
56
- var group_1 = require("publ-echo/dist/lib/GridLayoutEditor/group");
57
- var renderHelpers_1 = require("publ-echo/dist/lib/GridLayoutEditor/utils/renderHelpers");
55
+ var publ_echo_test_1 = require("publ-echo-test");
56
+ var group_1 = require("publ-echo-test/dist/lib/GridLayoutEditor/group");
57
+ var renderHelpers_1 = require("publ-echo-test/dist/lib/GridLayoutEditor/utils/renderHelpers");
58
58
  var react_1 = __importStar(require("react"));
59
59
  var ErrorBoundary_1 = require("../../DynamicLayout/components/Section/ErrorBoundary");
60
60
  var gleStyles_1 = require("../../DynamicLayout/gleStyles");
@@ -69,7 +69,7 @@ var group_2 = require("../sections/CustomSection/newUtils/group");
69
69
  var util_1 = require("../sections/CustomSection/util");
70
70
  var parseSectionPadding_1 = __importDefault(require("../sections/CustomSection/util/layoutPropParsers/parseSectionPadding"));
71
71
  var parseCompositionPlacement_1 = __importDefault(require("../sections/CustomSection/util/parseCompositionPlacement"));
72
- var Responsive = (0, publ_echo_1.WidthProvider)(publ_echo_1.ResponsiveGridEditor);
72
+ var Responsive = (0, publ_echo_test_1.WidthProvider)(publ_echo_test_1.ResponsiveGridEditor);
73
73
  var CompositionEditor = (0, react_1.forwardRef)(function CompositionEditorCanvas(props, ref) {
74
74
  var _a, _b, _c, _d;
75
75
  var _e = props.editorProps, device = _e.device, shortcutKeyMode = _e.shortcutKeyMode, compositionActionHandler = _e.compositionActionHandler;
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import type { IComposition } from '../types';
3
- import type { Layout } from 'publ-echo/dist/lib/GridLayoutEditor/types';
3
+ import type { Layout } from 'publ-echo-test/dist/lib/GridLayoutEditor/types';
4
4
  export type LayoutsType = {
5
5
  sm: Layout;
6
6
  lg: Layout;
@@ -178,7 +178,7 @@ var Composition = (0, react_1.forwardRef)(function CustomSection(props, ref) {
178
178
  return size.width * 0.0133;
179
179
  }
180
180
  if (size.width < 1200) {
181
- return Math.max(getDefensiveFontSize(device, size.width), 16);
181
+ return Math.max(getDefensiveFontSize(device, size.width), 14);
182
182
  }
183
183
  return 16;
184
184
  })();
@@ -195,7 +195,7 @@ var Composition = (0, react_1.forwardRef)(function CustomSection(props, ref) {
195
195
  paddingLeft: padding.left,
196
196
  width: '100%',
197
197
  height: '100%'
198
- } }, { children: (0, jsx_runtime_1.jsx)(GridContainer, __assign({ ref: containerRef, cols: cols, rowHeight: rowHeight, sectionRow: rows, style: {
198
+ } }, { children: (0, jsx_runtime_1.jsx)(GridContainer, __assign({ className: "composition-container", "data-cols": cols, "data-rows": rows, "data-row-height": rowHeight, "data-col-width": "10px", ref: containerRef, cols: cols, rowHeight: rowHeight, sectionRow: rows, style: {
199
199
  width: customSectionStyles.width,
200
200
  maxWidth: customSectionStyles.maxWidth,
201
201
  // minWidth: isMobile ? GLE_MIN_WIDTH_MOBILE_PX : GLE_MIN_WIDTH_DESKTOP_PX,
@@ -1,8 +1,8 @@
1
1
  /// <reference types="react" />
2
- import type { CB_VALUE_TYPE, CCB_VALUE_TYPE } from '../sections/CustomSection/util/types';
2
+ import type { VALUE_TYPE } from '../sections/CustomSection/util/types';
3
3
  import type { IComposition, QueryData } from '../../DynamicLayout/types';
4
4
  export declare function createCompositions({ valueType, queryPath, queryData, compositions }: {
5
- valueType: CCB_VALUE_TYPE | CB_VALUE_TYPE;
5
+ valueType: VALUE_TYPE;
6
6
  queryPath: string;
7
7
  queryData: QueryData | undefined;
8
8
  compositions: IComposition[];
@@ -1,8 +1,4 @@
1
1
  "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
2
  var __assign = (this && this.__assign) || function () {
7
3
  __assign = Object.assign || function(t) {
8
4
  for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -21,40 +17,32 @@ Object.defineProperty(exports, "__esModule", { value: true });
21
17
  exports.createCompositions = void 0;
22
18
  var jsx_runtime_1 = require("react/jsx-runtime");
23
19
  require("react");
24
- var styled_components_1 = __importDefault(require("styled-components"));
25
20
  var compositionQueryContext_1 = require("../compositionQueryContext");
26
21
  var Composition_1 = __importDefault(require("./Composition"));
27
22
  function createCompositions(_a) {
28
23
  var valueType = _a.valueType, queryPath = _a.queryPath, queryData = _a.queryData, compositions = _a.compositions;
29
- var isQueryDataConnected = valueType === 'DATA' || valueType === 'DELEGATEDDATA';
24
+ var isQueryDataConnected = valueType === 'DATA';
30
25
  // 직접 입력 유형인 경우
31
26
  if (!isQueryDataConnected) {
32
- var valueTypeCompositions = compositions.filter(function (composition) { return !composition.isDefault; });
33
- // MANUAL ITEM이 없는 경우
34
- if (!valueTypeCompositions.length) {
35
- return [
36
- (0, jsx_runtime_1.jsx)(S_EmptyLayer, { children: "\uC544\uC774\uD15C\uC774 \uC5C6\uC2B5\uB2C8\uB2E4. \uC544\uC774\uD15C\uC744 \uCD94\uAC00\uD574\uC8FC\uC138\uC694." }, "empty-manual-item")
37
- ];
38
- }
39
- return valueTypeCompositions.map(function (composition) { return ((0, jsx_runtime_1.jsx)(Composition_1.default, __assign({}, composition), composition.id)); });
27
+ return compositions
28
+ .filter(function (composition) { return !composition.isDefault; })
29
+ .map(function (composition) { return (0, jsx_runtime_1.jsx)(Composition_1.default, __assign({}, composition), composition.id); });
40
30
  }
41
31
  if (!compositions.length) {
42
- return [(0, jsx_runtime_1.jsx)("div", { children: "EMPTY TEXT" }, "empty")];
32
+ return [(0, jsx_runtime_1.jsx)("div", { children: "EMPTY TEXT" }, "not-found")];
43
33
  }
44
34
  // 데이터 연결 유형이나, 쿼리 데이터나 키가 없는 경우
45
- if (queryPath === 'NONE' || !queryPath || !queryData) {
46
- return [(0, jsx_runtime_1.jsx)(S_EmptyLayer, { children: "\uC544\uC9C1 \uC5F0\uACB0\uB41C \uCFFC\uB9AC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4." }, "no-query")];
35
+ if (!queryPath || !queryData) {
36
+ return compositions
37
+ .filter(function (composition) { return composition.isDefault; })
38
+ .map(function (composition) { return (0, jsx_runtime_1.jsx)(Composition_1.default, __assign({}, composition), composition.id); });
47
39
  }
48
40
  var parsedQueryPath = removeFirstSegment(queryPath);
49
41
  var queryDataValue = queryData[parsedQueryPath];
50
42
  var queryComposition = compositions.find(function (composition) { return composition.isDefault; });
51
43
  // 쿼리 데이터와 키가 있으나, 쿼리 데이터에 해당 키가 없는 경우
52
44
  if (!queryDataValue) {
53
- return [(0, jsx_runtime_1.jsx)(S_EmptyLayer, { children: "\uC5F0\uACB0\uB41C \uB370\uC774\uD130\uB97C \uCC3E\uC744 \uC218 \uC5C6\uC2B5\uB2C8\uB2E4." }, "not-found")];
54
- }
55
- // 쿼리 데이터와 키가 있으나, 쿼리 데이터에 결과가 빈 경우
56
- if (!queryDataValue.length) {
57
- return [(0, jsx_runtime_1.jsx)(S_EmptyLayer, { children: "\uC544\uC9C1 \uBCF4\uC5EC\uC904 \uCF58\uD150\uCE20\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4." }, "empty-item")];
45
+ return [(0, jsx_runtime_1.jsxs)("div", { children: ["NOT FOUND QUERYDATA OR DEFAULT: ", parsedQueryPath] }, "not-found")];
58
46
  }
59
47
  return queryDataValue.map(function (query, index) { return ((0, jsx_runtime_1.jsx)(compositionQueryContext_1.CCBQueryPathContext.Provider, __assign({ value: { queryData: query } }, { children: (0, jsx_runtime_1.jsx)(Composition_1.default, __assign({}, queryComposition)) }), index)); });
60
48
  }
@@ -63,17 +51,3 @@ function removeFirstSegment(path) {
63
51
  var segments = path.split('/');
64
52
  return segments.slice(1).join('/');
65
53
  }
66
- var S_EmptyLayer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n background-color: rgba(0, 0, 0, 0.6);\n bottom: 0;\n color: white;\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n justify-content: center;\n left: 0;\n line-height: ", ";\n padding: ", ";\n position: absolute;\n right: 0;\n text-align: center;\n top: 0;\n word-break: keep-all;\n"], ["\n align-items: center;\n background-color: rgba(0, 0, 0, 0.6);\n bottom: 0;\n color: white;\n display: flex;\n font-size: ", ";\n font-weight: ", ";\n justify-content: center;\n left: 0;\n line-height: ", ";\n padding: ", ";\n position: absolute;\n right: 0;\n text-align: center;\n top: 0;\n word-break: keep-all;\n"])), function (_a) {
67
- var theme = _a.theme;
68
- return theme.desktopFontSize.body2;
69
- }, function (_a) {
70
- var theme = _a.theme;
71
- return theme.fontWeight.bold;
72
- }, function (_a) {
73
- var theme = _a.theme;
74
- return theme.desktopLineHeight.body2;
75
- }, function (_a) {
76
- var theme = _a.theme;
77
- return theme.spacing.spacingE;
78
- });
79
- var templateObject_1;
@@ -81,12 +81,9 @@ var TopRightAbsoluteBox = styled_components_1.default.div(templateObject_1 || (t
81
81
  var theme = _a.theme;
82
82
  return theme.ui_editor_preview_editing;
83
83
  });
84
- var S_SectionBox = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: ", ";\n position: relative;\n z-index: ", ";\n"], ["\n height: ", ";\n position: relative;\n z-index: ", ";\n"])), function (_a) {
84
+ var S_SectionBox = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: ", ";\n position: relative;\n"], ["\n height: ", ";\n position: relative;\n"])), function (_a) {
85
85
  var isIframeSection = _a.isIframeSection;
86
86
  return (isIframeSection ? '100%' : 'auto');
87
- }, function (_a) {
88
- var isEditing = _a.isEditing;
89
- return (isEditing ? 3 : 1);
90
87
  });
91
88
  var DimmedEditOverlay = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n animation: ", ";\n background-color: ", ";\n bottom: 0;\n cursor: pointer;\n display: flex;\n justify-content: center;\n left: 0;\n\n opacity: ", ";\n\n position: absolute;\n right: 0;\n top: 0;\n transition: opacity 0.2s ease-out;\n z-index: 10;\n\n @keyframes fadeOut {\n 0% {\n opacity: 1;\n }\n\n 50% {\n opacity: 0.6;\n }\n\n 100% {\n opacity: 0;\n }\n }\n"], ["\n align-items: center;\n animation: ", ";\n background-color: ", ";\n bottom: 0;\n cursor: pointer;\n display: flex;\n justify-content: center;\n left: 0;\n\n opacity: ", ";\n\n position: absolute;\n right: 0;\n top: 0;\n transition: opacity 0.2s ease-out;\n z-index: 10;\n\n @keyframes fadeOut {\n 0% {\n opacity: 1;\n }\n\n 50% {\n opacity: 0.6;\n }\n\n 100% {\n opacity: 0;\n }\n }\n"])), function (_a) {
92
89
  var fadeOut = _a.fadeOut;
@@ -37,9 +37,6 @@ var __importStar = (this && this.__importStar) || function (mod) {
37
37
  __setModuleDefault(result, mod);
38
38
  return result;
39
39
  };
40
- var __importDefault = (this && this.__importDefault) || function (mod) {
41
- return (mod && mod.__esModule) ? mod : { "default": mod };
42
- };
43
40
  Object.defineProperty(exports, "__esModule", { value: true });
44
41
  exports.CustomSectionBackgroundMedia = void 0;
45
42
  var jsx_runtime_1 = require("react/jsx-runtime");
@@ -48,10 +45,9 @@ var utils_1 = require("../../../../DynamicLayout/utils");
48
45
  var styled_components_1 = __importStar(require("styled-components"));
49
46
  var YouTubeIframe_1 = require("../../YouTubeIframe");
50
47
  var util_1 = require("../util");
51
- var VideoBGMedia_1 = __importDefault(require("./VideoBGMedia"));
52
48
  function CustomSectionBackgroundMedia(_a) {
53
49
  var specs = _a.specs, playerId = _a.playerId, mediaType = _a.mediaType, componentStyle = _a.componentStyle, device = _a.device, backgroundRef = _a.backgroundRef;
54
- var _b = (0, util_1.parseSectionBackgroundMediaData)(specs, device), CB_STYLE_PROP_BGMEDIA_SPEC_YSRC = _b.CB_STYLE_PROP_BGMEDIA_SPEC_YSRC, CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY = _b.CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY, CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME = _b.CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME, CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME = _b.CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME, CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR = _b.CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR, CB_STYLE_PROP_BGMEDIA_SPEC_VIDEOSELECTOR = _b.CB_STYLE_PROP_BGMEDIA_SPEC_VIDEOSELECTOR;
50
+ var _b = (0, util_1.parseSectionBackgroundMediaData)(specs, device), CB_STYLE_PROP_BGMEDIA_SPEC_YSRC = _b.CB_STYLE_PROP_BGMEDIA_SPEC_YSRC, CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY = _b.CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY, CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME = _b.CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME, CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME = _b.CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME, CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR = _b.CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR;
55
51
  var _c = (0, react_1.useState)({ width: 0, height: 0 }), youtubeSize = _c[0], setYoutubeSize = _c[1];
56
52
  var youTubeIframeKey = (0, react_1.useMemo)(function () {
57
53
  return "".concat(utils_1.YouTubeLinkParser.getId(String(CB_STYLE_PROP_BGMEDIA_SPEC_YSRC)), "-").concat(CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY, "-").concat(CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME, "-").concat(CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME);
@@ -108,13 +104,6 @@ function CustomSectionBackgroundMedia(_a) {
108
104
  return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR && ((0, jsx_runtime_1.jsx)(S_Image, __assign({ src: String(CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR), normalStyle: componentStyle }, { children: (0, jsx_runtime_1.jsx)("img", { src: String(CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR), style: { visibility: 'hidden', width: '100%', height: '100%' } }) }))) }));
109
105
  case 'YOUTUBE':
110
106
  return ((0, jsx_runtime_1.jsx)(S_YoutubeContainer, __assign({}, youtubeSize, { children: youtubeSize.height > 0 && youtubeSize.width > 0 && ((0, jsx_runtime_1.jsx)(YouTubeIframe_1.YouTubeIframe, { src: String(CB_STYLE_PROP_BGMEDIA_SPEC_YSRC), id: playerId, loopMode: CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY ? 'use' : 'none', startSeconds: Number(CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME), endSeconds: Number(CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME), customHeight: youtubeSize.height, customWidth: youtubeSize.width }, youTubeIframeKey)) })));
111
- case 'VIDEO':
112
- case 'URL':
113
- return ((0, jsx_runtime_1.jsx)(VideoBGMedia_1.default
114
- // autoPlayOnMobile={}
115
- , {
116
- // autoPlayOnMobile={}
117
- src: String(CB_STYLE_PROP_BGMEDIA_SPEC_VIDEOSELECTOR), startTime: Number(CB_STYLE_PROP_BGMEDIA_SPEC_STARTTIME), endTime: Number(CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME), loop: !!CB_STYLE_PROP_BGMEDIA_SPEC_REPLAY }));
118
107
  case 'NONE':
119
108
  default:
120
109
  return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
@@ -25,9 +25,7 @@ var AVAILABLE_SPECS = [
25
25
  'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEPOSITION',
26
26
  'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGESELECTOR',
27
27
  'CB_STYLE_PROP_BGMEDIA_SPEC_IMAGEFIT',
28
- 'CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME',
29
- 'CB_STYLE_PROP_BGMEDIA_SPEC_VIDEOSELECTOR'
30
- // 'CB_STYLE_PROP_BGMEDIA_SPEC_MPLAY'
28
+ 'CB_STYLE_PROP_BGMEDIA_SPEC_ENDTIME'
31
29
  ];
32
30
  function UseCustomSectionBackgroundMediaData(specs, device) {
33
31
  return AVAILABLE_SPECS.reduce(function (acc, cur) {
@@ -86,7 +86,7 @@
86
86
  "sys_papp_vod_background": "lightpink500",
87
87
  "sys_papp_vodplus_background": "pink500",
88
88
  "sys_papp_live_background": "pink300",
89
- "sys_selcontrols_base_off_disabled": "darkgrey400/opacity35",
89
+ "sys_selcontrols_base_off_disabled": "darkgrey400/opacity65",
90
90
  "sys_selcontrols_base_on_disabled": "darklightgreen500/opacity65",
91
91
  "sys_component_base_blue_opacity10": "blue500/opacity10",
92
92
  "sys_component_base_05": "grey950",
@@ -125,7 +125,7 @@
125
125
  "sys_component_base_black_opacity30": "black/opacity30",
126
126
  "sys_area_background": "darkgrey50/opacity65",
127
127
  "sys_border_white_opacity30": "white/opacity30",
128
- "sys_container_background_wt": "darkgrey10",
128
+ "sys_container_background_wt": "grey950",
129
129
  "sys_channeldesc_grey_03": "darkgrey400",
130
130
  "sys_channeldesc_border_grey_03": "darkgrey100",
131
131
  "sys_gradient_base_01": "grey950",
@@ -160,7 +160,7 @@
160
160
  "sys_background_dimmed_02": "black/opacity65",
161
161
  "sys_border_line_08": "darkgrey500",
162
162
  "sys_component_base_06": "darkgrey50",
163
- "sys_component_base_07": "darkgrey80",
163
+ "sys_component_base_07": "darkgrey70",
164
164
  "sys_border_line_09": "darkgrey50",
165
165
  "sys_component_base_darktheme_04": "black/opacity00",
166
166
  "sys_border_line_10": "darkgrey50",
@@ -227,153 +227,5 @@
227
227
  "sys_facebook": "facebookblue",
228
228
  "sys_component_base_19": "white/opacity65",
229
229
  "sys_cpnt_pagination_dot_01": "white",
230
- "sys_cpnt_pagination_dot_02": "white/opacity50",
231
- "sys_component_base_white_opacity50": "white/opacity50",
232
- "sys_component_base_20": "white/opacity80",
233
- "sys_component_base_22": "grey950",
234
- "sys_component_base_21": "red500/opacity50",
235
- "sys_component_border_white_opacity20": "white/opacity20",
236
- "sys_component_base_23": "darkgrey100/opacity65",
237
- "sys_component_base_darkgreen": "darkgreen700",
238
- "sys_component_base_24": "black/opacity80",
239
- "sys_border_line_15": "white/opacity80",
240
- "sys_border_line_16": "black/opacity80",
241
- "sys_component_base_hover_01": "darkgrey30",
242
- "sys_component_on_base_01": "white/opacity20",
243
- "sys_component_on_base_02": "grey950/opacity15",
244
- "sys_component_on_base_03": "grey950/opacity05",
245
- "sys_component_on_base_04": "darkgrey80",
246
- "sys_component_on_base_05": "darkgrey200",
247
- "sys_component_base_hover_02": "darkgrey80",
248
- "sys_component_base_pressed_01": "darkgrey200",
249
- "sys_widget_white_02": "white/opacity70",
250
- "sys_component_base_hover_03": "white/opacity60",
251
- "sys_component_base_pressed_02": "white/opacity30",
252
- "sys_component_base_25": "white/opacity40",
253
- "sys_editor_base_pages": "darkskyblue100",
254
- "sys_editor_base_papp": "darkgreen100",
255
- "sys_text_black": "black",
256
- "sys_component_base_26": "grey30",
257
- "sys_component_base_27": "grey70",
258
- "sys_component_base_28": "darkgrey500",
259
- "sys_widget_sidebar_label_text": "darkgrey500/opacity70",
260
- "sys_component_base_hover_darktheme": "darkgrey80",
261
- "sys_component_base_pressed_darktheme": "darkgrey200",
262
- "sys_component_base_hover_white": "white/opacity05",
263
- "sys_component_base_pressed_white": "white/opacity15",
264
- "sys_component_base_hover_transparent": "darkgrey900/opacity25",
265
- "sys_component_base_pressed_transparent": "darkgrey900/opacity35",
266
- "sys_text_white_opacity_01": "white/opacity70",
267
- "sys_component_base_hover_04": "white/opacity30",
268
- "sys_component_base_pressed_03": "white/opacity20",
269
- "sys_cpnt_sheet_base_07": "grey100",
270
- "sys_cpnt_sheet_base_08": "green700",
271
- "sys_cpnt_sheet_base_09": "darkblue50",
272
- "sys_cpnt_sheet_base_10": "darkred500",
273
- "sys_component_base_29": "grey30",
274
- "sys_storyboard_group_base_grey01": "grey10",
275
- "sys_storyboard_group_base_blue01": "blue10",
276
- "sys_storyboard_group_base_red01": "red10",
277
- "sys_storyboard_group_base_green01": "green10",
278
- "sys_storyboard_card_base_blue01": "blue30",
279
- "sys_storyboard_card_base_red01": "red30",
280
- "sys_storyboard_card_base_green01": "green50",
281
- "sys_brand_secondary_variant": "darkgreen700",
282
- "sys_button_tooltip_base": "white/opacity95",
283
- "sys_text_button_tooltip": "grey900",
284
- "sys_membership_button_base": "white/opacity20",
285
- "sys_membership_item_membership_base": "darkgrey50",
286
- "sys_membership_item_price_product_base": "darkgrey70",
287
- "sys_component_base_30": "darkgrey400",
288
- "sys_component_base_31": "darkgrey200",
289
- "sys_component_base_32": "darkgrey20",
290
- "sys_component_base_33": "white/opacity70",
291
- "sys_component_base_34": "darkpink500",
292
- "sys_component_base_35": "darklightgreen500",
293
- "sys_component_base_36": "darkorange500",
294
- "sys_component_base_37": "darkpink300",
295
- "sys_component_base_38": "darkorange300",
296
- "sys_plan_base_01": "darkpastelblue300/opacity60",
297
- "sys_plan_base_02": "darksoftpurple500/opacity60",
298
- "sys_plan_base_03": "darkcoolpink500/opacity60",
299
- "sys_text_warning_02": "darkbrown500",
300
- "sys_component_base_39": "darkyellow300",
301
- "sys_component_base_40": "darkorange50",
302
- "sys_component_base_41": "darkskyblue100",
303
- "sys_cpnt_slider_track": "darkgrey100",
304
- "sys_cpnt_slider_track_active": "darkblue500",
305
- "sys_cpnt_slider_thumb_normal": "darkblue500",
306
- "sys_cpnt_slider_thumb_disabled": "darkgrey400",
307
- "sys_cpnt_slider_thumb_hover_circle": "darkblue500/opacity10",
308
- "sys_cpnt_slider_thumb_pressed_circle": "darkblue500/opacity20",
309
- "sys_cpnt_slider_track_disabled": "darkgrey400",
310
- "sys_component_base_42": "darkorange30",
311
- "sys_component_base_43": "darkblue30",
312
- "sys_icon_grey_darktheme_01": "darkgrey900",
313
- "sys_icon_grey_darktheme_02": "darkgrey500",
314
- "sys_icon_grey_darktheme_03": "darkgrey400",
315
- "sys_widget_grey_01_opacity_50": "darkgrey900/opacity50",
316
- "sys_editor_layout_header": "darkgrey70",
317
- "sys_editor_layout_navigation_panel": "darkgrey80",
318
- "sys_editor_layout_canvas_area": "darkgrey30",
319
- "sys_editor_layout_control_panel": "darkgrey70",
320
- "sys_editor_layout_property_panel": "darkgrey70",
321
- "sys_editor_layout_navigation_panel_section_item_area_normal": "darkgrey300",
322
- "sys_component_base_44": "white/opacity20",
323
- "sys_sw_sidebar_base": "black",
324
- "sys_sw_sidebar_label_text_normal": "darkgrey400",
325
- "sys_sw_sidebar_item_text_normal": "darkgrey500/opacity70",
326
- "sys_sw_sidebar_item_text_selected": "white",
327
- "sys_sw_sidebar_label_icon_normal_01": "darkgrey400",
328
- "sys_sw_sidebar_item_icon_normal": "darkgrey500/opacity70",
329
- "sys_sw_sidebar_item_icon_selected": "white",
330
- "sys_sw_sidebar_badge_base_01": "darkred500",
331
- "sys_sw_sidebar_badge_base_02": "darkgreen300",
332
- "sys_sw_sidebar_badge_text_01": "white",
333
- "sys_sw_sidebar_badge_text_02": "grey900",
334
- "sys_sw_sidebar_divider": "darkgrey70",
335
- "sys_sw_sidebar_label_base_normal": "white/opacity00",
336
- "sys_sw_sidebar_label_base_hover": "darkgrey50",
337
- "sys_sw_sidebar_label_base_pressed": "darkgrey100",
338
- "sys_sw_sidebar_item_base_normal": "white/opacity00",
339
- "sys_sw_sidebar_item_base_hover": "darkgrey50",
340
- "sys_sw_sidebar_item_base_pressed": "darkgrey100",
341
- "sys_sw_sidebar_label_icon_normal_02": "darkblue500",
342
- "sys_text_black_02": "black/opacity60",
343
- "sys_sw_sidebar_item_text_disabled": "darkgrey400/opacity70",
344
- "sys_text_grey_05": "darkgrey400/opacity20",
345
- "sys_text_white_02": "white/opacity50",
346
- "sys_component_base_45": "darkgreen300",
347
- "sys_component_base_46": "black/opacity90",
348
- "sys_cpnt_list_chatbubble_download_button_base": "white/opacity20",
349
- "sys_cpnt_sheet_base_11": "darkgrey10",
350
- "sys_cpnt_sheet_base_12": "white/opacity20",
351
- "sys_sw_sidebar_item_text_emphasis": "darkgreen500",
352
- "sys_sw_sidebar_item_icon_emphasis": "darkgreen500",
353
- "sys_sw_sidebar_divider_vertical": "darkgrey100",
354
- "sys_cpnt_sheet_base_13": "grey50",
355
- "sys_cpnt_sheet_base_14": "grey900",
356
- "sys_cpnt_white_opacity60": "white/opacity60",
357
- "sys_border_line_17": "darkgrey600",
358
- "usr_brand_primary_opacity05": "darkblue500/opacity05",
359
- "sys_cpnt_sheet_base_15": "grey200",
360
- "sys_cpnt_sheet_base_16": "grey900/opacity50",
361
- "sys_cpnt_sheet_base_17": "grey500",
362
- "sys_component_base_47": "darkyellow500",
363
- "sys_cpnt_editor_undefined": "darkgrey500",
364
- "sys_cpnt_slider_track_active_undefined": "darkgrey400",
365
- "sys_cpnt_slider_thumb_normal_undefined": "darkgrey400",
366
- "sys_cpnt_editor_buttongroup_undefined": "darkgrey400",
367
- "sys_text_grey_02_hinttext": "darkgrey450",
368
- "sys_component_base_48": "darkgrey70",
369
- "usr_brand_primary_opacity10": "darkblue500/opacity10",
370
- "sys_component_base_49": "darkgrey70",
371
- "sys_widget_grey_06": "grey900",
372
- "sys_component_base_50": "black/opacity50",
373
- "sys_dimmed_01": "black/opacity80",
374
- "sys_cpnt_sheet_base_51": "black",
375
- "sys_cpnt_sheet_base_52": "darkgrey50",
376
- "sys_cpnt_sheet_base_53": "darkgrey70",
377
- "sys_widget_grey_07": "grey900",
378
- "sys_cpnt_sheet_base_54": "grey30"
230
+ "sys_cpnt_pagination_dot_02": "white/opacity50"
379
231
  }