@esri/calcite-components 2.2.0 → 2.2.1-next.0

package/dist/cjs/ja-aa660171.js

@@ -0,0 +1,74 @@
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.2.1-next.0
+ */
+'use strict';
+
+const calciteInputTimePicker_calciteTimePicker_entry = require('./calcite-input-time-picker.calcite-time-picker-43337055.js');
+require('./index-19084ae8.js');
+require('./form-a9730f33.js');
+require('./dom-acf7cb28.js');
+require('./guid-fba2c23e.js');
+require('./resources-7ca3e472.js');
+require('./interactive-16e8111c.js');
+require('./browser-4896ef54.js');
+require('./key-557e9e54.js');
+require('./label-35ea34d1.js');
+require('./component-fe3619c4.js');
+require('./loadable-6ba66dcf.js');
+require('./locale-5e2dc881.js');
+require('./observers-524692f0.js');
+require('./focusTrapComponent-afa0badf.js');
+require('./math-63c35299.js');
+require('./t9n-4b2f24f6.js');
+require('./openCloseComponent-e5f28f27.js');
+require('./Validation-247173a2.js');
+
+// Japanese [ja]
+var locale = {
+  name: 'ja',
+  weekdays: '日曜日_月曜日_火曜日_水曜日_木曜日_金曜日_土曜日'.split('_'),
+  weekdaysShort: '日_月_火_水_木_金_土'.split('_'),
+  weekdaysMin: '日_月_火_水_木_金_土'.split('_'),
+  months: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),
+  monthsShort: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),
+  ordinal: function ordinal(n) {
+    return n + "\u65E5";
+  },
+  formats: {
+    LT: 'HH:mm',
+    LTS: 'HH:mm:ss',
+    L: 'YYYY/MM/DD',
+    LL: 'YYYY年M月D日',
+    LLL: 'YYYY年M月D日 HH:mm',
+    LLLL: 'YYYY年M月D日 dddd HH:mm',
+    l: 'YYYY/MM/DD',
+    ll: 'YYYY年M月D日',
+    lll: 'YYYY年M月D日 HH:mm',
+    llll: 'YYYY年M月D日(ddd) HH:mm'
+  },
+  meridiem: function meridiem(hour) {
+    return hour < 12 ? '午前' : '午後';
+  },
+  relativeTime: {
+    future: '%s後',
+    past: '%s前',
+    s: '数秒',
+    m: '1分',
+    mm: '%d分',
+    h: '1時間',
+    hh: '%d時間',
+    d: '1日',
+    dd: '%d日',
+    M: '1ヶ月',
+    MM: '%dヶ月',
+    y: '1年',
+    yy: '%d年'
+  }
+};
+calciteInputTimePicker_calciteTimePicker_entry.dayjs.locale(locale, null, true);
+
+exports.default = locale;
+
+//# sourceMappingURL=ja-aa660171.js.map

package/dist/cjs/ja-aa660171.js.map

