@pelcro/react-pelcro-js 4.0.0-alpha.71 → 4.0.0-alpha.72

package/dist/index.cjs.js

@@ -36377,10 +36377,6 @@ const DashboardContent = ({
       type: CLOSE_DASHBOARD
     });
   };
-
-  const closeSubMenusTab = () => {
-    switchDashboardView(null);
-  }; // useEffect(() => {
   //   return () => {
   //     document.removeEventListener("click", hideMenuIfClickedOutside);
   //   };
@@ -36440,21 +36436,14 @@ const DashboardContent = ({
     title: t("labels.logout"),
     setActiveDashboardLink: setActiveDashboardLink,
     activeDashboardLink: activeDashboardLink
-  }))), dashboardView && isOpen && /*#__PURE__*/React__default['default'].createElement("div", {
+  }))), /*#__PURE__*/React__default['default'].createElement("div", {
     id: "pelcro-view-dashboard-submenus",
     className: `plc-fixed plc-inset-y-0 plc-h-full lg:plc-w-9/12 plc-w-full plc-bg-gray-100 plc-z-max plc-overflow-auto ${dashboardLayout == "left" ? "plc-right-0" : "plc-left-0"}`
-  }, /*#__PURE__*/React__default['default'].createElement(DashboardViewController, null, subView !== null && subView !== void 0 && subView.length ? subView.map((child, i) => /*#__PURE__*/React__default['default'].cloneElement(child, {
+  }, dashboardView && isOpen && /*#__PURE__*/React__default['default'].createElement(DashboardViewController, null, subView !== null && subView !== void 0 && subView.length ? subView.map((child, i) => /*#__PURE__*/React__default['default'].cloneElement(child, {
     store: store$4,
     key: i
   })) : /*#__PURE__*/React__default['default'].cloneElement(subView, {
     store: store$4
-  })), /*#__PURE__*/React__default['default'].createElement(Button, {
-    variant: "ghost",
-    type: "button",
-    className: `plc-text-gray-500 plc-rounded-2xl plc-absolute plc-z-max plc-top-2 md:plc-top-5 ${dashboardLayout == "left" ? "plc-right-2 md:plc-right-10" : "plc-left-2 md:plc-left-10"}`,
-    onClick: closeSubMenusTab
-  }, /*#__PURE__*/React__default['default'].createElement(SvgXIcon, {
-    className: "plc-fill-current"
   }))));
 };
 
@@ -37147,6 +37136,7 @@ const Card = ({
   className = "",
   title,
   requestStates,
+  dashboardLayout,
   back,
   ...restProps
 }) => {
@@ -37154,11 +37144,16 @@ const Card = ({
   const {
     switchDashboardView
   } = usePelcro();
+
+  const closeSubMenusTab = () => {
+    switchDashboardView(null);
+  };
+
   return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: `plc-bg-white plc-border-2 plc-p-6 md:plc-p-8 plc-rounded plc-my-11 md:plc-mb-20 md:plc-mt-40 ${className}`,
+    className: `plc-relative plc-bg-white plc-border-2 plc-p-6 md:plc-p-8 plc-rounded plc-my-11 md:plc-mb-20 md:plc-mt-40 ${className}`,
     id: "plc-dashboard-card"
   }, title && /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "plc-flex plc-items-end plc-justify-between plc-border-b-2 plc-border-primary-400 plc-pb-2 plc-mb-10"
+    className: "plc-flex plc-items-end plc-justify-between plc-border-b-2 plc-border-primary-400 plc-pb-2 plc-mb-10 plc-mt-5"
   }, /*#__PURE__*/React__default['default'].createElement("h3", {
     className: "plc-font-bold plc-text-xl"
   }, title), (requestStates === null || requestStates === void 0 ? void 0 : requestStates.loading) && /*#__PURE__*/React__default['default'].createElement("span", {
@@ -37171,7 +37166,14 @@ const Card = ({
     onClick: () => {
       switchDashboardView(back === null || back === void 0 ? void 0 : back.target);
     }
-  }, "Back"))), children);
+  }, "Back"))), children, /*#__PURE__*/React__default['default'].createElement(Button, {
+    variant: "ghost",
+    type: "button",
+    className: "plc-text-gray-500 plc-rounded-2xl plc-absolute plc-z-max plc-top-1 plc-right-1",
+    onClick: closeSubMenusTab
+  }, /*#__PURE__*/React__default['default'].createElement(SvgXIcon, {
+    className: "plc-fill-current"
+  })));
 };
 
 const ProfileMenu = props => {

package/dist/index.esm.js

@@ -36347,10 +36347,6 @@ const DashboardContent = ({
       type: CLOSE_DASHBOARD
     });
   };
-
-  const closeSubMenusTab = () => {
-    switchDashboardView(null);
-  }; // useEffect(() => {
   //   return () => {
   //     document.removeEventListener("click", hideMenuIfClickedOutside);
   //   };
