@licklist/design 0.78.7-stage.10 → 0.78.7-stage.11

package/dist/iframe/ryft/RyftPaymentForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RyftPaymentForm.d.ts","sourceRoot":"","sources":["../../../src/iframe/ryft/RyftPaymentForm.tsx"],"names":[],"mappings":"AAWA,OAAO,EAEL,sBAAsB,EACvB,MAAM,kDAAkD,CAAA;AACzD,OAAO,EAAE,uBAAuB,EAAE,MAAM,0EAA0E,CAAA;AAIlH,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAW/C,CAAA;AAED,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;AAOzD,MAAM,WAAW,oBAAoB;IAEnC,SAAS,EAAE,GAAG,CAAA;IACd,eAAe,EAAE,OAAO,CAAA;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAA;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,EAAE,CACR,SAAS,EAAE,MAAM,IAAI,EACrB,SAAS,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,KAChC,OAAO,CAAC,IAAI,CAAC,CAAA;IAClB,QAAQ,EAAE,MAAM,OAAO,CAAC,sBAAsB,CAAC,CAAA;IAC/C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,uBAAuB,CAAC,EAAE,uBAAuB,CAAA;CAClD;AAED,eAAO,MAAM,eAAe,8JAUzB,oBAAoB,4CAqLtB,CAAA"}
+{"version":3,"file":"RyftPaymentForm.d.ts","sourceRoot":"","sources":["../../../src/iframe/ryft/RyftPaymentForm.tsx"],"names":[],"mappings":"AAWA,OAAO,EAEL,sBAAsB,EACvB,MAAM,kDAAkD,CAAA;AACzD,OAAO,EAAE,uBAAuB,EAAE,MAAM,0EAA0E,CAAA;AAIlH,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAW/C,CAAA;AAED,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;AAOzD,MAAM,WAAW,oBAAoB;IAEnC,SAAS,EAAE,GAAG,CAAA;IACd,eAAe,EAAE,OAAO,CAAA;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAA;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,EAAE,CACR,SAAS,EAAE,MAAM,IAAI,EACrB,SAAS,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,KAChC,OAAO,CAAC,IAAI,CAAC,CAAA;IAClB,QAAQ,EAAE,MAAM,OAAO,CAAC,sBAAsB,CAAC,CAAA;IAC/C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,uBAAuB,CAAC,EAAE,uBAAuB,CAAA;CAClD;AAED,eAAO,MAAM,eAAe,8JAUzB,oBAAoB,4CAmNtB,CAAA"}

package/dist/iframe/ryft/RyftPaymentForm.js

@@ -302,11 +302,10 @@ var RyftPaymentForm = function(param) {
             return _ref.apply(this, arguments);
         };
     }();
