@agrotools1/at-components 0.6.13 → 0.6.15

package/dist/node_modules/.pnpm/@esri_calcite-components@2.9.0/node_modules/@esri/calcite-components/dist/components/calcite-list-item.js

@@ -0,0 +1,348 @@
+import { proxyCustomElement as M, H as F, createEvent as d, h as i, Host as B } from "../../../../../../@stencil_core@4.18.2/node_modules/@stencil/core/internal/client/index.js";
+import { d as m, C as I, a as P, t as S } from "./dom.js";
+import { c as z, u as O, d as T, I as G } from "./interactive.js";
+import { c as K, d as $ } from "./locale.js";
+import { u as R, c as U, s as _, d as j } from "./t9n.js";
+import { s as W, a as q, c as J } from "./loadable.js";
+import { a as Q, g as V, b as X, u as Y } from "./utils3.js";
+import { a as v, I as f, C as s, S as C } from "./resources4.js";
+import { d as Z } from "./action.js";
+import { d as N } from "./handle.js";
+import { d as ee } from "./icon.js";
+import { d as te } from "./loader.js";
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.9.0
+ */
+const ne = `:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;flex-direction:column;background-color:var(--calcite-color-foreground-1);--calcite-list-item-icon-color:var(--calcite-color-brand)}:host([filter-hidden]),:host([closed]){display:none}.wrapper--bordered{border-block-end:1px solid var(--calcite-color-border-3)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.indent{display:flex;flex-direction:column;border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);margin-inline-start:var(--calcite-list-item-spacing-indent, 1.5rem)}.container{box-sizing:border-box;display:flex;flex:1 1 0%;background-color:var(--calcite-color-foreground-1)}.container *{box-sizing:border-box}.container--hover:hover{cursor:pointer;background-color:var(--calcite-color-foreground-2)}.container:active{background-color:var(--calcite-color-foreground-1)}.container--border{border-inline-start-width:4px;border-inline-start-style:solid}.container--border-selected{border-inline-start-color:var(--calcite-color-brand)}.container--border-unselected{border-inline-start-color:transparent}.container:hover.container--border-unselected{border-color:var(--calcite-color-border-1)}.nested-container{display:flex;flex-direction:column}.nested-container--hidden{display:none}.content-container{display:flex;flex:1 1 auto;-webkit-user-select:none;user-select:none;align-items:stretch;padding:0px;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}tr,td{outline-color:transparent}tr:focus,td:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(
+            -2px *
+            calc(
+              1 -
+              2 * clamp(
+                0,
+                var(--calcite-offset-invert-focus),
+                1
+              )
+            )
+          )}.content,.custom-content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem;font-size:var(--calcite-font-size--2);line-height:1.375}.label,.description,.content-bottom{font-family:var(--calcite-font-family);font-size:var(--calcite-font-size--2);font-weight:var(--calcite-font-weight-normal);word-wrap:break-word;word-break:break-word}.label:only-child,.description:only-child,.content-bottom:only-child{margin:0px;padding-block:0.25rem}.label{color:var(--calcite-color-text-1)}:host([selected]) .label{font-weight:var(--calcite-font-weight-medium)}.description{margin-block-start:0.125rem;color:var(--calcite-color-text-3)}:host([selected]) .description{color:var(--calcite-color-text-2)}.content-start{justify-content:flex-start}.content-end{justify-content:flex-end}.content-start,.content-end{flex:1 1 auto}.content-start ::slotted(calcite-icon),.content-end ::slotted(calcite-icon){margin-inline:0.75rem;align-self:center}.content-bottom{display:flex;flex-direction:column}.content-container--has-center-content .content-start,.content-container--has-center-content .content-end{flex:0 1 auto}.selection-container{display:flex;padding-inline:0.75rem;padding-block:0px;color:var(--calcite-color-border-input)}.selection-container--single{color:transparent}:host(:not([disabled]):not([selected])) .container:hover .selection-container--single{color:var(--calcite-color-border-1)}:host([selected]:hover) .selection-container,:host([selected]:hover) .selection-container--single,:host([selected]) .selection-container{color:var(--calcite-list-item-icon-color)}.open-container{color:var(--calcite-color-text-3)}:host(:not([disabled])) .container:hover .open-container{color:var(--calcite-color-text-1)}.actions-start,.actions-end,.content-start,.content-end,.selection-container,.drag-container,.open-container{display:flex;align-items:center}.actions-start calcite-action,.actions-start calcite-handle,.actions-end calcite-action,.actions-end calcite-handle,.content-start calcite-action,.content-start calcite-handle,.content-end calcite-action,.content-end calcite-handle,.selection-container calcite-action,.selection-container calcite-handle,.drag-container calcite-action,.drag-container calcite-handle,.open-container calcite-action,.open-container calcite-handle{align-self:stretch}.open-container,.selection-container{cursor:pointer}.actions-start,.actions-end{padding:0px}.actions-start ::slotted(calcite-action),.actions-start ::slotted(calcite-action-menu),.actions-start ::slotted(calcite-handle),.actions-start ::slotted(calcite-dropdown),.actions-end ::slotted(calcite-action),.actions-end ::slotted(calcite-action-menu),.actions-end ::slotted(calcite-handle),.actions-end ::slotted(calcite-dropdown){align-self:stretch;color:inherit}::slotted(calcite-list:empty){border-block-start-width:0px}:host([hidden]){display:none}[hidden]{display:none}`, ie = ne, b = /* @__PURE__ */ new Map(), se = "calcite-list", L = /* @__PURE__ */ M(class extends F {
+  constructor() {
+    super(), this.__registerHost(), this.__attachShadow(), this.calciteListItemSelect = d(this, "calciteListItemSelect", 6), this.calciteListItemClose = d(this, "calciteListItemClose", 6), this.calciteListItemDragHandleChange = d(this, "calciteListItemDragHandleChange", 6), this.calciteListItemToggle = d(this, "calciteListItemToggle", 6), this.calciteInternalListItemSelect = d(this, "calciteInternalListItemSelect", 6), this.calciteInternalListItemSelectMultiple = d(this, "calciteInternalListItemSelectMultiple", 6), this.calciteInternalListItemActive = d(this, "calciteInternalListItemActive", 6), this.calciteInternalFocusPreviousItem = d(this, "calciteInternalFocusPreviousItem", 6), this.calciteInternalListItemChange = d(this, "calciteInternalListItemChange", 6), this.calciteInternalListItemToggle = d(this, "calciteInternalListItemToggle", 6), this.dragHandleSelectedChangeHandler = (e) => {
+      this.dragSelected = e.target.selected, this.calciteListItemDragHandleChange.emit(), e.stopPropagation();
+    }, this.emitInternalListItemActive = () => {
+      this.calciteInternalListItemActive.emit();
+    }, this.focusCellHandle = () => {
+      this.handleCellFocusIn(this.handleGridEl);
+    }, this.focusCellActionsStart = () => {
+      this.handleCellFocusIn(this.actionsStartEl);
+    }, this.focusCellContent = () => {
+      this.handleCellFocusIn(this.contentEl);
+    }, this.focusCellActionsEnd = () => {
+      this.handleCellFocusIn(this.actionsEndEl);
+    }, this.handleCloseClick = () => {
+      this.closed = !0, this.calciteListItemClose.emit();
+    }, this.handleContentSlotChange = (e) => {
+      this.hasCustomContent = m(e);
+    }, this.handleActionsStartSlotChange = (e) => {
+      this.hasActionsStart = m(e);
+    }, this.handleActionsEndSlotChange = (e) => {
+      this.hasActionsEnd = m(e);
+    }, this.handleContentStartSlotChange = (e) => {
+      this.hasContentStart = m(e);
+    }, this.handleContentEndSlotChange = (e) => {
+      this.hasContentEnd = m(e);
+    }, this.handleContentBottomSlotChange = (e) => {
+      this.hasContentBottom = m(e);
+    }, this.handleDefaultSlotChange = (e) => {
+      this.handleOpenableChange(e.target);
+    }, this.handleToggleClick = () => {
+      this.toggle();
+    }, this.toggle = (e = !this.open) => {
+      this.open = e, this.calciteListItemToggle.emit();
+    }, this.handleItemClick = (e) => {
+      e.defaultPrevented || this.toggleSelected(e.shiftKey);
+    }, this.toggleSelected = (e) => {
+      const { selectionMode: t, selected: n } = this;
+      this.disabled || (t === "multiple" || t === "single" ? this.selected = !n : t === "single-persist" && (this.selected = !0), this.calciteInternalListItemSelectMultiple.emit({
+        selectMultiple: e && t === "multiple"
+      }), this.calciteListItemSelect.emit());
+    }, this.handleItemKeyDown = (e) => {
+      if (e.defaultPrevented)
+        return;
+      const { key: t } = e, n = e.composedPath(), { containerEl: l, actionsStartEl: o, actionsEndEl: a, open: r, openable: g } = this, c = this.getGridCells(), h = c.findIndex((u) => n.includes(u));
+      if (t === "Enter" && !n.includes(o) && !n.includes(a))
+        e.preventDefault(), this.toggleSelected(e.shiftKey);
+      else if (t === "ArrowRight") {
+        e.preventDefault();
+        const u = h + 1;
+        h === -1 ? !r && g ? (this.toggle(!0), this.focusCell(null)) : c[0] && this.focusCell(c[0]) : c[h] && c[u] && this.focusCell(c[u]);
+      } else if (t === "ArrowLeft") {
+        e.preventDefault();
+        const u = h - 1;
+        h === -1 ? (this.focusCell(null), r && g ? this.toggle(!1) : this.calciteInternalFocusPreviousItem.emit()) : h === 0 ? (this.focusCell(null), l.focus()) : c[h] && c[u] && this.focusCell(c[u]);
+      }
+    }, this.focusCellNull = () => {
+      this.focusCell(null);
+    }, this.handleCellFocusIn = (e) => {
+      this.setFocusCell(e, I(e), !0);
+    }, this.setFocusCell = (e, t, n) => {
+      const { parentListEl: l } = this;
+      n && b.set(l, null);
+      const o = this.getGridCells();
+      o.forEach((a) => {
+        a.tabIndex = -1, a.removeAttribute(v);
+      }), e && (e.tabIndex = e === t ? 0 : -1, e.setAttribute(v, ""), n && b.set(l, o.indexOf(e)));
+    }, this.focusCell = (e, t = !0) => {
+      const n = I(e);
+      this.setFocusCell(e, n, t), n == null || n.focus();
+    }, this.active = !1, this.bordered = !1, this.closable = !1, this.closed = !1, this.description = void 0, this.disabled = !1, this.dragDisabled = !1, this.dragHandle = !1, this.dragSelected = !1, this.filterHidden = !1, this.label = void 0, this.metadata = void 0, this.open = !1, this.setSize = null, this.setPosition = null, this.selected = !1, this.value = void 0, this.selectionMode = null, this.selectionAppearance = null, this.messageOverrides = void 0, this.messages = void 0, this.effectiveLocale = "", this.defaultMessages = void 0, this.level = null, this.parentListEl = void 0, this.openable = !1, this.hasActionsStart = !1, this.hasActionsEnd = !1, this.hasCustomContent = !1, this.hasContentStart = !1, this.hasContentEnd = !1, this.hasContentBottom = !1;
+  }
+  activeHandler(e) {
+    e || this.focusCell(null, !1);
+  }
+  handleClosedChange() {
+    this.emitCalciteInternalListItemChange();
+  }
+  handleDisabledChange() {
+    this.emitCalciteInternalListItemChange();
+  }
+  handleOpenChange() {
+    this.emitCalciteInternalListItemToggle();
+  }
+  handleSelectedChange() {
+    this.calciteInternalListItemSelect.emit();
+  }
+  onMessagesChange() {
+  }
+  handleCalciteInternalListDefaultSlotChanges(e) {
+    e.stopPropagation(), this.handleOpenableChange(this.defaultSlotEl);
+  }
+  effectiveLocaleChange() {
+    R(this, this.effectiveLocale);
+  }
+  // --------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  // --------------------------------------------------------------------------
+  connectedCallback() {
+    z(this), K(this), U(this);
+    const { el: e } = this;
+    this.parentListEl = e.closest(se), this.level = Q(e) + 1, this.setSelectionDefaults();
+  }
+  async componentWillLoad() {
+    W(this), await _(this);
+  }
+  componentDidLoad() {
+    q(this);
+  }
+  componentDidRender() {
+    O(this);
+  }
+  disconnectedCallback() {
+    T(this), $(this), j(this);
+  }
+  // --------------------------------------------------------------------------
+  //
+  //  Public Methods
+  //
+  // --------------------------------------------------------------------------
+  /** Sets focus on the component. */
+  async setFocus() {
+    await J(this);
+    const { containerEl: e, parentListEl: t } = this, n = b.get(t);
+    if (typeof n == "number") {
+      const l = this.getGridCells();
+      l[n] ? this.focusCell(l[n]) : e == null || e.focus();
+      return;
+    }
+    e == null || e.focus();
+  }
+  // --------------------------------------------------------------------------
+  //
+  //  Render Methods
+  //
+  // --------------------------------------------------------------------------
+  renderSelected() {
+    const { selected: e, selectionMode: t, selectionAppearance: n } = this;
+    return t === "none" || n === "border" ? null : i("td", { class: {
+      [s.selectionContainer]: !0,
+      [s.selectionContainerSingle]: t === "single" || t === "single-persist"
+    }, key: "selection-container", onClick: this.handleItemClick }, i("calcite-icon", { icon: e ? t === "multiple" ? f.selectedMultiple : f.selectedSingle : t === "multiple" ? f.unselectedMultiple : f.unselectedSingle, scale: "s" }));
+  }
+  renderDragHandle() {
+    const { label: e, dragHandle: t, dragSelected: n, dragDisabled: l, setPosition: o, setSize: a } = this;
+    return t ? i("td", { "aria-label": e, class: s.dragContainer, key: "drag-handle-container", onFocusin: this.focusCellHandle, ref: (r) => this.handleGridEl = r, role: "gridcell" }, i("calcite-handle", { disabled: l, label: e, onCalciteHandleChange: this.dragHandleSelectedChangeHandler, selected: n, setPosition: o, setSize: a })) : null;
+  }
+  renderOpen() {
+    const { el: e, open: t, openable: n, messages: l } = this, o = P(e), a = t ? f.open : o === "rtl" ? f.closedRTL : f.closedLTR, r = t ? l.collapse : l.expand;
+    return n ? i("td", { class: s.openContainer, key: "open-container", onClick: this.handleToggleClick, title: r }, i("calcite-icon", { icon: a, key: a, scale: "s" })) : null;
+  }
+  renderActionsStart() {
+    const { label: e, hasActionsStart: t } = this;
+    return i("td", { "aria-label": e, class: s.actionsStart, hidden: !t, key: "actions-start-container", onFocusin: this.focusCellActionsStart, ref: (n) => this.actionsStartEl = n, role: "gridcell" }, i("slot", { name: C.actionsStart, onSlotchange: this.handleActionsStartSlotChange }));
+  }
+  renderActionsEnd() {
+    const { label: e, hasActionsEnd: t, closable: n, messages: l } = this;
+    return i("td", { "aria-label": e, class: s.actionsEnd, hidden: !(t || n), key: "actions-end-container", onFocusin: this.focusCellActionsEnd, ref: (o) => this.actionsEndEl = o, role: "gridcell" }, i("slot", { name: C.actionsEnd, onSlotchange: this.handleActionsEndSlotChange }), n ? i("calcite-action", { appearance: "transparent", icon: f.close, key: "close-action", label: l.close, onClick: this.handleCloseClick, text: l.close }) : null);
+  }
+  renderContentStart() {
+    const { hasContentStart: e } = this;
+    return i("div", { class: s.contentStart, hidden: !e }, i("slot", { name: C.contentStart, onSlotchange: this.handleContentStartSlotChange }));
+  }
+  renderCustomContent() {
+    const { hasCustomContent: e } = this;
+    return i("div", { class: s.customContent, hidden: !e }, i("slot", { name: C.content, onSlotchange: this.handleContentSlotChange }));
+  }
+  renderContentEnd() {
+    const { hasContentEnd: e } = this;
+    return i("div", { class: s.contentEnd, hidden: !e }, i("slot", { name: C.contentEnd, onSlotchange: this.handleContentEndSlotChange }));
+  }
+  renderContentBottom() {
+    const { hasContentBottom: e } = this;
+    return i("div", { class: s.contentBottom, hidden: !e }, i("slot", { name: C.contentBottom, onSlotchange: this.handleContentBottomSlotChange }));
+  }
+  renderDefaultContainer() {
+    return i("div", { class: {
+      [s.nestedContainer]: !0,
+      [s.nestedContainerHidden]: this.openable && !this.open
+    } }, i("slot", { onSlotchange: this.handleDefaultSlotChange, ref: (e) => this.defaultSlotEl = e }));
+  }
+  renderContentProperties() {
+    const { label: e, description: t, hasCustomContent: n } = this;
+    return !n && (e || t) ? i("div", { class: s.content, key: "content" }, e ? i("div", { class: s.label, key: "label" }, e) : null, t ? i("div", { class: s.description, key: "description" }, t) : null) : null;
+  }
+  renderContentContainer() {
+    const { description: e, label: t, selectionMode: n, hasCustomContent: l } = this, o = l || !!t || !!e, a = [
+      this.renderContentStart(),
+      this.renderCustomContent(),
+      this.renderContentProperties(),
+      this.renderContentEnd()
+    ];
+    return i("td", { "aria-label": t, class: {
+      [s.contentContainer]: !0,
+      [s.contentContainerSelectable]: n !== "none",
+      [s.contentContainerHasCenterContent]: o
+    }, key: "content-container", onClick: this.handleItemClick, onFocusin: this.focusCellContent, ref: (r) => this.contentEl = r, role: "gridcell" }, a);
+  }
+  render() {
+    const { openable: e, open: t, level: n, setPosition: l, setSize: o, active: a, label: r, selected: g, selectionAppearance: c, selectionMode: h, closed: u, filterHidden: x, bordered: k, disabled: A } = this, p = h !== "none" && c === "border", w = p && g, D = p && !g;
+    return i(B, { key: "16f6ec1a905814658f476cd1b1e267c789049c70" }, i(G, { key: "ee4cc1488a237e8cb25d30d3d4f3925972745fec", disabled: A }, i("div", { key: "f8a5f0520817d8243e9b6fbc5c8467c727b72d52", class: { [s.wrapper]: !0, [s.wrapperBordered]: k } }, i("tr", { key: "b2dd6b114bea5f5f10e7bfcfd1a9d40d9ee4b3b1", "aria-expanded": e ? S(t) : null, "aria-label": r, "aria-level": n, "aria-posinset": l, "aria-selected": S(g), "aria-setsize": o, class: {
+      [s.container]: !0,
+      [s.containerHover]: !0,
+      [s.containerBorder]: p,
+      [s.containerBorderSelected]: w,
+      [s.containerBorderUnselected]: D
+    }, hidden: u || x, onFocus: this.focusCellNull, onFocusin: this.emitInternalListItemActive, onKeyDown: this.handleItemKeyDown, ref: (H) => this.containerEl = H, role: "row", tabIndex: a ? 0 : -1 }, this.renderDragHandle(), this.renderSelected(), this.renderOpen(), this.renderActionsStart(), this.renderContentContainer(), this.renderActionsEnd()), this.renderContentBottom()), i("div", { key: "43f56fd461303153e1b6311c44a5597b930b118d", class: s.indent }, this.renderDefaultContainer())));
+  }
+  emitCalciteInternalListItemToggle() {
+    this.calciteInternalListItemToggle.emit();
+  }
+  emitCalciteInternalListItemChange() {
+    this.calciteInternalListItemChange.emit();
+  }
+  setSelectionDefaults() {
+    const { parentListEl: e, selectionMode: t, selectionAppearance: n } = this;
+    e && (t || (this.selectionMode = e.selectionMode), n || (this.selectionAppearance = e.selectionAppearance));
+  }
+  handleOpenableChange(e) {
+    if (!e)
+      return;
+    const t = V(e), n = X(e);
+    Y(t), this.openable = !!t.length || !!n.length;
+  }
+  getGridCells() {
+    return [this.handleGridEl, this.actionsStartEl, this.contentEl, this.actionsEndEl].filter((e) => e && !e.hidden);
+  }
+  static get assetsDirs() {
+    return ["assets"];
+  }
+  get el() {
+    return this;
+  }
+  static get watchers() {
+    return {
+      active: ["activeHandler"],
+      closed: ["handleClosedChange"],
+      disabled: ["handleDisabledChange"],
+      open: ["handleOpenChange"],
+      selected: ["handleSelectedChange"],
+      messageOverrides: ["onMessagesChange"],
+      effectiveLocale: ["effectiveLocaleChange"]
+    };
+  }
+  static get style() {
+    return ie;
+  }
+}, [1, "calcite-list-item", {
+  active: [4],
+  bordered: [4],
+  closable: [516],
+  closed: [1540],
+  description: [1],
+  disabled: [516],
+  dragDisabled: [516, "drag-disabled"],
+  dragHandle: [4, "drag-handle"],
+  dragSelected: [1540, "drag-selected"],
+  filterHidden: [516, "filter-hidden"],
+  label: [1],
+  metadata: [16],
+  open: [1540],
+  setSize: [2, "set-size"],
+  setPosition: [2, "set-position"],
+  selected: [1540],
+  value: [8],
+  selectionMode: [1025, "selection-mode"],
+  selectionAppearance: [1025, "selection-appearance"],
+  messageOverrides: [1040],
+  messages: [1040],
+  effectiveLocale: [32],
+  defaultMessages: [32],
+  level: [32],
+  parentListEl: [32],
+  openable: [32],
+  hasActionsStart: [32],
+  hasActionsEnd: [32],
+  hasCustomContent: [32],
+  hasContentStart: [32],
+  hasContentEnd: [32],
+  hasContentBottom: [32],
+  setFocus: [64]
+}, [[0, "calciteInternalListItemGroupDefaultSlotChange", "handleCalciteInternalListDefaultSlotChanges"], [0, "calciteInternalListDefaultSlotChange", "handleCalciteInternalListDefaultSlotChanges"]], {
+  active: ["activeHandler"],
+  closed: ["handleClosedChange"],
+  disabled: ["handleDisabledChange"],
+  open: ["handleOpenChange"],
+  selected: ["handleSelectedChange"],
+  messageOverrides: ["onMessagesChange"],
+  effectiveLocale: ["effectiveLocaleChange"]
+}]);
+function y() {
+  if (typeof customElements > "u")
+    return;
+  ["calcite-list-item", "calcite-action", "calcite-handle", "calcite-icon", "calcite-loader"].forEach((e) => {
+    switch (e) {
+      case "calcite-list-item":
+        customElements.get(e) || customElements.define(e, L);
+        break;
+      case "calcite-action":
+        customElements.get(e) || Z();
+        break;
+      case "calcite-handle":
+        customElements.get(e) || N();
+        break;
+      case "calcite-icon":
+        customElements.get(e) || ee();
+        break;
+      case "calcite-loader":
+        customElements.get(e) || te();
+        break;
+    }
+  });
+}
+y();
+const be = L, Ie = y;
+export {
+  be as CalciteListItem,
+  Ie as defineCustomElement
+};