@nuxt/scripts 1.0.0-beta.7 → 1.0.0-rc.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/devtools-client/200.html +1 -0
- package/dist/devtools-client/404.html +1 -0
- package/dist/devtools-client/_fonts/4ppnHhMi-pBsWSPo7mY0avYxlDoAg1N3PTzCwXLZ5rA-d9oibkGnTd1JL3tc_xnaVgBLYmOB8kjrK2cvZaqwj9s.woff2 +0 -0
- package/dist/devtools-client/_fonts/4qBuU9MRVUlPZNPSF7Xom_sK8RBEnfYu-9VXFrdq8A8-8TDwLE1HAj1sQn7XxVWtM_7sIaPM-DTdO3Pf8U2DF1U.woff2 +0 -0
- package/dist/devtools-client/_fonts/6dYsbWUd_BpKJ7mdDihgOcya1gHXLpJBuMYXux3WMjE-q3fYNS8YbW5n7ZeXI2vSNgkRWW5VDPKAl51SNTjG2qk.woff2 +0 -0
- package/dist/devtools-client/_fonts/Lr-hqqZZsYmCt0ITUlr1CUrWim9fsKvoDFZliMxgNHY-iTa_Yt_PzhOY9TX7ZXdSlEPim6iRt92xhECwaxWxd5w.woff2 +0 -0
- package/dist/devtools-client/_fonts/OknHvWI6KtYn1JQBzX7eSpNDBQ8520F9TvSUJYkVf6A-xeZn9253svK_8Q2LD0XEruY_MnEsuCRO5LenPoggC0Y.woff2 +0 -0
- package/dist/devtools-client/_fonts/PV2hrQG6wq5BlIPDjdL1IcOflycaghyt5MHzlBqZtlo-lb_WexLz3VZqfTN0oi554iBH5tT2j2UFEV-XErCAS3E.woff2 +0 -0
- package/dist/devtools-client/_fonts/UA7OtwYHwGN_HjcVGTdmiQxUit7FlqkCwxVUWSeXVnQ-B4OXCFOL_tWrYODpQTc07aMaj0c2cewTOmBRWR9tD-A.woff2 +0 -0
- package/dist/devtools-client/_fonts/VE4cDVCv5MxbFM7ZLoLCGbIpNd71zhp7MDI9lmN5Y7I-xZyDYCUVrd6LV8eVGF3Um3UZjBFuUtDGtvdyTBBRYBo.woff2 +0 -0
- package/dist/devtools-client/_fonts/fVoGbnMbBFd5L9BBp9fUPavUSkZ_EmsQNSyadkT-108-U4T0khaeLQSIhtt9eVvaCEKJjtWJ4ioRJOf8hvqkWY0.woff2 +0 -0
- package/dist/devtools-client/_fonts/lQAxeCEs1R0Lw-H9XRU1RlOARQN8J6npRsPjyEDMe5s-_DUSLEkO3tKTuun_gSnDLoQPVEnpOnyqZMOw0ByZ6PA.woff2 +0 -0
- package/dist/devtools-client/_fonts/lntlqNHKLV2n82yTwMde70QqOjcfLE2XJ5oKZ3vRPWc-z6TxpIZQdWXztWLr9_OFWqt_WJJoeGtuK_-XQMZGQwE.woff2 +0 -0
- package/dist/devtools-client/_fonts/qxAYvKsXWeYv731eb-h5TRurcdIP_W44mpNdX-HABAk-zUDeMEFlNtNbrwvT9JxLEBg0TphGy70O6RfIoIX_ZwU.woff2 +0 -0
- package/dist/devtools-client/_nuxt/B3kN3DAy.js +1 -0
- package/dist/devtools-client/_nuxt/B8PEiB0p.js +1 -0
- package/dist/devtools-client/_nuxt/C8jhSQ8l.js +1 -0
- package/dist/devtools-client/_nuxt/CJD6wrkT.js +188 -0
- package/dist/devtools-client/_nuxt/CfOsp0mU.js +1 -0
- package/dist/devtools-client/_nuxt/DKL6PHO3.js +1 -0
- package/dist/devtools-client/_nuxt/ajngqPCs.js +1 -0
- package/dist/devtools-client/_nuxt/builds/latest.json +1 -0
- package/dist/devtools-client/_nuxt/builds/meta/cb4e67c6-e8b7-4205-95b7-708fd96ffab6.json +1 -0
- package/dist/devtools-client/_nuxt/dlaR8P-P.js +1 -0
- package/dist/devtools-client/_nuxt/entry.BwpOBArY.css +1 -0
- package/dist/devtools-client/_nuxt/error-404.CvOVjXeC.css +1 -0
- package/dist/devtools-client/_nuxt/error-500.BIm53nmx.css +1 -0
- package/dist/devtools-client/_nuxt/first-party.C8Ha4JLM.css +1 -0
- package/dist/devtools-client/_nuxt/index.CA-OpSj0.css +1 -0
- package/dist/devtools-client/_nuxt/registry.B9lnjF_b.css +1 -0
- package/dist/devtools-client/_nuxt/wDzz0qaB.js +1 -0
- package/dist/devtools-client/docs/index.html +1 -0
- package/dist/devtools-client/first-party/index.html +1 -0
- package/dist/devtools-client/index.html +1 -0
- package/dist/devtools-client/registry/index.html +1 -0
- package/dist/module.d.mts +29 -84
- package/dist/module.d.ts +121 -0
- package/dist/module.json +1 -1
- package/dist/module.mjs +940 -755
- package/dist/registry.d.mts +91 -4
- package/dist/registry.d.ts +93 -0
- package/dist/registry.mjs +668 -326
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMaps.d.vue.ts +19 -87
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMaps.vue +79 -180
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMaps.vue.d.ts +19 -87
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsAdvancedMarkerElement.d.vue.ts +6 -55
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsAdvancedMarkerElement.vue +12 -83
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsAdvancedMarkerElement.vue.d.ts +6 -55
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsCircle.d.vue.ts +5 -1
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsCircle.vue +24 -38
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsCircle.vue.d.ts +5 -1
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsGeoJson.d.vue.ts +43 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsGeoJson.vue +60 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsGeoJson.vue.d.ts +43 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsHeatmapLayer.d.vue.ts +4 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsHeatmapLayer.vue +22 -26
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsHeatmapLayer.vue.d.ts +4 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsInfoWindow.d.vue.ts +11 -8
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsInfoWindow.vue +57 -57
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsInfoWindow.vue.d.ts +11 -8
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsMarker.d.vue.ts +24 -42
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsMarker.vue +70 -73
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsMarker.vue.d.ts +24 -42
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsMarkerClusterer.d.vue.ts +42 -5
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsMarkerClusterer.vue +83 -37
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsMarkerClusterer.vue.d.ts +42 -5
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsOverlayView.d.vue.ts +77 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsOverlayView.vue +223 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsOverlayView.vue.d.ts +77 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPinElement.d.vue.ts +10 -3
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPinElement.vue +9 -41
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPinElement.vue.d.ts +10 -3
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPolygon.d.vue.ts +7 -3
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPolygon.vue +23 -38
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPolygon.vue.d.ts +7 -3
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPolyline.d.vue.ts +7 -3
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPolyline.vue +23 -38
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsPolyline.vue.d.ts +7 -3
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsRectangle.d.vue.ts +7 -3
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsRectangle.vue +24 -38
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsRectangle.vue.d.ts +7 -3
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsStaticMap.d.vue.ts +200 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsStaticMap.vue +166 -0
- package/dist/runtime/components/GoogleMaps/ScriptGoogleMapsStaticMap.vue.d.ts +200 -0
- package/dist/runtime/components/GoogleMaps/bindGoogleMapsEvents.d.ts +13 -0
- package/dist/runtime/components/GoogleMaps/bindGoogleMapsEvents.js +8 -0
- package/dist/runtime/components/GoogleMaps/injectionKeys.d.ts +10 -0
- package/dist/runtime/components/GoogleMaps/injectionKeys.js +2 -0
- package/dist/runtime/components/GoogleMaps/useGoogleMapsResource.d.ts +48 -0
- package/dist/runtime/components/GoogleMaps/useGoogleMapsResource.js +51 -0
- package/dist/runtime/components/ScriptBlueskyEmbed.d.vue.ts +84 -0
- package/dist/runtime/components/ScriptBlueskyEmbed.vue +89 -0
- package/dist/runtime/components/ScriptBlueskyEmbed.vue.d.ts +84 -0
- package/dist/runtime/components/ScriptCarbonAds.d.vue.ts +4 -7
- package/dist/runtime/components/ScriptCarbonAds.vue +1 -0
- package/dist/runtime/components/ScriptCarbonAds.vue.d.ts +4 -7
- package/dist/runtime/components/ScriptCrisp.d.vue.ts +7 -11
- package/dist/runtime/components/ScriptCrisp.vue +2 -1
- package/dist/runtime/components/ScriptCrisp.vue.d.ts +7 -11
- package/dist/runtime/components/ScriptGoogleAdsense.d.vue.ts +4 -7
- package/dist/runtime/components/ScriptGoogleAdsense.vue +2 -1
- package/dist/runtime/components/ScriptGoogleAdsense.vue.d.ts +4 -7
- package/dist/runtime/components/ScriptGravatar.d.vue.ts +22 -0
- package/dist/runtime/components/ScriptGravatar.vue +46 -0
- package/dist/runtime/components/ScriptGravatar.vue.d.ts +22 -0
- package/dist/runtime/components/ScriptInstagramEmbed.d.vue.ts +12 -15
- package/dist/runtime/components/ScriptInstagramEmbed.vue +9 -3
- package/dist/runtime/components/ScriptInstagramEmbed.vue.d.ts +12 -15
- package/dist/runtime/components/ScriptIntercom.d.vue.ts +7 -11
- package/dist/runtime/components/ScriptIntercom.vue +5 -3
- package/dist/runtime/components/ScriptIntercom.vue.d.ts +7 -11
- package/dist/runtime/components/ScriptLemonSqueezy.d.vue.ts +2 -3
- package/dist/runtime/components/ScriptLemonSqueezy.vue +1 -0
- package/dist/runtime/components/ScriptLemonSqueezy.vue.d.ts +2 -3
- package/dist/runtime/components/ScriptPayPalButtons.d.vue.ts +43 -37
- package/dist/runtime/components/ScriptPayPalButtons.vue +49 -79
- package/dist/runtime/components/ScriptPayPalButtons.vue.d.ts +43 -37
- package/dist/runtime/components/ScriptPayPalMessages.d.vue.ts +37 -28
- package/dist/runtime/components/ScriptPayPalMessages.vue +47 -50
- package/dist/runtime/components/ScriptPayPalMessages.vue.d.ts +37 -28
- package/dist/runtime/components/ScriptStripePricingTable.d.vue.ts +5 -9
- package/dist/runtime/components/ScriptStripePricingTable.vue +3 -2
- package/dist/runtime/components/ScriptStripePricingTable.vue.d.ts +5 -9
- package/dist/runtime/components/ScriptVimeoPlayer.d.vue.ts +17 -11
- package/dist/runtime/components/ScriptVimeoPlayer.vue +14 -10
- package/dist/runtime/components/ScriptVimeoPlayer.vue.d.ts +17 -11
- package/dist/runtime/components/ScriptXEmbed.d.vue.ts +10 -13
- package/dist/runtime/components/ScriptXEmbed.vue +15 -8
- package/dist/runtime/components/ScriptXEmbed.vue.d.ts +10 -13
- package/dist/runtime/components/ScriptYouTubePlayer.d.vue.ts +10 -15
- package/dist/runtime/components/ScriptYouTubePlayer.vue +12 -5
- package/dist/runtime/components/ScriptYouTubePlayer.vue.d.ts +10 -15
- package/dist/runtime/composables/useScript.js +148 -8
- package/dist/runtime/composables/useScriptEventPage.js +2 -2
- package/dist/runtime/composables/useScriptTriggerConsent.d.ts +10 -0
- package/dist/runtime/composables/useScriptTriggerConsent.js +33 -20
- package/dist/runtime/composables/useScriptTriggerElement.js +1 -1
- package/dist/runtime/composables/useScriptTriggerIdleTimeout.js +1 -1
- package/dist/runtime/devtools-standalone-bridge.client.d.ts +8 -0
- package/dist/runtime/devtools-standalone-bridge.client.js +50 -0
- package/dist/runtime/registry/bing-uet.d.ts +20 -0
- package/dist/runtime/registry/bing-uet.js +29 -0
- package/dist/runtime/registry/bluesky-embed.d.ts +116 -0
- package/dist/runtime/registry/bluesky-embed.js +72 -0
- package/dist/runtime/registry/clarity.d.ts +10 -15
- package/dist/runtime/registry/clarity.js +22 -31
- package/dist/runtime/registry/cloudflare-web-analytics.d.ts +2 -13
- package/dist/runtime/registry/cloudflare-web-analytics.js +2 -14
- package/dist/runtime/registry/crisp.d.ts +10 -40
- package/dist/runtime/registry/crisp.js +2 -33
- package/dist/runtime/registry/databuddy-analytics.d.ts +2 -35
- package/dist/runtime/registry/databuddy-analytics.js +20 -45
- package/dist/runtime/registry/fathom-analytics.d.ts +7 -26
- package/dist/runtime/registry/fathom-analytics.js +3 -25
- package/dist/runtime/registry/google-adsense.d.ts +3 -11
- package/dist/runtime/registry/google-adsense.js +2 -11
- package/dist/runtime/registry/google-analytics.d.ts +3 -5
- package/dist/runtime/registry/google-analytics.js +3 -8
- package/dist/runtime/registry/google-maps.d.ts +3 -9
- package/dist/runtime/registry/google-maps.js +2 -8
- package/dist/runtime/registry/google-recaptcha.d.ts +2 -6
- package/dist/runtime/registry/google-recaptcha.js +4 -12
- package/dist/runtime/registry/google-sign-in.d.ts +2 -13
- package/dist/runtime/registry/google-sign-in.js +2 -22
- package/dist/runtime/registry/google-tag-manager.d.ts +3 -28
- package/dist/runtime/registry/google-tag-manager.js +4 -27
- package/dist/runtime/registry/gravatar.d.ts +26 -0
- package/dist/runtime/registry/gravatar.js +36 -0
- package/dist/runtime/registry/hotjar.d.ts +4 -6
- package/dist/runtime/registry/hotjar.js +2 -5
- package/dist/runtime/registry/instagram-embed.d.ts +3 -18
- package/dist/runtime/registry/instagram-embed.js +4 -19
- package/dist/runtime/registry/intercom.d.ts +5 -13
- package/dist/runtime/registry/intercom.js +2 -12
- package/dist/runtime/registry/matomo-analytics.d.ts +3 -12
- package/dist/runtime/registry/matomo-analytics.js +3 -12
- package/dist/runtime/registry/meta-pixel.d.ts +4 -6
- package/dist/runtime/registry/meta-pixel.js +2 -4
- package/dist/runtime/registry/mixpanel-analytics.d.ts +22 -0
- package/dist/runtime/registry/mixpanel-analytics.js +46 -0
- package/dist/runtime/registry/npm.d.ts +3 -7
- package/dist/runtime/registry/npm.js +2 -9
- package/dist/runtime/registry/paypal.d.ts +4 -25
- package/dist/runtime/registry/paypal.js +3 -66
- package/dist/runtime/registry/plausible-analytics.js +19 -14
- package/dist/runtime/registry/posthog.d.ts +10 -12
- package/dist/runtime/registry/posthog.js +3 -12
- package/dist/runtime/registry/reddit-pixel.d.ts +5 -6
- package/dist/runtime/registry/reddit-pixel.js +2 -4
- package/dist/runtime/registry/rybbit-analytics.d.ts +2 -14
- package/dist/runtime/registry/rybbit-analytics.js +10 -20
- package/dist/runtime/registry/schemas.d.ts +982 -0
- package/dist/runtime/registry/schemas.js +937 -0
- package/dist/runtime/registry/segment.d.ts +2 -5
- package/dist/runtime/registry/segment.js +2 -5
- package/dist/runtime/registry/snapchat-pixel.d.ts +5 -34
- package/dist/runtime/registry/snapchat-pixel.js +2 -20
- package/dist/runtime/registry/stripe.d.ts +3 -4
- package/dist/runtime/registry/stripe.js +2 -4
- package/dist/runtime/registry/tiktok-pixel.d.ts +4 -7
- package/dist/runtime/registry/tiktok-pixel.js +2 -6
- package/dist/runtime/registry/umami-analytics.d.ts +2 -31
- package/dist/runtime/registry/umami-analytics.js +2 -36
- package/dist/runtime/registry/vercel-analytics.d.ts +29 -0
- package/dist/runtime/registry/vercel-analytics.js +84 -0
- package/dist/runtime/registry/vimeo-player.d.ts +2 -2
- package/dist/runtime/registry/vimeo-player.js +1 -1
- package/dist/runtime/registry/x-embed.d.ts +3 -17
- package/dist/runtime/registry/x-embed.js +3 -18
- package/dist/runtime/registry/x-pixel.d.ts +4 -7
- package/dist/runtime/registry/x-pixel.js +2 -5
- package/dist/runtime/registry/youtube-player.d.ts +7 -7
- package/dist/runtime/registry/youtube-player.js +1 -1
- package/dist/runtime/server/bluesky-embed-image.d.ts +2 -0
- package/dist/runtime/server/bluesky-embed-image.js +7 -0
- package/dist/runtime/server/bluesky-embed.d.ts +16 -0
- package/dist/runtime/server/bluesky-embed.js +59 -0
- package/dist/runtime/server/google-maps-geocode-proxy.d.ts +2 -0
- package/dist/runtime/server/google-maps-geocode-proxy.js +34 -0
- package/dist/runtime/server/google-static-maps-proxy.js +2 -13
- package/dist/runtime/server/gravatar-proxy.d.ts +2 -0
- package/dist/runtime/server/gravatar-proxy.js +46 -0
- package/dist/runtime/server/instagram-embed-asset.js +8 -41
- package/dist/runtime/server/instagram-embed-image.js +6 -53
- package/dist/runtime/server/instagram-embed.d.ts +16 -0
- package/dist/runtime/server/instagram-embed.js +176 -35
- package/dist/runtime/server/proxy-handler.js +101 -83
- package/dist/runtime/server/utils/image-proxy.d.ts +12 -0
- package/dist/runtime/server/utils/image-proxy.js +70 -0
- package/dist/runtime/server/utils/privacy.d.ts +1 -10
- package/dist/runtime/server/utils/privacy.js +60 -40
- package/dist/runtime/server/x-embed-image.js +5 -49
- package/dist/runtime/server/x-embed.js +3 -2
- package/dist/runtime/types.d.ts +277 -53
- package/dist/runtime/types.js +0 -2
- package/dist/runtime/utils/pure.d.ts +1 -1
- package/dist/runtime/utils.d.ts +6 -4
- package/dist/runtime/utils.js +31 -14
- package/dist/stats.d.mts +202 -0
- package/dist/stats.d.ts +202 -0
- package/dist/stats.mjs +3875 -0
- package/dist/types-source.d.mts +17 -0
- package/dist/types-source.d.ts +17 -0
- package/dist/types-source.mjs +3835 -0
- package/dist/types.d.mts +4 -2
- package/package.json +35 -61
- package/README.md +0 -86
- package/dist/client/200.html +0 -1
- package/dist/client/404.html +0 -1
- package/dist/client/_nuxt/BJa0m50V.js +0 -1
- package/dist/client/_nuxt/BPQ3VLAy.js +0 -1
- package/dist/client/_nuxt/Ci5iXYuB.js +0 -1
- package/dist/client/_nuxt/DaI2y8Uz.js +0 -162
- package/dist/client/_nuxt/builds/latest.json +0 -1
- package/dist/client/_nuxt/builds/meta/9b4fb16a-3c62-48b0-8295-126cb077b5d3.json +0 -1
- package/dist/client/_nuxt/entry.D45OuV0w.css +0 -1
- package/dist/client/_nuxt/error-404.B57D-jUQ.css +0 -1
- package/dist/client/_nuxt/error-500.DTHUW7BI.css +0 -1
- package/dist/client/_nuxt/vPLZfVXe.js +0 -1
- package/dist/client/index.html +0 -1
- package/dist/runtime/components/ScriptPayPalMarks.d.vue.ts +0 -52
- package/dist/runtime/components/ScriptPayPalMarks.vue +0 -69
- package/dist/runtime/components/ScriptPayPalMarks.vue.d.ts +0 -52
- package/dist/runtime/validation/mock.d.ts +0 -42
- package/dist/runtime/validation/mock.js +0 -21
- package/dist/runtime/validation/valibot.d.ts +0 -1
- package/dist/runtime/validation/valibot.js +0 -1
- /package/dist/{client → devtools-client}/_nuxt/CVO1_9PV.js +0 -0
- /package/dist/{client → devtools-client}/_nuxt/Cp-IABpG.js +0 -0
- /package/dist/{client → devtools-client}/_nuxt/D0r3Knsf.js +0 -0
|
@@ -1,72 +1,68 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import { computed, onMounted, ref, shallowRef, watch } from "vue";
|
|
3
2
|
import { defu } from "defu";
|
|
4
|
-
import {
|
|
3
|
+
import { computed, onBeforeUnmount, onMounted, ref, resolveComponent, shallowRef } from "vue";
|
|
5
4
|
import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
|
|
6
|
-
import {
|
|
7
|
-
const el = ref(null);
|
|
8
|
-
const rootEl = ref(null);
|
|
5
|
+
import { useScriptPayPal } from "../registry/paypal";
|
|
9
6
|
const props = defineProps({
|
|
10
7
|
rootAttrs: { type: Object, required: false },
|
|
11
8
|
trigger: { type: [String, Array, Boolean], required: false, default: "visible" },
|
|
12
9
|
clientId: { type: String, required: false, default: "test" },
|
|
13
|
-
|
|
14
|
-
merchantId: { type: String, required: false },
|
|
10
|
+
clientToken: { type: String, required: false },
|
|
11
|
+
merchantId: { type: [String, Array], required: false },
|
|
15
12
|
partnerAttributionId: { type: String, required: false },
|
|
13
|
+
pageType: { type: String, required: false },
|
|
14
|
+
locale: { type: String, required: false },
|
|
15
|
+
messagesOptions: { type: Object, required: false, default: () => ({}) },
|
|
16
16
|
paypalScriptOptions: { type: Object, required: false, default: () => ({}) }
|
|
17
17
|
});
|
|
18
|
+
const emit = defineEmits(["ready", "error"]);
|
|
19
|
+
defineSlots();
|
|
20
|
+
const el = ref(null);
|
|
21
|
+
const rootEl = ref(null);
|
|
18
22
|
const ready = ref(false);
|
|
23
|
+
const failed = ref(false);
|
|
24
|
+
const messagesSession = shallowRef();
|
|
19
25
|
const { onLoaded, status } = useScriptPayPal({
|
|
20
|
-
clientId: props.clientId,
|
|
21
|
-
merchantId: props.merchantId,
|
|
22
|
-
partnerAttributionId: props.partnerAttributionId,
|
|
26
|
+
...props.clientToken ? { clientToken: props.clientToken } : { clientId: props.clientId },
|
|
23
27
|
...props.paypalScriptOptions
|
|
24
28
|
});
|
|
25
|
-
const emit = defineEmits(["apply", "clickMessages", "render"]);
|
|
26
|
-
const options = computed(() => {
|
|
27
|
-
const _options = {
|
|
28
|
-
onApply: (data) => {
|
|
29
|
-
emit("apply", data);
|
|
30
|
-
return props.messagesOptions?.onApply?.(data);
|
|
31
|
-
},
|
|
32
|
-
onClick: (data) => {
|
|
33
|
-
emit("clickMessages", data);
|
|
34
|
-
return props.messagesOptions?.onClick?.(data);
|
|
35
|
-
},
|
|
36
|
-
onRender: (data) => {
|
|
37
|
-
emit("render", data);
|
|
38
|
-
return props.messagesOptions?.onRender?.(data);
|
|
39
|
-
}
|
|
40
|
-
};
|
|
41
|
-
return defu(_options, props.messagesOptions);
|
|
42
|
-
});
|
|
43
|
-
const messageInst = shallowRef();
|
|
44
29
|
onMounted(() => {
|
|
45
30
|
onLoaded(async ({ paypal }) => {
|
|
46
|
-
if (!el.value)
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
31
|
+
if (!el.value)
|
|
32
|
+
return;
|
|
33
|
+
const components = ["paypal-messages"];
|
|
34
|
+
const instanceOptions = {
|
|
35
|
+
...props.clientToken ? { clientToken: props.clientToken } : { clientId: props.clientId },
|
|
36
|
+
components,
|
|
37
|
+
...props.pageType && { pageType: props.pageType },
|
|
38
|
+
...props.locale && { locale: props.locale },
|
|
39
|
+
...props.merchantId && { merchantId: props.merchantId },
|
|
40
|
+
...props.partnerAttributionId && { partnerAttributionId: props.partnerAttributionId }
|
|
41
|
+
};
|
|
42
|
+
try {
|
|
43
|
+
const instance = await paypal.createInstance(instanceOptions);
|
|
44
|
+
messagesSession.value = instance.createPayPalMessages(props.messagesOptions);
|
|
45
|
+
ready.value = true;
|
|
46
|
+
emit("ready", messagesSession.value);
|
|
47
|
+
} catch (err) {
|
|
48
|
+
messagesSession.value = void 0;
|
|
49
|
+
failed.value = true;
|
|
50
|
+
emit("error", err);
|
|
51
|
+
}
|
|
55
52
|
});
|
|
56
53
|
});
|
|
57
|
-
function destroy() {
|
|
58
|
-
if (!el.value) return;
|
|
59
|
-
el.value?.replaceChildren();
|
|
60
|
-
}
|
|
61
54
|
onBeforeUnmount(() => {
|
|
62
|
-
|
|
55
|
+
messagesSession.value = void 0;
|
|
56
|
+
});
|
|
57
|
+
defineExpose({
|
|
58
|
+
messagesSession
|
|
63
59
|
});
|
|
64
60
|
const ScriptLoadingIndicator = resolveComponent("ScriptLoadingIndicator");
|
|
65
61
|
const trigger = useScriptTriggerElement({ trigger: props.trigger, el: rootEl });
|
|
66
62
|
const rootAttrs = computed(() => {
|
|
67
63
|
return defu(props.rootAttrs, {
|
|
68
64
|
"aria-busy": status.value === "loading",
|
|
69
|
-
"aria-label": status.value === "awaitingLoad" ? "PayPal Script Placeholder" : status.value === "loading" ? "PayPal
|
|
65
|
+
"aria-label": status.value === "awaitingLoad" ? "PayPal Script Placeholder" : status.value === "loading" ? "PayPal Messages Loading" : "PayPal Messages",
|
|
70
66
|
"aria-live": "polite",
|
|
71
67
|
"role": "application",
|
|
72
68
|
...trigger instanceof Promise ? trigger.ssrAttrs || {} : {}
|
|
@@ -75,16 +71,17 @@ const rootAttrs = computed(() => {
|
|
|
75
71
|
</script>
|
|
76
72
|
|
|
77
73
|
<template>
|
|
78
|
-
<div v-bind="rootAttrs"
|
|
79
|
-
<div
|
|
80
|
-
|
|
74
|
+
<div ref="rootEl" v-bind="rootAttrs">
|
|
75
|
+
<div ref="el">
|
|
76
|
+
<slot v-if="ready" name="default" :messages-session="messagesSession" />
|
|
77
|
+
</div>
|
|
78
|
+
<slot v-if="status !== 'error' && !ready && !failed" name="placeholder">
|
|
81
79
|
placeholder
|
|
82
80
|
</slot>
|
|
83
|
-
<slot v-if="status !== 'awaitingLoad' && !ready" name="loading">
|
|
81
|
+
<slot v-if="status !== 'awaitingLoad' && status !== 'error' && !ready && !failed" name="loading">
|
|
84
82
|
<ScriptLoadingIndicator color="black" />
|
|
85
83
|
</slot>
|
|
86
84
|
<slot v-if="status === 'awaitingLoad'" name="awaitingLoad" />
|
|
87
|
-
<slot v-else-if="status === 'error'" name="error" />
|
|
88
|
-
<slot />
|
|
85
|
+
<slot v-else-if="status === 'error' || failed" name="error" />
|
|
89
86
|
</div>
|
|
90
87
|
</template>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { type HTMLAttributes, type ReservedProps } from 'vue';
|
|
2
|
-
import type { PayPalMessagesComponentOptions } from '@paypal/paypal-js';
|
|
3
1
|
import type { ElementScriptTrigger } from '#nuxt-scripts/types';
|
|
2
|
+
import type { PageTypes, PayPalMessagesOptions, PayPalMessagesSession } from '@paypal/paypal-js/sdk-v6';
|
|
3
|
+
import type { HTMLAttributes, ReservedProps } from 'vue';
|
|
4
4
|
import type { PayPalInput } from '../registry/paypal.js';
|
|
5
5
|
type __VLS_Props = {
|
|
6
6
|
/**
|
|
@@ -12,51 +12,60 @@ type __VLS_Props = {
|
|
|
12
12
|
*/
|
|
13
13
|
trigger?: ElementScriptTrigger;
|
|
14
14
|
/**
|
|
15
|
-
*
|
|
15
|
+
* Client ID or client token for PayPal SDK v6 authentication.
|
|
16
16
|
*/
|
|
17
17
|
clientId?: string;
|
|
18
18
|
/**
|
|
19
|
-
*
|
|
19
|
+
* Server-generated client token for SDK v6.
|
|
20
20
|
*/
|
|
21
|
-
|
|
21
|
+
clientToken?: string;
|
|
22
22
|
/**
|
|
23
|
-
* The merchant
|
|
23
|
+
* The merchant ID for the paypal script.
|
|
24
24
|
*/
|
|
25
|
-
merchantId?: string;
|
|
25
|
+
merchantId?: string | string[];
|
|
26
26
|
/**
|
|
27
|
-
* The partner attribution
|
|
27
|
+
* The partner attribution ID.
|
|
28
28
|
*/
|
|
29
29
|
partnerAttributionId?: string;
|
|
30
30
|
/**
|
|
31
|
-
* The
|
|
31
|
+
* The page type context hint.
|
|
32
|
+
*/
|
|
33
|
+
pageType?: PageTypes;
|
|
34
|
+
/**
|
|
35
|
+
* The locale for the SDK (BCP-47 code).
|
|
36
|
+
*/
|
|
37
|
+
locale?: string;
|
|
38
|
+
/**
|
|
39
|
+
* Options for the PayPal Messages session.
|
|
40
|
+
*/
|
|
41
|
+
messagesOptions?: PayPalMessagesOptions;
|
|
42
|
+
/**
|
|
43
|
+
* The paypal script options.
|
|
32
44
|
*/
|
|
33
45
|
paypalScriptOptions?: Partial<PayPalInput>;
|
|
34
46
|
};
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
awaitingLoad?: (
|
|
42
|
-
|
|
43
|
-
error?: (props: typeof __VLS_12) => any;
|
|
44
|
-
} & {
|
|
45
|
-
default?: (props: typeof __VLS_14) => any;
|
|
47
|
+
type __VLS_Slots = {
|
|
48
|
+
default?: (props: {
|
|
49
|
+
messagesSession: PayPalMessagesSession | undefined;
|
|
50
|
+
}) => any;
|
|
51
|
+
placeholder?: () => any;
|
|
52
|
+
loading?: () => any;
|
|
53
|
+
awaitingLoad?: () => any;
|
|
54
|
+
error?: () => any;
|
|
46
55
|
};
|
|
47
|
-
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
56
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
57
|
+
messagesSession: import("vue").ShallowRef<PayPalMessagesSession | undefined, PayPalMessagesSession | undefined>;
|
|
58
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
59
|
+
error: (error: unknown) => any;
|
|
60
|
+
ready: (session: PayPalMessagesSession) => any;
|
|
51
61
|
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
onClickMessages?: ((data: Record<string, unknown>) => any) | undefined;
|
|
62
|
+
onError?: ((error: unknown) => any) | undefined;
|
|
63
|
+
onReady?: ((session: PayPalMessagesSession) => any) | undefined;
|
|
55
64
|
}>, {
|
|
56
65
|
trigger: ElementScriptTrigger;
|
|
57
66
|
clientId: string;
|
|
58
67
|
paypalScriptOptions: Partial<PayPalInput>;
|
|
59
|
-
messagesOptions:
|
|
68
|
+
messagesOptions: PayPalMessagesOptions;
|
|
60
69
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
61
70
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
62
71
|
declare const _default: typeof __VLS_export;
|
|
@@ -7,15 +7,11 @@ type __VLS_Props = {
|
|
|
7
7
|
customerEmail?: string;
|
|
8
8
|
customerSessionClientSecret?: string;
|
|
9
9
|
};
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
loading?: (
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
} & {
|
|
16
|
-
error?: (props: typeof __VLS_5) => any;
|
|
17
|
-
} & {
|
|
18
|
-
default?: (props: typeof __VLS_7) => any;
|
|
10
|
+
type __VLS_Slots = {
|
|
11
|
+
default?: () => any;
|
|
12
|
+
loading?: () => any;
|
|
13
|
+
awaitingLoad?: () => any;
|
|
14
|
+
error?: () => any;
|
|
19
15
|
};
|
|
20
16
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
21
17
|
error: () => any;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import {
|
|
3
|
-
import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
|
|
2
|
+
import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
|
|
4
3
|
import { useScript } from "../composables/useScript";
|
|
4
|
+
import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
|
|
5
5
|
const props = defineProps({
|
|
6
6
|
trigger: { type: [String, Array, Boolean], required: false, default: "visible" },
|
|
7
7
|
publishableKey: { type: String, required: true },
|
|
@@ -11,6 +11,7 @@ const props = defineProps({
|
|
|
11
11
|
customerSessionClientSecret: { type: String, required: false }
|
|
12
12
|
});
|
|
13
13
|
const emit = defineEmits(["ready", "error"]);
|
|
14
|
+
defineSlots();
|
|
14
15
|
const rootEl = ref();
|
|
15
16
|
const containerEl = ref();
|
|
16
17
|
const trigger = useScriptTriggerElement({ trigger: props.trigger, el: rootEl });
|
|
@@ -7,15 +7,11 @@ type __VLS_Props = {
|
|
|
7
7
|
customerEmail?: string;
|
|
8
8
|
customerSessionClientSecret?: string;
|
|
9
9
|
};
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
loading?: (
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
} & {
|
|
16
|
-
error?: (props: typeof __VLS_5) => any;
|
|
17
|
-
} & {
|
|
18
|
-
default?: (props: typeof __VLS_7) => any;
|
|
10
|
+
type __VLS_Slots = {
|
|
11
|
+
default?: () => any;
|
|
12
|
+
loading?: () => any;
|
|
13
|
+
awaitingLoad?: () => any;
|
|
14
|
+
error?: () => any;
|
|
19
15
|
};
|
|
20
16
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
21
17
|
error: () => any;
|
|
@@ -36,18 +36,22 @@ type __VLS_Props = {
|
|
|
36
36
|
vimeoOptions?: VimeoOptions;
|
|
37
37
|
id?: number | undefined;
|
|
38
38
|
url?: string | undefined;
|
|
39
|
+
ratio?: string;
|
|
40
|
+
/**
|
|
41
|
+
* Object-fit for the placeholder image.
|
|
42
|
+
*
|
|
43
|
+
* @default 'contain'
|
|
44
|
+
*/
|
|
45
|
+
placeholderObjectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
|
|
39
46
|
};
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
placeholder?: (props:
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
awaitingLoad?: (
|
|
47
|
-
|
|
48
|
-
error?: (props: typeof __VLS_12) => any;
|
|
49
|
-
} & {
|
|
50
|
-
default?: (props: typeof __VLS_14) => any;
|
|
47
|
+
type __VLS_Slots = {
|
|
48
|
+
default?: () => any;
|
|
49
|
+
placeholder?: (props: {
|
|
50
|
+
placeholder: string | undefined;
|
|
51
|
+
}) => any;
|
|
52
|
+
loading?: () => any;
|
|
53
|
+
awaitingLoad?: () => any;
|
|
54
|
+
error?: () => any;
|
|
51
55
|
};
|
|
52
56
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
53
57
|
play: () => Promise<void> | undefined;
|
|
@@ -117,6 +121,8 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
|
117
121
|
onLeavepictureinpicture?: ((event: never, player: Vimeo.Player) => any) | undefined;
|
|
118
122
|
}>, {
|
|
119
123
|
trigger: ElementScriptTrigger;
|
|
124
|
+
ratio: string;
|
|
125
|
+
placeholderObjectFit: "cover" | "contain" | "fill" | "none" | "scale-down";
|
|
120
126
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
121
127
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
122
128
|
declare const _default: typeof __VLS_export;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
|
|
3
2
|
import { defu } from "defu";
|
|
4
3
|
import { useAsyncData, useHead } from "nuxt/app";
|
|
4
|
+
import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
|
|
5
5
|
import { useScriptTriggerElement } from "../composables/useScriptTriggerElement";
|
|
6
6
|
import { useScriptVimeoPlayer } from "../registry/vimeo-player";
|
|
7
7
|
import ScriptAriaLoadingIndicator from "./ScriptAriaLoadingIndicator.vue";
|
|
@@ -12,9 +12,12 @@ const props = defineProps({
|
|
|
12
12
|
aboveTheFold: { type: Boolean, required: false },
|
|
13
13
|
vimeoOptions: { type: Object, required: false },
|
|
14
14
|
id: { type: null, required: false },
|
|
15
|
-
url: { type: null, required: false }
|
|
15
|
+
url: { type: null, required: false },
|
|
16
|
+
ratio: { type: String, required: false, default: "16/9" },
|
|
17
|
+
placeholderObjectFit: { type: String, required: false, default: "contain" }
|
|
16
18
|
});
|
|
17
19
|
const emits = defineEmits(["play", "playing", "pause", "ended", "timeupdate", "progress", "seeking", "seeked", "texttrackchange", "chapterchange", "cuechange", "cuepoint", "volumechange", "playbackratechange", "bufferstart", "bufferend", "error", "loaded", "durationchange", "fullscreenchange", "qualitychange", "camerachange", "resize", "enterpictureinpicture", "leavepictureinpicture"]);
|
|
20
|
+
defineSlots();
|
|
18
21
|
const events = [
|
|
19
22
|
"play",
|
|
20
23
|
"playing",
|
|
@@ -153,12 +156,13 @@ const rootAttrs = computed(() => {
|
|
|
153
156
|
"aria-live": "polite",
|
|
154
157
|
"role": "application",
|
|
155
158
|
"style": {
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
159
|
+
"--vimeo-ratio": props.ratio,
|
|
160
|
+
"maxWidth": "100%",
|
|
161
|
+
"width": `auto`,
|
|
162
|
+
"height": "auto",
|
|
163
|
+
"aspectRatio": props.ratio,
|
|
164
|
+
"position": "relative",
|
|
165
|
+
"backgroundColor": "black"
|
|
162
166
|
},
|
|
163
167
|
...trigger instanceof Promise ? trigger.ssrAttrs || {} : {}
|
|
164
168
|
});
|
|
@@ -173,7 +177,7 @@ const placeholderAttrs = computed(() => {
|
|
|
173
177
|
style: {
|
|
174
178
|
cursor: "pointer",
|
|
175
179
|
width: "100%",
|
|
176
|
-
objectFit:
|
|
180
|
+
objectFit: props.placeholderObjectFit,
|
|
177
181
|
height: "100%"
|
|
178
182
|
}
|
|
179
183
|
});
|
|
@@ -197,5 +201,5 @@ onBeforeUnmount(() => player?.unload());
|
|
|
197
201
|
</template>
|
|
198
202
|
|
|
199
203
|
<style>
|
|
200
|
-
.vimeo-player iframe{aspect-ratio:16/9;height:auto;max-width:100%!important;width:100%}
|
|
204
|
+
.vimeo-player iframe{aspect-ratio:var(--vimeo-ratio,16/9);height:auto;max-width:100%!important;width:100%}
|
|
201
205
|
</style>
|
|
@@ -36,18 +36,22 @@ type __VLS_Props = {
|
|
|
36
36
|
vimeoOptions?: VimeoOptions;
|
|
37
37
|
id?: number | undefined;
|
|
38
38
|
url?: string | undefined;
|
|
39
|
+
ratio?: string;
|
|
40
|
+
/**
|
|
41
|
+
* Object-fit for the placeholder image.
|
|
42
|
+
*
|
|
43
|
+
* @default 'contain'
|
|
44
|
+
*/
|
|
45
|
+
placeholderObjectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
|
|
39
46
|
};
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
placeholder?: (props:
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
awaitingLoad?: (
|
|
47
|
-
|
|
48
|
-
error?: (props: typeof __VLS_12) => any;
|
|
49
|
-
} & {
|
|
50
|
-
default?: (props: typeof __VLS_14) => any;
|
|
47
|
+
type __VLS_Slots = {
|
|
48
|
+
default?: () => any;
|
|
49
|
+
placeholder?: (props: {
|
|
50
|
+
placeholder: string | undefined;
|
|
51
|
+
}) => any;
|
|
52
|
+
loading?: () => any;
|
|
53
|
+
awaitingLoad?: () => any;
|
|
54
|
+
error?: () => any;
|
|
51
55
|
};
|
|
52
56
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
53
57
|
play: () => Promise<void> | undefined;
|
|
@@ -117,6 +121,8 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
|
117
121
|
onLeavepictureinpicture?: ((event: never, player: Vimeo.Player) => any) | undefined;
|
|
118
122
|
}>, {
|
|
119
123
|
trigger: ElementScriptTrigger;
|
|
124
|
+
ratio: string;
|
|
125
|
+
placeholderObjectFit: "cover" | "contain" | "fill" | "none" | "scale-down";
|
|
120
126
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
121
127
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
122
128
|
declare const _default: typeof __VLS_export;
|
|
@@ -7,12 +7,10 @@ type __VLS_Props = {
|
|
|
7
7
|
tweetId: string;
|
|
8
8
|
/**
|
|
9
9
|
* Custom API endpoint for fetching tweet data
|
|
10
|
-
* @default '/_scripts/x-embed'
|
|
11
10
|
*/
|
|
12
11
|
apiEndpoint?: string;
|
|
13
12
|
/**
|
|
14
13
|
* Custom image proxy endpoint
|
|
15
|
-
* @default '/_scripts/x-embed-image'
|
|
16
14
|
*/
|
|
17
15
|
imageProxyEndpoint?: string;
|
|
18
16
|
/**
|
|
@@ -20,9 +18,15 @@ type __VLS_Props = {
|
|
|
20
18
|
*/
|
|
21
19
|
rootAttrs?: HTMLAttributes;
|
|
22
20
|
};
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
type __VLS_Slots = {
|
|
22
|
+
default?: (props: NonNullable<typeof slotProps.value>) => any;
|
|
23
|
+
loading?: () => any;
|
|
24
|
+
error?: (props: {
|
|
25
|
+
error: typeof error.value;
|
|
26
|
+
}) => any;
|
|
27
|
+
};
|
|
28
|
+
declare const error: import("vue").Ref<import("nuxt/app").NuxtError<unknown> | undefined, import("nuxt/app").NuxtError<unknown> | undefined>;
|
|
29
|
+
declare const slotProps: import("vue").ComputedRef<{
|
|
26
30
|
tweet: XEmbedTweetData;
|
|
27
31
|
userName: string;
|
|
28
32
|
userHandle: string;
|
|
@@ -56,14 +60,7 @@ declare var __VLS_1: {}, __VLS_3: {
|
|
|
56
60
|
isReply: boolean;
|
|
57
61
|
replyToUser: string | undefined;
|
|
58
62
|
proxyImage: (url: string) => string;
|
|
59
|
-
}
|
|
60
|
-
type __VLS_Slots = {} & {
|
|
61
|
-
loading?: (props: typeof __VLS_1) => any;
|
|
62
|
-
} & {
|
|
63
|
-
error?: (props: typeof __VLS_3) => any;
|
|
64
|
-
} & {
|
|
65
|
-
default?: (props: typeof __VLS_5) => any;
|
|
66
|
-
};
|
|
63
|
+
} | null>;
|
|
67
64
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
68
65
|
tweet: import("vue").Ref<XEmbedTweetData | undefined, XEmbedTweetData | undefined>;
|
|
69
66
|
status: import("vue").Ref<import("nuxt/app").AsyncDataRequestStatus, import("nuxt/app").AsyncDataRequestStatus>;
|
|
@@ -1,17 +1,24 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import { computed } from "vue";
|
|
3
2
|
import { useAsyncData } from "nuxt/app";
|
|
3
|
+
import { computed } from "vue";
|
|
4
4
|
import { formatCount, formatTweetDate, proxyXImageUrl } from "../registry/x-embed";
|
|
5
|
+
import { requireRegistryEndpoint, scriptsPrefix } from "../utils";
|
|
5
6
|
const props = defineProps({
|
|
6
7
|
tweetId: { type: String, required: true },
|
|
7
|
-
apiEndpoint: { type: String, required: false, default:
|
|
8
|
-
imageProxyEndpoint: { type: String, required: false, default:
|
|
8
|
+
apiEndpoint: { type: String, required: false, default: void 0 },
|
|
9
|
+
imageProxyEndpoint: { type: String, required: false, default: void 0 },
|
|
9
10
|
rootAttrs: { type: Object, required: false }
|
|
10
11
|
});
|
|
12
|
+
defineSlots();
|
|
13
|
+
const prefix = scriptsPrefix();
|
|
14
|
+
const apiEndpoint = computed(() => props.apiEndpoint || `${prefix}/embed/x`);
|
|
15
|
+
const resolvedImageProxyEndpoint = computed(() => props.imageProxyEndpoint || `${prefix}/embed/x-image`);
|
|
16
|
+
if (!props.apiEndpoint)
|
|
17
|
+
requireRegistryEndpoint("ScriptXEmbed", "xEmbed");
|
|
11
18
|
const cacheKey = computed(() => `x-embed-${props.tweetId}`);
|
|
12
19
|
const { data: tweet, status, error } = useAsyncData(
|
|
13
20
|
cacheKey,
|
|
14
|
-
() => $fetch(`${
|
|
21
|
+
() => $fetch(`${apiEndpoint.value}?id=${props.tweetId}`)
|
|
15
22
|
);
|
|
16
23
|
const slotProps = computed(() => {
|
|
17
24
|
if (!tweet.value)
|
|
@@ -23,7 +30,7 @@ const slotProps = computed(() => {
|
|
|
23
30
|
// User info
|
|
24
31
|
userName: t.user.name,
|
|
25
32
|
userHandle: t.user.screen_name,
|
|
26
|
-
userAvatar: proxyXImageUrl(t.user.profile_image_url_https,
|
|
33
|
+
userAvatar: proxyXImageUrl(t.user.profile_image_url_https, resolvedImageProxyEndpoint.value),
|
|
27
34
|
userAvatarOriginal: t.user.profile_image_url_https,
|
|
28
35
|
isVerified: t.user.verified || t.user.is_blue_verified,
|
|
29
36
|
// Tweet content
|
|
@@ -38,11 +45,11 @@ const slotProps = computed(() => {
|
|
|
38
45
|
// Media
|
|
39
46
|
photos: t.photos?.map((p) => ({
|
|
40
47
|
...p,
|
|
41
|
-
proxiedUrl: proxyXImageUrl(p.url,
|
|
48
|
+
proxiedUrl: proxyXImageUrl(p.url, resolvedImageProxyEndpoint.value)
|
|
42
49
|
})),
|
|
43
50
|
video: t.video ? {
|
|
44
51
|
...t.video,
|
|
45
|
-
posterProxied: proxyXImageUrl(t.video.poster,
|
|
52
|
+
posterProxied: proxyXImageUrl(t.video.poster, resolvedImageProxyEndpoint.value)
|
|
46
53
|
} : null,
|
|
47
54
|
// Links
|
|
48
55
|
tweetUrl: `https://x.com/${t.user.screen_name}/status/${t.id_str}`,
|
|
@@ -53,7 +60,7 @@ const slotProps = computed(() => {
|
|
|
53
60
|
isReply: !!t.parent,
|
|
54
61
|
replyToUser: t.parent?.user.screen_name,
|
|
55
62
|
// Helpers
|
|
56
|
-
proxyImage: (url) => proxyXImageUrl(url,
|
|
63
|
+
proxyImage: (url) => proxyXImageUrl(url, resolvedImageProxyEndpoint.value)
|
|
57
64
|
};
|
|
58
65
|
});
|
|
59
66
|
defineExpose({
|
|
@@ -7,12 +7,10 @@ type __VLS_Props = {
|
|
|
7
7
|
tweetId: string;
|
|
8
8
|
/**
|
|
9
9
|
* Custom API endpoint for fetching tweet data
|
|
10
|
-
* @default '/_scripts/x-embed'
|
|
11
10
|
*/
|
|
12
11
|
apiEndpoint?: string;
|
|
13
12
|
/**
|
|
14
13
|
* Custom image proxy endpoint
|
|
15
|
-
* @default '/_scripts/x-embed-image'
|
|
16
14
|
*/
|
|
17
15
|
imageProxyEndpoint?: string;
|
|
18
16
|
/**
|
|
@@ -20,9 +18,15 @@ type __VLS_Props = {
|
|
|
20
18
|
*/
|
|
21
19
|
rootAttrs?: HTMLAttributes;
|
|
22
20
|
};
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
21
|
+
type __VLS_Slots = {
|
|
22
|
+
default?: (props: NonNullable<typeof slotProps.value>) => any;
|
|
23
|
+
loading?: () => any;
|
|
24
|
+
error?: (props: {
|
|
25
|
+
error: typeof error.value;
|
|
26
|
+
}) => any;
|
|
27
|
+
};
|
|
28
|
+
declare const error: import("vue").Ref<import("nuxt/app").NuxtError<unknown> | undefined, import("nuxt/app").NuxtError<unknown> | undefined>;
|
|
29
|
+
declare const slotProps: import("vue").ComputedRef<{
|
|
26
30
|
tweet: XEmbedTweetData;
|
|
27
31
|
userName: string;
|
|
28
32
|
userHandle: string;
|
|
@@ -56,14 +60,7 @@ declare var __VLS_1: {}, __VLS_3: {
|
|
|
56
60
|
isReply: boolean;
|
|
57
61
|
replyToUser: string | undefined;
|
|
58
62
|
proxyImage: (url: string) => string;
|
|
59
|
-
}
|
|
60
|
-
type __VLS_Slots = {} & {
|
|
61
|
-
loading?: (props: typeof __VLS_1) => any;
|
|
62
|
-
} & {
|
|
63
|
-
error?: (props: typeof __VLS_3) => any;
|
|
64
|
-
} & {
|
|
65
|
-
default?: (props: typeof __VLS_5) => any;
|
|
66
|
-
};
|
|
63
|
+
} | null>;
|
|
67
64
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
68
65
|
tweet: import("vue").Ref<XEmbedTweetData | undefined, XEmbedTweetData | undefined>;
|
|
69
66
|
status: import("vue").Ref<import("nuxt/app").AsyncDataRequestStatus, import("nuxt/app").AsyncDataRequestStatus>;
|
|
@@ -27,19 +27,14 @@ type __VLS_Props = {
|
|
|
27
27
|
*/
|
|
28
28
|
placeholderObjectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
|
|
29
29
|
};
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
awaitingLoad?: (props: typeof __VLS_10) => any;
|
|
39
|
-
} & {
|
|
40
|
-
error?: (props: typeof __VLS_12) => any;
|
|
41
|
-
} & {
|
|
42
|
-
default?: (props: typeof __VLS_14) => any;
|
|
30
|
+
type __VLS_Slots = {
|
|
31
|
+
default?: () => any;
|
|
32
|
+
placeholder?: (props: {
|
|
33
|
+
placeholder: string;
|
|
34
|
+
}) => any;
|
|
35
|
+
loading?: () => any;
|
|
36
|
+
awaitingLoad?: () => any;
|
|
37
|
+
error?: () => any;
|
|
43
38
|
};
|
|
44
39
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
45
40
|
player: Ref<YT.Player | undefined, YT.Player | undefined>;
|
|
@@ -61,12 +56,12 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
|
61
56
|
trigger: ElementScriptTrigger;
|
|
62
57
|
width: number;
|
|
63
58
|
height: number;
|
|
64
|
-
playerVars: YT.PlayerVars;
|
|
65
59
|
ratio: string;
|
|
60
|
+
placeholderObjectFit: "cover" | "contain" | "fill" | "none" | "scale-down";
|
|
61
|
+
playerVars: YT.PlayerVars;
|
|
66
62
|
cookies: boolean;
|
|
67
63
|
thumbnailSize: YoutubeThumbnailSize;
|
|
68
64
|
webp: boolean;
|
|
69
|
-
placeholderObjectFit: "cover" | "contain" | "fill" | "none" | "scale-down";
|
|
70
65
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
71
66
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
72
67
|
declare const _default: typeof __VLS_export;
|