pds-dev-kit-web 1.4.1 → 1.4.2

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 (40) hide show
  1. package/dist/src/common/assets/icons/fill/CheckboxOn.d.ts +1 -1
  2. package/dist/src/common/assets/icons/fill/CheckboxOn.js +24 -2
  3. package/dist/src/common/assets/icons/fill/index.d.ts +1 -1
  4. package/dist/src/common/styles/colorSet/SemanticColor.json +4 -4
  5. package/dist/src/common/styles/colorSet/UIColor.json +2 -1
  6. package/dist/src/common/styles/colorSet/index.d.ts +3 -2
  7. package/dist/src/common/styles/colorSet/index.js +2 -2
  8. package/dist/src/common/styles/colorSet/ui-type.d.ts +1 -0
  9. package/dist/src/desktop/components/Chip/Chip.js +7 -9
  10. package/dist/src/desktop/components/ContextMenu/ContextMenu.js +1 -1
  11. package/dist/src/desktop/components/ContextMenuItem/ContextMenuItem.js +1 -1
  12. package/dist/src/desktop/components/DesktopAlertDialog/DesktopAlertDialog.js +1 -1
  13. package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js +3 -4
  14. package/dist/src/desktop/components/FloatingActionButton/FloatingActionButton.js +1 -1
  15. package/dist/src/desktop/components/IconButton/IconButton.js +1 -1
  16. package/dist/src/desktop/components/ImageSlide/ImageSlide.js +1 -1
  17. package/dist/src/desktop/components/MainButton/MainButton.js +1 -1
  18. package/dist/src/desktop/components/ReactionButton/ReactionButton.js +1 -1
  19. package/dist/src/desktop/components/Select/Select.js +1 -1
  20. package/dist/src/desktop/components/TextButton/TextButton.js +1 -1
  21. package/dist/src/desktop/components/UploadIconButton/UploadIconButton.js +1 -1
  22. package/dist/src/hybrid/components/Divider/Divider.js +12 -9
  23. package/dist/src/mobile/components/Card/Card.js +1 -1
  24. package/dist/src/mobile/components/Chip/Chip.js +8 -10
  25. package/dist/src/mobile/components/ContextMenu/ContextMenu.js +1 -1
  26. package/dist/src/mobile/components/ContextMenuItem/ContextMenuItem.js +1 -1
  27. package/dist/src/mobile/components/Dropdown/Dropdown.js +1 -1
  28. package/dist/src/mobile/components/IconButton/IconButton.js +1 -1
  29. package/dist/src/mobile/components/ImageSlide/ImageSlide.js +1 -1
  30. package/dist/src/mobile/components/MainButton/MainButton.js +3 -12
  31. package/dist/src/mobile/components/MobileAlertDialog/MobileAlertDialog.js +2 -2
  32. package/dist/src/mobile/components/MobileTabBar/MobileTabBar.js +1 -1
  33. package/dist/src/mobile/components/Radio/Radio.js +1 -1
  34. package/dist/src/mobile/components/ReactionButton/ReactionButton.js +1 -1
  35. package/dist/src/mobile/components/Select/Select.js +1 -1
  36. package/dist/src/mobile/components/TextButton/TextButton.js +1 -4
  37. package/dist/src/mobile/components/UploadIconButton/UploadIconButton.js +1 -1
  38. package/dist/src/mobile/components/UploadMainButton/UploadMainButton.js +2 -8
  39. package/package.json +1 -1
  40. package/release-note.md +13 -3
package/dist/src/common/assets/icons/fill/CheckboxOn.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  /// <reference types="react" />
2
2
  import IconType from '../IconType';
3
- declare const CheckboxOn: ({ color, size }: IconType) => JSX.Element;
3
+ declare const CheckboxOn: ({ color, size, ...rest }: IconType) => JSX.Element;
4
4
  export default CheckboxOn;
package/dist/src/common/assets/icons/fill/CheckboxOn.js CHANGED
@@ -1,12 +1,34 @@
1
1
  "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __rest = (this && this.__rest) || function (s, e) {
14
+ var t = {};
15
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
16
+ t[p] = s[p];
17
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
18
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
19
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
20
+ t[p[i]] = s[p[i]];
21
+ }
22
+ return t;
23
+ };
2
24
  var __importDefault = (this && this.__importDefault) || function (mod) {
3
25
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
26
  };
5
27
  Object.defineProperty(exports, "__esModule", { value: true });
6
28
  var react_1 = __importDefault(require("react"));
7
29
  var CheckboxOn = function (_a) {
8
- var color = _a.color, size = _a.size;
9
- return (react_1.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24" },
30
+ var color = _a.color, size = _a.size, rest = __rest(_a, ["color", "size"]);
31
+ return (react_1.default.createElement("svg", __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest),
10
32
  react_1.default.createElement("g", { fill: "none", fillRule: "evenodd" },
11
33
  react_1.default.createElement("path", { fill: color, d: "M18.461,-0.0003 L5.538,-0.0003 C2.479,-0.0003 -1.77635684e-14,2.4797 -1.77635684e-14,5.5387 L-1.77635684e-14,18.4617 C-1.77635684e-14,21.5207 2.479,23.9997 5.538,23.9997 L18.461,23.9997 C21.52,23.9997 24,21.5207 24,18.4617 L24,5.5387 C24,2.4797 21.52,-0.0003 18.461,-0.0003" }),
12
34
  react_1.default.createElement("path", { fill: "#FFF", d: "M19.624,7.6977 L11.173,18.7717 C11.009,18.9877 10.756,19.1167 10.485,19.1247 C10.476,19.1257 10.467,19.1257 10.458,19.1257 C10.197,19.1257 9.948,19.0117 9.776,18.8137 L4.409,12.5877 C4.084,12.2117 4.126,11.6427 4.503,11.3187 C4.881,10.9937 5.448,11.0367 5.772,11.4117 L10.416,16.7977 L18.193,6.6057 C18.494,6.2107 19.06,6.1347 19.455,6.4367 C19.85,6.7377 19.926,7.3027 19.624,7.6977" }))));
package/dist/src/common/assets/icons/fill/index.d.ts CHANGED
@@ -8,7 +8,7 @@ declare const fillIcons: {
8
8
  readonly ic_chat_counseling: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
9
9
  readonly ic_chat_crm: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
10
10
  readonly ic_checkbox_indeterminate: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
11
- readonly ic_checkbox_on: ({ color, size }: import("../IconType").default) => JSX.Element;
11
+ readonly ic_checkbox_on: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
12
12
  readonly ic_cloud_download: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
13
13
  readonly ic_delete: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
14
14
  readonly ic_downloaded: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
package/dist/src/common/styles/colorSet/SemanticColor.json CHANGED
@@ -9,8 +9,8 @@
9
9
  "grey900": "#1e1e20",
10
10
  "grey500": "#68686b",
11
11
  "grey400": "#aaaab1",
12
- "grey100": "#e8eaed",
13
- "grey50": "#f5f6f8",
12
+ "grey100": "#e3e5e9",
13
+ "grey50": "#eff0f3",
14
14
  "white": "#ffffff",
15
15
  "black": "#000000",
16
16
  "darkblue500": "#586cff",
@@ -29,7 +29,7 @@
29
29
  "opacity30": "4D",
30
30
  "opacity65": "A6",
31
31
  "darkgreen500": "#0ce1a8",
32
- "grey70": "#eff0f3",
32
+ "grey70": "#eaebef",
33
33
  "navy500": "#313349",
34
34
  "lightgreen500": "#32d64c",
35
35
  "pink500": "#FB3A63",
@@ -52,7 +52,7 @@
52
52
  "darknavy100": "#7A82B2",
53
53
  "opacity80": "CC",
54
54
  "opacity50": "80",
55
- "grey30": "#f8f9fa",
55
+ "grey30": "#f5f5f8",
56
56
  "opacity95": "F2",
57
57
  "darkgrey30": "#1d1d1e",
58
58
  "opacity40": "66"
package/dist/src/common/styles/colorSet/UIColor.json CHANGED
@@ -510,5 +510,6 @@
510
510
  "ui_cpnt_dropdown_text_white_disabled": "sys_text_grey_03",
511
511
  "ui_cpnt_select_base_darktheme_normal": "sys_component_base_darktheme_01",
512
512
  "ui_hero_title_text": "sys_text_white",
513
- "ui_hero_description_text": "sys_text_white"
513
+ "ui_hero_description_text": "sys_text_white",
514
+ "ui_cpnt_divider_area": "sys_border_area_01"
514
515
  }
package/dist/src/common/styles/colorSet/index.d.ts CHANGED
@@ -58,7 +58,7 @@ declare const colorSet: {
58
58
  darkgrey30: string;
59
59
  opacity40: string;
60
60
  };
61
- readonly PaletteColor_Dark: {
61
+ readonly PaletteColor_light: {
62
62
  sys_container_background_01: string;
63
63
  sys_container_background_02: string;
64
64
  sys_container_background_03: string;
@@ -230,7 +230,7 @@ declare const colorSet: {
230
230
  sys_border_line_darktheme_06: string;
231
231
  sys_border_line_darktheme_07: string;
232
232
  };
233
- readonly PaletteColor_light: {
233
+ readonly PaletteColor_Dark: {
234
234
  sys_container_background_01: string;
235
235
  sys_container_background_02: string;
236
236
  sys_container_background_03: string;
@@ -915,6 +915,7 @@ declare const colorSet: {
915
915
  ui_cpnt_select_base_darktheme_normal: string;
916
916
  ui_hero_title_text: string;
917
917
  ui_hero_description_text: string;
918
+ ui_cpnt_divider_area: string;
918
919
  };
919
920
  };
920
921
  export default colorSet;
package/dist/src/common/styles/colorSet/index.js CHANGED
@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  /* eslint-disable import/order */
7
7
  var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
8
- var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
9
8
  var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
9
+ var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
10
10
  var UIColor_json_1 = __importDefault(require("./UIColor.json"));
11
11
  var colorSet = {
12
12
  SemanticColor: SemanticColor_json_1.default,
13
- PaletteColor_Dark: PaletteColor_Dark_json_1.default,
14
13
  PaletteColor_light: PaletteColor_light_json_1.default,
14
+ PaletteColor_Dark: PaletteColor_Dark_json_1.default,
15
15
  UIColor: UIColor_json_1.default
16
16
  };
17
17
  exports.default = colorSet;
package/dist/src/common/styles/colorSet/ui-type.d.ts CHANGED
@@ -511,4 +511,5 @@ export interface UITheme {
511
511
  ui_cpnt_select_base_darktheme_normal: string;
512
512
  ui_hero_title_text: string;
513
513
  ui_hero_description_text: string;
514
+ ui_cpnt_divider_area: string;
514
515
  }
package/dist/src/desktop/components/Chip/Chip.js CHANGED
@@ -85,7 +85,7 @@ function Chip(_a) {
85
85
  return react_1.default.createElement(S_ChipWrapper, null, chipType());
86
86
  }
87
87
  exports.default = Chip;
88
- var S_CategoryChoiceChip = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 16px;\n box-sizing: border-box;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n gap: 4px;\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n }\n ", ";\n"], ["\n border-radius: 16px;\n box-sizing: border-box;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n gap: 4px;\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n }\n ", ";\n"])), function (_a) {
88
+ var S_CategoryChoiceChip = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 16px;\n box-sizing: border-box;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n }\n ", ";\n"], ["\n border-radius: 16px;\n box-sizing: border-box;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n }\n ", ";\n"])), function (_a) {
89
89
  var theme = _a.theme, isActive = _a.isActive;
