pds-dev-kit-web 1.4.11 → 1.4.14

package/dist/src/common/assets/icons/line/Clip.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import IconType from '../IconType';
+declare const Clip: ({ color, size, ...rest }: IconType) => JSX.Element;
+export default Clip;

package/dist/src/common/assets/icons/line/Clip.js

@@ -0,0 +1,36 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var Clip = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return (react_1.default.createElement("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest),
+        react_1.default.createElement("g", { fill: "none", fillRule: "evenodd", strokeLinecap: "round" },
+            react_1.default.createElement("path", { stroke: color, strokeWidth: "1.5", d: "M2.8315,19.8563 C1.4605,18.3773 1.7185,16.2083 3.6035,14.4263 L13.6075,4.4233 C15.5355,2.4953 18.6605,2.4953 20.5885,4.4233 L20.5885,4.4233 C22.5155,6.3513 22.5155,9.4763 20.5885,11.4043 L12.4975,19.4943" }),
+            react_1.default.createElement("path", { stroke: color, strokeWidth: "1.5", d: "M7.3606,14.7929 L12.6506,9.5029 C13.4406,8.7129 14.7196,8.7129 15.5086,9.5029 L15.5086,9.5029 C16.2986,10.2919 16.2986,11.5709 15.5086,12.3599 L8.3606,19.5079 C5.9176,21.9519 3.8866,20.9579 2.8316,19.8559" }))));
+};
+exports.default = Clip;

package/dist/src/common/assets/icons/line/Internal.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import IconType from '../IconType';
+declare const Internal: ({ color, size, ...rest }: IconType) => JSX.Element;
+export default Internal;

package/dist/src/common/assets/icons/line/Internal.js

