pds-dev-kit-web 0.5.15 → 0.5.16

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 (16) hide show
  1. package/dist/index.d.ts +2 -2
  2. package/dist/index.js +2 -2
  3. package/dist/src/common/styles/ui-colors.js +1 -1
  4. package/dist/src/desktop/components/DesktopTabBar/DesktopTabBar.js +17 -40
  5. package/dist/src/desktop/components/DesktopTabBar/index.d.ts +1 -1
  6. package/dist/src/desktop/components/DesktopTabBar/index.js +2 -2
  7. package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.d.ts +2 -1
  8. package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js +4 -1
  9. package/dist/src/desktop/components/UserDesktopTabBar/UserDesktopTabBar.js +11 -7
  10. package/dist/src/desktop/components/index.d.ts +2 -2
  11. package/dist/src/desktop/components/index.js +2 -2
  12. package/dist/src/desktop/index.d.ts +2 -2
  13. package/dist/src/desktop/index.js +2 -2
  14. package/dist/src/hybrid/components/Switch/Switch.js +1 -1
  15. package/dist/src/mobile/components/MobileTabBar/MobileTabBar.js +11 -7
  16. package/package.json +1 -1
package/dist/index.d.ts CHANGED
@@ -5,11 +5,11 @@ export { theme };
5
5
  export { Form };
6
6
  import { Divider, Icon, ImageView, Spacing, Switch } from './src/hybrid';
7
7
  export { Divider, Icon, ImageView, Spacing, Switch };
8
- import { LayoutWF, WFContainersBox, LayoutWS, WSGlobalMenuContainer, WSContainersBox, LayoutWT, WTGlobalMenuContainer, WTContainersBox, D_Card, D_CardList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopHeaderBar, D_DesktopTapBar, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_IconButton, D_ImageSlide, D_MainButton, D_Radio, D_ReactionButton, D_Select, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar } from './src/desktop';
8
+ import { LayoutWF, WFContainersBox, LayoutWS, WSGlobalMenuContainer, WSContainersBox, LayoutWT, WTGlobalMenuContainer, WTContainersBox, D_Card, D_CardList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopHeaderBar, D_DesktopTabBar, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_IconButton, D_ImageSlide, D_MainButton, D_Radio, D_ReactionButton, D_Select, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar } from './src/desktop';
9
9
  export { LayoutWF, WFContainersBox };
10
10
  export { LayoutWS, WSGlobalMenuContainer, WSContainersBox };
11
11
  export { LayoutWT, WTGlobalMenuContainer, WTContainersBox };
12
- export { D_Card, D_CardList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopHeaderBar, D_DesktopTapBar, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_IconButton, D_ImageSlide, D_MainButton, D_Radio, D_ReactionButton, D_Select, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar };
12
+ export { D_Card, D_CardList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopHeaderBar, D_DesktopTabBar, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_IconButton, D_ImageSlide, D_MainButton, D_Radio, D_ReactionButton, D_Select, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar };
13
13
  import { LayoutMF, MFContainersBox, LayoutMM, MMNavigationContainer, MMContainersBox, LayoutMP, MPNavigationContainer, MPTabContainer, MPContainersBox, LayoutMS, MSNavigationContainer, MSContainersBox, M_BlogTextField, M_Card, M_CardList, M_Checkbox, M_Chip, M_ContextMenu, M_ContextMenuItem, M_IconButton, M_ImageSlide, M_MainButton, M_MobileHeaderBar, M_MobileTabBar, M_Radio, M_ReactionButton, M_Select, M_StatusBlock, M_TextButton, M_TextField, M_TextLabel, M_UploadIconButton, M_UploadMainButton, M_UploadTextButton } from './src/mobile';
14
14
  export { LayoutMF, MFContainersBox };