90
90
  return isActive ? theme.ui_cpnt_chip_fill_base_active_01 : '';
91
91
  }, function (_a) {
@@ -103,11 +103,9 @@ var S_CategoryChoiceChip = styled_components_1.default.div(templateObject_1 || (
103
103
  });
104
104
  var S_CategoryIconWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
105
105
  var theme = _a.theme, isActive = _a.isActive;
106
- return isActive
107
- ? "margin-left: " + theme.spacing.spacingA + "px"
108
- : "margin-right: " + theme.spacing.spacingA + "px";
106
+ return isActive ? "margin-left: " + theme.spacing.spacingA : "margin-right: " + theme.spacing.spacingA;
109
107
  });
110
- var S_InfoChip = styled_components_1.default.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-radius: 12px;\n display: flex;\n height: 24px;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n border-radius: 12px;\n display: flex;\n height: 24px;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
108
+ var S_InfoChip = styled_components_1.default.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-radius: 12px;\n box-sizing: border-box;\n display: flex;\n height: 24px;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n border-radius: 12px;\n box-sizing: border-box;\n display: flex;\n height: 24px;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
111
109
  var theme = _a.theme;
112
110
  return theme.ui_cpnt_chip_fill_base_inactive;
113
111
  }, function (_a) {
@@ -117,7 +115,7 @@ var S_InfoChip = styled_components_1.default.span(templateObject_3 || (templateO
117
115
  var theme = _a.theme;
118
116
  return theme.spacing.spacingC;
119
117
  });
120
- var S_RemovableChip = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 16px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n"], ["\n background-color: ", ";\n border-radius: 16px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n"])), function (_a) {
118
+ var S_RemovableChip = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 16px;\n box-sizing: border-box;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n"], ["\n background-color: ", ";\n border-radius: 16px;\n box-sizing: border-box;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n"])), function (_a) {
121
119
  var theme = _a.theme;
122
120
  return theme.ui_cpnt_chip_fill_base_inactive;
123
121
  }, function (_a) {
@@ -131,7 +129,7 @@ var S_XIconWrapper = styled_components_1.default.div(templateObject_5 || (templa
131
129
  var theme = _a.theme;
132
130
  return theme.spacing.spacingB;
133
131
  });
134
- var S_FilterSingleChip = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n border-radius: 16px;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n"], ["\n border-radius: 16px;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n"])), function (_a) {
132
+ var S_FilterSingleChip = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 16px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n"], ["\n background-color: ", ";\n border-radius: 16px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n cursor: pointer;\n"])), function (_a) {
135
133
  var theme = _a.theme, isActive = _a.isActive;
136
134
  return isActive ? theme.ui_cpnt_chip_fill_base_active_01 : theme.ui_cpnt_chip_fill_base_inactive;
137
135
  }, function (_a) {
@@ -145,14 +143,14 @@ var S_FilterIconWrapper = styled_components_1.default.div(templateObject_7 || (t
145
143
  var theme = _a.theme;
146
144
  return theme.spacing.spacingA;
147
145
  });
148
- var S_LabelChip = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n border: 1px solid ", ";\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 20px;\n padding: 0 ", ";\n"], ["\n border: 1px solid ", ";\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 20px;\n padding: 0 ", ";\n"])), function (_a) {
146
+ var S_LabelChip = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n border: 1px solid ", ";\n border-radius: 10px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 20px;\n padding: 0 ", ";\n"], ["\n border: 1px solid ", ";\n border-radius: 10px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 20px;\n padding: 0 ", ";\n"])), function (_a) {
149
147
  var theme = _a.theme;
150
148
  return theme.ui_cpnt_chip_line_border_01;
151
149
  }, function (_a) {
152
150
  var theme = _a.theme;
153
151
  return theme.spacing.spacingB;
154
152
  });
