npm - pds-dev-kit-web-test - Versions diffs - 0.1.9 → 0.1.10 - Mend

pds-dev-kit-web-test 0.1.9 → 0.1.10

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 (306) hide show

package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFB.js CHANGED Viewed

@@ -50,7 +50,7 @@ var overrideStyleContainer2 = (0, styled_components_1.css)(templateObject_2 || (
     return overrideContainer2ColorKey && theme[overrideContainer2ColorKey];
 });
 var S_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"], ["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"])));
-var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __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_m_contentscontainer01_background;
 }, function (_a) {
@@ -63,18 +63,18 @@ var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer02_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer2);
-var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });
-var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFC.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MFCProps = {
     content1?: JSX.Element;
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const MFC: ({ content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: MFCProps) => JSX.Element;
 export default MFC;

package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFC.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 640px;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 640px;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 640px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 640px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n  ", ";\n"], ["\n  height: 100%;\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFD.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MFDProps = {
     content1?: JSX.Element;
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const MFD: ({ content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: MFDProps) => JSX.Element;
 export default MFD;

package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFD.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFE.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MFEProps = {
     content1?: JSX.Element;
     content2?: JSX.Element;
@@ -8,8 +8,8 @@ export declare type MFEProps = {
     areaColor?: string;
     isLoadingContainer1?: boolean;
     isLoadingContainer2?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
-    overrideContainer2ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
+    overrideContainer2ColorKey?: UiColors;
 };
 declare const MFE: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey }: MFEProps) => JSX.Element;
 export default MFE;

package/dist/src/mobile/layout/LayoutMF/Containers/ContentsContainer/variation/MFE.js CHANGED Viewed

@@ -50,7 +50,7 @@ var overrideStyleContainer2 = (0, styled_components_1.css)(templateObject_2 || (
     return overrideContainer2ColorKey && theme[overrideContainer2ColorKey];
 });
 var S_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"], ["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"])));
-var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __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_m_contentscontainer01_background;
 }, function (_a) {
@@ -63,18 +63,18 @@ var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer02_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer2);
-var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });
-var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  height: 100%;\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  height: 100%;\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMF/ContainersBox/ContainersBox.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../common';
 export declare type ContainersBoxProps = {
     layoutType: 'MFA_1' | 'MFB_1' | 'MFB_2' | 'MFC_1' | 'MFD_1' | 'MFE_1' | 'MFE_2';
     content1?: JSX.Element;
@@ -9,8 +9,8 @@ export declare type ContainersBoxProps = {
     areaColor?: string;
     isLoadingContainer1?: boolean;
     isLoadingContainer2?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
-    overrideContainer2ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
+    overrideContainer2ColorKey?: UiColors;
 };
 declare const ContainersBox: ({ layoutType, content1, content2, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey }: ContainersBoxProps) => JSX.Element;
 export default ContainersBox;

package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/ContentsContainer.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../common';
 export declare type ContentsContainerProps = {
     content1?: JSX.Element;
     content2?: JSX.Element;
@@ -7,7 +7,7 @@ export declare type ContentsContainerProps = {
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const ContentsContainer: ({ content1, layoutType, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: ContentsContainerProps) => JSX.Element;
 export default ContentsContainer;

package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMA.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MMAProps = {
     content1?: JSX.Element;
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const MMA: ({ content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: MMAProps) => JSX.Element;
 export default MMA;

package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMA.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMB.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MMBProps = {
     content1?: JSX.Element;
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const MMB: ({ content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: MMBProps) => JSX.Element;
 export default MMB;

package/dist/src/mobile/layout/LayoutMM/Containers/ContentsContainer/variation/MMB.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMM/ContainersBox/ContainersBox.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../common';
 export declare type ContainersBoxProps = {
     layoutType: 'MMA_1' | 'MMB_1';
     content1?: JSX.Element;
@@ -7,7 +7,7 @@ export declare type ContainersBoxProps = {
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const ContainersBox: ({ layoutType, content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: ContainersBoxProps) => JSX.Element;
 export default ContainersBox;

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/ContentsContainer.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../common';
 export declare type ContentsContainerProps = {
     content1?: JSX.Element;
     content2?: JSX.Element;
@@ -8,8 +8,8 @@ export declare type ContentsContainerProps = {
     areaColor?: string;
     isLoadingContainer1?: boolean;
     isLoadingContainer2?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
-    overrideContainer2ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
+    overrideContainer2ColorKey?: UiColors;
 };
 declare const ContentsContainer: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey }: ContentsContainerProps) => JSX.Element;
 export default ContentsContainer;

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPA.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MPAProps = {
     content1?: JSX.Element;
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const MPA: ({ content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: MPAProps) => JSX.Element;
 export default MPA;

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPA.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  /* TODO: infinity scroll\uC744 \uC704\uD574 \uC784\uC2DC\uB85C height: 100%;\uD55C \uC0C1\uD0DC. \uD574\uB2F9 \uC0C1\uD0DC\uC5D0\uC11C\uB294 padding-bottom\uC774 \uBB34\uC2DC\uB418\uACE0 \uC788\uC73C\uBBC0\uB85C 2/8 \uC774\uD6C4 \uD574\uACB0 \uD544\uC694 */\n  height: 100%;\n  min-width: 360px;\n  ", ";\n  /* padding-bottom: 88px; */\n"], ["\n  /* TODO: infinity scroll\uC744 \uC704\uD574 \uC784\uC2DC\uB85C height: 100%;\uD55C \uC0C1\uD0DC. \uD574\uB2F9 \uC0C1\uD0DC\uC5D0\uC11C\uB294 padding-bottom\uC774 \uBB34\uC2DC\uB418\uACE0 \uC788\uC73C\uBBC0\uB85C 2/8 \uC774\uD6C4 \uD574\uACB0 \uD544\uC694 */\n  height: 100%;\n  min-width: 360px;\n  ", ";\n  /* padding-bottom: 88px; */\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  /* TODO: infinity scroll\uC744 \uC704\uD574 \uC784\uC2DC\uB85C height: 100%;\uD55C \uC0C1\uD0DC. \uD574\uB2F9 \uC0C1\uD0DC\uC5D0\uC11C\uB294 padding-bottom\uC774 \uBB34\uC2DC\uB418\uACE0 \uC788\uC73C\uBBC0\uB85C 2/8 \uC774\uD6C4 \uD574\uACB0 \uD544\uC694 */\n  height: 100%;\n\n  ", ";\n  /* padding-bottom: 88px; */\n"], ["\n  /* TODO: infinity scroll\uC744 \uC704\uD574 \uC784\uC2DC\uB85C height: 100%;\uD55C \uC0C1\uD0DC. \uD574\uB2F9 \uC0C1\uD0DC\uC5D0\uC11C\uB294 padding-bottom\uC774 \uBB34\uC2DC\uB418\uACE0 \uC788\uC73C\uBBC0\uB85C 2/8 \uC774\uD6C4 \uD574\uACB0 \uD544\uC694 */\n  height: 100%;\n\n  ", ";\n  /* padding-bottom: 88px; */\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPB.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MPBProps = {
     content1?: JSX.Element;
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const MPB: ({ content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: MPBProps) => JSX.Element;
 export default MPB;

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPB.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  /* TODO: infinity scroll\uC744 \uC704\uD574 \uC784\uC2DC\uB85C height: 100%;\uD55C \uC0C1\uD0DC. \uD574\uB2F9 \uC0C1\uD0DC\uC5D0\uC11C\uB294 padding-bottom\uC774 \uBB34\uC2DC\uB418\uACE0 \uC788\uC73C\uBBC0\uB85C 2/8 \uC774\uD6C4 \uD574\uACB0 \uD544\uC694 */\n  height: 100%;\n  min-width: 360px;\n  ", ";\n  /* padding-bottom: 88px; */\n"], ["\n  /* TODO: infinity scroll\uC744 \uC704\uD574 \uC784\uC2DC\uB85C height: 100%;\uD55C \uC0C1\uD0DC. \uD574\uB2F9 \uC0C1\uD0DC\uC5D0\uC11C\uB294 padding-bottom\uC774 \uBB34\uC2DC\uB418\uACE0 \uC788\uC73C\uBBC0\uB85C 2/8 \uC774\uD6C4 \uD574\uACB0 \uD544\uC694 */\n  height: 100%;\n  min-width: 360px;\n  ", ";\n  /* padding-bottom: 88px; */\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  /* TODO: infinity scroll\uC744 \uC704\uD574 \uC784\uC2DC\uB85C height: 100%;\uD55C \uC0C1\uD0DC. \uD574\uB2F9 \uC0C1\uD0DC\uC5D0\uC11C\uB294 padding-bottom\uC774 \uBB34\uC2DC\uB418\uACE0 \uC788\uC73C\uBBC0\uB85C 2/8 \uC774\uD6C4 \uD574\uACB0 \uD544\uC694 */\n  height: 100%;\n\n  ", ";\n  /* padding-bottom: 88px; */\n"], ["\n  /* TODO: infinity scroll\uC744 \uC704\uD574 \uC784\uC2DC\uB85C height: 100%;\uD55C \uC0C1\uD0DC. \uD574\uB2F9 \uC0C1\uD0DC\uC5D0\uC11C\uB294 padding-bottom\uC774 \uBB34\uC2DC\uB418\uACE0 \uC788\uC73C\uBBC0\uB85C 2/8 \uC774\uD6C4 \uD574\uACB0 \uD544\uC694 */\n  height: 100%;\n\n  ", ";\n  /* padding-bottom: 88px; */\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPC.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MPCProps = {
     content1?: JSX.Element;
     content2?: JSX.Element;
@@ -8,8 +8,8 @@ export declare type MPCProps = {
     areaColor?: string;
     isLoadingContainer1?: boolean;
     isLoadingContainer2?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
-    overrideContainer2ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
+    overrideContainer2ColorKey?: UiColors;
 };
 declare const MPC: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey }: MPCProps) => JSX.Element;
 export default MPC;

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPC.js CHANGED Viewed

@@ -50,7 +50,7 @@ var overrideStyleContainer2 = (0, styled_components_1.css)(templateObject_2 || (
     return overrideContainer2ColorKey && theme[overrideContainer2ColorKey];
 });
 var S_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"], ["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"])));
-var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __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_m_contentscontainer01_background;
 }, function (_a) {
@@ -63,18 +63,18 @@ var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer02_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer2);
-var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });
-var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPD.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MPDProps = {
     content1?: JSX.Element;
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const MPD: ({ content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: MPDProps) => JSX.Element;
 export default MPD;

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPD.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPE.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MPEProps = {
     content1?: JSX.Element;
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
 };
 declare const MPE: ({ content1, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey }: MPEProps) => JSX.Element;
 export default MPE;

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPE.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  height: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPF.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 export declare type MPFProps = {
     content1?: JSX.Element;
     content2?: JSX.Element;
@@ -8,8 +8,8 @@ export declare type MPFProps = {
     areaColor?: string;
     isLoadingContainer1?: boolean;
     isLoadingContainer2?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
-    overrideContainer2ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
+    overrideContainer2ColorKey?: UiColors;
 };
 declare const MPF: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey }: MPFProps) => JSX.Element;
 export default MPF;

package/dist/src/mobile/layout/LayoutMP/Containers/ContentsContainer/variation/MPF.js CHANGED Viewed

@@ -50,7 +50,7 @@ var overrideStyleContainer2 = (0, styled_components_1.css)(templateObject_2 || (
     return overrideContainer2ColorKey && theme[overrideContainer2ColorKey];
 });
 var S_Box = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"], ["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"])));
-var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __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_m_contentscontainer01_background;
 }, function (_a) {
@@ -63,18 +63,18 @@ var S_ContentsContainer1 = styled_components_1.default.div(templateObject_4 || (
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n  min-width: 360px;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  flex: 1;\n  height: 100%;\n\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer02_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer2);
-var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  height: 100%;\n\n  ", ";\n"], ["\n  height: 100%;\n\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });
-var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  height: 100%;\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  height: 100%;\n  min-width: 360px;\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
+var S_ContentsArea2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  height: 100%;\n  padding-bottom: 88px;\n  ", ";\n"], ["\n  height: 100%;\n  padding-bottom: 88px;\n  ", ";\n"])), function (_a) {
     var areaColor = _a.areaColor;
     return "background-color: " + areaColor;
 });

package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/ContentsContainer.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../common';
 import type { MutableRefObject } from 'react';
 export declare type ContentsContainerProps = {
     content1?: JSX.Element;
@@ -8,8 +8,8 @@ export declare type ContentsContainerProps = {
     areaColor?: string;
     isLoadingContainer1?: boolean;
     isLoadingContainer2?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
-    overrideContainer2ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
+    overrideContainer2ColorKey?: UiColors;
     container1Ref?: MutableRefObject<HTMLDivElement | null>;
 };
 declare const ContentsContainer: ({ content1, content2, layoutType, containerColor, areaColor, isLoadingContainer1, isLoadingContainer2, overrideContainer1ColorKey, overrideContainer2ColorKey, container1Ref }: ContentsContainerProps) => JSX.Element;

package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSA.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { ColorType } from 'pds-dev-kit-color-web';
+import type { UiColors } from '../../../../../../common';
 import type { MutableRefObject } from 'react';
 export declare type MSAProps = {
     content1?: JSX.Element;
@@ -6,7 +6,7 @@ export declare type MSAProps = {
     containerColor?: string;
     areaColor?: string;
     isLoadingContainer1?: boolean;
-    overrideContainer1ColorKey?: keyof ColorType;
+    overrideContainer1ColorKey?: UiColors;
     container1Ref?: MutableRefObject<HTMLDivElement | null>;
 };
 declare const MSA: ({ content1, layoutType, containerColor, areaColor, isLoadingContainer1, overrideContainer1ColorKey, container1Ref }: MSAProps) => JSX.Element;

package/dist/src/mobile/layout/LayoutMS/Containers/ContentsContainer/variation/MSA.js CHANGED Viewed

@@ -45,14 +45,14 @@ var overrideStyleContainer1 = (0, styled_components_1.css)(templateObject_1 || (
     var theme = _a.theme, overrideContainer1ColorKey = _a.overrideContainer1ColorKey;
     return overrideContainer1ColorKey && theme[overrideContainer1ColorKey];
 });
-var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
+var S_ContentsContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"], ["\n  background-color: ", ";\n  height: 100%;\n\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n\n  ", "\n"])), function (_a) {
     var theme = _a.theme;
     return theme.ui_m_contentscontainer01_background;
 }, function (_a) {
     var containerColor = _a.containerColor;
     return "background-color: " + containerColor;
 }, overrideStyleContainer1);
-var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  min-width: 360px;\n  ", ";\n  ", ";\n"], ["\n  min-width: 360px;\n  ", ";\n  ", ";\n"])), function (_a) {
+var S_ContentsArea = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  ", ";\n  ", ";\n"], ["\n  ", ";\n  ", ";\n"])), function (_a) {
     var layoutType = _a.layoutType;
     return ({
         MSA_1: 'padding-bottom: 88px;',