@esri/calcite-components 1.0.0-beta.84 → 1.0.0-beta.85

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.84
+ * v1.0.0-beta.85
  */
 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.84
+ * v1.0.0-beta.85
  */
 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.84
+ * v1.0.0-beta.85
  */
 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.84
+ * v1.0.0-beta.85
  */
 (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/input-date-picker/input-date-picker.d.ts

@@ -12,7 +12,13 @@ export declare class InputDatePicker implements LabelableComponent, FormComponen
    * When false, the component won't be interactive.
    */
   disabled: boolean;
-  handleDisabledChange(value: boolean): void;
+  /**
+   * When true, still focusable but controls are gone and the value cannot be modified.
+   *
+   * @mdn [readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
+   */
+  readOnly: boolean;
+  handleDisabledAndReadOnlyChange(value: boolean): void;
   /** Selected date */
   value: string | string[];
   valueHandler(value: string | string[]): void;

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

@@ -0,0 +1,4 @@
+export declare const CSS: {
+  menu: string;
+  menuActive: string;
+};

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

@@ -0,0 +1,216 @@
+import { Scale, Status } from "../interfaces";
+import { EventEmitter, VNode } from "../../stencil-public-runtime";
+import { InputPlacement } from "./interfaces";
+import { Position } from "../interfaces";
+import { LabelableComponent } from "../../utils/label";
+import { FormComponent } from "../../utils/form";
+import { InteractiveComponent } from "../../utils/interactive";
+declare type NumberNudgeDirection = "up" | "down";
+/**
+ * @slot action - A slot for positioning a button next to the component.
+ */
+export declare class InputNumber implements LabelableComponent, FormComponent, InteractiveComponent {
+  el: HTMLCalciteInputNumberElement;
+  /** Specifies the text alignment of the component's value. */
+  alignment: Position;
+  /**
+   * When true, the component is focused on page load.
+   *
+   * @mdn [autofocus](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)
+   */
+  autofocus: boolean;
+  /**
+   * When true, a clear button is displayed when the component has a value.
+   */
+  clearable: boolean;
+  /**
+   * When true, interaction is prevented and the component is displayed with lower opacity.
+   *
+   * @mdn [disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled)
+   */
+  disabled: boolean;
+  disabledWatcher(): void;
+  /**
+   * When true, number values are displayed with the locale's group separator.
+   */
+  groupSeparator: boolean;
+  /**
+   * When true, the component will not be visible.
+   *
+   * @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
+   */
+  hidden: boolean;
+  /**
+   * When true, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.
+   */
+  icon: string | boolean;
+  /**
+   * A text label that will appear on the clear button for screen readers.
+   */
+  intlClear?: string;
+  /**
+   * Accessible name that will appear while loading.
+   *
+   * @default "Loading"
+   */
+  intlLoading?: string;
+  /** When true, the icon is flipped in RTL. */
+  iconFlipRtl: boolean;
+  /** Accessible name for the component's button or hyperlink. */
+  label?: string;
+  /** When true, the component is in the loading state and `calcite-progress` is displayed. */
+  loading: boolean;
+  /** Specifies the BCP 47 language tag for the desired language and country format. */
+  locale: string;
+  /**
+   * Specifies the Unicode numeral system used by the component for localization.
+   *
+   * @mdn [numberingSystem](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/numberingSystem)
+   */
+  numberingSystem?: string;
+  /**
+   * Toggles locale formatting for numbers.
+   *
+   * @internal
+   */
+  localeFormat: boolean;
+  /**
+   * Specifies the maximum value.
+   *
+   * @mdn [max](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#max)
+   */
+  max?: number;
+  /** watcher to update number-to-string for max */
+  maxWatcher(): void;
+  /**
+   * Specifies the minimum value.
+   *
+   * @mdn [min](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#min)
+   */
+  min?: number;
+  /** watcher to update number-to-string for min */
+  minWatcher(): void;
+  /**
+   * Specifies the maximum length of text for the component's value.
+   *
+   * @mdn [maxlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#maxlength)
+   */
+  maxLength?: number;
+  /**
+   * Specifies the minimum length of text for the component's value.
+   *
+   * @mdn [minlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#minlength)
+   */
+  minLength?: number;
+  /**
+   * Specifies the name of the component.
+   *
+   * @mdn [name](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name)
+   */
+  name: string;
+  /** Specifies the placement of the buttons. */
+  numberButtonType?: InputPlacement;
+  /**
+   * Specifies placeholder text for the component.
+   *
+   * @mdn [placeholder](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#placeholder)
+   */
+  placeholder: string;
+  /** Adds text to the start of the component. */
+  prefixText?: string;
+  /**
+   * When true, the value cannot be modified.
+   *
+   * @mdn [readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
+   */
+  readOnly: boolean;
+  /** When true, the component must have a value in order for the form to submit. */
+  required: boolean;
+  /** Specifies the size of the component. */
+  scale: Scale;
+  /** Specifies the status of the input field, which determines message and icons. */
+  status: Status;
+  /**
+   * Specifies the granularity that the component's value must adhere to.
+   *
+   * @mdn [step](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/step)
+   */
+  step?: number | "any";
+  /** Adds text to the end of the component.  */
+  suffixText?: string;
+  /**
+   * @internal
+   */
+  editingEnabled: boolean;
+  /** The component's value. */
+  value: string;
+  valueWatcher(newValue: string, previousValue: string): void;
+  updateRequestedIcon(): void;
+  labelEl: HTMLCalciteLabelElement;
+  formEl: HTMLFormElement;
+  defaultValue: InputNumber["value"];
+  inlineEditableEl: HTMLCalciteInlineEditableElement;
+  /** number text input element for locale */
+  private childNumberEl?;
+  get isClearable(): boolean;
+  private minString?;
+  private maxString?;
+  private previousEmittedValue;
+  private previousValue;
+  private previousValueOrigin;
+  /** the computed icon to render */
+  private requestedIcon?;
+  private nudgeNumberValueIntervalId;
+  mutationObserver: MutationObserver;
+  private userChangedValue;
+  localizedValue: string;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  componentWillLoad(): void;
+  componentShouldUpdate(newValue: string, oldValue: string, property: string): boolean;
+  componentDidRender(): void;
+  /**
+   * @internal
+   */
+  calciteInternalInputNumberFocus: EventEmitter;
+  /**
+   * @internal
+   */
+  calciteInternalInputNumberBlur: EventEmitter;
+  /**
+   * Fires each time a new value is typed.
+   */
+  calciteInputNumberInput: EventEmitter;
+  /**
+   * Fires each time a new value is typed and committed.
+   */
+  calciteInputNumberChange: EventEmitter<void>;
+  /** Sets focus on the component. */
+  setFocus(): Promise<void>;
+  /** Selects all text of the component's `value`. */
+  selectText(): Promise<void>;
+  keyDownHandler: (event: KeyboardEvent) => void;
+  onLabelClick(): void;
+  incrementOrDecrementNumberValue(direction: NumberNudgeDirection, inputMax: number | null, inputMin: number | null, nativeEvent: KeyboardEvent | MouseEvent): void;
+  private clearInputValue;
+  private emitChangeIfUserModified;
+  private inputNumberBlurHandler;
+  private inputNumberFocusHandler;
+  private inputNumberInputHandler;
+  private inputNumberKeyDownHandler;
+  private nudgeNumberValue;
+  private nudgeButtonPointerUpAndOutHandler;
+  private nudgeButtonPointerDownHandler;
+  onFormReset(): void;
+  syncHiddenFormInput(input: HTMLInputElement): void;
+  private setChildNumberElRef;
+  private setDisabledAction;
+  private setInputNumberValue;
+  private setPreviousEmittedNumberValue;
+  private setPreviousNumberValue;
+  private setNumberValue;
+  private inputNumberKeyUpHandler;
+  private warnAboutInvalidNumberValue;
+  render(): VNode;
+}
+export {};

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

@@ -0,0 +1 @@
+export declare type InputPlacement = "vertical" | "horizontal" | "none";

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

@@ -0,0 +1,22 @@
+export declare const CSS: {
+  loader: string;
+  clearButton: string;
+  editingEnabled: string;
+  inlineChild: string;
+  inputIcon: string;
+  prefix: string;
+  suffix: string;
+  numberButtonWrapper: string;
+  buttonItemHorizontal: string;
+  wrapper: string;
+  inputWrapper: string;
+  actionWrapper: string;
+  resizeIconWrapper: string;
+  numberButtonItem: string;
+};
+export declare const SLOTS: {
+  action: string;
+};
+export declare const TEXT: {
+  clear: string;
+};

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

@@ -11,7 +11,13 @@ export declare class InputTimePicker implements LabelableComponent, FormComponen
   activeHandler(): void;
   /** The disabled state of the time input */
   disabled: boolean;
-  handleDisabledChange(value: boolean): void;
+  /**
+   * When true, still focusable but controls are gone and the value cannot be modified.
+   *
+   * @mdn [readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
+   */
+  readOnly: boolean;
+  handleDisabledAndReadOnlyChange(value: boolean): void;
   /** aria-label for the hour input */
   intlHour?: string;
   /** aria-label for the hour down button */

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

@@ -13,6 +13,7 @@ export declare function calciteInternalListItemValueChangeHandler<T extends List
 export declare function calciteListFocusOutHandler<T extends Lists>(this: List<T>, event: FocusEvent): void;
 export declare function keyDownHandler<T extends Lists>(this: List<T>, event: KeyboardEvent): void;
 export declare function moveItemIndex<T extends Lists>(list: List<T>, item: ListItemElement<T>, direction: "up" | "down"): number;
+export declare function getItemIndex<T extends Lists>(list: List<T>, item: ListItemElement<T>): number;
 export declare function internalCalciteListChangeEvent<T extends Lists>(this: List<T>): void;
 export declare function removeItem<T extends Lists, U extends ListItemElement<T>>(this: List<T>, event: CustomEvent): void;
 export declare function setFocus<T extends Lists>(this: List<T>, focusId: ListFocusId): Promise<void>;

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

@@ -11,6 +11,8 @@ interface ListProps extends DOMAttributes<any> {
   filterPlaceholder: string;
   el: HTMLCalcitePickListElement | HTMLCalciteValueListElement;
   setFilterEl: (el: HTMLCalciteFilterElement) => void;
+  dragEnabled?: boolean;
+  storeAssistiveEl?: (el: HTMLSpanElement) => void;
 }
 export declare const List: FunctionalComponent<{
   props: ListProps;

package/dist/types/components/value-list/interfaces.d.ts

@@ -0,0 +1 @@
+export declare type DragStatus = "idle" | "active" | "change" | "commit";

package/dist/types/components/value-list/utils.d.ts

@@ -0,0 +1,8 @@
+import { DragStatus } from "./interfaces";
+import { ValueList } from "./value-list";
+export declare function getScreenReaderText(item: HTMLCalciteValueListItemElement, status: DragStatus, valueList: ValueList<HTMLCalciteValueListItemElement>): string;
+export declare function getHandleAndItemElement(event: KeyboardEvent | FocusEvent): {
+  handle: HTMLCalciteHandleElement;
+  item: HTMLCalciteValueListItemElement;
+};
+export declare function replacePlaceholders(text: string, label: string, position: number, total: number): string;

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

@@ -45,6 +45,30 @@ export declare class ValueList<ItemElement extends HTMLCalciteValueListItemEleme
    * When true and single-selection is enabled, the selection changes when navigating `calcite-value-list-item`s via keyboard.
    */
   selectionFollowsFocus: boolean;
+  /**
+   * When "drag-enabled" is true and active, specifies accessible context to the `calcite-value-list-item`'s initial position.
+   *
+   * Use ${position} of ${total} as placeholder for displaying indices and ${item.label} as placeholder for displaying label of `calcite-value-list-item`.
+   */
+  intlDragHandleIdle?: string;
+  /**
+   * When "drag-enabled" is true and active, specifies accessible context to the component.
+   *
+   * Use ${position} of ${total} as placeholder for displaying indices and ${item.label} as placeholder for displaying label of `calcite-value-list-item`.
+   */
+  intlDragHandleActive?: string;
+  /**
+   * When "drag-enabled" is true and active, specifies accessible context to the `calcite-value-list-item`'s new position.
+   *
+   * Use ${position} of ${total} as placeholder for displaying indices and ${item.label} as placeholder for displaying label of `calcite-value-list-item`.
+   */
+  intlDragHandleChange?: string;
+  /**
+   * When "drag-enabled" is true and active, specifies accessible context to the `calcite-value-list-item`'s current position after commit.
+   *
+   * Use ${position} of ${total} as placeholder for displaying indices and ${item.label} as placeholder for displaying label of `calcite-value-list-item`.
+   */
+  intlDragHandleCommit?: string;
   selectedValues: Map<string, ItemElement>;
   dataForFilter: ItemData;
   items: ItemElement[];
@@ -54,6 +78,7 @@ export declare class ValueList<ItemElement extends HTMLCalciteValueListItemEleme
   el: HTMLCalciteValueListElement;
   emitCalciteListChange: () => void;
   filterEl: HTMLCalciteFilterElement;
+  assistiveTextEl: HTMLSpanElement;
   connectedCallback(): void;
   componentDidLoad(): void;
   componentDidRender(): void;
@@ -83,6 +108,7 @@ export declare class ValueList<ItemElement extends HTMLCalciteValueListItemEleme
   handleFilter: any;
   getItemData: any;
   keyDownHandler: (event: KeyboardEvent) => void;
+  handleBlur(): void;
   /** Returns the currently selected items */
   getSelectedItems(): Promise<Map<string, HTMLCalciteValueListItemElement>>;
   /**
@@ -92,5 +118,9 @@ export declare class ValueList<ItemElement extends HTMLCalciteValueListItemEleme
    */
   setFocus(focusId?: ListFocusId): Promise<void>;
   getIconType(): ICON_TYPES | null;
+  updateScreenReaderText(text: string): void;
+  updateHandleAriaLabel(handleElement: HTMLSpanElement, text: string): void;
+  storeAssistiveEl: (el: HTMLSpanElement) => void;
+  handleFocusIn: (event: FocusEvent) => void;
   render(): VNode;
 }