1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348 |
- import {
- defineCustomElement as defineCustomElement2,
- defineCustomElement2 as defineCustomElement3
- } from "./chunk-FS3HYWCS.js";
- import {
- defineCustomElement as defineCustomElement4
- } from "./chunk-ERKDZ5WT.js";
- import {
- FloatingCSS,
- connectFloatingUI,
- defaultOffsetDistance,
- disconnectFloatingUI,
- filterComputedPlacements,
- reposition,
- updateAfterClose
- } from "./chunk-LPWNO2ZS.js";
- import {
- updateHostInteraction
- } from "./chunk-4LXFBVBS.js";
- import {
- defineCustomElement
- } from "./chunk-Y6WKYXWU.js";
- import {
- createObserver
- } from "./chunk-AVLPSIKF.js";
- import {
- focusElement,
- getElementDir,
- guid,
- isPrimaryPointerButton,
- queryElementRoots,
- toAriaBoolean
- } from "./chunk-2TTT3V5O.js";
- import {
- Fragment,
- H,
- Host,
- createEvent,
- forceUpdate,
- h,
- proxyCustomElement
- } from "./chunk-IOZKU7B2.js";
- import "./chunk-S5KM4IGW.js";
- // node_modules/@esri/calcite-components/dist/components/Heading.js
- var Heading = (props, children) => {
- const HeadingTag = `h${props.level}`;
- delete props.level;
- return h(HeadingTag, { ...props }, children);
- };
- // node_modules/@esri/calcite-components/dist/components/array.js
- function getRoundRobinIndex(index, total) {
- return (index + total) % total;
- }
- // node_modules/@esri/calcite-components/dist/components/key.js
- function isActivationKey(key) {
- return key === "Enter" || key === " ";
- }
- // node_modules/@esri/calcite-components/dist/components/openCloseComponent.js
- var componentToTransitionListeners = /* @__PURE__ */ new WeakMap();
- function transitionStart(event) {
- if (event.propertyName === this.openTransitionProp && event.target === this.transitionEl) {
- this.open ? this.onBeforeOpen() : this.onBeforeClose();
- }
- }
- function transitionEnd(event) {
- if (event.propertyName === this.openTransitionProp && event.target === this.transitionEl) {
- this.open ? this.onOpen() : this.onClose();
- }
- }
- function connectOpenCloseComponent(component) {
- disconnectOpenCloseComponent(component);
- if (component.transitionEl) {
- const boundOnTransitionStart = transitionStart.bind(component);
- const boundOnTransitionEnd = transitionEnd.bind(component);
- componentToTransitionListeners.set(component, [
- component.transitionEl,
- boundOnTransitionStart,
- boundOnTransitionEnd
- ]);
- component.transitionEl.addEventListener("transitionstart", boundOnTransitionStart);
- component.transitionEl.addEventListener("transitionend", boundOnTransitionEnd);
- }
- }
- function disconnectOpenCloseComponent(component) {
- if (!componentToTransitionListeners.has(component)) {
- return;
- }
- const [transitionEl, start, end] = componentToTransitionListeners.get(component);
- transitionEl.removeEventListener("transitionstart", start);
- transitionEl.removeEventListener("transitionend", end);
- componentToTransitionListeners.delete(component);
- }
- // node_modules/@esri/calcite-components/dist/components/popover.js
- var CSS = {
- container: "container",
- arrow: "arrow",
- imageContainer: "image-container",
- closeButtonContainer: "close-button-container",
- closeButton: "close-button",
- content: "content",
- hasHeader: "has-header",
- header: "header",
- headerContent: "header-content",
- heading: "heading"
- };
- var TEXT = {
- close: "Close"
- };
- var defaultPopoverPlacement = "auto";
- var ARIA_CONTROLS = "aria-controls";
- var ARIA_EXPANDED = "aria-expanded";
- var HEADING_LEVEL = 2;
- var PopoverManager = class {
- constructor() {
- this.registeredElements = /* @__PURE__ */ new Map();
- this.registeredElementCount = 0;
- this.queryPopover = (composedPath) => {
- const { registeredElements } = this;
- const registeredElement = composedPath.find((pathEl) => registeredElements.has(pathEl));
- return registeredElements.get(registeredElement);
- };
- this.togglePopovers = (event) => {
- const composedPath = event.composedPath();
- const togglePopover = this.queryPopover(composedPath);
- if (togglePopover && !togglePopover.triggerDisabled) {
- togglePopover.toggle();
- }
- Array.from(this.registeredElements.values()).filter((popover) => popover !== togglePopover && popover.autoClose && popover.open && !composedPath.includes(popover)).forEach((popover) => popover.toggle(false));
- };
- this.keyHandler = (event) => {
- if (event.defaultPrevented || !isActivationKey(event.key)) {
- return;
- }
- this.togglePopovers(event);
- };
- this.clickHandler = (event) => {
- if (isPrimaryPointerButton(event)) {
- this.togglePopovers(event);
- }
- };
- }
- registerElement(referenceEl, popover) {
- this.registeredElementCount++;
- this.registeredElements.set(referenceEl, popover);
- if (this.registeredElementCount === 1) {
- this.addListeners();
- }
- }
- unregisterElement(referenceEl) {
- if (this.registeredElements.delete(referenceEl)) {
- this.registeredElementCount--;
- }
- if (this.registeredElementCount === 0) {
- this.removeListeners();
- }
- }
- addListeners() {
- document.addEventListener("pointerdown", this.clickHandler, { capture: true });
- document.addEventListener("keydown", this.keyHandler, { capture: true });
- }
- removeListeners() {
- document.removeEventListener("pointerdown", this.clickHandler, { capture: true });
- document.removeEventListener("keydown", this.keyHandler, { capture: true });
- }
- };
- var popoverCss = '@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{display:block;position:absolute;z-index:900}.calcite-floating-ui-anim{position:relative;transition:var(--calcite-floating-ui-transition);visibility:hidden;transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:1;border-radius:0.25rem}:host([data-placement^=bottom]) .calcite-floating-ui-anim{transform:translateY(-5px)}:host([data-placement^=top]) .calcite-floating-ui-anim{transform:translateY(5px)}:host([data-placement^=left]) .calcite-floating-ui-anim{transform:translateX(5px)}:host([data-placement^=right]) .calcite-floating-ui-anim{transform:translateX(-5px)}:host([data-placement]) .calcite-floating-ui-anim--active{opacity:1;visibility:visible;transform:translate(0)}:host([calcite-hydrated-hidden]){visibility:hidden !important;pointer-events:none}.arrow,.arrow::before{position:absolute;inline-size:8px;block-size:8px;z-index:-1}.arrow::before{content:"";--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transform:rotate(45deg);background:var(--calcite-ui-foreground-1)}:host([data-placement^=top]) .arrow{inset-block-end:-4px}:host([data-placement^=bottom]) .arrow{inset-block-start:-4px}:host([data-placement^=left]) .arrow{direction:ltr;inset-inline-end:-4px}:host([data-placement^=right]) .arrow{direction:ltr;inset-inline-start:-4px}:host{pointer-events:none}:host([open]){pointer-events:initial}.calcite-floating-ui-anim{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}.arrow::before{outline:1px solid var(--calcite-ui-border-3)}.header{display:flex;flex:1 1 auto;align-items:stretch;justify-content:flex-start;border-width:0px;border-block-end-width:1px;border-style:solid;background-color:var(--calcite-ui-foreground-1);border-block-end-color:var(--calcite-ui-border-3)}.heading{margin:0px;display:block;flex:1 1 auto;align-self:center;white-space:normal;padding-inline:1rem;padding-block:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);word-wrap:break-word;word-break:break-word}.container{position:relative;display:flex;block-size:100%;flex-direction:row;flex-wrap:nowrap;border-radius:0.25rem;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-1)}.container.has-header{flex-direction:column}.content{display:flex;block-size:100%;inline-size:100%;flex-direction:column;flex-wrap:nowrap;align-self:center;word-wrap:break-word;word-break:break-word}.close-button-container{display:flex;overflow:hidden;flex:0 0 auto;border-start-end-radius:0.25rem;border-end-end-radius:0.25rem}::slotted(calcite-panel),::slotted(calcite-flow){block-size:100%}';
- var manager = new PopoverManager();
- var Popover = proxyCustomElement(class extends H {
- constructor() {
- super();
- this.__registerHost();
- this.__attachShadow();
- this.calcitePopoverBeforeClose = createEvent(this, "calcitePopoverBeforeClose", 6);
- this.calcitePopoverClose = createEvent(this, "calcitePopoverClose", 6);
- this.calcitePopoverBeforeOpen = createEvent(this, "calcitePopoverBeforeOpen", 6);
- this.calcitePopoverOpen = createEvent(this, "calcitePopoverOpen", 6);
- this.autoClose = false;
- this.closeButton = false;
- this.dismissible = false;
- this.closable = false;
- this.disableFlip = false;
- this.disablePointer = false;
- this.offsetDistance = defaultOffsetDistance;
- this.offsetSkidding = 0;
- this.open = false;
- this.overlayPositioning = "absolute";
- this.placement = defaultPopoverPlacement;
- this.triggerDisabled = false;
- this.intlClose = TEXT.close;
- this.guid = `calcite-popover-${guid()}`;
- this.openTransitionProp = "opacity";
- this.hasLoaded = false;
- this.setTransitionEl = (el) => {
- this.transitionEl = el;
- connectOpenCloseComponent(this);
- };
- this.setFilteredPlacements = () => {
- const { el, flipPlacements } = this;
- this.filteredFlipPlacements = flipPlacements ? filterComputedPlacements(flipPlacements, el) : null;
- };
- this.setUpReferenceElement = (warn = true) => {
- this.removeReferences();
- this.effectiveReferenceElement = this.getReferenceElement();
- connectFloatingUI(this, this.effectiveReferenceElement, this.el);
- const { el, referenceElement, effectiveReferenceElement } = this;
- if (warn && referenceElement && !effectiveReferenceElement) {
- console.warn(`${el.tagName}: reference-element id "${referenceElement}" was not found.`, {
- el
- });
- }
- this.addReferences();
- };
- this.getId = () => {
- return this.el.id || this.guid;
- };
- this.setExpandedAttr = () => {
- const { effectiveReferenceElement, open } = this;
- if (!effectiveReferenceElement) {
- return;
- }
- if ("setAttribute" in effectiveReferenceElement) {
- effectiveReferenceElement.setAttribute(ARIA_EXPANDED, toAriaBoolean(open));
- }
- };
- this.addReferences = () => {
- const { effectiveReferenceElement } = this;
- if (!effectiveReferenceElement) {
- return;
- }
- const id = this.getId();
- if ("setAttribute" in effectiveReferenceElement) {
- effectiveReferenceElement.setAttribute(ARIA_CONTROLS, id);
- }
- manager.registerElement(effectiveReferenceElement, this.el);
- this.setExpandedAttr();
- };
- this.removeReferences = () => {
- const { effectiveReferenceElement } = this;
- if (!effectiveReferenceElement) {
- return;
- }
- if ("removeAttribute" in effectiveReferenceElement) {
- effectiveReferenceElement.removeAttribute(ARIA_CONTROLS);
- effectiveReferenceElement.removeAttribute(ARIA_EXPANDED);
- }
- manager.unregisterElement(effectiveReferenceElement);
- };
- this.hide = () => {
- this.open = false;
- };
- this.storeArrowEl = (el) => {
- this.arrowEl = el;
- this.reposition(true);
- };
- }
- handleDismissible(value) {
- this.closable = value;
- }
- handleClosable(value) {
- this.dismissible = value;
- }
- flipPlacementsHandler() {
- this.setFilteredPlacements();
- this.reposition(true);
- }
- offsetDistanceOffsetHandler() {
- this.reposition(true);
- }
- offsetSkiddingHandler() {
- this.reposition(true);
- }
- openHandler(value) {
- if (value) {
- this.reposition(true);
- } else {
- updateAfterClose(this.el);
- }
- this.setExpandedAttr();
- }
- overlayPositioningHandler() {
- this.reposition(true);
- }
- placementHandler() {
- this.reposition(true);
- }
- referenceElementHandler() {
- this.setUpReferenceElement();
- this.reposition(true);
- }
- connectedCallback() {
- this.setFilteredPlacements();
- connectOpenCloseComponent(this);
- const closable = this.closable || this.dismissible;
- if (closable) {
- this.handleDismissible(closable);
- }
- if (closable) {
- this.handleClosable(closable);
- }
- this.setUpReferenceElement(this.hasLoaded);
- }
- componentDidLoad() {
- if (this.referenceElement && !this.effectiveReferenceElement) {
- this.setUpReferenceElement();
- }
- this.reposition();
- this.hasLoaded = true;
- }
- disconnectedCallback() {
- this.removeReferences();
- disconnectFloatingUI(this, this.effectiveReferenceElement, this.el);
- disconnectOpenCloseComponent(this);
- }
- async reposition(delayed = false) {
- const { el, effectiveReferenceElement, placement, overlayPositioning, disableFlip, filteredFlipPlacements, offsetDistance, offsetSkidding, arrowEl } = this;
- return reposition(this, {
- floatingEl: el,
- referenceEl: effectiveReferenceElement,
- overlayPositioning,
- placement,
- disableFlip,
- flipPlacements: filteredFlipPlacements,
- offsetDistance,
- offsetSkidding,
- includeArrow: !this.disablePointer,
- arrowEl,
- type: "popover"
- }, delayed);
- }
- async setFocus(focusId) {
- var _a;
- const { closeButtonEl } = this;
- if (focusId === "close-button" && closeButtonEl) {
- forceUpdate(closeButtonEl);
- closeButtonEl.setFocus();
- return;
- }
- (_a = this.el) === null || _a === void 0 ? void 0 : _a.focus();
- }
- async toggle(value = !this.open) {
- this.open = value;
- }
- getReferenceElement() {
- const { referenceElement, el } = this;
- return (typeof referenceElement === "string" ? queryElementRoots(el, { id: referenceElement }) : referenceElement) || null;
- }
- onBeforeOpen() {
- this.calcitePopoverBeforeOpen.emit();
- }
- onOpen() {
- this.calcitePopoverOpen.emit();
- }
- onBeforeClose() {
- this.calcitePopoverBeforeClose.emit();
- }
- onClose() {
- this.calcitePopoverClose.emit();
- }
- renderCloseButton() {
- const { closeButton, intlClose, heading, closable } = this;
- return closable || closeButton ? h("div", { class: CSS.closeButtonContainer }, h("calcite-action", { class: CSS.closeButton, onClick: this.hide, ref: (closeButtonEl) => this.closeButtonEl = closeButtonEl, scale: heading ? "s" : "m", text: intlClose }, h("calcite-icon", { icon: "x", scale: heading ? "s" : "m" }))) : null;
- }
- renderHeader() {
- const { heading, headingLevel } = this;
- const headingNode = heading ? h(Heading, { class: CSS.heading, level: headingLevel || HEADING_LEVEL }, heading) : null;
- return headingNode ? h("div", { class: CSS.header }, headingNode, this.renderCloseButton()) : null;
- }
- render() {
- const { effectiveReferenceElement, heading, label, open, disablePointer } = this;
- const displayed = effectiveReferenceElement && open;
- const hidden = !displayed;
- const arrowNode = !disablePointer ? h("div", { class: CSS.arrow, ref: this.storeArrowEl }) : null;
- return h(Host, { "aria-hidden": toAriaBoolean(hidden), "aria-label": label, "aria-live": "polite", "calcite-hydrated-hidden": hidden, id: this.getId(), role: "dialog" }, h("div", { class: {
- [FloatingCSS.animation]: true,
- [FloatingCSS.animationActive]: displayed
- }, ref: this.setTransitionEl }, arrowNode, h("div", { class: {
- [CSS.hasHeader]: !!heading,
- [CSS.container]: true
- } }, this.renderHeader(), h("div", { class: CSS.content }, h("slot", null)), !heading ? this.renderCloseButton() : null)));
- }
- get el() {
- return this;
- }
- static get watchers() {
- return {
- "dismissible": ["handleDismissible"],
- "closable": ["handleClosable"],
- "flipPlacements": ["flipPlacementsHandler"],
- "offsetDistance": ["offsetDistanceOffsetHandler"],
- "offsetSkidding": ["offsetSkiddingHandler"],
- "open": ["openHandler"],
- "overlayPositioning": ["overlayPositioningHandler"],
- "placement": ["placementHandler"],
- "referenceElement": ["referenceElementHandler"]
- };
- }
- static get style() {
- return popoverCss;
- }
- }, [1, "calcite-popover", {
- "autoClose": [516, "auto-close"],
- "closeButton": [516, "close-button"],
- "dismissible": [1540],
- "closable": [1540],
- "disableFlip": [516, "disable-flip"],
- "disablePointer": [516, "disable-pointer"],
- "flipPlacements": [16],
- "heading": [1],
- "headingLevel": [514, "heading-level"],
- "label": [1],
- "offsetDistance": [514, "offset-distance"],
- "offsetSkidding": [514, "offset-skidding"],
- "open": [1540],
- "overlayPositioning": [513, "overlay-positioning"],
- "placement": [513],
- "referenceElement": [1, "reference-element"],
- "triggerDisabled": [516, "trigger-disabled"],
- "intlClose": [1, "intl-close"],
- "effectiveReferenceElement": [32],
- "reposition": [64],
- "setFocus": [64],
- "toggle": [64]
- }]);
- function defineCustomElement5() {
- if (typeof customElements === "undefined") {
- return;
- }
- const components = ["calcite-popover", "calcite-action", "calcite-icon", "calcite-loader"];
- components.forEach((tagName) => {
- switch (tagName) {
- case "calcite-popover":
- if (!customElements.get(tagName)) {
- customElements.define(tagName, Popover);
- }
- break;
- case "calcite-action":
- if (!customElements.get(tagName)) {
- defineCustomElement3();
- }
- break;
- case "calcite-icon":
- if (!customElements.get(tagName)) {
- defineCustomElement();
- }
- break;
- case "calcite-loader":
- if (!customElements.get(tagName)) {
- defineCustomElement2();
- }
- break;
- }
- });
- }
- defineCustomElement5();
- // node_modules/@esri/calcite-components/dist/components/action-menu.js
- var CSS2 = {
- menu: "menu",
- defaultTrigger: "default-trigger"
- };
- var SLOTS = {
- tooltip: "tooltip",
- trigger: "trigger"
- };
- var ICONS = {
- menu: "ellipsis"
- };
- var actionMenuCss = "@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:flex;flex-direction:column;background-color:var(--calcite-ui-foreground-1);font-size:var(--calcite-font-size-1);color:var(--calcite-ui-text-2)}.menu ::slotted(calcite-action){margin:0.125rem;display:flex;outline-color:transparent}.menu ::slotted(calcite-action[active]){outline:2px solid var(--calcite-ui-brand);outline-offset:0px}.default-trigger{position:relative;block-size:100%;flex:0 1 auto;align-self:stretch}slot[name=trigger]::slotted(calcite-action),calcite-action::slotted([slot=trigger]){position:relative;block-size:100%;flex:0 1 auto;align-self:stretch}.menu{flex-direction:column;flex-wrap:nowrap;outline:2px solid transparent;outline-offset:2px}";
- var SUPPORTED_MENU_NAV_KEYS = ["ArrowUp", "ArrowDown", "End", "Home"];
- var ActionMenu = proxyCustomElement(class extends H {
- constructor() {
- super();
- this.__registerHost();
- this.__attachShadow();
- this.calciteActionMenuOpenChange = createEvent(this, "calciteActionMenuOpenChange", 6);
- this.expanded = false;
- this.open = false;
- this.overlayPositioning = "absolute";
- this.placement = "auto";
- this.actionElements = [];
- this.guid = `calcite-action-menu-${guid()}`;
- this.menuId = `${this.guid}-menu`;
- this.menuButtonId = `${this.guid}-menu-button`;
- this.activeMenuItemIndex = -1;
- this.connectMenuButtonEl = () => {
- const { menuButtonId, menuId, open, label } = this;
- const menuButtonEl = this.slottedMenuButtonEl || this.defaultMenuButtonEl;
- if (this.menuButtonEl === menuButtonEl) {
- return;
- }
- this.disconnectMenuButtonEl();
- this.menuButtonEl = menuButtonEl;
- this.setTooltipReferenceElement();
- if (!menuButtonEl) {
- return;
- }
- menuButtonEl.active = open;
- menuButtonEl.setAttribute("aria-controls", menuId);
- menuButtonEl.setAttribute("aria-expanded", toAriaBoolean(open));
- menuButtonEl.setAttribute("aria-haspopup", "true");
- if (!menuButtonEl.id) {
- menuButtonEl.id = menuButtonId;
- }
- if (!menuButtonEl.label) {
- menuButtonEl.label = label;
- }
- if (!menuButtonEl.text) {
- menuButtonEl.text = label;
- }
- menuButtonEl.addEventListener("pointerdown", this.menuButtonClick);
- menuButtonEl.addEventListener("keydown", this.menuButtonKeyDown);
- };
- this.disconnectMenuButtonEl = () => {
- const { menuButtonEl } = this;
- if (!menuButtonEl) {
- return;
- }
- menuButtonEl.removeEventListener("pointerdown", this.menuButtonClick);
- menuButtonEl.removeEventListener("keydown", this.menuButtonKeyDown);
- };
- this.setMenuButtonEl = (event) => {
- const actions = event.target.assignedElements({
- flatten: true
- }).filter((el) => el === null || el === void 0 ? void 0 : el.matches("calcite-action"));
- this.slottedMenuButtonEl = actions[0];
- this.connectMenuButtonEl();
- };
- this.setDefaultMenuButtonEl = (el) => {
- this.defaultMenuButtonEl = el;
- this.connectMenuButtonEl();
- };
- this.handleCalciteActionClick = () => {
- this.open = false;
- this.setFocus();
- };
- this.menuButtonClick = (event) => {
- if (!isPrimaryPointerButton(event)) {
- return;
- }
- this.toggleOpen();
- };
- this.updateTooltip = (event) => {
- const tooltips = event.target.assignedElements({
- flatten: true
- }).filter((el) => el === null || el === void 0 ? void 0 : el.matches("calcite-tooltip"));
- this.tooltipEl = tooltips[0];
- this.setTooltipReferenceElement();
- };
- this.setTooltipReferenceElement = () => {
- const { tooltipEl, expanded, menuButtonEl, open } = this;
- if (tooltipEl) {
- tooltipEl.referenceElement = !expanded && !open ? menuButtonEl : null;
- }
- };
- this.updateAction = (action, index) => {
- const { guid: guid2, activeMenuItemIndex } = this;
- const id = `${guid2}-action-${index}`;
- action.tabIndex = -1;
- action.setAttribute("role", "menuitem");
- if (!action.id) {
- action.id = id;
- }
- action.active = index === activeMenuItemIndex;
- };
- this.updateActions = (actions) => {
- actions === null || actions === void 0 ? void 0 : actions.forEach(this.updateAction);
- };
- this.handleDefaultSlotChange = (event) => {
- const actions = event.target.assignedElements({
- flatten: true
- }).filter((el) => el === null || el === void 0 ? void 0 : el.matches("calcite-action"));
- this.actionElements = actions;
- };
- this.menuButtonKeyDown = (event) => {
- const { key } = event;
- const { actionElements, activeMenuItemIndex, open } = this;
- if (!actionElements.length) {
- return;
- }
- if (isActivationKey(key)) {
- event.preventDefault();
- if (!open) {
- this.toggleOpen();
- return;
- }
- const action = actionElements[activeMenuItemIndex];
- action ? action.click() : this.toggleOpen(false);
- }
- if (key === "Tab") {
- this.open = false;
- return;
- }
- if (key === "Escape") {
- this.toggleOpen(false);
- event.preventDefault();
- return;
- }
- this.handleActionNavigation(event, key, actionElements);
- };
- this.handleActionNavigation = (event, key, actions) => {
- if (!this.isValidKey(key, SUPPORTED_MENU_NAV_KEYS)) {
- return;
- }
- event.preventDefault();
- if (!this.open) {
- this.toggleOpen();
- if (key === "Home" || key === "ArrowDown") {
- this.activeMenuItemIndex = 0;
- }
- if (key === "End" || key === "ArrowUp") {
- this.activeMenuItemIndex = actions.length - 1;
- }
- return;
- }
- if (key === "Home") {
- this.activeMenuItemIndex = 0;
- }
- if (key === "End") {
- this.activeMenuItemIndex = actions.length - 1;
- }
- const currentIndex = this.activeMenuItemIndex;
- if (key === "ArrowUp") {
- this.activeMenuItemIndex = getRoundRobinIndex(Math.max(currentIndex - 1, -1), actions.length);
- }
- if (key === "ArrowDown") {
- this.activeMenuItemIndex = getRoundRobinIndex(currentIndex + 1, actions.length);
- }
- };
- this.toggleOpenEnd = () => {
- this.setFocus();
- this.el.removeEventListener("calcitePopoverOpen", this.toggleOpenEnd);
- };
- this.toggleOpen = (value = !this.open) => {
- this.el.addEventListener("calcitePopoverOpen", this.toggleOpenEnd);
- this.open = value;
- };
- }
- disconnectedCallback() {
- this.disconnectMenuButtonEl();
- }
- expandedHandler() {
- this.open = false;
- this.setTooltipReferenceElement();
- }
- openHandler(open) {
- this.activeMenuItemIndex = this.open ? 0 : -1;
- if (this.menuButtonEl) {
- this.menuButtonEl.active = open;
- }
- this.calciteActionMenuOpenChange.emit(open);
- this.setTooltipReferenceElement();
- }
- closeCalciteActionMenuOnClick(event) {
- if (!isPrimaryPointerButton(event)) {
- return;
- }
- const composedPath = event.composedPath();
- if (composedPath.includes(this.el)) {
- return;
- }
- this.open = false;
- }
- activeMenuItemIndexHandler() {
- this.updateActions(this.actionElements);
- }
- async setFocus() {
- focusElement(this.menuButtonEl);
- }
- renderMenuButton() {
- const { label, scale, expanded } = this;
- const menuButtonSlot = h("slot", { name: SLOTS.trigger, onSlotchange: this.setMenuButtonEl }, h("calcite-action", { class: CSS2.defaultTrigger, icon: ICONS.menu, ref: this.setDefaultMenuButtonEl, scale, text: label, textEnabled: expanded }));
- return menuButtonSlot;
- }
- renderMenuItems() {
- const { actionElements, activeMenuItemIndex, open, menuId, menuButtonEl, label, placement, overlayPositioning, flipPlacements } = this;
- const activeAction = actionElements[activeMenuItemIndex];
- const activeDescendantId = (activeAction === null || activeAction === void 0 ? void 0 : activeAction.id) || null;
- return h("calcite-popover", { disablePointer: true, flipPlacements, label, offsetDistance: 0, open, overlayPositioning, placement, referenceElement: menuButtonEl }, h("div", { "aria-activedescendant": activeDescendantId, "aria-labelledby": menuButtonEl === null || menuButtonEl === void 0 ? void 0 : menuButtonEl.id, class: CSS2.menu, id: menuId, onClick: this.handleCalciteActionClick, role: "menu", tabIndex: -1 }, h("slot", { onSlotchange: this.handleDefaultSlotChange })));
- }
- render() {
- return h(Fragment, null, this.renderMenuButton(), this.renderMenuItems(), h("slot", { name: SLOTS.tooltip, onSlotchange: this.updateTooltip }));
- }
- isValidKey(key, supportedKeys) {
- return !!supportedKeys.find((k) => k === key);
- }
- get el() {
- return this;
- }
- static get watchers() {
- return {
- "expanded": ["expandedHandler"],
- "open": ["openHandler"],
- "activeMenuItemIndex": ["activeMenuItemIndexHandler"]
- };
- }
- static get style() {
- return actionMenuCss;
- }
- }, [1, "calcite-action-menu", {
- "expanded": [516],
- "flipPlacements": [16],
- "label": [1],
- "open": [1540],
- "overlayPositioning": [513, "overlay-positioning"],
- "placement": [513],
- "scale": [513],
- "menuButtonEl": [32],
- "activeMenuItemIndex": [32],
- "setFocus": [64]
- }, [[9, "pointerdown", "closeCalciteActionMenuOnClick"]]]);
- function defineCustomElement6() {
- if (typeof customElements === "undefined") {
- return;
- }
- const components = ["calcite-action-menu", "calcite-action", "calcite-icon", "calcite-loader", "calcite-popover"];
- components.forEach((tagName) => {
- switch (tagName) {
- case "calcite-action-menu":
- if (!customElements.get(tagName)) {
- customElements.define(tagName, ActionMenu);
- }
- break;
- case "calcite-action":
- if (!customElements.get(tagName)) {
- defineCustomElement3();
- }
- break;
- case "calcite-icon":
- if (!customElements.get(tagName)) {
- defineCustomElement();
- }
- break;
- case "calcite-loader":
- if (!customElements.get(tagName)) {
- defineCustomElement2();
- }
- break;
- case "calcite-popover":
- if (!customElements.get(tagName)) {
- defineCustomElement5();
- }
- break;
- }
- });
- }
- defineCustomElement6();
- // node_modules/@esri/calcite-components/dist/components/scrim.js
- var CSS3 = {
- scrim: "scrim",
- content: "content"
- };
- var TEXT2 = {
- loading: "Loading"
- };
- var scrimCss = "@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{position:absolute;inset:0px;z-index:700;display:flex;block-size:100%;inline-size:100%;flex-direction:column;align-items:stretch}@keyframes calcite-scrim-fade-in{0%{--tw-bg-opacity:0}100%{--tw-text-opacity:1}}.scrim{position:absolute;inset:0px;display:flex;flex-direction:column;align-content:center;align-items:center;justify-content:center;overflow:hidden;animation:calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;background-color:var(--calcite-scrim-background)}.content{padding:1rem}";
- var Scrim = proxyCustomElement(class extends H {
- constructor() {
- super();
- this.__registerHost();
- this.__attachShadow();
- this.intlLoading = TEXT2.loading;
- this.loading = false;
- }
- render() {
- const { el, loading, intlLoading } = this;
- const hasContent = el.innerHTML.trim().length > 0;
- const loaderNode = loading ? h("calcite-loader", { active: true, label: intlLoading }) : null;
- const contentNode = hasContent ? h("div", { class: CSS3.content }, h("slot", null)) : null;
- return h("div", { class: CSS3.scrim }, loaderNode, contentNode);
- }
- get el() {
- return this;
- }
- static get style() {
- return scrimCss;
- }
- }, [1, "calcite-scrim", {
- "intlLoading": [1, "intl-loading"],
- "loading": [516]
- }]);
- function defineCustomElement7() {
- if (typeof customElements === "undefined") {
- return;
- }
- const components = ["calcite-scrim", "calcite-loader"];
- components.forEach((tagName) => {
- switch (tagName) {
- case "calcite-scrim":
- if (!customElements.get(tagName)) {
- customElements.define(tagName, Scrim);
- }
- break;
- case "calcite-loader":
- if (!customElements.get(tagName)) {
- defineCustomElement2();
- }
- break;
- }
- });
- }
- defineCustomElement7();
- // node_modules/@esri/calcite-components/dist/components/panel.js
- var CSS4 = {
- backButton: "back-button",
- container: "container",
- header: "header",
- heading: "heading",
- summary: "summary",
- description: "description",
- headerContent: "header-content",
- headerActions: "header-actions",
- headerActionsEnd: "header-actions--end",
- headerActionsStart: "header-actions--start",
- contentWrapper: "content-wrapper",
- contentContainer: "content-container",
- contentHeight: "content-height",
- fabContainer: "fab-container",
- footer: "footer"
- };
- var ICONS2 = {
- close: "x",
- menu: "ellipsis",
- backLeft: "chevron-left",
- backRight: "chevron-right"
- };
- var SLOTS2 = {
- headerActionsStart: "header-actions-start",
- headerActionsEnd: "header-actions-end",
- headerMenuActions: "header-menu-actions",
- headerContent: "header-content",
- fab: "fab",
- footer: "footer",
- footerActions: "footer-actions"
- };
- var TEXT3 = {
- back: "Back",
- close: "Close",
- open: "Open",
- options: "Options"
- };
- var HEADING_LEVEL2 = 3;
- var panelCss = "@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}}:host{box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host([disabled]){pointer-events:none;cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;overflow:hidden;--calcite-min-header-height:calc(var(--calcite-icon-size) * 3);--calcite-panel-max-height:unset;--calcite-panel-width:100%;--calcite-panel-min-width:unset;--calcite-panel-max-width:unset}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.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}.container{margin:0px;display:flex;inline-size:100%;flex:1 1 auto;flex-direction:column;align-items:stretch;background-color:var(--calcite-ui-background);padding:0px;max-block-size:var(--calcite-panel-max-height);inline-size:var(--calcite-panel-width);max-inline-size:var(--calcite-panel-max-width);min-inline-size:var(--calcite-panel-min-width);transition:max-block-size var(--calcite-animation-timing), inline-size var(--calcite-animation-timing)}:host([height-scale=s]){--calcite-panel-max-height:40vh}:host([height-scale=m]){--calcite-panel-max-height:60vh}:host([height-scale=l]){--calcite-panel-max-height:80vh}:host([width-scale=s]){--calcite-panel-width:calc(var(--calcite-panel-width-multiplier) * 12vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 300px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 150px)}:host([width-scale=m]){--calcite-panel-width:calc(var(--calcite-panel-width-multiplier) * 20vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 420px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 240px)}:host([width-scale=l]){--calcite-panel-width:calc(var(--calcite-panel-width-multiplier) * 45vw);--calcite-panel-max-width:calc(var(--calcite-panel-width-multiplier) * 680px);--calcite-panel-min-width:calc(var(--calcite-panel-width-multiplier) * 340px)}.container[hidden]{display:none}.header{border-block-end:1px solid;position:sticky;inset-block-start:0px;z-index:400;inline-size:100%;align-items:stretch;justify-content:flex-start;background-color:var(--calcite-ui-foreground-1);border-block-end-color:var(--calcite-ui-border-3);flex:0 0 auto}.header-content{display:flex;flex-direction:column;overflow:hidden;padding-inline:0.75rem;padding-block:0.875rem;margin-inline-end:auto}.header-content .heading,.header-content .description{display:block;overflow-wrap:break-word;padding:0px}.header-content .heading{margin-inline:0px;margin-block:0px 0.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;font-weight:var(--calcite-font-weight-medium)}.header-content .heading:only-child{margin-block-end:0px}.header-content .description{font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-2)}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3);border-inline-end-width:1px}.header-actions{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch}.header-actions--end{margin-inline-start:auto}.content-wrapper{overflow:auto}.content-height{block-size:100%}.content-container{display:flex;flex:1 1 auto;flex-direction:column;flex-wrap:nowrap;align-items:stretch;background-color:var(--calcite-ui-background)}.footer{border-block-start:1px solid;position:sticky;inset-block-end:0px;display:flex;inline-size:100%;justify-content:space-evenly;background-color:var(--calcite-ui-foreground-1);border-block-start-color:var(--calcite-ui-border-3);flex:0 0 auto;min-block-size:3rem;padding:0.5rem}.fab-container{position:sticky;inset-block-end:0px;z-index:300;margin-block:0px;margin-inline:auto;display:block;padding:0.5rem;inset-inline:0;inline-size:-moz-fit-content;inline-size:fit-content}[hidden]{display:none}";
- var Panel = proxyCustomElement(class extends H {
- constructor() {
- super();
- this.__registerHost();
- this.__attachShadow();
- this.calcitePanelClose = createEvent(this, "calcitePanelClose", 6);
- this.calcitePanelDismiss = createEvent(this, "calcitePanelDismiss", 6);
- this.calcitePanelDismissedChange = createEvent(this, "calcitePanelDismissedChange", 6);
- this.calcitePanelScroll = createEvent(this, "calcitePanelScroll", 6);
- this.calcitePanelBackClick = createEvent(this, "calcitePanelBackClick", 6);
- this.dismissed = false;
- this.closed = false;
- this.disabled = false;
- this.dismissible = false;
- this.closable = false;
- this.showBackButton = false;
- this.loading = false;
- this.menuOpen = false;
- this.resizeObserver = createObserver("resize", () => this.resizeHandler());
- this.hasStartActions = false;
- this.hasEndActions = false;
- this.hasMenuItems = false;
- this.hasHeaderContent = false;
- this.hasFooterContent = false;
- this.hasFooterActions = false;
- this.hasFab = false;
- this.resizeHandler = () => {
- const { panelScrollEl } = this;
- if (!panelScrollEl || typeof panelScrollEl.scrollHeight !== "number" || typeof panelScrollEl.offsetHeight !== "number") {
- return;
- }
- panelScrollEl.tabIndex = panelScrollEl.scrollHeight > panelScrollEl.offsetHeight ? 0 : -1;
- };
- this.setContainerRef = (node) => {
- this.containerEl = node;
- };
- this.setCloseRef = (node) => {
- this.closeButtonEl = node;
- };
- this.setBackRef = (node) => {
- this.backButtonEl = node;
- };
- this.panelKeyDownHandler = (event) => {
- if (this.closable && event.key === "Escape" && !event.defaultPrevented) {
- this.close();
- event.preventDefault();
- }
- };
- this.close = () => {
- this.closed = true;
- this.calcitePanelDismiss.emit();
- this.calcitePanelClose.emit();
- };
- this.panelScrollHandler = () => {
- this.calcitePanelScroll.emit();
- };
- this.backButtonClick = () => {
- this.calcitePanelBackClick.emit();
- };
- this.handleHeaderActionsStartSlotChange = (event) => {
- const elements = event.target.assignedElements({
- flatten: true
- });
- this.hasStartActions = !!elements.length;
- };
- this.handleHeaderActionsEndSlotChange = (event) => {
- const elements = event.target.assignedElements({
- flatten: true
- });
- this.hasEndActions = !!elements.length;
- };
- this.handleHeaderMenuActionsSlotChange = (event) => {
- const elements = event.target.assignedElements({
- flatten: true
- });
- this.hasMenuItems = !!elements.length;
- };
- this.handleHeaderContentSlotChange = (event) => {
- const elements = event.target.assignedElements({
- flatten: true
- });
- this.hasHeaderContent = !!elements.length;
- };
- this.handleFooterSlotChange = (event) => {
- const elements = event.target.assignedElements({
- flatten: true
- });
- this.hasFooterContent = !!elements.length;
- };
- this.handleFooterActionsSlotChange = (event) => {
- const elements = event.target.assignedElements({
- flatten: true
- });
- this.hasFooterActions = !!elements.length;
- };
- this.handleFabSlotChange = (event) => {
- const elements = event.target.assignedElements({
- flatten: true
- });
- this.hasFab = !!elements.length;
- };
- this.setPanelScrollEl = (el) => {
- var _a, _b;
- this.panelScrollEl = el;
- (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- if (el) {
- (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.observe(el);
- this.resizeHandler();
- }
- };
- }
- dismissedHandler(value) {
- this.closed = value;
- this.calcitePanelDismissedChange.emit();
- }
- closedHandler(value) {
- this.dismissed = value;
- }
- dismissibleHandler(value) {
- this.closable = value;
- }
- closableHandler(value) {
- this.dismissible = value;
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- connectedCallback() {
- const isClosed = this.dismissed || this.closed;
- const isClosable = this.dismissible || this.closable;
- if (isClosed) {
- this.dismissedHandler(isClosed);
- this.closedHandler(isClosed);
- }
- if (isClosable) {
- this.dismissibleHandler(isClosable);
- this.closableHandler(isClosable);
- }
- }
- disconnectedCallback() {
- var _a;
- (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
- }
- async setFocus(focusId) {
- const { backButtonEl, closeButtonEl, containerEl } = this;
- if (focusId === "back-button") {
- backButtonEl === null || backButtonEl === void 0 ? void 0 : backButtonEl.setFocus();
- return;
- }
- if (focusId === "dismiss-button") {
- closeButtonEl === null || closeButtonEl === void 0 ? void 0 : closeButtonEl.setFocus();
- return;
- }
- if (backButtonEl) {
- backButtonEl.setFocus();
- return;
- }
- if (closeButtonEl) {
- closeButtonEl.setFocus();
- return;
- }
- containerEl === null || containerEl === void 0 ? void 0 : containerEl.focus();
- }
- async scrollContentTo(options) {
- var _a;
- (_a = this.panelScrollEl) === null || _a === void 0 ? void 0 : _a.scrollTo(options);
- }
- renderBackButton() {
- const { el } = this;
- const rtl = getElementDir(el) === "rtl";
- const { showBackButton, intlBack, backButtonClick } = this;
- const label = intlBack || TEXT3.back;
- const icon = rtl ? ICONS2.backRight : ICONS2.backLeft;
- return showBackButton ? h("calcite-action", { "aria-label": label, class: CSS4.backButton, icon, key: "back-button", onClick: backButtonClick, ref: this.setBackRef, scale: "s", slot: SLOTS2.headerActionsStart, text: label }) : null;
- }
- renderHeaderContent() {
- const { heading, headingLevel, summary, description, hasHeaderContent } = this;
- const headingNode = heading ? h(Heading, { class: CSS4.heading, level: headingLevel || HEADING_LEVEL2 }, heading) : null;
- const descriptionNode = description || summary ? h("span", { class: CSS4.description }, description || summary) : null;
- return !hasHeaderContent && (headingNode || descriptionNode) ? h("div", { class: CSS4.headerContent, key: "header-content" }, headingNode, descriptionNode) : null;
- }
- renderHeaderSlottedContent() {
- return h("div", { class: CSS4.headerContent, hidden: !this.hasHeaderContent, key: "slotted-header-content" }, h("slot", { name: SLOTS2.headerContent, onSlotchange: this.handleHeaderContentSlotChange }));
- }
- renderHeaderStartActions() {
- const { hasStartActions } = this;
- return h("div", { class: { [CSS4.headerActionsStart]: true, [CSS4.headerActions]: true }, hidden: !hasStartActions, key: "header-actions-start" }, h("slot", { name: SLOTS2.headerActionsStart, onSlotchange: this.handleHeaderActionsStartSlotChange }));
- }
- renderHeaderActionsEnd() {
- const { close, hasEndActions, intlClose, closable } = this;
- const text = intlClose || TEXT3.close;
- const closableNode = closable ? h("calcite-action", { "aria-label": text, icon: ICONS2.close, onClick: close, ref: this.setCloseRef, text }) : null;
- const slotNode = h("slot", { name: SLOTS2.headerActionsEnd, onSlotchange: this.handleHeaderActionsEndSlotChange });
- const showContainer = hasEndActions || closableNode;
- return h("div", { class: { [CSS4.headerActionsEnd]: true, [CSS4.headerActions]: true }, hidden: !showContainer, key: "header-actions-end" }, slotNode, closableNode);
- }
- renderMenu() {
- const { hasMenuItems, intlOptions, menuOpen } = this;
- return h("calcite-action-menu", { flipPlacements: ["top", "bottom"], hidden: !hasMenuItems, key: "menu", label: intlOptions || TEXT3.options, open: menuOpen, placement: "bottom-end" }, h("calcite-action", { icon: ICONS2.menu, slot: SLOTS.trigger, text: intlOptions || TEXT3.options }), h("slot", { name: SLOTS2.headerMenuActions, onSlotchange: this.handleHeaderMenuActionsSlotChange }));
- }
- renderHeaderNode() {
- const { showBackButton, hasHeaderContent, hasStartActions, hasEndActions, closable, hasMenuItems } = this;
- const headerContentNode = this.renderHeaderContent();
- const showHeader = showBackButton || hasHeaderContent || headerContentNode || hasStartActions || hasEndActions || closable || hasMenuItems;
- return h("header", { class: CSS4.header, hidden: !showHeader }, this.renderBackButton(), this.renderHeaderStartActions(), this.renderHeaderSlottedContent(), headerContentNode, this.renderHeaderActionsEnd(), this.renderMenu());
- }
- renderFooterNode() {
- const { hasFooterContent, hasFooterActions } = this;
- const showFooter = hasFooterContent || hasFooterActions;
- return h("footer", { class: CSS4.footer, hidden: !showFooter }, h("slot", { key: "footer-slot", name: SLOTS2.footer, onSlotchange: this.handleFooterSlotChange }), h("slot", { key: "footer-actions-slot", name: SLOTS2.footerActions, onSlotchange: this.handleFooterActionsSlotChange }));
- }
- renderContent() {
- const { hasFab } = this;
- const defaultSlotNode = h("slot", { key: "default-slot" });
- const containerNode = hasFab ? h("section", { class: CSS4.contentContainer }, defaultSlotNode) : defaultSlotNode;
- return h("div", { class: {
- [CSS4.contentWrapper]: true,
- [CSS4.contentContainer]: !hasFab,
- [CSS4.contentHeight]: hasFab
- }, onScroll: this.panelScrollHandler, ref: this.setPanelScrollEl }, containerNode, this.renderFab());
- }
- renderFab() {
- return h("div", { class: CSS4.fabContainer, hidden: !this.hasFab }, h("slot", { name: SLOTS2.fab, onSlotchange: this.handleFabSlotChange }));
- }
- render() {
- const { loading, panelKeyDownHandler, closed, closable } = this;
- const panelNode = h("article", { "aria-busy": toAriaBoolean(loading), class: CSS4.container, hidden: closed, onKeyDown: panelKeyDownHandler, ref: this.setContainerRef, tabIndex: closable ? 0 : -1 }, this.renderHeaderNode(), this.renderContent(), this.renderFooterNode());
- return h(Fragment, null, loading ? h("calcite-scrim", { loading }) : null, panelNode);
- }
- get el() {
- return this;
- }
- static get watchers() {
- return {
- "dismissed": ["dismissedHandler"],
- "closed": ["closedHandler"],
- "dismissible": ["dismissibleHandler"],
- "closable": ["closableHandler"]
- };
- }
- static get style() {
- return panelCss;
- }
- }, [1, "calcite-panel", {
- "dismissed": [1540],
- "closed": [1540],
- "beforeBack": [16],
- "disabled": [516],
- "dismissible": [1540],
- "closable": [1540],
- "headingLevel": [514, "heading-level"],
- "showBackButton": [516, "show-back-button"],
- "intlBack": [1, "intl-back"],
- "heightScale": [513, "height-scale"],
- "widthScale": [513, "width-scale"],
- "loading": [516],
- "intlClose": [1, "intl-close"],
- "intlOptions": [1, "intl-options"],
- "heading": [1],
- "summary": [1],
- "description": [1],
- "menuOpen": [516, "menu-open"],
- "hasStartActions": [32],
- "hasEndActions": [32],
- "hasMenuItems": [32],
- "hasHeaderContent": [32],
- "hasFooterContent": [32],
- "hasFooterActions": [32],
- "hasFab": [32],
- "setFocus": [64],
- "scrollContentTo": [64]
- }]);
- function defineCustomElement8() {
- if (typeof customElements === "undefined") {
- return;
- }
- const components = ["calcite-panel", "calcite-action", "calcite-action-menu", "calcite-icon", "calcite-loader", "calcite-popover", "calcite-scrim"];
- components.forEach((tagName) => {
- switch (tagName) {
- case "calcite-panel":
- if (!customElements.get(tagName)) {
- customElements.define(tagName, Panel);
- }
- break;
- case "calcite-action":
- if (!customElements.get(tagName)) {
- defineCustomElement3();
- }
- break;
- case "calcite-action-menu":
- if (!customElements.get(tagName)) {
- defineCustomElement6();
- }
- break;
- case "calcite-icon":
- if (!customElements.get(tagName)) {
- defineCustomElement();
- }
- break;
- case "calcite-loader":
- if (!customElements.get(tagName)) {
- defineCustomElement2();
- }
- break;
- case "calcite-popover":
- if (!customElements.get(tagName)) {
- defineCustomElement5();
- }
- break;
- case "calcite-scrim":
- if (!customElements.get(tagName)) {
- defineCustomElement7();
- }
- break;
- }
- });
- }
- defineCustomElement8();
- // node_modules/@esri/calcite-components/dist/components/calcite-flow-item.js
- var CSS5 = {
- backButton: "back-button"
- };
- var ICONS3 = {
- backLeft: "chevron-left",
- backRight: "chevron-right"
- };
- var TEXT4 = {
- back: "Back"
- };
- var SLOTS3 = {
- headerActionsStart: "header-actions-start",
- headerActionsEnd: "header-actions-end",
- headerMenuActions: "header-menu-actions",
- headerContent: "header-content",
- fab: "fab",
- footer: "footer",
- footerActions: "footer-actions"
- };
- var flowItemCss = "@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}}:host{box-sizing:border-box;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host([disabled]){pointer-events:none;cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host{position:relative;display:flex;inline-size:100%;flex:1 1 auto;overflow:hidden}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.back-button{border-width:0px;border-style:solid;border-color:var(--calcite-ui-border-3);border-inline-end-width:1px}";
- var FlowItem = proxyCustomElement(class extends H {
- constructor() {
- super();
- this.__registerHost();
- this.__attachShadow();
- this.calciteFlowItemBack = createEvent(this, "calciteFlowItemBack", 6);
- this.calciteFlowItemBackClick = createEvent(this, "calciteFlowItemBackClick", 6);
- this.calciteFlowItemScroll = createEvent(this, "calciteFlowItemScroll", 6);
- this.calciteFlowItemClose = createEvent(this, "calciteFlowItemClose", 6);
- this.closable = false;
- this.closed = false;
- this.disabled = false;
- this.loading = false;
- this.menuOpen = false;
- this.showBackButton = false;
- this.handlePanelScroll = (event) => {
- event.stopPropagation();
- this.calciteFlowItemScroll.emit();
- };
- this.handlePanelClose = (event) => {
- event.stopPropagation();
- this.calciteFlowItemClose.emit();
- };
- this.backButtonClick = () => {
- this.calciteFlowItemBackClick.emit();
- this.calciteFlowItemBack.emit();
- };
- this.setBackRef = (node) => {
- this.backButtonEl = node;
- };
- this.setContainerRef = (node) => {
- this.containerEl = node;
- };
- this.getBackLabel = () => {
- return this.intlBack || TEXT4.back;
- };
- }
- componentDidRender() {
- updateHostInteraction(this);
- }
- async setFocus() {
- const { backButtonEl, containerEl } = this;
- if (backButtonEl) {
- backButtonEl.setFocus();
- return;
- }
- containerEl === null || containerEl === void 0 ? void 0 : containerEl.setFocus();
- }
- async scrollContentTo(options) {
- var _a;
- await ((_a = this.containerEl) === null || _a === void 0 ? void 0 : _a.scrollContentTo(options));
- }
- renderBackButton() {
- const { el } = this;
- const rtl = getElementDir(el) === "rtl";
- const { showBackButton, backButtonClick } = this;
- const label = this.getBackLabel();
- const icon = rtl ? ICONS3.backRight : ICONS3.backLeft;
- return showBackButton ? h("calcite-action", { "aria-label": label, class: CSS5.backButton, icon, key: "flow-back-button", onClick: backButtonClick, ref: this.setBackRef, scale: "s", slot: "header-actions-start", text: label }) : null;
- }
- render() {
- const { closable, closed, description, disabled, heading, headingLevel, heightScale, intlBack, intlClose, intlOptions, loading, menuOpen, widthScale, backButtonEl } = this;
- const label = this.getBackLabel();
- return h(Host, null, h("calcite-panel", { closable, closed, description, disabled, heading, headingLevel, heightScale, intlBack, intlClose, intlOptions, loading, menuOpen, onCalcitePanelClose: this.handlePanelClose, onCalcitePanelScroll: this.handlePanelScroll, ref: this.setContainerRef, widthScale }, this.renderBackButton(), h("slot", { name: SLOTS3.headerActionsStart, slot: SLOTS2.headerActionsStart }), h("slot", { name: SLOTS3.headerActionsEnd, slot: SLOTS2.headerActionsEnd }), h("slot", { name: SLOTS3.headerContent, slot: SLOTS2.headerContent }), h("slot", { name: SLOTS3.headerMenuActions, slot: SLOTS2.headerMenuActions }), h("slot", { name: SLOTS3.fab, slot: SLOTS2.fab }), h("slot", { name: SLOTS3.footerActions, slot: SLOTS2.footerActions }), h("slot", { name: SLOTS3.footer, slot: SLOTS2.footer }), h("slot", null)), backButtonEl ? h("calcite-tooltip", { label, placement: "auto", referenceElement: backButtonEl }, label) : null);
- }
- get el() {
- return this;
- }
- static get style() {
- return flowItemCss;
- }
- }, [1, "calcite-flow-item", {
- "closable": [1540],
- "closed": [1540],
- "beforeBack": [16],
- "description": [1],
- "disabled": [516],
- "heading": [1],
- "headingLevel": [514, "heading-level"],
- "heightScale": [513, "height-scale"],
- "intlBack": [1, "intl-back"],
- "intlClose": [1, "intl-close"],
- "intlOptions": [1, "intl-options"],
- "loading": [516],
- "menuOpen": [516, "menu-open"],
- "showBackButton": [516, "show-back-button"],
- "widthScale": [513, "width-scale"],
- "backButtonEl": [32],
- "setFocus": [64],
- "scrollContentTo": [64]
- }]);
- function defineCustomElement$1() {
- if (typeof customElements === "undefined") {
- return;
- }
- const components = ["calcite-flow-item", "calcite-action", "calcite-action-menu", "calcite-icon", "calcite-loader", "calcite-panel", "calcite-popover", "calcite-scrim", "calcite-tooltip"];
- components.forEach((tagName) => {
- switch (tagName) {
- case "calcite-flow-item":
- if (!customElements.get(tagName)) {
- customElements.define(tagName, FlowItem);
- }
- break;
- case "calcite-action":
- if (!customElements.get(tagName)) {
- defineCustomElement3();
- }
- break;
- case "calcite-action-menu":
- if (!customElements.get(tagName)) {
- defineCustomElement6();
- }
- break;
- case "calcite-icon":
- if (!customElements.get(tagName)) {
- defineCustomElement();
- }
- break;
- case "calcite-loader":
- if (!customElements.get(tagName)) {
- defineCustomElement2();
- }
- break;
- case "calcite-panel":
- if (!customElements.get(tagName)) {
- defineCustomElement8();
- }
- break;
- case "calcite-popover":
- if (!customElements.get(tagName)) {
- defineCustomElement5();
- }
- break;
- case "calcite-scrim":
- if (!customElements.get(tagName)) {
- defineCustomElement7();
- }
- break;
- case "calcite-tooltip":
- if (!customElements.get(tagName)) {
- defineCustomElement4();
- }
- break;
- }
- });
- }
- defineCustomElement$1();
- var CalciteFlowItem = FlowItem;
- var defineCustomElement9 = defineCustomElement$1;
- export {
- CalciteFlowItem,
- defineCustomElement9 as defineCustomElement
- };
- /*!
- * 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
- */
- //# sourceMappingURL=calcite-flow-item-TCVP5OA7.js.map
|