npm - pds-dev-kit-web - Versions diffs - 1.6.9 → 1.6.11 - Mend

pds-dev-kit-web 1.6.9 → 1.6.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

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

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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.d.ts CHANGED Viewed

@@ -8,7 +8,7 @@ export declare type LottieReactionButtonProps = {
     displayType?: 'icon_only' | 'icon_text';
     backgroundColorTheme?: 'base1' | 'base2' | 'base3' | 'base4' | 'base5';
     overrideBackgroundColorKey?: UiColors;
-    state?: 'normal' | 'view_only' | 'disabled';
+    state?: 'normal' | 'no_animation' | 'view_only' | 'disabled';
     type?: 'button' | 'submit';
     onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
     onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;

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

@@ -38,43 +38,40 @@ 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 handleTouchStart = function () {
-        setIsAnimation(false);
-    };
-    var handleTouchEnd = function (e) {
-        var _a, _b;
-        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 : '');
-        e.preventDefault();
-    };
+    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) {
-        setIsAnimation(false);
+        if (state !== 'no_animation') {
+            setIsAnimation(false);
+        }
         if (onMouseDown) {
             onMouseDown(e);
         }
     };
     var handleClick = function (e) {
-        var _a, _b;
-        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 : '');
+        var _a;
+        if (state !== 'no_animation') {
+            setIsAnimation(true);
+            (_a = lottieRef.current) === null || _a === void 0 ? void 0 : _a.playSegments([[0, 30]], true);
+            setIsActionText(true);
+            setIsBackgroundColor(true);
+        }
         if (onClick) {
             onClick(e);
         }
     };
     var handleLottieIconComplete = function (e) {
-        setTextWord(convertFormatText);
+        setIsActionText(false);
+        setIsBackgroundColor(false);
         if (onComplete) {
             onComplete(e);
         }
     };
-    return (react_1.default.createElement(S_Button, { displayType: displayType, backgroundColorTheme: backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, state: state, disabled: state === 'disabled' || state === 'view_only', type: type, onTouchStart: handleTouchStart, onTouchEnd: handleTouchEnd, onMouseDown: handleMouseDown, onClick: handleClick, isAnimation: isAnimation },
+    return (react_1.default.createElement(S_Button, { displayType: displayType, backgroundColorTheme: backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, state: state, disabled: state === 'disabled' || state === 'view_only', type: type, onMouseDown: handleMouseDown, onClick: handleClick, isAnimation: isAnimation, isDefaultBackgroundColor: state === 'view_only' || isBackgroundColor },
         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;
@@ -94,40 +91,50 @@ var icon_text = (0, styled_components_1.css)(templateObject_6 || (templateObject
     var theme = _a.theme;
     return theme.spacing.spacingB;
 });
-var base1 = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+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_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;
     return theme.ui_cpnt_lottiereactionbutton_base_01;
 });
-var base2 = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var base2 = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_lottiereactionbutton_base_02;
 });
-var base3 = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var base3 = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_lottiereactionbutton_base_03;
 });
-var base4 = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var base4 = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_lottiereactionbutton_base_04;
 });
-var base5 = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var base5 = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_lottiereactionbutton_base_05;
 });
-var overrideStyle = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var overrideStyle = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme, overrideBackgroundColorKey = _a.overrideBackgroundColorKey;
     return overrideBackgroundColorKey && theme[overrideBackgroundColorKey];
 });
