overview-components 1.0.92 → 1.0.95

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

@@ -0,0 +1,727 @@
+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;
+};
+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 ? o`<div></div>` : o`
+                                            <div>
+                                                ${[1, 2, 3, 4].map(
+        (s) => o`
+                                                        <span
+                                                            @click=${() => this.setCellSize(
+          s,
+          t
+        )}
+                                                            class="size-button ${r === s ? "size-button--active" : ""}"
+                                                        >
+                                                            ${s}
+                                                        </span>
+                                                    `
+      )}
+                                            </div>
+                                        `}
+
+                                  <lit-icon
+                                      icon="trash"
+                                      size="1rem"
+                                      style="cursor: pointer"
+                                      @click=${() => this.removeCellFromRows(t.field)}
+                                  ></lit-icon>
+                              </div>
+                              <div class="color-label">${v("Barva pozadí")}:</div>
+                              <div class="settings-buttons">
+                                  ${this.backgroundColorOptions.map(
+        (s) => o`
+                                          <div>
+                                              <div
+                                                  @click=${() => this.setCellStyle(
+          {
+            backgroundColor: s.backgroundColor,
+            borderRadius: "8px",
+            border: s.border
+          },
+          t
+        )}
+                                                  class="cell-background"
+                                                  style="background-color: ${s.backgroundColor}; border: ${s.border}"
+                                              ></div>
+                                              <div
+                                                  class="${this.isActiveBackground(
+          t,
+          s.backgroundColor
+        ) ? "cell-background--active" : ""}"
+                                              ></div>
+                                          </div>
+                                      `
+      )}
+                              </div>
+                              <div class="color-label">${v("Tučné písmo")}:</div>
+                              <div class="settings-buttons">
+                                  <span
+                                      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>
+                              </div>
+                          </div>
+                      </perf-tooltip>
+
+                      <div class="drag-handle">
+                          <lit-icon icon="hamburger" size="1rem"></lit-icon>
+                      </div>
+                  ` : null}
+        </div>`;
+    }, this.getHeaderLabel = (t) => o` <div
+            style="${t != null && t.headerStyle ? u(t == null ? void 0 : t.headerStyle) : ""}"
+            class="process-data-heading"
+        >
+            ${(t == null ? void 0 : t[`headerName_${this.userLang}`]) || (t == null ? void 0 : t.headerName) || ""}
+            ${t.tooltip ? o`
+                      <lit-icon
+                          ${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 = (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="${t.buttonFullWidth}"
+                    variant="${t.buttonVariant || "contained"}"
+                    label="${t == null ? void 0 : t.headerName}"
+                    @click=${t == null ? void 0 : t.buttonFn}
+                ></lit-button>
+                ${this.getHeaderActions(t)}
+            </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="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
+                class="process-data-value"
+            >
+                ${f(e)}
+            </div> `;
+    }, this.getCellDate = (t) => o`<div>${this.getHeader(t)}</div>
+            <div
+                style="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
+                class="process-data-value"
+            >
+                ${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="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
+                class="process-data-value"
+            >
+                ${t != null && t.value ? L(t.value, this.userLang || "cs") : ""}
+            </div> `, this.getCellProgress = (t) => o`<div>${this.getHeader(t)}</div>
+            <div
+                style="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
+                class="process-data-value"
+            >
+                <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(t)}</div>
+                <div
+                    style="${t != null && t.valueStyle ? u(t == null ? void 0 : t.valueStyle) : ""}"
+                    class="process-data-value"
+                >
+                    ${f(e)}
+                </div>
+                <div>${this.getHeaderActions(t)}</div>
+            </div>
+        `;
+    };
+  }
+  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;
+    }
+  }
+  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.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);
+    }
+  }
+  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="${a}"
+                                          style="${u(
+          e.cellStyle || {}
+        )}"
+                                          data-field="${e.field}"
+                                      >
+                                          ${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 ? o`
+                                <div style="text-align: right; margin-top: 1rem;">
+                                    <lit-button
+                                        variant="${"dashed"}"
+                                        label="${v("Přiřadit proměnnou")}"
+                                        icon="add"
+                                        .fullWidth=${this.isMobile}
+                                        @click="${this.toggleCustomPopover}"
+                                        class="add-variable-button"
+                                    ></lit-button>
+
+                                    <simple-popper
+                                        .showing=${this.isOpen}
+                                        .placement=${"top-end"}
+                                        .manualOpening=${!0}
+                                        .maxWidthAsTarget=${!1}
+                                        .onClose=${() => this.closePopover()}
+                                    >
+                                        <div
+                                            class="popper-input"
+                                            style="position: sticky; top: 0; z-index: 1;"
+                                        >
+                                            <lit-input
+                                                .value=${this.filterText}
+                                                .onInput=${(e) => {
+      var i;
+      this.filterText = ((i = e == null ? void 0 : e.toLowerCase) == null ? void 0 : i.call(e)) || "";
+    }}
+                                                .onClear=${() => {
+      this.filterText = "";
+    }}
+                                                placeholder="${v("Zadejte název proměnné")}"
+                                                .size=${"small"}
+                                            ></lit-input>
+                                        </div>
+                                        <lit-menu tabindex="0">
+                                            ${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(e)}
+                                                            .isActive=${this.existingFields.includes(
+          e
+        )}
+                                                        >
+                                                            <span class="menu-item--multiple">
+                                                                <lit-checkbox
+                                                                    class="cursor"
+                                                                    .checked=${this.existingFields.includes(
+          e
+        )}
+                                                                ></lit-checkbox>
+                                                                ${((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(r.length, 0) ? o`
+                                                  <div
+                                                      style="display: flex;flex-direction: column; align-items: center"
+                                                  >
+                                                      <div
+                                                          style="max-height: 7.125rem; max-width: 7.125rem"
+                                                      >
+                                                          <not-found></not-found>
+                                                      </div>
+                                                      ${v("Nenalezeno")}
+                                                  </div>
+                                              ` : null}
+                                    </simple-popper>
+                                </div>
+                            ` : ""}
+                  `}
+        `;
+  }
+};
+n.styles = [
+  // styles,
+  I`
+            :host {
+                font-family: 'Inter', sans-serif;
+            }
+
+            .header-cell {
+                min-height: 1.25rem;
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+            }
+
+            .drag-handle {
+                cursor: grab;
+                opacity: 0.6;
+                transition: opacity 0.2s;
+            }
+
+            .drag-handle:hover {
+                opacity: 1;
+            }
+
+            .grid-container {
+                display: grid;
+                justify-content: start;
+                align-items: start;
+                gap: 0.5rem;
+                border: 1px dashed transparent;
+                border-radius: var(--border-radius-small, 8px);
+                transition: border-color 0.2s;
+            }
+
+            .grid-container.sortable-drag-over {
+                border-color: var(--color-primary-main, #76b703);
+            }
+
+            .process-data-heading {
+                font-size: 0.75rem;
+                color: var(--text-secondary, #5d6371);
+                font-weight: 400 !important;
+                display: flex;
+                gap: 5px;
+                align-items: center;
+            }
+
+            .process-data-value {
+                min-height: 1.25rem;
+                font-size: 0.8125rem;
+                color: var(--text-primary, #111827);
+                margin: 0;
+                padding-top: 0.3125rem;
+                font-weight: 500;
+            }
+
+            .status {
+                color: var(--color-primary-main, #76b703);
+            }
+
+            .link {
+                font-size: 0.8125rem;
+                text-decoration: none;
+                color: var(--text-primary, #111827);
+                border-bottom: 0.0625rem solid var(--color-primary-main, #76b703);
+            }
+
+            .cell {
+                padding: 0.375rem;
+                border-radius: var(--border-radius-small, 8px);
+                border: 1px solid transparent;
+                transition: all 0.2s;
+                min-height: 2.625rem;
+            }
+
+            .cell.one-column {
+                min-height: 0 !important;
+            }
+
+            .cell.sortable-ghost {
+                opacity: 0.5;
+                border-color: var(--color-primary-main, #76b703);
+            }
+
+            .cell.sortable-chosen {
+                transform: scale(1.02);
+                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+            }
+
+            .link:hover {
+                color: var(--color-primary-main, #76b703);
+            }
+
+            .settings-buttons {
+                display: flex;
+                align-items: center;
+            }
+
+            .header-buttons {
+                display: flex;
+                gap: 0.5rem;
+            }
+
+            .size-button {
+                margin-right: 0.5rem;
+                cursor: pointer;
+            }
+
+            .size-button--active {
+                text-decoration: underline;
+                font-weight: bold;
+            }
+
+            .popper-input {
+                margin-bottom: 0.5rem;
+                background-color: var(--background-paper, #fff);
+                z-index: 1;
+            }
+
+            .cell-background {
+                width: 14px;
+                height: 14px;
+                border-radius: 4px;
+                border: 1px solid #ccc;
+                cursor: pointer;
+                margin-right: 0.5rem;
+            }
+
+            .bold-toggle {
+                cursor: pointer;
+            }
+
+            .bold-toggle--active {
+                text-decoration: underline;
+                font-weight: bold;
+            }
+
+            .color-label {
+                margin: 0.5rem 0 0.25rem 0;
+            }
+
+            .cell-background--active {
+                border-bottom: 1px solid white;
+                margin-top: 1px;
+                margin-right: 0.5rem;
+            }
+
+            .grid-container.one-column {
+                grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+                justify-content: end;
+            }
+
+            .grid-container.one-column .cell {
+                grid-column: 4 / 5;
+            }
+
+            @media (max-width: 960px) {
+                .grid-container.one-column .cell {
+                    grid-column: 3 / 5;
+                }
+            }
+
+            @media (max-width: 600px) {
+                .grid-container.one-column .cell {
+                    grid-column: 1 / -1;
+                }
+            }
+
+            .add-variable-button {
+                display: inline-block;
+            }
+
+            @media (max-width: 600px) {
+                .add-variable-button {
+                    display: block;
+                    width: 100%;
+                }
+            }
+
+            .cell--span1 {
+                grid-column: span 1 / span 1;
+            }
+            .cell--span2 {
+                grid-column: span 2 / span 2;
+            }
+            .cell--span3 {
+                grid-column: span 3 / span 3;
+            }
+            .cell--span4 {
+                grid-column: span 4 / span 4;
+            }
+
+            /* Responzívne nastavenie počtu stĺpcov */
+            @media (min-width: 0px) {
+                .grid-container {
+                    grid-template-columns: repeat(4, minmax(0, 1fr)); /* xs */
+                }
+            }
+
+            @media (min-width: var(--breakpoint-sm, 600px)) {
+                .grid-container {
+                    grid-template-columns: repeat(4, minmax(0, 1fr)); /* sm */
+                }
+            }
+
+            @media (min-width: var(--breakpoint-md, 960px)) {
+                .grid-container {
+                    grid-template-columns: repeat(4, minmax(0, 1fr)); /* md */
+                }
+            }
+
+            @media (min-width: var(--breakpoint-lg, 1280px)) {
+                .grid-container {
+                    grid-template-columns: repeat(4, minmax(0, 1fr)); /* lg */
+                }
+            }
+
+            @media (min-width: var(--breakpoint-xl, 1536px)) {
+                .grid-container {
+                    grid-template-columns: repeat(auto-fill, minmax(0, 1fr));
+                }
+            }
+        `
+];
+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
+};