UNPKG

@codeperate/app-asset

Version:

Codeperate App Asset

66 lines (65 loc) 2.3 kB
import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core'; import { state } from '../../../stencil-store/cdp-modal.store'; export class CdpModalStore { constructor() { this.markedClear = []; } disconnectedCallback() { if (this.unsubscribe) this.unsubscribe(); } markedClearHandler() { if (this.markedClear.length > 0) { for (const num of this.markedClear) state.modals.splice(num, 1); this.markedClear.splice(0, this.markedClear.length); } } render() { const hostClass = 'absolute block top-0 left-0 w-full' + (state.modals.length > 0 ? ' h-full' : ''); const containerClass = 'sticky w-full top-0 left-0' + (state.modals.length > 0 ? ' h-screen' : ''); return (h(Host, { class: hostClass }, h("div", { class: containerClass }, state.modals.map((modal, i) => { var _a, _b; return (h("cdp-modal", { key: i, props: { display: modal.close ? false : true }, config: (_a = modal.config) !== null && _a !== void 0 ? _a : (_b = this.config) === null || _b === void 0 ? void 0 : _b.defaultModalConfig, onClosed: e => { this.markedClear = [...this.markedClear, i]; if (modal.onClosed) modal.onClosed(e); }, onOpened: e => { if (modal.onOpened) modal.onOpened(e); } }, (() => modal.content)())); })))); } static get is() { return "cdp-modal-store"; } static get properties() { return { "config": { "type": "unknown", "mutable": false, "complexType": { "original": "{\r\n defaultModalConfig?: CdpModalConfig;\r\n }", "resolved": "{ defaultModalConfig?: any; }", "references": { "CdpModalConfig": { "location": "import", "path": "@codeperate/cdp-ui-library/dist" } } }, "required": false, "optional": false, "docs": { "tags": [], "text": "" } } }; } static get states() { return { "markedClear": {} }; } static get elementRef() { return "rootEl"; } static get watchers() { return [{ "propName": "markedClear", "methodName": "markedClearHandler" }]; } }