@esri/calcite-components 1.0.0-beta.89 → 1.0.0-beta.91

package/dist/collection/demos/_assets/demo-template.js

@@ -0,0 +1,24 @@
+const toggleDir = () => {
+    document.dir = document.dir === "rtl" ? "ltr" : "rtl";
+};
+const toggleTheme = () => {
+    document.body.classList.toggle("calcite-theme-dark");
+};
+const toggleDom = (event) => {
+    const mover = document.querySelector("demo-dom-swapper");
+    const switchEl = event.currentTarget;
+    if (switchEl.checked) {
+        mover.moveTo("shadow");
+    }
+    else {
+        mover.moveTo("light");
+    }
+};
+const loadDemoToggles = () => {
+    document.querySelectorAll("h1:not(#demo-heading)").forEach((h1) => h1.remove());
+    document.getElementById("demo-heading").textContent = document.title;
+    document.getElementById("toggle-dir").addEventListener("calciteSwitchChange", toggleDir);
+    document.getElementById("toggle-theme").addEventListener("calciteSwitchChange", toggleTheme);
+    document.getElementById("toggle-dom").addEventListener("calciteSwitchChange", toggleDom);
+};
+document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", loadDemoToggles) : loadDemoToggles();

package/dist/collection/demos/_assets/head.js

@@ -0,0 +1,48 @@
+(() => {
+    const DEMO_ROOT = "demos";
+    const ASSETS_PATH = "demos/_assets";
+    const CSS = [`${ASSETS_PATH}/demos.css`, "build/calcite.css"];
+    const urlParams = new URLSearchParams(window.location.search);
+    const DISABLE_HEADER_URL_PARAM = "header-disabled";
+    const SCRIPTS = [
+        {
+            src: "build/calcite.esm.js",
+            type: "module"
+        },
+        {
+            src: "demos/_assets/demo-dom-swapper.js"
+        }
+    ];
+    const parseTemplate = (text) => {
+        const parser = new DOMParser();
+        const doc = parser.parseFromString(text, "text/html");
+        return doc.head.querySelector("template");
+    };
+    const loadHeader = async () => {
+        const root = window.location.pathname.split(DEMO_ROOT).shift();
+        const response = await window.fetch(`${root}${ASSETS_PATH}/demo-template.html`);
+        const text = await response.text();
+        const template = parseTemplate(text);
+        const firstChild = document.body.firstChild;
+        firstChild && document.body.insertBefore(template.content, firstChild);
+    };
+    if (window.location.pathname.includes("/demos/") && !urlParams.has(DISABLE_HEADER_URL_PARAM)) {
+        document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", loadHeader) : loadHeader();
+    }
+    const ROOT = window.location.pathname.split(DEMO_ROOT).shift();
+    function loadCss(url) {
+        const link = document.createElement("link");
+        link.rel = "stylesheet";
+        link.href = ROOT + url;
+        document.head.appendChild(link);
+    }
+    function loadScript(script) {
+        const scriptElement = document.createElement("script");
+        Object.keys(script).forEach((key) => {
+            scriptElement[key] = key === "src" ? ROOT + script[key] : script[key];
+        });
+        document.head.appendChild(scriptElement);
+    }
+    CSS.forEach(loadCss);
+    SCRIPTS.forEach(loadScript);
+})();

package/dist/collection/demos/_assets/locales.js