@@ -0,0 +1,36 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var Internal = function (_a) {
+    var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
+    return (react_1.default.createElement("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest),
+        react_1.default.createElement("g", { fill: "none", fillRule: "evenodd" },
+            react_1.default.createElement("path", { fill: color, d: "M14.7582,12.7939 L10.8292,16.2299 C10.3482,16.6499 9.5962,16.3079 9.5972,15.6689 L9.5992,14.4879 C5.4052,14.4259 2.3502,10.9379 1.0372,8.1439 C0.8732,7.7959 1.2792,7.4679 1.5952,7.6859 C5.5832,10.4329 9.0162,9.9579 9.6062,9.8499 C9.6062,9.8499 9.6072,9.3539 9.6072,8.7879 C9.6082,8.1489 10.3612,7.8079 10.8402,8.2299 L14.7602,11.6769 C15.0972,11.9739 15.0962,12.4989 14.7582,12.7939" }),
+            react_1.default.createElement("path", { stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M5.6353,7.6233 C5.6353,5.6903 7.2023,4.1233 9.1353,4.1233 L17.8883,4.1233 C19.8213,4.1233 21.3883,5.6903 21.3883,7.6233 L21.3883,16.3763 C21.3883,18.3093 19.8213,19.8763 17.8883,19.8763 L9.1353,19.8763 C7.2023,19.8763 5.6353,18.3093 5.6353,16.3763" }))));
+};
+exports.default = Internal;

package/dist/src/common/assets/icons/line/index.d.ts

@@ -30,6 +30,7 @@ declare const lineIcons: {
     readonly ic_chat_crm: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_check: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_checkbox_off: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    readonly ic_clip: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_cont_watching: ({ color, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_copy: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_cs: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
@@ -46,6 +47,7 @@ declare const lineIcons: {
     readonly ic_filter: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_folder: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_information: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    readonly ic_internal: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_language: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_links: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_live: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;

package/dist/src/common/assets/icons/line/index.js

@@ -33,6 +33,7 @@ var ChatCounseling_1 = __importDefault(require("./ChatCounseling"));
 var ChatCrm_1 = __importDefault(require("./ChatCrm"));
 var Check_1 = __importDefault(require("./Check"));
 var CheckboxOff_1 = __importDefault(require("./CheckboxOff"));
+var Clip_1 = __importDefault(require("./Clip"));
 var ContWatching_1 = __importDefault(require("./ContWatching"));
 var Copy_1 = __importDefault(require("./Copy"));
 var Cs_1 = __importDefault(require("./Cs"));
@@ -49,6 +50,7 @@ var EyeClose_1 = __importDefault(require("./EyeClose"));
 var Filter_1 = __importDefault(require("./Filter"));
 var Folder_1 = __importDefault(require("./Folder"));
 var Information_1 = __importDefault(require("./Information"));
+var Internal_1 = __importDefault(require("./Internal"));
 var Language_1 = __importDefault(require("./Language"));
 var Links_1 = __importDefault(require("./Links"));
 var Live_1 = __importDefault(require("./Live"));
@@ -171,6 +173,7 @@ var lineIcons = {
     ic_chat_crm: ChatCrm_1.default,
     ic_check: Check_1.default,
     ic_checkbox_off: CheckboxOff_1.default,
+    ic_clip: Clip_1.default,
     ic_cont_watching: ContWatching_1.default,
     ic_copy: Copy_1.default,
     ic_cs: Cs_1.default,
@@ -187,6 +190,7 @@ var lineIcons = {
     ic_filter: Filter_1.default,
     ic_folder: Folder_1.default,
     ic_information: Information_1.default,
+    ic_internal: Internal_1.default,
     ic_language: Language_1.default,
     ic_links: Links_1.default,
     ic_live: Live_1.default,

package/dist/src/common/styles/colorSet/PaletteColor_Dark.json

@@ -168,5 +168,10 @@
     "sys_border_line_darktheme_05": "darkgrey30",
     "sys_component_base_darktheme_06": "darkgrey70",
     "sys_border_line_darktheme_06": "darkgrey70",
-    "sys_border_line_darktheme_07": "darkgrey50"
+    "sys_border_line_darktheme_07": "darkgrey50",
+    "sys_border_line_11": "darkgreen500",
+    "sys_base_dimmed_01": "black/opacity30",
+    "sys_kakao": "kakaoyellow",
+    "sys_border_line_12": "grey100",
+    "sys_component_base_08": "white"
 }

package/dist/src/common/styles/colorSet/PaletteColor_light.json

@@ -168,5 +168,10 @@
     "sys_border_line_darktheme_05": "darkgrey30",
     "sys_component_base_darktheme_06": "darkgrey70",
     "sys_border_line_darktheme_06": "darkgrey70",
-    "sys_border_line_darktheme_07": "darkgrey50"
+    "sys_border_line_darktheme_07": "darkgrey50",
+    "sys_border_line_11": "green500",
+    "sys_base_dimmed_01": "white/opacity30",
+    "sys_kakao": "kakaoyellow",
+    "sys_border_line_12": "grey100",
+    "sys_component_base_08": "black"
 }

package/dist/src/common/styles/colorSet/SemanticColor.json

@@ -55,5 +55,6 @@
     "grey30": "#f5f5f8",
     "opacity95": "F2",
     "darkgrey30": "#1d1d1e",
-    "opacity40": "66"
+    "opacity40": "66",
+    "kakaoyellow": "#fee500"
 }

package/dist/src/common/styles/colorSet/UIColor.json

@@ -513,5 +513,15 @@
     "ui_hero_description_text": "sys_text_white",
     "ui_cpnt_divider_area": "sys_border_area_01",
     "ui_cpnt_button_white_base_hover": "sys_component_base_darktheme_01",
-    "ui_cpnt_button_white_base_pressed": "sys_component_base_darktheme_03"
+    "ui_cpnt_button_white_base_pressed": "sys_component_base_darktheme_03",
+    "ui_cpnt_list_base_area_hover": "sys_container_background_02",
+    "ui_cpnt_sheet_border_01": "sys_border_line_01",
+    "ui_cpnt_sheet_border_02": "sys_border_line_03",
+    "ui_cpnt_sheet_border_03": "sys_border_line_11",
+    "ui_43": "sys_border_line_12",
+    "ui_44": "sys_component_base_white",
+    "ui_45": "sys_component_base_08",
+    "ui_46": "sys_base_dimmed_01",
+    "ui_47": "sys_kakao",
+    "ui_cpnt_sheet_base_03": "sys_component_base_white_opacity00"
 }

package/dist/src/common/styles/colorSet/index.d.ts

@@ -57,8 +57,9 @@ declare const colorSet: {
         opacity95: string;
         darkgrey30: string;
         opacity40: string;
+        kakaoyellow: string;
     };
-    readonly PaletteColor_Dark: {
+    readonly PaletteColor_light: {
         sys_container_background_01: string;
         sys_container_background_02: string;
         sys_container_background_03: string;
@@ -229,8 +230,13 @@ declare const colorSet: {
         sys_component_base_darktheme_06: string;
         sys_border_line_darktheme_06: string;
         sys_border_line_darktheme_07: string;
+        sys_border_line_11: string;
+        sys_base_dimmed_01: string;
+        sys_kakao: string;
+        sys_border_line_12: string;
+        sys_component_base_08: string;
     };
-    readonly PaletteColor_light: {
+    readonly PaletteColor_Dark: {
         sys_container_background_01: string;
         sys_container_background_02: string;
         sys_container_background_03: string;
@@ -401,6 +407,11 @@ declare const colorSet: {
         sys_component_base_darktheme_06: string;
         sys_border_line_darktheme_06: string;
         sys_border_line_darktheme_07: string;
+        sys_border_line_11: string;
+        sys_base_dimmed_01: string;
+        sys_kakao: string;
+        sys_border_line_12: string;
+        sys_component_base_08: string;
     };
     readonly UIColor: {
         ui_cpnt_button_fill_base_primary: string;
@@ -918,6 +929,16 @@ declare const colorSet: {
         ui_cpnt_divider_area: string;
         ui_cpnt_button_white_base_hover: string;
         ui_cpnt_button_white_base_pressed: string;
+        ui_cpnt_list_base_area_hover: string;
+        ui_cpnt_sheet_border_01: string;
+        ui_cpnt_sheet_border_02: string;
+        ui_cpnt_sheet_border_03: string;
+        ui_43: string;
+        ui_44: string;
+        ui_45: string;
+        ui_46: string;
+        ui_47: string;
+        ui_cpnt_sheet_base_03: string;
     };
 };
 export default colorSet;

package/dist/src/common/styles/colorSet/index.js

@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 /* eslint-disable import/order */
 var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
-var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
 var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
+var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
 var UIColor_json_1 = __importDefault(require("./UIColor.json"));
 var colorSet = {
     SemanticColor: SemanticColor_json_1.default,
-    PaletteColor_Dark: PaletteColor_Dark_json_1.default,
     PaletteColor_light: PaletteColor_light_json_1.default,
+    PaletteColor_Dark: PaletteColor_Dark_json_1.default,
     UIColor: UIColor_json_1.default
 };
 exports.default = colorSet;

package/dist/src/common/styles/colorSet/ui-type.d.ts

@@ -514,4 +514,14 @@ export interface UITheme {
     ui_cpnt_divider_area: string;
     ui_cpnt_button_white_base_hover: string;
     ui_cpnt_button_white_base_pressed: string;
+    ui_cpnt_list_base_area_hover: string;
+    ui_cpnt_sheet_border_01: string;
+    ui_cpnt_sheet_border_02: string;
+    ui_cpnt_sheet_border_03: string;
+    ui_43: string;
+    ui_44: string;
+    ui_45: string;
+    ui_46: string;
+    ui_47: string;
+    ui_cpnt_sheet_base_03: string;
 }

package/dist/src/desktop/components/AdminListItem/AdminListItem.js

@@ -96,16 +96,16 @@ function AdminListItem(_a) {
                 quickActionBtnMode === 'btn_amount3' && quickActionBtn3Text && (react_1.default.createElement(S_QuickActionButton, { onClick: handleClickQuickActionBtn3, disabled: quickActionBtn3State === 'disabled' },
                     react_1.default.createElement(TextLabel_1.TextLabel, { text: quickActionBtn3Text, styleTheme: "caption1Regular", colorTheme: "sysTextBrandPrimary", colorOverride: quickActionBtn3State === 'disabled'
                             ? 'ui_cpnt_textlabel_sys_brand_primary_opacity50'
-                            : undefined }))),
+                            : undefined, textAlign: "center" }))),
                 (quickActionBtnMode === 'btn_amount2' || quickActionBtnMode === 'btn_amount3') &&
                     quickActionBtn2Text && (react_1.default.createElement(S_QuickActionButton, { onClick: handleClickQuickActionBtn2, disabled: quickActionBtn2State === 'disabled' },
                     react_1.default.createElement(TextLabel_1.TextLabel, { text: quickActionBtn2Text, styleTheme: "caption1Regular", colorTheme: "sysTextBrandPrimary", colorOverride: quickActionBtn2State === 'disabled'
                             ? 'ui_cpnt_textlabel_sys_brand_primary_opacity50'
-                            : undefined }))),
+                            : undefined, textAlign: "center" }))),
                 react_1.default.createElement(S_QuickActionButton, { onClick: handleClickQuickActionBtn1, disabled: quickActionBtn1State === 'disabled' },
                     react_1.default.createElement(TextLabel_1.TextLabel, { text: quickActionBtn1Text, styleTheme: "caption1Regular", colorTheme: "sysTextBrandPrimary", colorOverride: quickActionBtn1State === 'disabled'
                             ? 'ui_cpnt_textlabel_sys_brand_primary_opacity50'
-                            : undefined }))));
+                            : undefined, textAlign: "center" }))));
         }
     };
     var getColumnColorTheme = function (style) {

package/dist/src/desktop/components/Chip/Chip.js

@@ -60,29 +60,29 @@ function Chip(_a) {
                     !isActive && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(Icon_1.Icon, { size: 16, fillType: "line", iconName: "ic_filter", colorKey: "ui_cpnt_chip_line_icon_01" }),
                         react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }))),
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextPrimary', ellipsisMode: "use", lineLimit: 1 }),
                     isActive && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }),
                         react_1.default.createElement(Icon_1.Icon, { size: 12, fillType: "line", iconName: "ic_xmark", colorKey: "ui_cpnt_chip_fill_icon_active_01" })))));
             case 'information':
                 return (react_1.default.createElement(S_InfoChip, { onClick: handleClickChip },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", singleLineMode: "use", colorTheme: "sysTextPrimary" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", singleLineMode: "use", colorTheme: "sysTextPrimary", ellipsisMode: "use", lineLimit: 1 })));
             case 'label':
                 return (react_1.default.createElement(S_LabelChip, { onClick: handleClickChip },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextTertiary" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextTertiary", ellipsisMode: "use", lineLimit: 1 })));
             case 'time':
                 return (react_1.default.createElement(S_TimeChip, { onClick: handleClickChip },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextWhite" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextWhite", ellipsisMode: "use", lineLimit: 1 })));
             case 'removable':
                 return (react_1.default.createElement(S_RemovableChip, { onClick: handleClickChip },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: "sysTextSecondary" }),
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: "sysTextSecondary", ellipsisMode: "use", lineLimit: 1 }),
                     react_1.default.createElement(S_XIconWrapper, { onClick: handleClickXMarkIcon },
                         react_1.default.createElement(Icon_1.Icon, { size: 12, iconName: "ic_xmark", fillType: "line", colorKey: "ui_cpnt_chip_fill_icon_inactive" }))));
             default:
                 return (react_1.default.createElement(S_FilterSingleChip, { isActive: isActive, onClick: handleClickChip },
                     filterIconMode === 'left' && (react_1.default.createElement(S_FilterIconWrapper, null,
                         react_1.default.createElement(Icon_1.Icon, { fillType: iconFillType, iconName: iconName, size: 16, colorKey: isActive ? 'ui_cpnt_chip_fill_icon_active_01' : 'ui_cpnt_chip_line_icon_02' }))),
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextSecondary' })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextSecondary', ellipsisMode: "use", lineLimit: 1 })));
         }
     };
     return react_1.default.createElement(S_ChipWrapper, null, chipType());
