@amiceli/papierjs 0.11.0 → 0.13.0

package/dist/papierjs/p-spinner.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"p-spinner.entry.esm.js","sources":["src/components/p-spinner/p-spinner.scss?tag=p-spinner&encapsulation=shadow","src/components/p-spinner/p-spinner.tsx"],"sourcesContent":["@keyframes spin {\n    0% {\n        transform: scale(1);\n        opacity: 1\n    }\n\n    45% {\n        transform: scale(0.1);\n        opacity: 0.7\n    }\n\n    80% {\n        transform: scale(1);\n        opacity: 1\n    }\n}\n\n:host {\n    @import \"../common\";\n\n    .p-spinner {\n        display: inline-block;\n        line-height: 1px;\n\n        &.is--large {\n            div {\n                width: 20px;\n                height: 20px;\n            }\n        }\n\n        div {\n            display: inline-block;\n            width: 10px;\n            height: 10px;\n            animation: spin 1s 0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);\n\n            &:first-of-type {\n                animation: spin 1s 0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);\n                margin-right: 8px;\n            }\n\n            &:last-of-type {\n                animation: spin 1s 0.36s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);\n                margin-left: 8px;\n            }\n        }\n    }\n}","import { Component, Host, h, Prop } from '@stencil/core'\n\n@Component({\n    tag: 'p-spinner',\n    styleUrl: 'p-spinner.scss',\n    shadow: true,\n})\nexport class PSpinner {\n    @Prop()\n    public large: boolean = false\n\n    @Prop()\n    public color?: string\n\n    @Prop()\n    public dark?: boolean\n\n    public getStyle() {\n        return {\n            backgroundColor: this.color || 'currentColor',\n        }\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        'p-spinner': true,\n                        papier: true,\n                        'is--large': this.large,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <div class=\"border border-primary\" style={this.getStyle()} />\n                    <div class=\"border border-primary\" style={this.getStyle()} />\n                    <div class=\"border border-primary\" style={this.getStyle()} />\n                </div>\n            </Host>\n        )\n    }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,WAAW,GAAG,ourFAAourF;;MCO3urF,QAAQ,GAAA,MAAA;AALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOW,QAAA,IAAK,CAAA,KAAA,GAAY,KAAK;AAgChC;IAxBU,QAAQ,GAAA;QACX,OAAO;AACH,YAAA,eAAe,EAAE,IAAI,CAAC,KAAK,IAAI,cAAc;SAChD;;IAGL,MAAM,GAAA;QACF,QACI,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;AACH,gBAAA,WAAW,EAAE,IAAI;AACjB,gBAAA,MAAM,EAAE,IAAI;gBACZ,WAAW,EAAE,IAAI,CAAC,KAAK;gBACvB,UAAU,EAAE,IAAI,CAAC,IAAI;AACxB,aAAA,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,uBAAuB,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAI,CAAA,EAC7D,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,uBAAuB,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAI,CAAA,EAC7D,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,uBAAuB,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAA,CAAI,CAC3D,CACH;;;;;;;"}
+{"version":3,"file":"p-spinner.entry.esm.js","sources":["src/components/p-spinner/p-spinner.scss?tag=p-spinner&encapsulation=shadow","src/components/p-spinner/p-spinner.tsx"],"sourcesContent":["@keyframes spin {\n    0% {\n        transform: scale(1);\n        opacity: 1\n    }\n\n    45% {\n        transform: scale(0.1);\n        opacity: 0.7\n    }\n\n    80% {\n        transform: scale(1);\n        opacity: 1\n    }\n}\n\n:host {\n    @import \"../common\";\n\n    .p-spinner {\n        display: inline-block;\n        line-height: 1px;\n\n        &.is--large {\n            div {\n                width: 20px;\n                height: 20px;\n            }\n        }\n\n        div {\n            display: inline-block;\n            width: 10px;\n            height: 10px;\n            animation: spin 1s 0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);\n\n            &:first-of-type {\n                animation: spin 1s 0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);\n                margin-right: 8px;\n            }\n\n            &:last-of-type {\n                animation: spin 1s 0.36s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);\n                margin-left: 8px;\n            }\n        }\n    }\n}","import { Component, Host, h, Prop } from '@stencil/core'\n\n@Component({\n    tag: 'p-spinner',\n    styleUrl: 'p-spinner.scss',\n    shadow: true,\n})\nexport class PSpinner {\n    @Prop()\n    public large: boolean = false\n\n    @Prop()\n    public color?: string\n\n    @Prop()\n    public dark?: boolean\n\n    public getStyle() {\n        return {\n            backgroundColor: this.color || 'currentColor',\n        }\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        'p-spinner': true,\n                        papier: true,\n                        'is--large': this.large,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <div class=\"border border-primary\" style={this.getStyle()}></div>\n                    <div class=\"border border-primary\" style={this.getStyle()}></div>\n                    <div class=\"border border-primary\" style={this.getStyle()}></div>\n                </div>\n            </Host>\n        )\n    }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,WAAW,GAAG,ourFAAourF;;MCO3urF,QAAQ,GAAA,MAAA;AALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOW,QAAA,IAAK,CAAA,KAAA,GAAY,KAAK;AAgChC;IAxBU,QAAQ,GAAA;QACX,OAAO;AACH,YAAA,eAAe,EAAE,IAAI,CAAC,KAAK,IAAI,cAAc;SAChD;;IAGL,MAAM,GAAA;QACF,QACI,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;AACH,gBAAA,WAAW,EAAE,IAAI;AACjB,gBAAA,MAAM,EAAE,IAAI;gBACZ,WAAW,EAAE,IAAI,CAAC,KAAK;gBACvB,UAAU,EAAE,IAAI,CAAC,IAAI;AACxB,aAAA,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,uBAAuB,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAQ,CAAA,EACjE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,uBAAuB,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAQ,CAAA,EACjE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,uBAAuB,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAA,CAAQ,CAC/D,CACH;;;;;;;"}

package/dist/papierjs/p-switch-tile.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"p-switch-tile.entry.esm.js","sources":["src/components/form/p-switch-tile/switch-tile.scss?tag=p-switch-tile&encapsulation=shadow","src/components/form/p-switch-tile/switch-tile.tsx"],"sourcesContent":[":host {\n    @import '../../common';\n\n    .papier {\n        display: inline-block;\n\n        .form-group {\n            margin-bottom: 0;\n            display: inline-block;\n        }\n    }\n}\n","import { Component, Event, type EventEmitter, Host, h, Prop } from '@stencil/core'\n\ntype TileBackground = 'primary' | 'danger' | 'secondary' | 'success' | 'muted'\n\n/**\n * @slot unchecked-text - displayed text when switch is unchecked\n * @slot checked-text - displayed text when switch is checked\n */\n@Component({\n    tag: 'p-switch-tile',\n    styleUrl: 'switch-tile.scss',\n    shadow: true,\n})\nexport class PSwitchTile {\n    /** Enable dark mode */\n    @Prop()\n    public dark?: boolean = false\n    @Prop()\n    public checked?: boolean = false\n    @Prop()\n    public checkedBackground?: TileBackground = 'primary'\n    @Prop()\n    public uncheckedBackground?: TileBackground\n\n    @Event({\n        eventName: 'change',\n    })\n    public changeEvent: EventEmitter<boolean>\n\n    public onInput(e: Event) {\n        this.changeEvent.emit((e.target as HTMLInputElement).checked)\n    }\n\n    public getFrontCardClass() {\n        const cssClass = {\n            'paper-switch-tile-card-front': true,\n            border: true,\n        }\n\n        cssClass[`background-${this.uncheckedBackground}`] = true\n\n        return cssClass\n    }\n\n    public getBackCardClass() {\n        const cssClass = {\n            'paper-switch-tile-card-back': true,\n            border: true,\n        }\n\n        cssClass[`background-${this.checkedBackground}`] = true\n\n        return cssClass\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        papier: true,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <div class=\"form-group\">\n                        <label htmlFor=\"paperSwitch1\" class=\"paper-switch-tile\">\n                            <input id=\"paperSwitch1\" name=\"paperSwitch1\" type=\"checkbox\" checked={this.checked} />\n                            <div class=\"paper-switch-tile-card border\">\n                                <div class={this.getFrontCardClass()}>\n                                    <slot name=\"unchecked-text\" />\n                                </div>\n                                <div class={this.getBackCardClass()}>\n                                    <slot name=\"checked-text\" />\n                                </div>\n                            </div>\n                        </label>\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,imqFAAimqF;;MCa1mqF,WAAW,GAAA,MAAA;AALxB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAQW,QAAA,IAAI,CAAA,IAAA,GAAa,KAAK;AAEtB,QAAA,IAAO,CAAA,OAAA,GAAa,KAAK;AAEzB,QAAA,IAAiB,CAAA,iBAAA,GAAoB,SAAS;AA6DxD;AApDU,IAAA,OAAO,CAAC,CAAQ,EAAA;QACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAE,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC;;IAG1D,iBAAiB,GAAA;AACpB,QAAA,MAAM,QAAQ,GAAG;AACb,YAAA,8BAA8B,EAAE,IAAI;AACpC,YAAA,MAAM,EAAE,IAAI;SACf;QAED,QAAQ,CAAC,cAAc,IAAI,CAAC,mBAAmB,CAAE,CAAA,CAAC,GAAG,IAAI;AAEzD,QAAA,OAAO,QAAQ;;IAGZ,gBAAgB,GAAA;AACnB,QAAA,MAAM,QAAQ,GAAG;AACb,YAAA,6BAA6B,EAAE,IAAI;AACnC,YAAA,MAAM,EAAE,IAAI;SACf;QAED,QAAQ,CAAC,cAAc,IAAI,CAAC,iBAAiB,CAAE,CAAA,CAAC,GAAG,IAAI;AAEvD,QAAA,OAAO,QAAQ;;IAGnB,MAAM,GAAA;QACF,QACI,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;AACH,gBAAA,MAAM,EAAE,IAAI;gBACZ,UAAU,EAAE,IAAI,CAAC,IAAI;AACxB,aAAA,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACnB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,OAAO,EAAC,cAAc,EAAC,KAAK,EAAC,mBAAmB,EAAA,EACnD,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,EAAE,EAAC,cAAc,EAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,EAAI,CAAA,EACtF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,+BAA+B,EAAA,EACtC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,EAAA,EAChC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,gBAAgB,EAAA,CAAG,CAC5B,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,EAAA,EAC/B,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,cAAc,EAAG,CAAA,CAC1B,CACJ,CACF,CACN,CACJ,CACH;;;;;;;"}
+{"version":3,"file":"p-switch-tile.entry.esm.js","sources":["src/components/form/p-switch-tile/switch-tile.scss?tag=p-switch-tile&encapsulation=shadow","src/components/form/p-switch-tile/switch-tile.tsx"],"sourcesContent":[":host {\n    @import '../../common';\n\n    .papier {\n        display: inline-block;\n\n        .form-group {\n            margin-bottom: 0;\n            display: inline-block;\n        }\n    }\n}\n","import { Component, Event, type EventEmitter, Host, h, Prop } from '@stencil/core'\n\ntype TileBackground = 'primary' | 'danger' | 'secondary' | 'success' | 'muted'\n\n/**\n * @slot unchecked-text - displayed text when switch is unchecked\n * @slot checked-text - displayed text when switch is checked\n */\n@Component({\n    tag: 'p-switch-tile',\n    styleUrl: 'switch-tile.scss',\n    shadow: true,\n})\nexport class PSwitchTile {\n    /** Enable dark mode */\n    @Prop()\n    public dark?: boolean = false\n    @Prop()\n    public checked?: boolean = false\n    @Prop()\n    public checkedBackground?: TileBackground = 'primary'\n    @Prop()\n    public uncheckedBackground?: TileBackground\n\n    @Event({\n        eventName: 'change',\n    })\n    public changeEvent: EventEmitter<boolean>\n\n    public onInput(e: Event) {\n        this.changeEvent.emit((e.target as HTMLInputElement).checked)\n    }\n\n    public getFrontCardClass() {\n        const cssClass = {\n            'paper-switch-tile-card-front': true,\n            border: true,\n        }\n\n        cssClass[`background-${this.uncheckedBackground}`] = true\n\n        return cssClass\n    }\n\n    public getBackCardClass() {\n        const cssClass = {\n            'paper-switch-tile-card-back': true,\n            border: true,\n        }\n\n        cssClass[`background-${this.checkedBackground}`] = true\n\n        return cssClass\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        papier: true,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <div class=\"form-group\">\n                        <label class=\"paper-switch-tile\" htmlFor=\"paperSwitch1\">\n                            <input checked={this.checked} id=\"paperSwitch1\" name=\"paperSwitch1\" type=\"checkbox\" />\n                            <div class=\"paper-switch-tile-card border\">\n                                <div class={this.getFrontCardClass()}>\n                                    <slot name=\"unchecked-text\" />\n                                </div>\n                                <div class={this.getBackCardClass()}>\n                                    <slot name=\"checked-text\" />\n                                </div>\n                            </div>\n                        </label>\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,imqFAAimqF;;MCa1mqF,WAAW,GAAA,MAAA;AALxB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAQW,QAAA,IAAI,CAAA,IAAA,GAAa,KAAK;AAEtB,QAAA,IAAO,CAAA,OAAA,GAAa,KAAK;AAEzB,QAAA,IAAiB,CAAA,iBAAA,GAAoB,SAAS;AA6DxD;AApDU,IAAA,OAAO,CAAC,CAAQ,EAAA;QACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAE,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC;;IAG1D,iBAAiB,GAAA;AACpB,QAAA,MAAM,QAAQ,GAAG;AACb,YAAA,8BAA8B,EAAE,IAAI;AACpC,YAAA,MAAM,EAAE,IAAI;SACf;QAED,QAAQ,CAAC,cAAc,IAAI,CAAC,mBAAmB,CAAE,CAAA,CAAC,GAAG,IAAI;AAEzD,QAAA,OAAO,QAAQ;;IAGZ,gBAAgB,GAAA;AACnB,QAAA,MAAM,QAAQ,GAAG;AACb,YAAA,6BAA6B,EAAE,IAAI;AACnC,YAAA,MAAM,EAAE,IAAI;SACf;QAED,QAAQ,CAAC,cAAc,IAAI,CAAC,iBAAiB,CAAE,CAAA,CAAC,GAAG,IAAI;AAEvD,QAAA,OAAO,QAAQ;;IAGnB,MAAM,GAAA;QACF,QACI,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;AACH,gBAAA,MAAM,EAAE,IAAI;gBACZ,UAAU,EAAE,IAAI,CAAC,IAAI;AACxB,aAAA,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACnB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,KAAK,EAAC,mBAAmB,EAAC,OAAO,EAAC,cAAc,EAAA,EACnD,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAO,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,EAAC,cAAc,EAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,UAAU,EAAG,CAAA,EACtF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,+BAA+B,EAAA,EACtC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,EAAA,EAChC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,gBAAgB,EAAA,CAAG,CAC5B,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,EAAA,EAC/B,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,cAAc,EAAG,CAAA,CAC1B,CACJ,CACF,CACN,CACJ,CACH;;;;;;;"}

package/dist/papierjs/p-switch.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"p-switch.entry.esm.js","sources":["src/components/form/p-switch/switch.scss?tag=p-switch&encapsulation=shadow","src/components/form/p-switch/switch.tsx"],"sourcesContent":[":host {\n    @import '../../common';\n\n    .papier {\n        display: inline-block;\n\n        .form-group {\n            margin-bottom: 0;\n            display: inline-block;\n        }\n    }\n}\n","import { Component, Event, type EventEmitter, Host, h, Prop } from '@stencil/core'\n\n@Component({\n    tag: 'p-switch',\n    styleUrl: 'switch.scss',\n    shadow: true,\n})\nexport class PSwitch {\n    /** define switch style */\n    @Prop()\n    public round?: boolean = false\n    /** define switch parent style */\n    @Prop()\n    public square?: boolean = false\n    @Prop()\n    public dark?: boolean = false\n    @Prop()\n    public checked?: boolean = false\n\n    @Event({\n        eventName: 'change',\n    })\n    public changeEvent: EventEmitter<boolean>\n\n    public onInput(e: Event) {\n        this.changeEvent.emit((e.target as HTMLInputElement).checked)\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        papier: true,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <div class=\"form-group\">\n                        <label\n                            class={{\n                                'paper-switch': !this.square,\n                                'paper-switch-2': this.square,\n                            }}\n                        >\n                            <input\n                                id=\"paperSwitch4\"\n                                name=\"paperSwitch4\"\n                                type=\"checkbox\"\n                                checked={this.checked}\n                                onInput={(e) => this.onInput(e)}\n                            />\n                            <span\n                                class={{\n                                    round: this.round,\n                                    'paper-switch-slider': true,\n                                }}\n                            />\n                        </label>\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,SAAS,GAAG,imqFAAimqF;;MCOtmqF,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAQW,QAAA,IAAK,CAAA,KAAA,GAAa,KAAK;;AAGvB,QAAA,IAAM,CAAA,MAAA,GAAa,KAAK;AAExB,QAAA,IAAI,CAAA,IAAA,GAAa,KAAK;AAEtB,QAAA,IAAO,CAAA,OAAA,GAAa,KAAK;AA8CnC;AAvCU,IAAA,OAAO,CAAC,CAAQ,EAAA;QACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAE,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC;;IAGjE,MAAM,GAAA;QACF,QACI,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;AACH,gBAAA,MAAM,EAAE,IAAI;gBACZ,UAAU,EAAE,IAAI,CAAC,IAAI;aACxB,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACnB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;AACH,gBAAA,cAAc,EAAE,CAAC,IAAI,CAAC,MAAM;gBAC5B,gBAAgB,EAAE,IAAI,CAAC,MAAM;aAChC,EAAA,EAED,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,EAAE,EAAC,cAAc,EACjB,IAAI,EAAC,cAAc,EACnB,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EACjC,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;gBACH,KAAK,EAAE,IAAI,CAAC,KAAK;AACjB,gBAAA,qBAAqB,EAAE,IAAI;AAC9B,aAAA,EAAA,CACH,CACE,CACN,CACJ,CACH;;;;;;;"}
+{"version":3,"file":"p-switch.entry.esm.js","sources":["src/components/form/p-switch/switch.scss?tag=p-switch&encapsulation=shadow","src/components/form/p-switch/switch.tsx"],"sourcesContent":[":host {\n    @import '../../common';\n\n    .papier {\n        display: inline-block;\n\n        .form-group {\n            margin-bottom: 0;\n            display: inline-block;\n        }\n    }\n}\n","import { Component, Event, type EventEmitter, Host, h, Prop } from '@stencil/core'\n\n@Component({\n    tag: 'p-switch',\n    styleUrl: 'switch.scss',\n    shadow: true,\n})\nexport class PSwitch {\n    /** define switch style */\n    @Prop()\n    public round?: boolean = false\n    /** define switch parent style */\n    @Prop()\n    public square?: boolean = false\n    @Prop()\n    public dark?: boolean = false\n    @Prop()\n    public checked?: boolean = false\n\n    @Event({\n        eventName: 'change',\n    })\n    public changeEvent: EventEmitter<boolean>\n\n    public onInput(e: Event) {\n        this.changeEvent.emit((e.target as HTMLInputElement).checked)\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        papier: true,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <div class=\"form-group\">\n                        <label\n                            class={{\n                                'paper-switch': !this.square,\n                                'paper-switch-2': this.square,\n                            }}\n                        >\n                            <input\n                                checked={this.checked}\n                                id=\"paperSwitch4\"\n                                name=\"paperSwitch4\"\n                                onInput={(e) => this.onInput(e)}\n                                type=\"checkbox\"\n                            />\n                            <span\n                                class={{\n                                    round: this.round,\n                                    'paper-switch-slider': true,\n                                }}\n                            />\n                        </label>\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,SAAS,GAAG,imqFAAimqF;;MCOtmqF,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAQW,QAAA,IAAK,CAAA,KAAA,GAAa,KAAK;;AAGvB,QAAA,IAAM,CAAA,MAAA,GAAa,KAAK;AAExB,QAAA,IAAI,CAAA,IAAA,GAAa,KAAK;AAEtB,QAAA,IAAO,CAAA,OAAA,GAAa,KAAK;AA8CnC;AAvCU,IAAA,OAAO,CAAC,CAAQ,EAAA;QACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAE,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC;;IAGjE,MAAM,GAAA;QACF,QACI,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;AACH,gBAAA,MAAM,EAAE,IAAI;gBACZ,UAAU,EAAE,IAAI,CAAC,IAAI;aACxB,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACnB,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;AACH,gBAAA,cAAc,EAAE,CAAC,IAAI,CAAC,MAAM;gBAC5B,gBAAgB,EAAE,IAAI,CAAC,MAAM;aAChC,EAAA,EAED,CAAA,CAAA,OAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,EAAE,EAAC,cAAc,EACjB,IAAI,EAAC,cAAc,EACnB,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAC/B,IAAI,EAAC,UAAU,EACjB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACI,KAAK,EAAE;gBACH,KAAK,EAAE,IAAI,CAAC,KAAK;AACjB,gBAAA,qBAAqB,EAAE,IAAI;AAC9B,aAAA,EAAA,CACH,CACE,CACN,CACJ,CACH;;;;;;;"}

package/dist/papierjs/p-tooltip.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"p-tooltip.entry.esm.js","sources":["src/components/p-tooltip/p-tooltip.scss?tag=p-tooltip&encapsulation=shadow","src/components/p-tooltip/p-tooltip.tsx"],"sourcesContent":[":host {\n    @import \"../common\";\n\n    display: inline-block;\n    .papier {\n        display: inline-block;\n\n        &>div {\n            display: inline;\n        }\n    }\n}","import { Component, Host, h, Prop } from '@stencil/core'\n\n@Component({\n    tag: 'p-tooltip',\n    styleUrl: 'p-tooltip.scss',\n    shadow: true,\n})\nexport class PTooltip {\n    @Prop()\n    title?: string\n    @Prop()\n    disabled?: boolean = false\n    @Prop()\n    left?: boolean = false\n    @Prop()\n    right?: boolean = false\n    @Prop()\n    bottom?: boolean = false\n    @Prop()\n    top?: boolean = false\n\n    render() {\n        return (\n            <Host>\n                <div class=\"papier\">\n                    <div\n                        popover-left={this.left && !this.disabled ? this.title : null}\n                        popover-right={this.right && !this.disabled ? this.title : null}\n                        popover-bottom={this.bottom && !this.disabled ? this.title : null}\n                        popover-top={this.top && !this.disabled ? this.title : null}\n                    >\n                        <slot />\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,WAAW,GAAG,smqFAAsmqF;;MCO7mqF,QAAQ,GAAA,MAAA;AALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AASI,QAAA,IAAQ,CAAA,QAAA,GAAa,KAAK;AAE1B,QAAA,IAAI,CAAA,IAAA,GAAa,KAAK;AAEtB,QAAA,IAAK,CAAA,KAAA,GAAa,KAAK;AAEvB,QAAA,IAAM,CAAA,MAAA,GAAa,KAAK;AAExB,QAAA,IAAG,CAAA,GAAA,GAAa,KAAK;AAkBxB;IAhBG,MAAM,GAAA;AACF,QAAA,QACI,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,QAAQ,EAAA,EACf,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,cAAA,EACkB,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,EAAA,eAAA,EAC9C,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,EAC/C,gBAAA,EAAA,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,EACpD,aAAA,EAAA,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,EAAA,EAE3D,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACN,CACJ,CACH;;;;;;;"}
+{"version":3,"file":"p-tooltip.entry.esm.js","sources":["src/components/p-tooltip/p-tooltip.scss?tag=p-tooltip&encapsulation=shadow","src/components/p-tooltip/p-tooltip.tsx"],"sourcesContent":[":host {\n    @import \"../common\";\n\n    display: inline-block;\n    .papier {\n        display: inline-block;\n\n        &>div {\n            display: inline;\n        }\n    }\n}","import { Component, Host, h, Prop } from '@stencil/core'\n\n@Component({\n    tag: 'p-tooltip',\n    styleUrl: 'p-tooltip.scss',\n    shadow: true,\n})\nexport class PTooltip {\n    @Prop()\n    title?: string\n    @Prop()\n    disabled?: boolean = false\n    @Prop()\n    left?: boolean = false\n    @Prop()\n    right?: boolean = false\n    @Prop()\n    bottom?: boolean = false\n    @Prop()\n    top?: boolean = false\n\n    render() {\n        return (\n            <Host>\n                <div class=\"papier\">\n                    <div\n                        popover-bottom={this.bottom && !this.disabled ? this.title : null}\n                        popover-left={this.left && !this.disabled ? this.title : null}\n                        popover-right={this.right && !this.disabled ? this.title : null}\n                        popover-top={this.top && !this.disabled ? this.title : null}\n                    >\n                        <slot />\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,WAAW,GAAG,smqFAAsmqF;;MCO7mqF,QAAQ,GAAA,MAAA;AALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AASI,QAAA,IAAQ,CAAA,QAAA,GAAa,KAAK;AAE1B,QAAA,IAAI,CAAA,IAAA,GAAa,KAAK;AAEtB,QAAA,IAAK,CAAA,KAAA,GAAa,KAAK;AAEvB,QAAA,IAAM,CAAA,MAAA,GAAa,KAAK;AAExB,QAAA,IAAG,CAAA,GAAA,GAAa,KAAK;AAkBxB;IAhBG,MAAM,GAAA;AACF,QAAA,QACI,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,QAAQ,EAAA,EACf,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,gBAAA,EACoB,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,EAAA,cAAA,EACnD,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,EAC9C,eAAA,EAAA,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,EAClD,aAAA,EAAA,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,EAAA,EAE3D,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACN,CACJ,CACH;;;;;;;"}

package/dist/papierjs/papierjs.esm.js

@@ -1,2 +1,2 @@
-import{p as e,b as a}from"./p-D_9dM54j.js";export{s as setNonce}from"./p-D_9dM54j.js";import{g as t}from"./p-DQuL1Twl.js";var p=()=>{const a=import.meta.url;const t={};if(a!==""){t.resourcesUrl=new URL(".",a).href}return e(t)};p().then((async e=>{await t();return a([["p-2644d8b6",[[0,"p-notification-preview",{notificationType:[32]}]]],["p-1d47b62e",[[1,"p-accordion",{title:[1],open:[1028]}]]],["p-19f51abf",[[1,"p-alert",{type:[1],closable:[4],dark:[4]}]]],["p-3aaa32f1",[[1,"p-badge",{type:[1],dark:[4]}]]],["p-76da6759",[[1,"p-breadcrumb",{dark:[4]}]]],["p-584a8668",[[1,"p-breadcrumb-item",{dark:[4],first:[4],link:[1]}]]],["p-d8bb3cb8",[[1,"p-card",{dark:[4],radius:[4],image:[1],hasHeader:[32],hasFooter:[32]}]]],["p-a20a405c",[[1,"p-icon",{icon:[1],size:[2],color:[1],svgContent:[32]}]]],["p-03eb7be1",[[1,"p-input-text",{placeholder:[1],value:[1025],required:[4],dark:[4],label:[1],disabled:[4],block:[4],error:[1]}]]],["p-1dec350d",[[4,"p-leaf",{dark:[4]}]]],["p-815a0e54",[[1,"p-modal",{isOpen:[32],open:[64],close:[64]}]]],["p-45a3871c",[[1,"p-progress-bar",{type:[1],value:[2],striped:[4],dark:[4],auto:[2],interval:[32]}]]],["p-289c322f",[[1,"p-slider",{value:[2],min:[2],max:[2],block:[4],dark:[4]}]]],["p-2695e679",[[1,"p-switch",{round:[4],square:[4],dark:[4],checked:[4]}]]],["p-f3289814",[[1,"p-switch-tile",{dark:[4],checked:[4],checkedBackground:[1,"checked-background"],uncheckedBackground:[1,"unchecked-background"]}]]],["p-56886e34",[[1,"p-tab",{title:[1],selected:[1028],dark:[4]}]]],["p-5e315f2f",[[1,"p-tabs",{dark:[4],tabs:[32],selectedTab:[32]}]]],["p-ea70ba16",[[1,"p-tooltip",{title:[1],disabled:[4],left:[4],right:[4],bottom:[4],top:[4]}]]],["p-60647bc6",[[1,"p-notification",{type:[1],text:[1],canclose:[4],timestamp:[1]}]]],["p-e34b583b",[[1,"p-spinner",{large:[4],color:[1],dark:[4]}]]],["p-1e6504ed",[[1,"p-button",{type:[1],outline:[4],large:[4],small:[4],block:[4],disabled:[4],dark:[4],loading:[4]}],[1,"p-notification-handler",{notifications:[32],pushNotification:[64]},[[0,"close","closeToastHandler"]]],[1,"p-dropdown",{dark:[4],preventSelected:[4,"prevent-selected"],value:[1025],placeholder:[1],open:[32],selectedValue:[32]},[[8,"click","detectOutsideClick"]]],[1,"p-dropdown-item",{value:[1],selected:[4],dark:[4]}]]]],e)}));
+import{p as e,b as a}from"./p-D_9dM54j.js";export{s as setNonce}from"./p-D_9dM54j.js";import{g as t}from"./p-DQuL1Twl.js";var p=()=>{const a=import.meta.url;const t={};if(a!==""){t.resourcesUrl=new URL(".",a).href}return e(t)};p().then((async e=>{await t();return a([["p-84f025d2",[[0,"p-notification-preview",{notificationType:[32]}]]],["p-fe48422b",[[1,"p-input-text",{placeholder:[1],icon:[1],value:[1025],required:[4],dark:[4],label:[1],disabled:[4],block:[4],error:[1]}]]],["p-c0b0d2e5",[[1,"p-navbar-item",{dark:[4],href:[1],target:[1],icon:[1]}]]],["p-f24c4b34",[[1,"p-accordion",{title:[1],open:[1028],dark:[4]}]]],["p-32a83d75",[[1,"p-alert",{type:[1],closable:[4],dark:[4]}]]],["p-7b5bdb17",[[1,"p-badge",{type:[1],dark:[4]}]]],["p-88d842c1",[[1,"p-breadcrumb",{dark:[4]}]]],["p-584a8668",[[1,"p-breadcrumb-item",{dark:[4],first:[4],link:[1]}]]],["p-7568d1fc",[[1,"p-card",{dark:[4],radius:[4],image:[1],hasHeader:[32],hasFooter:[32]}]]],["p-ee13e3f6",[[4,"p-leaf",{dark:[4]}]]],["p-36b16c41",[[1,"p-modal",{isOpen:[32],open:[64],close:[64]}]]],["p-3521cd61",[[1,"p-navbar",{split:[4],fixed:[4],dark:[4],rootLink:[1,"root-link"],rootTitle:[1,"root-title"]}]]],["p-c40d688c",[[1,"p-progress-bar",{type:[1],value:[2],striped:[4],dark:[4],auto:[2],interval:[32]}]]],["p-0669cc21",[[1,"p-slider",{value:[2],min:[2],max:[2],block:[4],dark:[4]}]]],["p-67844159",[[1,"p-switch",{round:[4],square:[4],dark:[4],checked:[4]}]]],["p-746d71e0",[[1,"p-switch-tile",{dark:[4],checked:[4],checkedBackground:[1,"checked-background"],uncheckedBackground:[1,"unchecked-background"]}]]],["p-fbafe809",[[1,"p-tab",{title:[1],selected:[1028],dark:[4]}]]],["p-5123b85c",[[1,"p-tabs",{dark:[4],tabs:[32],selectedTab:[32]}]]],["p-fb89dd1a",[[1,"p-tooltip",{title:[1],disabled:[4],left:[4],right:[4],bottom:[4],top:[4]}]]],["p-06665233",[[1,"p-icon",{icon:[1],size:[2],color:[1],svgContent:[32]}]]],["p-5b2a221d",[[1,"p-notification",{type:[1],text:[1],canclose:[4],timestamp:[1]}]]],["p-e66223a0",[[1,"p-spinner",{large:[4],color:[1],dark:[4]}]]],["p-a78f900c",[[1,"p-button",{type:[1],outline:[4],large:[4],small:[4],block:[4],disabled:[4],dark:[4],loading:[4]}],[1,"p-notification-handler",{notifications:[32],pushNotification:[64]},[[0,"close","closeToastHandler"]]],[1,"p-dropdown",{dark:[4],preventSelected:[4,"prevent-selected"],value:[1025],placeholder:[1],open:[32],selectedValue:[32]},[[8,"click","detectOutsideClick"]]],[1,"p-dropdown-item",{value:[1],selected:[4],dark:[4]}]]]],e)}));
 //# sourceMappingURL=papierjs.esm.js.map

package/dist/types/components/form/p-input-text/input-text.d.ts

@@ -1,6 +1,10 @@
 import { type EventEmitter } from '../../../stencil-public-runtime';
 export declare class PInputText {
     placeholder?: string;
+    /**
+     * Any icon allowed with p-icon can be used
+     */
+    icon?: string;
     value?: string;
     required?: boolean;
     dark?: boolean;

package/dist/types/components/navigation/p-navbar/p-navbar.d.ts

@@ -0,0 +1,16 @@
+export declare class PNavbar {
+    el: HTMLElement;
+    split: boolean;
+    fixed: boolean;
+    dark?: boolean;
+    rootLink: string;
+    rootTitle: string;
+    getClass(): {
+        border: boolean;
+        fixed: boolean;
+        'split-nav': boolean;
+        'is--dark': boolean;
+    };
+    componentDidLoad(): void;
+    render(): any;
+}

package/dist/types/components/navigation/p-navbar-item/p-navbar-item.d.ts

@@ -0,0 +1,12 @@
+export declare class PNavbarItem {
+    dark?: boolean;
+    href: string;
+    target?: string;
+    icon?: string;
+    getClass(): {
+        papier: boolean;
+        'with--icon': boolean;
+        'is--dark': boolean;
+    };
+    render(): any;
+}

package/dist/types/components/p-accordion/p-accordion.d.ts

@@ -4,5 +4,6 @@
 export declare class PAccordion {
     title: string;
     open: boolean;
+    dark?: boolean;
     render(): any;
 }

package/dist/types/components.d.ts

@@ -9,6 +9,10 @@ import { PushOptions } from "./components/notification/p-notification-handler/p-
 export { PushOptions } from "./components/notification/p-notification-handler/p-notification-handler";
 export namespace Components {
     interface PAccordion {
+        /**
+          * @default false
+         */
+        "dark"?: boolean;
         /**
           * @default false
          */
@@ -159,6 +163,10 @@ export namespace Components {
          */
         "disabled"?: boolean;
         "error"?: string;
+        /**
+          * Any icon allowed with p-icon can be used
+         */
+        "icon"?: string;
         "label"?: string;
         "placeholder"?: string;
         /**
@@ -183,6 +191,40 @@ export namespace Components {
         "close": () => Promise<void>;
         "open": () => Promise<void>;
     }
+    interface PNavbar {
+        /**
+          * @default false
+         */
+        "dark"?: boolean;
+        /**
+          * @default false
+         */
+        "fixed": boolean;
+        /**
+          * @default '/'
+         */
+        "rootLink": string;
+        /**
+          * @default ''
+         */
+        "rootTitle": string;
+        /**
+          * @default false
+         */
+        "split": boolean;
+    }
+    interface PNavbarItem {
+        /**
+          * @default false
+         */
+        "dark"?: boolean;
+        /**
+          * @default '/'
+         */
+        "href": string;
+        "icon"?: string;
+        "target"?: string;
+    }
     interface PNotification {
         /**
           * @default false
@@ -506,6 +548,18 @@ declare global {
         prototype: HTMLPModalElement;
         new (): HTMLPModalElement;
     };
+    interface HTMLPNavbarElement extends Components.PNavbar, HTMLStencilElement {
+    }
+    var HTMLPNavbarElement: {
+        prototype: HTMLPNavbarElement;
+        new (): HTMLPNavbarElement;
+    };
+    interface HTMLPNavbarItemElement extends Components.PNavbarItem, HTMLStencilElement {
+    }
+    var HTMLPNavbarItemElement: {
+        prototype: HTMLPNavbarItemElement;
+        new (): HTMLPNavbarItemElement;
+    };
     interface HTMLPNotificationElementEventMap {
         "close": string;
     }
@@ -630,6 +684,8 @@ declare global {
         "p-input-text": HTMLPInputTextElement;
         "p-leaf": HTMLPLeafElement;
         "p-modal": HTMLPModalElement;
+        "p-navbar": HTMLPNavbarElement;
+        "p-navbar-item": HTMLPNavbarItemElement;
         "p-notification": HTMLPNotificationElement;
         "p-notification-handler": HTMLPNotificationHandlerElement;
         "p-notification-preview": HTMLPNotificationPreviewElement;
@@ -645,6 +701,10 @@ declare global {
 }
 declare namespace LocalJSX {
     interface PAccordion {
+        /**
+          * @default false
+         */
+        "dark"?: boolean;
         /**
           * @default false
          */
@@ -798,6 +858,10 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         "error"?: string;
+        /**
+          * Any icon allowed with p-icon can be used
+         */
+        "icon"?: string;
         "label"?: string;
         "onChange"?: (event: PInputTextCustomEvent<string>) => void;
         "onInput"?: (event: PInputTextCustomEvent<string>) => void;
@@ -823,6 +887,40 @@ declare namespace LocalJSX {
     interface PModal {
         "onClose"?: (event: PModalCustomEvent<void>) => void;
     }
+    interface PNavbar {
+        /**
+          * @default false
+         */
+        "dark"?: boolean;
+        /**
+          * @default false
+         */
+        "fixed"?: boolean;
+        /**
+          * @default '/'
+         */
+        "rootLink"?: string;
+        /**
+          * @default ''
+         */
+        "rootTitle"?: string;
+        /**
+          * @default false
+         */
+        "split"?: boolean;
+    }
+    interface PNavbarItem {
+        /**
+          * @default false
+         */
+        "dark"?: boolean;
+        /**
+          * @default '/'
+         */
+        "href"?: string;
+        "icon"?: string;
+        "target"?: string;
+    }
     interface PNotification {
         /**
           * @default false
@@ -985,6 +1083,8 @@ declare namespace LocalJSX {
         "p-input-text": PInputText;
         "p-leaf": PLeaf;
         "p-modal": PModal;
+        "p-navbar": PNavbar;
+        "p-navbar-item": PNavbarItem;
         "p-notification": PNotification;
         "p-notification-handler": PNotificationHandler;
         "p-notification-preview": PNotificationPreview;
@@ -1021,6 +1121,8 @@ declare module "@stencil/core" {
              */
             "p-leaf": LocalJSX.PLeaf & JSXBase.HTMLAttributes<HTMLPLeafElement>;
             "p-modal": LocalJSX.PModal & JSXBase.HTMLAttributes<HTMLPModalElement>;
+            "p-navbar": LocalJSX.PNavbar & JSXBase.HTMLAttributes<HTMLPNavbarElement>;
+            "p-navbar-item": LocalJSX.PNavbarItem & JSXBase.HTMLAttributes<HTMLPNavbarItemElement>;
             "p-notification": LocalJSX.PNotification & JSXBase.HTMLAttributes<HTMLPNotificationElement>;
             "p-notification-handler": LocalJSX.PNotificationHandler & JSXBase.HTMLAttributes<HTMLPNotificationHandlerElement>;
             "p-notification-preview": LocalJSX.PNotificationPreview & JSXBase.HTMLAttributes<HTMLPNotificationPreviewElement>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amiceli/papierjs",
-  "version": "0.11.0",
+  "version": "0.13.0",
   "description": "Papercss web components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -40,37 +40,37 @@
     "loader/"
   ],
   "scripts": {
+    "build:all": "npm run build && npm run build:histoire",
+    "dev": "npx histoire dev",
     "build:icon": "node scripts/copy-svg.js",
-    "build": "npm run build:icon && stencil build",
+    "build": "npm run build:icon && stencil build --doc",
     "build:watch": "npm run build:icon && stencil build --watch",
+    "build:histoire": "npx histoire build",
     "start": "stencil build --dev --watch --serve",
     "test": "stencil test --spec --e2e",
     "test.watch": "stencil test --spec --e2e --watchAll",
     "generate": "stencil generate",
-    "storybook": "storybook dev -p 6006 --no-open",
-    "build-storybook": "storybook build",
-    "lint": "biome check ."
+    "lint": "biome check --write."
   },
   "overrides": {
     "@types/node": "*"
   },
   "devDependencies": {
-    "@biomejs/biome": "2.1.2",
-    "@commitlint/cli": "^19.8.1",
-    "@commitlint/config-conventional": "^19.8.1",
+    "@biomejs/biome": "2.3.14",
+    "@commitlint/cli": "^20.4.1",
+    "@commitlint/config-conventional": "^20.4.1",
+    "@histoire/plugin-vue": "^1.0.0-beta.1",
     "@stencil/core": "^4.26.0",
     "@stencil/sass": "^3.0.12",
-    "@storybook/addon-docs": "^9.0.17",
-    "@storybook/web-components-vite": "^9.0.17",
     "@types/jest": "^29.5.14",
     "@types/node": "^22.16.5",
+    "@vitejs/plugin-vue": "^6.0.4",
     "dotenv": "^16.4.7",
+    "histoire": "^1.0.0-beta.1",
     "jest": "^29.7.0",
     "jest-cli": "^29.7.0",
-    "lefthook": "^1.12.2",
-    "stencil-inline-svg": "^1.1.0",
-    "storybook": "^9.0.15",
-    "vite-plugin-live-reload": "^3.0.5"
+    "lefthook": "^2.1.0",
+    "stencil-inline-svg": "^1.1.0"
   },
   "optionalDependencies": {
     "puppeteer": "^24.2.1"
@@ -78,6 +78,7 @@
   "license": "MIT",
   "dependencies": {
     "feather-icons": "^4.29.2",
+    "markstream-vue": "^0.0.7-beta.8",
     "papercss": "^1.9.2",
     "pixelarticons": "^1.8.1"
   }

package/readme.md

@@ -60,12 +60,11 @@ To build project :
 
 ```bash
 npm install
-npm run build
-npm run build-storybook
+npm run build:all
 ```
 
-To run storybook : 
+To run histoire : 
 
 ```bash
-npm run storybook
+npm run dev
 ```

package/dist/collection/components/p-modal/stories/modal.preview.js

@@ -1,19 +0,0 @@
-export function previewModal() {
-    const alertObserver = new MutationObserver(() => {
-        const modal = document.querySelector('#open-modal')
-        const modalButton = document.querySelector('#open-modal-button')
-
-        if (modal && modalButton) {
-            modalButton.addEventListener('click', () => {
-                modal.open()
-            })
-
-            alertObserver.disconnect()
-        }
-    })
-
-    alertObserver.observe(document.body, {
-        childList: true,
-        subtree: true,
-    })
-}

package/dist/collection/components/p-progress-bar/stories/progress-bar.preview.js

@@ -1,23 +0,0 @@
-export function previewProgressbar() {
-    const inputObserver = new MutationObserver(() => {
-        const progress = document.querySelector('#animated-progress');
-        const progressBtn = document.querySelector('#animated-progress-button');
-        let value = 10;
-        if (progress && progressBtn) {
-            progress.setAttribute('value', `${value}`);
-            progressBtn.addEventListener('click', () => {
-                if (value === 100) {
-                    value = -10;
-                }
-                value += 10;
-                progress.setAttribute('value', `${value}`);
-            });
-            inputObserver.disconnect();
-        }
-    });
-    inputObserver.observe(document.body, {
-        childList: true,
-        subtree: true,
-    });
-}
-//# sourceMappingURL=progress-bar.preview.js.map

package/dist/collection/components/p-progress-bar/stories/progress-bar.preview.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"progress-bar.preview.js","sourceRoot":"","sources":["../../../../src/components/p-progress-bar/stories/progress-bar.preview.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,kBAAkB;IAC9B,MAAM,aAAa,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE;QAC5C,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAA;QAC7D,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,2BAA2B,CAAC,CAAA;QACvE,IAAI,KAAK,GAAG,EAAE,CAAA;QAEd,IAAI,QAAQ,IAAI,WAAW,EAAE,CAAC;YAC1B,QAAQ,CAAC,YAAY,CAAC,OAAO,EAAE,GAAG,KAAK,EAAE,CAAC,CAAA;YAC1C,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBACvC,IAAI,KAAK,KAAK,GAAG,EAAE,CAAC;oBAChB,KAAK,GAAG,CAAC,EAAE,CAAA;gBACf,CAAC;gBAED,KAAK,IAAI,EAAE,CAAA;gBACX,QAAQ,CAAC,YAAY,CAAC,OAAO,EAAE,GAAG,KAAK,EAAE,CAAC,CAAA;YAC9C,CAAC,CAAC,CAAA;YACF,aAAa,CAAC,UAAU,EAAE,CAAA;QAC9B,CAAC;IACL,CAAC,CAAC,CAAA;IAEF,aAAa,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,EAAE;QACjC,SAAS,EAAE,IAAI;QACf,OAAO,EAAE,IAAI;KAChB,CAAC,CAAA;AACN,CAAC","sourcesContent":["export function previewProgressbar() {\n    const inputObserver = new MutationObserver(() => {\n        const progress = document.querySelector('#animated-progress')\n        const progressBtn = document.querySelector('#animated-progress-button')\n        let value = 10\n\n        if (progress && progressBtn) {\n            progress.setAttribute('value', `${value}`)\n            progressBtn.addEventListener('click', () => {\n                if (value === 100) {\n                    value = -10\n                }\n\n                value += 10\n                progress.setAttribute('value', `${value}`)\n            })\n            inputObserver.disconnect()\n        }\n    })\n\n    inputObserver.observe(document.body, {\n        childList: true,\n        subtree: true,\n    })\n}\n"]}