@nuxt/scripts 0.11.10 → 0.12.0

package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsRectangle.vue

@@ -0,0 +1,61 @@
+<template>
+
+</template>
+
+<script setup>
+import { inject, onUnmounted } from "vue";
+import { whenever } from "@vueuse/core";
+import { MAP_INJECTION_KEY } from "./ScriptGoogleMaps.vue";
+const props = defineProps({
+  options: { type: Object, required: false }
+});
+const eventsWithoutPayload = [
+  "bounds_changed"
+];
+const eventsWithMapMouseEventPayload = [
+  "click",
+  "contextmenu",
+  "dblclick",
+  "drag",
+  "dragend",
+  "dragstart",
+  "mousedown",
+  "mousemove",
+  "mouseout",
+  "mouseover",
+  "mouseup"
+];
+const emit = defineEmits([]);
+const mapContext = inject(MAP_INJECTION_KEY, void 0);
+let rectangle = void 0;
+whenever(() => mapContext?.map.value && mapContext.mapsApi.value, () => {
+  rectangle = new mapContext.mapsApi.value.Rectangle({
+    map: mapContext.map.value,
+    ...props.options
+  });
+  setupRectangleEventListeners(rectangle);
+  whenever(() => props.options, (options) => {
+    rectangle?.setOptions(options);
+  }, {
+    deep: true
+  });
+}, {
+  immediate: true,
+  once: true
+});
+onUnmounted(() => {
+  if (!rectangle || !mapContext?.mapsApi.value) {
+    return;
+  }
+  mapContext.mapsApi.value.event.clearInstanceListeners(rectangle);
+  rectangle.setMap(null);
+});
+function setupRectangleEventListeners(rectangle2) {
+  eventsWithoutPayload.forEach((event) => {
+    rectangle2.addListener(event, () => emit(event));
+  });
+  eventsWithMapMouseEventPayload.forEach((event) => {
+    rectangle2.addListener(event, (payload) => emit(event, payload));
+  });
+}
+</script>

package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsRectangle.vue.d.ts

