pds-dev-kit-web-test 0.0.26 → 0.0.27

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 (57) hide show
  1. package/dist/src/common/styles/colorSet/PaletteColor_Dark.json +13 -1
  2. package/dist/src/common/styles/colorSet/PaletteColor_light.json +13 -1
  3. package/dist/src/common/styles/colorSet/SemanticColor.json +5 -1
  4. package/dist/src/common/styles/colorSet/UIColor.json +21 -4
  5. package/dist/src/common/styles/colorSet/index.d.ts +45 -0
  6. package/dist/src/common/styles/colorSet/ui-type.d.ts +17 -0
  7. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/ContentsContainer.js +1 -1
  8. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFA.d.ts +1 -2
  9. package/dist/src/desktop/layout/LayoutWF/Containers/ContentsContainer/variation/WFA.js +27 -12
  10. package/dist/src/desktop/layout/LayoutWF/Containers/PageMenuContainer/PageMenuContainer.d.ts +1 -1
  11. package/dist/src/desktop/layout/LayoutWF/Containers/PageMenuContainer/PageMenuContainer.js +2 -1
  12. package/dist/src/desktop/layout/LayoutWF/Containers/PageMenuContainer/variation/WizardPageMenu.d.ts +6 -0
  13. package/dist/src/desktop/layout/LayoutWF/Containers/PageMenuContainer/variation/WizardPageMenu.js +22 -0
  14. package/dist/src/desktop/layout/LayoutWF/Containers/PageMenuContainer/variation/index.d.ts +1 -0
  15. package/dist/src/desktop/layout/LayoutWF/Containers/PageMenuContainer/variation/index.js +3 -1
  16. package/dist/src/desktop/layout/LayoutWF/Containers/StepContainer/StepContainer.d.ts +7 -0
  17. package/dist/src/desktop/layout/LayoutWF/Containers/StepContainer/StepContainer.js +14 -0
  18. package/dist/src/desktop/layout/LayoutWF/Containers/StepContainer/index.d.ts +1 -0
  19. package/dist/src/desktop/layout/LayoutWF/Containers/StepContainer/index.js +8 -0
  20. package/dist/src/desktop/layout/LayoutWF/Containers/StepContainer/variation/Step.d.ts +6 -0
  21. package/dist/src/desktop/layout/LayoutWF/Containers/StepContainer/variation/Step.js +22 -0
  22. package/dist/src/desktop/layout/LayoutWF/Containers/StepContainer/variation/index.d.ts +1 -0
  23. package/dist/src/desktop/layout/LayoutWF/Containers/StepContainer/variation/index.js +8 -0
  24. package/dist/src/desktop/layout/LayoutWF/ContainersBox/ContainersBox.js +90 -54
  25. package/dist/src/desktop/panels/DesktopHeadlessModal/DesktopHeadlessModal.js +1 -1
  26. package/dist/src/sub/DynamicLayout/components/Section/Section.js +9 -11
  27. package/dist/src/sub/DynamicLayout/components/YouTubeIframe/YouTubeIframe.js +39 -4
  28. package/dist/src/sub/DynamicLayout/hooks/index.d.ts +1 -0
  29. package/dist/src/sub/DynamicLayout/hooks/index.js +5 -0
  30. package/dist/src/sub/DynamicLayout/hooks/usePrevious/index.d.ts +1 -0
  31. package/dist/src/sub/DynamicLayout/hooks/usePrevious/index.js +8 -0
  32. package/dist/src/sub/DynamicLayout/hooks/usePrevious/usePrevious.d.ts +15 -0
  33. package/dist/src/sub/DynamicLayout/hooks/usePrevious/usePrevious.js +25 -0
  34. package/dist/src/sub/DynamicLayout/sections/ContentsCarouselSection/ContentsCarouselSection.js +10 -2
  35. package/dist/src/sub/DynamicLayout/sections/ContentsSection/ContentsSection.js +10 -2
  36. package/dist/src/sub/DynamicLayout/sections/FooterSection/FooterSection.js +10 -2
  37. package/dist/src/sub/DynamicLayout/sections/InfoBoxSection/InfoBoxSection.js +10 -2
  38. package/dist/src/sub/DynamicLayout/sections/IntroSection/IntroSection.js +10 -2
  39. package/dist/storybook-static/{0.1e64cc00.iframe.bundle.d.ts → 0.ade47ed3.iframe.bundle.d.ts} +0 -0
  40. package/dist/storybook-static/{0.1e64cc00.iframe.bundle.js → 0.ade47ed3.iframe.bundle.js} +8 -8
  41. package/dist/storybook-static/{4.08a6743e.iframe.bundle.d.ts → 4.93bcde3d.iframe.bundle.d.ts} +0 -0
  42. package/dist/storybook-static/{4.08a6743e.iframe.bundle.js → 4.93bcde3d.iframe.bundle.js} +71 -71
  43. package/dist/storybook-static/{5.fd119510.iframe.bundle.d.ts → 5.ea6583af.iframe.bundle.d.ts} +0 -0
  44. package/dist/storybook-static/{5.fd119510.iframe.bundle.js → 5.ea6583af.iframe.bundle.js} +12 -12
  45. package/dist/storybook-static/{6.ed855029.iframe.bundle.d.ts → 6.e40cb5e6.iframe.bundle.d.ts} +0 -0
  46. package/dist/storybook-static/{6.ed855029.iframe.bundle.js → 6.e40cb5e6.iframe.bundle.js} +6 -6
  47. package/dist/storybook-static/{7.acdfc1e4.iframe.bundle.d.ts → 7.a63b16b9.iframe.bundle.d.ts} +0 -0
  48. package/dist/storybook-static/{7.acdfc1e4.iframe.bundle.js → 7.a63b16b9.iframe.bundle.js} +3 -3
  49. package/dist/storybook-static/main.997ab4f6.iframe.bundle.d.ts +3124 -0
  50. package/dist/storybook-static/{main.3a848f92.iframe.bundle.js → main.997ab4f6.iframe.bundle.js} +1812 -1718
  51. package/dist/storybook-static/{runtime~main.c94cafde.iframe.bundle.d.ts → runtime~main.a437dbd3.iframe.bundle.d.ts} +0 -0
  52. package/dist/storybook-static/{runtime~main.c94cafde.iframe.bundle.js → runtime~main.a437dbd3.iframe.bundle.js} +1 -1
  53. package/dist/storybook-static/{vendors~main.6ff7334c.iframe.bundle.d.ts → vendors~main.7bb94765.iframe.bundle.d.ts} +0 -0
  54. package/dist/storybook-static/{vendors~main.6ff7334c.iframe.bundle.js → vendors~main.7bb94765.iframe.bundle.js} +590 -590
  55. package/package.json +1 -1
  56. package/release-note.md +3 -2
  57. package/dist/storybook-static/main.3a848f92.iframe.bundle.d.ts +0 -1124
