npm - pds-dev-kit-web - Versions diffs - 1.6.13 → 1.7.0 - Mend

pds-dev-kit-web 1.6.13 → 1.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (185) hide show

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MMB = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MMB", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MMB", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MMB" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  height: 100%;\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  height: 100%;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/mobile/layout/LayoutMM/Containers/NavigationContainer/variation/Navigation.js CHANGED Viewed

@@ -11,9 +11,9 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var Navigation = function (_a) {
     var children = _a.children;
-    return (react_1.default.createElement(S_NavigationContainer, null,
-        react_1.default.createElement(S_NavigationArea, null,
-            react_1.default.createElement(S_NavigationContent, null, children))));
+    return (react_1.default.createElement(S_NavigationContainer, { "x-pds-name": "NavigationContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+        react_1.default.createElement(S_NavigationArea, { "x-pds-name": "NavigationArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+            react_1.default.createElement(S_NavigationContent, { "x-pds-name": "NavigationContent", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" }, children))));
 };
 var S_NavigationContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/mobile/layout/LayoutMM/LayoutMM.js CHANGED Viewed

@@ -11,7 +11,7 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var LayoutMM = function (_a) {
     var navigationContainer = _a.navigationContainer, children = _a.children;
-    return (react_1.default.createElement(S_LayoutMM, null,
+    return (react_1.default.createElement(S_LayoutMM, { "x-pds-name": "LayoutMM", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
         react_1.default.createElement(S_Box, null,
             react_1.default.createElement(S_TopWrapper, null, navigationContainer),
             react_1.default.createElement(S_BottomWrapper, null, children))));

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MPA = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPA", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPA", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPA" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MPB = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPB", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPB", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPB" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -13,10 +13,10 @@ var components_1 = require("../../../../../../common/components");
 var MPC = function (_a) {
     var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
     return (react_1.default.createElement(S_Box, null,
-        react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
-            react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1)))),
-        react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
-            react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2))))));
+        react_1.default.createElement(S_ContentsContainer1, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPC", layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPC", layoutType: layoutType, areaColor: areaColor },
+            react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPC", layoutType: layoutType }, content1)))),
+        react_1.default.createElement(S_ContentsContainer2, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPC", layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPC", layoutType: layoutType, areaColor: areaColor },
+            react_1.default.createElement(S_Content2, { "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPC", layoutType: layoutType }, content2))))));
 };
 var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __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_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n"])), function (_a) {

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MPD = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPD", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPD", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPD" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MPE = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPE" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -13,10 +13,10 @@ var components_1 = require("../../../../../../common/components");
 var MPF = function (_a) {
     var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
     return (react_1.default.createElement(S_Box, null,
-        react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
-            react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1)))),
-        react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
-            react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2))))));
+        react_1.default.createElement(S_ContentsContainer1, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, areaColor: areaColor },
+            react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType }, content1)))),
+        react_1.default.createElement(S_ContentsContainer2, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType, areaColor: areaColor },
+            react_1.default.createElement(S_Content2, { "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MPF", layoutType: layoutType }, content2))))));
 };
 var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __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_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n"])), function (_a) {

package/dist/src/mobile/layout/LayoutMP/Containers/NavigationContainer/variation/Navigation.js CHANGED Viewed

