@amiceli/papierjs 0.6.0 → 0.8.0

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

@@ -14,10 +14,10 @@ export class DropdownItem {
         this.changeEvent.emit(this.value);
     }
     render() {
-        return (h("div", { key: 'ebeadf0541037fe8ac3968b97135b54d8d2ffff3', class: this.getParentClass(), onClick: () => this.sendClick() }, h("div", { key: 'f9dc47abca23a7ff49024dc97636dcae2064849f', class: {
+        return (h("div", { key: 'a140fa5e96379d94c3193405a35c2e5e814a1dad', class: this.getParentClass(), onClick: () => this.sendClick() }, h("div", { key: '92098283fd6d143901d82750a652f81d3b94d522', class: {
                 'background-success': this.selected,
                 'border border-primary': true,
-            } }, h("slot", { key: 'eaaa781bf0d311891c32d5884fc12dafab40f2be' }))));
+            } }, h("slot", { key: 'c68ee3b98574c31dcc9d9fbd6fa133cf9961d439' }))));
     }
     static get is() { return "p-dropdown-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -3221,6 +3221,9 @@
 :host label {
   color: var(--primary);
 }
+:host input + p {
+  margin-top: 0;
+}
 :host .is--block {
   display: block;
   width: 100%;

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

@@ -6,7 +6,6 @@ export class InputText {
         this.dark = false;
         this.disabled = false;
         this.block = false;
-        this.hasError = false;
     }
     getParentClass() {
         let cssClass = 'papier form-group';
@@ -16,16 +15,22 @@ export class InputText {
         if (this.block) {
             cssClass = `${cssClass} is--block`;
         }
-        if (this.hasError) {
+        if (this.error) {
             cssClass = `${cssClass} has--error`;
         }
         return cssClass;
     }
-    onChange(e) {
-        this.changeEvent.emit(e.target.value);
+    onInput(ev) {
+        this.value = ev.target && ev.target.value;
+        this.inputEvent.emit(this.value);
+    }
+    onChange() {
+        this.changeEvent.emit(this.value);
     }
     render() {
-        return (h("div", { key: 'ae4ed1fa9ff2ca7cdfc71356d3fded00971cec78', class: this.getParentClass() }, this.label && (h("label", { key: '74894b07e5734e0ce3c4d3315d299b329602e061', htmlFor: "paperInputs1" }, this.label, this.required ? '*' : '')), h("input", { key: 'a16e8eb7604842688984e2f3f6f80a3052069560', type: "text", placeholder: this.placeholder, id: "paperInputs1", disabled: this.disabled, value: this.value, onChange: (e) => this.onChange(e) })));
+        return (h("div", { key: 'a26c649d0f65e30583c1477f9562af22abbc9106', class: this.getParentClass() }, this.label && (h("label", { key: '0668b10bcd2895cc4bd65ebbcd0d5819e3bfe135', htmlFor: "paperInputs1" }, this.label, this.required ? '*' : '')), h("input", { key: 'c5e11c2f5a1a88ef04b430736e2bb3c58396d7cd', type: "text", placeholder: this.placeholder, id: "paperInputs1", disabled: this.disabled, onInput: (e) => {
+                this.onInput(e);
+            }, value: this.value, onChange: () => this.onChange() }), this.error && h("p", { key: '1e282386e337e13c7d9d626d0fb40525107603dc', class: "text-danger" }, this.error)));
     }
     static get is() { return "p-input-text"; }
     static get encapsulation() { return "shadow"; }
@@ -62,7 +67,7 @@ export class InputText {
             },
             "value": {
                 "type": "string",
-                "mutable": false,
+                "mutable": true,
                 "complexType": {
                     "original": "string",
                     "resolved": "string",
@@ -179,12 +184,12 @@ export class InputText {
                 "reflect": false,
                 "defaultValue": "false"
             },
-            "hasError": {
-                "type": "boolean",
+            "error": {
+                "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
+                    "original": "string",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
@@ -195,9 +200,8 @@ export class InputText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "has-error",
-                "reflect": false,
-                "defaultValue": "false"
+                "attribute": "error",
+                "reflect": false
             }
         };
     }
@@ -217,6 +221,21 @@ export class InputText {
                     "resolved": "string",
                     "references": {}
                 }
+            }, {
+                "method": "inputEvent",
+                "name": "input",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
             }];
     }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"input-text.js","sourceRoot":"","sources":["../../../../src/components/form/input-text/input-text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAqB,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAO5E,MAAM,OAAO,SAAS;IALtB;QASI,UAAK,GAAY,EAAE,CAAA;QAEnB,aAAQ,GAAa,KAAK,CAAA;QAE1B,SAAI,GAAa,KAAK,CAAA;QAItB,aAAQ,GAAa,KAAK,CAAA;QAE1B,UAAK,GAAa,KAAK,CAAA;QAEvB,aAAQ,GAAa,KAAK,CAAA;KA6C7B;IAxCU,cAAc;QACjB,IAAI,QAAQ,GAAG,mBAAmB,CAAA;QAElC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACZ,QAAQ,GAAG,GAAG,QAAQ,WAAW,CAAA;QACrC,CAAC;QACD,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,QAAQ,GAAG,GAAG,QAAQ,YAAY,CAAA;QACtC,CAAC;QACD,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAChB,QAAQ,GAAG,GAAG,QAAQ,aAAa,CAAA;QACvC,CAAC;QAED,OAAO,QAAQ,CAAA;IACnB,CAAC;IAEM,QAAQ,CAAC,CAAQ;QACpB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAA;IAC/D,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE;YAC5B,IAAI,CAAC,KAAK,IAAI,CACX,8DAAO,OAAO,EAAC,cAAc;gBACxB,IAAI,CAAC,KAAK;gBACV,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CACrB,CACX;YACD,8DACI,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,EAAE,EAAC,cAAc,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,GACnC,CACA,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Event, type EventEmitter, Prop, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-input-text',\n    styleUrl: 'input-text.scss',\n    shadow: true,\n})\nexport class InputText {\n    @Prop()\n    placeholder?: string\n    @Prop()\n    value?: string = ''\n    @Prop()\n    required?: boolean = false\n    @Prop()\n    dark?: boolean = false\n    @Prop()\n    label?: string\n    @Prop()\n    disabled?: boolean = false\n    @Prop()\n    block?: boolean = false\n    @Prop()\n    hasError?: boolean = false\n\n    @Event({ eventName: 'change' })\n    public changeEvent: EventEmitter<string>\n\n    public getParentClass() {\n        let cssClass = 'papier form-group'\n\n        if (this.dark) {\n            cssClass = `${cssClass} is--dark`\n        }\n        if (this.block) {\n            cssClass = `${cssClass} is--block`\n        }\n        if (this.hasError) {\n            cssClass = `${cssClass} has--error`\n        }\n\n        return cssClass\n    }\n\n    public onChange(e: Event) {\n        this.changeEvent.emit((e.target as HTMLInputElement).value)\n    }\n\n    render() {\n        return (\n            <div class={this.getParentClass()}>\n                {this.label && (\n                    <label htmlFor=\"paperInputs1\">\n                        {this.label}\n                        {this.required ? '*' : ''}\n                    </label>\n                )}\n                <input\n                    type=\"text\"\n                    placeholder={this.placeholder}\n                    id=\"paperInputs1\"\n                    disabled={this.disabled}\n                    value={this.value}\n                    onChange={(e) => this.onChange(e)}\n                />\n            </div>\n        )\n    }\n}\n"]}
+{"version":3,"file":"input-text.js","sourceRoot":"","sources":["../../../../src/components/form/input-text/input-text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAqB,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAO5E,MAAM,OAAO,SAAS;IALtB;QAUI,UAAK,GAAY,EAAE,CAAA;QAGnB,aAAQ,GAAa,KAAK,CAAA;QAG1B,SAAI,GAAa,KAAK,CAAA;QAMtB,aAAQ,GAAa,KAAK,CAAA;QAG1B,UAAK,GAAa,KAAK,CAAA;KA6D1B;IAlDU,cAAc;QACjB,IAAI,QAAQ,GAAG,mBAAmB,CAAA;QAElC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACZ,QAAQ,GAAG,GAAG,QAAQ,WAAW,CAAA;QACrC,CAAC;QACD,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,QAAQ,GAAG,GAAG,QAAQ,YAAY,CAAA;QACtC,CAAC;QACD,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,QAAQ,GAAG,GAAG,QAAQ,aAAa,CAAA;QACvC,CAAC;QAED,OAAO,QAAQ,CAAA;IACnB,CAAC;IAEM,OAAO,CAAC,EAAS;QACpB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,MAAM,IAAK,EAAE,CAAC,MAA2B,CAAC,KAAK,CAAA;QAE/D,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IACpC,CAAC;IAEM,QAAQ;QACX,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IACrC,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE;YAC5B,IAAI,CAAC,KAAK,IAAI,CACX,8DAAO,OAAO,EAAC,cAAc;gBACxB,IAAI,CAAC,KAAK;gBACV,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CACrB,CACX;YACD,8DACI,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,EAAE,EAAC,cAAc,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACX,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAA;gBACnB,CAAC,EACD,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,GACjC;YACD,IAAI,CAAC,KAAK,IAAI,0DAAG,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,KAAK,CAAK,CACpD,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Event, type EventEmitter, Prop, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-input-text',\n    styleUrl: 'input-text.scss',\n    shadow: true,\n})\nexport class InputText {\n    @Prop()\n    placeholder?: string\n\n    @Prop({ mutable: true })\n    value?: string = ''\n\n    @Prop()\n    required?: boolean = false\n\n    @Prop()\n    dark?: boolean = false\n\n    @Prop()\n    label?: string\n\n    @Prop()\n    disabled?: boolean = false\n\n    @Prop()\n    block?: boolean = false\n\n    @Prop()\n    error?: string\n\n    @Event({ eventName: 'change' })\n    public changeEvent: EventEmitter<string>\n\n    @Event({ eventName: 'input' })\n    public inputEvent: EventEmitter<string>\n\n    public getParentClass() {\n        let cssClass = 'papier form-group'\n\n        if (this.dark) {\n            cssClass = `${cssClass} is--dark`\n        }\n        if (this.block) {\n            cssClass = `${cssClass} is--block`\n        }\n        if (this.error) {\n            cssClass = `${cssClass} has--error`\n        }\n\n        return cssClass\n    }\n\n    public onInput(ev: Event) {\n        this.value = ev.target && (ev.target as HTMLInputElement).value\n\n        this.inputEvent.emit(this.value)\n    }\n\n    public onChange() {\n        this.changeEvent.emit(this.value)\n    }\n\n    render() {\n        return (\n            <div class={this.getParentClass()}>\n                {this.label && (\n                    <label htmlFor=\"paperInputs1\">\n                        {this.label}\n                        {this.required ? '*' : ''}\n                    </label>\n                )}\n                <input\n                    type=\"text\"\n                    placeholder={this.placeholder}\n                    id=\"paperInputs1\"\n                    disabled={this.disabled}\n                    onInput={(e) => {\n                        this.onInput(e)\n                    }}\n                    value={this.value}\n                    onChange={() => this.onChange()}\n                />\n                {this.error && <p class=\"text-danger\">{this.error}</p>}\n            </div>\n        )\n    }\n}\n"]}

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

@@ -10,11 +10,11 @@ export class PSliders {
         this.changeEvent.emit(Number.parseInt(e.target.value));
     }
     render() {
-        return (h(Host, { key: '53a474f15345a79aa1835998caece0f07e47725e' }, h("div", { key: 'd75f9483b2593d686b92a30fdbfc652360c1996d', class: {
+        return (h(Host, { key: '8d902052bbc89b3d74c306cd2fa5eeb54ac38757' }, h("div", { key: 'ab80fa0a236ff9baa8ecfee9bf658951c42e8e6f', class: {
                 papier: true,
                 'is--block': this.block,
                 'is--dark': this.dark,
-            } }, h("div", { key: '5d7fe2af8458cfd0ae3831d32e85e62bb602f220', class: "form-group" }, h("input", { key: 'bf1230a190b68df8fe776129f82263c284ef6785', class: "input-block", type: "range", min: this.min, max: this.max, value: this.value, onInput: (e) => {
+            } }, h("div", { key: 'bd3d614e3262ff88c01da42cbcd914b27f91b23e', class: "form-group" }, h("input", { key: '084338b3c6e48d12a5b766a182260d6d634029c8', class: "input-block", type: "range", min: this.min, max: this.max, value: this.value, onInput: (e) => {
                 this.onInput(e);
             } })))));
     }

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

@@ -12,13 +12,13 @@ export class PSwitch {
         this.changeEvent.emit(e.target.checked);
     }
     render() {
-        return (h(Host, { key: '5e934e029d1701ce1f128a61b0cbff9bca05737f' }, h("div", { key: 'f6fadf8f01d3a7b6410fd6658452bc941bf93502', class: {
+        return (h(Host, { key: '8fd7f8e681c3e0768a0999510f231ca4d521acff' }, h("div", { key: 'd71e1af2cd6c8e71c0b4d3755bcb4f35ce9df353', class: {
                 papier: true,
                 'is--dark': this.dark,
-            } }, h("div", { key: 'd22ced45ef921d7c83fbbcc5338e9e773cb3b86e', class: "form-group" }, h("label", { key: '07d5d86432db997ba0ddfd92090136c4f638c7d6', class: {
+            } }, h("div", { key: '18f49f02f40b636693547a95eeff6938a709be0c', class: "form-group" }, h("label", { key: '79f4805766e530d5cc39c98f6dbd5f9412b7c613', class: {
                 'paper-switch': !this.square,
                 'paper-switch-2': this.square,
-            } }, h("input", { key: '25580312a2fabb02d77464ebda4425cc1a9f55dc', id: "paperSwitch4", name: "paperSwitch4", type: "checkbox", checked: this.checked, onInput: (e) => this.onInput(e) }), h("span", { key: 'caef2131bf0ea9c503fde6c12641f2aee48d8538', class: {
+            } }, h("input", { key: 'be721049a47d6dc680155108c04ac1f70fa6d52c', id: "paperSwitch4", name: "paperSwitch4", type: "checkbox", checked: this.checked, onInput: (e) => this.onInput(e) }), h("span", { key: '2e5903946a31b452fe4eeac232d4107c62660d2d', class: {
                 round: this.round,
                 'paper-switch-slider': true,
             } }))))));

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

@@ -30,10 +30,10 @@ export class SwitchTile {
         return cssClass;
     }
     render() {
-        return (h(Host, { key: 'efeab455155276ced3a0b89ae43b1d7ec4c1d783' }, h("div", { key: '38b83270a3ee06468d8272dc1aa773a6fe853b9a', class: {
+        return (h(Host, { key: '9d9062a1f24319bb57c20c6b2674e92ed2815e62' }, h("div", { key: '1890096efba4995c6c6257c387f2ce50b69c1063', class: {
                 papier: true,
                 'is--dark': this.dark,
-            } }, h("div", { key: 'a06f4d0185834327907f9c2ab8778f6515ca6f26', class: "form-group" }, h("label", { key: 'f11e9ade12c46a664e50bc8aa8e43704cc95c665', htmlFor: "paperSwitch1", class: "paper-switch-tile" }, h("input", { key: '1184431568f45615294474ed3b7a5df52a6fa444', id: "paperSwitch1", name: "paperSwitch1", type: "checkbox", checked: this.checked }), h("div", { key: '71af531e81e4f314eec261201d435e0e4b78ab3e', class: "paper-switch-tile-card border" }, h("div", { key: '26b4ef7394b67f69d06f55a4cbae5da6479da43c', class: this.getFrontCardClass() }, h("slot", { key: '5e40ec51a5ba802e2f89ae6572e831c98865c785', name: "unchecked-text" })), h("div", { key: '13a777f47a6a84a908da341851c2d0a963f88099', class: this.getBackCardClass() }, h("slot", { key: 'dda24c30da6b84199d31edc1d61bc7e686209a2e', name: "checked-text" }))))))));
+            } }, h("div", { key: '055c9d96056a5a941c57734a3df9a8bf9005c24f', class: "form-group" }, h("label", { key: 'f445c8811e5b8cdce2d58d9f2561a49dd5bcce2a', htmlFor: "paperSwitch1", class: "paper-switch-tile" }, h("input", { key: '1105ac86869391fae18876b531ca7a8002367b75', id: "paperSwitch1", name: "paperSwitch1", type: "checkbox", checked: this.checked }), h("div", { key: '6cdcafa28573ddedb410a0b53417cb2e4f2c593c', class: "paper-switch-tile-card border" }, h("div", { key: '7d812ec67af74f546334cc3c5ecd85655fa25e44', class: this.getFrontCardClass() }, h("slot", { key: 'b0a0757cebfbd3a200946f382d2984dbedd9891b', name: "unchecked-text" })), h("div", { key: 'a3fd94c743396e7e63de582ed668cb67108298e5', class: this.getBackCardClass() }, h("slot", { key: '08c35d8551789770bdd63b99d36b1a2bb9848632', name: "checked-text" }))))))));
     }
     static get is() { return "p-switch-tile"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/leaf/leaf.js

@@ -7,7 +7,7 @@ export class Alert {
         return this.dark ? 'papier is--dark' : 'papier';
     }
     render() {
-        return (h("div", { key: '5cdad006f9e9b71c13cc237b32338bd0bcec9ad8', class: this.getParentClass() }, h("slot", { key: 'c1b30acfc9c85b94968a562fa28d1d564b6002cf' })));
+        return (h("div", { key: 'be45db92e133312609842ac835ad2402851f152b', class: this.getParentClass() }, h("slot", { key: '3ed985d0963e4e7b1c287142f3fc3464b9f1cd99' })));
     }
     static get is() { return "p-leaf"; }
     static get originalStyleUrls() {

package/dist/collection/components/modal/modal.css

@@ -3212,6 +3212,9 @@
   --shadow-color-hover: rgba(0, 0, 0, 0.3);
   --primary-inverse: #fff;
 }
+:host .papier {
+  position: absolute;
+}
 :host .modal {
   opacity: 1 !important;
   visibility: visible !important;

package/dist/collection/components/modal/modal.js

@@ -11,7 +11,7 @@ export class PModal {
         this.closeEvent.emit(null);
     }
     render() {
-        return (h(Host, { key: '44e773a86ff62b4ebb3ebe422a7751ed8215f82b' }, this.isOpen && (h("div", { key: 'aba90002aba4f7cccbf35c4e611210d5c3ffd99b', class: "papier" }, h("div", { key: '280e660c62d4ec602fadf9545df1e660a8f42a15', class: "modal" }, h("div", { key: 'ac9fdbe7758e917d4be7b32748191a22b165a6bb', class: "modal-bg", onClick: () => this.close() }), h("div", { key: 'ac26db09c549eaf3c796a1fc00e2b4b536eea058', class: "modal-body" }, h("span", { key: '7f9ff9988bffc704b26483de912f76b19850333c', class: "btn-close", onClick: () => this.close() }, "X"), h("h4", { key: '28132657367594a7e3e916c0c900d5a2638aec5f', class: "modal-title" }, h("slot", { key: '05707cbb940c3beb6491457725218fd9c66bd6fb', name: "title" })), h("h5", { key: 'cf4b58f3e8723a9e26023b4a621310bf6306782b', class: "modal-subtitle" }, h("slot", { key: 'c21b9cdca220c1054cabff883e638fba4a5642d4', name: "sub-title" })), h("p", { key: '55ac957b152036846e20cc863377f63a4c74e587', class: "modal-text" }, h("slot", { key: '2faaa7e890a68168d9145d26fd2b0857a0e0a5b8', name: "text" })), h("slot", { key: '634bf74ca3d435f728e9e91de770c6702917aaea' })))))));
+        return (h(Host, { key: 'f13198814461860813a0ff18b624d6bf99609107' }, this.isOpen && (h("div", { key: 'f032ed086f608954a72a5eda7fa085a6f6847396', class: "papier" }, h("div", { key: '1076dad00e39f8d87ae4655585bbecbff45ac98b', class: "modal" }, h("div", { key: '4c47e5b36a76ff9bbf48ea6d0a9dc609255f6533', class: "modal-bg", onClick: () => this.close() }), h("div", { key: 'ed6f56b872ffc369354236e7a22c3f6bb0af348b', class: "modal-body" }, h("span", { key: '597568dd1621992a515be155bbc36e57b7f1dbcd', class: "btn-close", onClick: () => this.close() }, "X"), h("h4", { key: 'cecbf738b51198687a8e2b177c552e751bd85af6', class: "modal-title" }, h("slot", { key: '6eb97485f3e0f0efdd0b8ef4b51b0a803b5dac86', name: "title" })), h("h5", { key: 'a6f7a49a96324b417ea77507ba48cc0cc043d91c', class: "modal-subtitle" }, h("slot", { key: '02f03aa86615cf235c0807645454207943d1292a', name: "sub-title" })), h("p", { key: '8feec1c2c80f18bf86d2415fdecffbd5dd1f84f8', class: "modal-text" }, h("slot", { key: '08b33aece403b6ed3c2c5ff7926da896e731060e', name: "text" })), h("slot", { key: '99514c39dba619a713610282de642fa0bc5f9cc7' })))))));
     }
     static get is() { return "p-modal"; }
     static get encapsulation() { return "shadow"; }

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

@@ -12,7 +12,7 @@ export class PModalPreview {
         (_a = this.el.querySelector('p-modal')) === null || _a === void 0 ? void 0 : _a.close();
     }
     render() {
-        return (h("div", { key: '694fe55c10b6c699b9e21dc53dd65b61200edd68' }, this.title === true ? (h("p-modal", null, h("span", { slot: "title" }, "Modal title"), h("span", { slot: "sub-title" }, "Modal sub title"), h("span", { slot: "text" }, "This is an example of modal which is implemented with pure CSS! :D"), h("p-button", { type: "warning", onClick: () => this.closeModal() }, "Close it !"))) : (h("p-modal", null, h("h1", null, "Ciao fratello"), h("p", null, "click on button, cross or outside modal to close it."), h("br", null), h("p-button", { type: "success", onClick: () => this.closeModal() }, "Close modal"))), h("p-button", { key: '315992d18328e1813f1d7e66a684a69fe99f830b', type: this.title ? 'secondary' : 'primary', onClick: () => {
+        return (h("div", { key: '55e7acb0fb709c1546e4b6258e917831dc078122' }, this.title === true ? (h("p-modal", null, h("span", { slot: "title" }, "Modal title"), h("span", { slot: "sub-title" }, "Modal sub title"), h("span", { slot: "text" }, "This is an example of modal which is implemented with pure CSS! :D"), h("p-button", { type: "warning", onClick: () => this.closeModal() }, "Close it !"))) : (h("p-modal", null, h("h1", null, "Ciao fratello"), h("p", null, "click on button, cross or outside modal to close it."), h("br", null), h("p-button", { type: "success", onClick: () => this.closeModal() }, "Close modal"))), h("p-button", { key: 'bc53471ee489901fe314d5440971f6029bcfd10b', type: this.title ? 'secondary' : 'primary', onClick: () => {
                 this.openModal();
             } }, "Open modal")));
     }