@@ -156,5 +156,5 @@ var S_TimeChip = styled_components_1.default.div(templateObject_8 || (templateOb
     var theme = _a.theme;
     return theme.spacing.spacingB;
 });
-var S_ChipWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: inline-block;\n  vertical-align: bottom;\n"], ["\n  display: inline-block;\n  vertical-align: bottom;\n"])));
+var S_ChipWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: inline-block;\n  vertical-align: bottom;\n  min-width: fit-content;\n"], ["\n  display: inline-block;\n  vertical-align: bottom;\n  min-width: fit-content;\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/ContextMenuNavs/ContextMenuItemNav.js

@@ -39,13 +39,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importStar(require("styled-components"));
+var DisplayOnlyMenuItemNav_1 = __importDefault(require("../MenuItemNav/components/DisplayOnlyMenuItemNav"));
+var InternalLinkMenuItemNav_1 = __importDefault(require("../MenuItemNav/components/InternalLinkMenuItemNav"));
 var PAppMenuItemNav_1 = __importDefault(require("../MenuItemNav/components/PAppMenuItemNav"));
 var WebMenuItemNav_1 = __importDefault(require("../MenuItemNav/components/WebMenuItemNav"));
 function ContextMenuItemNavBox(_a) {
     var menu = _a.menu;
     return (react_1.default.createElement(S_ContextMenuItem, { size: "small" },
         menu.menuItemType === 'NAV_P_APP' && menu.pAppCode && (react_1.default.createElement(PAppMenuItemNav_1.default, { menu: __assign(__assign({}, menu), { pAppCode: menu.pAppCode }), isContextMenu: true })),
-        menu.menuItemType === 'WEB_LINK' && menu.conversionLinkSrc && (react_1.default.createElement(WebMenuItemNav_1.default, { isContextMenu: true, menu: __assign(__assign({}, menu), { conversionLinkSrc: menu.conversionLinkSrc }) }))));
+        menu.menuItemType === 'WEB_LINK' && menu.conversionLinkSrc && (react_1.default.createElement(WebMenuItemNav_1.default, { openNewTab: true, isContextMenu: true, menu: __assign(__assign({}, menu), { conversionLinkSrc: menu.conversionLinkSrc }) })),
+        menu.menuItemType === 'INTERNAL_LINK' && menu.conversionLinkSrc && (react_1.default.createElement(InternalLinkMenuItemNav_1.default, { isContextMenu: true, menu: __assign(__assign({}, menu), { conversionLinkSrc: menu.conversionLinkSrc }) })),
+        menu.menuItemType === 'DISPLAY_ONLY' && (react_1.default.createElement(DisplayOnlyMenuItemNav_1.default, { menu: __assign(__assign({}, menu), { conversionLinkSrc: '' }) }))));
 }
 var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 48px;\n  padding: 0 ", ";\n"], ["\n  height: 48px;\n  padding: 0 ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/IconNav.d.ts