@@ -11,9 +11,9 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var Navigation = function (_a) {
     var children = _a.children;
-    return (react_1.default.createElement(S_NavigationContainer, null,
-        react_1.default.createElement(S_NavigationArea, null,
-            react_1.default.createElement(S_NavigationContent, null, children))));
+    return (react_1.default.createElement(S_NavigationContainer, { "x-pds-name": "NavigationContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+        react_1.default.createElement(S_NavigationArea, { "x-pds-name": "NavigationArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+            react_1.default.createElement(S_NavigationContent, { "x-pds-name": "NavigationContent", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" }, children))));
 };
 var S_NavigationContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/mobile/layout/LayoutMP/Containers/TabContainer/variation/Tab.js CHANGED Viewed

@@ -11,9 +11,9 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var Tab = function (_a) {
     var children = _a.children;
-    return (react_1.default.createElement(S_TabContainer, null,
-        react_1.default.createElement(S_TabArea, null,
-            react_1.default.createElement(S_TabContent, null, children))));
+    return (react_1.default.createElement(S_TabContainer, { "x-pds-name": "TabContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+        react_1.default.createElement(S_TabArea, { "x-pds-name": "TabArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+            react_1.default.createElement(S_TabContent, { "x-pds-name": "TabContent", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" }, children))));
 };
 var S_TabContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/mobile/layout/LayoutMP/LayoutMP.js CHANGED Viewed

@@ -11,7 +11,7 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var LayoutMP = function (_a) {
     var navigationContainer = _a.navigationContainer, children = _a.children;
-    return (react_1.default.createElement(S_LayoutMP, null,
+    return (react_1.default.createElement(S_LayoutMP, { "x-pds-name": "LayoutMP", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
         react_1.default.createElement(S_Box, null,
             react_1.default.createElement(S_TopWrapper, null, navigationContainer),
             react_1.default.createElement(S_BottomWrapper, null, children))));

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MSA = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSA" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  height: 100%;\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  height: 100%;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MSB = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSB" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  height: 100%;\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  height: 100%;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -13,10 +13,10 @@ var components_1 = require("../../../../../../common/components");
 var MSC = function (_a) {
     var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
     return (react_1.default.createElement(S_Box, null,
-        react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
-            react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1)))),
-        react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
-            react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2))))));
+        react_1.default.createElement(S_ContentsContainer1, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, areaColor: areaColor },
+            react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType }, content1)))),
+        react_1.default.createElement(S_ContentsContainer2, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType, areaColor: areaColor },
+            react_1.default.createElement(S_Content2, { "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSC", layoutType: layoutType }, content2))))));
 };
 var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __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_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n"])), function (_a) {

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MSD = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSD" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  height: 100%;\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  height: 100%;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MSE = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSE" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  height: 100%;\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  height: 100%;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -13,10 +13,10 @@ var components_1 = require("../../../../../../common/components");
 var MSF = function (_a) {
     var content1 = _a.content1, content2 = _a.content2, layoutType = _a.layoutType, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1, isLoadingContainer2 = _a.isLoadingContainer2;
     return (react_1.default.createElement(S_Box, null,
-        react_1.default.createElement(S_ContentsContainer1, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { layoutType: layoutType, areaColor: areaColor },
-            react_1.default.createElement(S_Content1, { layoutType: layoutType }, content1)))),
-        react_1.default.createElement(S_ContentsContainer2, { layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { layoutType: layoutType, areaColor: areaColor },
-            react_1.default.createElement(S_Content2, { layoutType: layoutType }, content2))))));
+        react_1.default.createElement(S_ContentsContainer1, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea1, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, areaColor: areaColor },
+            react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType }, content1)))),
+        react_1.default.createElement(S_ContentsContainer2, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, containerColor: containerColor }, isLoadingContainer2 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea2, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType, areaColor: areaColor },
+            react_1.default.createElement(S_Content2, { "x-pds-name": "Content2", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSF", layoutType: layoutType }, content2))))));
 };
 var S_Box = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __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_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n"], ["\n  background-color: ", ";\n  min-width: 360px;\n  ", ";\n  ", ";\n"])), function (_a) {

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MSG = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSG" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

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

@@ -12,8 +12,8 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var components_1 = require("../../../../../../common/components");
 var MSH = function (_a) {
     var content1 = _a.content1, containerColor = _a.containerColor, areaColor = _a.areaColor, isLoadingContainer1 = _a.isLoadingContainer1;
-    return (react_1.default.createElement(S_ContentsContainer, { containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { areaColor: areaColor },
-        react_1.default.createElement(S_Content1, null, content1)))));
+    return (react_1.default.createElement(S_ContentsContainer, { "x-pds-name": "ContentsContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH", containerColor: containerColor }, isLoadingContainer1 ? (react_1.default.createElement(components_1.ThreeBarProgress, null)) : (react_1.default.createElement(S_ContentsArea, { "x-pds-name": "ContentsArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH", areaColor: areaColor },
+        react_1.default.createElement(S_Content1, { "x-pds-name": "Content1", "x-pds-element-type": "layout", "x-pds-device-type": "mobile", "x-pds-layout-type": "MSH" }, content1)))));
 };
 var S_ContentsContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"], ["\n  background-color: ", ";\n  height: 100%;\n  min-width: 360px;\n  ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/mobile/layout/LayoutMS/Containers/NavigationContainer/variation/Navigation.js CHANGED Viewed

