tf-checkout-react 1.7.15 → 1.7.17

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.7.15",
+  "version": "1.7.17",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/addonsContainer/AddonComponent.tsx

@@ -83,20 +83,26 @@ const AddonComponent = ({
   return (
     <div key={id} className={`${classNamePrefix}_product_select_container`}>
       <div className={`${classNamePrefix}_product_select_block`} key={name}>
-        <div className={`${classNamePrefix}_product_size`}>{name}</div>
+        {!useStepperQty && <div className={`${classNamePrefix}_product_size`}>{name}</div>}
         <div className={`${classNamePrefix}_product_qty_select_block`}>
           {!active || (!_isNull(stock) && stock <= 0) ? (
-            <div className="sold_out">SOLD OUT</div>
+            <div className={`${classNamePrefix}_stepper_row`}>
+              <span className={`${classNamePrefix}_stepper_label`}>{name}</span>
+              <div className="sold_out">SOLD OUT</div>
+            </div>
           ) : (
             <>
               <div className={`${classNamePrefix}_product_qty_select`}>
                 {useStepperQty ? (
-                  <AddonStepper
-                    id={id}
-                    selectOptions={selectOptions}
-                    handleAddonChange={handleAddonChange}
-                    classNamePrefix={classNamePrefix}
-                  />
+                  <div className={`${classNamePrefix}_stepper_row`}>
+                    <span className={`${classNamePrefix}_stepper_label`}>{name}</span>
+                    <AddonStepper
+                      id={id}
+                      selectOptions={selectOptions}
+                      handleAddonChange={handleAddonChange}
+                      classNamePrefix={classNamePrefix}
+                    />
+                  </div>
                 ) : (
                   <Field
                     name={id}

package/src/components/addonsContainer/SimpleAddonsContainer.tsx

@@ -405,6 +405,7 @@ export const SimpleAddonsContainer = ({
                             configs={configs}
                             values={values}
                             errors={errors}
+                            useStepperQty={useStepperQty}
                           />
                         )}
                       </div>