@amiceli/papierjs 0.2.0 → 0.4.0

package/dist/components/p-dropdown-preview.js

@@ -0,0 +1,75 @@
+import { p as proxyCustomElement, H, h } from './p-eea4fbc1.js';
+import { d as defineCustomElement$5 } from './p-44ddcae9.js';
+import { d as defineCustomElement$4 } from './p-18fc6353.js';
+import { d as defineCustomElement$3 } from './p-ee5f2278.js';
+import { d as defineCustomElement$2 } from './p-1754e5cb.js';
+
+const Alert = /*@__PURE__*/ proxyCustomElement(class Alert extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.value = '';
+        this.selectedValue = '';
+    }
+    showModal(value) {
+        var _a;
+        (_a = this.el.querySelector('p-modal')) === null || _a === void 0 ? void 0 : _a.open();
+        this.value = value;
+    }
+    onValidate() {
+        this.selectedValue = this.value;
+        this.onClose();
+    }
+    onClose() {
+        var _a;
+        (_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"))));
+    }
+    get el() { return this; }
+}, [0, "p-dropdown-preview", {
+        "value": [32],
+        "selectedValue": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["p-dropdown-preview", "p-button", "p-dropdown", "p-dropdown-item", "p-modal"];
+    components.forEach(tagName => { switch (tagName) {
+        case "p-dropdown-preview":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Alert);
+            }
+            break;
+        case "p-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "p-dropdown":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "p-dropdown-item":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "p-modal":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const PDropdownPreview = Alert;
+const defineCustomElement = defineCustomElement$1;
+
+export { PDropdownPreview, defineCustomElement };
+
+//# sourceMappingURL=p-dropdown-preview.js.map

package/dist/components/p-dropdown-preview.js.map

@@ -0,0 +1 @@
+{"file":"p-dropdown-preview.js","mappings":";;;;;;MAKa,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;KACrB;IAEM,UAAU;QACb,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAA;QAC/B,IAAI,CAAC,OAAO,EAAE,CAAA;KACjB;IAEM,OAAO;;QACV,MAAA,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,0CAAE,KAAK,EAAE,CAAA;KAC5C;IAED,MAAM;QACF,QACI,8DACI,kEACI,2EACe,4DAAI,IAAI,CAAC,KAAK,CAAK,CAC9B,EACJ,4DAAM,EACN,iEAAU,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,EAAE,iBAE9C,YAEX,iEAAU,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,EAAE,WAE1C,CACL,EACV,mEACI,WAAW,EAAC,uBAAuB,4BAEnC,QAAQ,EAAE,CAAC,CAAc,KAAK,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,EACtD,KAAK,EAAE,IAAI,CAAC,aAAa,IAEzB,wEACI,KAAK,EAAC,SAAS,EACf,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,SAAS,UAG5B,EAClB,wEACI,KAAK,EAAC,SAAS,EACf,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,SAAS,cAG5B,EAClB,wEACI,KAAK,EAAC,WAAW,EACjB,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,WAAW,gBAG9B,CACT,CACX,EACT;KACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/dropdown/dropdown/stories/dropdown.preview.tsx"],"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}