@esri/calcite-components 5.2.0-next.16 → 5.2.0-next.17

package/dist/components/calcite-chip/customElement.js

@@ -53,6 +53,7 @@ class Chip extends LitElement {
       } else if (this.closable) {
         return this.closeButtonRef.value;
       }
+      return;
     }, options);
   }
   async load() {
@@ -135,7 +136,7 @@ class Chip extends LitElement {
     if (this.selectionMode === "single") {
       this.calciteInternalSyncSelectedChips.emit();
     }
-    const selectedInParent = this.parentChipGroup.selectedItems.includes(this.el);
+    const selectedInParent = this.parentChipGroup?.selectedItems.includes(this.el);
     if (!selectedInParent && selected && this.selectionMode !== "multiple") {
       this.calciteInternalChipSelect.emit();
     }

package/dist/components/calcite-color-picker/customElement.d.ts

@@ -73,26 +73,26 @@ export abstract class ColorPicker extends LitElement {
   accessor hexDisabled: boolean;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      b?: string;
-      blue?: string;
-      deleteColor?: string;
-      g?: string;
-      green?: string;
-      h?: string;
-      hsv?: string;
-      hex?: string;
-      hue?: string;
-      noColor?: string;
-      opacity?: string;
-      r?: string;
-      red?: string;
-      rgb?: string;
-      s?: string;
-      saturation?: string;
-      saveColor?: string;
-      saved?: string;
-      v?: string;
-      value?: string;
+      b?: string | undefined;
+      blue?: string | undefined;
+      deleteColor?: string | undefined;
+      g?: string | undefined;
+      green?: string | undefined;
+      h?: string | undefined;
+      hsv?: string | undefined;
+      hex?: string | undefined;
+      hue?: string | undefined;
+      noColor?: string | undefined;
+      opacity?: string | undefined;
+      r?: string | undefined;
+      red?: string | undefined;
+      rgb?: string | undefined;
+      s?: string | undefined;
+      saturation?: string | undefined;
+      saveColor?: string | undefined;
+      saved?: string | undefined;
+      v?: string | undefined;
+      value?: string | undefined;
   };
   /** Specifies the Unicode numeral system used by the component for localization. */
   accessor numberingSystem: NumberingSystem | undefined;

package/dist/components/calcite-color-picker/customElement.js

@@ -828,7 +828,10 @@ class ColorPicker extends LitElement {
     return channels;
   }
   getAdjustedScopePosition(left, top) {
-    return [left - SCOPE_SIZE / 2, top - SCOPE_SIZE / 2];
+    return [
+      left === void 0 ? NaN : left - SCOPE_SIZE / 2,
+      top === void 0 ? NaN : top - SCOPE_SIZE / 2
+    ];
   }
   render() {
     const { channelsDisabled, color, colorFieldScopeLeft, colorFieldScopeTop, staticDimensions: { thumb: { radius: thumbRadius } }, fieldDisabled, hexDisabled, hueScopeLeft, messages, alphaChannel, opacityScopeLeft, savedColors, savedDisabled, scale, scopeOrientation } = this;
@@ -876,7 +879,8 @@ class ColorPicker extends LitElement {
     return keyed(channelMode, html`<calcite-tab class=${safeClassMap(CSS.control)} .selected=${selected}><div class=${safeClassMap(CSS.channels)} dir=ltr>${channelsToRender.map((channelValue, index) => {
       const isAlphaChannel = index === 3;
       if (isAlphaChannel) {
-        channelValue = clearable && !channelValue ? channelValue : alphaToOpacity(channelValue);
+        channelValue = // channels can only be undefined when clearable
+        clearable && !channelValue ? channelValue : alphaToOpacity(channelValue);
       }
       return this.renderChannel(channelValue, index, channelAriaLabels[index], direction, isAlphaChannel ? "%" : "");
     })}</div></calcite-tab>`);

package/dist/components/calcite-combobox/customElement.d.ts

@@ -64,17 +64,17 @@ export abstract class Combobox extends LitElement {
   accessor maxItems: number;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      add?: string;
-      all?: string;
-      allSelected?: string;
-      clear?: string;
-      noMatches?: string;
-      removeTag?: string;
-      required?: string;
-      selectAll?: string;
-      selected?: string;
-      nonEditable?: string;
-      disabledSelectedCount?: string;
+      add?: string | undefined;
+      all?: string | undefined;
+      allSelected?: string | undefined;
+      clear?: string | undefined;
+      noMatches?: string | undefined;
+      removeTag?: string | undefined;
+      required?: string | undefined;
+      selectAll?: string | undefined;
+      selected?: string | undefined;
+      nonEditable?: string | undefined;
+      disabledSelectedCount?: string | undefined;
   };
   /** Specifies the name of the component. Required to pass the component's `value` on form submission. */
   accessor name: string | undefined;

package/dist/components/calcite-date-picker/customElement.d.ts

@@ -58,11 +58,11 @@ export abstract class DatePicker extends LitElement {
   accessor maxAsDate: Date | undefined;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      nextMonth?: string;
-      prevMonth?: string;
-      monthMenu?: string;
-      yearMenu?: string;
-      year?: string;
+      nextMonth?: string | undefined;
+      prevMonth?: string | undefined;
+      monthMenu?: string | undefined;
+      yearMenu?: string | undefined;
+      year?: string | undefined;
   };
   /**
    * When the component resides in a form,

package/dist/components/calcite-dialog/customElement.d.ts

@@ -131,9 +131,9 @@ export abstract class Dialog extends LitElement {
   accessor menuOpen: boolean;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      close?: string;
-      resizeEnabled?: string;
-      dragEnabled?: string;
+      close?: string | undefined;
+      resizeEnabled?: string | undefined;
+      dragEnabled?: string | undefined;
   };
   /**
    * When `true`, displays a scrim blocking interaction underneath the component.

package/dist/components/calcite-filter/customElement.d.ts

@@ -41,8 +41,8 @@ export abstract class Filter extends LitElement {
   accessor label: string | undefined;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      label?: string;
-      clear?: string;
+      label?: string | undefined;
+      clear?: string | undefined;
   };
   /** Specifies the component's input placeholder text. */
   accessor placeholder: string | undefined;

package/dist/components/calcite-flow-item/customElement.d.ts

@@ -54,7 +54,7 @@ export abstract class FlowItem extends LitElement {
   /** Specifies a function to run before the component is removed from its parent `calcite-flow`. */
   accessor beforeBack: (() => Promise<void>) | undefined;
   /** Specifies a function to run before the component closes. */
-  accessor beforeClose: () => Promise<void>;
+  accessor beforeClose: (() => Promise<void>) | undefined;
   /**
    * When `true`, displays a close button in the trailing side of the component's header.
    *
@@ -86,7 +86,7 @@ export abstract class FlowItem extends LitElement {
    */
   accessor collapsible: boolean;
   /** Specifies a description for the component. */
-  accessor description: string;
+  accessor description: string | undefined;
   /**
    * When `true`, prevents interaction and decreases the component's opacity.
    *
@@ -94,11 +94,11 @@ export abstract class FlowItem extends LitElement {
    */
   accessor disabled: boolean;
   /** Specifies the component's heading text. */
-  accessor heading: string;
+  accessor heading: string | undefined;
   /** Specifies the heading level number of the component's `heading` for proper document structure, without affecting visual styling. */
-  accessor headingLevel: HeadingLevel;
+  accessor headingLevel: HeadingLevel | undefined;
   /** Specifies an icon to display. */
-  accessor icon: IconName;
+  accessor icon: IconName | undefined;
   /**
    * When `true` and the element direction is right-to-left (`"rtl"`), flips the component`s `icon`.
    *
@@ -119,9 +119,9 @@ export abstract class FlowItem extends LitElement {
   accessor menuOpen: boolean;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      back?: string;
-      close?: string;
-      options?: string;
+      back?: string | undefined;
+      close?: string | undefined;
+      options?: string | undefined;
   } & Panel["messageOverrides"];
   /**
    * Specifies the type of positioning to use for overlaid content, where:

package/dist/components/calcite-handle/customElement.d.ts

@@ -19,15 +19,15 @@ export abstract class Handle extends LitElement {
    */
   accessor disabled: boolean;
   /** Value for the button title attribute. */
-  accessor dragHandle: string;
+  accessor dragHandle: string | undefined;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      dragHandle?: string;
-      dragHandleUntitled?: string;
-      dragHandleActive?: string;
-      dragHandleChange?: string;
-      dragHandleCommit?: string;
-      dragHandleIdle?: string;
+      dragHandle?: string | undefined;
+      dragHandleUntitled?: string | undefined;
+      dragHandleActive?: string | undefined;
+      dragHandleChange?: string | undefined;
+      dragHandleCommit?: string | undefined;
+      dragHandleIdle?: string | undefined;
   };
   /**
    * When `true`, the component is selected.

package/dist/components/calcite-handle/customElement.js

@@ -77,7 +77,7 @@ class Handle extends LitElement {
   getAriaText(type) {
     const { setPosition, setSize, label, messages, selected } = this;
     if (!messages || !label || typeof setSize !== "number" || typeof setPosition !== "number") {
-      return null;
+      return void 0;
     }
     const text = type === "label" ? selected ? messages.dragHandleChange : messages.dragHandleIdle : selected ? messages.dragHandleActive : messages.dragHandleCommit;
     const replacePosition = text.replace(SUBSTITUTIONS.position, setPosition.toString());
@@ -120,7 +120,7 @@ class Handle extends LitElement {
     }
   }
   render() {
-    return this.interactiveContainer({ disabled: this.disabled, children: html`<span .ariaChecked=${this.disabled ? null : this.selected} .ariaDisabled=${this.disabled ? this.disabled : null} .ariaLabel=${this.disabled ? null : this.getAriaText("label")} class=${safeClassMap({ [CSS.handle]: true, [CSS.handleSelected]: !this.disabled && this.selected })} @blur=${this.handleBlur} @keydown=${this.handleKeyDown} role=radio tabindex=${(this.disabled ? null : 0) ?? nothing} title=${this.getTooltip() ?? nothing} ${ref(this.handleButtonRef)}><calcite-icon .icon=${ICONS.drag} scale=s></calcite-icon></span>` });
+    return this.interactiveContainer({ disabled: this.disabled, children: html`<span .ariaChecked=${this.disabled ? void 0 : this.selected} .ariaDisabled=${this.disabled ? this.disabled : void 0} .ariaLabel=${this.disabled ? void 0 : this.getAriaText("label")} class=${safeClassMap({ [CSS.handle]: true, [CSS.handleSelected]: !this.disabled && this.selected })} @blur=${this.handleBlur} @keydown=${this.handleKeyDown} role=radio tabindex=${(this.disabled ? void 0 : 0) ?? nothing} title=${this.getTooltip() ?? nothing} ${ref(this.handleButtonRef)}><calcite-icon .icon=${ICONS.drag} scale=s></calcite-icon></span>` });
   }
 }
 customElement("calcite-handle", Handle);

package/dist/components/calcite-inline-editable/customElement.d.ts

@@ -40,9 +40,9 @@ export abstract class InlineEditable extends LitElement {
   accessor loading: boolean;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      enableEditing?: string;
-      cancelEditing?: string;
-      confirmChanges?: string;
+      enableEditing?: string | undefined;
+      cancelEditing?: string | undefined;
+      confirmChanges?: string | undefined;
   };
   /**
    * Specifies the size of the component.

package/dist/components/calcite-input/customElement.d.ts

@@ -110,12 +110,12 @@ export abstract class Input extends LitElement {
   accessor maxLength: number | undefined;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      cancelInlineEditing?: string;
-      clear?: string;
-      confirmInlineEditingChanges?: string;
-      enableInlineEditing?: string;
-      loading?: string;
-      required?: string;
+      cancelInlineEditing?: string | undefined;
+      clear?: string | undefined;
+      confirmInlineEditingChanges?: string | undefined;
+      enableInlineEditing?: string | undefined;
+      loading?: string | undefined;
+      required?: string | undefined;
   };
   /**
    * When the component resides in a form,

package/dist/components/calcite-input-date-picker/customElement.d.ts

@@ -89,12 +89,13 @@ export abstract class InputDatePicker extends LitElement {
   accessor maxAsDate: Date | undefined;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      chooseDate?: string;
-      date?: string;
-      dateFormat?: string;
-      endDate?: string;
-      required?: string;
-      startDate?: string;
+      chooseDate?: string | undefined;
+      clear?: string | undefined;
+      date?: string | undefined;
+      dateFormat?: string | undefined;
+      endDate?: string | undefined;
+      required?: string | undefined;
+      startDate?: string | undefined;
   } & DatePicker["messageOverrides"];
   /**
    * When the component resides in a form,

package/dist/components/calcite-input-message/customElement.js

@@ -40,9 +40,7 @@ class InputMessage extends LitElement {
     return html`${this.renderIcon(this.requestedIcon)}<slot></slot>`;
   }
   renderIcon(iconName) {
-    if (iconName) {
-      return html`<calcite-icon class=${safeClassMap(CSS.inputMessageIcon)} .flipRtl=${this.iconFlipRtl} .icon=${iconName} scale=s></calcite-icon>`;
-    }
+    return iconName ? html`<calcite-icon class=${safeClassMap(CSS.inputMessageIcon)} .flipRtl=${this.iconFlipRtl} .icon=${iconName} scale=s></calcite-icon>` : iconName;
   }
 }
 customElement("calcite-input-message", InputMessage);

package/dist/components/calcite-input-number/customElement.d.ts

@@ -109,12 +109,12 @@ export abstract class InputNumber extends LitElement {
   accessor maxLength: number | undefined;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      cancelInlineEditing?: string;
-      clear?: string;
-      confirmInlineEditingChanges?: string;
-      enableInlineEditing?: string;
-      loading?: string;
-      required?: string;
+      cancelInlineEditing?: string | undefined;
+      clear?: string | undefined;
+      confirmInlineEditingChanges?: string | undefined;
+      enableInlineEditing?: string | undefined;
+      loading?: string | undefined;
+      required?: string | undefined;
   };
   /**
    * When the component resides in a form,

package/dist/components/calcite-input-text/customElement.d.ts

@@ -86,12 +86,12 @@ export abstract class InputText extends LitElement {
   accessor maxLength: number | undefined;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      cancelInlineEditing?: string;
-      clear?: string;
-      confirmInlineEditingChanges?: string;
-      enableInlineEditing?: string;
-      loading?: string;
-      required?: string;
+      cancelInlineEditing?: string | undefined;
+      clear?: string | undefined;
+      confirmInlineEditingChanges?: string | undefined;
+      enableInlineEditing?: string | undefined;
+      loading?: string | undefined;
+      required?: string | undefined;
   };
   /**
    * When the component resides in a form,

package/dist/components/calcite-input-time-picker/customElement.d.ts

@@ -65,23 +65,24 @@ export abstract class InputTimePicker extends LitElement {
   accessor max: string | undefined;
   /** Overrides individual strings used by the component. */
   accessor messageOverrides: {
-      chooseTime?: string;
-      fractionalSecond?: string;
-      fractionalSecondDown?: string;
-      fractionalSecondUp?: string;
-      hour?: string;
-      hourDown?: string;
-      hourUp?: string;
-      meridiem?: string;
-      meridiemDown?: string;
-      meridiemUp?: string;
-      minute?: string;
-      minuteDown?: string;
-      minuteUp?: string;
-      required?: string;
-      second?: string;
-      secondDown?: string;
-      secondUp?: string;
+      chooseTime?: string | undefined;
+      clear?: string | undefined;
+      fractionalSecond?: string | undefined;
+      fractionalSecondDown?: string | undefined;
+      fractionalSecondUp?: string | undefined;
+      hour?: string | undefined;
+      hourDown?: string | undefined;
+      hourUp?: string | undefined;
+      meridiem?: string | undefined;
+      meridiemDown?: string | undefined;
+      meridiemUp?: string | undefined;
+      minute?: string | undefined;
+      minuteDown?: string | undefined;
+      minuteUp?: string | undefined;
+      required?: string | undefined;
+      second?: string | undefined;
+      secondDown?: string | undefined;
+      secondUp?: string | undefined;
   } & TimePicker["messageOverrides"];
   /**
    * When the component resides in a form,