@@ -3,6 +3,7 @@ import { PDSIconType } from '../../../../common';
 declare type Props = {
     to: string;
     iconName: PDSIconType;
+    openNewTab: boolean;
 };
-declare function IconNav({ to, iconName }: Props): JSX.Element;
+declare function IconNav({ to, iconName, openNewTab }: Props): JSX.Element;
 export default IconNav;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/IconNav.js

@@ -7,8 +7,8 @@ var react_1 = __importDefault(require("react"));
 var __1 = require("../../..");
 var Navigations_1 = require("../../../../common/components/Navigations");
 function IconNav(_a) {
-    var to = _a.to, iconName = _a.iconName;
-    return (react_1.default.createElement(Navigations_1.NavLink, { to: to },
+    var to = _a.to, iconName = _a.iconName, openNewTab = _a.openNewTab;
+    return (react_1.default.createElement(Navigations_1.NavLink, { to: to, openNewTab: openNewTab },
         react_1.default.createElement(__1.D_IconButton, { fillType: "fill", baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconName: iconName, iconFillType: "line", iconColorKey: "ui_menu_primarymenu_main", shapeType: "rectangle", iconSize: 24 })));
 }
 exports.default = IconNav;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/MenuItemNav.js

@@ -41,6 +41,8 @@ var react_1 = __importStar(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var hybrid_1 = require("../../../../../hybrid");
 var ContextMenuNavs_1 = require("../ContextMenuNavs");
+var DisplayOnlyMenuItemNav_1 = __importDefault(require("./components/DisplayOnlyMenuItemNav"));
+var InternalLinkMenuItemNav_1 = __importDefault(require("./components/InternalLinkMenuItemNav"));
 var PAppMenuItemNav_1 = __importDefault(require("./components/PAppMenuItemNav"));
 var WebMenuItemNav_1 = __importDefault(require("./components/WebMenuItemNav"));
 // NOTE: 서버에서 itemType으로 enum값이 잘 오면 아래 불필요한 케이스/default 간소화
@@ -55,12 +57,17 @@ function MenuItemNav(_a) {
         setIsContextOpen(false);
     }, []);
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(S_Box, { ref: ref, onMouseOver: handleMouseOver, onMouseLeave: handleMouseOut, onWheel: handleMouseOut, showMenuAsIcon: showMenuAsIcon },
+        react_1.default.createElement(S_Box, { ref: ref, onMouseOver: handleMouseOver, onMouseLeave: handleMouseOut, onWheel: handleMouseOut, showMenuAsIcon: showMenuAsIcon, type: menu.menuItemType },
             menu.menuItemType === 'NAV_P_APP' && menu.pAppCode && (react_1.default.createElement(PAppMenuItemNav_1.default, { menu: __assign(__assign({}, menu), { pAppCode: menu.pAppCode }), showMenuAsIcon: showMenuAsIcon })),
-            menu.menuItemType === 'WEB_LINK' && menu.conversionLinkSrc && (react_1.default.createElement(WebMenuItemNav_1.default, { menu: __assign(__assign({}, menu), { conversionLinkSrc: menu.conversionLinkSrc }), showMenuAsIcon: showMenuAsIcon })),
+            menu.menuItemType === 'WEB_LINK' && menu.conversionLinkSrc && (react_1.default.createElement(WebMenuItemNav_1.default, { openNewTab: true, menu: __assign(__assign({}, menu), { conversionLinkSrc: menu.conversionLinkSrc }), showMenuAsIcon: showMenuAsIcon })),
+            menu.menuItemType === 'INTERNAL_LINK' && menu.conversionLinkSrc && (react_1.default.createElement(InternalLinkMenuItemNav_1.default, { menu: __assign(__assign({}, menu), { conversionLinkSrc: menu.conversionLinkSrc }), showMenuAsIcon: showMenuAsIcon })),
+            menu.menuItemType === 'DISPLAY_ONLY' && (react_1.default.createElement(DisplayOnlyMenuItemNav_1.default, { menu: __assign(__assign({}, menu), { conversionLinkSrc: '' }), showMenuAsIcon: showMenuAsIcon })),
             isContextOpen && menu.parsedNodes.length > 0 && (react_1.default.createElement(ContextMenuNavs_1.ContextMenuNavs, { parentRef: ref }, menu.parsedNodes.map(function (nav, index) { return (react_1.default.createElement(ContextMenuNavs_1.ContextMenuItemNav, { key: index, menu: nav })); })))),
         showMenuAsIcon ? (react_1.default.createElement(hybrid_1.Spacing, { spacingType: "width", size: "spacing_b" })) : (react_1.default.createElement(hybrid_1.Spacing, { spacingType: "width", size: "spacing_f" }))));
 }
