@esri/calcite-components 5.0.0-next.8 → 5.0.0-next.80

package/dist/utils/floating-ui.d.ts

@@ -1,183 +1,35 @@
-import { Placement, Strategy, VirtualElement } from '@floating-ui/dom';
-import { Layout } from '../components/interfaces';
-/**
- * Positions the floating element relative to the reference element.
- *
- * **Note:** exported for testing purposes only
- *
- * @param root0
- * @param root0.referenceEl
- * @param root0.floatingEl
- * @param root0.overlayPositioning
- * @param root0.placement
- * @param root0.flipDisabled
- * @param root0.flipPlacements
- * @param root0.offsetDistance
- * @param root0.offsetSkidding
- * @param root0.arrowEl
- * @param root0.type
- * @param component
- * @param root0.referenceEl.referenceEl
- * @param root0.referenceEl.floatingEl
- * @param root0.referenceEl.overlayPositioning
- * @param root0.referenceEl.placement
- * @param root0.referenceEl.flipDisabled
- * @param root0.referenceEl.flipPlacements
- * @param root0.referenceEl.offsetDistance
- * @param root0.referenceEl.offsetSkidding
- * @param root0.referenceEl.arrowEl
- * @param root0.referenceEl.type
- * @param component.referenceEl
- * @param component.floatingEl
- * @param component.overlayPositioning
- * @param component.placement
- * @param component.flipDisabled
- * @param component.flipPlacements
- * @param component.offsetDistance
- * @param component.offsetSkidding
- * @param component.arrowEl
- * @param component.type
- */
-export declare const positionFloatingUI: (component: FloatingUIComponent, { referenceEl, floatingEl, overlayPositioning, placement, flipDisabled, flipPlacements, offsetDistance, offsetSkidding, arrowEl, type, }: {
-    referenceEl: ReferenceElement;
-    floatingEl: HTMLElement;
-    overlayPositioning: Strategy;
-    placement: LogicalPlacement;
-    flipDisabled?: boolean;
-    flipPlacements?: FlipPlacement[];
-    offsetDistance?: number;
-    offsetSkidding?: number;
-    arrowEl?: SVGSVGElement;
-    type: UIType;
-}) => Promise<void>;
-/** Exported for testing purposes only */
-export declare const placementDataAttribute = "data-placement";
+import type { Strategy, VirtualElement } from "@floating-ui/dom";
+
 export type ReferenceElement = VirtualElement | Element;
-type UIType = "menu" | "tooltip" | "popover";
+
 export type OverlayPositioning = Strategy;
-/**
- * Variation Placements change based on element direction.
- *
- * These variation placements will automatically flip "left"/"right" depending on LTR/RTL direction.
- *
- * Floating-ui has no plans to offer this functionality out of the box at this time.
- *
- * see: https://github.com/floating-ui/floating-ui/issues/1563 and https://github.com/floating-ui/floating-ui/discussions/1549
- */
-export type EffectivePlacement = Placement;
-export declare const placements: readonly ["auto", "auto-start", "auto-end", "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end", "leading-start", "leading", "leading-end", "trailing-end", "trailing", "trailing-start"];
+
 export type LogicalPlacement = (typeof placements)[number];
-export declare const effectivePlacements: EffectivePlacement[];
-export declare const menuPlacements: MenuPlacement[];
-export declare const menuEffectivePlacements: EffectivePlacement[];
+
 export type FlipPlacement = Exclude<LogicalPlacement, "auto" | "auto-start" | "auto-end">;
-export declare const flipPlacements: FlipPlacement[];
+
 export type MenuPlacement = Extract<LogicalPlacement, "top-start" | "top" | "top-end" | "bottom-start" | "bottom" | "bottom-end">;
