pds-dev-kit-web 1.4.44 → 1.4.47

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 (19) hide show
  1. package/dist/src/common/assets/icons/line/Home.d.ts +4 -0
  2. package/dist/src/common/assets/icons/line/Home.js +36 -0
  3. package/dist/src/common/assets/icons/line/PostPaperPlane.d.ts +4 -0
  4. package/dist/src/common/assets/icons/line/PostPaperPlane.js +36 -0
  5. package/dist/src/common/assets/icons/line/index.d.ts +2 -0
  6. package/dist/src/common/assets/icons/line/index.js +4 -0
  7. package/dist/src/common/styles/colorSet/UIColor.json +2 -1
  8. package/dist/src/common/styles/colorSet/index.d.ts +3 -2
  9. package/dist/src/common/styles/colorSet/index.js +2 -2
  10. package/dist/src/common/styles/colorSet/ui-type.d.ts +1 -0
  11. package/dist/src/desktop/components/AdminList/AdminList.js +1 -1
  12. package/dist/src/desktop/components/ChatBubbleListItem/ChatBubbleListItem.js +4 -4
  13. package/dist/src/desktop/components/DesktopTabBar/DesktopTabBar.js +41 -47
  14. package/dist/src/desktop/components/Dropdown/Dropdown.js +2 -2
  15. package/dist/src/desktop/components/FilterBar/FilterBar.js +1 -1
  16. package/dist/src/mobile/components/ChatBubbleListItem/ChatBubbleListItem.js +4 -4
  17. package/dist/src/mobile/components/Dropdown/Dropdown.js +2 -2
  18. package/package.json +1 -1
  19. package/release-note.md +11 -5
