tabexseriescomponents 0.0.707 → 0.0.708

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "tabexseriescomponents",
-    "version": "0.0.707",
+    "version": "0.0.708",
     "description": "your description",
     "main": "dist/index.cjs.js",
     "scripts": {

package/{srcoriginal → srcoman}/TabexComponents/Cards/Card23/Card23.jsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import { css } from 'glamor';
+import { css, left } from 'glamor';
 import { Imagekitimagecomp } from '../../../Imagekitconfig.jsx';
 import { FiShoppingCart } from '@react-icons/all-files/fi/FiShoppingCart';
 import { FiShoppingBag } from '@react-icons/all-files/fi/FiShoppingBag';
@@ -237,6 +237,22 @@ const Card23 = (props) => {
                 maxWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.widthresponsive + 'px',
             },
         }),
+        pillcont: css({
+            position: 'absolute',
+            top: sectionproperties.counterposition == 'Top' ? sectionproperties.pillpositionfromtop + 'px' : '',
+            bottom: sectionproperties.counterposition == 'Bottom' ? sectionproperties.pillpositionfromtop + 'px' : '',
+            left: sectionproperties.pillpositionfromright + 'px',
+            width: sectionproperties.pillwidth + 'px',
+            height: sectionproperties.pillheight + 'px',
+            background: sectionproperties.pillbgcolor,
+            borderRadius: sectionproperties.pillborderBottomLeftRadius + 'px',
+            display: item.defaultprice == 0 && item.defaultsaleprice == 0 ? 'none' : 'flex',
+            '@media (max-width: 800px)': {
+                top: sectionproperties.counterposition == 'Top' ? '7px' : '',
+                // bottom: sectionproperties.counterposition == 'Bottom' ?  '7px' : '',
+                left: '7px',
+            },
+        }),
     };
     const plainString = (html) => {
         var divContainer = document.createElement('div');
@@ -361,20 +377,7 @@ const Card23 = (props) => {
                     </div>
                 )}
                 {sectionproperties.showpill == 'Show' && item.hassale == 1 && (
-                    <div
-                        class="align-items-center justify-content-center"
-                        style={{
-                            position: 'absolute',
-                            top: sectionproperties.counterposition == 'Top' ? sectionproperties.pillpositionfromtop + 'px' : '',
-                            bottom: sectionproperties.counterposition == 'Bottom' ? sectionproperties.pillpositionfromtop + 'px' : '',
-                            left: sectionproperties.pillpositionfromright + 'px',
-                            width: sectionproperties.pillwidth + 'px',
-                            height: sectionproperties.pillheight + 'px',
-                            background: sectionproperties.pillbgcolor,
-                            borderRadius: sectionproperties.pillborderBottomLeftRadius + 'px',
-                            display: item.defaultprice == 0 && item.defaultsaleprice == 0 ? 'none' : 'flex',
-                        }}
-                    >
+                    <div class={cardsstyles2.pillcont + ' align-items-center justify-content-center '} style={{}}>
                         <p class="m-0 p-0 text-uppercase" style={{ color: sectionproperties.pillcolor, fontSize: sectionproperties.pillfontSize + 'px', direction: 'ltr' }}>
                             {'-' + parseFloat(Math.round(10.0 * ((parseInt(item.defaultprice) - parseInt(item.defaultsaleprice)) / parseInt(item.defaultprice)) * 100) / 10.0).toFixed(0) + '%'}
                         </p>
@@ -416,7 +419,13 @@ const Card23 = (props) => {
     };
     return (
         <div
-            class={props.sectiontypeprops2 == 'vertical' ? `${cardsstyles2.productcard}` + ' w-100 px-md-1 ' : ` ${cardsstyles2.productcard}`}
+            class={
+                props.sectiontypeprops2 == 'vertical'
+                    ? sectionproperties.card_marginLeft != 0
+                        ? `${cardsstyles2.productcard}` + ' w-100 px-md-1 '
+                        : `${cardsstyles2.productcard}` + ' w-100 px-md-0 '
+                    : ` ${cardsstyles2.productcard}`
+            }
             style={{
                 paddingLeft: langdetect == 'en' ? sectionproperties.card_marginLeft + 'px' : sectionproperties.card_marginRight + 'px',
                 paddingRight: langdetect == 'en' ? sectionproperties.card_marginRight + 'px' : sectionproperties.card_marginLeft + 'px',
@@ -534,8 +543,8 @@ const Card23 = (props) => {
                                 //     ? ` ${cardsstyles2.imageContainer} ${cardstyles.imagecontainer}` + ' d-flex d-md-none '
                                 //     : ` ${cardsstyles2.imageContainer} ` + ' d-flex d-md-none '
                                 sectionproperties.hideshowcardtransition == 'Show'
-                                    ? ` ${cardsstyles2.imageContainer} ${cardstyles.imagecontainer}` + ' d-flex d-md-none '
-                                    : ` ${cardsstyles2.imageContainer} ` + ' d-flex d-md-none '
+                                    ? ` ${cardsstyles2.imageContainer} ${cardstyles.imagecontainer}` + ' d-flex '
+                                    : ` ${cardsstyles2.imageContainer} ` + ' d-flex '
                             }
                             style={{
                                 height: sectionproperties.image_height + 'px',
@@ -544,7 +553,7 @@ const Card23 = (props) => {
                         >
                             {Image('normal')}
                         </div>
-                        <div
+                        {/* <div
                             class={cardsstyles2.imageContainer + ' d-none d-md-flex '}
                             style={{
                                 height: sectionproperties.height_responsive + 'px',
@@ -552,7 +561,7 @@ const Card23 = (props) => {
                             }}
                         >
                             {Image('responsive')}
-                        </div>
+                        </div> */}
                         <div
                             class={sectionproperties.innersectionpaddinghorizontal == 0 ? 'row m-0 w-100' : 'row m-0 w-100 pl-sm-2 pr-sm-2'}
                             style={{

package/{srcoriginal → srcoman}/TabexComponents/Cards/CategoryCardwithhoveraction/CategoryCardwithhoveraction.jsx

@@ -212,7 +212,7 @@ const CategoryCardwithhoveraction = (props) => {
                                         style={{
                                             display: 'flex',
                                             justifyContent: sectionproperties.generaltext_position == 'Centered' ? 'center' : 'start',
-                                            zIndex: 10,
+                                            zIndex: 10000,
                                         }}
                                     >
                                         <p
@@ -230,7 +230,7 @@ const CategoryCardwithhoveraction = (props) => {
                             {sectionproperties.generalbtn_show == 'Show' && (
                                 <ul class={`${cardstyles.buttons_container}` + ' m-0 p-0 '}>
                                     <li
-                                        style={{ zIndex: 10 }}
+                                        style={{ zIndex: 10000 }}
                                         class={langdetect == 'en' ? 'ml-4 cursor-pointer ' : 'mr-4 cursor-pointer '}
                                         onClick={(e) => {
                                             e.stopPropagation();

package/{srcoriginal → srcoman}/TabexComponents/Cards/Categorycard_withtext/Categorycard_withtext.jsx

@@ -103,7 +103,7 @@ const Categorycard_withtext = (props) => {
             fontWeight: sectionproperties.generaltext_fontWeight,
             transition: '.3s',
             cursor: 'pointer',
-            zIndex: 100,
+            zIndex: 1000,
             ':hover': {
                 color: sectionproperties.text_secondarycolor,
             },
@@ -122,7 +122,7 @@ const Categorycard_withtext = (props) => {
             textTransform: sectionproperties.generalbtn_texttransform,
             opacity: sectionproperties.generalbtn_showonhover == 'Show On Hover' ? 0 : 1,
             top: sectionproperties.generalbtn_showonhover == 'Show On Hover' ? '100px' : 0,
-            zIndex: 100,
+            zIndex: 1000,
             ':hover': {
                 backgroundColor: sectionproperties.generalbtn_bgColoronhover,
                 color: sectionproperties.generalbtn_textColoronhover,

package/{srcoriginal → srcoman}/TabexComponents/Cards/Classiccategorycard/Classiccategorycard.jsx

@@ -126,7 +126,6 @@ const Classiccategorycard = (props) => {
                     bottom: sectionproperties.generaltext_position == 'Centered' ? '50%' : '7%',
                     paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px',
                     paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px',
-                    left: 0,
                 }}
             >
                 <div class={`${card_cssstyles.textContainer} ` + ' allcentered pl-2 pr-2 '}>

package/{srcoriginal → srcoman}/TabexComponents/Cards/MenuCard/MenuCard.jsx

@@ -327,7 +327,7 @@ const MenuCard = (props) => {
             }}
         >
             {sectionproperties.length != 0 && (
-                <div class={`${card_cssstyles.productcard}` + ' w-100 pl-sm-0 pr-sm-0 px-sm-2 '}>
+                <div class={`${card_cssstyles.productcard}` + ' w-100 pl-sm-0 pr-sm-0 '}>
                     <div class="row w-100 m-0 d-flex">
                         {sectionproperties.image_show == 'show' && (
                             <div
@@ -340,8 +340,8 @@ const MenuCard = (props) => {
                                 }}
                                 class={
                                     langdetect == 'en'
-                                        ? `${card_cssstyles.productcardimagecont}` + ' d-flex justify-content-start mr-2 m-sm-0 '
-                                        : `${card_cssstyles.productcardimagecont}` + ' d-flex justify-content-start ml-2 m-sm-0 '
+                                        ? `${card_cssstyles.productcardimagecont}` + ' d-flex justify-content-start mr-2 '
+                                        : `${card_cssstyles.productcardimagecont}` + ' d-flex justify-content-start ml-2 '
                                 }
                                 style={{}}
                             >
@@ -382,32 +382,19 @@ const MenuCard = (props) => {
                                             </div>
                                         )}
                                         {sectionproperties.prodCatShow == 'Show' && (
-                                            // <p
-                                            // //     class={`${card_cssstyles.productDescStyles}` + ' col-lg-12 mt-2 mb-1 wordbreak wordbreak2 p-0 '}
-                                            // //     style={{
-                                            // //         textAlign: langdetect == 'en' ? 'left' : 'right',
-                                            // //     }}
-                                            // // >
-                                            // //     {plainString(langdetect == 'en' ? item.description_en : item.description_ar)}
-                                            // // </p>
                                             <p
-                                                class={
-                                                    sectionproperties.descriptionwordbreak == 'None'
-                                                        ? `${card_cssstyles.productDescStyles}` + ' col-lg-12 p-0   mt-1 '
-                                                        : `${card_cssstyles.productDescStyles}` + ' col-lg-12 p-0 wordbreak wordbreak4 mt-1 '
-                                                }
+                                                class={`${card_cssstyles.productDescStyles}` + ' col-lg-12 mt-2 mb-1 wordbreak wordbreak2 p-0 '}
                                                 style={{
-                                                    textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+                                                    textAlign: langdetect == 'en' ? 'left' : 'right',
                                                 }}
-                                                dangerouslySetInnerHTML={{ __html: item.shortdescription }}
                                             >
-                                                {/* {plainString(langdetect == 'en' ? item.description_en : item.description_ar)} */}
+                                                {plainString(langdetect == 'en' ? item.description_en : item.description_ar)}
                                             </p>
                                         )}
                                     </div>
                                 </div>
                                 <div style={{ display: 'flex', flexDirection: 'column', alignContent: 'space-between' }} class="col-lg-3 col-md-3 col-sm-12 mt-2 p-0">
-                                    <div class="row m-0 w-100 d-flex flex-column flex-sm-column justify-content-end justify-content-sm-start">
+                                    <div class="row m-0 w-100 d-flex flex-column flex-sm-row justify-content-end justify-content-sm-start">
                                         {sectionproperties.prodPriceShow == 'Show' && sectionproperties.removedecimals == 'Show' && (
                                             <p
                                                 class={
@@ -437,9 +424,9 @@ const MenuCard = (props) => {
                                                 class={
                                                     langdetect == 'en'
                                                         ? `${card_cssstyles.productSalePricestyles}` +
-                                                          ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-right text-sm-left ml-sm-3 mr-sm-3 m-sm-0 '
+                                                          ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-right text-sm-left ml-sm-3 mr-sm-3 '
                                                         : `${card_cssstyles.productSalePricestyles}` +
-                                                          ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-left text-sm-right ml-sm-3 mr-sm-3 m-sm-0 '
+                                                          ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-left text-sm-right ml-sm-3 mr-sm-3 '
                                                 }
                                             >
                                                 {langdetect == 'en' ? 'EGP' : ''} {item.defaultprice} {langdetect == 'en' ? '' : 'ج.م'}
@@ -450,12 +437,13 @@ const MenuCard = (props) => {
                                                 class={
                                                     langdetect == 'en'
                                                         ? `${card_cssstyles.productSalePricestyles}` +
-                                                          ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-right text-sm-left ml-sm-3 mr-sm-3 m-sm-0 '
+                                                          ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-right text-sm-left ml-sm-3 mr-sm-3 '
                                                         : `${card_cssstyles.productSalePricestyles}` +
-                                                          ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-left text-sm-right ml-sm-3 mr-sm-3 m-sm-0 '
+                                                          ' linethrough m-0 wordbreak d-flex mt-sm-auto mb-sm-auto text-left text-sm-right ml-sm-3 mr-sm-3 '
                                                 }
                                             >
-                                                {langdetect == 'en' ? 'EGP' : ''} {parseFloat(Number(item.defaultprice).toFixed(2))} {langdetect == 'en' ? '' : 'ج.م'}
+                                                {langdetect == 'en' ? 'EGP' : ''}
+                                                {parseFloat(Number(item.defaultprice).toFixed(2))} {langdetect == 'en' ? '' : 'ج.م'}
                                             </p>
                                         )}
                                     </div>

package/{srcoriginal → srcoman}/TabexComponents/Cards/Productcard_with_zoominonhover/Productcard_with_zoominonhover.jsx

@@ -74,7 +74,6 @@ const Productcard_with_zoominonhover = (props) => {
             productid: item.productid,
             variantid: '',
             quantity: item.quantity,
-            vendorid: item.vendorid,
         };
 
         var runfunc = false;
@@ -112,7 +111,7 @@ const Productcard_with_zoominonhover = (props) => {
             border: sectionproperties.sectioncardborderwidth + 'px solid ' + sectionproperties.sectioncardbordercolor,
             transition: '.3s',
             ':hover': {
-                // zIndex: 1000,
+                zIndex: 1000,
             },
         }),
         productNameStyles: css({
@@ -188,9 +187,6 @@ const Productcard_with_zoominonhover = (props) => {
             borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px',
             background: sectionproperties.image_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.image_bgcolor,
             opacity: item.currentquantity < 1 && sectionproperties.showoutofstock == 'Show' && item.quantavailtype == 'limit' ? 0.4 : 1,
-            '@media (max-width: 800px)': {
-                height: sectionproperties.height_responsive + 'px',
-            },
         }),
         quantitybtn: css({
             flex: 1,
@@ -267,7 +263,7 @@ const Productcard_with_zoominonhover = (props) => {
             if (AddtoCartMutationContext?.variables?.productid == item.productid) {
                 return (
                     <div class={' d-flex align-items-center justify-content-center '}>
-                        <CircularProgress color={sectionproperties.cartBtnTextcolor} width="20px" height="20px" duration="1s" />
+                        <CircularProgress color="white" width="20px" height="20px" duration="1s" />
                     </div>
                 );
             } else {
@@ -384,7 +380,7 @@ const Productcard_with_zoominonhover = (props) => {
                                     </button>
                                 </div>
                             )}
-                            {item?.hassale == 1 && sectionproperties.prodsalePriceshow == 'Show' && sectionproperties.showbadge == 'Show' && (
+                            {item?.hassale == 1 && sectionproperties.prodsalePriceshow == 'Show' && (
                                 <div
                                     class="allcentered"
                                     style={{
@@ -402,44 +398,6 @@ const Productcard_with_zoominonhover = (props) => {
                                     </p>
                                 </div>
                             )}
-                            {sectionproperties.showpill == 'Show' && item.hassale == 1 && (
-                                <div
-                                    style={{
-                                        position: 'absolute',
-                                        top: sectionproperties.pillpositionfromtop + 'px',
-                                        left: sectionproperties.pillpositionfromright + 'px',
-                                        // right: langdetect == 'en' ? '' : sectionproperties.pillpositionfromright + 'px',
-                                        zIndex: 3,
-                                    }}
-                                >
-                                    <div
-                                        class={sectionproperties.pillwidth == 0 ? ' px-2 allcentered' : 'allcentered'}
-                                        style={{
-                                            zIndex: 2,
-                                            width: sectionproperties.pillwidth == 0 ? 'auto' : sectionproperties.pillwidth + 'px',
-                                            height: sectionproperties.pillheight + 'px',
-                                            background: sectionproperties.pillbgcolor,
-                                            borderRadius: sectionproperties.pillborderBottomLeftRadius + 'px',
-                                        }}
-                                    >
-                                        {sectionproperties.countertype == 'Percentage' && (
-                                            <p class="m-0 p-0" style={{ color: sectionproperties.pillcolor, fontSize: sectionproperties.pillfontSize + 'px', direction: 'ltr' }}>
-                                                {'-' +
-                                                    parseFloat(Math.round(10.0 * ((parseInt(item.defaultprice) - parseInt(item.defaultsaleprice)) / parseInt(item.defaultprice)) * 100) / 10.0).toFixed(
-                                                        0,
-                                                    ) +
-                                                    '%'}
-                                            </p>
-                                        )}
-                                        {sectionproperties.countertype == 'Value' && (
-                                            <p class="m-0 p-0 text-uppercase" style={{ color: sectionproperties.pillcolor, fontSize: sectionproperties.pillfontSize + 'px', direction: 'ltr' }}>
-                                                {langdetect == 'en' ? 'Save' : 'وفر'} {langdetect == 'en' ? item.currencyname : ''}{' '}
-                                                {parseFloat(Math.round(parseInt(item.defaultprice) - parseInt(item.defaultsaleprice))).toFixed(0)} {langdetect == 'en' ? '' : item.currencyname}
-                                            </p>
-                                        )}
-                                    </div>
-                                </div>
-                            )}
                             {item.currentquantity < 1 && sectionproperties.showoutofstock == 'Show' && item.quantavailtype == 'limit' && (
                                 <div class={`${cardsstyles2.outstockbadge}` + ' allcentered '}>
                                     <p class="m-0 p-0">{langdetect == 'en' ? sectionproperties.outstock_contenten : sectionproperties.outstock_contentar}</p>

package/{srcoriginal → srcoman}/TabexComponents/Cards/QuantityButtonBasedProductCard/QuantityButtonBasedProductCard.jsx

@@ -285,6 +285,8 @@ const QuantityButtonBasedProductCard = (props) => {
             style={{
                 paddingLeft: langdetect == 'en' ? sectionproperties.card_marginLeft + 'px' : sectionproperties.card_marginRight + 'px',
                 paddingRight: langdetect == 'en' ? sectionproperties.card_marginRight + 'px' : sectionproperties.card_marginLeft + 'px',
+                minWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.width + 'px',
+                maxWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.width + 'px',
             }}
         >
             {sectionproperties.length != 0 && (

package/{srcoriginal → srcoman}/TabexComponents/Cards/Simpleproductcard/Simpleproductcard.jsx

@@ -29,7 +29,7 @@ const Simpleproductcard = (props) => {
     const ikimagecredcontext = props.actions.ikimagecredcontext;
     const NotificationManager = props.actions.NotificationManager;
     const AddtoCartContext = props.actions.AddtoCartContext;
-    const AddtoCartMutationContext = props.actions.AddtoCartMutationContext;
+    const AddtoCartMutationContext = props.AddtoCartMutationContext;
     const [addtocardpayloadobj, setaddtocardpayloadobj] = useState('');
 
     const plainString = (html) => {
@@ -718,7 +718,7 @@ const Simpleproductcard = (props) => {
                                         textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
                                     }}
                                 >
-                                    {plainString(item.description)}
+                                    {plainString(item.shortdescription)}
                                 </p>
                             )}