@esri/calcite-components 1.0.0-next.556 → 1.0.0-next.557

package/dist/types/components/input-date-picker/input-date-picker.d.ts

@@ -117,7 +117,12 @@ export declare class InputDatePicker implements LabelableComponent, FormComponen
    * @deprecated use value instead
    */
   end?: string;
-  /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
+  /**
+   * Determines the type of positioning to use for the overlaid content.
+   *
+   * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+   *
+   */
   overlayPositioning: OverlayPositioning;
   overlayPositioningHandler(): void;
   /** Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range. */

package/dist/types/components/pick-list-item/pick-list-item.d.ts

@@ -86,7 +86,7 @@ export declare class PickListItem implements ConditionalSlotComponent, Interacti
    */
   calciteInternalListItemPropsChange: EventEmitter<void>;
   /**
-   * Emits when the the component's value property is modified.
+   * Emits when the component's value property is modified.
    *
    * @internal
    */

package/dist/types/components/popover/popover.d.ts

@@ -66,7 +66,12 @@ export declare class Popover implements FloatingUIComponent, OpenCloseComponent
    */
   open: boolean;
   openHandler(): void;
-  /** Describes the positioning type to use for the overlaid content. If the element is in a fixed container, use the "fixed" value. */
+  /**
+   * Determines the type of positioning to use for the overlaid content.
+   *
+   * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+   *
+   */
   overlayPositioning: OverlayPositioning;
   overlayPositioningHandler(): void;
   /**

package/dist/types/components/radio-button/radio-button.d.ts

@@ -1,9 +1,9 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
-import { CheckableFormCompoment } from "../../utils/form";
+import { CheckableFormComponent } from "../../utils/form";
 import { InteractiveComponent } from "../../utils/interactive";
-export declare class RadioButton implements LabelableComponent, CheckableFormCompoment, InteractiveComponent {
+export declare class RadioButton implements LabelableComponent, CheckableFormComponent, InteractiveComponent {
   el: HTMLCalciteRadioButtonElement;
   /** When true, the component is checked. */
   checked: boolean;

package/dist/types/components/split-button/split-button.d.ts