-var S_Button = styled_components_1.default.button(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"], ["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"])), function (_a) {
-    var backgroundColorTheme = _a.backgroundColorTheme;
-    return backgroundColorTheme &&
-        {
-            base1: base1,
-            base2: base2,
-            base3: base3,
-            base4: base4,
-            base5: base5
-        }[backgroundColorTheme];
+var S_Button = styled_components_1.default.button(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"], ["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"])), function (_a) {
+    var backgroundColorTheme = _a.backgroundColorTheme, isDefaultBackgroundColor = _a.isDefaultBackgroundColor, overrideBackgroundColorKey = _a.overrideBackgroundColorKey;
+    if (isDefaultBackgroundColor) {
+        if (overrideBackgroundColorKey) {
+            return overrideStyle;
+        }
+        return (backgroundColorTheme &&
+            {
+                base1: base1,
+                base2: base2,
+                base3: base3,
+                base4: base4,
+                base5: base5
+            }[backgroundColorTheme]);
+    }
+    return greyBackgroundColor;
 }, function (_a) {
     var isAnimation = _a.isAnimation;
     return isAnimation && buttonAnimation;
@@ -138,17 +145,15 @@ var S_Button = styled_components_1.default.button(templateObject_13 || (template
             icon_only: icon_only,
             icon_text: icon_text
         }[displayType];
-}, function (_a) {
-    var overrideBackgroundColorKey = _a.overrideBackgroundColorKey;
-    return overrideBackgroundColorKey && overrideStyle;
 }, function (_a) {
     var state = _a.state;
     return state &&
         {
             normal: normal,
-            disabled: disabled,
-            view_only: view_only
+            no_animation: normal,
+            view_only: view_only,
+            disabled: disabled
         }[state];
 });
 exports.default = LottieReactionButton;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14;

package/dist/src/mobile/components/LottieReactionButton/LottieReactionButton.d.ts CHANGED Viewed

@@ -8,13 +8,11 @@ export declare type LottieReactionButtonProps = {
     displayType?: 'icon_only' | 'icon_text';
     backgroundColorTheme?: 'base1' | 'base2' | 'base3' | 'base4' | 'base5';
     overrideBackgroundColorKey?: UiColors;
-    state?: 'normal' | 'view_only' | 'disabled';
+    state?: 'normal' | 'no_animation' | 'view_only' | 'disabled';
     type?: 'button' | 'submit';
-    onTouchStart?: (e: React.TouchEvent<HTMLButtonElement>) => void;
-    onTouchEnd?: (e: React.TouchEvent<HTMLButtonElement>) => void;
-    onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
-    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    onTouchStart?: (e: React.TouchEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement>) => void;
+    onTouchEnd?: (e: React.TouchEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement>) => void;
     onComplete?: AnimationEventHandler | null;
 };
-declare function LottieReactionButton({ text, actionText, iconName, displayType, backgroundColorTheme, overrideBackgroundColorKey, type, state, onTouchStart, onTouchEnd, onMouseDown, onClick, onComplete }: LottieReactionButtonProps): JSX.Element;
+declare function LottieReactionButton({ text, actionText, iconName, displayType, backgroundColorTheme, overrideBackgroundColorKey, type, state, onTouchStart, onTouchEnd, onComplete }: LottieReactionButtonProps): JSX.Element;
 export default LottieReactionButton;

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

@@ -29,7 +29,7 @@ var numberHelper_1 = require("../../../common/utils/numberHelper");
 var hybrid_1 = require("../../../hybrid");
 var TextLabel_1 = require("../TextLabel");
 function LottieReactionButton(_a) {
-    var text = _a.text, actionText = _a.actionText, _b = _a.iconName, iconName = _b === void 0 ? 'ic_lottie_heart' : _b, _c = _a.displayType, displayType = _c === void 0 ? 'icon_text' : _c, _d = _a.backgroundColorTheme, backgroundColorTheme = _d === void 0 ? 'base1' : _d, overrideBackgroundColorKey = _a.overrideBackgroundColorKey, _e = _a.type, type = _e === void 0 ? 'button' : _e, _f = _a.state, state = _f === void 0 ? 'normal' : _f, onTouchStart = _a.onTouchStart, onTouchEnd = _a.onTouchEnd, onMouseDown = _a.onMouseDown, onClick = _a.onClick, onComplete = _a.onComplete;
+    var text = _a.text, actionText = _a.actionText, _b = _a.iconName, iconName = _b === void 0 ? 'ic_lottie_heart' : _b, _c = _a.displayType, displayType = _c === void 0 ? 'icon_text' : _c, _d = _a.backgroundColorTheme, backgroundColorTheme = _d === void 0 ? 'base1' : _d, overrideBackgroundColorKey = _a.overrideBackgroundColorKey, _e = _a.type, type = _e === void 0 ? 'button' : _e, _f = _a.state, state = _f === void 0 ? 'normal' : _f, onTouchStart = _a.onTouchStart, onTouchEnd = _a.onTouchEnd, onComplete = _a.onComplete;
     var lottieRef = (0, react_1.useRef)(null);
     var convertFormatHelper = function (value) {
         if (typeof value !== 'number')
@@ -38,49 +38,41 @@ 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) {
-        setIsAnimation(false);
+        if (state !== 'no_animation') {
+            setIsAnimation(false);
+        }
         if (onTouchStart) {
             onTouchStart(e);
         }
     };
     var handleTouchEnd = function (e) {
-        var _a, _b;
-        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 : '');
+        var _a;
+        if (state !== 'no_animation') {
+            setIsAnimation(true);
+            (_a = lottieRef.current) === null || _a === void 0 ? void 0 : _a.playSegments([[0, 30]], true);
+            setIsActionText(true);
+            setIsBackgroundColor(true);
+        }
         if (onTouchEnd) {
             onTouchEnd(e);
         }
         e.preventDefault();
     };
-    var handleMouseDown = function (e) {
-        setIsAnimation(false);
-        if (onMouseDown) {
-            onMouseDown(e);
-        }
-    };
-    var handleClick = function (e) {
-        var _a, _b;
-        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 : '');
-        if (onClick) {
-            onClick(e);
-        }
-    };
     var handleLottieIconComplete = function (e) {
-        setTextWord(convertFormatText);
+        setIsActionText(false);
+        setIsBackgroundColor(false);
         if (onComplete) {
             onComplete(e);
         }
     };