15
15
  export { LayoutMM, MMNavigationContainer, MMContainersBox };
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_TextLabel = exports.D_TextField = exports.D_TextButton = exports.D_StatusBlock = exports.D_Select = exports.D_ReactionButton = exports.D_Radio = exports.D_MainButton = exports.D_ImageSlide = exports.D_IconButton = exports.D_Hero = exports.D_FloatingActionButton = exports.D_FilterBar = exports.D_EditApplyTextField = exports.D_DesktopTapBar = exports.D_DesktopHeaderBar = exports.D_ContextMenuItem = exports.D_ContextMenu = exports.D_Chip = exports.D_Checkbox = exports.D_CardList = exports.D_Card = exports.WTContainersBox = exports.WTGlobalMenuContainer = exports.LayoutWT = exports.WSContainersBox = exports.WSGlobalMenuContainer = exports.LayoutWS = exports.WFContainersBox = exports.LayoutWF = exports.Switch = exports.Spacing = exports.ImageView = exports.Icon = exports.Divider = exports.Form = exports.theme = exports.uiColors = exports.spacing = exports.boxShadow = exports.mobileLineHeight = exports.mobileFontSize = exports.desktopLineHeight = exports.desktopFontSize = exports.fontWeight = void 0;
3
+ exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_TextLabel = exports.D_TextField = exports.D_TextButton = exports.D_StatusBlock = exports.D_Select = exports.D_ReactionButton = exports.D_Radio = exports.D_MainButton = exports.D_ImageSlide = exports.D_IconButton = exports.D_Hero = exports.D_FloatingActionButton = exports.D_FilterBar = exports.D_EditApplyTextField = exports.D_DesktopTabBar = exports.D_DesktopHeaderBar = exports.D_ContextMenuItem = exports.D_ContextMenu = exports.D_Chip = exports.D_Checkbox = exports.D_CardList = exports.D_Card = exports.WTContainersBox = exports.WTGlobalMenuContainer = exports.LayoutWT = exports.WSContainersBox = exports.WSGlobalMenuContainer = exports.LayoutWS = exports.WFContainersBox = exports.LayoutWF = exports.Switch = exports.Spacing = exports.ImageView = exports.Icon = exports.Divider = exports.Form = exports.theme = exports.uiColors = exports.spacing = exports.boxShadow = exports.mobileLineHeight = exports.mobileFontSize = exports.desktopLineHeight = exports.desktopFontSize = exports.fontWeight = void 0;
4
4
  exports.M_UploadTextButton = exports.M_UploadMainButton = exports.M_UploadIconButton = exports.M_TextLabel = exports.M_TextField = exports.M_TextButton = exports.M_StatusBlock = exports.M_Select = exports.M_ReactionButton = exports.M_Radio = exports.M_MobileTabBar = exports.M_MobileHeaderBar = exports.M_MainButton = exports.M_ImageSlide = exports.M_IconButton = exports.M_ContextMenuItem = exports.M_ContextMenu = exports.M_Chip = exports.M_Checkbox = exports.M_CardList = exports.M_Card = exports.M_BlogTextField = exports.MSContainersBox = exports.MSNavigationContainer = exports.LayoutMS = exports.MPContainersBox = exports.MPTabContainer = exports.MPNavigationContainer = exports.LayoutMP = exports.MMContainersBox = exports.MMNavigationContainer = exports.LayoutMM = exports.MFContainersBox = exports.LayoutMF = void 0;
5
5
  /* eslint-disable import/order */
6
6
  /* eslint-disable import/first */