@@ -0,0 +1,223 @@
+const locales = [
+    { name: "Afrikaans", locale: "af" },
+    { name: "Albanian", locale: "sq" },
+    { name: "Albanian (Albania)", locale: "sq-AL" },
+    { name: "Amharic", locale: "am" },
+    { name: "Arabic", locale: "ar", dir: "rtl" },
+    { name: "Arabic (Algeria)", locale: "ar-DZ", dir: "rtl" },
+    { name: "Arabic (Bahrain)", locale: "ar-BH", dir: "rtl" },
+    { name: "Arabic (Egypt)", locale: "ar-EG", dir: "rtl" },
+    { name: "Arabic (Iraq)", locale: "ar-IQ", dir: "rtl" },
+    { name: "Arabic (Jordan)", locale: "ar-JO", dir: "rtl" },
+    { name: "Arabic (Kuwait)", locale: "ar-KW", dir: "rtl" },
+    { name: "Arabic (Lebanon)", locale: "ar-LB", dir: "rtl" },
+    { name: "Arabic (Libya)", locale: "ar-LY", dir: "rtl" },
+    { name: "Arabic (Morocco)", locale: "ar-MA", dir: "rtl" },
+    { name: "Arabic (Oman)", locale: "ar-OM", dir: "rtl" },
+    { name: "Arabic (Qatar)", locale: "ar-QA", dir: "rtl" },
+    { name: "Arabic (Saudi Arabia)", locale: "ar-SA", dir: "rtl" },
+    { name: "Arabic (Sudan)", locale: "ar-SD", dir: "rtl" },
+    { name: "Arabic (Syria)", locale: "ar-SY", dir: "rtl" },
+    { name: "Arabic (Tunisia)", locale: "ar-TN", dir: "rtl" },
+    { name: "Arabic (United Arab Emirates)", locale: "ar-AE", dir: "rtl" },
+    { name: "Arabic (Yemen)", locale: "ar-YE", dir: "rtl" },
+    { name: "Armenian (Armenia)", locale: "hy-AM" },
+    { name: "Assamese", locale: "as" },
+    { name: "Azeri (Cyrillic)", locale: "az" },
+    { name: "Azeri (Latin)", locale: "az" },
+    { name: "Basque", locale: "eu" },
+    { name: "Belarusian", locale: "be" },
+    { name: "Belarusian (Belarus)", locale: "be-BY" },
+    { name: "Bengali", locale: "bn" },
+    { name: "Bengali (Bangladesh)", locale: "bn-BD" },
+    { name: "Bengali (India)", locale: "bn-IN" },
+    { name: "Bosnian", locale: "bs" },
+    { name: "Bulgarian", locale: "bg" },
+    { name: "Bulgarian (Bulgaria)", locale: "bg-BG" },
+    { name: "Burmese", locale: "my" },
+    { name: "Catalan", locale: "ca" },
+    { name: "Catalan (Spain)", locale: "ca-ES" },
+    { name: "Chinese", locale: "zh" },
+    { name: "Chinese (China)", locale: "zh-CN" },
+    { name: "Chinese (Hong Kong)", locale: "zh-HK" },
+    { name: "Chinese (Macau SAR)", locale: "zh-MO" },
+    { name: "Chinese (Singapore)", locale: "zh-SG" },
+    { name: "Chinese (Taiwan)", locale: "zh-TW" },
+    { name: "Croatian", locale: "hr" },
+    { name: "Croatian (Croatia)", locale: "hr-HR" },
+    { name: "Czech", locale: "cs" },
+    { name: "Czech (Czech Republic)", locale: "cs-CZ" },
+    { name: "Danish", locale: "da" },
+    { name: "Danish (Denmark)", locale: "da-DK" },
+    { name: "Divehi", locale: "dv" },
+    { name: "Dutch", locale: "nl" },
+    { name: "Dutch (Belgium)", locale: "nl-BE" },
+    { name: "Dutch (Netherlands)", locale: "nl-NL" },
+    { name: "English", locale: "en" },
+    { name: "English (Australia)", locale: "en-AU" },
+    { name: "English (Belize)", locale: "en-BZ" },
+    { name: "English (Canada)", locale: "en-CA" },
+    { name: "English (Caribbean)", locale: "en-CB" },
+    { name: "English (Great Britain)", locale: "en-GB" },
+    { name: "English (India)", locale: "en-IN" },
+    { name: "English (Ireland)", locale: "en-IE" },
+    { name: "English (Jamaica)", locale: "en-JM" },
+    { name: "English (Malta)", locale: "en-MT" },
+    { name: "English (New Zealand)", locale: "en-NZ" },
+    { name: "English (Philippines)", locale: "en-PH" },
+    { name: "English (South Africa)", locale: "en-ZA" },
+    { name: "English (Singapore)", locale: "en-SG" },
+    { name: "English (Trinidad)", locale: "en-TT" },
+    { name: "English (United States)", locale: "en-US" },
+    { name: "English (South Africa)", locale: "en-ZA" },
+    { name: "Estonian", locale: "et" },
+    { name: "Estonian (Estonia)", locale: "et-EE" },
+    { name: "Faroese", locale: "fo" },
+    { name: "Farsi (Persian)", locale: "fa" },
+    { name: "Finnish", locale: "fi" },
+    { name: "Finnish (Finland)", locale: "fi-FI" },
+    { name: "French", locale: "fr" },
+    { name: "French (Belgium)", locale: "fr-BE" },
+    { name: "French (Canada)", locale: "fr-CA" },
+    { name: "French (Switzerland)", locale: "fr-CH" },
+    { name: "French (France)", locale: "fr-FR" },
+    { name: "French (Luxembourg)", locale: "fr-LU" },
+    { name: "Gaelic (Ireland)", locale: "gd-IE" },
+    { name: "Gaelic (Scotland)", locale: "gd" },
+    { name: "Galician", locale: "gl" },
+    { name: "Georgian", locale: "ka" },
+    { name: "German", locale: "de" },
+    { name: "German (Austria)", locale: "de-AT" },
+    { name: "German (Germany)", locale: "de-DE" },
+    { name: "German (Liechtenstein)", locale: "de-LI" },
+    { name: "German (Luxembourg)", locale: "de-LU" },
+    { name: "German (Switzerland)", locale: "de-CH" },
+    { name: "Greek", locale: "el" },
+    { name: "Greek (Cyprus)", locale: "el-CY" },
+    { name: "Greek (Greece)", locale: "el-GR" },
+    { name: "Guarani (Paraguay)", locale: "gu" },
+    { name: "Gujarati", locale: "gn" },
+    { name: "Hebrew", locale: "iw" },
+    { name: "Hebrew (Israel)", locale: "iw-IL" },
+    { name: "Hindi (India)", locale: "hi-IN" },
+    { name: "Hungarian", locale: "hu" },
+    { name: "Hungarian (Hungary)", locale: "hu-HU" },
+    { name: "Icelandic", locale: "is" },
+    { name: "Icelandic (Iceland)", locale: "is-IS" },
+    { name: "Indonesian (ISO 639)", locale: "in" },
+    { name: "Indonesian (Indonesia) (ISO 639)", locale: "in-ID" },
+    { name: "Indonesian (ISO 3166)", locale: "id" },
+    { name: "Indonesian (Indonesia) (ISO 3166)", locale: "id-ID" },
+    { name: "Irish", locale: "ga" },
+    { name: "Irish (Ireland)", locale: "ga-IE" },
+    { name: "Italian", locale: "it" },
+    { name: "Italian (Italy)", locale: "it-IT" },
+    { name: "Italian (Switzerland)", locale: "it-CH" },
+    { name: "Japanese", locale: "ja" },
+    { name: "Japanese (Japan)", locale: "ja-JP" },
+    { name: "Kannada", locale: "kn" },
+    { name: "Kashmiri", locale: "ks" },
+    { name: "Kazakh", locale: "kk" },
+    { name: "Khmer", locale: "km" },
+    { name: "Korean", locale: "ko" },
+    { name: "Korean (South Korea)", locale: "ko-KR" },
+    { name: "Lao", locale: "lo" },
+    { name: "Latin", locale: "la" },
+    { name: "Latvian", locale: "lv" },
+    { name: "Latvian (Latvia)", locale: "lv-LV" },
+    { name: "Lithuanian", locale: "lt" },
+    { name: "Lithuanian (Lithuania)", locale: "lt-LT" },
+    { name: "Macedonian", locale: "mk" },
+    { name: "Macedonian (Macedonia)", locale: "mk-MK" },
+    { name: "Malay", locale: "ms" },
+    { name: "Malay (Brunei)", locale: "ms-BN" },
+    { name: "Malay (Malaysia)", locale: "ms-MY" },
+    { name: "Malayalam", locale: "ml" },
+    { name: "Maltese", locale: "mt" },
+    { name: "Maltese (Malta)", locale: "mt-MT" },
+    { name: "Maori", locale: "mi" },
+    { name: "Marathi", locale: "mr" },
+    { name: "Mongolian", locale: "mn" },
+    { name: "Nepali", locale: "ne" },
+    { name: "Norwegian", locale: "no" },
+    { name: "Norwegian (Bokml)", locale: "nb" },
+    { name: "Norwegian (Norway)", locale: "no-NO" },
+    { name: "Norwegian (Norway, Nynorsk)", locale: "no-NY" },
+    { name: "Oriya", locale: "or" },
+    { name: "Polish", locale: "pl" },
+    { name: "Polish (Poland)", locale: "pl-PL" },
+    { name: "Portuguese", locale: "pt" },
+    { name: "Portuguese (Brazil)", locale: "pt-BR" },
+    { name: "Portuguese (Portugal)", locale: "pt-PT" },
+    { name: "Punjabi", locale: "pa" },
+    { name: "Raeto-Romance", locale: "rm" },
+    { name: "Romanian", locale: "ro" },
+    { name: "Romanian (Moldova)", locale: "ro-MO" },
+    { name: "Romanian (Romania)", locale: "ro-RO" },
+    { name: "Russian", locale: "ru" },
+    { name: "Russian (Moldova)", locale: "ru-MO" },
+    { name: "Russian (Russia)", locale: "ru-RU" },
+    { name: "Sanskrit", locale: "sa" },
+    { name: "Serbian", locale: "sr" },
+    { name: "Serbian (Cyrillic, Latin)", locale: "sr-SP" },
+    { name: "Serbian (Bosnia and Herzegovina)", locale: "sr-BA" },
+    { name: "Serbian (Montenegro)", locale: "sr-ME" },
+    { name: "Serbian (Serbia)", locale: "sr-RS" },
+    { name: "Serbian (Serbia and Montenegro)", locale: "sr-CS" },
+    { name: "Setsuana", locale: "tn" },
+    { name: "Sindhi", locale: "sd" },
+    { name: "Sinhala", locale: "si" },
+    { name: "Slovak", locale: "sk" },
+    { name: "Slovak (Slovakia)", locale: "sk-SK" },
+    { name: "Slovenian", locale: "sl" },
+    { name: "Slovenian (Slovenia)", locale: "sl-SI" },
+    { name: "Somali", locale: "so" },
+    { name: "Sorbian", locale: "sb" },
+    { name: "Spanish", locale: "es" },
+    { name: "Spanish (Argentina)", locale: "es-AR" },
+    { name: "Spanish (Bolivia)", locale: "es-BO" },
+    { name: "Spanish (Chile)", locale: "es-CL" },
+    { name: "Spanish (Colombia)", locale: "es-CO" },
+    { name: "Spanish (Costa Rica)", locale: "es-CR" },
+    { name: "Spanish (Dominican Republic)", locale: "es-DO" },
+    { name: "Spanish (Ecuador)", locale: "es-EC" },
+    { name: "Spanish (El Salvador)", locale: "es-SV" },
+    { name: "Spanish (Guatemala)", locale: "es-GT" },
+    { name: "Spanish (Honduras)", locale: "es-HN" },
+    { name: "Spanish (Mexico)", locale: "es-MX" },
+    { name: "Spanish (Nicaragua)", locale: "es-NI" },
+    { name: "Spanish (Panama)", locale: "es-PA" },
+    { name: "Spanish (Paraguay)", locale: "es-PY" },
+    { name: "Spanish (Peru)", locale: "es-PE" },
+    { name: "Spanish (Puerto Rico)", locale: "es-PR" },
+    { name: "Spanish (Spain)", locale: "es-ES" },
+    { name: "Spanish (United States)", locale: "es-US" },
+    { name: "Spanish (Uruguay)", locale: "es-UY" },
+    { name: "Spanish (Venezuela)", locale: "es-VE" },
+    { name: "Swahili", locale: "sw" },
+    { name: "Swedish", locale: "sv" },
+    { name: "Swedish (Finland)", locale: "sv-FI" },
+    { name: "Swedish (Sweden)", locale: "sv-SE" },
+    { name: "Tajik", locale: "tg" },
+    { name: "Tamil", locale: "ta" },
+    { name: "Tatar", locale: "tt" },
+    { name: "Telugu", locale: "te" },
+    { name: "Thai", locale: "th" },
+    { name: "Thai (Thailand)", locale: "th-TH" },
+    { name: "Thai (Thai Digits)", locale: "th-TH-u-nu-thai" },
+    { name: "Tibetan", locale: "bo" },
+    { name: "Tsonga", locale: "ts" },
+    { name: "Turkish", locale: "tr" },
+    { name: "Turkish (Turkey)", locale: "tr-TR" },
+    { name: "Turkmen", locale: "tk" },
+    { name: "Ukrainian", locale: "uk" },
+    { name: "Ukrainian (Ukraine)", locale: "uk-UA" },
+    { name: "Urdu", locale: "ur" },
+    { name: "Uzbek (Cyrillic, Latin)", locale: "uz-UZ" },
+    { name: "Vietnamese", locale: "vi" },
+    { name: "Vietnamese (Vietnam)", locale: "vi-VN" },
+    { name: "Welsh", locale: "cy" },
+    { name: "Xhosa", locale: "xh" },
+    { name: "Yiddish", locale: "yi" },
+    { name: "Zulu", locale: "zu" }
+];

