@esri/solutions-components 0.2.3 → 0.2.4

package/dist/solutions-components/p-794ba85d.entry.js

@@ -0,0 +1,175 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { r as registerInstance, c as createEvent, h, g as getElement } from './p-58c69df2.js';
+import { T as TEXT, C as CSS, I as ICONS, H as HEADING_LEVEL } from './p-e611d8c8.js';
+import { b as getElementDir, t as toAriaBoolean } from './p-32a67cb2.js';
+import { H as Heading } from './p-eeb0321d.js';
+import { c as createObserver } from './p-9a9955db.js';
+import './p-729708a3.js';
+import './p-a80b3880.js';
+
+const tipManagerCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host{box-sizing:border-box;display:block;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2);--calcite-tip-manager-height:19vh}:host *{box-sizing:border-box}:host([closed]){display:none}.header{margin:0px;display:flex;align-content:space-between;align-items:center;fill:var(--calcite-ui-text-2);color:var(--calcite-ui-text-2)}.heading{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}.header .heading{flex:1 1 auto;padding:0.5rem}.header{border-width:0px;border-block-end-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);padding-block:0px;-webkit-padding-end:0px;padding-inline-end:0px;-webkit-padding-start:1rem;padding-inline-start:1rem}.header .heading{padding:0px;font-size:var(--calcite-font-size-1);line-height:1.5rem;font-weight:var(--calcite-font-weight-bold);color:var(--calcite-ui-text-1)}.container{position:relative;overflow:hidden;outline-color:transparent;min-block-size:150px}.container:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}.tip-container{-webkit-margin-before:1px;margin-block-start:1px;display:flex;align-items:flex-start;justify-content:center;overflow:auto;outline-color:transparent;animation-name:none;animation-duration:var(--calcite-animation-timing);block-size:var(--calcite-tip-manager-height)}.tip-container:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}::slotted(calcite-tip){border-style:none;padding:0.75rem;max-inline-size:var(--calcite-tip-max-width)}.tip-container--advancing{animation-name:tip-advance}.tip-container--retreating{animation-name:tip-retreat}.pagination{display:flex;align-items:center;justify-content:center;padding-inline:0px;padding-block:0.75rem 0.5rem}.page-position{margin-block:0px;margin-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}@keyframes tip-advance{0%{opacity:0;transform:translate3d(50px, 0, 0) scale(0.99)}100%{opacity:1;transform:translate3d(0, 0, 0) scale(1)}}@keyframes tip-retreat{0%{opacity:0;transform:translate3d(-50px, 0, 0) scale(0.99)}100%{opacity:1;transform:translate3d(0, 0, 0) scale(1)}}";
+
+const TipManager = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.calciteTipManagerToggle = createEvent(this, "calciteTipManagerToggle", 6);
+    this.calciteTipManagerClose = createEvent(this, "calciteTipManagerClose", 6);
+    // --------------------------------------------------------------------------
+    //
+    //  Properties
+    //
+    // --------------------------------------------------------------------------
+    /**
+     * When `true`, does not display or position the component.
+     */
+    this.closed = false;
+    this.mutationObserver = createObserver("mutation", () => this.setUpTips());
+    this.hideTipManager = () => {
+      this.closed = true;
+      this.calciteTipManagerToggle.emit();
+      this.calciteTipManagerClose.emit();
+    };
+    this.previousClicked = () => {
+      this.previousTip();
+    };
+    this.nextClicked = () => {
+      this.nextTip();
+    };
+    this.tipManagerKeyDownHandler = (event) => {
+      if (event.target !== this.container) {
+        return;
+      }
+      switch (event.key) {
+        case "ArrowRight":
+          event.preventDefault();
+          this.nextTip();
+          break;
+        case "ArrowLeft":
+          event.preventDefault();
+          this.previousTip();
+          break;
+        case "Home":
+          event.preventDefault();
+          this.selectedIndex = 0;
+          break;
+        case "End":
+          event.preventDefault();
+          this.selectedIndex = this.total - 1;
+          break;
+      }
+    };
+    this.storeContainerRef = (el) => {
+      this.container = el;
+    };
+  }
+  closedChangeHandler() {
+    this.direction = null;
+    this.calciteTipManagerToggle.emit();
+  }
+  selectedChangeHandler() {
+    this.showSelectedTip();
+    this.updateGroupTitle();
+  }
+  // --------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  // --------------------------------------------------------------------------
+  connectedCallback() {
+    var _a;
+    this.setUpTips();
+    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
+  }
+  disconnectedCallback() {
+    var _a;
+    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+  }
+  // --------------------------------------------------------------------------
+  //
+  //  Public Methods
+  //
+  // --------------------------------------------------------------------------
+  /** Selects the next `calcite-tip` to display. */
+  async nextTip() {
+    this.direction = "advancing";
+    const nextIndex = this.selectedIndex + 1;
+    this.selectedIndex = (nextIndex + this.total) % this.total;
+  }
+  /** Selects the previous `calcite-tip` to display. */
+  async previousTip() {
+    this.direction = "retreating";
+    const previousIndex = this.selectedIndex - 1;
+    this.selectedIndex = (previousIndex + this.total) % this.total;
+  }
+  // --------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  // --------------------------------------------------------------------------
+  setUpTips() {
+    const tips = Array.from(this.el.querySelectorAll("calcite-tip"));
+    this.total = tips.length;
+    if (this.total === 0) {
+      return;
+    }
+    const selectedTip = this.el.querySelector("calcite-tip[selected]");
+    this.tips = tips;
+    this.selectedIndex = selectedTip ? tips.indexOf(selectedTip) : 0;
+    tips.forEach((tip) => {
+      tip.nonDismissible = true;
+    });
+    this.showSelectedTip();
+    this.updateGroupTitle();
+  }
+  showSelectedTip() {
+    this.tips.forEach((tip, index) => {
+      const isSelected = this.selectedIndex === index;
+      tip.selected = isSelected;
+      tip.hidden = !isSelected;
+    });
+  }
+  updateGroupTitle() {
+    const selectedTip = this.tips[this.selectedIndex];
+    const tipParent = selectedTip.closest("calcite-tip-group");
+    this.groupTitle = (tipParent === null || tipParent === void 0 ? void 0 : tipParent.groupTitle) || this.intlDefaultTitle || TEXT.defaultGroupTitle;
+  }
+  // --------------------------------------------------------------------------
+  //
+  //  Render Methods
+  //
+  // --------------------------------------------------------------------------
+  renderPagination() {
+    const dir = getElementDir(this.el);
+    const { selectedIndex, tips, total, intlNext, intlPrevious, intlPaginationLabel } = this;
+    const nextLabel = intlNext || TEXT.next;
+    const previousLabel = intlPrevious || TEXT.previous;
+    const paginationLabel = intlPaginationLabel || TEXT.defaultPaginationLabel;
+    return tips.length > 1 ? (h("footer", { class: CSS.pagination }, h("calcite-action", { class: CSS.pagePrevious, icon: dir === "ltr" ? ICONS.chevronLeft : ICONS.chevronRight, onClick: this.previousClicked, scale: "m", text: previousLabel }), h("span", { class: CSS.pagePosition }, `${paginationLabel} ${selectedIndex + 1}/${total}`), h("calcite-action", { class: CSS.pageNext, icon: dir === "ltr" ? ICONS.chevronRight : ICONS.chevronLeft, onClick: this.nextClicked, scale: "m", text: nextLabel }))) : null;
+  }
+  render() {
+    const { closed, direction, headingLevel, groupTitle, selectedIndex, intlClose, total } = this;
+    const closeLabel = intlClose || TEXT.close;
+    if (total === 0) {
+      return null;
+    }
+    return (h("section", { "aria-hidden": toAriaBoolean(closed), class: CSS.container, hidden: closed, onKeyDown: this.tipManagerKeyDownHandler, ref: this.storeContainerRef, tabIndex: 0 }, h("header", { class: CSS.header }, h(Heading, { class: CSS.heading, level: headingLevel || HEADING_LEVEL }, groupTitle), h("calcite-action", { class: CSS.close, onClick: this.hideTipManager, scale: "m", text: closeLabel }, h("calcite-icon", { icon: ICONS.close, scale: "m" }))), h("div", { class: {
+        [CSS.tipContainer]: true,
+        [CSS.tipContainerAdvancing]: !closed && direction === "advancing",
+        [CSS.tipContainerRetreating]: !closed && direction === "retreating"
+      }, key: selectedIndex, tabIndex: 0 }, h("slot", null)), this.renderPagination()));
+  }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "closed": ["closedChangeHandler"],
+    "selectedIndex": ["selectedChangeHandler"]
+  }; }
+};
+TipManager.style = tipManagerCss;
+
+export { TipManager as calcite_tip_manager };
+
+//# sourceMappingURL=p-794ba85d.entry.js.map

