https://github.com/mostlywhat/svelte-payment-inputs
Svelte Payment Inputs is a collection of unstyled payment input components for Svelte.
https://github.com/mostlywhat/svelte-payment-inputs
bits-ui inputs payment svelte
Last synced: 28 days ago
JSON representation
Svelte Payment Inputs is a collection of unstyled payment input components for Svelte.
- Host: GitHub
- URL: https://github.com/mostlywhat/svelte-payment-inputs
- Owner: MostlyWhat
- License: mit
- Created: 2025-04-26T06:29:28.000Z (about 1 month ago)
- Default Branch: main
- Last Pushed: 2025-05-09T16:41:32.000Z (about 1 month ago)
- Last Synced: 2025-05-12T01:54:46.270Z (28 days ago)
- Topics: bits-ui, inputs, payment, svelte
- Language: MDX
- Homepage: https://mostlywhat.github.io/svelte-payment-inputs/
- Size: 1.2 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Roadmap: ROADMAP.md
Awesome Lists containing this project
README
# Svelte Payment Inputs
[](https://npmjs.com/package/svelte-payment-inputs)
[](https://npmjs.com/package/svelte-payment-inputs)
[](https://github.com/mostlywhat/svelte-payment-inputs/blob/main/LICENSE)
Svelte Payment Inputs is a collection of unstyled payment input components for Svelte.
This is a port of [React Payment Inputs](https://github.com/medipass/react-payment-inputs) for React, which was created by [Medipass](https://github.com/medipass).
## Usage
To start using the library, install it in your project:
```bash
npm install svelte-payment-inputs
```
Use the drawer in your app.
```svelte
import { Package } from "svelte-payment-inputs";
{
console.log(event.detail);
}}
```
## Documentation
The documentation is hosted on [GitHub Pages](https://mostlywhat.github.io/svelte-payment-inputs/).
## Examples
Play around with the examples on StackBlitz:
- [With scaled background](https://stackblitz.com/edit/vaul-svelte-scaled?file=src%2Froutes%2F%2Bpage.svelte)
## API Reference
TBD
## Developing
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```bash
npm run dev
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
Everything inside `src/lib` is part of the library, everything inside `src/routes` is the documentation.
## Building
To build the library:
```bash
npm run package
```
To create a production version of the documentation:
```bash
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy the app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
## Publishing
To publish the library to [npm](https://www.npmjs.com):
```bash
npm publish
```
## Testing
To run the tests, use the following command:
```bash
npm run test
```
## Roadmap
The roadmap for the project is available in the [ROADMAP.md](ROADMAP.md) file.
## Acknowledgements
TBD
## License
The svelte-payment-inputs is licensed under the [MIT License](LICENSE).
## Contributing
Contributions are welcome! Please read the [contributing guidelines](CONTRIBUTING.md) for more information.