155
- var S_TimeChip = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 10px;\n height: 20px;\n padding: 0 ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n background-color: ", ";\n border-radius: 10px;\n height: 20px;\n padding: 0 ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_a) {
153
+ var S_TimeChip = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 10px;\n box-sizing: border-box;\n height: 20px;\n padding: 0 ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n background-color: ", ";\n border-radius: 10px;\n box-sizing: border-box;\n height: 20px;\n padding: 0 ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_a) {
156
154
  var theme = _a.theme;
157
155
  return theme.ui_cpnt_chip_base_playtime;
158
156
  }, function (_a) {
package/dist/src/desktop/components/ContextMenu/ContextMenu.js CHANGED
@@ -13,7 +13,7 @@ function ContextMenu(_a) {
13
13
  var children = _a.children, _b = _a.autoWidthMode, autoWidthMode = _b === void 0 ? 'none' : _b, maxHeight = _a.maxHeight;
14
14
  return (react_1.default.createElement(S_ContextMenu, { autoWidth: autoWidthMode === 'use', maxHeight: maxHeight }, children));
15
15
  }
16
- var S_ContextMenu = styled_components_1.default.ul(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 14px;\n box-shadow: ", ";\n list-style: none;\n margin: 0;\n min-width: 128px;\n overflow-y: auto;\n padding: ", " 0;\n position: relative;\n vertical-align: baseline;\n width: ", ";\n z-index: 3;\n\n max-height: ", ";\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 14px;\n box-shadow: ", ";\n list-style: none;\n margin: 0;\n min-width: 128px;\n overflow-y: auto;\n padding: ", " 0;\n position: relative;\n vertical-align: baseline;\n width: ", ";\n z-index: 3;\n\n max-height: ", ";\n"])), function (_a) {
16
+ var S_ContextMenu = styled_components_1.default.ul(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 14px;\n box-sizing: border-box;\n box-shadow: ", ";\n list-style: none;\n margin: 0;\n min-width: 128px;\n overflow-y: auto;\n padding: ", " 0;\n position: relative;\n vertical-align: baseline;\n width: ", ";\n z-index: 3;\n\n max-height: ", ";\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 14px;\n box-sizing: border-box;\n box-shadow: ", ";\n list-style: none;\n margin: 0;\n min-width: 128px;\n overflow-y: auto;\n padding: ", " 0;\n position: relative;\n vertical-align: baseline;\n width: ", ";\n z-index: 3;\n\n max-height: ", ";\n"])), function (_a) {
17
17
  var theme = _a.theme;
18
18
  return theme.ui_cpnt_contextmenu_base;
19
19
  }, function (_a) {
package/dist/src/desktop/components/ContextMenuItem/ContextMenuItem.js CHANGED
@@ -67,7 +67,7 @@ var small = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 =
67
67
  var theme = _a.theme;
68
68
  return theme.spacing.spacingD;
69
69
  });
70
- var S_ContextMenuItem = styled_components_1.default.li(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n cursor: pointer;\n display: flex;\n\n ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n cursor: pointer;\n display: flex;\n\n ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n ", ";\n"])), function (_a) {
70
+ var S_ContextMenuItem = styled_components_1.default.li(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n cursor: pointer;\n display: flex;\n\n ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n cursor: pointer;\n display: flex;\n\n ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n ", ";\n"])), function (_a) {
71
71
  var theme = _a.theme, selected = _a.selected;
72
72
  return selected
73
73
  ? theme.ui_cpnt_contextmenu_menu_base_selected
package/dist/src/desktop/components/DesktopAlertDialog/DesktopAlertDialog.js CHANGED
@@ -88,7 +88,7 @@ var S_ModalOverlay = styled_components_1.default.div(templateObject_4 || (templa
88
88
  var theme = _a.theme;
89
89
  return theme.ui_cpnt_alertdialog_dimmed;
90
90
  });
91
- var S_ModalWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-shadow: ", ";\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n width: auto;\n min-width: 480px;\n max-width: 560px;\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-shadow: ", ";\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n width: auto;\n min-width: 480px;\n max-width: 560px;\n"])), function (_a) {
91
+ var S_ModalWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-sizing: border-box;\n box-shadow: ", ";\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n width: auto;\n min-width: 480px;\n max-width: 560px;\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-sizing: border-box;\n box-shadow: ", ";\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n width: auto;\n min-width: 480px;\n max-width: 560px;\n"])), function (_a) {
92
92
  var theme = _a.theme;
93
93
  return theme.ui_cpnt_alertdialog_base;
94
94
  }, function (_a) {
package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js CHANGED
@@ -28,6 +28,7 @@ var react_1 = __importStar(require("react"));
28
28
  var react_hook_form_1 = require("react-hook-form");
29
29
  var react_i18next_1 = require("react-i18next");
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
+ var hybrid_1 = require("../../../hybrid");
31
32
  var components_1 = require("../../common/components");
32
33
  var IconButton_1 = require("../IconButton");
33
34
  function EditApplyTextField(_a) {
@@ -154,6 +155,7 @@ function EditApplyTextField(_a) {
154
155
  react_1.default.createElement(S_S_TextFieldBaseWrapper, { size: size, responsiveMode: responsiveMode, textLineType: textLineType, isFocused: isFocused, isError: isError, state: state }, S_TextFieldBase()),
155
156
  isOpen === true && (react_1.default.createElement(S_ButtonBox, null,
156
157
  react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_xmark", fillType: "line", baseSize: "small", iconSize: 16, shapeType: "circular", shadow: "visible", iconColorKey: "ui_cpnt_button_icon_enabled", baseColorKey: "ui_cpnt_button_fill_base_white", borderColorKey: "ui_cpnt_button_line_border_default", tabIndex: -1, onMouseDown: handleCancel }),
158
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }),
157
159
  react_1.default.createElement(IconButton_1.IconButton, { iconName: "ic_check", fillType: "fill", baseSize: "small", iconSize: 16, shapeType: "circular", shadow: "visible", iconColorKey: "ui_cpnt_button_icon_on_primary", baseColorKey: "ui_cpnt_button_fill_base_primary", state: isError === true ? 'disabled' : 'normal', tabIndex: -1, onMouseDown: handleMouseDown, type: "submit" })))),
158
160
  ((_b = errors[name]) === null || _b === void 0 ? void 0 : _b.message) && (react_1.default.createElement(S_Error, { isFocused: isFocused }, t(errors[name].message))))));
159
161
  }
@@ -270,9 +272,6 @@ var S_Error = styled_components_1.default.div(templateObject_11 || (templateObje
270
272
  var theme = _a.theme, isFocused = _a.isFocused;
271
273
  return isFocused ? theme.spacing.spacingI : theme.spacing.spacingA;
272
274
  });
273
- var S_ButtonBox = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n bottom: -36px;\n display: flex;\n gap: ", ";\n position: absolute;\n right: 0;\n z-index: 1;\n"], ["\n bottom: -36px;\n display: flex;\n gap: ", ";\n position: absolute;\n right: 0;\n z-index: 1;\n"])), function (_a) {
274
- var theme = _a.theme;
275
- return theme.spacing.spacingB;
276
- });
275
+ var S_ButtonBox = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n bottom: -36px;\n display: flex;\n position: absolute;\n right: 0;\n z-index: 1;\n"], ["\n bottom: -36px;\n display: flex;\n position: absolute;\n right: 0;\n z-index: 1;\n"])));
277
276
  exports.default = EditApplyTextField;
278
277
  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;
package/dist/src/desktop/components/FloatingActionButton/FloatingActionButton.js CHANGED
@@ -68,7 +68,7 @@ var disabled = (0, styled_components_1.css)(templateObject_3 || (templateObject_
68
68
  var theme = _a.theme;
69
69
  return theme.ui_cpnt_button_fill_base_disabled;
70
70
  });
71
- var floatingActionButtonStyle = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border: none;\n bottom: 24px;\n box-shadow: ", ";\n cursor: ", ";\n display: flex;\n justify-content: center;\n position: fixed;\n right: 24px;\n /* NOTE : \uB808\uC774\uC5B4 \uB3C4\uC785 \uD6C4 \uC81C\uAC70\uB420 \uAC00\uB2A5\uC131 \uB18D\uD6C4 */\n z-index: 101;\n\n &:focus {\n outline: none;\n }\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n align-items: center;\n background-color: ", ";\n border: none;\n bottom: 24px;\n box-shadow: ", ";\n cursor: ", ";\n display: flex;\n justify-content: center;\n position: fixed;\n right: 24px;\n /* NOTE : \uB808\uC774\uC5B4 \uB3C4\uC785 \uD6C4 \uC81C\uAC70\uB420 \uAC00\uB2A5\uC131 \uB18D\uD6C4 */\n z-index: 101;\n\n &:focus {\n outline: none;\n }\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
71
+ var floatingActionButtonStyle = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border: none;\n bottom: 24px;\n box-sizing: border-box;\n box-shadow: ", ";\n cursor: ", ";\n display: flex;\n justify-content: center;\n position: fixed;\n right: 24px;\n /* NOTE : \uB808\uC774\uC5B4 \uB3C4\uC785 \uD6C4 \uC81C\uAC70\uB420 \uAC00\uB2A5\uC131 \uB18D\uD6C4 */\n z-index: 101;\n\n &:focus {\n outline: none;\n }\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n align-items: center;\n background-color: ", ";\n border: none;\n bottom: 24px;\n box-sizing: border-box;\n box-shadow: ", ";\n cursor: ", ";\n display: flex;\n justify-content: center;\n position: fixed;\n right: 24px;\n /* NOTE : \uB808\uC774\uC5B4 \uB3C4\uC785 \uD6C4 \uC81C\uAC70\uB420 \uAC00\uB2A5\uC131 \uB18D\uD6C4 */\n z-index: 101;\n\n &:focus {\n outline: none;\n }\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
72
72
  var theme = _a.theme;
73
73
  return theme.ui_cpnt_button_fill_base_primary;
74
74
  }, function (_a) {
package/dist/src/desktop/components/IconButton/IconButton.js CHANGED
@@ -141,7 +141,7 @@ var line2ColorTheme = (0, styled_components_1.css)(templateObject_11 || (templat
141
141
  var theme = _a.theme;
142
142
  return theme.ui_cpnt_button_line_border_primary;
143
143
  });
144
- var iconButtonStyle = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n cursor: ", ";\n display: flex;\n justify-content: center;\n ", ";\n ", ";\n ", ";\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n cursor: ", ";\n display: flex;\n justify-content: center;\n ", ";\n ", ";\n ", ";\n ", ";\n"])), function (_a) {
144
+ var iconButtonStyle = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n box-sizing: border-box;\n cursor: ", ";\n display: flex;\n justify-content: center;\n ", ";\n ", ";\n ", ";\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n box-sizing: border-box;\n cursor: ", ";\n display: flex;\n justify-content: center;\n ", ";\n ", ";\n ", ";\n ", ";\n"])), function (_a) {
145
145
  var state = _a.state;
146
146
  return (state === 'normal' ? 'pointer' : 'default');
147
147
  }, function (_a) {
package/dist/src/desktop/components/ImageSlide/ImageSlide.js CHANGED
@@ -68,7 +68,7 @@ var S_Dot = styled_components_1.default.div(templateObject_3 || (templateObject_
68
68
  return theme.ui_cpnt_imageslide_inactive;
69
69
  });
70
70
  });
