pds-dev-kit-web 1.6.10 → 1.6.12

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

@@ -219,5 +219,6 @@
     "sys_component_base_17": "darkgrey50/opacity50",
     "sys_widget_red_01": "darkred500",
     "sys_widget_orange_01": "darkorange500",
-    "sys_text_warning_01": "darkorange500"
+    "sys_text_warning_01": "darkorange500",
+    "sys_component_base_18": "darkgrey400"
 }

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

@@ -219,5 +219,6 @@
     "sys_component_base_17": "grey50/opacity50",
     "sys_widget_red_01": "red500",
     "sys_widget_orange_01": "orange500",
-    "sys_text_warning_01": "orange500"
+    "sys_text_warning_01": "orange500",
+    "sys_component_base_18": "grey400"
 }

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

@@ -629,5 +629,6 @@
     "ui_cpnt_calendar_badge_booked": "sys_widget_success_01",
     "ui_cpnt_calendar_badge_expired": "sys_widget_grey_03",
     "ui_cpnt_calendar_text_today": "sys_widget_red_01",
-    "ui_cpnt_textlabel_sys_warning": "sys_text_warning_01"
+    "ui_cpnt_textlabel_sys_warning": "sys_text_warning_01",
+    "ui_cpnt_lottiereactionbutton_base_default": "sys_component_base_18"
 }

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

@@ -78,6 +78,230 @@ declare const colorSet: {
         darkgreen50: string;
         opacity90: string;
     };