-var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  cursor: pointer;\n  display: flex;\n"], ["\n  align-items: center;\n  cursor: pointer;\n  display: flex;\n"])));
+var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  cursor: ", ";\n  display: flex;\n"], ["\n  align-items: center;\n  cursor: ", ";\n  display: flex;\n"])), function (_a) {
+    var type = _a.type;
+    return (type === 'DISPLAY_ONLY' ? 'default' : 'pointer');
+});
 exports.default = MenuItemNav;
 var templateObject_1;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/components/DisplayOnlyMenuItemNav.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { ParsedNode } from '../../../types';
+declare type WithRequired<T, K extends keyof T> = T & {
+    [P in K]-?: T[P];
+};
+declare type Props = {
+    menu: WithRequired<ParsedNode, 'conversionLinkSrc'>;
+    showMenuAsIcon?: boolean;
+    isContextMenu?: boolean;
+};
+declare function DisplayOnlyMenuItemNav({ menu, showMenuAsIcon, isContextMenu }: Props): JSX.Element;
+export default DisplayOnlyMenuItemNav;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/components/DisplayOnlyMenuItemNav.js

@@ -0,0 +1,32 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var styled_components_1 = __importDefault(require("styled-components"));
+var Navigations_1 = require("../../../../../../common/components/Navigations");
+var IconNav_1 = __importDefault(require("../../IconNav"));
+var ImageIconNav_1 = __importDefault(require("../../ImageIconNav"));
+function DisplayOnlyMenuItemNav(_a) {
+    var menu = _a.menu, showMenuAsIcon = _a.showMenuAsIcon, isContextMenu = _a.isContextMenu;
+    if (showMenuAsIcon) {
+        if (menu.iconSrc) {
+            return (react_1.default.createElement(DeactivateLinkBox, null,
+                react_1.default.createElement(ImageIconNav_1.default, { to: menu.conversionLinkSrc, iconSrc: menu.iconSrc, openNewTab: false }),
+                ";"));
+        }
+        if (menu.iconName) {
+            return (react_1.default.createElement(DeactivateLinkBox, null,
+                react_1.default.createElement(IconNav_1.default, { to: menu.conversionLinkSrc, iconName: menu.iconName, openNewTab: false })));
+        }
+    }
+    return (react_1.default.createElement(DeactivateLinkBox, null, isContextMenu ? (react_1.default.createElement(Navigations_1.ContextTextLabelNav, { preventLineChange: true, openNewTab: false, to: menu.conversionLinkSrc, text: menu.name })) : (react_1.default.createElement(Navigations_1.TextLabelNav, { preventLineChange: true, openNewTab: false, to: menu.conversionLinkSrc, text: menu.name }))));
+}
+var DeactivateLinkBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  pointer-events: none;\n  width: max-content;\n"], ["\n  pointer-events: none;\n  width: max-content;\n"])));
+exports.default = DisplayOnlyMenuItemNav;
+var templateObject_1;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/components/InternalLinkMenuItemNav.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { ParsedNode } from '../../../types';
+declare type WithRequired<T, K extends keyof T> = T & {
+    [P in K]-?: T[P];
+};
+declare type Props = {
+    menu: WithRequired<ParsedNode, 'conversionLinkSrc'>;
+    showMenuAsIcon?: boolean;
+    isContextMenu?: boolean;
+};
+declare function WebMenuItemNav({ menu, showMenuAsIcon, isContextMenu }: Props): JSX.Element;
+export default WebMenuItemNav;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/components/InternalLinkMenuItemNav.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var Navigations_1 = require("../../../../../../common/components/Navigations");
+var IconNav_1 = __importDefault(require("../../IconNav"));
+var ImageIconNav_1 = __importDefault(require("../../ImageIconNav"));
+function WebMenuItemNav(_a) {
+    var menu = _a.menu, showMenuAsIcon = _a.showMenuAsIcon, isContextMenu = _a.isContextMenu;
+    if (showMenuAsIcon) {
+        if (menu.iconSrc) {
+            return react_1.default.createElement(ImageIconNav_1.default, { to: menu.conversionLinkSrc, iconSrc: menu.iconSrc, openNewTab: false });
+        }
+        if (menu.iconName) {
+            return react_1.default.createElement(IconNav_1.default, { to: menu.conversionLinkSrc, iconName: menu.iconName, openNewTab: false });
+        }
+    }
+    return isContextMenu ? (react_1.default.createElement(Navigations_1.ContextTextLabelNav, { preventLineChange: true, openNewTab: false, to: menu.conversionLinkSrc, text: menu.name })) : (react_1.default.createElement(Navigations_1.TextLabelNav, { preventLineChange: true, openNewTab: false, to: menu.conversionLinkSrc, text: menu.name }));
+}
+exports.default = WebMenuItemNav;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/components/PAppMenuItemNav.js

@@ -37,12 +37,12 @@ function PAppMenuItemNav(_a) {
         return (activeMatch === null || activeMatch === void 0 ? void 0 : activeMatch.params.activeKey) === menu.pAppCode;
     }, [menu, match, activeMatch]);
     if (showMenuAsIcon) {
-        if (menu.iconName) {
-            return react_1.default.createElement(IconNav_1.default, { to: basePath + "/" + menu.pAppCode, iconName: menu.iconName });
-        }
         if (menu.iconSrc) {
             return (react_1.default.createElement(ImageIconNav_1.default, { to: basePath + "/" + menu.pAppCode, iconSrc: menu.iconSrc, openNewTab: false }));
         }
+        if (menu.iconName) {
+            return (react_1.default.createElement(IconNav_1.default, { to: basePath + "/" + menu.pAppCode, iconName: menu.iconName, openNewTab: false }));
+        }
     }
     return isContextMenu ? (react_1.default.createElement(Navigations_1.ContextTextLabelNav, { isActive: isActive, preventLineChange: true, openNewTab: false, to: basePath + "/" + menu.pAppCode, text: menu.name })) : (react_1.default.createElement(Navigations_1.TextLabelNav, { isActive: isActive, preventLineChange: true, openNewTab: false, to: basePath + "/" + menu.pAppCode, text: menu.name }));
 }

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/components/WebMenuItemNav.d.ts

