Release Notes v3.2.0

✨ New Features

• stripe-modal: Added open/close animations for a smoother modal experience.
  • Updates modal behavior to support animation-friendly state transitions.
  • Includes related updates in stripe-card-element-modal and the dev demo page.

🧪 Test Improvements

• Stabilized snapshots across locales by forcing the test i18n language to English in the Stencil test setup.

🛠️ Maintenance / CI

• CI/test updates to keep specs and snapshots in sync with recent modal changes.
• Style tweaks and minor dev demo adjustments.

📦 Upgrade

npm install stripe-pwa-elements@3.2.0

🔗 Full Changelog

https://github.com/wpkyoto/stripe-pwa-elements/compare/v3.1.0...v3.2.0

• test: force i18n language to en in tests 08cba98
• Merge pull request #74 from wpkyoto/feat/modal_animation 6527e5b
• chore: update styles 5f512ab
• chore: revert change index.html 4555627
• fix(ci): update spec and test 817d58a
• feat(modal): add animation 520deb7
• Merge pull request #73 from wpkyoto/update/example-index 1879f5a
• update dev app 7cfa61a

---

v3.1.0...v3.2.0

Release Notes v3.1.0

Release Notes v3.1.0

🎉 New Features

New Components

• stripe-payment-element: Added Stripe Payment Element component

  • Includes Checkout Session support
  • Adopts service architecture pattern

• stripe-express-checkout-element: Added Express Checkout Element component

  • Supports fast checkout methods like Apple Pay and Google Pay

• stripe-address-element: Added Stripe Address Element component

  • Provides address input form
  • Adopts service pattern

• stripe-currency-selector: Added Stripe Currency Selector Element component

  • Provides currency selection functionality

• stripe-link-authentication-element: Added Stripe Link Authentication Element component

  • Supports authentication via Stripe Link

🔒 Security Fixes

This release fixes security vulnerabilities in dependencies.

Fixed Vulnerabilities

• glob package command injection vulnerability (High severity)

  • Fixed vulnerability in glob 10.2.0 - 10.4.5
  • GHSA-5j98-mcp5-4vw2

• brace-expansion package ReDoS vulnerability (Low severity)

  • Fixed vulnerability in brace-expansion 1.0.0 - 1.1.11
  • GHSA-v6h2-p8h4-qcjw

• tmp package symbolic link vulnerability (Low severity)

  • Fixed vulnerability in tmp <=0.2.3
  • Added overrides section to package.json to override tmp with a safe version (^0.2.5)
  • GHSA-52f5-9888-hmc6

🧪 Test Improvements

• Separated unit tests and component tests
• Added unit tests for each component and service
• Improved test runner (cross-platform support)

🛠️ Other Improvements

Bug Fixes

• Fixed issue where stripeAccount prop was ignored when set before publishableKey
• Fixed event handling and store management in Stripe Link Authentication Element
• Prevented duplicate form submissions in Payment Element
• Fixed TypeScript errors

Refactoring

• Unified lifecycle methods to componentWillRender
• Moved inline styles to SCSS for better maintainability
• Improved error handling
• Extracted common findElement utility

Development Environment Improvements

• Migrated ESLint config to flat config format (ESLint 9 support)
• Improved GitHub Actions workflow (faster feedback)
• Updated styles to match current Stripe SDK design
• Removed deprecated SASS imports

📦 Upgrade Instructions

npm install stripe-pwa-elements@3.1.0

or

npm update stripe-pwa-elements

---

Full Changelog: v3.0.0...v3.1.0

Release Notes - v3.0.0

🎉 Major Release

We're excited to announce the release of stripe-pwa-elements v3.0.0! This release includes significant improvements, architectural changes, and important breaking changes that align the component names with Stripe's official naming conventions.

---

⚠️ Breaking Changes

Component Name Changes

To align with Stripe Elements naming conventions, we've renamed all components. You must update your code to use the new component names:

Component Renaming Map

Old Component Name	New Component Name
<stripe-payment-sheet>	<stripe-card-element>
<stripe-payment-sheet-modal>	<stripe-card-element-modal>
<stripe-element-modal>	<stripe-modal>

Migration Guide

1. Update HTML Tags

<!-- Before (v2.x) -->
<stripe-payment-sheet
  publishable-key="pk_test_xxxxx"
  intent-client-secret="pi_xxxxxx"
></stripe-payment-sheet>

<!-- After (v3.0.0) -->
<stripe-card-element
  publishable-key="pk_test_xxxxx"
  intent-client-secret="pi_xxxxxx"
></stripe-card-element>

2. Update JavaScript createElement Calls

// Before (v2.x)
const element = document.createElement('stripe-payment-sheet');
await customElements.whenDefined('stripe-payment-sheet');

// After (v3.0.0)
const element = document.createElement('stripe-card-element');
await customElements.whenDefined('stripe-card-element');

3. Update TypeScript Type References

// Before (v2.x)
const element: HTMLStripePaymentSheetElement = document.querySelector('stripe-payment-sheet');

// After (v3.0.0)
const element: HTMLStripeCardElementElement = document.querySelector('stripe-card-element');

4. Update Modal Components

<!-- Before (v2.x) -->
<stripe-element-modal open="true">
  <stripe-payment-sheet-modal
    publishable-key="pk_test_xxxxx"
    intent-client-secret="pi_xxxxxx"
  ></stripe-payment-sheet-modal>
