https://github.com/smashah/chargebee-card
Chargebee card web components
https://github.com/smashah/chargebee-card
Last synced: 6 months ago
JSON representation
Chargebee card web components
- Host: GitHub
- URL: https://github.com/smashah/chargebee-card
- Owner: smashah
- License: mit
- Created: 2019-12-14T23:35:53.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-20T23:01:44.000Z (over 2 years ago)
- Last Synced: 2025-03-16T04:09:15.161Z (7 months ago)
- Language: JavaScript
- Size: 1.57 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 29
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://www.webcomponents.org/element/chargebee-card) [](https://badge.fury.io/js/chargebee-card)
# \
This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
## Installation
```bash
npm i chargebee-card
```
## Usage
You need to make sure to enable shadyDom and import chargebee
```html
Chargebee.init({
"site": "my-site",
"publishableKey": "test_3yuhb4yuh24iuyh34i3h4oiu23h4"
})
/* eslint-disable */if (window.customElements) window.customElements.forcePolyfill = !0; ShadyDOM = { force: !0 }; function idToChainedClass(poly, _this) { if (ShadyDOM) { const allElements = poly.dom(_this.root).querySelectorAll('*'); let id; for (let x = 0, len = allElements.length; x < len; x++) { if (allElements[x].id) { id = allElements[x].id; allElements[x].removeAttribute('id'); allElements[x].classList.add(id); _this.$[id] = poly.dom(_this.root).querySelector(`.${ id}`) } } } }
import 'chargebee-card/chargebee-card.js';
```
## Linting with ESLint, Prettier, and Types
To scan the project for linting errors, run
```bash
npm run lint
```
You can lint with ESLint and Prettier individually as well
```bash
npm run lint:eslint
```
```bash
npm run lint:prettier
```
To automatically fix many linting errors, run
```bash
npm run format
```
You can format using ESLint and Prettier individually as well
```bash
npm run format:eslint
```
```bash
npm run format:prettier
```
## Testing with Karma
To run the suite of karma tests, run
```bash
npm run test
```
or to run them in compatibility mode for legacy browsers
```bash
npm run test:compatibility
```
To run the tests in watch mode (for TDD, for example), run
```bash
npm run test:watch
```
or
```bash
npm run test:compatibility
```
## Testing with Karma via BrowserStack
To run the suite of karma tests in BrowserStack, run
```bash
npm run test:bs
```
## Managing Test Snapshots
You can manage the test snapshots using
```bash
npm run test:update-snapshots
```
or
```bash
npm run test:prune-snapshots
```
## Demoing with Storybook
To run a local instance of Storybook for your component, run
```bash
npm run storybook
```
To build a production version of Storybook, run
```bash
npm run storybook:build
```
## Local Demo with `es-dev-server`
```bash
npm start
```
To run a local development server that serves the basic demo located in `demo/index.html`
```bash
npm start:compatibility
```
To run a local development server in compatibility mode for older browsers that serves the basic demo located in `demo/index.html`