@@ -7,6 +7,7 @@ declare type Props = {
     menu: WithRequired<ParsedNode, 'conversionLinkSrc'>;
     showMenuAsIcon?: boolean;
     isContextMenu?: boolean;
+    openNewTab: boolean;
 };
-declare function WebMenuItemNav({ menu, showMenuAsIcon, isContextMenu }: Props): JSX.Element;
+declare function WebMenuItemNav({ menu, showMenuAsIcon, isContextMenu, openNewTab }: Props): JSX.Element;
 export default WebMenuItemNav;

package/dist/src/desktop/components/DynamicDesktopNavBar/components/MenuItemNav/components/WebMenuItemNav.js

@@ -8,15 +8,15 @@ var Navigations_1 = require("../../../../../../common/components/Navigations");
 var IconNav_1 = __importDefault(require("../../IconNav"));
 var ImageIconNav_1 = __importDefault(require("../../ImageIconNav"));
 function WebMenuItemNav(_a) {
-    var menu = _a.menu, showMenuAsIcon = _a.showMenuAsIcon, isContextMenu = _a.isContextMenu;
+    var menu = _a.menu, showMenuAsIcon = _a.showMenuAsIcon, isContextMenu = _a.isContextMenu, openNewTab = _a.openNewTab;
     if (showMenuAsIcon) {
         if (menu.iconSrc) {
-            return react_1.default.createElement(ImageIconNav_1.default, { to: menu.conversionLinkSrc, iconSrc: menu.iconSrc, openNewTab: true });
+            return (react_1.default.createElement(ImageIconNav_1.default, { to: menu.conversionLinkSrc, iconSrc: menu.iconSrc, openNewTab: openNewTab }));
         }
         if (menu.iconName) {
-            return react_1.default.createElement(IconNav_1.default, { to: "/" + menu.pAppCode, iconName: menu.iconName });
+            return (react_1.default.createElement(IconNav_1.default, { to: menu.conversionLinkSrc, iconName: menu.iconName, openNewTab: openNewTab }));
         }
     }
-    return isContextMenu ? (react_1.default.createElement(Navigations_1.ContextTextLabelNav, { preventLineChange: true, openNewTab: true, to: menu.conversionLinkSrc, text: menu.name })) : (react_1.default.createElement(Navigations_1.TextLabelNav, { preventLineChange: true, openNewTab: true, to: menu.conversionLinkSrc, text: menu.name }));
+    return isContextMenu ? (react_1.default.createElement(Navigations_1.ContextTextLabelNav, { preventLineChange: true, openNewTab: openNewTab, to: menu.conversionLinkSrc, text: menu.name })) : (react_1.default.createElement(Navigations_1.TextLabelNav, { preventLineChange: true, openNewTab: openNewTab, to: menu.conversionLinkSrc, text: menu.name }));
 }
 exports.default = WebMenuItemNav;

package/dist/src/desktop/components/DynamicDesktopNavBar/types.d.ts

