@rebilly/instruments 3.39.3 → 3.39.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rebilly/instruments",
-  "version": "3.39.3",
+  "version": "3.39.4",
   "author": "Rebilly",
   "license": "MIT",
   "main": "dist/index.js",

package/src/functions/mount/index.js

@@ -23,9 +23,12 @@ export async function mount({
     state.data = {};
     state.options = {};
 
+    // Setup options
+    state.options = setupOptions({ options });
+
     // Setup DOM
-    state.form = setupElement({ element: 'form', options });
-    state.summary = setupElement({ element: 'summary', options });
+    state.form = setupElement({ element: 'form' });
+    state.summary = setupElement({ element: 'summary' });
     // hardcode max-width to not break UX
     // PayPal button cannot exceed 750px;
     state.form.style.maxWidth = '750px';
@@ -34,10 +37,9 @@ export async function mount({
     }
 
     // Setup state
-    state.options = setupOptions({ options });
-    state.storefront = setupStorefront({ options });
-    state.mainStyleVars = setupStylesVars({ options });
-    state.options.themeFramepay = setupFramepayTheme({ options });
+    state.storefront = setupStorefront();
+    state.mainStyleVars = setupStylesVars();
+    state.options.themeFramepay = setupFramepayTheme();
 
     // Setup loader
     state.loader.addDOMElement({ el: state.form });

package/src/functions/mount/setup-element.js

@@ -1,6 +1,9 @@
 import { processPropertyAsDOMElement } from '../../utils';
+import state from '../../state';
 
-export default ({element = '', options = {}}) => {
+export default ({element = ''}) => {
+  const {options} = state;
+  
   if (element !== 'form' && element !== 'summary') {
     throw new Error('element must be "form" or "summary"');
   }

package/src/functions/mount/setup-framepay-theme.js

@@ -45,12 +45,10 @@ const getStyleProps = (obj, particle = '') => {
   return output;
 }
 
-export default ({
-  options = {}
-}) => {
+export default () => {
   const fullCss = `
     ${state.mainStyleVars}
-    ${options.css || ''}
+    ${state.options?.css || ''}
   `;
 
   const resolvedCssVarsObj = replaceCssVars(fullCss);

package/src/functions/mount/setup-storefront.js

@@ -1,13 +1,13 @@
 import Storefront from '../../storefront';
+import state from '../../state';
 
-export default ({
-  options:{
+export default () => {
+  const {
     publishableKey,
     organizationId,
     apiMode,
     _dev
-  }
-}) => {
+  } = state.options;
 
   const storefront = {
     organizationId,

package/src/functions/mount/setup-styles-vars.js

@@ -1,13 +1,14 @@
 import { mainStyleVars } from '../../style';
 import { addDOMElement } from '../../utils';
 import { minifyCss } from '../../style/utils/minifyCss';
+import state from '../../state';
 
-export default ({
-  options: {
+export default () => {
+  const {
     theme  =  {},
     css,
-  }
-} = {}) => {
+  } = state.options;
+
   // Adds base CSS vars stylesheet
   const styleVars = mainStyleVars(theme || {});