pds-dev-kit-web 2.1.27 → 2.1.28-alpha.0

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 (21) hide show
  1. package/dist/index.d.ts +3 -3
  2. package/dist/index.js +3 -2
  3. package/dist/src/desktop/index.d.ts +1 -1
  4. package/dist/src/desktop/index.js +2 -1
  5. package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/SideTab/SideTab.d.ts +8 -0
  6. package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/SideTab/SideTab.js +58 -0
  7. package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/SideTab/index.d.ts +1 -0
  8. package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/SideTab/index.js +8 -0
  9. package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/index.d.ts +2 -0
  10. package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/index.js +5 -0
  11. package/dist/src/desktop/panels/DesktopBasicModalWithTab/DesktopBasicModalWithTab.d.ts +27 -0
  12. package/dist/src/desktop/panels/DesktopBasicModalWithTab/DesktopBasicModalWithTab.js +146 -0
  13. package/dist/src/desktop/panels/DesktopBasicModalWithTab/index.d.ts +2 -0
  14. package/dist/src/desktop/panels/DesktopBasicModalWithTab/index.js +8 -0
  15. package/dist/src/desktop/panels/index.d.ts +3 -1
  16. package/dist/src/desktop/panels/index.js +3 -1
  17. package/dist/src/sub/DynamicLayout/mock_storybook.js +112 -20
  18. package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/templates/TemplateA/mobile/components/SectionContents.js +1 -1
  19. package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/templates/TemplateB/mobile/components/SectionContents.js +1 -1
  20. package/package.json +1 -1
  21. package/release-note.md +4 -5
package/dist/index.d.ts CHANGED
@@ -8,14 +8,14 @@ export { AdminListItemTransition, InputTransition, ButtonTransition } from './sr
8
8
  export { Form };
9
9
  import { Divider, Icon, ImageView, LinearProgress, LottieIcon, Spacing, Switch } from './src/hybrid';
10
10
  export { Divider, Icon, ImageView, LinearProgress, LottieIcon, Spacing, Switch };
11
- import { LayoutWF, WFContainersBox, LayoutWH, WHContainersBox, LayoutWS, WSGlobalMenuContainer, WSContainersBox, LayoutWT, WTGlobalMenuContainer, WTContainersBox, D_AdminList, D_AdminListHeader, D_AdminListItem, D_BasicButtonGroup, D_BasicChatListItem, D_BasicFormGroup, D_BasicList, D_BasicListItem, D_BlogTextField, D_BodyTextGroup, D_Card, D_CardList, D_ChatBubbleListItem, D_ChatList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopAlertDialog, D_DesktopHeaderBar, D_DesktopTabBar, D_Dropdown, D_DynamicDesktopNavBar, D_DynamicDesktopNavBarTemplates, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_HorizontalFormGroup, D_IconButton, D_ImageSlide, D_LottieReactionButton, D_MainButton, D_PageTitleTextGroup, D_Radio, D_ReactionButton, D_SegmentedButtonGroup, D_Select, D_Slider, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar, D_UserDesktopSideTab, D_AnnotationSheet, D_ContentSheet, D_DesktopBasicModal, D_DesktopHeadlessModal, D_DesktopTutorialModal, DesktopTutorialModalInfoType, D_SectionSheet } from './src/desktop';
11
+ import { LayoutWF, WFContainersBox, LayoutWH, WHContainersBox, LayoutWS, WSGlobalMenuContainer, WSContainersBox, LayoutWT, WTGlobalMenuContainer, WTContainersBox, D_AdminList, D_AdminListHeader, D_AdminListItem, D_BasicButtonGroup, D_BasicChatListItem, D_BasicFormGroup, D_BasicList, D_BasicListItem, D_BlogTextField, D_BodyTextGroup, D_Card, D_CardList, D_ChatBubbleListItem, D_ChatList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopAlertDialog, D_DesktopHeaderBar, D_DesktopTabBar, D_Dropdown, D_DynamicDesktopNavBar, D_DynamicDesktopNavBarTemplates, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_HorizontalFormGroup, D_IconButton, D_ImageSlide, D_LottieReactionButton, D_MainButton, D_PageTitleTextGroup, D_Radio, D_ReactionButton, D_SegmentedButtonGroup, D_Select, D_Slider, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar, D_UserDesktopSideTab, D_AnnotationSheet, D_ContentSheet, D_DesktopBasicModal, D_DesktopBasicModalWithTab, DesktopBasicModalWithTabInfoType, D_DesktopHeadlessModal, D_DesktopTutorialModal, DesktopTutorialModalInfoType, D_SectionSheet } from './src/desktop';
12
12
  export { LayoutWF, WFContainersBox };
13
13
  export { LayoutWH, WHContainersBox };
14
14
  export { LayoutWS, WSGlobalMenuContainer, WSContainersBox };
15
15
  export { LayoutWT, WTGlobalMenuContainer, WTContainersBox };
16
16
  export { D_AdminList, D_AdminListHeader, D_AdminListItem, D_BasicButtonGroup, D_BasicChatListItem, D_BasicFormGroup, D_BasicList, D_BasicListItem, D_BlogTextField, D_BodyTextGroup, D_Card, D_CardList, D_ChatBubbleListItem, D_ChatList, D_Checkbox, D_Chip, D_ContextMenu, D_ContextMenuItem, D_DesktopAlertDialog, D_DesktopHeaderBar, D_DesktopTabBar, D_Dropdown, D_DynamicDesktopNavBar, D_DynamicDesktopNavBarTemplates, D_EditApplyTextField, D_FilterBar, D_FloatingActionButton, D_Hero, D_HorizontalFormGroup, D_IconButton, D_ImageSlide, D_LottieReactionButton, D_MainButton, D_PageTitleTextGroup, D_Radio, D_ReactionButton, D_SegmentedButtonGroup, D_Select, D_Slider, D_StatusBlock, D_TextButton, D_TextField, D_TextLabel, D_UploadIconButton, D_UploadMainButton, D_UploadTextButton, D_UserDesktopNavBar, D_UserDesktopTabBar, D_UserDesktopSideTab };
17
- export { D_AnnotationSheet, D_ContentSheet, D_DesktopBasicModal, D_DesktopHeadlessModal, D_DesktopTutorialModal, D_SectionSheet };
18
- export type { DesktopTutorialModalInfoType };
17
+ export { D_AnnotationSheet, D_ContentSheet, D_DesktopBasicModal, D_DesktopBasicModalWithTab, D_DesktopHeadlessModal, D_DesktopTutorialModal, D_SectionSheet };
18
+ export type { DesktopBasicModalWithTabInfoType, DesktopTutorialModalInfoType };
19
19
  import { LayoutMF, MFContainersBox, LayoutMM, MMNavigationContainer, MMContainersBox, LayoutMP, MPNavigationContainer, MPTabContainer, MPContainersBox, LayoutMS, MSNavigationContainer, MSContainersBox, M_BasicButtonGroup, M_BasicChatListItem, M_BasicFormGroup, M_BasicList, M_BasicListItem, M_BlogTextField, M_BodyTextGroup, M_Card, M_CardList, M_ChatBubbleListItem, M_ChatList, M_Checkbox, M_Chip, M_ContextMenu, M_ContextMenuItem, M_Dropdown, M_FloatingActionButton, M_HorizontalFormGroup, M_IconButton, M_ImageSlide, M_LottieReactionButton, M_MainButton, M_MobileAlertDialog, M_MobileHeaderBar, M_MobileTabBar, M_Radio, M_ReactionButton, M_SegmentedButtonGroup, M_Select, M_Slider, M_StatusBlock, M_TextButton, M_TextField, M_TextLabel, M_UploadIconButton, M_UploadMainButton, M_UploadTextButton, M_AnnotationSheet, M_ContentSheet, M_MobileBasicModal, M_SectionSheet } from './src/mobile';
