pds-dev-kit-web-test 2.7.242 → 2.7.243

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 (5) hide show
  1. package/dist/src/sub/DynamicLayout/mock_slideBanner.js +2 -2
  2. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/elementPositions.d.ts +1 -3
  3. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/elementPositions.js +34 -42
  4. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/useFlexGridLayout.js +13 -7
  5. package/package.json +1 -1
package/dist/src/sub/DynamicLayout/mock_slideBanner.js CHANGED
@@ -4535,7 +4535,7 @@ exports.SAMPLE_SLIDEBANNER_CB = {
4535
4535
  'CB_STYLE_PROP_SHADOW_SPEC_Y:MOBILE:HOVER': null
4536
4536
  },
4537
4537
  CB_STYLE_PROP_SLIDEBANNERBUTTON: {
4538
- CB_STYLE_PROP_SLIDEBANNERBUTTON_SPEC_NEXTBTNLOCATION: 'OUTSET5',
4538
+ CB_STYLE_PROP_SLIDEBANNERBUTTON_SPEC_NEXTBTNLOCATION: 'OUTSET1',
4539
4539
  'CB_STYLE_PROP_SLIDEBANNERBUTTON_SPEC_NEXTBTNLOCATION:MOBILE': null,
4540
4540
  CB_STYLE_PROP_SLIDEBANNERBUTTON_SPEC_NEXTBTNPRIMARYCOLOR: '#7CEC0DFC',
4541
4541
  'CB_STYLE_PROP_SLIDEBANNERBUTTON_SPEC_NEXTBTNPRIMARYCOLOR:HOVER': null,
@@ -4569,7 +4569,7 @@ exports.SAMPLE_SLIDEBANNER_CB = {
4569
4569
  'CB_STYLE_PROP_SLIDEBANNERDESIGN_SPEC_STYLE:MOBILE': null
4570
4570
  },
4571
4571
  CB_STYLE_PROP_SLIDEBANNERPAGINATION: {
4572
- CB_STYLE_PROP_SLIDEBANNERPAGINATION_SPEC_PAGINATIONLOCATION: 'OUTSET5',
4572
+ CB_STYLE_PROP_SLIDEBANNERPAGINATION_SPEC_PAGINATIONLOCATION: 'OUTSET1',
4573
4573
  'CB_STYLE_PROP_SLIDEBANNERPAGINATION_SPEC_PAGINATIONLOCATION:MOBILE': null,
4574
4574
  CB_STYLE_PROP_SLIDEBANNERPAGINATION_SPEC_PAGINATIONPRIMARYCOLOR: '#A500CFF0',
4575
4575
  'CB_STYLE_PROP_SLIDEBANNERPAGINATION_SPEC_PAGINATIONPRIMARYCOLOR:MOBILE': null,
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/elementPositions.d.ts CHANGED
@@ -1,8 +1,6 @@
1
1
  import type { SlideBannerElementsProps } from '../SlideBanner';
2
2
  import type { CSSProperties } from 'styled-components';
3
- export declare function getPosition(position: string, designType: string, size: string, elementType: SlideBannerElementsProps['type'] | 'GROUP', { ccbWidth }: {
4
- ccbWidth?: number;
5
- }): CSSProperties;
3
+ export declare function getPosition(position: string, designType: string, size: string, elementType: SlideBannerElementsProps['type'] | 'GROUP'): CSSProperties;
6
4
  export declare const POS_OUTSET_PAGINATION: Record<string, Record<string, Record<string, CSSProperties>>>;
7
5
  export declare const POS_INSET: Record<string, Record<string, CSSProperties>>;
8
6
  export declare const POS_OUTSET_NAVIGATION: Record<string, Record<string, CSSProperties>>;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/elementPositions.js CHANGED
@@ -2,23 +2,14 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.POS_OUTSET_NAVIGATION = exports.POS_INSET = exports.POS_OUTSET_PAGINATION = exports.getPosition = void 0;
4
4
  var GAP = 8;
5
- // DESIGN1
6
- // DESIGN5
7
- // DESIGN9
8
- // DESIGN13
9
- // DESIGN9
10
- // DESIGN11
11
- // DESIGN13
12
- // DESIGN15
13
- function getPosition(position, designType, size, elementType, _a) {
14
- var _b, _c;
15
- var ccbWidth = _a.ccbWidth;
5
+ function getPosition(position, designType, size, elementType) {
6
+ var _a, _b;
16
7
  if (position.startsWith('OUTSET')) {
17
8
  if (elementType === 'GROUP') {
18
9
  return POS_OUTSET_GROUP[position];
19
10
  }
20
11
  if (elementType === 'PROGRESSBAR') {
21
- return (_b = exports.POS_INSET[position]) === null || _b === void 0 ? void 0 : _b.LARGE;
12
+ return (_a = exports.POS_INSET[position]) === null || _a === void 0 ? void 0 : _a.LARGE;
22
13
  }
23
14
  if (elementType === 'NEXT' || elementType === 'PREV') {
24
15
  return exports.POS_OUTSET_NAVIGATION[position][size];
@@ -28,7 +19,7 @@ function getPosition(position, designType, size, elementType, _a) {
28
19
  // return POS_OUTSET_PAGINATION[position][designType][size];
29
20
  }
30
21
  if (elementType === 'GROUP') {
31
- return (_c = exports.POS_INSET[position]) === null || _c === void 0 ? void 0 : _c.LARGE;
22
+ return (_b = exports.POS_INSET[position]) === null || _b === void 0 ? void 0 : _b.LARGE;
32
23
  }
33
24
  return {};
34
25
  }
@@ -39,44 +30,44 @@ exports.POS_OUTSET_PAGINATION = {
39
30
  //--------------------------------------------------
40
31
  OUTSET1: {
41
32
  DESIGN1: {
42
- LARGE: { top: -50, left: 0 },
43
- MEDIUM: { top: -45, left: 0 },
44
- SMALL: { top: -40, left: 0 }
33
+ LARGE: { top: -50 },
34
+ MEDIUM: { top: -45 },
35
+ SMALL: { top: -40 }
45
36
  },
46
37
  DESIGN3: {
47
- LARGE: { top: -50, left: 0 },
48
- MEDIUM: { top: -45, left: 0 },
49
- SMALL: { top: -40, left: 0 }
38
+ LARGE: { top: -50 },
39
+ MEDIUM: { top: -45 },
40
+ SMALL: { top: -40 }
50
41
  },
51
42
  DESIGN5: {
52
- LARGE: { top: -50, left: 0 },
53
- MEDIUM: { top: -45, left: 0 },
54
- SMALL: { top: -40, left: 0 }
43
+ LARGE: { top: -50 },
44
+ MEDIUM: { top: -45 },
45
+ SMALL: { top: -40 }
55
46
  },
56
47
  DESIGN7: {
57
- LARGE: { top: -50, left: 0 },
58
- MEDIUM: { top: -45, left: 0 },
59
- SMALL: { top: -40, left: 0 }
48
+ LARGE: { top: -50 },
49
+ MEDIUM: { top: -45 },
50
+ SMALL: { top: -40 }
60
51
  },
61
52
  DESIGN9: {
62
- LARGE: { top: -85, left: 0 },
63
- MEDIUM: { top: -80, left: 0 },
64
- SMALL: { top: -75, left: 0 }
53
+ LARGE: { top: -85 },
54
+ MEDIUM: { top: -80 },
55
+ SMALL: { top: -75 }
65
56
  },
66
57
  DESIGN11: {
67
- LARGE: { top: -35, left: 0 },
68
- MEDIUM: { top: -30, left: 0 },
69
- SMALL: { top: -25, left: 0 }
58
+ LARGE: { top: -35 },
59
+ MEDIUM: { top: -30 },
60
+ SMALL: { top: -25 }
70
61
  },
71
62
  DESIGN13: {
72
- LARGE: { top: -85, left: 0 },
73
- MEDIUM: { top: -80, left: 0 },
74
- SMALL: { top: -75, left: 0 }
63
+ LARGE: { top: -85 },
64
+ MEDIUM: { top: -80 },
65
+ SMALL: { top: -75 }
75
66
  },
76
67
  DESIGN15: {
77
- LARGE: { top: -25, left: 0 },
78
- MEDIUM: { top: -25, left: 0 },
79
- SMALL: { top: -20, left: 0 }
68
+ LARGE: { top: -25 },
69
+ MEDIUM: { top: -25 },
70
+ SMALL: { top: -20 }
80
71
  }
81
72
  },
82
73
  //--------------------------------------------------
@@ -624,9 +615,9 @@ exports.POS_OUTSET_NAVIGATION = {
624
615
  SMALL: { top: -50, left: 0 }
625
616
  },
626
617
  OUTSET2: {
627
- LARGE: { top: -95, left: 'center', transform: 'translateX(-50%)' },
628
- MEDIUM: { top: -60, left: 'center', transform: 'translateX(-50%)' },
629
- SMALL: { top: -50, left: 'center', transform: 'translateX(-50%)' }
618
+ LARGE: { top: -95 },
619
+ MEDIUM: { top: -60 },
620
+ SMALL: { top: -50 }
630
621
  },
631
622
  OUTSET3: {
632
623
  LARGE: { top: -95, right: 0 },
@@ -681,7 +672,7 @@ exports.POS_OUTSET_NAVIGATION = {
681
672
  };
682
673
  var POS_OUTSET_GROUP = {
683
674
  OUTSET1: {
684
- bottom: '100%',
675
+ top: 0,
685
676
  height: 0
686
677
  },
687
678
  OUTSET2: {
@@ -693,7 +684,8 @@ var POS_OUTSET_GROUP = {
693
684
  OUTSET3: {
694
685
  bottom: '100%',
695
686
  height: 0,
696
- right: 0
687
+ right: 0,
688
+ justifyContent: 'flex-start'
697
689
  },
698
690
  OUTSET4: {
699
691
  top: 0,
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/SlideBanner/hooks/useFlexGridLayout.js CHANGED
@@ -62,11 +62,19 @@ var useFlexGridLayout = function (_a) {
62
62
  };
63
63
  // 위치에 따른 스타일 결정 (CCB 크기를 고려)
64
64
  var getPositionStyle = function (position, ccbInset, designType, size, elementType) {
65
+ var EAST = ['OUTSET4', 'OUTSET5', 'OUTSET6'];
66
+ var WEST = ['OUTSET10', 'OUTSET11', 'OUTSET12'];
67
+ var SOUTH = ['OUTSET7', 'OUTSET8', 'OUTSET9'];
68
+ var NORTH = ['OUTSET1', 'OUTSET2', 'OUTSET3'];
69
+ var isEAST = EAST.includes(position);
70
+ var isWEST = WEST.includes(position);
71
+ var isSOUTH = SOUTH.includes(position);
72
+ var isNORTH = NORTH.includes(position);
65
73
  var base = {
66
- position: position.startsWith('OUTSET') ? 'absolute' : 'relative',
74
+ position: 'relative',
67
75
  display: 'flex',
68
- alignItems: 'center',
69
- justifyContent: 'center'
76
+ alignItems: isSOUTH ? 'flex-start' : isNORTH ? 'flex-end' : 'center',
77
+ justifyContent: isEAST ? 'flex-start' : isWEST ? 'flex-end' : 'center'
70
78
  };
71
79
  // CCB의 중앙 위치 계산
72
80
  var ccbTop = parseFloat(ccbInset.top) || 0;
@@ -104,7 +112,7 @@ var useFlexGridLayout = function (_a) {
104
112
  INSET7: { bottom: ccbBottom + GAP, left: ccbLeft + GAP },
105
113
  INSET8: { top: "".concat(ccbCenterY, "px"), left: ccbLeft + GAP, transform: 'translateY(-50%)' }
106
114
  };
107
- var pos = (0, elementPositions_1.getPosition)(position, designType, size, elementType, { ccbWidth: ccbWidth });
115
+ var pos = (0, elementPositions_1.getPosition)(position, designType, size, elementType);
108
116
  return __assign(__assign({}, base), pos);
109
117
  };
110
118
  // 컴포넌트 그룹 레이아웃
@@ -131,9 +139,7 @@ var useFlexGridLayout = function (_a) {
131
139
  return {
132
140
  display: 'flex',
133
141
  flexDirection: isHorizontal ? 'row' : 'column',
134
- gap: '8px',
135
- alignItems: 'center',
136
- width: 'inherit'
142
+ gap: '8px'
137
143
  };
138
144
  };
139
145
  // ccbInset 계산
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "2.7.242",
3
+ "version": "2.7.243",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",