@@ -31,7 +31,12 @@ export declare class SplitButton implements InteractiveComponent {
    disabling interaction. with the primary button
    */
   loading: boolean;
-  /** Describes the type of positioning to use for the dropdown. If your element is in a fixed container, use the 'fixed' value. */
+  /**
+   * Determines the type of positioning to use for the overlaid content.
+   *
+   * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+   *
+   */
   overlayPositioning: OverlayPositioning;
   /** optionally pass an icon to display at the end of the primary button - accepts Calcite UI icon names  */
   primaryIconEnd?: string;

package/dist/types/components/switch/switch.d.ts

@@ -1,9 +1,9 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { DeprecatedEventPayload, Scale } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
-import { CheckableFormCompoment } from "../../utils/form";
+import { CheckableFormComponent } from "../../utils/form";
 import { InteractiveComponent } from "../../utils/interactive";
-export declare class Switch implements LabelableComponent, CheckableFormCompoment, InteractiveComponent {
+export declare class Switch implements LabelableComponent, CheckableFormComponent, InteractiveComponent {
   el: HTMLCalciteSwitchElement;
   /** True if the switch is disabled */
   disabled: boolean;

package/dist/types/components/tooltip/tooltip.d.ts

@@ -25,7 +25,12 @@ export declare class Tooltip implements FloatingUIComponent {
    */
   open: boolean;
   openHandler(): void;
-  /** Describes the positioning type to use for the overlaid content. If the `referenceElement` is in a fixed container, use the "fixed" value. */
+  /**
+   * Determines the type of positioning to use for the overlaid content.
+   *
+   * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+   *
+   */
   overlayPositioning: OverlayPositioning;
   overlayPositioningHandler(): void;
   /**

package/dist/types/components.d.ts

@@ -240,7 +240,7 @@ export namespace Components {
          */
         "open": boolean;
         /**
-          * Determines the type of positioning to use for the overlaid content. If your element is in a fixed container, use the "fixed" value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning": OverlayPositioning;
         /**
@@ -907,7 +907,7 @@ export namespace Components {
          */
         "open": boolean;
         /**
-          * Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning": OverlayPositioning;
         /**
@@ -1251,7 +1251,7 @@ export namespace Components {
          */
         "open": boolean;
         /**
-          * Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning": OverlayPositioning;
         /**
@@ -1762,7 +1762,7 @@ export namespace Components {
          */
         "open": boolean;
         /**
-          * Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning": OverlayPositioning;
         /**
@@ -2783,7 +2783,7 @@ export namespace Components {
          */
         "open": boolean;
         /**
-          * Describes the positioning type to use for the overlaid content. If the element is in a fixed container, use the "fixed" value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning": OverlayPositioning;
         /**
@@ -3293,7 +3293,7 @@ export namespace Components {
          */
         "loading": boolean;
         /**
-          * Describes the type of positioning to use for the dropdown. If your element is in a fixed container, use the 'fixed' value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning": OverlayPositioning;
         /**
@@ -3822,7 +3822,7 @@ export namespace Components {
          */
         "open": boolean;
         /**
-          * Describes the positioning type to use for the overlaid content. If the `referenceElement` is in a fixed container, use the "fixed" value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning": OverlayPositioning;
         /**
@@ -5113,7 +5113,7 @@ declare namespace LocalJSX {
          */
         "open"?: boolean;
         /**
-          * Determines the type of positioning to use for the overlaid content. If your element is in a fixed container, use the "fixed" value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning"?: OverlayPositioning;
         /**
@@ -5821,7 +5821,7 @@ declare namespace LocalJSX {
          */
         "open"?: boolean;
         /**
-          * Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning"?: OverlayPositioning;
         /**
@@ -6193,7 +6193,7 @@ declare namespace LocalJSX {
          */
         "open"?: boolean;
         /**
-          * Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning"?: OverlayPositioning;
         /**
@@ -6720,7 +6720,7 @@ declare namespace LocalJSX {
          */
         "open"?: boolean;
         /**
-          * Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning"?: OverlayPositioning;
         /**
@@ -7729,7 +7729,7 @@ declare namespace LocalJSX {
          */
         "open"?: boolean;
         /**
-          * Describes the positioning type to use for the overlaid content. If the element is in a fixed container, use the "fixed" value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning"?: OverlayPositioning;
         /**
@@ -8226,7 +8226,7 @@ declare namespace LocalJSX {
          */
         "onCalciteSplitButtonSecondaryClick"?: (event: CalciteSplitButtonCustomEvent<DeprecatedEventPayload>) => void;
         /**
-          * Describes the type of positioning to use for the dropdown. If your element is in a fixed container, use the 'fixed' value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning"?: OverlayPositioning;
         /**
@@ -8705,7 +8705,7 @@ declare namespace LocalJSX {
          */
         "open"?: boolean;
         /**
-          * Describes the positioning type to use for the overlaid content. If the `referenceElement` is in a fixed container, use the "fixed" value.
+          * Determines the type of positioning to use for the overlaid content.  Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
          */
         "overlayPositioning"?: OverlayPositioning;
         /**

package/dist/types/utils/form.d.ts

@@ -68,7 +68,7 @@ export interface FormComponent<T = any> extends FormOwner {
  *
  * Along with the interface, use the matching form utils to help set up the component behavior.
  */
-export interface CheckableFormCompoment<T = any> extends FormComponent<T> {
+export interface CheckableFormComponent<T = any> extends FormComponent<T> {
   /**
    * For boolean-valued components, this property defines whether the associated value is submitted to the form or not.
    */

package/dist/types/utils/globalScript.d.ts

@@ -0,0 +1,6 @@
+/**
+ * This file is imported in Stencil's `globalScript` config option.
+ *
+ * @see {@link https://stenciljs.com/docs/config#globalscript}
+ */
+export default function (): void;

package/dist/types/utils/resources.d.ts

@@ -1,4 +1,6 @@
 import { ThemeClass, ThemeName } from "../components/interfaces";
+export declare const autoTheme = "calcite-theme-auto";
+export declare const darkTheme = "calcite-theme-dark";
 interface Theme {
   name: ThemeName;
   className: ThemeClass;

package/dist/types/utils/theme.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Emits when the theme is dynamically toggled between light and dark on <body> or in OS preferences.
+ */
+export declare function initThemeChangeEvent(): void;

package/hydrate/index.js

@@ -1,7 +1,7 @@
 /*!
  * 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-next.556
+ * v1.0.0-next.557
  */
 'use strict';
 
@@ -4924,6 +4924,59 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
 const NAMESPACE = 'calcite';
 const BUILD = /* calcite */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: true, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: true, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: false, scoped: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
 
+const autoTheme = "calcite-theme-auto";
+const darkTheme = "calcite-theme-dark";
+const lightTheme = "calcite-theme-light";
+const CSS_UTILITY = {
+  autoTheme,
+  darkTheme,
+  lightTheme,
+  rtl: "calcite--rtl"
+};
+const TEXT$u = {
+  loading: "Loading"
+};
+
+/**
+ * Emits when the theme is dynamically toggled between light and dark on <body> or in OS preferences.
+ */
+function initThemeChangeEvent() {
+  const { classList } = document.body;
+  const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+  const getTheme = () => classList.contains(darkTheme) || (classList.contains(autoTheme) && prefersDark) ? "dark" : "light";
+  const emitThemeChange = (theme) => document.body.dispatchEvent(new CustomEvent("calciteThemeChange", { bubbles: true, detail: { theme } }));
+  const themeChangeHandler = (newTheme) => {
+    currentTheme !== newTheme && emitThemeChange(newTheme);
+    currentTheme = newTheme;
+  };
+  let currentTheme = getTheme();
+  // emits event on page load
+  emitThemeChange(currentTheme);
+  // emits event when changing OS theme preferences
+  window
+    .matchMedia("(prefers-color-scheme: dark)")
+    .addEventListener("change", (event) => themeChangeHandler(event.matches ? "dark" : "light"));
+  // emits event when toggling between theme classes on <body>
+  new MutationObserver(() => themeChangeHandler(getTheme())).observe(document.body, {
+    attributes: true,
+    attributeFilter: ["class"]
+  });
+}
+
+/**
+ * This file is imported in Stencil's `globalScript` config option.
+ *
+ * @see {@link https://stenciljs.com/docs/config#globalscript}
+ */
+function appGlobalScript () {
+  if (isBrowser()) {
+    initThemeChangeEvent();
+  }
+}
+const isBrowser = new Function("try {return this===window;}catch(e){ return false;}");
+
+const globalScripts = appGlobalScript;
+
 function componentOnReady() {
  return getHostRef(this).$onReadyPromise$;
 }
@@ -5032,7 +5085,7 @@ function hydrateApp(e, t, o, n, s) {
     return Array.from(t).map(waitingOnElementMsg);
    }(d)}`);
   }), t.timeout), plt.$resourcesUrl$ = new URL(t.resourcesUrl || "./", doc.baseURI).href, 
-  function e(t) {
+  globalScripts(), function e(t) {
    if (null != t && 1 === t.nodeType) {
     f(t);
     const o = t.children;
@@ -5898,19 +5951,6 @@ class Accordion {
   }; }
 }
 
-const autoTheme = "calcite-theme-auto";
-const darkTheme = "calcite-theme-dark";
-const lightTheme = "calcite-theme-light";
-const CSS_UTILITY = {
-  autoTheme,
-  darkTheme,
-  lightTheme,
-  rtl: "calcite--rtl"
-};
-const TEXT$u = {
-  loading: "Loading"
-};
-
 function gen(counts) {
   return counts
     .map((count) => {
@@ -8251,7 +8291,12 @@ class ActionMenu {
      * When true, the component is open.
      */
     this.open = false;
-    /** Determines the type of positioning to use for the overlaid content. If your element is in a fixed container, use the "fixed" value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /**
      * Determines where the component will be positioned relative to the `referenceElement`.
@@ -14977,11 +15022,59 @@ function getParentNode(node) {
 }
 
 function getTrueOffsetParent(element) {
-  if (!isHTMLElement(element) || getComputedStyle(element).position === 'fixed') {
+  if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
     return null;
   }
 
-  return element.offsetParent;
+  return composedOffsetParent(element);
+}
+/**
+ * Polyfills the old offsetParent behavior from before the spec was changed:
+ * https://github.com/w3c/csswg-drafts/issues/159
+ */
+
+
+function composedOffsetParent(element) {
+  let {
+    offsetParent
+  } = element;
+  let ancestor = element;
+  let foundInsideSlot = false;
+
+  while (ancestor && ancestor !== offsetParent) {
+    const {
+      assignedSlot
+    } = ancestor;
+
+    if (assignedSlot) {
+      let newOffsetParent = assignedSlot.offsetParent;
+
+      if (getComputedStyle$1(assignedSlot).display === 'contents') {
+        const hadStyleAttribute = assignedSlot.hasAttribute('style');
+        const oldDisplay = assignedSlot.style.display;
+        assignedSlot.style.display = getComputedStyle$1(ancestor).display;
+        newOffsetParent = assignedSlot.offsetParent;
+        assignedSlot.style.display = oldDisplay;
+
+        if (!hadStyleAttribute) {
+          assignedSlot.removeAttribute('style');
+        }
+      }
+
+      ancestor = assignedSlot;
+
+      if (offsetParent !== newOffsetParent) {
+        offsetParent = newOffsetParent;
+        foundInsideSlot = true;
+      }
+    } else if (isShadowRoot(ancestor) && ancestor.host && foundInsideSlot) {
+      break;
+    }
+
+    ancestor = isShadowRoot(ancestor) && ancestor.host || ancestor.parentNode;
+  }
+
+  return offsetParent;
 }
 
 function getContainingBlock(element) {
@@ -14995,7 +15088,8 @@ function getContainingBlock(element) {
     if (isContainingBlock(currentNode)) {
       return currentNode;
     } else {
-      currentNode = currentNode.parentNode;
+      const parent = currentNode.parentNode;
+      currentNode = isShadowRoot(parent) ? parent.host : parent;
     }
   }
 
@@ -15008,11 +15102,11 @@ function getOffsetParent(element) {
   const window = getWindow(element);
   let offsetParent = getTrueOffsetParent(element);
 
-  while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
+  while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
     offsetParent = getTrueOffsetParent(offsetParent);
   }
 
-  if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
+  if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
     return window;
   }
 
@@ -15613,7 +15707,12 @@ class Combobox {
     this.disabled = false;
     /** Specify the maximum number of combobox items (including nested children) to display before showing the scroller */
     this.maxItems = 0;
-    /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /**
      * When true, makes the component required for form-submission.
@@ -18091,7 +18190,12 @@ class Dropdown {
      this value does not include groupTitles passed to calcite-dropdown-group
      */
     this.maxItems = 0;
-    /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /**
      * Determines where the dropdown will be positioned relative to the button.
@@ -20534,7 +20638,12 @@ class InputDatePicker {
      * @internal
      */
     this.required = false;
-    /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /** Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range. */
     this.proximitySelectionDisabled = false;
@@ -25237,7 +25346,12 @@ class Popover {
      * When true, displays and positions the component.
      */
     this.open = false;
-    /** Describes the positioning type to use for the overlaid content. If the element is in a fixed container, use the "fixed" value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /**
      * Determines where the component will be positioned relative to the `referenceElement`.
@@ -31229,7 +31343,12 @@ class SplitButton {
      disabling interaction. with the primary button
      */
     this.loading = false;
-    /** Describes the type of positioning to use for the dropdown. If your element is in a fixed container, use the 'fixed' value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /** specify the scale of the control, defaults to m */
     this.scale = "m";
@@ -34218,7 +34337,12 @@ class Tooltip {
      * When true, the component is open.
      */
     this.open = false;
-    /** Describes the positioning type to use for the overlaid content. If the `referenceElement` is in a fixed container, use the "fixed" value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /**
      * Determines where the component will be positioned relative to the `referenceElement`.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esri/calcite-components",
-  "version": "1.0.0-next.556",
+  "version": "1.0.0-next.557",
   "description": "Web Components for Esri's Calcite Design System.",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -64,7 +64,7 @@
   },
   "dependencies": {
     "@a11y/focus-trap": "1.0.5",
-    "@floating-ui/dom": "1.0.0",
+    "@floating-ui/dom": "1.0.1",
     "@stencil/core": "2.17.3",
     "@types/color": "3.0.3",
     "color": "4.2.3",
@@ -98,9 +98,9 @@
     "@types/shell-quote": "1.7.1",
     "@types/sortablejs": "1.13.0",
     "@types/standard-version": "7.0.1",
-    "@types/yargs": "17.0.10",
-    "@typescript-eslint/eslint-plugin": "5.32.0",
-    "@typescript-eslint/parser": "5.32.0",
+    "@types/yargs": "17.0.11",
+    "@typescript-eslint/eslint-plugin": "5.33.0",
+    "@typescript-eslint/parser": "5.33.0",
     "@whitespace/storybook-addon-html": "5.0.0",
     "autoprefixer": "10.4.8",
     "axe-core": "4.4.3",
@@ -114,8 +114,8 @@
     "dedent": "0.7.0",
     "eslint": "8.21.0",
     "eslint-config-prettier": "8.5.0",
-    "eslint-plugin-jest": "26.7.0",
-    "eslint-plugin-jsdoc": "39.3.4",
+    "eslint-plugin-jest": "26.8.2",
+    "eslint-plugin-jsdoc": "39.3.6",
     "eslint-plugin-prettier": "4.2.1",
     "eslint-plugin-react": "7.30.1",
     "eslint-plugin-unicorn": "43.0.2",
@@ -127,7 +127,7 @@
     "jest-cli": "26.6.3",
     "lint-staged": "13.0.3",
     "pify": "6.0.0",
-    "postcss": "8.4.14",
+    "postcss": "8.4.16",
     "prettier": "2.7.1",
     "puppeteer": "10.0.0",
     "rimraf": "3.0.2",
@@ -142,7 +142,7 @@
     "stylelint": "14.9.1",
     "stylelint-config-recommended-scss": "7.0.0",
     "stylelint-use-logical-spec": "4.1.0",
-    "tailwindcss": "3.1.7",
+    "tailwindcss": "3.1.8",
     "ts-jest": "27.1.2",
     "ts-node": "10.9.1",
     "type-fest": "2.18.0",