pds-dev-kit-web 2.2.79 → 2.2.80
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.
|
@@ -4,9 +4,10 @@ type TextObj = {
|
|
|
4
4
|
path: string;
|
|
5
5
|
title: PDSTextType;
|
|
6
6
|
};
|
|
7
|
+
type StyleTheme = 'main' | 'content';
|
|
7
8
|
type UserDesktopTabBarProps = {
|
|
8
9
|
itemArray?: PDSTabItemOption[];
|
|
9
|
-
styleTheme?:
|
|
10
|
+
styleTheme?: StyleTheme;
|
|
10
11
|
/** @deprecated v1.5 해당 필드 대신 itemArray를 사용하세요. */
|
|
11
12
|
textArray?: TextObj[];
|
|
12
13
|
};
|
|
@@ -52,7 +52,7 @@ function UserDesktopTabBar(_a) {
|
|
|
52
52
|
item.onClick(e);
|
|
53
53
|
}
|
|
54
54
|
};
|
|
55
|
-
return ((0, jsx_runtime_1.jsx)(S_TabBar, __assign({ "x-pds-name": "UserDesktopTabBar", "x-pds-element-type": "component", "x-pds-device-type": "desktop" }, { children: itemArray.map(function (item, index) {
|
|
55
|
+
return ((0, jsx_runtime_1.jsx)(S_TabBar, __assign({ "x-pds-name": "UserDesktopTabBar", "x-pds-element-type": "component", "x-pds-device-type": "desktop", styleTheme: styleTheme }, { children: itemArray.map(function (item, index) {
|
|
56
56
|
if (styleTheme === 'content') {
|
|
57
57
|
return ((0, jsx_runtime_1.jsx)(S_TabWrapper, __assign({ isActive: item.isActive, styleTheme: "content", text: item.title, onClick: function (e) { return handleClickTabItem_1(item, e); } }, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: item.title, textAlign: "center", styleTheme: "headingBold", colorTheme: item.isActive ? 'sysTextPrimary' : 'sysTextSecondary', singleLineMode: "use" }) }), index));
|
|
58
58
|
}
|
|
@@ -65,7 +65,7 @@ function UserDesktopTabBar(_a) {
|
|
|
65
65
|
history.push(value.path);
|
|
66
66
|
}
|
|
67
67
|
};
|
|
68
|
-
return ((0, jsx_runtime_1.jsx)(S_TabBar, __assign({ "x-pds-name": "UserDesktopTabBar", "x-pds-element-type": "component", "x-pds-device-type": "desktop" }, { children: textArray.map(function (item) { return ((0, jsx_runtime_1.jsx)(S_TabWrapper, __assign({ styleTheme: styleTheme, isActive: pathname === item.path, onClick: function () {
|
|
68
|
+
return ((0, jsx_runtime_1.jsx)(S_TabBar, __assign({ "x-pds-name": "UserDesktopTabBar", "x-pds-element-type": "component", "x-pds-device-type": "desktop", styleTheme: styleTheme }, { children: textArray.map(function (item) { return ((0, jsx_runtime_1.jsx)(S_TabWrapper, __assign({ styleTheme: styleTheme, isActive: pathname === item.path, onClick: function () {
|
|
69
69
|
handleClick_1(item);
|
|
70
70
|
} }, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: item.title, styleTheme: pathname === item.path ? 'body2Bold' : 'body2Regular', colorTheme: pathname === item.path ? 'usrTextBrandPrimary' : 'sysTextSecondary', singleLineMode: "use" }) }), item.path)); }) })));
|
|
71
71
|
}
|
|
@@ -119,12 +119,20 @@ var contentStyle = (0, styled_components_1.css)(templateObject_4 || (templateObj
|
|
|
119
119
|
var isActive = _a.isActive;
|
|
120
120
|
return !isActive && "display: none;";
|
|
121
121
|
});
|
|
122
|
-
var S_TabBar = 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 height:
|
|
122
|
+
var S_TabBar = 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 height: ", ";\n justify-content: center;\n"], ["\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n height: ", ";\n justify-content: center;\n"])), function (_a) {
|
|
123
123
|
var theme = _a.theme;
|
|
124
124
|
return theme.ui_cpnt_tabbar_base_area;
|
|
125
125
|
}, function (_a) {
|
|
126
126
|
var theme = _a.theme;
|
|
127
127
|
return theme.ui_cpnt_divider;
|
|
128
|
+
}, function (_a) {
|
|
129
|
+
var styleTheme = _a.styleTheme;
|
|
130
|
+
switch (styleTheme) {
|
|
131
|
+
case 'content':
|
|
132
|
+
return '64px';
|
|
133
|
+
default:
|
|
134
|
+
return '48px';
|
|
135
|
+
}
|
|
128
136
|
});
|
|
129
137
|
exports.default = UserDesktopTabBar;
|
|
130
138
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
|
package/package.json
CHANGED
package/release-note.md
CHANGED