pds-dev-kit-web 2.2.90 → 2.2.94

package/dist/src/common/styles/colorSet/PaletteColor_Dark.json

@@ -283,7 +283,7 @@
     "sys_text_button_tooltip": "grey900",
     "sys_membership_button_base": "white/opacity20",
     "sys_membership_item_membership_base": "darkgrey50",
-    "sys_membership_item_price_product_base": "darkgrey100",
+    "sys_membership_item_price_product_base": "darkgrey70",
     "sys_component_base_30": "darkgrey400",
     "sys_component_base_31": "darkgrey200",
     "sys_component_base_32": "darkgrey20",
@@ -355,5 +355,6 @@
     "sys_cpnt_sheet_base_14": "grey900",
     "sys_cpnt_white_opacity60": "white/opacity60",
     "sys_border_line_17": "darkgrey600",
-    "usr_brand_primary_opacity05": "darkblue500/opacity05"
+    "usr_brand_primary_opacity05": "darkblue500/opacity05",
+    "sys_cpnt_sheet_base_15": "grey200"
 }

package/dist/src/common/styles/colorSet/PaletteColor_light.json

@@ -282,8 +282,8 @@
     "sys_button_tooltip_base": "black/opacity80",
     "sys_text_button_tooltip": "white",
     "sys_membership_button_base": "black/opacity20",
-    "sys_membership_item_membership_base": "grey30",
-    "sys_membership_item_price_product_base": "grey70",
+    "sys_membership_item_membership_base": "grey10",
+    "sys_membership_item_price_product_base": "grey50",
     "sys_component_base_30": "grey400",
     "sys_component_base_31": "grey200",
     "sys_component_base_32": "grey20",
@@ -355,5 +355,6 @@
     "sys_cpnt_sheet_base_14": "grey900",
     "sys_cpnt_white_opacity60": "white/opacity60",
     "sys_border_line_17": "black/opacity00",
-    "usr_brand_primary_opacity05": "blue500/opacity05"
+    "usr_brand_primary_opacity05": "blue500/opacity05",
+    "sys_cpnt_sheet_base_15": "grey100"
 }

package/dist/src/common/styles/colorSet/UIColor.json

@@ -859,5 +859,7 @@
     "ui_121": "sys_component_base_03",
     "ui_cpnt_tooltip_base_border": "sys_border_line_17",
     "ui_122": "sys_widget_green_01",
-    "ui_123": "usr_brand_primary_opacity05"
+    "ui_123": "usr_brand_primary_opacity05",
+    "ui_124": "sys_cpnt_sheet_base_15",
+    "ui_dimmed_03": "sys_background_dimmed"
 }

package/dist/src/common/styles/colorSet/index.d.ts

@@ -119,7 +119,7 @@ declare const colorSet: {
         grey300: string;
         darkgrey300: string;
     };
