import { r as t, c as i, h as e, H as s, a as l } from "./p-9b9ccd0c.js";

const o = ":host{display:grid;block-size:100%}.opacity-0{opacity:0}.gxi-hidden{display:none !important}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-style-regular);font-size:var(--font-size-body-m);font-family:var(--font-family-body);height:100%;display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.buttons-container{display:flex;gap:var(--spacing-gap-m)}.giu-static-pill-icon-and-text,.giu-static-pill{background-color:var(--elevation-background-color, var(--color-accent-surface-elevation-1));padding-inline:var(--spacing-padding-m);color:var(--color-text-neutral-default);font-size:var(--font-size-body-s);line-height:var(--line-height-relaxed);font-weight:var(--font-style-regular);border-radius:4px;min-block-size:25px;display:inline-grid;align-items:center;pointer-events:none;inline-size:max-content}.giu-static-pill-icon-and-text{display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--spacing-gap-m)}.tab-full-width-buttons::part(tab-list block-start),.tab-full-width-buttons::part(tab-list block-end){grid-auto-columns:1fr}.tab-full-width-buttons::part(tab block-start){justify-content:center}.tree-view::part(item__header){--icon__system_warning_warning--disabled:var(\n    --icon__system_warning_warning--enabled\n  )}.tabular-grid{--focus-outline-width:1px}*,::after,::before{box-sizing:border-box}:host{display:flex;flex-direction:column;max-height:100%;font-size:var(--item__font-size)}.list{border:none;margin:0;padding:0;outline:0;color:var(--color-text-neutral-default);background-color:var(--elevation-background-color, var(--color-accent-surface-elevation-1));border-radius:4px;font-size:var(--font-size-body-m);font-weight:var(--font-style-regular);display:grid;max-height:100%;overflow-y:auto;gap:var(--spacing-gap-xs);padding:var(--spacing-padding-m)}:host([no-list-border]) .list{border:none}";

const n = [ "resets/box-sizing", "chameleon/scrollbar" ];

const a = class {
  constructor(e) {
    t(this, e);
    this.selectionChanged = i(this, "selectionChanged", 7);
    /**
         * It evaluates the checked items, and checks or unchecks if needed
         */    this.evaluateChecked = () => {
      const t = Array.from(this.el.querySelectorAll("gx-ide-list-selector-item"));
      const i = t.filter((t => t.itemChecked));
      /**
             * INDEX
             * 1.required and no one checked
             * 2.single-selection, and more than one checked
             */
      /* 1.required and no one checked*/      if (this.required && i.length === 0) {
        t[0].itemChecked = true;
      } else if (this.type === "single-selection" && i.length > 1) {
        /* 2.single-selection, and more than one checked*/
        i.forEach(((t, i) => {
          if (i !== 0) {
            t.itemChecked = false;
          }
        }));
      }
    };
    /**
         * It evaluates the initial value/s
         */    this.evaluateInitialValue = () => {
      const t = this.getChecked();
      if (this.type === "single-selection" && t.length > 0) {
        this.value = t[0].itemValue;
      } else if (this.type === "multi-selection" && t.length > 0) {
        const i = [];
        t.forEach((t => {
          i.push(t.itemValue);
        }));
        this.value = i;
      }
    };
    this.getChecked = () => {
      const t = [];
      const i = this.el.querySelectorAll("gx-ide-list-selector-item");
      i.forEach((i => {
        if (i.itemChecked) {
          t.push(i);
        }
      }));
      return t;
    };
    this.clearPrevSelected = t => {
      const i = this.el.querySelectorAll("gx-ide-list-selector-item");
      i.forEach((i => {
        if (i.itemChecked && i.itemId !== t.itemId) {
          i.itemChecked = false;
        }
      }));
    };
    this.ordered = false;
    this.readonly = false;
    this.type = "single-selection";
    this.required = false;
    this.ellipsis = false;
    this.value = undefined;
    this.listName = undefined;
    this.noItemsBorder = false;
    this.noListBorder = false;
  }
  componentWillLoad() {
    this.evaluateChecked();
    this.evaluateInitialValue();
  }
  itemSelectionChangedHandler(t) {
    t.stopPropagation();
    const i = t.detail;
    if (this.type === "single-selection") {
      this.clearPrevSelected(i);
    }
    const e = [];
    const s = this.getChecked();
    const l = [];
    s.forEach((t => {
      const i = t.itemValue;
      l.push(i);
      e.push({
        itemId: t.itemId,
        itemValue: i,
        itemIcon: t.icon,
        itemChecked: true
      });
    }));
    /* update this.value*/    if (this.type === "single-selection" && l.length > 0) {
      this.value = l[0] || undefined;
    } else {
      /* multi-selection*/
      this.value = l;
    }
    /* emit selectionChanged*/    this.selectionChanged.emit(e);
  }
  render() {
    const t = "list scrollable";
    return e(s, {
      exportparts: "input:input"
    }, e("ch-theme", {
      model: n
    }), this.ordered ? e("ol", {
      class: t,
      part: "list"
    }, e("slot", null)) : e("ul", {
      class: t,
      part: "list"
    }, e("slot", null)));
  }
  get el() {
    return l(this);
  }
};