@@ -11,9 +11,9 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var Navigation = function (_a) {
     var children = _a.children;
-    return (react_1.default.createElement(S_NavigationContainer, null,
-        react_1.default.createElement(S_NavigationArea, null,
-            react_1.default.createElement(S_NavigationContent, null, children))));
+    return (react_1.default.createElement(S_NavigationContainer, { "x-pds-name": "NavigationContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+        react_1.default.createElement(S_NavigationArea, { "x-pds-name": "NavigationArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+            react_1.default.createElement(S_NavigationContent, { "x-pds-name": "NavigationContent", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" }, children))));
 };
 var S_NavigationContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/mobile/layout/LayoutMS/Containers/TabContainer/variation/Tab.js CHANGED Viewed

@@ -11,9 +11,9 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var Tab = function (_a) {
     var children = _a.children;
-    return (react_1.default.createElement(S_TabContainer, null,
-        react_1.default.createElement(S_TabArea, null,
-            react_1.default.createElement(S_TabContent, null, children))));
+    return (react_1.default.createElement(S_TabContainer, { "x-pds-name": "TabContainer", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+        react_1.default.createElement(S_TabArea, { "x-pds-name": "TabArea", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
+            react_1.default.createElement(S_TabContent, { "x-pds-name": "TabContent", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" }, children))));
 };
 var S_TabContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/mobile/layout/LayoutMS/LayoutMS.js CHANGED Viewed

@@ -11,7 +11,7 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var LayoutMS = function (_a) {
     var navigationContainer = _a.navigationContainer, children = _a.children;
-    return (react_1.default.createElement(S_LayoutMS, null,
+    return (react_1.default.createElement(S_LayoutMS, { "x-pds-name": "LayoutMS", "x-pds-element-type": "layout", "x-pds-device-type": "mobile" },
         react_1.default.createElement(S_Box, null,
             react_1.default.createElement(S_TopWrapper, null, navigationContainer),
             react_1.default.createElement(S_BottomWrapper, null, children))));

package/dist/src/mobile/panels/AnnotationSheet/AnnotationSheet.js CHANGED Viewed

@@ -64,7 +64,7 @@ function AnnotationSheet(_a) {
             onClick(e);
         }
     };
-    return (react_1.default.createElement(S_AnnotationSheet, { "$width": width, "$height": height, "$backgroundColorTheme": backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, borderMode: borderMode, "$borderWidth": borderWidth, "$borderColorTheme": borderColorTheme, overrideBorderColorKey: overrideBorderColorKey, shapeType: shapeType, "$radius": radius, paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, style: overrideCSS, onClick: handleClick }, children));
+    return (react_1.default.createElement(S_AnnotationSheet, { "x-pds-name": "AnnotationSheet", "x-pds-element-type": "panel", "x-pds-device-type": "mobile", "$width": width, "$height": height, "$backgroundColorTheme": backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, borderMode: borderMode, "$borderWidth": borderWidth, "$borderColorTheme": borderColorTheme, overrideBorderColorKey: overrideBorderColorKey, shapeType: shapeType, "$radius": radius, paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, style: overrideCSS, onClick: handleClick }, children));
 }
 var radiusStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border-radius: ", ";\n"], ["\n  border-radius: ", ";\n"])), function (_a) {
     var $radius = _a.$radius;

package/dist/src/mobile/panels/ContentSheet/ContentSheet.js CHANGED Viewed

@@ -69,7 +69,7 @@ function ContentSheet(_a) {
         if (isLoading) {
             return (react_1.default.createElement(S_LoadingContentSheet, { "$width": width !== null && width !== void 0 ? width : loadingWidth, "$height": height !== null && height !== void 0 ? height : loadingHeight, shapeType: shapeType, "$radius": radius }));
         }
-        return (react_1.default.createElement(S_ContentSheet, { "$width": width, "$height": height, "$backgroundColorTheme": backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, borderMode: borderMode, "$borderWidth": borderWidth, "$borderColorTheme": borderColorTheme, overrideBorderColorKey: overrideBorderColorKey, shapeType: shapeType, "$radius": radius, paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, style: overrideCSS, onClick: handleClick }, children));
+        return (react_1.default.createElement(S_ContentSheet, { "x-pds-name": "ContentSheet", "x-pds-element-type": "panel", "x-pds-device-type": "mobile", "$width": width, "$height": height, "$backgroundColorTheme": backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, borderMode: borderMode, "$borderWidth": borderWidth, "$borderColorTheme": borderColorTheme, overrideBorderColorKey: overrideBorderColorKey, shapeType: shapeType, "$radius": radius, paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, style: overrideCSS, onClick: handleClick }, children));
     };
     return ContentSheetVariation();
 }

package/dist/src/mobile/panels/MobileBasicModal/MobileBasicModal.js CHANGED Viewed

@@ -50,7 +50,7 @@ function MobileBasicModal(_a) {
     }, []);
     return react_dom_1.default.createPortal(react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(S_ModalOverlay, null),
-        react_1.default.createElement(S_ModalWrapper, null,
+        react_1.default.createElement(S_ModalWrapper, { "x-pds-name": "MobileBasicModal", "x-pds-element-type": "panel", "x-pds-device-type": "mobile" },
             react_1.default.createElement(S_Header, null,
                 react_1.default.createElement(S_TitleWrapper, null,
                     react_1.default.createElement(components_1.TextLabel, { text: titleText, colorTheme: "sysTextPrimary", styleTheme: "headingBold" })),

package/dist/src/mobile/panels/SectionSheet/SectionSheet.js CHANGED Viewed

@@ -64,7 +64,7 @@ function SectionSheet(_a) {
             onClick(e);
         }
     };
-    return (react_1.default.createElement(S_SectionSheet, { "$width": width, "$height": height, "$backgroundColorTheme": backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, borderMode: borderMode, "$borderWidth": borderWidth, "$borderColorTheme": borderColorTheme, overrideBorderColorKey: overrideBorderColorKey, shapeType: shapeType, "$radius": radius, paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, style: overrideCSS, onClick: handleClick }, children));
+    return (react_1.default.createElement(S_SectionSheet, { "x-pds-name": "SectionSheet", "x-pds-element-type": "panel", "x-pds-device-type": "mobile", "$width": width, "$height": height, "$backgroundColorTheme": backgroundColorTheme, overrideBackgroundColorKey: overrideBackgroundColorKey, borderMode: borderMode, "$borderWidth": borderWidth, "$borderColorTheme": borderColorTheme, overrideBorderColorKey: overrideBorderColorKey, shapeType: shapeType, "$radius": radius, paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, style: overrideCSS, onClick: handleClick }, children));
 }
 var radiusStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border-radius: ", ";\n"], ["\n  border-radius: ", ";\n"])), function (_a) {
     var $radius = _a.$radius;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web",
-  "version": "1.6.13",
+  "version": "1.7.0",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",

package/release-note.md CHANGED Viewed

@@ -1,5 +1,10 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v1.6.13]
+## [v1.7.0]
+### Layout
+* Custom 원칙에 맞는 key 부여
+### Panel
+* Custom 원칙에 맞는 key 부여
 ### Component
-* BasicChatListItem
-  * titleText와 contentText의 최대 크기를 지정
+* Custom 원칙에 맞는 key 부여
+### Color
+* 컬러 키 값 22.12.13 15시 25분 기준 싱크