@@ -40,7 +40,7 @@ Object.defineProperty(exports, "D_Chip", { enumerable: true, get: function () {
40
40
  Object.defineProperty(exports, "D_ContextMenu", { enumerable: true, get: function () { return desktop_1.D_ContextMenu; } });
41
41
  Object.defineProperty(exports, "D_ContextMenuItem", { enumerable: true, get: function () { return desktop_1.D_ContextMenuItem; } });
42
42
  Object.defineProperty(exports, "D_DesktopHeaderBar", { enumerable: true, get: function () { return desktop_1.D_DesktopHeaderBar; } });
43
- Object.defineProperty(exports, "D_DesktopTapBar", { enumerable: true, get: function () { return desktop_1.D_DesktopTapBar; } });
43
+ Object.defineProperty(exports, "D_DesktopTabBar", { enumerable: true, get: function () { return desktop_1.D_DesktopTabBar; } });
44
44
  Object.defineProperty(exports, "D_EditApplyTextField", { enumerable: true, get: function () { return desktop_1.D_EditApplyTextField; } });
45
45
  Object.defineProperty(exports, "D_FilterBar", { enumerable: true, get: function () { return desktop_1.D_FilterBar; } });
46
46
  Object.defineProperty(exports, "D_FloatingActionButton", { enumerable: true, get: function () { return desktop_1.D_FloatingActionButton; } });
package/dist/src/common/styles/ui-colors.js CHANGED
@@ -27,7 +27,7 @@ function buildCascadedColors(lowLevel, highLevel, override) {
27
27
  // 서버로부터 해당 채널에서 커스텀으로 설정한 팔레트 가져오기
28
28
  // from server (원래는 비동기)
29
29
  var channelSettings = {
30
- tone: 'dark',
30
+ tone: 'light',
31
31
  customPalette: {
32
32
  usr_good_job: '#999999'
33
33
  }
package/dist/src/desktop/components/DesktopTabBar/DesktopTabBar.js CHANGED
@@ -29,7 +29,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
29
29
  var react_1 = __importDefault(require("react"));
30
30
  var react_router_dom_1 = require("react-router-dom");
31
31
  var styled_components_1 = __importStar(require("styled-components"));
32
- var hybrid_1 = require("../../../hybrid");
33
32
  var TextLabel_1 = require("../TextLabel");
34
33
  function DesktopTabBar(_a) {
35
34
  var textArray = _a.textArray, _b = _a.styleTheme, styleTheme = _b === void 0 ? 'main' : _b;
@@ -42,7 +41,7 @@ function DesktopTabBar(_a) {
42
41
  };
43
42
  var textLabel = function (value, isSubText) {
44
43
  if (isSubText) {
45
- return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', singleLineMode: "use" }));
44
+ return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', btnMode: "use" }));
46
45
  }
47
46
  if (styleTheme === 'content') {
48
47
  return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', singleLineMode: "use" }));
@@ -52,25 +51,15 @@ function DesktopTabBar(_a) {
52
51
  }
53
52
  };
54
53
  return (react_1.default.createElement(react_1.default.Fragment, null,
55
- react_1.default.createElement(S_TabBox, { styleTheme: styleTheme },
56
- textArray.map(function (value) { return (react_1.default.createElement(S_TabWrapper, { key: value.path, styleTheme: styleTheme, isActive: pathname.includes(value.path), onClick: function () {
54
+ react_1.default.createElement(S_TabBox, null,
55
+ textArray.map(function (value) { return (react_1.default.createElement(S_TabWrapper, { key: value.path, isActive: pathname.includes(value.path), onClick: function () {
57
56
  handleClick(value);
58
57
  } },
59
58
  textLabel(value, false),
60
59
  value.subArray && pathname.includes(value.path) && (react_1.default.createElement(S_SubTabBox, null, value.subArray.map(function (subValue) { return (react_1.default.createElement(S_SubWrapper, { key: subValue.path }, textLabel(subValue, true))); }))))); }),
61
- textArray.map(function (value) { return value.subArray && pathname.includes(value.path) && react_1.default.createElement(S_SubBackground, null); })),
62
- react_1.default.createElement(hybrid_1.Divider, { direction: "horizontal" })));
60
+ textArray.map(function (value) { return value.subArray && pathname.includes(value.path) && react_1.default.createElement(S_SubBackground, null); }))));
63
61
  }
64
- var S_TabWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n ", "\n"], ["\n position: relative;\n ", "\n"])), function (_a) {
65
- var styleTheme = _a.styleTheme;
66
- switch (styleTheme) {
67
- case 'content':
68
- return contentStyle;
69
- default:
70
- return mainStyle;
71
- }
72
- });
73
- var mainStyle = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: flex-end;\n justify-content: center;\n cursor: pointer;\n display: flex;\n height: 40px;\n margin-right: ", ";\n position: relative;\n padding: 0 ", ";\n padding-bottom: ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n background-color: ", ";\n border-bottom: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n }\n"], ["\n align-items: flex-end;\n justify-content: center;\n cursor: pointer;\n display: flex;\n height: 40px;\n margin-right: ", ";\n position: relative;\n padding: 0 ", ";\n padding-bottom: ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n background-color: ", ";\n border-bottom: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n }\n"])), function (_a) {
62
+ 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 cursor: pointer;\n display: flex;\n margin-right: ", ";\n position: relative;\n padding: 0 ", ";\n padding-bottom: ", ";\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 cursor: pointer;\n display: flex;\n margin-right: ", ";\n position: relative;\n padding: 0 ", ";\n padding-bottom: ", ";\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) {
74
63
  var theme = _a.theme;
75
64
  return theme.spacing.spacingD;
76
65
  }, function (_a) {
@@ -79,42 +68,30 @@ var mainStyle = (0, styled_components_1.css)(templateObject_2 || (templateObject
79
68
  }, function (_a) {
80
69
  var theme = _a.theme;
81
70
  return theme.spacing.spacingB;
82
- }, function (_a) {
83
- var isActive = _a.isActive, theme = _a.theme;
84
- return isActive && theme.ui_cpnt_tabbar_base_area;
85
- }, function (_a) {
86
- var isActive = _a.isActive, theme = _a.theme;
87
- return isActive && "2px solid " + theme.ui_cpnt_tabbar_border_active_indicator_primary;
88
- });
89
- var contentStyle = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: flex-end;\n justify-content: center;\n cursor: pointer;\n display: flex;\n height: 40px;\n margin-right: ", ";\n position: relative;\n padding: 0 ", ";\n padding-bottom: ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n background-color: ", ";\n border-bottom: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n }\n"], ["\n align-items: flex-end;\n justify-content: center;\n cursor: pointer;\n display: flex;\n height: 40px;\n margin-right: ", ";\n position: relative;\n padding: 0 ", ";\n padding-bottom: ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n background-color: ", ";\n border-bottom: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n }\n"])), function (_a) {
90
- var theme = _a.theme;
91
- return theme.spacing.spacingD;
92
71
  }, function (_a) {
93
72
  var theme = _a.theme;
94
- return theme.spacing.spacingA;
95
- }, function (_a) {
96
- var theme = _a.theme;
97
- return theme.spacing.spacingB;
73
+ return theme.ui_cpnt_tabbar_border_active_indicator_primary;
98
74
  }, function (_a) {
99
- var isActive = _a.isActive, theme = _a.theme;
100
- return isActive && theme.ui_cpnt_tabbar_base_area;
101
- }, function (_a) {
102
- var isActive = _a.isActive, theme = _a.theme;
103
- return isActive && "2px solid " + theme.ui_cpnt_tabbar_border_active_indicator;
75
+ var isActive = _a.isActive;
76
+ return !isActive && "display: none;";
104
77
  });
105
- var S_TabBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n padding-left: ", ";\n position: relative;\n"], ["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n padding-left: ", ";\n position: relative;\n"])), function (_a) {
78
+ var S_TabWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: relative;\n ", "\n"], ["\n position: relative;\n ", "\n"])), mediumStyle);
79
+ var S_TabBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __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) {
106
80
  var theme = _a.theme;
107
81
  return theme.ui_cpnt_tabbar_base_area;
82
+ }, function (_a) {
83
+ var theme = _a.theme;
84
+ return theme.ui_cpnt_divider;
108
85
  }, function (_a) {
109
86
  var theme = _a.theme;
110
87
  return theme.spacing.spacingE;
111
88
  });