20
20
  export { LayoutMF, MFContainersBox };
21
21
  export { LayoutMM, MMNavigationContainer, MMContainersBox };
package/dist/index.js CHANGED
@@ -2,8 +2,8 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.LayoutWF = exports.Switch = exports.Spacing = exports.LottieIcon = exports.LinearProgress = exports.ImageView = exports.Icon = exports.Divider = exports.Form = exports.ButtonTransition = exports.InputTransition = exports.AdminListItemTransition = exports.scaleBounceOutIncludeTranslate02 = exports.scaleBounceInIncludeTranslate02 = exports.scaleBounceOutIncludeTranslate = exports.scaleBounceInIncludeTranslate = exports.scaleBounceOut02 = exports.scaleBounceOut = exports.scaleBounceIn02 = exports.scaleBounceIn = exports.gelatine = exports.scaleDownIncludeTranslate = exports.scaleUpIncludeTranslate = exports.scaleDown = exports.scaleUp = exports.glow = exports.fadeOut = exports.fadeIn = exports.modalOverlayOffAni = exports.modalOverlayOnAni = exports.modalOffAni = exports.modalOnAni = exports.dialogOverlayOffAni = exports.dialogOverlayOnAni = exports.dialogOffAni = exports.dialogOnAni = exports.theme = exports.customTheme = exports.uiColors = exports.spacing = exports.boxShadow = exports.mobileEditorLineHeight = exports.mobileEditorFontSize = exports.mobileLineHeight = exports.mobileFontSize = exports.desktopEditorLineHeight = exports.desktopEditorFontSize = exports.desktopLineHeight = exports.desktopFontSize = exports.fontWeight = void 0;
4
4
  exports.D_TextButton = exports.D_StatusBlock = exports.D_Slider = exports.D_Select = exports.D_SegmentedButtonGroup = exports.D_ReactionButton = exports.D_Radio = exports.D_PageTitleTextGroup = exports.D_MainButton = exports.D_LottieReactionButton = exports.D_ImageSlide = exports.D_IconButton = exports.D_HorizontalFormGroup = exports.D_Hero = exports.D_FloatingActionButton = exports.D_FilterBar = exports.D_EditApplyTextField = exports.D_DynamicDesktopNavBarTemplates = exports.D_DynamicDesktopNavBar = exports.D_Dropdown = exports.D_DesktopTabBar = exports.D_DesktopHeaderBar = exports.D_DesktopAlertDialog = exports.D_ContextMenuItem = exports.D_ContextMenu = exports.D_Chip = exports.D_Checkbox = exports.D_ChatList = exports.D_ChatBubbleListItem = exports.D_CardList = exports.D_Card = exports.D_BodyTextGroup = exports.D_BlogTextField = exports.D_BasicListItem = exports.D_BasicList = exports.D_BasicFormGroup = exports.D_BasicChatListItem = exports.D_BasicButtonGroup = exports.D_AdminListItem = exports.D_AdminListHeader = exports.D_AdminList = exports.WTContainersBox = exports.WTGlobalMenuContainer = exports.LayoutWT = exports.WSContainersBox = exports.WSGlobalMenuContainer = exports.LayoutWS = exports.WHContainersBox = exports.LayoutWH = exports.WFContainersBox = void 0;
5
- exports.M_MobileHeaderBar = exports.M_MobileAlertDialog = exports.M_MainButton = exports.M_LottieReactionButton = exports.M_ImageSlide = exports.M_IconButton = exports.M_HorizontalFormGroup = exports.M_FloatingActionButton = exports.M_Dropdown = exports.M_ContextMenuItem = exports.M_ContextMenu = exports.M_Chip = exports.M_Checkbox = exports.M_ChatList = exports.M_ChatBubbleListItem = exports.M_CardList = exports.M_Card = exports.M_BodyTextGroup = exports.M_BlogTextField = exports.M_BasicListItem = exports.M_BasicList = exports.M_BasicFormGroup = exports.M_BasicChatListItem = exports.M_BasicButtonGroup = exports.MSContainersBox = exports.MSNavigationContainer = exports.LayoutMS = exports.MPContainersBox = exports.MPTabContainer = exports.MPNavigationContainer = exports.LayoutMP = exports.MMContainersBox = exports.MMNavigationContainer = exports.LayoutMM = exports.MFContainersBox = exports.LayoutMF = exports.D_SectionSheet = exports.D_DesktopTutorialModal = exports.D_DesktopHeadlessModal = exports.D_DesktopBasicModal = exports.D_ContentSheet = exports.D_AnnotationSheet = exports.D_UserDesktopSideTab = exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_TextLabel = exports.D_TextField = void 0;
6
- exports.ToolBar = exports.BulkActionBar = exports.AdminListItem = exports.AdminListHeader = exports.AdminList = exports.DynamicLayout = exports.M_SectionSheet = exports.M_MobileBasicModal = exports.M_ContentSheet = exports.M_AnnotationSheet = exports.M_UploadTextButton = exports.M_UploadMainButton = exports.M_UploadIconButton = exports.M_TextLabel = exports.M_TextField = exports.M_TextButton = exports.M_StatusBlock = exports.M_Slider = exports.M_Select = exports.M_SegmentedButtonGroup = exports.M_ReactionButton = exports.M_Radio = exports.M_MobileTabBar = void 0;
5
+ exports.M_MobileAlertDialog = exports.M_MainButton = exports.M_LottieReactionButton = exports.M_ImageSlide = exports.M_IconButton = exports.M_HorizontalFormGroup = exports.M_FloatingActionButton = exports.M_Dropdown = exports.M_ContextMenuItem = exports.M_ContextMenu = exports.M_Chip = exports.M_Checkbox = exports.M_ChatList = exports.M_ChatBubbleListItem = exports.M_CardList = exports.M_Card = exports.M_BodyTextGroup = exports.M_BlogTextField = exports.M_BasicListItem = exports.M_BasicList = exports.M_BasicFormGroup = exports.M_BasicChatListItem = exports.M_BasicButtonGroup = exports.MSContainersBox = exports.MSNavigationContainer = exports.LayoutMS = exports.MPContainersBox = exports.MPTabContainer = exports.MPNavigationContainer = exports.LayoutMP = exports.MMContainersBox = exports.MMNavigationContainer = exports.LayoutMM = exports.MFContainersBox = exports.LayoutMF = exports.D_SectionSheet = exports.D_DesktopTutorialModal = exports.D_DesktopHeadlessModal = exports.D_DesktopBasicModalWithTab = exports.D_DesktopBasicModal = exports.D_ContentSheet = exports.D_AnnotationSheet = exports.D_UserDesktopSideTab = exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_TextLabel = exports.D_TextField = void 0;
6
+ exports.ToolBar = exports.BulkActionBar = exports.AdminListItem = exports.AdminListHeader = exports.AdminList = exports.DynamicLayout = exports.M_SectionSheet = exports.M_MobileBasicModal = exports.M_ContentSheet = exports.M_AnnotationSheet = exports.M_UploadTextButton = exports.M_UploadMainButton = exports.M_UploadIconButton = exports.M_TextLabel = exports.M_TextField = exports.M_TextButton = exports.M_StatusBlock = exports.M_Slider = exports.M_Select = exports.M_SegmentedButtonGroup = exports.M_ReactionButton = exports.M_Radio = exports.M_MobileTabBar = exports.M_MobileHeaderBar = void 0;
7
7
  /* eslint-disable import/order */