71
- var S_ImageSlideWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-direction: column;\n height: 100%;\n justify-content: center;\n min-width: ", ";\n padding: ", ";\n width: ", ";\n\n & > .slider {\n height: auto !important;\n }\n & div:focus {\n outline: none;\n }\n"], ["\n align-items: center;\n display: flex;\n flex-direction: column;\n height: 100%;\n justify-content: center;\n min-width: ", ";\n padding: ", ";\n width: ", ";\n\n & > .slider {\n height: auto !important;\n }\n & div:focus {\n outline: none;\n }\n"])), function (_a) {
71
+ var S_ImageSlideWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 100%;\n justify-content: center;\n min-width: ", ";\n padding: ", ";\n width: ", ";\n\n & > .slider {\n height: auto !important;\n }\n & div:focus {\n outline: none;\n }\n"], ["\n align-items: center;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 100%;\n justify-content: center;\n min-width: ", ";\n padding: ", ";\n width: ", ";\n\n & > .slider {\n height: auto !important;\n }\n & div:focus {\n outline: none;\n }\n"])), function (_a) {
72
72
  var imageWidth = _a.imageWidth;
73
73
  return imageWidth === 'responsive' ? "calc(100% - 48px)" : imageWidth + "px";
74
74
  }, function (_a) {
package/dist/src/desktop/components/MainButton/MainButton.js CHANGED
@@ -244,7 +244,7 @@ var secondary = (0, styled_components_1.css)(templateObject_16 || (templateObjec
244
244
  var state = _a.state;
245
245
  return state === 'disabled' && secondaryDisabled;
246
246
  });
247
- var S_Button = styled_components_1.default.button(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n cursor: ", ";\n display: inline-flex;\n justify-content: center;\n\n &:focus {\n outline: none;\n }\n ", "\n ", "\n ", "\n ", ";\n\n & > div {\n ", ";\n }\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n cursor: ", ";\n display: inline-flex;\n justify-content: center;\n\n &:focus {\n outline: none;\n }\n ", "\n ", "\n ", "\n ", ";\n\n & > div {\n ", ";\n }\n"])), function (_a) {
247
+ var S_Button = styled_components_1.default.button(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n box-sizing: border-box;\n cursor: ", ";\n display: inline-flex;\n justify-content: center;\n\n &:focus {\n outline: none;\n }\n ", "\n ", "\n ", "\n ", ";\n\n & > div {\n ", ";\n }\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n box-sizing: border-box;\n cursor: ", ";\n display: inline-flex;\n justify-content: center;\n\n &:focus {\n outline: none;\n }\n ", "\n ", "\n ", "\n ", ";\n\n & > div {\n ", ";\n }\n"])), function (_a) {
248
248
  var state = _a.state;
249
249
  return (state === 'normal' ? 'pointer' : 'default');
250
250
  }, function (_a) {
package/dist/src/desktop/components/ReactionButton/ReactionButton.js CHANGED
@@ -103,7 +103,7 @@ function ReactionButton(_a) {
103
103
  react_1.default.createElement(TextLabel_1.TextLabel, { text: convertFormatHelper(text), styleTheme: "body2Bold", singleLineMode: "use", colorTheme: TextLabelColorBySelect(), colorOverride: TextLabelColorByByColorTheme() }),
104
104
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" })));
105
105
  }
106
- var ReactionButtonStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n border-radius: 8px;\n cursor: 'pointer';\n display: flex;\n justify-content: center;\n padding: 0;\n height: 32px;\n\n &:hover:enabled {\n background-color: ", ";\n }\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n border-radius: 8px;\n cursor: 'pointer';\n display: flex;\n justify-content: center;\n padding: 0;\n height: 32px;\n\n &:hover:enabled {\n background-color: ", ";\n }\n"])), function (_a) {
106
+ var ReactionButtonStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n border-radius: 8px;\n box-sizing: border-box;\n cursor: pointer;\n display: flex;\n justify-content: center;\n padding: 0;\n height: 32px;\n\n &:hover:enabled {\n background-color: ", ";\n }\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n border-radius: 8px;\n box-sizing: border-box;\n cursor: pointer;\n display: flex;\n justify-content: center;\n padding: 0;\n height: 32px;\n\n &:hover:enabled {\n background-color: ", ";\n }\n"])), function (_a) {
107
107
  var theme = _a.theme;
108
108
  return theme.ui_cpnt_reactionbutton_base_01;
109
109
  });
package/dist/src/desktop/components/Select/Select.js CHANGED
@@ -110,7 +110,7 @@ var S_Icon_Wrapper = styled_components_1.default.div(templateObject_7 || (templa
110
110
  var theme = _a.theme;
111
111
  return theme.spacing.spacingD;
112
112
  });
113
- var S_Select = styled_components_1.default.select(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n appearance: none;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: ", ";\n cursor: pointer;\n color: ", ";\n font-family: inherit;\n font-size: ", ";\n height: 100%;\n padding-left: ", ";\n width: 100%;\n\n :disabled {\n background-color: ", ";\n border: 2px solid ", ";\n color: ", ";\n cursor: ", ";\n opacity: 1;\n }\n\n :focus {\n border: 2px solid ", " !important;\n color: ", ";\n outline: 0 !important;\n outline-offset: 0 !important;\n }\n\n ", "\n"], ["\n appearance: none;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: ", ";\n cursor: pointer;\n color: ", ";\n font-family: inherit;\n font-size: ", ";\n height: 100%;\n padding-left: ", ";\n width: 100%;\n\n :disabled {\n background-color: ", ";\n border: 2px solid ", ";\n color: ", ";\n cursor: ", ";\n opacity: 1;\n }\n\n :focus {\n border: 2px solid ", " !important;\n color: ", ";\n outline: 0 !important;\n outline-offset: 0 !important;\n }\n\n ", "\n"])), function (_a) {
113
+ var S_Select = styled_components_1.default.select(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n appearance: none;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: ", ";\n box-sizing: border-box;\n cursor: pointer;\n color: ", ";\n font-family: inherit;\n font-size: ", ";\n height: 100%;\n padding-left: ", ";\n width: 100%;\n\n :disabled {\n background-color: ", ";\n border: 2px solid ", ";\n color: ", ";\n cursor: ", ";\n opacity: 1;\n }\n\n :focus {\n border: 2px solid ", " !important;\n color: ", ";\n outline: 0 !important;\n outline-offset: 0 !important;\n }\n\n ", "\n"], ["\n appearance: none;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: ", ";\n box-sizing: border-box;\n cursor: pointer;\n color: ", ";\n font-family: inherit;\n font-size: ", ";\n height: 100%;\n padding-left: ", ";\n width: 100%;\n\n :disabled {\n background-color: ", ";\n border: 2px solid ", ";\n color: ", ";\n cursor: ", ";\n opacity: 1;\n }\n\n :focus {\n border: 2px solid ", " !important;\n color: ", ";\n outline: 0 !important;\n outline-offset: 0 !important;\n }\n\n ", "\n"])), function (_a) {
114
114
  var theme = _a.theme;
115
115
  return theme.ui_cpnt_select_base_normal;
116
116
  }, function (_a) {
package/dist/src/desktop/components/TextButton/TextButton.js CHANGED
@@ -80,7 +80,7 @@ var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 =
80
80
  var medium = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: 14px;\n height: 40px;\n"], ["\n border-radius: 14px;\n height: 40px;\n"])));
81
81
  var small = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n border-radius: 10px;\n height: 32px;\n"], ["\n border-radius: 10px;\n height: 32px;\n"])));
82
82
  var xsmall = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border-radius: 8px;\n height: 24px;\n"], ["\n border-radius: 8px;\n height: 24px;\n"])));
83
- var S_Button = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: ", ";\n display: flex;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n\n &:hover:enabled {\n background-color: ", ";\n }\n &:active:enabled {\n background-color: ", ";\n }\n ", ";\n\n & > div {\n ", ";\n }\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: ", ";\n display: flex;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n\n &:hover:enabled {\n background-color: ", ";\n }\n &:active:enabled {\n background-color: ", ";\n }\n ", ";\n\n & > div {\n ", ";\n }\n ", ";\n"])), function (_a) {
83
+ var S_Button = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n box-sizing: border-box;\n cursor: ", ";\n display: flex;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n\n &:hover:enabled {\n background-color: ", ";\n }\n &:active:enabled {\n background-color: ", ";\n }\n ", ";\n\n & > div {\n ", ";\n }\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n box-sizing: border-box;\n cursor: ", ";\n display: flex;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n\n &:hover:enabled {\n background-color: ", ";\n }\n &:active:enabled {\n background-color: ", ";\n }\n ", ";\n\n & > div {\n ", ";\n }\n ", ";\n"])), function (_a) {
84
84
  var state = _a.state;
85
85
  return (state === 'normal' ? 'pointer' : 'default');
86
86
  }, function (_a) {
package/dist/src/desktop/components/UploadIconButton/UploadIconButton.js CHANGED
@@ -127,7 +127,7 @@ var large = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 =
127
127
  var medium = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n height: 40px;\n width: 40px;\n"], ["\n height: 40px;\n width: 40px;\n"])));
128
128
  var small = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n height: 32px;\n width: 32px;\n"], ["\n height: 32px;\n width: 32px;\n"])));
129
129
  var xsmall = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n height: 24px;\n width: 24px;\n"], ["\n height: 24px;\n width: 24px;\n"])));
130
- var S_UploadIconButton = styled_components_1.default.label(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n border-radius: ", ";\n box-shadow: ", ";\n cursor: ", ";\n display: inline-flex;\n justify-content: center;\n\n ", ";\n\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n border-radius: ", ";\n box-shadow: ", ";\n cursor: ", ";\n display: inline-flex;\n justify-content: center;\n\n ", ";\n\n ", ";\n"])), function (_a) {
130
+ var S_UploadIconButton = styled_components_1.default.label(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n border-radius: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n cursor: ", ";\n display: inline-flex;\n justify-content: center;\n\n ", ";\n\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n border-radius: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n cursor: ", ";\n display: inline-flex;\n justify-content: center;\n\n ", ";\n\n ", ";\n"])), function (_a) {
131
131
  var shapeType = _a.shapeType;
132
132
  return shapeType === 'circular' && '50%';
133
133
  }, function (_a) {
package/dist/src/hybrid/components/Divider/Divider.js CHANGED
@@ -32,31 +32,34 @@ function Divider(_a) {
32
32
  var _b = _a.displayType, displayType = _b === void 0 ? 'line' : _b, _c = _a.direction, direction = _c === void 0 ? 'horizontal' : _c, height = _a.height, _d = _a.colorTheme, colorTheme = _d === void 0 ? 'none' : _d;
33
33
  return (react_1.default.createElement(S_Divider, { displayType: displayType, "$height": height, "$direction": direction, colorTheme: colorTheme }));
34
34
  }
35
- var horizontal = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: ", ";\n width: 100%;\n"], ["\n height: ", ";\n width: 100%;\n"])), function (_a) {
35
+ var horizontal = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: ", ";\n background-color: ", ";\n width: 100%;\n"], ["\n height: ", ";\n background-color: ", ";\n width: 100%;\n"])), function (_a) {
36
36
  var displayType = _a.displayType;
37
37
  return displayType &&
38
38
  {
39
39
  line: '1px',
40
40
  area: '16px'
41
41
  }[displayType];
42
+ }, function (_a) {
43
+ var displayType = _a.displayType, theme = _a.theme;
44
+ return displayType &&
45
+ {
46
+ line: theme.ui_cpnt_divider,
47
+ area: theme.ui_cpnt_divider_area
48
+ }[displayType];
42
49
  });
43
50
  var vertical = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: inline-block;\n height: ", ";\n width: 1px;\n"], ["\n display: inline-block;\n height: ", ";\n width: 1px;\n"])), function (_a) {
44
51
  var $height = _a.$height;
45
52
  return ($height ? $height + "px" : '100%');
46
53
  });
47
- var S_Divider = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", ";\n ", ";\n ", ";\n"], ["\n ", ";\n ", ";\n ", ";\n"])), function (_a) {
48
- var colorTheme = _a.colorTheme, theme = _a.theme;
49
- return colorTheme &&
50
- {
51
- none: "background-color: " + theme.ui_cpnt_divider + ";",
52
- divider1: "background-color: " + theme.ui_cpnt_divider_white_opacity30 + ";"
53
- }[colorTheme];
54
- }, function (_a) {
54
+ var S_Divider = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", ";\n ", ";\n ", "\n"], ["\n ", ";\n ", ";\n ", "\n"])), function (_a) {
55
55
  var $direction = _a.$direction;
56
56
  return $direction === 'horizontal' && horizontal;
57
57
  }, function (_a) {
58
58
  var $direction = _a.$direction, displayType = _a.displayType;
59
59
  return $direction === 'vertical' && displayType === 'line' && vertical;
60
+ }, function (_a) {
61
+ var colorTheme = _a.colorTheme, theme = _a.theme;
62
+ return colorTheme === 'divider1' && "background-color: " + theme.ui_cpnt_divider_white_opacity30 + ";";
60
63
  });