112
- var S_SubBackground = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __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) {
89
+ var S_SubBackground = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __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) {
113
90
  var theme = _a.theme;
114
91
  return theme.ui_cpnt_tabbar_base_area_sub;
115
92
  });
116
- var S_SubTabBox = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __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"])));
117
- var S_SubWrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __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 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"])), function (_a) {
93
+ var S_SubTabBox = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __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"])));
94
+ var S_SubWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __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 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"])), function (_a) {
118
95
  var theme = _a.theme;
119
96
  return theme.spacing.spacingE;
120
97
  }, function (_a) {
@@ -122,4 +99,4 @@ var S_SubWrapper = styled_components_1.default.div(templateObject_7 || (template
122
99
  return theme.spacing.spacingA;
123
100
  });
124
101
  exports.default = DesktopTabBar;
125
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
102
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
package/dist/src/desktop/components/DesktopTabBar/index.d.ts CHANGED
@@ -1 +1 @@
1
- export { default as DesktopTapBar } from './DesktopTabBar';
1
+ export { default as DesktopTabBar } from './DesktopTabBar';
package/dist/src/desktop/components/DesktopTabBar/index.js CHANGED
@@ -3,6 +3,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.DesktopTapBar = void 0;
6
+ exports.DesktopTabBar = void 0;
7
7
  var DesktopTabBar_1 = require("./DesktopTabBar");
8
- Object.defineProperty(exports, "DesktopTapBar", { enumerable: true, get: function () { return __importDefault(DesktopTabBar_1).default; } });
8
+ Object.defineProperty(exports, "DesktopTabBar", { enumerable: true, get: function () { return __importDefault(DesktopTabBar_1).default; } });
package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.d.ts CHANGED
@@ -21,8 +21,9 @@ export declare type EditApplyTextFieldProps = {
21
21
  min?: number;
22
22
  onBlur?: (e: React.FocusEvent<HTMLInputElement> | React.FocusEvent<HTMLTextAreaElement>) => void;
23
23
  onChange?: (e: React.ChangeEvent<HTMLInputElement> | React.ChangeEvent<HTMLTextAreaElement>) => void;
24
+ onClickSubmitBtn?: (...args: any) => any;
24
25
  onFocus?: () => void;
25
26
  onTarget?: () => void;
26
27
  };
27
- declare function EditApplyTextField({ name, hintText, defaultText, validation, preventBlankMode, size, textLineType, multiRows, autoMinRows, autoMaxRows, inputType, state, max, maxLength, min, onBlur, onChange, onFocus, onTarget }: EditApplyTextFieldProps): JSX.Element;
28
+ declare function EditApplyTextField({ name, hintText, defaultText, validation, preventBlankMode, size, textLineType, multiRows, autoMinRows, autoMaxRows, inputType, state, max, maxLength, min, onBlur, onChange, onClickSubmitBtn, onFocus, onTarget }: EditApplyTextFieldProps): JSX.Element;
28
29
  export default EditApplyTextField;
package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js CHANGED
@@ -32,7 +32,7 @@ var components_1 = require("../../common/components");
32
32
  var IconButton_1 = require("../IconButton");
33
33
  function EditApplyTextField(_a) {
34
34
  var _b;
35
- var name = _a.name, hintText = _a.hintText, defaultText = _a.defaultText, validation = _a.validation, _c = _a.preventBlankMode, preventBlankMode = _c === void 0 ? 'none' : _c, _d = _a.size, size = _d === void 0 ? 'large' : _d, _e = _a.textLineType, textLineType = _e === void 0 ? 'single' : _e, _f = _a.multiRows, multiRows = _f === void 0 ? 8 : _f, _g = _a.autoMinRows, autoMinRows = _g === void 0 ? 8 : _g, autoMaxRows = _a.autoMaxRows, _h = _a.inputType, inputType = _h === void 0 ? 'text' : _h, _j = _a.state, state = _j === void 0 ? 'normal' : _j, max = _a.max, maxLength = _a.maxLength, min = _a.min, onBlur = _a.onBlur, onChange = _a.onChange, onFocus = _a.onFocus, onTarget = _a.onTarget;
35
+ var name = _a.name, hintText = _a.hintText, defaultText = _a.defaultText, validation = _a.validation, _c = _a.preventBlankMode, preventBlankMode = _c === void 0 ? 'none' : _c, _d = _a.size, size = _d === void 0 ? 'large' : _d, _e = _a.textLineType, textLineType = _e === void 0 ? 'single' : _e, _f = _a.multiRows, multiRows = _f === void 0 ? 8 : _f, _g = _a.autoMinRows, autoMinRows = _g === void 0 ? 8 : _g, autoMaxRows = _a.autoMaxRows, _h = _a.inputType, inputType = _h === void 0 ? 'text' : _h, _j = _a.state, state = _j === void 0 ? 'normal' : _j, max = _a.max, maxLength = _a.maxLength, min = _a.min, onBlur = _a.onBlur, onChange = _a.onChange, onClickSubmitBtn = _a.onClickSubmitBtn, onFocus = _a.onFocus, onTarget = _a.onTarget;
36
36
  var t = (0, react_i18next_1.useTranslation)('translation').t;
37
37
  var _k = (0, react_hook_form_1.useFormContext)(), register = _k.register, setValue = _k.setValue, trigger = _k.trigger, watch = _k.watch, errors = _k.formState.errors;
38
38
  var _l = (0, react_1.useState)(false), isFocused = _l[0], setIsFocused = _l[1];
@@ -93,6 +93,9 @@ function EditApplyTextField(_a) {
93
93
  setValue(name, currentValue);
94
94
  setPrevValue(currentValue);
95
95
  }
96
+ if (onClickSubmitBtn) {
97
+ onClickSubmitBtn();
98
+ }
96
99
  }
97
100
  var handleKeyUp = function (e) {
98
101
  if (textLineType === 'single' && e.key === 'Enter') {
package/dist/src/desktop/components/UserDesktopTabBar/UserDesktopTabBar.js CHANGED
@@ -29,7 +29,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
29
29
  var react_1 = __importDefault(require("react"));
30
30
  var react_router_dom_1 = require("react-router-dom");
31
31
  var styled_components_1 = __importStar(require("styled-components"));
32
- var hybrid_1 = require("../../../hybrid");
33
32
  var TextLabel_1 = require("../TextLabel");
34
33
  function UserDesktopTabBar(_a) {
35
34
  var textArray = _a.textArray, _b = _a.styleTheme, styleTheme = _b === void 0 ? 'main' : _b;
@@ -44,8 +43,7 @@ function UserDesktopTabBar(_a) {
44
43
  react_1.default.createElement(S_TabBar, null, textArray.map(function (value) { return (react_1.default.createElement(S_TabWrapper, { key: value.path, styleTheme: styleTheme, isActive: pathname === value.path, onClick: function () {
45
44
  handleClick(value);
46
45
  } },
47
- react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'body2Bold' : 'body2Regular', colorTheme: pathname === value.path ? 'usrTextBrandPrimary' : 'sysTextSecondary', singleLineMode: "use" }))); })),
48
- react_1.default.createElement(hybrid_1.Divider, { direction: "horizontal" })));
46
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'body2Bold' : 'body2Regular', colorTheme: pathname === value.path ? 'usrTextBrandPrimary' : 'sysTextSecondary', singleLineMode: "use" }))); }))));
49
47
  }