@@ -237,5 +237,17 @@
237
237
  "sys_transition_test_text_field_active": "test04",
238
238
  "sys_transition_test_main_button_secondary_hover": "white/opacity05",
239
239
  "sys_transition_test_main_button_secondary_active": "white/opacity15",
240
- "sys_component_base_23": "darkgrey30"
240
+ "sys_component_base_23": "darkgrey100/opacity65",
241
+ "sys_component_base_darkgreen": "darkgreen700",
242
+ "sys_component_base_24": "black/opacity80",
243
+ "sys_border_line_15": "white/opacity80",
244
+ "sys_border_line_16": "black/opacity80",
245
+ "sys_component_base_hover_01": "darkgrey30",
246
+ "sys_component_on_base_01": "white/opacity20",
247
+ "sys_component_on_base_02": "grey950/opacity15",
248
+ "sys_component_on_base_03": "grey950/opacity05",
249
+ "sys_component_on_base_04": "darkgrey80",
250
+ "sys_component_on_base_05": "darkgrey200",
251
+ "sys_component_base_hover_02": "darkgrey80",
252
+ "sys_component_base_pressed_01": "darkgrey200"
241
253
  }
@@ -237,5 +237,17 @@
237
237
  "sys_transition_test_text_field_active": "test02",
238
238
  "sys_transition_test_main_button_secondary_hover": "grey950/opacity05",