@@ -0,0 +1 @@
+{"file":"ja-aa660171.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAEG,IAAC,MAAM,GAAG;AACb,EAAE,IAAI,EAAE,IAAI;AACZ,EAAE,QAAQ,EAAE,6BAA6B,CAAC,KAAK,CAAC,GAAG,CAAC;AACpD,EAAE,aAAa,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC;AAC3C,EAAE,WAAW,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC;AACzC,EAAE,MAAM,EAAE,wCAAwC,CAAC,KAAK,CAAC,GAAG,CAAC;AAC7D,EAAE,WAAW,EAAE,wCAAwC,CAAC,KAAK,CAAC,GAAG,CAAC;AAClE,EAAE,OAAO,EAAE,SAAS,OAAO,CAAC,CAAC,EAAE;AAC/B,IAAI,OAAO,CAAC,GAAG,QAAQ,CAAC;AACxB,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,EAAE,EAAE,OAAO;AACf,IAAI,GAAG,EAAE,UAAU;AACnB,IAAI,CAAC,EAAE,YAAY;AACnB,IAAI,EAAE,EAAE,WAAW;AACnB,IAAI,GAAG,EAAE,iBAAiB;AAC1B,IAAI,IAAI,EAAE,sBAAsB;AAChC,IAAI,CAAC,EAAE,YAAY;AACnB,IAAI,EAAE,EAAE,WAAW;AACnB,IAAI,GAAG,EAAE,iBAAiB;AAC1B,IAAI,IAAI,EAAE,sBAAsB;AAChC,GAAG;AACH,EAAE,QAAQ,EAAE,SAAS,QAAQ,CAAC,IAAI,EAAE;AACpC,IAAI,OAAO,IAAI,GAAG,EAAE,GAAG,IAAI,GAAG,IAAI,CAAC;AACnC,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,MAAM,EAAE,KAAK;AACjB,IAAI,IAAI,EAAE,KAAK;AACf,IAAI,CAAC,EAAE,IAAI;AACX,IAAI,CAAC,EAAE,IAAI;AACX,IAAI,EAAE,EAAE,KAAK;AACb,IAAI,CAAC,EAAE,KAAK;AACZ,IAAI,EAAE,EAAE,MAAM;AACd,IAAI,CAAC,EAAE,IAAI;AACX,IAAI,EAAE,EAAE,KAAK;AACb,IAAI,CAAC,EAAE,KAAK;AACZ,IAAI,EAAE,EAAE,MAAM;AACd,IAAI,CAAC,EAAE,IAAI;AACX,IAAI,EAAE,EAAE,KAAK;AACb,GAAG;AACH,EAAE;AACFA,oDAAK,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC;;;;","names":["dayjs"],"sources":["../../node_modules/dayjs/esm/locale/ja.js"],"sourcesContent":["// Japanese [ja]\nimport dayjs from '../index';\nvar locale = {\n  name: 'ja',\n  weekdays: '日曜日_月曜日_火曜日_水曜日_木曜日_金曜日_土曜日'.split('_'),\n  weekdaysShort: '日_月_火_水_木_金_土'.split('_'),\n  weekdaysMin: '日_月_火_水_木_金_土'.split('_'),\n  months: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),\n  monthsShort: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),\n  ordinal: function ordinal(n) {\n    return n + \"\\u65E5\";\n  },\n  formats: {\n    LT: 'HH:mm',\n    LTS: 'HH:mm:ss',\n    L: 'YYYY/MM/DD',\n    LL: 'YYYY年M月D日',\n    LLL: 'YYYY年M月D日 HH:mm',\n    LLLL: 'YYYY年M月D日 dddd HH:mm',\n    l: 'YYYY/MM/DD',\n    ll: 'YYYY年M月D日',\n    lll: 'YYYY年M月D日 HH:mm',\n    llll: 'YYYY年M月D日(ddd) HH:mm'\n  },\n  meridiem: function meridiem(hour) {\n    return hour < 12 ? '午前' : '午後';\n  },\n  relativeTime: {\n    future: '%s後',\n    past: '%s前',\n    s: '数秒',\n    m: '1分',\n    mm: '%d分',\n    h: '1時間',\n    hh: '%d時間',\n    d: '1日',\n    dd: '%d日',\n    M: '1ヶ月',\n    MM: '%dヶ月',\n    y: '1年',\n    yy: '%d年'\n  }\n};\ndayjs.locale(locale, null, true);\nexport default locale;"],"version":3}

package/dist/cjs/key-557e9e54.js

@@ -0,0 +1,16 @@
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.2.1-next.0
+ */
+'use strict';
+
+function isActivationKey(key) {
+    return key === "Enter" || key === " ";
+}
+const numberKeys = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
+
+exports.isActivationKey = isActivationKey;
+exports.numberKeys = numberKeys;
+
+//# sourceMappingURL=key-557e9e54.js.map

package/dist/cjs/key-557e9e54.js.map

@@ -0,0 +1 @@
+{"file":"key-557e9e54.js","mappings":";;;;;;;SAAgB,eAAe,CAAC,GAAW;IACzC,OAAO,GAAG,KAAK,OAAO,IAAI,GAAG,KAAK,GAAG,CAAC;AACxC,CAAC;MAEY,UAAU,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG;;;;;","names":[],"sources":["src/utils/key.ts"],"sourcesContent":["export function isActivationKey(key: string): boolean {\n  return key === \"Enter\" || key === \" \";\n}\n\nexport const numberKeys = [\"0\", \"1\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\"];\nexport const letterKeys = [\n  \"a\",\n  \"b\",\n  \"c\",\n  \"d\",\n  \"e\",\n  \"f\",\n  \"g\",\n  \"h\",\n  \"i\",\n  \"j\",\n  \"k\",\n  \"l\",\n  \"m\",\n  \"n\",\n  \"o\",\n  \"p\",\n  \"q\",\n  \"r\",\n  \"s\",\n  \"t\",\n  \"u\",\n  \"v\",\n  \"w\",\n  \"x\",\n  \"y\",\n  \"z\",\n];\n"],"version":3}

package/dist/cjs/ko-f114628d.js