@@ -1,7 +1,7 @@
 import { PDSIconType } from '../../../common';
 export type { DynamicDesktopTemplateType, TemplateNamesType, TemplatesDataType } from './templates/types';
 export declare type ParsedNode = {
-    menuItemType: 'NAV_P_APP' | 'WEB_LINK';
+    menuItemType: menuItemTypes;
     type: 'GENERAL_NODE';
     name: string;
     iconSrc?: string;
@@ -11,3 +11,4 @@ export declare type ParsedNode = {
     conversionLinkSrc?: string;
     parsedNodes: Array<ParsedNode>;
 };
+export declare type menuItemTypes = 'NAV_P_APP' | 'WEB_LINK' | 'INTERNAL_LINK' | 'DISPLAY_ONLY';

package/dist/src/desktop/components/Select/Select.js

@@ -22,19 +22,18 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importStar(require("styled-components"));
 var hybrid_1 = require("../../../hybrid");
+var HINT = 'HINT_VALUE';
 function Select(_a) {
-    var hintText = _a.hintText, defaultValue = _a.defaultValue, valueArray = _a.valueArray, _b = _a.size, size = _b === void 0 ? 'large' : _b, _c = _a.responsiveMode, responsiveMode = _c === void 0 ? 'none' : _c, _d = _a.state, state = _d === void 0 ? 'normal' : _d, onChange = _a.onChange, _e = _a.colorTheme, colorTheme = _e === void 0 ? 'none' : _e;
-    var _f = (0, react_1.useState)(false), isFocused = _f[0], setIsFocused = _f[1];
-    var handleClick = function () {
-        state === 'normal' && setIsFocused(true);
-    };
-    var handleBlur = function () { return setIsFocused(false); };
+    var _b;
+    var hintText = _a.hintText, defaultValue = _a.defaultValue, valueArray = _a.valueArray, _c = _a.size, size = _c === void 0 ? 'large' : _c, _d = _a.responsiveMode, responsiveMode = _d === void 0 ? 'none' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, onChange = _a.onChange, _f = _a.colorTheme, colorTheme = _f === void 0 ? 'none' : _f;
     var handleChange = function (e) {
-        setIsFocused(false);
         if (onChange) {
             onChange(e);
         }
@@ -55,11 +54,11 @@ function Select(_a) {
             return 'ui_cpnt_select_icon_01';
         }
     };
-    return (react_1.default.createElement(S_Box, { size: size, responsiveMode: responsiveMode, onClick: handleClick, onBlur: handleBlur, tabIndex: 0 },
+    return (react_1.default.createElement(S_Box, { size: size, responsiveMode: responsiveMode, tabIndex: 0 },
         react_1.default.createElement(S_Icon_Wrapper, { state: state },
-            react_1.default.createElement(hybrid_1.Icon, { size: 16, fillType: "line", iconName: isFocused ? 'ic_arrow_up' : 'ic_arrow_down', colorKey: getIconColorKey() })),
-        react_1.default.createElement(S_Select, { disabled: state === 'disabled' || state === 'read_only', defaultValue: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value) || '', state: state, colorTheme: colorTheme, onChange: handleChange },
-            react_1.default.createElement("option", { disabled: true, value: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value) || '' }, (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.text) || hintText),
+            react_1.default.createElement(hybrid_1.Icon, { size: 16, fillType: "line", iconName: "ic_arrow_down", colorKey: getIconColorKey() })),
+        react_1.default.createElement(S_Select, { disabled: state === 'disabled' || state === 'read_only', state: state, colorTheme: colorTheme, onChange: handleChange, defaultValue: (_b = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value) !== null && _b !== void 0 ? _b : HINT },
+            hintText && (react_1.default.createElement("option", { disabled: true, value: HINT }, hintText)),
             valueArray.map(function (el) { return (react_1.default.createElement("option", { key: el.value, value: el.value }, el.text)); }))));
 }
 var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 48px;\n  width: 432px;\n"], ["\n  height: 48px;\n  width: 432px;\n"])));
@@ -106,7 +105,7 @@ var S_Box = styled_components_1.default.div(templateObject_6 || (templateObject_
     var responsiveMode = _a.responsiveMode;
     return responsiveMode === 'use' && 'width: 100%';
 });
-var S_Icon_Wrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  height: 16px;\n  position: absolute;\n  right: ", ";\n  top: 50%;\n  transform: translateY(-50%);\n  width: 16px;\n"], ["\n  align-items: center;\n  display: flex;\n  height: 16px;\n  position: absolute;\n  right: ", ";\n  top: 50%;\n  transform: translateY(-50%);\n  width: 16px;\n"])), function (_a) {
+var S_Icon_Wrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  height: 16px;\n  position: absolute;\n  right: ", ";\n  top: 50%;\n  transform: translateY(-50%);\n  width: 16px;\n  pointer-events: none;\n"], ["\n  align-items: center;\n  display: flex;\n  height: 16px;\n  position: absolute;\n  right: ", ";\n  top: 50%;\n  transform: translateY(-50%);\n  width: 16px;\n  pointer-events: none;\n"])), function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingD;
 });

package/dist/src/hybrid/components/Switch/Switch.js

@@ -19,9 +19,12 @@ function Switch(_a) {
         react_1.default.createElement(S_Label, { htmlFor: name, disabled: state === 'disabled' })));
 }
 var S_Switch = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  width: 56px;\n  height: 32px;\n"], ["\n  position: relative;\n  width: 56px;\n  height: 32px;\n"])));
-var S_Label = styled_components_1.default.label(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 56px;\n  height: 32px;\n  border-radius: 24px;\n  background: ", ";\n  cursor: pointer;\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 24px;\n    width: 24px;\n    height: 24px;\n    margin: ", ";\n    background: ", ";\n  }\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 56px;\n  height: 32px;\n  border-radius: 24px;\n  background: ", ";\n  cursor: pointer;\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 24px;\n    width: 24px;\n    height: 24px;\n    margin: ", ";\n    background: ", ";\n  }\n"])), function (_a) {
+var S_Label = styled_components_1.default.label(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 56px;\n  height: 32px;\n  border-radius: 24px;\n  background: ", ";\n  cursor: ", ";\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 24px;\n    width: 24px;\n    height: 24px;\n    margin: ", ";\n    background: ", ";\n  }\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 56px;\n  height: 32px;\n  border-radius: 24px;\n  background: ", ";\n  cursor: ", ";\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 24px;\n    width: 24px;\n    height: 24px;\n    margin: ", ";\n    background: ", ";\n  }\n"])), function (_a) {
     var theme = _a.theme, disabled = _a.disabled;
     return disabled ? theme.ui_cpnt_selcontrols_base_off_disabled : theme.ui_cpnt_selcontrols_base_off;
+}, function (_a) {
+    var disabled = _a.disabled;
+    return (disabled ? 'default' : 'pointer');
 }, function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingA;

package/dist/src/mobile/components/Chip/Chip.js

@@ -60,29 +60,29 @@ function Chip(_a) {
                     !isActive && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(Icon_1.Icon, { size: 16, fillType: "line", iconName: "ic_filter", colorKey: "ui_cpnt_chip_line_icon_01" }),
                         react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }))),
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextPrimary', ellipsisMode: "use", lineLimit: 1 }),
                     isActive && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }),
                         react_1.default.createElement(Icon_1.Icon, { size: 12, fillType: "line", iconName: "ic_xmark", colorKey: "ui_cpnt_chip_fill_icon_active_01" })))));
             case 'information':
                 return (react_1.default.createElement(S_InfoChip, { onClick: handleClickChip },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", singleLineMode: "use", colorTheme: "sysTextPrimary" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", singleLineMode: "use", colorTheme: "sysTextPrimary", ellipsisMode: "use", lineLimit: 1 })));
             case 'label':
                 return (react_1.default.createElement(S_LabelChip, { onClick: handleClickChip },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextTertiary" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextTertiary", ellipsisMode: "use", lineLimit: 1 })));
             case 'time':
                 return (react_1.default.createElement(S_TimeChip, { onClick: handleClickChip },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextWhite" })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextWhite", ellipsisMode: "use", lineLimit: 1 })));
             case 'removable':
                 return (react_1.default.createElement(S_RemovableChip, { onClick: handleClickChip },
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: "sysTextSecondary" }),
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: "sysTextSecondary", ellipsisMode: "use", lineLimit: 1 }),
                     react_1.default.createElement(S_XIconWrapper, { onClick: handleClickXMarkIcon },
                         react_1.default.createElement(Icon_1.Icon, { size: 12, iconName: "ic_xmark", fillType: "line", colorKey: "ui_cpnt_chip_fill_icon_inactive" }))));
             default:
                 return (react_1.default.createElement(S_FilterSingleChip, { isActive: isActive, onClick: handleClickChip },
                     filterIconMode === 'left' && (react_1.default.createElement(S_FilterIconWrapper, null,
                         react_1.default.createElement(Icon_1.Icon, { fillType: iconFillType, iconName: iconName, size: 16, colorKey: isActive ? 'ui_cpnt_chip_fill_icon_active_01' : 'ui_cpnt_chip_line_icon_02' }))),
-                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextSecondary' })));
+                    react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextSecondary', ellipsisMode: "use", lineLimit: 1 })));
         }
     };
     return react_1.default.createElement(S_ChipWrapper, null, chipType());
