https://github.com/amiceli/papierjs
papierjs - papercss with web components
https://github.com/amiceli/papierjs
papercss stencil
Last synced: 4 months ago
JSON representation
papierjs - papercss with web components
- Host: GitHub
- URL: https://github.com/amiceli/papierjs
- Owner: amiceli
- License: mit
- Created: 2025-02-08T10:57:37.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-22T22:36:23.000Z (over 1 year ago)
- Last Synced: 2025-03-24T19:39:30.866Z (about 1 year ago)
- Topics: papercss, stencil
- Language: TypeScript
- Homepage: https://papier.miceli.click/
- Size: 1.59 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://stenciljs.com)
# papierjs - papercss with web components
**papierjs** *(papier is paper in french)* provides web component built with stencil with
papercss style.
papierjs will implements new components not in papercss like dropdown.
Available components:
- [X] Button
- [X] Alert
- [X] Progress bar
- [X] Text input
- [X] Badge
- [X] Slider
- [X] Card
- [X] Breadcrumb
- [X] Modals
- [X] Switch / Switch Tile
- [ ] NavBar
- [X] Tabs
- [X] Popover as tooltip
- [X] Icon (with [pixelarticons](https://github.com/halfmage/pixelarticons))
Component features :
- [X] dropdown since
- [X] `p-leaf` allow to use papercss style anywhere
- [X] notification
- [X] spinner
- [ ] password
- [X] accordion
## Using papercss
**papierjs** uses papercss style only in shadow root.
So you don't need to import papercss.
Papercss style isn't applied on your website.
## Install
npm install @amiceli/papierjs -S
Init components :
```javascript
import { defineCustomElements } from '@amiceli/papierjs/loader'
defineCustomElements()
```
## To run project
To build project :
```bash
npm install
npm run build
npm run build-storybook
```
To run storybook :
```bash
npm run storybook
```