-    readonly PaletteColor_light: {
+    readonly PaletteColor_Dark: {
         sys_container_background_01: string;
         sys_container_background_02: string;
         sys_container_background_03: string;
@@ -477,8 +477,9 @@ declare const colorSet: {
         sys_cpnt_white_opacity60: string;
         sys_border_line_17: string;
         usr_brand_primary_opacity05: string;
+        sys_cpnt_sheet_base_15: string;
     };
-    readonly PaletteColor_Dark: {
+    readonly PaletteColor_light: {
         sys_container_background_01: string;
         sys_container_background_02: string;
         sys_container_background_03: string;
@@ -836,6 +837,7 @@ declare const colorSet: {
         sys_cpnt_white_opacity60: string;
         sys_border_line_17: string;
         usr_brand_primary_opacity05: string;
+        sys_cpnt_sheet_base_15: string;
     };
     readonly UIColor: {
         ui_cpnt_button_fill_base_primary: string;
@@ -1699,6 +1701,8 @@ declare const colorSet: {
         ui_cpnt_tooltip_base_border: string;
         ui_122: string;
         ui_123: string;
+        ui_124: string;
+        ui_dimmed_03: string;
     };
 };
 export default colorSet;

package/dist/src/common/styles/colorSet/index.js

@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 /* eslint-disable import/order */
 var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
-var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
 var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
+var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
 var UIColor_json_1 = __importDefault(require("./UIColor.json"));
 var colorSet = {
     SemanticColor: SemanticColor_json_1.default,
-    PaletteColor_light: PaletteColor_light_json_1.default,
     PaletteColor_Dark: PaletteColor_Dark_json_1.default,
+    PaletteColor_light: PaletteColor_light_json_1.default,
     UIColor: UIColor_json_1.default
 };
 exports.default = colorSet;

package/dist/src/common/styles/colorSet/ui-type.d.ts

@@ -860,4 +860,6 @@ export interface UITheme {
     ui_cpnt_tooltip_base_border: string;
     ui_122: string;
     ui_123: string;
+    ui_124: string;
+    ui_dimmed_03: string;
 }

package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/ContentsContainer.d.ts

@@ -3,7 +3,7 @@ import type { UiColors } from '../../../../../common';
 export type ContentsContainerProps = {
     content1?: JSX.Element;
     content2?: JSX.Element;
-    layoutType: 'WSA_1' | 'WSB_1' | 'WSB_2' | 'WSC_1' | 'WSD_1' | 'WSE_1' | 'WSF_1' | 'WSF_2' | 'WSF_3' | 'WSF_4' | 'WSF_5' | 'WSF_6' | 'WSF_7' | 'WSG_1' | 'WSG_2' | 'WSG_3' | 'WSG_4' | 'WSG_5' | 'WSH_1' | 'WSI_1' | 'WSJ_1';
+    layoutType: 'WSA_1' | 'WSB_1' | 'WSB_2' | 'WSC_1' | 'WSD_1' | 'WSE_1' | 'WSF_1' | 'WSF_2' | 'WSF_3' | 'WSF_4' | 'WSF_5' | 'WSF_6' | 'WSF_7' | 'WSG_1' | 'WSG_2' | 'WSG_3' | 'WSG_4' | 'WSG_5' | 'WSH_1' | 'WSI_1' | 'WSI_2' | 'WSJ_1';
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;

package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/ContentsContainer.js

@@ -25,6 +25,7 @@ var ContentsContainer = function (_a) {
             WSG_5: ((0, jsx_runtime_1.jsx)(variation_1.WSG, { layoutType: "WSG_5", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey })),
             WSH_1: ((0, jsx_runtime_1.jsx)(variation_1.WSH, { layoutType: "WSH_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey })),
             WSI_1: ((0, jsx_runtime_1.jsx)(variation_1.WSI, { layoutType: "WSI_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey })),
+            WSI_2: ((0, jsx_runtime_1.jsx)(variation_1.WSI, { layoutType: "WSI_2", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, isLoadingContainer2: isLoadingContainer2, overrideContainer1ColorKey: overrideContainer1ColorKey, overrideContainer2ColorKey: overrideContainer2ColorKey })),
             WSJ_1: ((0, jsx_runtime_1.jsx)(variation_1.WSJ, { content1: content1, containerColor: containerColor, areaColor: areaColor, isLoadingContainer1: isLoadingContainer1, overrideContainer1ColorKey: overrideContainer1ColorKey }))
         }[layoutType] }));
 };

package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSI.d.ts

@@ -3,7 +3,7 @@ import type { UiColors } from '../../../../../../common';
 export type WSIProps = {
     content1?: JSX.Element;
     content2?: JSX.Element;
-    layoutType: 'WSI_1';
+    layoutType: 'WSI_1' | 'WSI_2';
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;

package/dist/src/desktop/layout/LayoutWS/Containers/ContentsContainer/variation/WSI.js

@@ -56,20 +56,23 @@ var overrideStyleContainer2 = (0, styled_components_1.css)(templateObject_2 || (
 });
 var S_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  height: 100%;\n"], ["\n  display: flex;\n  height: 100%;\n"])));
 var WSI_1Container1Style = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  overflow-x: hidden;\n  overflow-y: auto;\n  width: 720px;\n"], ["\n  overflow-x: hidden;\n  overflow-y: auto;\n  width: 720px;\n"])));
-var S_ContentsContainer1 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  ", ";\n  ", ";\n\n  ", "\n  ", "\n"], ["\n  background-color: ", ";\n  ", ";\n  ", ";\n\n  ", "\n  ", "\n"])), function (_a) {
+var WSI_2Container1Style = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  overflow-x: hidden;\n  overflow-y: auto;\n  width: 720px;\n"], ["\n  overflow-x: hidden;\n  overflow-y: auto;\n  width: 720px;\n"])));
+var S_ContentsContainer1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  background-color: ", ";\n  ", ";\n  ", ";\n\n  ", "\n  ", "\n"], ["\n  background-color: ", ";\n  ", ";\n  ", ";\n\n  ", "\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_contentscontainer01_background;
 }, function (_a) {
     var layoutType = _a.layoutType;
     return ({
-        WSI_1: WSI_1Container1Style
+        WSI_1: WSI_1Container1Style,
+        WSI_2: WSI_2Container1Style
     }[layoutType]);
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: ".concat(containerColor);
 }, scrollbarStyle_1.scrollbarStyle, overrideStyleContainer1);
-var WSI_1Container2Style = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  flex: 1;\n  height: 100%;\n"], ["\n  flex: 1;\n  height: 100%;\n"])));
-var S_ContentsContainer2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  background-color: ", ";\n  border-left: 1px solid ", ";\n  ", ";\n  ", ";\n\n  ", "\n  ", "\n"], ["\n  background-color: ", ";\n  border-left: 1px solid ", ";\n  ", ";\n  ", ";\n\n  ", "\n  ", "\n"])), function (_a) {
+var WSI_1Container2Style = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  flex: 1;\n  height: 100%;\n"], ["\n  flex: 1;\n  height: 100%;\n"])));
+var WSI_2Container2Style = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  flex: 1;\n  height: 100%;\n"], ["\n  flex: 1;\n  height: 100%;\n"])));
+var S_ContentsContainer2 = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  background-color: ", ";\n  border-left: 1px solid ", ";\n  ", ";\n  ", ";\n\n  ", "\n  ", "\n"], ["\n  background-color: ", ";\n  border-left: 1px solid ", ";\n  ", ";\n  ", ";\n\n  ", "\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_contentscontainer02_background;
 }, function (_a) {
@@ -78,44 +81,52 @@ var S_ContentsContainer2 = styled_components_1.default.div(templateObject_7 || (
 }, function (_a) {
     var layoutType = _a.layoutType;
     return ({
-        WSI_1: WSI_1Container2Style
+        WSI_1: WSI_1Container2Style,
+        WSI_2: WSI_2Container2Style
     }[layoutType]);
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: ".concat(containerColor);
 }, scrollbarStyle_1.scrollbarStyle, overrideStyleContainer2);
-var WSI_1Area1Style = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  padding-bottom: 88px;\n  padding-left: 24px;\n  padding-right: 24px;\n"], ["\n  padding-bottom: 88px;\n  padding-left: 24px;\n  padding-right: 24px;\n"])));
-var S_ContentsArea1 = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  box-sizing: border-box;\n  padding-top: 24px;\n  ", ";\n  ", ";\n"], ["\n  box-sizing: border-box;\n  padding-top: 24px;\n  ", ";\n  ", ";\n"])), function (_a) {
+var WSI_1Area1Style = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  padding-bottom: 88px;\n  padding-left: 24px;\n  padding-right: 24px;\n"], ["\n  padding-bottom: 88px;\n  padding-left: 24px;\n  padding-right: 24px;\n"])));
+var WSI_2Area1Style = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  padding-bottom: 88px;\n  padding-left: 24px;\n  padding-right: 24px;\n"], ["\n  padding-bottom: 88px;\n  padding-left: 24px;\n  padding-right: 24px;\n"])));
+var S_ContentsArea1 = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  box-sizing: border-box;\n  padding-top: 24px;\n  ", ";\n  ", ";\n"], ["\n  box-sizing: border-box;\n  padding-top: 24px;\n  ", ";\n  ", ";\n"])), function (_a) {
     var layoutType = _a.layoutType;
     return ({
-        WSI_1: WSI_1Area1Style
+        WSI_1: WSI_1Area1Style,
+        WSI_2: WSI_2Area1Style
     }[layoutType]);
 }, function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: ".concat(areaColor);
 });
-var WSI_1Area2Style = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  height: 100%;\n  padding-top: 24px;\n  width: 240px;\n"], ["\n  height: 100%;\n  padding-top: 24px;\n  width: 240px;\n"])));
-var S_ContentsArea2 = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  box-sizing: border-box;\n  ", ";\n  ", ";\n"], ["\n  box-sizing: border-box;\n  ", ";\n  ", ";\n"])), function (_a) {
+var WSI_1Area2Style = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  height: 100%;\n  padding-top: 24px;\n  width: 240px;\n"], ["\n  height: 100%;\n  padding-top: 24px;\n  width: 240px;\n"])));
+var WSI_2Area2Style = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  height: 100%;\n  padding-top: 24px;\n  width: 360px;\n"], ["\n  height: 100%;\n  padding-top: 24px;\n  width: 360px;\n"])));
+var S_ContentsArea2 = styled_components_1.default.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  box-sizing: border-box;\n  ", ";\n  ", ";\n"], ["\n  box-sizing: border-box;\n  ", ";\n  ", ";\n"])), function (_a) {
     var layoutType = _a.layoutType;
     return ({
-        WSI_1: WSI_1Area2Style
+        WSI_1: WSI_1Area2Style,
+        WSI_2: WSI_2Area2Style
     }[layoutType]);
 }, function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: ".concat(areaColor);
 });
