@esri/calcite-components 1.0.0-next.435 → 1.0.0-next.438

package/dist/custom-elements/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.435
+ * v1.0.0-next.438
  */
 import { HTMLElement as HTMLElement$1, createEvent, h, Host, Build, forceUpdate, Fragment, getAssetPath, proxyCustomElement } from '@stencil/core/internal/client';
 export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
@@ -5871,7 +5871,6 @@ models.forEach(fromModel => {
 });
 var colorConvert = convert;
 
-const _slice = [].slice;
 const skippedModels = [// To be honest, I don't really feel like keyword belongs in color convert, but eh.
 'keyword', // Gray conflicts with some method names, and has its own method defined.
 'gray', // Shouldn't really be in color-convert either...
@@ -5879,7 +5878,7 @@ const skippedModels = [// To be honest, I don't really feel like keyword belongs
 const hashedModelKeys = {};
 
 for (const model of Object.keys(colorConvert)) {
-  hashedModelKeys[_slice.call(colorConvert[model].labels).sort().join('')] = model;
+  hashedModelKeys[[...colorConvert[model].labels].sort().join('')] = model;
 }
 
 const limiters = {};
@@ -5907,7 +5906,7 @@ function Color(object, model) {
     this.valpha = 1;
   } else if (object instanceof Color) {
     this.model = object.model;
-    this.color = object.color.slice();
+    this.color = [...object.color];
     this.valpha = object.valpha;
   } else if (typeof object === 'string') {
     const result = colorString.get(object);
@@ -5923,9 +5922,7 @@ function Color(object, model) {
   } else if (object.length > 0) {
     this.model = model || 'rgb';
     channels = colorConvert[this.model].channels;
-
-    const newArray = _slice.call(object, 0, channels);
-
+    const newArray = Array.prototype.slice.call(object, 0, channels);
     this.color = zeroArray(newArray, channels);
     this.valpha = typeof object[channels] === 'number' ? object[channels] : 1;
   } else if (typeof object === 'number') {
@@ -5949,7 +5946,9 @@ function Color(object, model) {
     }
 
     this.model = hashedModelKeys[hashedKeys];
-    const labels = colorConvert[this.model].labels;
+    const {
+      labels
+    } = colorConvert[this.model];
     const color = [];
 
     for (i = 0; i < labels.length; i++) {
@@ -5991,24 +5990,28 @@ Color.prototype = {
   string(places) {
     let self = this.model in colorString.to ? this : this.rgb();
     self = self.round(typeof places === 'number' ? places : 1);
-    const args = self.valpha === 1 ? self.color : self.color.concat(this.valpha);
+    const args = self.valpha === 1 ? self.color : [...self.color, this.valpha];
     return colorString.to[self.model](args);
   },
 
   percentString(places) {
     const self = this.rgb().round(typeof places === 'number' ? places : 1);
-    const args = self.valpha === 1 ? self.color : self.color.concat(this.valpha);
+    const args = self.valpha === 1 ? self.color : [...self.color, this.valpha];
     return colorString.to.rgb.percent(args);
   },
 
   array() {
-    return this.valpha === 1 ? this.color.slice() : this.color.concat(this.valpha);
+    return this.valpha === 1 ? [...this.color] : [...this.color, this.valpha];
   },
 
   object() {
     const result = {};
-    const channels = colorConvert[this.model].channels;
-    const labels = colorConvert[this.model].labels;
+    const {
+      channels
+    } = colorConvert[this.model];
+    const {
+      labels
+    } = colorConvert[this.model];
 
     for (let i = 0; i < channels; i++) {
       result[labels[i]] = this.color[i];
@@ -6049,12 +6052,12 @@ Color.prototype = {
 
   round(places) {
     places = Math.max(places || 0, 0);
-    return new Color(this.color.map(roundToPlace(places)).concat(this.valpha), this.model);
+    return new Color([...this.color.map(roundToPlace(places)), this.valpha], this.model);
   },
 
   alpha(value) {
-    if (arguments.length > 0) {
-      return new Color(this.color.concat(Math.max(0, Math.min(1, value))), this.model);
+    if (value !== undefined) {
+      return new Color([...this.color, Math.max(0, Math.min(1, value))], this.model);
     }
 
     return this.valpha;
@@ -6077,15 +6080,15 @@ Color.prototype = {
   magenta: getset('cmyk', 1, maxfn(100)),
   yellow: getset('cmyk', 2, maxfn(100)),
   black: getset('cmyk', 3, maxfn(100)),
-  x: getset('xyz', 0, maxfn(100)),
+  x: getset('xyz', 0, maxfn(95.047)),
   y: getset('xyz', 1, maxfn(100)),
-  z: getset('xyz', 2, maxfn(100)),
+  z: getset('xyz', 2, maxfn(108.833)),
   l: getset('lab', 0, maxfn(100)),
   a: getset('lab', 1),
   b: getset('lab', 2),
 
   keyword(value) {
-    if (arguments.length > 0) {
+    if (value !== undefined) {
       return new Color(value);
     }
 
@@ -6093,7 +6096,7 @@ Color.prototype = {
   },
 
   hex(value) {
-    if (arguments.length > 0) {
+    if (value !== undefined) {
       return new Color(value);
     }
 
@@ -6101,7 +6104,7 @@ Color.prototype = {
   },
 
   hexa(value) {
-    if (arguments.length > 0) {
+    if (value !== undefined) {
       return new Color(value);
     }
 
@@ -6127,7 +6130,7 @@ Color.prototype = {
 
     for (const [i, element] of rgb.entries()) {
       const chan = element / 255;
-      lum[i] = chan <= 0.03928 ? chan / 12.92 : ((chan + 0.055) / 1.055) ** 2.4;
+      lum[i] = chan <= 0.04045 ? chan / 12.92 : ((chan + 0.055) / 1.055) ** 2.4;
     }
 
     return 0.2126 * lum[0] + 0.7152 * lum[1] + 0.0722 * lum[2];
@@ -6146,9 +6149,10 @@ Color.prototype = {
   },
 
   level(color2) {
+    // https://www.w3.org/TR/WCAG/#contrast-enhanced
     const contrastRatio = this.contrast(color2);
 
-    if (contrastRatio >= 7.1) {
+    if (contrastRatio >= 7) {
       return 'AAA';
     }
 
@@ -6158,7 +6162,7 @@ Color.prototype = {
   isDark() {
     // YIQ equation from http://24ways.org/2010/calculating-color-contrast
     const rgb = this.rgb().color;
-    const yiq = (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000;
+    const yiq = (rgb[0] * 2126 + rgb[1] * 7152 + rgb[2] * 722) / 10000;
     return yiq < 128;
   },
 
@@ -6260,25 +6264,28 @@ for (const model of Object.keys(colorConvert)) {
     continue;
   }
 
-  const channels = colorConvert[model].channels; // Conversion methods
+  const {
+    channels
+  } = colorConvert[model]; // Conversion methods
 
-  Color.prototype[model] = function () {
+  Color.prototype[model] = function (...args) {
     if (this.model === model) {
       return new Color(this);
     }
 
-    if (arguments.length > 0) {
-      return new Color(arguments, model);
+    if (args.length > 0) {
+      return new Color(args, model);
     }
 
-    const newAlpha = typeof arguments[channels] === 'number' ? channels : this.valpha;
-    return new Color(assertArray(colorConvert[this.model][model].raw(this.color)).concat(newAlpha), model);
+    return new Color([...assertArray(colorConvert[this.model][model].raw(this.color)), this.valpha], model);
   }; // 'static' construction methods
 
 
-  Color[model] = function (color) {
+  Color[model] = function (...args) {
+    let color = args[0];
+
     if (typeof color === 'number') {
-      color = zeroArray(_slice.call(arguments), channels);
+      color = zeroArray(args, channels);
     }
 
     return new Color(color, model);
@@ -6306,7 +6313,7 @@ function getset(model, channel, modifier) {
   return function (value) {
     let result;
 
-    if (arguments.length > 0) {
+    if (value !== undefined) {
       if (modifier) {
         value = modifier(value);
       }
@@ -6861,9 +6868,12 @@ const ColorPicker = class extends HTMLElement$1 {
       const channelAriaLabels = isRgb
         ? [intlRed, intlGreen, intlBlue]
         : [intlHue, intlSaturation, intlValue];
-      return (h("calcite-tab", { active: active, class: CSS$G.control, key: channelMode }, h("div", { class: CSS$G.channels }, channels.map((channel, index) => this.renderChannel(channel, index, channelLabels[index], channelAriaLabels[index])))));
+      const direction = getElementDir(this.el);
+      return (h("calcite-tab", { active: active, class: CSS$G.control, key: channelMode }, h("div", { class: CSS$G.channels, dir: "ltr" }, channels.map((channel, index) => 
+      /* the channel container is ltr, so we apply the host's direction */
+      this.renderChannel(channel, index, channelLabels[index], channelAriaLabels[index], direction)))));
     };
-    this.renderChannel = (value, index, label, ariaLabel) => (h("calcite-input", { class: CSS$G.channel, "data-channel-index": index, label: ariaLabel, numberButtonType: "none", onCalciteInputChange: this.handleChannelChange, onCalciteInputInput: this.handleChannelInput, prefixText: label, scale: this.scale === "l" ? "m" : "s", type: "number", value: value === null || value === void 0 ? void 0 : value.toString() }));
+    this.renderChannel = (value, index, label, ariaLabel, direction) => (h("calcite-input", { class: CSS$G.channel, "data-channel-index": index, dir: direction, label: ariaLabel, numberButtonType: "none", onCalciteInputChange: this.handleChannelChange, onCalciteInputInput: this.handleChannelInput, prefixText: label, scale: this.scale === "l" ? "m" : "s", type: "number", value: value === null || value === void 0 ? void 0 : value.toString() }));
     this.deleteColor = () => {
       const colorToDelete = this.color.hex();
       const inStorage = this.savedColors.indexOf(colorToDelete) > -1;
@@ -6918,14 +6928,10 @@ const ColorPicker = class extends HTMLElement$1 {
     this.drawColorFieldAndSlider();
     this.updateChannelsFromColor(color);
     this.previousColor = oldColor;
-    if (this.internalColorUpdateContext) {
-      return;
-    }
-    this.value = this.toValue(color);
   }
   handleFormatChange(format) {
     this.setMode(format);
-    this.value = this.toValue(this.color);
+    this.internalColorSet(this.color, false);
   }
   handleScaleChange(scale = "m") {
     this.updateDimensions(scale);
@@ -6945,10 +6951,10 @@ const ColorPicker = class extends HTMLElement$1 {
       this.setMode(nextMode);
     }
     const dragging = this.sliderThumbState === "drag" || this.hueThumbState === "drag";
-    if (this.internalColorUpdateContext) {
-      if (this.internalColorUpdateContext === "initial") {
-        return;
-      }
+    if (this.internalColorUpdateContext === "initial") {
+      return;
+    }
+    if (this.internalColorUpdateContext === "internal") {
       this.calciteColorPickerInput.emit();
       if (!dragging) {
         this.calciteColorPickerChange.emit();
@@ -6958,11 +6964,7 @@ const ColorPicker = class extends HTMLElement$1 {
     const color$1 = allowEmpty && !value ? null : color(value);
     const colorChanged = !colorEqual(color$1, this.color);
     if (modeChanged || colorChanged) {
-      this.color = color$1;
-      this.calciteColorPickerInput.emit();
-      if (!dragging) {
-        this.calciteColorPickerChange.emit();
-      }
+      this.internalColorSet(color$1);
     }
   }
   //--------------------------------------------------------------------------
@@ -7299,32 +7301,13 @@ const ColorPickerHexInput = class extends HTMLElement$1 {
           : this.formatForInternalInput(rgbToHex(this.internalColor.object()));
     };
     this.onInputChange = () => {
-      const inputValue = this.inputNode.value;
-      let value;
-      if (inputValue) {
-        const hex = inputValue;
-        const color = hexToRGB(`#${hex}`);
-        if (!color) {
-          return;
-        }
-        value = normalizeHex(hex);
-      }
-      else if (this.allowEmpty) {
-        value = null;
-      }
-      this.value = value;
-      this.calciteColorPickerHexInputChange.emit();
+      this.internalSetValue(this.inputNode.value, this.value);
     };
     /**
      * The last valid/selected color. Used as a fallback if an invalid hex code is entered.
      */
     this.internalColor = DEFAULT_COLOR;
     this.previousNonNullValue = this.value;
-    //--------------------------------------------------------------------------
-    //
-    //  Private Methods
-    //
-    //--------------------------------------------------------------------------
     this.storeInputRef = (node) => {
       this.inputNode = node;
     };
@@ -7339,38 +7322,16 @@ const ColorPickerHexInput = class extends HTMLElement$1 {
     if (value) {
       const normalized = normalizeHex(value);
       if (isValidHex(normalized)) {
-        this.internalColor = color(normalized);
-        this.value = normalized;
+        this.internalSetValue(normalized, normalized, false);
       }
       return;
     }
     if (allowEmpty) {
-      this.internalColor = null;
-      this.value = null;
+      this.internalSetValue(null, null, false);
     }
   }
   handleValueChange(value, oldValue) {
-    if (value) {
-      const normalized = normalizeHex(value);
-      if (isValidHex(normalized)) {
-        const { internalColor } = this;
-        const changed = !internalColor || normalized !== normalizeHex(internalColor.hex());
-        this.internalColor = color(normalized);
-        this.previousNonNullValue = normalized;
-        this.value = normalized;
-        if (changed) {
-          this.calciteColorPickerHexInputChange.emit();
-        }
-        return;
-      }
-    }
-    else if (this.allowEmpty) {
-      this.internalColor = null;
-      this.value = null;
-      this.calciteColorPickerHexInputChange.emit();
-      return;
-    }
-    this.value = oldValue;
+    this.internalSetValue(value, oldValue, false);
   }
   // using @Listen as a workaround for VDOM listener not firing
   onInputKeyDown(event) {
@@ -7382,15 +7343,16 @@ const ColorPickerHexInput = class extends HTMLElement$1 {
       return;
     }
     const isNudgeKey = key === "ArrowDown" || key === "ArrowUp";
+    const oldValue = this.value;
     if (isNudgeKey) {
       if (!value) {
-        this.value = this.previousNonNullValue;
+        this.internalSetValue(this.previousNonNullValue, oldValue);
         event.preventDefault();
         return;
       }
       const direction = key === "ArrowUp" ? 1 : -1;
       const bump = shiftKey ? 10 : 1;
-      this.value = normalizeHex(this.nudgeRGBChannels(internalColor, bump * direction).hex());
+      this.internalSetValue(normalizeHex(this.nudgeRGBChannels(internalColor, bump * direction).hex()), oldValue);
       event.preventDefault();
       return;
     }
@@ -7420,6 +7382,36 @@ const ColorPickerHexInput = class extends HTMLElement$1 {
   async setFocus() {
     focusElement(this.inputNode);
   }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  internalSetValue(value, oldValue, emit = true) {
+    if (value) {
+      const normalized = normalizeHex(value);
+      if (isValidHex(normalized)) {
+        const { internalColor } = this;
+        const changed = !internalColor || normalized !== normalizeHex(internalColor.hex());
+        this.internalColor = color(normalized);
+        this.previousNonNullValue = normalized;
+        this.value = normalized;
+        if (changed && emit) {
+          this.calciteColorPickerHexInputChange.emit();
+        }
+        return;
+      }
+    }
+    else if (this.allowEmpty) {
+      this.internalColor = null;
+      this.value = null;
+      if (emit) {
+        this.calciteColorPickerHexInputChange.emit();
+      }
+      return;
+    }
+    this.value = oldValue;
+  }
   formatForInternalInput(hex) {
     return hex ? hex.replace("#", "") : "";
   }
@@ -23099,7 +23091,7 @@ const Tab = class extends HTMLElement$1 {
   //  Event Listeners
   //
   //--------------------------------------------------------------------------
-  tabChangeHandler(event) {
+  internalTabChangeHandler(event) {
     const targetTabsEl = event
       .composedPath()
       .find((el) => el.tagName === "CALCITE-TABS");
@@ -23152,6 +23144,7 @@ const TabNav = class extends HTMLElement$1 {
     this.__registerHost();
     this.__attachShadow();
     this.calciteTabChange = createEvent(this, "calciteTabChange", 7);
+    this.calciteInternalTabChange = createEvent(this, "calciteInternalTabChange", 7);
     /** @internal Parent tabs component scale value */
     this.scale = "m";
     /** @internal Parent tabs component layout value */
@@ -23185,7 +23178,7 @@ const TabNav = class extends HTMLElement$1 {
       this.selectedTab !== null) {
       localStorage.setItem(`calcite-tab-nav-${this.storageId}`, JSON.stringify(this.selectedTab));
     }
-    this.calciteTabChange.emit({
+    this.calciteInternalTabChange.emit({
       tab: this.selectedTab
     });
     this.selectedTabEl = await this.getTabTitleById(this.selectedTab);
@@ -23215,9 +23208,6 @@ const TabNav = class extends HTMLElement$1 {
     if (localStorage && this.storageId && localStorage.getItem(storageKey)) {
       const storedTab = JSON.parse(localStorage.getItem(storageKey));
       this.selectedTab = storedTab;
-      this.calciteTabChange.emit({
-        tab: this.selectedTab
-      });
     }
   }
   componentWillRender() {
@@ -23237,7 +23227,7 @@ const TabNav = class extends HTMLElement$1 {
       this.tabTitles.every((title) => !title.active) &&
       !this.selectedTab) {
       this.tabTitles[0].getTabIdentifier().then((tab) => {
-        this.calciteTabChange.emit({
+        this.calciteInternalTabChange.emit({
           tab
         });
       });
@@ -23270,13 +23260,20 @@ const TabNav = class extends HTMLElement$1 {
     e.stopPropagation();
     e.preventDefault();
   }
-  activateTabHandler(e) {
+  internalActivateTabHandler(e) {
     this.selectedTab = e.detail.tab
       ? e.detail.tab
       : this.getIndexOfTabTitle(e.target);
     e.stopPropagation();
     e.preventDefault();
   }
+  activateTabHandler(e) {
+    this.calciteTabChange.emit({
+      tab: this.selectedTab
+    });
+    e.stopPropagation();
+    e.preventDefault();
+  }
   /**
    * Check for active tabs on register and update selected
    */
@@ -23285,12 +23282,13 @@ const TabNav = class extends HTMLElement$1 {
       this.selectedTab = e.detail;
     }
   }
-  globalTabChangeHandler(e) {
+  globalInternalTabChangeHandler(e) {
     if (this.syncId &&
       e.target !== this.el &&
       e.target.syncId === this.syncId &&
       this.selectedTab !== e.detail.tab) {
       this.selectedTab = e.detail.tab;
+      e.stopPropagation();
     }
   }
   updateOffsetPosition() {
@@ -23339,6 +23337,7 @@ const TabTitle = class extends HTMLElement$1 {
     this.__registerHost();
     this.__attachShadow();
     this.calciteTabsActivate = createEvent(this, "calciteTabsActivate", 7);
+    this.calciteInternalTabsActivate = createEvent(this, "calciteInternalTabsActivate", 7);
     this.calciteTabsFocusNext = createEvent(this, "calciteTabsFocusNext", 7);
     this.calciteTabsFocusPrevious = createEvent(this, "calciteTabsFocusPrevious", 7);
     this.calciteTabTitleRegister = createEvent(this, "calciteTabTitleRegister", 7);
@@ -23366,7 +23365,7 @@ const TabTitle = class extends HTMLElement$1 {
   }
   activeTabChanged() {
     if (this.active) {
-      this.emitActiveTab();
+      this.emitActiveTab(false);
     }
   }
   //--------------------------------------------------------------------------
@@ -23392,7 +23391,7 @@ const TabTitle = class extends HTMLElement$1 {
       this.updateHasText();
     }
     if (this.tab && this.active) {
-      this.emitActiveTab();
+      this.emitActiveTab(false);
     }
   }
   componentWillRender() {
@@ -23429,7 +23428,7 @@ const TabTitle = class extends HTMLElement$1 {
   //  Event Listeners
   //
   //--------------------------------------------------------------------------
-  tabChangeHandler(event) {
+  internalTabChangeHandler(event) {
     const targetTabsEl = event
       .composedPath()
       .find((el) => el.tagName === "CALCITE-TABS");
@@ -23444,6 +23443,7 @@ const TabTitle = class extends HTMLElement$1 {
         this.active = index === event.detail.tab;
       });
     }
+    event.stopPropagation();
   }
   onClick() {
     this.emitActiveTab();
@@ -23503,11 +23503,14 @@ const TabTitle = class extends HTMLElement$1 {
     var _a;
     (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
   }
-  emitActiveTab() {
-    if (!this.disabled) {
-      this.calciteTabsActivate.emit({
-        tab: this.tab
-      });
+  emitActiveTab(userTriggered = true) {
+    if (this.disabled) {
+      return;
+    }
+    const payload = { tab: this.tab };
+    this.calciteInternalTabsActivate.emit(payload);
+    if (userTriggered) {
+      this.calciteTabsActivate.emit(payload);
     }
   }
   get el() { return this; }
@@ -26128,9 +26131,9 @@ const CalciteSplitButton = /*@__PURE__*/proxyCustomElement(SplitButton, [1,"calc
 const CalciteStepper = /*@__PURE__*/proxyCustomElement(Stepper, [1,"calcite-stepper",{"icon":[516],"layout":[513],"numbered":[516],"scale":[513],"requestedContent":[1040]},[[0,"calciteStepperItemKeyEvent","calciteStepperItemKeyEvent"],[0,"calciteStepperItemRegister","registerItem"],[0,"calciteStepperItemSelect","updateItem"]]]);
 const CalciteStepperItem = /*@__PURE__*/proxyCustomElement(StepperItem, [1,"calcite-stepper-item",{"active":[1540],"complete":[516],"error":[4],"disabled":[516],"itemTitle":[1,"item-title"],"itemSubtitle":[1,"item-subtitle"],"layout":[1537],"icon":[1028],"numbered":[1028],"scale":[1537]},[[0,"keydown","keyDownHandler"],[16,"calciteStepperItemChange","updateActiveItemOnChange"]]]);
 const CalciteSwitch = /*@__PURE__*/proxyCustomElement(Switch, [1,"calcite-switch",{"disabled":[516],"label":[1],"name":[513],"scale":[513],"switched":[1028],"checked":[1540],"value":[8]}]);
-const CalciteTab = /*@__PURE__*/proxyCustomElement(Tab, [1,"calcite-tab",{"tab":[513],"active":[1540],"scale":[1537],"labeledBy":[32]},[[16,"calciteTabChange","tabChangeHandler"]]]);
-const CalciteTabNav = /*@__PURE__*/proxyCustomElement(TabNav, [1,"calcite-tab-nav",{"storageId":[1,"storage-id"],"syncId":[1,"sync-id"],"scale":[1537],"layout":[1537],"position":[1537],"bordered":[1540],"indicatorOffset":[1026,"indicator-offset"],"indicatorWidth":[1026,"indicator-width"],"selectedTab":[32],"selectedTabEl":[32]},[[0,"calciteTabsFocusPrevious","focusPreviousTabHandler"],[0,"calciteTabsFocusNext","focusNextTabHandler"],[0,"calciteTabsActivate","activateTabHandler"],[0,"calciteTabTitleRegister","updateTabTitles"],[16,"calciteTabChange","globalTabChangeHandler"]]]);
-const CalciteTabTitle = /*@__PURE__*/proxyCustomElement(TabTitle, [1,"calcite-tab-title",{"active":[1540],"disabled":[516],"iconEnd":[513,"icon-end"],"iconFlipRtl":[513,"icon-flip-rtl"],"iconStart":[513,"icon-start"],"layout":[1537],"position":[1537],"scale":[1537],"bordered":[1540],"tab":[513],"controls":[32],"hasText":[32]},[[16,"calciteTabChange","tabChangeHandler"],[0,"click","onClick"],[0,"keydown","keyDownHandler"]]]);
+const CalciteTab = /*@__PURE__*/proxyCustomElement(Tab, [1,"calcite-tab",{"tab":[513],"active":[1540],"scale":[1537],"labeledBy":[32]},[[16,"calciteInternalTabChange","internalTabChangeHandler"]]]);
+const CalciteTabNav = /*@__PURE__*/proxyCustomElement(TabNav, [1,"calcite-tab-nav",{"storageId":[1,"storage-id"],"syncId":[1,"sync-id"],"scale":[1537],"layout":[1537],"position":[1537],"bordered":[1540],"indicatorOffset":[1026,"indicator-offset"],"indicatorWidth":[1026,"indicator-width"],"selectedTab":[32],"selectedTabEl":[32]},[[0,"calciteTabsFocusPrevious","focusPreviousTabHandler"],[0,"calciteTabsFocusNext","focusNextTabHandler"],[0,"calciteInternalTabsActivate","internalActivateTabHandler"],[0,"calciteTabsActivate","activateTabHandler"],[0,"calciteTabTitleRegister","updateTabTitles"],[16,"calciteInternalTabChange","globalInternalTabChangeHandler"]]]);
+const CalciteTabTitle = /*@__PURE__*/proxyCustomElement(TabTitle, [1,"calcite-tab-title",{"active":[1540],"disabled":[516],"iconEnd":[513,"icon-end"],"iconFlipRtl":[513,"icon-flip-rtl"],"iconStart":[513,"icon-start"],"layout":[1537],"position":[1537],"scale":[1537],"bordered":[1540],"tab":[513],"controls":[32],"hasText":[32]},[[16,"calciteInternalTabChange","internalTabChangeHandler"],[0,"click","onClick"],[0,"keydown","keyDownHandler"]]]);
 const CalciteTabs = /*@__PURE__*/proxyCustomElement(Tabs, [1,"calcite-tabs",{"layout":[513],"position":[513],"scale":[513],"bordered":[1540],"titles":[32],"tabs":[32]},[[0,"calciteTabTitleRegister","calciteTabTitleRegister"],[16,"calciteTabTitleUnregister","calciteTabTitleUnregister"],[0,"calciteTabRegister","calciteTabRegister"],[16,"calciteTabUnregister","calciteTabUnregister"]]]);
 const CalciteTile = /*@__PURE__*/proxyCustomElement(Tile, [1,"calcite-tile",{"active":[516],"description":[513],"disabled":[516],"embed":[516],"focused":[516],"heading":[513],"hidden":[516],"href":[513],"icon":[513]}]);
 const CalciteTileSelect = /*@__PURE__*/proxyCustomElement(TileSelect, [1,"calcite-tile-select",{"checked":[1540],"description":[513],"disabled":[516],"heading":[513],"hidden":[516],"icon":[513],"name":[520],"inputEnabled":[516,"input-enabled"],"inputAlignment":[513,"input-alignment"],"type":[513],"value":[8],"width":[513],"focused":[32]},[[0,"calciteCheckboxChange","checkboxChangeHandler"],[0,"calciteInternalCheckboxFocus","checkboxFocusBlurHandler"],[0,"calciteInternalCheckboxBlur","checkboxFocusBlurHandler"],[0,"calciteRadioButtonChange","radioButtonChangeHandler"],[0,"calciteInternalRadioButtonCheckedChange","radioButtonCheckedChangeHandler"],[0,"calciteInternalRadioButtonFocus","radioButtonFocusBlurHandler"],[0,"calciteInternalRadioButtonBlur","radioButtonFocusBlurHandler"],[0,"click","click"],[1,"mouseenter","mouseenter"],[1,"mouseleave","mouseleave"]]]);

package/dist/esm/{ExpandToggle-d1a28bdb.js → ExpandToggle-dead8cc0.js}

@@ -1,12 +1,12 @@
 /*!
  * 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.435
+ * v1.0.0-next.438
  */
-import { f as forceUpdate, h } from './index-bb233658.js';
-import { a as getElementDir } from './dom-6fe68fed.js';
-import { S as SLOTS } from './resources-1a0e1a6f.js';
-import { S as SLOTS$1 } from './resources-9fe24ed6.js';
+import { f as forceUpdate, h } from './index-04070095.js';
+import { a as getElementDir } from './dom-bf2137c4.js';
+import { S as SLOTS } from './resources-16f8890a.js';
+import { S as SLOTS$1 } from './resources-d8d86fdc.js';
 
 const overflowActionsDebounceInMs = 150;
 const groupBufferHeight = 2;

package/dist/esm/{Heading-82c4b013.js → Heading-66e4f244.js}

@@ -1,9 +1,9 @@
 /*!
  * 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.435
+ * v1.0.0-next.438
  */
-import { h } from './index-bb233658.js';
+import { h } from './index-04070095.js';
 
 function constrainHeadingLevel(level) {
   return Math.min(Math.max(Math.ceil(level), 1), 6);

package/dist/esm/{array-0164f269.js → array-233a5666.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.435
+ * v1.0.0-next.438
  */
 function getRoundRobinIndex(index, total) {
   return (index + total) % total;

package/dist/esm/calcite-accordion_2.entry.js

@@ -1,11 +1,11 @@
 /*!
  * 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.435
+ * v1.0.0-next.438
  */
-import { r as registerInstance, c as createEvent, h, g as getElement, H as Host } from './index-bb233658.js';
-import { d as getElementProp, a as getElementDir, C as CSS_UTILITY } from './dom-6fe68fed.js';
-import { g as guid } from './guid-b2303677.js';
+import { r as registerInstance, c as createEvent, h, g as getElement, H as Host } from './index-04070095.js';
+import { d as getElementProp, a as getElementDir, C as CSS_UTILITY } from './dom-bf2137c4.js';
+import { g as guid } from './guid-07e4437f.js';
 
 const accordionCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-popper-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host([scale=s]){--calcite-accordion-item-spacing-unit:0.25rem;--calcite-accordion-icon-margin:0.5rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=m]){--calcite-accordion-item-spacing-unit:0.5rem;--calcite-accordion-icon-margin:0.75rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]){--calcite-accordion-item-spacing-unit:0.75rem;--calcite-accordion-icon-margin:1rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host{position:relative;display:block;max-width:100%;line-height:1.5rem;--calcite-accordion-item-border:var(--calcite-ui-border-2);--calcite-accordion-item-background:var(--calcite-ui-foreground-1)}.accordion--transparent{--calcite-accordion-item-border:transparent;--calcite-accordion-item-background:transparent}.accordion--minimal{--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0}.accordion{border-width:1px;border-bottom-width:0px;border-style:solid;border-color:var(--calcite-ui-border-2)}";
 

package/dist/esm/calcite-action-bar.entry.js

@@ -1,17 +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-next.435
+ * v1.0.0-next.438
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-bb233658.js';
-import { t as toggleChildActionText, o as overflowActionsDebounceInMs, q as queryActions, a as overflowActions, E as ExpandToggle, g as getOverflowCount } from './ExpandToggle-d1a28bdb.js';
-import { f as focusElement, g as getSlotted } from './dom-6fe68fed.js';
-import { c as createObserver } from './observers-c49d1477.js';
-import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-af628418.js';
-import { d as debounce } from './debounce-1ede02a9.js';
-import './resources-1a0e1a6f.js';
-import './resources-9fe24ed6.js';
-import './guid-b2303677.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-04070095.js';
+import { t as toggleChildActionText, o as overflowActionsDebounceInMs, q as queryActions, a as overflowActions, E as ExpandToggle, g as getOverflowCount } from './ExpandToggle-dead8cc0.js';
+import { f as focusElement, g as getSlotted } from './dom-bf2137c4.js';
+import { c as createObserver } from './observers-eba2b2b9.js';
+import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-22e140ed.js';
+import { d as debounce } from './debounce-7841a27d.js';
+import './resources-16f8890a.js';
+import './resources-d8d86fdc.js';
+import './guid-07e4437f.js';
 
 const CSS = {
   actionGroupBottom: "action-group--bottom"