@@ -0,0 +1,31 @@
+type __VLS_Props = {
+    options?: Omit<google.maps.RectangleOptions, 'map'>;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    click: (payload: google.maps.MapMouseEvent) => any;
+    contextmenu: (payload: google.maps.MapMouseEvent) => any;
+    dblclick: (payload: google.maps.MapMouseEvent) => any;
+    drag: (payload: google.maps.MapMouseEvent) => any;
+    dragend: (payload: google.maps.MapMouseEvent) => any;
+    dragstart: (payload: google.maps.MapMouseEvent) => any;
+    mousedown: (payload: google.maps.MapMouseEvent) => any;
+    mousemove: (payload: google.maps.MapMouseEvent) => any;
+    mouseout: (payload: google.maps.MapMouseEvent) => any;
+    mouseover: (payload: google.maps.MapMouseEvent) => any;
+    mouseup: (payload: google.maps.MapMouseEvent) => any;
+    bounds_changed: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onContextmenu?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onDblclick?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onDrag?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onDragend?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onDragstart?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onMousedown?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onMousemove?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onMouseout?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onMouseover?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onMouseup?: ((payload: google.maps.MapMouseEvent) => any) | undefined;
+    onBounds_changed?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/ScriptAriaLoadingIndicator.d.vue.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/runtime/components/ScriptCarbonAds.d.vue.ts

@@ -0,0 +1,32 @@
+import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+type __VLS_Props = {
+    serve: string;
+    placement: string;
+    format: string;
+    /**
+     * Defines the trigger event to load the script.
+     */
+    trigger?: ElementScriptTrigger;
+};
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {};
+type __VLS_Slots = {} & {
+    awaitingLoad?: (props: typeof __VLS_1) => any;
+} & {
+    loading?: (props: typeof __VLS_3) => any;
+} & {
+    error?: (props: typeof __VLS_5) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    error: (error: string | Event) => any;
+    ready: (args_0: HTMLScriptElement) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onError?: ((error: string | Event) => any) | undefined;
+    onReady?: ((args_0: HTMLScriptElement) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ScriptCrisp.d.vue.ts

@@ -0,0 +1,44 @@
+import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+type __VLS_Props = {
+    /**
+     * Defines the trigger event to load the script.
+     */
+    trigger?: ElementScriptTrigger;
+    id: string;
+    runtimeConfig?: {
+        locale: string;
+    };
+    tokenId?: string;
+    cookieDomain?: string;
+    cookieExpiry?: number;
+};
+declare var __VLS_1: {
+    ready: any;
+}, __VLS_3: {}, __VLS_5: {}, __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    awaitingLoad?: (props: typeof __VLS_3) => any;
+} & {
+    loading?: (props: typeof __VLS_5) => any;
+} & {
+    error?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
+    crisp: import("#nuxt-scripts/types").UseScriptContext<import("../registry/crisp.js").CrispApi>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    error: () => any;
+    ready: (e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/crisp.js").CrispApi>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onError?: (() => any) | undefined;
+    onReady?: ((e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/crisp.js").CrispApi>) => any) | undefined;
+}>, {
+    trigger: ElementScriptTrigger;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ScriptCrisp.vue.d.ts

@@ -32,7 +32,9 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onError?: (() => any) | undefined;
     onReady?: ((e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/crisp.js").CrispApi>) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {
+    trigger: ElementScriptTrigger;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/components/ScriptGoogleAdsense.d.vue.ts

@@ -0,0 +1,37 @@
+import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+type __VLS_Props = {
+    dataAdClient: string;
+    dataAdSlot: string;
+    dataAdFormat?: 'auto' | 'rectangle' | 'vertical' | 'horizontal' | 'fluid' | 'autorelaxed';
+    dataAdLayout?: 'in-article' | 'in-feed' | 'fixed';
+    dataFullWidthResponsive?: boolean;
+    /**
+     * Defines the trigger event to load the script.
+     */
+    trigger?: ElementScriptTrigger;
+};
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {};
+type __VLS_Slots = {} & {
+    awaitingLoad?: (props: typeof __VLS_1) => any;
+} & {
+    loading?: (props: typeof __VLS_3) => any;
+} & {
+    error?: (props: typeof __VLS_5) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    error: () => any;
+    ready: (e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/google-adsense.js").GoogleAdsenseApi>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onError?: (() => any) | undefined;
+    onReady?: ((e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/google-adsense.js").GoogleAdsenseApi>) => any) | undefined;
+}>, {
+    dataAdFormat: "auto" | "rectangle" | "vertical" | "horizontal" | "fluid" | "autorelaxed";
+    dataFullWidthResponsive: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ScriptGoogleAdsense.vue.d.ts

@@ -24,7 +24,10 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onError?: (() => any) | undefined;
     onReady?: ((e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/google-adsense.js").GoogleAdsenseApi>) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {
+    dataAdFormat: "auto" | "rectangle" | "vertical" | "horizontal" | "fluid" | "autorelaxed";
+    dataFullWidthResponsive: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/components/ScriptIntercom.d.vue.ts

@@ -0,0 +1,45 @@
+import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+type __VLS_Props = {
+    appId: string;
+    apiBase?: string;
+    name?: string;
+    email?: string;
+    userId?: string;
+    alignment?: 'left' | 'right';
+    horizontalPadding?: number;
+    verticalPadding?: number;
+    /**
+     * Defines the trigger event to load the script.
+     */
+    trigger?: ElementScriptTrigger;
+};
+declare var __VLS_1: {
+    ready: any;
+}, __VLS_3: {}, __VLS_5: {}, __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    awaitingLoad?: (props: typeof __VLS_3) => any;
+} & {
+    loading?: (props: typeof __VLS_5) => any;
+} & {
+    error?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
+    intercom: import("#nuxt-scripts/types").UseScriptContext<import("../registry/intercom.js").IntercomApi>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    error: () => any;
+    ready: (e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/intercom.js").IntercomApi>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onError?: (() => any) | undefined;
+    onReady?: ((e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/intercom.js").IntercomApi>) => any) | undefined;
+}>, {
+    trigger: ElementScriptTrigger;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ScriptIntercom.vue.d.ts

@@ -33,7 +33,9 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onError?: (() => any) | undefined;
     onReady?: ((e: import("#nuxt-scripts/types").UseScriptContext<import("../registry/intercom.js").IntercomApi>) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {
+    trigger: ElementScriptTrigger;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/components/ScriptLemonSqueezy.d.vue.ts

@@ -0,0 +1,24 @@
+import type { ElementScriptTrigger } from '../types.js';
+type __VLS_Props = {
+    trigger?: ElementScriptTrigger;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    ready: (args_0: import("../types.js").UseScriptContext<import("../registry/lemon-squeezy.js").LemonSqueezyApi>) => any;
+    lemonSqueezyEvent: (args_0: never) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onReady?: ((args_0: import("../types.js").UseScriptContext<import("../registry/lemon-squeezy.js").LemonSqueezyApi>) => any) | undefined;
+    onLemonSqueezyEvent?: ((args_0: never) => any) | undefined;
+}>, {
+    trigger: ElementScriptTrigger;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ScriptLemonSqueezy.vue.d.ts

@@ -12,7 +12,9 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onReady?: ((args_0: import("../types.js").UseScriptContext<import("../registry/lemon-squeezy.js").LemonSqueezyApi>) => any) | undefined;
     onLemonSqueezyEvent?: ((args_0: never) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {
+    trigger: ElementScriptTrigger;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/components/ScriptLoadingIndicator.d.vue.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    color?: string;
+    size?: number;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: number;
+    color: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/components/ScriptLoadingIndicator.vue.d.ts

@@ -2,5 +2,8 @@ type __VLS_Props = {
     color?: string;
     size?: number;
 };
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: number;
+    color: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/runtime/components/ScriptPayPalButtons.d.vue.ts

@@ -0,0 +1,72 @@
+import { type HTMLAttributes, type ReservedProps } from 'vue';
+import type { OnApproveActions, OnApproveData, OnCancelledActions, OnClickActions, OnShippingAddressChangeActions, OnShippingAddressChangeData, OnShippingOptionsChangeActions, OnShippingOptionsChangeData, PayPalButtonsComponentOptions, OnInitActions } from '@paypal/paypal-js';
+import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+import type { PayPalInput } from '../registry/paypal.js';
+type __VLS_Props = {
+    /**
+     * Customize the root element attributes.
+     */
+    rootAttrs?: HTMLAttributes & ReservedProps & Record<string, unknown>;
+    /**
+     * Defines the trigger event to load the script.
+     */
+    trigger?: ElementScriptTrigger;
+    /**
+     * The client id for the paypal script.
+     */
+    clientId?: string;
+    /**
+     * The options for the paypal buttons.
+     */
+    buttonOptions?: PayPalButtonsComponentOptions;
+    /**
+     * The paypal script options.
+     */
+    paypalScriptOptions?: Partial<PayPalInput>;
+    /**
+     * Disables the paypal buttons.
+     */
+    disabled?: boolean;
+};
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_10: {}, __VLS_12: {}, __VLS_14: {};
+type __VLS_Slots = {} & {
+    placeholder?: (props: typeof __VLS_1) => any;
+} & {
+    loading?: (props: typeof __VLS_3) => any;
+} & {
+    awaitingLoad?: (props: typeof __VLS_10) => any;
+} & {
+    error?: (props: typeof __VLS_12) => any;
+} & {
+    default?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    error: (error: Record<string, unknown>) => any;
+    init: (data: Record<string, unknown>, actions: OnInitActions) => any;
+    cancel: (data: Record<string, unknown>, actions: OnCancelledActions) => any;
+    approve: (data: OnApproveData, actions: OnApproveActions) => any;
+    clickButtons: (data: Record<string, unknown>, actions: OnClickActions) => any;
+    shippingOptionsChange: (data: OnShippingOptionsChangeData, actions: OnShippingOptionsChangeActions) => any;
+    shippingAddressChange: (data: OnShippingAddressChangeData, actions: OnShippingAddressChangeActions) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onError?: ((error: Record<string, unknown>) => any) | undefined;
+    onInit?: ((data: Record<string, unknown>, actions: OnInitActions) => any) | undefined;
+    onCancel?: ((data: Record<string, unknown>, actions: OnCancelledActions) => any) | undefined;
+    onApprove?: ((data: OnApproveData, actions: OnApproveActions) => any) | undefined;
+    onClickButtons?: ((data: Record<string, unknown>, actions: OnClickActions) => any) | undefined;
+    onShippingOptionsChange?: ((data: OnShippingOptionsChangeData, actions: OnShippingOptionsChangeActions) => any) | undefined;
+    onShippingAddressChange?: ((data: OnShippingAddressChangeData, actions: OnShippingAddressChangeActions) => any) | undefined;
+}>, {
+    trigger: ElementScriptTrigger;
+    clientId: string;
+    buttonOptions: PayPalButtonsComponentOptions;
+    paypalScriptOptions: Partial<PayPalInput>;
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ScriptPayPalButtons.vue

@@ -0,0 +1,116 @@
+<script setup>
+import { computed, onMounted, ref, shallowRef, watch } from "vue";
+import { defu } from "defu";
+import { useScriptPayPal } from "../registry/paypal";
+import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
+import { onBeforeUnmount, resolveComponent } from "vue";
+const el = ref(null);
+const rootEl = ref(null);
+const props = defineProps({
+  rootAttrs: { type: Object, required: false },
+  trigger: { type: [String, Array, Boolean], required: false, default: "visible" },
+  clientId: { type: String, required: false, default: "test" },
+  buttonOptions: { type: Object, required: false, default: () => ({}) },
+  paypalScriptOptions: { type: Object, required: false, default: () => ({}) },
+  disabled: { type: Boolean, required: false, default: false }
+});
+const ready = ref(false);
+const { onLoaded, status } = useScriptPayPal({
+  clientId: props.clientId,
+  ...props.paypalScriptOptions
+});
+const emit = defineEmits(["approve", "error", "cancel", "clickButtons", "shippingOptionsChange", "shippingAddressChange", "init"]);
+const initActions = shallowRef(null);
+const handleDisabled = () => {
+  if (!initActions.value) return;
+  if (props.disabled) {
+    initActions.value.disable();
+  } else {
+    initActions.value.enable();
+  }
+};
+const options = computed(() => {
+  const _options = {
+    onApprove: async (data, actions) => {
+      emit("approve", data, actions);
+      return props.buttonOptions?.onApprove?.(data, actions);
+    },
+    onError: (err) => {
+      emit("error", err);
+      return props.buttonOptions?.onError?.(err);
+    },
+    onCancel: (data, actions) => {
+      emit("cancel", data, actions);
+      return props.buttonOptions?.onCancel?.(data, actions);
+    },
+    onClick: (data, actions) => {
+      emit("clickButtons", data, actions);
+      return props.buttonOptions?.onClick?.(data, actions);
+    },
+    onShippingOptionsChange: async (data, actions) => {
+      emit("shippingOptionsChange", data, actions);
+      return props.buttonOptions?.onShippingOptionsChange?.(data, actions);
+    },
+    onShippingAddressChange: async (data, actions) => {
+      emit("shippingAddressChange", data, actions);
+      return props.buttonOptions?.onShippingAddressChange?.(data, actions);
+    },
+    onInit: (data, actions) => {
+      initActions.value = actions;
+      actions.disable();
+      handleDisabled();
+      emit("init", data, actions);
+      return props.buttonOptions?.onInit?.(data, actions);
+    }
+  };
+  return defu(_options, props.buttonOptions);
+});
+watch(() => props.disabled, handleDisabled);
+const buttonInst = shallowRef();
+onMounted(() => {
+  onLoaded(async ({ paypal }) => {
+    if (!el.value) return;
+    buttonInst.value = paypal?.Buttons?.(options.value);
+    await buttonInst.value?.render(el.value);
+    ready.value = true;
+    watch(() => options.value, async (_options) => {
+      if (!el.value) return;
+      await buttonInst.value?.updateProps(_options);
+    });
+  });
+});
+async function destroy() {
+  if (buttonInst.value) {
+    await buttonInst.value?.close();
+  }
+}
+onBeforeUnmount(async () => {
+  await destroy();
+});
+const ScriptLoadingIndicator = resolveComponent("ScriptLoadingIndicator");
+const trigger = useScriptTriggerElement({ trigger: props.trigger, el: rootEl });
+const rootAttrs = computed(() => {
+  return defu(props.rootAttrs, {
+    "aria-busy": status.value === "loading",
+    "aria-label": status.value === "awaitingLoad" ? "PayPal Script Placeholder" : status.value === "loading" ? "PayPal Buttons Loading" : "PayPal Buttons",
+    "aria-live": "polite",
+    "role": "application",
+    ...trigger instanceof Promise ? trigger.ssrAttrs || {} : {}
+  });
+});
+</script>
+
+<template>
+  <div v-bind="rootAttrs" id="test">
+    <div v-show="ready" ref="el" />
+    <slot v-if="!ready" name="placeholder">
+      placeholder
+    </slot>
+    <slot v-if="status !== 'awaitingLoad' && !ready" name="loading">
+      <ScriptLoadingIndicator color="black" />
+    </slot>
+    <slot v-if="status === 'awaitingLoad'" name="awaitingLoad" />
+    <slot v-else-if="status === 'error'" name="error" />
+    <slot />
+  </div>
+</template>

package/dist/runtime/components/ScriptPayPalButtons.vue.d.ts

@@ -0,0 +1,72 @@
+import { type HTMLAttributes, type ReservedProps } from 'vue';
+import type { OnApproveActions, OnApproveData, OnCancelledActions, OnClickActions, OnShippingAddressChangeActions, OnShippingAddressChangeData, OnShippingOptionsChangeActions, OnShippingOptionsChangeData, PayPalButtonsComponentOptions, OnInitActions } from '@paypal/paypal-js';
+import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+import type { PayPalInput } from '../registry/paypal.js';
+type __VLS_Props = {
+    /**
+     * Customize the root element attributes.
+     */
+    rootAttrs?: HTMLAttributes & ReservedProps & Record<string, unknown>;
+    /**
+     * Defines the trigger event to load the script.
+     */
+    trigger?: ElementScriptTrigger;
+    /**
+     * The client id for the paypal script.
+     */
+    clientId?: string;
+    /**
+     * The options for the paypal buttons.
+     */
+    buttonOptions?: PayPalButtonsComponentOptions;
+    /**
+     * The paypal script options.
+     */
+    paypalScriptOptions?: Partial<PayPalInput>;
+    /**
+     * Disables the paypal buttons.
+     */
+    disabled?: boolean;
+};
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_10: {}, __VLS_12: {}, __VLS_14: {};
+type __VLS_Slots = {} & {
+    placeholder?: (props: typeof __VLS_1) => any;
+} & {
+    loading?: (props: typeof __VLS_3) => any;
+} & {
+    awaitingLoad?: (props: typeof __VLS_10) => any;
+} & {
+    error?: (props: typeof __VLS_12) => any;
+} & {
+    default?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    error: (error: Record<string, unknown>) => any;
+    init: (data: Record<string, unknown>, actions: OnInitActions) => any;
+    cancel: (data: Record<string, unknown>, actions: OnCancelledActions) => any;
+    approve: (data: OnApproveData, actions: OnApproveActions) => any;
+    clickButtons: (data: Record<string, unknown>, actions: OnClickActions) => any;
+    shippingOptionsChange: (data: OnShippingOptionsChangeData, actions: OnShippingOptionsChangeActions) => any;
+    shippingAddressChange: (data: OnShippingAddressChangeData, actions: OnShippingAddressChangeActions) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onError?: ((error: Record<string, unknown>) => any) | undefined;
+    onInit?: ((data: Record<string, unknown>, actions: OnInitActions) => any) | undefined;
+    onCancel?: ((data: Record<string, unknown>, actions: OnCancelledActions) => any) | undefined;
+    onApprove?: ((data: OnApproveData, actions: OnApproveActions) => any) | undefined;
+    onClickButtons?: ((data: Record<string, unknown>, actions: OnClickActions) => any) | undefined;
+    onShippingOptionsChange?: ((data: OnShippingOptionsChangeData, actions: OnShippingOptionsChangeActions) => any) | undefined;
+    onShippingAddressChange?: ((data: OnShippingAddressChangeData, actions: OnShippingAddressChangeActions) => any) | undefined;
+}>, {
+    trigger: ElementScriptTrigger;
+    clientId: string;
+    buttonOptions: PayPalButtonsComponentOptions;
+    paypalScriptOptions: Partial<PayPalInput>;
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};