8
8
  /* eslint-disable import/first */
9
9
  // common
@@ -129,6 +129,7 @@ Object.defineProperty(exports, "D_UserDesktopSideTab", { enumerable: true, get:
129
129
  Object.defineProperty(exports, "D_AnnotationSheet", { enumerable: true, get: function () { return desktop_1.D_AnnotationSheet; } });
130
130
  Object.defineProperty(exports, "D_ContentSheet", { enumerable: true, get: function () { return desktop_1.D_ContentSheet; } });
131
131
  Object.defineProperty(exports, "D_DesktopBasicModal", { enumerable: true, get: function () { return desktop_1.D_DesktopBasicModal; } });
132
+ Object.defineProperty(exports, "D_DesktopBasicModalWithTab", { enumerable: true, get: function () { return desktop_1.D_DesktopBasicModalWithTab; } });
132
133
  Object.defineProperty(exports, "D_DesktopHeadlessModal", { enumerable: true, get: function () { return desktop_1.D_DesktopHeadlessModal; } });
133
134
  Object.defineProperty(exports, "D_DesktopTutorialModal", { enumerable: true, get: function () { return desktop_1.D_DesktopTutorialModal; } });
134
135
  Object.defineProperty(exports, "D_SectionSheet", { enumerable: true, get: function () { return desktop_1.D_SectionSheet; } });
package/dist/src/desktop/index.d.ts CHANGED
@@ -9,4 +9,4 @@ export { LayoutWT } from './layout/LayoutWT';
9
9
  export { GlobalMenuContainer as WTGlobalMenuContainer } from './layout/LayoutWT/Containers';
10
10
  export { ContainersBox as WTContainersBox } from './layout/LayoutWT/ContainersBox';
11
11
  export { AdminList as D_AdminList, AdminListHeader as D_AdminListHeader, AdminListItem as D_AdminListItem, BasicButtonGroup as D_BasicButtonGroup, BasicChatListItem as D_BasicChatListItem, BasicFormGroup as D_BasicFormGroup, BasicList as D_BasicList, BasicListItem as D_BasicListItem, BlogTextField as D_BlogTextField, BodyTextGroup as D_BodyTextGroup, Card as D_Card, CardList as D_CardList, ChatBubbleListItem as D_ChatBubbleListItem, ChatList as D_ChatList, Checkbox as D_Checkbox, Chip as D_Chip, ContextMenu as D_ContextMenu, ContextMenuItem as D_ContextMenuItem, DesktopAlertDialog as D_DesktopAlertDialog, DesktopHeaderBar as D_DesktopHeaderBar, DesktopTabBar as D_DesktopTabBar, Dropdown as D_Dropdown, DynamicDesktopNavBar as D_DynamicDesktopNavBar, DynamicDesktopNavBarTemplates as D_DynamicDesktopNavBarTemplates, EditApplyTextField as D_EditApplyTextField, FilterBar as D_FilterBar, FloatingActionButton as D_FloatingActionButton, Hero as D_Hero, HorizontalFormGroup as D_HorizontalFormGroup, IconButton as D_IconButton, ImageSlide as D_ImageSlide, LottieReactionButton as D_LottieReactionButton, MainButton as D_MainButton, PageTitleTextGroup as D_PageTitleTextGroup, Radio as D_Radio, ReactionButton as D_ReactionButton, SegmentedButtonGroup as D_SegmentedButtonGroup, Select as D_Select, Slider as D_Slider, 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, UserDesktopSideTab as D_UserDesktopSideTab } from './components';
12
- export { AnnotationSheet as D_AnnotationSheet, ContentSheet as D_ContentSheet, DesktopBasicModal as D_DesktopBasicModal, DesktopHeadlessModal as D_DesktopHeadlessModal, DesktopTutorialModal as D_DesktopTutorialModal, DesktopTutorialModalInfoType, SectionSheet as D_SectionSheet } from './panels';
12
+ export { AnnotationSheet as D_AnnotationSheet, ContentSheet as D_ContentSheet, DesktopBasicModal as D_DesktopBasicModal, DesktopBasicModalWithTab as D_DesktopBasicModalWithTab, DesktopBasicModalWithTabInfoType, DesktopHeadlessModal as D_DesktopHeadlessModal, DesktopTutorialModal as D_DesktopTutorialModal, DesktopTutorialModalInfoType, SectionSheet as D_SectionSheet } from './panels';
package/dist/src/desktop/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.D_StatusBlock = exports.D_Slider = exports.D_Select = exports.D_SegmentedButtonGroup = exports.D_ReactionButton = exports.D_Radio = exports.D_PageTitleTextGroup = exports.D_MainButton = exports.D_LottieReactionButton = exports.D_ImageSlide = exports.D_IconButton = exports.D_HorizontalFormGroup = exports.D_Hero = exports.D_FloatingActionButton = exports.D_FilterBar = exports.D_EditApplyTextField = exports.D_DynamicDesktopNavBarTemplates = exports.D_DynamicDesktopNavBar = exports.D_Dropdown = exports.D_DesktopTabBar = exports.D_DesktopHeaderBar = exports.D_DesktopAlertDialog = exports.D_ContextMenuItem = exports.D_ContextMenu = exports.D_Chip = exports.D_Checkbox = exports.D_ChatList = exports.D_ChatBubbleListItem = exports.D_CardList = exports.D_Card = exports.D_BodyTextGroup = exports.D_BlogTextField = exports.D_BasicListItem = exports.D_BasicList = exports.D_BasicFormGroup = exports.D_BasicChatListItem = exports.D_BasicButtonGroup = exports.D_AdminListItem = exports.D_AdminListHeader = exports.D_AdminList = exports.WTContainersBox = exports.WTGlobalMenuContainer = exports.LayoutWT = exports.WSContainersBox = exports.WSGlobalMenuContainer = exports.LayoutWS = exports.WHContainersBox = exports.LayoutWH = exports.WFContainersBox = exports.LayoutWF = void 0;
4
- exports.D_SectionSheet = exports.D_DesktopTutorialModal = exports.D_DesktopHeadlessModal = exports.D_DesktopBasicModal = exports.D_ContentSheet = exports.D_AnnotationSheet = exports.D_UserDesktopSideTab = exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_TextLabel = exports.D_TextField = exports.D_TextButton = void 0;
4
+ exports.D_SectionSheet = exports.D_DesktopTutorialModal = exports.D_DesktopHeadlessModal = exports.D_DesktopBasicModalWithTab = exports.D_DesktopBasicModal = exports.D_ContentSheet = exports.D_AnnotationSheet = exports.D_UserDesktopSideTab = exports.D_UserDesktopTabBar = exports.D_UserDesktopNavBar = exports.D_UploadTextButton = exports.D_UploadMainButton = exports.D_UploadIconButton = exports.D_TextLabel = exports.D_TextField = exports.D_TextButton = void 0;
5
5
  // layoutWF
6
6
  var LayoutWF_1 = require("./layout/LayoutWF");
7
7
  Object.defineProperty(exports, "LayoutWF", { enumerable: true, get: function () { return LayoutWF_1.LayoutWF; } });
@@ -82,6 +82,7 @@ var panels_1 = require("./panels");
82
82
  Object.defineProperty(exports, "D_AnnotationSheet", { enumerable: true, get: function () { return panels_1.AnnotationSheet; } });
83
83
  Object.defineProperty(exports, "D_ContentSheet", { enumerable: true, get: function () { return panels_1.ContentSheet; } });
84
84
  Object.defineProperty(exports, "D_DesktopBasicModal", { enumerable: true, get: function () { return panels_1.DesktopBasicModal; } });
85
+ Object.defineProperty(exports, "D_DesktopBasicModalWithTab", { enumerable: true, get: function () { return panels_1.DesktopBasicModalWithTab; } });
85
86
  Object.defineProperty(exports, "D_DesktopHeadlessModal", { enumerable: true, get: function () { return panels_1.DesktopHeadlessModal; } });
86
87
  Object.defineProperty(exports, "D_DesktopTutorialModal", { enumerable: true, get: function () { return panels_1.DesktopTutorialModal; } });
87
88
  Object.defineProperty(exports, "D_SectionSheet", { enumerable: true, get: function () { return panels_1.SectionSheet; } });
package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/SideTab/SideTab.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ import type { PDSTabItemOption } from '../../../../../common/types';
3
+ export type ItemType = PDSTabItemOption;
4
+ type SideTabProps = {
5
+ itemArray: ItemType[];
6
+ };
7
+ declare function SideTab({ itemArray }: SideTabProps): JSX.Element;
8
+ export default SideTab;
package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/SideTab/SideTab.js ADDED
@@ -0,0 +1,58 @@
1
+ "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
6
+ var __assign = (this && this.__assign) || function () {
7
+ __assign = Object.assign || function(t) {
8
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
9
+ s = arguments[i];
10
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
+ t[p] = s[p];
12
+ }
13
+ return t;
14
+ };
15
+ return __assign.apply(this, arguments);
16
+ };
17
+ var __importDefault = (this && this.__importDefault) || function (mod) {
18
+ return (mod && mod.__esModule) ? mod : { "default": mod };
19
+ };
20
+ Object.defineProperty(exports, "__esModule", { value: true });
21
+ var jsx_runtime_1 = require("react/jsx-runtime");
22
+ var styled_components_1 = __importDefault(require("styled-components"));
23
+ var components_1 = require("../../../../components");
24
+ function SideTab(_a) {
25
+ var itemArray = _a.itemArray;
26
+ var handleClickTabItem = function (item, e) {
27
+ if (item.onClick) {
28
+ item.onClick(e);
29
+ }
30
+ };
31
+ return ((0, jsx_runtime_1.jsx)("div", { children: itemArray.map(function (item, index) {
32
+ return ((0, jsx_runtime_1.jsx)(S_TabWrapper, __assign({ onClick: function (e) { return handleClickTabItem(item, e); } }, { children: (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: item.title, styleTheme: item.isActive ? 'subTitleBold' : 'subTitleRegular', colorTheme: item.isActive ? 'sysTextPrimary' : 'sysTextSecondary' }) }), index));
33
+ }) }));
34
+ }
35
+ var S_TabWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n box-sizing: border-box;\n cursor: pointer;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n & div {\n line-height: 1.3;\n }\n"], ["\n background-color: ", ";\n box-sizing: border-box;\n cursor: pointer;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n & div {\n line-height: 1.3;\n }\n"])), function (_a) {
36
+ var theme = _a.theme;
37
+ return theme.ui_cpnt_modalwithtab_sidetab_default;
38
+ }, function (_a) {
39
+ var theme = _a.theme;
40
+ return theme.spacing.spacingB;
41
+ }, function (_a) {
42
+ var theme = _a.theme;
43
+ return theme.spacing.spacingE;
44
+ }, function (_a) {
45
+ var theme = _a.theme;
46
+ return theme.spacing.spacingE;
47
+ }, function (_a) {
48
+ var theme = _a.theme;
49
+ return theme.spacing.spacingB;
50
+ }, function (_a) {
51
+ var theme = _a.theme;
52
+ return theme.ui_cpnt_modalwithtab_sidetab_hover;
53
+ }, function (_a) {
54
+ var theme = _a.theme;
55
+ return theme.ui_cpnt_modalwithtab_sidetab_pressed;
56
+ });
57
+ exports.default = SideTab;
58
+ var templateObject_1;
package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/SideTab/index.d.ts ADDED
@@ -0,0 +1 @@
1
+ export { default as SideTab } from './SideTab';
package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/SideTab/index.js ADDED
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.SideTab = void 0;
7
+ var SideTab_1 = require("./SideTab");
8
+ Object.defineProperty(exports, "SideTab", { enumerable: true, get: function () { return __importDefault(SideTab_1).default; } });
package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ import { SideTab } from './SideTab';
2
+ export { SideTab };
package/dist/src/desktop/panels/DesktopBasicModalWithTab/Components/index.js ADDED
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SideTab = void 0;
4
+ var SideTab_1 = require("./SideTab");
5
+ Object.defineProperty(exports, "SideTab", { enumerable: true, get: function () { return SideTab_1.SideTab; } });
package/dist/src/desktop/panels/DesktopBasicModalWithTab/DesktopBasicModalWithTab.d.ts ADDED
@@ -0,0 +1,27 @@
1
+ /// <reference types="react" />
2
+ import type { PDSTextType } from '../../../common';
3
+ export type DesktopBasicModalWithTabInfoType = {
4
+ sideTabTitleText: PDSTextType;
5
+ bodyTitleText?: PDSTextType;
6
+ body: React.ReactNode;
7
+ };
8
+ type DesktopBasicModalWithTabProps = {
9
+ size?: 'large' | 'medium';
10
+ modalTitleText: PDSTextType;
11
+ infoArray: DesktopBasicModalWithTabInfoType[];
12
+ btnMode?: 'btn_amount1' | 'btn_amount2' | 'btn_amount3';
13
+ btn1Text: PDSTextType;
14
+ btn2Text?: PDSTextType;
15
+ btn3Text?: PDSTextType;
16
+ btn1State?: 'normal' | 'disabled';
17
+ btn2State?: 'normal' | 'disabled';
18
+ btn3State?: 'normal' | 'disabled';
19
+ btn1Type?: 'button' | 'submit';
20
+ btn2Type?: 'button' | 'submit';
21
+ btn3Type?: 'button' | 'submit';
22
+ onClickBtn1?: (e: React.MouseEvent<HTMLButtonElement>) => void;
23
+ onClickBtn2?: (e: React.MouseEvent<HTMLButtonElement>) => void;
24
+ onClickBtn3?: (e: React.MouseEvent<HTMLButtonElement>) => void;
25
+ };
26
+ declare function DesktopBasicModalWithTab({ size, modalTitleText, infoArray, btnMode, btn1Text, btn2Text, btn3Text, btn1State, btn2State, btn3State, btn1Type, btn2Type, btn3Type, onClickBtn1, onClickBtn2, onClickBtn3 }: DesktopBasicModalWithTabProps): import("react").ReactPortal;
27
+ export default DesktopBasicModalWithTab;
package/dist/src/desktop/panels/DesktopBasicModalWithTab/DesktopBasicModalWithTab.js ADDED
@@ -0,0 +1,146 @@
1
+ "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
6
+ var __assign = (this && this.__assign) || function () {
7
+ __assign = Object.assign || function(t) {
8
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
9
+ s = arguments[i];
10
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
+ t[p] = s[p];
12
+ }
13
+ return t;
14
+ };
15
+ return __assign.apply(this, arguments);
16
+ };
17
+ var __importDefault = (this && this.__importDefault) || function (mod) {
18
+ return (mod && mod.__esModule) ? mod : { "default": mod };
19
+ };
20
+ Object.defineProperty(exports, "__esModule", { value: true });
21
+ var jsx_runtime_1 = require("react/jsx-runtime");
22
+ var react_1 = require("react");
23
+ var react_dom_1 = __importDefault(require("react-dom"));
24
+ var styled_components_1 = __importDefault(require("styled-components"));
25
+ var animationStyle_1 = require("../../../common/styles/movement/animationStyle");
26
+ var scrollbarStyle_1 = require("../../../common/styles/scroll/scrollbarStyle");
27
+ var hybrid_1 = require("../../../hybrid");
28
+ var components_1 = require("../../components");
29
+ var Components_1 = require("./Components");
30
+ function DesktopBasicModalWithTab(_a) {
31
+ var _b = _a.size, size = _b === void 0 ? 'large' : _b, modalTitleText = _a.modalTitleText, infoArray = _a.infoArray, _c = _a.btnMode, btnMode = _c === void 0 ? 'btn_amount2' : _c, btn1Text = _a.btn1Text, btn2Text = _a.btn2Text, btn3Text = _a.btn3Text, _d = _a.btn1State, btn1State = _d === void 0 ? 'normal' : _d, _e = _a.btn2State, btn2State = _e === void 0 ? 'normal' : _e, _f = _a.btn3State, btn3State = _f === void 0 ? 'normal' : _f, _g = _a.btn1Type, btn1Type = _g === void 0 ? 'button' : _g, _h = _a.btn2Type, btn2Type = _h === void 0 ? 'button' : _h, _j = _a.btn3Type, btn3Type = _j === void 0 ? 'button' : _j, onClickBtn1 = _a.onClickBtn1, onClickBtn2 = _a.onClickBtn2, onClickBtn3 = _a.onClickBtn3;
32
+ var container = (0, react_1.useState)(function () {
33
+ var modalRoot = document.createElement('div');
34
+ modalRoot.setAttribute('id', 'DesktopBasicModalWithTab');
35
+ return modalRoot;
36
+ })[0];
37
+ (0, react_1.useLayoutEffect)(function () {
38
+ var root = document.getElementById('root');
39
+ if (!root) {
40
+ return;
41
+ }
42
+ root.appendChild(container);
43
+ return function () {
44
+ root.removeChild(container);
45
+ };
46
+ }, []);
47
+ var _k = (0, react_1.useState)("".concat(infoArray[0].sideTabTitleText, "0")), selectedItem = _k[0], setSelectedItem = _k[1];
48
+ var sideTabTitleArray = infoArray.map(function (data, index) {
49
+ return {
50
+ title: data.sideTabTitleText,
51
+ isActive: selectedItem === "".concat(data.sideTabTitleText).concat(index),
52
+ onClick: function () { return setSelectedItem("".concat(data.sideTabTitleText).concat(index)); }
53
+ };
54
+ });
55
+ var btn1Mode = ['btn_amount1', 'btn_amount2', 'btn_amount3'];
56
+ var btn2Mode = ['btn_amount2', 'btn_amount3'];
57
+ var btn3Mode = ['btn_amount3'];
58
+ return react_dom_1.default.createPortal((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(S_ModalOverlay, {}), (0, jsx_runtime_1.jsxs)(S_ModalWrapper, __assign({ "x-pds-name": "DesktopBasicModalWithTab", "x-pds-element-type": "panel", "x-pds-device-type": "desktop", size: size }, { children: [(0, jsx_runtime_1.jsxs)(S_UpsidePanel, { children: [(0, jsx_runtime_1.jsxs)(S_LeftPanel, { children: [(0, jsx_runtime_1.jsx)(S_Header, { children: (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: modalTitleText, lineLimit: 2, ellipsisMode: "use", styleTheme: "headingBold" }) }), (0, jsx_runtime_1.jsxs)(S_SideTabWrapper, { children: [(0, jsx_runtime_1.jsx)(Components_1.SideTab, { itemArray: sideTabTitleArray }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_i" })] })] }), infoArray
59
+ .filter(function (data, index) { return selectedItem === "".concat(data.sideTabTitleText).concat(index); })
60
+ .map(function (data, index) { return ((0, jsx_runtime_1.jsx)(S_RightContainer, { children: (0, jsx_runtime_1.jsxs)(S_RightArea, { children: [(0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: data.bodyTitleText ? data.bodyTitleText : data.sideTabTitleText, styleTheme: "headingBold" }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e" }), (0, jsx_runtime_1.jsx)(S_Body, { children: data.body && data.body })] }) }, "".concat(data.sideTabTitleText).concat(index))); })] }), (0, jsx_runtime_1.jsxs)(S_Footer, { children: [(0, jsx_runtime_1.jsx)(S_Left, { children: btn3Mode.includes(btnMode) && btn3Text && ((0, jsx_runtime_1.jsx)(components_1.MainButton, { styleTheme: "secondary", text: btn3Text, state: btn3State, type: btn3Type, size: "medium", onClick: onClickBtn3 })) }), (0, jsx_runtime_1.jsxs)(S_Right, { children: [(0, jsx_runtime_1.jsx)(S_Btn2Wrapper, { children: btn2Mode.includes(btnMode) && btn2Text && ((0, jsx_runtime_1.jsx)(components_1.MainButton, { styleTheme: "secondary", text: btn2Text, state: btn2State, type: btn2Type, size: "medium", onClick: onClickBtn2 })) }), btn1Mode.includes(btnMode) && btn1Text && ((0, jsx_runtime_1.jsx)(components_1.MainButton, { text: btn1Text, state: btn1State, type: btn1Type, size: "medium", onClick: onClickBtn1 }))] })] })] }))] }), container);
61
+ }
62
+ var S_ModalOverlay = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n height: 100vh;\n left: 0;\n position: fixed;\n top: 0;\n width: 100vw;\n\n ", "\n"], ["\n background-color: ", ";\n height: 100vh;\n left: 0;\n position: fixed;\n top: 0;\n width: 100vw;\n\n ", "\n"])), function (_a) {
63
+ var theme = _a.theme;
64
+ return theme.ui_cpnt_modal_dimmed;
65
+ }, animationStyle_1.modalOverlayOnAni);
66
+ var S_ModalWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-shadow: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 80vh;\n left: 50%;\n max-height: 720px;\n min-height: 560px;\n overflow: hidden;\n pointer-events: auto;\n position: fixed;\n top: 50%;\n transform: translate(-50%, -50%);\n width: ", ";\n\n ", "\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 24px;\n box-shadow: ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 80vh;\n left: 50%;\n max-height: 720px;\n min-height: 560px;\n overflow: hidden;\n pointer-events: auto;\n position: fixed;\n top: 50%;\n transform: translate(-50%, -50%);\n width: ", ";\n\n ", "\n"])), function (_a) {
67
+ var theme = _a.theme;
68
+ return theme.ui_cpnt_modal_base;
69
+ }, function (_a) {
70
+ var theme = _a.theme;
71
+ return theme.ui_cpnt_modal_border;
72
+ }, function (_a) {
73
+ var theme = _a.theme;
74
+ return theme.boxShadow.elevation5;
75
+ }, function (_a) {
76
+ var size = _a.size;
77
+ return size &&
78
+ {
79
+ large: '960px',
80
+ medium: '688px'
81
+ }[size];
82
+ }, animationStyle_1.modalOnAni);
83
+ var S_UpsidePanel = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n flex: 1;\n height: 100%;\n overflow: hidden;\n"], ["\n display: flex;\n flex: 1;\n height: 100%;\n overflow: hidden;\n"])));
84
+ var S_LeftPanel = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n min-width: 240px;\n width: 240px;\n"], ["\n display: flex;\n flex-direction: column;\n min-width: 240px;\n width: 240px;\n"])));
85
+ var S_Header = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n background-color: ", ";\n box-sizing: border-box;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"], ["\n background-color: ", ";\n box-sizing: border-box;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"])), function (_a) {
86
+ var theme = _a.theme;
87
+ return theme.ui_cpnt_modalwithtab_leftside_base;
88
+ }, function (_a) {
89
+ var theme = _a.theme;
90
+ return theme.spacing.spacingF;
91
+ }, function (_a) {
92
+ var theme = _a.theme;
93
+ return theme.spacing.spacingE;
94
+ }, function (_a) {
95
+ var theme = _a.theme;
96
+ return theme.spacing.spacingE;
97
+ }, function (_a) {
98
+ var theme = _a.theme;
99
+ return theme.spacing.spacingE;
100
+ });
101
+ var S_SideTabWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-color: ", ";\n flex: 1;\n overflow-y: auto;\n"], ["\n background-color: ", ";\n flex: 1;\n overflow-y: auto;\n"])), function (_a) {
102
+ var theme = _a.theme;
103
+ return theme.ui_cpnt_modalwithtab_leftside_base;
104
+ });
105
+ var S_RightContainer = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n display: flex;\n flex: 1;\n flex-direction: column;\n height: 100%;\n overflow-x: hidden;\n overflow-y: overlay;\n\n ", "\n"], ["\n display: flex;\n flex: 1;\n flex-direction: column;\n height: 100%;\n overflow-x: hidden;\n overflow-y: overlay;\n\n ", "\n"])), scrollbarStyle_1.scrollbarStyle);
106
+ var S_RightArea = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n box-sizing: border-box;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"], ["\n box-sizing: border-box;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"])), function (_a) {
107
+ var theme = _a.theme;
108
+ return theme.spacing.spacingI;
109
+ }, function (_a) {
110
+ var theme = _a.theme;
111
+ return theme.spacing.spacingF;
112
+ }, function (_a) {
113
+ var theme = _a.theme;
114
+ return theme.spacing.spacingF;
115
+ }, function (_a) {
116
+ var theme = _a.theme;
117
+ return theme.spacing.spacingF;
118
+ });
119
+ var S_Body = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n overflow-x: hidden;\n"], ["\n overflow-x: hidden;\n"])));
120
+ var S_Footer = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n border-top: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"], ["\n border-top: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"])), function (_a) {
121
+ var theme = _a.theme;
122
+ return theme.ui_cpnt_modal_border;
123
+ }, function (_a) {
124
+ var theme = _a.theme;
125
+ return theme.spacing.spacingD;
126
+ }, function (_a) {
127
+ var theme = _a.theme;
128
+ return theme.spacing.spacingE;
129
+ }, function (_a) {
130
+ var theme = _a.theme;
131
+ return theme.spacing.spacingE;
132
+ }, function (_a) {
133
+ var theme = _a.theme;
134
+ return theme.spacing.spacingD;
135
+ });
136
+ var S_Left = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n margin-right: ", ";\n"], ["\n margin-right: ", ";\n"])), function (_a) {
137
+ var theme = _a.theme;
138
+ return theme.spacing.spacingB;
139
+ });
140
+ var S_Btn2Wrapper = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n margin-right: ", ";\n"], ["\n margin-right: ", ";\n"])), function (_a) {
141
+ var theme = _a.theme;
142
+ return theme.spacing.spacingB;
143
+ });
144
+ var S_Right = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
145
+ exports.default = DesktopBasicModalWithTab;
146
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
package/dist/src/desktop/panels/DesktopBasicModalWithTab/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export type { DesktopBasicModalWithTabInfoType } from './DesktopBasicModalWithTab';
2
+ export { default as DesktopBasicModalWithTab } from './DesktopBasicModalWithTab';
package/dist/src/desktop/panels/DesktopBasicModalWithTab/index.js ADDED
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.DesktopBasicModalWithTab = void 0;
7
+ var DesktopBasicModalWithTab_1 = require("./DesktopBasicModalWithTab");
8
+ Object.defineProperty(exports, "DesktopBasicModalWithTab", { enumerable: true, get: function () { return __importDefault(DesktopBasicModalWithTab_1).default; } });
package/dist/src/desktop/panels/index.d.ts CHANGED
@@ -1,8 +1,10 @@
1
1
  import { AnnotationSheet } from './AnnotationSheet';
2
2
  import { ContentSheet } from './ContentSheet';
3
3
  import { DesktopBasicModal } from './DesktopBasicModal';
4
+ import { DesktopBasicModalWithTab, DesktopBasicModalWithTabInfoType } from './DesktopBasicModalWithTab';
4
5
  import { DesktopHeadlessModal } from './DesktopHeadlessModal';
5
6
  import { DesktopTutorialModal, DesktopTutorialModalInfoType } from './DesktopTutorialModal';
6
7
  import { SectionSheet } from './SectionSheet';
7
- export { AnnotationSheet, ContentSheet, DesktopBasicModal, DesktopHeadlessModal, DesktopTutorialModal, SectionSheet };
8
+ export { AnnotationSheet, ContentSheet, DesktopBasicModal, DesktopBasicModalWithTab, DesktopHeadlessModal, DesktopTutorialModal, SectionSheet };
9
+ export { DesktopBasicModalWithTabInfoType };
8
10
  export { DesktopTutorialModalInfoType };
package/dist/src/desktop/panels/index.js CHANGED
@@ -1,12 +1,14 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.SectionSheet = exports.DesktopTutorialModal = exports.DesktopHeadlessModal = exports.DesktopBasicModal = exports.ContentSheet = exports.AnnotationSheet = void 0;
3
+ exports.SectionSheet = exports.DesktopTutorialModal = exports.DesktopHeadlessModal = exports.DesktopBasicModalWithTab = exports.DesktopBasicModal = exports.ContentSheet = exports.AnnotationSheet = void 0;
4
4
  var AnnotationSheet_1 = require("./AnnotationSheet");
5
5
  Object.defineProperty(exports, "AnnotationSheet", { enumerable: true, get: function () { return AnnotationSheet_1.AnnotationSheet; } });
6
6
  var ContentSheet_1 = require("./ContentSheet");
7
7
  Object.defineProperty(exports, "ContentSheet", { enumerable: true, get: function () { return ContentSheet_1.ContentSheet; } });
8
8
  var DesktopBasicModal_1 = require("./DesktopBasicModal");
9
9
  Object.defineProperty(exports, "DesktopBasicModal", { enumerable: true, get: function () { return DesktopBasicModal_1.DesktopBasicModal; } });
10
+ var DesktopBasicModalWithTab_1 = require("./DesktopBasicModalWithTab");
11
+ Object.defineProperty(exports, "DesktopBasicModalWithTab", { enumerable: true, get: function () { return DesktopBasicModalWithTab_1.DesktopBasicModalWithTab; } });
10
12
  var DesktopHeadlessModal_1 = require("./DesktopHeadlessModal");
11
13
  Object.defineProperty(exports, "DesktopHeadlessModal", { enumerable: true, get: function () { return DesktopHeadlessModal_1.DesktopHeadlessModal; } });
12
14
  var DesktopTutorialModal_1 = require("./DesktopTutorialModal");
package/dist/src/sub/DynamicLayout/mock_storybook.js CHANGED
@@ -1146,21 +1146,18 @@ exports.SampleSectionsMock = [
1146
1146
  updatedAt: '2023-01-12T08:03:48'
1147
1147
  },
1148
1148
  {
1149
+ display: true,
1149
1150
  type: 'PROGRAMMED',
1150
1151
  program: 'MEMBERSHIP_DISPLAY',
1151
- display: true,
1152
- dynamicLayoutSectionItems: null,
1152
+ dynamicLayoutSectionItems: [],
1153
1153
  id: 6010,
1154
- insertedAt: '2023-01-06T09:05:45',
1155
1154
  manifest: {
1156
1155
  availableProperties: [
1157
1156
  'title',
1158
1157
  'description',
1159
1158
  'button_alpha_label',
1160
1159
  'button_alpha_link_type',
1161
- 'button_alpha_link_src',
1162
- 'section_content_media_type',
1163
- 'section_content_media_src'
1160
+ 'button_alpha_link_src'
1164
1161
  ],
1165
1162
  availableStyles: [
1166
1163
  'title_color_in_hex',
@@ -1179,7 +1176,7 @@ exports.SampleSectionsMock = [
1179
1176
  availableTemplates: ['PRG_MEMBERSHIP_DISPLAY_A', 'PRG_MEMBERSHIP_DISPLAY_B'],
1180
1177
  schema: 'PRG_MEMBERSHIP_DISPLAY'
1181
1178
  },
1182
- order: 10,
1179
+ order: 8,
1183
1180
  properties: {
1184
1181
  buttonAlphaLabel: 'Lorem Ipsum',
1185
1182
  buttonAlphaLinkSrc: 'https://team.publ.space',
@@ -1200,45 +1197,140 @@ exports.SampleSectionsMock = [
1200
1197
  carouselAutoplayTime: 3,
1201
1198
  carouselInfiniteLoopMode: 'NO_USE',
1202
1199
  description: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.",
1203
- itemLinkMethod: 'CLICK_BUTTON_IN_ITEM',
1204
1200
  sectionContentMediaSrc: '',
1205
1201
  sectionContentMediaType: 'IMAGE',
1206
1202
  title: 'Lorem Ipsum',
1207
- multiPurposeUrl: 'https://app.publr.co/'
1203
+ multiPurposeUrl: 'https://app.publr.co/',
1204
+ itemLinkMethod: 'NONE'
1208
1205
  },
1209
1206
  styles: {
1210
- backgroundColorInHex: '#FF1D973B',
1207
+ backgroundColorInHex: '#4A5D78AB',
1211
1208
  backgroundMediaSrc: '',
1212
1209
  backgroundMediaType: 'IMAGE',
1213
1210
  backgroundOverlayColorInHex: '#FFFFFF00',
1214
- buttonAlphaBackgroundColorInHex: '#FFC0CBFF',
1211
+ buttonAlphaBackgroundColorInHex: '#313131FF',
1215
1212
  buttonAlphaDesignType: 'C',
1216
1213
  buttonAlphaLabelColorInHex: '#f5efd9FF',
1217
- buttonBravoBackgroundColorInHex: '#FFC0CBFF',
1214
+ buttonBravoBackgroundColorInHex: '#313131FF',
1218
1215
  buttonBravoDesignType: 'E',
1219
1216
  buttonBravoLabelColorInHex: '#FFFFFFFF',
1220
1217
  buttonCharlieBackgroundColorInHex: '#465FF000',
1221
1218
  buttonCharlieDesignType: 'E',
1222
1219
  buttonCharlieLabelColorInHex: '#FFFFFFFF',
1223
- buttonDeltaBackgroundColorInHex: '#FFC0CBFF',
1220
+ buttonDeltaBackgroundColorInHex: '#313131FF',
1224
1221
  buttonDeltaDesignType: 'A',
1225
1222
  buttonDeltaLabelColorInHex: '#FFFFFFFF',
1226
- buttonEchoBackgroundColorInHex: '#FFC0CBFF',
1223
+ buttonEchoBackgroundColorInHex: '#313131FF',
1227
1224
  buttonEchoDesignType: 'A',
1228
1225
  buttonEchoLabelColorInHex: '#FFFFFFFF',
1229
- descriptionColorInHex: '#FEECD8FF',
1230
- itemButtonBackgroundColorInHex: '#FFC0CBFF',
1226
+ descriptionColorInHex: '#DEECFFA6',
1227
+ itemButtonBackgroundColorInHex: '#313131FF',
1231
1228
  itemButtonDesignType: 'A',
1232
1229
  itemButtonLabelColorInHex: '#FFFFFFFF',
1233
1230
  itemDescriptionColorInHex: '#68686BFF',
1234
1231
  itemTitleColorInHex: '#1E1E20FF',
1235
- itemHighlightingColorInHex: '#FF1D97FF',
1232
+ titleColorInHex: '#DEECFFFF',
1233
+ itemHighlightingColorInHex: '#ff7f50FF',
1236
1234
  itemToneType: 'LIGHT',
1237
- titleColorInHex: '#F8FFACFF',
1238
1235
  programmedItemActionButtonTextType: 'A'
1239
1236
  },
1240
- template: 'PRG_MEMBERSHIP_DISPLAY_B',
1241
- updatedAt: '2023-01-06T09:05:45'
1237
+ template: 'PRG_MEMBERSHIP_DISPLAY_A',
1238
+ programData: {
1239
+ mdid: 'mdid',
1240
+ preview: {
1241
+ availableResources: ['REAL.MEMBERSHIP_DISPLAY'],
1242
+ resources: {
1243
+ mock: {},
1244
+ real: {
1245
+ membershipDisplay: {
1246
+ id: 1,
1247
+ mdid: "MEMBERSHIP_DISPLAY_MD_ID",
1248
+ title: "MEMBERSHIP_DISPLAY_MD_TITLE",
1249
+ isDefault: true,
1250
+ connectedMemberships: Array.from({ length: 6 }, function (_, i) {
1251
+ var alphabet = ['A', 'B', 'C', 'D', 'E', 'F'];
1252
+ var cardImage = [
1253
+ 'https://cdn.dev.publishingkit.net/7f3f7a31-023b-4852-9a11-cbac31d25d93',
1254
+ 'https://cdn.dev.publishingkit.net/c8973261-6c2a-4833-9b9f-20ee355647e4',
1255
+ 'https://cdn.dev.publishingkit.net/8e585c93-9591-4300-ad93-d002560cbeae',
1256
+ 'https://cdn.dev.publishingkit.net/4aaa2811-b3ff-435c-b50a-9486376ab230',
1257
+ 'https://cdn.dev.publishingkit.net/5111c33c-07ba-4b91-8eb6-9975f4cd906a',
1258
+ 'https://cdn.dev.publishingkit.net/16ac0a8a-acb1-465b-960c-6be66f2a04e8.jpg'
1259
+ ];
1260
+ var getOverlayType = function () {
1261
+ if (i % 3 === 1)
1262
+ return 'SOLID';
1263
+ if (i % 3 === 2)
1264
+ return 'GRADIENT';
1265
+ return 'NONE';
1266
+ };
1267
+ var getDesignSchema = function () {
1268
+ if (i % 3 === 1)
1269
+ return 'B';
1270
+ if (i % 3 === 2)
1271
+ return 'C';
1272
+ return 'A';
1273
+ };
1274
+ return {
1275
+ id: i + 1,
1276
+ order: i,
1277
+ mdid: "CONNECTED_MEMBERSHIPS_".concat(alphabet[i], "_MD_ID"),
1278
+ mid: "CONNECTED_MEMBERSHIPS_".concat(alphabet[i], "_M_ID"),
1279
+ membership: {
1280
+ id: i + 1,
1281
+ type: 'GENERAL',
1282
+ mid: "MEMBERSHIP_".concat(alphabet[i], "_MID"),
1283
+ title: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
1284
+ insertedAt: '2023-01-06T09:05:45',
1285
+ updatedAt: '2023-01-06T09:05:45',
1286
+ membershipCardTemplate: {
1287
+ backgroundImageSrc: cardImage[i],
1288
+ logoImageSrc: 'https://publ-upload-local.s3.ap-northeast-2.amazonaws.com/e11d1a92-a1c0-4faa-b341-13a32f21828d_image',
1289
+ overlayType: getOverlayType(),
1290
+ overlayColorPrimary: '#FFC0CB49',
1291
+ overlayColorSecondary: '#31313149',
1292
+ designSchema: getDesignSchema()
1293
+ },
1294
+ membershipBenefitInfo: {
1295
+ benefitAlpha: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
1296
+ benefitBravo: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
1297
+ benefitCharlie: '청춘이 황금시대를 우리의 같은 무엇을 쓸쓸한 돋고, 장식하는 칼이다. 동산에는 투명하되!',
1298
+ benefitDelta: 'Lorem ipsum dolor sit amet. Et magnam molestiae.',
1299
+ benefitEcho: 'Lorem ipsum dolor sit amet. Et magnam molestiae.'
1300
+ },
1301
+ totalSubscriptionProducts: 3
1302
+ },
1303
+ connectedSubscriptionProducts: Array.from({ length: 1 }, function () {
1304
+ return {
1305
+ id: i + 1,
1306
+ order: i,
1307
+ connectedMembershipId: i + 1,
1308
+ subscriptionProductId: i + 1,
1309
+ subscriptionProduct: {
1310
+ id: i + 1,
1311
+ type: 'COUPON_ONCE_FINITE',
1312
+ title: '청춘이 황금시대를 우리의 같은 무엇을',
1313
+ alias: "CONNECTED_SUBSCRIPTION_PRODUCTS_".concat(alphabet[i], "_ALIAS"),
1314
+ expiryPeriodInDays: 7,
1315
+ isDeactivated: i % 2 === 0,
1316
+ fee: {
1317
+ currency: 'KRW',
1318
+ amount: 10000
1319
+ },
1320
+ insertedAt: '2023-01-06T09:05:45',
1321
+ updatedAt: '2023-01-06T09:05:45'
1322
+ }
1323
+ };
1324
+ })
1325
+ };
1326
+ })
1327
+ }
1328
+ }
1329
+ }
1330
+ }
1331
+ },
1332
+ insertedAt: '2023-01-30T10:24:35',
1333
+ updatedAt: '2023-01-30T10:24:35'
1242
1334
  }
1243
1335
  ];
1244
1336
  var MembershipSectionsMock = function (templateType) { return [
package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/templates/TemplateA/mobile/components/SectionContents.js CHANGED
@@ -30,7 +30,7 @@ function SectionContents() {
30
30
  }
31
31
  var _a = section.styles, buttonAlphaBackgroundColorInHex = _a.buttonAlphaBackgroundColorInHex, buttonAlphaLabelColorInHex = _a.buttonAlphaLabelColorInHex, buttonAlphaDesignType = _a.buttonAlphaDesignType, descriptionColorInHex = _a.descriptionColorInHex, titleColorInHex = _a.titleColorInHex;
32
32
  var _b = section.properties, title = _b.title, description = _b.description, buttonAlphaLabel = _b.buttonAlphaLabel, buttonAlphaLinkSrc = _b.buttonAlphaLinkSrc, buttonAlphaLinkType = _b.buttonAlphaLinkType;
33
- return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySectionData: !title && !description && !buttonAlphaLinkSrc }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Title, { text: title, textAlign: "center", color: titleColorInHex, styleTheme: "headingBold" })), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Description, { text: description, textAlign: "center", color: descriptionColorInHex, styleTheme: "body1Regular" }) })), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }) }))] })));
33
+ return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySectionData: !title && !description && !buttonAlphaLinkSrc }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Title, { text: title, color: titleColorInHex, textAlign: "center", customFontSize: "32px", customFontWeight: "bold", lineHeight: 1.3 })), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Description, { text: description, color: descriptionColorInHex, textAlign: "center", customFontSize: "18px", fontWeight: "600" }) })), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }) }))] })));
34
34
  }