@@ -153,5 +153,5 @@ var S_TimeChip = styled_components_1.default.div(templateObject_8 || (templateOb
     var theme = _a.theme;
     return theme.spacing.spacingB;
 });
-var S_ChipWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: inline-block;\n  vertical-align: bottom;\n"], ["\n  display: inline-block;\n  vertical-align: bottom;\n"])));
+var S_ChipWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: inline-block;\n  vertical-align: bottom;\n  min-width: fit-content;\n"], ["\n  display: inline-block;\n  vertical-align: bottom;\n  min-width: fit-content;\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;

package/dist/src/mobile/components/Select/Select.js

@@ -22,19 +22,18 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importStar(require("styled-components"));
 var hybrid_1 = require("../../../hybrid");
+var HINT = 'HINT_VALUE';
 function Select(_a) {
-    var hintText = _a.hintText, defaultValue = _a.defaultValue, valueArray = _a.valueArray, _b = _a.size, size = _b === void 0 ? 'large' : _b, _c = _a.responsiveMode, responsiveMode = _c === void 0 ? 'none' : _c, _d = _a.state, state = _d === void 0 ? 'normal' : _d, onChange = _a.onChange, _e = _a.colorTheme, colorTheme = _e === void 0 ? 'none' : _e;
-    var _f = (0, react_1.useState)(false), isFocused = _f[0], setIsFocused = _f[1];
-    var handleClick = function () {
-        state === 'normal' && setIsFocused(true);
-    };
-    var handleBlur = function () { return setIsFocused(false); };
+    var _b;
+    var hintText = _a.hintText, defaultValue = _a.defaultValue, valueArray = _a.valueArray, _c = _a.size, size = _c === void 0 ? 'large' : _c, _d = _a.responsiveMode, responsiveMode = _d === void 0 ? 'none' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, onChange = _a.onChange, _f = _a.colorTheme, colorTheme = _f === void 0 ? 'none' : _f;
     var handleChange = function (e) {
-        setIsFocused(false);
         if (onChange) {
             onChange(e);
         }
@@ -51,11 +50,11 @@ function Select(_a) {
         }
         return 'ui_cpnt_select_icon_01';
     };
-    return (react_1.default.createElement(S_Box, { size: size, responsiveMode: responsiveMode, onClick: handleClick, onBlur: handleBlur, tabIndex: 0 },
+    return (react_1.default.createElement(S_Box, { size: size, responsiveMode: responsiveMode, tabIndex: 0 },
         react_1.default.createElement(S_Icon_Wrapper, { state: state },
-            react_1.default.createElement(hybrid_1.Icon, { size: 16, fillType: "line", iconName: isFocused ? 'ic_arrow_up' : 'ic_arrow_down', colorKey: getIconColorKey() })),
-        react_1.default.createElement(S_Select, { disabled: state === 'disabled' || state === 'read_only', defaultValue: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value) || '', state: state, colorTheme: colorTheme, onChange: handleChange },
-            react_1.default.createElement("option", { disabled: true, value: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value) || '' }, (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.text) || hintText),
+            react_1.default.createElement(hybrid_1.Icon, { size: 16, fillType: "line", iconName: "ic_arrow_down", colorKey: getIconColorKey() })),
+        react_1.default.createElement(S_Select, { disabled: state === 'disabled' || state === 'read_only', state: state, colorTheme: colorTheme, onChange: handleChange, defaultValue: (_b = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value) !== null && _b !== void 0 ? _b : HINT },
+            hintText && (react_1.default.createElement("option", { disabled: true, value: HINT }, hintText)),
             valueArray.map(function (el) { return (react_1.default.createElement("option", { key: el.value, value: el.value }, el.text)); }))));
 }
 var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: 48px;\n  width: 432px;\n"], ["\n  height: 48px;\n  width: 432px;\n"])));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web",
-  "version": "1.4.11",
+  "version": "1.4.14",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",

package/release-note.md

@@ -1,6 +1,19 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v1.4.11]
+## [v1.4.14]
 
 ### Component
+* AdminListItem
+  * QuickActionBtn의 text-align을 left에서 center로 변경
+* Chip
+  * 한줄만 표시할 수 있도록 수정
 * DynamicDesktopNavBar
-  * 내부에 있던 browserRouter 제거(컴포넌트 사용시에 각자 넣어서 사용하도록)
+  * 내부의 MenuItemNav에  'INTERNAL_LINK' | 'DISPLAY_ONLY' 타입을 추가
+* Icon
+  * ic_clip line 추가
+* Select
+  * defaultValue를 부여한경우 체크 표시와 함께 disabled 처리 되지 않은 상태로 보여지게 수정
+  * hintText가 options에 포함되어 나타나되, disabled처리되어 보이게 수정
+  * 우측 Icon영역을 클릭해도 option이 열리도록 수정
+
+### Color
+* 컬러 키 값 22.06.24 12시 42분 기준 싱크