61
64
  exports.default = Divider;
62
65
  var templateObject_1, templateObject_2, templateObject_3;
package/dist/src/mobile/components/Card/Card.js CHANGED
@@ -35,7 +35,7 @@ var S_CardGroups = styled_components_1.default.div(templateObject_1 || (template
35
35
  return theme.boxShadow.elevation2 + ", 0 0 0 2px " + theme.ui_cpnt_card_selected_border + " inset";
36
36
  });
37
37
  var S_ImageIconModeBox = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n div {\n border-radius: 16px 16px 0 0;\n }\n"], ["\n div {\n border-radius: 16px 16px 0 0;\n }\n"])));
38
- var S_Content = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n padding: ", "; ;\n"], ["\n display: flex;\n flex-direction: column;\n padding: ", "; ;\n"])), function (_a) {
38
+ var S_Content = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n padding: ", "; ;\n"], ["\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n padding: ", "; ;\n"])), function (_a) {
39
39
  var theme = _a.theme;
40
40
  return theme.spacing.spacingD;
41
41
  });
package/dist/src/mobile/components/Chip/Chip.js CHANGED
@@ -56,7 +56,7 @@ function Chip(_a) {
56
56
  switch (displayType) {
57
57
  case 'category_choice':
58
58
  return (react_1.default.createElement(S_CategoryChoiceChip, { isActive: isActive, onClick: handleClickChip },
59
- id !== value && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: isActive },
59
+ !isActive && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: isActive },
60
60
  react_1.default.createElement(Icon_1.Icon, { size: 16, fillType: "line", iconName: "ic_filter", colorKey: "ui_cpnt_chip_line_icon_01" }))),
61
61
  react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: isActive ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
62
62
  isActive && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: isActive },
@@ -85,7 +85,7 @@ function Chip(_a) {
85
85
  return react_1.default.createElement(S_ChipWrapper, null, chipType());
86
86
  }
87
87
  exports.default = Chip;
88
- var S_CategoryChoiceChip = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 16px;\n box-sizing: border-box;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n gap: 4px;\n ", ";\n"], ["\n border-radius: 16px;\n box-sizing: border-box;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n gap: 4px;\n ", ";\n"])), function (_a) {
88
+ var S_CategoryChoiceChip = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 16px;\n box-sizing: border-box;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n ", ";\n"], ["\n border-radius: 16px;\n box-sizing: border-box;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n ", ";\n"])), function (_a) {
89
89
  var theme = _a.theme, isActive = _a.isActive;
90
90
  return isActive ? theme.ui_cpnt_chip_fill_base_active_01 : '';
91
91
  }, function (_a) {
@@ -100,11 +100,9 @@ var S_CategoryChoiceChip = styled_components_1.default.div(templateObject_1 || (
100
100
  });
101
101
  var S_CategoryIconWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
102
102
  var theme = _a.theme, isActive = _a.isActive;
103
- return isActive
104
- ? "margin-left: " + theme.spacing.spacingA + "px"
105
- : "margin-right: " + theme.spacing.spacingA + "px";
103
+ return isActive ? "margin-left: " + theme.spacing.spacingA : "margin-right: " + theme.spacing.spacingA;
106
104
  });
107
- var S_InfoChip = styled_components_1.default.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-radius: 12px;\n display: flex;\n height: 24px;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n border-radius: 12px;\n display: flex;\n height: 24px;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
105
+ var S_InfoChip = styled_components_1.default.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-radius: 12px;\n box-sizing: border-box;\n display: flex;\n height: 24px;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n border-radius: 12px;\n box-sizing: border-box;\n display: flex;\n height: 24px;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
108
106
  var theme = _a.theme;
109
107
  return theme.ui_cpnt_chip_fill_base_inactive;
