@arcgis/map-components/dist/components/arcgis-link-chart-layout-switcher/customElement.js

ArcGIS Map Components

import { c as d } from "../../chunks/runtime.js";
import { html as e } from "lit-html";
import { classes as m } from "@arcgis/components-utils";
import { g as s } from "../../chunks/globalCss.js";
import g from "@arcgis/core/widgets/LinkChartLayoutSwitcher/LinkChartLayoutSwitcherViewModel.js";
import { usePropertyChange as p } from "@arcgis/lumina/controllers";
import { m as u } from "../../chunks/useViewModel.js";
import { u as y } from "../../chunks/useT9n.js";
import { reEmitEvent as w } from "@arcgis/lumina/controllers/accessor";
import { LitElement as b, createEvent as f, noShadowRoot as v, safeClassMap as c } from "@arcgis/lumina";
import { css as $ } from "@lit/reactive-element/css-tag.js";
/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
v4.33.13 */
const L = $`@layer{arcgis-link-chart-layout-switcher{display:block}}`, l = {
  basicLayoutCategory: [
    "basic-grid"
    /* SIMPLE */
  ],
  organicLayoutCategory: [
    "organic-standard",
    "organic-community",
    "geographic-organic-standard"
    /* GEOGRAPHIC */
  ],
  treeLayoutCategory: [
    "tree-left-to-right",
    "radial-root-centric"
    /* RADIAL_TREE */
  ],
  hierarchicalLayoutCategory: [
    "hierarchical-bottom-to-top"
    /* HIERARCHICAL */
  ],
  chronologicalLayoutCategory: [
    "chronological-mono-timeline",
    "chronological-multi-timeline"
    /* CHRONOLOGICAL_MULTIPLE */
  ]
}, n = {
  "organic-standard": "force-directed-link-chart-layout",
  "organic-community": "community-link-chart-layout",
  "basic-grid": "simple-link-chart-layout",
  "hierarchical-bottom-to-top": "hierarchical-link-chart-layout",
  "radial-root-centric": "radial-tree-link-chart-layout",
  "tree-left-to-right": "smart-tree-link-chart-layout",
  "geographic-organic-standard": "geographic-link-chart-layout",
  "chronological-mono-timeline": "single-timeline",
  "chronological-multi-timeline": "multi-timeline"
}, h = {
  "organic-standard": "forceDirected",
  "organic-community": "community",
  "basic-grid": "simple",
  "hierarchical-bottom-to-top": "hierarchical",
  "radial-root-centric": "radialTree",
  "tree-left-to-right": "smartTree",
  "geographic-organic-standard": "geographic",
  "chronological-mono-timeline": "chronologicalSingle",
  "chronological-multi-timeline": "chronologicalMultiple"
}, k = {
  base: "esri-link-chart-layout-switcher"
}, M = u(g);
class C extends b {
  constructor() {
    super(...arguments), this.messages = y(), this.viewModel = M(this), this.appearance = "dropdown", this.autoDestroyDisabled = !1, this.closeOnSelectDisabled = !1, this.icon = "nodes-link", this.layout = this.viewModel.layout, this.position = "top-left", this.preventExtentUpdate = this.viewModel.preventExtentUpdate, this.state = this.viewModel.state, this.arcgisSwitchLayout = w(() => this.viewModel, "switchLayout"), this.arcgisPropertyChange = p()("state"), this.arcgisReady = f();
  }
  static {
    this.properties = { appearance: 1, autoDestroyDisabled: 5, closeOnSelectDisabled: 5, icon: 1, label: 1, layout: 32, messageOverrides: 0, position: 3, preventExtentUpdate: 5, referenceElement: 1, state: 3 };
  }
  static {
    this.shadowRootOptions = v;
  }
  static {
    this.styles = L;
  }
  async destroy() {
    await this.manager.destroy();
  }
  async switchLayout(t) {
    this.viewModel.switchLayout(t);
  }
  _renderDropdown() {
    const { messages: t, icon: o } = this;
    return e`<calcite-dropdown scale=s width=m max-items=9 .closeOnSelectDisabled=${this.closeOnSelectDisabled}><calcite-button class=${c(s.widgetButton)} slot=trigger kind=neutral .disabled=${this.viewModel.state === "disabled"} .iconStart=${o ?? void 0} .label=${t.layoutOptions ?? "Layout"}></calcite-button>${Object.entries(l).map(([r, i]) => e`<calcite-dropdown-group selection-mode=single .groupTitle=${this.messages[r]}>${i.map((a) => e`<calcite-dropdown-item .iconStart=${n[a]} .selected=${a === this.layout ? !0 : void 0} @click=${() => void this.switchLayout(a)}>${t[h[a]]}</calcite-dropdown-item>`)}</calcite-dropdown-group>`)}</calcite-dropdown>`;
  }
  _renderMenuBar() {
    const { messages: t } = this;
    return e`<calcite-action-bar scale=s floating overflow-actions-disabled>${Object.entries(l).map(([o, r]) => e`<calcite-action-group .label=${this.messages[o]}>${r.map((i) => e`<calcite-action scale=s .icon=${n[i]} .active=${i === this.layout ? !0 : void 0} @click=${() => void this.switchLayout(i)} .text=${t[h[i]]}></calcite-action>`)}</calcite-action-group>`)}</calcite-action-bar>`;
  }
  render() {
    const { appearance: t } = this, o = t === "menu-bar" ? this._renderMenuBar() : this._renderDropdown();
    return e`<div class=${c(m(k.base, s.widget))}>${o}</div>`;
  }
}
d("arcgis-link-chart-layout-switcher", C);
export {
  C as ArcgisLinkChartLayoutSwitcher
};