a.style = o;

const r = "*,::after,::before{box-sizing:border-box}gx-ide-list-selector-item{display:block;max-width:100%;display:flex}gx-ide-list-selector-item:hover .label{background-color:var(--color-accent-item-hover);cursor:pointer}gx-ide-list-selector-item:hover input:checked+.label{border-color:var(--color-accent-item-hover)}gx-ide-list-selector-item:active .label{background-color:transparent;color:var(--color-text-primary-pressed)}gx-ide-list-selector-item[readonly]:not([readonly=false]) .label{pointer-events:none;background-color:transparent}gx-ide-list-selector-item[ellipsis]:not([ellipsis=false]) .label__description{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}gx-ide-list-selector-item input{width:0;height:0;opacity:0;margin:0}gx-ide-list-selector-item input:focus+.label{outline:var(--focus-outline-width) solid var(--color-border-primary-focused);outline-offset:calc(2px * -1)}gx-ide-list-selector-item input:checked+.label{background-color:var(--color-accent-item-selected)}gx-ide-list-selector-item input:checked:hover+.label{color:var(--color-accent-primary-on-hover)}gx-ide-list-selector-item .label{width:100%;border-radius:4px}gx-ide-list-selector-item .label__wrapper{display:flex;min-height:28px;align-items:center;gap:var(--spacing-gap-m);padding:4px 8px;width:100%}gx-ide-list-selector-item .label__description{flex:1;display:flex;align-items:center;gap:var(--spacing-gap-m)}gx-ide-list-selector-item[no-border]{border-block-start:none}gx-ide-list-selector-item .label__universal-slot{display:flex;align-items:center;justify-content:center}";

const c = [ "resets/box-sizing", "components/icon" ];

