pds-dev-kit-web 1.8.2 → 1.8.4

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 (11) hide show
  1. package/dist/src/common/styles/colorSet/PaletteColor_Dark.json +4 -1
  2. package/dist/src/common/styles/colorSet/PaletteColor_light.json +4 -1
  3. package/dist/src/common/styles/colorSet/UIColor.json +5 -3
  4. package/dist/src/common/styles/colorSet/index.d.ts +10 -2
  5. package/dist/src/common/styles/colorSet/index.js +2 -2
  6. package/dist/src/common/styles/colorSet/ui-type.d.ts +2 -0
  7. package/dist/src/sub/DynamicLayout/desktop/sections/ContentsSection/templates/TemplateA/TemplateA.js +6 -5
  8. package/dist/src/sub/DynamicLayout/desktop/sections/ContentsSection/templates/TemplateB/TemplateB.js +7 -6
  9. package/dist/src/sub/DynamicLayout/desktop/sections/InfoBoxSection/templates/TemplateA/TemplateA.js +2 -2
  10. package/package.json +1 -1
  11. package/release-note.md +3 -20
package/dist/src/common/styles/colorSet/PaletteColor_Dark.json CHANGED
@@ -228,5 +228,8 @@
228
228
  "sys_component_base_19": "white/opacity65",
229
229
  "sys_cpnt_pagination_dot_01": "white",
230
230
  "sys_cpnt_pagination_dot_02": "white/opacity50",
231
- "sys_component_base_white_opacity50": "white/opacity50"
231
+ "sys_component_base_white_opacity50": "white/opacity50",
232
+ "sys_component_base_20": "white/opacity08",
233
+ "sys_component_base_22": "grey950",
234
+ "sys_component_base_21": "darkred500/opacity40"
232
235
  }
package/dist/src/common/styles/colorSet/PaletteColor_light.json CHANGED
@@ -228,5 +228,8 @@
228
228
  "sys_component_base_19": "white/opacity65",
229
229
  "sys_cpnt_pagination_dot_01": "grey400",
230
230
  "sys_cpnt_pagination_dot_02": "white/opacity50",
231
- "sys_component_base_white_opacity50": "white/opacity50"
231
+ "sys_component_base_white_opacity50": "white/opacity50",
232
+ "sys_component_base_20": "white/opacity08",
233
+ "sys_component_base_22": "grey950",
234
+ "sys_component_base_21": "red500/opacity40"
232
235
  }
package/dist/src/common/styles/colorSet/UIColor.json CHANGED
@@ -645,8 +645,10 @@
645
645
  "ui_cpnt_refund_text_status_issued": "sys_widget_orange_01",
646
646
  "ui_cpnt_refund_text_status_refunded": "sys_widget_success_01",
647
647
  "ui_cpnt_divider_white_01": "sys_component_base_19",
648
- "ui_cpnt_timer_base_01": "sys_background_dimmed",
649
- "ui_cpnt_timer_base_timeup": "sys_component_base_17",
648
+ "ui_cpnt_timer_base_01": "sys_component_base_20",
649
+ "ui_cpnt_timer_base_timeup": "sys_component_base_21",
650
650
  "ui_66": "sys_component_base_black_opacity50",
651
- "ui_67": "sys_component_base_white_opacity50"
651
+ "ui_67": "sys_component_base_white_opacity50",
652
+ "ui_cpnt_videoplayer_gradient_3": "sys_component_base_black_opacity50",
653
+ "ui_68": "sys_component_base_22"
652
654
  }
package/dist/src/common/styles/colorSet/index.d.ts CHANGED
@@ -79,7 +79,7 @@ declare const colorSet: {
79
79
  opacity90: string;
80
80
  facebookblue: string;
81
81
  };