+    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;
+        usr_menu_primarymenu_main: string;
+        usr_menu_primarymenu_sub: string;
+        usr_menu_secondarymenu_main: string;
+        usr_menu_secondarymenu_sub: string;
+        usr_menu_hover: string;
+        usr_menu_active: string;
+        usr_menu_background: string;
+        sys_cpnt_base_white_opacity50: string;
+        sys_widget_dark_01: string;
+        usr_menu_background_gradient_opacity00: string;
+        sys_border_line_white: string;
+        sys_component_base_white_opacity10: string;
+        sys_cpnt_sheet_base_01: string;
+        sys_component_base_white_opacity20: string;
+        sys_border_line_07: string;
+        sys_border_line_white_opacity50: string;
+        sys_background_dimmed_02: string;
+        sys_border_line_08: string;
+        sys_component_base_06: string;
+        sys_component_base_07: string;
+        sys_border_line_09: string;
+        sys_component_base_darktheme_04: string;
+        sys_border_line_10: string;
+        sys_component_base_darktheme_05: string;
+        sys_border_line_darktheme_05: string;
+        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;
+        sys_text_social_login_01: string;
+        sys_text_social_login_02: string;
+        sys_papp_livechat_link: string;
+        sys_text_lighttone_grey_01: string;
+        sys_widget_lighttone_primary_01: string;
+        sys_text_lighttone_grey_02: string;
+        sys_component_base_09: string;
+        sys_component_base_darktheme_opacity20: string;
+        sys_component_base_darktheme_disabled_opacity20: string;
+        sys_border_white_opacity00: string;
+        sys_border_line_darktheme_07_opacity00: string;
+        sys_border_line_darktheme_02_opacity20: string;
+        sys_border_line_darktheme_03_opacity20: string;
+        sys_border_line_darktheme_07_opacity20: string;
+        sys_component_base_grey_02_opacity80: string;
+        sys_component_base_10: string;
+        sys_component_pastel_base_01: string;
+        sys_component_pastel_base_02: string;
+        sys_component_pastel_base_03: string;
+        sys_component_pastel_base_04: string;
+        sys_component_pastel_base_05: string;
+        sys_component_base_11: string;
+        sys_loading_skeleton_01: string;
+        sys_loading_skeleton_02: string;
+        sys_loading_linear_bar: string;
+        sys_loading_linear_base: string;
+        sys_loading_three_bar: string;
+        sys_widget_grey_05: string;
+        sys_menu_background_transparent: string;
+        sys_container_background_04: string;
+        sys_menu_button_base: string;
+        sys_background_dimmed_03: string;
+        sys_cpnt_sheet_base_03: string;
+        sys_dimmed_gradient_01: string;
+        sys_dimmed_gradient_02: string;
+        sys_border_line_13: string;
+        sys_component_base_12: string;
+        sys_border_line_14: string;
+        sys_component_base_13: string;
+        sys_component_base_14: string;
+        sys_component_base_15: string;
+        sys_component_base_16: string;
+        sys_component_base_17: string;
+        sys_widget_red_01: string;
+        sys_widget_orange_01: string;
+        sys_text_warning_01: string;
+        sys_component_base_18: string;
+    };
     readonly PaletteColor_light: {
         sys_container_background_01: string;
         sys_container_background_02: string;
@@ -300,6 +524,7 @@ declare const colorSet: {
         sys_widget_red_01: string;
         sys_widget_orange_01: string;
         sys_text_warning_01: string;
+        sys_component_base_18: string;
     };
     readonly UIColor: {
         ui_cpnt_button_fill_base_primary: string;
@@ -933,229 +1158,7 @@ declare const colorSet: {
         ui_cpnt_calendar_badge_expired: string;
         ui_cpnt_calendar_text_today: string;
         ui_cpnt_textlabel_sys_warning: string;
-    };
-    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;
-        usr_menu_primarymenu_main: string;
-        usr_menu_primarymenu_sub: string;
-        usr_menu_secondarymenu_main: string;
-        usr_menu_secondarymenu_sub: string;
-        usr_menu_hover: string;
-        usr_menu_active: string;
-        usr_menu_background: string;
-        sys_cpnt_base_white_opacity50: string;
-        sys_widget_dark_01: string;
-        usr_menu_background_gradient_opacity00: string;
-        sys_border_line_white: string;
-        sys_component_base_white_opacity10: string;
-        sys_cpnt_sheet_base_01: string;
-        sys_component_base_white_opacity20: string;
-        sys_border_line_07: string;
-        sys_border_line_white_opacity50: string;
-        sys_background_dimmed_02: string;
-        sys_border_line_08: string;
-        sys_component_base_06: string;
-        sys_component_base_07: string;
-        sys_border_line_09: string;
-        sys_component_base_darktheme_04: string;
-        sys_border_line_10: string;
-        sys_component_base_darktheme_05: string;
-        sys_border_line_darktheme_05: string;
-        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;
-        sys_text_social_login_01: string;
-        sys_text_social_login_02: string;
-        sys_papp_livechat_link: string;
-        sys_text_lighttone_grey_01: string;
-        sys_widget_lighttone_primary_01: string;
-        sys_text_lighttone_grey_02: string;
-        sys_component_base_09: string;
-        sys_component_base_darktheme_opacity20: string;
-        sys_component_base_darktheme_disabled_opacity20: string;
-        sys_border_white_opacity00: string;
-        sys_border_line_darktheme_07_opacity00: string;
-        sys_border_line_darktheme_02_opacity20: string;
-        sys_border_line_darktheme_03_opacity20: string;
-        sys_border_line_darktheme_07_opacity20: string;
-        sys_component_base_grey_02_opacity80: string;
-        sys_component_base_10: string;
-        sys_component_pastel_base_01: string;
-        sys_component_pastel_base_02: string;
-        sys_component_pastel_base_03: string;
-        sys_component_pastel_base_04: string;
-        sys_component_pastel_base_05: string;
-        sys_component_base_11: string;
-        sys_loading_skeleton_01: string;
-        sys_loading_skeleton_02: string;
-        sys_loading_linear_bar: string;
-        sys_loading_linear_base: string;
-        sys_loading_three_bar: string;
-        sys_widget_grey_05: string;
-        sys_menu_background_transparent: string;
-        sys_container_background_04: string;
-        sys_menu_button_base: string;
-        sys_background_dimmed_03: string;
-        sys_cpnt_sheet_base_03: string;
-        sys_dimmed_gradient_01: string;
-        sys_dimmed_gradient_02: string;
-        sys_border_line_13: string;
-        sys_component_base_12: string;
-        sys_border_line_14: string;
-        sys_component_base_13: string;
-        sys_component_base_14: string;
-        sys_component_base_15: string;
-        sys_component_base_16: string;
-        sys_component_base_17: string;
-        sys_widget_red_01: string;
-        sys_widget_orange_01: string;
-        sys_text_warning_01: string;
+        ui_cpnt_lottiereactionbutton_base_default: 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 UIColor_json_1 = __importDefault(require("./UIColor.json"));
-var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.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,
-    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

@@ -630,4 +630,5 @@ export interface UITheme {
     ui_cpnt_calendar_badge_expired: string;
     ui_cpnt_calendar_text_today: string;
     ui_cpnt_textlabel_sys_warning: string;
+    ui_cpnt_lottiereactionbutton_base_default: string;
 }

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

@@ -38,7 +38,7 @@ function LottieReactionButton(_a) {
     };
     var convertFormatText = convertFormatHelper(text);
     var _g = (0, react_1.useState)(false), isAnimation = _g[0], setIsAnimation = _g[1];
-    var _h = (0, react_1.useState)(convertFormatText), textWord = _h[0], setTextWord = _h[1];
+    var _h = (0, react_1.useState)(false), isActionText = _h[0], setIsActionText = _h[1];
     var _j = (0, react_1.useState)(false), isBackgroundColor = _j[0], setIsBackgroundColor = _j[1];
     var handleMouseDown = function (e) {
         if (state !== 'no_animation') {
@@ -49,11 +49,11 @@ function LottieReactionButton(_a) {
         }
     };
     var handleClick = function (e) {
-        var _a, _b;
+        var _a;
         if (state !== 'no_animation') {
             setIsAnimation(true);
             (_a = lottieRef.current) === null || _a === void 0 ? void 0 : _a.playSegments([[0, 30]], true);
-            setTextWord((_b = actionText !== null && actionText !== void 0 ? actionText : convertFormatText) !== null && _b !== void 0 ? _b : '');
+            setIsActionText(true);
             setIsBackgroundColor(true);
         }
         if (onClick) {
@@ -61,7 +61,7 @@ function LottieReactionButton(_a) {
         }
     };
     var handleLottieIconComplete = function (e) {
-        setTextWord(convertFormatText);
+        setIsActionText(false);
         setIsBackgroundColor(false);
         if (onComplete) {
             onComplete(e);
@@ -71,7 +71,7 @@ function LottieReactionButton(_a) {
         react_1.default.createElement(hybrid_1.LottieIcon, { iconName: iconName, lottieRef: lottieRef, autoplayMode: "none", loopMode: "none", onComplete: handleLottieIconComplete }),
         displayType === 'icon_text' && (react_1.default.createElement(react_1.default.Fragment, null,
             react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }),
-            react_1.default.createElement(TextLabel_1.TextLabel, { text: textWord, singleLineMode: "use", colorTheme: "sysTextWhite", ellipsisMode: "use", lineLimit: 1, wordBreak: "break_all" })))));
+            react_1.default.createElement(TextLabel_1.TextLabel, { text: isActionText && actionText ? actionText : convertFormatText, singleLineMode: "use", colorTheme: "sysTextWhite", ellipsisMode: "use", lineLimit: 1, wordBreak: "break_all" })))));
 }
 var disabled = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  cursor: default;\n"], ["\n  background-color: ", ";\n  cursor: default;\n"])), function (_a) {
     var theme = _a.theme;