const h = class {
  constructor(e) {
    t(this, e);
    this.itemSelectionChanged = i(this, "itemSelectionChanged", 7);
    this.hasUniversalSlot = false;
    this.index = undefined;
    // 6.COMPONENT LIFECYCLE METHODS //
    // 7.LISTENERS //
    // 8.PUBLIC METHODS API //
    // 9.LOCAL METHODS //
    /**
         * Checks if this item parentElement is a gx-ide-list-selector, and assigns a reference
         */    this.evaluateParentIsListSelector = () => {
      const t = this.el.parentElement;
      this.parentIsListSelector = (t === null || t === void 0 ? void 0 : t.nodeName) === "GX-IDE-LIST-SELECTOR";
      this.parentIsListSelector && (this.parentList = t);
    };
    /**
         * Determines the type of item, based on the parent list-selector 'type' property value
         */    this.evaluateType = () => {
      const t = this.el.parentElement;
      this.type = t.type === "single-selection" ? "radio" : "checkbox";
    };
    /**
         * Evaluates if is selectable, considering the parent list-selector 'selectable' property value, only if it is undefined on this item
         */    this.evaluateSelectable = () => {
      if (this.readonly === undefined && this.parentIsListSelector) {
        this.readonly = this.parentList.readonly;
      }
    };
    /**
         * Evaluates if text should truncate with ellipsis, considering the parent list-selector 'ellipsis' property value, only if it is undefined on this item
         */    this.evaluateEllipsis = () => {
      if (this.ellipsis === undefined && this.parentIsListSelector) {
        this.ellipsis = this.parentList.ellipsis;
      }
    };
    /**
         * Evaluates if this item should be initially checked, only if the parent list-selector listValue equals this item value.
         */    this.evaluateChecked = () => {
      if (this.checked === undefined && this.parentIsListSelector && this.parentList.value !== undefined && this.parentList.value === this.itemValue) {
        this.checked = true;
      }
    };
    this.evaluateBorder = () => {
      if (this.parentIsListSelector) {
        this.noBorder = this.parentList.noItemsBorder;
      }
    };
    this.evaluateUniversalSlot = () => {
      this.hasUniversalSlot = !!this.el.querySelector("[slot=universal]");
    };
    /**
         * Gets the listName required value, that is needed for the list selection to properly work
         */    this.assignName = () => {
      this.parentIsListSelector && this.parentList.listName && (this.name = this.parentList.listName);
    };
    this.evaluateOrderedList = () => {
      if (this.parentIsListSelector && this.parentList.ordered) {
        let t = Array.from(this.parentList.children).indexOf(this.el) + 1;
        if (t < 10) {
          // This will make descriptions to be nicely aligned, between one digit, and two digit indexes items.
          t = `0${t}`;
        } else {
          t = `${t}`;
        }
        this.index = t;
      }
    };
    this.onChangeHandler = t => {
      this.itemChecked = t.target.checked;
      this.itemSelectionChanged.emit({
        itemId: this.itemId,
        itemValue: this.itemValue,
        itemIcon: this.icon,
        itemChecked: this.itemChecked
      });
    };
    this.itemId = undefined;
    this.itemValue = undefined;
    this.itemChecked = false;
    this.readonly = undefined;
    this.ellipsis = undefined;
    this.icon = undefined;
    this.noBorder = false;
    this.universalSlotEnd = false;
  }
  // 5.EVENTS (EMIT) //
  componentWillLoad() {
    this.evaluateParentIsListSelector();
    this.evaluateType();
    this.evaluateSelectable();
    this.evaluateEllipsis();
    this.evaluateChecked();
    this.evaluateBorder();
    this.evaluateUniversalSlot();
    this.assignName();
    this.evaluateOrderedList();
  }
  // 10.RENDER() FUNCTION //
  render() {
    return e(s, {
      role: "listitem"
    }, e("ch-theme", {
      model: c
    }), e("input", {
      type: this.type,
      id: this.itemId,
      name: this.name,
      value: this.itemValue,
      checked: this.itemChecked,
      onChange: this.onChangeHandler,
      disabled: this.readonly,
      part: "input"
    }), e("label", {
      class: "label",
      htmlFor: this.itemId,
      part: "label"
    }, e("div", {
      class: "label__wrapper"
    }, this.index ? e("span", {
      class: "label__index"
    }, this.index, ". ") : null, this.hasUniversalSlot ? e("span", {
      class: "label__universal-slot",
      part: "universal-slot"
    }, e("slot", {
      name: "universal"
    })) : null, this.icon ? e("ch-image", {
      class: "icon-s",
      src: this.icon,
      part: "icon"
    }) : null, e("span", {
      class: "label__description",
      part: "description"
    }, this.itemValue ? this.itemValue : e("slot", null)))));
  }
  get el() {
    return l(this);
  }
};

h.style = r;

export { a as gx_ide_list_selector, h as gx_ide_list_selector_item };
//# sourceMappingURL=p-fdaeb19a.entry.js.map