-export declare const defaultMenuPlacement: MenuPlacement;
-export declare const defaultEndMenuPlacement: MenuPlacement;
-export interface FloatingUIComponent {
-    /** Whether the component is opened. */
-    open: boolean;
-    /** 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 component will be positioned relative to the referenceElement.
-     *
-     * Possible values: "auto", "auto-start", "auto-end", "top", "right", "bottom", "left", "top-start", "top-end", "right-start", "right-end", "bottom-start", "bottom-end", "left-start", "left-end", "leading-start", "leading", "leading-end", "trailing-end", "trailing",  or "trailing-start".
-     */
-    placement: LogicalPlacement;
-    /**
-     * Updates the position of the component.
-     *
-     * @param delayed – (internal) when true, it will reposition the component after a delay. the default is false. This is useful for components that have multiple watched properties that schedule repositioning.
-     */
-    reposition: (delayed?: boolean) => Promise<void>;
-    /**
-     * Used to store the effective floating layout for components that use arrows.
-     *
-     * This is an internal property and should:
-     *
-     * - only be used for components that support arrows
-     * - use the `@State` decorator
-     * - be initialized to "vertical"
-     *
-     * Possible values: "vertical" or "horizontal".
-     *
-     * See [FloatingArrow](https://github.com/Esri/calcite-design-system/blob/dev/src/components/functional/FloatingArrow.tsx)
-     */
-    floatingLayout?: FloatingLayout;
-    /** The `floatingElement` containing the floating ui. */
-    floatingEl: HTMLElement;
-    /** The `referenceElement` used to position the component according to its `placement` value. */
-    referenceEl: ReferenceElement;
-}
-export type FloatingLayout = Extract<Layout, "vertical" | "horizontal">;
-export declare const FloatingCSS: {
-    animation: string;
-    animationActive: string;
-    arrow: string;
-    arrowStroke: string;
-};
-export declare function filterValidFlipPlacements(placements: string[], el: HTMLElement): FlipPlacement[];
-export declare function getEffectivePlacement(placement: LogicalPlacement, isRTL?: boolean): EffectivePlacement;
-/**
- * Convenience function to manage `reposition` calls for FloatingUIComponents that use `positionFloatingUI.
- *
- * Note: this is not needed for components that use `calcite-popover`.
- *
- * @param component - A floating-ui component.
- * @param options - Reposition parameters.
- * @param options.referenceEl - The `referenceElement` used to position the component according to its `placement` value.
- * @param options.floatingEl - The `floatingElement` containing the floating ui.
- * @param options.overlayPositioning - type of positioning to use for the overlaid content.
- * @param options.placement - Determines where the component will be positioned relative to the `referenceElement`.
- * @param options.flipDisabled - Prevents flipping the component's placement when overlapping its `referenceElement`.
- * @param options.flipPlacements - Defines the available placements that can be used when a flip occurs.
- * @param options.offsetDistance - Offsets the position of the popover away from the `referenceElement`.
- * @param options.offsetSkidding - Offsets the position of the component along the `referenceElement`.
- * @param options.arrowEl - A customizable arrow element.
- * @param options.type - The type of floating UI.
- * @param delayed - Reposition the component after a delay.
- * @returns {Promise<void>}
- */
-export declare function reposition(component: FloatingUIComponent, options: Parameters<typeof positionFloatingUI>[1], delayed?: boolean): Promise<void>;
-type PendingFloatingUIState = {
-    state: "pending";
-};
-type ActiveFloatingUIState = {
-    state: "active";
-    cleanUp: () => void;
-};
-type TrackedFloatingUIState = PendingFloatingUIState | ActiveFloatingUIState;
-/**
- * Exported for testing purposes only
- *
- * @private
- */
-export declare const autoUpdatingComponentMap: WeakMap<FloatingUIComponent, TrackedFloatingUIState>;
-/**
- * Helper to hide the floating element when the component is closed. This should be called within onClose() of an OpenCloseComponent.
- *
- * @param component - A floating-ui component.
- */
-export declare function hideFloatingUI(component: FloatingUIComponent): void;
-/**
- * Helper to set up floating element interactions on connectedCallback.
- *
- * @param component - A floating-ui component.
- * @returns {Promise<void>}
- */
-export declare function connectFloatingUI(component: FloatingUIComponent): Promise<void>;
-/**
- * Helper to tear down floating element interactions on disconnectedCallback.
- *
- * @param component - A floating-ui component.
- */
-export declare function disconnectFloatingUI(component: FloatingUIComponent): void;
-/**
- * Default offset the position of the floating element away from the reference element.
- *
- * @default 6
- */
-export declare const defaultOffsetDistance: number;
-export {};
+
+export const placements: readonly [
+    "auto",
+    "auto-start",
+    "auto-end",
+    "top",
+    "top-start",
+    "top-end",
+    "bottom",
+    "bottom-start",
+    "bottom-end",
+    "right",
+    "right-start",
+    "right-end",
+    "left",
+    "left-start",
+    "left-end",
+    "leading-start",
+    "leading",
+    "leading-end",
+    "trailing-end",
+    "trailing",
+    "trailing-start"
+];

