@esri/calcite-components 1.0.0-beta.80 → 1.0.0-beta.83

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

@@ -41,7 +41,8 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
    * @internal
    */
   required: boolean;
-  /** specify the selection mode
+  /**
+   * 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
@@ -52,7 +53,9 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
   /** The value(s) of the selectedItem(s) */
   value: string | string[];
   valueHandler(value: string | string[]): void;
-  /** string to override the English "Remove tag" text for when an item is selected.
+  /**
+   * string to override the English "Remove tag" text for when an item is selected.
+   *
    * @default "Remove tag"
    */
   intlRemoveTag: string;
@@ -60,6 +63,7 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
    * Defines the available placements that can be used when a flip occurs.
    */
   flipPlacements?: ComputedPlacement[];
+  flipPlacementsHandler(): void;
   documentClickHandler(event: Event): void;
   calciteComboboxItemChangeHandler(event: CustomEvent<HTMLCalciteComboboxItemElement>): void;
   /** Updates the position of the component. */
@@ -68,6 +72,7 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
   setFocus(): Promise<void>;
   /**
    * Called when the selected items set changes
+   *
    * @deprecated use calciteComboboxChange instead
    */
   calciteLookupChange: EventEmitter<HTMLCalciteComboboxItemElement[]>;
@@ -82,15 +87,17 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
     visibleItems: HTMLCalciteComboboxItemElement[];
     text: string;
   }>;
-  /** Called when a selected item in the combobox is dismissed via its chip **/
+  /** Called when a selected item in the combobox is dismissed via its chip */
   calciteComboboxChipDismiss: EventEmitter;
   /**
    * Fired when the combobox is opened
+   *
    * @internal
    */
   calciteComboboxOpen: EventEmitter;
   /**
    *  Fired when the combobox is closed
+   *
    * @internal
    */
   calciteComboboxClose: EventEmitter;
@@ -99,6 +106,7 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
   componentDidLoad(): void;
   componentDidRender(): void;
   disconnectedCallback(): void;
+  filteredFlipPlacements: ComputedPlacement[];
   internalValueChangeFlag: boolean;
   labelEl: HTMLCalciteLabelElement;
   formEl: HTMLFormElement;
@@ -127,15 +135,17 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
   private listContainerEl;
   private ignoreSelectedEventsFlag;
   private activeTransitionProp;
+  setFilteredPlacements: () => void;
   getValue: () => string | string[];
   onLabelClick: () => void;
+  private comboboxInViewport;
   keydownHandler: (event: KeyboardEvent) => void;
   private toggleCloseEnd;
   private toggleOpenEnd;
   transitionEnd: (event: TransitionEvent) => void;
   setMaxScrollerHeight: () => void;
   calciteChipDismissHandler: (event: CustomEvent<HTMLCalciteChipElement>, comboboxItem: HTMLCalciteComboboxItemElement) => void;
-  setFocusClick: (event: MouseEvent) => void;
+  clickHandler: (event: MouseEvent) => void;
   setInactiveIfNotContained: (event: Event) => void;
   setMenuEl: (el: HTMLDivElement) => void;
   setListContainerEl: (el: HTMLDivElement) => void;
@@ -168,6 +178,7 @@ export declare class Combobox implements LabelableComponent, FormComponent, Inte
   previousChip(): void;
   nextChip(): void;
   focusChip(): void;
+  private scrollToActiveItem;
   shiftActiveItemIndex(delta: number): void;
   updateActiveItemIndex(index: number): void;
   isMulti(): boolean;

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

@@ -4,3 +4,7 @@ export declare const ComboboxChildSelector: string;
 export declare const TEXT: {
   removeTag: string;
 };
+export declare const CSS: {
+  labelActive: string;
+  labelSelected: string;
+};

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

@@ -39,6 +39,8 @@ export declare class ComboboxItem implements ConditionalSlotComponent, Interacti
   /**
    * 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.
+   *
+   * @param coerce
    */
   toggleSelected(coerce?: boolean): Promise<void>;
   itemClickHandler: (event: MouseEvent) => void;

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