-    console.log((_formRef_current = formRef.current) === null || _formRef_current === void 0 ? void 0 : (_formRef_current_childNodes = _formRef_current.childNodes) === null || _formRef_current_childNodes === void 0 ? void 0 : _formRef_current_childNodes.length, "formRef.current?.childNodes?.length ");
+    console.log((_formRef_current = formRef.current) === null || _formRef_current === void 0 ? void 0 : (_formRef_current_childNodes = _formRef_current.childNodes) === null || _formRef_current_childNodes === void 0 ? void 0 : _formRef_current_childNodes.length, 'formRef.current?.childNodes?.length ');
     useEffect(function() {
-        var _formRef_current_childNodes, _formRef_current, _accountId_data;
-        if (!((_formRef_current = formRef.current) === null || _formRef_current === void 0 ? void 0 : (_formRef_current_childNodes = _formRef_current.childNodes) === null || _formRef_current_childNodes === void 0 ? void 0 : _formRef_current_childNodes.length) || // formRef.current?.childNodes?.length < 3 ||
-        !((_accountId_data = accountId.data) === null || _accountId_data === void 0 ? void 0 : _accountId_data.account_id)) {
+        var _formRef_current_childNodes, _formRef_current, _formRef_current_childNodes1, _formRef_current1, _accountId_data;
+        if (!((_formRef_current = formRef.current) === null || _formRef_current === void 0 ? void 0 : (_formRef_current_childNodes = _formRef_current.childNodes) === null || _formRef_current_childNodes === void 0 ? void 0 : _formRef_current_childNodes.length) || ((_formRef_current1 = formRef.current) === null || _formRef_current1 === void 0 ? void 0 : (_formRef_current_childNodes1 = _formRef_current1.childNodes) === null || _formRef_current_childNodes1 === void 0 ? void 0 : _formRef_current_childNodes1.length) < 3 || !((_accountId_data = accountId.data) === null || _accountId_data === void 0 ? void 0 : _accountId_data.account_id)) {
             return;
         }
         injectComponentsInRyftForm({
@@ -319,7 +318,32 @@ var RyftPaymentForm = function(param) {
     }, // eslint-disable-next-line react-hooks/exhaustive-deps
     [
         (_formRef_current1 = formRef.current) === null || _formRef_current1 === void 0 ? void 0 : (_formRef_current_childNodes1 = _formRef_current1.childNodes) === null || _formRef_current_childNodes1 === void 0 ? void 0 : _formRef_current_childNodes1.length,
-        showApplePayButton,
+        showApplePayButton
+    ]);
+    useEffect(function() {
+        var formBox = document.getElementById('form-disable-box');
+        var cardContainer = document.getElementById('ryft-pay-iframe');
+        var googleButton = document.getElementById('gpay-button-online-api-id');
+        if (cardContainer) {
+            var _Boolean;
+            cardContainer.style.opacity = !payButtonDisabled ? '0.6' : '1';
+            cardContainer.ariaDisabled = (_Boolean = Boolean(!payButtonDisabled)) === null || _Boolean === void 0 ? void 0 : _Boolean.toString();
+        }
+        var appleButton = document.getElementById('ryft-pay-apple-pay-button');
+        if (googleButton) {
+            googleButton.disabled = !payButtonDisabled;
+            googleButton.style.opacity = !payButtonDisabled ? '1' : '0.6';
+        }
+        if (appleButton) {
+            appleButton.disabled = !payButtonDisabled;
+            appleButton.style.opacity = payButtonDisabled ? '1' : '0.6';
+        }
+        if (formBox) {
+            formBox.style.display = payButtonDisabled ? 'block' : 'none';
+        }
+        var applePayButton = document.createElement('button');
+        applePayButton.style.opacity = payButtonDisabled ? '1' : '0.6';
+    }, [
         payButtonDisabled
     ]);
     useEffect(function() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.78.7-stage.10",
+  "version": "0.78.7-stage.11",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"

package/src/iframe/ryft/RyftPaymentForm.tsx

@@ -134,12 +134,15 @@ export const RyftPaymentForm = ({
       setIsBtnDisabled(false)
     }
   }
-  console.log(formRef.current?.childNodes?.length , "formRef.current?.childNodes?.length ")
+  console.log(
+    formRef.current?.childNodes?.length,
+    'formRef.current?.childNodes?.length ',
+  )
   useEffect(
     () => {
       if (
         !formRef.current?.childNodes?.length ||
-        // formRef.current?.childNodes?.length < 3 ||
+        formRef.current?.childNodes?.length < 3 ||
         !accountId.data?.account_id
       ) {
         return
@@ -154,13 +157,40 @@ export const RyftPaymentForm = ({
       })
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-      formRef.current?.childNodes?.length,
-      showApplePayButton,
-      payButtonDisabled,
-    ],
+    [formRef.current?.childNodes?.length, showApplePayButton],
   )
 
+  useEffect(() => {
+    const formBox = document.getElementById('form-disable-box')
+    const cardContainer = document.getElementById('ryft-pay-iframe')
+
+    const googleButton = document.getElementById(
+      'gpay-button-online-api-id',
+    ) as HTMLButtonElement
+
+    if (cardContainer) {
+      cardContainer.style.opacity = !payButtonDisabled ? '0.6' : '1'
+      cardContainer.ariaDisabled = Boolean(!payButtonDisabled)?.toString()
+    }
+
+    const appleButton = document.getElementById(
+      'ryft-pay-apple-pay-button',
+    ) as HTMLButtonElement
+    if (googleButton) {
+      googleButton.disabled = !payButtonDisabled
+      googleButton.style.opacity = !payButtonDisabled ? '1' : '0.6'
+    }
+    if (appleButton) {
+      appleButton.disabled = !payButtonDisabled
+      appleButton.style.opacity = payButtonDisabled ? '1' : '0.6'
+    }
+    if (formBox) {
+      formBox.style.display = payButtonDisabled ? 'block' : 'none'
+    }
+    const applePayButton = document.createElement('button')
+    applePayButton.style.opacity = payButtonDisabled ? '1' : '0.6'
+  }, [payButtonDisabled])
+
   useEffect(() => {
     if (!accountId.data?.account_id || accountId.isError) return
     initRyft(