@amiceli/papierjs 0.10.0 → 0.12.0

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

@@ -1,33 +0,0 @@
-export default {
-    title: 'Form/Slider/Playground',
-}
-
-const Template = (args) => {
-    const content = `
-        <p-slider
-            min="${args.min}"
-            max="${args.max}"
-            value="${args.value}"
-            ${args.darkMode ? 'dark' : ''}
-            ${args.block ? 'block' : ''}
-        >
-        </p-slider>`
-
-    return args.darkMode
-        ? `
-        <div style="padding: 10px; box-sizing: border-box; width: 100%; background: #41403e">
-            ${content}
-        </div>
-    `
-        : content
-}
-
-export const Playground = Template.bind({})
-
-Playground.args = {
-    value: 10,
-    min: 0,
-    max: 100,
-    block: false,
-    darkMode: false,
-}

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

@@ -1,50 +0,0 @@
-export default {
-    title: 'Form/Switch/Playground',
-    argTypes: {
-        round: {
-            name: 'round',
-            control: 'boolean',
-        },
-        square: {
-            name: 'square',
-            control: 'boolean',
-        },
-        checked: {
-            name: 'checked',
-            control: 'boolean',
-        },
-        darkMode: {
-            name: 'dark mode',
-            control: 'boolean',
-        },
-    },
-    tags: ['!autodocs'],
-}
-
-const Template = (args) => {
-    const content = `
-        <p-switch
-            ${args.round ? 'round' : ''}
-            ${args.square ? 'square' : ''}
-            ${args.darkMode ? 'dark' : ''}
-            ${args.checked ? 'checked' : ''}
-        >
-        </p-switch>`
-
-    return args.darkMode
-        ? `
-        <div style="padding: 10px; box-sizing: border-box; width: 100%; background: #41403e">
-            ${content}
-        </div>
-    `
-        : content
-}
-
-export const Playground = Template.bind({})
-
-Playground.args = {
-    round: false,
-    square: false,
-    checked: false,
-    darkMode: false,
-}

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