82
- readonly PaletteColor_Dark: {
82
+ readonly PaletteColor_light: {
83
83
  sys_container_background_01: string;
84
84
  sys_container_background_02: string;
85
85
  sys_container_background_03: string;
@@ -310,8 +310,11 @@ declare const colorSet: {
310
310
  sys_cpnt_pagination_dot_01: string;
311
311
  sys_cpnt_pagination_dot_02: string;
312
312
  sys_component_base_white_opacity50: string;
313
+ sys_component_base_20: string;
314
+ sys_component_base_22: string;
315
+ sys_component_base_21: string;
313
316
  };
314
- readonly PaletteColor_light: {
317
+ readonly PaletteColor_Dark: {
315
318
  sys_container_background_01: string;
316
319
  sys_container_background_02: string;
317
320
  sys_container_background_03: string;
@@ -542,6 +545,9 @@ declare const colorSet: {
542
545
  sys_cpnt_pagination_dot_01: string;
543
546
  sys_cpnt_pagination_dot_02: string;
544
547
  sys_component_base_white_opacity50: string;
548
+ sys_component_base_20: string;
549
+ sys_component_base_22: string;
550
+ sys_component_base_21: string;
545
551
  };
546
552
  readonly UIColor: {
547
553
  ui_cpnt_button_fill_base_primary: string;
@@ -1194,6 +1200,8 @@ declare const colorSet: {
1194
1200
  ui_cpnt_timer_base_timeup: string;
1195
1201
  ui_66: string;
1196
1202
  ui_67: string;
1203
+ ui_cpnt_videoplayer_gradient_3: string;
1204
+ ui_68: string;
1197
1205
  };
1198
1206
  };
1199
1207
  export default colorSet;
package/dist/src/common/styles/colorSet/index.js CHANGED
@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  /* eslint-disable import/order */
7
7
  var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
8
- var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
9
8
  var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
9
+ var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
10
10
  var UIColor_json_1 = __importDefault(require("./UIColor.json"));
11
11
  var colorSet = {
12
12
  SemanticColor: SemanticColor_json_1.default,
13
- PaletteColor_Dark: PaletteColor_Dark_json_1.default,
14
13
  PaletteColor_light: PaletteColor_light_json_1.default,
14
+ PaletteColor_Dark: PaletteColor_Dark_json_1.default,
15
15
  UIColor: UIColor_json_1.default
16
16
  };
17
17
  exports.default = colorSet;
package/dist/src/common/styles/colorSet/ui-type.d.ts CHANGED
@@ -649,4 +649,6 @@ export interface UITheme {
649
649
  ui_cpnt_timer_base_timeup: string;
650
650
  ui_66: string;
651
651
  ui_67: string;
652
+ ui_cpnt_videoplayer_gradient_3: string;
653
+ ui_68: string;
652
654
  }
package/dist/src/sub/DynamicLayout/desktop/sections/ContentsSection/templates/TemplateA/TemplateA.js CHANGED
@@ -36,19 +36,20 @@ function TemplateA() {
36
36
  var hasNothing = !sectionContentMediaSrc && !title && !description && !buttonAlphaLinkSrc;
37
37
  var imageBoxRef = (0, react_1.useRef)(null);
38
38
  var contentsBodyRef = (0, react_1.useRef)(null);
39
- var handleResize = function () {
39
+ var handleImageHeight = function () {
40
40
  var imageBox = imageBoxRef.current;
41
41
  var contentsBody = contentsBodyRef.current;
42
42
  if (!imageBox || !contentsBody)
43
43
  return;
44
44
  imageBox.style.height = contentsBody.offsetHeight + "px";
45
45
  };
46
- (0, react_1.useEffect)(function () {
47
- window.addEventListener('resize', handleResize);
46
+ (0, react_1.useLayoutEffect)(function () {
47
+ handleImageHeight();
48
+ window.addEventListener('resize', handleImageHeight);
48
49
  return function () {
49
- window.removeEventListener('resize', handleResize);
50
+ window.removeEventListener('resize', handleImageHeight);
50
51
  };
51
- }, [contentsBodyRef]);
52
+ }, [imageBoxRef, contentsBodyRef]);
52
53
  return (react_1.default.createElement(S_ContentsAreaBox, { hasNothing: hasNothing },
53
54
  react_1.default.createElement(S_ContentsArea, null,
54
55
  sectionContentMediaSrc && (react_1.default.createElement(react_1.default.Fragment, null, sectionContentMediaType === 'IMAGE' && (react_1.default.createElement(S_ImageBox, { ref: imageBoxRef },
package/dist/src/sub/DynamicLayout/desktop/sections/ContentsSection/templates/TemplateB/TemplateB.js CHANGED
@@ -36,19 +36,20 @@ function TemplateB() {
36
36
  var hasNothing = !sectionContentMediaSrc && !title && !description && !buttonAlphaLinkSrc;
37
37
  var imageBoxRef = (0, react_1.useRef)(null);
38
38
  var contentsBodyRef = (0, react_1.useRef)(null);
39
- var handleResize = function () {
39
+ var handleImageHeight = function () {
40
40
  var imageBox = imageBoxRef.current;
41
41
  var contentsBody = contentsBodyRef.current;
42
42
  if (!imageBox || !contentsBody)
43
43
  return;
44
44
  imageBox.style.height = contentsBody.offsetHeight + "px";
45
45
  };
46
- (0, react_1.useEffect)(function () {
47
- window.addEventListener('resize', handleResize);
46
+ (0, react_1.useLayoutEffect)(function () {
47
+ handleImageHeight();
48
+ window.addEventListener('resize', handleImageHeight);
48
49
  return function () {
49
- window.removeEventListener('resize', handleResize);
50
+ window.removeEventListener('resize', handleImageHeight);
50
51
  };
51
- }, [contentsBodyRef]);
52
+ }, [imageBoxRef, contentsBodyRef]);
52
53
  return (react_1.default.createElement(S_ContentsAreaBox, { hasNothing: hasNothing },
53
54
  react_1.default.createElement(S_ContentsArea, null,
54
55
  react_1.default.createElement(S_ContentsBodyWrapper, null,
@@ -58,7 +59,7 @@ function TemplateB() {
58
59
  react_1.default.createElement(Section_1.Section.Description, { text: description, color: descriptionColorInHex, customFontSize: "20px", fontWeight: "600" }))),
59
60
  buttonAlphaLinkSrc && (react_1.default.createElement(S_ButtonBox, { hasTitle: !!title, hasDescription: !!description },
60
61
  react_1.default.createElement(Section_1.Section.Button, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }))))),
61
- sectionContentMediaSrc && (react_1.default.createElement(react_1.default.Fragment, null, sectionContentMediaType === 'IMAGE' && (react_1.default.createElement(S_ImageBox, null,
62
+ sectionContentMediaSrc && (react_1.default.createElement(react_1.default.Fragment, null, sectionContentMediaType === 'IMAGE' && (react_1.default.createElement(S_ImageBox, { ref: imageBoxRef },
62
63
  react_1.default.createElement(Section_1.Section.Image, { src: sectionContentMediaSrc, width: "responsive", height: "responsive", scaleType: "cover", shapeType: "rectangle" }))))))));
63
64
  }
64
65
  var S_ContentsAreaBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 100%;\n display: flex;\n justify-content: center;\n margin: ", " 0;\n"], ["\n width: 100%;\n display: flex;\n justify-content: center;\n margin: ", " 0;\n"])), function (_a) {
package/dist/src/sub/DynamicLayout/desktop/sections/InfoBoxSection/templates/TemplateA/TemplateA.js CHANGED
@@ -88,9 +88,9 @@ var S_ItemsWrapper = styled_components_1.default.div(templateObject_3 || (templa
88
88
  var theme = _a.theme;
89
89
  return theme.spacing.spacingH;
90
90
  });
91
- var S_ItemWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n width: calc(100% / ", ");\n ", ";\n\n &:not(:first-child) {\n margin-left: ", ";\n }\n"], ["\n width: calc(100% / ", ");\n ", ";\n\n &:not(:first-child) {\n margin-left: ", ";\n }\n"])), function (_a) {
91
+ var S_ItemWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n width: calc(\n ", "\n );\n ", ";\n\n &:not(:first-child) {\n margin-left: ", ";\n }\n"], ["\n width: calc(\n ", "\n );\n ", ";\n\n &:not(:first-child) {\n margin-left: ", ";\n }\n"])), function (_a) {
92
92
  var totalItems = _a.totalItems;
93
- return totalItems;
93
+ return 100 / totalItems + "% - " + (32 * (totalItems - 1)) / totalItems + "px";
94
94
  }, function (_a) {
95
95
  var totalItems = _a.totalItems;
96
96
  return totalItems <= 2 && "max-width: 360px;";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.8.2",
3
+ "version": "1.8.4",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,22 +1,5 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.8.2]
2
+ ## [v1.8.4]
3
3
 
4
- ### component
5
- * DynamicDesktopNavBar
6
- * NAV_PAGE 대응 추가
7
- * Icon
8
- * ic_more의 viewBox를 0 0 20 20 에서 0 0 24 24로 변경
9
- ### sub
10
- * DynamicLayout 디테일 수정
11
- * Desktop
12
- * FooterSection TemplateA/B
13
- * logoImage의 shapeType을 rectangle로 변경 (누락된 부분 추가)
14
- * IntroSection TemplateB
15
- * contentsArea가 섹션을 뚫고 나가는 이슈 수정
16
- * ContentsSection TemplateA
17
- * Image사이즈가 contents에 따라 늘어나지 않는 이슈 수정
18
- * item의 linkMethod를 section properties로 이동 (itemLinkMethod)
19
- * Mobile
20
- * item의 linkMethod를 section properties로 이동 (itemLinkMethod)
21
- ### color
22
- * 컬러 키 값 23.01.06 12시 59분 기준 싱크
4
+ ### Color
5
+ * 컬러 키 값 23.01.10 15시 30분 기준 싱크