overview-components 1.0.98 → 1.0.100

package/dist/components/components-settings/section-tab-settings.js

@@ -0,0 +1,269 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { customElement, property, state } from 'lit/decorators.js';
+import { html, LitElement } from 'lit';
+import { IconArray } from '../../shared/lit-icon.js';
+import { msg } from '@lit/localize';
+import { litSectionTabSchema } from '../../schemas/index.js';
+import { validateJson } from '../../utils/validate-json-schema.js';
+//components
+import '../../shared/lit-icon.js';
+import '../../shared/lit-input.js';
+import '../../shared/simple-popper.js';
+import '../../assets/illustration/not-found.js';
+import '../../assets/illustration/settings-illustration.js';
+import '../../shared/lit-menu.js';
+import '../../shared/lit-menu-item.js';
+import '../../shared/lit-button.js';
+import '../../shared/lit-icon-button.js';
+import '../../shared/lit-text-field.js';
+import '../../shared/lit-modal.js';
+import '../../shared/lit-checkbox.js';
+import '../../shared/lit-icon-button.js';
+import '../../shared/lit-modal-header.js';
+import '../../shared/lit-modal-footer.js';
+import '../../shared/lit-modal-body.js';
+import '../../shared/lit-label.js';
+let SectionTabSettings = class SectionTabSettings extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.onSettingsChangedModal = (settingsValue) => { };
+        this.allowedLang = ['cs'];
+        this.isOpen = false;
+        this.filterText = '';
+        this.isOpenModal = false;
+    }
+    updated(changedProperties) {
+        if (changedProperties.has('settingsValue')) {
+            this.localSettingsValue = this.settingsValue ? { ...this.settingsValue } : {};
+            this.requestUpdate();
+        }
+    }
+    trySendSettingsUpdate() {
+        const { valid, errors } = validateJson(this.localSettingsValue, litSectionTabSchema);
+        if (!valid)
+            return console.warn('Invalid settings:', errors);
+        if (valid) {
+            this.onSettingsChangedModal?.(this.localSettingsValue);
+            if (this.onClose) {
+                this.onClose();
+            }
+        }
+    }
+    updateLocalSettings(updates) {
+        this.localSettingsValue = {
+            ...this.localSettingsValue,
+            ...updates,
+        };
+    }
+    closePopover() {
+        this.isOpen = false;
+    }
+    toggleCustomPopover() {
+        this.isOpen = !this.isOpen;
+    }
+    discardChanges() {
+        this.localSettingsValue = this.settingsValue ? { ...this.settingsValue } : {};
+        if (this.onClose) {
+            this.onClose();
+        }
+    }
+    render() {
+        const filteredKeys = (IconArray || []).filter((key) => key.toLowerCase().includes(this.filterText));
+        return html `
+            <lit-modal
+                .open=${this.isOpenModal}
+                .onClose=${() => {
+            this.onClose?.();
+        }}
+                .closeOnOutsideClick=${false}
+                .fullScreen=${window.innerWidth <=
+            (parseInt(getComputedStyle(document.documentElement).getPropertyValue('--breakpoint-sm')) || 600)}
+            >
+                <lit-modal-header
+                    style="display: flex; align-items: center; justify-content: flex-end;"
+                >
+                    <lit-icon-button
+                        .icon="${'close'}"
+                        variant="${'text'}"
+                        size="${'small'}"
+                        @click=${() => this.onClose?.()}
+                    ></lit-icon-button>
+                </lit-modal-header>
+                <lit-modal-body>
+                    <div style="display: flex; flex-direction: column; gap: 0.5rem">
+                        <div
+                            style="display: flex; flex-direction: column; align-items: center; font-size: 1rem; font-weight: 500;"
+                        >
+                            <div style="max-height: 5rem; max-width: 5rem">
+                                <settings-illustration></settings-illustration>
+                            </div>
+                            <span
+                                style="font-size: 0.875rem; font-weight: 500 ; color: var(--text-secondary, #777);"
+                            >
+                                ${msg('Konfigurace') + '- SectionTab'}
+                            </span>
+                        </div>
+                        <lit-checkbox
+                            .label="${msg('Automatická výška sekce')}"
+                            .checked=${this.localSettingsValue?.[`autoHeight`] ?? false}
+                            @change=${(e) => {
+            this.updateLocalSettings({ autoHeight: e.detail });
+        }}
+                            .value="autoHeight"
+                        ></lit-checkbox>
+                        <div style="display: flex; align-items: center; gap: 1rem;">
+                            <lit-label label=${msg('Icona Sekce')}></lit-label>
+                            <lit-icon-button
+                                variant="dashed"
+                                size="medium"
+                                .icon="${this.localSettingsValue?.titleIcon || 'documents'}"
+                                @click="${this.toggleCustomPopover}"
+                            ></lit-icon-button>
+                        </div>
+
+                        <simple-popper
+                            .showing=${this.isOpen}
+                            .placement=${'bottom-start'}
+                            .onClose=${this.closePopover.bind(this)}
+                            .manualOpening=${true}
+                        >
+                            <style>
+                                .icon-menu {
+                                    display: flex;
+                                    flex-wrap: wrap;
+                                    gap: 0.5rem;
+                                    padding: 0.5rem;
+                                }
+                                .icon-select-item {
+                                    cursor: pointer;
+                                    width: 2.5rem;
+                                    height: 2.5rem;
+                                    display: flex;
+                                    align-items: center;
+                                    justify-content: center;
+                                    border-radius: var(--border-radius-small, 4px);
+                                    transition: background 0.15s;
+                                }
+                                .icon-select-item:hover {
+                                    background-color: var(--color-primary-light, #e0e7ff);
+                                }
+                            </style>
+                            <div
+                                style="max-height: 12.5rem; height: 12.5rem; overflow-y: auto; width: 500px; max-width: 100%;"
+                            >
+                                <div class="popper-input">
+                                    <lit-input
+                                        .value=${this.filterText}
+                                        .onInput=${(value) => {
+            this.filterText = value?.toLowerCase?.() || '';
+        }}
+                                        .onClear=${() => {
+            this.filterText = '';
+        }}
+                                        placeholder="${msg('Zadejte název ikony')}"
+                                    ></lit-input>
+                                </div>
+
+                                <div class="icon-menu">
+                                    ${filteredKeys.map((key) => html `
+                                            <div
+                                                class="icon-select-item"
+                                                @click=${() => {
+            this.updateLocalSettings({
+                titleIcon: key,
+            });
+            this.closePopover();
+        }}
+                                                .isActive=${this.localSettingsValue?.titleIcon ===
+            key}
+                                            >
+                                                <lit-icon size="1rem" icon="${key}"></lit-icon>
+                                            </div>
+                                        `)}
+                                </div>
+                            </div>
+                        </simple-popper>
+                        <div>
+                            <lit-text-field
+                                .label="${msg('Název sekce')}"
+                                .value=${this.localSettingsValue?.titleLabel || ''}
+                                .placeholder="${msg('Zadejte název sekce')}"
+                                @onChange="${(e) => {
+            this.updateLocalSettings({ titleLabel: e.detail });
+        }}"
+                            ></lit-text-field>
+
+                            ${(this.allowedLang || []).map((lang) => html `
+                                    <lit-text-field
+                                        .label=${`${msg('Název sekce')} ${lang.toUpperCase()}`}
+                                        .placeholder=${`${msg('Zadejte název')} ${lang.toUpperCase()}`}
+                                        .value=${this.localSettingsValue?.[`titleLabel_${lang}`] ||
+            ''}
+                                        @onChange=${(e) => {
+            this.updateLocalSettings({
+                [`titleLabel_${lang}`]: e.detail,
+            });
+        }}
+                                    ></lit-text-field>
+                                `)}
+                        </div>
+                    </div>
+                </lit-modal-body>
+                <lit-modal-footer
+                    style=" display: flex;
+            flex-direction: row;
+            gap: 0.5rem;
+            justify-content: center;"
+                >
+                    <lit-button
+                        .label="${msg('Uložit')}"
+                        .icon="${'check'}"
+                        .size="${'medium'}"
+                        @click=${() => this.trySendSettingsUpdate()}
+                    ></lit-button>
+                    <lit-button
+                        .label="${msg('Zrušit')}"
+                        variant="${'text'}"
+                        .icon="${'close'}"
+                        .size="${'medium'}"
+                        @click=${() => this.discardChanges()}
+                    ></lit-button>
+                </lit-modal-footer>
+            </lit-modal>
+        `;
+    }
+};
+__decorate([
+    property({ type: Object })
+], SectionTabSettings.prototype, "settingsValue", void 0);
+__decorate([
+    property({ type: Function })
+], SectionTabSettings.prototype, "onSettingsChangedModal", void 0);
+__decorate([
+    property({ type: Array })
+], SectionTabSettings.prototype, "allowedLang", void 0);
+__decorate([
+    property({ type: Function })
+], SectionTabSettings.prototype, "onClose", void 0);
+__decorate([
+    state()
+], SectionTabSettings.prototype, "isOpen", void 0);
+__decorate([
+    state()
+], SectionTabSettings.prototype, "filterText", void 0);
+__decorate([
+    state()
+], SectionTabSettings.prototype, "localSettingsValue", void 0);
+__decorate([
+    state()
+], SectionTabSettings.prototype, "isOpenModal", void 0);
+SectionTabSettings = __decorate([
+    customElement('section-tab-settings')
+], SectionTabSettings);
+export { SectionTabSettings };
+//# sourceMappingURL=section-tab-settings.js.map

