@esri/calcite-components 5.0.0-next.72 → 5.0.0-next.74

package/dist/chunks/utils.js

@@ -1,6 +1,6 @@
 /*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
-v5.0.0-next.72 */
+v5.0.0-next.74 */
 import Color from "color";
 import { c as calciteSpacingFixedXl, a as calciteSpacingFixedMd, b as calciteSpacingFixedSm } from "./global.js";
 const CSS = {
@@ -297,27 +297,27 @@ export {
   OPACITY_LIMITS as O,
   RGB_LIMITS as R,
   STATIC_DIMENSIONS as S,
-  isLonghandHex as a,
-  isShorthandHex as b,
-  alphaToOpacity as c,
-  hexChar as d,
-  getColorFieldDimensions as e,
-  colorFromValue as f,
+  getColorFieldDimensions as a,
+  hexify as b,
+  colorFromValue as c,
+  DEFAULT_STORAGE_KEY_PREFIX as d,
+  alphaCompatible as e,
+  colorEqual as f,
   getSliderWidth as g,
-  hexify as h,
+  hexToRGB as h,
   isValidHex as i,
-  DEFAULT_STORAGE_KEY_PREFIX as j,
-  alphaCompatible as k,
-  colorEqual as l,
-  CSS as m,
+  CSS as j,
+  toNonAlphaMode as k,
+  HUE_LIMIT_CONSTRAINED as l,
+  normalizeAlpha as m,
   normalizeHex as n,
   opacityToAlpha as o,
   parseMode as p,
-  toNonAlphaMode as q,
-  rgbToHex as r,
-  HUE_LIMIT_CONSTRAINED as s,
+  alphaToOpacity as q,
+  SCOPE_SIZE as r,
+  isLonghandHex as s,
   toAlphaMode as t,
-  normalizeAlpha as u,
-  SCOPE_SIZE as v,
-  hexToRGB as w
+  isShorthandHex as u,
+  rgbToHex as v,
+  hexChar as w
 };

package/dist/chunks/utils2.js

@@ -1,55 +1,60 @@
 /*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
-v5.0.0-next.72 */
+v5.0.0-next.74 */
 import { isServer } from "lit";
-const listSelector = "calcite-list";
-const listItemGroupSelector = "calcite-list-item-group";
-const listItemSelector = "calcite-list-item";
-function expandedAncestors(el) {
-  const ancestor = el.parentElement?.closest(listItemSelector);
-  if (!ancestor) {
-    return;
-  }
-  ancestor.open = true;
-  expandedAncestors(ancestor);
+import { o as nodeListToArray } from "./dom.js";
+import { A as AllComboboxChildrenSelector, a as ComboboxItemSelector, b as ComboboxItemGroupSelector } from "./resources4.js";
+function getAncestors(element) {
+  const parent = element.parentElement?.closest(AllComboboxChildrenSelector);
+  const grandparent = parent?.parentElement?.closest(AllComboboxChildrenSelector);
+  return [parent, grandparent].filter((el) => el);
+}
+function getItemAncestors(item) {
+  return item.ancestors?.filter((el) => el.nodeName === "CALCITE-COMBOBOX-ITEM") || [];
 }
-function getListItemChildren(slotEl) {
-  const assignedElements = slotEl.assignedElements({ flatten: true });
-  const groupChildren = assignedElements.filter((el) => el?.matches(listItemGroupSelector)).map((group) => Array.from(group.querySelectorAll(listItemSelector))).flat();
-  const listItemChildren = assignedElements.filter((el) => el?.matches(listItemSelector));
-  const listChildren = assignedElements.filter((el) => el?.matches(listSelector));
-  return {
-    lists: listChildren,
-    items: groupChildren.concat(listItemChildren)
-  };
+function getItemChildren(item) {
+  return nodeListToArray(item.querySelectorAll("calcite-combobox-item"));
 }
-function updateListItemChildren(slotEl) {
-  const listItemChildren = slotEl.assignedElements({ flatten: true }).filter((el) => el.matches(listItemSelector));
-  const filteredListItemChildren = listItemChildren.filter((listItem) => !listItem.filterHidden);
-  listItemChildren.forEach((listItem) => {
-    const index = filteredListItemChildren.indexOf(listItem);
-    listItem.setPosition = index === -1 ? void 0 : index + 1;
-    listItem.setSize = index === -1 ? void 0 : filteredListItemChildren.length;
-  });
+function hasActiveChildren(node) {
+  const items = nodeListToArray(node.querySelectorAll("calcite-combobox-item"));
+  return items.filter((item) => item.selected).length > 0;
 }
-function getDepth(element, includeGroup = false) {
+function getDepth(element) {
   if (isServer) {
     return 0;
   }
-  const expression = includeGroup ? "ancestor::calcite-list-item | ancestor::calcite-list-item-group" : "ancestor::calcite-list-item";
-  const result = document.evaluate(expression, element, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null);
-  return result.snapshotLength;
+  const result = document.evaluate(
+    "ancestor::calcite-combobox-item | ancestor::calcite-combobox-item-group",
+    element,
+    null,
+    XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
+    null
+  );
+  const depth = result.snapshotLength;
+  if (depth > 0 && element.nodeName === ComboboxItemSelector) {
+    for (let i = 0; i < depth; i++) {
+      const parent = result.snapshotItem(i);
+      if (parent.nodeName === ComboboxItemGroupSelector) {
+        return depth;
+      }
+    }
+  } else if (element.nodeName === ComboboxItemGroupSelector) {
+    return depth;
+  }
+  return depth + 1;
+}
+function isSingleLike(selectionMode) {
+  return selectionMode.includes("single");
 }
-function isListItem(element) {
-  return element.tagName === "CALCITE-LIST-ITEM";
+function getLabel(item) {
+  return item.shortHeading || item.heading;
 }
 export {
-  getListItemChildren as a,
-  listItemSelector as b,
-  listItemGroupSelector as c,
-  expandedAncestors as e,
-  getDepth as g,
-  isListItem as i,
-  listSelector as l,
-  updateListItemChildren as u
+  getItemAncestors as a,
+  getItemChildren as b,
+  getAncestors as c,
+  getDepth as d,
+  getLabel as g,
+  hasActiveChildren as h,
+  isSingleLike as i
 };

package/dist/chunks/utils3.js

@@ -1,8 +1,8 @@
 /*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
-v5.0.0-next.72 */
+v5.0.0-next.74 */
 import { defaultLocale, normalizeLocale, supportedLocales } from "@arcgis/toolkit/intl";
-import { a as dateFromISO } from "./date.js";
+import { d as dateFromISO } from "./date.js";
 import { g as getAssetPath } from "./runtime.js";
 const translationCache = {};
 const requestCache = {};

package/dist/chunks/utils4.js

@@ -1,60 +1,55 @@
 /*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
-v5.0.0-next.72 */
+v5.0.0-next.74 */
 import { isServer } from "lit";
-import { n as nodeListToArray } from "./dom.js";
-import { A as AllComboboxChildrenSelector, C as ComboboxItemSelector, a as ComboboxItemGroupSelector } from "./resources6.js";
-function getAncestors(element) {
-  const parent = element.parentElement?.closest(AllComboboxChildrenSelector);
-  const grandparent = parent?.parentElement?.closest(AllComboboxChildrenSelector);
-  return [parent, grandparent].filter((el) => el);
-}
-function getItemAncestors(item) {
-  return item.ancestors?.filter((el) => el.nodeName === "CALCITE-COMBOBOX-ITEM") || [];
+const listSelector = "calcite-list";
+const listItemGroupSelector = "calcite-list-item-group";
+const listItemSelector = "calcite-list-item";
+function expandedAncestors(el) {
+  const ancestor = el.parentElement?.closest(listItemSelector);
+  if (!ancestor) {
+    return;
+  }
+  ancestor.open = true;
+  expandedAncestors(ancestor);
 }
-function getItemChildren(item) {
-  return nodeListToArray(item.querySelectorAll("calcite-combobox-item"));
+function getListItemChildren(slotEl) {
+  const assignedElements = slotEl.assignedElements({ flatten: true });
+  const groupChildren = assignedElements.filter((el) => el?.matches(listItemGroupSelector)).map((group) => Array.from(group.querySelectorAll(listItemSelector))).flat();
+  const listItemChildren = assignedElements.filter((el) => el?.matches(listItemSelector));
+  const listChildren = assignedElements.filter((el) => el?.matches(listSelector));
+  return {
+    lists: listChildren,
+    items: groupChildren.concat(listItemChildren)
+  };
 }
-function hasActiveChildren(node) {
-  const items = nodeListToArray(node.querySelectorAll("calcite-combobox-item"));
-  return items.filter((item) => item.selected).length > 0;
+function updateListItemChildren(slotEl) {
+  const listItemChildren = slotEl.assignedElements({ flatten: true }).filter((el) => el.matches(listItemSelector));
+  const filteredListItemChildren = listItemChildren.filter((listItem) => !listItem.filterHidden);
+  listItemChildren.forEach((listItem) => {
+    const index = filteredListItemChildren.indexOf(listItem);
+    listItem.setPosition = index === -1 ? void 0 : index + 1;
+    listItem.setSize = index === -1 ? void 0 : filteredListItemChildren.length;
+  });
 }
-function getDepth(element) {
+function getDepth(element, includeGroup = false) {
   if (isServer) {
     return 0;
   }
-  const result = document.evaluate(
-    "ancestor::calcite-combobox-item | ancestor::calcite-combobox-item-group",
-    element,
-    null,
-    XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
-    null
-  );
-  const depth = result.snapshotLength;
-  if (depth > 0 && element.nodeName === ComboboxItemSelector) {
-    for (let i = 0; i < depth; i++) {
-      const parent = result.snapshotItem(i);
-      if (parent.nodeName === ComboboxItemGroupSelector) {
-        return depth;
-      }
-    }
-  } else if (element.nodeName === ComboboxItemGroupSelector) {
-    return depth;
-  }
-  return depth + 1;
-}
-function isSingleLike(selectionMode) {
-  return selectionMode.includes("single");
+  const expression = includeGroup ? "ancestor::calcite-list-item | ancestor::calcite-list-item-group" : "ancestor::calcite-list-item";
+  const result = document.evaluate(expression, element, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null);
+  return result.snapshotLength;
 }
-function getLabel(item) {
-  return item.shortHeading || item.heading;
+function isListItem(element) {
+  return element.tagName === "CALCITE-LIST-ITEM";
 }
 export {
-  getDepth as a,
-  getLabel as b,
-  getItemAncestors as c,
-  getItemChildren as d,
-  getAncestors as g,
-  hasActiveChildren as h,
-  isSingleLike as i
+  listSelector as a,
+  listItemGroupSelector as b,
+  getListItemChildren as c,
+  expandedAncestors as e,
+  getDepth as g,
+  isListItem as i,
+  listItemSelector as l,
+  updateListItemChildren as u
 };

package/dist/components/calcite-accordion/customElement.d.ts

@@ -1,44 +1,50 @@
 /// <reference path="../../index.d.ts" />
-import { PropertyValues } from 'lit';
-import { PublicLitElement as LitElement, JsxNode, TargetedEvent } from '@arcgis/lumina';
-import { Appearance, Position, IconType, Scale, SelectionMode } from '../interfaces';
+import type { PublicLitElement as LitElement } from "@arcgis/lumina/PublicLitElement";
+import type { Appearance, Position, IconType, Scale, SelectionMode } from "../interfaces.js";
 
-/** @slot  - A slot for adding `calcite-accordion-item`s. `calcite-accordion` cannot be nested, however `calcite-accordion-item`s can. */
-export declare class Accordion extends LitElement {
-    /**
-     * Specifies the appearance of the component.
-     *
-     * @default "solid"
-     */
-    appearance: Extract<"solid" | "transparent", Appearance>;
-    /**
-     * Specifies the placement of the icon in the header.
-     *
-     * @default "end"
-     */
-    iconPosition: Extract<"start" | "end", Position>;
-    /**
-     * Specifies the type of the icon in the header.
-     *
-     * @default "chevron"
-     */
-    iconType: Extract<"chevron" | "caret" | "plus-minus", IconType>;
-    /**
-     * Specifies the size of the component.
-     *
-     * @default "m"
-     */
-    scale: Scale;
-    /**
-     * Specifies the selection mode of the component, where:
-     *
-     * `"multiple"` allows any number of selections,
-     *
-     * `"single"` allows only one selection, and
-     *
-     * `"single-persist"` allows one selection and prevents de-selection.
-     *
-     * @default "multiple"
-     */
-    selectionMode: Extract<"single" | "single-persist" | "multiple", SelectionMode>;
-}
+/**
+ * @cssproperty [--calcite-accordion-border-color] - Specifies the component's border color.
+ * @cssproperty [--calcite-accordion-background-color] - Specifies the component's background color.
+ * @cssproperty [--calcite-accordion-text-color] - Specifies the component's text color.
+ * @cssproperty [--calcite-accordion-text-color-hover] - Specifies the component's main text color on hover.
+ * @cssproperty [--calcite-accordion-text-color-press] - Specifies the component's main text color when pressed.
+ * @slot  - A slot for adding `calcite-accordion-item`s. `calcite-accordion` cannot be nested, however `calcite-accordion-item`s can.
+ */
+export abstract class Accordion extends LitElement {
+  /**
+   * Specifies the appearance of the component.
+   *
+   * @default "solid"
+   */
+  accessor appearance: Extract<"solid" | "transparent", Appearance>;
+  /**
+   * Specifies the placement of the icon in the header.
+   *
+   * @default "end"
+   */
+  accessor iconPosition: Extract<"start" | "end", Position>;
+  /**
+   * Specifies the type of the icon in the header.
+   *
+   * @default "chevron"
+   */
+  accessor iconType: Extract<"chevron" | "caret" | "plus-minus", IconType>;
+  /**
+   * Specifies the size of the component.
+   *
+   * @default "m"
+   */
+  accessor scale: Scale;
+  /**
+   * Specifies the selection mode of the component, where:
+   *
+   * `"multiple"` allows any number of selections,
+   *
+   * `"single"` allows only one selection, and
+   *
+   * `"single-persist"` allows one selection and prevents de-selection.
+   *
+   * @default "multiple"
+   */
+  accessor selectionMode: Extract<"single" | "single-persist" | "multiple", SelectionMode>;
+}

package/dist/components/calcite-accordion/customElement.js

@@ -1,6 +1,6 @@
 /*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
-v5.0.0-next.72 */
+v5.0.0-next.74 */
 import { c as customElement } from "../../chunks/runtime.js";
 import { css, html } from "lit";
 import { LitElement, createEvent, safeClassMap } from "@arcgis/lumina";

package/dist/components/calcite-accordion-item/customElement.d.ts

@@ -1,57 +1,71 @@
 /// <reference path="../../index.d.ts" />
-import { PropertyValues } from 'lit';
-import { PublicLitElement as LitElement, JsxNode, TargetedEvent } from '@arcgis/lumina';
-import { FlipContext, Position, Scale, IconType, Appearance } from '../interfaces';
-import { IconName } from '../calcite-icon/interfaces';
-import { Accordion } from '../calcite-accordion/customElement.js';
-import { HeadingLevel } from '../functional/Heading';
-import { RequestedItem } from './interfaces';
+import type { PublicLitElement as LitElement } from "@arcgis/lumina/PublicLitElement";
+import type { FlipContext } from "../interfaces.js";
+import type { IconName } from "../calcite-icon/interfaces.js";
+import type { HeadingLevel } from "../functional/Heading.js";
 
 /**
+ * @cssproperty [--calcite-accordion-border-color] - Specifies the component's border color.
+ * @cssproperty [--calcite-accordion-background-color] - Specifies the component's background color.
+ * @cssproperty [--calcite-accordion-text-color] - Specifies the component's text color.
+ * @cssproperty [--calcite-accordion-text-color-hover] - Specifies the component's main text color on hover.
+ * @cssproperty [--calcite-accordion-text-color-press] - Specifies the component's main text color when pressed.
+ * @cssproperty [--calcite-accordion-item-background-color] - [Deprecated] Use `--calcite-accordion-background-color`. Specifies the component's background color.
+ * @cssproperty [--calcite-accordion-item-border-color] - [Deprecated] Use `--calcite-accordion-border-color`. Specifies the component's border color.
+ * @cssproperty [--calcite-accordion-item-content-space] - Specifies the component's padding.
+ * @cssproperty [--calcite-accordion-item-end-icon-color] - Specifies the component's `iconEnd` color. Falls back to `--calcite-accordion-item-icon-color` or current color.
+ * @cssproperty [--calcite-accordion-item-expand-icon-color] - Specifies the component's expand icon color.
+ * @cssproperty [--calcite-accordion-item-header-background-color] - Specifies the component's `heading` background color.
+ * @cssproperty [--calcite-accordion-item-header-background-color-hover] - Specifies the component's `heading` background color when hovered.
+ * @cssproperty [--calcite-accordion-item-header-background-color-press] - Specifies the component's `heading` background color when pressed.
+ * @cssproperty [--calcite-accordion-item-heading-text-color] - Specifies the component's `heading` text color.
+ * @cssproperty [--calcite-accordion-item-icon-color] - [Deprecated] Use `--calcite-icon-color`. Specifies the component's default icon color.
+ * @cssproperty [--calcite-accordion-item-start-icon-color] - Specifies the component's `iconStart` color. Falls back to `--calcite-accordion-item-icon-color` or current color.
+ * @cssproperty [--calcite-accordion-item-text-color] - [Deprecated] Use `--calcite-accordion-text-color`. Specifies the component's text color.
+ * @cssproperty [--calcite-accordion-item-text-color-hover] - [Deprecated] Use `--calcite-accordion-text-color-hover`. Specifies the component's text color on hover.
  * @slot  - A slot for adding custom content, including nested `calcite-accordion-item`s.
  * @slot [actions-end] - A slot for adding `calcite-action`s or content to the end side of the component's header.
  * @slot [actions-start] - A slot for adding `calcite-action`s or content to the start side of the component's header.
  * @slot [content-end] - A slot for adding non-actionable elements after the component's header text.
  * @slot [content-start] - A slot for adding non-actionable elements before the component's header text.
  */
-export declare class AccordionItem extends LitElement {
-    /** Specifies a description for the component. */
-    description: string;
-    /**
-     * When `true`, expands the component and its contents.
-     *
-     * @default false
-     */
-    expanded: boolean;
-    /** Specifies heading text for the component. */
-    heading: string;
-    /** Specifies an icon to display at the end of the component. */
-    iconEnd: IconName;
-    /** Displays the `iconStart` and/or `iconEnd` as flipped when the element direction is right-to-left (`"rtl"`). */
-    iconFlipRtl: FlipContext;
-    /** Specifies the heading level of the component's `heading` for proper document structure, without affecting visual styling. */
-    headingLevel: HeadingLevel;
-    /** Specifies an icon to display at the start of the component. */
-    iconStart: IconName;
-    /** Use this property to override individual strings used by the component. */
-    messageOverrides?: typeof this.messages._overrides;
-    /**
-     * Sets focus on the component.
-     *
-     * @param options
-     * @param options - When specified an optional object customizes the component's focusing process. When `preventScroll` is `true`, scrolling will not occur on the component.
-     * @mdn [focus(options)](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus#options)
-     */
-    setFocus(options?: FocusOptions): Promise<void>;
-    /** Fires when the component's content area is collapsed. */
-    readonly calciteAccordionItemCollapse: TargetedEvent<this, void>;
-    /** Fires when the component's content area is expanded. */
-    readonly calciteAccordionItemExpand: TargetedEvent<this, void>;
-    private messages: Partial<{
-        collapse: string;
-        expand: string;
-    }> & import('@arcgis/lumina/controllers').T9nMeta<{
-        collapse: string;
-        expand: string;
-    }>;
-}
+export abstract class AccordionItem extends LitElement {
+  /** Specifies a description for the component. */
+  accessor description: string;
+  /**
+   * When `true`, expands the component and its contents.
+   *
+   * @default false
+   */
+  accessor expanded: boolean;
+  /** Specifies the component's heading text. */
+  accessor heading: string;
+  /** Specifies the heading level number of the component's `heading` for proper document structure, without affecting visual styling. */
+  accessor headingLevel: HeadingLevel;
+  /** Specifies an icon to display at the end of the component. */
+  accessor iconEnd: IconName;
+  /** Displays the `iconStart` and/or `iconEnd` as flipped when the element direction is right-to-left (`"rtl"`). */
+  accessor iconFlipRtl: FlipContext;
+  /** Specifies an icon to display at the start of the component. */
+  accessor iconStart: IconName;
+  /** Overrides individual strings used by the component. */
+  accessor messageOverrides: {
+      collapse?: string;
+      expand?: string;
+  };
+  /**
+   * Sets focus on the component.
+   *
+   * @param options - When specified an optional object customizes the component's focusing process. When `preventScroll` is `true`, scrolling will not occur on the component.
+   * @mdn [focus(options)](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus#options)
+   */
+  setFocus(options?: FocusOptions): Promise<void>;
+  /** Fires when the component's content area is collapsed. */
+  readonly calciteAccordionItemCollapse: import("@arcgis/lumina").TargetedEvent<this, void>;
+  /** Fires when the component's content area is expanded. */
+  readonly calciteAccordionItemExpand: import("@arcgis/lumina").TargetedEvent<this, void>;
+  readonly "@eventTypes": {
+    calciteAccordionItemCollapse: AccordionItem["calciteAccordionItemCollapse"]["detail"];
+    calciteAccordionItemExpand: AccordionItem["calciteAccordionItemExpand"]["detail"];
+  };
+}

package/dist/components/calcite-accordion-item/customElement.js

@@ -1,12 +1,12 @@
 /*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
 See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
-v5.0.0-next.72 */
+v5.0.0-next.74 */
 import { C as CSS_UTILITY, c as customElement } from "../../chunks/runtime.js";
 import { keyed } from "lit/directives/keyed.js";
 import { css, html, nothing } from "lit";
 import { LitElement, createEvent, safeClassMap } from "@arcgis/lumina";
 import { createRef, ref } from "lit/directives/ref.js";
-import { o as closestElementCrossShadowBoundary, a as slotChangeHasAssignedElement, g as getElementDir } from "../../chunks/dom.js";
+import { c as closestElementCrossShadowBoundary, s as slotChangeHasAssignedElement, g as getElementDir } from "../../chunks/dom.js";
 import { g as getIconScale } from "../../chunks/component.js";
 import { u as useSetFocus } from "../../chunks/useSetFocus.js";
 import { u as useT9n } from "../../chunks/useT9n.js";

package/dist/components/calcite-accordion-item/index.d.ts

@@ -1,2 +1 @@
-import "../calcite-icon/index.js";
 export * from "./customElement.js";