package/dist/utils/form.d.ts

@@ -1,176 +1,3 @@
-import { Writable } from 'type-fest';
-import { TemplateResult } from 'lit-html';
-import { IconName } from '../components/calcite-icon/interfaces';
-import { Status } from '../components/interfaces';
-/** Any form <Component> with a `calcite<Component>Input` event needs to be included in this array. */
-export declare const componentsWithInputEvent: string[];
-/**
- * Get the event name to listen for that, when emitted, will clear the
- * validation message that displays after form submission. Only validation
- * messages that are set by the browser will be cleared. If a user sets
- * validationMessage to a custom value, they are responsible for clearing it.
- *
- * Exported for testing purposes.
- *
- * @param componentTag the tag of the component, e.g. "calcite-input"
- * @returns the event name
- */
-export declare function getClearValidationEventName(componentTag: string): string;
-export type MutableValidityState = Writable<ValidityState>;
-/** Exported for testing purposes. */
-export declare const hiddenFormInputSlotName = "hidden-form-input";
-/**
- * Defines interface for form owning components.
- *
- * Allows calling submit/reset methods on the form.
- */
-export interface FormOwner {
-    /** The host element. */
-    readonly el: HTMLElement;
-    /**
-     * The ID of the form to associate with the component.
-     *
-     * When not set, the component will be associated with its ancestor form element, if any.
-     *
-     * Note that this prop should use the `@Prop` decorator.
-     */
-    form: string;
-    /**
-     * The form this component is associated with.
-     *
-     * @private
-     */
-    formEl: HTMLFormElement;
-}
-/**
- * Defines interface for form-associated components.
- *
- * Along with the interface, use the matching form utils to help set up the component behavior.
- */
-export interface FormComponent<T = any> extends FormOwner {
-    /** When true, this component's value will not be submitted in the form. */
-    disabled: boolean;
-    /**
-     * When true, form submit requests will enforce field requirement.
-     *
-     * @todo remove optional in follow-up PR
-     */
-    required?: boolean;
-    /**
-     * The name used to submit the value to the associated form.
-     *
-     * Note that this prop should use the `@Prop` decorator.
-     */
-    name: string;
-    /**
-     * This form component's value.
-     *
-     * Note that this prop should use the `@Prop` decorator.
-     */
-    value: T;
-    /**
-     * The initial value for this form component.
-     *
-     * When the form is reset, the value will be set to this property.
-     */
-    defaultValue: T;
-    /** The validation icon to display. */
-    validationIcon?: IconName | boolean;
-    /** The validation message to display. */
-    validationMessage?: string;
-    /** The validity state of the form component. */
-    validity?: MutableValidityState;
-    /** Hook for components to provide custom form reset behavior. */
-    onFormReset?: () => void;
-    /**
-     * Hook for components to sync _extra_ props on the hidden input form element used for form-submitting.
-     *
-     * Note: The following props are set by default: disabled, hidden, name, required, value.
-     */
-    syncHiddenFormInput?: (input: HTMLInputElement) => void;
-}
-/**
- * Defines interface for checkable form-associated components.
- *
- * Along with the interface, use the matching form utils to help set up the component behavior.
- */
-export interface CheckableFormComponent<T = any> extends FormComponent<T> {
-    /** For boolean-valued components, this property defines whether the associated value is submitted to the form or not. */
-    checked: boolean;
-    /**
-     * The initial checked value for this form component.
-     *
-     * When the form is reset, the checked property will be set to this value.
-     */
-    defaultChecked: boolean;
-}
-export interface ValidationProps {
-    status: Status;
-    message: string;
-    icon: IconName | boolean;
-}
-/**
- * Helper to submit a form.
- *
- * @param component
- * @returns true if its associated form was submitted, false otherwise.
- */
-export declare function submitForm(component: FormOwner): boolean;
-/**
- * Helper to reset a form.
- *
- * @param component
- */
-export declare function resetForm(component: FormOwner): void;
-/**
- * Helper to set up form interactions on connectedCallback.
- *
- * @param component
- */
-export declare function connectForm<T>(component: FormComponent<T>): void;
-/**
- * Utility method to find a form-component's associated form element.
- *
- * @param component
- */
-export declare function findAssociatedForm(component: FormOwner): HTMLFormElement | null;
-/**
- * Helper to tear down form interactions on disconnectedCallback.
- *
- * @param component
- */
-export declare function disconnectForm<T>(component: FormComponent<T>): void;
-/**
- * Helper for setting the default value on initialization after connectedCallback.
- *
- * Note that this is only needed if the default value cannot be determined on connectedCallback.
- *
- * @param component
- * @param value
- */
-export declare function afterConnectDefaultValueSet<T>(component: FormComponent<T>, value: any): void;
-export declare const internalHiddenInputInputEvent = "calciteInternalHiddenInputInput";
-interface HiddenFormInputSlotProps {
-    component: FormComponent;
-}
-/**
- * Helper to render the slot for form-associated component's hidden input.
- *
- * If the component has a default slot, this must be placed at the bottom of the component's root container to ensure it is the last child.
- *
- * render(): VNode {
- *   <Host>
- *     <div class={CSS.container}>
- *     // ...
- *     <HiddenFormInputSlot component={this} />
- *     </div>
- *   </Host>
- * }
- *
- * Note that the hidden-form-input Sass mixin must be added to the component's style to apply specific styles.
- *
- * @param root0
- * @param root0.component
- */
-export declare const HiddenFormInputSlot: ({ component }: HiddenFormInputSlotProps) => TemplateResult;
-export {};
+import type { Writable } from "type-fest";
+
+export type MutableValidityState = Writable<ValidityState>;