110
108
  }, function (_a) {
@@ -114,7 +112,7 @@ var S_InfoChip = styled_components_1.default.span(templateObject_3 || (templateO
114
112
  var theme = _a.theme;
115
113
  return theme.spacing.spacingC;
116
114
  });
117
- var S_RemovableChip = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 16px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n background-color: ", ";\n border-radius: 16px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
115
+ var S_RemovableChip = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 16px;\n box-sizing: border-box;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n background-color: ", ";\n border-radius: 16px;\n box-sizing: border-box;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
118
116
  var theme = _a.theme;
119
117
  return theme.ui_cpnt_chip_fill_base_inactive;
120
118
  }, function (_a) {
@@ -128,7 +126,7 @@ var S_XIconWrapper = styled_components_1.default.div(templateObject_5 || (templa
128
126
  var theme = _a.theme;
129
127
  return theme.spacing.spacingB;
130
128
  });
131
- var S_FilterSingleChip = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n border-radius: 16px;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n border-radius: 16px;\n background-color: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
129
+ var S_FilterSingleChip = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 16px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n background-color: ", ";\n border-radius: 16px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 32px;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
132
130
  var theme = _a.theme, isActive = _a.isActive;
133
131
  return isActive ? theme.ui_cpnt_chip_fill_base_active_01 : theme.ui_cpnt_chip_fill_base_inactive;
134
132
  }, function (_a) {
@@ -142,14 +140,14 @@ var S_FilterIconWrapper = styled_components_1.default.div(templateObject_7 || (t
142
140
  var theme = _a.theme;
143
141
  return theme.spacing.spacingA;
144
142
  });
145
- var S_LabelChip = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n border: 1px solid ", ";\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 20px;\n padding: 0 ", ";\n"], ["\n border: 1px solid ", ";\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 20px;\n padding: 0 ", ";\n"])), function (_a) {
143
+ var S_LabelChip = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n border: 1px solid ", ";\n border-radius: 10px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 20px;\n padding: 0 ", ";\n"], ["\n border: 1px solid ", ";\n border-radius: 10px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 20px;\n padding: 0 ", ";\n"])), function (_a) {
146
144
  var theme = _a.theme;
147
145
  return theme.ui_cpnt_chip_line_border_01;
148
146
  }, function (_a) {
149
147
  var theme = _a.theme;
150
148
  return theme.spacing.spacingB;
151
149
  });
152
- var S_TimeChip = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 10px;\n height: 20px;\n padding: 0 ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n background-color: ", ";\n border-radius: 10px;\n height: 20px;\n padding: 0 ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_a) {
150
+ var S_TimeChip = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 10px;\n box-sizing: border-box;\n height: 20px;\n padding: 0 ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n background-color: ", ";\n border-radius: 10px;\n box-sizing: border-box;\n height: 20px;\n padding: 0 ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_a) {
153
151
  var theme = _a.theme;
154
152
  return theme.ui_cpnt_chip_base_playtime;
155
153
  }, function (_a) {
package/dist/src/mobile/components/ContextMenu/ContextMenu.js CHANGED
@@ -13,7 +13,7 @@ function ContextMenu(_a) {
13
13
  var children = _a.children, _b = _a.autoWidthMode, autoWidthMode = _b === void 0 ? 'none' : _b, maxHeight = _a.maxHeight;
14
14
  return (react_1.default.createElement(S_ContextMenu, { autoWidth: autoWidthMode === 'use', maxHeight: maxHeight }, children));
15
15
  }
16
- var S_ContextMenu = styled_components_1.default.ul(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 14px;\n box-shadow: ", ";\n list-style: none;\n margin: 0;\n min-width: 128px;\n overflow-y: auto;\n padding: ", " 0;\n vertical-align: baseline;\n width: ", ";\n max-height: ", ";\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 14px;\n box-shadow: ", ";\n list-style: none;\n margin: 0;\n min-width: 128px;\n overflow-y: auto;\n padding: ", " 0;\n vertical-align: baseline;\n width: ", ";\n max-height: ", ";\n"])), function (_a) {
16
+ var S_ContextMenu = styled_components_1.default.ul(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 14px;\n box-sizing: border-box;\n box-shadow: ", ";\n list-style: none;\n margin: 0;\n min-width: 128px;\n overflow-y: auto;\n padding: ", " 0;\n vertical-align: baseline;\n width: ", ";\n max-height: ", ";\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 14px;\n box-sizing: border-box;\n box-shadow: ", ";\n list-style: none;\n margin: 0;\n min-width: 128px;\n overflow-y: auto;\n padding: ", " 0;\n vertical-align: baseline;\n width: ", ";\n max-height: ", ";\n"])), function (_a) {
17
17
  var theme = _a.theme;
18
18
  return theme.ui_cpnt_contextmenu_base;
19
19
  }, function (_a) {
package/dist/src/mobile/components/ContextMenuItem/ContextMenuItem.js CHANGED
@@ -67,7 +67,7 @@ var small = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 =
67
67
  var theme = _a.theme;
68
68
  return theme.spacing.spacingD;
69
69
  });
70
- var S_ContextMenuItem = styled_components_1.default.li(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: flex;\n\n ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n display: flex;\n\n ", ";\n"])), function (_a) {
70
+ var S_ContextMenuItem = styled_components_1.default.li(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n display: flex;\n\n ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n display: flex;\n\n ", ";\n"])), function (_a) {
71
71
  var theme = _a.theme, selected = _a.selected;
72
72
  return selected
73
73
  ? theme.ui_cpnt_contextmenu_menu_base_selected
package/dist/src/mobile/components/Dropdown/Dropdown.js CHANGED
@@ -233,7 +233,7 @@ var borderColor = (0, styled_components_1.css)(templateObject_10 || (templateObj
233
233
  return theme.ui_cpnt_dropdown_border_normal;
234
234
  }
235
235
  });
236
- var S_Select = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border: 2px solid\n ", ";\n border-radius: 14px;\n display: flex;\n justify-content: space-between;\n\n ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n border: 2px solid\n ", ";\n border-radius: 14px;\n display: flex;\n justify-content: space-between;\n\n ", ";\n"])), function (_a) {
236
+ var S_Select = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border: 2px solid\n ", ";\n border-radius: 14px;\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n\n ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n border: 2px solid\n ", ";\n border-radius: 14px;\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n\n ", ";\n"])), function (_a) {
237
237
  var state = _a.state;
238
238
  switch (state) {
239
239
  case 'disabled':
package/dist/src/mobile/components/IconButton/IconButton.js CHANGED
@@ -133,7 +133,7 @@ var line2ColorTheme = (0, styled_components_1.css)(templateObject_11 || (templat
133
133
  var theme = _a.theme;
134
134
  return theme.ui_cpnt_button_line_border_primary;
135
135
  });
136
- var iconButtonStyle = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n display: flex;\n justify-content: center;\n ", ";\n ", ";\n ", ";\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n display: flex;\n justify-content: center;\n ", ";\n ", ";\n ", ";\n ", ";\n"])), function (_a) {
136
+ var iconButtonStyle = (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\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: flex;\n justify-content: center;\n ", ";\n ", ";\n ", ";\n ", ";\n"])), function (_a) {
137
137
  var shapeType = _a.shapeType;
138
138
  return shapeType && { circular: 'border-radius: 50%', rectangle: '' }[shapeType];
139
139
  }, function (_a) {
package/dist/src/mobile/components/ImageSlide/ImageSlide.js CHANGED
@@ -68,7 +68,7 @@ var S_Dot = styled_components_1.default.div(templateObject_3 || (templateObject_
68
68
  return theme.ui_cpnt_imageslide_inactive;
69
69
  });
70
70
  });
71
- var S_ImageSlideWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-direction: column;\n height: 100%;\n justify-content: center;\n min-width: ", ";\n padding: ", ";\n width: ", ";\n\n & > .slider {\n height: auto !important;\n }\n & div:focus {\n outline: none;\n }\n"], ["\n align-items: center;\n display: flex;\n flex-direction: column;\n height: 100%;\n justify-content: center;\n min-width: ", ";\n padding: ", ";\n width: ", ";\n\n & > .slider {\n height: auto !important;\n }\n & div:focus {\n outline: none;\n }\n"])), function (_a) {
71
+ var S_ImageSlideWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 100%;\n justify-content: center;\n min-width: ", ";\n padding: ", ";\n width: ", ";\n\n & > .slider {\n height: auto !important;\n }\n & div:focus {\n outline: none;\n }\n"], ["\n align-items: center;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 100%;\n justify-content: center;\n min-width: ", ";\n padding: ", ";\n width: ", ";\n\n & > .slider {\n height: auto !important;\n }\n & div:focus {\n outline: none;\n }\n"])), function (_a) {
72
72
  var imageWidth = _a.imageWidth;
73
73
  return imageWidth === 'responsive' ? "calc(100% - 48px)" : imageWidth + "px";
74
74
  }, function (_a) {
package/dist/src/mobile/components/MainButton/MainButton.js CHANGED
@@ -205,12 +205,9 @@ var primaryDisabled = (0, styled_components_1.css)(templateObject_13 || (templat
205
205
  var theme = _a.theme;
206
206
  return theme.ui_cpnt_button_fill_base_disabled;
207
207
  });
208
- var primary = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
208
+ var primary = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
209
209
  var theme = _a.theme;
210
210
  return theme.ui_cpnt_button_fill_base_primary;
211
- }, function (_a) {
212
- var theme = _a.theme;
213
- return "background-image: linear-gradient(\n to top,\n " + theme.ui_cpnt_button_fill_on_base_hover + ",\n " + theme.ui_cpnt_button_fill_on_base_hover + "\n );";
214
211
  }, function (_a) {
215
212
  var theme = _a.theme;
216
213
  return "background-image: linear-gradient(\n to top,\n " + theme.ui_cpnt_button_fill_on_base_pressed + ",\n " + theme.ui_cpnt_button_fill_on_base_pressed + "\n );";
@@ -222,12 +219,9 @@ var secondaryDisabled = (0, styled_components_1.css)(templateObject_15 || (templ
222
219
  var theme = _a.theme;
223
220
  return theme.ui_cpnt_button_line_base_hover;
224
221
  });
225
- var secondary = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
222
+ var secondary = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
226
223
  var theme = _a.theme;
227
224
  return theme.ui_cpnt_button_line_base_hover;
228
- }, function (_a) {
229
- var theme = _a.theme;
230
- return "background-image: linear-gradient(\n to top,\n " + theme.ui_cpnt_button_fill_on_base_hover + ",\n " + theme.ui_cpnt_button_fill_on_base_hover + "\n );";
231
225
  }, function (_a) {
232
226
  var theme = _a.theme;
233
227
  return "background-image: linear-gradient(\n to top,\n " + theme.ui_cpnt_button_fill_on_base_pressed + ",\n " + theme.ui_cpnt_button_fill_on_base_pressed + "\n );";
@@ -235,10 +229,7 @@ var secondary = (0, styled_components_1.css)(templateObject_16 || (templateObjec
235
229
  var state = _a.state;
236
230
  return state === 'disabled' && secondaryDisabled;
237
231
  });
238
- var S_Button = styled_components_1.default.button(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n cursor: ", ";\n display: flex;\n justify-content: center;\n\n &:focus {\n outline: none;\n }\n\n ", "\n ", "\n ", "\n ", ";\n\n & > div {\n ", ";\n }\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n cursor: ", ";\n display: flex;\n justify-content: center;\n\n &:focus {\n outline: none;\n }\n\n ", "\n ", "\n ", "\n ", ";\n\n & > div {\n ", ";\n }\n"])), function (_a) {
239
- var state = _a.state;
240
- return (state === 'normal' ? 'pointer' : 'default');
241
- }, function (_a) {
232
+ var S_Button = styled_components_1.default.button(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n\n &:focus {\n outline: none;\n }\n\n ", "\n ", "\n ", "\n ", ";\n\n & > div {\n ", ";\n }\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n\n &:focus {\n outline: none;\n }\n\n ", "\n ", "\n ", "\n ", ";\n\n & > div {\n ", ";\n }\n"])), function (_a) {
242
233
  var styleTheme = _a.styleTheme;
243
234
  return styleTheme && { primary: primary, secondary: secondary }[styleTheme];
244
235
  }, function (_a) {
package/dist/src/mobile/components/MobileAlertDialog/MobileAlertDialog.js CHANGED
@@ -89,7 +89,7 @@ var S_ModalOverlay = styled_components_1.default.div(templateObject_2 || (templa
89
89
  var theme = _a.theme;
90
90
  return theme.ui_cpnt_modal_dimmed;
91
91
  });
92
- var S_ModalWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-shadow: ", ";\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n max-height: 720px;\n width: calc(100% - 80px);\n max-width: 512px;\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-shadow: ", ";\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n max-height: 720px;\n width: calc(100% - 80px);\n max-width: 512px;\n"])), function (_a) {
92
+ var S_ModalWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-sizing: border-box;\n box-shadow: ", ";\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n max-height: 720px;\n width: calc(100% - 80px);\n max-width: 512px;\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-sizing: border-box;\n box-shadow: ", ";\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n max-height: 720px;\n width: calc(100% - 80px);\n max-width: 512px;\n"])), function (_a) {
93
93
  var theme = _a.theme;
94
94
  return theme.ui_cpnt_alertdialog_base;
95
95
  }, function (_a) {
@@ -99,7 +99,7 @@ var S_ModalWrapper = styled_components_1.default.div(templateObject_3 || (templa
99
99
  var theme = _a.theme;
100
100
  return theme.boxShadow.elevation5;
101
101
  });
102
- var S_Footer = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: ", ";\n align-items: ", ";\n justify-content: ", ";\n\n padding-top: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n display: flex;\n flex-direction: ", ";\n align-items: ", ";\n justify-content: ", ";\n\n padding-top: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
102
+ var S_Footer = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: ", ";\n align-items: ", ";\n justify-content: ", ";\n padding-top: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n display: flex;\n flex-direction: ", ";\n align-items: ", ";\n justify-content: ", ";\n padding-top: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
103
103
  var btnStack = _a.btnStack;
104
104
  return (btnStack === 'side' ? 'row' : 'column-reverse');
105
105
  }, function (_a) {
package/dist/src/mobile/components/MobileTabBar/MobileTabBar.js CHANGED
@@ -35,7 +35,7 @@ function MobileTabBar(_a) {
35
35
  }
36
36
  return react_1.default.createElement(react_1.default.Fragment, null);
37
37
  }
38
- var S_TabWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n position: relative;\n background-color: ", ";\n padding: 0 ", ";\n flex: 1;\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n background-color: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n ", ";\n }\n"], ["\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n position: relative;\n background-color: ", ";\n padding: 0 ", ";\n flex: 1;\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n background-color: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n ", ";\n }\n"])), function (_a) {
38
+ var S_TabWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n justify-content: center;\n display: flex;\n position: relative;\n background-color: ", ";\n padding: 0 ", ";\n flex: 1;\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n background-color: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n ", ";\n }\n"], ["\n align-items: center;\n justify-content: center;\n display: flex;\n position: relative;\n background-color: ", ";\n padding: 0 ", ";\n flex: 1;\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n background-color: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n ", ";\n }\n"])), function (_a) {
39
39
  var isActive = _a.isActive, theme = _a.theme;
