pds-dev-kit-web-test 2.5.436 → 2.5.438

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 (55) hide show
  1. package/dist/src/sub/DynamicLayout/mock_contentsCarousel.js +5 -17
  2. package/dist/src/sub/DynamicLayout/mock_contentsList.js +2 -2
  3. package/dist/src/sub/DynamicLayout/mock_slideBanner.d.ts +63 -63
  4. package/dist/src/sub/DynamicLayout/mock_slideBanner.js +64 -64
  5. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.js +63 -192
  6. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarouselCore.d.ts +2 -7
  7. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarouselCore.js +8 -6
  8. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigationNextBtn.d.ts +15 -0
  9. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigationNextBtn.js +69 -0
  10. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigationPrevBtn.d.ts +15 -0
  11. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigationPrevBtn.js +69 -0
  12. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomProgressbar.d.ts +4 -18
  13. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomProgressbar.js +19 -49
  14. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/progressConfigs.js +16 -16
  15. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/contentsCarouselUtils.d.ts +19 -20
  16. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/contentsCarouselUtils.js +131 -696
  17. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/hooks/useFlexGridLayout.d.ts +25 -0
  18. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/hooks/useFlexGridLayout.js +234 -0
  19. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/hooks/useSwiper.d.ts +14 -0
  20. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/hooks/useSwiper.js +46 -0
  21. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/types.d.ts +36 -2
  22. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/ContentsList.js +38 -20
  23. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/components/CustomPagination.d.ts +6 -25
  24. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/components/CustomPagination.js +21 -51
  25. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/contentsListUtils.d.ts +8 -9
  26. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/contentsListUtils.js +42 -294
  27. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/hooks/useFlexGridLayout.d.ts +23 -0
  28. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/hooks/useFlexGridLayout.js +230 -0
  29. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsList/types.d.ts +12 -1
  30. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/SlideBanner.js +69 -146
  31. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/SlideBannerCore.d.ts +2 -5
  32. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/SlideBannerCore.js +2 -2
  33. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomNavigationNextBtn.d.ts +15 -0
  34. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomNavigationNextBtn.js +69 -0
  35. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomNavigationPrevBtn.d.ts +15 -0
  36. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomNavigationPrevBtn.js +69 -0
  37. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomPagination.d.ts +9 -22
  38. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomPagination.js +25 -35
  39. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomProgressbar.d.ts +4 -18
  40. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomProgressbar.js +19 -49
  41. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/progressConfigs.js +8 -8
  42. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/useFlexGridLayout.d.ts +26 -0
  43. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/useFlexGridLayout.js +235 -0
  44. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/useSwiper.d.ts +16 -0
  45. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/useSwiper.js +63 -0
  46. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/slideBannerUtils.d.ts +22 -24
  47. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/slideBannerUtils.js +155 -925
  48. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/types.d.ts +46 -3
  49. package/package.json +2 -2
  50. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigation.d.ts +0 -35
  51. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigation.js +0 -118
  52. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomPagination.d.ts +0 -32
  53. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomPagination.js +0 -183
  54. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomNavigation.d.ts +0 -35
  55. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/components/CustomNavigation.js +0 -118
@@ -1,30 +1,29 @@
1
1
  import { FlattenSimpleInterpolation } from 'styled-components';
2
2
  import type { CB_CONTENT_PROP_CONTENTSLIST } from '../types';
3
- import type { CustomPaginationProps } from './components/CustomPagination';
4
- import type { CB_STYLE_PROP_CONTENTSLIST_SPECS, ContentsListPropsKeys } from './types';
3
+ import type { CB_STYLE_PROP_CONTENTSLIST_SPECS, ContentsListPropsKeys, CustomPaginationProps } from './types';
5
4
  import type { Device } from '../../../../../../../DynamicLayout/sections/CustomSection/util/types';