package/dist/utils/locale.d.ts

@@ -1,150 +1,14 @@
-export declare const defaultLocale = "en";
-export declare const locales: string[];
 /**
- * To reference the CLDR meridiems for each supported locale navigate to:
- * https://github.com/unicode-org/cldr-json/tree/main/cldr-json/cldr-dates-full/main,
- * click {locale}/ca-generic.json and drill down to main.{locale}.dates.calendars.generic.dayPeriods.format.abbreviated.
- */
-export declare const localizedTwentyFourHourMeridiems: Map<string, {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-} | {
-    am: string;
-    pm: string;
-}>;
-export declare const numberingSystems: readonly ["arab", "arabext", "latn"];
-export declare const supportedLocales: readonly string[];
-export type NumberingSystem = (typeof numberingSystems)[number];
-export type SupportedLocale = (typeof supportedLocales)[number];
-export declare const defaultNumberingSystem: "arab" | "arabext" | "latn";
-export declare const getSupportedNumberingSystem: (numberingSystem: string) => NumberingSystem;
-/**
- * Gets the locale that best matches the context.
- *
- * @param locale – the BCP 47 locale code
- */
-export declare function getSupportedLocale(locale: string): SupportedLocale;
-/**
- * Gets the locale that best matches the context for date formatting.
- *
- * Intl date formatting has some quirks with certain locales. This handles those quirks by mapping a locale to another for date formatting.
- *
- * @see https://github.com/Esri/calcite-design-system/issues/9387
+ * Represents any BCP 47 locale code used for formatting and parsing numbers.
  *
- * @param locale – the BCP 47 locale code
- * @returns {string} a BCP 47 locale code
+ * For locales that are used for translations, please use the `SupportedLocale` type from `@arcgis/toolkit/intl`.
  */