35
35
  var S_SectionDataBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-bottom: ", ";\n"], ["\n margin-bottom: ", ";\n"])), function (_a) {
36
36
  var isEmptySectionData = _a.isEmptySectionData, theme = _a.theme;
package/dist/src/sub/DynamicLayout/sections/MembershipSection/NormalType/templates/TemplateB/mobile/components/SectionContents.js CHANGED
@@ -30,7 +30,7 @@ function SectionContents() {
30
30
  }
31
31
  var _a = section.styles, buttonAlphaBackgroundColorInHex = _a.buttonAlphaBackgroundColorInHex, buttonAlphaLabelColorInHex = _a.buttonAlphaLabelColorInHex, buttonAlphaDesignType = _a.buttonAlphaDesignType, descriptionColorInHex = _a.descriptionColorInHex, titleColorInHex = _a.titleColorInHex;
32
32
  var _b = section.properties, title = _b.title, description = _b.description, buttonAlphaLabel = _b.buttonAlphaLabel, buttonAlphaLinkSrc = _b.buttonAlphaLinkSrc, buttonAlphaLinkType = _b.buttonAlphaLinkType;
33
- return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySectionData: !title && !description && !buttonAlphaLinkSrc }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Title, { text: title, textAlign: "center", color: titleColorInHex, styleTheme: "headingBold" })), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Description, { text: description, textAlign: "center", color: descriptionColorInHex, styleTheme: "body1Regular" }) })), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }) }))] })));
33
+ return ((0, jsx_runtime_1.jsxs)(S_SectionDataBox, __assign({ isEmptySectionData: !title && !description && !buttonAlphaLinkSrc }, { children: [title && ((0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Title, { text: title, color: titleColorInHex, textAlign: "center", customFontSize: "32px", customFontWeight: "bold", lineHeight: 1.3 })), description && ((0, jsx_runtime_1.jsx)(S_DescriptionWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.Description, { text: description, color: descriptionColorInHex, textAlign: "center", customFontSize: "18px", fontWeight: "600" }) })), buttonAlphaLinkSrc && ((0, jsx_runtime_1.jsx)(S_ButtonWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.M_MembershipSectionItem.DesignedSectionButton, { buttonType: buttonAlphaDesignType, text: buttonAlphaLabel, linkType: buttonAlphaLinkType, src: buttonAlphaLinkSrc, textColor: buttonAlphaLabelColorInHex, backgroundColor: buttonAlphaBackgroundColorInHex, borderColor: buttonAlphaLabelColorInHex }) }))] })));
34
34
  }
35
35
  var S_SectionDataBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-bottom: ", ";\n"], ["\n margin-bottom: ", ";\n"])), function (_a) {
36
36
  var isEmptySectionData = _a.isEmptySectionData, theme = _a.theme;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "2.1.27",
3
+ "version": "2.1.28-alpha.0",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,7 +1,6 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v2.1.27]
3
- ## daily|https://design.storybook.publ.biz/
2
+ ## [v2.1.28-alpha.0]
3
+ ## alpha|https://design.storybook.publ.biz/
4
4
 
5
- ### Component
6
- * D_UploadIconButton
7
- * disabled상태일때 hover와 active시에 색상 변화가 없도록 수정
5
+ ### Panel
6
+ * DesktopBasicModalWithTab 생성