package/dist/src/common/assets/icons/line/Home.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import IconType from '../IconType';
3
+ declare const Home: ({ color, size, ...rest }: IconType) => JSX.Element;
4
+ export default Home;
package/dist/src/common/assets/icons/line/Home.js ADDED
@@ -0,0 +1,36 @@
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
+ };
24
+ var __importDefault = (this && this.__importDefault) || function (mod) {
25
+ return (mod && mod.__esModule) ? mod : { "default": mod };
26
+ };
27
+ Object.defineProperty(exports, "__esModule", { value: true });
28
+ var react_1 = __importDefault(require("react"));
29
+ var Home = function (_a) {
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),
32
+ react_1.default.createElement("g", { fill: "none", fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round" },
33
+ react_1.default.createElement("path", { stroke: color, strokeWidth: "1.5", d: "M13.4139,2.9733 C12.5939,2.2933 11.4059,2.2933 10.5859,2.9733 L3.6019,8.7643 C3.1089,9.1723 2.8239,9.7793 2.8239,10.4203 L2.8239,19.3223 C2.8239,20.5453 3.8149,21.5363 5.0379,21.5363 L18.9619,21.5363 C20.1849,21.5363 21.1759,20.5453 21.1759,19.3223 L21.1759,10.4213 C21.1759,9.7813 20.8909,9.1743 20.3979,8.7653 L13.4139,2.9733 Z" }),
34
+ react_1.default.createElement("path", { stroke: color, strokeWidth: "1.5", d: "M13.5869,14.4139 L10.4129,14.4139 C9.4319,14.4139 8.6369,15.2089 8.6369,16.1899 L8.6369,21.5369 L15.3629,21.5369 L15.3629,16.1899 C15.3629,15.2089 14.5679,14.4139 13.5869,14.4139 Z" }))));
35
+ };
36
+ exports.default = Home;
package/dist/src/common/assets/icons/line/PostPaperPlane.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import IconType from '../IconType';
3
+ declare const PostPaperPlane: ({ color, size, ...rest }: IconType) => JSX.Element;
4
+ export default PostPaperPlane;
package/dist/src/common/assets/icons/line/PostPaperPlane.js ADDED
@@ -0,0 +1,36 @@
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
+ };
24
+ var __importDefault = (this && this.__importDefault) || function (mod) {
25
+ return (mod && mod.__esModule) ? mod : { "default": mod };
26
+ };
27
+ Object.defineProperty(exports, "__esModule", { value: true });
28
+ var react_1 = __importDefault(require("react"));
29
+ var PostPaperPlane = function (_a) {
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),
32
+ react_1.default.createElement("g", { fill: "none", fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round" },
33
+ react_1.default.createElement("path", { stroke: color, strokeWidth: "1.5", d: "M2.0659,9.5751 L21.6129,2.9691 C22.0099,2.8341 22.3869,3.2201 22.2429,3.6141 L16.3869,19.6621 C16.2749,19.9691 15.9029,20.0881 15.6329,19.9021 L1.9419,10.4601 C1.6029,10.2271 1.6759,9.7071 2.0659,9.5751 Z" }),
34
+ react_1.default.createElement("path", { stroke: color, strokeWidth: "1.5", d: "M21.613,3.6358 L6.633,13.9508 L6.633,20.5578 C6.633,20.9718 7.108,21.2068 7.437,20.9548 L11.807,17.6108" }))));
35
+ };
36
+ exports.default = PostPaperPlane;
package/dist/src/common/assets/icons/line/index.d.ts CHANGED
@@ -47,6 +47,7 @@ declare const lineIcons: {
47
47
  readonly ic_filter: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
48
48
  readonly ic_folder: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
49
49
  readonly ic_ghost: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
50
+ readonly ic_home: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
50
51
  readonly ic_information: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
51
52
  readonly ic_internal: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
52
53
  readonly ic_language: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
@@ -85,6 +86,7 @@ declare const lineIcons: {
85
86
  readonly ic_post_inquiry: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
86
87
  readonly ic_post_magazine: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
87
88
  readonly ic_post_notice: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
89
+ readonly ic_post_paper_plane: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
88
90
  readonly ic_post_photobook: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
89
91
  readonly ic_post_promotion: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
90
92
  readonly ic_post_promotion_p: ({ color, size, ...rest }: import("../IconType").default) => JSX.Element;
package/dist/src/common/assets/icons/line/index.js CHANGED
@@ -50,6 +50,7 @@ var EyeClose_1 = __importDefault(require("./EyeClose"));
50
50
  var Filter_1 = __importDefault(require("./Filter"));
51
51
  var Folder_1 = __importDefault(require("./Folder"));
52
52
  var Ghost_1 = __importDefault(require("./Ghost"));
53
+ var Home_1 = __importDefault(require("./Home"));
53
54
  var Information_1 = __importDefault(require("./Information"));
54
55
  var Internal_1 = __importDefault(require("./Internal"));
55
56
  var Language_1 = __importDefault(require("./Language"));
@@ -88,6 +89,7 @@ var PostFree_1 = __importDefault(require("./PostFree"));
88
89
  var PostInquiry_1 = __importDefault(require("./PostInquiry"));
89
90
  var PostMagazine_1 = __importDefault(require("./PostMagazine"));
90
91
  var PostNotice_1 = __importDefault(require("./PostNotice"));
92
+ var PostPaperPlane_1 = __importDefault(require("./PostPaperPlane"));
91
93
  var PostPhotobook_1 = __importDefault(require("./PostPhotobook"));
92
94
  var PostPromotion_1 = __importDefault(require("./PostPromotion"));
93
95
  var PostPromotionP_1 = __importDefault(require("./PostPromotionP"));
@@ -193,6 +195,7 @@ var lineIcons = {
193
195
  ic_filter: Filter_1.default,
194
196
  ic_folder: Folder_1.default,
195
197
  ic_ghost: Ghost_1.default,
198
+ ic_home: Home_1.default,
196
199
  ic_information: Information_1.default,
197
200
  ic_internal: Internal_1.default,
198
201
  ic_language: Language_1.default,
@@ -231,6 +234,7 @@ var lineIcons = {
231
234
  ic_post_inquiry: PostInquiry_1.default,
232
235
  ic_post_magazine: PostMagazine_1.default,
233
236
  ic_post_notice: PostNotice_1.default,
237
+ ic_post_paper_plane: PostPaperPlane_1.default,
234
238
  ic_post_photobook: PostPhotobook_1.default,
235
239
  ic_post_promotion: PostPromotion_1.default,
236
240
  ic_post_promotion_p: PostPromotionP_1.default,
package/dist/src/common/styles/colorSet/UIColor.json CHANGED
@@ -540,5 +540,6 @@
540
540
  "ui_cpnt_list_chatbubble_base_area_my_color": "usr_brand_primary",
541
541
  "ui_cpnt_list_chatbubble_text_my_color": "usr_on_brand_primary",
542
542
  "ui_cpnt_list_chatbubble_base_area_seller": "usr_brand_primary",
543
- "ui_cpnt_list_chatbubble_text_seller": "usr_on_brand_primary"
543
+ "ui_cpnt_list_chatbubble_text_seller": "usr_on_brand_primary",
544
+ "ui_52": "sys_widget_success_01"
544
545
  }
package/dist/src/common/styles/colorSet/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  declare const colorSet: {
2
- readonly PaletteColor_Dark: {
2
+ readonly PaletteColor_light: {
3
3
  sys_container_background_01: string;
4
4
  sys_container_background_02: string;
5
5
  sys_container_background_03: string;
@@ -179,7 +179,7 @@ declare const colorSet: {
179
179
  sys_text_social_login_02: string;
180
180
  sys_papp_livechat_link: string;
181
181
  };
182
- readonly PaletteColor_light: {
182
+ readonly PaletteColor_Dark: {
183
183
  sys_container_background_01: string;
184
184
  sys_container_background_02: string;
185
185
  sys_container_background_03: string;
@@ -962,6 +962,7 @@ declare const colorSet: {
962
962
  ui_cpnt_list_chatbubble_text_my_color: string;
963
963
  ui_cpnt_list_chatbubble_base_area_seller: string;
964
964
  ui_cpnt_list_chatbubble_text_seller: string;
965
+ ui_52: string;
965
966
  };
966
967
  };
967
968
  export default colorSet;
package/dist/src/common/styles/colorSet/index.js CHANGED
@@ -4,13 +4,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  /* eslint-disable import/order */
7
- var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
8
7
  var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
8
+ var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
9
9
  var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
10
10
  var UIColor_json_1 = __importDefault(require("./UIColor.json"));
11
11
  var colorSet = {
12
- PaletteColor_Dark: PaletteColor_Dark_json_1.default,
13
12
  PaletteColor_light: PaletteColor_light_json_1.default,
13
+ PaletteColor_Dark: PaletteColor_Dark_json_1.default,
14
14
  SemanticColor: SemanticColor_json_1.default,
15
15
  UIColor: UIColor_json_1.default
16
16
  };
package/dist/src/common/styles/colorSet/ui-type.d.ts CHANGED
@@ -541,4 +541,5 @@ export interface UITheme {
541
541
  ui_cpnt_list_chatbubble_text_my_color: string;
542
542
  ui_cpnt_list_chatbubble_base_area_seller: string;
543
543
  ui_cpnt_list_chatbubble_text_seller: string;
544
+ ui_52: string;
544
545
  }
package/dist/src/desktop/components/AdminList/AdminList.js CHANGED
@@ -236,6 +236,6 @@ var S_ScrollBox = styled_components_1.default.div(templateObject_4 || (templateO
236
236
  }
237
237
  }
238
238
  });
239
- var S_EmptyTextWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n padding-top: 88px;\n"], ["\n padding-top: 88px;\n"])));
239
+ var S_EmptyTextWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n padding-top: 88px;\n padding-bottom: 88px;\n"], ["\n padding-top: 88px;\n padding-bottom: 88px;\n"])));
240
240
  exports.default = AdminList;
241
241
  var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
package/dist/src/desktop/components/ChatBubbleListItem/ChatBubbleListItem.js CHANGED
@@ -85,7 +85,7 @@ function ChatBubbleListItem(_a) {
85
85
  return (react_1.default.createElement(react_1.default.Fragment, null,
86
86
  react_1.default.createElement(S_ChatBubbleListItem, { isMy: isMy, imageMode: imageMode },
87
87
  imageMode === 'use' && (react_1.default.createElement(react_1.default.Fragment, null, isTail && !isMy ? (react_1.default.createElement(S_ImageViewWrapper, { isSeller: isSeller },
88
- react_1.default.createElement(hybrid_1.ImageView, { shapeType: "circular", ratio: "1_1", scaleType: "cover", src: imageSrc, width: 40 }))) : (react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_g", spacingType: "width" })))),
88
+ react_1.default.createElement(hybrid_1.ImageView, { shapeType: "circular", ratio: "1_1", scaleType: "cover", src: imageSrc, width: isSeller ? 36 : 38 }))) : (react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_g", spacingType: "width" })))),
89
89
  react_1.default.createElement(S_RightBox, null,
90
90
  isTail && !isMy && (react_1.default.createElement(react_1.default.Fragment, null,
91
91
  react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, styleTheme: "caption1Bold", colorTheme: isSeller ? 'usrTextBrandPrimary' : 'sysTextPrimary' }),
@@ -120,15 +120,15 @@ var S_ChatBubbleListItem = styled_components_1.default.div(templateObject_3 || (
120
120
  var imageMode = _a.imageMode;
121
121
  return imageMode === 'none' && NoImageChatBubbleListItem;
122
122
  });
123
- var ImageViewSeller = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n box-shadow: 0 0 0 2px ", " inset;\n"], ["\n box-shadow: 0 0 0 2px ", " inset;\n"])), function (_a) {
123
+ var ImageViewSeller = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border: 2px solid ", ";\n"], ["\n border: 2px solid ", ";\n"])), function (_a) {
124
124
  var theme = _a.theme;
125
125
  return theme.ui_profile_image_border_brandprimary;
126
126
  });
127
- var ImageViewDefault = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n box-shadow: 0 0 0 1px ", " inset;\n"], ["\n box-shadow: 0 0 0 1px ", " inset;\n"])), function (_a) {
127
+ var ImageViewDefault = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n border: 1px solid ", ";\n"], ["\n border: 1px solid ", ";\n"])), function (_a) {
128
128
  var theme = _a.theme;
129
129
  return theme.ui_profile_image_border;
130
130
  });
131
- var S_ImageViewWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n border-radius: 50%;\n height: fit-content;\n min-width: fit-content;\n width: fit-content;\n margin-right: ", ";\n position: relative;\n\n &::after {\n content: '';\n box-sizing: border-box;\n border-radius: 50%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n ", ";\n }\n"], ["\n border-radius: 50%;\n height: fit-content;\n min-width: fit-content;\n width: fit-content;\n margin-right: ", ";\n position: relative;\n\n &::after {\n content: '';\n box-sizing: border-box;\n border-radius: 50%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n ", ";\n }\n"])), function (_a) {
131
+ var S_ImageViewWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n box-sizing: border-box;\n border-radius: 50%;\n height: fit-content;\n min-width: fit-content;\n width: fit-content;\n margin-right: ", ";\n position: relative;\n\n ", ";\n"], ["\n box-sizing: border-box;\n border-radius: 50%;\n height: fit-content;\n min-width: fit-content;\n width: fit-content;\n margin-right: ", ";\n position: relative;\n\n ", ";\n"])), function (_a) {
132
132
  var theme = _a.theme;
133
133
  return theme.spacing.spacingB;
134
134
  }, function (_a) {
package/dist/src/desktop/components/DesktopTabBar/DesktopTabBar.js CHANGED
@@ -35,6 +35,7 @@ function DesktopTabBar(_a) {
35
35
  var history = (0, react_router_dom_1.useHistory)();
36
36
  var pathname = (0, react_router_dom_1.useLocation)().pathname;
37
37
  if (itemArray) {
38
+ var isSubTabBarActivated = itemArray.some(function (item) { return item.isActive && item.subArray; });
38
39
  var handelClickTabItem_1 = function (item, e) {
39
40
  if (item.onClick) {
40
41
  item.onClick(e);
@@ -51,13 +52,14 @@ function DesktopTabBar(_a) {
51
52
  return (react_1.default.createElement(TextLabel_1.TextLabel, { text: item.title, textAlign: "center", styleTheme: item.isActive ? 'caption1Bold' : 'caption1Regular', colorTheme: item.isActive ? 'usrTextBrandPrimary' : 'sysTextSecondary', singleLineMode: "use" }));
52
53
  }
53
54
  };
54
- return (react_1.default.createElement(S_TabBox, null,
55
- itemArray.map(function (item, index) { return (react_1.default.createElement(S_TabWrapper, { key: index, isActive: item.isActive, styleTheme: styleTheme },
56
- react_1.default.createElement(S_TitleWrapper, { text: item.title, onClick: function (e) { return handelClickTabItem_1(item, e); } }, textLabel_1(item, false)),
57
- item.isActive && item.subArray && (react_1.default.createElement(S_SubTabBox, null, item.subArray.map(function (subItem) { return (react_1.default.createElement(S_SubWrapper, { key: subItem.title, text: subItem.title, onClick: function (e) { return handelClickTabItem_1(subItem, e); } }, textLabel_1(subItem, true))); }))))); }),
58
- itemArray.map(function (item) { return item.isActive && item.subArray && react_1.default.createElement(S_SubBackground, { key: item.title }); })));
55
+ return (react_1.default.createElement(S_TabBarBox, null,
56
+ react_1.default.createElement(S_MainTabBarSpace, null, itemArray.map(function (item) { return (react_1.default.createElement(S_MainTabItemBox, { key: item.title },
57
+ react_1.default.createElement(S_MainTabItemWrapper, { text: item.title, styleTheme: styleTheme, isActive: item.isActive, onClick: function (e) { return handelClickTabItem_1(item, e); } }, textLabel_1(item, false)),
58
+ item.isActive && item.subArray && (react_1.default.createElement(S_SubTabBarWrapper, null, item.subArray.map(function (subItem) { return (react_1.default.createElement(S_SubTabItemWrapper, { key: subItem.title, text: subItem.title, onClick: function (e) { return handelClickTabItem_1(subItem, e); } }, textLabel_1(subItem, true))); }))))); })),
59
+ isSubTabBarActivated && react_1.default.createElement(S_SubTabBarSpace, null)));
59
60
  }
60
61
  if (textArray) {
62
+ var isSubTabBarActivated = textArray.some(function (item) { return pathname.includes(item.path) && item.subArray; });
61
63
  var handleClick_1 = function (value) {
62
64
  if (value) {
63
65
  history.push(value.path);
@@ -74,24 +76,26 @@ function DesktopTabBar(_a) {
74
76
  return (react_1.default.createElement(TextLabel_1.TextLabel, { text: item.title, textAlign: "center", styleTheme: pathname.includes(item.path) ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname.includes(item.path) ? 'usrTextBrandPrimary' : 'sysTextSecondary', singleLineMode: "use" }));
75
77
  }
76
78
  };
77
- return (react_1.default.createElement(S_TabBox, null,
78
- textArray.map(function (item) { return (react_1.default.createElement(S_TabWrapper, { key: item.path, isActive: pathname.includes(item.path), styleTheme: styleTheme },
79
- react_1.default.createElement(S_TitleWrapper, { text: item.title, onClick: function () {
80
- handleClick_1(item);
81
- } }, textLabel_2(item, false)),
82
- item.subArray && pathname.includes(item.path) && (react_1.default.createElement(S_SubTabBox, null, item.subArray.map(function (subItem) { return (react_1.default.createElement(S_SubWrapper, { key: subItem.path, text: subItem.title, onClick: function () {
83
- handleClick_1(subItem);
84
- } }, textLabel_2(subItem, true))); }))))); }),
85
- textArray.map(function (item) {
86
- return item.subArray && pathname.includes(item.path) && react_1.default.createElement(S_SubBackground, { key: item.path });
87
- })));
79
+ return (react_1.default.createElement(S_TabBarBox, null,
80
+ react_1.default.createElement(S_MainTabBarSpace, null, textArray.map(function (item) { return (react_1.default.createElement(S_MainTabItemBox, { key: item.path },
81
+ react_1.default.createElement(S_MainTabItemWrapper, { isActive: pathname.includes(item.path), styleTheme: styleTheme, text: item.title, onClick: function () { return handleClick_1(item); } }, textLabel_2(item, false)),
82
+ pathname.includes(item.path) && item.subArray && (react_1.default.createElement(S_SubTabBarWrapper, null, item.subArray.map(function (subItem) { return (react_1.default.createElement(S_SubTabItemWrapper, { key: subItem.title, text: subItem.title, onClick: function () { return handleClick_1(subItem); } }, textLabel_2(subItem, true))); }))))); })),
83
+ isSubTabBarActivated && react_1.default.createElement(S_SubTabBarSpace, null)));
88
84
  }
89
85
  return react_1.default.createElement(react_1.default.Fragment, null);
90
86
  }
91
- var mediumStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: flex-end;\n box-sizing: border-box;\n justify-content: center;\n display: flex;\n margin-right: ", ";\n position: relative;\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: flex-end;\n box-sizing: border-box;\n justify-content: center;\n display: flex;\n margin-right: ", ";\n position: relative;\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) {
87
+ var S_TabBarBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
88
+ var S_MainTabBarSpace = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n padding-left: ", ";\n height: 40px;\n"], ["\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n padding-left: ", ";\n height: 40px;\n"])), function (_a) {
92
89
  var theme = _a.theme;
93
- return theme.spacing.spacingD;
90
+ return theme.ui_cpnt_tabbar_base_area;
91
+ }, function (_a) {
92
+ var theme = _a.theme;
93
+ return theme.ui_cpnt_divider;
94
94
  }, function (_a) {
95
+ var theme = _a.theme;
96
+ return theme.spacing.spacingE;
97
+ });
98
+ var tabIndicator = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n &::after {\n background-color: ", ";\n bottom: -1px;\n left: 0px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n ", ";\n }\n"], ["\n &::after {\n background-color: ", ";\n bottom: -1px;\n left: 0px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n ", ";\n }\n"])), function (_a) {
95
99
  var theme = _a.theme, styleTheme = _a.styleTheme;
96
100
  return styleTheme === 'content'
97
101
  ? theme.ui_cpnt_tabbar_border_active_indicator
@@ -101,51 +105,41 @@ var mediumStyle = (0, styled_components_1.css)(templateObject_1 || (templateObje
101
105
  return !isActive && "display: none;";
102
106
  });
103
107
  // NOTE: Tab item 활성화 시 text에 bold가 적용되는데, 이때 font-family에 따라 text 영역의 너비가 변경되어 시각적 변동을 일으키는 문제를 해결하기 위한 처리입니다.
104
- var textOffset = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: block;\n content: ", ";\n height: 0;\n overflow: hidden;\n visibility: hidden;\n"], ["\n display: block;\n content: ", ";\n height: 0;\n overflow: hidden;\n visibility: hidden;\n"])), function (_a) {
105
- var text = _a.text;
106
- return "'" + text + "'";
107
- });
108
- var S_TabWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n position: relative;\n ", "\n"], ["\n position: relative;\n ", "\n"])), mediumStyle);
109
- var S_TitleWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n cursor: pointer;\n padding: 0 ", ";\n padding-bottom: ", ";\n\n & > div::before {\n font-weight: ", ";\n ", "\n }\n\n & > div::after {\n font-weight: ", ";\n ", "\n }\n"], ["\n cursor: pointer;\n padding: 0 ", ";\n padding-bottom: ", ";\n\n & > div::before {\n font-weight: ", ";\n ", "\n }\n\n & > div::after {\n font-weight: ", ";\n ", "\n }\n"])), function (_a) {
108
+ var textOffset = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n & > div::before {\n font-weight: ", ";\n display: block;\n content: ", ";\n height: 0;\n overflow: hidden;\n visibility: hidden;\n }\n\n & > div::after {\n font-weight: ", ";\n display: block;\n content: ", ";\n height: 0;\n overflow: hidden;\n visibility: hidden;\n }\n"], ["\n & > div::before {\n font-weight: ", ";\n display: block;\n content: ", ";\n height: 0;\n overflow: hidden;\n visibility: hidden;\n }\n\n & > div::after {\n font-weight: ", ";\n display: block;\n content: ", ";\n height: 0;\n overflow: hidden;\n visibility: hidden;\n }\n"])), function (_a) {
110
109
  var theme = _a.theme;
111
- return theme.spacing.spacingA;
110
+ return theme.fontWeight.normal;
112
111
  }, function (_a) {
113
- var theme = _a.theme;
114
- return theme.spacing.spacingB;
112
+ var text = _a.text;
113
+ return "'" + text + "'";
115
114
  }, function (_a) {
116
- var theme = _a.theme;
117
- return theme.fontWeight.normal;
118
- }, textOffset, function (_a) {
119
115
  var theme = _a.theme;
120
116
  return theme.fontWeight.bold;
121
- }, textOffset);
122
- var S_TabBox = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n padding-left: ", ";\n position: relative;\n height: 40px;\n"], ["\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n padding-left: ", ";\n position: relative;\n height: 40px;\n"])), function (_a) {
123
- var theme = _a.theme;
124
- return theme.ui_cpnt_tabbar_base_area;
125
117
  }, function (_a) {
118
+ var text = _a.text;
119
+ return "'" + text + "'";
120
+ });
121
+ var S_MainTabItemBox = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n margin-right: ", ";\n position: relative;\n\n &:last-child {\n margin-right: 0;\n }\n"], ["\n margin-right: ", ";\n position: relative;\n\n &:last-child {\n margin-right: 0;\n }\n"])), function (_a) {
126
122
  var theme = _a.theme;
127
- return theme.ui_cpnt_divider;
123
+ return theme.spacing.spacingD;
124
+ });
125
+ var S_MainTabItemWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n align-items: flex-end;\n display: flex;\n height: 100%;\n box-sizing: border-box;\n padding: 0 ", ";\n padding-bottom: ", ";\n cursor: pointer;\n\n ", "\n ", "\n"], ["\n align-items: flex-end;\n display: flex;\n height: 100%;\n box-sizing: border-box;\n padding: 0 ", ";\n padding-bottom: ", ";\n cursor: pointer;\n\n ", "\n ", "\n"])), function (_a) {
126
+ var theme = _a.theme;
127
+ return theme.spacing.spacingA;
128
128
  }, function (_a) {
129
129
  var theme = _a.theme;
130
- return theme.spacing.spacingE;
131
- });
132
- var S_SubBackground = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n width: 100%;\n height: 32px;\n background-color: ", ";\n position: absolute;\n bottom: -33px;\n left: 0px;\n"], ["\n width: 100%;\n height: 32px;\n background-color: ", ";\n position: absolute;\n bottom: -33px;\n left: 0px;\n"])), function (_a) {
130
+ return theme.spacing.spacingB;
131
+ }, tabIndicator, textOffset);
132
+ var S_SubTabBarWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n width: max-content;\n position: absolute;\n bottom: -33px;\n left: 0px;\n height: 32px;\n display: flex;\n"], ["\n width: max-content;\n position: absolute;\n bottom: -33px;\n left: 0px;\n height: 32px;\n display: flex;\n"])));
133
+ var S_SubTabBarSpace = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n height: 32px;\n background-color: ", ";\n"], ["\n height: 32px;\n background-color: ", ";\n"])), function (_a) {
133
134
  var theme = _a.theme;