40
40
  return isActive && theme.ui_cpnt_tabbar_base_area;
41
41
  }, function (_a) {
package/dist/src/mobile/components/Radio/Radio.js CHANGED
@@ -39,7 +39,7 @@ function Radio(_a) {
39
39
  : 'ui_cpnt_selcontrols_text_disabled' })),
40
40
  react_1.default.createElement("input", { hidden: true, id: value, type: "radio", name: name, value: value, checked: checked, color: value, onChange: handleChange, disabled: state === 'disabled' })));
41
41
  }
42
- var S_Label = styled_components_1.default.label(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n cursor: pointer;\n display: flex;\n height: 24px;\n"], ["\n align-items: center;\n cursor: pointer;\n display: flex;\n height: 24px;\n"])));
42
+ var S_Label = styled_components_1.default.label(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 24px;\n"], ["\n align-items: center;\n display: flex;\n height: 24px;\n"])));
43
43
  var S_OverrideIconWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n position: relative;\n"], ["\n align-items: center;\n display: flex;\n position: relative;\n"])));
44
44
  var S_OverrideIcon = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n left: 0;\n position: absolute;\n top: 0;\n"], ["\n left: 0;\n position: absolute;\n top: 0;\n"])));
45
45
  var S_TextWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n padding-left: ", ";\n"], ["\n padding-left: ", ";\n"])), function (_a) {
package/dist/src/mobile/components/ReactionButton/ReactionButton.js CHANGED
@@ -103,7 +103,7 @@ function ReactionButton(_a) {
103
103
  react_1.default.createElement(TextLabel_1.TextLabel, { text: convertFormatHelper(text), styleTheme: "body2Bold", singleLineMode: "use", colorTheme: TextLabelColorBySelect(), colorOverride: TextLabelColorByByColorTheme() }),
104
104
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" })));
105
105
  }
106
- var ReactionButtonStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n border-radius: 8px;\n display: flex;\n justify-content: center;\n padding: 0;\n height: 32px;\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n border-radius: 8px;\n display: flex;\n justify-content: center;\n padding: 0;\n height: 32px;\n"])));
106
+ var ReactionButtonStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n border-radius: 8px;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n padding: 0;\n height: 32px;\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n border-radius: 8px;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n padding: 0;\n height: 32px;\n"])));
107
107
  var S_ReactionButton = styled_components_1.default.button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), ReactionButtonStyle);
108
108
  exports.default = ReactionButton;
109
109
  var templateObject_1, templateObject_2;