package/dist/solutions-components/p-794ba85d.entry.js.map

@@ -0,0 +1 @@
+{"file":"calcite-tip-manager.entry.esm.js","mappings":"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","names":[],"sources":["./node_modules/@esri/calcite-components/dist/collection/components/tip-manager/tip-manager.css?tag=calcite-tip-manager&encapsulation=shadow","./node_modules/@esri/calcite-components/dist/collection/components/tip-manager/tip-manager.js"],"sourcesContent":["/* mixins & extensions */\n@keyframes in {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n@keyframes in-down {\n  0% {\n    opacity: 0;\n    transform: translate3D(0, -5px, 0);\n  }\n  100% {\n    opacity: 1;\n    transform: translate3D(0, 0, 0);\n  }\n}\n@keyframes in-up {\n  0% {\n    opacity: 0;\n    transform: translate3D(0, 5px, 0);\n  }\n  100% {\n    opacity: 1;\n    transform: translate3D(0, 0, 0);\n  }\n}\n@keyframes in-scale {\n  0% {\n    opacity: 0;\n    transform: scale3D(0.95, 0.95, 1);\n  }\n  100% {\n    opacity: 1;\n    transform: scale3D(1, 1, 1);\n  }\n}\n:root {\n  --calcite-animation-timing: calc(150ms * var(--calcite-internal-duration-factor));\n  --calcite-internal-duration-factor: var(--calcite-duration-factor, 1);\n  --calcite-internal-animation-timing-fast: calc(100ms * var(--calcite-internal-duration-factor));\n  --calcite-internal-animation-timing-medium: calc(200ms * var(--calcite-internal-duration-factor));\n  --calcite-internal-animation-timing-slow: calc(300ms * var(--calcite-internal-duration-factor));\n}\n\n.calcite-animate {\n  opacity: 0;\n  animation-fill-mode: both;\n  animation-duration: var(--calcite-animation-timing);\n}\n\n.calcite-animate__in {\n  animation-name: in;\n}\n\n.calcite-animate__in-down {\n  animation-name: in-down;\n}\n\n.calcite-animate__in-up {\n  animation-name: in-up;\n}\n\n.calcite-animate__in-scale {\n  animation-name: in-scale;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :root {\n    --calcite-internal-duration-factor: 0.01;\n  }\n}\n/**\n* Currently only used in Checkbox.\n*/\n:root {\n  --calcite-floating-ui-transition: var(--calcite-animation-timing);\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n/**\n* CSS Custom Properties\n*\n* These properties can be overridden using the component's tag as selector.\n*\n* @prop --calcite-tip-manager-height: The maximum height of the component.\n* @prop --calcite-tip-max-width: The maximum width of a slotted `calcite-tip` within the component.\n*/\n:host {\n  box-sizing: border-box;\n  display: block;\n  background-color: var(--calcite-ui-foreground-1);\n  font-size: var(--calcite-font-size--1);\n  line-height: 1rem;\n  color: var(--calcite-ui-text-2);\n  --calcite-tip-manager-height: 19vh;\n}\n:host * {\n  box-sizing: border-box;\n}\n\n:host([closed]) {\n  display: none;\n}\n\n/* Shared styles for header elements */\n.header {\n  margin: 0px;\n  display: flex;\n  align-content: space-between;\n  align-items: center;\n  fill: var(--calcite-ui-text-2);\n  color: var(--calcite-ui-text-2);\n}\n\n.heading {\n  margin: 0px;\n  padding: 0px;\n  font-weight: var(--calcite-font-weight-medium);\n}\n\n.header .heading {\n  flex: 1 1 auto;\n  padding: 0.5rem;\n}\n\n.header {\n  border-width: 0px;\n  border-block-end-width: 1px;\n  border-style: solid;\n  border-color: var(--calcite-ui-border-3);\n  padding-block: 0px;\n  padding-inline-end: 0px;\n  padding-inline-start: 1rem;\n}\n.header .heading {\n  padding: 0px;\n  font-size: var(--calcite-font-size-1);\n  line-height: 1.5rem;\n  font-weight: var(--calcite-font-weight-bold);\n  color: var(--calcite-ui-text-1);\n}\n\n.container {\n  position: relative;\n  overflow: hidden;\n  outline-color: transparent;\n  min-block-size: 150px;\n}\n.container:focus {\n  outline: 2px solid var(--calcite-ui-brand);\n  outline-offset: 2px;\n}\n\n.tip-container {\n  margin-block-start: 1px;\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  overflow: auto;\n  outline-color: transparent;\n  animation-name: none;\n  animation-duration: var(--calcite-animation-timing);\n  block-size: var(--calcite-tip-manager-height);\n}\n.tip-container:focus {\n  outline: 2px solid var(--calcite-ui-brand);\n  outline-offset: 2px;\n}\n\n::slotted(calcite-tip) {\n  border-style: none;\n  padding: 0.75rem;\n  max-inline-size: var(--calcite-tip-max-width);\n}\n\n.tip-container--advancing {\n  animation-name: tip-advance;\n}\n\n.tip-container--retreating {\n  animation-name: tip-retreat;\n}\n\n/* Pagination Styles*/\n.pagination {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding-inline: 0px;\n  padding-block: 0.75rem 0.5rem;\n}\n\n.page-position {\n  margin-block: 0px;\n  margin-inline: 0.5rem;\n  font-size: var(--calcite-font-size--2);\n  line-height: 1rem;\n}\n\n/* @keyframes*/\n@keyframes tip-advance {\n  0% {\n    opacity: 0;\n    transform: translate3d(50px, 0, 0) scale(0.99);\n  }\n  100% {\n    opacity: 1;\n    transform: translate3d(0, 0, 0) scale(1);\n  }\n}\n@keyframes tip-retreat {\n  0% {\n    opacity: 0;\n    transform: translate3d(-50px, 0, 0) scale(0.99);\n  }\n  100% {\n    opacity: 1;\n    transform: translate3d(0, 0, 0) scale(1);\n  }\n}","/*!\n * All material copyright ESRI, All Rights Reserved, unless otherwise specified.\n * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.\n * v1.0.0-beta.97\n */\nimport { h } from \"@stencil/core\";\nimport { CSS, ICONS, TEXT, HEADING_LEVEL } from \"./resources\";\nimport { getElementDir, toAriaBoolean } from \"../../utils/dom\";\nimport { Heading } from \"../functional/Heading\";\nimport { createObserver } from \"../../utils/observers\";\n/**\n * @slot - A slot for adding `calcite-tip`s.\n */\nexport class TipManager {\n  constructor() {\n    // --------------------------------------------------------------------------\n    //\n    //  Properties\n    //\n    // --------------------------------------------------------------------------\n    /**\n     * When `true`, does not display or position the component.\n     */\n    this.closed = false;\n    this.mutationObserver = createObserver(\"mutation\", () => this.setUpTips());\n    this.hideTipManager = () => {\n      this.closed = true;\n      this.calciteTipManagerToggle.emit();\n      this.calciteTipManagerClose.emit();\n    };\n    this.previousClicked = () => {\n      this.previousTip();\n    };\n    this.nextClicked = () => {\n      this.nextTip();\n    };\n    this.tipManagerKeyDownHandler = (event) => {\n      if (event.target !== this.container) {\n        return;\n      }\n      switch (event.key) {\n        case \"ArrowRight\":\n          event.preventDefault();\n          this.nextTip();\n          break;\n        case \"ArrowLeft\":\n          event.preventDefault();\n          this.previousTip();\n          break;\n        case \"Home\":\n          event.preventDefault();\n          this.selectedIndex = 0;\n          break;\n        case \"End\":\n          event.preventDefault();\n          this.selectedIndex = this.total - 1;\n          break;\n      }\n    };\n    this.storeContainerRef = (el) => {\n      this.container = el;\n    };\n  }\n  closedChangeHandler() {\n    this.direction = null;\n    this.calciteTipManagerToggle.emit();\n  }\n  selectedChangeHandler() {\n    this.showSelectedTip();\n    this.updateGroupTitle();\n  }\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n  connectedCallback() {\n    var _a;\n    this.setUpTips();\n    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });\n  }\n  disconnectedCallback() {\n    var _a;\n    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();\n  }\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n  /** Selects the next `calcite-tip` to display. */\n  async nextTip() {\n    this.direction = \"advancing\";\n    const nextIndex = this.selectedIndex + 1;\n    this.selectedIndex = (nextIndex + this.total) % this.total;\n  }\n  /** Selects the previous `calcite-tip` to display. */\n  async previousTip() {\n    this.direction = \"retreating\";\n    const previousIndex = this.selectedIndex - 1;\n    this.selectedIndex = (previousIndex + this.total) % this.total;\n  }\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n  setUpTips() {\n    const tips = Array.from(this.el.querySelectorAll(\"calcite-tip\"));\n    this.total = tips.length;\n    if (this.total === 0) {\n      return;\n    }\n    const selectedTip = this.el.querySelector(\"calcite-tip[selected]\");\n    this.tips = tips;\n    this.selectedIndex = selectedTip ? tips.indexOf(selectedTip) : 0;\n    tips.forEach((tip) => {\n      tip.nonDismissible = true;\n    });\n    this.showSelectedTip();\n    this.updateGroupTitle();\n  }\n  showSelectedTip() {\n    this.tips.forEach((tip, index) => {\n      const isSelected = this.selectedIndex === index;\n      tip.selected = isSelected;\n      tip.hidden = !isSelected;\n    });\n  }\n  updateGroupTitle() {\n    const selectedTip = this.tips[this.selectedIndex];\n    const tipParent = selectedTip.closest(\"calcite-tip-group\");\n    this.groupTitle = (tipParent === null || tipParent === void 0 ? void 0 : tipParent.groupTitle) || this.intlDefaultTitle || TEXT.defaultGroupTitle;\n  }\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n  renderPagination() {\n    const dir = getElementDir(this.el);\n    const { selectedIndex, tips, total, intlNext, intlPrevious, intlPaginationLabel } = this;\n    const nextLabel = intlNext || TEXT.next;\n    const previousLabel = intlPrevious || TEXT.previous;\n    const paginationLabel = intlPaginationLabel || TEXT.defaultPaginationLabel;\n    return tips.length > 1 ? (h(\"footer\", { class: CSS.pagination }, h(\"calcite-action\", { class: CSS.pagePrevious, icon: dir === \"ltr\" ? ICONS.chevronLeft : ICONS.chevronRight, onClick: this.previousClicked, scale: \"m\", text: previousLabel }), h(\"span\", { class: CSS.pagePosition }, `${paginationLabel} ${selectedIndex + 1}/${total}`), h(\"calcite-action\", { class: CSS.pageNext, icon: dir === \"ltr\" ? ICONS.chevronRight : ICONS.chevronLeft, onClick: this.nextClicked, scale: \"m\", text: nextLabel }))) : null;\n  }\n  render() {\n    const { closed, direction, headingLevel, groupTitle, selectedIndex, intlClose, total } = this;\n    const closeLabel = intlClose || TEXT.close;\n    if (total === 0) {\n      return null;\n    }\n    return (h(\"section\", { \"aria-hidden\": toAriaBoolean(closed), class: CSS.container, hidden: closed, onKeyDown: this.tipManagerKeyDownHandler, ref: this.storeContainerRef, tabIndex: 0 }, h(\"header\", { class: CSS.header }, h(Heading, { class: CSS.heading, level: headingLevel || HEADING_LEVEL }, groupTitle), h(\"calcite-action\", { class: CSS.close, onClick: this.hideTipManager, scale: \"m\", text: closeLabel }, h(\"calcite-icon\", { icon: ICONS.close, scale: \"m\" }))), h(\"div\", { class: {\n        [CSS.tipContainer]: true,\n        [CSS.tipContainerAdvancing]: !closed && direction === \"advancing\",\n        [CSS.tipContainerRetreating]: !closed && direction === \"retreating\"\n      }, key: selectedIndex, tabIndex: 0 }, h(\"slot\", null)), this.renderPagination()));\n  }\n  static get is() { return \"calcite-tip-manager\"; }\n  static get encapsulation() { return \"shadow\"; }\n  static get originalStyleUrls() {\n    return {\n      \"$\": [\"tip-manager.scss\"]\n    };\n  }\n  static get styleUrls() {\n    return {\n      \"$\": [\"tip-manager.css\"]\n    };\n  }\n  static get properties() {\n    return {\n      \"closed\": {\n        \"type\": \"boolean\",\n        \"mutable\": true,\n        \"complexType\": {\n          \"original\": \"boolean\",\n          \"resolved\": \"boolean\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": false,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"When `true`, does not display or position the component.\"\n        },\n        \"attribute\": \"closed\",\n        \"reflect\": true,\n        \"defaultValue\": \"false\"\n      },\n      \"headingLevel\": {\n        \"type\": \"number\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"HeadingLevel\",\n          \"resolved\": \"1 | 2 | 3 | 4 | 5 | 6\",\n          \"references\": {\n            \"HeadingLevel\": {\n              \"location\": \"import\",\n              \"path\": \"../functional/Heading\"\n            }\n          }\n        },\n        \"required\": false,\n        \"optional\": false,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Specifies the number at which section headings should start.\"\n        },\n        \"attribute\": \"heading-level\",\n        \"reflect\": true\n      },\n      \"intlClose\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Accessible name for the component's close button.\"\n        },\n        \"attribute\": \"intl-close\",\n        \"reflect\": false\n      },\n      \"intlDefaultTitle\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Accessible name for the `calcite-tip-group` title.\"\n        },\n        \"attribute\": \"intl-default-title\",\n        \"reflect\": false\n      },\n      \"intlNext\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Accessible name for navigating to the next tip.\"\n        },\n        \"attribute\": \"intl-next\",\n        \"reflect\": false\n      },\n      \"intlPaginationLabel\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Text that accompanies the component's pagination.\"\n        },\n        \"attribute\": \"intl-pagination-label\",\n        \"reflect\": false\n      },\n      \"intlPrevious\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Accessible name for navigating to the previous tip.\"\n        },\n        \"attribute\": \"intl-previous\",\n        \"reflect\": false\n      }\n    };\n  }\n  static get states() {\n    return {\n      \"selectedIndex\": {},\n      \"tips\": {},\n      \"total\": {},\n      \"direction\": {},\n      \"groupTitle\": {}\n    };\n  }\n  static get events() {\n    return [{\n        \"method\": \"calciteTipManagerToggle\",\n        \"name\": \"calciteTipManagerToggle\",\n        \"bubbles\": true,\n        \"cancelable\": false,\n        \"composed\": true,\n        \"docs\": {\n          \"tags\": [{\n              \"name\": \"deprecated\",\n              \"text\": \"use `calciteTipManagerClose` instead.\"\n            }],\n          \"text\": \"Emits when the component has been open or closed.\"\n        },\n        \"complexType\": {\n          \"original\": \"void\",\n          \"resolved\": \"void\",\n          \"references\": {}\n        }\n      }, {\n        \"method\": \"calciteTipManagerClose\",\n        \"name\": \"calciteTipManagerClose\",\n        \"bubbles\": true,\n        \"cancelable\": false,\n        \"composed\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Emits when the component has been closed.\"\n        },\n        \"complexType\": {\n          \"original\": \"void\",\n          \"resolved\": \"void\",\n          \"references\": {}\n        }\n      }];\n  }\n  static get methods() {\n    return {\n      \"nextTip\": {\n        \"complexType\": {\n          \"signature\": \"() => Promise<void>\",\n          \"parameters\": [],\n          \"references\": {\n            \"Promise\": {\n              \"location\": \"global\"\n            }\n          },\n          \"return\": \"Promise<void>\"\n        },\n        \"docs\": {\n          \"text\": \"Selects the next `calcite-tip` to display.\",\n          \"tags\": []\n        }\n      },\n      \"previousTip\": {\n        \"complexType\": {\n          \"signature\": \"() => Promise<void>\",\n          \"parameters\": [],\n          \"references\": {\n            \"Promise\": {\n              \"location\": \"global\"\n            }\n          },\n          \"return\": \"Promise<void>\"\n        },\n        \"docs\": {\n          \"text\": \"Selects the previous `calcite-tip` to display.\",\n          \"tags\": []\n        }\n      }\n    };\n  }\n  static get elementRef() { return \"el\"; }\n  static get watchers() {\n    return [{\n        \"propName\": \"closed\",\n        \"methodName\": \"closedChangeHandler\"\n      }, {\n        \"propName\": \"selectedIndex\",\n        \"methodName\": \"selectedChangeHandler\"\n      }];\n  }\n}\n"],"version":3}