50
48
  var S_TabWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
51
49
  var styleTheme = _a.styleTheme;
@@ -56,19 +54,25 @@ var S_TabWrapper = styled_components_1.default.div(templateObject_1 || (template
56
54
  return mainStyle;
57
55
  }
58
56
  });
59
- var mainStyle = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n cursor: pointer;\n display: flex;\n height: 48px;\n margin-right: ", ";\n position: relative;\n background-color: ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n border-bottom: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n }\n"], ["\n align-items: center;\n cursor: pointer;\n display: flex;\n height: 48px;\n margin-right: ", ";\n position: relative;\n background-color: ", ";\n\n &:last-child {\n margin-right: 0;\n }\n\n &::after {\n border-bottom: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n }\n"])), function (_a) {
57
+ var mainStyle = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n cursor: pointer;\n display: flex;\n margin-right: ", ";\n position: relative;\n background-color: ", ";\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 cursor: pointer;\n display: flex;\n margin-right: ", ";\n position: relative;\n background-color: ", ";\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) {
60
58
  var theme = _a.theme;
61
59
  return theme.spacing.spacingE;
62
60
  }, function (_a) {
63
61
  var isActive = _a.isActive, theme = _a.theme;
64
62
  return isActive && theme.ui_cpnt_tabbar_base_area;
65
63
  }, function (_a) {
66
- var isActive = _a.isActive, theme = _a.theme;
67
- return isActive && "2px solid " + theme.ui_cpnt_tabbar_border_active_indicator_primary;
64
+ var theme = _a.theme;
65
+ return theme.ui_cpnt_tabbar_border_active_indicator_primary;
66
+ }, function (_a) {
67
+ var isActive = _a.isActive;
68
+ return !isActive && "display: none;";
68
69
  });
69
- var S_TabBar = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n justify-content: center;\n"], ["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n justify-content: center;\n"])), function (_a) {
70
+ var S_TabBar = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n height: 48px;\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: 48px;\n justify-content: center;\n"])), function (_a) {
70
71
  var theme = _a.theme;
71
72
  return theme.ui_cpnt_tabbar_base_area;
73
+ }, function (_a) {
74
+ var theme = _a.theme;
75
+ return theme.ui_cpnt_divider;
72
76
  });
73
77
  exports.default = UserDesktopTabBar;
74
78
  var templateObject_1, templateObject_2, templateObject_3;
package/dist/src/desktop/components/index.d.ts CHANGED
@@ -5,7 +5,7 @@ import { Chip } from './Chip';
5
5
  import { ContextMenu } from './ContextMenu';
