@esri/calcite-components 5.2.0-next.3 → 5.2.0-next.30

package/dist/chunks/dom.js

@@ -1,7 +1,6 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { g as guid } from "./guid.js";
 import { C as CSS_UTILITY } from "./runtime.js";
-var candidateSelectors = ["input:not([inert]):not([inert] *)", "select:not([inert]):not([inert] *)", "textarea:not([inert]):not([inert] *)", "a[href]:not([inert]):not([inert] *)", "button:not([inert]):not([inert] *)", "[tabindex]:not(slot):not([inert]):not([inert] *)", "audio[controls]:not([inert]):not([inert] *)", "video[controls]:not([inert]):not([inert] *)", '[contenteditable]:not([contenteditable="false"]):not([inert]):not([inert] *)', "details>summary:first-of-type:not([inert]):not([inert] *)", "details:not([inert]):not([inert] *)"];
+var candidateSelectors = ["input:not([inert]):not([inert] *)", "select:not([inert]):not([inert] *)", "textarea:not([inert]):not([inert] *)", "a[href]:not([inert]):not([inert] *)", "area[href]:not([inert]):not([inert] *)", "button:not([inert]):not([inert] *)", "[tabindex]:not(slot):not([inert]):not([inert] *)", "audio[controls]:not([inert]):not([inert] *)", "video[controls]:not([inert]):not([inert] *)", '[contenteditable]:not([contenteditable="false"]):not([inert]):not([inert] *)', "details>summary:first-of-type:not([inert]):not([inert] *)", "details:not([inert]):not([inert] *)"];
 var candidateSelector = /* @__PURE__ */ candidateSelectors.join(",");
 var NoElement = typeof Element === "undefined";
 var matches = NoElement ? function() {
@@ -197,7 +196,8 @@ var isHidden = function isHidden2(node, _ref) {
       return !visible;
     }
   }
