@nuxt/scripts 0.13.2 → 1.0.0-beta.12

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

@@ -14,7 +14,7 @@ type __VLS_Props = {
     trigger?: ElementScriptTrigger;
 };
 declare var __VLS_1: {
-    ready: any;
+    ready: boolean;
 }, __VLS_3: {}, __VLS_5: {}, __VLS_7: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;

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

@@ -1,6 +1,6 @@
-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 { OnApproveActions, OnApproveData, OnCancelledActions, OnClickActions, OnInitActions, OnShippingAddressChangeActions, OnShippingAddressChangeData, OnShippingOptionsChangeActions, OnShippingOptionsChangeData, PayPalButtonsComponentOptions } from '@paypal/paypal-js';
+import type { HTMLAttributes, ReservedProps } from 'vue';
 import type { PayPalInput } from '../registry/paypal.js';
 type __VLS_Props = {
     /**

package/dist/runtime/components/ScriptPayPalButtons.vue

@@ -1,11 +1,8 @@
 <script setup>
-import { computed, onMounted, ref, shallowRef, watch } from "vue";
 import { defu } from "defu";
-import { useScriptPayPal } from "../registry/paypal";
+import { computed, onBeforeUnmount, onMounted, ref, resolveComponent, shallowRef, watch } from "vue";
 import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
-import { onBeforeUnmount, resolveComponent } from "vue";
-const el = ref(null);
-const rootEl = ref(null);
+import { useScriptPayPal } from "../registry/paypal";
 const props = defineProps({
   rootAttrs: { type: Object, required: false },
   trigger: { type: [String, Array, Boolean], required: false, default: "visible" },
@@ -14,21 +11,24 @@ const props = defineProps({
   paypalScriptOptions: { type: Object, required: false, default: () => ({}) },
   disabled: { type: Boolean, required: false, default: false }
 });
+const emit = defineEmits(["approve", "error", "cancel", "clickButtons", "shippingOptionsChange", "shippingAddressChange", "init"]);
+const el = ref(null);
+const rootEl = ref(null);
 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;
+function handleDisabled() {
+  if (!initActions.value)
+    return;
   if (props.disabled) {
     initActions.value.disable();
   } else {
     initActions.value.enable();
   }
-};
+}
 const options = computed(() => {
   const _options = {
     onApprove: async (data, actions) => {
@@ -69,12 +69,14 @@ watch(() => props.disabled, handleDisabled);
 const buttonInst = shallowRef();
 onMounted(() => {
   onLoaded(async ({ paypal }) => {
-    if (!el.value) return;
+    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;
+      if (!el.value)
+        return;
       await buttonInst.value?.updateProps(_options);
     });
   });

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

@@ -1,6 +1,6 @@
-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 { OnApproveActions, OnApproveData, OnCancelledActions, OnClickActions, OnInitActions, OnShippingAddressChangeActions, OnShippingAddressChangeData, OnShippingOptionsChangeActions, OnShippingOptionsChangeData, PayPalButtonsComponentOptions } from '@paypal/paypal-js';
+import type { HTMLAttributes, ReservedProps } from 'vue';
 import type { PayPalInput } from '../registry/paypal.js';
 type __VLS_Props = {
     /**

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

@@ -1,6 +1,6 @@
-import { type HTMLAttributes, type ReservedProps } from 'vue';
-import type { PayPalMarksComponentOptions } from '@paypal/paypal-js';
 import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+import type { PayPalMarksComponentOptions } from '@paypal/paypal-js';
+import type { HTMLAttributes, ReservedProps } from 'vue';
 import type { PayPalInput } from '../registry/paypal.js';
 type __VLS_Props = {
     /**

package/dist/runtime/components/ScriptPayPalMarks.vue

@@ -1,11 +1,8 @@
 <script setup>
-import { computed, onMounted, ref, shallowRef, watch } from "vue";
 import { defu } from "defu";
-import { useScriptPayPal } from "../registry/paypal";
+import { computed, onBeforeUnmount, onMounted, ref, resolveComponent, shallowRef, watch } from "vue";
 import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
-import { onBeforeUnmount, resolveComponent } from "vue";
-const el = ref(null);
-const rootEl = ref(null);
+import { useScriptPayPal } from "../registry/paypal";
 const props = defineProps({
   rootAttrs: { type: Object, required: false },
   trigger: { type: [String, Array, Boolean], required: false, default: "visible" },
@@ -13,6 +10,8 @@ const props = defineProps({
   marksOptions: { type: Object, required: false, default: () => ({}) },
   paypalScriptOptions: { type: Object, required: false, default: () => ({}) }
 });
+const el = ref(null);
+const rootEl = ref(null);
 const ready = ref(false);
 const { onLoaded, status } = useScriptPayPal({
   clientId: props.clientId,
@@ -21,12 +20,14 @@ const { onLoaded, status } = useScriptPayPal({
 const marksInst = shallowRef();
 onMounted(() => {
   onLoaded(async ({ paypal }) => {
-    if (!el.value) return;
+    if (!el.value)
+      return;
     marksInst.value = paypal?.Marks?.(props.marksOptions);
     await marksInst.value?.render(el.value);
     ready.value = true;
     watch(() => props.marksOptions, async (_options) => {
-      if (!el.value) return;
+      if (!el.value)
+        return;
       destroy();
       marksInst.value = paypal?.Marks?.(_options);
       await marksInst.value?.render(el.value);
@@ -34,7 +35,8 @@ onMounted(() => {
   });
 });
 function destroy() {
-  if (!el.value) return;
+  if (!el.value)
+    return;
   el.value?.replaceChildren();
 }
 onBeforeUnmount(() => {

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

@@ -1,6 +1,6 @@
-import { type HTMLAttributes, type ReservedProps } from 'vue';
-import type { PayPalMarksComponentOptions } from '@paypal/paypal-js';
 import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+import type { PayPalMarksComponentOptions } from '@paypal/paypal-js';
+import type { HTMLAttributes, ReservedProps } from 'vue';
 import type { PayPalInput } from '../registry/paypal.js';
 type __VLS_Props = {
     /**

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

@@ -1,6 +1,6 @@
-import { type HTMLAttributes, type ReservedProps } from 'vue';
-import type { PayPalMessagesComponentOptions } from '@paypal/paypal-js';
 import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+import type { PayPalMessagesComponentOptions } from '@paypal/paypal-js';
+import type { HTMLAttributes, ReservedProps } from 'vue';
 import type { PayPalInput } from '../registry/paypal.js';
 type __VLS_Props = {
     /**

package/dist/runtime/components/ScriptPayPalMessages.vue

@@ -1,11 +1,8 @@
 <script setup>
-import { computed, onMounted, ref, shallowRef, watch } from "vue";
 import { defu } from "defu";
-import { useScriptPayPal } from "../registry/paypal";
+import { computed, onBeforeUnmount, onMounted, ref, resolveComponent, shallowRef, watch } from "vue";
 import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
-import { onBeforeUnmount, resolveComponent } from "vue";
-const el = ref(null);
-const rootEl = ref(null);
+import { useScriptPayPal } from "../registry/paypal";
 const props = defineProps({
   rootAttrs: { type: Object, required: false },
   trigger: { type: [String, Array, Boolean], required: false, default: "visible" },
@@ -15,6 +12,9 @@ const props = defineProps({
   partnerAttributionId: { type: String, required: false },
   paypalScriptOptions: { type: Object, required: false, default: () => ({}) }
 });
+const emit = defineEmits(["apply", "clickMessages", "render"]);
+const el = ref(null);
+const rootEl = ref(null);
 const ready = ref(false);
 const { onLoaded, status } = useScriptPayPal({
   clientId: props.clientId,
@@ -22,7 +22,6 @@ const { onLoaded, status } = useScriptPayPal({
   partnerAttributionId: props.partnerAttributionId,
   ...props.paypalScriptOptions
 });
-const emit = defineEmits(["apply", "clickMessages", "render"]);
 const options = computed(() => {
   const _options = {
     onApply: (data) => {
@@ -43,19 +42,22 @@ const options = computed(() => {
 const messageInst = shallowRef();
 onMounted(() => {
   onLoaded(async ({ paypal }) => {
-    if (!el.value) return;
+    if (!el.value)
+      return;
     messageInst.value = paypal?.Messages?.(options.value);
     await messageInst.value?.render(el.value);
     ready.value = true;
     watch(() => options.value, async (_options) => {
-      if (!el.value) return;
+      if (!el.value)
+        return;
       messageInst.value = paypal?.Messages?.(_options);
       await messageInst.value?.render(el.value);
     });
   });
 });
 function destroy() {
-  if (!el.value) return;
+  if (!el.value)
+    return;
   el.value?.replaceChildren();
 }
 onBeforeUnmount(() => {

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

@@ -1,6 +1,6 @@
-import { type HTMLAttributes, type ReservedProps } from 'vue';
-import type { PayPalMessagesComponentOptions } from '@paypal/paypal-js';
 import type { ElementScriptTrigger } from '#nuxt-scripts/types';
+import type { PayPalMessagesComponentOptions } from '@paypal/paypal-js';
+import type { HTMLAttributes, ReservedProps } from 'vue';
 import type { PayPalInput } from '../registry/paypal.js';
 type __VLS_Props = {
     /**

package/dist/runtime/components/ScriptStripePricingTable.vue

@@ -1,7 +1,7 @@
 <script setup>
-import { ref, computed, onBeforeUnmount, onMounted, watch } from "vue";
-import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
+import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
 import { useScript } from "../composables/useScript";
+import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
 const props = defineProps({
   trigger: { type: [String, Array, Boolean], required: false, default: "visible" },
   publishableKey: { type: String, required: true },

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

@@ -64,6 +64,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     getPlaybackRate: () => Promise<number> | undefined;
     setPlaybackRate: (rate: number) => Promise<number> | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    progress: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     error: (event: import("@vimeo/player").Error, player: Vimeo.Player) => any;
     loaded: (event: import("@vimeo/player").LoadedEvent, player: Vimeo.Player) => any;
     cuechange: (event: import("@vimeo/player").CueChangeEvent, player: Vimeo.Player) => any;
@@ -72,7 +73,6 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     pause: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     play: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     playing: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
-    progress: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     resize: (event: import("@vimeo/player").ResizeEvent, player: Vimeo.Player) => any;
     seeked: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     seeking: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
@@ -90,6 +90,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     enterpictureinpicture: (event: never, player: Vimeo.Player) => any;
     leavepictureinpicture: (event: never, player: Vimeo.Player) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onProgress?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onError?: ((event: import("@vimeo/player").Error, player: Vimeo.Player) => any) | undefined;
     onLoaded?: ((event: import("@vimeo/player").LoadedEvent, player: Vimeo.Player) => any) | undefined;
     onCuechange?: ((event: import("@vimeo/player").CueChangeEvent, player: Vimeo.Player) => any) | undefined;
@@ -98,7 +99,6 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     onPause?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onPlay?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onPlaying?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
-    onProgress?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onResize?: ((event: import("@vimeo/player").ResizeEvent, player: Vimeo.Player) => any) | undefined;
     onSeeked?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onSeeking?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;

package/dist/runtime/components/ScriptVimeoPlayer.vue

@@ -1,7 +1,7 @@
 <script setup>
-import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
 import { defu } from "defu";
 import { useAsyncData, useHead } from "nuxt/app";
+import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
 import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
 import { useScriptVimeoPlayer } from "../registry/vimeo-player";
 import ScriptAriaLoadingIndicator from "./ScriptAriaLoadingIndicator.vue";

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

@@ -64,6 +64,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     getPlaybackRate: () => Promise<number> | undefined;
     setPlaybackRate: (rate: number) => Promise<number> | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    progress: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     error: (event: import("@vimeo/player").Error, player: Vimeo.Player) => any;
     loaded: (event: import("@vimeo/player").LoadedEvent, player: Vimeo.Player) => any;
     cuechange: (event: import("@vimeo/player").CueChangeEvent, player: Vimeo.Player) => any;
@@ -72,7 +73,6 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     pause: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     play: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     playing: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
-    progress: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     resize: (event: import("@vimeo/player").ResizeEvent, player: Vimeo.Player) => any;
     seeked: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
     seeking: (event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any;
@@ -90,6 +90,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     enterpictureinpicture: (event: never, player: Vimeo.Player) => any;
     leavepictureinpicture: (event: never, player: Vimeo.Player) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onProgress?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onError?: ((event: import("@vimeo/player").Error, player: Vimeo.Player) => any) | undefined;
     onLoaded?: ((event: import("@vimeo/player").LoadedEvent, player: Vimeo.Player) => any) | undefined;
     onCuechange?: ((event: import("@vimeo/player").CueChangeEvent, player: Vimeo.Player) => any) | undefined;
@@ -98,7 +99,6 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     onPause?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onPlay?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onPlaying?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
-    onProgress?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onResize?: ((event: import("@vimeo/player").ResizeEvent, player: Vimeo.Player) => any) | undefined;
     onSeeked?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;
     onSeeking?: ((event: import("@vimeo/player").TimeEvent, player: Vimeo.Player) => any) | undefined;

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

@@ -0,0 +1,82 @@
+import type { HTMLAttributes } from 'vue';
+import type { XEmbedTweetData } from '../registry/x-embed.js';
+type __VLS_Props = {
+    /**
+     * The tweet ID to embed
+     */
+    tweetId: string;
+    /**
+     * Custom API endpoint for fetching tweet data
+     * @default '/_scripts/x-embed'
+     */
+    apiEndpoint?: string;
+    /**
+     * Custom image proxy endpoint
+     * @default '/_scripts/x-embed-image'
+     */
+    imageProxyEndpoint?: string;
+    /**
+     * Root element attributes
+     */
+    rootAttrs?: HTMLAttributes;
+};
+declare var __VLS_1: {}, __VLS_3: {
+    error: import("nuxt/app").NuxtError<unknown> | undefined;
+}, __VLS_5: {
+    tweet: XEmbedTweetData;
+    userName: string;
+    userHandle: string;
+    userAvatar: string;
+    userAvatarOriginal: string;
+    isVerified: boolean | undefined;
+    text: string;
+    datetime: string;
+    createdAt: Date;
+    likes: number;
+    likesFormatted: string;
+    replies: number;
+    repliesFormatted: string;
+    photos: {
+        proxiedUrl: string;
+        url: string;
+        width: number;
+        height: number;
+    }[] | undefined;
+    video: {
+        posterProxied: string;
+        poster: string;
+        variants: Array<{
+            type: string;
+            src: string;
+        }>;
+    } | null;
+    tweetUrl: string;
+    userUrl: string;
+    quotedTweet: XEmbedTweetData | undefined;
+    isReply: boolean;
+    replyToUser: string | undefined;
+    proxyImage: (url: string) => string;
+};
+type __VLS_Slots = {} & {
+    loading?: (props: typeof __VLS_1) => any;
+} & {
+    error?: (props: typeof __VLS_3) => any;
+} & {
+    default?: (props: typeof __VLS_5) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
+    tweet: import("vue").Ref<XEmbedTweetData | undefined, XEmbedTweetData | undefined>;
+    status: import("vue").Ref<import("nuxt/app").AsyncDataRequestStatus, import("nuxt/app").AsyncDataRequestStatus>;
+    error: import("vue").Ref<import("nuxt/app").NuxtError<unknown> | undefined, import("nuxt/app").NuxtError<unknown> | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    apiEndpoint: string;
+    imageProxyEndpoint: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ScriptXEmbed.vue

@@ -0,0 +1,76 @@
+<script setup>
+import { useAsyncData } from "nuxt/app";
+import { computed } from "vue";
+import { formatCount, formatTweetDate, proxyXImageUrl } from "../registry/x-embed";
+const props = defineProps({
+  tweetId: { type: String, required: true },
+  apiEndpoint: { type: String, required: false, default: "/api/_scripts/x-embed" },
+  imageProxyEndpoint: { type: String, required: false, default: "/api/_scripts/x-embed-image" },
+  rootAttrs: { type: Object, required: false }
+});
+const cacheKey = computed(() => `x-embed-${props.tweetId}`);
+const { data: tweet, status, error } = useAsyncData(
+  cacheKey,
+  () => $fetch(`${props.apiEndpoint}?id=${props.tweetId}`)
+);
+const slotProps = computed(() => {
+  if (!tweet.value)
+    return null;
+  const t = tweet.value;
+  return {
+    // Raw data
+    tweet: t,
+    // User info
+    userName: t.user.name,
+    userHandle: t.user.screen_name,
+    userAvatar: proxyXImageUrl(t.user.profile_image_url_https, props.imageProxyEndpoint),
+    userAvatarOriginal: t.user.profile_image_url_https,
+    isVerified: t.user.verified || t.user.is_blue_verified,
+    // Tweet content
+    text: t.text,
+    // Formatted values
+    datetime: formatTweetDate(t.created_at),
+    createdAt: new Date(t.created_at),
+    likes: t.favorite_count,
+    likesFormatted: formatCount(t.favorite_count),
+    replies: t.conversation_count,
+    repliesFormatted: formatCount(t.conversation_count),
+    // Media
+    photos: t.photos?.map((p) => ({
+      ...p,
+      proxiedUrl: proxyXImageUrl(p.url, props.imageProxyEndpoint)
+    })),
+    video: t.video ? {
+      ...t.video,
+      posterProxied: proxyXImageUrl(t.video.poster, props.imageProxyEndpoint)
+    } : null,
+    // Links
+    tweetUrl: `https://x.com/${t.user.screen_name}/status/${t.id_str}`,
+    userUrl: `https://x.com/${t.user.screen_name}`,
+    // Quoted tweet
+    quotedTweet: t.quoted_tweet,
+    // Reply context
+    isReply: !!t.parent,
+    replyToUser: t.parent?.user.screen_name,
+    // Helpers
+    proxyImage: (url) => proxyXImageUrl(url, props.imageProxyEndpoint)
+  };
+});
+defineExpose({
+  tweet,
+  status,
+  error
+});
+</script>
+
+<template>
+  <div v-bind="rootAttrs">
+    <slot v-if="status === 'pending'" name="loading">
+      <div>Loading tweet...</div>
+    </slot>
+    <slot v-else-if="status === 'error'" name="error" :error="error">
+      <div>Failed to load tweet</div>
+    </slot>
+    <slot v-else-if="slotProps" v-bind="slotProps" />
+  </div>
+</template>

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

@@ -0,0 +1,82 @@
+import type { HTMLAttributes } from 'vue';
+import type { XEmbedTweetData } from '../registry/x-embed.js';
+type __VLS_Props = {
+    /**
+     * The tweet ID to embed
+     */
+    tweetId: string;
+    /**
+     * Custom API endpoint for fetching tweet data
+     * @default '/_scripts/x-embed'
+     */
+    apiEndpoint?: string;
+    /**
+     * Custom image proxy endpoint
+     * @default '/_scripts/x-embed-image'
+     */
+    imageProxyEndpoint?: string;
+    /**
+     * Root element attributes
+     */
+    rootAttrs?: HTMLAttributes;
+};
+declare var __VLS_1: {}, __VLS_3: {
+    error: import("nuxt/app").NuxtError<unknown> | undefined;
+}, __VLS_5: {
+    tweet: XEmbedTweetData;
+    userName: string;
+    userHandle: string;
+    userAvatar: string;
+    userAvatarOriginal: string;
+    isVerified: boolean | undefined;
+    text: string;
+    datetime: string;
+    createdAt: Date;
+    likes: number;
+    likesFormatted: string;
+    replies: number;
+    repliesFormatted: string;
+    photos: {
+        proxiedUrl: string;
+        url: string;
+        width: number;
+        height: number;
+    }[] | undefined;
+    video: {
+        posterProxied: string;
+        poster: string;
+        variants: Array<{
+            type: string;
+            src: string;
+        }>;
+    } | null;
+    tweetUrl: string;
+    userUrl: string;
+    quotedTweet: XEmbedTweetData | undefined;
+    isReply: boolean;
+    replyToUser: string | undefined;
+    proxyImage: (url: string) => string;
+};
+type __VLS_Slots = {} & {
+    loading?: (props: typeof __VLS_1) => any;
+} & {
+    error?: (props: typeof __VLS_3) => any;
+} & {
+    default?: (props: typeof __VLS_5) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
+    tweet: import("vue").Ref<XEmbedTweetData | undefined, XEmbedTweetData | undefined>;
+    status: import("vue").Ref<import("nuxt/app").AsyncDataRequestStatus, import("nuxt/app").AsyncDataRequestStatus>;
+    error: import("vue").Ref<import("nuxt/app").NuxtError<unknown> | undefined, import("nuxt/app").NuxtError<unknown> | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    apiEndpoint: string;
+    imageProxyEndpoint: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -10,6 +10,7 @@ type __VLS_Props = {
     playerVars?: YT.PlayerVars;
     width?: number;
     height?: number;
+    ratio?: string;
     /**
      * Whether to use youtube-nocookie.com for embedding.
      *
@@ -19,9 +20,15 @@ type __VLS_Props = {
     playerOptions?: YT.PlayerOptions;
     thumbnailSize?: YoutubeThumbnailSize;
     webp?: boolean;
+    /**
+     * Object-fit for the placeholder image.
+     *
+     * @default 'cover'
+     */
+    placeholderObjectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
 };
 declare var __VLS_1: {
-    placeholder: any;
+    placeholder: string;
 }, __VLS_3: {}, __VLS_10: {}, __VLS_12: {}, __VLS_14: {};
 type __VLS_Slots = {} & {
     placeholder?: (props: typeof __VLS_1) => any;
@@ -42,20 +49,24 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     "state-change": (e: YT.OnStateChangeEvent, target: YT.Player) => any;
     "playback-quality-change": (e: YT.OnPlaybackQualityChangeEvent, target: YT.Player) => any;
     "playback-rate-change": (e: YT.OnPlaybackRateChangeEvent, target: YT.Player) => any;
+    "api-change": (e: YT.PlayerEvent, target: YT.Player) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onError?: ((e: YT.OnErrorEvent, target: YT.Player) => any) | undefined;
     onReady?: ((e: YT.PlayerEvent) => any) | undefined;
     "onState-change"?: ((e: YT.OnStateChangeEvent, target: YT.Player) => any) | undefined;
     "onPlayback-quality-change"?: ((e: YT.OnPlaybackQualityChangeEvent, target: YT.Player) => any) | undefined;
     "onPlayback-rate-change"?: ((e: YT.OnPlaybackRateChangeEvent, target: YT.Player) => any) | undefined;
+    "onApi-change"?: ((e: YT.PlayerEvent, target: YT.Player) => any) | undefined;
 }>, {
     trigger: ElementScriptTrigger;
     width: number;
     height: number;
     playerVars: YT.PlayerVars;
+    ratio: string;
     cookies: boolean;
     thumbnailSize: YoutubeThumbnailSize;
     webp: boolean;
+    placeholderObjectFit: "cover" | "contain" | "fill" | "none" | "scale-down";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;