@@ -93,7 +93,7 @@ var icon_text = (0, styled_components_1.css)(templateObject_6 || (templateObject
 });
 var greyBackgroundColor = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  background-color: ", ";\n  transition: background-color 0.8s;\n"], ["\n  background-color: ", ";\n  transition: background-color 0.8s;\n"])), function (_a) {
     var theme = _a.theme;
-    return theme.ui_temp_grey_03;
+    return theme.ui_cpnt_lottiereactionbutton_base_default;
 });
 var base1 = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -72,7 +72,7 @@ function UserDesktopNavBar(_a) {
     };
     return (react_1.default.createElement(S_UserDesktopNavBar, null,
         react_1.default.createElement(S_NavBar, null,
-            logoImageSrc ? (react_1.default.createElement(S_Logo, { src: logoImageSrc, onClick: handleClickLogo })) : (react_1.default.createElement(S_TextWrapper, { onClick: handleClickLogo },
+            logoImageSrc ? (react_1.default.createElement(S_Logo, { src: logoImageSrc, onClick: handleClickLogo, cursor: onClickLogo ? 'pointer' : 'default' })) : (react_1.default.createElement(S_TextWrapper, { onClick: handleClickLogo, cursor: onClickLogo ? 'pointer' : 'default' },
                 react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, singleLineMode: "use", styleTheme: "headingBold", colorTheme: "sysTextPrimary", ellipsisMode: "use", lineLimit: 1 }))),
             menuMode === 'center_text' && (react_1.default.createElement(S_pApps, null,
                 visibleTexts.map(function (option) { return (react_1.default.createElement(S_VisiblePAppWrapper, { key: option.value, onClick: function () { return handleClick(option); } }, currentPathName.includes(option.value) ? (react_1.default.createElement(TextLabel_1.TextLabel, { text: option.text, styleTheme: "body1Bold", colorTheme: "sysTextPrimary", singleLineMode: "use" })) : (react_1.default.createElement(TextLabel_1.TextLabel, { text: option.text, styleTheme: "body1Regular", colorTheme: "sysTextSecondary", singleLineMode: "use" })))); }),
@@ -81,7 +81,7 @@ function UserDesktopNavBar(_a) {
                         react_1.default.createElement(IconButton_1.IconButton, { fillType: "fill", baseSize: "medium", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: 24, iconName: "ic_more", iconColorKey: "ui_cpnt_button_icon_default", shapeType: "rectangle", iconFillType: "fill" })),
                     react_1.default.createElement(S_ContextMenuWrapper, null, isContextMenuOpen && (react_1.default.createElement(ContextMenu_1.ContextMenu, null, hiddenTexts.map(function (option) { return (react_1.default.createElement(ContextMenuItem_1.ContextMenuItem, { key: option.value, size: "medium", option: option, onClick: handleClick })); })))))))),
             react_1.default.createElement(S_ProfileWrapper, null,
-                loginInfoMode === 'profile' && (react_1.default.createElement(S_ImageViewWrapper, { onClick: handleClickLoginInfo },
+                loginInfoMode === 'profile' && (react_1.default.createElement(S_ImageViewWrapper, { onClick: handleClickLoginInfo, cursor: onClickLoginInfo ? 'pointer' : 'default' },
                     react_1.default.createElement(hybrid_1.ImageView, { src: userImageSrc, shapeType: "circular", width: 32, ratio: "1_1", scaleType: "cover", borderMode: "use" }))),
                 loginInfoMode === 'button' && (react_1.default.createElement(MainButton_1.MainButton, { size: "small", styleTheme: "secondary", text: mBtnText, onClick: handleClickLoginInfo })))),
         dividerType === 'solid' && react_1.default.createElement(hybrid_1.Divider, null)));