-  if (getComputedStyle(node).visibility === "hidden") {
+  var _getComputedStyle = getComputedStyle(node), visibility = _getComputedStyle.visibility;
+  if (visibility === "hidden" || visibility === "collapse") {
     return true;
   }
   var isDirectSummary = matches.call(node, "details>summary:first-of-type");
@@ -331,12 +331,6 @@ var focusable = function focusable2(container, options) {
 const tabbableOptions = {
   getShadowRoot: true
 };
-function ensureId(el) {
-  if (!el) {
-    return "";
-  }
-  return el.id = el.id || `${el.tagName.toLowerCase()}-${guid()}`;
-}
 function nodeListToArray(nodeList) {
   return Array.isArray(nodeList) ? nodeList : Array.from(nodeList);
 }
@@ -450,6 +444,7 @@ function setRequestedIcon(iconObject, iconValue, matchedValue) {
   } else if (iconValue === "" || iconValue === true) {
     return iconObject[matchedValue];
   }
+  return;
 }
 function intersects(rect1, rect2) {
   return !(rect2.left > rect1.right || rect2.right < rect1.left || rect2.top > rect1.bottom || rect2.bottom < rect1.top);
@@ -528,8 +523,9 @@ async function whenTransitionDone(targetEl, transitionProp) {
   return whenTransitionOrAnimationDone(targetEl, transitionProp, "transition");
 }
 function findAnimation(targetEl, type, transitionPropOrAnimationName) {
-  const targetProp = type === "transition" ? "transitionProperty" : "animationName";
-  return targetEl.getAnimations().find((anim) => anim[targetProp] === transitionPropOrAnimationName);
+  return targetEl.getAnimations().find(
+    (anim) => type === "transition" ? "transitionProperty" in anim && anim.transitionProperty === transitionPropOrAnimationName : "animationName" in anim && anim.animationName === transitionPropOrAnimationName
+  );
 }
 async function whenTransitionOrAnimationDone(targetEl, transitionPropOrAnimationName, type) {
   let anim = findAnimation(targetEl, type, transitionPropOrAnimationName);
@@ -563,9 +559,8 @@ function viewportUnitToPixel(value, viewportSize) {
 }
 export {
   slotChangeHasTextContent as A,
-  ensureId as B,
-  filterDirectChildren as C,
-  getSlotAssignedElements as D,
+  filterDirectChildren as B,
+  getSlotAssignedElements as C,
   slotChangeGetAssignedElements as a,
   setRequestedIcon as b,
   closestElementCrossShadowBoundary as c,
@@ -581,9 +576,9 @@ export {
   slotChangeHasContent as m,
   nodeListToArray as n,
   whenTransitionDone as o,
-  isBefore as p,
+  isCalciteFocusable as p,
   queryElementRoots as q,
-  isCalciteFocusable as r,
+  isBefore as r,
   slotChangeHasAssignedElement as s,
   tabbableOptions as t,
   nextFrame as u,

package/dist/chunks/floating-ui.js

@@ -1,6 +1,6 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { isServer } from "lit";
-import { computePosition, autoUpdate, shift, hide, flip, offset, autoPlacement, arrow, platform } from "@floating-ui/dom";
+import { computePosition, autoUpdate, shift, offset, autoPlacement, flip, arrow, hide, platform } from "@floating-ui/dom";
 import { debounce } from "es-toolkit";
 import { offsetParent } from "composed-offset-position";
 import { D as DEBOUNCE } from "./runtime.js";
@@ -116,26 +116,31 @@ function getMiddleware({
   arrowEl,
   type
 }) {
-  const middleware = [shift(), hide()];
-  if (type === "menu") {
-    middleware.push(
-      flip({
-        fallbackPlacements: flipPlacements2 || ["top-start", "top", "top-end", "bottom-start", "bottom", "bottom-end"]
-      })
-    );
-  }
+  const rootBoundary = "layoutViewport";
+  const isAutoPlacement = placement === "auto" || placement === "auto-start" || placement === "auto-end";
+  const middleware = [
+    shift({
+      rootBoundary
+    })
+  ];
   middleware.push(
     offset({
       mainAxis: typeof offsetDistance === "number" ? offsetDistance : 0,
       crossAxis: typeof offsetSkidding === "number" ? offsetSkidding : 0
     })
   );
-  if (placement === "auto" || placement === "auto-start" || placement === "auto-end") {
+  if (isAutoPlacement) {
     middleware.push(
-      autoPlacement({ alignment: placement === "auto-start" ? "start" : placement === "auto-end" ? "end" : null })
+      autoPlacement({
+        alignment: placement === "auto-start" ? "start" : placement === "auto-end" ? "end" : null,
+        rootBoundary
+      })
     );
-  } else if (!flipDisabled) {
-    middleware.push(flip(flipPlacements2 ? { fallbackPlacements: flipPlacements2 } : {}));
+  }
+  const shouldAddFlip = !flipDisabled && (!isAutoPlacement || type === "menu");
+  if (shouldAddFlip) {
+    const fallbackPlacements = type === "menu" ? flipPlacements2 || ["top-start", "top", "top-end", "bottom-start", "bottom", "bottom-end"] : flipPlacements2;
+    middleware.push(flip(fallbackPlacements ? { fallbackPlacements, rootBoundary } : { rootBoundary }));
   }
   if (arrowEl) {
     middleware.push(
@@ -144,6 +149,11 @@ function getMiddleware({
       })
     );
   }
+  middleware.push(
+    hide({
+      rootBoundary
+    })
+  );
   return middleware;
 }
 function isFlipPlacement(placement) {

package/dist/chunks/label.js

@@ -1,146 +1,7 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { q as queryElementRoots, c as closestElementCrossShadowBoundary, p as isBefore } from "./dom.js";
-const labelClickEvent = "calciteInternalLabelClick";
-const labelConnectedEvent = "calciteInternalLabelConnected";
-const labelDisconnectedEvent = "calciteInternalLabelDisconnected";
-const labelTagName = "calcite-label";
-const labelToLabelables = /* @__PURE__ */ new WeakMap();
-const onLabelClickMap = /* @__PURE__ */ new WeakMap();
-const onLabelConnectedMap = /* @__PURE__ */ new WeakMap();
-const onLabelDisconnectedMap = /* @__PURE__ */ new WeakMap();
-const unlabeledComponents = /* @__PURE__ */ new Set();
-const findLabelForComponent = (componentEl) => {
-  const { id } = componentEl;
-  const forLabel = id && queryElementRoots(componentEl, { selector: `${labelTagName}[for="${id}"]` });
-  if (forLabel) {
-    return forLabel;
-  }
-  const parentLabel = closestElementCrossShadowBoundary(componentEl, labelTagName);
-  if (!parentLabel || // labelable components within other custom elements are not considered labelable
-  hasAncestorCustomElements(parentLabel, componentEl)) {
-    return null;
-  }
-  return parentLabel;
-};
-function hasAncestorCustomElements(label, componentEl) {
-  let traversedElements;
-  const customElementAncestorCheckEventType = "custom-element-ancestor-check";
-  const listener = ((event) => {
-    event.stopImmediatePropagation();
-    const composedPath = event.composedPath();
-    traversedElements = composedPath.slice(composedPath.indexOf(componentEl), composedPath.indexOf(label));
-  });
-  label.addEventListener(customElementAncestorCheckEventType, listener, { once: true });
-  componentEl.dispatchEvent(new CustomEvent(customElementAncestorCheckEventType, { composed: true, bubbles: true }));
-  label.removeEventListener(customElementAncestorCheckEventType, listener);
-  const ancestorCustomElements = traversedElements.filter((el) => el !== componentEl && el !== label).filter((el) => el.tagName?.includes("-"));
-  return ancestorCustomElements.length > 0;
-}
-function connectLabel(component) {
-  if (!component) {
-    return;
-  }
-  const labelEl = findLabelForComponent(component.el);
-  if (labelEl && onLabelClickMap.has(labelEl) && labelEl === component.labelEl || !labelEl && unlabeledComponents.has(component)) {
-    return;
-  }
-  const boundOnLabelDisconnected = onLabelDisconnected.bind(component);
-  if (labelEl) {
-    component.labelEl = labelEl;
-    const labelables = labelToLabelables.get(labelEl) || [];
-    labelables.push(component);
-    labelToLabelables.set(labelEl, labelables.sort(sortByDOMOrder));
-    if (!onLabelClickMap.has(component.labelEl)) {
-      onLabelClickMap.set(component.labelEl, onLabelClick);
-      component.labelEl.addEventListener(labelClickEvent, onLabelClick);
-    }
-    unlabeledComponents.delete(component);
-    document.removeEventListener(labelConnectedEvent, onLabelConnectedMap.get(component));
-    onLabelDisconnectedMap.set(component, boundOnLabelDisconnected);
-    document.addEventListener(labelDisconnectedEvent, boundOnLabelDisconnected);
-  } else if (!unlabeledComponents.has(component)) {
-    boundOnLabelDisconnected();
-    document.removeEventListener(labelDisconnectedEvent, onLabelDisconnectedMap.get(component));
-  }
-}
-function disconnectLabel(component) {
-  if (!component) {
-    return;
-  }
-  unlabeledComponents.delete(component);
-  document.removeEventListener(labelConnectedEvent, onLabelConnectedMap.get(component));
-  document.removeEventListener(labelDisconnectedEvent, onLabelDisconnectedMap.get(component));
-  onLabelConnectedMap.delete(component);
-  onLabelDisconnectedMap.delete(component);
-  if (!component.labelEl) {
-    return;
-  }
-  const labelables = labelToLabelables.get(component.labelEl);
-  if (labelables.length === 1) {
-    component.labelEl.removeEventListener(labelClickEvent, onLabelClickMap.get(component.labelEl));
-    onLabelClickMap.delete(component.labelEl);
-  }
-  labelToLabelables.set(
-    component.labelEl,
-    labelables.filter((labelable) => labelable !== component).sort(sortByDOMOrder)
-  );
-  component.labelEl = void 0;
-}
-function sortByDOMOrder(a, b) {
-  return isBefore(a.el, b.el) ? -1 : 1;
-}
 function getLabelText(component) {
   return component.label || component.labelEl?.textContent?.trim() || "";
 }
-function onLabelClick(event) {
-  const labelClickTarget = event.detail.sourceEvent.target;
-  const labelables = labelToLabelables.get(this);
-  const clickedLabelable = labelables.find((labelable) => labelable.el === labelClickTarget);
-  const labelableChildClicked = clickedLabelable && labelables.includes(clickedLabelable);
-  if (labelableChildClicked) {
-    return;
-  }
-  const firstLabelable = labelables[0];
-  if (firstLabelable.disabled) {
-    return;
-  }
-  firstLabelable.onLabelClick(event);
-}
-function onLabelConnected() {
-  if (unlabeledComponents.has(this)) {
-    connectLabel(this);
-  }
-}
-function onLabelDisconnected() {
-  unlabeledComponents.add(this);
-  const boundOnLabelConnected = onLabelConnectedMap.get(this) || onLabelConnected.bind(this);
-  onLabelConnectedMap.set(this, boundOnLabelConnected);
-  document.addEventListener(labelConnectedEvent, boundOnLabelConnected);
-}
-async function associateExplicitLabelToUnlabeledComponent(label) {
-  await label.componentOnReady();
-  const alreadyLabeled = labelToLabelables.has(label);
-  if (alreadyLabeled) {
-    return;
-  }
-  const forComponentEl = label.for && label.ownerDocument?.getElementById(label.for);
-  if (!forComponentEl) {
-    return;
-  }
-  requestAnimationFrame(() => {
-    for (const labelable of unlabeledComponents) {
-      if (labelable.el === forComponentEl) {
-        connectLabel(labelable);
-        break;
-      }
-    }
-  });
-}
 export {
-  associateExplicitLabelToUnlabeledComponent as a,
-  labelDisconnectedEvent as b,
-  connectLabel as c,
-  disconnectLabel as d,
-  getLabelText as g,
-  labelConnectedEvent as l
+  getLabelText as g
 };

package/dist/chunks/locale.js

@@ -275,7 +275,7 @@ class NumberStringFormat {
     this._group = this._actualGroup.trim().length === 0 || this._actualGroup == " " ? " " : this._actualGroup;
     this._decimal = options.locale === "bs" || options.locale === "mk" ? "," : parts.find((d) => d.type === "decimal").value;
     this._minusSign = parts.find((d) => d.type === "minusSign").value;
-    this._getDigitIndex = (d) => index.get(d);
+    this._getDigitIndex = (d) => `${index.get(d) ?? ""}`;
   }
   #normalizeDigitsAndSign(value) {
     return value.replace(new RegExp(`[${this._minusSign}]`, "g"), "-").replace(new RegExp(`[${this._digits.join("")}]`, "g"), this._getDigitIndex);

package/dist/chunks/logger.js

@@ -10,7 +10,7 @@ const logLevels = {
   off: 10
 };
 function willLog(level) {
-  return logLevels[level] >= logLevels[getConfig().logLevel];
+  return level !== "off" && logLevels[level] >= logLevels[getConfig().logLevel];
 }
 function forwardToConsole(level, ...data) {
   if (!willLog(level)) {

package/dist/chunks/manager.js

@@ -171,7 +171,7 @@ const referenceElementManager = (options) => {
     clearHoverCloseTimeout();
   };
   const pathHasOpenHoverComponent = (components, composedPath) => {
-    return activeComponents?.some((component) => component?.open && composedPath.includes(component.el)) || components?.some((component) => component?.open && composedPath.includes(component.el));
+    return !!(activeComponents?.some((component) => component?.open && composedPath.includes(component.el)) || components?.some((component) => component?.open && composedPath.includes(component.el)));
   };
   const toggleHoverComponents = (components, open) => {
     components?.forEach((component) => component.open = open);
@@ -476,8 +476,8 @@ const referenceElementManager = (options) => {
       clearHoverTimeout();
     }
     if (options.click && "ariaControlsElements" in referenceEl) {
-      const newElements = referenceEl.ariaControlsElements?.filter((element) => element !== component.el);
-      referenceEl.ariaControlsElements = newElements?.length > 0 ? newElements : null;
+      const newElements = (referenceEl.ariaControlsElements ?? []).filter((element) => element !== component.el);
+      referenceEl.ariaControlsElements = newElements.length > 0 ? newElements : null;
     }
     if (options.click && "ariaExpanded" in referenceEl) {
       const hasRegisteredComponents = (updatedComponents?.length ?? 0) > 0;
@@ -489,8 +489,8 @@ const referenceElementManager = (options) => {
       }
     }
     if (options.hover && "ariaDescribedByElements" in referenceEl) {
-      const newElements = referenceEl.ariaDescribedByElements?.filter((element) => element !== component.el);
-      referenceEl.ariaDescribedByElements = newElements?.length > 0 ? newElements : null;
+      const newElements = (referenceEl.ariaDescribedByElements ?? []).filter((element) => element !== component.el);
+      referenceEl.ariaDescribedByElements = newElements.length > 0 ? newElements : null;
     }
   };
   return {

package/dist/chunks/math.js

@@ -3,7 +3,7 @@ const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
 const decimalNumberRegex = new RegExp(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);
 const decimalPlaces = (value) => {
   const match = ("" + value).match(decimalNumberRegex);
-  if (!match || parseInt(match[1]) === 0) {
+  if (!match || parseInt(match[1], 10) === 0) {
     return 0;
   }
   return Math.max(

package/dist/chunks/resources.js

@@ -3,7 +3,6 @@ const CSS = {
   button: "button",
   buttonTextVisible: "button--text-visible",
   buttonCompact: "button--compact",
-  indicatorText: "indicator-text",
   iconContainer: "icon-container",
   slotContainer: "slot-container",
   slotContainerHidden: "slot-container--hidden",

package/dist/chunks/resources12.js

@@ -0,0 +1,27 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+const CSS = {
+  container: "container",
+  hasSlottedContent: "has-slotted-content",
+  stepperItemContent: "stepper-item-content",
+  stepperItemDescription: "stepper-item-description",
+  stepperItemHeader: "stepper-item-header",
+  stepperItemHeading: "stepper-item-heading",
+  stepperItemHeaderText: "stepper-item-header-text",
+  stepperItemIcon: "stepper-item-icon",
+  stepperItemNumber: "stepper-item-number",
+  visuallyHidden: "visually-hidden"
+};
+const ICONS = {
+  circle: "circle",
+  circleF: "circleF",
+  exclamationMarkCircleF: "exclamationMarkCircleF",
+  checkCircleF: "checkCircleF"
+};
+function isStepperItem(el) {
+  return el?.tagName === "CALCITE-STEPPER-ITEM";
+}
+export {
+  CSS as C,
+  ICONS as I,
+  isStepperItem as i
+};

package/dist/chunks/responsive.js

@@ -9,7 +9,7 @@ const breakpoints = {
   }
 };
 function cssLengthToNumber(length) {
-  return parseInt(length);
+  return parseInt(length, 10);
 }
 export {
   breakpoints as b

package/dist/chunks/runtime.js

@@ -14,7 +14,8 @@ const CSS_UTILITY = {
   calciteAnimateInUp: "calcite-animate__in-up",
   calciteAnimateInDown: "calcite-animate__in-down",
   calciteAnimateInRight: "calcite-animate__in-right",
-  calciteAnimateInLeft: "calcite-animate__in-left"
+  calciteAnimateInLeft: "calcite-animate__in-left",
+  screenReaderText: "screen-reader-text"
 };
 const DEBOUNCE = {
   filter: 250,
@@ -60,9 +61,9 @@ function getConfig() {
   }
   return effectiveConfig;
 }
-const version = "5.2.0-next.3";
-const buildDate = "2026-06-09";
-const revision = "04f926d33";
+const version = "5.2.0-next.30";
+const buildDate = "2026-07-21";
+const revision = "d1f34b8ec";
 function stampVersion() {
   const config = getConfig();
   if (config && config.version) {
@@ -85,7 +86,7 @@ if (!isServer) {
 if (process.env.NODE_ENV !== "test") {
   queueMicrotask(stampVersion);
 }
-const runtime = makeRuntime({ defaultAssetPath: "https://cdn.jsdelivr.net/npm/@esri/calcite-components@5.2.0-next.3/dist/cdn/", hydratedAttribute: "calcite-hydrated" });
+const runtime = makeRuntime({ defaultAssetPath: "https://cdn.jsdelivr.net/npm/@esri/calcite-components@5.2.0-next.30/dist/cdn/", hydratedAttribute: "calcite-hydrated" });
 const { customElement, getAssetPath, setAssetPath } = runtime;
 export {
   CSS_UTILITY as C,

package/dist/chunks/useForm.js

@@ -1,7 +1,7 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { makeGenericController, bypassReadOnly } from "@arcgis/lumina/controllers";
 import { uncapitalize, kebabToPascal } from "@arcgis/toolkit/string";
-import { r as isCalciteFocusable } from "./dom.js";
+import { p as isCalciteFocusable } from "./dom.js";
 import "lit";
 const minMaxStepTypes = ["date", "datetime-local", "month", "number", "range", "time", "week"];
 const patternTypes = ["email", "password", "search", "tel", "text", "url"];
@@ -42,9 +42,10 @@ function validate({
 }) {
   if (!Array.isArray(value)) {
     if (component && input.type === "radio") {
-      let group = component.elementInternals.form?.elements[component.name];
-      if (group?.length > 0) {
-        group = Array.from(group).filter(
+      const item = component.elementInternals.form?.elements.namedItem(component.name);
+      if (item) {
+        const elements = "length" in item ? Array.from(item) : [item];
+        const group = elements.filter(
           (element) => element.tagName === component.el.tagName
         );
         const isRequired = group.some((radioTypeElement) => radioTypeElement.required);
@@ -240,9 +241,10 @@ const useForm = (options) => {
         () => {
           clearValidationMessage(component, validationMessage);
           if (inputDelegate?.type === "radio") {
-            let group = component.elementInternals.form?.elements[component.name];
-            if (group?.length > 0) {
-              group = Array.from(group).filter(
+            const item = component.elementInternals.form?.elements.namedItem(component.name);
+            if (item) {
+              const elements = "length" in item ? Array.from(item) : [item];
+              const group = elements.filter(
                 (element) => element.tagName === component.el.tagName
               );
               const others = group.filter((radioTypeElement) => radioTypeElement !== component.el);

package/dist/chunks/useInlineEditable.js

@@ -0,0 +1,53 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+import { safeClassMap } from "@arcgis/lumina";
+import { nothing, html } from "lit";
+import { ref } from "lit/directives/ref.js";
+const CSS = {
+  container: "inline-editable--container",
+  enableEditing: "enable-editing",
+  confirmChanges: "confirm-changes",
+  cancelEditing: "cancel-editing"
+};
+const InlineEditableControls = ({ cancelEditingLabel, confirmChangesLabel, editingEnabled, enableEditingLabel, enableEditingButtonRef, loading, onCancelEditing, onConfirmChanges, onEnableEditing, scale, showControls }) => html`<div class=${safeClassMap(CSS.container)}>${!editingEnabled && html`<calcite-action .ariaLabel=${enableEditingLabel} class=${safeClassMap(CSS.enableEditing)} icon=pencil @click=${onEnableEditing} .scale=${scale} .text=${enableEditingLabel} title=${enableEditingLabel ?? nothing} type=button ${ref(enableEditingButtonRef)}></calcite-action>` || ""}${showControls && [
+  html`<calcite-action .ariaLabel=${confirmChangesLabel} class=${safeClassMap(CSS.confirmChanges)} icon=check .loading=${loading} @click=${onConfirmChanges} .scale=${scale} .text=${confirmChangesLabel} title=${confirmChangesLabel ?? nothing} type=button></calcite-action>`,
+  html`<calcite-action .ariaLabel=${cancelEditingLabel} class=${safeClassMap(CSS.cancelEditing)} icon=x @click=${onCancelEditing} .scale=${scale} .text=${cancelEditingLabel} title=${cancelEditingLabel ?? nothing} type=button></calcite-action>`
+] || ""}</div>`;
+class UseInlineEditable {
+  constructor(options) {
+    this.options = options;
+    this.valuePriorToEditing = "";
+  }
+  enable() {
+    this.valuePriorToEditing = this.options.getValue();
+    this.options.setEditingEnabled(true);
+    requestAnimationFrame(() => {
+      this.options.setFocus();
+    });
+    this.options.emitEnableEditingChange();
+  }
+  disable() {
+    this.options.setEditingEnabled(false);
+  }
+  cancelEditing() {
+    this.options.setValue(this.valuePriorToEditing);
+    this.disable();
+    this.options.emitCancel();
+  }
+  async confirm(afterConfirm, setLoading) {
+    this.options.emitConfirm();
+    try {
+      if (afterConfirm) {
+        setLoading?.(true);
+        await afterConfirm();
+        this.disable();
+      }
+    } finally {
+      setLoading?.(false);
+    }
+  }
+}
+export {
+  CSS as C,
+  InlineEditableControls as I,
+  UseInlineEditable as U
+};