/* COPYRIGHT Esri - https://js.arcgis.com/1.2/LICENSE.txt */
import { c as customElement } from "../../chunks/runtime.js";
import { css, html } from "lit";
import { u as useT9n } from "../../chunks/useT9n.js";
import { LitElement, createEvent, safeClassMap, nothing } from "@arcgis/lumina";
const styles = css`/** @license
 * Copyright 2025 Esri
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *    http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.header-button-padding {
  padding-top: .5rem;
  padding-bottom: .5rem;
  padding-inline-end: 1rem;
}

.width-full {
  width: 100%;
}

.filter-layout-flex-row {
  display: flex;
  flex-direction: row;
  flex: 1;
  background-color: var(--calcite-color-foreground-2);
}

.filter-layout-flex-column {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.top-bottom-padding {
  padding-top: .5rem;
  padding-bottom: .5rem;
}

calcite-panel {
  --calcite-panel-background-color: var(--calcite-color-foreground-1);
}

.border-color {
  --calcite-block-border-color: #00000000;
  /*transparent*/
}`;
class SolutionsDeployedFilterPanel extends LitElement {
  constructor() {
    super();
    this.isAllSolutions = false;
    this.isMobile = false;
    this.isOrgAdmin = false;
    this._activeFilterSettings = {
      categories: [],
      isOwnerMySolutions: true,
      searchTerm: ""
    };
    this._translations = useT9n({ name: "solutions-deployed-filter-panel", blocking: true });
    this.applyFilter = createEvent();
    this._handleFilterRemoved = (event) => {
      const detail = event.detail;
      if (Array.isArray(detail)) {
        this._activeFilterSettings = {
          ...this._activeFilterSettings,
          categories: [...detail]
        };
      } else {
        if (typeof detail === "string" && detail.toLowerCase() === `My organization's solutions`.toLowerCase()) {
          this.changeOwnerFilter(true, true);
        }
      }
    };
    this._resetToMySolutions = () => {
      this.changeOwnerFilter(true, true);
    };
    this._handleTabChanged = (evt) => {
      console.log("tab changed event received in filter panel:");
      console.log(evt);
      console.log(this._activeFilterSettings);
      this.changeSearchFilter("", true);
    };
    this.listenOn(window, "filterRemoved", this._handleFilterRemoved);
    this.listenOn(window, "deployProgressEnd", this._resetToMySolutions);
    this.listenOn(window, "tabChanged", this._handleTabChanged);
  }
  static {
    this.properties = { isAllSolutions: [5, {}, { type: Boolean }], isMobile: [5, {}, { type: Boolean }], isOrgAdmin: [5, {}, { type: Boolean }], _activeFilterSettings: [16, {}, { state: true }], _translations: [16, {}, { state: true }] };
  }
  static {
    this.styles = styles;
  }
  changeOwnerFilter(isMySolutions, emit) {
    this.isAllSolutions = !isMySolutions;
    this._activeFilterSettings = {
      ...this._activeFilterSettings,
      isOwnerMySolutions: isMySolutions
    };
    const emitObject = {
      displayValue: this._activeFilterSettings.isOwnerMySolutions ? this._translations.mySolutions : this._translations.myOrgSolutions,
      type: "owner",
      value: this._activeFilterSettings.isOwnerMySolutions ? "My solutions" : "My organization's solutions"
    };
    if (emit) {
      this.applyFilter.emit(emitObject);
    }
  }
  changeSearchFilter(searchTerm, emit) {
    this._activeFilterSettings = {
      ...this._activeFilterSettings,
      searchTerm
    };
    if (emit) {
      this.applyFilter.emit({ searchTerm });
    }
    console.log("changeSearchFilter called with searchTerm:", searchTerm);
    console.log("Current active filter settings:", this._activeFilterSettings);
  }
  clearFilters() {
    this.changeSearchFilter("");
    this.applyFilter.emit(null);
    setTimeout(() => {
      this.changeOwnerFilter(true, true);
    }, 500);
  }
  render() {
    console.log("--------------------------------------sdfp-----------------------------------------------");
    return html`<div class=${safeClassMap(this.isMobile ? "filter-layout-flex-column" : "filter-layout-flex-row")}>${this.isOrgAdmin && this.renderOwnerBlock() || ""}<calcite-input-text class="width-full top-bottom-padding" clearable icon=search @keyup=${(event) => {
      const target = event.target;
      if (event.key === "Enter") {
        this.changeSearchFilter(target.value, true);
      } else {
        this.changeSearchFilter(target.value, target.value.length >= 3 || target.value.length === 0);
      }
    }} @blur=${(event) => {
      const target = event.target;
      this.changeSearchFilter(target.value, true);
    }} .placeholder=${this._translations.search.solutions} slot=content-top .value=${this._activeFilterSettings.searchTerm}></calcite-input-text></div>`;
  }
  renderOwnerBlock() {
    return html`<calcite-dropdown width=m overlay-positioning=fixed><calcite-button appearance=outline-fill class="header-button-padding" .iconStart=${!this.isAllSolutions ? "user" : "organization"} kind=neutral slot=trigger>${!this.isAllSolutions ? this._translations.mySolutions : this._translations.myOrgSolutions}</calcite-button><calcite-dropdown-group group-title=${this._translations.owner ?? nothing}><calcite-dropdown-item icon-start=user @click=${() => {
      this.changeOwnerFilter(true, true);
    }} .selected=${!this.isAllSolutions}>${this._translations.mySolutions}</calcite-dropdown-item><calcite-dropdown-item icon-start=organization @click=${() => {
      this.changeOwnerFilter(false, true);
    }} .selected=${this.isAllSolutions}>${this._translations.myOrgSolutions}</calcite-dropdown-item></calcite-dropdown-group></calcite-dropdown>`;
  }
}
customElement("solutions-deployed-filter-panel", SolutionsDeployedFilterPanel);
export {
  SolutionsDeployedFilterPanel
};