6
6
  import { ContextMenuItem } from './ContextMenuItem';
7
7
  import { DesktopHeaderBar } from './DesktopHeaderBar';
8
- import { DesktopTapBar } from './DesktopTabBar';
8
+ import { DesktopTabBar } from './DesktopTabBar';
9
9
  import { EditApplyTextField } from './EditApplyTextField';
10
10
  import { FilterBar } from './FilterBar';
11
11
  import { FloatingActionButton } from './FloatingActionButton';
@@ -25,4 +25,4 @@ import { UploadMainButton } from './UploadMainButton';
25
25
  import { UploadTextButton } from './UploadTextButton';
26
26
  import { UserDesktopNavBar } from './UserDesktopNavBar';
27
27
  import { UserDesktopTabBar } from './UserDesktopTabBar';
28
- export { Card, CardList, Checkbox, Chip, ContextMenu, ContextMenuItem, DesktopHeaderBar, DesktopTapBar, EditApplyTextField, FilterBar, FloatingActionButton, Hero, IconButton, ImageSlide, MainButton, Radio, ReactionButton, Select, StatusBlock, TextButton, TextField, TextLabel, UploadIconButton, UploadMainButton, UploadTextButton, UserDesktopNavBar, UserDesktopTabBar };
28
+ export { Card, CardList, Checkbox, Chip, ContextMenu, ContextMenuItem, DesktopHeaderBar, DesktopTabBar, EditApplyTextField, FilterBar, FloatingActionButton, Hero, IconButton, ImageSlide, MainButton, Radio, ReactionButton, Select, StatusBlock, TextButton, TextField, TextLabel, UploadIconButton, UploadMainButton, UploadTextButton, UserDesktopNavBar, UserDesktopTabBar };
package/dist/src/desktop/components/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.UserDesktopTabBar = exports.UserDesktopNavBar = exports.UploadTextButton = exports.UploadMainButton = exports.UploadIconButton = exports.TextLabel = exports.TextField = exports.TextButton = exports.StatusBlock = exports.Select = exports.ReactionButton = exports.Radio = exports.MainButton = exports.ImageSlide = exports.IconButton = exports.Hero = exports.FloatingActionButton = exports.FilterBar = exports.EditApplyTextField = exports.DesktopTapBar = exports.DesktopHeaderBar = exports.ContextMenuItem = exports.ContextMenu = exports.Chip = exports.Checkbox = exports.CardList = exports.Card = void 0;
3
+ exports.UserDesktopTabBar = exports.UserDesktopNavBar = exports.UploadTextButton = exports.UploadMainButton = exports.UploadIconButton = exports.TextLabel = exports.TextField = exports.TextButton = exports.StatusBlock = exports.Select = exports.ReactionButton = exports.Radio = exports.MainButton = exports.ImageSlide = exports.IconButton = exports.Hero = exports.FloatingActionButton = exports.FilterBar = exports.EditApplyTextField = exports.DesktopTabBar = exports.DesktopHeaderBar = exports.ContextMenuItem = exports.ContextMenu = exports.Chip = exports.Checkbox = exports.CardList = exports.Card = void 0;
4
4
  var Card_1 = require("./Card");
5
5
  Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return Card_1.Card; } });
6
6
  var CardList_1 = require("./CardList");
