@esri/calcite-components 1.0.0-beta.91 → 1.0.0-beta.92

package/dist/loader/cdn.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.91
+ * v1.0.0-beta.92
  */
 module.exports = require('../cjs/loader.cjs.js');
 module.exports.applyPolyfills = function() { return Promise.resolve() };

package/dist/loader/index.cjs.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.91
+ * v1.0.0-beta.92
  */
 module.exports = require('../cjs/loader.cjs.js');
 module.exports.applyPolyfills = function() { return Promise.resolve() };

package/dist/loader/index.es2017.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.91
+ * v1.0.0-beta.92
  */
 export * from '../esm/polyfills/index.js';
 export * from '../esm/loader.js';

package/dist/loader/index.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.91
+ * v1.0.0-beta.92
  */
 (function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
 export * from '../esm/polyfills/index.js';

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

@@ -7,8 +7,16 @@ import { RequestedItem } from "../dropdown-group/interfaces";
  */
 export declare class DropdownItem {
   el: HTMLCalciteDropdownItemElement;
-  /** Indicates whether the item is active. */
+  /**
+   * Indicates whether the item is active.
+   *
+   * @deprecated Use selected instead.
+   */
   active: boolean;
+  activeHandler(value: boolean): void;
+  /** When true, item is selected  */
+  selected: boolean;
+  selectedHandler(value: boolean): void;
   /** flip the icon(s) in rtl */
   iconFlipRtl?: FlipContext;
   /** optionally pass an icon to display at the start of an item - accepts calcite ui icon names  */

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

@@ -1,5 +1,5 @@
 import { DeprecatedEventPayload, Scale, Status } from "../interfaces";
-import { EventEmitter, VNode } from "../../stencil-public-runtime";
+import { Event, EventEmitter, VNode } from "../../stencil-public-runtime";
 import { InputPlacement } from "./interfaces";
 import { Position } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
@@ -224,6 +224,7 @@ export declare class Input implements LabelableComponent, FormComponent, Interac
   private numberButtonPointerDownHandler;
   onFormReset(): void;
   syncHiddenFormInput(input: HTMLInputElement): void;
+  hiddenInputChangeHandler: (event: Event) => void;
   private setChildElRef;
   private setChildNumberElRef;
   private setDisabledAction;

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

@@ -191,7 +191,7 @@ export declare class InputDatePicker implements LabelableComponent, FormComponen
   setStartInput: (el: HTMLCalciteInputElement) => void;
   setEndInput: (el: HTMLCalciteInputElement) => void;
   deactivate: () => void;
-  keyDownHandler: ({ defaultPrevented, key }: KeyboardEvent) => void;
+  keyDownHandler: (event: KeyboardEvent) => void;
   inputBlur: (event: CustomEvent<any>) => void;
   startInputFocus: () => void;
   endInputFocus: () => void;

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

@@ -1,5 +1,5 @@
 import { DeprecatedEventPayload, Scale, Status } from "../interfaces";
-import { EventEmitter, VNode } from "../../stencil-public-runtime";
+import { Event, EventEmitter, VNode } from "../../stencil-public-runtime";
 import { InputPlacement } from "./interfaces";
 import { Position } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
@@ -205,6 +205,7 @@ export declare class InputNumber implements LabelableComponent, FormComponent, I
   private nudgeButtonPointerDownHandler;
   onFormReset(): void;
   syncHiddenFormInput(input: HTMLInputElement): void;
+  hiddenInputChangeHandler: (event: Event) => void;
   private setChildNumberElRef;
   private setDisabledAction;
   private setInputNumberValue;

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

@@ -1,5 +1,5 @@
 import { Scale, Status } from "../interfaces";
-import { EventEmitter, VNode } from "../../stencil-public-runtime";
+import { Event, EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Position } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
 import { FormComponent } from "../../utils/form";
@@ -160,6 +160,7 @@ export declare class InputText implements LabelableComponent, FormComponent, Int
   private inputTextKeyDownHandler;
   onFormReset(): void;
   syncHiddenFormInput(input: HTMLInputElement): void;
+  hiddenInputChangeHandler: (event: Event) => void;
   private setChildElRef;
   private setDisabledAction;
   private setInputValue;

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

@@ -96,7 +96,7 @@ export declare class InputTimePicker implements LabelableComponent, FormComponen
   setFocus(): Promise<void>;
   /** Updates the position of the component. */
   reposition(): Promise<void>;
-  keyDownHandler: ({ defaultPrevented, key }: KeyboardEvent) => void;
+  keyDownHandler: (event: KeyboardEvent) => void;
   onLabelClick(): void;
   private shouldIncludeSeconds;
   private setCalcitePopoverEl;

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

@@ -28,7 +28,7 @@ export declare class RadioButtonGroup {
   /**
    * Fires when the component has changed.
    */
-  calciteRadioButtonGroupChange: EventEmitter<void>;
+  calciteRadioButtonGroupChange: EventEmitter<any>;
   radioButtonChangeHandler(event: CustomEvent): void;
   render(): VNode;
 }

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

@@ -4,14 +4,13 @@ import { VNode } from "../../stencil-public-runtime";
  */
 export declare class Scrim {
   /**
-   * string to override English loading text
+   * Accessible name when the component is loading.
    *
    * @default "Loading"
    */
   intlLoading?: string;
   /**
-   * Determines if the component will have the loader overlay.
-   * Otherwise, will render opaque disabled state.
+   * When true, a busy indicator is displayed.
    */
   loading: boolean;
   el: HTMLCalciteScrimElement;

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

@@ -8,40 +8,40 @@ import { InteractiveComponent } from "../../utils/interactive";
  */
 export declare class Select implements LabelableComponent, FormComponent, InteractiveComponent {
   /**
-   * When true, it prevents the option from being selected.
+   * When true, interaction is prevented and the component is displayed with lower opacity.
    */
   disabled: boolean;
   /**
-   * The component's label. This is required for accessibility purposes.
+   * Accessible name for the component.
    *
    */
   label: string;
   /**
-   * The select's name. Gets submitted with the form.
+   * Specifies the name of the component on form submission.
    */
   name: string;
   /**
-   * When true, makes the component required for form-submission.
+   * When true, the component must have a value on form submission.
    *
    * @internal
    */
   required: boolean;
   /**
-   * The component scale.
+   * Specifies the size of the component.
    */
   scale: Scale;
-  /** The value of the selectedOption */
+  /** The component's "selectedOption" value. */
   value: string;
   valueHandler(value: string): void;
   /**
-   * The currently selected option.
+   * The component's selected option `HTMLElement`.
    *
    * @readonly
    */
   selectedOption: HTMLCalciteOptionElement;
   selectedOptionHandler(selectedOption: HTMLCalciteOptionElement): void;
   /**
-   * The component width.
+   * Specifies the width of the component.
    */
   width: Width;
   labelEl: HTMLCalciteLabelElement;
@@ -58,7 +58,7 @@ export declare class Select implements LabelableComponent, FormComponent, Intera
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
   /**
-   * This event will fire whenever the selected option changes.
+   * Fires when the selected option changes.
    */
   calciteSelectChange: EventEmitter<void>;
   private handleInternalSelectChange;

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

@@ -1,18 +1,18 @@
 import { VNode } from "../../stencil-public-runtime";
 import { ConditionalSlotComponent } from "../../utils/conditionalSlot";
 /**
- * @slot - A slot for adding content to the shell. This content will appear between any leading and trailing panels added to the shell. (eg. a map)
- * @slot header - A slot for adding header content. This content will be positioned at the top of the shell.
- * @slot footer - A slot for adding footer content. This content will be positioned at the bottom of the shell.
+ * @slot - A slot for adding content to the component. This content will appear between any leading and trailing panels added to the component, such as a map.
+ * @slot header - A slot for adding header content. This content will be positioned at the top of the component.
+ * @slot footer - A slot for adding footer content. This content will be positioned at the bottom of the component.
  * @slot panel-start - A slot for adding the starting `calcite-shell-panel`.
  * @slot panel-end - A slot for adding the ending `calcite-shell-panel`.
  * @slot primary-panel - [DEPRECATED] A slot for adding the leading `calcite-shell-panel`.
  * @slot contextual-panel - [DEPRECATED] A slot for adding the trailing `calcite-shell-panel`.
- * @slot center-row - A slot for adding custom content in the center row.
+ * @slot center-row - A slot for adding content to the center row.
  */
 export declare class Shell implements ConditionalSlotComponent {
   /**
-   * Positions the center content behind any calcite-shell-panels.
+   * Positions the center content behind any `calcite-shell-panel`s.
    */
   contentBehind: boolean;
   el: HTMLCalciteShellElement;

package/dist/types/components/shell-center-row/shell-center-row.d.ts

@@ -2,20 +2,20 @@ import { VNode } from "../../stencil-public-runtime";
 import { Position, Scale } from "../interfaces";
 import { ConditionalSlotComponent } from "../../utils/conditionalSlot";
 /**
- * @slot - A slot for adding content to the shell panel.
- * @slot action-bar - A slot for adding a `calcite-action-bar` to the panel.
+ * @slot - A slot for adding content to the `calcite-shell-panel`.
+ * @slot action-bar - A slot for adding a `calcite-action-bar` to the `calcite-shell-panel`.
  */
 export declare class ShellCenterRow implements ConditionalSlotComponent {
   /**
-   * This property makes the content area appear like a "floating" panel.
+   * When true, the content area displays like a floating panel.
    */
   detached: boolean;
   /**
-   * Specifies the maximum height of the row.
+   * Specifies the maximum height of the component.
    */
   heightScale: Scale;
   /**
-   * Arranges the component depending on the elements 'dir' property.
+   * Specifies the component's position. Will be flipped when the element direction is right-to-left ("rtl").
    */
   position: Position;
   el: HTMLCalciteShellCenterRowElement;

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

@@ -2,39 +2,39 @@ import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Position, Scale } from "../interfaces";
 import { ConditionalSlotComponent } from "../../utils/conditionalSlot";
 /**
- * @slot - A slot for adding content to the shell panel.
- * @slot action-bar - A slot for adding a `calcite-action-bar` to the panel.
+ * @slot - A slot for adding content to the component.
+ * @slot action-bar - A slot for adding a `calcite-action-bar` to the component.
  */
 export declare class ShellPanel implements ConditionalSlotComponent {
   /**
-   * Hide the content panel.
+   * When true, hides the component's content area.
    */
   collapsed: boolean;
   watchHandler(): void;
   /**
-   * This property makes the content area appear like a "floating" panel.
+   * When true, the content area displays like a floating panel.
    */
   detached: boolean;
   /**
-   * Specifies the maximum height of the contents when detached.
+   * When "detached", specifies the maximum height of the component.
    */
   detachedHeightScale: Scale;
   /**
-   * This sets width of the content area.
+   * Specifies the width of the component's content area.
    */
   widthScale: Scale;
   /**
-   * Arranges the component depending on the elements 'dir' property.
+   * Specifies the component's position. Will be flipped when the element direction is right-to-left ("rtl").
    */
   position: Position;
   /**
-   * Accessible label for resize separator.
+   * Accessible name for the resize separator.
    *
    * @default "Resize"
    */
   intlResize: string;
   /**
-   * This property makes the content area resizable if the calcite-shell-panel is not 'detached'.
+   * When true and not "detached", the component's content area is resizable.
    */
   resizable: boolean;
   connectedCallback(): void;
@@ -53,7 +53,7 @@ export declare class ShellPanel implements ConditionalSlotComponent {
   /**
    * Emitted when collapse has been toggled.
    *
-   * @deprecated use a resizeObserver on the shell-panel to listen for changes to its size.
+   * @deprecated use a resizeObserver on the component to listen for changes to its size.
    */
   calciteShellPanelToggle: EventEmitter<void>;
   renderHeader(): VNode;

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

@@ -6,36 +6,36 @@ import { FormComponent } from "../../utils/form";
 import { InteractiveComponent } from "../../utils/interactive";
 export declare class Slider implements LabelableComponent, FormComponent, InteractiveComponent {
   el: HTMLCalciteSliderElement;
-  /** Disable and gray out the slider */
+  /** When true, interaction is prevented and the component is displayed with lower opacity. */
   disabled: boolean;
-  /** Indicates if a histogram is present */
+  /** When true, indicates a histogram is present. */
   hasHistogram: boolean;
   /**
-   * List of x,y coordinates within the slider's min and max, displays above the slider track.
+   * A list of the histogram's x,y coordinates within the component's "min" and "max". Displays above the component's track.
    *
    * @see [DataSeries](https://github.com/Esri/calcite-components/blob/master/src/components/graph/interfaces.ts#L5)
    */
   histogram?: DataSeries;
   histogramWatcher(newHistogram: DataSeries): void;
   /**
-   * Array of values describing a single color stop, sorted by offset ascending.
+   * A set of single color stops for a histogram, sorted by offset ascending.
    */
   histogramStops: ColorStop[];
-  /** Label handles with their numeric value */
+  /** When true, displays label handles with their numeric value. */
   labelHandles: boolean;
-  /** Label tick marks with their numeric value. */
+  /** When true and "ticks" is specified, displays label tick marks with their numeric value. */
   labelTicks: boolean;
-  /** Maximum selectable value */
+  /** The component's maximum selectable value. */
   max: number;
-  /** Used as an accessible label (aria-label) for second handle if needed (ex. "Temperature, upper bound") */
+  /** For multiple selections, the accessible name for the second handle, such as "Temperature, upper bound". */
   maxLabel?: string;
-  /** Currently selected upper number (if multi-select) */
+  /** For multiple selections, the component's upper value. */
   maxValue?: number;
-  /** Minimum selectable value */
+  /** The component's minimum selectable value. */
   min: number;
-  /** Used as an accessible label (aria-label) for first (or only) handle (ex. "Temperature, lower bound") */
+  /** Accessible name for first (or only) handle, such as "Temperature, lower bound". */
   minLabel: string;
-  /** Currently selected lower number (if multi-select) */
+  /** For multiple selections, the component's lower value. */
   minValue?: number;
   /**
    * When true, the slider will display values from high to low.
@@ -43,28 +43,28 @@ export declare class Slider implements LabelableComponent, FormComponent, Intera
    * Note that this value will be ignored if the slider has an associated histogram.
    */
   mirrored: boolean;
-  /** The name of the slider */
+  /** Specifies the name of the component on form submission. */
   name: string;
-  /** Interval to move on page up/page down keys */
+  /** Specifies the interval to move with the page up, or page down keys. */
   pageStep?: number;
-  /** Use finer point for handles */
+  /** When true, sets a finer point for handles. */
   precise: boolean;
   /**
-   * When true, makes the component required for form-submission.
+   * When true, the component must have a value on form submission.
    */
   required: boolean;
-  /** When true, enables snap selection along the step interval */
+  /** When true, enables snap selection in coordination with "step" via a mouse. */
   snap: boolean;
-  /** Interval to move on up/down keys */
+  /** Specifies the interval to move with the up, or down keys. */
   step?: number;
-  /** Show tick marks on the number line at provided interval */
+  /** Displays tick marks on the number line at a specified interval. */
   ticks?: number;
-  /** Currently selected number (if single select) */
+  /** The component's value. */
   value: null | number | number[];
   valueHandler(): void;
   minMaxValueHandler(): void;
   /**
-   * Specify the scale of the slider, defaults to m
+   *  Specifies the size of the component.
    */
   scale: Scale;
   connectedCallback(): void;
@@ -78,25 +78,28 @@ export declare class Slider implements LabelableComponent, FormComponent, Intera
   pointerDownHandler(event: PointerEvent): void;
   handleTouchStart(event: TouchEvent): void;
   /**
-   * Fires on all updates to the slider.
-   * :warning: Will be fired frequently during drag. If you are performing any
+   * Fires on all updates to the component.
+   *
+   * **Note:** 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.
    */
   calciteSliderInput: EventEmitter<void>;
   /**
-   * Fires on when the thumb is released on slider
-   * If you need to constantly listen to the drag event,
-   * please use calciteSliderInput instead
+   * Fires when the thumb is released on the component.
+   *
+   * **Note:** If you need to constantly listen to the drag event,
+   * use "calciteSliderInput" instead.
    */
   calciteSliderChange: EventEmitter<void>;
   /**
-   * Fires on all updates to the slider.
-   * :warning: Will be fired frequently during drag. If you are performing any
+   * Fires on all updates to the component.
+   *
+   * **Note:** 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
+   * @deprecated use "calciteSliderInput" instead.
    */
   calciteSliderUpdate: EventEmitter<void>;
   /** Sets focus on the component. */

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

@@ -8,27 +8,26 @@ import { InteractiveComponent } from "../../utils/interactive";
  */
 export declare class SplitButton implements InteractiveComponent {
   el: HTMLCalciteSplitButtonElement;
-  /** specify the appearance style of the button, defaults to solid. */
+  /** Specifies the appearance style of the component. */
   appearance: ButtonAppearance;
-  /** specify the color of the control, defaults to blue */
+  /** Specifies the color of the component. */
   color: ButtonColor;
-  /** is the control disabled  */
+  /** When true, interaction is prevented and the component is displayed with lower opacity. */
   disabled: boolean;
   handleDisabledChange(value: boolean): void;
   /**
-   * Is the dropdown currently active or not
+   * When true, the component is active.
    *
    * @internal
    */
   active: boolean;
   activeHandler(): void;
-  /** specify the icon used for the dropdown menu, defaults to chevron */
+  /** Specifies the icon used for the dropdown menu. */
   dropdownIconType: DropdownIconType;
-  /** aria label for overflow button */
+  /** Accessible name for the dropdown menu. */
   dropdownLabel?: string;
   /**
-    optionally add a calcite-loader component to the control,
-   disabling interaction. with the primary button
+    When true, a busy indicator is displayed on the primary button.
    */
   loading: boolean;
   /**
@@ -38,30 +37,30 @@ export declare class SplitButton implements InteractiveComponent {
    *
    */
   overlayPositioning: OverlayPositioning;
-  /** optionally pass an icon to display at the end of the primary button - accepts Calcite UI icon names  */
+  /** Specifies an icon to display at the end of the primary button - accepts Calcite UI icon names. */
   primaryIconEnd?: string;
-  /** flip the primary icon(s) in rtl */
+  /**  When true, the primary button icon will be flipped when the element direction is right-to-left ("rtl"). */
   primaryIconFlipRtl?: FlipContext;
-  /** optionally pass an icon to display at the start of the primary button - accepts Calcite UI icon names  */
+  /** Specifies an icon to display at the start of the primary button - accepts Calcite UI icon names.  */
   primaryIconStart?: string;
-  /** optionally pass an aria-label for the primary button */
+  /** Accessible name for the primary button. */
   primaryLabel?: string;
-  /** text for primary action button  */
+  /** Text displayed in the primary button. */
   primaryText: string;
-  /** specify the scale of the control, defaults to m */
+  /** Specifies the size of the component. */
   scale: Scale;
-  /** specify the width of the button, defaults to auto */
+  /** Specifies the width of the component. */
   width: Width;
   /**
-   * fired when the primary button is clicked
+   * Fires when the primary button is clicked.
    *
-   * **Note:** The event payload is deprecated, please use separate mouse event listeners to get info about click.
+   * **Note:** The event payload is deprecated, use separate mouse event listeners to get info about click.
    */
   calciteSplitButtonPrimaryClick: EventEmitter<DeprecatedEventPayload>;
   /**
-   * fired when the secondary button is clicked
+   * Fires when the dropdown menu is clicked.
    *
-   * **Note:** The event payload is deprecated, please use separate mouse event listeners to get info about click.
+   * **Note:** The event payload is deprecated, use separate mouse event listeners to get info about click.
    */
   calciteSplitButtonSecondaryClick: EventEmitter<DeprecatedEventPayload>;
   componentDidRender(): void;

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

@@ -6,21 +6,21 @@ import { StepperItemChangeEventDetail, StepperItemKeyEventDetail } from "./inter
  */
 export declare class Stepper {
   el: HTMLCalciteStepperElement;
-  /** optionally display a status icon next to the step title */
+  /** When true, displays a status icon in the `calcite-stepper-item` heading. */
   icon: boolean;
-  /** specify the layout of stepper, defaults to horizontal */
+  /** Defines the layout of the component. */
   layout: Extract<"horizontal" | "vertical", Layout>;
-  /** optionally display the number next to the step title */
+  /** When true, displays the step number in the `calcite-stepper-item` heading. */
   numbered: boolean;
-  /** specify the scale of stepper, defaults to m */
+  /** Specifies the size of the component. */
   scale: Scale;
   /**
-   * This event fires when the active stepper item has changed.
+   * Fires when the active `calcite-stepper-item` changes.
    *
    */
   calciteStepperItemChange: EventEmitter<StepperItemChangeEventDetail>;
   /**
-   * This event fires when the active stepper item has changed.
+   * Fires when the active `calcite-stepper-item` changes.
    *
    * @internal
    */
@@ -31,19 +31,19 @@ export declare class Stepper {
   registerItem(event: CustomEvent): void;
   updateItem(event: CustomEvent): void;
   handleUserRequestedStepperItemSelect(event: CustomEvent<StepperItemChangeEventDetail>): void;
-  /** set the next step as active */
+  /** Set the next `calcite-stepper-item` as active. */
   nextStep(): Promise<void>;
-  /** set the previous step as active */
+  /** Set the previous `calcite-stepper-item` as active. */
   prevStep(): Promise<void>;
   /**
-   * set the requested step as active
+   * Set a specified `calcite-stepper-item` as active.
    *
    * @param step
    */
   goToStep(step: number): Promise<void>;
-  /** set the first step as active */
+  /** Set the first `calcite-stepper-item` as active. */
   startStep(): Promise<void>;
-  /** set the last step as active */
+  /** Set the last `calcite-stepper-item` as active. */
   endStep(): Promise<void>;
   private itemMap;
   /** list of sorted Stepper items */