134
135
  return theme.ui_cpnt_tabbar_base_area_sub;
135
136
  });
136
- var S_SubTabBox = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n width: 100vw;\n position: absolute;\n bottom: -33px;\n left: 0px;\n height: 32px;\n display: flex;\n z-index: 1;\n"], ["\n width: 100vw;\n position: absolute;\n bottom: -33px;\n left: 0px;\n height: 32px;\n display: flex;\n z-index: 1;\n"])));
137
- var S_SubWrapper = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n margin-right: ", ";\n position: relative;\n padding: 0 ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n & > div::before {\n font-weight: ", ";\n ", "\n }\n\n & > div::after {\n font-weight: ", ";\n ", "\n }\n"], ["\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n margin-right: ", ";\n position: relative;\n padding: 0 ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n & > div::before {\n font-weight: ", ";\n ", "\n }\n\n & > div::after {\n font-weight: ", ";\n ", "\n }\n"])), function (_a) {
137
+ var S_SubTabItemWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n margin-right: ", ";\n padding: 0 ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n ", "\n"], ["\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n margin-right: ", ";\n padding: 0 ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n ", "\n"])), function (_a) {
138
138
  var theme = _a.theme;
139
139
  return theme.spacing.spacingE;
140
140
  }, function (_a) {
141
141
  var theme = _a.theme;
142
142
  return theme.spacing.spacingA;
143
- }, function (_a) {
144
- var theme = _a.theme;
145
- return theme.fontWeight.normal;
146
- }, textOffset, function (_a) {
147
- var theme = _a.theme;
148
- return theme.fontWeight.bold;
149
143
  }, textOffset);