@@ -36410,21 +36406,14 @@ const DashboardContent = ({
     title: t("labels.logout"),
     setActiveDashboardLink: setActiveDashboardLink,
     activeDashboardLink: activeDashboardLink
-  }))), dashboardView && isOpen && /*#__PURE__*/React__default.createElement("div", {
+  }))), /*#__PURE__*/React__default.createElement("div", {
     id: "pelcro-view-dashboard-submenus",
     className: `plc-fixed plc-inset-y-0 plc-h-full lg:plc-w-9/12 plc-w-full plc-bg-gray-100 plc-z-max plc-overflow-auto ${dashboardLayout == "left" ? "plc-right-0" : "plc-left-0"}`
-  }, /*#__PURE__*/React__default.createElement(DashboardViewController, null, subView !== null && subView !== void 0 && subView.length ? subView.map((child, i) => /*#__PURE__*/React__default.cloneElement(child, {
+  }, dashboardView && isOpen && /*#__PURE__*/React__default.createElement(DashboardViewController, null, subView !== null && subView !== void 0 && subView.length ? subView.map((child, i) => /*#__PURE__*/React__default.cloneElement(child, {
     store: store$4,
     key: i
   })) : /*#__PURE__*/React__default.cloneElement(subView, {
     store: store$4
-  })), /*#__PURE__*/React__default.createElement(Button, {
-    variant: "ghost",
-    type: "button",
-    className: `plc-text-gray-500 plc-rounded-2xl plc-absolute plc-z-max plc-top-2 md:plc-top-5 ${dashboardLayout == "left" ? "plc-right-2 md:plc-right-10" : "plc-left-2 md:plc-left-10"}`,
-    onClick: closeSubMenusTab
-  }, /*#__PURE__*/React__default.createElement(SvgXIcon, {
-    className: "plc-fill-current"
   }))));
 };
 
@@ -37117,6 +37106,7 @@ const Card = ({
   className = "",
   title,
   requestStates,
+  dashboardLayout,
   back,
   ...restProps
 }) => {
@@ -37124,11 +37114,16 @@ const Card = ({
   const {
     switchDashboardView
   } = usePelcro();
+
+  const closeSubMenusTab = () => {
+    switchDashboardView(null);
+  };
+
   return /*#__PURE__*/React__default.createElement("div", {
-    className: `plc-bg-white plc-border-2 plc-p-6 md:plc-p-8 plc-rounded plc-my-11 md:plc-mb-20 md:plc-mt-40 ${className}`,
+    className: `plc-relative plc-bg-white plc-border-2 plc-p-6 md:plc-p-8 plc-rounded plc-my-11 md:plc-mb-20 md:plc-mt-40 ${className}`,
     id: "plc-dashboard-card"
   }, title && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
-    className: "plc-flex plc-items-end plc-justify-between plc-border-b-2 plc-border-primary-400 plc-pb-2 plc-mb-10"
+    className: "plc-flex plc-items-end plc-justify-between plc-border-b-2 plc-border-primary-400 plc-pb-2 plc-mb-10 plc-mt-5"
   }, /*#__PURE__*/React__default.createElement("h3", {
     className: "plc-font-bold plc-text-xl"
   }, title), (requestStates === null || requestStates === void 0 ? void 0 : requestStates.loading) && /*#__PURE__*/React__default.createElement("span", {
@@ -37141,7 +37136,14 @@ const Card = ({
     onClick: () => {
       switchDashboardView(back === null || back === void 0 ? void 0 : back.target);
     }
-  }, "Back"))), children);
+  }, "Back"))), children, /*#__PURE__*/React__default.createElement(Button, {
+    variant: "ghost",
+    type: "button",
+    className: "plc-text-gray-500 plc-rounded-2xl plc-absolute plc-z-max plc-top-1 plc-right-1",
+    onClick: closeSubMenusTab
+  }, /*#__PURE__*/React__default.createElement(SvgXIcon, {
+    className: "plc-fill-current"
+  })));
 };
 
 const ProfileMenu = props => {

package/dist/pelcro.css

@@ -2044,10 +2044,6 @@ apple-pay-button {
   top: 0.25rem;
 }
 
-.pelcro-root .plc-top-2{
-  top: 0.5rem;
-}
-
 .pelcro-root .plc-top-4{
   top: 1rem;
 }
@@ -2120,10 +2116,6 @@ apple-pay-button {
   left: 0px;
 }
 
-.pelcro-root .plc-left-2{
-  left: 0.5rem;
-}
-
 .pelcro-root .plc-left-4{
   left: 1rem;
 }
@@ -3852,18 +3844,6 @@ apple-pay-button {
 }
 
 @media (min-width: 768px){
-  .pelcro-root .md\:plc-top-5{
-    top: 1.25rem;
-  }
-
-  .pelcro-root .md\:plc-right-10{
-    right: 2.5rem;
-  }
-
-  .pelcro-root .md\:plc-left-10{
-    left: 2.5rem;
-  }
-
   .pelcro-root .md\:plc-mx-auto{
     margin-left: auto;
     margin-right: auto;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pelcro/react-pelcro-js",
   "description": "Pelcro's React UI Elements",
-  "version": "4.0.0-alpha.71",
+  "version": "4.0.0-alpha.72",
   "license": "MIT",
   "private": false,
   "main": "dist/index.cjs.js",