@esri/calcite-components 1.0.0-beta.63 → 1.0.0-beta.67

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

@@ -2,10 +2,11 @@ import { Scale, Status } from "../interfaces";
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { InputPlacement } from "./interfaces";
 import { Position } from "../interfaces";
+import { LabelableComponent } from "../../utils/label";
 /**
  * @slot action - A slot for positioning a button next to an input
  */
-export declare class CalciteInput {
+export declare class CalciteInput implements LabelableComponent {
   el: HTMLCalciteInputElement;
   /** specify the alignment of the value of the input */
   alignment: Position;
@@ -14,9 +15,9 @@ export declare class CalciteInput {
   /** optionally display a clear button that displays when field has a value
    * shows by default for search, time, date
    * will not display for type="textarea" */
-  clearable?: boolean;
+  clearable: boolean;
   /** is the input disabled  */
-  disabled?: boolean;
+  disabled: boolean;
   disabledWatcher(): void;
   /** for number values, displays the locale's group separator */
   groupSeparator: boolean;
@@ -30,7 +31,7 @@ export declare class CalciteInput {
    */
   intlLoading?: string;
   /** flip the icon in rtl */
-  iconFlipRtl?: boolean;
+  iconFlipRtl: boolean;
   /** Applies to the aria-label attribute on the button or hyperlink */
   label?: string;
   /** specify if the input is in loading state */
@@ -89,6 +90,7 @@ export declare class CalciteInput {
   value?: string;
   valueWatcher(newValue: string): void;
   updateRequestedIcon(): void;
+  labelEl: HTMLCalciteLabelElement;
   /** keep track of the rendered child type */
   private childEl?;
   /** keep track of the rendered child type */
@@ -131,8 +133,9 @@ export declare class CalciteInput {
    */
   calciteInputChange: EventEmitter;
   keyDownHandler(event: KeyboardEvent): void;
-  /** focus the rendered child element */
+  /** Sets focus on the component. */
   setFocus(): Promise<void>;
+  onLabelClick: () => void;
   private clearInputValue;
   private inputBlurHandler;
   private inputFocusHandler;

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

@@ -1,9 +1,10 @@
 import { VNode, EventEmitter } from "../../stencil-public-runtime";
 import { HeadingLevel } from "../functional/CalciteHeading";
+import { LabelableComponent } from "../../utils/label";
 import { OverlayPositioning } from "../../utils/popper";
 import { StrictModifiers } from "@popperjs/core";
 import { DateRangeChange } from "../calcite-date-picker/interfaces";
-export declare class CalciteInputDatePicker {
+export declare class CalciteInputDatePicker implements LabelableComponent {
   el: HTMLCalciteInputDatePickerElement;
   /** Selected date */
   value?: string;
@@ -41,7 +42,7 @@ export declare class CalciteInputDatePicker {
   /** specify the scale of the date picker */
   scale: "s" | "m" | "l";
   /** Range mode activation */
-  range?: boolean;
+  range: boolean;
   /** Selected start date */
   start?: string;
   /** Selected end date */
@@ -49,7 +50,7 @@ export declare class CalciteInputDatePicker {
   /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
   overlayPositioning: OverlayPositioning;
   /** Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range. */
-  proximitySelectionDisabled?: boolean;
+  proximitySelectionDisabled: boolean;
   /** Layout */
   layout: "horizontal" | "vertical";
   calciteDaySelectHandler(): void;
@@ -70,13 +71,18 @@ export declare class CalciteInputDatePicker {
    * @internal
    */
   calciteInputDatePickerClose: EventEmitter;
+  /** Updates the position of the component. */
+  setFocus(): Promise<void>;
+  /** Updates the position of the component. */
   reposition(): Promise<void>;
   connectedCallback(): void;
   componentWillLoad(): Promise<void>;
   disconnectedCallback(): void;
   render(): VNode;
+  labelEl: HTMLCalciteLabelElement;
   focusedInput: "start" | "end";
   private localeData;
+  private startInput;
   private endInput;
   private popper;
   private menuEl;
@@ -85,7 +91,9 @@ export declare class CalciteInputDatePicker {
   private endWrapper;
   private activeTransitionProp;
   setReferenceEl(): void;
+  onLabelClick: () => void;
   transitionEnd: (event: TransitionEvent) => void;
+  setStartInput: (el: HTMLCalciteInputElement) => void;
   setEndInput: (el: HTMLCalciteInputElement) => void;
   deactivate: () => void;
   keyUpHandler: (e: KeyboardEvent) => void;
@@ -103,14 +111,7 @@ export declare class CalciteInputDatePicker {
   startWatcher(start: string): void;
   endWatcher(end: string): void;
   private loadLocaleData;
-  /**
-   * Update date instance of start if valid
-   */
-  private setStartAsDate;
-  /**
-   * Update date instance of end if valid
-   */
-  private setEndAsDate;
+  private clearCurrentValue;
   /**
    * If inputted string is a valid date, update value/active
    */
@@ -123,7 +124,7 @@ export declare class CalciteInputDatePicker {
    * Event handler for when the selected date changes
    */
   handleDateChange: (event: CustomEvent<Date>) => void;
-  private focusInputEnd;
+  private shouldFocusRangeStart;
   private shouldFocusRangeEnd;
   private handleDateRangeChange;
   /**

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

@@ -1,7 +1,11 @@
 import { VNode } from "../../stencil-public-runtime";
 import { Scale, Status } from "../interfaces";
+/**
+ * @slot - A slot for adding text.
+ */
 export declare class CalciteInputMessage {
   el: HTMLCalciteInputMessageElement;
+  /** Indicates whether the message is displayed. */
   active: boolean;
   /** when used as a boolean set to true, show a default icon based on status. You can
    * also pass a calcite-ui-icon name to this prop to display a custom icon */

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

@@ -1,12 +1,13 @@
 import { VNode, EventEmitter } from "../../stencil-public-runtime";
 import { HourDisplayFormat } from "../../utils/time";
 import { Scale } from "../interfaces";
-export declare class CalciteInputTimePicker {
+import { LabelableComponent } from "../../utils/label";
+export declare class CalciteInputTimePicker implements LabelableComponent {
   el: HTMLCalciteInputTimePickerElement;
   /** The active state of the time input */
-  active?: boolean;
+  active: boolean;
   /** The disabled state of the time input */
-  disabled?: boolean;
+  disabled: boolean;
   /** Format of the hour value (12-hour or 24-hour) (this will be replaced by locale eventually) */
   hourDisplayFormat: HourDisplayFormat;
   /** aria-label for the hour input */
@@ -42,8 +43,8 @@ export declare class CalciteInputTimePicker {
   /** The selected time */
   value: string;
   valueWatcher(newValue: string): void;
+  labelEl: HTMLCalciteLabelElement;
   private calciteInputEl;
-  private calciteTimePickerEl;
   /** whether the value of the input was changed as a result of user typing or not */
   private internalValueChange;
   private previousValidValue;
@@ -55,17 +56,18 @@ export declare class CalciteInputTimePicker {
   private calciteInputBlurHandler;
   private calciteInputFocusHandler;
   private calciteInputInputHandler;
-  clickHandler(event: MouseEvent): void;
   keyUpHandler(event: KeyboardEvent): void;
   timePickerBlurHandler(event: CustomEvent): void;
   timePickerChangeHandler(event: CustomEvent): void;
   timePickerFocusHandler(event: CustomEvent): void;
+  /** Sets focus on the component. */
   setFocus(): Promise<void>;
+  onLabelClick: () => void;
   private setCalciteInputEl;
-  private setCalciteTimePickerEl;
   private setInputValue;
   private setValue;
   connectedCallback(): void;
   componentDidLoad(): void;
+  disconnectedCallback(): void;
   render(): VNode;
 }

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

@@ -1,6 +1,8 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
-import { FocusRequest } from "./interfaces";
 import { Alignment, Scale, Status } from "../interfaces";
+/**
+ * @slot - A slot for adding text and a component that can be labeled.
+ */
 export declare class CalciteLabel {
   el: HTMLCalciteLabelElement;
   /** specify the text alignment of the label */
@@ -9,19 +11,20 @@ export declare class CalciteLabel {
   status: Status;
   /** The id of the input associated with the label */
   for: string;
-  /** specify the scale of the input, defaults to m */
+  /** specify the scale of the label, defaults to m */
   scale: Scale;
   /** is the wrapped element positioned inline with the label slotted text */
   layout: "inline" | "inline-space-between" | "default";
   /** eliminates any space around the label */
-  disableSpacing?: boolean;
+  disableSpacing: boolean;
   /** is the label disabled  */
-  disabled?: boolean;
+  disabled: boolean;
   /**
    * @internal
    */
-  calciteLabelFocus: EventEmitter<FocusRequest>;
-  onClick(event: MouseEvent): void;
-  private handleCalciteHtmlForClicks;
+  calciteInternalLabelClick: EventEmitter<{
+    sourceEvent: MouseEvent;
+  }>;
+  labelClickHandler: (event: MouseEvent) => void;
   render(): VNode;
 }

package/dist/types/components/calcite-label/resources.d.ts

@@ -0,0 +1,3 @@
+export declare const CSS: {
+  container: string;
+};

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

@@ -3,11 +3,11 @@ import { FlipContext } from "../interfaces";
 /** Any attributes placed on <calcite-link> component will propagate to the rendered child */
 /** Passing a 'href' will render an anchor link, instead of a span. Role will be set to link, or link, depending on this. */
 /** It is the consumers responsibility to add aria information, rel, target, for links, and any link attributes for form submission */
-/** @slot - default text slot for link text */
+/** @slot - A slot for adding text. */
 export declare class CalciteLink {
   el: HTMLCalciteLinkElement;
   /** is the link disabled  */
-  disabled?: boolean;
+  disabled: boolean;
   /** optionally pass a href - used to determine if the component should render as a link or an anchor */
   href?: string;
   /** optionally pass an icon to display at the end of a button - accepts calcite ui icon names  */
@@ -22,6 +22,7 @@ export declare class CalciteLink {
   target?: string;
   connectedCallback(): void;
   render(): VNode;
+  /** Sets focus on the component. */
   setFocus(): Promise<void>;
   /** the rendered child element */
   private childEl;

package/dist/types/components/calcite-list-item/calcite-list-item.d.ts

@@ -1,10 +1,10 @@
 import { VNode } from "../../stencil-public-runtime";
 /**
+ * @slot - A slot for adding `calcite-list-item` and `calcite-list-item-group` elements.
  * @slot actions-start - A slot for adding actionable `calcite-action` elements before the content of the list item.
  * @slot content-start - A slot for adding non-actionable elements before the label and description of the list item.
  * @slot content-end - A slot for adding non-actionable elements after the label and description of the list item.
  * @slot actions-end - A slot for adding actionable `calcite-action` elements after the content of the list item.
- * @slot - A slot for adding `calcite-list-item` and `calcite-list-item-group` elements.
  */
 export declare class CalciteListItem {
   /**
@@ -20,7 +20,7 @@ export declare class CalciteListItem {
    */
   disabled: boolean;
   /**
-   * @todo The label of the list item.
+   * The label text of the list item. This will appear above the description text.
    */
   label: string;
   el: HTMLCalciteListItemElement;

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

@@ -17,7 +17,7 @@ export declare class CalciteLoader {
   /** Text which should appear under the loading indicator (optional) */
   text: string;
   /** Turn off spacing around the loader */
-  noPadding?: boolean;
+  noPadding: boolean;
   render(): VNode;
   /**
    * Return the proper sizes based on the scale property

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

@@ -11,13 +11,13 @@ import { ModalBackgroundColor } from "./interfaces";
 export declare class CalciteModal {
   el: HTMLCalciteModalElement;
   /** Add the active attribute to open the modal */
-  active?: boolean;
+  active: boolean;
   /** Optionally pass a function to run before close */
   beforeClose: (el: HTMLElement) => Promise<void>;
   /** Disables the display a close button within the Modal */
-  disableCloseButton?: boolean;
+  disableCloseButton: boolean;
   /** Disables the closing of the Modal when clicked outside. */
-  disableOutsideClose?: boolean;
+  disableOutsideClose: boolean;
   /** Aria label for the close button */
   intlClose: string;
   /** Prevent the modal from taking up the entire screen on mobile */
@@ -25,7 +25,7 @@ export declare class CalciteModal {
   /** Specify an element to focus when the modal is first opened */
   firstFocus?: HTMLElement;
   /** Flag to disable the default close on escape behavior */
-  disableEscape?: boolean;
+  disableEscape: boolean;
   /** specify the scale of modal, defaults to m */
   scale: Scale;
   /** Set the width of the modal. Can use stock sizes or pass a number (in pixels) */
@@ -38,7 +38,7 @@ export declare class CalciteModal {
   /** Background color of modal content */
   backgroundColor: ModalBackgroundColor;
   /** Turn off spacing around the content area slot */
-  noPadding?: boolean;
+  noPadding: boolean;
   componentWillLoad(): void;
   connectedCallback(): void;
   disconnectedCallback(): void;

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

@@ -19,7 +19,7 @@ export declare class CalciteNotice {
   /** Color for the notice (will apply to top border and icon) */
   color: StatusColor;
   /** Optionally show a button the user can click to dismiss the notice */
-  dismissible?: boolean;
+  dismissible: boolean;
   /** when used as a boolean set to true, show a default recommended icon. You can
    * also pass a calcite-ui-icon name to this prop to display a requested icon */
   icon: string | boolean;
@@ -39,7 +39,7 @@ export declare class CalciteNotice {
   calciteNoticeClose: EventEmitter;
   /** Fired when an Notice is opened */
   calciteNoticeOpen: EventEmitter;
-  /** focus the close button, if present and requested */
+  /** Sets focus on the component. */
   setFocus(): Promise<void>;
   private close;
   /** the close button element */

package/dist/types/components/calcite-option-group/calcite-option-group.d.ts

@@ -1,4 +1,7 @@
 import { VNode } from "../../stencil-public-runtime";
+/**
+ * @slot - A slot for adding `calcite-option`s.
+ */
 export declare class CalciteOptionGroup {
   /**
    * When true, it prevents selection from any of its associated options.

package/dist/types/components/calcite-pagination/calcite-pagination.d.ts

@@ -12,11 +12,11 @@ export declare class CalcitePagination {
   start: number;
   /** total number of items */
   total: number;
-  /** title of the next button
+  /** Used as an accessible label (aria-label) for the next button
    * @default "Next"
    */
   textLabelNext: string;
-  /** title of the previous button
+  /** Used as an accessible label (aria-label) of the previous button
    * @default "Previous"
    */
   textLabelPrevious: string;

package/dist/types/components/calcite-panel/calcite-panel.d.ts

@@ -2,13 +2,14 @@ import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
 import { HeadingLevel } from "../functional/CalciteHeading";
 /**
- * @slot header-actions-start - a slot for adding actions or content to the start side of the panel header.
- * @slot header-actions-end - a slot for adding actions or content to the end side of the panel header.
- * @slot header-content - a slot for adding custom content to the header.
- * @slot header-menu-actions - a slot for adding an overflow menu with actions inside a dropdown.
- * @slot fab - a slot for adding a `calcite-fab` (floating action button) to perform an action.
- * @slot footer-actions - a slot for adding buttons to the footer.
- * @slot footer - a slot for adding custom content to the footer.
+ * @slot - A slot for adding custom content.
+ * @slot header-actions-start - A slot for adding actions or content to the start side of the panel header.
+ * @slot header-actions-end - A slot for adding actions or content to the end side of the panel header.
+ * @slot header-content - A slot for adding custom content to the header.
+ * @slot header-menu-actions - A slot for adding an overflow menu with actions inside a dropdown.
+ * @slot fab - A slot for adding a `calcite-fab` (floating action button) to perform an action.
+ * @slot footer-actions - A slot for adding buttons to the footer.
+ * @slot footer - A slot for adding custom content to the footer.
  */
 export declare class CalcitePanel {
   /**
@@ -95,6 +96,7 @@ export declare class CalcitePanel {
   dismiss: () => void;
   panelScrollHandler: () => void;
   backButtonClick: () => void;
+  /** Sets focus on the component. */
   setFocus(focusId?: "dismiss-button" | "back-button"): Promise<void>;
   renderBackButton(): VNode;
   renderHeaderContent(): VNode;

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

@@ -42,7 +42,7 @@ export declare class CalcitePickList<ItemElement extends HTMLCalcitePickListItem
   dataForFilter: ItemData;
   items: ItemElement[];
   lastSelectedItem: ItemElement;
-  observer: MutationObserver;
+  mutationObserver: MutationObserver;
   el: HTMLCalcitePickListElement;
   emitCalciteListChange: () => void;
   filterEl: HTMLCalciteFilterElement;
@@ -65,7 +65,9 @@ export declare class CalcitePickList<ItemElement extends HTMLCalcitePickListItem
   handleFilter: any;
   getItemData: any;
   keyDownHandler: any;
+  /** Returns the currently selected items */
   getSelectedItems(): Promise<Map<string, HTMLCalcitePickListItemElement>>;
+  /** Sets focus on the component. */
   setFocus(focusId?: ListFocusId): Promise<void>;
   getIconType(): ICON_TYPES;
   render(): VNode;

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

@@ -47,7 +47,7 @@ export declare class CalcitePickListItem {
   selected: boolean;
   selectedWatchHandler(): void;
   /**
-   * The text for the remove item buttons. Only applicable if removable is true.
+   * Used as an accessible label (aria-label) for the "remove item" action. Only applicable if removable is true.
    * @default "Remove"
    */
   intlRemove: string;
@@ -90,6 +90,7 @@ export declare class CalcitePickListItem {
    * The first argument allows the value to be coerced, rather than swapping values.
    */
   toggleSelected(coerce?: boolean): Promise<void>;
+  /** Sets focus on the component. */
   setFocus(): Promise<void>;
   pickListClickHandler: (event: MouseEvent) => void;
   pickListKeyDownHandler: (event: KeyboardEvent) => void;

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

@@ -2,6 +2,9 @@ import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { PopperPlacement, OverlayPositioning } from "../../utils/popper";
 import { StrictModifiers, Placement, Instance as Popper } from "@popperjs/core";
 import { HeadingLevel } from "../functional/CalciteHeading";
+/**
+ * @slot - A slot for adding custom content.
+ */
 export declare class CalcitePopover {
   /**
    * Display a close button within the Popover.
@@ -81,8 +84,11 @@ export declare class CalcitePopover {
   calcitePopoverClose: EventEmitter;
   /** Fired when the popover is opened */
   calcitePopoverOpen: EventEmitter;
+  /** Updates the position of the component. */
   reposition(): Promise<void>;
+  /** Sets focus on the component. */
   setFocus(focusId?: "close-button"): Promise<void>;
+  /** Toggles the popover's open property. */
   toggle(value?: boolean): Promise<void>;
   setUpReferenceElement: () => void;
   getId: () => string;

package/dist/types/components/calcite-popover-manager/calcite-popover-manager.d.ts

@@ -12,7 +12,7 @@ export declare class CalcitePopoverManager {
   /**
    * Automatically closes any currently open popovers when clicking outside of a popover.
    */
-  autoClose?: boolean;
+  autoClose: boolean;
   render(): VNode;
   getRelatedPopover: (element: HTMLElement) => HTMLCalcitePopoverElement;
   closeOpenPopovers(event: Event): void;

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

@@ -3,17 +3,17 @@ export declare class CalciteRadio {
   /** The checked state of the radio. */
   checked: boolean;
   /** The disabled state of the radio. */
-  disabled?: boolean;
+  disabled: boolean;
   /**
    * The focused state of the radio.
-   * @private
+   * @internal
    */
   focused: boolean;
   /** The radio's hidden status. */
   hidden: boolean;
   /**
    * The hovered state of the radio.
-   * @private
+   * @internal
    */
   hovered: boolean;
   /** The scale (size) of the radio. */

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

@@ -1,6 +1,7 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
-export declare class CalciteRadioButton {
+import { LabelableComponent } from "../../utils/label";
+export declare class CalciteRadioButton implements LabelableComponent {
   el: HTMLCalciteRadioButtonElement;
   /** The checked state of the radio button. */
   checked: boolean;
@@ -10,7 +11,7 @@ export declare class CalciteRadioButton {
   disabledChanged(disabled: boolean): void;
   /**
    * The focused state of the radio button.
-   * @private
+   * @internal
    */
   focused: boolean;
   focusedChanged(focused: boolean): void;
@@ -21,7 +22,7 @@ export declare class CalciteRadioButton {
   hiddenChanged(newHidden: boolean): void;
   /**
    * The hovered state of the radio button.
-   * @private
+   * @internal
    */
   hovered: boolean;
   /**
@@ -39,16 +40,27 @@ export declare class CalciteRadioButton {
   scale: Scale;
   /** The value of the radio button. */
   value: any;
+  labelEl: HTMLCalciteLabelElement;
   private initialChecked;
   private inputEl;
   private rootNode;
+  /** Sets focus on the component. */
   setFocus(): Promise<void>;
+  selectItem: (items: HTMLCalciteRadioButtonElement[], selectedIndex: number) => void;
+  toggle: () => void;
+  private clickHandler;
+  onLabelClick: (event: CustomEvent) => void;
   private checkLastRadioButton;
   /** @internal */
   emitCheckedChange(): Promise<void>;
   private setInputEl;
   private uncheckAllRadioButtonsInGroup;
   private uncheckOtherRadioButtonsInGroup;
+  /**
+   * Fires when the radio button is blurred.
+   * @internal
+   */
+  calciteInternalRadioButtonBlur: EventEmitter;
   /**
    * Fires only when the radio button is checked.  This behavior is identical to the native HTML input element.
    * Since this event does not fire when the radio button is unchecked, it's not recommended to attach a listener for this event
@@ -61,13 +73,12 @@ export declare class CalciteRadioButton {
    * Use calciteRadioButtonChange or calciteRadioButtonGroupChange for responding to changes in the checked value for forms.
    * @internal
    */
-  calciteRadioButtonCheckedChange: EventEmitter;
+  calciteInternalRadioButtonCheckedChange: EventEmitter;
   /**
-   * Fires when the radio button is either focused or blurred.
+   * Fires when the radio button is focused.
    * @internal
    */
-  calciteRadioButtonFocusedChange: EventEmitter;
-  check(event: MouseEvent | FocusEvent): void;
+  calciteInternalRadioButtonFocus: EventEmitter;
   mouseenter(): void;
   mouseleave(): void;
   private formResetHandler;

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

@@ -1,5 +1,8 @@
 import { VNode, EventEmitter } from "../../stencil-public-runtime";
 import { Layout, Scale } from "../interfaces";
+/**
+ * @slot - A slot for adding `calcite-radio-button`s.
+ */
 export declare class CalciteRadioButtonGroup {
   el: HTMLCalciteRadioButtonGroupElement;
   /** The disabled state of the radio button group. */
@@ -21,7 +24,7 @@ export declare class CalciteRadioButtonGroup {
   connectedCallback(): void;
   private passPropsToRadioButtons;
   /**
-   * @todo doc
+   * Emitted when the radio button group has changed.
    */
   calciteRadioButtonGroupChange: EventEmitter;
   radioButtonChangeHandler(event: CustomEvent): void;

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

@@ -1,12 +1,16 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Layout, Scale, Width } from "../interfaces";
+import { LabelableComponent } from "../../utils/label";
 import { RadioAppearance } from "./interfaces";
-export declare class CalciteRadioGroup {
+/**
+ * @slot - A slot for adding `calcite-radio-group-item`s.
+ */
+export declare class CalciteRadioGroup implements LabelableComponent {
   el: HTMLCalciteRadioGroupElement;
   /** specify the appearance style of the radio group, defaults to solid. */
   appearance: RadioAppearance;
   /** is the radio group disabled  */
-  disabled?: boolean;
+  disabled: boolean;
   /** specify the layout of the radio group, defaults to horizontal */
   layout: Layout;
   /**
@@ -24,18 +28,20 @@ export declare class CalciteRadioGroup {
   /** specify the width of the group, defaults to auto */
   width: Extract<"auto" | "full", Width>;
   connectedCallback(): void;
+  disconnectedCallback(): void;
   componentDidLoad(): void;
   render(): VNode;
-  handleLabelFocus(e: Record<string, any>): void;
-  protected handleClick(event: MouseEvent): void;
+  protected handleClick: (event: MouseEvent) => void;
   protected handleSelected(event: Event): void;
   protected handleKeyDown(event: KeyboardEvent): void;
   /** Fired when the selected option changes, event detail is the new value */
   calciteRadioGroupChange: EventEmitter<string>;
-  /** Focuses the selected item. If there is no selection, it focuses the first item. */
+  /** Sets focus on the component. */
   setFocus(): Promise<void>;
+  labelEl: HTMLCalciteLabelElement;
   private hiddenInput;
   private hasLoaded;
+  onLabelClick: () => void;
   private getItems;
   private selectItem;
   private syncWithInputProxy;

package/dist/types/components/calcite-radio-group-item/calcite-radio-group-item.d.ts

@@ -8,7 +8,7 @@ export declare class CalciteRadioGroupItem {
   /** optionally pass an icon to display - accepts Calcite UI icon names  */
   icon?: string;
   /** flip the icon in rtl */
-  iconFlipRtl?: boolean;
+  iconFlipRtl: boolean;
   /** optionally used with icon, select where to position the icon */
   iconPosition?: Position;
   /**
@@ -27,7 +27,6 @@ export declare class CalciteRadioGroupItem {
   private useFallback;
   private inputProxy;
   private mutationObserver;
-  private getMutationObserver;
   private syncFromExternalInput;
   private syncToExternalInput;
 }