@@ -93,10 +93,13 @@ var S_UserDesktopNavBar = styled_components_1.default.div(templateObject_1 || (t
 var S_MorePApps = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
 var S_ProfileWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  height: 48px;\n  justify-content: flex-end;\n  margin-left: 24px;\n  width: 200px;\n"], ["\n  align-items: center;\n  display: flex;\n  height: 48px;\n  justify-content: flex-end;\n  margin-left: 24px;\n  width: 200px;\n"])));
 var S_TextWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  cursor: ", ";\n  margin-right: 24px;\n  width: 200px;\n  & > div {\n    word-break: break-all;\n  }\n"], ["\n  cursor: ", ";\n  margin-right: 24px;\n  width: 200px;\n  & > div {\n    word-break: break-all;\n  }\n"])), function (_a) {
-    var onClick = _a.onClick;
-    return (onClick ? 'pointer' : 'default');
+    var cursor = _a.cursor;
+    return cursor;
 });
-var S_Logo = styled_components_1.default.img(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  height: 48px;\n  margin-right: ", ";\n  object-fit: contain;\n  object-position: left;\n  width: 180px;\n"], ["\n  height: 48px;\n  margin-right: ", ";\n  object-fit: contain;\n  object-position: left;\n  width: 180px;\n"])), function (_a) {
+var S_Logo = styled_components_1.default.img(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  cursor: ", ";\n  height: 48px;\n  margin-right: ", ";\n  object-fit: contain;\n  object-position: left;\n  width: 180px;\n"], ["\n  cursor: ", ";\n  height: 48px;\n  margin-right: ", ";\n  object-fit: contain;\n  object-position: left;\n  width: 180px;\n"])), function (_a) {
+    var cursor = _a.cursor;
+    return cursor;
+}, function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingE;
 });
@@ -109,8 +112,8 @@ var S_VisiblePAppWrapper = styled_components_1.default.div(templateObject_10 ||
     return theme.spacing.spacingE;
 });
 var S_ImageViewWrapper = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  border-radius: 50%;\n  cursor: ", ";\n  height: 32px;\n"], ["\n  border-radius: 50%;\n  cursor: ", ";\n  height: 32px;\n"])), function (_a) {