6
- type StyleProps = {
5
+ type ParseContentsListStyleToCarouselCoreProps = {
7
6
  props: CB_STYLE_PROP_CONTENTSLIST_SPECS;
8
7
  device: Device;
9
8
  };
10
- type ContentProps = {
9
+ type ParseContentsListContentToCarouselCoreProps = {
11
10
  props: CB_CONTENT_PROP_CONTENTSLIST;
12
11
  };
13
- type PaginationProps = {
12
+ type ParseContentsListStyleToCustomPaginationProps = {
14
13
  props: CB_STYLE_PROP_CONTENTSLIST_SPECS;
15
14
  device: Device;
16
15
  };
17
16
  type CssFragment = FlattenSimpleInterpolation;
18
- export declare function parseGridStyleProp({ props, device }: StyleProps): {
17
+ export declare function parseGridStyleProp({ props, device }: ParseContentsListStyleToCarouselCoreProps): {
19
18
  stylePropCss: CssFragment;
20
19
  hoverStylePropCss: CssFragment;
21
20
  };
22
- export declare function parseGridContentProp({ props }: ContentProps): {
21
+ export declare function parseGridContentProp({ props }: ParseContentsListContentToCarouselCoreProps): {
23
22
  contentPropCss: CssFragment;
24
23
  };
25
- export declare function parsePaginationStyleProp({ props, device }: PaginationProps): {
24
+ export declare function parsePaginationStyleProp({ props, device }: ParseContentsListStyleToCustomPaginationProps): {
26
25
  normalStyle: CustomPaginationProps;
27
26
  hoverStyle: CustomPaginationProps;
28
27
  };
29
- export declare function getCustomPaginationPropKey(key: ContentsListPropsKeys): "" | "size" | "type" | "primaryColor" | "secondaryColor" | "offset";
28
+ export declare function getCustomPaginationPropKey(key: ContentsListPropsKeys): keyof CustomPaginationProps | null;
30
29
  export {};
@@ -3,60 +3,33 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
3
3
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
4
  return cooked;
5
5
  };
6
- var __assign = (this && this.__assign) || function () {
7
- __assign = Object.assign || function(t) {
8
- for (var s, i = 1, n = arguments.length; i < n; i++) {
9
- s = arguments[i];
10
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
- t[p] = s[p];
12
- }
13
- return t;
14
- };
15
- return __assign.apply(this, arguments);
16
- };
17
6
  Object.defineProperty(exports, "__esModule", { value: true });
18
7
  exports.getCustomPaginationPropKey = exports.parsePaginationStyleProp = exports.parseGridContentProp = exports.parseGridStyleProp = void 0;
19
8
  var styled_components_1 = require("styled-components");
20
- function getStyleTypePropStyleValues(value) {
21
- switch (value) {
22
- case 'DESIGN1': {
23
- return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 100%;\n width: 100%;\n "], ["\n height: 100%;\n width: 100%;\n "])));
24
- }
25
- case 'DESIGN2': {
26
- var overlayEffect = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background: rgba(255, 255, 255, 0.7);\n content: '';\n height: 100%;\n position: absolute;\n top: 0; /* \uD22C\uBA85\uB3C4 \uC870\uC808 (0 = \uC644\uC804 \uD22C\uBA85, 1 = \uBD88\uD22C\uBA85) */\n width: 20%;\n z-index: 2;\n "], ["\n background: rgba(255, 255, 255, 0.7);\n content: '';\n height: 100%;\n position: absolute;\n top: 0; /* \uD22C\uBA85\uB3C4 \uC870\uC808 (0 = \uC644\uC804 \uD22C\uBA85, 1 = \uBD88\uD22C\uBA85) */\n width: 20%;\n z-index: 2;\n "])));
27
- return (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n overflow: hidden;\n position: relative;\n\n &::before {\n ", "\n left: 0;\n }\n\n &::after {\n ", "\n right: 0;\n }\n "], ["\n overflow: hidden;\n position: relative;\n\n &::before {\n ", "\n left: 0;\n }\n\n &::after {\n ", "\n right: 0;\n }\n "])), overlayEffect, overlayEffect);
28
- }
29
- default: {
30
- return (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n height: 100%;\n width: 100%;\n "], ["\n height: 100%;\n width: 100%;\n "])));
31
- }
32
- }
33
- }
34
9
  function getItemSpacingPropStyleValues(value) {
35
10
  switch (value) {
36
11
  case 'NARROW': {
37
- return (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n grid-column-gap: 8px;\n "], ["\n grid-column-gap: 8px;\n "])));
12
+ return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n grid-column-gap: 8px;\n "], ["\n grid-column-gap: 8px;\n "])));
38
13
  }
39
14
  case 'NORMAL': {
40
- return (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n grid-column-gap: 24px;\n "], ["\n grid-column-gap: 24px;\n "])));
15
+ return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n grid-column-gap: 24px;\n "], ["\n grid-column-gap: 24px;\n "])));
41
16
  }
42
17
  case 'WIDE': {
43
- return (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n grid-column-gap: 36px;\n "], ["\n grid-column-gap: 36px;\n "])));
18
+ return (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n grid-column-gap: 36px;\n "], ["\n grid-column-gap: 36px;\n "])));
44
19
  }
45
20
  default: {
46
- return (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n grid-column-gap: 24px;\n "], ["\n grid-column-gap: 24px;\n "])));
21
+ return (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n grid-column-gap: 24px;\n "], ["\n grid-column-gap: 24px;\n "])));
47
22
  }
48
23
  }
49
24
  }
50
25
  function getItemLineHeightPropStyleValues(value) {
51
- return (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n grid-row-gap: ", "px;\n "], ["\n grid-row-gap: ", "px;\n "])), value);
26
+ return (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n grid-row-gap: ", "px;\n "], ["\n grid-row-gap: ", "px;\n "])), value);
52
27
  }
53
28
  function getItemHeightFitContentPropStyleValues(value) {
54
- return (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n overflow-y: ", ";\n "], ["\n overflow-y: ", ";\n "])), value ? 'visible' : 'auto');
29
+ return (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n overflow-y: ", ";\n "], ["\n overflow-y: ", ";\n "])), value ? 'visible' : 'auto');
55
30
  }
56
31
  function parseStylePropertyStyles(key, value) {
57
32
  switch (key) {
58
- case 'CB_STYLE_PROP_CONTENTSLIST_SPEC_STYLE':
59
- return getStyleTypePropStyleValues(value);
60
33
  case 'CB_STYLE_PROP_CONTENTSLIST_SPEC_ITEMSPACING':
61
34
  return getItemSpacingPropStyleValues(value);
62
35
  case 'CB_STYLE_PROP_CONTENTSLIST_SPEC_ITEMLINEHEIGHT':
@@ -69,7 +42,7 @@ function parseStylePropertyStyles(key, value) {
69
42
  return undefined;
70
43
  }
71
44
  function getColumnsPropStyleValues(value, rows) {
72
- return (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: repeat(", ", 1fr);\n "], ["\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: repeat(", ", 1fr);\n "])), value, rows);
45
+ return (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: repeat(", ", 1fr);\n "], ["\n grid-template-columns: repeat(", ", 1fr);\n grid-template-rows: repeat(", ", 1fr);\n "])), value, rows);
73
46
  }
74
47
  function parseContentPropertyStyles(key, value, rows) {
75
48
  switch (key) {
@@ -89,12 +62,12 @@ function parseGridStyleProp(_a) {
89
62
  var styles = parseStylePropertyStyles(currentKey, value);
90
63
  var hoverStyles = parseStylePropertyStyles(currentKey, hoverValue !== null && hoverValue !== void 0 ? hoverValue : value);
91
64
  return {
92
- stylePropCss: (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), acc.stylePropCss, styles),
93
- hoverStylePropCss: (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), acc.hoverStylePropCss, hoverStyles)
65
+ stylePropCss: (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), acc.stylePropCss, styles),
66
+ hoverStylePropCss: (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), acc.hoverStylePropCss, hoverStyles)
94
67
  };
95
68
  }, {
96
- stylePropCss: (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject([""], [""]))),
97
- hoverStylePropCss: (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject([""], [""])))
69
+ stylePropCss: (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject([""], [""]))),
70
+ hoverStylePropCss: (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject([""], [""])))
98
71
  });
99
72
  }
100
73
  exports.parseGridStyleProp = parseGridStyleProp;
@@ -108,273 +81,48 @@ function parseGridContentProp(_a) {
108
81
  var value = props[currentKey];
109
82
  var styles = parseContentPropertyStyles(currentKey, value, rows);
110
83
  return {
111
- contentPropCss: (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), acc.contentPropCss, styles)
84
+ contentPropCss: (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), acc.contentPropCss, styles)
112
85
  };
113
86
  }, {
114
- contentPropCss: (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject([""], [""])))
87
+ contentPropCss: (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject([""], [""])))
115
88
  });
116
89
  }
117
90
  exports.parseGridContentProp = parseGridContentProp;
118
91
  function parsePaginationStyleProp(_a) {
119
92
  var props = _a.props, device = _a.device;
120
- var availableSpecCodes = Object.keys(props).filter(function (key) { return !key.includes(':HOVER') && !key.includes(':MOBILE'); });
121
- return availableSpecCodes.reduce(function (acc, currentKey) {
122
- var keyWithDevice = device === 'DESKTOP' ? currentKey : "".concat(currentKey, ":MOBILE");
123
- var keyWithHover = "".concat(keyWithDevice.toString(), ":HOVER");
124
- var customPaginationPropertyKey = getCustomPaginationPropKey(currentKey);
125
- if (customPaginationPropertyKey === 'type') {
126
- var value = props[keyWithDevice];
127
- var hoverValue = props[keyWithHover];
128
- return {
129
- normalStyle: __assign(__assign({}, acc.normalStyle), { type: value }),
130
- hoverStyle: __assign(__assign({}, acc.hoverStyle), { type: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
131
- };
132
- }
133
- if (customPaginationPropertyKey === 'offset') {
134
- var value = props[keyWithDevice];
135
- var hoverValue = props[keyWithHover];
136
- return {
137
- normalStyle: __assign(__assign({}, acc.normalStyle), { offset: getCustomPaginationOffset(value) }),
138
- hoverStyle: __assign(__assign({}, acc.hoverStyle), { offset: getCustomPaginationOffset(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) })
139
- };
140
- }
141
- if (customPaginationPropertyKey === 'size') {
142
- var value = props[keyWithDevice];
143
- var hoverValue = props[keyWithHover];
144
- return {
145
- normalStyle: __assign(__assign({}, acc.normalStyle), { size: getCustomPaginationSize(value) }),
146
- hoverStyle: __assign(__assign({}, acc.hoverStyle), { size: getCustomPaginationSize(hoverValue !== null && hoverValue !== void 0 ? hoverValue : value) })
147
- };
93
+ var normalStyle = {};
94
+ var hoverStyle = {};
95
+ var baseKeys = Object.keys(props).filter(function (key) { return !key.includes(':HOVER') && !key.includes(':MOBILE'); });
96
+ baseKeys.forEach(function (baseKey) {
97
+ var _a, _b;
98
+ var customNavKey = getCustomPaginationPropKey(baseKey);
99
+ if (customNavKey) {
100
+ var deviceKey = device === 'DESKTOP' ? baseKey : "".concat(baseKey, ":MOBILE");
101
+ var hoverKey = "".concat(deviceKey, ":HOVER");
102
+ var normalValue = props[deviceKey];
103
+ var hoverValue = props[hoverKey];
104
+ if (normalValue !== undefined) {
105
+ Object.assign(normalStyle, (_a = {}, _a[customNavKey] = normalValue, _a));
106
+ }
107
+ Object.assign(hoverStyle, (_b = {}, _b[customNavKey] = hoverValue !== null && hoverValue !== void 0 ? hoverValue : normalValue, _b));
148
108
  }
149
- if (customPaginationPropertyKey === 'primaryColor') {
150
- var value = props[keyWithDevice];
151
- var hoverValue = props[keyWithHover];
152
- return {
153
- normalStyle: __assign(__assign({}, acc.normalStyle), { primaryColor: value }),
154
- hoverStyle: __assign(__assign({}, acc.hoverStyle), { primaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
155
- };
156
- }
157
- if (customPaginationPropertyKey === 'secondaryColor') {
158
- var value = props[keyWithDevice];
159
- var hoverValue = props[keyWithHover];
160
- return {
161
- normalStyle: __assign(__assign({}, acc.normalStyle), { secondaryColor: value }),
162
- hoverStyle: __assign(__assign({}, acc.hoverStyle), { secondaryColor: hoverValue !== null && hoverValue !== void 0 ? hoverValue : value })
163
- };
164
- }
165
- return {
166
- normalStyle: __assign({}, acc.normalStyle),
167
- hoverStyle: __assign({}, acc.hoverStyle)
168
- };
169
- }, {
170
- normalStyle: {},
171
- hoverStyle: {}
172
109
  });
110
+ return {
111
+ normalStyle: normalStyle,
112
+ hoverStyle: hoverStyle
113
+ };
173
114
  }
174
115
  exports.parsePaginationStyleProp = parsePaginationStyleProp;
175
116
  function getCustomPaginationPropKey(key) {
176
- switch (key) {
177
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSTYLE":
178
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSTYLE:HOVER":
179
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSTYLE:MOBILE":
180
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSTYLE:MOBILE:HOVER":
181
- return 'type';
182
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONLOCATION":
183
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONLOCATION:HOVER":
184
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONLOCATION:MOBILE":
185
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONLOCATION:MOBILE:HOVER":
186
- return 'offset';
187
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSIZE":
188
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSIZE:HOVER":
189
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSIZE:MOBILE":
190
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSIZE:MOBILE:HOVER":
191
- return 'size';
192
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONPRIMARYCOLOR":
193
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONPRIMARYCOLOR:HOVER":
194
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONPRIMARYCOLOR:MOBILE":
195
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONPRIMARYCOLOR:MOBILE:HOVER":
196
- return 'primaryColor';
197
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSECONDARYCOLOR":
198
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSECONDARYCOLOR:HOVER":
199
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSECONDARYCOLOR:MOBILE":
200
- case "CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSECONDARYCOLOR:MOBILE:HOVER":
201
- return 'secondaryColor';
202
- default:
203
- return '';
204
- }
205
- }
206
- exports.getCustomPaginationPropKey = getCustomPaginationPropKey;
207
- function getCustomPaginationOffset(value) {
208
- var OUTSET1 = {
209
- top: '0px',
210
- left: '0px',
211
- translateX: 0,
212
- translateY: -100,
213
- transformOrigin: 'top left'
117
+ var baseKey = key.split(':')[0];
118
+ var keyMapping = {
119
+ CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSTYLE: 'type',
120
+ CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSIZE: 'size',
121
+ CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONLOCATION: 'location',
122
+ CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONPRIMARYCOLOR: 'primaryColor',
123
+ CB_STYLE_PROP_CONTENTSLIST_SPEC_PAGINATIONSECONDARYCOLOR: 'secondaryColor'
214
124
  };
215
- switch (value) {
216
- case 'OUTSET1':
217
- return OUTSET1;
218
- case 'OUTSET2':
219
- return {
220
- top: '0px',
221
- left: '50%',
222
- translateX: -50,
223
- translateY: -100,
224
- transformOrigin: 'top left'
225
- };
226
- case 'OUTSET3':
227
- return {
228
- top: '0px',
229
- left: '100%',
230
- translateX: -100,
231
- translateY: -100,
232
- transformOrigin: 'top left'
233
- };
234
- case 'OUTSET4':
235
- return {
236
- top: '0px',
237
- left: '100%',
238
- translateX: 0,
239
- translateY: 0,
240
- transformOrigin: 'left top'
241
- };
242
- case 'OUTSET5':
243
- return {
244
- top: '50%',
245
- left: '100%',
246
- translateX: 0,
247
- translateY: -50,
248
- transformOrigin: 'left top'
249
- };
250
- case 'OUTSET6':
251
- return {
252
- top: '100%',
253
- left: '100%',
254
- translateX: 0,
255
- translateY: -100,
256
- transformOrigin: 'left top'
257
- };
258
- case 'OUTSET7':
259
- return {
260
- top: '100%',
261
- left: '100%',
262
- translateX: -100,
263
- translateY: 0,
264
- transformOrigin: 'top left'
265
- };
266
- case 'OUTSET8':
267
- return {
268
- top: '100%',
269
- left: '50%',
270
- translateX: -50,
271
- translateY: 0,
272
- transformOrigin: 'top left'
273
- };
274
- case 'OUTSET9':
275
- return {
276
- top: '100%',
277
- left: '0px',
278
- translateX: 0,
279
- translateY: 0,
280
- transformOrigin: 'top left'
281
- };
282
- case 'OUTSET10':
283
- return {
284
- top: '100%',
285
- left: '0px',
286
- translateX: -100,
287
- translateY: -100,
288
- transformOrigin: 'right top'
289
- };
290
- case 'OUTSET11':
291
- return {
292
- top: '50%',
293
- left: '0px',
294
- translateX: -100,
295
- translateY: -50,
296
- transformOrigin: 'right top'
297
- };
298
- case 'OUTSET12':
299
- return {
300
- top: '0px',
301
- left: '0px',
302
- translateX: -100,
303
- translateY: 0,
304
- transformOrigin: 'right top'
305
- };
306
- case 'INSET1':
307
- return { top: '0px', left: '0px', translateX: 0, translateY: 0, transformOrigin: 'left top' };
308
- case 'INSET2':
309
- return {
310
- top: '0px',
311
- left: '50%',
312
- translateX: -50,
313
- translateY: 0,
314
- transformOrigin: 'left top'
315
- };
316
- case 'INSET3':
317
- return {
318
- top: '0px',
319
- left: '100%',
320
- translateX: -100,
321
- translateY: 0,
322
- transformOrigin: 'left top'
323
- };
324
- case 'INSET4':
325
- return {
326
- top: '50%',
327
- left: '100%',
328
- translateX: -100,
329
- translateY: -50,
330
- transformOrigin: 'left top'
331
- };
332
- case 'INSET5':
333
- return {
334
- top: '100%',
335
- left: '100%',
336
- translateX: -100,
337
- translateY: -100,
338
- transformOrigin: 'left top'
339
- };
340
- case 'INSET6':
341
- return {
342
- top: '100%',
343
- left: '50%',
344
- translateX: -50,
345
- translateY: -100,
346
- transformOrigin: 'left top'
347
- };
348
- case 'INSET7':
349
- return {
350
- top: '100%',
351
- left: '0px',
352
- translateX: 0,
353
- translateY: -100,
354
- transformOrigin: 'top left'
355
- };
356
- case 'INSET8':
357
- return {
358
- top: '50%',
359
- left: '0px',
360
- translateX: 0,
361
- translateY: -50,
362
- transformOrigin: 'top left'
363
- };
364
- default:
365
- return OUTSET1;
366
- }
125
+ return keyMapping[baseKey] || null;
367
126
  }
368
- function getCustomPaginationSize(value) {
369
- switch (value) {
370
- case 'SMALL':
371
- return 1;
372
- case 'MEDIUM':
373
- return 1.5;
374
- case 'LARGE':
375
- return 2;
376
- default:
377
- return 1;
378
- }
379
- }
380
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17;
127
+ exports.getCustomPaginationPropKey = getCustomPaginationPropKey;
128
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
@@ -0,0 +1,23 @@
1
+ /// <reference types="react" />
2
+ import type { INSET_POSTIION, OUTSET_POSTIION } from '../types';
3
+ import type { CSSProperties } from 'styled-components';
4
+ type ElementsProps = {
5
+ type: string;
6
+ position: OUTSET_POSTIION | INSET_POSTIION;
7
+ };
8
+ export declare const useFlexGridLayout: ({ paginationLocation }: {
9
+ paginationLocation: OUTSET_POSTIION | INSET_POSTIION;
10
+ }) => {
11
+ layoutRef: import("react").MutableRefObject<HTMLDivElement | null>;
12
+ positionRefs: import("react").MutableRefObject<Record<string, HTMLDivElement | null>>;
13
+ ccbInset: {
14
+ top: string;
15
+ right: string;
16
+ bottom: string;
17
+ left: string;
18
+ };
19
+ componentGroups: Record<string, ElementsProps[]>;
20
+ getPositionStyle: (position: string, ccbInset: Record<string, string>) => CSSProperties;
21
+ getComponentGroupLayout: (components: ElementsProps[], position: string) => CSSProperties;
22
+ };
23
+ export {};