overview-components 1.0.93 → 1.0.95

package/dist/components/lit-case-variables-tab.js

@@ -1,106 +1,81 @@
-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 "../node_modules/@lit/reactive-element/reactive-element.js";
+import { html as o } from "../node_modules/lit-html/lit-html.js";
+import { LitElement as x } from "../node_modules/lit-element/lit-element.js";
+import { unsafeHTML as f } from "../node_modules/lit-html/directives/unsafe-html.js";
+import { styleMap as u } from "../node_modules/lit-html/directives/style-map.js";
+import { customElement as $ } from "../node_modules/@lit/reactive-element/decorators/custom-element.js";
+import { property as g } from "../node_modules/@lit/reactive-element/decorators/property.js";
+import { state as b } from "../node_modules/@lit/reactive-element/decorators/state.js";
+import w from "../node_modules/sortablejs/modular/sortable.esm.js";
+import { repeat as C } from "../node_modules/lit-html/directives/repeat.js";
+import { tooltip as S } from "../shared/simple-tooltip.js";
+import { formatDate as k } from "../utils/date.js";
+import { formatCurrency as L } from "../utils/currency.js";
+import { setLocale as z } from "../utils/localization.js";
+import { msg as v } from "../node_modules/@lit/localize/init/install.js";
+import "../node_modules/@lit/localize/init/runtime.js";
+import { l as _ } from "../node_modules/lodash/lodash.js";
+import { css as I } from "../node_modules/@lit/reactive-element/css-tag.js";
+var B = Object.defineProperty, O = Object.getOwnPropertyDescriptor, d = (t, r, e, i) => {
+  for (var s = i > 1 ? void 0 : i ? O(r, e) : r, a = t.length - 1, p; a >= 0; a--)
+    (p = t[a]) && (s = (i ? p(r, e, s) : p(s)) || s);
+  return i && s && B(r, e, s), s;
 };
