pds-dev-kit-web 1.3.5 → 1.3.6

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

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

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

@@ -0,0 +1,38 @@
+"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 DesignPreference = 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("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24" },
+            react_1.default.createElement("g", { fill: "none", fillRule: "evenodd" },
+                react_1.default.createElement("path", { stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M14.0742,15.9112 C12.1572,16.6692 10.8122,18.4402 10.8122,20.5052 C10.8122,20.9592 10.8782,21.3992 11.0002,21.8172 C5.8122,21.4682 1.7242,17.5842 1.7242,12.8452 C1.7242,7.8752 6.2192,3.8462 11.7632,3.8462 C13.6432,3.8462 15.4022,4.3092 16.9062,5.1152 M20.6709,8.6912 C21.3939,9.9342 21.8029,11.3462 21.8029,12.8452 C21.8029,14.5302 21.2849,16.1062 20.3859,17.4542 C19.6069,16.5162 18.4769,15.8432 17.1799,15.6092" }),
+                react_1.default.createElement("path", { fill: color, d: "M8.9422,10.4341 C8.9422,9.3141 8.0342,8.4061 6.9142,8.4061 C5.7952,8.4061 4.8872,9.3141 4.8872,10.4341 C4.8872,11.5541 5.7952,12.4621 6.9142,12.4621 C8.0342,12.4621 8.9422,11.5541 8.9422,10.4341 M13.5869,7.8135 C13.5869,6.8415 12.7989,6.0535 11.8269,6.0535 C10.8559,6.0535 10.0679,6.8415 10.0679,7.8135 C10.0679,8.7855 10.8559,9.5735 11.8269,9.5735 C12.7989,9.5735 13.5869,8.7855 13.5869,7.8135 M9.2917,16.0693 C9.2917,15.0973 8.5037,14.3093 7.5317,14.3093 C6.5607,14.3093 5.7727,15.0973 5.7727,16.0693 C5.7727,17.0413 6.5607,17.8293 7.5317,17.8293 C8.5037,17.8293 9.2917,17.0413 9.2917,16.0693" }),
+                react_1.default.createElement("path", { stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", d: "M17.7283,9.5905 C18.2343,9.7555 18.5663,10.0895 18.5163,10.5975 C18.5083,10.6775 18.4923,10.7575 18.4663,10.8375 L15.2993,20.2945 C15.1073,20.8805 14.4773,21.1985 13.8923,21.0075 C13.3073,20.8155 12.9883,20.1855 13.1803,19.6005 L16.3473,10.1425 C16.5393,9.5575 17.1433,9.3985 17.7283,9.5905 Z M18.6588,1.8879 C18.6588,1.8879 23.8258,3.4439 21.8078,7.3999 C21.8078,7.3999 21.4918,8.0149 20.8398,8.5739 C20.7368,8.6629 20.6258,8.7499 20.5058,8.8329 C19.2708,9.6879 17.7148,9.9479 16.6108,8.9289 C16.1568,8.5099 15.9078,7.6109 15.9508,7.1689 C16.0678,5.9859 16.7088,5.5819 17.6238,4.8589 C18.5388,4.1349 18.7498,2.9029 18.6588,1.8879 Z" })))));
+};
+exports.default = DesignPreference;

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

@@ -32,6 +32,7 @@ declare const lineIcons: {
     readonly ic_copy: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_cs: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_dashboard: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
+    readonly ic_design_preference: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_developer: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_edit: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
     readonly ic_editor: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;

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

@@ -35,6 +35,7 @@ var ContWatching_1 = __importDefault(require("./ContWatching"));
 var Copy_1 = __importDefault(require("./Copy"));
 var Cs_1 = __importDefault(require("./Cs"));
 var Dashboard_1 = __importDefault(require("./Dashboard"));
+var DesignPreference_1 = __importDefault(require("./DesignPreference"));
 var Developer_1 = __importDefault(require("./Developer"));
 var Edit_1 = __importDefault(require("./Edit"));
 var Editor_1 = __importDefault(require("./Editor"));
@@ -163,6 +164,7 @@ var lineIcons = {
     ic_copy: Copy_1.default,
     ic_cs: Cs_1.default,
     ic_dashboard: Dashboard_1.default,
+    ic_design_preference: DesignPreference_1.default,
     ic_developer: Developer_1.default,
     ic_edit: Edit_1.default,
     ic_editor: Editor_1.default,

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

@@ -469,6 +469,6 @@
     "ui_cpnt_pg_gradient_04": "sys_gradient_base_01_opacity75",
     "ui_cpnt_pg_gradient_05": "sys_gradient_base_01_opacity40",
     "ui_cpnt_mask_base": "sys_component_base_02",
-    "ui_temp_usr_primary_01": "usr_temp_primary_01",
+    "ui_temp_usr_primary_01": "usr_brand_primary",
     "ui_cpnt_sheet_base_02_opacity50": "sys_cpnt_sheet_base_02_opacity50"
 }

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

@@ -1,149 +1,62 @@
 declare const colorSet: {
-    readonly PaletteColor_Dark: {
-        sys_container_background_01: string;
-        sys_container_background_02: string;
-        sys_container_background_03: string;
-        sys_background_dimmed: string;
-        sys_text_grey_01: string;
-        sys_text_grey_02: string;
-        sys_text_grey_03: string;
-        sys_text_white: string;
-        sys_text_brand_primary: string;
-        sys_text_error_01: string;
-        sys_widget_grey_01: string;
-        sys_widget_grey_02: string;
-        sys_widget_grey_03: string;
-        sys_widget_primary_01: string;
-        sys_widget_error_01: string;
-        sys_widget_warning_01: string;
-        sys_widget_success_01: string;
-        sys_widget_white: string;
-        sys_border_area_01: string;
-        sys_border_line_01: string;
-        sys_border_line_02: string;
-        sys_border_line_03: string;
-        sys_border_line_04: string;
-        sys_border_line_05: string;
-        sys_component_base_01: string;
-        sys_component_base_02: string;
-        sys_component_base_03: string;
-        sys_component_base_red: string;
-        sys_component_base_white: string;
-        sys_component_base_white_opacity00: string;
-        sys_on_base_white_opacity00: string;
-        sys_on_base_white_opacity30: string;
-        sys_on_base_black_opacity20: string;
-        usr_brand_primary: string;
-        usr_brand_secondary: string;
-        usr_brand_secondary_variant: string;
-        usr_background: string;
-        usr_surface: string;
-        usr_border: string;
-        usr_on_brand_primary: string;
-        usr_on_brand_secondary: string;
-        usr_on_background: string;
-        usr_on_surface: string;
-        sys_widget_status_active_01: string;
-        sys_text_success_01: string;
-        sys_widget_grey_04: string;
-        sys_text_active: string;
-        sys_component_base_blue: string;
-        sys_on_base_black_opacity65: string;
-        sys_component_base_04: string;
-        sys_component_base_black: string;
-        sys_component_base_black_opacity00: string;
-        usr_text_brand_secondary_variant: string;
-        usr_text_brand_primary: string;
-        usr_text_brand_on_primary: string;
-        sys_text_brand_secondary_variant: string;
-        sys_component_base_navy: string;
-        sys_widget_lightgreen: string;
-        sys_border_line_06: string;
-        sys_background_dimmed_20: string;
-        sys_widget_pink: string;
-        sys_widget_primary_opacity20: string;
-        sys_widget_secondary_variant_01: string;
-        usr_component_base_brand_primary_opacity10: string;
-        sys_temp_grey_01: string;
-        sys_temp_grey_02: string;
-        sys_temp_grey_03: string;
-        sys_temp_grey_04: string;
-        sys_temp_grey_05: string;
-        sys_temp_white: string;
-        sys_temp_primary_01: string;
-        sys_temp_secondary_01: string;
-        sys_temp_red: string;
-        sys_temp_white_opacity_00: string;
-        sys_temp_dimmed: string;
-        sys_temp_black: string;
-        sys_temp_primary_02: string;
-        sys_temp_primary_03: string;
-        sys_temp_secondary_02: string;
-        sys_temp_lightgreen_01: string;
-        sys_text_grey_04: string;
-        sys_papp_post_social_background: string;
-        sys_papp_post_notice_background: string;
-        sys_papp_post_free_background: string;
-        sys_papp_vod_background: string;
-        sys_papp_vodplus_background: string;
-        sys_papp_live_background: string;
-        sys_selcontrols_base_off_disabled: string;
-        sys_selcontrols_base_on_disabled: string;
-        sys_component_base_blue_opacity10: string;
-        sys_component_base_05: string;
-        sys_background_dimmed_65: string;
-        sys_temp_grey_06: string;
-        sys_on_base_white_opacity10: string;
-        sys_on_base_black_opacity10: string;
-        sys_component_base_05_opacity00: string;
-        sys_papp_post_notice_link: string;
-        sys_component_base_navy_light: string;
-        sys_component_base_orange: string;
-        sys_component_base_grey: string;
-        sys_component_base_black_opacity80: string;
-        sys_text_darkgrey_02: string;
-        sys_border_line_darktheme_01: string;
-        sys_border_line_darktheme_02: string;
-        sys_component_base_darktheme_01: string;
-        sys_component_base_darktheme_02: string;
-        sys_component_base_darktheme_03: string;
-        sys_text_grey_darktheme_01: string;
-        sys_text_grey_darktheme_02: string;
-        sys_text_grey_darktheme_03: string;
-        sys_widget_grey_darktheme_01: string;
-        sys_widget_grey_darktheme_02: string;
-        sys_widget_grey_darktheme_03: string;
-        sys_component_base_green: string;
-        sys_text_error_darktheme_01: string;
-        sys_border_line_darktheme_03: string;
-        sys_border_line_darktheme_04: string;
-        usr_widget_brand_primary_darktheme_01: string;
-        usr_text_brand_primary_darktheme_01: string;
-        sys_component_base_black_opacity50: string;
-        sys_component_base_card: string;
-        sys_cpnt_textlabel_sys_brand_primary_opacity50: string;
-        sys_widget_green_01: string;
-        sys_component_base_black_opacity30: string;
-        sys_area_background: string;
-        sys_border_white_opacity30: string;
-        sys_container_background_wt: string;
-        sys_channeldesc_grey_03: string;
-        sys_channeldesc_border_grey_03: string;
-        sys_gradient_base_01: string;
-        sys_gradient_base_01_opacity00: string;
-        sys_channeldesc_background: string;
-        sys_channeldesc_bottomsheet_base: string;
-        sys_channeldesc_bottomsheet_border: string;
-        sys_channeldesc_contents_base: string;
-        sys_channeldesc_dimmed: string;
-        sys_gradient_base_01_opacity50: string;
-        sys_gradient_base_01_opacity75: string;
-        sys_gradient_base_01_opacity40: string;
-        sys_widget_black: string;
-        usr_temp_primary_01: string;
-        sys_cpnt_sheet_base_02_opacity50: string;
+    readonly SemanticColor: {
+        blue500: string;
+        blue700: string;
+        blue300: string;
+        green700: string;
+        green500: string;
+        green300: string;
+        red500: string;
+        grey900: string;
+        grey500: string;
+        grey400: string;
+        grey100: string;
+        grey50: string;
+        white: string;
+        black: string;
+        darkblue500: string;
+        grey950: string;
+        darkgrey900: string;
+        darkgrey500: string;
+        darkgrey400: string;
+        darkgrey100: string;
+        darkgrey50: string;
+        darkred500: string;
+        darkgreen700: string;
+        orange500: string;
+        darkorange500: string;
+        opacity00: string;
+        opacity20: string;
+        opacity30: string;
+        opacity65: string;
+        darkgreen500: string;
+        grey70: string;
+        navy500: string;
+        lightgreen500: string;
+        pink500: string;
+        darkgrey70: string;
+        darknavy500: string;
+        darkpink500: string;
+        darklightgreen500: string;
+        opacity10: string;
+        grey600: string;
+        darkgrey600: string;
+        skyblue500: string;
+        skyblue300: string;
+        pink300: string;
+        lightpink500: string;
+        darkblue300: string;
+        darkblue700: string;
+        darkgreen300: string;
+        darkskyblue500: string;
+        navy100: string;
+        darknavy100: string;
+        opacity80: string;
+        opacity50: string;
+        grey30: string;
+        opacity95: string;
     };
-    readonly PaletteColor_light: {
+    readonly PaletteColor_Dark: {
         sys_container_background_01: string;
         sys_container_background_02: string;
         sys_container_background_03: string;
@@ -761,62 +674,149 @@ declare const colorSet: {
         ui_temp_usr_primary_01: string;
         ui_cpnt_sheet_base_02_opacity50: string;
     };
-    readonly SemanticColor: {
-        blue500: string;
-        blue700: string;
-        blue300: string;
-        green700: string;
-        green500: string;
-        green300: string;
-        red500: string;
-        grey900: string;
-        grey500: string;
-        grey400: string;
-        grey100: string;
-        grey50: string;
-        white: string;
-        black: string;
-        darkblue500: string;
-        grey950: string;
-        darkgrey900: string;
-        darkgrey500: string;
-        darkgrey400: string;
-        darkgrey100: string;
-        darkgrey50: string;
-        darkred500: string;
-        darkgreen700: string;
-        orange500: string;
-        darkorange500: string;
-        opacity00: string;
-        opacity20: string;
-        opacity30: string;
-        opacity65: string;
-        darkgreen500: string;
-        grey70: string;
-        navy500: string;
-        lightgreen500: string;
-        pink500: string;
-        darkgrey70: string;
-        darknavy500: string;
-        darkpink500: string;
-        darklightgreen500: string;
-        opacity10: string;
-        grey600: string;
-        darkgrey600: string;
-        skyblue500: string;
-        skyblue300: string;
-        pink300: string;
-        lightpink500: string;
-        darkblue300: string;
-        darkblue700: string;
-        darkgreen300: string;
-        darkskyblue500: string;
-        navy100: string;
-        darknavy100: string;
-        opacity80: string;
-        opacity50: string;
-        grey30: string;
-        opacity95: string;
+    readonly PaletteColor_light: {
+        sys_container_background_01: string;
+        sys_container_background_02: string;
+        sys_container_background_03: string;
+        sys_background_dimmed: string;
+        sys_text_grey_01: string;
+        sys_text_grey_02: string;
+        sys_text_grey_03: string;
+        sys_text_white: string;
+        sys_text_brand_primary: string;
+        sys_text_error_01: string;
+        sys_widget_grey_01: string;
+        sys_widget_grey_02: string;
+        sys_widget_grey_03: string;
+        sys_widget_primary_01: string;
+        sys_widget_error_01: string;
+        sys_widget_warning_01: string;
+        sys_widget_success_01: string;
+        sys_widget_white: string;
+        sys_border_area_01: string;
+        sys_border_line_01: string;
+        sys_border_line_02: string;
+        sys_border_line_03: string;
+        sys_border_line_04: string;
+        sys_border_line_05: string;
+        sys_component_base_01: string;
+        sys_component_base_02: string;
+        sys_component_base_03: string;
+        sys_component_base_red: string;
+        sys_component_base_white: string;
+        sys_component_base_white_opacity00: string;
+        sys_on_base_white_opacity00: string;
+        sys_on_base_white_opacity30: string;
+        sys_on_base_black_opacity20: string;
+        usr_brand_primary: string;
+        usr_brand_secondary: string;
+        usr_brand_secondary_variant: string;
+        usr_background: string;
+        usr_surface: string;
+        usr_border: string;
+        usr_on_brand_primary: string;
+        usr_on_brand_secondary: string;
+        usr_on_background: string;
+        usr_on_surface: string;
+        sys_widget_status_active_01: string;
+        sys_text_success_01: string;
+        sys_widget_grey_04: string;
+        sys_text_active: string;
+        sys_component_base_blue: string;
+        sys_on_base_black_opacity65: string;
+        sys_component_base_04: string;
+        sys_component_base_black: string;
+        sys_component_base_black_opacity00: string;
+        usr_text_brand_secondary_variant: string;
+        usr_text_brand_primary: string;
+        usr_text_brand_on_primary: string;
+        sys_text_brand_secondary_variant: string;
+        sys_component_base_navy: string;
+        sys_widget_lightgreen: string;
+        sys_border_line_06: string;
+        sys_background_dimmed_20: string;
+        sys_widget_pink: string;
+        sys_widget_primary_opacity20: string;
+        sys_widget_secondary_variant_01: string;
+        usr_component_base_brand_primary_opacity10: string;
+        sys_temp_grey_01: string;
+        sys_temp_grey_02: string;
+        sys_temp_grey_03: string;
+        sys_temp_grey_04: string;
+        sys_temp_grey_05: string;
+        sys_temp_white: string;
+        sys_temp_primary_01: string;
+        sys_temp_secondary_01: string;
+        sys_temp_red: string;
+        sys_temp_white_opacity_00: string;
+        sys_temp_dimmed: string;
+        sys_temp_black: string;
+        sys_temp_primary_02: string;
+        sys_temp_primary_03: string;
+        sys_temp_secondary_02: string;
+        sys_temp_lightgreen_01: string;
+        sys_text_grey_04: string;
+        sys_papp_post_social_background: string;
+        sys_papp_post_notice_background: string;
+        sys_papp_post_free_background: string;
+        sys_papp_vod_background: string;
+        sys_papp_vodplus_background: string;
+        sys_papp_live_background: string;
+        sys_selcontrols_base_off_disabled: string;
+        sys_selcontrols_base_on_disabled: string;
+        sys_component_base_blue_opacity10: string;
+        sys_component_base_05: string;
+        sys_background_dimmed_65: string;
+        sys_temp_grey_06: string;
+        sys_on_base_white_opacity10: string;
+        sys_on_base_black_opacity10: string;
+        sys_component_base_05_opacity00: string;
+        sys_papp_post_notice_link: string;
+        sys_component_base_navy_light: string;
+        sys_component_base_orange: string;
+        sys_component_base_grey: string;
+        sys_component_base_black_opacity80: string;
+        sys_text_darkgrey_02: string;
+        sys_border_line_darktheme_01: string;
+        sys_border_line_darktheme_02: string;
+        sys_component_base_darktheme_01: string;
+        sys_component_base_darktheme_02: string;
+        sys_component_base_darktheme_03: string;
+        sys_text_grey_darktheme_01: string;
+        sys_text_grey_darktheme_02: string;
+        sys_text_grey_darktheme_03: string;
+        sys_widget_grey_darktheme_01: string;
+        sys_widget_grey_darktheme_02: string;
+        sys_widget_grey_darktheme_03: string;
+        sys_component_base_green: string;
+        sys_text_error_darktheme_01: string;
+        sys_border_line_darktheme_03: string;
+        sys_border_line_darktheme_04: string;
+        usr_widget_brand_primary_darktheme_01: string;
+        usr_text_brand_primary_darktheme_01: string;
+        sys_component_base_black_opacity50: string;
+        sys_component_base_card: string;
+        sys_cpnt_textlabel_sys_brand_primary_opacity50: string;
+        sys_widget_green_01: string;
+        sys_component_base_black_opacity30: string;
+        sys_area_background: string;
+        sys_border_white_opacity30: string;
+        sys_container_background_wt: string;
+        sys_channeldesc_grey_03: string;
+        sys_channeldesc_border_grey_03: string;
+        sys_gradient_base_01: string;
+        sys_gradient_base_01_opacity00: string;
+        sys_channeldesc_background: string;
+        sys_channeldesc_bottomsheet_base: string;
+        sys_channeldesc_bottomsheet_border: string;
+        sys_channeldesc_contents_base: string;
+        sys_channeldesc_dimmed: string;
+        sys_gradient_base_01_opacity50: string;
+        sys_gradient_base_01_opacity75: string;
+        sys_gradient_base_01_opacity40: string;
+        sys_widget_black: string;
+        usr_temp_primary_01: string;
+        sys_cpnt_sheet_base_02_opacity50: string;
     };
 };
 export default colorSet;

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

@@ -4,14 +4,14 @@ 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 UIColor_json_1 = __importDefault(require("./UIColor.json"));
-var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
+var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
 var colorSet = {
+    SemanticColor: SemanticColor_json_1.default,
     PaletteColor_Dark: PaletteColor_Dark_json_1.default,
-    PaletteColor_light: PaletteColor_light_json_1.default,
     UIColor: UIColor_json_1.default,
-    SemanticColor: SemanticColor_json_1.default
+    PaletteColor_light: PaletteColor_light_json_1.default
 };
 exports.default = colorSet;

package/dist/src/desktop/components/DesktopHeaderBar/DesktopHeaderBar.d.ts

@@ -1,39 +1,22 @@
 /// <reference types="react" />
 import { FillIconNameKeys, LineIconNameKeys, PDSTextType } from '../../../common';
-declare const defaultProps: {
-    size: "large" | "xlarge";
-    leftDisplayType: "text" | "icon" | "back";
-    rightBtnMode: "none" | "close" | "mbtn";
-    dividerType: "none" | "solid";
-};
-declare type DefaultProps = Readonly<typeof defaultProps>;
-declare type OptionalProps = {
+declare type DesktopHeaderBarProps = {
     text?: PDSTextType;
+    size?: 'xlarge' | 'large';
+    leftDisplayType?: 'text' | 'icon' | 'back';
     iconName?: FillIconNameKeys | LineIconNameKeys;
+    rightBtnMode?: 'none' | 'close' | 'mbtn' | 'mbtn_fill' | 'help_window';
+    rightBtn2Mode?: 'none' | 'mbtn' | 'mbtn_fill' | 'help_window';
+    rightBtn3Mode?: 'none' | 'help_window';
     mBtnText?: PDSTextType;
+    mBtn2Text?: PDSTextType;
+    mBtnState?: 'normal' | 'disabled';
+    mBtn2State?: 'normal' | 'disabled';
+    dividerType?: 'none' | 'solid';
     onClickLeftBtn?: () => void;
     onClickRightBtn?: () => void;
+    onClickRightBtn2?: () => void;
+    onClickRightBtn3?: () => void;
 };
-declare type Complete<T> = {
-    [P in keyof Required<T>]: Pick<T, P> extends Required<Pick<T, P>> ? T[P] : T[P] | undefined;
-};
-declare type TextType = {
-    leftDisplayType: 'text';
-    text: PDSTextType;
-};
-declare type IconType = {
-    leftDisplayType: 'icon';
-} & Complete<Pick<OptionalProps, 'iconName'>>;
-declare type BackType = {
-    leftDisplayType: 'back';
-} & Complete<Pick<OptionalProps, 'onClickLeftBtn'>>;
-declare type CloseType = {
-    rightBtnMode: 'close';
-} & Complete<Pick<OptionalProps, 'onClickRightBtn'>>;
-declare type MBtnType = {
-    rightBtnMode: 'mbtn';
-    mBtnText: PDSTextType;
-} & Complete<Pick<OptionalProps, 'onClickRightBtn'>>;
-declare type DesktopHeaderBarProps = OptionalProps & (TextType | IconType | BackType | CloseType | MBtnType) & Partial<DefaultProps>;
-declare function DesktopHeaderBar({ text, size, leftDisplayType, iconName, rightBtnMode, mBtnText, dividerType, onClickLeftBtn, onClickRightBtn }: DesktopHeaderBarProps): JSX.Element;
+declare function DesktopHeaderBar({ text, size, leftDisplayType, iconName, rightBtnMode, rightBtn2Mode, rightBtn3Mode, mBtnText, mBtn2Text, mBtnState, mBtn2State, dividerType, onClickLeftBtn, onClickRightBtn, onClickRightBtn2, onClickRightBtn3 }: DesktopHeaderBarProps): JSX.Element;
 export default DesktopHeaderBar;

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

@@ -13,14 +13,12 @@ var hybrid_1 = require("../../../hybrid");
 var IconButton_1 = require("../IconButton");
 var MainButton_1 = require("../MainButton");
 var TextLabel_1 = require("../TextLabel");
-var defaultProps = {
-    size: 'xlarge',
-    leftDisplayType: 'text',
-    rightBtnMode: 'none',
-    dividerType: 'none'
-};
 function DesktopHeaderBar(_a) {
-    var text = _a.text, _b = _a.size, size = _b === void 0 ? 'xlarge' : _b, _c = _a.leftDisplayType, leftDisplayType = _c === void 0 ? 'text' : _c, iconName = _a.iconName, _d = _a.rightBtnMode, rightBtnMode = _d === void 0 ? 'none' : _d, mBtnText = _a.mBtnText, _e = _a.dividerType, dividerType = _e === void 0 ? 'none' : _e, onClickLeftBtn = _a.onClickLeftBtn, onClickRightBtn = _a.onClickRightBtn;
+    var text = _a.text, _b = _a.size, size = _b === void 0 ? 'xlarge' : _b, _c = _a.leftDisplayType, leftDisplayType = _c === void 0 ? 'text' : _c, iconName = _a.iconName, _d = _a.rightBtnMode, rightBtnMode = _d === void 0 ? 'none' : _d, _e = _a.rightBtn2Mode, rightBtn2Mode = _e === void 0 ? 'none' : _e, _f = _a.rightBtn3Mode, rightBtn3Mode = _f === void 0 ? 'none' : _f, mBtnText = _a.mBtnText, mBtn2Text = _a.mBtn2Text, _g = _a.mBtnState, mBtnState = _g === void 0 ? 'normal' : _g, _h = _a.mBtn2State, mBtn2State = _h === void 0 ? 'normal' : _h, _j = _a.dividerType, dividerType = _j === void 0 ? 'none' : _j, onClickLeftBtn = _a.onClickLeftBtn, onClickRightBtn = _a.onClickRightBtn, onClickRightBtn2 = _a.onClickRightBtn2, onClickRightBtn3 = _a.onClickRightBtn3;
+    var isLastButtonIcon = rightBtnMode === 'close' ||
+        rightBtnMode === 'help_window' ||
+        (rightBtnMode === 'none' && rightBtn2Mode === 'help_window') ||
+        (rightBtnMode === 'none' && rightBtn2Mode === 'none' && rightBtn3Mode === 'help_window');
     var handleClickLeftBtn = function () {
         if (onClickLeftBtn) {
             onClickLeftBtn();
@@ -31,6 +29,23 @@ function DesktopHeaderBar(_a) {
             onClickRightBtn();
         }
     };
+    var handleClickRightBtn2 = function () {
+        if (onClickRightBtn2) {
+            onClickRightBtn2();
+        }
+    };
+    var handleClickRightBtn3 = function () {
+        if (onClickRightBtn3) {
+            onClickRightBtn3();
+        }
+    };
+    var mBtnElement = function (text, state, handleClick) {
+        return size === 'xlarge' && (react_1.default.createElement(MainButton_1.MainButton, { text: text, size: "small", fillType: "line", onClick: handleClick, state: state }));
+    };
+    var mBtnFillElement = function (text, state, handleClick) {
+        return size === 'xlarge' && (react_1.default.createElement(MainButton_1.MainButton, { text: text, size: "small", onClick: handleClick, state: state }));
+    };
+    var iconButtonElement = function (iconName, handleClick) { return (react_1.default.createElement(IconButton_1.IconButton, { fillType: "fill", baseSize: "large", iconSize: 24, shapeType: "rectangle", iconName: iconName, iconFillType: "line", onClick: handleClick, iconColorKey: "ui_cpnt_button_icon_enabled", baseColorKey: "ui_cpnt_button_fill_base_transparent" })); };
     var leftDisplayMode = function () {
         switch (leftDisplayType) {
             case 'icon': {
@@ -39,21 +54,52 @@ function DesktopHeaderBar(_a) {
                     react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_c", spacingType: "width" })));
             }
             case 'back': {
-                return (react_1.default.createElement(IconButton_1.IconButton, { iconSize: 24, baseSize: "large", fillType: "fill", iconFillType: "line", iconName: "ic_arrow_left", onClick: handleClickLeftBtn, iconColorKey: "ui_cpnt_button_icon_enabled", baseColorKey: "ui_cpnt_button_fill_base_transparent" }));
+                return iconButtonElement('ic_arrow_left', handleClickLeftBtn);
             }
             case 'text': {
                 return;
             }
         }
     };
+    var rightButton3Mode = function () {
+        switch (rightBtn3Mode) {
+            case 'help_window': {
+                return iconButtonElement('ic_help_window', handleClickRightBtn3);
+            }
+            case 'none': {
+                return;
+            }
+        }
+    };
+    var rightButton2Mode = function () {
+        switch (rightBtn2Mode) {
+            case 'mbtn': {
+                return mBtnElement(mBtn2Text, mBtn2State, handleClickRightBtn2);
+            }
+            case 'mbtn_fill': {
+                return mBtnFillElement(mBtn2Text, mBtn2State, handleClickRightBtn2);
+            }
+            case 'help_window': {
+                return iconButtonElement('ic_help_window', handleClickRightBtn2);
+            }
+            case 'none': {
+                return;
+            }
+        }
+    };
     var rightButtonMode = function () {
         switch (rightBtnMode) {
             case 'close': {
-                return (react_1.default.createElement(IconButton_1.IconButton, { fillType: "fill", baseSize: "large", iconSize: 24, shapeType: "rectangle", iconName: "ic_xmark", iconFillType: "line", onClick: handleClickRightBtn, iconColorKey: "ui_cpnt_button_icon_enabled", baseColorKey: "ui_cpnt_button_fill_base_transparent" }));
+                return iconButtonElement('ic_xmark', handleClickRightBtn);
             }
             case 'mbtn': {
-                return (react_1.default.createElement(react_1.default.Fragment, null, size === 'xlarge' && (react_1.default.createElement(S_MainButtonWrapper, null,
-                    react_1.default.createElement(MainButton_1.MainButton, { text: mBtnText, size: "small", fillType: "line", onClick: handleClickRightBtn })))));
+                return mBtnElement(mBtnText, mBtnState, handleClickRightBtn);
+            }
+            case 'mbtn_fill': {
+                return mBtnFillElement(mBtnText, mBtnState, handleClickRightBtn);
+            }
+            case 'help_window': {
+                return iconButtonElement('ic_help_window', handleClickRightBtn);
             }
             case 'none': {
                 return;
@@ -64,9 +110,12 @@ function DesktopHeaderBar(_a) {
         react_1.default.createElement(S_LeftDisplayBox, null,
             leftDisplayMode(),
             react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", singleLineMode: "use", colorTheme: "sysTextPrimary" })),
-        rightButtonMode()));
+        react_1.default.createElement(S_ButtonBox, { isLastButtonIcon: isLastButtonIcon },
+            rightButton3Mode(),
+            rightButton2Mode(),
+            rightButtonMode())));
 }
-var S_DesktopHeaderBar = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  background-color: ", ";\n  border-bottom: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: ", ";\n  justify-content: space-between;\n  padding-left: ", ";\n  padding-right: ", ";\n"], ["\n  align-items: center;\n  background-color: ", ";\n  border-bottom: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: ", ";\n  justify-content: space-between;\n  padding-left: ", ";\n  padding-right: ", ";\n"])), function (_a) {
+var S_DesktopHeaderBar = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  background-color: ", ";\n  border-bottom: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: ", ";\n  justify-content: space-between;\n  padding-left: ", ";\n"], ["\n  align-items: center;\n  background-color: ", ";\n  border-bottom: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: ", ";\n  justify-content: space-between;\n  padding-left: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_headerbar_base_area;
 }, function (_a) {
@@ -78,14 +127,17 @@ var S_DesktopHeaderBar = styled_components_1.default.div(templateObject_1 || (te
 }, function (_a) {
     var hasBackIcon = _a.hasBackIcon, theme = _a.theme;
     return hasBackIcon ? theme.spacing.spacingC : theme.spacing.spacingE;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing.spacingB;
 });
-var S_LeftDisplayBox = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n"], ["\n  align-items: center;\n  display: flex;\n"])));
-var S_MainButtonWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  margin: 0 ", ";\n"], ["\n  margin: 0 ", ";\n"])), function (_a) {
+var S_LeftDisplayBox = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  margin-right: ", ";\n"], ["\n  align-items: center;\n  display: flex;\n  margin-right: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingD;
 });
+var S_ButtonBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  margin-right: ", ";\n\n  & > :not(:last-child) {\n    margin-right: ", ";\n  }\n"], ["\n  align-items: center;\n  display: flex;\n  margin-right: ", ";\n\n  & > :not(:last-child) {\n    margin-right: ", ";\n  }\n"])), function (_a) {
+    var isLastButtonIcon = _a.isLastButtonIcon, theme = _a.theme;
+    return isLastButtonIcon ? theme.spacing.spacingB : theme.spacing.spacingE;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingB;
+});
 exports.default = DesktopHeaderBar;
 var templateObject_1, templateObject_2, templateObject_3;

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

@@ -37,14 +37,17 @@ function EditApplyTextField(_a) {
     var _l = (0, react_hook_form_1.useFormContext)(), register = _l.register, setValue = _l.setValue, trigger = _l.trigger, watch = _l.watch, errors = _l.formState.errors;
     var _m = (0, react_1.useState)(false), isFocused = _m[0], setIsFocused = _m[1];
     var _o = (0, react_1.useState)(false), isOpen = _o[0], setIsOpen = _o[1];
-    var _p = (0, react_1.useState)(), prevValue = _p[0], setPrevValue = _p[1];
+    var _p = (0, react_1.useState)(defaultText !== null && defaultText !== void 0 ? defaultText : ''), prevValue = _p[0], setPrevValue = _p[1];
     var currentValue = watch(name);
     var validateOnChange = register(name, validation).onChange;
     var isError = Object.keys(errors).some(function (error) { return error === name; });
     (0, react_1.useEffect)(function () {
-        if (defaultText) {
+        if (defaultText !== undefined && defaultText !== null) {
             setPrevValue(defaultText);
+            setValue(name, defaultText);
+            return;
         }
+        setValue(name, '');
     }, [defaultText]);
     function handleFocus(e) {
         if (state !== 'read_only') {

package/package.json

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

package/release-note.md

@@ -1,50 +1,20 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v1.3.5]
+## [v1.3.6]
 
 ### Component
-* PDSValueOption타입 추가 (텍스트와 id와 같은 고유값이 있는 형태의 컴포넌트는 모두 PDSValueOption 타입을 사용해 통일감있게 PDS 컴포넌트를 생성할 예정)(해당 타입은 ‘pds-dev-kit-web’에서 임포트 해서 사용할 수 있습니다.)
-* AdminList
-  * BulkActionBar의 MainButton과 Dropdown에 colotTheme 적용
-  * HeaderRowHideMode 프롭 명칭을 HeaderRowMode로 변경 (default는 ‘use')
-  * selectionMode가 ‘none’일 시 왼쪽 여백이 너무 작은 이슈 수정
-  * BulkActionBar의 MainButton과 Dropdown 액션 이후에 AdminList의 상태를 초기화 하는 로직을 삭제 (-> 각 개발자가 각 상황에 알맞게 사용하는게 더 낫다고 판단)
-  * selectedIds, onSelect 프롭을 받지 않을 시 useEffect에서 발생하던 에러 픽스
-* AdminListHeader
-  * TitleText, DescText, FilterBar, BulkActionBar 사이의 여백 조정
-* AdminListItem
-  * column5Text 부터 TextStyle이 반영되지 않던 이슈 수정
-  * quickActionBtnMode가 ‘none’일 때 버튼 영역이 보이지 않도록 수정
-  * selectState가 ‘maintain’일 때 체크박스가 선택되어진 상태에서 유지되도록 변경
-  * selectionMode가 ‘none’일 시 왼쪽 여백이 너무 작은 이슈 수정
-* Chip
-  * prop추가
-    * option
-  * prop deprecated표시 (1.5에서 삭제 예정)
-    * activeChipId
-    * chipId
-* ContextMenuItem
-  * prop추가
-    * value
-    * id
-  * prop deprecated표시 (1.5에서 삭제 예정)
-    * text
-    * value
-  * prop type 변경
-    * onClick이 value로 PDSValueOption도 받을 수 있음
-* Dropdown
-  * prop type 변경
-    * defaultValue
-    * valueArray
-    * onChange
-* FilterBar
-  * prop추가
-    * value
-  * prop deprecated표시 (1.5에서 삭제 예정)
-    * activeChipId
-  * prop type 변경
-    * textArray
-    * name
-    * onClickChip
-* UserDesktopNavBar
-  * prop type 변경
-    * textArray
+* DesktopHeaderBar
+  * prop 추가
+    * rightBtn2Mode
+    * rightBtn3Mode
+    * mBtnState
+    * mBtn2State
+    * mBtn2Text
+    * onClickRightBtn2
+    * onClickRightBtn3
+* EditApplyTextField
+  * data 관리를 제대로 하지 못하고 있던 문제 해결
+* Icon
+  * line 아이콘 추가 (ic_design_preference)
+
+### Color
+* 컬러 키 값 22.04.19 18시 19분 기준 싱크