-var S_Content1 = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (_a) {
+var S_Content1 = styled_components_1.default.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (_a) {
     var layoutType = _a.layoutType;
     return ({
-        WSI_1: ''
+        WSI_1: '',
+        WSI_2: ''
     }[layoutType]);
 });
-var WSI_1Content2Style = (0, styled_components_1.css)(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
-var S_Content2 = styled_components_1.default.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (_a) {
+var WSI_1Content2Style = (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
+var WSI_2Content2Style = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  height: 100%;\n  overflow: hidden;\n"], ["\n  height: 100%;\n  overflow: hidden;\n"])));
+var S_Content2 = styled_components_1.default.div(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (_a) {
     var layoutType = _a.layoutType;
     return ({
-        WSI_1: WSI_1Content2Style
+        WSI_1: WSI_1Content2Style,
+        WSI_2: WSI_2Content2Style
     }[layoutType]);
 });
 exports.default = WSI;
-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, templateObject_14;
+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, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19;

package/dist/src/desktop/layout/LayoutWS/ContainersBox/ContainersBox.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { UiColors } from '../../../../common';
 export type ContainersBoxProps = {
-    layoutType: 'WSA_1' | 'WSB_1' | 'WSB_2' | 'WSC_1' | 'WSD_1' | 'WSE_1' | 'WSF_1' | 'WSF_2' | 'WSF_3' | 'WSF_4' | 'WSF_5' | 'WSF_6' | 'WSF_7' | 'WSG_1' | 'WSG_2' | 'WSG_3' | 'WSG_4' | 'WSG_5' | 'WSH_1' | 'WSI_1' | 'WSJ_1';
+    layoutType: 'WSA_1' | 'WSB_1' | 'WSB_2' | 'WSC_1' | 'WSD_1' | 'WSE_1' | 'WSF_1' | 'WSF_2' | 'WSF_3' | 'WSF_4' | 'WSF_5' | 'WSF_6' | 'WSF_7' | 'WSG_1' | 'WSG_2' | 'WSG_3' | 'WSG_4' | 'WSG_5' | 'WSH_1' | 'WSI_1' | 'WSI_2' | 'WSJ_1';
     pageMenuContent?: JSX.Element;
     tabMenuContent?: JSX.Element;
     content1?: JSX.Element;

package/dist/src/sub/DynamicLayout/components/SectionMatcher/SectionMatcher.js

@@ -21,13 +21,17 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
+var FlexGridCustomSection_1 = __importDefault(require("../../../DynamicLayout/sections/CustomSection/FlexGridCustomSection"));
 var sections_1 = require("../../sections");
 function SectionMatcher(_a) {
     var props = __rest(_a, []);
     if (props.type === 'CUSTOM') {
-        return (0, jsx_runtime_1.jsx)(sections_1.CustomSection, __assign({}, props));
+        return (0, jsx_runtime_1.jsx)(FlexGridCustomSection_1.default, __assign({}, props));
     }
     var schema = props.manifest.schema;
     switch (schema) {