150
144
  exports.default = DesktopTabBar;
151
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
145
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
package/dist/src/desktop/components/Dropdown/Dropdown.js CHANGED
@@ -48,7 +48,7 @@ function Dropdown(_a) {
48
48
  setSelectedValue(null);
49
49
  return;
50
50
  }
51
- if (value) {
51
+ if (value !== undefined) {
52
52
  setSelectedValue(value);
53
53
  }
54
54
  }, [value]);
@@ -76,7 +76,7 @@ function Dropdown(_a) {
76
76
  };
77
77
  var handleClickOption = function (option) {
78
78
  setIsFocused(false);
79
- if (!value) {
79
+ if (value === undefined) {
80
80
  setSelectedValue(option);
81
81
  }
82
82
  if (onChange) {
package/dist/src/desktop/components/FilterBar/FilterBar.js CHANGED
@@ -18,7 +18,7 @@ function FilterBar(_a) {
18
18
  return textArray.map(function (option) {
19
19
  var _a;
20
20
  return (react_1.default.createElement(S_ChipWrapper, { key: option.value },
21
- react_1.default.createElement(Chip_1.Chip, { displayType: "filter_single", text: option.text, value: (value === null || value === void 0 ? void 0 : value.value) || undefined, id: option.value, onClickChip: function () { return onClickChip && onClickChip(option); }, activeChipId: activeChipId, chipId: (_a = option.value) === null || _a === void 0 ? void 0 : _a.toString() })));
21
+ react_1.default.createElement(Chip_1.Chip, { displayType: "filter_single", text: option.text, value: value === null || value === void 0 ? void 0 : value.value, id: option.value, onClickChip: function () { return onClickChip && onClickChip(option); }, activeChipId: activeChipId, chipId: (_a = option.value) === null || _a === void 0 ? void 0 : _a.toString() })));
22
22
  });
23
23
  }
24
24
  };
