overview-components 1.0.91 → 1.0.93

package/dist/components/components-settings/data-grid-settings.js

@@ -0,0 +1,318 @@
+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 { css, html, LitElement } from 'lit';
+import { msg } from '@lit/localize';
+//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-select-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';
+import '../../shared/lit-toggle.js';
+let DataGridSettings = class DataGridSettings extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.onSettingsChangedModal = (settingsValue) => { };
+        this.enableColumnPinning = true;
+        this.enableFiltering = true;
+        this.enableSorting = true;
+        this.enableGrouping = true;
+        this.exportData = true;
+        this.actionButtonsInMenu = false;
+        this.hideFooter = false;
+        this.isOpenModal = false;
+        this.originalValues = {};
+        this.currentValues = {};
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.initializeValues();
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        // If any of the properties changed, reinitialize values
+        const settingsProperties = [
+            'enableFiltering',
+            'enableSorting',
+            'columnDefaultSize',
+            'columnGroupedColor',
+            'rowAggregationColor',
+            'enableGrouping',
+            'exportData',
+            'actionButtonsInMenu',
+            'hideFooter',
+            'enableColumnPinning',
+        ];
+        if (settingsProperties.some((prop) => changedProperties.has(prop))) {
+            this.initializeValues();
+        }
+    }
+    initializeValues() {
+        // Store original values
+        this.originalValues = {
+            enableFiltering: this.enableFiltering,
+            enableSorting: this.enableSorting,
+            enableGrouping: this.enableGrouping,
+            exportData: this.exportData,
+            actionButtonsInMenu: this.actionButtonsInMenu,
+            hideFooter: this.hideFooter,
+            enableColumnPinning: this.enableColumnPinning,
+            columnDefaultSize: this.columnDefaultSize || 100,
+            columnGroupedColor: this.columnGroupedColor || '#f0fadf',
+            rowAggregationColor: this.rowAggregationColor || '#ffe1a8',
+        };
+        // Initialize current values with original values
+        this.currentValues = { ...this.originalValues };
+        this.localSettingsValue = {};
+    }
+    updateCurrentValue(key, value) {
+        this.currentValues = { ...this.currentValues, [key]: value };
+        this.localSettingsValue = { ...this.localSettingsValue, [key]: value };
+    }
+    trySendSettingsUpdate() {
+        this.onSettingsChangedModal?.(this.localSettingsValue);
+        this.onClose?.();
+    }
+    discardChanges() {
+        this.currentValues = { ...this.originalValues };
+        this.localSettingsValue = {};
+        this.requestUpdate();
+        this.onClose?.();
+    }
+    render() {
+        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 style=" height: calc(100vh - 37px - 54px);>
+                    <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') + '- DataGrid'}
+                            </span>
+                        </div>
+                    </div>
+                    <div style="display: flex;flex-direction: column; gap: 0.5rem">
+                        <div
+                            style="display: flex; flex-direction: column;justify-content: center;gap: 2px"
+                        >
+                            <lit-toggle
+                                .tooltip="${'Enables or disables column filtering.'}"
+                                .label="${'enableFiltering'}"
+                                .checked=${this.currentValues.enableFiltering}
+                                @change=${(e) => {
+            this.updateCurrentValue('enableFiltering', e.detail);
+        }}
+                            ></lit-toggle>
+                            <lit-toggle
+                                .tooltip="${'Enables or disables column sorting.'}"
+                                .label="${'enableSorting'}"
+                                .checked=${this.currentValues.enableSorting}
+                                @change=${(e) => {
+            this.updateCurrentValue('enableSorting', e.detail);
+        }}
+                            ></lit-toggle>
+                            <lit-toggle
+                                .tooltip="${'Enable or disable the export to CSV and Excel feature.'}"
+                                .label="${'enableExportData'}"
+                                .checked=${this.currentValues.exportData}
+                                @change=${(e) => {
+            this.updateCurrentValue('exportData', e.detail);
+        }}
+                            ></lit-toggle>
+                            <lit-toggle
+                                .tooltip="${'Enables or disables column grouping functionality. If true, users can group rows by specific columns.'}"
+                                .label="${'enableGrouping'}"
+                                .checked=${this.currentValues.enableGrouping}
+                                @change=${(e) => {
+            this.updateCurrentValue('enableGrouping', e.detail);
+        }}
+                            ></lit-toggle>
+                            <lit-toggle
+                                .tooltip="${'Enables or disables column pinning. If true, columns can be pinned to the left.'}"
+                                .label="${'enableColumnPinning'}"
+                                .checked=${this.currentValues.enableColumnPinning}
+                                @change=${(e) => {
+            this.updateCurrentValue('enableColumnPinning', e.detail);
+        }}
+                            ></lit-toggle>
+                            <lit-toggle
+                                .tooltip="${'If true, column actions like pinning and grouping are moved into a popover menu instead of displaying individual buttons in the column header.'}"
+                                .label="${'actionButtonsInMenu'}"
+                                .checked=${this.currentValues.actionButtonsInMenu}
+                                @change=${(e) => {
+            this.updateCurrentValue('actionButtonsInMenu', e.detail);
+        }}
+                            ></lit-toggle>
+
+                            <lit-label
+                                .label="${'columnDefaultSize'}"
+                                .tooltip="${'The default width of all columns.'}"
+                            ></lit-label>
+                            <lit-input
+                                style="margin: 4px 0 4px 14px"
+                                type="number"
+                                disableClearButton="true"
+                                .value="${this.currentValues.columnDefaultSize || ''}"
+                                .onInput=${(val) => {
+            this.updateCurrentValue('columnDefaultSize', val);
+        }}
+                            ></lit-input>
+                        </div>
+                        <div
+                            style="display: flex; flex-direction: column;justify-content: center;gap: 2px"
+                        >
+                            <lit-label
+                                .label="${'columnGroupedColor'}"
+                                .tooltip="${'The background color for grouped column headers.'}"
+                            ></lit-label>
+                            <input
+                                style="margin: 4px 0 4px 14px;"
+                                type="color"
+                                id="colorPickerCustom"
+                                value="${this.currentValues.columnGroupedColor}"
+                                @change=${(e) => {
+            const color = e.target.value;
+            this.updateCurrentValue('columnGroupedColor', color);
+        }}
+                            />
+                        </div>
+                        <div
+                            style="display: flex; flex-direction: column;justify-content: center;gap: 2px"
+                        >
+                            <lit-label
+                                .label="${'rowAggregationColor'}"
+                                .tooltip="${'The background color for rows affected by aggregation.'}"
+                            ></lit-label>
+                            <input
+                                style="margin: 4px 0 4px 14px"
+                                type="color"
+                                id="colorPickerCustom"
+                                value="${this.currentValues.rowAggregationColor}"
+                                @change=${(e) => {
+            const color = e.target.value;
+            this.updateCurrentValue('rowAggregationColor', color);
+        }}
+                            />
+                        </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>
+        `;
+    }
+};
+DataGridSettings.styles = [css ``];
+__decorate([
+    property({ type: Function })
+], DataGridSettings.prototype, "onClose", void 0);
+__decorate([
+    property({ type: Function })
+], DataGridSettings.prototype, "onSettingsChangedModal", void 0);
+__decorate([
+    property({ type: Boolean })
+], DataGridSettings.prototype, "enableColumnPinning", void 0);
+__decorate([
+    property({ type: Boolean })
+], DataGridSettings.prototype, "enableFiltering", void 0);
+__decorate([
+    property({ type: Boolean })
+], DataGridSettings.prototype, "enableSorting", void 0);
+__decorate([
+    property({ type: Number })
+], DataGridSettings.prototype, "columnDefaultSize", void 0);
+__decorate([
+    property({ type: String })
+], DataGridSettings.prototype, "columnGroupedColor", void 0);
+__decorate([
+    property({ type: String })
+], DataGridSettings.prototype, "rowAggregationColor", void 0);
+__decorate([
+    property({ type: Boolean })
+], DataGridSettings.prototype, "enableGrouping", void 0);
+__decorate([
+    property({ type: Boolean })
+], DataGridSettings.prototype, "exportData", void 0);
+__decorate([
+    property({ type: Boolean })
+], DataGridSettings.prototype, "actionButtonsInMenu", void 0);
+__decorate([
+    property({ type: Boolean })
+], DataGridSettings.prototype, "hideFooter", void 0);
+__decorate([
+    state()
+], DataGridSettings.prototype, "isOpenModal", void 0);
+__decorate([
+    state()
+], DataGridSettings.prototype, "localSettingsValue", void 0);
+__decorate([
+    state()
+], DataGridSettings.prototype, "originalValues", void 0);
+__decorate([
+    state()
+], DataGridSettings.prototype, "currentValues", void 0);
+DataGridSettings = __decorate([
+    customElement('data-grid-settings')
+], DataGridSettings);
+export { DataGridSettings };
+//# sourceMappingURL=data-grid-settings.js.map

package/dist/components/components-settings/data-grid-settings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-grid-settings.js","sourceRoot":"","sources":["../../../src/components/components-settings/data-grid-settings.ts"],"names":[],"mappings":"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"}

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"}