@@ -0,0 +1,74 @@
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.2.1-next.0
+ */
+'use strict';
+
+const calciteInputTimePicker_calciteTimePicker_entry = require('./calcite-input-time-picker.calcite-time-picker-43337055.js');
+require('./index-19084ae8.js');
+require('./form-a9730f33.js');
+require('./dom-acf7cb28.js');
+require('./guid-fba2c23e.js');
+require('./resources-7ca3e472.js');
+require('./interactive-16e8111c.js');
+require('./browser-4896ef54.js');
+require('./key-557e9e54.js');
+require('./label-35ea34d1.js');
+require('./component-fe3619c4.js');
+require('./loadable-6ba66dcf.js');
+require('./locale-5e2dc881.js');
+require('./observers-524692f0.js');
+require('./focusTrapComponent-afa0badf.js');
+require('./math-63c35299.js');
+require('./t9n-4b2f24f6.js');
+require('./openCloseComponent-e5f28f27.js');
+require('./Validation-247173a2.js');
+
+// Korean [ko]
+var locale = {
+  name: 'ko',
+  weekdays: '일요일_월요일_화요일_수요일_목요일_금요일_토요일'.split('_'),
+  weekdaysShort: '일_월_화_수_목_금_토'.split('_'),
+  weekdaysMin: '일_월_화_수_목_금_토'.split('_'),
+  months: '1월_2월_3월_4월_5월_6월_7월_8월_9월_10월_11월_12월'.split('_'),
+  monthsShort: '1월_2월_3월_4월_5월_6월_7월_8월_9월_10월_11월_12월'.split('_'),
+  ordinal: function ordinal(n) {
+    return n + "\uC77C";
+  },
+  formats: {
+    LT: 'A h:mm',
+    LTS: 'A h:mm:ss',
+    L: 'YYYY.MM.DD.',
+    LL: 'YYYY년 MMMM D일',
+    LLL: 'YYYY년 MMMM D일 A h:mm',
+    LLLL: 'YYYY년 MMMM D일 dddd A h:mm',
+    l: 'YYYY.MM.DD.',
+    ll: 'YYYY년 MMMM D일',
+    lll: 'YYYY년 MMMM D일 A h:mm',
+    llll: 'YYYY년 MMMM D일 dddd A h:mm'
+  },
+  meridiem: function meridiem(hour) {
+    return hour < 12 ? '오전' : '오후';
+  },
+  relativeTime: {
+    future: '%s 후',
+    past: '%s 전',
+    s: '몇 초',
+    m: '1분',
+    mm: '%d분',
+    h: '한 시간',
+    hh: '%d시간',
+    d: '하루',
+    dd: '%d일',
+    M: '한 달',
+    MM: '%d달',
+    y: '일 년',
+    yy: '%d년'
+  }
+};
+calciteInputTimePicker_calciteTimePicker_entry.dayjs.locale(locale, null, true);
+
+exports.default = locale;
+
+//# sourceMappingURL=ko-f114628d.js.map

package/dist/cjs/ko-f114628d.js.map