</stripe-element-modal>

<!-- After (v3.0.0) -->
<stripe-modal open="true">
  <stripe-card-element-modal
    publishable-key="pk_test_xxxxx"
    intent-client-secret="pi_xxxxxx"
  ></stripe-card-element-modal>
</stripe-modal>

5. Update Event Listeners

Event names remain the same, but make sure to update component references:

// Before (v2.x)
const sheetElement = document.querySelector('stripe-payment-sheet');
sheetElement.addEventListener('formSubmit', handler);

// After (v3.0.0)
const cardElement = document.querySelector('stripe-card-element');
cardElement.addEventListener('formSubmit', handler);

---

✨ New Features

Stencil 4 Migration

• Upgraded to Stencil 4: Migrated from Stencil 3 to Stencil 4 (@stencil/core@^4.38.3)
• Improved build performance and better TypeScript support
• Enhanced developer experience with better error messages

Service Pattern Architecture

• Refactored to Service Pattern: Migrated from Stencil Store to a Service pattern with dependency injection
• Better separation of concerns and improved testability
• Enhanced error handling and element management

Enhanced Error Handling

• Improved StripeService error handling and element finding
• Better error messages and debugging capabilities
• Fixed memory leaks in component lifecycle management

---

🐛 Bug Fixes

• Fixed memory leaks: Resolved memory leaks in component lifecycle management
• Type fixes:
  • Updated type references from HTMLStripePaymentElement to HTMLStripeCardElementElement
  • Fixed StripePaymentRequestButtonElement type usage
  • Resolved TypeScript noUnusedLocals errors
• Example fixes:
  • Fixed cardNumberElement usage in examples
  • Resolved client errors in example code
• Error logging: Improved error message logging on default submit events

---

🔧 Improvements

Dependencies

• Stripe.js: Upgraded to @stripe/stripe-js@^8.4.0
• i18next: Updated to ^25.6.2
• Other dependencies: Updated to latest compatible versions

Testing

• Expanded unit test coverage for utility functions and components
• Rewrote tests to avoid private method mocking
• Removed obsolete snapshots after component rename
• Added tests for each method

Documentation

• Added comprehensive CLAUDE.md for AI assistant guidance
• Updated auto-generated component documentation
• Improved example layouts and code

CI/CD

• Updated GitHub Actions workflows
• Improved CI pipeline reliability

---

📦 Installation

npm install stripe-pwa-elements@3.0.0
# or
yarn add stripe-pwa-elements@3.0.0

---

🔄 Upgrade Steps

1. Update package version:

   npm install stripe-pwa-elements@3.0.0

2. Update component names in your codebase:

   • Search and replace stripe-payment-sheet → stripe-card-element
   • Search and replace stripe-payment-sheet-modal → stripe-card-element-modal
   • Search and replace stripe-element-modal → stripe-modal

3. Update TypeScript types if using TypeScript:

   • Update HTMLStripePaymentSheetElement → HTMLStripeCardElementElement
   • Update other related type references

4. Test your application thoroughly after migration

5. Update any custom CSS selectors that target the old component names

---

📚 Documentation

• Component Documentation
• Migration Guide (see above)
• Examples

---

🙏 Thank You

Thank you to all contributors who made this release possible! Special thanks to everyone who provided feedback and helped test the migration.

---

📝 Full Changelog

For a complete list of changes, see the comparison between v3.0.0-0 and v3.0.0.

---

Note: If you encounter any issues during migration, please open an issue on GitHub.

v3.0.0-0

Refactoring several internal codes to improve maintenance ability.

• downgrade np 2b6d0b6
• Merge pull request #35 from wpkyoto/upgrade/stencil-3 530e260
• Merge branch 'main' of github.com:wpkyoto/stripe-pwa-elements into upgrade/stencil-3 41f9e4b
• fix: rename eslint rule from @Stencil -> @stencil-community b605720
• fix: package dependencies 86dcdff
• fix: test/build errors 400910c
• upgrade: stencil 2 -> 3 224f9c3

v2.1.0...v3.0.0-0

v2.1.0

• Merge pull request #36 from allancmello/feat/community/allancmello 1506913
• Replace pt-BR to 'pt-BR' 5f046a6
• Merge pull request #30 from fr3fou/patch-1 2a806cc
• Fixed locale for Brazilian Portuguese 117374f
• Update translation to locale portuguese brazilian fb7787c
• test: add unit test for the stripe-sheet element eb7f4ea
• fix: npm audit fix 3bdfcaf
• rename package dfb18df
• fix: font-family 6b5fdf6

v2.0.2...v2.1.0

v2.0.2

• fmt 684061e
• fix(): wait to be able to querySelector bf8d6ca

v2.0.1...v2.0.2

v2.0.1

• fix: add stripeAccount to @props 6965059

v2.0.0...v2.0.1

v2.0.0

• Merge pull request #29 from stripe-elements/feat/add_account f84d0c4
• chore: npm update 061fed4
• fmt 9c53772
• Merge pull request #28 from stripe-elements/feat/add_account 8b23d78
• feat: add function set stripeAccount 6235fa6

v1.1.0...v2.0.0

v1.1.0

• fmt 9a4450d
• Merge pull request #27 from stripe-elements/feat/capacitor_payment_request 1775e8a

v1.1.0-12...v1.1.0

v1.1.0-9

v1.0.0