@esri/calcite-components 1.6.1-next.1 → 1.6.1

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

@@ -17,7 +17,6 @@ import { CardMessages } from "./assets/card/t9n";
  * @slot footer-end - A slot for adding a trailing footer.
  */
 export declare class Card implements ConditionalSlotComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteCardElement;
   /**  When `true`, a busy indicator is displayed. */
   loading: boolean;
   /** When `true`, the component is selected. */
@@ -43,6 +42,7 @@ export declare class Card implements ConditionalSlotComponent, LocalizedComponen
   disconnectedCallback(): void;
   componentWillLoad(): Promise<void>;
   render(): VNode;
+  el: HTMLCalciteCardElement;
   effectiveLocale: string;
   effectiveLocaleChange(): void;
   defaultMessages: CardMessages;

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

@@ -5,7 +5,6 @@ import { LabelableComponent } from "../../utils/label";
 import { LoadableComponent } from "../../utils/loadable";
 import { Scale } from "../interfaces";
 export declare class Checkbox implements LabelableComponent, CheckableFormComponent, InteractiveComponent, LoadableComponent {
-  el: HTMLCalciteCheckboxElement;
   /** When `true`, the component is checked. */
   checked: boolean;
   /** When `true`, interaction is prevented and the component is displayed with lower opacity. */
@@ -50,6 +49,7 @@ export declare class Checkbox implements LabelableComponent, CheckableFormCompon
   scale: Scale;
   /** The component's value. */
   value: any;
+  el: HTMLCalciteCheckboxElement;
   readonly checkedPath = "M5.5 12L2 8.689l.637-.636L5.5 10.727l8.022-7.87.637.637z";
   readonly indeterminatePath = "M13 8v1H3V8z";
   labelEl: HTMLCalciteLabelElement;

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

@@ -11,7 +11,6 @@ import { ChipMessages } from "./assets/chip/t9n";
  * @slot image - A slot for adding an image.
  */
 export declare class Chip implements ConditionalSlotComponent, InteractiveComponent, LoadableComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteChipElement;
   /** When `true`, interaction is prevented and the component is displayed with lower opacity. */
   disabled: boolean;
   /** Specifies the appearance style of the component. */
@@ -59,6 +58,7 @@ export declare class Chip implements ConditionalSlotComponent, InteractiveCompon
    * @internal
    */
   interactive: boolean;
+  el: HTMLCalciteChipElement;
   defaultMessages: ChipMessages;
   effectiveLocale: string;
   effectiveLocaleChange(): void;

package/dist/types/components/chip-group/chip-group.d.ts

@@ -5,7 +5,6 @@ import { Scale, SelectionMode } from "../interfaces";
  * @slot - A slot for adding one or more `calcite-chip`s.
  */
 export declare class ChipGroup implements InteractiveComponent {
-  el: HTMLCalciteChipGroupElement;
   /** When `true`, interaction is prevented and the component is displayed with lower opacity. */
   disabled: boolean;
   /** Accessible name for the component. */
@@ -21,6 +20,7 @@ export declare class ChipGroup implements InteractiveComponent {
    * @readonly
    */
   selectedItems: HTMLCalciteChipElement[];
+  el: HTMLCalciteChipGroupElement;
   mutationObserver: import("../../utils/observers").ExtendedMutationObserver;
   private items;
   private slotRefEl;

package/dist/types/components/color-picker/color-picker.d.ts

@@ -9,7 +9,6 @@ import { LocalizedComponent, NumberingSystem } from "../../utils/locale";
 import { T9nComponent } from "../../utils/t9n";
 import { ColorPickerMessages } from "./assets/color-picker/t9n";
 export declare class ColorPicker implements InteractiveComponent, LoadableComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteColorPickerElement;
   /**
    * When `true`, an empty color (`null`) will be allowed as a `value`. When `false`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`.
    */
@@ -86,6 +85,7 @@ export declare class ColorPicker implements InteractiveComponent, LoadableCompon
    */
   value: ColorValue | null;
   handleValueChange(value: ColorValue | null, oldValue: ColorValue | null): void;
+  el: HTMLCalciteColorPickerElement;
   private activeCanvasInfo;
   private get baseColorFieldColor();
   private checkerPattern;

package/dist/types/components/color-picker-hex-input/color-picker-hex-input.d.ts

@@ -5,7 +5,6 @@ import { LoadableComponent } from "../../utils/loadable";
 import { NumberingSystem } from "../../utils/locale";
 import { ColorPickerMessages } from "../color-picker/assets/color-picker/t9n";
 export declare class ColorPickerHexInput implements LoadableComponent {
-  el: HTMLCalciteColorPickerHexInputElement;
   connectedCallback(): void;
   componentWillLoad(): void;
   componentDidLoad(): void;
@@ -50,6 +49,7 @@ export declare class ColorPickerHexInput implements LoadableComponent {
   private onOpacityInputChange;
   protected onInputKeyDown: (event: KeyboardEvent) => void;
   private onHexInputPaste;
+  el: HTMLCalciteColorPickerHexInputElement;
   private hexInputNode;
   /**
    * The last valid/selected color. Used as a fallback if an invalid hex code is entered.

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

@@ -17,7 +17,6 @@ interface ItemData {
  * @slot - A slot for adding `calcite-combobox-item`s.
  */
 export declare class Combobox implements LabelableComponent, FormComponent, InteractiveComponent, OpenCloseComponent, FloatingUIComponent, T9nComponent, LoadableComponent {
-  el: HTMLCalciteComboboxElement;
   /**
    * When `true`, the value-clearing will be disabled.
    */
@@ -143,6 +142,7 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
   componentDidLoad(): void;
   componentDidRender(): void;
   disconnectedCallback(): void;
+  el: HTMLCalciteComboboxElement;
   placement: LogicalPlacement;
   filteredFlipPlacements: EffectivePlacement[];
   internalValueChangeFlag: boolean;

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

@@ -5,7 +5,6 @@ import { T9nComponent } from "../../utils/t9n";
 import { HeadingLevel } from "../functional/Heading";
 import { DatePickerMessages } from "./assets/date-picker/t9n";
 export declare class DatePicker implements LocalizedComponent, LoadableComponent, T9nComponent {
-  el: HTMLCalciteDatePickerElement;
   /** Specifies the component's active date. */
   activeDate: Date;
   activeDateWatcher(newActiveDate: Date): void;
@@ -76,6 +75,7 @@ export declare class DatePicker implements LocalizedComponent, LoadableComponent
   componentWillLoad(): Promise<void>;
   componentDidLoad(): void;
   render(): VNode;
+  el: HTMLCalciteDatePickerElement;
   /**
    * Active end date.
    */

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

@@ -2,7 +2,6 @@ import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { InteractiveComponent } from "../../utils/interactive";
 import { Scale } from "../interfaces";
 export declare class DatePickerDay implements InteractiveComponent {
-  el: HTMLCalciteDatePickerDayElement;
   /** Day of the month to be shown. */
   day: number;
   /**
@@ -58,5 +57,6 @@ export declare class DatePickerDay implements InteractiveComponent {
   componentDidRender(): void;
   disconnectedCallback(): void;
   isTabbable(): boolean;
+  el: HTMLCalciteDatePickerDayElement;
   private parentDatePickerEl;
 }

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

@@ -3,7 +3,6 @@ import { HoverRange } from "../../utils/date";
 import { DateLocaleData } from "../date-picker/utils";
 import { Scale } from "../interfaces";
 export declare class DatePickerMonth {
-  el: HTMLCalciteDatePickerMonthElement;
   /**
    * The DateTimeFormat used to provide screen reader labels.
    *
@@ -62,6 +61,7 @@ export declare class DatePickerMonth {
   disableActiveFocus: () => void;
   pointerOutHandler(): void;
   render(): VNode;
+  el: HTMLCalciteDatePickerMonthElement;
   private activeFocus;
   /**
    * Add n months to the current month

package/dist/types/components/date-picker-month-header/date-picker-month-header.d.ts

@@ -4,7 +4,6 @@ import { DateLocaleData } from "../date-picker/utils";
 import { HeadingLevel } from "../functional/Heading";
 import { Scale } from "../interfaces";
 export declare class DatePickerMonthHeader {
-  el: HTMLCalciteDatePickerMonthHeaderElement;
   /** Already selected date. */
   selectedDate: Date;
   /** Focused date with indicator (will become selected date if user proceeds) */
@@ -39,6 +38,7 @@ export declare class DatePickerMonthHeader {
   connectedCallback(): void;
   render(): VNode;
   renderContent(): VNode;
+  el: HTMLCalciteDatePickerMonthHeaderElement;
   private yearInput;
   private parentDatePickerEl;
   nextMonthDate: Date;

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

@@ -11,7 +11,6 @@ import { Scale } from "../interfaces";
  * @slot trigger - A slot for the element that triggers the `calcite-dropdown`.
  */
 export declare class Dropdown implements InteractiveComponent, LoadableComponent, OpenCloseComponent, FloatingUIComponent {
-  el: HTMLCalciteDropdownElement;
   /**
    * When `true`, displays and positions the component.
    */
@@ -106,6 +105,7 @@ export declare class Dropdown implements InteractiveComponent, LoadableComponent
   pointerLeaveHandler(): void;
   calciteInternalDropdownItemKeyEvent(event: CustomEvent<ItemKeyboardEvent>): void;
   handleItemSelect(event: CustomEvent<RequestedItem>): void;
+  el: HTMLCalciteDropdownElement;
   filteredFlipPlacements: EffectivePlacement[];
   private items;
   private groups;

package/dist/types/components/dropdown-group/dropdown-group.d.ts

@@ -5,7 +5,6 @@ import { RequestedItem } from "./interfaces";
  * @slot - A slot for adding `calcite-dropdown-item`s.
  */
 export declare class DropdownGroup {
-  el: HTMLCalciteDropdownGroupElement;
   /** Specifies and displays a group title. */
   groupTitle: string;
   /**
@@ -26,6 +25,7 @@ export declare class DropdownGroup {
   componentWillLoad(): void;
   render(): VNode;
   updateActiveItemOnChange(event: CustomEvent): void;
+  el: HTMLCalciteDropdownGroupElement;
   /** position of group within a dropdown */
   private groupPosition;
   /** the requested group */

package/dist/types/components/dropdown-item/dropdown-item.d.ts

@@ -7,7 +7,6 @@ import { LoadableComponent } from "../../utils/loadable";
  * @slot - A slot for adding text.
  */
 export declare class DropdownItem implements LoadableComponent {
-  el: HTMLCalciteDropdownItemElement;
   /** When `true`, the component is selected. */
   selected: boolean;
   /** Displays the `iconStart` and/or `iconEnd` as flipped when the element direction is right-to-left (`"rtl"`). */
@@ -47,6 +46,7 @@ export declare class DropdownItem implements LoadableComponent {
   onClick(): void;
   keyDownHandler(event: KeyboardEvent): void;
   updateActiveItemOnChange(event: CustomEvent): void;
+  el: HTMLCalciteDropdownItemElement;
   /** id of containing group */
   private parentDropdownGroupEl;
   /** requested group */

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

@@ -1,7 +1,6 @@
 import { VNode } from "../../stencil-public-runtime";
 import { ColorStop, DataSeries } from "./interfaces";
 export declare class Graph {
-  el: HTMLCalciteGraphElement;
   /**
    * Array of tuples describing a single data point ([x, y])
    * These data points should be sorted by x-axis value
@@ -23,6 +22,7 @@ export declare class Graph {
   connectedCallback(): void;
   disconnectedCallback(): void;
   render(): VNode;
+  el: HTMLCalciteGraphElement;
   private graphId;
   private resizeObserver;
 }

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

@@ -1,7 +1,6 @@
 import { VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
 export declare class Icon {
-  el: HTMLCalciteIconElement;
   /**
    * Displays a specific icon.
    *
@@ -26,6 +25,7 @@ export declare class Icon {
   disconnectedCallback(): void;
   componentWillLoad(): Promise<void>;
   render(): VNode;
+  el: HTMLCalciteIconElement;
   private intersectionObserver;
   private pathData;
   private visible;

package/dist/types/components/inline-editable/inline-editable.d.ts

@@ -10,7 +10,6 @@ import { InlineEditableMessages } from "./assets/inline-editable/t9n";
  * @slot - A slot for adding a `calcite-input`.
  */
 export declare class InlineEditable implements InteractiveComponent, LabelableComponent, LoadableComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteInlineEditableElement;
   /**
    * When `true`, interaction is prevented and the component is displayed with lower opacity.
    */
@@ -59,6 +58,7 @@ export declare class InlineEditable implements InteractiveComponent, LabelableCo
    */
   calciteInternalInlineEditableEnableEditingChange: EventEmitter<void>;
   blurHandler(): void;
+  el: HTMLCalciteInlineEditableElement;
   private inputElement;
   private valuePriorToEditing;
   private shouldEmitCancel;

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

@@ -12,7 +12,6 @@ import { InputPlacement, NumberNudgeDirection } from "./interfaces";
  * @slot action - A slot for positioning a `calcite-button` next to the component.
  */
 export declare class Input implements LabelableComponent, FormComponent, InteractiveComponent, T9nComponent, LocalizedComponent, LoadableComponent {
-  el: HTMLCalciteInputElement;
   /** Specifies the text alignment of the component's value. */
   alignment: Position;
   /**
@@ -210,6 +209,7 @@ export declare class Input implements LabelableComponent, FormComponent, Interac
   onMessagesChange(): void;
   valueWatcher(newValue: string, previousValue: string): void;
   updateRequestedIcon(): void;
+  el: HTMLCalciteInputElement;
   labelEl: HTMLCalciteLabelElement;
   formEl: HTMLFormElement;
   defaultValue: Input["value"];

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

@@ -13,7 +13,6 @@ import { InputDatePickerMessages } from "./assets/input-date-picker/t9n";
 import { FocusTrapComponent } from "../../utils/focusTrapComponent";
 import { FocusTrap } from "focus-trap";
 export declare class InputDatePicker implements FloatingUIComponent, FocusTrapComponent, FormComponent, InteractiveComponent, LabelableComponent, LoadableComponent, LocalizedComponent, OpenCloseComponent, T9nComponent {
-  el: HTMLCalciteInputDatePickerElement;
   /**
    * When `true`, interaction is prevented and the component is displayed with lower opacity.
    */
@@ -149,6 +148,7 @@ export declare class InputDatePicker implements FloatingUIComponent, FocusTrapCo
   componentDidRender(): void;
   render(): VNode;
   renderToggleIcon(open: boolean): VNode;
+  el: HTMLCalciteInputDatePickerElement;
   private datePickerEl;
   private dialogId;
   filteredFlipPlacements: EffectivePlacement[];

package/dist/types/components/input-message/input-message.d.ts

@@ -4,7 +4,6 @@ import { Scale, Status } from "../interfaces";
  * @slot - A slot for adding text.
  */
 export declare class InputMessage {
-  el: HTMLCalciteInputMessageElement;
   /** Specifies an icon to display. */
   icon: boolean | string;
   /** When `true`, the icon will be flipped when the element direction is right-to-left (`"rtl"`). */
@@ -16,6 +15,7 @@ export declare class InputMessage {
   handleIconEl(): void;
   connectedCallback(): void;
   render(): VNode;
+  el: HTMLCalciteInputMessageElement;
   /** the computed icon to render */
   private requestedIcon?;
   private renderIcon;

package/dist/types/components/input-number/input-number.d.ts

@@ -12,7 +12,6 @@ import { InputNumberMessages } from "./assets/input-number/t9n";
  * @slot action - A slot for positioning a button next to the component.
  */
 export declare class InputNumber implements LabelableComponent, FormComponent, InteractiveComponent, LocalizedComponent, T9nComponent, LoadableComponent {
-  el: HTMLCalciteInputNumberElement;
   /** Specifies the text alignment of the component's value. */
   alignment: Position;
   /**
@@ -176,6 +175,7 @@ export declare class InputNumber implements LabelableComponent, FormComponent, I
   onMessagesChange(): void;
   valueWatcher(newValue: string, previousValue: string): void;
   updateRequestedIcon(): void;
+  el: HTMLCalciteInputNumberElement;
   labelEl: HTMLCalciteLabelElement;
   formEl: HTMLFormElement;
   defaultValue: InputNumber["value"];

package/dist/types/components/input-text/input-text.d.ts

@@ -11,7 +11,6 @@ import { InputTextMessages } from "./assets/input-text/t9n";
  * @slot action - A slot for positioning a button next to the component.
  */
 export declare class InputText implements LabelableComponent, FormComponent, InteractiveComponent, LoadableComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteInputTextElement;
   /** Specifies the text alignment of the component's value. */
   alignment: Position;
   /**
@@ -144,6 +143,7 @@ export declare class InputText implements LabelableComponent, FormComponent, Int
   onMessagesChange(): void;
   valueWatcher(newValue: string, previousValue: string): void;
   updateRequestedIcon(): void;
+  el: HTMLCalciteInputTextElement;
   labelEl: HTMLCalciteLabelElement;
   formEl: HTMLFormElement;
   defaultValue: InputText["value"];

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

@@ -12,7 +12,6 @@ import { TimePickerMessages } from "../time-picker/assets/time-picker/t9n";
 import { T9nComponent } from "../../utils/t9n";
 import { InputTimePickerMessages } from "./assets/input-time-picker/t9n";
 export declare class InputTimePicker implements FloatingUIComponent, FocusTrapComponent, FormComponent, InteractiveComponent, LabelableComponent, LoadableComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteInputTimePickerElement;
   /** When `true`, displays the `calcite-time-picker` component. */
   open: boolean;
   openHandler(value: boolean): void;
@@ -81,6 +80,7 @@ export declare class InputTimePicker implements FloatingUIComponent, FocusTrapCo
   /** The time value in ISO (24-hour) format. */
   value: string;
   valueWatcher(newValue: string): void;
+  el: HTMLCalciteInputTimePickerElement;
   defaultValue: InputTimePicker["value"];
   formEl: HTMLFormElement;
   labelEl: HTMLCalciteLabelElement;

package/dist/types/components/input-time-zone/input-time-zone.d.ts

@@ -9,7 +9,6 @@ import { OverlayPositioning } from "../../utils/floating-ui";
 import { LoadableComponent } from "../../utils/loadable";
 import { FormComponent } from "../../utils/form";
 export declare class InputTimeZone implements FormComponent, InteractiveComponent, LabelableComponent, LoadableComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteInputTimeZoneElement;
   /**
    * When `true`, interaction is prevented and the component is displayed with lower opacity.
    */
@@ -71,6 +70,7 @@ export declare class InputTimeZone implements FormComponent, InteractiveComponen
   calciteInputTimeZoneChange: EventEmitter<void>;
   calciteInputTimeZoneClose: EventEmitter<void>;
   calciteInputTimeZoneOpen: EventEmitter<void>;
+  el: HTMLCalciteInputTimeZoneElement;
   private comboboxEl;
   defaultMessages: InputTimeZoneMessages;
   defaultValue: InputTimeZone["value"];

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

@@ -4,7 +4,6 @@ import { Alignment, Scale } from "../interfaces";
  * @slot - A slot for adding text and a component that can be labeled.
  */
 export declare class Label {
-  el: HTMLCalciteLabelElement;
   /** Specifies the text alignment of the component. */
   alignment: Alignment;
   /** Specifies the `id` of the component the label is bound to. Use when the component the label is bound to does not reside within the component. */
@@ -19,6 +18,7 @@ export declare class Label {
   calciteInternalLabelClick: EventEmitter<{
     sourceEvent: MouseEvent;
   }>;
+  el: HTMLCalciteLabelElement;
   labelClickHandler: (event: MouseEvent) => void;
   connectedCallback(): void;
   disconnectedCallback(): void;

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

@@ -7,7 +7,6 @@ import { FlipContext } from "../interfaces";
 /** It is the consumers responsibility to add aria information, rel, target, for links, and any link attributes for form submission */
 /** @slot - A slot for adding text. */
 export declare class Link implements InteractiveComponent, LoadableComponent {
-  el: HTMLCalciteLinkElement;
   /** When `true`, interaction is prevented and the component is displayed with lower opacity. */
   disabled: boolean;
   /**
@@ -37,6 +36,7 @@ export declare class Link implements InteractiveComponent, LoadableComponent {
   clickHandler(event: PointerEvent): void;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
+  el: HTMLCalciteLinkElement;
   /** the rendered child element */
   private childEl;
   private childElClickHandler;

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

@@ -1,7 +1,6 @@
 import { VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
 export declare class Loader {
-  el: HTMLCalciteLoaderElement;
   /** When `true`, displays smaller and appears to the left of the text. */
   inline: boolean;
   /** Accessible name for the component. */
@@ -20,6 +19,7 @@ export declare class Loader {
   /** Text that displays under the component's indicator. */
   text: string;
   render(): VNode;
+  el: HTMLCalciteLoaderElement;
   /**
    * Return the proper sizes based on the scale property
    *

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

@@ -6,7 +6,6 @@ import { MenuMessages } from "./assets/menu/t9n";
 import { GlobalAttrComponent } from "../../utils/globalAttributes";
 type Layout = "horizontal" | "vertical";
 export declare class CalciteMenu implements GlobalAttrComponent, LocalizedComponent, T9nComponent, LoadableComponent {
-  el: HTMLCalciteMenuElement;
   /**
    * Accessible name for the component.
    */
@@ -27,6 +26,7 @@ export declare class CalciteMenu implements GlobalAttrComponent, LocalizedCompon
    * @internal
    */
   messages: MenuMessages;
+  el: HTMLCalciteMenuElement;
   defaultMessages: MenuMessages;
   effectiveLocale: string;
   effectiveLocaleChange(): void;

package/dist/types/components/menu-item/menu-item.d.ts

@@ -11,7 +11,6 @@ type Layout = "horizontal" | "vertical";
  * @slot submenu-item - A slot for adding `calcite-menu-item`s in a submenu.
  */
 export declare class CalciteMenuItem implements LoadableComponent, T9nComponent, LocalizedComponent {
-  el: HTMLCalciteMenuItemElement;
   /** When `true`, the component is highlighted. */
   active: boolean;
   /** When `true`, the component displays a breadcrumb trail for use as a navigational aid. */
@@ -65,6 +64,7 @@ export declare class CalciteMenuItem implements LoadableComponent, T9nComponent,
    * @internal
    */
   topLevelMenuLayout: Layout;
+  el: HTMLCalciteMenuItemElement;
   defaultMessages: MenuItemMessages;
   effectiveLocale: string;
   effectiveLocaleChange(): void;

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

@@ -17,7 +17,6 @@ import { ModalMessages } from "./assets/modal/t9n";
  * @slot back - A slot for adding a back button.
  */
 export declare class Modal implements ConditionalSlotComponent, OpenCloseComponent, FocusTrapComponent, LoadableComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteModalElement;
   /** When `true`, displays and positions the component.  */
   open: boolean;
   /** Passes a function to run before the component closes. */
@@ -71,6 +70,7 @@ export declare class Modal implements ConditionalSlotComponent, OpenCloseCompone
   renderContentBottom(): VNode;
   renderCloseButton(): VNode;
   renderStyle(): VNode;
+  el: HTMLCalciteModalElement;
   modalContent: HTMLDivElement;
   initialOverflowCSS: string;
   private mutationObserver;

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

@@ -12,7 +12,6 @@ import { LoadableComponent } from "../../utils/loadable";
  * @slot navigation-tertiary - A slot for adding a `calcite-navigation` component in the tertiary navigation level.  Components rendered here will not display `calcite-navigation-logo` or `calcite-navigation-user` components.
  */
 export declare class CalciteNavigation implements LoadableComponent {
-  el: HTMLCalciteNavigationElement;
   /**
    * When `navigationAction` is `true`, specifies the label of the `calcite-action`.
    */
@@ -21,6 +20,7 @@ export declare class CalciteNavigation implements LoadableComponent {
    * When `true`, displays a `calcite-action` and emits a `calciteNavActionSelect` event on selection change.
    */
   navigationAction: boolean;
+  el: HTMLCalciteNavigationElement;
   logoSlotHasElements: boolean;
   navigationActionSlotHasElements: boolean;
   primaryContentCenterSlotHasElements: boolean;

package/dist/types/components/navigation-logo/navigation-logo.d.ts

@@ -1,7 +1,6 @@
 import { VNode } from "../../stencil-public-runtime";
 import { LoadableComponent } from "../../utils/loadable";
 export declare class CalciteNavigationLogo implements LoadableComponent {
-  el: HTMLCalciteNavigationLogoElement;
   /** When true, the component is highlighted. */
   active: boolean;
   /** Specifies the URL destination of the component, which can be set as an absolute or relative path.*/
@@ -28,6 +27,7 @@ export declare class CalciteNavigationLogo implements LoadableComponent {
   thumbnail: string;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
+  el: HTMLCalciteNavigationLogoElement;
   componentWillLoad(): void;
   componentDidLoad(): void;
   render(): VNode;

package/dist/types/components/navigation-user/navigation-user.d.ts

@@ -1,7 +1,6 @@
 import { VNode } from "../../stencil-public-runtime";
 import { LoadableComponent } from "../../utils/loadable";
 export declare class CalciteNavigationUser implements LoadableComponent {
-  el: HTMLCalciteNavigationUserElement;
   /** When true, the component is highlighted.*/
   active: boolean;
   /** Specifies the full name of the user.*/
@@ -18,6 +17,7 @@ export declare class CalciteNavigationUser implements LoadableComponent {
   username: string;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
+  el: HTMLCalciteNavigationUserElement;
   componentWillLoad(): void;
   componentDidLoad(): void;
   render(): VNode;

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

@@ -18,7 +18,6 @@ import { NoticeMessages } from "./assets/notice/t9n";
  * @slot actions-end - A slot for adding `calcite-action`s to the end of the component. It is recommended to use two or less actions.
  */
 export declare class Notice implements ConditionalSlotComponent, LoadableComponent, T9nComponent, LocalizedComponent {
-  el: HTMLCalciteNoticeElement;
   /** When `true`, the component is visible. */
   open: boolean;
   /** Specifies the kind of the component (will apply to top border and icon). */
@@ -59,6 +58,7 @@ export declare class Notice implements ConditionalSlotComponent, LoadableCompone
   /** Sets focus on the component's first focusable element. */
   setFocus(): Promise<void>;
   private close;
+  el: HTMLCalciteNoticeElement;
   /** The close button element. */
   private closeButton?;
   /** The computed icon to render. */

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

@@ -57,12 +57,12 @@ export declare class PickList<ItemElement extends HTMLCalcitePickListItemElement
    * When `true` and single selection is enabled, the selection changes when navigating `calcite-pick-list-item`s via keyboard.
    */
   selectionFollowsFocus: boolean;
+  el: HTMLCalcitePickListElement;
   selectedValues: Map<string, ItemElement>;
   dataForFilter: ItemData;
   items: ItemElement[];
   lastSelectedItem: ItemElement;
   mutationObserver: import("../../utils/observers").ExtendedMutationObserver;
-  el: HTMLCalcitePickListElement;
   emitCalciteListChange: () => void;
   emitCalciteListFilter: () => void;
   filterEl: HTMLCalciteFilterElement;

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

@@ -102,9 +102,9 @@ export declare class Popover implements FloatingUIComponent, OpenCloseComponent,
    * This property can be set to `true` to manage when the component is open.
    */
   triggerDisabled: boolean;
+  el: HTMLCalcitePopoverElement;
   mutationObserver: MutationObserver;
   filteredFlipPlacements: EffectivePlacement[];
-  el: HTMLCalcitePopoverElement;
   effectiveLocale: string;
   floatingLayout: FloatingLayout;
   effectiveLocaleChange(): void;

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

@@ -5,7 +5,6 @@ import { LabelableComponent } from "../../utils/label";
 import { LoadableComponent } from "../../utils/loadable";
 import { Scale } from "../interfaces";
 export declare class RadioButton implements LabelableComponent, CheckableFormComponent, InteractiveComponent, LoadableComponent {
-  el: HTMLCalciteRadioButtonElement;
   /** When `true`, the component is checked. */
   checked: boolean;
   checkedChanged(newChecked: boolean): void;
@@ -54,6 +53,7 @@ export declare class RadioButton implements LabelableComponent, CheckableFormCom
   scale: Scale;
   /** The component's value. */
   value: any;
+  el: HTMLCalciteRadioButtonElement;
   labelEl: HTMLCalciteLabelElement;
   formEl: HTMLFormElement;
   defaultChecked: boolean;

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

@@ -5,7 +5,6 @@ import { LoadableComponent } from "../../utils/loadable";
  * @slot - A slot for adding `calcite-radio-button`s.
  */
 export declare class RadioButtonGroup implements LoadableComponent {
-  el: HTMLCalciteRadioButtonGroupElement;
   /** When `true`, interaction is prevented and the component is displayed with lower opacity. */
   disabled: boolean;
   onDisabledChange(): void;
@@ -28,6 +27,7 @@ export declare class RadioButtonGroup implements LoadableComponent {
   /** Specifies the size of the component. */
   scale: Scale;
   onScaleChange(): void;
+  el: HTMLCalciteRadioButtonGroupElement;
   mutationObserver: import("../../utils/observers").ExtendedMutationObserver;
   radioButtons: HTMLCalciteRadioButtonElement[];
   connectedCallback(): void;

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

@@ -8,7 +8,6 @@ import { T9nComponent } from "../../utils/t9n";
 import { Scale } from "../interfaces";
 import { RatingMessages } from "./assets/rating/t9n";
 export declare class Rating implements LabelableComponent, FormComponent, InteractiveComponent, LoadableComponent, LocalizedComponent, T9nComponent {
-  el: HTMLCalciteRatingElement;
   /** Specifies a cumulative average from previous ratings to display. */
   average: number;
   /** Specifies the number of previous ratings to display. */
@@ -82,6 +81,7 @@ export declare class Rating implements LabelableComponent, FormComponent, Intera
   private handleLabelPointerDown;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
+  el: HTMLCalciteRatingElement;
   labelEl: HTMLCalciteLabelElement;
   formEl: HTMLFormElement;
   defaultValue: Rating["value"];