package/dist/solutions-components/p-79cde78e.entry.js

@@ -0,0 +1,203 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './p-58c69df2.js';
+import { g as getElementProp, t as toAriaBoolean } from './p-32a67cb2.js';
+import './p-729708a3.js';
+import './p-a80b3880.js';
+
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.97
+ */
+const CSS = {
+  containerLink: "container--link",
+  containerSmall: "container--s",
+  containerMedium: "container--m",
+  containerLarge: "container--l",
+  containerMulti: "container--multi-selection",
+  containerSingle: "container--single-selection",
+  containerNone: "container--none-selection"
+};
+
+const dropdownItemCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}.container--s{padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;-webkit-padding-end:0.5rem;padding-inline-end:0.5rem;-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}.container--m{padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem;-webkit-padding-end:0.75rem;padding-inline-end:0.75rem;-webkit-padding-start:2rem;padding-inline-start:2rem}.container--l{padding-block:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:2.5rem;padding-inline-start:2.5rem}.container--s.container--none-selection{-webkit-padding-start:0.25rem;padding-inline-start:0.25rem}.container--s.container--none-selection .dropdown-link{-webkit-padding-start:0px;padding-inline-start:0px}.container--m.container--none-selection{-webkit-padding-start:0.5rem;padding-inline-start:0.5rem}.container--m.container--none-selection .dropdown-link{-webkit-padding-start:0px;padding-inline-start:0px}.container--l.container--none-selection{-webkit-padding-start:0.75rem;padding-inline-start:0.75rem}.container--l.container--none-selection .dropdown-link{-webkit-padding-start:0px;padding-inline-start:0px}:host{position:relative;display:flex;flex-grow:1;align-items:center}.container{position:relative;display:flex;flex-grow:1;cursor:pointer;align-items:center;color:var(--calcite-ui-text-3);-webkit-text-decoration-line:none;text-decoration-line:none;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);text-align:start}.dropdown-item-content{flex:1 1 auto;-webkit-padding-end:auto;padding-inline-end:auto;-webkit-padding-start:0.25rem;padding-inline-start:0.25rem}:host,.container--link a{outline-color:transparent}:host(:focus){outline:2px solid transparent;outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}.container--link{padding:0px}.container--link a{position:relative;display:flex;flex-grow:1;cursor:pointer;align-items:center;color:var(--calcite-ui-text-3);-webkit-text-decoration-line:none;text-decoration-line:none;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.container--s .dropdown-link{padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;-webkit-padding-end:0.5rem;padding-inline-end:0.5rem;-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}.container--m .dropdown-link{padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem;-webkit-padding-end:0.75rem;padding-inline-end:0.75rem;-webkit-padding-start:2rem;padding-inline-start:2rem}.container--l .dropdown-link{padding-block:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:2.5rem;padding-inline-start:2.5rem}:host(:hover) .container,:host(:active) .container{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1);-webkit-text-decoration-line:none;text-decoration-line:none}:host(:hover) .container--link .dropdown-link,:host(:active) .container--link .dropdown-link{color:var(--calcite-ui-text-1)}:host(:focus) .container{color:var(--calcite-ui-text-1);-webkit-text-decoration-line:none;text-decoration-line:none}:host(:active) .container{background-color:var(--calcite-ui-foreground-3)}:host(:hover) .container:before,:host(:active) .container:before,:host(:focus) .container:before{opacity:1}:host([selected]) .container:not(.container--none-selection),:host([selected]) .container--link .dropdown-link{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}:host([selected]) .container:not(.container--none-selection):before,:host([selected]) .container--link .dropdown-link:before{opacity:1;color:var(--calcite-ui-brand)}:host([selected]) .container:not(.container--none-selection) calcite-icon,:host([selected]) .container--link .dropdown-link calcite-icon{color:var(--calcite-ui-brand)}.container--multi-selection:before,.container--none-selection:before{display:none}.container--s:before{inset-inline-start:0.5rem}.container--m:before{inset-inline-start:0.75rem}.container--l:before{inset-inline-start:1rem}.dropdown-item-icon{position:absolute;opacity:0;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:scale(0.9)}.container--s .dropdown-item-icon{inset-inline-start:0.25rem}.container--m .dropdown-item-icon{inset-inline-start:0.5rem}.container--l .dropdown-item-icon{inset-inline-start:0.75rem}:host(:hover) .dropdown-item-icon{color:var(--calcite-ui-border-1);opacity:1}:host([active]) .dropdown-item-icon{color:var(--calcite-ui-brand);opacity:1}.container--s .dropdown-item-icon-start{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem;-webkit-margin-start:0.25rem;margin-inline-start:0.25rem}.container--s .dropdown-item-icon-end{-webkit-margin-start:0.5rem;margin-inline-start:0.5rem}.container--m .dropdown-item-icon-start{-webkit-margin-end:0.75rem;margin-inline-end:0.75rem;-webkit-margin-start:0.25rem;margin-inline-start:0.25rem}.container--m .dropdown-item-icon-end{-webkit-margin-start:0.75rem;margin-inline-start:0.75rem}.container--l .dropdown-item-icon-start{-webkit-margin-end:1rem;margin-inline-end:1rem;-webkit-margin-start:0.25rem;margin-inline-start:0.25rem}.container--l .dropdown-item-icon-end{-webkit-margin-start:1rem;margin-inline-start:1rem}";
+
+const DropdownItem = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.calciteInternalDropdownItemSelect = createEvent(this, "calciteInternalDropdownItemSelect", 6);
+    this.calciteInternalDropdownItemKeyEvent = createEvent(this, "calciteInternalDropdownItemKeyEvent", 6);
+    this.calciteInternalDropdownCloseRequest = createEvent(this, "calciteInternalDropdownCloseRequest", 6);
+    //--------------------------------------------------------------------------
+    //
+    //  Public Properties
+    //
+    //--------------------------------------------------------------------------
+    /**
+     * Indicates whether the item is active.
+     *
+     * @deprecated Use selected instead.
+     */
+    this.active = false;
+    /** When true, item is selected  */
+    this.selected = false;
+  }
+  activeHandler(value) {
+    this.selected = value;
+  }
+  selectedHandler(value) {
+    this.active = value;
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Public Methods
+  //
+  //--------------------------------------------------------------------------
+  /** Sets focus on the component. */
+  async setFocus() {
+    var _a;
+    (_a = this.el) === null || _a === void 0 ? void 0 : _a.focus();
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Lifecycle
+  //
+  //--------------------------------------------------------------------------
+  componentWillLoad() {
+    this.initialize();
+  }
+  connectedCallback() {
+    const isSelected = this.selected || this.active;
+    if (isSelected) {
+      this.activeHandler(isSelected);
+      this.selectedHandler(isSelected);
+    }
+    this.initialize();
+  }
+  render() {
+    const scale = getElementProp(this.el, "scale", "m");
+    const iconStartEl = (h("calcite-icon", { class: "dropdown-item-icon-start", flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: "s" }));
+    const contentNode = (h("span", { class: "dropdown-item-content" }, h("slot", null)));
+    const iconEndEl = (h("calcite-icon", { class: "dropdown-item-icon-end", flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: "s" }));
+    const slottedContent = this.iconStart && this.iconEnd
+      ? [iconStartEl, contentNode, iconEndEl]
+      : this.iconStart
+        ? [iconStartEl, h("slot", null)]
+        : this.iconEnd
+          ? [contentNode, iconEndEl]
+          : contentNode;
+    const contentEl = !this.href ? (slottedContent) : (h("a", { "aria-label": this.label, class: "dropdown-link", href: this.href, ref: (el) => (this.childLink = el), rel: this.rel, target: this.target }, slottedContent));
+    const itemRole = this.href
+      ? null
+      : this.selectionMode === "single"
+        ? "menuitemradio"
+        : this.selectionMode === "multi"
+          ? "menuitemcheckbox"
+          : "menuitem";
+    const itemAria = this.selectionMode !== "none" ? toAriaBoolean(this.selected) : null;
+    return (h(Host, { "aria-checked": itemAria, role: itemRole, tabindex: "0" }, h("div", { class: {
+        container: true,
+        [CSS.containerLink]: !!this.href,
+        [CSS.containerSmall]: scale === "s",
+        [CSS.containerMedium]: scale === "m",
+        [CSS.containerLarge]: scale === "l",
+        [CSS.containerMulti]: this.selectionMode === "multi",
+        [CSS.containerSingle]: this.selectionMode === "single",
+        [CSS.containerNone]: this.selectionMode === "none"
+      } }, this.selectionMode !== "none" ? (h("calcite-icon", { class: "dropdown-item-icon", icon: this.selectionMode === "multi" ? "check" : "bullet-point", scale: "s" })) : null, contentEl)));
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Event Listeners
+  //
+  //--------------------------------------------------------------------------
+  onClick() {
+    this.emitRequestedItem();
+  }
+  keyDownHandler(event) {
+    switch (event.key) {
+      case " ":
+      case "Enter":
+        this.emitRequestedItem();
+        if (this.href) {
+          this.childLink.click();
+        }
+        event.preventDefault();
+        break;
+      case "Escape":
+        this.calciteInternalDropdownCloseRequest.emit();
+        event.preventDefault();
+        break;
+      case "Tab":
+        this.calciteInternalDropdownItemKeyEvent.emit({ keyboardEvent: event });
+        break;
+      case "ArrowUp":
+      case "ArrowDown":
+      case "Home":
+      case "End":
+        event.preventDefault();
+        this.calciteInternalDropdownItemKeyEvent.emit({ keyboardEvent: event });
+        break;
+    }
+  }
+  updateActiveItemOnChange(event) {
+    const parentEmittedChange = event.composedPath().includes(this.parentDropdownGroupEl);
+    if (parentEmittedChange) {
+      this.requestedDropdownGroup = event.detail.requestedDropdownGroup;
+      this.requestedDropdownItem = event.detail.requestedDropdownItem;
+      this.determineActiveItem();
+    }
+    event.stopPropagation();
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  initialize() {
+    this.selectionMode = getElementProp(this.el, "selection-mode", "single");
+    this.parentDropdownGroupEl = this.el.closest("calcite-dropdown-group");
+    if (this.selectionMode === "none") {
+      this.selected = false;
+    }
+  }
+  determineActiveItem() {
+    switch (this.selectionMode) {
+      case "multi":
+        if (this.el === this.requestedDropdownItem) {
+          this.selected = !this.selected;
+        }
+        break;
+      case "single":
+        if (this.el === this.requestedDropdownItem) {
+          this.selected = true;
+        }
+        else if (this.requestedDropdownGroup === this.parentDropdownGroupEl) {
+          this.selected = false;
+        }
+        break;
+      case "none":
+        this.selected = false;
+        break;
+    }
+  }
+  emitRequestedItem() {
+    this.calciteInternalDropdownItemSelect.emit({
+      requestedDropdownItem: this.el,
+      requestedDropdownGroup: this.parentDropdownGroupEl
+    });
+  }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "active": ["activeHandler"],
+    "selected": ["selectedHandler"]
+  }; }
+};
+DropdownItem.style = dropdownItemCss;
+
+export { DropdownItem as calcite_dropdown_item };
+
+//# sourceMappingURL=p-79cde78e.entry.js.map

package/dist/solutions-components/p-79cde78e.entry.js.map

@@ -0,0 +1 @@
+{"file":"calcite-dropdown-item.entry.esm.js","mappings":"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","names":[],"sources":["./node_modules/@esri/calcite-components/dist/collection/components/dropdown-item/resources.js","./node_modules/@esri/calcite-components/dist/collection/components/dropdown-item/dropdown-item.css?tag=calcite-dropdown-item&encapsulation=shadow","./node_modules/@esri/calcite-components/dist/collection/components/dropdown-item/dropdown-item.js"],"sourcesContent":["/*!\n * All material copyright ESRI, All Rights Reserved, unless otherwise specified.\n * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.\n * v1.0.0-beta.97\n */\nexport const CSS = {\n  containerLink: \"container--link\",\n  containerSmall: \"container--s\",\n  containerMedium: \"container--m\",\n  containerLarge: \"container--l\",\n  containerMulti: \"container--multi-selection\",\n  containerSingle: \"container--single-selection\",\n  containerNone: \"container--none-selection\"\n};\n","/* mixins & extensions */\n@keyframes in {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n@keyframes in-down {\n  0% {\n    opacity: 0;\n    transform: translate3D(0, -5px, 0);\n  }\n  100% {\n    opacity: 1;\n    transform: translate3D(0, 0, 0);\n  }\n}\n@keyframes in-up {\n  0% {\n    opacity: 0;\n    transform: translate3D(0, 5px, 0);\n  }\n  100% {\n    opacity: 1;\n    transform: translate3D(0, 0, 0);\n  }\n}\n@keyframes in-scale {\n  0% {\n    opacity: 0;\n    transform: scale3D(0.95, 0.95, 1);\n  }\n  100% {\n    opacity: 1;\n    transform: scale3D(1, 1, 1);\n  }\n}\n:root {\n  --calcite-animation-timing: calc(150ms * var(--calcite-internal-duration-factor));\n  --calcite-internal-duration-factor: var(--calcite-duration-factor, 1);\n  --calcite-internal-animation-timing-fast: calc(100ms * var(--calcite-internal-duration-factor));\n  --calcite-internal-animation-timing-medium: calc(200ms * var(--calcite-internal-duration-factor));\n  --calcite-internal-animation-timing-slow: calc(300ms * var(--calcite-internal-duration-factor));\n}\n\n.calcite-animate {\n  opacity: 0;\n  animation-fill-mode: both;\n  animation-duration: var(--calcite-animation-timing);\n}\n\n.calcite-animate__in {\n  animation-name: in;\n}\n\n.calcite-animate__in-down {\n  animation-name: in-down;\n}\n\n.calcite-animate__in-up {\n  animation-name: in-up;\n}\n\n.calcite-animate__in-scale {\n  animation-name: in-scale;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :root {\n    --calcite-internal-duration-factor: 0.01;\n  }\n}\n/**\n* Currently only used in Checkbox.\n*/\n:root {\n  --calcite-floating-ui-transition: var(--calcite-animation-timing);\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n.container--s {\n  padding-block: 0.25rem;\n  font-size: var(--calcite-font-size--2);\n  line-height: 1rem;\n  padding-inline-end: 0.5rem;\n  padding-inline-start: 1.5rem;\n}\n\n.container--m {\n  padding-block: 0.5rem;\n  font-size: var(--calcite-font-size--1);\n  line-height: 1rem;\n  padding-inline-end: 0.75rem;\n  padding-inline-start: 2rem;\n}\n\n.container--l {\n  padding-block: 0.75rem;\n  font-size: var(--calcite-font-size-0);\n  line-height: 1.25rem;\n  padding-inline-end: 1rem;\n  padding-inline-start: 2.5rem;\n}\n\n.container--s.container--none-selection {\n  padding-inline-start: 0.25rem;\n}\n.container--s.container--none-selection .dropdown-link {\n  padding-inline-start: 0px;\n}\n\n.container--m.container--none-selection {\n  padding-inline-start: 0.5rem;\n}\n.container--m.container--none-selection .dropdown-link {\n  padding-inline-start: 0px;\n}\n\n.container--l.container--none-selection {\n  padding-inline-start: 0.75rem;\n}\n.container--l.container--none-selection .dropdown-link {\n  padding-inline-start: 0px;\n}\n\n:host {\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n  align-items: center;\n}\n\n.container {\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n  cursor: pointer;\n  align-items: center;\n  color: var(--calcite-ui-text-3);\n  text-decoration-line: none;\n  transition-duration: 150ms;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  text-align: start;\n}\n\n.dropdown-item-content {\n  flex: 1 1 auto;\n  padding-inline-end: auto;\n  padding-inline-start: 0.25rem;\n}\n\n:host, \n.container--link a {\n  outline-color: transparent;\n}\n\n:host(:focus) {\n  outline: 2px solid transparent;\n  outline: 2px solid var(--calcite-ui-brand);\n  outline-offset: -2px;\n}\n\n.container--link {\n  padding: 0px;\n}\n.container--link a {\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n  cursor: pointer;\n  align-items: center;\n  color: var(--calcite-ui-text-3);\n  text-decoration-line: none;\n  transition-duration: 150ms;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.container--s .dropdown-link {\n  padding-block: 0.25rem;\n  font-size: var(--calcite-font-size--2);\n  line-height: 1rem;\n  padding-inline-end: 0.5rem;\n  padding-inline-start: 1.5rem;\n}\n\n.container--m .dropdown-link {\n  padding-block: 0.5rem;\n  font-size: var(--calcite-font-size--1);\n  line-height: 1rem;\n  padding-inline-end: 0.75rem;\n  padding-inline-start: 2rem;\n}\n\n.container--l .dropdown-link {\n  padding-block: 0.75rem;\n  font-size: var(--calcite-font-size-0);\n  line-height: 1.25rem;\n  padding-inline-end: 1rem;\n  padding-inline-start: 2.5rem;\n}\n\n:host(:hover) .container, \n:host(:active) .container {\n  background-color: var(--calcite-ui-foreground-2);\n  color: var(--calcite-ui-text-1);\n  text-decoration-line: none;\n}\n\n:host(:hover) .container--link .dropdown-link, \n:host(:active) .container--link .dropdown-link {\n  color: var(--calcite-ui-text-1);\n}\n\n:host(:focus) .container {\n  color: var(--calcite-ui-text-1);\n  text-decoration-line: none;\n}\n\n:host(:active) .container {\n  background-color: var(--calcite-ui-foreground-3);\n}\n\n:host(:hover) .container:before, \n:host(:active) .container:before, \n:host(:focus) .container:before {\n  opacity: 1;\n}\n\n:host([selected]) .container:not(.container--none-selection), \n:host([selected]) .container--link .dropdown-link {\n  font-weight: var(--calcite-font-weight-medium);\n  color: var(--calcite-ui-text-1);\n}\n:host([selected]) .container:not(.container--none-selection):before, \n:host([selected]) .container--link .dropdown-link:before {\n  opacity: 1;\n  color: var(--calcite-ui-brand);\n}\n:host([selected]) .container:not(.container--none-selection) calcite-icon,\n:host([selected]) .container--link .dropdown-link calcite-icon {\n  color: var(--calcite-ui-brand);\n}\n\n.container--multi-selection:before, \n.container--none-selection:before {\n  display: none;\n}\n\n.container--s:before {\n  inset-inline-start: 0.5rem;\n}\n\n.container--m:before {\n  inset-inline-start: 0.75rem;\n}\n\n.container--l:before {\n  inset-inline-start: 1rem;\n}\n\n.dropdown-item-icon {\n  position: absolute;\n  opacity: 0;\n  transition-duration: 150ms;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transform: scale(0.9);\n}\n\n.container--s .dropdown-item-icon {\n  inset-inline-start: 0.25rem;\n}\n\n.container--m .dropdown-item-icon {\n  inset-inline-start: 0.5rem;\n}\n\n.container--l .dropdown-item-icon {\n  inset-inline-start: 0.75rem;\n}\n\n:host(:hover) .dropdown-item-icon {\n  color: var(--calcite-ui-border-1);\n  opacity: 1;\n}\n\n:host([active]) .dropdown-item-icon {\n  color: var(--calcite-ui-brand);\n  opacity: 1;\n}\n\n.container--s .dropdown-item-icon-start {\n  margin-inline-end: 0.5rem;\n  margin-inline-start: 0.25rem;\n}\n.container--s .dropdown-item-icon-end {\n  margin-inline-start: 0.5rem;\n}\n\n.container--m .dropdown-item-icon-start {\n  margin-inline-end: 0.75rem;\n  margin-inline-start: 0.25rem;\n}\n.container--m .dropdown-item-icon-end {\n  margin-inline-start: 0.75rem;\n}\n\n.container--l .dropdown-item-icon-start {\n  margin-inline-end: 1rem;\n  margin-inline-start: 0.25rem;\n}\n.container--l .dropdown-item-icon-end {\n  margin-inline-start: 1rem;\n}","/*!\n * All material copyright ESRI, All Rights Reserved, unless otherwise specified.\n * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.\n * v1.0.0-beta.97\n */\nimport { h, Host } from \"@stencil/core\";\nimport { getElementProp, toAriaBoolean } from \"../../utils/dom\";\nimport { CSS } from \"./resources\";\n/**\n * @slot - A slot for adding text.\n */\nexport class DropdownItem {\n  constructor() {\n    //--------------------------------------------------------------------------\n    //\n    //  Public Properties\n    //\n    //--------------------------------------------------------------------------\n    /**\n     * Indicates whether the item is active.\n     *\n     * @deprecated Use selected instead.\n     */\n    this.active = false;\n    /** When true, item is selected  */\n    this.selected = false;\n  }\n  activeHandler(value) {\n    this.selected = value;\n  }\n  selectedHandler(value) {\n    this.active = value;\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n  /** Sets focus on the component. */\n  async setFocus() {\n    var _a;\n    (_a = this.el) === null || _a === void 0 ? void 0 : _a.focus();\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n  componentWillLoad() {\n    this.initialize();\n  }\n  connectedCallback() {\n    const isSelected = this.selected || this.active;\n    if (isSelected) {\n      this.activeHandler(isSelected);\n      this.selectedHandler(isSelected);\n    }\n    this.initialize();\n  }\n  render() {\n    const scale = getElementProp(this.el, \"scale\", \"m\");\n    const iconStartEl = (h(\"calcite-icon\", { class: \"dropdown-item-icon-start\", flipRtl: this.iconFlipRtl === \"start\" || this.iconFlipRtl === \"both\", icon: this.iconStart, scale: \"s\" }));\n    const contentNode = (h(\"span\", { class: \"dropdown-item-content\" }, h(\"slot\", null)));\n    const iconEndEl = (h(\"calcite-icon\", { class: \"dropdown-item-icon-end\", flipRtl: this.iconFlipRtl === \"end\" || this.iconFlipRtl === \"both\", icon: this.iconEnd, scale: \"s\" }));\n    const slottedContent = this.iconStart && this.iconEnd\n      ? [iconStartEl, contentNode, iconEndEl]\n      : this.iconStart\n        ? [iconStartEl, h(\"slot\", null)]\n        : this.iconEnd\n          ? [contentNode, iconEndEl]\n          : contentNode;\n    const contentEl = !this.href ? (slottedContent) : (h(\"a\", { \"aria-label\": this.label, class: \"dropdown-link\", href: this.href, ref: (el) => (this.childLink = el), rel: this.rel, target: this.target }, slottedContent));\n    const itemRole = this.href\n      ? null\n      : this.selectionMode === \"single\"\n        ? \"menuitemradio\"\n        : this.selectionMode === \"multi\"\n          ? \"menuitemcheckbox\"\n          : \"menuitem\";\n    const itemAria = this.selectionMode !== \"none\" ? toAriaBoolean(this.selected) : null;\n    return (h(Host, { \"aria-checked\": itemAria, role: itemRole, tabindex: \"0\" }, h(\"div\", { class: {\n        container: true,\n        [CSS.containerLink]: !!this.href,\n        [CSS.containerSmall]: scale === \"s\",\n        [CSS.containerMedium]: scale === \"m\",\n        [CSS.containerLarge]: scale === \"l\",\n        [CSS.containerMulti]: this.selectionMode === \"multi\",\n        [CSS.containerSingle]: this.selectionMode === \"single\",\n        [CSS.containerNone]: this.selectionMode === \"none\"\n      } }, this.selectionMode !== \"none\" ? (h(\"calcite-icon\", { class: \"dropdown-item-icon\", icon: this.selectionMode === \"multi\" ? \"check\" : \"bullet-point\", scale: \"s\" })) : null, contentEl)));\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n  onClick() {\n    this.emitRequestedItem();\n  }\n  keyDownHandler(event) {\n    switch (event.key) {\n      case \" \":\n      case \"Enter\":\n        this.emitRequestedItem();\n        if (this.href) {\n          this.childLink.click();\n        }\n        event.preventDefault();\n        break;\n      case \"Escape\":\n        this.calciteInternalDropdownCloseRequest.emit();\n        event.preventDefault();\n        break;\n      case \"Tab\":\n        this.calciteInternalDropdownItemKeyEvent.emit({ keyboardEvent: event });\n        break;\n      case \"ArrowUp\":\n      case \"ArrowDown\":\n      case \"Home\":\n      case \"End\":\n        event.preventDefault();\n        this.calciteInternalDropdownItemKeyEvent.emit({ keyboardEvent: event });\n        break;\n    }\n  }\n  updateActiveItemOnChange(event) {\n    const parentEmittedChange = event.composedPath().includes(this.parentDropdownGroupEl);\n    if (parentEmittedChange) {\n      this.requestedDropdownGroup = event.detail.requestedDropdownGroup;\n      this.requestedDropdownItem = event.detail.requestedDropdownItem;\n      this.determineActiveItem();\n    }\n    event.stopPropagation();\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n  initialize() {\n    this.selectionMode = getElementProp(this.el, \"selection-mode\", \"single\");\n    this.parentDropdownGroupEl = this.el.closest(\"calcite-dropdown-group\");\n    if (this.selectionMode === \"none\") {\n      this.selected = false;\n    }\n  }\n  determineActiveItem() {\n    switch (this.selectionMode) {\n      case \"multi\":\n        if (this.el === this.requestedDropdownItem) {\n          this.selected = !this.selected;\n        }\n        break;\n      case \"single\":\n        if (this.el === this.requestedDropdownItem) {\n          this.selected = true;\n        }\n        else if (this.requestedDropdownGroup === this.parentDropdownGroupEl) {\n          this.selected = false;\n        }\n        break;\n      case \"none\":\n        this.selected = false;\n        break;\n    }\n  }\n  emitRequestedItem() {\n    this.calciteInternalDropdownItemSelect.emit({\n      requestedDropdownItem: this.el,\n      requestedDropdownGroup: this.parentDropdownGroupEl\n    });\n  }\n  static get is() { return \"calcite-dropdown-item\"; }\n  static get encapsulation() { return \"shadow\"; }\n  static get originalStyleUrls() {\n    return {\n      \"$\": [\"dropdown-item.scss\"]\n    };\n  }\n  static get styleUrls() {\n    return {\n      \"$\": [\"dropdown-item.css\"]\n    };\n  }\n  static get properties() {\n    return {\n      \"active\": {\n        \"type\": \"boolean\",\n        \"mutable\": true,\n        \"complexType\": {\n          \"original\": \"boolean\",\n          \"resolved\": \"boolean\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": false,\n        \"docs\": {\n          \"tags\": [{\n              \"name\": \"deprecated\",\n              \"text\": \"Use selected instead.\"\n            }],\n          \"text\": \"Indicates whether the item is active.\"\n        },\n        \"attribute\": \"active\",\n        \"reflect\": true,\n        \"defaultValue\": \"false\"\n      },\n      \"selected\": {\n        \"type\": \"boolean\",\n        \"mutable\": true,\n        \"complexType\": {\n          \"original\": \"boolean\",\n          \"resolved\": \"boolean\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": false,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"When true, item is selected\"\n        },\n        \"attribute\": \"selected\",\n        \"reflect\": true,\n        \"defaultValue\": \"false\"\n      },\n      \"iconFlipRtl\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"FlipContext\",\n          \"resolved\": \"\\\"both\\\" | \\\"end\\\" | \\\"start\\\"\",\n          \"references\": {\n            \"FlipContext\": {\n              \"location\": \"import\",\n              \"path\": \"../interfaces\"\n            }\n          }\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"When true, the icon will be flipped when the element direction is right-to-left (`\\\"rtl\\\"`).\"\n        },\n        \"attribute\": \"icon-flip-rtl\",\n        \"reflect\": true\n      },\n      \"iconStart\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Specifies an icon to display at the start of the component.\"\n        },\n        \"attribute\": \"icon-start\",\n        \"reflect\": true\n      },\n      \"iconEnd\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Specifies an icon to display at the end of the component.\"\n        },\n        \"attribute\": \"icon-end\",\n        \"reflect\": true\n      },\n      \"href\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"optionally pass a href - used to determine if the component should render as anchor\"\n        },\n        \"attribute\": \"href\",\n        \"reflect\": true\n      },\n      \"label\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"Applies to the aria-label attribute on the button or hyperlink\"\n        },\n        \"attribute\": \"label\",\n        \"reflect\": false\n      },\n      \"rel\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"The rel attribute to apply to the hyperlink\"\n        },\n        \"attribute\": \"rel\",\n        \"reflect\": true\n      },\n      \"target\": {\n        \"type\": \"string\",\n        \"mutable\": false,\n        \"complexType\": {\n          \"original\": \"string\",\n          \"resolved\": \"string\",\n          \"references\": {}\n        },\n        \"required\": false,\n        \"optional\": true,\n        \"docs\": {\n          \"tags\": [],\n          \"text\": \"The target attribute to apply to the hyperlink\"\n        },\n        \"attribute\": \"target\",\n        \"reflect\": true\n      }\n    };\n  }\n  static get events() {\n    return [{\n        \"method\": \"calciteInternalDropdownItemSelect\",\n        \"name\": \"calciteInternalDropdownItemSelect\",\n        \"bubbles\": true,\n        \"cancelable\": false,\n        \"composed\": true,\n        \"docs\": {\n          \"tags\": [{\n              \"name\": \"internal\",\n              \"text\": undefined\n            }],\n          \"text\": \"\"\n        },\n        \"complexType\": {\n          \"original\": \"RequestedItem\",\n          \"resolved\": \"RequestedItem\",\n          \"references\": {\n            \"RequestedItem\": {\n              \"location\": \"import\",\n              \"path\": \"../dropdown-group/interfaces\"\n            }\n          }\n        }\n      }, {\n        \"method\": \"calciteInternalDropdownItemKeyEvent\",\n        \"name\": \"calciteInternalDropdownItemKeyEvent\",\n        \"bubbles\": true,\n        \"cancelable\": false,\n        \"composed\": true,\n        \"docs\": {\n          \"tags\": [{\n              \"name\": \"internal\",\n              \"text\": undefined\n            }],\n          \"text\": \"\"\n        },\n        \"complexType\": {\n          \"original\": \"ItemKeyboardEvent\",\n          \"resolved\": \"ItemKeyboardEvent\",\n          \"references\": {\n            \"ItemKeyboardEvent\": {\n              \"location\": \"import\",\n              \"path\": \"../dropdown/interfaces\"\n            }\n          }\n        }\n      }, {\n        \"method\": \"calciteInternalDropdownCloseRequest\",\n        \"name\": \"calciteInternalDropdownCloseRequest\",\n        \"bubbles\": true,\n        \"cancelable\": false,\n        \"composed\": true,\n        \"docs\": {\n          \"tags\": [{\n              \"name\": \"internal\",\n              \"text\": undefined\n            }],\n          \"text\": \"\"\n        },\n        \"complexType\": {\n          \"original\": \"void\",\n          \"resolved\": \"void\",\n          \"references\": {}\n        }\n      }];\n  }\n  static get methods() {\n    return {\n      \"setFocus\": {\n        \"complexType\": {\n          \"signature\": \"() => Promise<void>\",\n          \"parameters\": [],\n          \"references\": {\n            \"Promise\": {\n              \"location\": \"global\"\n            }\n          },\n          \"return\": \"Promise<void>\"\n        },\n        \"docs\": {\n          \"text\": \"Sets focus on the component.\",\n          \"tags\": []\n        }\n      }\n    };\n  }\n  static get elementRef() { return \"el\"; }\n  static get watchers() {\n    return [{\n        \"propName\": \"active\",\n        \"methodName\": \"activeHandler\"\n      }, {\n        \"propName\": \"selected\",\n        \"methodName\": \"selectedHandler\"\n      }];\n  }\n  static get listeners() {\n    return [{\n        \"name\": \"click\",\n        \"method\": \"onClick\",\n        \"target\": undefined,\n        \"capture\": false,\n        \"passive\": false\n      }, {\n        \"name\": \"keydown\",\n        \"method\": \"keyDownHandler\",\n        \"target\": undefined,\n        \"capture\": false,\n        \"passive\": false\n      }, {\n        \"name\": \"calciteInternalDropdownItemChange\",\n        \"method\": \"updateActiveItemOnChange\",\n        \"target\": \"body\",\n        \"capture\": false,\n        \"passive\": false\n      }];\n  }\n}\n"],"version":3}