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

package/dist/types/components.d.ts

@@ -19,12 +19,12 @@ import { Format } from "./components/calcite-color-picker/utils";
 import { ComboboxChildElement, ComboboxSelectionMode } from "./components/calcite-combobox/interfaces";
 import { DateRangeChange } from "./components/calcite-date-picker/interfaces";
 import { DateLocaleData } from "./components/calcite-date-picker/utils";
+import { HoverRange } from "./utils/date";
 import { DropdownPlacement, ItemKeyboardEvent } from "./components/calcite-dropdown/interfaces";
 import { SelectionMode } from "./components/calcite-dropdown-group/interfaces";
 import { ColorStop, DataSeries } from "./components/calcite-graph/interfaces";
 import { InputPlacement } from "./components/calcite-input/interfaces";
 import { HourDisplayFormat, Time, TimeFocusId } from "./utils/time";
-import { FocusRequest } from "./components/calcite-label/interfaces";
 import { ModalBackgroundColor } from "./components/calcite-modal/interfaces";
 import { CalcitePaginationDetail } from "./components/calcite-pagination/calcite-pagination";
 import { ListFocusId } from "./components/calcite-pick-list/shared-list-logic";
@@ -60,6 +60,9 @@ export namespace Components {
         "selectionMode": "multi" | "single" | "single-persist";
     }
     interface CalciteAccordionItem {
+        /**
+          * Indicates whether the item is active.
+         */
         "active": boolean;
         /**
           * optionally pass an icon to display - accepts Calcite UI icon names
@@ -80,7 +83,7 @@ export namespace Components {
          */
         "active": boolean;
         /**
-          * Indicates the alignment when text-enabled is false.
+          * Optionally specify the horizontal alignment of button elements with text content.
          */
         "alignment"?: Alignment;
         /**
@@ -120,6 +123,9 @@ export namespace Components {
           * Specifies the size of the action.
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * Text that accompanies the action icon.
@@ -147,10 +153,14 @@ export namespace Components {
           * Updates the label of the expand icon when the component is not expanded.
          */
         "intlExpand"?: string;
+        /**
+          * Overflows actions that won't fit into menus.
+         */
+        "overflowActions": () => Promise<void>;
         /**
           * Disables automatically overflowing actions that won't fit into menus.
          */
-        "overflowActionsDisabled"?: boolean;
+        "overflowActionsDisabled": boolean;
         /**
           * Arranges the component depending on the elements 'dir' property.
          */
@@ -159,6 +169,9 @@ export namespace Components {
           * Specifies the size of the expand action.
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": (focusId?: "expand-toggle") => Promise<void>;
     }
     interface CalciteActionGroup {
@@ -217,6 +230,9 @@ export namespace Components {
           * Specifies the size of the menu trigger action.
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
     }
     interface CalciteActionPad {
@@ -248,6 +264,9 @@ export namespace Components {
           * Specifies the size of the expand action.
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": (focusId?: "expand-toggle") => Promise<void>;
     }
     interface CalciteAlert {
@@ -285,7 +304,7 @@ export namespace Components {
          */
         "scale": Scale;
         /**
-          * focus either the slotted link or the close button
+          * Sets focus on the component.
          */
         "setFocus": () => Promise<void>;
     }
@@ -390,7 +409,6 @@ export namespace Components {
         "text": string;
         /**
           * This property determines the look of the section toggle. If the value is "switch", a toggle-switch will be displayed. If the value is "button", a clickable header is displayed.
-          * @todo revisit doc
          */
         "toggleDisplay": BlockSectionToggleDisplay;
     }
@@ -410,7 +428,7 @@ export namespace Components {
         /**
           * is the button disabled
          */
-        "disabled"?: boolean;
+        "disabled": boolean;
         /**
           * The form ID to associate with the component
          */
@@ -443,7 +461,7 @@ export namespace Components {
         /**
           * optionally add a calcite-loader component to the button, disabling interaction.
          */
-        "loading"?: boolean;
+        "loading": boolean;
         /**
           * The name attribute to apply to the button
          */
@@ -455,11 +473,14 @@ export namespace Components {
         /**
           * optionally add a round style to the button
          */
-        "round"?: boolean;
+        "round": boolean;
         /**
           * specify the scale of the button, defaults to m
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * is the button a child of a calcite-split-button
@@ -511,24 +532,23 @@ export namespace Components {
         /**
           * The checked state of the checkbox.
          */
-        "checked"?: boolean;
+        "checked": boolean;
         /**
           * True if the checkbox is disabled
          */
-        "disabled"?: boolean;
+        "disabled": boolean;
         /**
           * The id attribute of the checkbox.  When omitted, a globally unique identifier is used.
          */
         "guid": string;
         /**
           * The hovered state of the checkbox.
-          * @private
          */
         "hovered": boolean;
         /**
           * True if the checkbox is initially indeterminate, which is independent from its checked state https://css-tricks.com/indeterminate-checkboxes/
          */
-        "indeterminate"?: boolean;
+        "indeterminate": boolean;
         /**
           * The label of the checkbox input
          */
@@ -541,6 +561,9 @@ export namespace Components {
           * specify the scale of the checkbox, defaults to m
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * The value of the checkbox input
@@ -564,7 +587,7 @@ export namespace Components {
         /**
           * Optionally show a button the user can click to dismiss the chip
          */
-        "dismissible"?: boolean;
+        "dismissible": boolean;
         /**
           * optionally pass an icon to display - accepts Calcite UI icon names
          */
@@ -572,12 +595,18 @@ export namespace Components {
         /**
           * flip the icon in rtl
          */
-        "iconFlipRtl"?: boolean;
+        "iconFlipRtl": boolean;
         /**
           * specify the scale of the chip, defaults to m
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
+        /**
+          * The assigned value for the chip
+         */
         "value": any;
     }
     interface CalciteColorPicker {
@@ -769,7 +798,7 @@ export namespace Components {
     }
     interface CalciteCombobox {
         /**
-          * Open and close combobox
+          * Opens or closes the combobox
          */
         "active": boolean;
         /**
@@ -796,6 +825,9 @@ export namespace Components {
           * Placeholder text for input
          */
         "placeholder"?: string;
+        /**
+          * Updates the position of the component.
+         */
         "reposition": () => Promise<void>;
         /**
           * Specify the scale of the combobox, defaults to m
@@ -805,6 +837,9 @@ export namespace Components {
           * specify the selection mode - multi: allow any number of selected items (default) - single: only one selection) - ancestors: like multi, but show ancestors of selected items as selected, only deepest children shown in chips
          */
         "selectionMode": ComboboxSelectionMode;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
     }
     interface CalciteComboboxItem {
@@ -909,11 +944,11 @@ export namespace Components {
         /**
           * Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range.
          */
-        "proximitySelectionDisabled"?: boolean;
+        "proximitySelectionDisabled": boolean;
         /**
           * Range mode activation
          */
-        "range"?: boolean;
+        "range": boolean;
         /**
           * specify the scale of the date picker
          */
@@ -968,6 +1003,9 @@ export namespace Components {
           * Showing date range
          */
         "range": boolean;
+        /**
+          * Date is being hovered and within the set range
+         */
         "rangeHover": boolean;
         /**
           * specify the scale of the date picker
@@ -995,7 +1033,10 @@ export namespace Components {
           * End date currently active
          */
         "endDate"?: Date;
-        "hoverRange": any;
+        /**
+          * The range of dates currently being hovered
+         */
+        "hoverRange": HoverRange;
         /**
           * CLDR locale data for current locale
          */
@@ -1064,6 +1105,9 @@ export namespace Components {
         "selectedDate": Date;
     }
     interface CalciteDropdown {
+        /**
+          * Opens or closes the dropdown
+         */
         "active": boolean;
         /**
           * allow the dropdown to remain open after a selection is made if the selection-mode of the selected item's containing group is "none", the dropdown will always close
@@ -1072,7 +1116,7 @@ export namespace Components {
         /**
           * is the dropdown disabled
          */
-        "disabled"?: boolean;
+        "disabled": boolean;
         /**
           * specify the maximum number of calcite-dropdown-items to display before showing the scroller, must be greater than 0 - this value does not include groupTitles passed to calcite-dropdown-group
          */
@@ -1086,6 +1130,9 @@ export namespace Components {
           * @default "bottom-leading"
          */
         "placement": DropdownPlacement;
+        /**
+          * Updates the position of the component.
+         */
         "reposition": () => Promise<void>;
         /**
           * specify the scale of dropdown, defaults to m
@@ -1120,6 +1167,9 @@ export namespace Components {
         "selectionMode": SelectionMode;
     }
     interface CalciteDropdownItem {
+        /**
+          * Indicates whether the item is active.
+         */
         "active": boolean;
         /**
           * optionally pass a href - used to determine if the component should render as anchor
@@ -1146,7 +1196,7 @@ export namespace Components {
          */
         "rel"?: string;
         /**
-          * Focuses the selected item.
+          * Sets focus on the component.
          */
         "setFocus": () => Promise<void>;
         /**
@@ -1184,6 +1234,9 @@ export namespace Components {
           * Specifies the size of the fab.
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * Text that accompanies the FAB icon.
@@ -1216,7 +1269,7 @@ export namespace Components {
          */
         "placeholder"?: string;
         /**
-          * Focuses the filter input.
+          * Sets focus on the component.
          */
         "setFocus": () => Promise<void>;
     }
@@ -1254,6 +1307,9 @@ export namespace Components {
     }
     interface CalciteHandle {
         "activated": boolean;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * Value for the button title attribute
@@ -1318,6 +1374,7 @@ export namespace Components {
           * specify the scale of the inline-editable component, defaults to the scale of the wrapped calcite-input or the scale of the closest wrapping component with a set scale
          */
         "scale"?: Scale;
+        "setFocus": () => Promise<void>;
     }
     interface CalciteInput {
         /**
@@ -1331,11 +1388,11 @@ export namespace Components {
         /**
           * 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;
         /**
           * for number values, displays the locale's group separator
          */
@@ -1347,7 +1404,7 @@ export namespace Components {
         /**
           * flip the icon in rtl
          */
-        "iconFlipRtl"?: boolean;
+        "iconFlipRtl": boolean;
         /**
           * string to override English loading text
           * @default "Loading"
@@ -1419,7 +1476,7 @@ export namespace Components {
          */
         "scale": Scale;
         /**
-          * focus the rendered child element
+          * Sets focus on the component.
          */
         "setFocus": () => Promise<void>;
         /**
@@ -1516,16 +1573,23 @@ export namespace Components {
         /**
           * Disables the default behaviour on the third click of narrowing or extending the range and instead starts a new range.
          */
-        "proximitySelectionDisabled"?: boolean;
+        "proximitySelectionDisabled": boolean;
         /**
           * Range mode activation
          */
-        "range"?: boolean;
+        "range": boolean;
+        /**
+          * Updates the position of the component.
+         */
         "reposition": () => Promise<void>;
         /**
           * specify the scale of the date picker
          */
         "scale": "s" | "m" | "l";
+        /**
+          * Updates the position of the component.
+         */
+        "setFocus": () => Promise<void>;
         /**
           * Selected start date
          */
@@ -1544,6 +1608,9 @@ export namespace Components {
         "valueAsDate"?: Date;
     }
     interface CalciteInputMessage {
+        /**
+          * 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
@@ -1567,11 +1634,11 @@ export namespace Components {
         /**
           * 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)
          */
@@ -1632,6 +1699,9 @@ export namespace Components {
           * The scale (size) of the time input
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * number that specifies the granularity that the value must adhere to
@@ -1650,11 +1720,11 @@ export namespace Components {
         /**
           * eliminates any space around the label
          */
-        "disableSpacing"?: boolean;
+        "disableSpacing": boolean;
         /**
           * is the label disabled
          */
-        "disabled"?: boolean;
+        "disabled": boolean;
         /**
           * The id of the input associated with the label
          */
@@ -1664,7 +1734,7 @@ export namespace Components {
          */
         "layout": "inline" | "inline-space-between" | "default";
         /**
-          * specify the scale of the input, defaults to m
+          * specify the scale of the label, defaults to m
          */
         "scale": Scale;
         /**
@@ -1676,7 +1746,7 @@ export namespace Components {
         /**
           * 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
          */
@@ -1697,6 +1767,9 @@ export namespace Components {
           * The rel attribute to apply to the hyperlink
          */
         "rel"?: string;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * The target attribute to apply to the hyperlink
@@ -1719,7 +1792,7 @@ export namespace Components {
          */
         "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;
         /**
@@ -1753,7 +1826,7 @@ export namespace Components {
         /**
           * Turn off spacing around the loader
          */
-        "noPadding"?: boolean;
+        "noPadding": boolean;
         /**
           * Speficy the scale of the loader. Defaults to "m"
          */
@@ -1775,7 +1848,7 @@ export namespace Components {
         /**
           * Add the active attribute to open the modal
          */
-        "active"?: boolean;
+        "active": boolean;
         /**
           * Background color of modal content
          */
@@ -1791,15 +1864,15 @@ export namespace Components {
         /**
           * Disables the display a close button within the Modal
          */
-        "disableCloseButton"?: boolean;
+        "disableCloseButton": boolean;
         /**
           * Flag to disable the default close on escape behavior
          */
-        "disableEscape"?: boolean;
+        "disableEscape": boolean;
         /**
           * Disables the closing of the Modal when clicked outside.
          */
-        "disableOutsideClose"?: boolean;
+        "disableOutsideClose": boolean;
         /**
           * Prevent the modal from taking up the entire screen on mobile
          */
@@ -1824,7 +1897,7 @@ export namespace Components {
         /**
           * Turn off spacing around the content area slot
          */
-        "noPadding"?: boolean;
+        "noPadding": boolean;
         /**
           * specify the scale of modal, defaults to m
          */
@@ -1854,7 +1927,7 @@ export namespace Components {
         /**
           * 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
          */
@@ -1869,7 +1942,7 @@ export namespace Components {
          */
         "scale": Scale;
         /**
-          * focus the close button, if present and requested
+          * Sets focus on the component.
          */
         "setFocus": () => Promise<void>;
         /**
@@ -1927,12 +2000,12 @@ export namespace Components {
          */
         "start": 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;
@@ -1990,6 +2063,9 @@ export namespace Components {
           * Opens the action menu.
          */
         "menuOpen": boolean;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": (focusId?: "dismiss-button" | "back-button") => Promise<void>;
         /**
           * Shows a back button in the header.
@@ -2017,6 +2093,9 @@ export namespace Components {
           * Placeholder text for the filter input field.
          */
         "filterPlaceholder": string;
+        /**
+          * Returns the currently selected items
+         */
         "getSelectedItems": () => Promise<Map<string, HTMLCalcitePickListItemElement>>;
         /**
           * Number at which section headings should start for this component.
@@ -2034,6 +2113,9 @@ export namespace Components {
           * When true and single-selection is enabled, the selection will change when navigating items via the keyboard.
          */
         "selectionFollowsFocus": boolean;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": (focusId?: ListFocusId) => Promise<void>;
     }
     interface CalcitePickListGroup {
@@ -2065,7 +2147,7 @@ export namespace Components {
          */
         "icon"?: ICON_TYPES | null;
         /**
-          * 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;
@@ -2086,6 +2168,9 @@ export namespace Components {
           * Set this to true to pre-select an item. Toggles when an item is checked/unchecked.
          */
         "selected": boolean;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * Used to toggle the selection state. By default this won't trigger an event. The first argument allows the value to be coerced, rather than swapping values.
@@ -2161,15 +2246,24 @@ export namespace Components {
           * Reference HTMLElement used to position this component according to the placement property. As a convenience, a string ID of the reference element can be used. However, setting this property to use an HTMLElement is preferred so that the component does not need to query the DOM for the referenceElement.
          */
         "referenceElement": HTMLElement | string;
+        /**
+          * 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>;
     }
     interface CalcitePopoverManager {
         /**
           * Automatically closes any currently open popovers when clicking outside of a popover.
          */
-        "autoClose"?: boolean;
+        "autoClose": boolean;
         /**
           * CSS Selector to match reference elements for popovers. Reference elements will be identified by this selector in order to open their associated popover.
           * @default `[data-calcite-popover-reference]`
@@ -2206,10 +2300,9 @@ export namespace Components {
         /**
           * The disabled state of the radio.
          */
-        "disabled"?: boolean;
+        "disabled": boolean;
         /**
           * The focused state of the radio.
-          * @private
          */
         "focused": boolean;
         /**
@@ -2218,7 +2311,6 @@ export namespace Components {
         "hidden": boolean;
         /**
           * The hovered state of the radio.
-          * @private
          */
         "hovered": boolean;
         /**
@@ -2238,7 +2330,6 @@ export namespace Components {
         "emitCheckedChange": () => Promise<void>;
         /**
           * The focused state of the radio button.
-          * @private
          */
         "focused": boolean;
         /**
@@ -2251,7 +2342,6 @@ export namespace Components {
         "hidden": boolean;
         /**
           * The hovered state of the radio button.
-          * @private
          */
         "hovered": boolean;
         /**
@@ -2270,6 +2360,9 @@ export namespace Components {
           * The scale (size) of the radio button. `scale` is passed as a property automatically from `calcite-radio-button-group`.
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * The value of the radio button.
@@ -2310,7 +2403,7 @@ export namespace Components {
         /**
           * is the radio group disabled
          */
-        "disabled"?: boolean;
+        "disabled": boolean;
         /**
           * specify the layout of the radio group, defaults to horizontal
          */
@@ -2328,7 +2421,7 @@ export namespace Components {
          */
         "selectedItem": HTMLCalciteRadioGroupItemElement;
         /**
-          * Focuses the selected item. If there is no selection, it focuses the first item.
+          * Sets focus on the component.
          */
         "setFocus": () => Promise<void>;
         /**
@@ -2348,7 +2441,7 @@ export namespace Components {
         /**
           * flip the icon in rtl
          */
-        "iconFlipRtl"?: boolean;
+        "iconFlipRtl": boolean;
         /**
           * optionally used with icon, select where to position the icon
          */
@@ -2389,6 +2482,9 @@ export namespace Components {
           * specify the scale of the component, defaults to m
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * Show average and count data summary chip (if available)
@@ -2428,6 +2524,9 @@ export namespace Components {
           * @readonly
          */
         "selectedOption": HTMLCalciteOptionElement;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * The component width.
@@ -2438,7 +2537,7 @@ export namespace Components {
         /**
           * Positions the center content behind any calcite-shell-panels.
          */
-        "contentBehind"?: boolean;
+        "contentBehind": boolean;
     }
     interface CalciteShellCenterRow {
         /**
@@ -2496,17 +2595,17 @@ export namespace Components {
         /**
           * Label handles with their numeric value
          */
-        "labelHandles"?: boolean;
+        "labelHandles": boolean;
         /**
           * Label tick marks with their numeric value.
          */
-        "labelTicks"?: boolean;
+        "labelTicks": boolean;
         /**
           * Maximum selectable value
          */
         "max": number;
         /**
-          * Label for second handle if needed (ex. "Temperature, upper bound")
+          * Used as an accessible label (aria-label) for second handle if needed (ex. "Temperature, upper bound")
          */
         "maxLabel"?: string;
         /**
@@ -2518,7 +2617,7 @@ export namespace Components {
          */
         "min": number;
         /**
-          * Label for first (or only) handle (ex. "Temperature, lower bound")
+          * Used as an accessible label (aria-label) for first (or only) handle (ex. "Temperature, lower bound")
          */
         "minLabel": string;
         /**
@@ -2536,12 +2635,15 @@ export namespace Components {
         /**
           * Use finer point for handles
          */
-        "precise"?: boolean;
+        "precise": boolean;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * When true, enables snap selection along the step interval
          */
-        "snap"?: boolean;
+        "snap": boolean;
         /**
           * Interval to move on up/down keys
          */
@@ -2572,6 +2674,10 @@ export namespace Components {
           * The selector for the handle elements.
          */
         "handleSelector": string;
+        /**
+          * Indicates the horizontal or vertical orientation of the component.
+         */
+        "layout": Layout;
         /**
           * When true, content is waiting to be loaded. This state shows a busy indicator.
          */
@@ -2581,7 +2687,7 @@ export namespace Components {
         /**
           * Is the dropdown currently active or not
          */
-        "active"?: boolean;
+        "active": boolean;
         /**
           * specify the appearance style of the button, defaults to solid.
          */
@@ -2593,7 +2699,7 @@ export namespace Components {
         /**
           * is the control disabled
          */
-        "disabled"?: boolean;
+        "disabled": boolean;
         /**
           * specify the icon used for the dropdown menu, defaults to chevron
          */
@@ -2605,7 +2711,7 @@ export namespace Components {
         /**
           * optionally add a calcite-loader component to the control, disabling interaction. with the primary button
          */
-        "loading"?: boolean;
+        "loading": boolean;
         /**
           * optionally pass an icon to display at the end of the primary button - accepts Calcite UI icon names
          */
@@ -2705,10 +2811,18 @@ export namespace Components {
         "scale": Scale;
     }
     interface CalciteSwitch {
+        /**
+          * True if the switch is initially on
+         */
+        "checked": boolean;
         /**
           * True if the switch is disabled
          */
-        "disabled"?: boolean;
+        "disabled": boolean;
+        /**
+          * Applies to the aria-label attribute on the switch
+         */
+        "label"?: string;
         /**
           * The name of the switch input
          */
@@ -2717,9 +2831,13 @@ export namespace Components {
           * The scale of the switch
          */
         "scale": Scale;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * True if the switch is initially on
+          * @deprecated use 'checked' instead.
          */
         "switched": boolean;
         /**
@@ -2744,7 +2862,7 @@ export namespace Components {
         "updateAriaInfo": (tabIds?: string[], titleIds?: string[]) => Promise<void>;
     }
     interface CalciteTabNav {
-        "bordered"?: boolean;
+        "bordered": boolean;
         "indicatorOffset": number;
         "indicatorWidth": number;
         "layout": TabLayout;
@@ -2764,7 +2882,7 @@ export namespace Components {
           * Show this tab title as selected
          */
         "active": boolean;
-        "bordered"?: boolean;
+        "bordered": boolean;
         /**
           * Disable this tab title
          */
@@ -2799,7 +2917,7 @@ export namespace Components {
         /**
           * Optionally enable tabs to appear like a folder-style menu when its layout is "inline"
          */
-        "bordered"?: boolean;
+        "bordered": boolean;
         /**
           * Align tab titles to the edge or fully justify them across the tab nav ("center")
          */
@@ -2817,7 +2935,7 @@ export namespace Components {
         /**
           * The active state of the tile.
          */
-        "active"?: boolean;
+        "active": boolean;
         /**
           * The description text that appears beneath the heading of the tile.
          */
@@ -2832,7 +2950,6 @@ export namespace Components {
         "embed": boolean;
         /**
           * The focused state of the tile.
-          * @private
          */
         "focused": boolean;
         /**
@@ -2889,6 +3006,9 @@ export namespace Components {
           * The name of the tile select.  This name will appear in form submissions as either a radio or checkbox identifier based on the `type` property.
          */
         "name": string;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
         /**
           * The selection mode of the tile select: radio (single) or checkbox (multiple).
@@ -2990,6 +3110,9 @@ export namespace Components {
           * The second value
          */
         "second"?: string;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": (target: TimeFocusId) => Promise<void>;
         /**
           * number that specifies the granularity that the value must adhere to
@@ -3020,7 +3143,7 @@ export namespace Components {
         /**
           * The selected state of the tip if it is being used inside a `calcite-tip-manager`.
          */
-        "selected"?: boolean;
+        "selected": boolean;
     }
     interface CalciteTipGroup {
         /**
@@ -3057,7 +3180,13 @@ export namespace Components {
           * Alternate text for navigating to the previous tip.
          */
         "intlPrevious"?: string;
+        /**
+          * Selects the next tip to display
+         */
         "nextTip": () => Promise<void>;
+        /**
+          * Selects the previous tip to display
+         */
         "previousTip": () => Promise<void>;
     }
     interface CalciteTooltip {
@@ -3091,6 +3220,9 @@ export namespace Components {
           * Reference HTMLElement used to position this component according to the placement property. As a convenience, a string ID of the reference element can be used. However, setting this property to use an HTMLElement is preferred so that the component does not need to query the DOM for the referenceElement.
          */
         "referenceElement": HTMLElement | string;
+        /**
+          * Updates the position of the component.
+         */
         "reposition": () => Promise<void>;
     }
     interface CalciteTooltipManager {
@@ -3161,6 +3293,9 @@ export namespace Components {
           * Placeholder text for the filter input field.
          */
         "filterPlaceholder": string;
+        /**
+          * Returns the currently selected items
+         */
         "getSelectedItems": () => Promise<Map<string, HTMLCalciteValueListItemElement>>;
         /**
           * The list's group identifier.  To drag elements from one list into another, both lists must have the same group value.
@@ -3178,6 +3313,9 @@ export namespace Components {
           * When true and single-selection is enabled, the selection will change when navigating items via the keyboard.
          */
         "selectionFollowsFocus": boolean;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": (focusId?: ListFocusId) => Promise<void>;
     }
     interface CalciteValueListItem {
@@ -3216,7 +3354,13 @@ export namespace Components {
           * Set this to true to pre-select an item. Toggles when an item is checked/unchecked.
          */
         "selected": boolean;
+        /**
+          * Sets focus on the component.
+         */
         "setFocus": () => Promise<void>;
+        /**
+          * Used to toggle the selection state. By default this won't trigger an event. The first argument allows the value to be coerced, rather than swapping values.
+         */
         "toggleSelected": (coerce?: boolean) => Promise<void>;
         /**
           * The item's associated value.
@@ -3889,6 +4033,9 @@ declare namespace LocalJSX {
         "selectionMode"?: "multi" | "single" | "single-persist";
     }
     interface CalciteAccordionItem {
+        /**
+          * Indicates whether the item is active.
+         */
         "active"?: boolean;
         /**
           * optionally pass an icon to display - accepts Calcite UI icon names
@@ -3909,7 +4056,7 @@ declare namespace LocalJSX {
          */
         "active"?: boolean;
         /**
-          * Indicates the alignment when text-enabled is false.
+          * Optionally specify the horizontal alignment of button elements with text content.
          */
         "alignment"?: Alignment;
         /**
@@ -4173,7 +4320,7 @@ declare namespace LocalJSX {
         /**
           * Block heading.
          */
-        "heading"?: string;
+        "heading": string;
         /**
           * Number at which section headings should start for this component.
          */
@@ -4244,7 +4391,6 @@ declare namespace LocalJSX {
         "text"?: string;
         /**
           * This property determines the look of the section toggle. If the value is "switch", a toggle-switch will be displayed. If the value is "button", a clickable header is displayed.
-          * @todo revisit doc
          */
         "toggleDisplay"?: BlockSectionToggleDisplay;
     }
@@ -4377,11 +4523,6 @@ declare namespace LocalJSX {
           * The id attribute of the checkbox.  When omitted, a globally unique identifier is used.
          */
         "guid"?: string;
-        /**
-          * The hovered state of the checkbox.
-          * @private
-         */
-        "hovered"?: boolean;
         /**
           * True if the checkbox is initially indeterminate, which is independent from its checked state https://css-tricks.com/indeterminate-checkboxes/
          */
@@ -4437,6 +4578,9 @@ declare namespace LocalJSX {
           * specify the scale of the chip, defaults to m
          */
         "scale"?: Scale;
+        /**
+          * The assigned value for the chip
+         */
         "value": any;
     }
     interface CalciteColorPicker {
@@ -4628,7 +4772,7 @@ declare namespace LocalJSX {
     }
     interface CalciteCombobox {
         /**
-          * Open and close combobox
+          * Opens or closes the combobox
          */
         "active"?: boolean;
         /**
@@ -4858,6 +5002,9 @@ declare namespace LocalJSX {
           * Showing date range
          */
         "range"?: boolean;
+        /**
+          * Date is being hovered and within the set range
+         */
         "rangeHover"?: boolean;
         /**
           * specify the scale of the date picker
@@ -4885,7 +5032,10 @@ declare namespace LocalJSX {
           * End date currently active
          */
         "endDate"?: Date;
-        "hoverRange"?: any;
+        /**
+          * The range of dates currently being hovered
+         */
+        "hoverRange"?: HoverRange;
         /**
           * Maximum date of the calendar above which is disabled.
          */
@@ -4962,6 +5112,9 @@ declare namespace LocalJSX {
         "selectedDate"?: Date;
     }
     interface CalciteDropdown {
+        /**
+          * Opens or closes the dropdown
+         */
         "active"?: boolean;
         /**
           * allow the dropdown to remain open after a selection is made if the selection-mode of the selected item's containing group is "none", the dropdown will always close
@@ -5029,6 +5182,9 @@ declare namespace LocalJSX {
         "selectionMode"?: SelectionMode;
     }
     interface CalciteDropdownItem {
+        /**
+          * Indicates whether the item is active.
+         */
         "active"?: boolean;
         /**
           * optionally pass a href - used to determine if the component should render as anchor
@@ -5450,6 +5606,9 @@ declare namespace LocalJSX {
         "valueAsDate"?: Date;
     }
     interface CalciteInputMessage {
+        /**
+          * 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
@@ -5573,7 +5732,7 @@ declare namespace LocalJSX {
          */
         "layout"?: "inline" | "inline-space-between" | "default";
         /**
-          * specify the scale of the input, defaults to m
+          * specify the scale of the label, defaults to m
          */
         "scale"?: Scale;
         /**
@@ -5627,7 +5786,7 @@ declare namespace LocalJSX {
          */
         "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;
         /**
@@ -5836,12 +5995,12 @@ declare namespace LocalJSX {
          */
         "start"?: 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;
@@ -5987,7 +6146,7 @@ declare namespace LocalJSX {
          */
         "icon"?: ICON_TYPES | null;
         /**
-          * 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;
@@ -6141,20 +6300,10 @@ declare namespace LocalJSX {
           * The disabled state of the radio.
          */
         "disabled"?: boolean;
-        /**
-          * The focused state of the radio.
-          * @private
-         */
-        "focused"?: boolean;
         /**
           * The radio's hidden status.
          */
         "hidden"?: boolean;
-        /**
-          * The hovered state of the radio.
-          * @private
-         */
-        "hovered"?: boolean;
         /**
           * The scale (size) of the radio.
          */
@@ -6169,11 +6318,6 @@ declare namespace LocalJSX {
           * The disabled state of the radio button.
          */
         "disabled"?: boolean;
-        /**
-          * The focused state of the radio button.
-          * @private
-         */
-        "focused"?: boolean;
         /**
           * The id attribute of the radio button.  When omitted, a globally unique identifier is used.
          */
@@ -6182,11 +6326,6 @@ declare namespace LocalJSX {
           * The radio button's hidden status.  When a radio button is hidden it is not focusable or checkable.
          */
         "hidden"?: boolean;
-        /**
-          * The hovered state of the radio button.
-          * @private
-         */
-        "hovered"?: boolean;
         /**
           * The name of the radio button. `name` is passed as a property automatically from `calcite-radio-button-group`.
          */
@@ -6226,7 +6365,7 @@ declare namespace LocalJSX {
          */
         "name": string;
         /**
-          * @todo doc
+          * Emitted when the radio button group has changed.
          */
         "onCalciteRadioButtonGroupChange"?: (event: CustomEvent<any>) => void;
         /**
@@ -6452,7 +6591,7 @@ declare namespace LocalJSX {
          */
         "max"?: number;
         /**
-          * Label for second handle if needed (ex. "Temperature, upper bound")
+          * Used as an accessible label (aria-label) for second handle if needed (ex. "Temperature, upper bound")
          */
         "maxLabel"?: string;
         /**
@@ -6464,7 +6603,7 @@ declare namespace LocalJSX {
          */
         "min"?: number;
         /**
-          * Label for first (or only) handle (ex. "Temperature, lower bound")
+          * Used as an accessible label (aria-label) for first (or only) handle (ex. "Temperature, lower bound")
          */
         "minLabel"?: string;
         /**
@@ -6476,12 +6615,16 @@ declare namespace LocalJSX {
          */
         "mirrored"?: boolean;
         /**
-          * Fires on all updates to the slider. :warning: Will be fired frequently during drag. If you are performing any expensive operations consider using a debounce or throttle to avoid locking up the main thread.
+          * Fires on when the thumb is released on slider If you need to constantly listen to the drag event, please use calciteSliderInput instead
          */
         "onCalciteSliderChange"?: (event: CustomEvent<any>) => void;
         /**
           * Fires on all updates to the slider. :warning: Will be fired frequently during drag. If you are performing any expensive operations consider using a debounce or throttle to avoid locking up the main thread.
-          * @deprecated use calciteSliderChange instead
+         */
+        "onCalciteSliderInput"?: (event: CustomEvent<any>) => void;
+        /**
+          * Fires on all updates to the slider. :warning: Will be fired frequently during drag. If you are performing any expensive operations consider using a debounce or throttle to avoid locking up the main thread.
+          * @deprecated use calciteSliderInput instead
          */
         "onCalciteSliderUpdate"?: (event: CustomEvent<any>) => void;
         /**
@@ -6526,6 +6669,10 @@ declare namespace LocalJSX {
           * The selector for the handle elements.
          */
         "handleSelector"?: string;
+        /**
+          * Indicates the horizontal or vertical orientation of the component.
+         */
+        "layout"?: Layout;
         /**
           * When true, content is waiting to be loaded. This state shows a busy indicator.
          */
@@ -6642,16 +6789,24 @@ declare namespace LocalJSX {
         "itemTitle"?: string;
     }
     interface CalciteSwitch {
+        /**
+          * True if the switch is initially on
+         */
+        "checked"?: boolean;
         /**
           * True if the switch is disabled
          */
         "disabled"?: boolean;
+        /**
+          * Applies to the aria-label attribute on the switch
+         */
+        "label"?: string;
         /**
           * The name of the switch input
          */
         "name"?: string;
         /**
-          * Fires when the switched value has changed.
+          * Fires when the checked value has changed.
          */
         "onCalciteSwitchChange"?: (event: CustomEvent<any>) => void;
         /**
@@ -6660,6 +6815,7 @@ declare namespace LocalJSX {
         "scale"?: Scale;
         /**
           * True if the switch is initially on
+          * @deprecated use 'checked' instead.
          */
         "switched"?: boolean;
         /**
@@ -6758,11 +6914,6 @@ declare namespace LocalJSX {
           * The embed mode of the tile.  When true, renders without a border and padding for use by other components.
          */
         "embed"?: boolean;
-        /**
-          * The focused state of the tile.
-          * @private
-         */
-        "focused"?: boolean;
         /**
           * The heading text that appears between the icon and description of the tile.
          */
@@ -6817,6 +6968,10 @@ declare namespace LocalJSX {
           * The name of the tile select.  This name will appear in form submissions as either a radio or checkbox identifier based on the `type` property.
          */
         "name"?: string;
+        /**
+          * Emits a custom change event.  For checkboxes, it emits when the checkbox is checked or unchecked.  For radios it only emits when it is checked.
+         */
+        "onCalciteTileSelectChange"?: (event: CustomEvent<any>) => void;
         /**
           * The selection mode of the tile select: radio (single) or checkbox (multiple).
          */