package/dist/collection/utils/array.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-beta.89
+ * v1.0.0-beta.91
  */
 export function getRoundRobinIndex(index, total) {
   return (index + total) % total;

package/dist/collection/utils/conditionalSlot.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-beta.89
+ * v1.0.0-beta.91
  */
 import { forceUpdate } from "@stencil/core";
 import { createObserver } from "./observers";

package/dist/collection/utils/date.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-beta.89
+ * v1.0.0-beta.91
  */
 /**
  * Check if date is within a min and max

package/dist/collection/utils/dom.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-beta.89
+ * v1.0.0-beta.91
  */
 import { CSS_UTILITY } from "./resources";
 import { guid } from "./guid";

package/dist/collection/utils/filter.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-beta.89
+ * v1.0.0-beta.91
  */
 import { escapeRegExp, forIn } from "lodash-es";
 export const filter = (data, value) => {

package/dist/collection/utils/floating-ui.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-beta.89
+ * v1.0.0-beta.91
  */
 import { computePosition, arrow, flip, shift, hide, offset, autoPlacement, autoUpdate } from "@floating-ui/dom";
 import { getElementDir } from "./dom";

package/dist/collection/utils/form.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-beta.89
+ * v1.0.0-beta.91
  */
 import { closestElementCrossShadowBoundary } from "./dom";
 import { h } from "@stencil/core";

package/dist/collection/utils/globalAttributes.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-beta.89
+ * v1.0.0-beta.91
  */
 import { createObserver } from "./observers";
 const allowedGlobalAttributes = ["lang"];

package/dist/collection/utils/globalScript.js

@@ -0,0 +1,17 @@
+/*!
+ * 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.91
+ */
+import { initThemeChangeEvent } from "./theme";
+/**
+ * This file is imported in Stencil's `globalScript` config option.
+ *
+ * @see {@link https://stenciljs.com/docs/config#globalscript}
+ */
+export default function () {
+  if (isBrowser()) {
+    initThemeChangeEvent();
+  }
+}
+const isBrowser = new Function("try {return this===window;}catch(e){ return false;}");

package/dist/collection/utils/guid.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-beta.89
+ * v1.0.0-beta.91
  */
 function gen(counts) {
   return counts

package/dist/collection/utils/interactive.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-beta.89
+ * v1.0.0-beta.91
  */
 function noopClick() {
   /** noop */

package/dist/collection/utils/key.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-beta.89
+ * v1.0.0-beta.91
  */
 export function isActivationKey(key) {
   return key === "Enter" || key === " ";

package/dist/collection/utils/label.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-beta.89
+ * v1.0.0-beta.91
  */
 import { closestElementCrossShadowBoundary, queryElementRoots } from "./dom";
 /**

package/dist/collection/utils/locale.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-beta.89
+ * v1.0.0-beta.91
  */
 import { sanitizeDecimalString, sanitizeExponentialNumberString, isValidNumber, BigDecimal } from "./number";
 export const locales = [

package/dist/collection/utils/math.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-beta.89
+ * v1.0.0-beta.91
  */
 export const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
 export const decimalPlaces = (value) => {

package/dist/collection/utils/number.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-beta.89
+ * v1.0.0-beta.91
  */
 import { numberKeys } from "./key";
 import { createLocaleNumberFormatter, getDecimalSeparator, getMinusSign } from "./locale";

package/dist/collection/utils/observers.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-beta.89
+ * v1.0.0-beta.91
  */
 import { Build } from "@stencil/core";
 /**

package/dist/collection/utils/openCloseComponent.js

@@ -1,6 +1,49 @@
 /*!
  * 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.89
+ * v1.0.0-beta.91
  */
-export {};
+const componentToTransitionListeners = 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();
+  }
+}
+/**
+ * Helper to keep track of transition listeners on setTransitionEl and connectedCallback on OpenCloseComponent components.
+ *
+ * @param component
+ */
+export 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);
+  }
+}
+/**
+ * Helper to tear down transition listeners on disconnectedCallback on OpenCloseComponent components.
+ *
+ * @param component
+ */
+export 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);
+}