@@ -16,7 +16,7 @@ Object.defineProperty(exports, "ContextMenuItem", { enumerable: true, get: funct
16
16
  var DesktopHeaderBar_1 = require("./DesktopHeaderBar");
17
17
  Object.defineProperty(exports, "DesktopHeaderBar", { enumerable: true, get: function () { return DesktopHeaderBar_1.DesktopHeaderBar; } });
18
18
  var DesktopTabBar_1 = require("./DesktopTabBar");
19
- Object.defineProperty(exports, "DesktopTapBar", { enumerable: true, get: function () { return DesktopTabBar_1.DesktopTapBar; } });
19
+ Object.defineProperty(exports, "DesktopTabBar", { enumerable: true, get: function () { return DesktopTabBar_1.DesktopTabBar; } });
20
20
  var EditApplyTextField_1 = require("./EditApplyTextField");
21
21
  Object.defineProperty(exports, "EditApplyTextField", { enumerable: true, get: function () { return EditApplyTextField_1.EditApplyTextField; } });
22
22
  var FilterBar_1 = require("./FilterBar");
package/dist/src/desktop/index.d.ts CHANGED
@@ -9,5 +9,5 @@ import { LayoutWT } from './layout/LayoutWT';
9
9
  import { GlobalMenuContainer as WTGlobalMenuContainer } from './layout/LayoutWT/Containers';
10
10
  import { ContainersBox as WTContainersBox } from './layout/LayoutWT/ContainersBox';
11
11
  export { LayoutWT, WTGlobalMenuContainer, WTContainersBox };
12
- import { Card as D_Card, CardList as D_CardList, Checkbox as D_Checkbox, Chip as D_Chip, ContextMenu as D_ContextMenu, ContextMenuItem as D_ContextMenuItem, DesktopHeaderBar as D_DesktopHeaderBar, DesktopTapBar as D_DesktopTapBar, EditApplyTextField as D_EditApplyTextField, FilterBar as D_FilterBar, FloatingActionButton as D_FloatingActionButton, Hero as D_Hero, IconButton as D_IconButton, ImageSlide as D_ImageSlide, MainButton as D_MainButton, Radio as D_Radio, ReactionButton as D_ReactionButton, Select as D_Select, StatusBlock as D_StatusBlock, TextButton as D_TextButton, TextField as D_TextField, TextLabel as D_TextLabel, UploadIconButton as D_UploadIconButton, UploadMainButton as D_UploadMainButton, UploadTextButton as D_UploadTextButton, UserDesktopNavBar as D_UserDesktopNavBar, UserDesktopTabBar as D_UserDesktopTabBar } from './components';
13
- export { D_Card, D_CardList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopHeaderBar, D_DesktopTapBar, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_IconButton, D_ImageSlide, D_MainButton, D_Radio, D_Select, D_ReactionButton, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar };
12
+ import { Card as D_Card, CardList as D_CardList, Checkbox as D_Checkbox, Chip as D_Chip, ContextMenu as D_ContextMenu, ContextMenuItem as D_ContextMenuItem, DesktopHeaderBar as D_DesktopHeaderBar, DesktopTabBar as D_DesktopTabBar, EditApplyTextField as D_EditApplyTextField, FilterBar as D_FilterBar, FloatingActionButton as D_FloatingActionButton, Hero as D_Hero, IconButton as D_IconButton, ImageSlide as D_ImageSlide, MainButton as D_MainButton, Radio as D_Radio, ReactionButton as D_ReactionButton, Select as D_Select, StatusBlock as D_StatusBlock, TextButton as D_TextButton, TextField as D_TextField, TextLabel as D_TextLabel, UploadIconButton as D_UploadIconButton, UploadMainButton as D_UploadMainButton, UploadTextButton as D_UploadTextButton, UserDesktopNavBar as D_UserDesktopNavBar, UserDesktopTabBar as D_UserDesktopTabBar } from './components';
13
+ export { D_Card, D_CardList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopHeaderBar, D_DesktopTabBar, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_IconButton, D_ImageSlide, D_MainButton, D_Radio, D_Select, D_ReactionButton, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar };
package/dist/src/desktop/index.js CHANGED
@@ -2,7 +2,7 @@
2
2
  /* eslint-disable import/order */
3
3
  /* eslint-disable import/first */
4
4
  Object.defineProperty(exports, "__esModule", { value: true });
5
- exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_TextLabel = exports.D_TextField = exports.D_TextButton = exports.D_StatusBlock = exports.D_ReactionButton = exports.D_Select = exports.D_Radio = exports.D_MainButton = exports.D_ImageSlide = exports.D_IconButton = exports.D_Hero = exports.D_FloatingActionButton = exports.D_FilterBar = exports.D_EditApplyTextField = exports.D_DesktopTapBar = exports.D_DesktopHeaderBar = exports.D_ContextMenuItem = exports.D_ContextMenu = exports.D_Chip = exports.D_Checkbox = exports.D_CardList = exports.D_Card = exports.WTContainersBox = exports.WTGlobalMenuContainer = exports.LayoutWT = exports.WSContainersBox = exports.WSGlobalMenuContainer = exports.LayoutWS = exports.WFContainersBox = exports.LayoutWF = void 0;
5
+ exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_TextLabel = exports.D_TextField = exports.D_TextButton = exports.D_StatusBlock = exports.D_ReactionButton = exports.D_Select = exports.D_Radio = exports.D_MainButton = exports.D_ImageSlide = exports.D_IconButton = exports.D_Hero = exports.D_FloatingActionButton = exports.D_FilterBar = exports.D_EditApplyTextField = exports.D_DesktopTabBar = exports.D_DesktopHeaderBar = exports.D_ContextMenuItem = exports.D_ContextMenu = exports.D_Chip = exports.D_Checkbox = exports.D_CardList = exports.D_Card = exports.WTContainersBox = exports.WTGlobalMenuContainer = exports.LayoutWT = exports.WSContainersBox = exports.WSGlobalMenuContainer = exports.LayoutWS = exports.WFContainersBox = exports.LayoutWF = void 0;
6
6
  // layoutWF
7
7
  var LayoutWF_1 = require("./layout/LayoutWF");
8
8
  Object.defineProperty(exports, "LayoutWF", { enumerable: true, get: function () { return LayoutWF_1.LayoutWF; } });
@@ -31,7 +31,7 @@ Object.defineProperty(exports, "D_Chip", { enumerable: true, get: function () {
31
31
  Object.defineProperty(exports, "D_ContextMenu", { enumerable: true, get: function () { return components_1.ContextMenu; } });
32
32
  Object.defineProperty(exports, "D_ContextMenuItem", { enumerable: true, get: function () { return components_1.ContextMenuItem; } });
33
33
  Object.defineProperty(exports, "D_DesktopHeaderBar", { enumerable: true, get: function () { return components_1.DesktopHeaderBar; } });
34
- Object.defineProperty(exports, "D_DesktopTapBar", { enumerable: true, get: function () { return components_1.DesktopTapBar; } });
34
+ Object.defineProperty(exports, "D_DesktopTabBar", { enumerable: true, get: function () { return components_1.DesktopTabBar; } });
35
35
  Object.defineProperty(exports, "D_EditApplyTextField", { enumerable: true, get: function () { return components_1.EditApplyTextField; } });
36
36
  Object.defineProperty(exports, "D_FilterBar", { enumerable: true, get: function () { return components_1.FilterBar; } });
37
37
  Object.defineProperty(exports, "D_FloatingActionButton", { enumerable: true, get: function () { return components_1.FloatingActionButton; } });
package/dist/src/hybrid/components/Switch/Switch.js CHANGED
@@ -47,7 +47,7 @@ function Switch(_a) {
47
47
  react_1.default.createElement(S_Input, { type: "checkbox", hidden: true, id: name, checked: checked, disabled: state === 'disabled', onChange: handleChange }),
48
48
  react_1.default.createElement(S_Label, { htmlFor: name, disabled: state === 'disabled' })));
49
49
  }
50
- var S_Switch = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
50
+ var S_Switch = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n width: 56px;\n height: 32px;\n"], ["\n position: relative;\n width: 56px;\n height: 32px;\n"])));
51
51
  var S_Label = styled_components_1.default.label(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 56px;\n height: 32px;\n border-radius: 24px;\n background: ", ";\n cursor: pointer;\n\n &::after {\n content: '';\n display: block;\n border-radius: 24px;\n width: 24px;\n height: 24px;\n margin: ", ";\n background: ", ";\n }\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 56px;\n height: 32px;\n border-radius: 24px;\n background: ", ";\n cursor: pointer;\n\n &::after {\n content: '';\n display: block;\n border-radius: 24px;\n width: 24px;\n height: 24px;\n margin: ", ";\n background: ", ";\n }\n"])), function (_a) {
52
52
  var theme = _a.theme, disabled = _a.disabled;
53
53
  return disabled ? theme.ui_cpnt_selcontrols_base_off_disabled : theme.ui_cpnt_selcontrols_base_off;
package/dist/src/mobile/components/MobileTabBar/MobileTabBar.js CHANGED
@@ -10,7 +10,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
10
10
  var react_1 = __importDefault(require("react"));
11
11
  var react_router_dom_1 = require("react-router-dom");
12
12
  var styled_components_1 = __importDefault(require("styled-components"));
13
- var hybrid_1 = require("../../../hybrid");
14
13
  var TextLabel_1 = require("../TextLabel");
15
14
  function MobileTabBar(_a) {
16
15
  var textArray = _a.textArray;
@@ -25,22 +24,27 @@ function MobileTabBar(_a) {
25
24
  react_1.default.createElement(S_TabBar, null, textArray.map(function (value) { return (react_1.default.createElement(S_TabWrapper, { key: value.path, isActive: pathname === value.path, onClick: function () {
26
25
  handleClick(value);
27
26
  } },
28
- react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: "body2Bold", colorTheme: pathname === value.path ? 'usrTextBrandPrimary' : 'sysTextTertiary', singleLineMode: "use" }))); })),
29
- react_1.default.createElement(hybrid_1.Divider, { direction: "horizontal" })));
27
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: "body2Bold", colorTheme: pathname === value.path ? 'usrTextBrandPrimary' : 'sysTextTertiary', singleLineMode: "use" }))); }))));
30
28
  }