@@ -0,0 +1 @@
+{"file":"ko-f114628d.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAEG,IAAC,MAAM,GAAG;AACb,EAAE,IAAI,EAAE,IAAI;AACZ,EAAE,QAAQ,EAAE,6BAA6B,CAAC,KAAK,CAAC,GAAG,CAAC;AACpD,EAAE,aAAa,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC;AAC3C,EAAE,WAAW,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC;AACzC,EAAE,MAAM,EAAE,wCAAwC,CAAC,KAAK,CAAC,GAAG,CAAC;AAC7D,EAAE,WAAW,EAAE,wCAAwC,CAAC,KAAK,CAAC,GAAG,CAAC;AAClE,EAAE,OAAO,EAAE,SAAS,OAAO,CAAC,CAAC,EAAE;AAC/B,IAAI,OAAO,CAAC,GAAG,QAAQ,CAAC;AACxB,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,EAAE,EAAE,QAAQ;AAChB,IAAI,GAAG,EAAE,WAAW;AACpB,IAAI,CAAC,EAAE,aAAa;AACpB,IAAI,EAAE,EAAE,eAAe;AACvB,IAAI,GAAG,EAAE,sBAAsB;AAC/B,IAAI,IAAI,EAAE,2BAA2B;AACrC,IAAI,CAAC,EAAE,aAAa;AACpB,IAAI,EAAE,EAAE,eAAe;AACvB,IAAI,GAAG,EAAE,sBAAsB;AAC/B,IAAI,IAAI,EAAE,2BAA2B;AACrC,GAAG;AACH,EAAE,QAAQ,EAAE,SAAS,QAAQ,CAAC,IAAI,EAAE;AACpC,IAAI,OAAO,IAAI,GAAG,EAAE,GAAG,IAAI,GAAG,IAAI,CAAC;AACnC,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,MAAM,EAAE,MAAM;AAClB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,CAAC,EAAE,KAAK;AACZ,IAAI,CAAC,EAAE,IAAI;AACX,IAAI,EAAE,EAAE,KAAK;AACb,IAAI,CAAC,EAAE,MAAM;AACb,IAAI,EAAE,EAAE,MAAM;AACd,IAAI,CAAC,EAAE,IAAI;AACX,IAAI,EAAE,EAAE,KAAK;AACb,IAAI,CAAC,EAAE,KAAK;AACZ,IAAI,EAAE,EAAE,KAAK;AACb,IAAI,CAAC,EAAE,KAAK;AACZ,IAAI,EAAE,EAAE,KAAK;AACb,GAAG;AACH,EAAE;AACFA,oDAAK,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC;;;;","names":["dayjs"],"sources":["../../node_modules/dayjs/esm/locale/ko.js"],"sourcesContent":["// Korean [ko]\nimport dayjs from '../index';\nvar locale = {\n  name: 'ko',\n  weekdays: '일요일_월요일_화요일_수요일_목요일_금요일_토요일'.split('_'),\n  weekdaysShort: '일_월_화_수_목_금_토'.split('_'),\n  weekdaysMin: '일_월_화_수_목_금_토'.split('_'),\n  months: '1월_2월_3월_4월_5월_6월_7월_8월_9월_10월_11월_12월'.split('_'),\n  monthsShort: '1월_2월_3월_4월_5월_6월_7월_8월_9월_10월_11월_12월'.split('_'),\n  ordinal: function ordinal(n) {\n    return n + \"\\uC77C\";\n  },\n  formats: {\n    LT: 'A h:mm',\n    LTS: 'A h:mm:ss',\n    L: 'YYYY.MM.DD.',\n    LL: 'YYYY년 MMMM D일',\n    LLL: 'YYYY년 MMMM D일 A h:mm',\n    LLLL: 'YYYY년 MMMM D일 dddd A h:mm',\n    l: 'YYYY.MM.DD.',\n    ll: 'YYYY년 MMMM D일',\n    lll: 'YYYY년 MMMM D일 A h:mm',\n    llll: 'YYYY년 MMMM D일 dddd A h:mm'\n  },\n  meridiem: function meridiem(hour) {\n    return hour < 12 ? '오전' : '오후';\n  },\n  relativeTime: {\n    future: '%s 후',\n    past: '%s 전',\n    s: '몇 초',\n    m: '1분',\n    mm: '%d분',\n    h: '한 시간',\n    hh: '%d시간',\n    d: '하루',\n    dd: '%d일',\n    M: '한 달',\n    MM: '%d달',\n    y: '일 년',\n    yy: '%d년'\n  }\n};\ndayjs.locale(locale, null, true);\nexport default locale;"],"version":3}

package/dist/cjs/label-35ea34d1.js

@@ -0,0 +1,183 @@
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.2.1-next.0
+ */
+'use strict';
+
+const dom = require('./dom-acf7cb28.js');
+const component = require('./component-fe3619c4.js');
+
+/**
+ * Exported for testing purposes only
+ *
+ * @internal
+ */
+const labelClickEvent = "calciteInternalLabelClick";
+const labelConnectedEvent = "calciteInternalLabelConnected";
+const labelDisconnectedEvent = "calciteInternalLabelDisconnected";
+const labelTagName = "calcite-label";
+const labelToLabelables = new WeakMap();
+const onLabelClickMap = new WeakMap();
+const onLabelConnectedMap = new WeakMap();
+const onLabelDisconnectedMap = new WeakMap();
+const unlabeledComponents = new Set();
+const findLabelForComponent = (componentEl) => {
+    const { id } = componentEl;
+    const forLabel = id && dom.queryElementRoots(componentEl, { selector: `${labelTagName}[for="${id}"]` });
+    if (forLabel) {
+        return forLabel;
+    }
+    const parentLabel = dom.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;
+}
+/**
+ * Helper to set up label interactions on connectedCallback.
+ *
+ * @param component
+ */
+function connectLabel(component) {
+    if (!component) {
+        return;
+    }
+    const labelEl = findLabelForComponent(component.el);
+    if ((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));
+    }
+}
+/**
+ * Helper to tear down label interactions on disconnectedCallback on labelable components.
+ *
+ * @param 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 = null;
+}
+function sortByDOMOrder(a, b) {
+    return dom.isBefore(a.el, b.el) ? -1 : 1;
+}
+/**
+ * Helper to get the label text from a component.
+ *
+ * @param component
+ */
+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 = labelables.includes(clickedLabelable);
+    if (labelableChildClicked) {
+        // no need to forward click as labelable will receive focus
+        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);
+}
+/**
+ * Helper to associate an explicit label (i.e., using `for`) with a labelable component that does not have an associated label.
+ *
+ * @param label - the label element
+ */
+async function associateExplicitLabelToUnlabeledComponent(label) {
+    await component.componentOnReady(label);
+    const alreadyLabeled = labelToLabelables.has(label);
+    if (alreadyLabeled) {
+        return;
+    }
+    const forComponentEl = label.ownerDocument?.getElementById(label.for);
+    if (!forComponentEl) {
+        return;
+    }
+    requestAnimationFrame(() => {
+        for (const labelable of unlabeledComponents) {
+            if (labelable.el === forComponentEl) {
+                connectLabel(labelable);
+                break;
+            }
+        }
+    });
+}
+
+exports.associateExplicitLabelToUnlabeledComponent = associateExplicitLabelToUnlabeledComponent;
+exports.connectLabel = connectLabel;
+exports.disconnectLabel = disconnectLabel;
+exports.getLabelText = getLabelText;
+exports.labelConnectedEvent = labelConnectedEvent;
+exports.labelDisconnectedEvent = labelDisconnectedEvent;
+
+//# sourceMappingURL=label-35ea34d1.js.map