@@ -16,11 +16,13 @@ export declare class DatePicker {
   handleValueAsDate(date: Date | Date[]): void;
   /**
    * Selected start date as full date object
+   *
    * @deprecated use valueAsDate instead
    */
   startAsDate?: Date;
   /**
    * Selected end date as full date object
+   *
    * @deprecated use valueAsDate instead
    */
   endAsDate?: Date;
@@ -35,15 +37,21 @@ export declare class DatePicker {
   /** Latest allowed date ("yyyy-mm-dd") */
   max?: string;
   onMaxChanged(max: string): void;
-  /** Localized string for "previous month" (used for aria label)
+  /**
+   * Localized string for "previous month" (used for aria label)
+   *
    * @default "Previous month"
    */
   intlPrevMonth?: string;
-  /** Localized string for "next month" (used for aria label)
+  /**
+   * Localized string for "next month" (used for aria label)
+   *
    * @default "Next month"
    */
   intlNextMonth?: string;
-  /** Localized string for "year" (used for aria label)
+  /**
+   * Localized string for "year" (used for aria label)
+   *
    * @default "Year"
    */
   intlYear?: string;
@@ -55,11 +63,13 @@ export declare class DatePicker {
   range: boolean;
   /**
    * Selected start date
+   *
    * @deprecated use value instead
    */
   start?: string;
   /**
    * Selected end date
+   *
    * @deprecated use value instead
    */
   end?: string;
@@ -71,6 +81,7 @@ export declare class DatePicker {
   calciteDatePickerChange: EventEmitter<Date>;
   /**
    * Trigger calcite date change when a user changes the date range.
+   *
    * @see [DateRangeChange](https://github.com/Esri/calcite-components/blob/master/src/components/date-picker/interfaces.ts#L1)
    */
   calciteDatePickerRangeChange: EventEmitter<DateRangeChange>;
@@ -103,14 +114,26 @@ export declare class DatePicker {
   monthMouseOutChange: () => void;
   /**
    * Render calcite-date-picker-month-header and calcite-date-picker-month
+   *
+   * @param activeDate
+   * @param maxDate
+   * @param minDate
+   * @param date
+   * @param endDate
    */
   private renderCalendar;
   /**
    * Update date instance of start if valid
+   *
+   * @param startDate
+   * @param emit
    */
   private setStartAsDate;
   /**
    * Update date instance of end if valid
+   *
+   * @param endDate
+   * @param emit
    */
   private setEndAsDate;
   /**
@@ -121,10 +144,16 @@ export declare class DatePicker {
   private setStartDate;
   /**
    * Event handler for when the selected date changes
+   *
+   * @param e
    */
   private monthDateChange;
   /**
    * Get an active date using the value, or current date as default
+   *
+   * @param value
+   * @param min
+   * @param max
    */
   private getActiveDate;
   private getActiveStartDate;

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

@@ -1,5 +1,6 @@
 /**
  * Translation resource data structure
+ *
  * @private
  */
 export interface DateLocaleData {
@@ -27,17 +28,21 @@ export interface DateLocaleData {
 /**
  * CLDR cache.
  * Exported for testing purposes.
+ *
  * @private
  */
 export declare const translationCache: Record<string, DateLocaleData>;
 /**
  * CLDR request cache.
  * Exported for testing purposes.
+ *
  * @private
  */
 export declare const requestCache: Record<string, Promise<DateLocaleData>>;
 /**
  * Fetch calendar data for a given locale from list of supported languages
+ *
+ * @param lang
  * @public
  */
 export declare function getLocaleData(lang: string): Promise<DateLocaleData>;

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

@@ -39,9 +39,10 @@ export declare class DatePickerDay implements InteractiveComponent {
   calciteDaySelect: EventEmitter;
   /**
    * Emitted when user hovers over a day
+   *
    * @internal
    */
-  calciteDayHover: EventEmitter;
+  calciteInternalDayHover: EventEmitter;
   render(): VNode;
   componentDidRender(): void;
   isTabbable(): boolean;

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

@@ -32,9 +32,10 @@ export declare class DatePickerMonth {
   calciteDatePickerSelect: EventEmitter;
   /**
    * Event emitted when user hovers the date.
+   *
    * @internal
    */
-  calciteDatePickerHover: EventEmitter;
+  calciteInternalDatePickerHover: EventEmitter;
   /**
    * Active date for the user keyboard access.
    */
@@ -42,7 +43,7 @@ export declare class DatePickerMonth {
   /**
    * @internal
    */
-  calciteDatePickerMouseOut: EventEmitter;
+  calciteInternalDatePickerMouseOut: EventEmitter;
   keyDownHandler: (e: KeyboardEvent) => void;
   /**
    * Once user is not interacting via keyboard,
@@ -54,34 +55,55 @@ export declare class DatePickerMonth {
   private activeFocus;
   /**
    * Add n months to the current month
+   *
+   * @param step
    */
   private addMonths;
   /**
    * Add n days to the current date
+   *
+   * @param step
    */
   private addDays;
   /**
    * Get dates for last days of the previous month
+   *
+   * @param month
+   * @param year
+   * @param startOfWeek
    */
   private getPrevMonthdays;
   /**
    * Get dates for the current month
+   *
+   * @param month
+   * @param year
    */
   private getCurrentMonthDays;
   /**
    * Get dates for first days of the next month
+   *
+   * @param month
+   * @param year
+   * @param startOfWeek
    */
   private getNextMonthDays;
   /**
    * Determine if the date is in between the start and end dates
+   *
+   * @param date
    */
   private betweenSelectedRange;
   /**
    * Determine if the date should be in selected state
+   *
+   * @param date
    */
   private isSelected;
   /**
    * Determine if the date is the start of the date range
+   *
+   * @param date
    */
   private isStartOfRange;
   private isEndOfRange;
@@ -89,6 +111,12 @@ export declare class DatePickerMonth {
   daySelect: (e: CustomEvent) => void;
   /**
    * Render calcite-date-picker-day
+   *
+   * @param active
+   * @param day
+   * @param date
+   * @param currentMonth
+   * @param ref
    */
   private renderDateDay;
   private isFocusedOnStart;

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

@@ -41,17 +41,26 @@ export declare class DatePickerMonthHeader {
   setNextPrevMonthDates(): void;
   /**
    * Increment year on UP/DOWN keys
+   *
+   * @param e
    */
   private onYearKey;
-  private yearChanged;
+  private onYearChange;
+  private onYearInput;
   private prevMonthClick;
   private prevMonthKeydown;
   private nextMonthClick;
   private nextMonthKeydown;
   private handleArrowClick;
+  private getInRangeDate;
   /**
    * Parse localized year string from input,
    * set to active if in range
+   *
+   * @param root0
+   * @param root0.localizedYear
+   * @param root0.commit
+   * @param root0.offset
    */
   private setYear;
 }

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

@@ -1,4 +1,4 @@
-import { EventEmitter, VNode } from "../../stencil-public-runtime";
+import { Event, EventEmitter, VNode } from "../../stencil-public-runtime";
 import { ItemKeyboardEvent } from "./interfaces";
 import { ComputedPlacement, OverlayPositioning, MenuPlacement } from "../../utils/popper";
 import { StrictModifiers } from "@popperjs/core";
@@ -25,16 +25,18 @@ export declare class Dropdown implements InteractiveComponent {
    * Defines the available placements that can be used when a flip occurs.
    */
   flipPlacements?: ComputedPlacement[];
+  flipPlacementsHandler(): void;
   /**
    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
-  */
+   */
   maxItems: number;
   maxItemsHandler(): void;
   /** 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;
   /**
    * Determines where the dropdown will be positioned relative to the button.
+   *
    * @default "bottom-leading"
    */
   placement: MenuPlacement;
@@ -49,8 +51,8 @@ export declare class Dropdown implements InteractiveComponent {
   selectedItems: HTMLCalciteDropdownItemElement[];
   /** specify whether the dropdown is opened by hover or click of a trigger element */
   type: "hover" | "click";
-  /** specify the width of dropdown, defaults to m */
-  width: Scale;
+  /** specify the width of dropdown */
+  width?: Scale;
   connectedCallback(): void;
   componentDidLoad(): void;
   componentDidRender(): void;
@@ -58,20 +60,22 @@ export declare class Dropdown implements InteractiveComponent {
   render(): VNode;
   /** Updates the position of the component. */
   reposition(): Promise<void>;
-  /** fires when a dropdown item has been selected or deselected **/
+  /** fires when a dropdown item has been selected or deselected */
   calciteDropdownSelect: EventEmitter<void>;
-  /** fires when a dropdown has been opened **/
+  /** fires when a dropdown has been opened */
   calciteDropdownOpen: EventEmitter<void>;
-  /** fires when a dropdown has been closed **/
+  /** fires when a dropdown has been closed */
   calciteDropdownClose: EventEmitter<void>;
   closeCalciteDropdownOnClick(e: Event): void;
-  closeCalciteDropdownOnEvent(): void;
+  closeCalciteDropdownOnEvent(e: Event): void;
   closeCalciteDropdownOnOpenEvent(e: Event): void;
   mouseEnterHandler(): void;
   mouseLeaveHandler(): void;
-  calciteDropdownItemKeyEvent(e: CustomEvent<ItemKeyboardEvent>): void;
+  calciteInternalDropdownItemKeyEvent(e: CustomEvent<ItemKeyboardEvent>): void;
   handleItemSelect(event: CustomEvent): void;
+  filteredFlipPlacements: ComputedPlacement[];
   private items;
+  private groups;
   /** trigger elements */
   private triggers;
   private popper;
@@ -81,7 +85,12 @@ export declare class Dropdown implements InteractiveComponent {
   private scrollerEl;
   mutationObserver: MutationObserver;
   resizeObserver: ResizeObserver;
+  setFilteredPlacements: () => void;
+  updateTriggers: (event: Event) => void;
   updateItems: () => void;
+  updateGroups: (event: Event) => void;
+  resizeObserverCallback: (entries: ResizeObserverEntry[]) => void;
+  setDropdownWidth: () => void;
   setMaxScrollerHeight: () => void;
   setScrollerEl: (scrollerEl: HTMLDivElement) => void;
   transitionEnd: (event: TransitionEvent) => void;

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

@@ -8,8 +8,10 @@ export declare class DropdownGroup {
   el: HTMLCalciteDropdownGroupElement;
   /** optionally set a group title for display */
   groupTitle?: string;
-  /** specify the selection mode - multi (allow any number of (or no) active items), single (allow and require one active item),
-   none (no active items), defaults to single */
+  /**
+    specify the selection mode - multi (allow any number of (or no) active items), single (allow and require one active item),
+   none (no active items), defaults to single
+   */
   selectionMode: SelectionMode;
   /**
    * Specifies the size of the action.
@@ -18,7 +20,7 @@ export declare class DropdownGroup {
   /**
    * @internal
    */
-  calciteDropdownItemChange: EventEmitter;
+  calciteInternalDropdownItemChange: EventEmitter;
   componentWillLoad(): void;
   render(): VNode;
   updateActiveItemOnChange(event: CustomEvent): void;

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

@@ -25,11 +25,11 @@ export declare class DropdownItem {
   /**
    * @internal
    */
-  calciteDropdownItemSelect: EventEmitter;
+  calciteInternalDropdownItemSelect: EventEmitter;
   /** @internal */
-  calciteDropdownItemKeyEvent: EventEmitter<ItemKeyboardEvent>;
+  calciteInternalDropdownItemKeyEvent: EventEmitter<ItemKeyboardEvent>;
   /** @internal */
-  calciteDropdownCloseRequest: EventEmitter;
+  calciteInternalDropdownCloseRequest: EventEmitter;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
   componentWillLoad(): void;

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

@@ -17,6 +17,7 @@ export declare class Fab implements InteractiveComponent {
   disabled: boolean;
   /**
    * The name of the icon to display. The value of this property must match the icon name from https://esri.github.io/calcite-ui-icons/.
+   *
    * @default "plus"
    */
   icon?: string;

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

@@ -50,10 +50,10 @@ export declare class Filter implements InteractiveComponent {
   componentWillLoad(): void;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
-  filter: import("lodash").DebouncedFunc<(value: string) => void>;
+  filter: import("lodash").DebouncedFunc<(value: string, emit?: any) => void>;
   inputHandler: (event: CustomEvent) => void;
-  keyDownHandler: ({ key }: KeyboardEvent) => void;
+  keyDownHandler: (event: KeyboardEvent) => void;
   clear: () => void;
-  updateFiltered(filtered: any[]): void;
+  updateFiltered(filtered: any[], emit?: boolean): void;
   render(): VNode;
 }

package/dist/types/components/filter/resources.d.ts

@@ -1,7 +1,6 @@
 export declare const CSS: {
   container: string;
   searchIcon: string;
-  clearButton: string;
 };
 export declare const TEXT: {
   filterLabel: string;
@@ -11,3 +10,4 @@ export declare const ICONS: {
   search: string;
   close: string;
 };
+export declare const DEBOUNCE_TIMEOUT = 250;

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

@@ -12,11 +12,8 @@ export declare class Flow {
   panelCount: number;
   flowDirection: FlowDirection;
   panels: HTMLCalcitePanelElement[];
-  connectedCallback(): void;
-  disconnectedCallback(): void;
   handleCalcitePanelBackClick(): void;
   getFlowDirection: (oldPanelCount: number, newPanelCount: number) => FlowDirection | null;
-  updateFlowProps: () => void;
-  panelItemMutationObserver: MutationObserver;
+  updateFlowProps: (event: Event) => void;
   render(): VNode;
 }

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

@@ -2,14 +2,28 @@ import { DataSeries, Graph, TranslateOptions, Translator, Extent } from "../grap
 /**
  * Generate a function which will translate a point
  * from the data coordinate space to svg viewbox oriented pixels
+ *
+ * @param root0
+ * @param root0.width
+ * @param root0.height
+ * @param root0.min
+ * @param root0.max
  */
 export declare function translate({ width, height, min, max }: TranslateOptions): Translator;
 /**
  * Get the min and max values from the dataset
+ *
+ * @param data
  */
 export declare function range(data: DataSeries): Extent;
 /**
  * Generate drawing commands for an area graph
  * returns a string can can be passed directly to a path element's `d` attribute
+ *
+ * @param root0
+ * @param root0.data
+ * @param root0.min
+ * @param root0.max
+ * @param root0.t
  */
 export declare function area({ data, min, max, t }: Graph): string;

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

@@ -1,7 +1,7 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 export declare class Handle {
   /**
-   * @internal - stores the activated state of the drag handle.
+   * @internal
    */
   activated: boolean;
   /**

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

@@ -7,12 +7,14 @@ export interface FetchIconProps {
 /**
  * Icon data cache.
  * Exported for testing purposes.
+ *
  * @private
  */
 export declare const iconCache: Record<string, CalciteIconPath>;
 /**
  * Icon request cache.
  * Exported for testing purposes.
+ *
  * @private
  */
 export declare const requestCache: Record<string, Promise<CalciteIconPath>>;
@@ -21,6 +23,8 @@ export declare function fetchIcon({ icon, scale }: FetchIconProps): Promise<Calc
 /**
  * Normalize the icon name to match the path data module exports.
  * Exported for testing purposes.
+ *
+ * @param name
  * @private
  */
 export declare function normalizeIconName(name: string): string;

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

@@ -17,15 +17,21 @@ export declare class InlineEditable implements InteractiveComponent, LabelableCo
   loading: boolean;
   /** specify whether save/cancel controls should be displayed when editingEnabled is true, defaults to false */
   controls: boolean;
-  /** specify text to be user for the enable editing button's aria-label, defaults to `Click to edit`
+  /**
+   * specify text to be user for the enable editing button's aria-label, defaults to `Click to edit`
+   *
    * @default "Click to edit"
    */
   intlEnableEditing: string;
-  /** specify text to be user for the cancel editing button's aria-label, defaults to `Cancel`
+  /**
+   * specify text to be user for the cancel editing button's aria-label, defaults to `Cancel`
+   *
    * @default "Cancel"
    */
   intlCancelEditing: string;
-  /** specify text to be user for the confirm changes button's aria-label, defaults to `Save`
+  /**
+   * specify text to be user for the confirm changes button's aria-label, defaults to `Save`
+   *
    * @default "Save"
    */
   intlConfirmChanges: string;
@@ -48,7 +54,7 @@ export declare class InlineEditable implements InteractiveComponent, LabelableCo
   /**
    * @internal
    */
-  calciteInlineEditableEnableEditingChange: EventEmitter;
+  calciteInternalInlineEditableEnableEditingChange: EventEmitter;
   blurHandler(): void;
   private inputElement;
   private valuePriorToEditing;
@@ -62,7 +68,6 @@ export declare class InlineEditable implements InteractiveComponent, LabelableCo
   mutationObserverCallback(): void;
   onLabelClick(): void;
   updateSlottedInput(): void;
-  transitionEnd: () => void;
   private get shouldShowControls();
   private enableEditing;
   private disableEditing;