@progressive-development/pd-forms 0.5.7 → 0.6.1

package/dist/pd-form-row.js

@@ -1,4 +1,108 @@
-import { PdFormRow } from "./src/PdFormRow.js";
-if (!customElements.get("pd-form-row")) {
-  window.customElements.define("pd-form-row", PdFormRow);
-}
+import { css, html } from "lit";
+import { customElement } from "lit/decorators.js";
+import { PdBaseUI } from "./pd-base-ui.js";
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = decorator(result) || result;
+  return result;
+};
+let PdFormRow = class extends PdBaseUI {
+  render() {
+    return html`<slot></slot>`;
+  }
+};
+PdFormRow.styles = [
+  PdBaseUI.styles,
+  css`
+      :host {
+        /* Define size for row, depends on media queries */
+        --my-row-width: var(--pd-form-row-base-width, 800px);
+        --my-gap: var(--pd-form-row-gap, 20px);
+        display: flex;
+        flex: 1 1 100%;
+        /*margin: 0 0 .5rem 0;*/
+        box-sizing: border-box;
+        width: 100%;
+        gap: var(--my-gap);
+        align-items: var(--pd-form-row-align-item, flex-start);
+        padding-top: var(--pd-form-row-padding-top, 10px);
+      }
+
+      ::slotted(.full-size) {
+        --pd-input-field-width: 100%;
+      }
+
+      ::slotted(.quarter1) {
+        --pd-input-field-width: calc(
+          var(--my-row-width) * 0.25 - (var(--my-gap) * 0.75)
+        );
+      }
+
+      ::slotted(.quarter1-area) {
+        --pd-input-field-width: calc(
+          (var(--my-row-width) - 5px) * 0.25 - (var(--my-gap) * 0.75)
+        );
+      }
+
+      ::slotted(.quarter2) {
+        --pd-input-field-width: calc(
+          (var(--my-row-width) * 0.5) - (var(--my-gap) / 2)
+        );
+      }
+
+      ::slotted(.quarter2-area) {
+        --pd-input-field-width: calc(
+          ((var(--my-row-width) - 8px) * 0.5) - (var(--my-gap) / 2)
+        );
+      }
+
+      ::slotted(.quarter3) {
+        --pd-input-field-width: calc(
+          var(--my-row-width) * 0.75 - (var(--my-gap) * 0.25)
+        );
+      }
+
+      ::slotted(.quarter3-area) {
+        --pd-input-field-width: calc(
+          (var(--my-row-width) - 10px) * 0.75 - (var(--my-gap) * 0.25)
+        );
+      }
+
+      ::slotted(.quarter4) {
+        --pd-input-field-width: var(--my-row-width);
+      }
+
+      ::slotted(.quarter4-area) {
+        --pd-input-field-width: calc(var(--my-row-width) - 15px);
+      }
+
+      @media (max-width: 930px) {
+        :host {
+          --my-row-width: 600px;
+        }
+      }
+
+      @media (max-width: 650px) {
+        :host {
+          --my-row-width: 400px;
+          --my-gap: 10px;
+        }
+      }
+
+      @media (max-width: 450px) {
+        :host {
+          --my-row-width: 300px;
+          --my-gap: 8px;
+        }
+      }
+    `
+];
+PdFormRow = __decorateClass([
+  customElement("pd-form-row")
+], PdFormRow);
+export {
+  PdFormRow
+};

package/dist/pd-hover-box.d.ts

@@ -0,0 +1,23 @@
+import { TemplateResult, CSSResultGroup } from 'lit';
+import { PdBaseUI } from './pd-base-ui.js';
+export declare class PdHoverBox extends PdBaseUI {
+    /**
+     * Controls visibility of the info box
+     */
+    private _visible;
+    /**
+     * True if the info box should open downward
+     */
+    private _toBottom;
+    static styles: CSSResultGroup;
+    render(): TemplateResult;
+    /**
+     * Activates and positions the info box based on current viewport height.
+     */
+    private _activateInfo;
+    /**
+     * Hides the info box again
+     */
+    private _closeInfo;
+}
+//# sourceMappingURL=pd-hover-box.d.ts.map