@@ -1 +0,0 @@
-{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../../src/components/form/switch/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAqB,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAOlF,MAAM,OAAO,OAAO;IALpB;QAMI,0BAA0B;QAEnB,UAAK,GAAa,KAAK,CAAA;QAC9B,iCAAiC;QAE1B,WAAM,GAAa,KAAK,CAAA;QAExB,SAAI,GAAa,KAAK,CAAA;QAEtB,YAAO,GAAa,KAAK,CAAA;KA4CnC;IAvCU,OAAO,CAAC,CAAQ;QACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAE,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC,CAAA;IACjE,CAAC;IAED,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DACI,KAAK,EAAE;oBACH,MAAM,EAAE,IAAI;oBACZ,UAAU,EAAE,IAAI,CAAC,IAAI;iBACxB;gBAED,4DAAK,KAAK,EAAC,YAAY;oBACnB,8DACI,KAAK,EAAE;4BACH,cAAc,EAAE,CAAC,IAAI,CAAC,MAAM;4BAC5B,gBAAgB,EAAE,IAAI,CAAC,MAAM;yBAChC;wBAED,8DACI,EAAE,EAAC,cAAc,EACjB,IAAI,EAAC,cAAc,EACnB,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GACjC;wBACF,6DACI,KAAK,EAAE;gCACH,KAAK,EAAE,IAAI,CAAC,KAAK;gCACjB,qBAAqB,EAAE,IAAI;6BAC9B,GACH,CACE,CACN,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-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({ eventName: 'change' })\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"]}

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

@@ -1,57 +0,0 @@
-export default {
-    title: 'Form/Switch Tile/Playground',
-    argTypes: {
-        uncheckedText: {
-            name: 'unchecked-text',
-            control: 'text',
-        },
-        checkedText: {
-            name: 'checked-text',
-            control: 'text',
-        },
-        uncheckedBackground: {
-            control: { type: 'select' },
-            options: ['primary', 'secondary', 'warning', 'danger', 'noted'],
-            name: 'unchecked-background',
-        },
-        checkedBackground: {
-            control: { type: 'select' },
-            options: ['primary', 'secondary', 'warning', 'danger', 'noted'],
-            name: 'checked-background',
-        },
-        darkMode: {
-            name: 'dark mode',
-            control: 'boolean',
-        },
-    },
-}
-
-const Template = (args) => {
-    const content = `
-        <p-switch-tile
-            unchecked-background="${args.uncheckedBackground}"
-            checked-background="${args.checkedBackground}"
-            ${args.darkMode ? 'dark' : ''}
-        >
-            <span slot="unchecked-text">${args.uncheckedText}</span>
-            <span slot="checked-text">${args.checkedText}</span>
-        </p-switch-tile>`
-
-    return args.darkMode
-        ? `
-        <div style="padding: 10px; box-sizing: border-box; width: 100%; background: #41403e">
-            ${content}
-        </div>
-    `
-        : content
-}
-
-export const Playground = Template.bind({})
-
-Playground.args = {
-    uncheckedText: 'No',
-    checkedText: 'Yes',
-    uncheckedBackground: 'primary',
-    checkedBackground: 'noted',
-    darkMode: false,
-}

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

@@ -1 +0,0 @@
-{"version":3,"file":"switch-tile.js","sourceRoot":"","sources":["../../../../src/components/form/switch-tile/switch-tile.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAqB,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAIlF;;;GAGG;AAMH,MAAM,OAAO,UAAU;IALvB;QAMI,uBAAuB;QACR,SAAI,GAAa,KAAK,CAAA;QAE9B,YAAO,GAAa,KAAK,CAAA;QAEzB,sBAAiB,GAAoB,SAAS,CAAA;KA2DxD;IApDU,OAAO,CAAC,CAAQ;QACnB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAE,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC,CAAA;IACjE,CAAC;IAEM,iBAAiB;QACpB,MAAM,QAAQ,GAAG;YACb,8BAA8B,EAAE,IAAI;YACpC,MAAM,EAAE,IAAI;SACf,CAAA;QAED,QAAQ,CAAC,cAAc,IAAI,CAAC,mBAAmB,EAAE,CAAC,GAAG,IAAI,CAAA;QAEzD,OAAO,QAAQ,CAAA;IACnB,CAAC;IAEM,gBAAgB;QACnB,MAAM,QAAQ,GAAG;YACb,6BAA6B,EAAE,IAAI;YACnC,MAAM,EAAE,IAAI;SACf,CAAA;QAED,QAAQ,CAAC,cAAc,IAAI,CAAC,iBAAiB,EAAE,CAAC,GAAG,IAAI,CAAA;QAEvD,OAAO,QAAQ,CAAA;IACnB,CAAC;IAED,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DACI,KAAK,EAAE;oBACH,MAAM,EAAE,IAAI;oBACZ,UAAU,EAAE,IAAI,CAAC,IAAI;iBACxB;gBAED,4DAAK,KAAK,EAAC,YAAY;oBACnB,8DAAO,OAAO,EAAC,cAAc,EAAC,KAAK,EAAC,mBAAmB;wBACnD,8DAAO,EAAE,EAAC,cAAc,EAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,GAAI;wBACtF,4DAAK,KAAK,EAAC,+BAA+B;4BACtC,4DAAK,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE;gCAChC,6DAAM,IAAI,EAAC,gBAAgB,GAAG,CAC5B;4BACN,4DAAK,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE;gCAC/B,6DAAM,IAAI,EAAC,cAAc,GAAG,CAC1B,CACJ,CACF,CACN,CACJ,CACH,CACV,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Event, type EventEmitter, Host, Prop, h } 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 SwitchTile {\n    /** Enable dark mode */\n    @Prop() 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({ eventName: 'change' })\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"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"leaf.js","sourceRoot":"","sources":["../../../src/components/leaf/leaf.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAMlD,MAAM,OAAO,KAAK;IAJlB;QAMI,SAAI,GAAa,KAAK,CAAA;KAazB;IAXU,cAAc;QACjB,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,QAAQ,CAAA;IACnD,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE;YAC7B,8DAAQ,CACN,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-leaf',\n    styleUrl: 'leaf.scss',\n})\nexport class Pleaf {\n    @Prop()\n    dark?: boolean = false\n\n    public getParentClass() {\n        return this.dark ? 'papier is--dark' : 'papier'\n    }\n\n    render() {\n        return (\n            <div class={this.getParentClass()}>\n                <slot />\n            </div>\n        )\n    }\n}\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../src/components/modal/modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAqB,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAO3F,MAAM,OAAO,MAAM;IALnB;QAOI,WAAM,GAAY,KAAK,CAAA;KA4C1B;IAtCU,KAAK,CAAC,IAAI;QACb,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;IACtB,CAAC;IAGM,KAAK,CAAC,KAAK;QACd,IAAI,CAAC,MAAM,GAAG,KAAK,CAAA;QACnB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC9B,CAAC;IAED,MAAM;QACF,OAAO,CACH,EAAC,IAAI,uDACA,IAAI,CAAC,MAAM,IAAI,CACZ,4DAAK,KAAK,EAAC,QAAQ;YACf,4DAAK,KAAK,EAAC,OAAO;gBACd,4DAAK,KAAK,EAAC,UAAU,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,GAAI;gBACrD,4DAAK,KAAK,EAAC,YAAY;oBACnB,6DAAM,KAAK,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,QAE5C;oBACP,2DAAI,KAAK,EAAC,aAAa;wBACnB,6DAAM,IAAI,EAAC,OAAO,GAAG,CACpB;oBACL,2DAAI,KAAK,EAAC,gBAAgB;wBACtB,6DAAM,IAAI,EAAC,WAAW,GAAG,CACxB;oBACL,0DAAG,KAAK,EAAC,YAAY;wBACjB,6DAAM,IAAI,EAAC,MAAM,GAAG,CACpB;oBACJ,8DAAQ,CACN,CACJ,CACJ,CACT,CACE,CACV,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Event, type EventEmitter, Host, Method, State, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-modal',\n    styleUrl: 'modal.scss',\n    shadow: true,\n})\nexport class PModal {\n    @State()\n    isOpen: boolean = false\n\n    @Event({ eventName: 'close' })\n    public closeEvent: EventEmitter<void>\n\n    @Method()\n    public async open() {\n        this.isOpen = true\n    }\n\n    @Method()\n    public async close() {\n        this.isOpen = false\n        this.closeEvent.emit(null)\n    }\n\n    render() {\n        return (\n            <Host>\n                {this.isOpen && (\n                    <div class=\"papier\">\n                        <div class=\"modal\">\n                            <div class=\"modal-bg\" onClick={() => this.close()} />\n                            <div class=\"modal-body\">\n                                <span class=\"btn-close\" onClick={() => this.close()}>\n                                    X\n                                </span>\n                                <h4 class=\"modal-title\">\n                                    <slot name=\"title\" />\n                                </h4>\n                                <h5 class=\"modal-subtitle\">\n                                    <slot name=\"sub-title\" />\n                                </h5>\n                                <p class=\"modal-text\">\n                                    <slot name=\"text\" />\n                                </p>\n                                <slot />\n                            </div>\n                        </div>\n                    </div>\n                )}\n            </Host>\n        )\n    }\n}\n"]}

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

@@ -1,26 +0,0 @@
-export function previewModal() {
-    const inputObserver = new MutationObserver(() => {
-        const modal = document.querySelector('#modal-1');
-        const buttonModal = document.querySelector('#open-modal-1');
-        const otherModal = document.querySelector('#modal-2');
-        const otherButton = document.querySelector('#open-modal-2');
-        const closeIt = document.querySelector('#close-it');
-        if (modal && buttonModal && otherModal && otherButton) {
-            buttonModal.addEventListener('click', () => {
-                modal.open();
-            });
-            otherButton.addEventListener('click', () => {
-                otherModal.open();
-            });
-            closeIt.addEventListener('click', () => {
-                otherModal.close();
-            });
-            inputObserver.disconnect();
-        }
-    });
-    inputObserver.observe(document.body, {
-        childList: true,
-        subtree: true,
-    });
-}
-//# sourceMappingURL=modal.preview.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"modal.preview.js","sourceRoot":"","sources":["../../../src/components/modal/modal.preview.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,YAAY;IACxB,MAAM,aAAa,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE;QAC5C,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAsB,CAAA;QACrE,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAC,CAAA;QAE3D,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAsB,CAAA;QAC1E,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAC,CAAA;QAC3D,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,CAAA;QAEnD,IAAI,KAAK,IAAI,WAAW,IAAI,UAAU,IAAI,WAAW,EAAE,CAAC;YACpD,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBACvC,KAAK,CAAC,IAAI,EAAE,CAAA;YAChB,CAAC,CAAC,CAAA;YACF,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBACvC,UAAU,CAAC,IAAI,EAAE,CAAA;YACrB,CAAC,CAAC,CAAA;YACF,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBACnC,UAAU,CAAC,KAAK,EAAE,CAAA;YACtB,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":["import type { PModal } from './modal'\n\nexport function previewModal() {\n    const inputObserver = new MutationObserver(() => {\n        const modal = document.querySelector('#modal-1') as unknown as PModal\n        const buttonModal = document.querySelector('#open-modal-1')\n\n        const otherModal = document.querySelector('#modal-2') as unknown as PModal\n        const otherButton = document.querySelector('#open-modal-2')\n        const closeIt = document.querySelector('#close-it')\n\n        if (modal && buttonModal && otherModal && otherButton) {\n            buttonModal.addEventListener('click', () => {\n                modal.open()\n            })\n            otherButton.addEventListener('click', () => {\n                otherModal.open()\n            })\n            closeIt.addEventListener('click', () => {\n                otherModal.close()\n            })\n            inputObserver.disconnect()\n        }\n    })\n\n    inputObserver.observe(document.body, {\n        childList: true,\n        subtree: true,\n    })\n}\n"]}

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

@@ -1,46 +0,0 @@
-import { h } from "@stencil/core";
-export class PModalPreview {
-    constructor() {
-        this.title = false;
-    }
-    openModal() {
-        var _a;
-        (_a = this.el.querySelector('p-modal')) === null || _a === void 0 ? void 0 : _a.open();
-    }
-    closeModal() {
-        var _a;
-        (_a = this.el.querySelector('p-modal')) === null || _a === void 0 ? void 0 : _a.close();
-    }
-    render() {
-        return (h("div", { key: '1443551adceb5558ad63e775099e0aecbf4cb19c' }, 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: '995c0f73de1751a512a4f77c32137ebd3a06dec6', type: this.title ? 'secondary' : 'primary', onClick: () => {
-                this.openModal();
-            } }, "Open modal")));
-    }
-    static get is() { return "p-modal-preview"; }
-    static get properties() {
-        return {
-            "title": {
-                "type": "boolean",
-                "attribute": "title",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=modal.preview.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"modal.preview.js","sourceRoot":"","sources":["../../../../src/components/modal/stories/modal.preview.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAK3D,MAAM,OAAO,aAAa;IAH1B;QAKI,UAAK,GAAa,KAAK,CAAA;KA6C1B;IAzCU,SAAS;;QACZ,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,0CAAE,IAAI,EAAE,CAAA;IAC5C,CAAC;IAEM,UAAU;;QACb,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,0CAAE,KAAK,EAAE,CAAA;IAC7C,CAAC;IAED,MAAM;QACF,OAAO,CACH;YACK,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,CACnB;gBACI,YAAM,IAAI,EAAC,OAAO,kBAAmB;gBACrC,YAAM,IAAI,EAAC,WAAW,sBAAuB;gBAC7C,YAAM,IAAI,EAAC,MAAM,yEAA0E;gBAC3F,gBAAU,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,iBAE9C,CACL,CACb,CAAC,CAAC,CAAC,CACA;gBACI,8BAAsB;gBACtB,oEAA2D;gBAC3D,aAAM;gBACN,gBAAU,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,kBAE9C,CACL,CACb;YACD,iEACI,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAC1C,OAAO,EAAE,GAAG,EAAE;oBACV,IAAI,CAAC,SAAS,EAAE,CAAA;gBACpB,CAAC,iBAGM,CACT,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Prop, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-modal-preview',\n})\nexport class PModalPreview {\n    @Prop()\n    title?: boolean = false\n    @Element()\n    public el: HTMLElement\n\n    public openModal() {\n        this.el.querySelector('p-modal')?.open()\n    }\n\n    public closeModal() {\n        this.el.querySelector('p-modal')?.close()\n    }\n\n    render() {\n        return (\n            <div>\n                {this.title === true ? (\n                    <p-modal>\n                        <span slot=\"title\">Modal title</span>\n                        <span slot=\"sub-title\">Modal sub title</span>\n                        <span slot=\"text\">This is an example of modal which is implemented with pure CSS! :D</span>\n                        <p-button type=\"warning\" onClick={() => this.closeModal()}>\n                            Close it !\n                        </p-button>\n                    </p-modal>\n                ) : (\n                    <p-modal>\n                        <h1>Ciao fratello</h1>\n                        <p>click on button, cross or outside modal to close it.</p>\n                        <br />\n                        <p-button type=\"success\" onClick={() => this.closeModal()}>\n                            Close modal\n                        </p-button>\n                    </p-modal>\n                )}\n                <p-button\n                    type={this.title ? 'secondary' : 'primary'}\n                    onClick={() => {\n                        this.openModal()\n                    }}\n                >\n                    Open modal\n                </p-button>\n            </div>\n        )\n    }\n}\n"]}

package/dist/collection/components/p-card/stories/p-card.stories.js

@@ -1,30 +0,0 @@
-import { h } from "@stencil/core";
-import { Button } from "../../button/button";
-import { Pleaf } from "../../leaf/leaf";
-import { PCard } from "../p-card";
-const meta = {
-    title: 'Components/Card/Playground',
-    component: PCard,
-    subcomponents: [Button, Pleaf],
-    parameters: {
-        layout: 'centered',
-    },
-    argTypes: {
-        dark: { control: 'boolean' },
-        image: {
-            description: 'image',
-        },
-    },
-    args: {
-        dark: false,
-        image: 'https://picsum.photos/200/100',
-    },
-};
-export default meta;
-export const Playground = {
-    args: {
-        dark: true,
-    },
-    render: (props) => (h("div", null, h("p-leaf", null, h("h3", null, "p-card")), h("div", { style: { width: '20rem' } }, h("p-card", Object.assign({}, props), h("div", { slot: "title" }, "My awesome Paper card!"), h("div", { slot: "subtitle" }, "Nice looking subtitle."), h("div", { slot: "text" }, "Notice that the card width in this example have been set to 20rem, otherwise it will try to fill the current container/row where the card is."), h("p-button", { type: "secondary" }, "Next"))), h("p-leaf", null, h("h3", null, "p-card with footer and header")), h("div", { style: { width: '20rem' } }, h("p-card", Object.assign({}, props), h("div", { slot: "header" }, "Header"), h("div", { slot: "title" }, "My awesome Paper card!"), h("div", { slot: "subtitle" }, "Nice looking subtitle."), h("div", { slot: "text" }, "Notice that the card width in this example have been set to 20rem, otherwise it will try to fill the current container/row where the card is."), h("p-button", { type: "secondary" }, "Next"), h("div", { slot: "footer" }, "Footer"))))),
-};
-//# sourceMappingURL=p-card.stories.js.map

package/dist/collection/components/p-card/stories/p-card.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"p-card.stories.js","sourceRoot":"","sources":["../../../../src/components/p-card/stories/p-card.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAEjC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,IAAI,GAAgB;IACtB,KAAK,EAAE,4BAA4B;IACnC,SAAS,EAAE,KAAK;IAChB,aAAa,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;IAC9B,UAAU,EAAE;QACR,MAAM,EAAE,UAAU;KACrB;IACD,QAAQ,EAAE;QACN,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QAC5B,KAAK,EAAE;YACH,WAAW,EAAE,OAAO;SACvB;KACJ;IACD,IAAI,EAAE;QACF,IAAI,EAAE,KAAK;QACX,KAAK,EAAE,+BAA+B;KACzC;CACJ,CAAA;AAED,eAAe,IAAI,CAAA;AAInB,MAAM,CAAC,MAAM,UAAU,GAAU;IAC7B,IAAI,EAAE;QACF,IAAI,EAAE,IAAI;KACb;IACD,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CACf;QACI;YACI,uBAAe,CACV;QACT,WAAK,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE;YAC1B,8BAAY,KAAK;gBACb,WAAK,IAAI,EAAC,OAAO,6BAA6B;gBAC9C,WAAK,IAAI,EAAC,UAAU,6BAA6B;gBACjD,WAAK,IAAI,EAAC,MAAM,oJAGV;gBACN,gBAAU,IAAI,EAAC,WAAW,WAAgB,CACrC,CACP;QACN;YACI,8CAAsC,CACjC;QACT,WAAK,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE;YAC1B,8BAAY,KAAK;gBACb,WAAK,IAAI,EAAC,QAAQ,aAAa;gBAC/B,WAAK,IAAI,EAAC,OAAO,6BAA6B;gBAC9C,WAAK,IAAI,EAAC,UAAU,6BAA6B;gBACjD,WAAK,IAAI,EAAC,MAAM,oJAGV;gBACN,gBAAU,IAAI,EAAC,WAAW,WAAgB;gBAC1C,WAAK,IAAI,EAAC,QAAQ,aAAa,CAC1B,CACP,CACJ,CACT;CACJ,CAAA","sourcesContent":["import { h } from '@stencil/core'\nimport type { Meta, StoryObj } from '@stencil/storybook-plugin'\nimport { Button } from '../../button/button'\nimport { Pleaf } from '../../leaf/leaf'\nimport { PCard } from '../p-card'\n\nconst meta: Meta<PCard> = {\n    title: 'Components/Card/Playground',\n    component: PCard,\n    subcomponents: [Button, Pleaf],\n    parameters: {\n        layout: 'centered',\n    },\n    argTypes: {\n        dark: { control: 'boolean' },\n        image: {\n            description: 'image',\n        },\n    },\n    args: {\n        dark: false,\n        image: 'https://picsum.photos/200/100',\n    },\n}\n\nexport default meta\n\ntype Story = StoryObj<PCard>\n\nexport const Playground: Story = {\n    args: {\n        dark: true,\n    },\n    render: (props) => (\n        <div>\n            <p-leaf>\n                <h3>p-card</h3>\n            </p-leaf>\n            <div style={{ width: '20rem' }}>\n                <p-card {...props}>\n                    <div slot=\"title\">My awesome Paper card!</div>\n                    <div slot=\"subtitle\">Nice looking subtitle.</div>\n                    <div slot=\"text\">\n                        Notice that the card width in this example have been set to 20rem, otherwise it will try to fill the current\n                        container/row where the card is.\n                    </div>\n                    <p-button type=\"secondary\">Next</p-button>\n                </p-card>\n            </div>\n            <p-leaf>\n                <h3>p-card with footer and header</h3>\n            </p-leaf>\n            <div style={{ width: '20rem' }}>\n                <p-card {...props}>\n                    <div slot=\"header\">Header</div>\n                    <div slot=\"title\">My awesome Paper card!</div>\n                    <div slot=\"subtitle\">Nice looking subtitle.</div>\n                    <div slot=\"text\">\n                        Notice that the card width in this example have been set to 20rem, otherwise it will try to fill the current\n                        container/row where the card is.\n                    </div>\n                    <p-button type=\"secondary\">Next</p-button>\n                    <div slot=\"footer\">Footer</div>\n                </p-card>\n            </div>\n        </div>\n    ),\n}\n"]}

package/dist/collection/components/p-icon/stories/p-icon-playground.stories.js

@@ -1,33 +0,0 @@
-import { icons } from '../icons'
-
-export default {
-    title: 'Components/Icon/Playground',
-    argTypes: {
-        icon: {
-            control: { type: 'select' },
-            options: Object.keys(icons),
-        },
-    },
-}
-
-const Template = (args) => {
-    return `
-        <p-leaf>
-            <h3>p-icon</h3>
-        </p-leaf>
-        <br />
-        <p-icon 
-            icon="${args.icon}"
-            size="${args.size}"
-            color="${args.color}"
-        ></p-icon>
-    `
-}
-
-export const Playground = Template.bind({})
-
-Playground.args = {
-    color: 'black',
-    size: 30,
-    icon: '4g',
-}

package/dist/collection/components/p-spinner/stories/p-spinner-playground.stories.js

@@ -1,27 +0,0 @@
-export default {
-    title: 'Components/Spinner/Playground',
-}
-
-const Template = (args) => {
-    return `
-        <p-leaf>
-            <h3>p-spinner</h3>
-        </p-leaf>
-        <br />
-        <div style='padding: 10px; background: ${args.dark ? '#41403e' : 'white'}'>
-            <p-spinner
-                color="${args.color}"
-                ${args.large ? 'large' : ''}
-                ${args.dark ? 'dark' : ''}
-            ></p-spinner>
-        </div>
-    `
-}
-
-export const Playground = Template.bind({})
-
-Playground.args = {
-    dark: false,
-    large: false,
-    color: 'inherit',
-}

package/dist/collection/components/progress-bar/progress-bar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"progress-bar.js","sourceRoot":"","sources":["../../../src/components/progress-bar/progress-bar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AASzD,MAAM,OAAO,WAAW;IALxB;QAOI,SAAI,GAAsB,SAAS,CAAA;QAEnC,UAAK,GAAY,CAAC,CAAA;QAElB,YAAO,GAAa,KAAK,CAAA;QAEzB,SAAI,GAAa,KAAK,CAAA;KA2DzB;IApDU,gBAAgB;QACnB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACZ,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,WAAW,CAAC,GAAG,EAAE;gBACpC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA;YACxD,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAA;QACjB,CAAC;IACL,CAAC;IAEM,oBAAoB;QACvB,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;IACvC,CAAC;IAEM,QAAQ;QACX,MAAM,KAAK,GAAG,CAAC,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,CAAC,CAAA;QAC/E,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAA;QAEtE,IAAI,QAAQ,GAAG,SAAS,KAAK,EAAE,CAAA;QAE/B,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;YAC7B,QAAQ,GAAG,GAAG,QAAQ,UAAU,CAAA;QACpC,CAAC;aAAM,CAAC;YACJ,QAAQ,GAAG,GAAG,QAAQ,IAAI,IAAI,CAAC,IAAI,EAAE,CAAA;QACzC,CAAC;QAED,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACf,QAAQ,GAAG,GAAG,QAAQ,UAAU,CAAA;QACpC,CAAC;QAED,OAAO,QAAQ,CAAA;IACnB,CAAC;IAEM,cAAc;QACjB,IAAI,QAAQ,GAAG,kBAAkB,CAAA;QAEjC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACZ,QAAQ,GAAG,GAAG,QAAQ,WAAW,CAAA;QACrC,CAAC;QAED,OAAO,QAAQ,CAAA;IACnB,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE;YAC7B,4DAAK,KAAK,EAAC,UAAU;gBACjB,4DAAK,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE;oBACvB,8DAAQ,CACN,CACJ,CACJ,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, State, h } from '@stencil/core'\n\ntype ProgressBarColor = 'secondary' | 'success' | 'warning' | 'danger' | 'muted' | 'primary'\n\n@Component({\n    tag: 'p-progress-bar',\n    styleUrl: 'progress-bar.scss',\n    shadow: true,\n})\nexport class ProgressBar {\n    @Prop()\n    type?: ProgressBarColor = 'primary'\n    @Prop()\n    value?: number = 0\n    @Prop()\n    striped?: boolean = false\n    @Prop()\n    dark?: boolean = false\n    @Prop()\n    auto?: number\n\n    @State()\n    interval?: number\n\n    public componentDidLoad() {\n        if (this.auto) {\n            this.interval = window.setInterval(() => {\n                this.value = this.value >= 100 ? 0 : this.value + 10\n            }, this.auto)\n        }\n    }\n\n    public disconnectedCallback() {\n        window.clearInterval(this.interval)\n    }\n\n    public getClass(): string {\n        const types = ['secondary', 'success', 'warning', 'danger', 'muted', 'primary']\n        const value = this.value < 0 ? 0 : this.value > 100 ? 100 : this.value\n\n        let cssClass = `bar w-${value}`\n\n        if (!types.includes(this.type)) {\n            cssClass = `${cssClass} primary`\n        } else {\n            cssClass = `${cssClass} ${this.type}`\n        }\n\n        if (this.striped) {\n            cssClass = `${cssClass} striped`\n        }\n\n        return cssClass\n    }\n\n    public getParentClass() {\n        let cssClass = 'papier is--block'\n\n        if (this.dark) {\n            cssClass = `${cssClass} is--dark`\n        }\n\n        return cssClass\n    }\n\n    render() {\n        return (\n            <div class={this.getParentClass()}>\n                <div class=\"progress\">\n                    <div class={this.getClass()}>\n                        <slot />\n                    </div>\n                </div>\n            </div>\n        )\n    }\n}\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"progress-bar.preview.js","sourceRoot":"","sources":["../../../../src/components/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"]}

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

@@ -1,71 +0,0 @@
-export default {
-    title: 'Components/Progress bar/Playground',
-    argTypes: {
-        type: {
-            control: { type: 'select' },
-            options: ['success', 'secondary', 'warning', 'danger', 'muted', 'primary'],
-            name: 'checked-background',
-        },
-        value: {
-            type: 'number',
-            min: 0,
-            max: 100,
-        },
-        darkMode: {
-            name: 'dark mode',
-            control: 'boolean',
-        },
-    },
-}
-
-const Template = (args) => {
-    const content = `
-        <div style="width : 90%">
-            <p-leaf>
-                <h3>p-progress-bar</h3>
-            </p-leaf>
-            <p-progress-bar
-                type="${args.type}"
-                value="${args.value}"
-                ${args.darkMode ? 'dark' : ''}
-                ${args.striped ? 'striped' : ''}
-            >
-                ${args.contenr}
-            </p-progress-bar>
-            <p-leaf>
-                <h3>CSS animation</h3>
-            </p-leaf>
-            <p-progress-bar
-                type="${args.type}"
-                id="animated-progress"
-                ${args.darkMode ? 'dark' : ''}
-                ${args.striped ? 'striped' : ''}
-            >
-                ${args.contenr}
-            </p-progress-bar>
-            <br />
-            <p-button 
-                type="secondary"
-                id="animated-progress-button"
-            >Add 10%</p-button>
-        </div>
-    `
-
-    return args.darkMode
-        ? `
-        <div style="padding: 10px; box-sizing: border-box; width: 100%; background: #41403e">
-            ${content}
-        </div>
-    `
-        : content
-}
-
-export const Playground = Template.bind({})
-
-Playground.args = {
-    contenr: 'Awesome',
-    type: 'success',
-    darkMode: false,
-    striped: false,
-    value: 20,
-}

package/dist/collection/components/tabs/tab/tab.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../../src/components/tabs/tab/tab.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAOxD,MAAM,OAAO,IAAI;IALjB;QASI,aAAQ,GAAa,KAAK,CAAA;QAE1B,SAAI,GAAa,KAAK,CAAA;KAiBzB;IAfG,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DACI,KAAK,EAAE;oBACH,MAAM,EAAE,IAAI;oBACZ,cAAc,EAAE,IAAI,CAAC,QAAQ;oBAC7B,UAAU,EAAE,IAAI,CAAC,IAAI;iBACxB;gBAED,8DAAQ,CACN,CACH,CACV,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-tab',\n    styleUrl: 'tab.scss',\n    shadow: true,\n})\nexport class PTab {\n    @Prop()\n    title: string\n    @Prop({ mutable: true })\n    selected?: boolean = false\n    @Prop()\n    dark?: boolean = false\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        papier: true,\n                        'is--selected': this.selected,\n                        'is--dark': this.dark,\n                    }}\n                >\n                    <slot />\n                </div>\n            </Host>\n        )\n    }\n}\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../../src/components/tabs/tabs/tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAGxE,2CAA2C;AAM3C,MAAM,OAAO,KAAK;IALlB;QASI,SAAI,GAAW,EAAE,CAAA;QAIjB,SAAI,GAAa,KAAK,CAAA;KAsEzB;IApEU,gBAAgB;QACnB,MAAM,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QACrD,MAAM,IAAI,GAAG,IAAI,CAAC,gBAAgB,EAAuB,CAAA;QAEzD,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAEhB,KAAK,MAAM,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YAC1B,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gBACZ,CAAC;gBAAC,GAA8B,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;YACjE,CAAC;iBAAM,CAAC;gBACJ,CAAC;gBAAC,GAA8B,CAAC,eAAe,CAAC,MAAM,CAAC,CAAA;YAC5D,CAAC;QACL,CAAC;QACD,IAAI,CAAC,iBAAiB,EAAE,CAAA;IAC5B,CAAC;IAEM,WAAW,CAAC,CAAO;QACtB,KAAK,MAAM,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YAC1B,GAAG,CAAC,QAAQ,GAAG,KAAK,CAAA;QACxB,CAAC;QACD,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAA;QAEjB,IAAI,CAAC,WAAW,GAAG,CAAC,CAAA;IACxB,CAAC;IAEM,iBAAiB;QACpB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAA;QAE7D,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACpB,IAAI,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;gBAClB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;YACrC,CAAC;QACL,CAAC;IACL,CAAC;IAEM,WAAW,CAAC,GAAS;;QACxB,MAAM,MAAM,GAAG,GAAG,CAAC,KAAK,MAAK,MAAA,IAAI,CAAC,WAAW,0CAAE,KAAK,CAAA,CAAA;QAEpD,OAAO;YACH,cAAc,EAAE,MAAM,IAAI,GAAG,CAAC,QAAQ;SACzC,CAAA;IACL,CAAC;IAED,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DACI,KAAK,EAAE;oBACH,UAAU,EAAE,IAAI,CAAC,IAAI;oBACrB,MAAM,EAAE,IAAI;iBACf;gBAED,4DAAK,KAAK,EAAC,sBAAsB;oBAC5B,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;wBACjB,OAAO,CACH,aAAO,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,OAAO,EAAC,MAAM,EAAC,GAAG,EAAE,CAAC,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,IAC7F,CAAC,CAAC,KAAK,CACJ,CACX,CAAA;oBACL,CAAC,CAAC;oBACF,4DAAK,KAAK,EAAC,SAAS;wBAChB,8DAAQ,CACN,CACJ,CACJ,CACH,CACV,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Host, Prop, State, h } from '@stencil/core'\nimport type { PTab } from '../tab/tab'\n\n/** @slot - slot with <p-tab> components */\n@Component({\n    tag: 'p-tabs',\n    styleUrl: 'tabs.scss',\n    shadow: true,\n})\nexport class PTabs {\n    @Element()\n    public el: HTMLElement\n    @State()\n    tabs: PTab[] = []\n    @State()\n    selectedTab?: PTab\n    @Prop()\n    dark?: boolean = false\n\n    public componentDidLoad() {\n        const slot = this.el.shadowRoot.querySelector('slot')\n        const tabs = slot.assignedElements() as unknown as PTab[]\n\n        this.tabs = tabs\n\n        for (const tab of this.tabs) {\n            if (this.dark) {\n                ;(tab as unknown as HTMLElement).setAttribute('dark', 'true')\n            } else {\n                ;(tab as unknown as HTMLElement).removeAttribute('dark')\n            }\n        }\n        this.updateSelectedTab()\n    }\n\n    public onSelectTab(t: PTab) {\n        for (const tab of this.tabs) {\n            tab.selected = false\n        }\n        t.selected = true\n\n        this.selectedTab = t\n    }\n\n    public updateSelectedTab() {\n        this.selectedTab = this.tabs.find((s) => s.selected === true)\n\n        if (!this.selectedTab) {\n            if (this.tabs.at(0)) {\n                this.onSelectTab(this.tabs.at(0))\n            }\n        }\n    }\n\n    public getTabClass(tab: PTab) {\n        const isSame = tab.title === this.selectedTab?.title\n\n        return {\n            'is--selected': isSame && tab.selected,\n        }\n    }\n\n    render() {\n        return (\n            <Host>\n                <div\n                    class={{\n                        'is--dark': this.dark,\n                        papier: true,\n                    }}\n                >\n                    <div class=\"row flex-spaces tabs\">\n                        {this.tabs.map((t) => {\n                            return (\n                                <label class={this.getTabClass(t)} htmlFor=\"tab1\" key={t.title} onClick={() => this.onSelectTab(t)}>\n                                    {t.title}\n                                </label>\n                            )\n                        })}\n                        <div class=\"content\">\n                            <slot />\n                        </div>\n                    </div>\n                </div>\n            </Host>\n        )\n    }\n}\n"]}

package/dist/collection/components/tooltip/stories/tooltip.stories.js

@@ -1,31 +0,0 @@
-export default {
-    title: 'Components/Tooltip/Playground',
-}
-
-const Template = (args) => {
-    return `
-        <div style="width: 400px">
-            <p-tooltip 
-                ${args.disabled ? 'disabled' : ''}
-                ${args.top ? 'top' : ''}
-                ${args.right ? 'right' : ''}
-                ${args.left ? 'left' : ''}
-                ${args.bottom ? 'bottom' : ''}
-                title="${args.title}"
-            >
-                <p-button>Click here ;)</p-button>
-            </p-tooltip>
-        </div>
-    `
-}
-
-export const Playground = Template.bind({})
-
-Playground.args = {
-    title: 'Awesome',
-    left: false,
-    right: true,
-    bottom: false,
-    top: false,
-    disabled: false,
-}

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

@@ -1 +0,0 @@
-{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../src/components/tooltip/tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAOxD,MAAM,OAAO,QAAQ;IALrB;QASI,aAAQ,GAAa,KAAK,CAAA;QAE1B,SAAI,GAAa,KAAK,CAAA;QAEtB,UAAK,GAAa,KAAK,CAAA;QAEvB,WAAM,GAAa,KAAK,CAAA;QAExB,QAAG,GAAa,KAAK,CAAA;KAkBxB;IAhBG,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DAAK,KAAK,EAAC,QAAQ;gBACf,4EACkB,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,mBAC9C,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,oBAC/C,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,iBACpD,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI;oBAE3D,8DAAQ,CACN,CACJ,CACH,CACV,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-tooltip',\n    styleUrl: '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"]}