-export declare function getDateFormatSupportedLocale(locale: string): string;
-export interface NumberStringFormatOptions extends Intl.NumberFormatOptions {
-    numberingSystem: NumberingSystem;
-    locale: string;
-}
-/** This util formats and parses numbers for localization */
-export declare class NumberStringFormat {
-    /**
-     * The actual group separator for the specified locale.
-     * White-space group separators are changed to the non-breaking space (nbsp) unicode character.
-     * so we replace them with a normal <SPACE>.
-     */
-    private _actualGroup;
-    /** the corrected group separator */
-    private _group;
-    get group(): string;
-    private _decimal;
-    get decimal(): string;
-    private _minusSign;
-    get minusSign(): string;
-    private _digits;
-    get digits(): Array<string>;
-    private _getDigitIndex;
-    private _numberFormatter;
-    get numberFormatter(): Intl.NumberFormat;
-    private _numberFormatOptions;
-    get numberFormatOptions(): NumberStringFormatOptions;
-    /** numberFormatOptions needs to be set before localize/delocalize is called to ensure the options are up to date */
-    set numberFormatOptions(options: NumberStringFormatOptions);
-    delocalize: (numberString: string) => string;
-    localize: (numberString: string) => string;
-}
-export declare const numberStringFormatter: NumberStringFormat;
-export type LocaleDateTimeOptionKey = string;
-/**
- * Exported for testing purposes only.
- *
- * @private
- */
-export declare let dateTimeFormatCache: Map<LocaleDateTimeOptionKey, Intl.DateTimeFormat>;
-/**
- * Returns an instance of Intl.DateTimeFormat and reuses it if requested with the same locale and options.
- *
- * **Note**: the cache will be cleared if a different locale is provided
- *
- * @private
- */
-export declare function getDateTimeFormat(locale: string, options?: Intl.DateTimeFormatOptions): Intl.DateTimeFormat;
+export type Locale = HTMLElement["lang"];
+
+export type NumberingSystem = (typeof numberingSystems)[number];
+
+export const numberingSystems: readonly [
+    "arab",
+    "arabext",
+    "latn"
+];

package/dist/utils/logger.d.ts

@@ -1,34 +1 @@
-import { LuminaJsx } from '@arcgis/lumina';
-export type LogLevel = "debug" | "info" | "warn" | "error" | "trace" | "off";
-type Message = string;
-type MajorVersion = number;
-type DeprecatedContext = "component" | "property" | "method" | "event" | "slot";
-type DeprecatedParams = {
-    name: string;
-    suggested?: string | string[];
-    component?: string;
-    removalVersion: MajorVersion | "future";
-};
-type SimpleComponentName<T> = T extends `calcite-${infer Name}` ? Name : T;
-type ComponentDeprecatedParams = Omit<DeprecatedParams, "name"> & {
-    name: SimpleComponentName<keyof LuminaJsx.IntrinsicElements>;
-};
-/** Exported for testing purposes only */
-export declare const loggedDeprecations: Set<string>;
-export declare const logger: {
-    readonly debug: (message: Message) => void;
-    readonly info: (message: Message) => void;
-    readonly warn: (message: Message) => void;
-    readonly error: (message: Message) => void;
-    readonly trace: (message: Message) => void;
-    readonly deprecated: typeof deprecated;
-};
-/**
- * Logs a deprecation warning to the console.
- *
- * @param context the context in which the deprecation is occurring
- * @param params the deprecation details
- */
-declare function deprecated(context: Exclude<DeprecatedContext, "component">, params: DeprecatedParams): void;
-declare function deprecated(context: Extract<DeprecatedContext, "component">, params: ComponentDeprecatedParams): void;
-export {};
+export type LogLevel = "debug" | "info" | "warn" | "error" | "trace" | "off";

