pds-dev-kit-web 1.5.9 → 1.5.11

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.
@@ -581,5 +581,6 @@
581
581
  "ui_loading_skeleton_02": "sys_loading_skeleton_02",
582
582
  "ui_loading_linear_bar": "sys_loading_linear_bar",
583
583
  "ui_loading_linear_base": "sys_loading_linear_base",
584
- "ui_loading_three_bar": "sys_loading_three_bar"
584
+ "ui_loading_three_bar": "sys_loading_three_bar",
585
+ "ui_menu_button_base": "usr_menu_background"
585
586
  }
@@ -1,5 +1,5 @@
1
1
  declare const colorSet: {
2
- readonly PaletteColor_Dark: {
2
+ readonly PaletteColor_light: {
3
3
  sys_container_background_01: string;
4
4
  sys_container_background_02: string;
5
5
  sys_container_background_03: string;
@@ -275,7 +275,7 @@ declare const colorSet: {
275
275
  green30: string;
276
276
  darkgreen30: string;
277
277
  };
278
- readonly PaletteColor_light: {
278
+ readonly PaletteColor_Dark: {
279
279
  sys_container_background_01: string;
280
280
  sys_container_background_02: string;
281
281
  sys_container_background_03: string;
@@ -1063,6 +1063,7 @@ declare const colorSet: {
1063
1063
  ui_loading_linear_bar: string;
1064
1064
  ui_loading_linear_base: string;
1065
1065
  ui_loading_three_bar: string;
1066
+ ui_menu_button_base: string;
1066
1067
  };
1067
1068
  };
1068
1069
  export default colorSet;
@@ -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 PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
8
- var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
9
7
  var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
8
+ var SemanticColor_json_1 = __importDefault(require("./SemanticColor.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
- PaletteColor_Dark: PaletteColor_Dark_json_1.default,
13
- SemanticColor: SemanticColor_json_1.default,
14
12
  PaletteColor_light: PaletteColor_light_json_1.default,
13
+ SemanticColor: SemanticColor_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;
@@ -582,4 +582,5 @@ export interface UITheme {
582
582
  ui_loading_linear_bar: string;
583
583
  ui_loading_linear_base: string;
584
584
  ui_loading_three_bar: string;
585
+ ui_menu_button_base: string;
585
586
  }
@@ -45,6 +45,7 @@ export declare type StyleProps = {
45
45
  displayType?: 'none' | 'text' | 'ibtn_text' | 'ibtn_amount1' | 'ibtn_amount2' | 'mbtn' | 'switch';
46
46
  hasOnClick?: boolean;
47
47
  spacingMode?: 'none' | 'use';
48
+ onlyLeftArea?: boolean;
48
49
  };
49
50
  declare function BasicListItem({ selectionMode, titleText, titleTextColorTheme, descText, badgeMode, badgeStatus, imageIconMode, imageShapeType, imageSrc, iconName, iconFillType, displayType, captionText, iBtn1IconName, iBtn1IconFillType, iBtn2IconName, iBtn2IconFillType, mBtnFillType, mBtnText, dividerType, titleFontWeight, checkboxId, radioId, radioValue, switchName, switchState, switchStatus, spacingMode, onClick, onClickIBtn1, onClickIBtn2, onClickMBtn, onClickRadio, onClickSwitch }: BasicListItemProps): JSX.Element;
50
51
  export default BasicListItem;
@@ -20,6 +20,7 @@ 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, switchName = _a.switchName, _q = _a.switchState, switchState = _q === void 0 ? 'normal' : _q, _r = _a.switchStatus, switchStatus = _r === void 0 ? 'off' : _r, _s = _a.spacingMode, spacingMode = _s === void 0 ? 'use' : _s, 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
22
  var isSelected = methods === null || methods === void 0 ? void 0 : methods.watch((checkboxId === null || checkboxId === void 0 ? void 0 : checkboxId.toString()) || '');
23
+ var onlyLeftArea = displayType === 'none';
23
24
  var handleCheckBoxClick = function (e) {
24
25
  e.preventDefault();
25
26
  if (!checkboxId) {
@@ -115,7 +116,7 @@ function BasicListItem(_a) {
115
116
  };
116
117
  return (react_1.default.createElement(S_BasicListItem, { displayType: displayType, selectionMode: selectionMode, isSelected: isSelected, onClick: handleClick, hasOnClick: !!onClick, spacingMode: spacingMode },
117
118
  react_1.default.createElement(S_BasicListItemBox, { imageIconMode: imageIconMode, captionText: captionText, spacingMode: spacingMode },
118
- react_1.default.createElement(S_LeftBox, null,
119
+ react_1.default.createElement(S_LeftBox, { onlyLeftArea: onlyLeftArea },
119
120
  selectionMode !== 'none' && (react_1.default.createElement(S_SelectionBoxWrapper, { selectionMode: selectionMode },
120
121
  selectionMode === 'check' && checkboxId && (react_1.default.createElement(Checkbox_1.Checkbox, { name: checkboxId.toString(), state: "normal", onChange: handleCheckBoxClick })),
121
122
  selectionMode === 'radio' && radioValue && radioId && (react_1.default.createElement(Radio_1.Radio, { name: radioId, value: radioValue, onChange: handleRadioClick, checked: radioId === radioValue })))),
@@ -136,10 +137,10 @@ function BasicListItem(_a) {
136
137
  captionText && (react_1.default.createElement(react_1.default.Fragment, null,
137
138
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a" }),
138
139
  react_1.default.createElement(S_TextWrapper, null,
139
- react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, colorTheme: "sysTextTertiary", styleTheme: "caption1Regular", textAlign: "right", singleLineMode: "use", ellipsisMode: "use", lineLimit: 1 })))))),
140
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, colorTheme: "sysTextTertiary", styleTheme: "caption1Regular", textAlign: "left", singleLineMode: "use", ellipsisMode: "use", lineLimit: 1 })))))),
140
141
  react_1.default.createElement(S_RightBox, { displayType: displayType },
141
142
  (displayType === 'text' || displayType === 'ibtn_text') && (react_1.default.createElement(react_1.default.Fragment, null,
142
- react_1.default.createElement(TextLabel_1.TextLabel, { text: descText, colorTheme: "sysTextSecondary", styleTheme: "caption1Regular", singleLineMode: "use", ellipsisMode: "use", lineLimit: 1 }),
143
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: descText, colorTheme: "sysTextSecondary", styleTheme: "caption1Regular", textAlign: "right", singleLineMode: "use", ellipsisMode: "use", lineLimit: 1 }),
143
144
  isRightSpacingChecker('none') && react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_c", spacingType: "width" }))),
144
145
  (displayType === 'ibtn_amount1' ||
145
146
  displayType === 'ibtn_amount2' ||
@@ -179,7 +180,10 @@ var S_BasicListItemBox = styled_components_1.default.div(templateObject_2 || (te
179
180
  var spacingMode = _a.spacingMode, theme = _a.theme;
180
181
  return spacingMode === 'use' && "0 " + theme.spacing.spacingC;
181
182
  });
182
- var S_LeftBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex: 7;\n width: 100%;\n"], ["\n align-items: center;\n display: flex;\n flex: 7;\n width: 100%;\n"])));
183
+ var S_LeftBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex: ", ";\n width: 100%;\n"], ["\n align-items: center;\n display: flex;\n flex: ", ";\n width: 100%;\n"])), function (_a) {
184
+ var onlyLeftArea = _a.onlyLeftArea;
185
+ return (onlyLeftArea ? 'auto' : 7);
186
+ });
183
187
  var S_SelectionBoxWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 40px;\n justify-content: center;\n width: 40px;\n"], ["\n align-items: center;\n display: flex;\n height: 40px;\n justify-content: center;\n width: 40px;\n"])));
184
188
  var S_IconWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n justify-content: center;\n"], ["\n align-items: center;\n display: flex;\n justify-content: center;\n"])));
185
189
  var S_TextBox = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n justify-content: center;\n width: 100%;\n"], ["\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n justify-content: center;\n width: 100%;\n"])));
@@ -100,7 +100,7 @@ var S_ButtonWrapper = styled_components_1.default.div(templateObject_5 || (templ
100
100
  return theme.ui_menu_background;
101
101
  }, function (_a) {
102
102
  var theme = _a.theme;
103
- return theme.ui_menu_background;
103
+ return theme.ui_menu_button_base;
104
104
  }, function (_a) {
105
105
  var theme = _a.theme;
106
106
  return theme.ui_temp_grey_02;
@@ -44,6 +44,7 @@ export declare type StyleProps = {
44
44
  imageIconMode?: 'none' | 'image' | 'icon';
45
45
  displayType?: 'none' | 'text' | 'ibtn_text' | 'ibtn_amount1' | 'ibtn_amount2' | 'mbtn' | 'switch';
46
46
  spacingMode?: 'none' | 'use';
47
+ onlyLeftArea?: boolean;
47
48
  };
48
49
  declare function BasicListItem({ selectionMode, titleText, titleTextColorTheme, descText, badgeMode, badgeStatus, imageIconMode, imageShapeType, imageSrc, iconName, iconFillType, displayType, captionText, iBtn1IconName, iBtn1IconFillType, iBtn2IconName, iBtn2IconFillType, mBtnFillType, mBtnText, dividerType, titleFontWeight, checkboxId, radioId, radioValue, switchName, switchState, switchStatus, spacingMode, onClick, onClickRadio, onClickSwitch, onClickIBtn1, onClickIBtn2, onClickMBtn }: BasicListItemProps): JSX.Element;
49
50
  export default BasicListItem;
@@ -20,6 +20,7 @@ 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, switchName = _a.switchName, _q = _a.switchState, switchState = _q === void 0 ? 'normal' : _q, _r = _a.switchStatus, switchStatus = _r === void 0 ? 'off' : _r, _s = _a.spacingMode, spacingMode = _s === void 0 ? 'use' : _s, 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
22
  var isSelected = methods === null || methods === void 0 ? void 0 : methods.watch((checkboxId === null || checkboxId === void 0 ? void 0 : checkboxId.toString()) || '');
23
+ var onlyLeftArea = displayType === 'none';
23
24
  var handleCheckBoxClick = function (e) {
24
25
  e.preventDefault();
25
26
  if (!checkboxId) {
@@ -115,7 +116,7 @@ function BasicListItem(_a) {
115
116
  };
116
117
  return (react_1.default.createElement(S_BasicListItem, { isSelected: isSelected, onClick: handleClick, spacingMode: spacingMode },
117
118
  react_1.default.createElement(S_BasicListItemBox, { imageIconMode: imageIconMode, captionText: captionText, spacingMode: spacingMode },
118
- react_1.default.createElement(S_LeftBox, null,
119
+ react_1.default.createElement(S_LeftBox, { onlyLeftArea: onlyLeftArea },
119
120
  selectionMode !== 'none' && (react_1.default.createElement(S_SelectionBoxWrapper, { selectionMode: selectionMode },
120
121
  selectionMode === 'check' && checkboxId && (react_1.default.createElement(Checkbox_1.Checkbox, { name: checkboxId.toString(), state: "normal", onChange: handleCheckBoxClick })),
121
122
  selectionMode === 'radio' && radioValue && radioId && (react_1.default.createElement(Radio_1.Radio, { name: radioId, value: radioValue, onChange: handleRadioClick, checked: radioId === radioValue })))),
@@ -136,10 +137,10 @@ function BasicListItem(_a) {
136
137
  captionText && (react_1.default.createElement(react_1.default.Fragment, null,
137
138
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a" }),
138
139
  react_1.default.createElement(S_TextWrapper, null,
139
- react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, colorTheme: "sysTextTertiary", styleTheme: "caption1Regular", textAlign: "right", singleLineMode: "use", ellipsisMode: "use", lineLimit: 1 })))))),
140
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, colorTheme: "sysTextTertiary", styleTheme: "caption1Regular", textAlign: "left", singleLineMode: "use", ellipsisMode: "use", lineLimit: 1 })))))),
140
141
  react_1.default.createElement(S_RightBox, { displayType: displayType },
141
142
  (displayType === 'text' || displayType === 'ibtn_text') && (react_1.default.createElement(react_1.default.Fragment, null,
142
- react_1.default.createElement(TextLabel_1.TextLabel, { text: descText, colorTheme: "sysTextSecondary", styleTheme: "caption1Regular", singleLineMode: "use", ellipsisMode: "use", lineLimit: 1 }),
143
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: descText, colorTheme: "sysTextSecondary", styleTheme: "caption1Regular", textAlign: "right", singleLineMode: "use", ellipsisMode: "use", lineLimit: 1 }),
143
144
  isRightSpacingChecker('none') && react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_c", spacingType: "width" }))),
144
145
  (displayType === 'ibtn_amount1' ||
145
146
  displayType === 'ibtn_amount2' ||
@@ -168,7 +169,10 @@ var S_BasicListItemBox = styled_components_1.default.div(templateObject_2 || (te
168
169
  var spacingMode = _a.spacingMode, theme = _a.theme;
169
170
  return spacingMode === 'use' && "0 " + theme.spacing.spacingC;
170
171
  });
171
- var S_LeftBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex: 7;\n width: 100%;\n"], ["\n align-items: center;\n display: flex;\n flex: 7;\n width: 100%;\n"])));
172
+ var S_LeftBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex: ", ";\n width: 100%;\n"], ["\n align-items: center;\n display: flex;\n flex: ", ";\n width: 100%;\n"])), function (_a) {
173
+ var onlyLeftArea = _a.onlyLeftArea;
174
+ return (onlyLeftArea ? 'auto' : 7);
175
+ });
172
176
  var S_SelectionBoxWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 40px;\n justify-content: center;\n width: 40px;\n"], ["\n align-items: center;\n display: flex;\n height: 40px;\n justify-content: center;\n width: 40px;\n"])));
173
177
  var S_IconWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n justify-content: center;\n"], ["\n align-items: center;\n display: flex;\n justify-content: center;\n"])));
174
178
  var S_TextBox = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n justify-content: center;\n width: 100%;\n"], ["\n align-items: flex-start;\n display: flex;\n flex-direction: column;\n justify-content: center;\n width: 100%;\n"])));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.5.9",
3
+ "version": "1.5.11",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,17 +1,9 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.5.9]
2
+ ## [v1.5.11]
3
3
 
4
4
  ### Component
5
- * AdminListItem
6
- * 텍스트별 StyleTheme에 active2 value 추가
7
- * Icon
8
- * 잘못된 iconName이 부여되었을때 ic_unavailable로 표시되도록 수정
9
- * UploadIconButton
10
- * 직전에 올린 파일도 다시 올릴 수 있도록 수정
11
- * UploadMainButton
12
- * 직전에 올린 파일도 다시 올릴 수 있도록 수정
13
- * UploadTextButton
14
- * 직전에 올린 파일도 다시 올릴 수 있도록 수정
5
+ * DynamicDesktopNavBar
6
+ * PrimaryMenu들을 좌우로 스크롤 해주는 버튼의 배경 컬러키 변경
15
7
 
16
8
  ### Color
17
- * 컬러 키 값 22.11.08 12시 10분 기준 싱크
9
+ * 컬러 키 값 22.11.10 12시 40분 기준 싱크