package/dist/cjs/label-35ea34d1.js.map

@@ -0,0 +1 @@
+{"file":"label-35ea34d1.js","mappings":"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","names":["queryElementRoots","closestElementCrossShadowBoundary","isBefore","componentOnReady"],"sources":["src/utils/label.ts"],"sourcesContent":["import { closestElementCrossShadowBoundary, isBefore, queryElementRoots } from \"./dom\";\nimport { componentOnReady } from \"./component\";\n\nexport interface LabelableComponent {\n  /**\n   * When true, disabled prevents interaction.\n   */\n  disabled: boolean;\n\n  /**\n   * The host element.\n   */\n  readonly el: HTMLElement;\n\n  /**\n   * Text label.\n   */\n  label?: string;\n\n  /**\n   * The label this component is associated with.\n   */\n  labelEl: HTMLCalciteLabelElement;\n\n  /**\n   * Hook for components to provide custom label click behavior.\n   */\n  onLabelClick: (event: CustomEvent<any>) => void;\n}\n\n/**\n * Exported for testing purposes only\n *\n * @internal\n */\nexport const labelClickEvent = \"calciteInternalLabelClick\";\nexport const labelConnectedEvent = \"calciteInternalLabelConnected\";\nexport const labelDisconnectedEvent = \"calciteInternalLabelDisconnected\";\n\nconst labelTagName = \"calcite-label\";\nconst labelToLabelables = new WeakMap<HTMLCalciteLabelElement, LabelableComponent[]>();\nconst onLabelClickMap = new WeakMap<HTMLCalciteLabelElement, typeof onLabelClick>();\nconst onLabelConnectedMap = new WeakMap<LabelableComponent, typeof onLabelConnected>();\nconst onLabelDisconnectedMap = new WeakMap<LabelableComponent, typeof onLabelDisconnected>();\nconst unlabeledComponents = new Set<LabelableComponent>();\n\nconst findLabelForComponent = (componentEl: HTMLElement): HTMLCalciteLabelElement | null => {\n  const { id } = componentEl;\n\n  const forLabel =\n    id && (queryElementRoots(componentEl, { selector: `${labelTagName}[for=\"${id}\"]` }) as HTMLCalciteLabelElement);\n\n  if (forLabel) {\n    return forLabel;\n  }\n\n  const parentLabel = closestElementCrossShadowBoundary<HTMLCalciteLabelElement>(componentEl, labelTagName);\n\n  if (\n    !parentLabel ||\n    // labelable components within other custom elements are not considered labelable\n    hasAncestorCustomElements(parentLabel, componentEl)\n  ) {\n    return null;\n  }\n\n  return parentLabel;\n};\n\nfunction hasAncestorCustomElements(label: HTMLCalciteLabelElement, componentEl: HTMLElement): boolean {\n  let traversedElements: HTMLElement[];\n  const customElementAncestorCheckEventType = \"custom-element-ancestor-check\";\n\n  const listener = (event: CustomEvent) => {\n    event.stopImmediatePropagation();\n    const composedPath = event.composedPath() as HTMLElement[];\n    traversedElements = composedPath.slice(composedPath.indexOf(componentEl), composedPath.indexOf(label));\n  };\n\n  label.addEventListener(customElementAncestorCheckEventType, listener, { once: true });\n\n  componentEl.dispatchEvent(new CustomEvent(customElementAncestorCheckEventType, { composed: true, bubbles: true }));\n  label.removeEventListener(customElementAncestorCheckEventType, listener);\n\n  const ancestorCustomElements = traversedElements\n    .filter((el) => el !== componentEl && el !== label)\n    .filter((el) => el.tagName?.includes(\"-\"));\n\n  return ancestorCustomElements.length > 0;\n}\n\n/**\n * Helper to set up label interactions on connectedCallback.\n *\n * @param component\n */\nexport function connectLabel(component: LabelableComponent): void {\n  if (!component) {\n    return;\n  }\n\n  const labelEl = findLabelForComponent(component.el);\n\n  if (\n    (onLabelClickMap.has(labelEl) && labelEl === component.labelEl) ||\n    (!labelEl && unlabeledComponents.has(component))\n  ) {\n    return;\n  }\n\n  const boundOnLabelDisconnected = onLabelDisconnected.bind(component);\n\n  if (labelEl) {\n    component.labelEl = labelEl;\n\n    const labelables = labelToLabelables.get(labelEl) || [];\n    labelables.push(component);\n    labelToLabelables.set(labelEl, labelables.sort(sortByDOMOrder));\n\n    if (!onLabelClickMap.has(component.labelEl)) {\n      onLabelClickMap.set(component.labelEl, onLabelClick);\n      component.labelEl.addEventListener(labelClickEvent, onLabelClick);\n    }\n\n    unlabeledComponents.delete(component);\n    document.removeEventListener(labelConnectedEvent, onLabelConnectedMap.get(component));\n    onLabelDisconnectedMap.set(component, boundOnLabelDisconnected);\n    document.addEventListener(labelDisconnectedEvent, boundOnLabelDisconnected);\n  } else if (!unlabeledComponents.has(component)) {\n    boundOnLabelDisconnected();\n    document.removeEventListener(labelDisconnectedEvent, onLabelDisconnectedMap.get(component));\n  }\n}\n/**\n * Helper to tear down label interactions on disconnectedCallback on labelable components.\n *\n * @param component\n */\nexport function disconnectLabel(component: LabelableComponent): void {\n  if (!component) {\n    return;\n  }\n\n  unlabeledComponents.delete(component);\n  document.removeEventListener(labelConnectedEvent, onLabelConnectedMap.get(component));\n  document.removeEventListener(labelDisconnectedEvent, onLabelDisconnectedMap.get(component));\n  onLabelConnectedMap.delete(component);\n  onLabelDisconnectedMap.delete(component);\n\n  if (!component.labelEl) {\n    return;\n  }\n\n  const labelables = labelToLabelables.get(component.labelEl);\n\n  if (labelables.length === 1) {\n    component.labelEl.removeEventListener(labelClickEvent, onLabelClickMap.get(component.labelEl));\n    onLabelClickMap.delete(component.labelEl);\n  }\n\n  labelToLabelables.set(\n    component.labelEl,\n    labelables.filter((labelable) => labelable !== component).sort(sortByDOMOrder),\n  );\n\n  component.labelEl = null;\n}\n\nfunction sortByDOMOrder(a: LabelableComponent, b: LabelableComponent): number {\n  return isBefore(a.el, b.el) ? -1 : 1;\n}\n\n/**\n * Helper to get the label text from a component.\n *\n * @param component\n */\nexport function getLabelText(component: LabelableComponent): string {\n  return component.label || component.labelEl?.textContent?.trim() || \"\";\n}\n\nfunction onLabelClick(this: HTMLCalciteLabelElement, event: CustomEvent<{ sourceEvent: MouseEvent }>): void {\n  const labelClickTarget = event.detail.sourceEvent.target as HTMLElement;\n  const labelables = labelToLabelables.get(this);\n  const clickedLabelable = labelables.find((labelable) => labelable.el === labelClickTarget);\n  const labelableChildClicked = labelables.includes(clickedLabelable);\n\n  if (labelableChildClicked) {\n    // no need to forward click as labelable will receive focus\n    return;\n  }\n\n  const firstLabelable = labelables[0];\n\n  if (firstLabelable.disabled) {\n    return;\n  }\n\n  firstLabelable.onLabelClick(event);\n}\n\nfunction onLabelConnected(this: LabelableComponent): void {\n  if (unlabeledComponents.has(this)) {\n    connectLabel(this);\n  }\n}\n\nfunction onLabelDisconnected(this: LabelableComponent): void {\n  unlabeledComponents.add(this);\n  const boundOnLabelConnected = onLabelConnectedMap.get(this) || onLabelConnected.bind(this);\n  onLabelConnectedMap.set(this, boundOnLabelConnected);\n  document.addEventListener(labelConnectedEvent, boundOnLabelConnected);\n}\n\n/**\n * Helper to associate an explicit label (i.e., using `for`) with a labelable component that does not have an associated label.\n *\n * @param label - the label element\n */\nexport async function associateExplicitLabelToUnlabeledComponent(label: HTMLCalciteLabelElement): Promise<void> {\n  await componentOnReady(label);\n\n  const alreadyLabeled = labelToLabelables.has(label);\n\n  if (alreadyLabeled) {\n    return;\n  }\n\n  const forComponentEl = label.ownerDocument?.getElementById(label.for);\n\n  if (!forComponentEl) {\n    return;\n  }\n\n  requestAnimationFrame(() => {\n    for (const labelable of unlabeledComponents) {\n      if (labelable.el === forComponentEl) {\n        connectLabel(labelable);\n        break;\n      }\n    }\n  });\n}\n"],"version":3}