package/dist/pd-hover-box.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-hover-box.d.ts","sourceRoot":"","sources":["../src/pd-hover-box.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAa,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1E,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE3C,qBACa,UAAW,SAAQ,QAAQ;IACtC;;OAEG;IAEH,OAAO,CAAC,QAAQ,CAAS;IAEzB;;OAEG;IAEH,OAAO,CAAC,SAAS,CAAS;IAE1B,OAAgB,MAAM,EAAE,cAAc,CAqDpC;IAEO,MAAM,IAAI,cAAc;IAqBjC;;OAEG;IACH,OAAO,CAAC,aAAa;IAqBrB;;OAEG;IACH,OAAO,CAAC,UAAU;CAGnB"}

package/dist/pd-hover-box.js

@@ -1,4 +1,122 @@
-import { PdHoverBox } from "./src/PdHoverBox.js";
-if (!customElements.get("pd-hover-box")) {
-  window.customElements.define("pd-hover-box", PdHoverBox);
-}
+import { css, html } from "lit";
+import { state, customElement } from "lit/decorators.js";
+import { PdBaseUI } from "./pd-base-ui.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let PdHoverBox = class extends PdBaseUI {
+  constructor() {
+    super(...arguments);
+    this._visible = false;
+    this._toBottom = false;
+  }
+  render() {
+    return html`
+      <div class="hover-box">
+        <div @click=${this._activateInfo}>
+          <slot name="normal-view"></slot>
+        </div>
+
+        <div
+          id="infoViewId"
+          @click=${this._closeInfo}
+          class="info-view ${this._visible ? "visible" : "hidden"} ${this._toBottom ? "to-bottom" : "to-top"}"
+        >
+          <slot name="info-view"></slot>
+        </div>
+      </div>
+    `;
+  }
+  /**
+   * Activates and positions the info box based on current viewport height.
+   */
+  _activateInfo(e) {
+    var _a;
+    const modal = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById("infoViewId");
+    if (!modal) return;
+    const rect = modal.getBoundingClientRect();
+    const fitsBelow = modal.offsetHeight + rect.top + rect.height <= window.innerHeight;
+    this._toBottom = fitsBelow;
+    this._visible = true;
+    e.stopPropagation();
+  }
+  /**
+   * Hides the info box again
+   */
+  _closeInfo() {
+    this._visible = false;
+  }
+};
+PdHoverBox.styles = [
+  PdBaseUI.styles,
+  css`
+      :host {
+        display: block;
+      }
+
+      .hover-box {
+        position: relative;
+      }
+
+      .info-view {
+        position: absolute;
+        z-index: 100;
+        background-color: var(
+          --pd-hover-box-bg-col,
+          var(--pd-default-dark-col)
+        );
+        border: 1px solid var(--pd-hover-box-border-col, var(--pd-default-col));
+        text-align: center;
+        padding: 10px;
+        width: 240px;
+        color: var(--pd-hover-box-font-col, white);
+        font-size: var(--pd-hover-box-font-size, 0.8em);
+        transition: opacity 0.2s ease-in;
+      }
+
+      .visible {
+        visibility: visible;
+        opacity: 1;
+      }
+
+      .hidden {
+        visibility: hidden;
+        opacity: 0;
+      }
+
+      .to-bottom {
+        right: -3px;
+        top: -3px;
+      }
+
+      .to-top {
+        right: -3px;
+        bottom: -3px;
+      }
+
+      @media (max-width: 640px) {
+        .info-view {
+          width: 190px;
+        }
+      }
+    `
+];
+__decorateClass([
+  state()
+], PdHoverBox.prototype, "_visible", 2);
+__decorateClass([
+  state()
+], PdHoverBox.prototype, "_toBottom", 2);
+PdHoverBox = __decorateClass([
+  customElement("pd-hover-box")
+], PdHoverBox);
+export {
+  PdHoverBox
+};

package/dist/pd-icon-panel-button.d.ts

@@ -0,0 +1,18 @@
+import { CSSResultGroup } from 'lit';
+import { PdBaseUI } from './pd-base-ui';
+export declare class PdIconPanelButton extends PdBaseUI {
+    pdButtonIcon?: string;
+    buttonText: string;
+    value?: string;
+    panelButton: boolean;
+    private _panelOpen;
+    static styles: CSSResultGroup;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _closePanel;
+    render(): import('lit-html').TemplateResult<1>;
+    private _onKeyDown;
+    private _buttonClicked;
+    private _togglePanel;
+}
+//# sourceMappingURL=pd-icon-panel-button.d.ts.map

