@pelcro/react-pelcro-js 4.0.0-alpha.39 → 4.0.0-alpha.40

package/dist/index.cjs.js

@@ -19295,10 +19295,11 @@ class SelectModal extends React.Component {
       };
 
       const {
+        name,
         image,
         description
       } = this.state.product;
-      const tabs = this.state.productList.map((product, index) => {
+      this.state.productList.map((product, index) => {
         if (product.id === this.state.product.id && this.state.scrollToTab) {
           this.setState(oldState => {
             if (+oldState.initialTabSlide !== +index) {
@@ -19322,15 +19323,10 @@ class SelectModal extends React.Component {
       return /*#__PURE__*/React__default['default'].createElement("div", {
         className: "plc-flex plc-flex-col"
       }, /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "productTabs plc-relative md:plc-max-w-xl md:plc-mx-auto plc-w-full"
-      }, /*#__PURE__*/React__default['default'].createElement(Carousel, {
-        slidesCount: tabs.length,
-        initialSlide: this.state.initialTabSlide,
-        dots: false,
-        arrowsSize: "small"
-      }, tabs)), /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "selectedProduct plc-flex plc-flex-col plc-items-center plc-justify-center plc-max-w-3xl plc-mx-auto plc-mt-6"
-      }, image && /*#__PURE__*/React__default['default'].createElement("figure", {
+        className: "selectedProduct plc-flex plc-flex-col plc-items-center plc-justify-center plc-max-w-3xl plc-mx-auto"
+      }, /*#__PURE__*/React__default['default'].createElement("h3", {
+        className: "plc-text-2xl plc-mb-3"
+      }, name), image && /*#__PURE__*/React__default['default'].createElement("figure", {
         className: "plc-mb-2"
       }, /*#__PURE__*/React__default['default'].createElement("img", {
         src: image,
@@ -19397,7 +19393,7 @@ class SelectModal extends React.Component {
         }, /*#__PURE__*/React__default['default'].createElement("div", {
           className: "plc-pt-4 plc-mb-4 plc-font-semibold pelcro-select-plan-price plc-px-4 plc-text-center plc-flex plc-items-end plc-justify-center"
         }, /*#__PURE__*/React__default['default'].createElement("p", {
-          className: "plc-font-bold plc-text-4xl"
+          className: "plc-font-bold plc-text-3xl"
         }, plan.amount_formatted), /*#__PURE__*/React__default['default'].createElement("span", {
           className: "plc-text-gray-400 plc-text-xs plc-flex plc-flex-col plc-font-normal"
         }, /*#__PURE__*/React__default['default'].createElement("span", {

package/dist/index.esm.js

@@ -19265,10 +19265,11 @@ class SelectModal extends Component {
       };
 
       const {
+        name,
         image,
         description
       } = this.state.product;
-      const tabs = this.state.productList.map((product, index) => {
+      this.state.productList.map((product, index) => {
         if (product.id === this.state.product.id && this.state.scrollToTab) {
           this.setState(oldState => {
             if (+oldState.initialTabSlide !== +index) {
@@ -19292,15 +19293,10 @@ class SelectModal extends Component {
       return /*#__PURE__*/React__default.createElement("div", {
         className: "plc-flex plc-flex-col"
       }, /*#__PURE__*/React__default.createElement("div", {
-        className: "productTabs plc-relative md:plc-max-w-xl md:plc-mx-auto plc-w-full"
-      }, /*#__PURE__*/React__default.createElement(Carousel, {
-        slidesCount: tabs.length,
-        initialSlide: this.state.initialTabSlide,
-        dots: false,
-        arrowsSize: "small"
-      }, tabs)), /*#__PURE__*/React__default.createElement("div", {
-        className: "selectedProduct plc-flex plc-flex-col plc-items-center plc-justify-center plc-max-w-3xl plc-mx-auto plc-mt-6"
-      }, image && /*#__PURE__*/React__default.createElement("figure", {
+        className: "selectedProduct plc-flex plc-flex-col plc-items-center plc-justify-center plc-max-w-3xl plc-mx-auto"
+      }, /*#__PURE__*/React__default.createElement("h3", {
+        className: "plc-text-2xl plc-mb-3"
+      }, name), image && /*#__PURE__*/React__default.createElement("figure", {
         className: "plc-mb-2"
       }, /*#__PURE__*/React__default.createElement("img", {
         src: image,
@@ -19367,7 +19363,7 @@ class SelectModal extends Component {
         }, /*#__PURE__*/React__default.createElement("div", {
           className: "plc-pt-4 plc-mb-4 plc-font-semibold pelcro-select-plan-price plc-px-4 plc-text-center plc-flex plc-items-end plc-justify-center"
         }, /*#__PURE__*/React__default.createElement("p", {
-          className: "plc-font-bold plc-text-4xl"
+          className: "plc-font-bold plc-text-3xl"
         }, plan.amount_formatted), /*#__PURE__*/React__default.createElement("span", {
           className: "plc-text-gray-400 plc-text-xs plc-flex plc-flex-col plc-font-normal"
         }, /*#__PURE__*/React__default.createElement("span", {

package/dist/pelcro.css

@@ -3197,11 +3197,6 @@ in order to scope selectors under pelcro-root
   line-height: 2.25rem;
 }
 
-.pelcro-root .plc-text-4xl{
-  font-size: 2.25rem;
-  line-height: 2.5rem;
-}
-
 .pelcro-root .plc-font-thin{
   font-weight: 100;
 }

package/package.json

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