package/dist/cjs/loadable-6ba66dcf.js

@@ -0,0 +1,91 @@
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.2.1-next.0
+ */
+'use strict';
+
+const index = require('./index-19084ae8.js');
+
+const resolveMap = new WeakMap();
+const promiseMap = new WeakMap();
+/**
+ * This helper util sets up the component for the ability to know when the component has been loaded.
+ *
+ * This should be used in the `componentWillLoad` lifecycle hook.
+ *
+ * ```
+ * componentWillLoad(): void {
+ *   setUpLoadableComponent(this);
+ * }
+ * ```
+ *
+ * @param component
+ */
+function setUpLoadableComponent(component) {
+    promiseMap.set(component, new Promise((resolve) => resolveMap.set(component, resolve)));
+}
+/**
+ * This helper util lets the loadable component know that it is now loaded.
+ *
+ * This should be used in the `componentDidLoad` lifecycle hook.
+ *
+ * ```
+ * componentDidLoad(): void {
+ *   setComponentLoaded(this);
+ * }
+ * ```
+ *
+ * @param component
+ */
+function setComponentLoaded(component) {
+    resolveMap.get(component)();
+}
+/**
+ * This helper util can be used to ensure a component has been loaded (The "componentDidLoad" Stencil lifecycle method has been called).
+ *
+ * Requires requires `LoadableComponent` to be implemented.
+ *
+ * A component developer can await this method before proceeding with any logic that requires a component to be loaded first.
+ *
+ * ```
+ * async myMethod(): Promise<void> {
+ *   await componentLoaded(this);
+ * }
+ * ```
+ *
+ * @param component
+ * @returns Promise<void>
+ */
+function componentLoaded(component) {
+    return promiseMap.get(component);
+}
+/**
+ * This helper util can be used to ensuring the component is loaded and rendered by the browser (The "componentDidLoad" Stencil lifecycle method has been called and any internal elements are focusable).
+ *
+ * Requires requires `LoadableComponent` to be implemented.
+ *
+ * A component developer can await this method before proceeding with any logic that requires a component to be loaded first and then an internal element be focused.
+ *
+ * ```
+ * async setFocus(): Promise<void> {
+ *   await componentFocusable(this);
+ *   this.internalElement?.focus();
+ * }
+ * ```
+ *
+ * @param component
+ * @returns Promise<void>
+ */
+async function componentFocusable(component) {
+    await componentLoaded(component);
+    index.forceUpdate(component);
+    return new Promise((resolve) => requestAnimationFrame(() => resolve()));
+}
+
+exports.componentFocusable = componentFocusable;
+exports.componentLoaded = componentLoaded;
+exports.setComponentLoaded = setComponentLoaded;
+exports.setUpLoadableComponent = setUpLoadableComponent;
+
+//# sourceMappingURL=loadable-6ba66dcf.js.map