239
239
  "ui_transition_test_main_button_secondary_active": "grey950/opacity15",
240
- "sys_component_base_23": "grey30"
240
+ "sys_component_base_23": "darkgrey100/opacity65",
241
+ "sys_component_base_darkgreen": "darkgreen700",
242
+ "sys_component_base_24": "black/opacity80",
243
+ "sys_border_line_15": "white/opacity80",
244
+ "sys_border_line_16": "black/opacity80",
245
+ "sys_component_base_hover_01": "grey30",
246
+ "sys_component_on_base_01": "white/opacity20",
247
+ "sys_component_on_base_02": "grey950/opacity15",
248
+ "sys_component_on_base_03": "grey950/opacity05",
249
+ "sys_component_on_base_04": "grey80",
250
+ "sys_component_on_base_05": "grey200",
251
+ "sys_component_base_hover_02": "grey80",
252
+ "sys_component_base_pressed_01": "grey200"
241
253
  }
@@ -82,5 +82,9 @@
82
82
  "test01": "#E9E9EC",
83
83
  "test02": "#D3D3D6",
84
84
  "test03": "#282829",
85
- "test04": "#3E3E3F"
85
+ "test04": "#3E3E3F",
86
+ "grey80": "#E9E9EC",
87
+ "grey200": "#D3D3D6",
88
+ "darkgrey80": "#282829",
89
+ "darkgrey200": "#3E3E3F"
86
90
  }
@@ -2,8 +2,8 @@
2
2
  "ui_cpnt_button_fill_base_primary": "usr_brand_primary",
3
3
  "ui_cpnt_button_fill_base_default": "sys_component_base_01",
4
4
  "ui_cpnt_button_fill_base_white": "sys_component_base_02",
5
- "ui_cpnt_button_fill_on_base_hover": "sys_on_base_white_opacity10",
6
- "ui_cpnt_button_fill_on_base_pressed": "sys_on_base_black_opacity10",
5
+ "ui_cpnt_button_fill_on_base_hover": "sys_component_on_base_01",
6
+ "ui_cpnt_button_fill_on_base_pressed": "sys_component_on_base_02",
7
7
  "ui_cpnt_button_fill_base_disabled": "sys_component_base_03",
8
8
  "ui_cpnt_button_line_base_pressed": "sys_component_base_03",
9
9
  "ui_cpnt_button_line_base_hover": "sys_component_base_01",
@@ -192,7 +192,7 @@
192
192
  "ui_cpnt_datatable_text_textbutton": "sys_text_brand_primary",
193
193
  "ui_cpnt_datatable_text_active": "sys_text_active",
194
194
  "ui_cpnt_datatable_base_default": "sys_component_base_white_opacity00",
195
- "ui_cpnt_datatable_base_hover": "sys_component_base_23",
195
+ "ui_cpnt_datatable_base_hover": "sys_component_base_hover_01",
196
196
  "ui_cpnt_datatable_text_inactive": "sys_text_grey_03",
197
197
  "ui_cpnt_datatable_bulkaction_base": "sys_widget_black",
198
198
  "ui_cpnt_datatable_icon_01": "sys_widget_white",
@@ -654,5 +654,22 @@
654
654
  "ui_transition_test_text_field_hover": "sys_transition_test_text_field_hover",
655
655
  "ui_transition_test_text_field_active": "sys_transition_test_text_field_active",
656
656
  "ui_transition_test_main_button_secondary_hover": "sys_transition_test_main_button_secondary_hover",
