@esri/calcite-components 1.4.0-next.0 → 1.4.0-next.10

package/dist/types/components.d.ts

@@ -398,9 +398,13 @@ export namespace Components {
     }
     interface CalciteAvatar {
         /**
-          * Specifies the full name of the user.
+          * Specifies the full name of the user. When `label` and `thumbnail` are not defined, specifies the accessible name for the component.
          */
         "fullName": string;
+        /**
+          * Specifies alternative text when `thumbnail` is defined, otherwise specifies an accessible label.
+         */
+        "label": string;
         /**
           * Specifies the size of the component.
          */
@@ -761,9 +765,17 @@ export namespace Components {
     }
     interface CalciteColorPicker {
         /**
-          * When `false`, an empty color (`null`) will be allowed as a `value`. Otherwise, a color value is enforced on the component.  When `true`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`. When `false`, an empty color (`null`) will be allowed as a `value`.
+          * When `true`, an empty color (`null`) will be allowed as a `value`. When `false`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`.
          */
         "allowEmpty": boolean;
+        /**
+          * When true, the component will allow updates to the color's alpha value.
+         */
+        "alphaChannel": boolean;
+        /**
+          * When true, hides the RGB/HSV channel inputs
+         */
+        "channelsDisabled": boolean;
         /**
           * Internal prop for advanced use-cases.
          */
@@ -777,16 +789,23 @@ export namespace Components {
           * @default "auto"
          */
         "format": Format;
+        /**
+          * When true, hides the hex input
+         */
+        "hexDisabled": boolean;
         /**
           * When `true`, hides the RGB/HSV channel inputs.
+          * @deprecated use `channelsDisabled` instead
          */
         "hideChannels": boolean;
         /**
-          * When `true`, hides the Hex input.
+          * When `true`, hides the hex input.
+          * @deprecated use `hexDisabled` instead
          */
         "hideHex": boolean;
         /**
           * When `true`, hides the saved colors section.
+          * @deprecated use `savedDisabled` instead
          */
         "hideSaved": boolean;
         /**
@@ -801,6 +820,10 @@ export namespace Components {
           * Specifies the Unicode numeral system used by the component for localization.
          */
         "numberingSystem": NumberingSystem;
+        /**
+          * When true, hides the saved colors section
+         */
+        "savedDisabled": boolean;
         /**
           * Specifies the size of the component.
          */
@@ -826,10 +849,19 @@ export namespace Components {
           * When `false`, an empty color (`null`) will be allowed as a `value`. Otherwise, a color value is enforced on the component.  When `true`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`. When `false`, an empty color (`null`) will be allowed as a `value`.
          */
         "allowEmpty": boolean;
+        /**
+          * When true, the component will allow updates to the color's alpha value.
+         */
+        "alphaChannel": boolean;
         /**
           * Specifies accessible label for the input field.
+          * @deprecated use `messages` instead
          */
         "hexLabel": string;
+        /**
+          * Messages are passed by parent component for accessible labels.
+         */
+        "messages": ColorPickerMessages;
         /**
           * Specifies the Unicode numeral system used by the component for localization.
          */
@@ -843,7 +875,7 @@ export namespace Components {
          */
         "setFocus": () => Promise<void>;
         /**
-          * The Hex value.
+          * The hex value.
          */
         "value": string;
     }
@@ -856,7 +888,7 @@ export namespace Components {
           * The color value.
           * @see https://developer.mozilla.org/en-US/docs/Web/CSS/color_value
          */
-        "color": string;
+        "color": string | null;
         /**
           * Specifies the size of the component.
          */
@@ -5493,9 +5525,13 @@ declare namespace LocalJSX {
     }
     interface CalciteAvatar {
         /**
-          * Specifies the full name of the user.
+          * Specifies the full name of the user. When `label` and `thumbnail` are not defined, specifies the accessible name for the component.
          */
         "fullName"?: string;
+        /**
+          * Specifies alternative text when `thumbnail` is defined, otherwise specifies an accessible label.
+         */
+        "label"?: string;
         /**
           * Specifies the size of the component.
          */
@@ -5828,9 +5864,17 @@ declare namespace LocalJSX {
     }
     interface CalciteColorPicker {
         /**
-          * When `false`, an empty color (`null`) will be allowed as a `value`. Otherwise, a color value is enforced on the component.  When `true`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`. When `false`, an empty color (`null`) will be allowed as a `value`.
+          * When `true`, an empty color (`null`) will be allowed as a `value`. When `false`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`.
          */
         "allowEmpty"?: boolean;
+        /**
+          * When true, the component will allow updates to the color's alpha value.
+         */
+        "alphaChannel"?: boolean;
+        /**
+          * When true, hides the RGB/HSV channel inputs
+         */
+        "channelsDisabled"?: boolean;
         /**
           * When `true`, interaction is prevented and the component is displayed with lower opacity.
          */
@@ -5840,16 +5884,23 @@ declare namespace LocalJSX {
           * @default "auto"
          */
         "format"?: Format;
+        /**
+          * When true, hides the hex input
+         */
+        "hexDisabled"?: boolean;
         /**
           * When `true`, hides the RGB/HSV channel inputs.
+          * @deprecated use `channelsDisabled` instead
          */
         "hideChannels"?: boolean;
         /**
-          * When `true`, hides the Hex input.
+          * When `true`, hides the hex input.
+          * @deprecated use `hexDisabled` instead
          */
         "hideHex"?: boolean;
         /**
           * When `true`, hides the saved colors section.
+          * @deprecated use `savedDisabled` instead
          */
         "hideSaved"?: boolean;
         /**
@@ -5868,6 +5919,10 @@ declare namespace LocalJSX {
           * Fires as the color value changes.  Similar to the `calciteColorPickerChange` event with the exception of dragging. When dragging the color field or hue slider thumb, this event fires as the thumb is moved.
          */
         "onCalciteColorPickerInput"?: (event: CalciteColorPickerCustomEvent<void>) => void;
+        /**
+          * When true, hides the saved colors section
+         */
+        "savedDisabled"?: boolean;
         /**
           * Specifies the size of the component.
          */
@@ -5889,8 +5944,13 @@ declare namespace LocalJSX {
           * When `false`, an empty color (`null`) will be allowed as a `value`. Otherwise, a color value is enforced on the component.  When `true`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`. When `false`, an empty color (`null`) will be allowed as a `value`.
          */
         "allowEmpty"?: boolean;
+        /**
+          * When true, the component will allow updates to the color's alpha value.
+         */
+        "alphaChannel"?: boolean;
         /**
           * Specifies accessible label for the input field.
+          * @deprecated use `messages` instead
          */
         "hexLabel"?: string;
         /**
@@ -5906,7 +5966,7 @@ declare namespace LocalJSX {
          */
         "scale"?: Scale;
         /**
-          * The Hex value.
+          * The hex value.
          */
         "value"?: string;
     }
@@ -5919,7 +5979,7 @@ declare namespace LocalJSX {
           * The color value.
           * @see https://developer.mozilla.org/en-US/docs/Web/CSS/color_value
          */
-        "color"?: string;
+        "color"?: string | null;
         /**
           * Specifies the size of the component.
          */
@@ -7365,6 +7425,10 @@ declare namespace LocalJSX {
           * When `true`, a busy indicator is displayed.
          */
         "loading"?: boolean;
+        /**
+          * Emits when any of the list item selections have changed.
+         */
+        "onCalciteListChange"?: (event: CalciteListCustomEvent<void>) => void;
         /**
           * Emits when the component's filter has changed.
          */

package/dist/types/preact.d.ts

@@ -209,7 +209,8 @@ declare module "preact/src/jsx" {
 
       "calcite-link": JSX.CalciteLink & JSXInternal.HTMLAttributes<HTMLCalciteLinkElement>
 
-      "calcite-list": Omit<JSX.CalciteList, "onCalciteListFilter"> & JSXInternal.HTMLAttributes<HTMLCalciteListElement> & {
+      "calcite-list": Omit<JSX.CalciteList, "onCalciteListChange" | "onCalciteListFilter"> & JSXInternal.HTMLAttributes<HTMLCalciteListElement> & {
+        "oncalciteListChange"?: (event: CustomEvent<any>) => void;
         "oncalciteListFilter"?: (event: CustomEvent<any>) => void;
       }
 

package/dist/types/utils/dom.d.ts

@@ -1,3 +1,8 @@
+/**
+ * The default `focus-trap/tabbable` options.
+ *
+ * See https://github.com/focus-trap/tabbable#tabbable
+ */
 export declare const tabbableOptions: {
   getShadowRoot: boolean;
 };
@@ -6,47 +11,115 @@ export declare const tabbableOptions: {
  *
  * If it already has an ID, it will be preserved, otherwise a unique one will be generated and assigned.
  *
- * @param el
+ * @param {Element} el An element.
  * @returns {string} The element's ID.
  */
 export declare function ensureId(el: Element): string;
+/**
+ * This helper returns an array from a NodeList.
+ *
+ * @param {NodeList} nodeList A NodeList.
+ * @returns {Element[]} An array of elements.
+ */
 export declare function nodeListToArray<T extends Element>(nodeList: HTMLCollectionOf<T> | NodeListOf<T> | T[]): T[];
 export type Direction = "ltr" | "rtl";
+/**
+ * This helper returns the Calcite "mode" of an element.
+ *
+ * @param {HTMLElement} el An element.
+ * @returns {"light"|"dark"} The Calcite mode.
+ */
 export declare function getModeName(el: HTMLElement): "light" | "dark";
+/**
+ * This helper returns the direction of a HTML element.
+ *
+ * @param {HTMLElement} el An element.
+ * @returns {Direction} The direction.
+ */
 export declare function getElementDir(el: HTMLElement): Direction;
-export declare function getElementProp(el: Element, prop: string, fallbackValue: any): any;
+/**
+ * This helper returns the value of an attribute on an element.
+ *
+ * @param {HTMLElement} el An element.
+ * @param {string} attribute An attribute name.
+ * @param {any} fallbackValue A fallback value.
+ * @returns {any} The value.
+ * @deprecated
+ */
+export declare function getElementProp(el: Element, attribute: string, fallbackValue: any): any;
+/**
+ * This helper returns the rootNode of an element.
+ *
+ * @param {Element} el An element.
+ * @returns {Document|ShadowRoot} The element's root node.
+ */
 export declare function getRootNode(el: Element): Document | ShadowRoot;
+/**
+ * This helper returns the host of a ShadowRoot.
+ *
+ * @param {Document | ShadowRoot} root A root element.
+ * @returns {Element | null} The host element.
+ */
 export declare function getHost(root: Document | ShadowRoot): Element | null;
 /**
  * This helper queries an element's rootNode and any ancestor rootNodes.
  *
  * If both an 'id' and 'selector' are supplied, 'id' will take precedence over 'selector'.
  *
- * @param element
+ * @param {Element} element An element.
  * @param root0
  * @param root0.selector
  * @param root0.id
- * @returns {Element} The element.
+ * @returns {Element} An element.
  */
 export declare function queryElementRoots<T extends Element = Element>(element: Element, { selector, id }: {
   selector?: string;
   id?: string;
 }): T | null;
+/**
+ * This helper returns the closest element matching the selector by crossing he shadow boundary if necessary.
+ *
+ * @param {Element} element The starting element.
+ * @param {string} selector The selector.
+ * @returns {Element} The targeted element.
+ */
 export declare function closestElementCrossShadowBoundary<T extends Element = Element>(element: Element, selector: string): T | null;
 /**
  * This utility helps invoke a callback as it traverses a node and its ancestors until reaching the root document.
  *
  * Returning early or undefined in `onVisit` will continue traversing up the DOM tree. Otherwise, traversal will halt with the returned value as the result of the function
  *
- * @param element
- * @param onVisit
+ * @param {Element} element An element.
+ * @param {(node: Node) => Element} onVisit The callback.
+ * @returns {Element} The result.
  */
 export declare function walkUpAncestry<T = any>(element: Element, onVisit: (node: Node) => T): T;
+/**
+ * This helper returns true when an element has the descendant in question.
+ *
+ * @param {Element} element The starting element.
+ * @param {Element} maybeDescendant The descendant.
+ * @returns {boolean} The result.
+ */
 export declare function containsCrossShadowBoundary(element: Element, maybeDescendant: Element): boolean;
+/**
+ * An element which may contain a `setFocus` method.
+ */
 export interface FocusableElement extends HTMLElement {
   setFocus?: () => Promise<void>;
 }
+/**
+ * This helper returns true when an element has a setFocus method.
+ *
+ * @param {Element} el An element.
+ * @returns {boolean} The result.
+ */
 export declare function isCalciteFocusable(el: FocusableElement): boolean;
+/**
+ * This helper focuses an element using the `setFocus` method if available and falls back to using the `focus` method if not available.
+ *
+ * @param {Element} el An element.
+ */
 export declare function focusElement(el: FocusableElement): Promise<void>;
 /**
  * Helper to focus the first tabbable element.
@@ -63,9 +136,10 @@ interface GetSlottedOptions {
 /**
  * Gets slotted elements for a named slot.
  *
- * @param element
- * @param slotName
- * @param options
+ * @param {Element} element An element.
+ * @param {string} slotName The slot name.
+ * @param {GetSlottedOptions & { all: true }} options The options.
+ * @returns {Element | Element[] | null} returns element(s) or null.
  * @deprecated Use `onSlotchange` event instead.
  *
  * ```
@@ -78,15 +152,37 @@ export declare function getSlotted<T extends Element = Element>(element: Element
   all: true;
 }): T[];
 export declare function getSlotted<T extends Element = Element>(element: Element, slotName?: string | string[] | GetSlottedOptions, options?: GetSlottedOptions): T | null;
+/**
+ * Filters direct children.
+ *
+ * @param {Element} el An element.
+ * @param {string} selector The selector.
+ * @returns {Element[]} An array of elements.
+ */
 export declare function filterDirectChildren<T extends Element>(el: Element, selector: string): T[];
-export declare function setRequestedIcon(iconObject: Record<string, string>, iconValue: string | boolean, matchedValue: string): string;
+/**
+ * Set a default icon from a defined set or allow an override with an icon name string
+ *
+ * @param {Record<string, string>} iconObject The icon object.
+ * @param {string | boolean} iconValue The icon value.
+ * @param {string} matchedValue The matched value.
+ * @returns {string|undefined} The resulting icon value.
+ */
+export declare function setRequestedIcon(iconObject: Record<string, string>, iconValue: string | boolean, matchedValue: string): string | undefined;
+/**
+ * This helper returns true when two rectangles intersect.
+ *
+ * @param {DOMRect} rect1 The first rectangle.
+ * @param {DOMRect} rect2 The second rectangle.
+ * @returns {boolean} The result.
+ */
 export declare function intersects(rect1: DOMRect, rect2: DOMRect): boolean;
 /**
  * This helper makes sure that boolean aria attributes are properly converted to a string.
  *
  * It should only be used for aria attributes that require a string value of "true" or "false".
  *
- * @param value
+ * @param {boolean} value The value.
  * @returns {string} The string conversion of a boolean value ("true" | "false").
  */
 export declare function toAriaBoolean(value: boolean): string;
@@ -97,7 +193,7 @@ export declare function toAriaBoolean(value: boolean): string;
  * <slot onSlotchange={(event) => this.mySlotHasElement = slotChangeHasAssignedElement(event)} />}
  * ```
  *
- * @param event
+ * @param {Event} event The event.
  * @returns {boolean} Whether the slot has any assigned elements.
  */
 export declare function slotChangeHasAssignedElement(event: Event): boolean;
@@ -108,7 +204,7 @@ export declare function slotChangeHasAssignedElement(event: Event): boolean;
  * <slot onSlotchange={(event) => this.mySlotElements = slotChangeGetAssignedElements(event)} />}
  * ```
  *
- * @param event
+ * @param {Event} event The event.
  * @returns {boolean} Whether the slot has any assigned elements.
  */
 export declare function slotChangeGetAssignedElements(event: Event): Element[];
@@ -117,18 +213,18 @@ export declare function slotChangeGetAssignedElements(event: Event): Element[];
  *
  * See https://www.w3.org/TR/pointerevents/#the-button-property.
  *
- * @param event
- * @returns {boolean}
+ * @param {PointerEvent} event The pointer event.
+ * @returns {boolean} The value.
  */
 export declare function isPrimaryPointerButton(event: PointerEvent): boolean;
+export type FocusElementInGroupDestination = "first" | "last" | "next" | "previous";
 /**
  * This helper sets focus on and returns a destination element from within a group of provided elements.
  *
- * @param elements An array of elements
- * @param currentElement The current element
- * @param destination The target destination element to focus
+ * @param {Element[]} elements An array of elements.
+ * @param {Element} currentElement The current element.
+ * @param {FocusElementInGroupDestination} destination The target destination element to focus.
  * @returns {Element} The focused element
  */
-export type FocusElementInGroupDestination = "first" | "last" | "next" | "previous";
 export declare const focusElementInGroup: (elements: Element[], currentElement: Element, destination: FocusElementInGroupDestination) => Element;
 export {};