fix(stripe): allow selecting Stripe.js SDK version

docs/content/scripts/stripe.md

@@ -15,7 +15,7 @@ links:
 [Stripe](https://stripe.com) is a popular payment gateway that allows you to accept payments online.
 
 Nuxt Scripts provides two Stripe features:
-- [`useScriptStripe()`{lang="ts"}](/scripts/stripe){lang="ts"} composable which loads the script `https://js.stripe.com/basil/stripe.js`.
+- [`useScriptStripe()`{lang="ts"}](/scripts/stripe){lang="ts"} composable which loads the script `https://js.stripe.com/basil/stripe.js` by default. Use the `version` option to [pin a Stripe.js SDK release](https://docs.stripe.com/sdks/stripejs-versioning) (e.g. `acacia`, `clover`, `dahlia`).
 - `ScriptStripePricingTable` component that allows you to embed a [Stripe Pricing Table](https://docs.stripe.com/payments/checkout/pricing-table) on your site using `https://js.stripe.com/v3/pricing-table.js`.
 
 ::script-stats

packages/script/src/registry-types.json

@@ -982,7 +982,7 @@
  {
  "name": "StripeOptions",
  "kind": "const",
- "code": "export const StripeOptions = object({\n /**\n * Whether to load Stripe's advanced fraud detection signals.\n * Set to `false` to opt out.\n * @default true\n * @see https://docs.stripe.com/disputes/prevention/advanced-fraud-detection\n */\n advancedFraudSignals: optional(boolean()),\n})"
+ "code": "export const StripeOptions = object({\n /**\n * Whether to load Stripe's advanced fraud detection signals.\n * Set to `false` to opt out.\n * @default true\n * @see https://docs.stripe.com/disputes/prevention/advanced-fraud-detection\n */\n advancedFraudSignals: optional(boolean()),\n /**\n * The Stripe.js SDK version to load.\n * Named releases get autocomplete; any future codename is also accepted.\n * @default 'basil'\n * @see https://docs.stripe.com/sdks/stripejs-versioning\n */\n version: optional(union([literal('v3'), literal('acacia'), literal('basil'), literal('clover'), literal('dahlia'), string()])),\n})"
  },
  {
  "name": "StripeApi",
@@ -2495,6 +2495,13 @@
  "required": false,
  "description": "Whether to load Stripe's advanced fraud detection signals. Set to `false` to opt out.",
  "defaultValue": "true"
+ },
+ {
+ "name": "version",
+ "type": "'v3' | 'acacia' | 'basil' | 'clover' | 'dahlia' | string",
+ "required": false,
+ "description": "The Stripe.js SDK version to load. Named releases get autocomplete; any future codename is also accepted.",
+ "defaultValue": "'basil'"
  }
  ],
  "TikTokPixelOptions": [

packages/script/src/runtime/registry/schemas.ts

@@ -1097,6 +1097,13 @@ export const StripeOptions = object({
  * @see https://docs.stripe.com/disputes/prevention/advanced-fraud-detection
  */
  advancedFraudSignals: optional(boolean()),
+ /**
+ * The Stripe.js SDK version to load.
+ * Named releases get autocomplete; any future codename is also accepted.
+ * @default 'basil'
+ * @see https://docs.stripe.com/sdks/stripejs-versioning
+ */
+ version: optional(union([literal('v3'), literal('acacia'), literal('basil'), literal('clover'), literal('dahlia'), string()])),
 })
 
 export const TikTokPixelOptions = object({

packages/script/src/runtime/registry/stripe.ts

@@ -16,7 +16,7 @@ export function useScriptStripe<T extends StripeApi>(_options?: StripeInput) {
  return useRegistryScript<T, typeof StripeOptions>('stripe', options => ({
  scriptInput: {
  src: withQuery(
- `https://js.stripe.com/basil/stripe.js`,
+ `https://js.stripe.com/${options?.version || 'basil'}/stripe.js`,
  (typeof options?.advancedFraudSignals === 'boolean' && !options?.advancedFraudSignals) ? { advancedFraudSignals: false } : {},
  ),
  // opt-out of privacy defaults