package/dist/src/mobile/components/Select/Select.js CHANGED
@@ -106,7 +106,7 @@ var S_Icon_Wrapper = styled_components_1.default.div(templateObject_7 || (templa
106
106
  var theme = _a.theme;
107
107
  return theme.spacing.spacingD;
108
108
  });
109
- var S_Select = styled_components_1.default.select(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n appearance: none;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: ", ";\n color: ", ";\n font-family: inherit;\n font-size: ", ";\n height: 100%;\n padding-left: ", ";\n width: 100%;\n\n :disabled {\n background-color: ", ";\n border: 2px solid ", ";\n color: ", ";\n opacity: 1;\n }\n\n :focus {\n border: 2px solid ", " !important;\n color: ", ";\n outline: 0 !important;\n outline-offset: 0 !important;\n }\n\n ", "\n"], ["\n appearance: none;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: ", ";\n color: ", ";\n font-family: inherit;\n font-size: ", ";\n height: 100%;\n padding-left: ", ";\n width: 100%;\n\n :disabled {\n background-color: ", ";\n border: 2px solid ", ";\n color: ", ";\n opacity: 1;\n }\n\n :focus {\n border: 2px solid ", " !important;\n color: ", ";\n outline: 0 !important;\n outline-offset: 0 !important;\n }\n\n ", "\n"])), function (_a) {
109
+ var S_Select = styled_components_1.default.select(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n appearance: none;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: ", ";\n box-sizing: border-box;\n color: ", ";\n font-family: inherit;\n font-size: ", ";\n height: 100%;\n padding-left: ", ";\n width: 100%;\n\n :disabled {\n background-color: ", ";\n border: 2px solid ", ";\n color: ", ";\n opacity: 1;\n }\n\n :focus {\n border: 2px solid ", " !important;\n color: ", ";\n outline: 0 !important;\n outline-offset: 0 !important;\n }\n\n ", "\n"], ["\n appearance: none;\n background-color: ", ";\n border: 2px solid ", ";\n border-radius: ", ";\n box-sizing: border-box;\n color: ", ";\n font-family: inherit;\n font-size: ", ";\n height: 100%;\n padding-left: ", ";\n width: 100%;\n\n :disabled {\n background-color: ", ";\n border: 2px solid ", ";\n color: ", ";\n opacity: 1;\n }\n\n :focus {\n border: 2px solid ", " !important;\n color: ", ";\n outline: 0 !important;\n outline-offset: 0 !important;\n }\n\n ", "\n"])), function (_a) {
110
110
  var theme = _a.theme;
111
111
  return theme.ui_cpnt_select_base_normal;
112
112
  }, function (_a) {
package/dist/src/mobile/components/TextButton/TextButton.js CHANGED
@@ -80,10 +80,7 @@ var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 =
80
80
  var medium = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: 14px;\n height: 40px;\n"], ["\n border-radius: 14px;\n height: 40px;\n"])));
81
81
  var small = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n border-radius: 10px;\n height: 32px;\n"], ["\n border-radius: 10px;\n height: 32px;\n"])));
82
82
  var xsmall = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border-radius: 8px;\n height: 24px;\n"], ["\n border-radius: 8px;\n height: 24px;\n"])));
83
- var S_Button = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: ", ";\n display: flex;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n\n &:active:enabled {\n background-color: ", ";\n }\n ", ";\n\n & > div {\n ", ";\n }\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: ", ";\n display: flex;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n\n &:active:enabled {\n background-color: ", ";\n }\n ", ";\n\n & > div {\n ", ";\n }\n ", ";\n"])), function (_a) {
84
- var state = _a.state;
85
- return (state === 'normal' ? 'pointer' : 'default');
86
- }, function (_a) {
83
+ var S_Button = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n\n &:active:enabled {\n background-color: ", ";\n }\n ", ";\n\n & > div {\n ", ";\n }\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n padding-left: 8px;\n padding-right: 8px;\n\n &:active:enabled {\n background-color: ", ";\n }\n ", ";\n\n & > div {\n ", ";\n }\n ", ";\n"])), function (_a) {
87
84
  var theme = _a.theme;
88
85
  return theme.ui_cpnt_button_line_base_pressed;
89
86
  }, function (_a) {
package/dist/src/mobile/components/UploadIconButton/UploadIconButton.js CHANGED
@@ -119,7 +119,7 @@ var large = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 =
119
119
  var medium = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n height: 40px;\n width: 40px;\n"], ["\n height: 40px;\n width: 40px;\n"])));
120
120
  var small = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n height: 32px;\n width: 32px;\n"], ["\n height: 32px;\n width: 32px;\n"])));
121
121
  var xsmall = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n height: 24px;\n width: 24px;\n"], ["\n height: 24px;\n width: 24px;\n"])));
122
- var S_UploadIconButton = styled_components_1.default.label(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n border-radius: ", ";\n box-shadow: ", ";\n display: inline-flex;\n justify-content: center;\n\n ", ";\n\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n border-radius: ", ";\n box-shadow: ", ";\n display: inline-flex;\n justify-content: center;\n\n ", ";\n\n ", ";\n"])), function (_a) {
122
+ var S_UploadIconButton = styled_components_1.default.label(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n border-radius: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n display: inline-flex;\n justify-content: center;\n\n ", ";\n\n ", ";\n"], ["\n align-items: center;\n background-color: transparent;\n border: 1px solid transparent;\n border-radius: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n display: inline-flex;\n justify-content: center;\n\n ", ";\n\n ", ";\n"])), function (_a) {
123
123
  var shapeType = _a.shapeType;
124
124
  return shapeType === 'circular' && '50%';
125
125
  }, function (_a) {
package/dist/src/mobile/components/UploadMainButton/UploadMainButton.js CHANGED
@@ -184,12 +184,9 @@ var primaryDisabled = (0, styled_components_1.css)(templateObject_13 || (templat
184
184
  var theme = _a.theme;
185
185
  return theme.ui_cpnt_button_fill_base_disabled;
186
186
  });
187
- var primary = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
187
+ var primary = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
188
188
  var theme = _a.theme;
189
189
  return theme.ui_cpnt_button_fill_base_primary;
190
- }, function (_a) {
191
- var theme = _a.theme;
192
- return "background-image: linear-gradient(\n to top,\n " + theme.ui_cpnt_button_fill_on_base_hover + ",\n " + theme.ui_cpnt_button_fill_on_base_hover + "\n );";
193
190
  }, function (_a) {
194
191
  var theme = _a.theme;
195
192
  return "background-image: linear-gradient(\n to top,\n " + theme.ui_cpnt_button_fill_on_base_pressed + ",\n " + theme.ui_cpnt_button_fill_on_base_pressed + "\n );";
@@ -201,12 +198,9 @@ var secondaryDisabled = (0, styled_components_1.css)(templateObject_15 || (templ
201
198
  var theme = _a.theme;
202
199
  return theme.ui_cpnt_button_line_base_hover;
203
200
  });
204
- var secondary = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
201
+ var secondary = (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"], ["\n background-color: ", ";\n border: none;\n\n &:active:enabled {\n ", "\n }\n\n ", "\n"])), function (_a) {
205
202
  var theme = _a.theme;
206
203
  return theme.ui_cpnt_button_line_base_hover;
207
- }, function (_a) {
208
- var theme = _a.theme;
209
- return "background-image: linear-gradient(\n to top,\n " + theme.ui_cpnt_button_fill_on_base_hover + ",\n " + theme.ui_cpnt_button_fill_on_base_hover + "\n );";
210
204
  }, function (_a) {
211
205
  var theme = _a.theme;
212
206
  return "background-image: linear-gradient(\n to top,\n " + theme.ui_cpnt_button_fill_on_base_pressed + ",\n " + theme.ui_cpnt_button_fill_on_base_pressed + "\n );";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.4.1",
3
+ "version": "1.4.2",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,6 +1,16 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.4.1]
2
+ ## [v1.4.2]
3
3
 
4
4
  ### Component
5
- * ReactionButton
6
- * select되었을때 text색상 sysTextBrandPrimary에서 usrTextBrandPrimary로 변경
5
+ * 전체 컴포넌트
6
+ * flex와 gap이 함께 쓰이는 부분 제거
7
+ * 기획서에서 명시된 크기와 다르게 표현되고 있는 부분들에 box-sizing: border-box 부여
8
+ * 모바일용 컴포넌트
9
+ * hover와 cursor 관련 이벤트 제거
10
+ * Checkbox (CheckboxOn icon)
11
+ * Checkbox icon이 찌그러지지 않도록 수정
12
+ * Divider
13
+ * displayType이 ‘area’일 경우 ui_cpnt_divider_area부여
14
+
15
+ ### Color
16
+ * 컬러 키 값 22.06.07 15시 04분 기준 싱크