pds-dev-kit-web 1.3.19 → 1.3.22

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 (19) 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 +68 -60
  5. package/dist/src/common/styles/colorSet/index.js +4 -4
  6. package/dist/src/common/styles/colorSet/ui-type.d.ts +2 -0
  7. package/dist/src/desktop/common/components/TextFieldBase/TextFieldBase.js +1 -1
  8. package/dist/src/desktop/components/BasicListItem/BasicListItem.js +1 -1
  9. package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js +2 -2
  10. package/dist/src/desktop/components/IconButton/IconButton.d.ts +4 -3
  11. package/dist/src/desktop/components/IconButton/IconButton.js +2 -2
  12. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTS.js +2 -1
  13. package/dist/src/mobile/common/components/TextFieldBase/TextFieldBase.js +1 -1
  14. package/dist/src/mobile/components/BasicListItem/BasicListItem.js +1 -1
  15. package/dist/src/mobile/components/Checkbox/Checkbox.js +2 -2
  16. package/dist/src/mobile/components/IconButton/IconButton.d.ts +4 -3
  17. package/dist/src/mobile/components/IconButton/IconButton.js +2 -2
  18. package/package.json +1 -1
  19. package/release-note.md +7 -17
package/dist/src/common/styles/colorSet/PaletteColor_Dark.json CHANGED
@@ -153,5 +153,8 @@
153
153
  "usr_menu_background_gradient_opacity00": "grey950/opacity00",
154
154
  "sys_border_line_white": "white",
155
155
  "sys_component_base_white_opacity10": "white/opacity10",
156
- "sys_cpnt_sheet_base_01": "darkgrey50"
156
+ "sys_cpnt_sheet_base_01": "darkgrey50",
157
+ "sys_component_base_white_opacity20": "white/opacity20",
158
+ "sys_border_line_07": "darkgrey70",
159
+ "sys_border_line_white_opacity50": "white/opacity50"
157
160
  }
package/dist/src/common/styles/colorSet/PaletteColor_light.json CHANGED
@@ -153,5 +153,8 @@
153
153
  "usr_menu_background_gradient_opacity00": "white/opacity00",
154
154
  "sys_border_line_white": "white",
155
155
  "sys_component_base_white_opacity10": "white/opacity10",
156
- "sys_cpnt_sheet_base_01": "grey30"
156
+ "sys_cpnt_sheet_base_01": "grey30",
157
+ "sys_component_base_white_opacity20": "white/opacity20",
158
+ "sys_border_line_07": "grey70",
159
+ "sys_border_line_white_opacity50": "white/opacity50"
157
160
  }
package/dist/src/common/styles/colorSet/UIColor.json CHANGED
@@ -359,7 +359,7 @@
359
359
  "ui_papp_live_background": "sys_papp_live_background",
360
360
  "ui_community_pagination_base_area": "sys_component_base_02",
361
361
  "ui_cpnt_contextmenu_border": "sys_border_line_01",
362
- "ui_profile_image_border": "sys_border_line_01",
362
+ "ui_profile_image_border": "sys_border_line_07",
363
363
  "ui_cpnt_alertdialog_border": "sys_border_line_01",
364
364
  "ui_cpnt_modal_border": "sys_border_line_01",
365
365
  "ui_cpnt_card_border": "sys_border_line_01",
@@ -486,6 +486,8 @@
486
486
  "ui_cpnt_dropdown_text_white_hint": "sys_text_white",
487
487
  "ui_cpnt_dropdown_icon_white_default": "sys_widget_white",
488
488
  "ui_cpnt_dropdown_border_white_focus": "sys_border_line_03",
489
- "ui_cpnt_dropdown_base_white_normal": "sys_component_base_white_opacity10",
490
- "ui_profile_image_border_brandprimary": "usr_brand_primary"
489
+ "ui_cpnt_dropdown_base_white_normal": "sys_component_base_white_opacity00",
490
+ "ui_profile_image_border_brandprimary": "usr_brand_primary",
491
+ "ui_cpnt_dropdown_base_white_disabled": "sys_component_base_white_opacity10",
492
+ "ui_cpnt_dropdown_border_white_disabled": "sys_border_line_white_opacity50"
491
493
  }