-    var onClick = _a.onClick;
-    return (onClick ? 'pointer' : 'default');
+    var cursor = _a.cursor;
+    return cursor;
 });
 exports.default = UserDesktopNavBar;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11;

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

@@ -38,7 +38,7 @@ function LottieReactionButton(_a) {
     };
     var convertFormatText = convertFormatHelper(text);
     var _g = (0, react_1.useState)(false), isAnimation = _g[0], setIsAnimation = _g[1];
-    var _h = (0, react_1.useState)(convertFormatText), textWord = _h[0], setTextWord = _h[1];
+    var _h = (0, react_1.useState)(false), isActionText = _h[0], setIsActionText = _h[1];
     var _j = (0, react_1.useState)(false), isBackgroundColor = _j[0], setIsBackgroundColor = _j[1];
     var handleTouchStart = function (e) {
         if (state !== 'no_animation') {
@@ -49,11 +49,11 @@ function LottieReactionButton(_a) {
         }
     };
     var handleTouchEnd = function (e) {
-        var _a, _b;
+        var _a;
         if (state !== 'no_animation') {
             setIsAnimation(true);
             (_a = lottieRef.current) === null || _a === void 0 ? void 0 : _a.playSegments([[0, 30]], true);
-            setTextWord((_b = actionText !== null && actionText !== void 0 ? actionText : convertFormatText) !== null && _b !== void 0 ? _b : '');
+            setIsActionText(true);
             setIsBackgroundColor(true);
         }
         if (onTouchEnd) {
@@ -62,7 +62,7 @@ function LottieReactionButton(_a) {
         e.preventDefault();
     };
     var handleLottieIconComplete = function (e) {
-        setTextWord(convertFormatText);
+        setIsActionText(false);
         setIsBackgroundColor(false);
         if (onComplete) {
             onComplete(e);
@@ -72,7 +72,7 @@ function LottieReactionButton(_a) {
         react_1.default.createElement(hybrid_1.LottieIcon, { iconName: iconName, lottieRef: lottieRef, autoplayMode: "none", loopMode: "none", onComplete: handleLottieIconComplete }),
         displayType === 'icon_text' && (react_1.default.createElement(react_1.default.Fragment, null,
             react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }),
-            react_1.default.createElement(TextLabel_1.TextLabel, { text: textWord, singleLineMode: "use", colorTheme: "sysTextWhite", ellipsisMode: "use", lineLimit: 1, wordBreak: "break_all" })))));
+            react_1.default.createElement(TextLabel_1.TextLabel, { text: isActionText && actionText ? actionText : convertFormatText, singleLineMode: "use", colorTheme: "sysTextWhite", ellipsisMode: "use", lineLimit: 1, wordBreak: "break_all" })))));
 }
 var disabled = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  cursor: default;\n"], ["\n  background-color: ", ";\n  cursor: default;\n"])), function (_a) {
     var theme = _a.theme;
@@ -91,7 +91,7 @@ var icon_text = (0, styled_components_1.css)(templateObject_6 || (templateObject
 });
 var greyBackgroundColor = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  background-color: ", ";\n  transition: background-color 0.8s;\n"], ["\n  background-color: ", ";\n  transition: background-color 0.8s;\n"])), function (_a) {
     var theme = _a.theme;
-    return theme.ui_temp_grey_03;
+    return theme.ui_cpnt_lottiereactionbutton_base_default;
 });
 var base1 = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/package.json

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

package/release-note.md

@@ -1,12 +1,5 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v1.6.10]
+## [v1.6.12]
 ### Component
-* D_LottieReactionButton
-  * 디자인 스펙 수정(회색 배경이 기본이 되도록)
-  * state prop에 no_animation value 추가
-  * touch이벤트를 제거
-* M_LottieReactionButton
-  * 디자인 스펙 수정(회색 배경이 기본이 되도록)
-  * state prop에 no_animation value 추가
-  * onMouseDown와 onClick prop 삭제
-  * disabled과 view_only일때도 액션이 되던 부분을 수정
+* UserDesktopNavBar
+  * onClickLogo 값이 있을 때 cursor가 pointer로 보이도록 변경