@arcgis/map-components/dist/components/arcgis-print-template-selector/customElement.js

ArcGIS Map Components

/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import { c as m } from "../../chunks/runtime.js";
import { css as p, html as l } from "lit";
import { watch as o } from "@arcgis/core/core/reactiveUtils.js";
import { LitElement as u, nothing as h } from "@arcgis/lumina";
import { i as c, r as g, a as v, g as f, b as T } from "../../chunks/utils3.js";
import { u as w } from "../../chunks/useHandles.js";
const $ = p`:host{overflow-y:hidden;display:flex;flex:1 0}.template-select-flow-item-container{display:flex;flex-direction:column;justify-content:space-between;overflow-y:hidden;flex-grow:1}.template-select-flow-item-container .template-select-flow-item-content{display:flex;flex-direction:column;overflow-y:auto;flex:1 0}.template-select-flow-item-container .template-select-flow-item-content .template-select-flow-item-list-heading{display:flex;gap:var(--calcite-spacing-xs);align-items:center;justify-content:space-between;padding:var(--calcite-spacing-md) var(--calcite-spacing-lg);background-color:var(--calcite-color-foreground-2);border-bottom:1px solid var(--calcite-color-border-3);font-weight:var(--calcite-font-weight-semibold)}.template-button-container{padding:var(--calcite-spacing-md)}.template-done-button{width:100%}`;
class y extends u {
  constructor() {
    super(...arguments), this._handles = w("disconnect");
  }
  static {
    this.properties = { _selectedTemplate: 16, excludeOrganizationTemplates: 5, viewModel: 0, messages: 0, hideTemplateSelector: 0 };
  }
  static {
    this.styles = $;
  }
  loaded() {
    this.manager.onLifecycle(() => [
      o(() => this.viewModel.templateOptions.id, (e) => {
        this._handles.removeHandles("template-handle"), this._selectedTemplate = e ? this.viewModel.getLayoutTemplateById(e) ?? void 0 : void 0, this._handles.addHandles(o(() => this._selectedTemplate?.state, () => this.requestUpdate(), { initial: !0 }), "template-handle");
      }, { initial: !0 })
    ]);
  }
  _getPortalTemplates() {
    return this.viewModel.includeDefaultTemplates && !this.excludeOrganizationTemplates ? this.viewModel.defaultTemplates.toArray().filter(({ layout: e, layoutItem: i }) => !c(e) && !!i?.id) : [];
  }
  _getDefaultTemplates() {
    return this.viewModel.includeDefaultTemplates ? this.viewModel.defaultTemplates.toArray().filter(({ layout: e, layoutItem: i }) => !c(e) && !i?.id) : [];
  }
  _getPrintServiceTemplates() {
    return !this.viewModel.includeDefaultTemplates || !this._getDefaultTemplates().length ? this.viewModel.printServiceTemplates.toArray().filter(({ layout: e }) => !c(e)) : [];
  }
  render() {
    const { messages: e } = this, i = g.test(this.viewModel.portal?.url), t = this.viewModel.browseTemplates.toArray(), a = this._getPortalTemplates(), s = this._getDefaultTemplates(), n = this._getPrintServiceTemplates(), r = t.length + a.length + s.length + n.length > 15;
    return l`<div class="template-select-flow-item-container"><div class="template-select-flow-item-content"><slot></slot><calcite-list .filterEnabled=${r} .filterProps=${["label"]} .label=${e.templateList} selection-mode=single-persist @calciteListChange=${({ currentTarget: d }) => this.viewModel.applyTemplate(d.selectedItems[0]?.value)}>${t.length ? l`<div><div class="template-select-flow-item-list-heading">${e.myTemplates}${i ? l`<calcite-chip icon=credits appearance=outline kind=neutral .label=${e.consumesCredits} scale=s>${e.consumesCredits}</calcite-chip>` : null}</div>${this._renderLayoutTemplates(t, !0)}</div>` : null}${a.length ? l`<div><div class="template-select-flow-item-list-heading">${e.organizationTemplates}${i ? l`<calcite-chip icon=credits appearance=outline kind=neutral .label=${e.consumesCredits} scale=s>${e.consumesCredits}</calcite-chip>` : null}</div>${this._renderLayoutTemplates(a)}</div>` : null}${t.length || a.length ? s.length ? l`<div><div class="template-select-flow-item-list-heading">${e.defaultTemplates}</div>${this._renderLayoutTemplates(s)}</div>` : null : this._renderLayoutTemplates(s)}${t.length || a.length ? n.length ? l`<div><div class="template-select-flow-item-list-heading">${e.defaultTemplates}</div>${this._renderLayoutTemplates(n)}</div>` : null : this._renderLayoutTemplates(n)}</calcite-list></div><div class="template-button-container"><calcite-button class="template-done-button" @click=${this.hideTemplateSelector}>Done</calcite-button></div></div>`;
  }
  _renderLayoutTemplates(e, i = !1) {
    return e.map((t) => l`<calcite-list-item .description=${v(t)} .label=${f(t, this.messages)} .selected=${t.id === this.viewModel.templateOptions.id} title=${t.description ?? "" ?? h} .value=${t}><calcite-icon .icon=${(t.layout ? T(t.layout) : null) || "custom-print"} slot=content-start></calcite-icon>${t.state === "loading" ? l`<calcite-loader inline label=loading scale=s slot=content-end></calcite-loader>` : null}${t?.state === "error" ? l`<calcite-icon class="template-select-error" icon=exclamation-mark-circle scale=s slot=content-end></calcite-icon>` : null}${i ? l`<calcite-action icon=trash @click=${() => this.viewModel.removePortalTemplate(t)} slot=actions-end text=delete></calcite-action>` : null}</calcite-list-item>`);
  }
}
m("arcgis-print-template-selector", y);
export {
  y as PrintTemplateSelector
};