package/dist/src/common/styles/colorSet/index.d.ts CHANGED
@@ -1,63 +1,5 @@
1
1
  declare const colorSet: {
2
- readonly SemanticColor: {
3
- blue500: string;
4
- blue700: string;
5
- blue300: string;
6
- green700: string;
7
- green500: string;
8
- green300: string;
9
- red500: string;
10
- grey900: string;
11
- grey500: string;
12
- grey400: string;
13
- grey100: string;
14
- grey50: string;
15
- white: string;
16
- black: string;
17
- darkblue500: string;
18
- grey950: string;
19
- darkgrey900: string;
20
- darkgrey500: string;
21
- darkgrey400: string;
22
- darkgrey100: string;
23
- darkgrey50: string;
24
- darkred500: string;
25
- darkgreen700: string;
26
- orange500: string;
27
- darkorange500: string;
28
- opacity00: string;
29
- opacity20: string;
30
- opacity30: string;
31
- opacity65: string;
32
- darkgreen500: string;
33
- grey70: string;
34
- navy500: string;
35
- lightgreen500: string;
36
- pink500: string;
37
- darkgrey70: string;
38
- darknavy500: string;
39
- darkpink500: string;
40
- darklightgreen500: string;
41
- opacity10: string;
42
- grey600: string;
43
- darkgrey600: string;
44
- skyblue500: string;
45
- skyblue300: string;
46
- pink300: string;
47
- lightpink500: string;
48
- darkblue300: string;
49
- darkblue700: string;
50
- darkgreen300: string;
51
- darkskyblue500: string;
52
- navy100: string;
53
- darknavy100: string;
54
- opacity80: string;
55
- opacity50: string;
56
- grey30: string;
57
- opacity95: string;
58
- darkgrey30: string;
59
- };
60
- readonly PaletteColor_light: {
2
+ readonly PaletteColor_Dark: {
61
3
  sys_container_background_01: string;
62
4
  sys_container_background_02: string;
63
5
  sys_container_background_03: string;
@@ -213,8 +155,11 @@ declare const colorSet: {
213
155
  sys_border_line_white: string;
214
156
  sys_component_base_white_opacity10: string;
215
157
  sys_cpnt_sheet_base_01: string;
158
+ sys_component_base_white_opacity20: string;
159
+ sys_border_line_07: string;
160
+ sys_border_line_white_opacity50: string;
216
161
  };
217
- readonly PaletteColor_Dark: {
162
+ readonly PaletteColor_light: {
218
163
  sys_container_background_01: string;
219
164
  sys_container_background_02: string;
220
165
  sys_container_background_03: string;
@@ -370,6 +315,67 @@ declare const colorSet: {
370
315
  sys_border_line_white: string;
371
316
  sys_component_base_white_opacity10: string;
372
317
  sys_cpnt_sheet_base_01: string;
318
+ sys_component_base_white_opacity20: string;
319
+ sys_border_line_07: string;
320
+ sys_border_line_white_opacity50: string;
321
+ };
322
+ readonly SemanticColor: {
323
+ blue500: string;
324
+ blue700: string;
325
+ blue300: string;
326
+ green700: string;
327
+ green500: string;
328
+ green300: string;
329
+ red500: string;
330
+ grey900: string;
331
+ grey500: string;
332
+ grey400: string;
333
+ grey100: string;
334
+ grey50: string;
335
+ white: string;
336
+ black: string;
337
+ darkblue500: string;
338
+ grey950: string;
339
+ darkgrey900: string;
340
+ darkgrey500: string;
341
+ darkgrey400: string;
342
+ darkgrey100: string;
343
+ darkgrey50: string;
344
+ darkred500: string;
345
+ darkgreen700: string;
346
+ orange500: string;
347
+ darkorange500: string;
348
+ opacity00: string;
349
+ opacity20: string;
350
+ opacity30: string;
351
+ opacity65: string;
352
+ darkgreen500: string;
353
+ grey70: string;
354
+ navy500: string;
355
+ lightgreen500: string;
356
+ pink500: string;
357
+ darkgrey70: string;
358
+ darknavy500: string;
359
+ darkpink500: string;
360
+ darklightgreen500: string;
361
+ opacity10: string;
362
+ grey600: string;
363
+ darkgrey600: string;
364
+ skyblue500: string;
365
+ skyblue300: string;
366
+ pink300: string;
367
+ lightpink500: string;
368
+ darkblue300: string;
369
+ darkblue700: string;
370
+ darkgreen300: string;
371
+ darkskyblue500: string;
372
+ navy100: string;
373
+ darknavy100: string;
374
+ opacity80: string;
375
+ opacity50: string;
376
+ grey30: string;
377
+ opacity95: string;
378
+ darkgrey30: string;
373
379
  };
374
380
  readonly UIColor: {
375
381
  ui_cpnt_button_fill_base_primary: string;
@@ -861,6 +867,8 @@ declare const colorSet: {
861
867
  ui_cpnt_dropdown_border_white_focus: string;
862
868
  ui_cpnt_dropdown_base_white_normal: string;
863
869
  ui_profile_image_border_brandprimary: string;
870
+ ui_cpnt_dropdown_base_white_disabled: string;
871
+ ui_cpnt_dropdown_border_white_disabled: string;
864
872
  };
865
873
  };
866
874
  export default colorSet;
package/dist/src/common/styles/colorSet/index.js CHANGED
@@ -4,14 +4,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  /* eslint-disable import/order */
7
- var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
8
- var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
9
7
  var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
8
+ var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
9
+ var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
10
10
  var UIColor_json_1 = __importDefault(require("./UIColor.json"));
11
11
  var colorSet = {
12
- SemanticColor: SemanticColor_json_1.default,
13
- PaletteColor_light: PaletteColor_light_json_1.default,
14
12
  PaletteColor_Dark: PaletteColor_Dark_json_1.default,
13
+ PaletteColor_light: PaletteColor_light_json_1.default,
14
+ SemanticColor: SemanticColor_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
@@ -488,4 +488,6 @@ export interface UITheme {
488
488
  ui_cpnt_dropdown_border_white_focus: string;
489
489
  ui_cpnt_dropdown_base_white_normal: string;
490
490
  ui_profile_image_border_brandprimary: string;
491
+ ui_cpnt_dropdown_base_white_disabled: string;
492
+ ui_cpnt_dropdown_border_white_disabled: string;
491
493
  }
package/dist/src/desktop/common/components/TextFieldBase/TextFieldBase.js CHANGED
@@ -174,7 +174,7 @@ function TextFieldBase(_a) {
174
174
  if (textLineType === 'single') {
175
175
  return (react_1.default.createElement(S_InputWrapper, null,
176
176
  react_1.default.createElement(S_Input, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, type: inputType, state: state, readOnly: state === 'read_only', disabled: state === 'disabled', maxLength: maxLength, textSize: textSize, textWeight: textWeight, textPadding: textPadding, colorTheme: colorTheme, min: min, max: max, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: ref })),
177
- deleteIconMode === 'use' && isFocused && (react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_delete", baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: deleteIconSize, iconColorKey: deleteIconColor, iconFillType: "fill", state: state === 'disabled' ? 'disabled' : 'normal', onMouseDown: deleteValue }))));
177
+ deleteIconMode === 'use' && isFocused && (react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_delete", baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: deleteIconSize, iconColorKey: deleteIconColor, iconFillType: "fill", state: state === 'disabled' ? 'disabled' : 'normal', tabIndex: -1, onMouseDown: deleteValue }))));
178
178
  }
179
179
  if (textLineType === 'multi') {
180
180
  return (react_1.default.createElement(S_Multi, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, state: state, readOnly: state === 'read_only' && true, disabled: state === 'disabled' && true, maxLength: maxLength, rows: multiRows, textSize: textSize, textWeight: textWeight, textPadding: textPadding, colorTheme: colorTheme, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: ref })));
package/dist/src/desktop/components/BasicListItem/BasicListItem.js CHANGED
@@ -19,7 +19,7 @@ var TextLabel_1 = require("../TextLabel");
19
19
  function BasicListItem(_a) {
20
20
  var _b = _a.selectionMode, selectionMode = _b === void 0 ? 'none' : _b, titleText = _a.titleText, _c = _a.titleTextColorTheme, titleTextColorTheme = _c === void 0 ? 'none' : _c, descText = _a.descText, _d = _a.badgeMode, badgeMode = _d === void 0 ? 'none' : _d, _e = _a.badgeStatus, badgeStatus = _e === void 0 ? 'inactive' : _e, _f = _a.imageIconMode, imageIconMode = _f === void 0 ? 'none' : _f, _g = _a.imageShapeType, imageShapeType = _g === void 0 ? 'round' : _g, imageSrc = _a.imageSrc, iconName = _a.iconName, _h = _a.iconFillType, iconFillType = _h === void 0 ? 'line' : _h, _j = _a.displayType, displayType = _j === void 0 ? 'none' : _j, captionText = _a.captionText, iBtn1IconName = _a.iBtn1IconName, _k = _a.iBtn1IconFillType, iBtn1IconFillType = _k === void 0 ? 'line' : _k, iBtn2IconName = _a.iBtn2IconName, _l = _a.iBtn2IconFillType, iBtn2IconFillType = _l === void 0 ? 'line' : _l, _m = _a.mBtnFillType, mBtnFillType = _m === void 0 ? 'fill' : _m, mBtnText = _a.mBtnText, _o = _a.dividerType, dividerType = _o === void 0 ? 'none' : _o, _p = _a.titleFontWeight, titleFontWeight = _p === void 0 ? 'regular' : _p, checkboxId = _a.checkboxId, radioId = _a.radioId, radioValue = _a.radioValue, onClick = _a.onClick, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onClickMBtn = _a.onClickMBtn, onClickRadio = _a.onClickRadio, onClickSwitch = _a.onClickSwitch;
21
21
  var methods = (0, react_hook_form_1.useFormContext)();
22
- var isSelected = (0, react_hook_form_1.useWatch)({ control: methods.control, name: (checkboxId === null || checkboxId === void 0 ? void 0 : checkboxId.toString()) || '' });
22
+ var isSelected = methods === null || methods === void 0 ? void 0 : methods.watch((checkboxId === null || checkboxId === void 0 ? void 0 : checkboxId.toString()) || '');
23
23
  var handleCheckBoxClick = function (e) {
24
24
  e.preventDefault();
25
25
  if (!checkboxId) {
package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js CHANGED
@@ -128,8 +128,8 @@ function EditApplyTextField(_a) {
128
128
  react_1.default.createElement(S_EditApplyTextField, null,
129
129
  react_1.default.createElement(S_S_TextFieldBaseWrapper, { size: size, responsiveMode: responsiveMode, textLineType: textLineType, isFocused: isFocused, isError: isError, state: state }, S_TextFieldBase()),
130
130
  isOpen === true && (react_1.default.createElement(S_ButtonBox, null,
131
- react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_xmark", fillType: "fill", baseSize: "small", iconSize: 16, shapeType: "circular", shadow: "visible", iconColorKey: "ui_cpnt_button_icon_enabled", baseColorKey: "ui_cpnt_button_fill_base_white", onMouseDown: handleCancel }),
132
- react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_check", fillType: "fill", baseSize: "small", iconSize: 16, shapeType: "circular", shadow: "visible", iconColorKey: "ui_cpnt_button_icon_on_primary", baseColorKey: "ui_cpnt_button_fill_base_primary", onMouseDown: handleSubmit, state: isError === true ? 'disabled' : 'normal' })))),
131
+ react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_xmark", fillType: "fill", baseSize: "small", iconSize: 16, shapeType: "circular", shadow: "visible", iconColorKey: "ui_cpnt_button_icon_enabled", baseColorKey: "ui_cpnt_button_fill_base_white", tabIndex: -1, onMouseDown: handleCancel }),
132
+ react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_check", fillType: "fill", baseSize: "small", iconSize: 16, shapeType: "circular", shadow: "visible", iconColorKey: "ui_cpnt_button_icon_on_primary", baseColorKey: "ui_cpnt_button_fill_base_primary", state: isError === true ? 'disabled' : 'normal', tabIndex: -1, onMouseDown: handleSubmit })))),
133
133
  ((_b = errors[name]) === null || _b === void 0 ? void 0 : _b.message) && (react_1.default.createElement(S_Error, { isFocused: isFocused }, t(errors[name].message))))));
134
134
  }
135
135
  var S_EditApplyTextFieldWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
package/dist/src/desktop/components/IconButton/IconButton.d.ts CHANGED
@@ -14,8 +14,9 @@ export declare type IconButtonProps = {
14
14
  colorTheme?: 'none' | 'line1' | 'line2';
15
15
  type?: 'submit' | 'reset' | 'button';
16
16
  state?: 'normal' | 'disabled';
17
- onClick?: (e?: React.MouseEvent<HTMLButtonElement>) => any;
18
- onMouseDown?: (e?: React.MouseEvent<HTMLButtonElement>) => any;
17
+ tabIndex?: number;
18
+ onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
19
+ onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
19
20
  };
20
- declare function IconButton({ fillType, shapeType, baseSize, baseColorKey, borderColorKey, iconSize, iconFillType, iconName, iconColorKey, shadow, colorTheme, type, state, onClick, onMouseDown }: IconButtonProps): JSX.Element;
21
+ declare function IconButton({ fillType, shapeType, baseSize, baseColorKey, borderColorKey, iconSize, iconFillType, iconName, iconColorKey, shadow, colorTheme, type, state, tabIndex, onClick, onMouseDown }: IconButtonProps): JSX.Element;
21
22
  export default IconButton;
package/dist/src/desktop/components/IconButton/IconButton.js CHANGED
@@ -31,7 +31,7 @@ var styled_components_1 = __importStar(require("styled-components"));
31
31
  var common_1 = require("../../../common");
32
32
  var hybrid_1 = require("../../../hybrid");
33
33
  function IconButton(_a) {
34
- var _b = _a.fillType, fillType = _b === void 0 ? 'fill' : _b, _c = _a.shapeType, shapeType = _c === void 0 ? 'rectangle' : _c, _d = _a.baseSize, baseSize = _d === void 0 ? 'small' : _d, baseColorKey = _a.baseColorKey, borderColorKey = _a.borderColorKey, _e = _a.iconSize, iconSize = _e === void 0 ? 24 : _e, _f = _a.iconFillType, iconFillType = _f === void 0 ? 'line' : _f, iconName = _a.iconName, iconColorKey = _a.iconColorKey, _g = _a.shadow, shadow = _g === void 0 ? 'hidden' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, _j = _a.type, type = _j === void 0 ? 'button' : _j, _k = _a.state, state = _k === void 0 ? 'normal' : _k, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
34
+ var _b = _a.fillType, fillType = _b === void 0 ? 'fill' : _b, _c = _a.shapeType, shapeType = _c === void 0 ? 'rectangle' : _c, _d = _a.baseSize, baseSize = _d === void 0 ? 'small' : _d, baseColorKey = _a.baseColorKey, borderColorKey = _a.borderColorKey, _e = _a.iconSize, iconSize = _e === void 0 ? 24 : _e, _f = _a.iconFillType, iconFillType = _f === void 0 ? 'line' : _f, iconName = _a.iconName, iconColorKey = _a.iconColorKey, _g = _a.shadow, shadow = _g === void 0 ? 'hidden' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, _j = _a.type, type = _j === void 0 ? 'button' : _j, _k = _a.state, state = _k === void 0 ? 'normal' : _k, tabIndex = _a.tabIndex, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
35
35
  var handleClick = function (e) {
36
36
  if (onClick) {
37
37
  onClick(e);
@@ -62,7 +62,7 @@ function IconButton(_a) {
62
62
  }
63
63
  return iconStateColorObj[fillType];
64
64
  };
65
- return (react_1.default.createElement(S_IconButton, { fillType: fillType, shapeType: shapeType, baseSize: baseSize, baseColorKey: baseColorKey, borderColorKey: borderColorKey, shadow: shadow, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', onClick: handleClick, onMouseDown: handleMouseDown },
65
+ return (react_1.default.createElement(S_IconButton, { fillType: fillType, shapeType: shapeType, baseSize: baseSize, baseColorKey: baseColorKey, borderColorKey: borderColorKey, shadow: shadow, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', tabIndex: tabIndex, onClick: handleClick, onMouseDown: handleMouseDown },
66
66
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: iconSize, colorKey: IconColorSelect(), fillType: iconFillType })));
67
67
  }
68
68
  var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTS.js CHANGED
@@ -34,7 +34,8 @@ var S_ContentsArea2 = styled_components_1.default.div(templateObject_3 || (templ
34
34
  var areaColor = _a.areaColor;
35
35
  return "background-color: " + areaColor;
36
36
  });
37
- var S_Content1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n min-height: 480px;\n"], ["\n min-height: 480px;\n"])));
37
+ // TODO: 철학에 위배되지만, 히어로 배너를 쓰지 않을 경우를 위해 임시로 제거 상태. 추후 조치 필요
38
+ var S_Content1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n /* min-height: 480px; */\n"], ["\n /* min-height: 480px; */\n"])));
38
39
  var S_Content2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
39
40
  exports.default = WTS;
40
41
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
package/dist/src/mobile/common/components/TextFieldBase/TextFieldBase.js CHANGED
@@ -174,7 +174,7 @@ function TextFieldBase(_a) {
174
174
  if (textLineType === 'single') {
175
175
  return (react_1.default.createElement(S_InputWrapper, null,
176
176
  react_1.default.createElement(S_Input, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, type: inputType, state: state, readOnly: state === 'read_only', disabled: state === 'disabled', maxLength: maxLength, textSize: textSize, textWeight: textWeight, textPadding: textPadding, colorTheme: colorTheme, min: min, max: max, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: ref })),
177
- deleteIconMode === 'use' && isFocused && (react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_delete", baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: deleteIconSize, iconColorKey: deleteIconColor, iconFillType: "fill", state: state === 'disabled' ? 'disabled' : 'normal', onMouseDown: deleteValue }))));
177
+ deleteIconMode === 'use' && isFocused && (react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_delete", baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: deleteIconSize, iconColorKey: deleteIconColor, iconFillType: "fill", state: state === 'disabled' ? 'disabled' : 'normal', tabIndex: -1, onMouseDown: deleteValue }))));
178
178
  }
179
179
  if (textLineType === 'multi') {
180
180
  return (react_1.default.createElement(S_Multi, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, state: state, readOnly: state === 'read_only' && true, disabled: state === 'disabled' && true, maxLength: maxLength, rows: multiRows, textSize: textSize, textWeight: textWeight, textPadding: textPadding, colorTheme: colorTheme, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: ref })));
package/dist/src/mobile/components/BasicListItem/BasicListItem.js CHANGED
@@ -19,7 +19,7 @@ var TextLabel_1 = require("../TextLabel");
19
19
  function BasicListItem(_a) {
20
20
  var _b = _a.selectionMode, selectionMode = _b === void 0 ? 'none' : _b, titleText = _a.titleText, _c = _a.titleTextColorTheme, titleTextColorTheme = _c === void 0 ? 'none' : _c, descText = _a.descText, _d = _a.badgeMode, badgeMode = _d === void 0 ? 'none' : _d, _e = _a.badgeStatus, badgeStatus = _e === void 0 ? 'inactive' : _e, _f = _a.imageIconMode, imageIconMode = _f === void 0 ? 'none' : _f, _g = _a.imageShapeType, imageShapeType = _g === void 0 ? 'round' : _g, imageSrc = _a.imageSrc, iconName = _a.iconName, _h = _a.iconFillType, iconFillType = _h === void 0 ? 'line' : _h, _j = _a.displayType, displayType = _j === void 0 ? 'none' : _j, captionText = _a.captionText, iBtn1IconName = _a.iBtn1IconName, _k = _a.iBtn1IconFillType, iBtn1IconFillType = _k === void 0 ? 'line' : _k, iBtn2IconName = _a.iBtn2IconName, _l = _a.iBtn2IconFillType, iBtn2IconFillType = _l === void 0 ? 'line' : _l, _m = _a.mBtnFillType, mBtnFillType = _m === void 0 ? 'fill' : _m, mBtnText = _a.mBtnText, _o = _a.dividerType, dividerType = _o === void 0 ? 'none' : _o, _p = _a.titleFontWeight, titleFontWeight = _p === void 0 ? 'regular' : _p, checkboxId = _a.checkboxId, radioId = _a.radioId, radioValue = _a.radioValue, onClick = _a.onClick, onClickRadio = _a.onClickRadio, onClickSwitch = _a.onClickSwitch, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onClickMBtn = _a.onClickMBtn;
21
21
  var methods = (0, react_hook_form_1.useFormContext)();
22
- var isSelected = (0, react_hook_form_1.useWatch)({ control: methods.control, name: (checkboxId === null || checkboxId === void 0 ? void 0 : checkboxId.toString()) || '' });
22
+ var isSelected = methods === null || methods === void 0 ? void 0 : methods.watch((checkboxId === null || checkboxId === void 0 ? void 0 : checkboxId.toString()) || '');
23
23
  var handleCheckBoxClick = function (e) {
24
24
  e.preventDefault();
25
25
  if (!checkboxId) {
package/dist/src/mobile/components/Checkbox/Checkbox.js CHANGED
@@ -56,8 +56,8 @@ function Checkbox(_a) {
56
56
  : 'ui_cpnt_selcontrols_text_disabled' }))),
57
57
  react_1.default.createElement("input", __assign({ hidden: true, type: "checkbox" }, checkboxFormRegister, { id: name, disabled: state === 'disabled', onChange: handleChange })))));
58
58
  }
59
- var S_Checkbox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 24px;\n"], ["\n height: 24px;\n"])));
60
- var S_Label = styled_components_1.default.label(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n cursor: pointer;\n display: flex;\n"], ["\n align-items: center;\n cursor: pointer;\n display: flex;\n"])));
59
+ var S_Checkbox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 24px;\n"], ["\n align-items: center;\n display: flex;\n height: 24px;\n"])));
60
+ var S_Label = styled_components_1.default.label(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n"], ["\n align-items: center;\n display: flex;\n"])));
61
61
  var S_OverrideIconWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n position: relative;\n"], ["\n align-items: center;\n display: flex;\n position: relative;\n"])));
62
62
  var S_OverrideIcon = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n left: 0;\n position: absolute;\n top: 0;\n"], ["\n left: 0;\n position: absolute;\n top: 0;\n"])));
63
63
  var S_TextWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n padding-left: ", ";\n"], ["\n padding-left: ", ";\n"])), function (_a) {
package/dist/src/mobile/components/IconButton/IconButton.d.ts CHANGED
@@ -14,8 +14,9 @@ export declare type IconButtonProps = {
14
14
  colorTheme?: 'none' | 'line1' | 'line2';
15
15
  type?: 'submit' | 'reset' | 'button';
16
16
  state?: 'normal' | 'disabled';
17
- onClick?: (e?: React.MouseEvent<HTMLButtonElement>) => any;
18
- onMouseDown?: (e?: React.MouseEvent<HTMLButtonElement>) => any;
17
+ tabIndex?: number;
18
+ onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
19
+ onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
19
20
  };
20
- declare function IconButton({ fillType, shapeType, baseSize, baseColorKey, borderColorKey, iconSize, iconFillType, iconName, iconColorKey, shadow, colorTheme, type, state, onClick, onMouseDown }: IconButtonProps): JSX.Element;
21
+ declare function IconButton({ fillType, shapeType, baseSize, baseColorKey, borderColorKey, iconSize, iconFillType, iconName, iconColorKey, shadow, colorTheme, type, state, tabIndex, onClick, onMouseDown }: IconButtonProps): JSX.Element;
21
22
  export default IconButton;
package/dist/src/mobile/components/IconButton/IconButton.js CHANGED
@@ -31,7 +31,7 @@ var styled_components_1 = __importStar(require("styled-components"));
31
31
  var ui_colors_1 = require("../../../common/styles/ui-colors");
32
32
  var hybrid_1 = require("../../../hybrid");
33
33
  function IconButton(_a) {
34
- var _b = _a.fillType, fillType = _b === void 0 ? 'fill' : _b, _c = _a.shapeType, shapeType = _c === void 0 ? 'rectangle' : _c, _d = _a.baseSize, baseSize = _d === void 0 ? 'small' : _d, baseColorKey = _a.baseColorKey, borderColorKey = _a.borderColorKey, _e = _a.iconSize, iconSize = _e === void 0 ? 24 : _e, _f = _a.iconFillType, iconFillType = _f === void 0 ? 'line' : _f, iconName = _a.iconName, iconColorKey = _a.iconColorKey, _g = _a.shadow, shadow = _g === void 0 ? 'hidden' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, _j = _a.type, type = _j === void 0 ? 'button' : _j, _k = _a.state, state = _k === void 0 ? 'normal' : _k, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
34
+ var _b = _a.fillType, fillType = _b === void 0 ? 'fill' : _b, _c = _a.shapeType, shapeType = _c === void 0 ? 'rectangle' : _c, _d = _a.baseSize, baseSize = _d === void 0 ? 'small' : _d, baseColorKey = _a.baseColorKey, borderColorKey = _a.borderColorKey, _e = _a.iconSize, iconSize = _e === void 0 ? 24 : _e, _f = _a.iconFillType, iconFillType = _f === void 0 ? 'line' : _f, iconName = _a.iconName, iconColorKey = _a.iconColorKey, _g = _a.shadow, shadow = _g === void 0 ? 'hidden' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, _j = _a.type, type = _j === void 0 ? 'button' : _j, _k = _a.state, state = _k === void 0 ? 'normal' : _k, tabIndex = _a.tabIndex, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
35
35
  var handleClick = function (e) {
36
36
  if (onClick) {
37
37
  onClick(e);
@@ -62,7 +62,7 @@ function IconButton(_a) {
62
62
  }
63
63
  return iconStateColorObj[fillType];
64
64
  };
65
- return (react_1.default.createElement(S_IconButton, { fillType: fillType, shapeType: shapeType, baseSize: baseSize, baseColorKey: baseColorKey, borderColorKey: borderColorKey, shadow: shadow, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', onClick: handleClick, onMouseDown: handleMouseDown },
65
+ return (react_1.default.createElement(S_IconButton, { fillType: fillType, shapeType: shapeType, baseSize: baseSize, baseColorKey: baseColorKey, borderColorKey: borderColorKey, shadow: shadow, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', tabIndex: tabIndex, onClick: handleClick, onMouseDown: handleMouseDown },
66
66
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: iconSize, colorKey: IconColorSelect(), fillType: iconFillType })));
67
67
  }
68
68
  var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.3.19",
3
+ "version": "1.3.22",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,19 +1,9 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.3.19]
2
+ ## [v1.3.22]
3
3
 
4
- ### Component
5
- * BasicList
6
- * 내부의 useForm 제거
7
- * BasicListItem
8
- * onClick prop 추가(전체 클릭 가능)
9
- * radioId prop 추가 (radio 모드일 때 원활한 라디오 선택을 위해)
10
- * displayType prop에 ‘ibtn_text’ value 추가
11
- * displayType prop에 ‘selected_status’ value 제거
12
- * iBtn1과 iBtn2의 위치 순서 변경
13
- * descText와 captionText의 위치를 서로 변경, 색상과 폰트 변경
14
- * Checkbox
15
- * onChange prop 추가
16
- * Dropdown
17
- * 내부 outline를 none처리
18
- * IconButton
19
- * onClick이 이벤트를 받을 수 있도록 수정
4
+ ### Layout
5
+ * WTS_1
6
+ * content1의 min-height값 제거
7
+
8
+ ### Color
9
+ * 컬러 키 값 22.05.27 12시 40분 기준 싱크