package/dist/pd-icon-panel-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-icon-panel-button.d.ts","sourceRoot":"","sources":["../src/pd-icon-panel-button.ts"],"names":[],"mappings":"AACA;;;GAGG;AAEH,OAAO,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAGhD,OAAO,0CAA0C,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,qBACa,iBAAkB,SAAQ,QAAQ;IAE7C,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,UAAU,EAAE,MAAM,CAAQ;IAG1B,KAAK,CAAC,EAAE,MAAM,CAAC;IAGf,WAAW,EAAE,OAAO,CAAS;IAG7B,OAAO,CAAC,UAAU,CAAkB;IAEpC,OAAgB,MAAM,EAAE,cAAc,CAoIpC;IAEF,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,WAAW,CAEjB;IAGF,MAAM;IAgCN,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,cAAc;IAYtB,OAAO,CAAC,YAAY;CAQrB"}

package/dist/pd-icon-panel-button.js

@@ -0,0 +1,242 @@
+import { css, html } from "lit";
+import { property, state, customElement } from "lit/decorators.js";
+import "@progressive-development/pd-icon/pd-icon";
+import { PdBaseUI } from "./pd-base-ui.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let PdIconPanelButton = class extends PdBaseUI {
+  constructor() {
+    super(...arguments);
+    this.buttonText = "Ok";
+    this.panelButton = false;
+    this._panelOpen = false;
+    this._closePanel = () => {
+      this._panelOpen = false;
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    window.addEventListener("close-button-panel-event", this._closePanel);
+  }
+  disconnectedCallback() {
+    window.removeEventListener("close-button-panel-event", this._closePanel);
+    super.disconnectedCallback();
+  }
+  // ${this._daySyncDisabled ? "element-hint" : ""} => for div class
+  render() {
+    return html`
+      <div
+        class="icon-button-style"
+        role="button"
+        tabindex="0"
+        @click="${this._buttonClicked}"
+        @keydown="${this._onKeyDown}"
+      >
+        ${this.pdButtonIcon ? html`
+              <pd-icon
+                class="icon action-icon-color"
+                icon="${this.pdButtonIcon}"
+                activeIcon
+              ></pd-icon>
+            ` : ""}
+        <span>${this.buttonText}</span>
+      </div>
+
+      <div class="panel ${this._panelOpen ? "open" : ""}">
+        <button class="close-button" @click="${this._togglePanel}">
+          &times;
+        </button>
+        <div class="panel-content">
+          <slot></slot>
+        </div>
+      </div>
+    `;
+  }
+  _onKeyDown(event) {
+    if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      this._buttonClicked();
+    }
+  }
+  _buttonClicked() {
+    if (this.panelButton) {
+      this._togglePanel();
+    } else {
+      this.dispatchEvent(
+        new CustomEvent("button-clicked", {
+          detail: this.value
+        })
+      );
+    }
+  }
+  _togglePanel() {
+    this._panelOpen = !this._panelOpen;
+    this.dispatchEvent(
+      new CustomEvent("panel-button-toggled", {
+        detail: { open: this._panelOpen }
+      })
+    );
+  }
+};
+PdIconPanelButton.styles = [
+  css`
+      :host {
+        display: inline-block; /* Verhindert, dass :host die volle Breite bekommt */
+        position: relative;
+        width: var(--pd-icon-button-width, auto);
+      }
+
+      :host([disabled]) {
+        pointer-events: none;
+      }
+
+      .icon-button-style {
+        z-index: 6;
+        background: #58a linear-gradient(hsla(0, 0%, 100%, 0.2), transparent);
+        background-color: var(--pd-icon-button-bgcol, #0c6fc5);
+        padding: 0.3em 0.8em;
+        border: 1px solid var(--pd-icon-button-bordercol, rgba(0, 0, 0, 0.5));
+        border-radius: var(--pd-icon-button-border-radius, 0.2em);
+        transition: background-color 0.3s ease;
+        --pd-icon-size: 20px;
+        color: var(--pd-icon-button-txtcol, white);
+        text-shadow: 0 - 0.05em 0.05em rgba(0, 0, 0, 0.5);
+        font-size: var(--pd-icon-button-font-size, 125%);
+        line-height: var(--pd-icon-button-line-height, 1.5);
+        height: var(--pd-icon-button-height, auto);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        text-align: center;
+      }
+
+      :host(:not([disabled])) .icon-button-style:hover {
+        background-color: var(--pd-icon-button-bgcol-hover, #fdae03f3);
+        cursor: pointer;
+      }
+
+      :host([disabled]) .icon-button-style {
+        background: linear-gradient(
+          to bottom,
+          #e0e0e0,
+          #c4c4c4
+        ); /* Matte, deaktivierte Optik */
+        color: #696868; /* Text weniger dominant */
+        border-color: #b0b0b0; /* Weniger Kontrast */
+        cursor: not-allowed;
+        opacity: 0.6; /* Leichter "inaktiv"-Effekt */
+        text-shadow: none; /* Kein 3D-Effekt */
+      }
+
+      :host(:not([disabled])[primary]) .icon-button-style {
+        background-color: var(--pd-icon-button-primary-bgcol, #044176);
+        color: var(--pd-icon-button-primary-txtcol, white);
+      }
+
+      :host(:not([disabled])[primary]) .icon-button-style:hover {
+        background-color: var(--pd-icon-button-primary-bgcol-hover, #fdae03f3);
+        cursor: pointer;
+      }
+
+      .panel {
+        position: absolute;
+        width: max-content; /* Verhindert volle Breite */
+        min-width: 120%; /* Panel wird etwas breiter als der Button */
+        max-width: 300px; /* Optional: Maximale Breite */
+        transform: scaleY(0);
+        background: var(--pd-panel-bg, white);
+        border-radius: 5px;
+        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+        transition:
+          transform 0.2s ease-out,
+          opacity 0.2s ease-out;
+        opacity: 0;
+        z-index: 5;
+      }
+
+      .panel.open {
+        transform: scaleY(1);
+        opacity: 1;
+      }
+
+      .panel-content {
+        padding: 1rem;
+        min-height: 50px;
+      }
+
+      .close-button {
+        position: absolute;
+        top: 5px;
+        right: 5px;
+        background: transparent;
+        border: none;
+        color: #555;
+        font-size: 1.2rem;
+        cursor: pointer;
+        padding: 5px;
+        line-height: 1;
+        transition: color 0.2s ease-in-out;
+      }
+
+      .close-button:hover {
+        color: black;
+      }
+
+      /* Standard (nach unten öffnend, linksbündig) */
+      :host(:not([right]):not([up])) .panel {
+        left: 0; /* Panel beginnt exakt unter dem Button */
+        top: 100%; /* Panel öffnet sich nach unten */
+        transform-origin: top; /* Wächst nach unten */
+      }
+
+      /* Standard (nach unten öffnend, rechtsbündig) */
+      :host([right]:not([up])) .panel {
+        right: 0; /* Panel beginnt rechtsbündig am Button */
+        top: 100%;
+        transform-origin: top right;
+      }
+
+      /* Panel öffnet sich nach OBEN (links ausgerichtet) */
+      :host(:not([right])[up]) .panel {
+        left: 0;
+        bottom: 100%; /* Panel öffnet sich nach oben */
+        transform-origin: bottom;
+      }
+
+      /* Panel öffnet sich nach OBEN (rechts ausgerichtet) */
+      :host([right][up]) .panel {
+        right: 0;
+        bottom: 100%; /* Panel öffnet sich nach oben */
+        transform-origin: bottom right;
+      }
+    `
+];
+__decorateClass([
+  property({ type: String })
+], PdIconPanelButton.prototype, "pdButtonIcon", 2);
+__decorateClass([
+  property({ type: String })
+], PdIconPanelButton.prototype, "buttonText", 2);
+__decorateClass([
+  property({ type: String })
+], PdIconPanelButton.prototype, "value", 2);
+__decorateClass([
+  property({ type: Boolean })
+], PdIconPanelButton.prototype, "panelButton", 2);
+__decorateClass([
+  state()
+], PdIconPanelButton.prototype, "_panelOpen", 2);
+PdIconPanelButton = __decorateClass([
+  customElement("pd-icon-panel-button")
+], PdIconPanelButton);
+export {
+  PdIconPanelButton
+};