package/dist/utils/sortableComponent.d.ts

@@ -1,84 +1,7 @@
-import { default as Sortable } from 'sortablejs';
-export interface MoveDetail {
-    toEl: HTMLElement;
-    fromEl: HTMLElement;
-    dragEl: HTMLElement;
-    relatedEl: HTMLElement;
-}
 export interface DragDetail {
-    toEl: HTMLElement;
-    fromEl: HTMLElement;
-    dragEl: HTMLElement;
-    newIndex: number;
-    oldIndex: number;
-}
-export declare const CSS: {
-    ghostClass: string;
-    chosenClass: string;
-    dragClass: string;
-    fallbackClass: string;
-};
-/** Defines interface for components with sorting functionality. */
-export interface SortableComponent {
-    /** The host element. */
-    readonly el: HTMLElement;
-    /** When `true`, dragging is enabled. */
-    dragEnabled: boolean;
-    /** When `true`, sorting is disabled. */
-    sortDisabled?: boolean;
-    /** Specifies which items inside the element should be draggable. */
-    dragSelector?: string;
-    /** The list's group identifier. */
-    group?: string;
-    /** The selector for the handle elements. */
-    handleSelector: string;
-    /** The Sortable instance. */
-    sortable: Sortable;
-    /** Whether the element can move from the list. */
-    canPull: (detail: DragDetail) => boolean | "clone";
-    /** Whether the element can be added from another list. */
-    canPut: (detail: DragDetail) => boolean;
-    /** Called when any sortable component drag starts. For internal use only. Any public drag events should emit within `onDragStart()`. */
-    onGlobalDragStart: () => void;
-    /** Called when any sortable component drag ends. For internal use only. Any public drag events should emit within `onDragEnd()`. */
-    onGlobalDragEnd: () => void;
-    /** Called when a component's dragging ends. */
-    onDragEnd: (detail: DragDetail) => void;
-    /** Called when a component's dragging ends. */
-    onDragMove?: (detail: MoveDetail) => void;
-    /** Called when a component's dragging starts. */
-    onDragStart: (detail: DragDetail) => void;
-    /** Called by any change to the list (add / update / remove). */
-    onDragSort: (detail: DragDetail) => void;
-}
-export interface SortableComponentItem {
-    /**
-     * When `true`, the item is not draggable.
-     *
-     *
-     * Notes:
-     *
-     * This property should use the `@Prop` decorator and reflect.
-     * This property should be used to set the `calcite-handle` disabled property.
-     */
-    dragDisabled: boolean;
-}
-/**
- * Helper to keep track of a SortableComponent. This should be called in the `connectedCallback` lifecycle method as well as any other method necessary to rebuild the sortable instance.
- *
- * @param {SortableComponent} component - The sortable component.
- */
-export declare function connectSortableComponent(component: SortableComponent): void;
-/**
- * Helper to remove track of a SortableComponent. This should be called in the `disconnectedCallback` lifecycle method.
- *
- * @param {SortableComponent} component - The sortable component.
- */
-export declare function disconnectSortableComponent(component: SortableComponent): void;
-/**
- * Helper to determine if dragging is currently active.
- *
- * @param component The sortable component.
- * @returns {boolean} a boolean value.
- */
-export declare function dragActive(component: SortableComponent): boolean;
+  toEl: HTMLElement;
+  fromEl: HTMLElement;
+  dragEl: HTMLElement;
+  newIndex: number;
+  oldIndex: number;
+}