package/dist/cjs/loadable-6ba66dcf.js.map

@@ -0,0 +1 @@
+{"file":"loadable-6ba66dcf.js","mappings":";;;;;;;;;AA0DA,MAAM,UAAU,GAAG,IAAI,OAAO,EAAgE,CAAC;AAE/F,MAAM,UAAU,GAAG,IAAI,OAAO,EAAoC,CAAC;AAEnE;;;;;;;;;;;;;SAagB,sBAAsB,CAAC,SAA4B;IACjE,UAAU,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,OAAO,CAAC,CAAC,OAAO,KAAK,UAAU,CAAC,GAAG,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;AAC1F,CAAC;AAED;;;;;;;;;;;;;SAagB,kBAAkB,CAAC,SAA4B;IAC7D,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC;AAC9B,CAAC;AAED;;;;;;;;;;;;;;;;SAgBgB,eAAe,CAAC,SAA4B;IAC1D,OAAO,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;AACnC,CAAC;AAED;;;;;;;;;;;;;;;;;AAiBO,eAAe,kBAAkB,CAAC,SAA4B;IACnE,MAAM,eAAe,CAAC,SAAS,CAAC,CAAC;IAMjCA,iBAAW,CAAC,SAAS,CAAC,CAAC;IACvB,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,KAAK,qBAAqB,CAAC,MAAM,OAAO,EAAE,CAAC,CAAC,CAAC;AAC1E;;;;;;;","names":["forceUpdate"],"sources":["src/utils/loadable.ts"],"sourcesContent":["import { Build, forceUpdate } from \"@stencil/core\";\n\n/**\n * This helper adds support for knowing when a component has been loaded.\n *\n * Related issue: https://github.com/Esri/calcite-design-system/issues/5369\n * Could be related to Stencil.js issue: https://github.com/ionic-team/stencil/issues/3580\n *\n * Implementing\n *\n * ```\n * export class MyComponent implements LoadableComponent { }\n * ```\n *\n * ```\n *  //--------------------------------------------------------------------------\n *  //\n *  //  Lifecycle\n *  //\n *  //--------------------------------------------------------------------------\n *\n *  componentWillLoad(): void {\n *    setUpLoadableComponent(this);\n *  }\n *\n *  componentDidLoad(): void {\n *    setComponentLoaded(this);\n *  }\n *\n *  // --------------------------------------------------------------------------\n *  //\n *  //  Methods\n *  //\n *  // --------------------------------------------------------------------------\n *\n *  async myMethod(): Promise<void> {\n *    await componentLoaded(this);\n *  }\n * ```\n */\nexport interface LoadableComponent {\n  /**\n   * Stencil lifecycle method.\n   * https://stenciljs.com/docs/component-lifecycle#componentwillload\n   *\n   * Called once just after the component is first connected to the DOM. Since this method is only called once, it's a good place to load data asynchronously and to setup the state without triggering extra re-renders.\n   */\n  componentWillLoad: () => Promise<void> | void;\n\n  /**\n   * Stencil lifecycle method.\n   * https://stenciljs.com/docs/component-lifecycle#componentdidload\n   *\n   * Called once just after the component is fully loaded and the first render() occurs.\n   */\n  componentDidLoad: () => Promise<void> | void;\n}\n\nconst resolveMap = new WeakMap<LoadableComponent, (value: void | PromiseLike<void>) => void>();\n\nconst promiseMap = new WeakMap<LoadableComponent, Promise<void>>();\n\n/**\n * This helper util sets up the component for the ability to know when the component has been loaded.\n *\n * This should be used in the `componentWillLoad` lifecycle hook.\n *\n * ```\n * componentWillLoad(): void {\n *   setUpLoadableComponent(this);\n * }\n * ```\n *\n * @param component\n */\nexport function setUpLoadableComponent(component: LoadableComponent): void {\n  promiseMap.set(component, new Promise((resolve) => resolveMap.set(component, resolve)));\n}\n\n/**\n * This helper util lets the loadable component know that it is now loaded.\n *\n * This should be used in the `componentDidLoad` lifecycle hook.\n *\n * ```\n * componentDidLoad(): void {\n *   setComponentLoaded(this);\n * }\n * ```\n *\n * @param component\n */\nexport function setComponentLoaded(component: LoadableComponent): void {\n  resolveMap.get(component)();\n}\n\n/**\n * This helper util can be used to ensure a component has been loaded (The \"componentDidLoad\" Stencil lifecycle method has been called).\n *\n * Requires requires `LoadableComponent` to be implemented.\n *\n * A component developer can await this method before proceeding with any logic that requires a component to be loaded first.\n *\n * ```\n * async myMethod(): Promise<void> {\n *   await componentLoaded(this);\n * }\n * ```\n *\n * @param component\n * @returns Promise<void>\n */\nexport function componentLoaded(component: LoadableComponent): Promise<void> {\n  return promiseMap.get(component);\n}\n\n/**\n * This helper util can be used to ensuring the component is loaded and rendered by the browser (The \"componentDidLoad\" Stencil lifecycle method has been called and any internal elements are focusable).\n *\n * Requires requires `LoadableComponent` to be implemented.\n *\n * A component developer can await this method before proceeding with any logic that requires a component to be loaded first and then an internal element be focused.\n *\n * ```\n * async setFocus(): Promise<void> {\n *   await componentFocusable(this);\n *   this.internalElement?.focus();\n * }\n * ```\n *\n * @param component\n * @returns Promise<void>\n */\nexport async function componentFocusable(component: LoadableComponent): Promise<void> {\n  await componentLoaded(component);\n\n  if (!Build.isBrowser) {\n    return;\n  }\n\n  forceUpdate(component);\n  return new Promise((resolve) => requestAnimationFrame(() => resolve()));\n}\n"],"version":3}