package/dist/components/components-settings/section-tab-settings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"section-tab-settings.js","sourceRoot":"","sources":["../../../src/components/components-settings/section-tab-settings.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAO,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAQ,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAE3D,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAEpC,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AACnE,YAAY;AACZ,OAAO,0BAA0B,CAAC;AAClC,OAAO,2BAA2B,CAAC;AACnC,OAAO,+BAA+B,CAAC;AACvC,OAAO,wCAAwC,CAAC;AAChD,OAAO,oDAAoD,CAAC;AAC5D,OAAO,0BAA0B,CAAC;AAClC,OAAO,+BAA+B,CAAC;AACvC,OAAO,4BAA4B,CAAC;AACpC,OAAO,iCAAiC,CAAC;AACzC,OAAO,gCAAgC,CAAC;AACxC,OAAO,2BAA2B,CAAC;AACnC,OAAO,8BAA8B,CAAC;AACtC,OAAO,iCAAiC,CAAC;AACzC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kCAAkC,CAAC;AAC1C,OAAO,gCAAgC,CAAC;AACxC,OAAO,2BAA2B,CAAC;AAQ5B,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IAA3C;;QAE2B,2BAAsB,GAAc,CAC9D,aAAsD,EACxD,EAAE,GAAE,CAAC,CAAC;QACmB,gBAAW,GAAa,CAAC,IAAI,CAAC,CAAC;QAGzC,WAAM,GAAG,KAAK,CAAC;QACf,eAAU,GAAW,EAAE,CAAC;QAExB,gBAAW,GAAG,KAAK,CAAC;IA6NzC,CAAC;IA3NG,OAAO,CAAC,iBAAmC;QACvC,IAAI,iBAAiB,CAAC,GAAG,CAAC,eAAe,CAAC,EAAE,CAAC;YACzC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;YAC9E,IAAI,CAAC,aAAa,EAAE,CAAC;QACzB,CAAC;IACL,CAAC;IAEO,qBAAqB;QACzB,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,YAAY,CAAC,IAAI,CAAC,kBAAkB,EAAE,mBAAmB,CAAC,CAAC;QACrF,IAAI,CAAC,KAAK;YAAE,OAAO,OAAO,CAAC,IAAI,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;QAE7D,IAAI,KAAK,EAAE,CAAC;YACR,IAAI,CAAC,sBAAsB,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;YACvD,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;gBACf,IAAI,CAAC,OAAO,EAAE,CAAC;YACnB,CAAC;QACL,CAAC;IACL,CAAC;IAEO,mBAAmB,CACvB,OAEC;QAED,IAAI,CAAC,kBAAkB,GAAG;YACtB,GAAG,IAAI,CAAC,kBAAkB;YAC1B,GAAG,OAAO;SACb,CAAC;IACN,CAAC;IAEO,YAAY;QAChB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;IACxB,CAAC;IAEO,mBAAmB;QACvB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;IAC/B,CAAC;IAEO,cAAc;QAClB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAC9E,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACf,IAAI,CAAC,OAAO,EAAE,CAAC;QACnB,CAAC;IACL,CAAC;IAED,MAAM;QACF,MAAM,YAAY,GAAG,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAClD,GAAG,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,CAC9C,CAAC;QAEF,OAAO,IAAI,CAAA;;wBAEK,IAAI,CAAC,WAAW;2BACb,GAAG,EAAE;YACZ,IAAI,CAAC,OAAO,EAAE,EAAE,CAAC;QACrB,CAAC;uCACsB,KAAK;8BACd,MAAM,CAAC,UAAU;YAC/B,CAAC,QAAQ,CACL,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CACjF,IAAI,GAAG,CAAC;;;;;;iCAMQ,OAAO;mCACL,MAAM;gCACT,OAAO;iCACN,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE;;;;;;;;;;;;;;kCAcrB,GAAG,CAAC,aAAa,CAAC,GAAG,cAAc;;;;sCAI/B,GAAG,CAAC,yBAAyB,CAAC;uCAC7B,IAAI,CAAC,kBAAkB,EAAE,CAAC,YAAY,CAAC,IAAI,KAAK;sCACjD,CAAC,CAAuB,EAAE,EAAE;YAClC,IAAI,CAAC,mBAAmB,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC;QACvD,CAAC;;;;+CAIkB,GAAG,CAAC,aAAa,CAAC;;;;yCAIxB,IAAI,CAAC,kBAAkB,EAAE,SAAS,IAAI,WAAW;0CAChD,IAAI,CAAC,mBAAmB;;;;;uCAK3B,IAAI,CAAC,MAAM;yCACT,cAAc;uCAChB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;6CACtB,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;iDA4BA,IAAI,CAAC,UAAU;mDACb,CAAC,KAAa,EAAE,EAAE;YACzB,IAAI,CAAC,UAAU,GAAG,KAAK,EAAE,WAAW,EAAE,EAAE,IAAI,EAAE,CAAC;QACnD,CAAC;mDACU,GAAG,EAAE;YACZ,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QACzB,CAAC;uDACc,GAAG,CAAC,qBAAqB,CAAC;;;;;sCAK3C,YAAY,CAAC,GAAG,CACd,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAA;;;yDAGI,GAAG,EAAE;YACV,IAAI,CAAC,mBAAmB,CAAC;gBACrB,SAAS,EAAE,GAAW;aACzB,CAAC,CAAC;YACH,IAAI,CAAC,YAAY,EAAE,CAAC;QACxB,CAAC;4DACW,IAAI,CAAC,kBAAkB,EAAE,SAAS;YAC9C,GAAG;;8EAE2B,GAAG;;yCAExC,CACJ;;;;;;0CAMK,GAAG,CAAC,aAAa,CAAC;yCACnB,IAAI,CAAC,kBAAkB,EAAE,UAAU,IAAI,EAAE;gDAClC,GAAG,CAAC,qBAAqB,CAAC;6CAC7B,CAAC,CAAsB,EAAE,EAAE;YACpC,IAAI,CAAC,mBAAmB,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC;QACvD,CAAC;;;8BAGH,CAAC,IAAI,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,GAAG,CAC1B,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;iDAEG,GAAG,GAAG,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,EAAE;uDACvC,GAAG,GAAG,CAAC,eAAe,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,EAAE;iDACrD,IAAI,CAAC,kBAAkB,EAAE,CAAC,cAAc,IAAI,EAAE,CAAC;YACxD,EAAE;oDACU,CAAC,CAAsB,EAAE,EAAE;YACnC,IAAI,CAAC,mBAAmB,CAAC;gBACrB,CAAC,cAAc,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,MAAM;aACnC,CAAC,CAAC;QACP,CAAC;;iCAER,CACJ;;;;;;;;;;;kCAWK,GAAG,CAAC,QAAQ,CAAC;iCACd,OAAO;iCACP,QAAQ;iCACR,GAAG,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE;;;kCAGjC,GAAG,CAAC,QAAQ,CAAC;mCACZ,MAAM;iCACR,OAAO;iCACP,QAAQ;iCACR,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE;;;;SAInD,CAAC;IACN,CAAC;CACJ,CAAA;AAvO+B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yDAAwD;AACrD;IAA7B,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;kEAErB;AACmB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;uDAAgC;AAC5B;IAA7B,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;mDAAmC;AAE/C;IAAhB,KAAK,EAAE;kDAAwB;AACf;IAAhB,KAAK,EAAE;sDAAiC;AACxB;IAAhB,KAAK,EAAE;8DAAqE;AAC5D;IAAhB,KAAK,EAAE;uDAA6B;AAX5B,kBAAkB;IAD9B,aAAa,CAAC,sBAAsB,CAAC;GACzB,kBAAkB,CAwO9B"}