657
- "ui_transition_test_main_button_secondary_active": "sys_transition_test_main_button_secondary_active"
657
+ "ui_transition_test_main_button_secondary_active": "sys_transition_test_main_button_secondary_active",
658
+ "ui_69": "sys_component_base_darkgreen",
659
+ "ui_cpnt_divider_white_02": "sys_component_base_20",
660
+ "ui_cpnt_list_chatbubble_base_brand_primary": "usr_brand_primary",
661
+ "ui_cpnt_list_chatbubble_base_grey": "sys_component_base_01",
662
+ "ui_cpnt_list_chatbubble_base_translucent_white": "sys_component_base_20",
663
+ "ui_cpnt_list_chatbubble_base_translucent_black": "sys_component_base_24",
664
+ "ui_avatar_border_translucent_white": "sys_border_line_15",
665
+ "ui_avatar_border_translucent_black": "sys_border_line_16",
666
+ "ui_cpnt_textfield_base_hover": "sys_component_base_hover_02",
667
+ "ui_cpnt_textfield_base_pressed": "sys_component_base_pressed_01",
668
+ "ui_cpnt_button_secondary_on_base_hover": "sys_component_on_base_03",
669
+ "ui_cpnt_button_secondary_on_base_pressed": "sys_component_on_base_02",
670
+ "ui_cpnt_select_base_hover": "sys_component_base_hover_02",
671
+ "ui_cpnt_select_base_pressed": "sys_component_base_pressed_01",
672
+ "ui_cpnt_dropdown_base_hover": "sys_component_base_hover_02",
673
+ "ui_cpnt_dropdown_base_pressed": "sys_component_base_pressed_01",
674
+ "ui_cpnt_sheet_base_09": "sys_component_base_orange"
658
675
  }
@@ -84,6 +84,10 @@ declare const colorSet: {
84
84
  test02: string;
85
85
  test03: string;
86
86
  test04: string;
87
+ grey80: string;
88
+ grey200: string;
89
+ darkgrey80: string;
90
+ darkgrey200: string;
87
91
  };