package/dist/collection/utils/popper.js

@@ -0,0 +1,121 @@
+import { createPopper as setupPopper } from "@popperjs/core";
+import { getElementDir } from "./dom";
+export const popperPlacements = [
+    "auto",
+    "auto-start",
+    "auto-end",
+    "top",
+    "top-start",
+    "top-end",
+    "bottom",
+    "bottom-start",
+    "bottom-end",
+    "right",
+    "right-start",
+    "right-end",
+    "left",
+    "left-start",
+    "left-end",
+    "leading-start",
+    "leading",
+    "leading-end",
+    "trailing-end",
+    "trailing",
+    "trailing-start",
+    "leading-leading",
+    "leading-trailing",
+    "trailing-leading",
+    "trailing-trailing",
+    "top-leading",
+    "top-trailing",
+    "bottom-leading",
+    "bottom-trailing",
+    "right-leading",
+    "right-trailing",
+    "left-leading",
+    "left-trailing"
+];
+export const popperComputedPlacements = [
+    "top",
+    "bottom",
+    "right",
+    "left",
+    "top-start",
+    "top-end",
+    "bottom-start",
+    "bottom-end",
+    "right-start",
+    "right-end",
+    "left-start",
+    "left-end"
+];
+export const defaultMenuPlacement = "bottom-leading";
+export const popperMenuPlacements = [
+    "top-start",
+    "top",
+    "top-end",
+    "bottom-start",
+    "bottom",
+    "bottom-end",
+    "top-leading",
+    "top-trailing",
+    "bottom-leading",
+    "bottom-trailing"
+];
+export const popperMenuComputedPlacements = [
+    "top-start",
+    "top",
+    "top-end",
+    "bottom-start",
+    "bottom",
+    "bottom-end"
+];
+export const CSS = {
+    animation: "calcite-popper-anim",
+    animationActive: "calcite-popper-anim--active"
+};
+export function filterComputedPlacements(placements, el) {
+    const filteredPlacements = placements.filter((placement) => popperComputedPlacements.includes(placement));
+    if (filteredPlacements.length !== placements.length) {
+        console.warn(`${el.tagName}: Invalid value found in: flipPlacements. Try any of these: ${popperComputedPlacements
+            .map((placement) => `"${placement}"`)
+            .join(", ")
+            .trim()}`, { el });
+    }
+    return filteredPlacements;
+}
+export function getPlacement(el, placement) {
+    const placements = ["left", "right"];
+    const variations = ["start", "end"];
+    if (getElementDir(el) === "rtl") {
+        placements.reverse();
+        variations.reverse();
+    }
+    return placement
+        .replace(/-leading/gi, `-${variations[0]}`)
+        .replace(/-trailing/gi, `-${variations[1]}`)
+        .replace(/leading/gi, placements[0])
+        .replace(/trailing/gi, placements[1]);
+}
+export function createPopper({ referenceEl, el, placement, overlayPositioning = "absolute", modifiers }) {
+    if (!referenceEl) {
+        return null;
+    }
+    return setupPopper(referenceEl, el, {
+        strategy: overlayPositioning,
+        placement: getPlacement(el, placement),
+        modifiers
+    });
+}
+export async function updatePopper({ el, modifiers, placement: PopperPlacement, popper }) {
+    const placement = getPlacement(el, PopperPlacement);
+    await popper.setOptions({
+        modifiers,
+        placement
+    });
+}
+export function hypotenuse(sideA, sideB) {
+    return Math.sqrt(Math.pow(sideA, 2) + Math.pow(sideB, 2));
+}
+const visiblePointerSize = 4;
+export const defaultOffsetDistance = Math.ceil(hypotenuse(visiblePointerSize, visiblePointerSize));