31
- 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 height: 48px;\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 border-bottom: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n }\n"], ["\n align-items: center;\n justify-content: center;\n cursor: pointer;\n display: flex;\n height: 48px;\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 border-bottom: ", ";\n bottom: -1px;\n content: '';\n height: 2px;\n position: absolute;\n width: 100%;\n }\n"])), function (_a) {
29
+ 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) {
32
30
  var isActive = _a.isActive, theme = _a.theme;
33
31
  return isActive && theme.ui_cpnt_tabbar_base_area;
34
32
  }, function (_a) {
35
33
  var theme = _a.theme;
36
34
  return theme.spacing.spacingD;
37
35
  }, function (_a) {
38
- var isActive = _a.isActive, theme = _a.theme;
39
- return isActive && "2px solid " + theme.ui_cpnt_tabbar_border_active_indicator_primary;
36
+ var theme = _a.theme;
37
+ return theme.ui_cpnt_tabbar_border_active_indicator_primary;
38
+ }, function (_a) {
39
+ var isActive = _a.isActive;
40
+ return !isActive && "display: none;";
40
41
  });
41
- var S_TabBar = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n justify-content: center;\n"], ["\n align-items: center;\n background-color: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n justify-content: center;\n"])), function (_a) {
42
+ var S_TabBar = 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 height: 48px;\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: 48px;\n justify-content: center;\n"])), function (_a) {
42
43
  var theme = _a.theme;
43
44
  return theme.ui_cpnt_tabbar_base_area;
45
+ }, function (_a) {
46
+ var theme = _a.theme;
47
+ return theme.ui_cpnt_divider;
44
48
  });
45
49
  exports.default = MobileTabBar;
46
50
  var templateObject_1, templateObject_2;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "0.5.15",
3
+ "version": "0.5.16",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",