package/dist/pd-input-area.d.ts

@@ -0,0 +1,18 @@
+import { CSSResultGroup } from 'lit';
+import { PdBaseInputElement } from './pd-base-input-element.js';
+export declare class PdInputArea extends PdBaseInputElement {
+    rows: number;
+    cols?: number;
+    /**
+     * Minimum length constraint
+     */
+    minlength?: number;
+    /**
+     * Maximum length constraint
+     */
+    maxlength?: number;
+    constructor();
+    static styles: CSSResultGroup;
+    render(): import('lit-html').TemplateResult<1>;
+}
+//# sourceMappingURL=pd-input-area.d.ts.map

package/dist/pd-input-area.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-input-area.d.ts","sourceRoot":"","sources":["../src/pd-input-area.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAGhE,qBACa,WAAY,SAAQ,kBAAkB;IAEjD,IAAI,SAAK;IAGT,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IAEH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IAEH,SAAS,CAAC,EAAE,MAAM,CAAO;;IAOzB,OAAgB,MAAM,EAAE,cAAc,CAQpC;IAEO,MAAM;CAyBhB"}

package/dist/pd-input-area.js

@@ -1,4 +1,74 @@
-import { PdInputArea } from "./src/PdInputArea.js";
-if (!customElements.get("pd-input-area")) {
-  window.customElements.define("pd-input-area", PdInputArea);
-}
+import { css, html } from "lit";
+import { property, customElement } from "lit/decorators.js";
+import { PdBaseInputElement } from "./pd-base-input-element.js";
+import { INPUT_TYPE_AREA } from "./pd-base-ui-input.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let PdInputArea = class extends PdBaseInputElement {
+  constructor() {
+    super();
+    this.rows = 2;
+    this.maxlength = 500;
+    this._inputType = INPUT_TYPE_AREA;
+  }
+  render() {
+    const inputAreaId = `${this.id}InputArea`;
+    return html`
+      ${this._renderLabel(inputAreaId)}
+      <div class="input ${this.errorMsg.length > 0 ? "error" : ""}">
+        <textarea
+          id=${inputAreaId}
+          name=${this.name || this.valueName || this.autoCompleteName}
+          autocomplete=${this.autoCompleteName ?? "off"}
+          class="input-style ${this.gradient ? "gradient" : ""}"
+          rows=${this.rows}
+          cols=${this.cols ?? ""}
+          placeholder=${this.placeHolder}
+          minlength=${this.minlength ?? ""}
+          maxlength=${this.maxlength ?? ""}
+          ?disabled=${this.disabled}
+          ?readonly=${this.readonly}
+          .value=${this.value}
+          @keyup=${this._onKeyUp}
+          @blur=${this._onBlur}
+        ></textarea>
+      </div>
+      ${this._renderErrorMsg()}
+    `;
+  }
+};
+PdInputArea.styles = [
+  PdBaseInputElement.styles,
+  css`
+      /* override default width for area */
+      .input-style {
+        width: var(--pd-input-field-width, 240px);
+      }
+    `
+];
+__decorateClass([
+  property({ type: Number })
+], PdInputArea.prototype, "rows", 2);
+__decorateClass([
+  property({ type: Number })
+], PdInputArea.prototype, "cols", 2);
+__decorateClass([
+  property({ type: Number })
+], PdInputArea.prototype, "minlength", 2);
+__decorateClass([
+  property({ type: Number })
+], PdInputArea.prototype, "maxlength", 2);
+PdInputArea = __decorateClass([
+  customElement("pd-input-area")
+], PdInputArea);
+export {
+  PdInputArea
+};