-    return (react_1.default.createElement(S_Button, { displayType: displayType, backgroundColorTheme: backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, state: state, disabled: state === 'disabled' || state === 'view_only', type: type, onTouchStart: handleTouchStart, onTouchEnd: handleTouchEnd, onMouseDown: handleMouseDown, onClick: handleClick, isAnimation: isAnimation },
+    return (react_1.default.createElement(S_Button, { displayType: displayType, backgroundColorTheme: backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, state: state, disabled: state === 'disabled' || state === 'view_only', type: type, onTouchStart: state === 'normal' ? handleTouchStart : undefined, onTouchEnd: state === 'normal' ? handleTouchEnd : undefined, onMouseDown: handleTouchStart, onClick: handleTouchEnd, isAnimation: isAnimation, isDefaultBackgroundColor: state === 'view_only' || isBackgroundColor },
         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;
@@ -97,40 +89,50 @@ var icon_text = (0, styled_components_1.css)(templateObject_6 || (templateObject
     var theme = _a.theme;
     return theme.spacing.spacingB;
 });
-var base1 = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+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_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;
     return theme.ui_cpnt_lottiereactionbutton_base_01;
 });
-var base2 = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var base2 = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_lottiereactionbutton_base_02;
 });
-var base3 = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var base3 = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_lottiereactionbutton_base_03;
 });
-var base4 = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var base4 = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_lottiereactionbutton_base_04;
 });
-var base5 = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var base5 = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_cpnt_lottiereactionbutton_base_05;
 });
-var overrideStyle = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+var overrideStyle = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme, overrideBackgroundColorKey = _a.overrideBackgroundColorKey;
     return overrideBackgroundColorKey && theme[overrideBackgroundColorKey];
 });
-var S_Button = styled_components_1.default.button(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"], ["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"])), function (_a) {
-    var backgroundColorTheme = _a.backgroundColorTheme;
-    return backgroundColorTheme &&
-        {
-            base1: base1,
-            base2: base2,
-            base3: base3,
-            base4: base4,
-            base5: base5
-        }[backgroundColorTheme];
+var S_Button = styled_components_1.default.button(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"], ["\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  justify-content: center;\n\n  ", ";\n\n  ", ";\n\n  ", ";\n\n  ", ";\n"])), function (_a) {
+    var backgroundColorTheme = _a.backgroundColorTheme, isDefaultBackgroundColor = _a.isDefaultBackgroundColor, overrideBackgroundColorKey = _a.overrideBackgroundColorKey;
+    if (isDefaultBackgroundColor) {
+        if (overrideBackgroundColorKey) {
+            return overrideStyle;
+        }
+        return (backgroundColorTheme &&
+            {
+                base1: base1,
+                base2: base2,
+                base3: base3,
+                base4: base4,
+                base5: base5
+            }[backgroundColorTheme]);
+    }
+    return greyBackgroundColor;
 }, function (_a) {
     var isAnimation = _a.isAnimation;
     return isAnimation && buttonAnimation;
@@ -141,17 +143,15 @@ var S_Button = styled_components_1.default.button(templateObject_13 || (template
             icon_only: icon_only,
             icon_text: icon_text
         }[displayType];
-}, function (_a) {
-    var overrideBackgroundColorKey = _a.overrideBackgroundColorKey;
-    return overrideBackgroundColorKey && overrideStyle;
 }, function (_a) {
     var state = _a.state;
     return state &&
         {
             normal: normal,
+            no_animation: normal,
             disabled: disabled,
             view_only: view_only
         }[state];
 });
 exports.default = LottieReactionButton;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14;

package/package.json CHANGED Viewed

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

package/release-note.md CHANGED Viewed

@@ -1,9 +1,8 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v1.6.9]
+## [v1.6.11]
 ### Component
-* TextLabel
-  * colorTheme prop에 sysTextWarning value 추가
-* AdminListItem
-  * 텍스트별 styleTheme prop에 report2 value 추가
+* LottieReactionButton
+    * 내부에서 text와 actionText 관리 방법 변경
+    * 기본 배경 색상의 컬러키 변경
 ### Color
-* 컬러 키 값 22.11.29 19시 58분 기준 싱크
+* 컬러 키 값 22.12.02 15시 00분 기준 싱크