88
92
  readonly PaletteColor_light: {
89
93
  sys_container_background_01: string;
@@ -325,6 +329,18 @@ declare const colorSet: {
325
329
  sys_transition_test_main_button_secondary_hover: string;
326
330
  ui_transition_test_main_button_secondary_active: string;
327
331
  sys_component_base_23: string;
332
+ sys_component_base_darkgreen: string;
333
+ sys_component_base_24: string;
334
+ sys_border_line_15: string;
335
+ sys_border_line_16: string;
336
+ sys_component_base_hover_01: string;
337
+ sys_component_on_base_01: string;
338
+ sys_component_on_base_02: string;
339
+ sys_component_on_base_03: string;
340
+ sys_component_on_base_04: string;
341
+ sys_component_on_base_05: string;
342
+ sys_component_base_hover_02: string;
343
+ sys_component_base_pressed_01: string;
328
344
  };
329
345
  readonly UIColor: {
330
346
  ui_cpnt_button_fill_base_primary: string;
@@ -983,6 +999,23 @@ declare const colorSet: {
983
999
  ui_transition_test_text_field_active: string;
984
1000
  ui_transition_test_main_button_secondary_hover: string;
985
1001
  ui_transition_test_main_button_secondary_active: string;
1002
+ ui_69: string;
1003
+ ui_cpnt_divider_white_02: string;
1004
+ ui_cpnt_list_chatbubble_base_brand_primary: string;
1005
+ ui_cpnt_list_chatbubble_base_grey: string;
1006
+ ui_cpnt_list_chatbubble_base_translucent_white: string;
1007
+ ui_cpnt_list_chatbubble_base_translucent_black: string;
1008
+ ui_avatar_border_translucent_white: string;
1009
+ ui_avatar_border_translucent_black: string;
1010
+ ui_cpnt_textfield_base_hover: string;
1011
+ ui_cpnt_textfield_base_pressed: string;
1012
+ ui_cpnt_button_secondary_on_base_hover: string;
1013
+ ui_cpnt_button_secondary_on_base_pressed: string;
1014
+ ui_cpnt_select_base_hover: string;
1015
+ ui_cpnt_select_base_pressed: string;
1016
+ ui_cpnt_dropdown_base_hover: string;
1017
+ ui_cpnt_dropdown_base_pressed: string;
1018
+ ui_cpnt_sheet_base_09: string;
986
1019
  };
987
1020
  readonly PaletteColor_Dark: {
988
1021
  sys_container_background_01: string;
@@ -1224,6 +1257,18 @@ declare const colorSet: {
1224
1257
  sys_transition_test_main_button_secondary_hover: string;
1225
1258
  sys_transition_test_main_button_secondary_active: string;
1226
1259
  sys_component_base_23: string;
1260
+ sys_component_base_darkgreen: string;
1261
+ sys_component_base_24: string;
1262
+ sys_border_line_15: string;
1263
+ sys_border_line_16: string;
1264
+ sys_component_base_hover_01: string;
1265
+ sys_component_on_base_01: string;
1266
+ sys_component_on_base_02: string;
1267
+ sys_component_on_base_03: string;
1268
+ sys_component_on_base_04: string;
1269
+ sys_component_on_base_05: string;
1270
+ sys_component_base_hover_02: string;
1271
+ sys_component_base_pressed_01: string;
1227
1272
  };
1228
1273
  };
1229
1274
  export default colorSet;
@@ -655,4 +655,21 @@ export interface UITheme {
655
655
  ui_transition_test_text_field_active: string;
656
656
  ui_transition_test_main_button_secondary_hover: string;
657
657
  ui_transition_test_main_button_secondary_active: string;
658
+ ui_69: string;
659
+ ui_cpnt_divider_white_02: string;
660
+ ui_cpnt_list_chatbubble_base_brand_primary: string;
661
+ ui_cpnt_list_chatbubble_base_grey: string;
662
+ ui_cpnt_list_chatbubble_base_translucent_white: string;
663
+ ui_cpnt_list_chatbubble_base_translucent_black: string;
664
+ ui_avatar_border_translucent_white: string;
665
+ ui_avatar_border_translucent_black: string;
666
+ ui_cpnt_textfield_base_hover: string;
667
+ ui_cpnt_textfield_base_pressed: string;
668
+ ui_cpnt_button_secondary_on_base_hover: string;
669
+ ui_cpnt_button_secondary_on_base_pressed: string;
670
+ ui_cpnt_select_base_hover: string;
671
+ ui_cpnt_select_base_pressed: string;
672
+ ui_cpnt_dropdown_base_hover: string;
673
+ ui_cpnt_dropdown_base_pressed: string;
674
+ ui_cpnt_sheet_base_09: string;
658
675
  }
@@ -8,7 +8,7 @@ var variation_1 = require("./variation");
8
8
  var ContentsContainer = function (_a) {
9
9
  var stepContent = _a.stepContent, content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
10
10
  return (react_1.default.createElement(react_1.default.Fragment, null, {
11
- WFA_1: (react_1.default.createElement(variation_1.WFA, { stepContent: stepContent, content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
11
+ WFA_1: (react_1.default.createElement(variation_1.WFA, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
12
12
  WFB_1: (react_1.default.createElement(variation_1.WFB, { stepContent: stepContent, content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
13
13
  WFC_1: (react_1.default.createElement(variation_1.WFC, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
14
14
  WFD_1: (react_1.default.createElement(variation_1.WFD, { layoutType: "WFD_1", content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1 })),
@@ -1,10 +1,9 @@
1
1
  /// <reference types="react" />
2
2
  export declare type WFAProps = {
3
- stepContent?: JSX.Element;
4
3
  content1?: JSX.Element;
5
4
  containerColor?: string;
6
5
  areaColor?: string;
7
6
  isLoadingContainer1?: boolean;
8
7
  };
9
- declare const WFA: ({ stepContent, content1, containerColor, areaColor, isLoadingContainer1 }: WFAProps) => JSX.Element;
8
+ declare const WFA: ({ content1, containerColor, areaColor, isLoadingContainer1 }: WFAProps) => JSX.Element;
10
9
  export default WFA;
@@ -3,36 +3,51 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
3
3
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
4
  return cooked;
5
5
  };
6
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
+ if (k2 === undefined) k2 = k;
8
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
6
25
  var __importDefault = (this && this.__importDefault) || function (mod) {
7
26
  return (mod && mod.__esModule) ? mod : { "default": mod };
8
27
  };
9
28
  Object.defineProperty(exports, "__esModule", { value: true });
10
29
  var react_1 = __importDefault(require("react"));
11
- var styled_components_1 = __importDefault(require("styled-components"));
30
+ var styled_components_1 = __importStar(require("styled-components"));
12
31
  var components_1 = require("../../../../../../common/components");
13
32
  var WFA = function (_a) {
14
- var stepContent = _a.stepContent, content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
33
+ var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
15
34
  return (react_1.default.createElement(react_1.default.Fragment, null,
16
35
  react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WFA", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(react_1.default.Fragment, null,
17
36
  react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WFA", areaColor: areaColor },
18
37
  react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "desktop", "x-pds-layout-type": "WFA" }, content1)))))));
19
38
  };
20
- var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: flex-start;\n background-color: ", ";\n display: flex;\n height: 100%;\n justify-content: center;\n overflow-x: hidden;\n overflow-y: auto;\n ", ";\n"], ["\n align-items: flex-start;\n background-color: ", ";\n display: flex;\n height: 100%;\n justify-content: center;\n overflow-x: hidden;\n overflow-y: auto;\n ", ";\n"])), function (_a) {
39
+ var scrollVisible = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ::-webkit-scrollbar-thumb {\n background-color: #e3e5e9;\n border-radius: 3px;\n }\n\n ::-webkit-scrollbar-track {\n margin-top: 24px;\n margin-bottom: 24px;\n }\n\n ::-webkit-scrollbar {\n display: block;\n width: 6px;\n }\n"], ["\n ::-webkit-scrollbar-thumb {\n background-color: #e3e5e9;\n border-radius: 3px;\n }\n\n ::-webkit-scrollbar-track {\n margin-top: 24px;\n margin-bottom: 24px;\n }\n\n ::-webkit-scrollbar {\n display: block;\n width: 6px;\n }\n"])));
40
+ var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: flex-start;\n background-color: ", ";\n display: flex;\n height: 60vh;\n justify-content: center;\n width: 864px;\n overflow-x: hidden;\n overflow-y: auto;\n border-radius: 24px;\n ", ";\n\n ", "\n"], ["\n align-items: flex-start;\n background-color: ", ";\n display: flex;\n height: 60vh;\n justify-content: center;\n width: 864px;\n overflow-x: hidden;\n overflow-y: auto;\n border-radius: 24px;\n ", ";\n\n ", "\n"])), function (_a) {
21
41
  var theme = _a.theme;
22
42
  return theme.ui_temp_white;
23
43
  }, function (_a) {
24
44
  var containerColor = _a.containerColor;
25
45
  return "background-color: " + containerColor;
26
- });
27
- var S_StepArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n box-sizing: border-box;\n min-width: 240px;\n padding-bottom: 88px;\n padding-top: 48px;\n width: 240px;\n ", ";\n"], ["\n box-sizing: border-box;\n min-width: 240px;\n padding-bottom: 88px;\n padding-top: 48px;\n width: 240px;\n ", ";\n"])), function (_a) {
28
- var areaColor = _a.areaColor;
29
- return "background-color: " + areaColor;
30
- });
31
- var S_StepContent = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
32
- var S_ContentsArea = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n box-sizing: border-box;\n padding-bottom: 88px;\n ", ";\n"], ["\n box-sizing: border-box;\n padding-bottom: 88px;\n ", ";\n"])), function (_a) {
46
+ }, scrollVisible);
47
+ var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n box-sizing: border-box;\n padding-top: 80px;\n padding-bottom: 88px;\n width: 432px;\n ", ";\n"], ["\n box-sizing: border-box;\n padding-top: 80px;\n padding-bottom: 88px;\n width: 432px;\n ", ";\n"])), function (_a) {
33
48
  var areaColor = _a.areaColor;
34
49
  return "background-color: " + areaColor;
35
50
  });
36
- var S_Content1 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n max-width: 900px;\n min-width: 512px;\n"], ["\n max-width: 900px;\n min-width: 512px;\n"])));
51
+ var S_Content1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
37
52
  exports.default = WFA;
38
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
53
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  export declare type PageMenuContainerProps = {
3
- pageMenuType?: 'page_menu';
3
+ pageMenuType?: 'page_menu' | 'wizard_page_menu';
4
4
  pageMenuContent?: JSX.Element;
5
5
  };
6
6
  declare const PageMenuContainer: ({ pageMenuType, pageMenuContent }: PageMenuContainerProps) => JSX.Element;
@@ -8,7 +8,8 @@ var variation_1 = require("./variation");
8
8
  var PageMenuContainer = function (_a) {
9
9
  var _b = _a.pageMenuType, pageMenuType = _b === void 0 ? 'page_menu' : _b, pageMenuContent = _a.pageMenuContent;
10
10
  return (react_1.default.createElement(react_1.default.Fragment, null, {
11
- page_menu: react_1.default.createElement(variation_1.PageMenu, { pageMenuContent: pageMenuContent })
11
+ page_menu: react_1.default.createElement(variation_1.PageMenu, { pageMenuContent: pageMenuContent }),
12
+ wizard_page_menu: react_1.default.createElement(variation_1.WizardPageMenu, { pageMenuContent: pageMenuContent })
12
13
  }[pageMenuType]));
13
14
  };
14
15
  exports.default = PageMenuContainer;
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ export declare type PageMenuProps = {
3
+ pageMenuContent?: JSX.Element;
4
+ };
5
+ declare const WizardPageMenu: ({ pageMenuContent }: PageMenuProps) => JSX.Element;
6
+ export default WizardPageMenu;
@@ -0,0 +1,22 @@
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 __importDefault = (this && this.__importDefault) || function (mod) {
7
+ return (mod && mod.__esModule) ? mod : { "default": mod };
8
+ };
9
+ Object.defineProperty(exports, "__esModule", { value: true });
10
+ var react_1 = __importDefault(require("react"));
11
+ var styled_components_1 = __importDefault(require("styled-components"));
12
+ var WizardPageMenu = function (_a) {
13
+ var pageMenuContent = _a.pageMenuContent;
14
+ return (react_1.default.createElement(S_PageMenuContainer, { "x-pds-name": "PageMenuContainer", "x-pds-element-type": "layout", "x-pds-device-type": "desktop" },
15
+ react_1.default.createElement(S_PageMenuArea, { "x-pds-name": "PageMenuArea", "x-pds-element-type": "layout", "x-pds-device-type": "desktop" },
16
+ react_1.default.createElement(S_PageMenuContent, { "x-pds-name": "PageMenuContent", "x-pds-element-type": "layout", "x-pds-device-type": "desktop" }, pageMenuContent))));
17
+ };
18
+ var S_PageMenuContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 128px;\n"], ["\n height: 128px;\n"])));
19
+ var S_PageMenuArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n padding-bottom: 32px;\n"], ["\n padding-bottom: 32px;\n"])));
20
+ var S_PageMenuContent = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n height: 96px;\n width: 864px;\n overflow: hidden;\n"], ["\n height: 96px;\n width: 864px;\n overflow: hidden;\n"])));
21
+ exports.default = WizardPageMenu;
22
+ var templateObject_1, templateObject_2, templateObject_3;
@@ -1 +1,2 @@
1
1
  export { default as PageMenu } from './PageMenu';
2
+ export { default as WizardPageMenu } from './WizardPageMenu';
@@ -3,6 +3,8 @@ 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.PageMenu = void 0;
6
+ exports.WizardPageMenu = exports.PageMenu = void 0;
7
7
  var PageMenu_1 = require("./PageMenu");
8
8
  Object.defineProperty(exports, "PageMenu", { enumerable: true, get: function () { return __importDefault(PageMenu_1).default; } });
9
+ var WizardPageMenu_1 = require("./WizardPageMenu");
10
+ Object.defineProperty(exports, "WizardPageMenu", { enumerable: true, get: function () { return __importDefault(WizardPageMenu_1).default; } });
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ export declare type StepContainerProps = {
3
+ stepType?: 'step';
4
+ stepContent?: JSX.Element;
5
+ };
6
+ declare const StepContainer: ({ stepType, stepContent }: StepContainerProps) => JSX.Element;
7
+ export default StepContainer;
@@ -0,0 +1,14 @@
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
+ var react_1 = __importDefault(require("react"));
7
+ var variation_1 = require("./variation");
8
+ var StepContainer = function (_a) {
9
+ var _b = _a.stepType, stepType = _b === void 0 ? 'step' : _b, stepContent = _a.stepContent;
10
+ return (react_1.default.createElement(react_1.default.Fragment, null, {
11
+ step: react_1.default.createElement(variation_1.Step, { stepContent: stepContent })
12
+ }[stepType]));
13
+ };
14
+ exports.default = StepContainer;
@@ -0,0 +1 @@
1
+ export { default as StepContainer } from './StepContainer';
@@ -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.StepContainer = void 0;
7
+ var StepContainer_1 = require("./StepContainer");
8
+ Object.defineProperty(exports, "StepContainer", { enumerable: true, get: function () { return __importDefault(StepContainer_1).default; } });
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ export declare type StepProps = {
3
+ stepContent?: JSX.Element;
4
+ };
5
+ declare const Step: ({ stepContent }: StepProps) => JSX.Element;
6
+ export default Step;
@@ -0,0 +1,22 @@
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 __importDefault = (this && this.__importDefault) || function (mod) {
7
+ return (mod && mod.__esModule) ? mod : { "default": mod };
8
+ };
9
+ Object.defineProperty(exports, "__esModule", { value: true });
10
+ var react_1 = __importDefault(require("react"));
11
+ var styled_components_1 = __importDefault(require("styled-components"));
12
+ var Step = function (_a) {
13
+ var stepContent = _a.stepContent;
14
+ return (react_1.default.createElement(S_StepContainer, { "x-pds-name": "StepContainer", "x-pds-element-type": "layout", "x-pds-device-type": "desktop" },
15
+ react_1.default.createElement(S_StepArea, { "x-pds-name": "StepArea", "x-pds-element-type": "layout", "x-pds-device-type": "desktop" },
16
+ react_1.default.createElement(S_StepContent, { "x-pds-name": "StepContent", "x-pds-element-type": "layout", "x-pds-device-type": "desktop" }, stepContent))));
17
+ };
18
+ var S_StepContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 80px;\n"], ["\n height: 80px;\n"])));
19
+ var S_StepArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n padding-top: 24px;\n"], ["\n padding-top: 24px;\n"])));
20
+ var S_StepContent = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n height: 56px;\n width: 864px;\n overflow: hidden;\n"], ["\n height: 56px;\n width: 864px;\n overflow: hidden;\n"])));
21
+ exports.default = Step;
22
+ var templateObject_1, templateObject_2, templateObject_3;
@@ -0,0 +1 @@
1
+ export { default as Step } from './Step';
@@ -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.Step = void 0;
7
+ var Step_1 = require("./Step");
8
+ Object.defineProperty(exports, "Step", { enumerable: true, get: function () { return __importDefault(Step_1).default; } });