package/dist/pd-input-file.d.ts

@@ -0,0 +1,15 @@
+import { CSSResultGroup } from 'lit';
+import { PdBaseInputElement } from './pd-base-input-element.js';
+export declare class PdInputFile extends PdBaseInputElement {
+    icon?: string;
+    accept?: string;
+    maxlength?: number;
+    constructor();
+    static styles: CSSResultGroup;
+    render(): import('lit-html').TemplateResult<1>;
+    _onKeyUp(e: KeyboardEvent): void;
+    private _iconClicked;
+    private _onChange;
+    get files(): FileList | null | undefined;
+}
+//# sourceMappingURL=pd-input-file.d.ts.map

package/dist/pd-input-file.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-input-file.d.ts","sourceRoot":"","sources":["../src/pd-input-file.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAGhD,OAAO,0CAA0C,CAAC;AAElD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAGhE,qBACa,WAAY,SAAQ,kBAAkB;IAEjD,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,MAAM,CAAC,EAAE,MAAM,CAAC;IAGhB,SAAS,CAAC,EAAE,MAAM,CAAC;;IAOnB,OAAgB,MAAM,EAAE,cAAc,CAOpC;IAEO,MAAM;IA6BN,QAAQ,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAIzC,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,SAAS;IAYjB,IAAI,KAAK,IAAI,QAAQ,GAAG,IAAI,GAAG,SAAS,CAIvC;CACF"}