package/dist/src/mobile/components/ChatBubbleListItem/ChatBubbleListItem.js CHANGED
@@ -85,7 +85,7 @@ function ChatBubbleListItem(_a) {
85
85
  return (react_1.default.createElement(react_1.default.Fragment, null,
86
86
  react_1.default.createElement(S_ChatBubbleListItem, { isMy: isMy, imageMode: imageMode },
87
87
  imageMode === 'use' && (react_1.default.createElement(react_1.default.Fragment, null, isTail && !isMy ? (react_1.default.createElement(S_ImageViewWrapper, { isSeller: isSeller },
88
- react_1.default.createElement(hybrid_1.ImageView, { shapeType: "circular", ratio: "1_1", scaleType: "cover", src: imageSrc, width: 40 }))) : (react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_g", spacingType: "width" })))),
88
+ react_1.default.createElement(hybrid_1.ImageView, { shapeType: "circular", ratio: "1_1", scaleType: "cover", src: imageSrc, width: isSeller ? 36 : 38 }))) : (react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_g", spacingType: "width" })))),
89
89
  react_1.default.createElement(S_RightBox, null,
90
90
  isTail && !isMy && (react_1.default.createElement(react_1.default.Fragment, null,
91
91
  react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, styleTheme: "caption1Bold", colorTheme: isSeller ? 'usrTextBrandPrimary' : 'sysTextPrimary' }),
@@ -120,15 +120,15 @@ var S_ChatBubbleListItem = styled_components_1.default.div(templateObject_3 || (
120
120
  var imageMode = _a.imageMode;
121
121
  return imageMode === 'none' && NoImageChatBubbleListItem;
122
122
  });
123
- var ImageViewSeller = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n box-shadow: 0 0 0 2px ", " inset;\n"], ["\n box-shadow: 0 0 0 2px ", " inset;\n"])), function (_a) {
123
+ var ImageViewSeller = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border: 2px solid ", ";\n"], ["\n border: 2px solid ", ";\n"])), function (_a) {
124
124
  var theme = _a.theme;
125
125
  return theme.ui_profile_image_border_brandprimary;
126
126
  });
127
- var ImageViewDefault = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n box-shadow: 0 0 0 1px ", " inset;\n"], ["\n box-shadow: 0 0 0 1px ", " inset;\n"])), function (_a) {
127
+ var ImageViewDefault = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n border: 1px solid ", ";\n"], ["\n border: 1px solid ", ";\n"])), function (_a) {
128
128
  var theme = _a.theme;
129
129
  return theme.ui_profile_image_border;
130
130
  });
131
- var S_ImageViewWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n border-radius: 50%;\n height: fit-content;\n min-width: fit-content;\n width: fit-content;\n margin-right: ", ";\n position: relative;\n\n &::after {\n content: '';\n box-sizing: border-box;\n border-radius: 50%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n ", ";\n }\n"], ["\n border-radius: 50%;\n height: fit-content;\n min-width: fit-content;\n width: fit-content;\n margin-right: ", ";\n position: relative;\n\n &::after {\n content: '';\n box-sizing: border-box;\n border-radius: 50%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n ", ";\n }\n"])), function (_a) {
131
+ var S_ImageViewWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n box-sizing: border-box;\n border-radius: 50%;\n height: fit-content;\n min-width: fit-content;\n width: fit-content;\n margin-right: ", ";\n position: relative;\n\n ", ";\n"], ["\n box-sizing: border-box;\n border-radius: 50%;\n height: fit-content;\n min-width: fit-content;\n width: fit-content;\n margin-right: ", ";\n position: relative;\n\n ", ";\n"])), function (_a) {
132
132
  var theme = _a.theme;
133
133
  return theme.spacing.spacingB;
134
134
  }, function (_a) {
package/dist/src/mobile/components/Dropdown/Dropdown.js CHANGED
@@ -48,7 +48,7 @@ function Dropdown(_a) {
48
48
  setSelectedValue(null);
49
49
  return;
50
50
  }
51
- if (value) {
51
+ if (value !== undefined) {
52
52
  setSelectedValue(value);
53
53
  }
54
54
  }, [value]);
@@ -76,7 +76,7 @@ function Dropdown(_a) {
76
76
  };
77
77
  var handleClickOption = function (option) {
78
78
  setIsFocused(false);
79
- if (!value) {
79
+ if (value === undefined) {
80
80
  setSelectedValue(option);
81
81
  }
82
82
  if (onChange) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.4.44",
3
+ "version": "1.4.47",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,8 +1,14 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.4.44]
2
+ ## [v1.4.47]
3
3
 
4
4
  ### Component
5
- * ChatList
6
- * body부분의 스크롤 이슈 수정
7
- * Dropdown
8
- * value를 null로 설정할 시 dropdown을 초기화하는 로직을 useEffect 내부에 추가
5
+ * AdminList
6
+ * emptyText가 보일때 하단에 spacing 추가
7
+ * ChatBubbleListItem
8
+ * 이미지 부분 border 깨져보이는 부분 수정
9
+ * Icon
10
+ * ic_home line추가
11
+ * ic_post_paper_plane line추가
12
+
13
+ ### Color
14
+ * 컬러 키 값 22.08.30 18시 08분 기준 싱크