-import { LitElement, html, css } from 'lit';
-import { unsafeHTML } from 'lit/directives/unsafe-html.js';
-import { styleMap } from 'lit/directives/style-map.js';
-import { customElement, property, state } from 'lit/decorators.js';
-import Sortable from 'sortablejs';
-import { repeat } from 'lit/directives/repeat.js';
-// components
-import '../shared/lit-icon.js';
-import '../shared/lit-button.js';
-import '../shared/lit-menu.js';
-import '../shared/lit-menu-item.js';
-import '../shared/lit-checkbox.js';
-import '../shared/lit-input.js';
-import '../shared/simple-popper.js';
-import '../assets/illustration/not-found.js';
-import { tooltip } from '../shared/simple-tooltip.js';
-import '../shared/lit-tooltip.js';
-import '../shared/lit-progress-bar.js';
-// utils
-import { formatDate } from '../utils/date.js';
-import { formatCurrency } from '../utils/currency.js';
-import { setLocale } from '../utils/localization.js';
-import { msg } from '@lit/localize';
-import { isEqual } from 'lodash';
-let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.rows = [];
-        this.data = {};
-        this.hideTabWhen = false;
-        this.userLang = 'cs';
-        this.dateFormat = null;
-        this.isLoading = false;
-        this.enableSettings = false;
-        this.gridVariables = false;
-        this.onSettingsChanged = (rows) => { };
-        this.currentBreakpoint = this.getBreakpoint();
-        this.isOpen = false;
-        this.filterText = '';
-        this.isMobile = window.innerWidth <= 600;
-        this._resizeListener = this.handleResize.bind(this);
-        this.sortableInstances = [];
-        this.sortableGroupId = `group-${Math.random().toString(36).substring(2, 9)}`;
-        this.backgroundColorOptions = [
-            {
-                backgroundColor: 'transparent',
-                border: '1px solid white',
-            },
-            {
-                backgroundColor: 'var(--color-success-light)',
-                border: '1px solid var(--color-success-dark)',
-            },
-            {
-                backgroundColor: 'var(--color-error-light)',
-                border: '1px solid var(--color-error-dark)',
-            },
-            {
-                backgroundColor: 'var(--color-warning-light)',
-                border: '1px solid var(--color-warning-dark)',
-            },
-            {
-                backgroundColor: 'var(--color-info-light)',
-                border: '1px solid var(--color-info-dark)',
-            },
-            {
-                backgroundColor: 'var(--color-primary-light)',
-                border: '1px solid var(--color-primary-dark)',
-            },
-        ];
-        this.language = 'cs';
-        this.BREAKPOINTS = ['xs', 'sm', 'md', 'lg', 'xl'];
-        this.handleSettingsChanged = (newRows) => {
-            this.onSettingsChanged?.(newRows);
-        };
-        this.getHeaderActions = (cell) => {
-            const activeSize = cell.size?.lg ?? 1;
-            return html `<div class="header-buttons">
-            ${this.enableSettings
-                ? html `
+let n = class extends x {
+  constructor() {
+    super(...arguments), this.rows = [], this.data = {}, this.hideTabWhen = !1, this.userLang = "cs", this.dateFormat = null, this.isLoading = !1, this.enableSettings = !1, this.gridVariables = !1, this.onSettingsChanged = (t) => {
+    }, this.currentBreakpoint = this.getBreakpoint(), this.isOpen = !1, this.filterText = "", this.isMobile = window.innerWidth <= 600, this._resizeListener = this.handleResize.bind(this), this.sortableInstances = [], this.sortableGroupId = `group-${Math.random().toString(36).substring(2, 9)}`, this.backgroundColorOptions = [
+      {
+        backgroundColor: "transparent",
+        border: "1px solid white"
+      },
+      {
+        backgroundColor: "var(--color-success-light)",
+        border: "1px solid var(--color-success-dark)"
+      },
+      {
+        backgroundColor: "var(--color-error-light)",
+        border: "1px solid var(--color-error-dark)"
+      },
+      {
+        backgroundColor: "var(--color-warning-light)",
+        border: "1px solid var(--color-warning-dark)"
+      },
+      {
+        backgroundColor: "var(--color-info-light)",
+        border: "1px solid var(--color-info-dark)"
+      },
+      {
+        backgroundColor: "var(--color-primary-light)",
+        border: "1px solid var(--color-primary-dark)"
+      }
+    ], this.language = "cs", this.BREAKPOINTS = ["xs", "sm", "md", "lg", "xl"], this.handleSettingsChanged = (t) => {
+      var r;
+      (r = this.onSettingsChanged) == null || r.call(this, t);
+    }, this.getHeaderActions = (t) => {
+      var e, i;
+      const r = ((e = t.size) == null ? void 0 : e.lg) ?? 1;
+      return o`<div class="header-buttons">
+            ${this.enableSettings ? o`
                       <perf-tooltip placement="top">
                           <lit-icon slot="trigger" icon="cog" size="1rem"></lit-icon>
                           <div slot="tooltip">
                               <div class="settings-buttons" style="justify-content: space-between">
-                                  ${this.gridVariables
-                    ? html `<div></div>`
-                    : html `
+                                  ${this.gridVariables ? o`<div></div>` : o`
                                             <div>
-                                                ${[1, 2, 3, 4].map((size) => html `
+                                                ${[1, 2, 3, 4].map(
+        (s) => o`
                                                         <span
-                                                            @click=${() => this.setCellSize(size, cell)}
-                                                            class="size-button ${activeSize === size
-                        ? 'size-button--active'
-                        : ''}"
+                                                            @click=${() => this.setCellSize(
+          s,
+          t
+        )}
+                                                            class="size-button ${r === s ? "size-button--active" : ""}"
                                                         >
-                                                            ${size}
+                                                            ${s}
                                                         </span>
-                                                    `)}
+                                                    `
+      )}
                                             </div>
                                         `}
 
@@ -108,37 +83,41 @@ let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
                                       icon="trash"
                                       size="1rem"
                                       style="cursor: pointer"
-                                      @click=${() => this.removeCellFromRows(cell.field)}
+                                      @click=${() => this.removeCellFromRows(t.field)}
                                   ></lit-icon>
                               </div>
-                              <div class="color-label">${msg('Barva pozadí')}:</div>
+                              <div class="color-label">${v("Barva pozadí")}:</div>
                               <div class="settings-buttons">
-                                  ${this.backgroundColorOptions.map((option) => html `
+                                  ${this.backgroundColorOptions.map(
+        (s) => o`
                                           <div>
                                               <div
-                                                  @click=${() => this.setCellStyle({
-                    backgroundColor: option.backgroundColor,
-                    borderRadius: '8px',
-                    border: option.border,
-                }, cell)}
+                                                  @click=${() => this.setCellStyle(
+          {
+            backgroundColor: s.backgroundColor,
+            borderRadius: "8px",
+            border: s.border
+          },
+          t
+        )}
                                                   class="cell-background"
-                                                  style="background-color: ${option.backgroundColor}; border: ${option.border}"
+                                                  style="background-color: ${s.backgroundColor}; border: ${s.border}"
                                               ></div>
                                               <div
-                                                  class="${this.isActiveBackground(cell, option.backgroundColor)
-                    ? 'cell-background--active'
-                    : ''}"
+                                                  class="${this.isActiveBackground(
+          t,
+          s.backgroundColor
+        ) ? "cell-background--active" : ""}"
                                               ></div>
                                           </div>
-                                      `)}
+                                      `
+      )}
                               </div>
-                              <div class="color-label">${msg('Tučné písmo')}:</div>
+                              <div class="color-label">${v("Tučné písmo")}:</div>
                               <div class="settings-buttons">
                                   <span
-                                      class="bold-toggle ${cell?.valueStyle?.fontWeight === 'bold'
-                    ? 'bold-toggle--active'
-                    : ''}"
-                                      @click=${() => this.setFontWeight(cell)}
+                                      class="bold-toggle ${((i = t == null ? void 0 : t.valueStyle) == null ? void 0 : i.fontWeight) === "bold" ? "bold-toggle--active" : ""}"
+                                      @click=${() => this.setFontWeight(t)}
                                   >
                                       B
                                   </span>
@@ -149,339 +128,250 @@ let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
                       <div class="drag-handle">
                           <lit-icon icon="hamburger" size="1rem"></lit-icon>
                       </div>
-                  `
-                : null}
+                  ` : null}
         </div>`;
-        };
-        this.getHeaderLabel = (cell) => {
-            return html ` <div
-            style="${cell?.headerStyle ? styleMap(cell?.headerStyle) : ''}"
+    }, this.getHeaderLabel = (t) => o` <div
+            style="${t != null && t.headerStyle ? u(t == null ? void 0 : t.headerStyle) : ""}"
             class="process-data-heading"
         >
-            ${cell?.[`headerName_${this.userLang}`] ||
-                cell?.headerName ||
-                ''}
-            ${cell.tooltip
-                ? html `
+            ${(t == null ? void 0 : t[`headerName_${this.userLang}`]) || (t == null ? void 0 : t.headerName) || ""}
+            ${t.tooltip ? o`
                       <lit-icon
-                          ${tooltip(cell?.[`tooltip_${this.userLang}`] ??
-                    cell?.tooltip, 'right', 100)}
+                          ${S(
+      (t == null ? void 0 : t[`tooltip_${this.userLang}`]) ?? (t == null ? void 0 : t.tooltip),
+      "right",
+      100
+    )}
                           size="12px"
                           icon="informative"
                       ></lit-icon>
-                  `
-                : ''}
-        </div>`;
-        };
-        this.getHeader = (cell) => {
-            return html ` <div class="header-cell">
-            ${this.getHeaderLabel(cell)} ${this.getHeaderActions(cell)}
-        </div>`;
-        };
-        this.getCellButton = (cell) => {
-            return html `
+                  ` : ""}
+        </div>`, this.getHeader = (t) => o` <div class="header-cell">
+            ${this.getHeaderLabel(t)} ${this.getHeaderActions(t)}
+        </div>`, this.getCellButton = (t) => o`
             <div style="display: flex; justify-content: space-between">
                 <lit-button
                     style="flex-grow: 1; margin-right: 0.5rem"
-                    .fullWidth="${cell.buttonFullWidth}"
-                    variant="${cell.buttonVariant || 'contained'}"
-                    label="${cell?.headerName}"
-                    @click=${cell?.buttonFn}
+                    .fullWidth="${t.buttonFullWidth}"
+                    variant="${t.buttonVariant || "contained"}"
+                    label="${t == null ? void 0 : t.headerName}"
+                    @click=${t == null ? void 0 : t.buttonFn}
                 ></lit-button>
-                ${this.getHeaderActions(cell)}
+                ${this.getHeaderActions(t)}
             </div>
-        `;
-        };
-        this.getCellLink = (cell) => {
-            return html `<div>${this.getHeader(cell)}</div>
-            <a class="link" href=${cell?.value ? cell.value : ''} target="_blank"
-                >${cell?.value ? cell.value : ''}
-            </a> `;
-        };
-        this.getCellValue = (cell) => {
-            const rawValue = cell?.[`value_${this.userLang}`] || cell?.value || '';
-            const value = typeof rawValue === 'string' ? rawValue : String(rawValue ?? '');
-            return html `<div>${this.getHeader(cell)}</div>
+        `, this.getCellLink = (t) => o`<div>${this.getHeader(t)}</div>
+            <a class="link" href=${t != null && t.value ? t.value : ""} target="_blank"
+                >${t != null && t.value ? t.value : ""}
+            </a> `, this.getCellValue = (t) => {
+      const r = (t == null ? void 0 : t[`value_${this.userLang}`]) || (t == null ? void 0 : t.value) || "", e = typeof r == "string" ? r : String(r ?? "");
+      return o`<div>${this.getHeader(t)}</div>
             <div
-                style="${cell?.valueStyle ? styleMap(cell?.valueStyle) : ''}"
+                style="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
                 class="process-data-value"
             >
-                ${unsafeHTML(value)}
+                ${f(e)}
             </div> `;
-        };
-        this.getCellDate = (cell) => {
-            return html `<div>${this.getHeader(cell)}</div>
+    }, this.getCellDate = (t) => o`<div>${this.getHeader(t)}</div>
             <div
-                style="${cell?.valueStyle ? styleMap(cell?.valueStyle) : ''}"
+                style="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
                 class="process-data-value"
             >
-                ${cell?.value
-                ? formatDate(cell.value, this.userLang || 'cs', !!this.dateFormat, this.dateFormat)
-                : ''}
-            </div> `;
-        };
-        this.getCellCurrency = (cell) => {
-            return html `<div>${this.getHeader(cell)}</div>
+                ${t != null && t.value ? k(
+      t.value,
+      this.userLang || "cs",
+      !!this.dateFormat,
+      this.dateFormat
+    ) : ""}
+            </div> `, this.getCellCurrency = (t) => o`<div>${this.getHeader(t)}</div>
             <div
-                style="${cell?.valueStyle ? styleMap(cell?.valueStyle) : ''}"
+                style="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
                 class="process-data-value"
             >
-                ${cell?.value ? formatCurrency(cell.value, this.userLang || 'cs') : ''}
-            </div> `;
-        };
-        this.getCellProgress = (cell) => {
-            return html `<div>${this.getHeader(cell)}</div>
+                ${t != null && t.value ? L(t.value, this.userLang || "cs") : ""}
+            </div> `, this.getCellProgress = (t) => o`<div>${this.getHeader(t)}</div>
             <div
-                style="${cell?.valueStyle ? styleMap(cell?.valueStyle) : ''}"
+                style="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
                 class="process-data-value"
             >
-                <lit-progress-bar .progress="${cell?.value}"></lit-progress-bar>
-            </div> `;
-        };
-        this.getInlineCellValue = (cell) => {
-            const rawValue = cell?.[`value_${this.userLang}`] || cell?.value || '';
-            const value = typeof rawValue === 'string' ? rawValue : String(rawValue ?? '');
-            return html `
+                <lit-progress-bar .progress="${t == null ? void 0 : t.value}"></lit-progress-bar>
+            </div> `, this.getInlineCellValue = (t) => {
+      const r = (t == null ? void 0 : t[`value_${this.userLang}`]) || (t == null ? void 0 : t.value) || "", e = typeof r == "string" ? r : String(r ?? "");
+      return o`
             <div style="display: flex;align-items: center; justify-content: end; gap: 0.5rem">
-                <div>${this.getHeaderLabel(cell)}</div>
+                <div>${this.getHeaderLabel(t)}</div>
                 <div
-                    style="${cell?.valueStyle
-                ? styleMap(cell?.valueStyle)
-                : ''}"
+                    style="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
                     class="process-data-value"
                 >
-                    ${unsafeHTML(value)}
+                    ${f(e)}
                 </div>
-                <div>${this.getHeaderActions(cell)}</div>
+                <div>${this.getHeaderActions(t)}</div>
             </div>
         `;
-        };
-    }
-    getBreakpoint() {
-        const width = window.innerWidth;
-        if (width >= 1920)
-            return 'xl';
-        if (width >= 1280)
-            return 'lg';
-        if (width >= 960)
-            return 'md';
-        if (width >= 600)
-            return 'sm';
-        return 'xs';
+    };
+  }
+  getBreakpoint() {
+    const t = window.innerWidth;
+    return t >= 1920 ? "xl" : t >= 1280 ? "lg" : t >= 960 ? "md" : t >= 600 ? "sm" : "xs";
+  }
+  // Function to handle resize events
+  handleResize() {
+    const t = this.getBreakpoint();
+    t !== this.currentBreakpoint && (this.currentBreakpoint = t), this.isMobile = window.innerWidth <= 600;
+  }
+  connectedCallback() {
+    var t, r;
+    if (super.connectedCallback(), this.setLanguage(), window.addEventListener("resize", this._resizeListener), this.isMobile = window.innerWidth <= 600, !this.dateFormat) {
+      const e = localStorage.getItem("userSettings"), i = e ? (r = (t = JSON.parse(e)) == null ? void 0 : t.state) == null ? void 0 : r.dateFormat : void 0;
+      this.dateFormat = i;
     }
-    // Function to handle resize events
-    handleResize() {
-        const newBreakpoint = this.getBreakpoint();
-        if (newBreakpoint !== this.currentBreakpoint) {
-            this.currentBreakpoint = newBreakpoint; // Update property
-        }
-        this.isMobile = window.innerWidth <= 600;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.setLanguage();
-        window.addEventListener('resize', this._resizeListener); // Add listener
-        this.isMobile = window.innerWidth <= 600;
-        if (!this.dateFormat) {
-            const userSettings = localStorage.getItem('userSettings');
-            const storedFormat = userSettings
-                ? JSON.parse(userSettings)?.state?.dateFormat
-                : undefined;
-            this.dateFormat = storedFormat;
-        }
-    }
-    disconnectedCallback() {
-        this.destroySortables();
-        window.removeEventListener('resize', this._resizeListener); // Remove listener
-        super.disconnectedCallback();
-    }
-    firstUpdated() {
-        if (this.enableSettings) {
-            this.initSortable();
-        }
-    }
-    setFontWeight(cell) {
-        const isBold = cell.valueStyle?.fontWeight === 'bold';
-        cell.valueStyle = {
-            ...(cell.valueStyle || {}),
-            fontWeight: isBold ? '500' : 'bold',
-        };
-        this.rows = [...this.rows];
-        this.handleSettingsChanged(this.rows);
-    }
-    setCellStyle(style, cell) {
-        cell.cellStyle = style;
-        this.rows = [...this.rows];
-        this.handleSettingsChanged(this.rows);
-    }
-    destroySortables() {
-        this.sortableInstances.forEach((instance) => {
-            instance.destroy();
+  }
+  disconnectedCallback() {
+    this.destroySortables(), window.removeEventListener("resize", this._resizeListener), super.disconnectedCallback();
+  }
+  firstUpdated() {
+    this.enableSettings && this.initSortable();
+  }
+  setFontWeight(t) {
+    var e;
+    const r = ((e = t.valueStyle) == null ? void 0 : e.fontWeight) === "bold";
+    t.valueStyle = {
+      ...t.valueStyle || {},
+      fontWeight: r ? "500" : "bold"
+    }, this.rows = [...this.rows], this.handleSettingsChanged(this.rows);
+  }
+  setCellStyle(t, r) {
+    r.cellStyle = t, this.rows = [...this.rows], this.handleSettingsChanged(this.rows);
+  }
+  destroySortables() {
+    this.sortableInstances.forEach((t) => {
+      t.destroy();
+    }), this.sortableInstances = [];
+  }
+  initSortable() {
+    this.updateComplete.then(() => {
+      var r;
+      const t = (r = this.shadowRoot) == null ? void 0 : r.querySelectorAll(".grid-container");
+      t != null && t.length && t.forEach((e) => {
+        let i = [];
+        const s = w.create(e, {
+          group: this.tabId || this.sortableGroupId,
+          animation: 150,
+          handle: ".drag-handle",
+          ghostClass: "sortable-ghost",
+          chosenClass: "sortable-chosen",
+          dragClass: "sortable-drag",
+          sort: !0,
+          onStart: (a) => {
+            i = Array.from(a.from.childNodes);
+          },
+          onEnd: (a) => {
+            var c;
+            a.from.innerHTML = "", i.forEach((y) => a.from.appendChild(y));
+            const { oldIndex: p, newIndex: h } = a;
+            if (p == null || h == null || p === h) return;
+            const m = [...this.rows], [l] = m.splice(p, 1);
+            m.splice(h, 0, l), this.rows = m, (c = this.handleSettingsChanged) == null || c.call(this, m);
+          }
         });
-        this.sortableInstances = [];
+        this.sortableInstances.push(s);
+      });
+    });
+  }
+  setLanguage() {
+    const t = this.userLang || localStorage.getItem("userLang");
+    t && z(t);
+  }
+  isActiveBackground(t, r) {
+    var i;
+    const e = (i = t == null ? void 0 : t.cellStyle) == null ? void 0 : i.backgroundColor;
+    return !e && r === "transparent" ? !0 : e === r;
+  }
+  setCellSize(t, r) {
+    r.size || (r.size = {}), r.size.lg = t, this.rows = [...this.rows], this.handleSettingsChanged(this.rows);
+  }
+  removeCellFromRows(t) {
+    this.destroySortables();
+    const r = this.rows.filter((e) => e.field !== t);
+    this.rows = [], this.updateComplete.then(() => {
+      this.rows = [...r], this.initSortable(), this.handleSettingsChanged(this.rows);
+    });
+  }
+  closePopover() {
+    this.isOpen = !1;
+  }
+  toggleCustomPopover() {
+    this.isOpen = !this.isOpen;
+  }
+  get existingFields() {
+    return this.rows.flat().map((t) => t.field);
+  }
+  toggleRowCell(t) {
+    var e;
+    if (this.rows.some((i) => i.field === t))
+      this.removeCellFromRows(t);
+    else {
+      const i = (e = this.data) == null ? void 0 : e[t];
+      if (!i) return;
+      const s = this.userLang || "cs", a = i[`tvar_name_${s}`] || i.tvar_name_cs || i.tvar_name, p = i[`tvar_tooltip_${s}`] || i.tvar_tooltip_cs || i.tvar_tooltip;
+      let h;
+      switch (i.ivar_type) {
+        case "D":
+          h = "date";
+          break;
+        case "progress":
+          h = "progress";
+          break;
+        default:
+          h = "string";
+      }
+      const m = {
+        field: t,
+        type: h,
+        headerName: a,
+        value: i.ivar_value,
+        size: { xs: 4, sm: 2, md: 1, lg: 1, xl: 1 },
+        tooltip: p
+      }, l = [...this.rows];
+      l.push(m), this.rows = l, this.handleSettingsChanged(l);
     }
-    initSortable() {
-        this.updateComplete.then(() => {
-            const containers = this.shadowRoot?.querySelectorAll('.grid-container');
-            if (!containers?.length)
-                return;
-            containers.forEach((container) => {
-                let originalNodes = [];
-                const sortableInstance = Sortable.create(container, {
-                    group: this.tabId || this.sortableGroupId,
-                    animation: 150,
-                    handle: '.drag-handle',
-                    ghostClass: 'sortable-ghost',
-                    chosenClass: 'sortable-chosen',
-                    dragClass: 'sortable-drag',
-                    sort: true,
-                    onStart: (evt) => {
-                        originalNodes = Array.from(evt.from.childNodes);
-                    },
-                    onEnd: (evt) => {
-                        evt.from.innerHTML = '';
-                        originalNodes.forEach((node) => evt.from.appendChild(node));
-                        const { oldIndex, newIndex } = evt;
-                        if (oldIndex == null || newIndex == null || oldIndex === newIndex)
-                            return;
-                        const updated = [...this.rows];
-                        const [movedItem] = updated.splice(oldIndex, 1);
-                        updated.splice(newIndex, 0, movedItem);
-                        this.rows = updated;
-                        this.handleSettingsChanged?.(updated);
-                    },
-                });
-                this.sortableInstances.push(sortableInstance);
-            });
-        });
-    }
-    setLanguage() {
-        const lang = this.userLang || localStorage.getItem('userLang');
-        if (lang) {
-            setLocale(lang);
-        }
-    }
-    isActiveBackground(cell, color) {
-        const bg = cell?.cellStyle?.backgroundColor;
-        if (!bg && color === 'transparent')
-            return true; // If nothing is set → consider transparent as active
-        return bg === color;
-    }
-    setCellSize(size, cell) {
-        if (!cell.size) {
-            cell.size = {};
-        }
-        cell.size.lg = size;
-        this.rows = [...this.rows];
-        this.handleSettingsChanged(this.rows);
-    }
-    removeCellFromRows(field) {
-        this.destroySortables();
-        const updatedRows = this.rows.filter((c) => c.field !== field);
-        this.rows = [];
-        this.updateComplete.then(() => {
-            this.rows = [...updatedRows];
-            this.initSortable();
-            this.handleSettingsChanged(this.rows);
-        });
-    }
-    closePopover() {
-        this.isOpen = false;
-    }
-    toggleCustomPopover() {
-        this.isOpen = !this.isOpen;
-    }
-    get existingFields() {
-        return this.rows.flat().map((cell) => cell.field);
-    }
-    toggleRowCell(key) {
-        const exists = this.rows.some((cell) => cell.field === key);
-        if (exists) {
-            this.removeCellFromRows(key);
-        }
-        else {
-            const raw = this.data?.[key];
-            if (!raw)
-                return;
-            const lang = this.userLang || 'cs';
-            const headerName = raw[`tvar_name_${lang}`] || raw.tvar_name_cs || raw.tvar_name;
-            const tooltip = raw[`tvar_tooltip_${lang}`] || raw.tvar_tooltip_cs || raw.tvar_tooltip;
-            let type;
-            switch (raw.ivar_type) {
-                case 'D':
-                    type = 'date';
-                    break;
-                case 'progress':
-                    type = 'progress';
-                    break;
-                default:
-                    type = 'string';
-            }
-            const newCell = {
-                field: key,
-                type,
-                headerName,
-                value: raw.ivar_value,
-                size: { xs: 4, sm: 2, md: 1, lg: 1, xl: 1 },
-                tooltip,
-            };
-            const newRows = [...this.rows];
-            newRows.push(newCell);
-            this.rows = newRows;
-            this.handleSettingsChanged(newRows);
-        }
-    }
-    render() {
-        if (this.hideTabWhen)
-            return null;
-        const lang = this.userLang || 'cs';
-        const filteredKeys = Object.keys(this.data || {}).filter((key) => {
-            const item = this.data[key];
-            const name = item?.[`tvar_name_${lang}`] || key;
-            return (key.toLowerCase().includes(this.filterText) ||
-                name.toLowerCase().includes(this.filterText));
-        });
-        return html `
-            ${this.isLoading
-            ? html `<lit-loader></lit-loader>`
-            : html `
-                      <div class="grid-container ${this.gridVariables ? 'one-column' : ''}">
-                          ${repeat(this.rows, (cell, index) => cell.field, (cell) => {
-                const bpIndex = this.BREAKPOINTS.indexOf(this.currentBreakpoint);
-                const spanSize = this.BREAKPOINTS.slice(0, bpIndex + 1)
-                    .reverse()
-                    .map((bp) => cell.size?.[bp])
-                    .find((s) => s !== undefined) ?? 2;
-                const classes = `cell--span${spanSize} cell ${this.gridVariables ? 'one-column' : ''}`;
-                return html `
+  }
+  render() {
+    if (this.hideTabWhen) return null;
+    const t = this.userLang || "cs", r = Object.keys(this.data || {}).filter((e) => {
+      const i = this.data[e], s = (i == null ? void 0 : i[`tvar_name_${t}`]) || e;
+      return e.toLowerCase().includes(this.filterText) || s.toLowerCase().includes(this.filterText);
+    });
+    return o`
+            ${this.isLoading ? o`<lit-loader></lit-loader>` : o`
+                      <div class="grid-container ${this.gridVariables ? "one-column" : ""}">
+                          ${C(
+      this.rows,
+      (e, i) => e.field,
+      (e) => {
+        const i = this.BREAKPOINTS.indexOf(this.currentBreakpoint), a = `cell--span${this.BREAKPOINTS.slice(0, i + 1).reverse().map((p) => {
+          var h;
+          return (h = e.size) == null ? void 0 : h[p];
+        }).find((p) => p !== void 0) ?? 2} cell ${this.gridVariables ? "one-column" : ""}`;
+        return o`
                                       <div
-                                          class="${classes}"
-                                          style="${styleMap(cell.cellStyle || {})}"
-                                          data-field="${cell.field}"
+                                          class="${a}"
+                                          style="${u(
+          e.cellStyle || {}
+        )}"
+                                          data-field="${e.field}"
                                       >
-                                          ${this.gridVariables
-                    ? this.getInlineCellValue(cell)
-                    : cell?.type === 'button'
-                        ? this.getCellButton(cell)
-                        : cell.type === 'link'
-                            ? this.getCellLink(cell)
-                            : cell.type === 'progress'
-                                ? this.getCellProgress(cell)
-                                : cell.type === 'currency'
-                                    ? this.getCellCurrency(cell)
-                                    : cell.type === 'date'
-                                        ? this.getCellDate(cell)
-                                        : this.getCellValue(cell)}
+                                          ${this.gridVariables ? this.getInlineCellValue(e) : (e == null ? void 0 : e.type) === "button" ? this.getCellButton(e) : e.type === "link" ? this.getCellLink(e) : e.type === "progress" ? this.getCellProgress(e) : e.type === "currency" ? this.getCellCurrency(e) : e.type === "date" ? this.getCellDate(e) : this.getCellValue(e)}
                                       </div>
                                   `;
-            })}
+      }
+    )}
                       </div>
-                      ${this.enableSettings
-                ? html `
+                      ${this.enableSettings ? o`
                                 <div style="text-align: right; margin-top: 1rem;">
                                     <lit-button
-                                        variant="${'dashed'}"
-                                        label="${msg('Přiřadit proměnnou')}"
+                                        variant="${"dashed"}"
+                                        label="${v("Přiřadit proměnnou")}"
                                         icon="add"
                                         .fullWidth=${this.isMobile}
                                         @click="${this.toggleCustomPopover}"
@@ -490,9 +380,9 @@ let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
 
                                     <simple-popper
                                         .showing=${this.isOpen}
-                                        .placement=${'top-end'}
-                                        .manualOpening=${true}
-                                        .maxWidthAsTarget=${false}
+                                        .placement=${"top-end"}
+                                        .manualOpening=${!0}
+                                        .maxWidthAsTarget=${!1}
                                         .onClose=${() => this.closePopover()}
                                     >
                                         <div
@@ -501,54 +391,50 @@ let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
                                         >
                                             <lit-input
                                                 .value=${this.filterText}
-                                                .onInput=${(value) => {
-                    this.filterText = value?.toLowerCase?.() || '';
-                }}
+                                                .onInput=${(e) => {
+      var i;
+      this.filterText = ((i = e == null ? void 0 : e.toLowerCase) == null ? void 0 : i.call(e)) || "";
+    }}
                                                 .onClear=${() => {
-                    this.filterText = '';
-                }}
-                                                placeholder="${msg('Zadejte název proměnné')}"
-                                                .size=${'small'}
+      this.filterText = "";
+    }}
+                                                placeholder="${v("Zadejte název proměnné")}"
+                                                .size=${"small"}
                                             ></lit-input>
                                         </div>
                                         <lit-menu tabindex="0">
-                                            ${Object.keys(this.data || {})
-                    .filter((key) => {
-                    const item = this.data[key];
-                    const lang = this.userLang || 'cs';
-                    const name = item?.[`tvar_name_${lang}`] || key;
-                    return (key
-                        .toLowerCase()
-                        .includes(this.filterText) ||
-                        name.toLowerCase().includes(this.filterText));
-                })
-                    .sort((a, b) => {
-                    const aIsUnderscore = a.startsWith('_');
-                    const bIsUnderscore = b.startsWith('_');
-                    if (aIsUnderscore && !bIsUnderscore)
-                        return 1;
-                    if (!aIsUnderscore && bIsUnderscore)
-                        return -1;
-                    return a.localeCompare(b);
-                })
-                    .map((key) => html `
+                                            ${Object.keys(this.data || {}).filter((e) => {
+      const i = this.data[e], s = this.userLang || "cs", a = (i == null ? void 0 : i[`tvar_name_${s}`]) || e;
+      return e.toLowerCase().includes(this.filterText) || a.toLowerCase().includes(this.filterText);
+    }).sort((e, i) => {
+      const s = e.startsWith("_"), a = i.startsWith("_");
+      return s && !a ? 1 : !s && a ? -1 : e.localeCompare(i);
+    }).map(
+      (e) => {
+        var i, s;
+        return o`
                                                         <lit-menu-item
-                                                            .onClick=${() => this.toggleRowCell(key)}
-                                                            .isActive=${this.existingFields.includes(key)}
+                                                            .onClick=${() => this.toggleRowCell(e)}
+                                                            .isActive=${this.existingFields.includes(
+          e
+        )}
                                                         >
                                                             <span class="menu-item--multiple">
                                                                 <lit-checkbox
                                                                     class="cursor"
-                                                                    .checked=${this.existingFields.includes(key)}
+                                                                    .checked=${this.existingFields.includes(
+          e
+        )}
                                                                 ></lit-checkbox>
-                                                                ${this.data?.[key]?.[`tvar_name_${this.userLang}`] || key}
+                                                                ${((s = (i = this.data) == null ? void 0 : i[e]) == null ? void 0 : s[`tvar_name_${this.userLang}`]) || e}
                                                             </span>
                                                         </lit-menu-item>
-                                                    `)}
+                                                    `;
+      }
+    )}
                                         </lit-menu>
 
-                                        ${isEqual(filteredKeys.length, 0)
-                    ? html `
+                                        ${_.isEqual(r.length, 0) ? o`
                                                   <div
                                                       style="display: flex;flex-direction: column; align-items: center"
                                                   >
@@ -557,21 +443,19 @@ let LitCaseVariablesTab = class LitCaseVariablesTab extends LitElement {
                                                       >
                                                           <not-found></not-found>
                                                       </div>
-                                                      ${msg('Nenalezeno')}
+                                                      ${v("Nenalezeno")}
                                                   </div>
-                                              `
-                    : null}
+                                              ` : null}
                                     </simple-popper>
                                 </div>
-                            `
-                : ''}
+                            ` : ""}
                   `}
         `;
-    }
+  }
 };
-LitCaseVariablesTab.styles = [
-    // styles,
-    css `
+n.styles = [
+  // styles,
+  I`
             :host {
                 font-family: 'Inter', sans-serif;
             }
@@ -791,52 +675,53 @@ LitCaseVariablesTab.styles = [
                     grid-template-columns: repeat(auto-fill, minmax(0, 1fr));
                 }
             }
-        `,
+        `
 ];
-__decorate([
-    property({ type: Array })
-], LitCaseVariablesTab.prototype, "rows", void 0);
-__decorate([
-    property({ type: Object })
-], LitCaseVariablesTab.prototype, "data", void 0);
-__decorate([
-    property({ type: Boolean })
-], LitCaseVariablesTab.prototype, "hideTabWhen", void 0);
-__decorate([
-    property({ type: String })
-], LitCaseVariablesTab.prototype, "userLang", void 0);
-__decorate([
-    property({ type: String })
-], LitCaseVariablesTab.prototype, "dateFormat", void 0);
-__decorate([
-    property({ type: Boolean })
-], LitCaseVariablesTab.prototype, "isLoading", void 0);
-__decorate([
-    property({ type: Boolean })
-], LitCaseVariablesTab.prototype, "enableSettings", void 0);
-__decorate([
-    property({ type: String })
-], LitCaseVariablesTab.prototype, "tabId", void 0);
-__decorate([
-    property({ type: Boolean })
-], LitCaseVariablesTab.prototype, "gridVariables", void 0);
-__decorate([
-    property({ type: Function })
-], LitCaseVariablesTab.prototype, "onSettingsChanged", void 0);
-__decorate([
-    state()
-], LitCaseVariablesTab.prototype, "currentBreakpoint", void 0);
-__decorate([
-    state()
-], LitCaseVariablesTab.prototype, "isOpen", void 0);
-__decorate([
-    state()
-], LitCaseVariablesTab.prototype, "filterText", void 0);
-__decorate([
-    state()
-], LitCaseVariablesTab.prototype, "isMobile", void 0);
-LitCaseVariablesTab = __decorate([
-    customElement('lit-case-variables-tab')
-], LitCaseVariablesTab);
-export { LitCaseVariablesTab };
-//# sourceMappingURL=lit-case-variables-tab.js.map
+d([
+  g({ type: Array })
+], n.prototype, "rows", 2);
+d([
+  g({ type: Object })
+], n.prototype, "data", 2);
+d([
+  g({ type: Boolean })
+], n.prototype, "hideTabWhen", 2);
+d([
+  g({ type: String })
+], n.prototype, "userLang", 2);
+d([
+  g({ type: String })
+], n.prototype, "dateFormat", 2);
+d([
+  g({ type: Boolean })
+], n.prototype, "isLoading", 2);
+d([
+  g({ type: Boolean })
+], n.prototype, "enableSettings", 2);
+d([
+  g({ type: String })
+], n.prototype, "tabId", 2);
+d([
+  g({ type: Boolean })
+], n.prototype, "gridVariables", 2);
+d([
+  g({ type: Function })
+], n.prototype, "onSettingsChanged", 2);
+d([
+  b()
+], n.prototype, "currentBreakpoint", 2);
+d([
+  b()
+], n.prototype, "isOpen", 2);
+d([
+  b()
+], n.prototype, "filterText", 2);
+d([
+  b()
+], n.prototype, "isMobile", 2);
+n = d([
+  $("lit-case-variables-tab")
+], n);
+export {
+  n as LitCaseVariablesTab
+};