refactor(examples): make code more readable

Author: softbeehive

examples/CardElement.vue

@@ -4,7 +4,7 @@
       v-if="stripeLoaded"
       class="py-3"
       :stripe-key="publishableKey"
-      :instance-options="instanceOptions"
+      :instance-options="stripeOptions"
       :elements-options="elementsOptions"
       ref="elementsComponent"
     >
@@ -35,7 +35,7 @@ import StripeElement from "../src/components/StripeElement.vue"
 import StripeElements from "../src/components/StripeElements.vue"
 
 const publishableKey = ref("pk_test_TYooMQauvdEDq54NiTphI7jx") // test key
-const instanceOptions = ref<StripeConstructorOptions>({
+const stripeOptions = ref<StripeConstructorOptions>({
   // https://stripe.com/docs/js/initializing#init_stripe_js-options
 })
 const elementsOptions = ref<StripeElementsOptions>({

examples/CardElementLegacy.vue

@@ -3,7 +3,7 @@
     v-if="stripeLoaded"
     v-slot="{ elements }"
     :stripe-key="stripeKey"
-    :instance-options="instanceOptions"
+    :instance-options="stripeOptions"
     :elements-options="elementsOptions"
     ref="elms"
     class="py-3"
@@ -39,7 +39,7 @@ export default defineComponent({
 
   setup() {
     const stripeKey = ref("pk_test_TYooMQauvdEDq54NiTphI7jx") // test key
-    const instanceOptions = ref({
+    const stripeOptions = ref({
       // https://stripe.com/docs/js/initializing#init_stripe_js-options
     })
     const elementsOptions = ref({
@@ -65,7 +65,7 @@ export default defineComponent({
     return {
       stripeKey,
       stripeLoaded,
-      instanceOptions,
+      stripeOptions,
       elementsOptions,
       cardOptions,
       card,

examples/ExpressCheckoutElement.vue

@@ -2,7 +2,7 @@
   <StripeElements
     v-if="stripeLoaded"
     :stripe-key="publishableKey"
-    :instance-options="instanceOptions"
+    :instance-options="stripeOptions"
     :elements-options="elementsOptions"
     ref="elementsComponent"
   >
@@ -27,7 +27,7 @@ import StripeElement from "../src/components/StripeElement.vue"
 import StripeElements from "../src/components/StripeElements.vue"
 
 const publishableKey = ref("pk_test_f3duw0VsAEM2TJFMtWQ90QAT") // test key
-const instanceOptions = ref<StripeConstructorOptions>({
+const stripeOptions = ref<StripeConstructorOptions>({
   // https://stripe.com/docs/js/initializing#init_stripe_js-options
 })
 const elementsOptions = ref<StripeElementsOptions>({

examples/PaymentElementDeferred.vue

@@ -3,7 +3,7 @@
     <StripeElements
       v-if="stripeLoaded"
       :stripe-key="stripeKey"
-      :instance-options="instanceOptions"
+      :instance-options="stripeOptions"
       :elements-options="elementsOptions"
       ref="elementsComponent"
       class="pb-4"
@@ -39,7 +39,7 @@ import StripeElement from "../src/components/StripeElement.vue"
 import StripeElements from "../src/components/StripeElements.vue"
 
 const stripeKey = ref("pk_test_f3duw0VsAEM2TJFMtWQ90QAT")
-const instanceOptions = ref({
+const stripeOptions = ref({
   // https://stripe.com/docs/js/initializing#init_stripe_js-options
 })
 const elementsOptions = ref<StripeElementsOptionsMode>({