@amiceli/papierjs 0.9.0 → 0.10.0

package/dist/collection/components/button/button.js

@@ -43,7 +43,7 @@ export class Button {
     }
     render() {
         const color = `var(--${this.type}${this.dark ? '-light' : ''})`;
-        return (h("div", { key: '306ec0e0b6c738d5949f2d011c18b83f815fb4c0', class: this.getParentClass() }, h("button", { key: 'e65756d405f737aca00e6791c0fb369a26c206c4', disabled: this.disabled, type: "button", class: this.getClass() }, !this.loading ? (h("slot", null)) : (h("p-spinner", { color: color, dark: this.dark })))));
+        return (h("div", { key: '306ec0e0b6c738d5949f2d011c18b83f815fb4c0', class: this.getParentClass() }, h("button", { key: '1a0332ab6d0d18aaf86286fccb10a72129c77832', disabled: this.disabled, type: "button", class: this.getClass() }, !this.loading ? h("slot", null) : h("p-spinner", { color: color, dark: this.dark }))));
     }
     static get is() { return "p-button"; }
     static get encapsulation() { return "shadow"; }
@@ -61,6 +61,7 @@ export class Button {
         return {
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "ButtonColor",
@@ -80,12 +81,12 @@ export class Button {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "type",
                 "reflect": false,
                 "defaultValue": "'primary'"
             },
             "outline": {
                 "type": "boolean",
+                "attribute": "outline",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -100,12 +101,12 @@ export class Button {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "outline",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "large": {
                 "type": "boolean",
+                "attribute": "large",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -120,12 +121,12 @@ export class Button {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "large",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "small": {
                 "type": "boolean",
+                "attribute": "small",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -140,12 +141,12 @@ export class Button {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "small",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "block": {
                 "type": "boolean",
+                "attribute": "block",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -160,12 +161,12 @@ export class Button {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "block",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -180,12 +181,12 @@ export class Button {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "dark": {
                 "type": "boolean",
+                "attribute": "dark",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -200,12 +201,12 @@ export class Button {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "dark",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "loading": {
                 "type": "boolean",
+                "attribute": "loading",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -220,7 +221,6 @@ export class Button {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "loading",
                 "reflect": false,
                 "defaultValue": "false"
             }

package/dist/collection/components/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAI3D;;GAEG;AAMH,MAAM,OAAO,MAAM;IALnB;QASI,SAAI,GAAiB,SAAS,CAAA;QAE9B,YAAO,GAAa,KAAK,CAAA;QAEzB,UAAK,GAAa,KAAK,CAAA;QAEvB,UAAK,GAAa,KAAK,CAAA;QAEvB,UAAK,GAAa,KAAK,CAAA;QAEvB,aAAQ,GAAa,KAAK,CAAA;QAE1B,SAAI,GAAa,KAAK,CAAA;QAEtB,YAAO,GAAa,KAAK,CAAA;KAwD5B;IAtDU,QAAQ;QACX,MAAM,KAAK,GAAG,CAAC,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAA;QACtE,IAAI,QAAQ,GAAG,EAAE,CAAA;QAEjB,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;YAC7B,QAAQ,GAAG,aAAa,CAAA;QAC5B,CAAC;aAAM,CAAC;YACJ,QAAQ,GAAG,OAAO,IAAI,CAAC,IAAI,EAAE,CAAA;QACjC,CAAC;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAChB,QAAQ,GAAG,UAAU,CAAA;QACzB,CAAC;QAED,QAAQ,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;QACzD,QAAQ,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;QACzD,QAAQ,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;QACzD,QAAQ,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;QAEzD,OAAO,QAAQ,CAAA;IACnB,CAAC;IAEM,cAAc;QACjB,IAAI,QAAQ,GAAG,QAAQ,CAAA;QAEvB,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,QAAQ,GAAG,GAAG,QAAQ,YAAY,CAAA;QACtC,CAAC;QAED,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACZ,QAAQ,GAAG,GAAG,QAAQ,WAAW,CAAA;QACrC,CAAC;QAED,OAAO,QAAQ,CAAA;IACnB,CAAC;IACD,MAAM;QACF,MAAM,KAAK,GAAG,SAAS,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,CAAA;QAE/D,OAAO,CACH,4DAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE;YAC7B,+DACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,IAErB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACb,eAAQ,CACX,CAAC,CAAC,CAAC,CACA,iBAAW,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CAC/C,CACI,CACP,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Prop, h } from '@stencil/core'\n\ntype ButtonColor = 'success' | 'secondary' | 'primary' | 'danger' | 'warning'\n\n/**\n * @slot - button content\n */\n@Component({\n    tag: 'p-button',\n    styleUrl: 'button.scss',\n    shadow: true,\n})\nexport class Button {\n    @Element()\n    el: Element\n    @Prop()\n    type?: ButtonColor = 'primary'\n    @Prop()\n    outline?: boolean = false\n    @Prop()\n    large?: boolean = false\n    @Prop()\n    small?: boolean = false\n    @Prop()\n    block?: boolean = false\n    @Prop()\n    disabled?: boolean = false\n    @Prop()\n    dark?: boolean = false\n    @Prop()\n    loading?: boolean = false\n\n    public getClass(): string {\n        const types = ['success', 'secondary', 'primary', 'danger', 'warning']\n        let cssClass = ''\n\n        if (!types.includes(this.type)) {\n            cssClass = 'btn-primary'\n        } else {\n            cssClass = `btn-${this.type}`\n        }\n\n        if (this.disabled) {\n            cssClass = 'disabled'\n        }\n\n        cssClass = `${cssClass}${this.outline ? '-outline' : ''}`\n        cssClass = `${cssClass}${this.large ? ' btn-large' : ''}`\n        cssClass = `${cssClass}${this.small ? ' btn-small' : ''}`\n        cssClass = `${cssClass}${this.block ? ' btn-block' : ''}`\n\n        return cssClass\n    }\n\n    public getParentClass() {\n        let cssClass = 'papier'\n\n        if (this.block) {\n            cssClass = `${cssClass} is--block`\n        }\n\n        if (this.dark) {\n            cssClass = `${cssClass} is--dark`\n        }\n\n        return cssClass\n    }\n    render() {\n        const color = `var(--${this.type}${this.dark ? '-light' : ''})`\n\n        return (\n            <div class={this.getParentClass()}>\n                <button\n                    disabled={this.disabled}\n                    type=\"button\"\n                    class={this.getClass()}\n                >\n                    {!this.loading ? (\n                        <slot />\n                    ) : (\n                        <p-spinner color={color} dark={this.dark} />\n                    )}\n                </button>\n            </div>\n        )\n    }\n}\n"]}
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAI3D;;GAEG;AAMH,MAAM,OAAO,MAAM;IALnB;QASI,SAAI,GAAiB,SAAS,CAAA;QAE9B,YAAO,GAAa,KAAK,CAAA;QAEzB,UAAK,GAAa,KAAK,CAAA;QAEvB,UAAK,GAAa,KAAK,CAAA;QAEvB,UAAK,GAAa,KAAK,CAAA;QAEvB,aAAQ,GAAa,KAAK,CAAA;QAE1B,SAAI,GAAa,KAAK,CAAA;QAEtB,YAAO,GAAa,KAAK,CAAA;KAgD5B;IA9CU,QAAQ;QACX,MAAM,KAAK,GAAG,CAAC,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAA;QACtE,IAAI,QAAQ,GAAG,EAAE,CAAA;QAEjB,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;YAC7B,QAAQ,GAAG,aAAa,CAAA;QAC5B,CAAC;aAAM,CAAC;YACJ,QAAQ,GAAG,OAAO,IAAI,CAAC,IAAI,EAAE,CAAA;QACjC,CAAC;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAChB,QAAQ,GAAG,UAAU,CAAA;QACzB,CAAC;QAED,QAAQ,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;QACzD,QAAQ,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;QACzD,QAAQ,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;QACzD,QAAQ,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;QAEzD,OAAO,QAAQ,CAAA;IACnB,CAAC;IAEM,cAAc;QACjB,IAAI,QAAQ,GAAG,QAAQ,CAAA;QAEvB,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,QAAQ,GAAG,GAAG,QAAQ,YAAY,CAAA;QACtC,CAAC;QAED,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACZ,QAAQ,GAAG,GAAG,QAAQ,WAAW,CAAA;QACrC,CAAC;QAED,OAAO,QAAQ,CAAA;IACnB,CAAC;IACD,MAAM;QACF,MAAM,KAAK,GAAG,SAAS,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,CAAA;QAE/D,OAAO,CACH,4DAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE;YAC7B,+DAAQ,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,IAChE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,eAAQ,CAAC,CAAC,CAAC,iBAAW,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CACnE,CACP,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Prop, h } from '@stencil/core'\n\ntype ButtonColor = 'success' | 'secondary' | 'primary' | 'danger' | 'warning'\n\n/**\n * @slot - button content\n */\n@Component({\n    tag: 'p-button',\n    styleUrl: 'button.scss',\n    shadow: true,\n})\nexport class Button {\n    @Element()\n    el: Element\n    @Prop()\n    type?: ButtonColor = 'primary'\n    @Prop()\n    outline?: boolean = false\n    @Prop()\n    large?: boolean = false\n    @Prop()\n    small?: boolean = false\n    @Prop()\n    block?: boolean = false\n    @Prop()\n    disabled?: boolean = false\n    @Prop()\n    dark?: boolean = false\n    @Prop()\n    loading?: boolean = false\n\n    public getClass(): string {\n        const types = ['success', 'secondary', 'primary', 'danger', 'warning']\n        let cssClass = ''\n\n        if (!types.includes(this.type)) {\n            cssClass = 'btn-primary'\n        } else {\n            cssClass = `btn-${this.type}`\n        }\n\n        if (this.disabled) {\n            cssClass = 'disabled'\n        }\n\n        cssClass = `${cssClass}${this.outline ? '-outline' : ''}`\n        cssClass = `${cssClass}${this.large ? ' btn-large' : ''}`\n        cssClass = `${cssClass}${this.small ? ' btn-small' : ''}`\n        cssClass = `${cssClass}${this.block ? ' btn-block' : ''}`\n\n        return cssClass\n    }\n\n    public getParentClass() {\n        let cssClass = 'papier'\n\n        if (this.block) {\n            cssClass = `${cssClass} is--block`\n        }\n\n        if (this.dark) {\n            cssClass = `${cssClass} is--dark`\n        }\n\n        return cssClass\n    }\n    render() {\n        const color = `var(--${this.type}${this.dark ? '-light' : ''})`\n\n        return (\n            <div class={this.getParentClass()}>\n                <button disabled={this.disabled} type=\"button\" class={this.getClass()}>\n                    {!this.loading ? <slot /> : <p-spinner color={color} dark={this.dark} />}\n                </button>\n            </div>\n        )\n    }\n}\n"]}

package/dist/collection/components/dropdown/dropdown/dropdown.js

@@ -1,4 +1,4 @@
-import { h, } from "@stencil/core";
+import { h } from "@stencil/core";
 import feather from "feather-icons";
 /**
  * @slot - slot for p-dropdown-item
@@ -63,9 +63,9 @@ export class Alert {
     render() {
         const selected = this.getSelectedValue();
         const arrowIcon = feather.icons['chevron-down'].toSvg();
-        return (h("div", { key: 'a58cb116140fba1936bdd1256e45c02dd14adf4b', class: this.getParentClass() }, h("div", { key: '3f73224c62767cc1af3547b5957c4570714c4857', class: "dropdown__header border border-primary", onClick: () => {
+        return (h("div", { key: '36a4b9cecc7bab53d95797a9cdda61f78d6a3554', class: this.getParentClass() }, h("div", { key: '69592dfe218c1b0a2b3b98c856d1f1308a513084', class: "dropdown__header border border-primary", onClick: () => {
                 this.open = !this.open;
-            } }, h("span", { key: '5cea9b8d3e440a539e29d8d75313446df89e52a9' }, selected), h("span", { key: '9ed09221e97a13894a3a81a6a4b0f3e0c268c155', class: "for--icon", innerHTML: arrowIcon })), h("div", { key: '6f79a026eddddd24b9e4973e732a25ea68a9be16', class: "dropdown__children" }, h("slot", { key: 'cb95fcdbe5ac7d6319473064280c9d63544b87dd' }))));
+            } }, h("span", { key: '7caa80ebc21da06acd228e1066d1a888cd961ac0' }, selected), h("span", { key: '23eedeb9969517271b320745dceab3cf6391df08', class: "for--icon", innerHTML: arrowIcon })), h("div", { key: 'd3cdd0ca9c1193071e4ad1a51115e4c2f0b04437', class: "dropdown__children" }, h("slot", { key: '29758029dd6cc442dd41d34e62e7ca36881ae5b8' }))));
     }
     static get is() { return "p-dropdown"; }
     static get encapsulation() { return "shadow"; }
@@ -83,6 +83,7 @@ export class Alert {
         return {
             "dark": {
                 "type": "boolean",
+                "attribute": "dark",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -97,12 +98,12 @@ export class Alert {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "dark",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "preventSelected": {
                 "type": "boolean",
+                "attribute": "prevent-selected",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -117,12 +118,12 @@ export class Alert {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "prevent-selected",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "value": {
                 "type": "string",
+                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -137,12 +138,12 @@ export class Alert {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "placeholder": {
                 "type": "string",
+                "attribute": "placeholder",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -157,7 +158,6 @@ export class Alert {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "placeholder",
                 "reflect": false
             }
         };

package/dist/collection/components/dropdown/dropdown/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown/dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Element,\n    Event,\n    type EventEmitter,\n    Listen,\n    Prop,\n    State,\n    h,\n} from '@stencil/core'\nimport feather from 'feather-icons'\n\n/**\n * @slot - slot for p-dropdown-item\n */\n@Component({\n    tag: 'p-dropdown',\n    styleUrl: 'dropdown.scss',\n    shadow: true,\n})\nexport class Alert {\n    @Prop()\n    dark?: boolean = false\n    /** Prevent dropdown self update selected value */\n    @Prop()\n    preventSelected?: boolean = false\n    /** Selected item value */\n    @Prop({ mutable: true })\n    value?: string = ''\n    @State()\n    open?: boolean = false\n    @Prop()\n    placeholder?: string\n    @State()\n    selectedValue?: string\n    @Element()\n    public el: HTMLElement\n\n    @Event({ eventName: 'select' })\n    public selectEvent: EventEmitter<string>\n\n    public getParentClass() {\n        return {\n            'papier dropdown': true,\n            'is--dark': this.dark,\n            'is--open': this.open,\n        }\n    }\n\n    @Listen('click', { target: 'window' })\n    public detectOutsideClick(ev) {\n        if (!this.el.contains(ev.target)) {\n            this.open = false\n        }\n    }\n\n    public resetItem() {\n        const items = Array.from(\n            this.el.getElementsByTagName('p-dropdown-item'),\n        )\n\n        for (const item of items) {\n            item.removeAttribute('selected')\n        }\n    }\n\n    public componentWillLoad() {\n        const items = Array.from(\n            this.el.getElementsByTagName('p-dropdown-item'),\n        )\n\n        for (const item of items) {\n            if (this.dark) {\n                item.setAttribute('dark', 'true')\n            }\n            if (item.selected === true) {\n                this.value = item.value\n            }\n            item.addEventListener('change', (e) => {\n                this.selectEvent.emit(e.detail)\n                this.open = !this.open\n\n                if (!this.preventSelected) {\n                    this.resetItem()\n                    item.setAttribute('selected', '')\n                    this.value = e.detail\n                }\n            })\n        }\n    }\n\n    public selectValue(value: string) {\n        this.selectEvent.emit(value)\n    }\n\n    public getSelectedValue(): string {\n        const list = Array.from(this.el.querySelectorAll('p-dropdown-item'))\n        const selected = list.find((item) => {\n            return item.value === this.value\n        })\n\n        return selected?.innerText || this.placeholder || ''\n    }\n\n    render() {\n        const selected = this.getSelectedValue()\n        const arrowIcon = feather.icons['chevron-down'].toSvg()\n\n        return (\n            <div class={this.getParentClass()}>\n                <div\n                    class=\"dropdown__header border border-primary\"\n                    onClick={() => {\n                        this.open = !this.open\n                    }}\n                >\n                    <span>{selected}</span>\n                    <span class=\"for--icon\" innerHTML={arrowIcon} />\n                </div>\n                <div class=\"dropdown__children\">\n                    <slot />\n                </div>\n            </div>\n        )\n    }\n}\n"]}
+{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown/dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, type EventEmitter, Listen, Prop, State, h } from '@stencil/core'\nimport feather from 'feather-icons'\n\n/**\n * @slot - slot for p-dropdown-item\n */\n@Component({\n    tag: 'p-dropdown',\n    styleUrl: 'dropdown.scss',\n    shadow: true,\n})\nexport class Alert {\n    @Prop()\n    dark?: boolean = false\n    /** Prevent dropdown self update selected value */\n    @Prop()\n    preventSelected?: boolean = false\n    /** Selected item value */\n    @Prop({ mutable: true })\n    value?: string = ''\n    @State()\n    open?: boolean = false\n    @Prop()\n    placeholder?: string\n    @State()\n    selectedValue?: string\n    @Element()\n    public el: HTMLElement\n\n    @Event({ eventName: 'select' })\n    public selectEvent: EventEmitter<string>\n\n    public getParentClass() {\n        return {\n            'papier dropdown': true,\n            'is--dark': this.dark,\n            'is--open': this.open,\n        }\n    }\n\n    @Listen('click', { target: 'window' })\n    public detectOutsideClick(ev) {\n        if (!this.el.contains(ev.target)) {\n            this.open = false\n        }\n    }\n\n    public resetItem() {\n        const items = Array.from(this.el.getElementsByTagName('p-dropdown-item'))\n\n        for (const item of items) {\n            item.removeAttribute('selected')\n        }\n    }\n\n    public componentWillLoad() {\n        const items = Array.from(this.el.getElementsByTagName('p-dropdown-item'))\n\n        for (const item of items) {\n            if (this.dark) {\n                item.setAttribute('dark', 'true')\n            }\n            if (item.selected === true) {\n                this.value = item.value\n            }\n            item.addEventListener('change', (e) => {\n                this.selectEvent.emit(e.detail)\n                this.open = !this.open\n\n                if (!this.preventSelected) {\n                    this.resetItem()\n                    item.setAttribute('selected', '')\n                    this.value = e.detail\n                }\n            })\n        }\n    }\n\n    public selectValue(value: string) {\n        this.selectEvent.emit(value)\n    }\n\n    public getSelectedValue(): string {\n        const list = Array.from(this.el.querySelectorAll('p-dropdown-item'))\n        const selected = list.find((item) => {\n            return item.value === this.value\n        })\n\n        return selected?.innerText || this.placeholder || ''\n    }\n\n    render() {\n        const selected = this.getSelectedValue()\n        const arrowIcon = feather.icons['chevron-down'].toSvg()\n\n        return (\n            <div class={this.getParentClass()}>\n                <div\n                    class=\"dropdown__header border border-primary\"\n                    onClick={() => {\n                        this.open = !this.open\n                    }}\n                >\n                    <span>{selected}</span>\n                    <span class=\"for--icon\" innerHTML={arrowIcon} />\n                </div>\n                <div class=\"dropdown__children\">\n                    <slot />\n                </div>\n            </div>\n        )\n    }\n}\n"]}

package/dist/collection/components/dropdown/dropdown/stories/dropdown-playground.stories.js

@@ -1,5 +1,3 @@
-import { Source } from '@storybook/blocks'
-
 export default {
     title: 'Components/Dropdown/Playground',
     argTypes: {

package/dist/collection/components/dropdown/dropdown/stories/dropdown.preview.js

@@ -18,7 +18,7 @@ export class Alert {
         (_a = this.el.querySelector('p-modal')) === null || _a === void 0 ? void 0 : _a.close();
     }
     render() {
-        return (h("div", { key: 'ebd30a904cdb71d290662840e8b4766d102ca708' }, h("p-modal", { key: 'ce72d861ec7ab4d7829979704ec29b05927e821b' }, h("p", { key: 'ec93f16257d10733a2c9b13cba777b5261ba5278' }, "You select ", h("b", { key: '440cfe0df3d00558d47e521f5fd4a41b3a5ee5bf' }, this.value)), h("br", { key: 'cd1944ff062010f7d231095320b87e36a1e14f69' }), h("p-button", { key: 'e4214b4ae538cd70099225ee0f63055994fa3458', type: "success", onClick: () => this.onValidate() }, "I validate"), "\u00A0", h("p-button", { key: '8c195065be017b3de36f28658b4c5b7da8a69a61', type: "danger", onClick: () => this.onClose() }, "No !")), h("p-dropdown", { key: 'a0403bb75fc0e08e52c7de0e42c40f420fde6022', placeholder: "Choose best framework", "prevent-selected": true, onSelect: (e) => this.showModal(e.detail), value: this.selectedValue }, h("p-dropdown-item", { key: '278d5915c55593db051e75ced6008b179ba1c4e6', value: "awesome", selected: this.selectedValue === 'awesome' }, "Vue"), h("p-dropdown-item", { key: '88673f26c5501295cf39925423c420715ed0fa96', value: "Stencil", selected: this.selectedValue === 'Stencil' }, "Stencil"), h("p-dropdown-item", { key: 'c730db6663ca8b266a83571222bfc89344ce5aaa', value: "Storybook", selected: this.selectedValue === 'Storybook' }, "Storybook"))));
+        return (h("div", { key: 'ebd30a904cdb71d290662840e8b4766d102ca708' }, h("p-modal", { key: 'ce72d861ec7ab4d7829979704ec29b05927e821b' }, h("p", { key: 'ec93f16257d10733a2c9b13cba777b5261ba5278' }, "You select ", h("b", { key: '440cfe0df3d00558d47e521f5fd4a41b3a5ee5bf' }, this.value)), h("br", { key: 'cd1944ff062010f7d231095320b87e36a1e14f69' }), h("p-button", { key: 'e4214b4ae538cd70099225ee0f63055994fa3458', type: "success", onClick: () => this.onValidate() }, "I validate"), "\u00A0", h("p-button", { key: '8c195065be017b3de36f28658b4c5b7da8a69a61', type: "danger", onClick: () => this.onClose() }, "No !")), h("p-dropdown", { key: 'a0403bb75fc0e08e52c7de0e42c40f420fde6022', placeholder: "Choose best framework", "prevent-selected": true, onSelect: (e) => this.showModal(e.detail), value: this.selectedValue }, h("p-dropdown-item", { key: 'f9ca500444e71ca5a74f1a2e24cf4b374a611d21', value: "awesome", selected: this.selectedValue === 'awesome' }, "Vue"), h("p-dropdown-item", { key: 'c76664ee455ccf7763d09f761a36873ad82876f6', value: "Stencil", selected: this.selectedValue === 'Stencil' }, "Stencil"), h("p-dropdown-item", { key: 'e8342727fbc6e0f8ab82b36e829e7d97e4bcaddb', value: "Storybook", selected: this.selectedValue === 'Storybook' }, "Storybook"))));
     }
     static get is() { return "p-dropdown-preview"; }
     static get states() {

package/dist/collection/components/dropdown/dropdown/stories/dropdown.preview.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.preview.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/dropdown/stories/dropdown.preview.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAK5D,MAAM,OAAO,KAAK;IAHlB;QAKI,UAAK,GAAW,EAAE,CAAA;QAElB,kBAAa,GAAW,EAAE,CAAA;KA8D7B;IA1DU,SAAS,CAAC,KAAa;;QAC1B,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,0CAAE,IAAI,EAAE,CAAA;QACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;IACtB,CAAC;IAEM,UAAU;QACb,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAA;QAC/B,IAAI,CAAC,OAAO,EAAE,CAAA;IAClB,CAAC;IAEM,OAAO;;QACV,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,0CAAE,KAAK,EAAE,CAAA;IAC7C,CAAC;IAED,MAAM;QACF,OAAO,CACH;YACI;gBACI;;oBACe,4DAAI,IAAI,CAAC,KAAK,CAAK,CAC9B;gBACJ,4DAAM;gBACN,iEAAU,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,iBAE9C;;gBAEX,iEAAU,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,WAE1C,CACL;YACV,mEACI,WAAW,EAAC,uBAAuB,4BAEnC,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,EACtD,KAAK,EAAE,IAAI,CAAC,aAAa;gBAEzB,wEACI,KAAK,EAAC,SAAS,EACf,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,SAAS,UAG5B;gBAClB,wEACI,KAAK,EAAC,SAAS,EACf,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,SAAS,cAG5B;gBAClB,wEACI,KAAK,EAAC,WAAW,EACjB,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,WAAW,gBAG9B,CACT,CACX,CACT,CAAA;IACL,CAAC;;;;;;;CACJ","sourcesContent":["import { Component, Element, State, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-dropdown-preview',\n})\nexport class Alert {\n    @State()\n    value: string = ''\n    @State()\n    selectedValue: string = ''\n    @Element()\n    public el: HTMLElement\n\n    public showModal(value: string) {\n        this.el.querySelector('p-modal')?.open()\n        this.value = value\n    }\n\n    public onValidate() {\n        this.selectedValue = this.value\n        this.onClose()\n    }\n\n    public onClose() {\n        this.el.querySelector('p-modal')?.close()\n    }\n\n    render() {\n        return (\n            <div>\n                <p-modal>\n                    <p>\n                        You select <b>{this.value}</b>\n                    </p>\n                    <br />\n                    <p-button type=\"success\" onClick={() => this.onValidate()}>\n                        I validate\n                    </p-button>\n                    &nbsp;\n                    <p-button type=\"danger\" onClick={() => this.onClose()}>\n                        No !\n                    </p-button>\n                </p-modal>\n                <p-dropdown\n                    placeholder=\"Choose best framework\"\n                    prevent-selected\n                    onSelect={(e: CustomEvent) => this.showModal(e.detail)}\n                    value={this.selectedValue}\n                >\n                    <p-dropdown-item\n                        value=\"awesome\"\n                        selected={this.selectedValue === 'awesome'}\n                    >\n                        Vue\n                    </p-dropdown-item>\n                    <p-dropdown-item\n                        value=\"Stencil\"\n                        selected={this.selectedValue === 'Stencil'}\n                    >\n                        Stencil\n                    </p-dropdown-item>\n                    <p-dropdown-item\n                        value=\"Storybook\"\n                        selected={this.selectedValue === 'Storybook'}\n                    >\n                        Storybook\n                    </p-dropdown-item>\n                </p-dropdown>\n            </div>\n        )\n    }\n}\n"]}
+{"version":3,"file":"dropdown.preview.js","sourceRoot":"","sources":["../../../../../src/components/dropdown/dropdown/stories/dropdown.preview.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAK5D,MAAM,OAAO,KAAK;IAHlB;QAKI,UAAK,GAAW,EAAE,CAAA;QAElB,kBAAa,GAAW,EAAE,CAAA;KAqD7B;IAjDU,SAAS,CAAC,KAAa;;QAC1B,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,0CAAE,IAAI,EAAE,CAAA;QACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;IACtB,CAAC;IAEM,UAAU;QACb,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAA;QAC/B,IAAI,CAAC,OAAO,EAAE,CAAA;IAClB,CAAC;IAEM,OAAO;;QACV,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,0CAAE,KAAK,EAAE,CAAA;IAC7C,CAAC;IAED,MAAM;QACF,OAAO,CACH;YACI;gBACI;;oBACe,4DAAI,IAAI,CAAC,KAAK,CAAK,CAC9B;gBACJ,4DAAM;gBACN,iEAAU,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,iBAE9C;;gBAEX,iEAAU,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,WAE1C,CACL;YACV,mEACI,WAAW,EAAC,uBAAuB,4BAEnC,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,EACtD,KAAK,EAAE,IAAI,CAAC,aAAa;gBAEzB,wEAAiB,KAAK,EAAC,SAAS,EAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,SAAS,UAEzD;gBAClB,wEAAiB,KAAK,EAAC,SAAS,EAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,SAAS,cAEzD;gBAClB,wEAAiB,KAAK,EAAC,WAAW,EAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,WAAW,gBAE7D,CACT,CACX,CACT,CAAA;IACL,CAAC;;;;;;;CACJ","sourcesContent":["import { Component, Element, State, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-dropdown-preview',\n})\nexport class Alert {\n    @State()\n    value: string = ''\n    @State()\n    selectedValue: string = ''\n    @Element()\n    public el: HTMLElement\n\n    public showModal(value: string) {\n        this.el.querySelector('p-modal')?.open()\n        this.value = value\n    }\n\n    public onValidate() {\n        this.selectedValue = this.value\n        this.onClose()\n    }\n\n    public onClose() {\n        this.el.querySelector('p-modal')?.close()\n    }\n\n    render() {\n        return (\n            <div>\n                <p-modal>\n                    <p>\n                        You select <b>{this.value}</b>\n                    </p>\n                    <br />\n                    <p-button type=\"success\" onClick={() => this.onValidate()}>\n                        I validate\n                    </p-button>\n                    &nbsp;\n                    <p-button type=\"danger\" onClick={() => this.onClose()}>\n                        No !\n                    </p-button>\n                </p-modal>\n                <p-dropdown\n                    placeholder=\"Choose best framework\"\n                    prevent-selected\n                    onSelect={(e: CustomEvent) => this.showModal(e.detail)}\n                    value={this.selectedValue}\n                >\n                    <p-dropdown-item value=\"awesome\" selected={this.selectedValue === 'awesome'}>\n                        Vue\n                    </p-dropdown-item>\n                    <p-dropdown-item value=\"Stencil\" selected={this.selectedValue === 'Stencil'}>\n                        Stencil\n                    </p-dropdown-item>\n                    <p-dropdown-item value=\"Storybook\" selected={this.selectedValue === 'Storybook'}>\n                        Storybook\n                    </p-dropdown-item>\n                </p-dropdown>\n            </div>\n        )\n    }\n}\n"]}

package/dist/collection/components/dropdown/dropdown-item/dropdown-item.js

@@ -35,6 +35,7 @@ export class DropdownItem {
         return {
             "value": {
                 "type": "string",
+                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -49,11 +50,11 @@ export class DropdownItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
                 "reflect": false
             },
             "selected": {
                 "type": "boolean",
+                "attribute": "selected",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -68,12 +69,12 @@ export class DropdownItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "selected",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "dark": {
                 "type": "boolean",
+                "attribute": "dark",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -88,7 +89,6 @@ export class DropdownItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "dark",
                 "reflect": false,
                 "defaultValue": "false"
             }

package/dist/collection/components/form/input-text/input-text.js

@@ -48,6 +48,7 @@ export class InputText {
         return {
             "placeholder": {
                 "type": "string",
+                "attribute": "placeholder",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -62,11 +63,11 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "placeholder",
                 "reflect": false
             },
             "value": {
                 "type": "string",
+                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -81,12 +82,12 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "required": {
                 "type": "boolean",
+                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -101,12 +102,12 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "required",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "dark": {
                 "type": "boolean",
+                "attribute": "dark",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -121,12 +122,12 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "dark",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "label": {
                 "type": "string",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -141,11 +142,11 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "label",
                 "reflect": false
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -160,12 +161,12 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "block": {
                 "type": "boolean",
+                "attribute": "block",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -180,12 +181,12 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "block",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "error": {
                 "type": "string",
+                "attribute": "error",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -200,7 +201,6 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "error",
                 "reflect": false
             }
         };

package/dist/collection/components/form/slider/sliders.js

@@ -1,4 +1,4 @@
-import { Host, h, } from "@stencil/core";
+import { Host, h } from "@stencil/core";
 export class PSliders {
     constructor() {
         this.value = 0;
@@ -10,11 +10,11 @@ export class PSliders {
         this.changeEvent.emit(Number.parseInt(e.target.value));
     }
     render() {
-        return (h(Host, { key: 'd781d4bbf5506a5ca6c032e47a19f85e7410834e' }, h("div", { key: 'ea47478f383250c94cb89c76850736315c61c916', class: {
+        return (h(Host, { key: '09a2c28ac3410e46edf5362e39b4c10fc2b9d298' }, h("div", { key: '1b9b4e68adf85643c11f4d40b09c0fd44ad5e9b6', class: {
                 papier: true,
                 'is--block': this.block,
                 'is--dark': this.dark,
-            } }, h("div", { key: '042736e16ee21d0cec0f9e5f2aba79bc792f05e1', class: "form-group" }, h("input", { key: '826d1670c732285d12becb6f0a1aa42f1c67bb9e', class: "input-block", type: "range", min: this.min, max: this.max, value: this.value, onInput: (e) => {
+            } }, h("div", { key: '47202952c171b60463b1d7a07637f595f3bf4023', class: "form-group" }, h("input", { key: '23b4f605c72513b24c63ee4e3fe1a5d47d76f9f6', class: "input-block", type: "range", min: this.min, max: this.max, value: this.value, onInput: (e) => {
                 this.onInput(e);
             } })))));
     }
@@ -34,6 +34,7 @@ export class PSliders {
         return {
             "value": {
                 "type": "number",
+                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -48,12 +49,12 @@ export class PSliders {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
                 "reflect": false,
                 "defaultValue": "0"
             },
             "min": {
                 "type": "number",
+                "attribute": "min",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -68,12 +69,12 @@ export class PSliders {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "min",
                 "reflect": false,
                 "defaultValue": "0"
             },
             "max": {
                 "type": "number",
+                "attribute": "max",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -88,11 +89,11 @@ export class PSliders {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "max",
                 "reflect": false
             },
             "block": {
                 "type": "boolean",
+                "attribute": "block",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -107,12 +108,12 @@ export class PSliders {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "block",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "dark": {
                 "type": "boolean",
+                "attribute": "dark",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -127,7 +128,6 @@ export class PSliders {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "dark",
                 "reflect": false,
                 "defaultValue": "false"
             }

package/dist/collection/components/form/slider/sliders.js.map

@@ -1 +1 @@
-{"version":3,"file":"sliders.js","sourceRoot":"","sources":["../../../../src/components/form/slider/sliders.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,SAAS,EACT,KAAK,EAEL,IAAI,EACJ,IAAI,EACJ,CAAC,GACJ,MAAM,eAAe,CAAA;AAOtB,MAAM,OAAO,QAAQ;IALrB;QAOI,UAAK,GAAY,CAAC,CAAA;QAElB,QAAG,GAAY,CAAC,CAAA;QAIhB,UAAK,GAAa,KAAK,CAAA;QAEvB,SAAI,GAAa,KAAK,CAAA;KAqCzB;IAhCU,OAAO,CAAC,CAAQ;QACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CACjB,MAAM,CAAC,QAAQ,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CACxD,CAAA;IACL,CAAC;IAED,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DACI,KAAK,EAAE;oBACH,MAAM,EAAE,IAAI;oBACZ,WAAW,EAAE,IAAI,CAAC,KAAK;oBACvB,UAAU,EAAE,IAAI,CAAC,IAAI;iBACxB;gBAED,4DAAK,KAAK,EAAC,YAAY;oBACnB,8DACI,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;4BACX,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAA;wBACnB,CAAC,GACH,CACA,CACJ,CACH,CACV,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import {\n    Component,\n    Event,\n    type EventEmitter,\n    Host,\n    Prop,\n    h,\n} from '@stencil/core'\n\n@Component({\n    tag: 'p-slider',\n    styleUrl: 'slider.scss',\n    shadow: true,\n})\nexport class PSliders {\n    @Prop()\n    value?: number = 0\n    @Prop()\n    min?: number = 0\n    @Prop()\n    max?: number\n    @Prop()\n    block?: boolean = false\n    @Prop()\n    dark?: boolean = false\n\n    @Event({ eventName: 'change' })\n    public changeEvent: EventEmitter<number>\n\n    public onInput(e: Event) {\n        this.changeEvent.emit(\n            Number.parseInt((e.target as HTMLInputElement).value),\n        )\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        papier: true,\n                        'is--block': this.block,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <div class=\"form-group\">\n                        <input\n                            class=\"input-block\"\n                            type=\"range\"\n                            min={this.min}\n                            max={this.max}\n                            value={this.value}\n                            onInput={(e) => {\n                                this.onInput(e)\n                            }}\n                        />\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"]}
+{"version":3,"file":"sliders.js","sourceRoot":"","sources":["../../../../src/components/form/slider/sliders.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAqB,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAOlF,MAAM,OAAO,QAAQ;IALrB;QAOI,UAAK,GAAY,CAAC,CAAA;QAElB,QAAG,GAAY,CAAC,CAAA;QAIhB,UAAK,GAAa,KAAK,CAAA;QAEvB,SAAI,GAAa,KAAK,CAAA;KAmCzB;IA9BU,OAAO,CAAC,CAAQ;QACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC,CAAA;IAChF,CAAC;IAED,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DACI,KAAK,EAAE;oBACH,MAAM,EAAE,IAAI;oBACZ,WAAW,EAAE,IAAI,CAAC,KAAK;oBACvB,UAAU,EAAE,IAAI,CAAC,IAAI;iBACxB;gBAED,4DAAK,KAAK,EAAC,YAAY;oBACnB,8DACI,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;4BACX,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAA;wBACnB,CAAC,GACH,CACA,CACJ,CACH,CACV,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Event, type EventEmitter, Host, Prop, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-slider',\n    styleUrl: 'slider.scss',\n    shadow: true,\n})\nexport class PSliders {\n    @Prop()\n    value?: number = 0\n    @Prop()\n    min?: number = 0\n    @Prop()\n    max?: number\n    @Prop()\n    block?: boolean = false\n    @Prop()\n    dark?: boolean = false\n\n    @Event({ eventName: 'change' })\n    public changeEvent: EventEmitter<number>\n\n    public onInput(e: Event) {\n        this.changeEvent.emit(Number.parseInt((e.target as HTMLInputElement).value))\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        papier: true,\n                        'is--block': this.block,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <div class=\"form-group\">\n                        <input\n                            class=\"input-block\"\n                            type=\"range\"\n                            min={this.min}\n                            max={this.max}\n                            value={this.value}\n                            onInput={(e) => {\n                                this.onInput(e)\n                            }}\n                        />\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"]}

package/dist/collection/components/form/switch/switch.js

@@ -1,4 +1,4 @@
-import { Host, h, } from "@stencil/core";
+import { Host, h } from "@stencil/core";
 export class PSwitch {
     constructor() {
         /** define switch style */
@@ -12,13 +12,13 @@ export class PSwitch {
         this.changeEvent.emit(e.target.checked);
     }
     render() {
-        return (h(Host, { key: 'dc34b7bcd066f56069cff699bbd6f772c321fda4' }, h("div", { key: '60dad8de3b96b83993397b9e3f461e8927404a5e', class: {
+        return (h(Host, { key: 'b103399375704056e1f5bf2ec60c64d4ca1b4e88' }, h("div", { key: 'd112849b4865b3d5ad9bece265b084843cc97641', class: {
                 papier: true,
                 'is--dark': this.dark,
-            } }, h("div", { key: '50b4d74c78067fc022637aa3cd89358b007a5931', class: "form-group" }, h("label", { key: 'acda7120df26268b1f2a1ee37074a88a6726f240', class: {
+            } }, h("div", { key: '17a829da738787a824765fb204b5a58da8d1aedf', class: "form-group" }, h("label", { key: '92bdae815d40e3526d79e48d9ce21831cced55fb', class: {
                 'paper-switch': !this.square,
                 'paper-switch-2': this.square,
-            } }, h("input", { key: '7f1d80e40ab826c476d0e69427bd0343ceed85ee', id: "paperSwitch4", name: "paperSwitch4", type: "checkbox", checked: this.checked, onInput: (e) => this.onInput(e) }), h("span", { key: 'c1d59ba857f9a4f8246707ad43909f7b266b2cda', class: {
+            } }, h("input", { key: '2fcd7987f00f58587ba85c4e377e4ced5a8db6a2', id: "paperSwitch4", name: "paperSwitch4", type: "checkbox", checked: this.checked, onInput: (e) => this.onInput(e) }), h("span", { key: '5a22bd18bc532e673a42c08768d2ea3cfb8e7686', class: {
                 round: this.round,
                 'paper-switch-slider': true,
             } }))))));
@@ -39,6 +39,7 @@ export class PSwitch {
         return {
             "round": {
                 "type": "boolean",
+                "attribute": "round",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -53,12 +54,12 @@ export class PSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "round",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "square": {
                 "type": "boolean",
+                "attribute": "square",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -73,12 +74,12 @@ export class PSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "square",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "dark": {
                 "type": "boolean",
+                "attribute": "dark",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -93,12 +94,12 @@ export class PSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "dark",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "checked": {
                 "type": "boolean",
+                "attribute": "checked",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -113,7 +114,6 @@ export class PSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "checked",
                 "reflect": false,
                 "defaultValue": "false"
             }