@react-types/shared 3.33.1 → 3.35.0

package/src/events.d.ts

@@ -11,22 +11,19 @@
  */
 
 import {FocusableElement} from './dom';
-import {
-  FocusEvent,
-  MouseEvent,
-  KeyboardEvent as ReactKeyboardEvent,
-  SyntheticEvent
-} from 'react';
+import {FocusEvent, MouseEvent, KeyboardEvent as ReactKeyboardEvent, SyntheticEvent} from 'react';
 
 // Event bubbling can be problematic in real-world applications, so the default for React Spectrum components
 // is not to propagate. This can be overridden by calling continuePropagation() on the event.
 export type BaseEvent<T extends SyntheticEvent> = T & {
   /**
    * Use continuePropagation.
-   * @deprecated */
-  stopPropagation(): void,
-  continuePropagation(): void
-}
+   *
+   * @deprecated
+   */
+  stopPropagation(): void;
+  continuePropagation(): void;
+};
 
 export type KeyboardEvent = BaseEvent<ReactKeyboardEvent<any>>;
 
@@ -34,157 +31,156 @@ export type PointerType = 'mouse' | 'pen' | 'touch' | 'keyboard' | 'virtual';
 
 export interface PressEvent {
   /** The type of press event being fired. */
-  type: 'pressstart' | 'pressend' | 'pressup' | 'press',
+  type: 'pressstart' | 'pressend' | 'pressup' | 'press';
   /** The pointer type that triggered the press event. */
-  pointerType: PointerType,
+  pointerType: PointerType;
   /** The target element of the press event. */
-  target: Element,
+  target: Element;
   /** Whether the shift keyboard modifier was held during the press event. */
-  shiftKey: boolean,
+  shiftKey: boolean;
   /** Whether the ctrl keyboard modifier was held during the press event. */
-  ctrlKey: boolean,
+  ctrlKey: boolean;
   /** Whether the meta keyboard modifier was held during the press event. */
-  metaKey: boolean,
+  metaKey: boolean;
   /** Whether the alt keyboard modifier was held during the press event. */
-  altKey: boolean,
+  altKey: boolean;
   /** X position relative to the target. */
-  x: number,
+  x: number;
   /** Y position relative to the target. */
-  y: number,
+  y: number;
   /**
    * The key that triggered the press event, if it was triggered by a keyboard interaction.
    * This is useful for differentiating between Space and Enter key presses.
    */
-  key?: string,
+  key?: string;
   /**
    * By default, press events stop propagation to parent elements.
    * In cases where a handler decides not to handle a specific event,
    * it can call `continuePropagation()` to allow a parent to handle it.
    */
-  continuePropagation(): void
+  continuePropagation(): void;
 }
 
 export interface LongPressEvent extends Omit<PressEvent, 'type' | 'continuePropagation'> {
   /** The type of long press event being fired. */
-  type: 'longpressstart' | 'longpressend' | 'longpress'
+  type: 'longpressstart' | 'longpressend' | 'longpress';
 }
 
 export interface HoverEvent {
   /** The type of hover event being fired. */
-  type: 'hoverstart' | 'hoverend',
+  type: 'hoverstart' | 'hoverend';
   /** The pointer type that triggered the hover event. */
-  pointerType: 'mouse' | 'pen',
+  pointerType: 'mouse' | 'pen';
   /** The target element of the hover event. */
-  target: HTMLElement
+  target: HTMLElement;
 }
 
 export interface KeyboardEvents {
   /** Handler that is called when a key is pressed. */
-  onKeyDown?: (e: KeyboardEvent) => void,
+  onKeyDown?: (e: KeyboardEvent) => void;
   /** Handler that is called when a key is released. */
-  onKeyUp?: (e: KeyboardEvent) => void
+  onKeyUp?: (e: KeyboardEvent) => void;
 }
 
 export interface FocusEvents<Target = Element> {
   /** Handler that is called when the element receives focus. */
-  onFocus?: (e: FocusEvent<Target>) => void,
+  onFocus?: (e: FocusEvent<Target>) => void;
   /** Handler that is called when the element loses focus. */
-  onBlur?: (e: FocusEvent<Target>) => void,
+  onBlur?: (e: FocusEvent<Target>) => void;
   /** Handler that is called when the element's focus status changes. */
-  onFocusChange?: (isFocused: boolean) => void
+  onFocusChange?: (isFocused: boolean) => void;
 }
 
 export interface HoverEvents {
   /** Handler that is called when a hover interaction starts. */
-  onHoverStart?: (e: HoverEvent) => void,
+  onHoverStart?: (e: HoverEvent) => void;
   /** Handler that is called when a hover interaction ends. */
-  onHoverEnd?: (e: HoverEvent) => void,
+  onHoverEnd?: (e: HoverEvent) => void;
   /** Handler that is called when the hover state changes. */
-  onHoverChange?: (isHovering: boolean) => void
+  onHoverChange?: (isHovering: boolean) => void;
 }
 
 export interface PressEvents {
   /** Handler that is called when the press is released over the target. */
-  onPress?: (e: PressEvent) => void,
+  onPress?: (e: PressEvent) => void;
   /** Handler that is called when a press interaction starts. */
-  onPressStart?: (e: PressEvent) => void,
+  onPressStart?: (e: PressEvent) => void;
   /**
    * Handler that is called when a press interaction ends, either
    * over the target or when the pointer leaves the target.
    */
-  onPressEnd?: (e: PressEvent) => void,
+  onPressEnd?: (e: PressEvent) => void;
   /** Handler that is called when the press state changes. */
-  onPressChange?: (isPressed: boolean) => void,
+  onPressChange?: (isPressed: boolean) => void;
   /**
    * Handler that is called when a press is released over the target, regardless of
    * whether it started on the target or not.
    */
-  onPressUp?: (e: PressEvent) => void,
+  onPressUp?: (e: PressEvent) => void;
   /**
    * **Not recommended – use `onPress` instead.** `onClick` is an alias for `onPress`
-   * provided for compatibility with other libraries. `onPress` provides 
+   * provided for compatibility with other libraries. `onPress` provides
    * additional event details for non-mouse interactions.
    */
-  onClick?: (e: MouseEvent<FocusableElement>) => void
+  onClick?: (e: MouseEvent<FocusableElement>) => void;
 }
 
 export interface FocusableProps<Target = Element> extends FocusEvents<Target>, KeyboardEvents {
   /** Whether the element should receive focus on render. */
-  autoFocus?: boolean
+  autoFocus?: boolean;
 }
 
 interface BaseMoveEvent {
   /** The pointer type that triggered the move event. */
-  pointerType: PointerType,
+  pointerType: PointerType;
   /** Whether the shift keyboard modifier was held during the move event. */
-  shiftKey: boolean,
+  shiftKey: boolean;
   /** Whether the ctrl keyboard modifier was held during the move event. */
-  ctrlKey: boolean,
+  ctrlKey: boolean;
   /** Whether the meta keyboard modifier was held during the move event. */
-  metaKey: boolean,
+  metaKey: boolean;
   /** Whether the alt keyboard modifier was held during the move event. */
-  altKey: boolean
+  altKey: boolean;
 }
 
 export interface MoveStartEvent extends BaseMoveEvent {
   /** The type of move event being fired. */
-  type: 'movestart'
+  type: 'movestart';
 }
 
 export interface MoveMoveEvent extends BaseMoveEvent {
   /** The type of move event being fired. */
-  type: 'move',
+  type: 'move';
   /** The amount moved in the X direction since the last event. */
-  deltaX: number,
+  deltaX: number;
   /** The amount moved in the Y direction since the last event. */
-  deltaY: number
-
+  deltaY: number;
 }
 
 export interface MoveEndEvent extends BaseMoveEvent {
   /** The type of move event being fired. */
-  type: 'moveend'
+  type: 'moveend';
 }
 
 export type MoveEvent = MoveStartEvent | MoveMoveEvent | MoveEndEvent;
 
 export interface MoveEvents {
   /** Handler that is called when a move interaction starts. */
-  onMoveStart?: (e: MoveStartEvent) => void,
+  onMoveStart?: (e: MoveStartEvent) => void;
   /** Handler that is called when the element is moved. */
-  onMove?: (e: MoveMoveEvent) => void,
+  onMove?: (e: MoveMoveEvent) => void;
   /** Handler that is called when a move interaction ends. */
-  onMoveEnd?: (e: MoveEndEvent) => void
+  onMoveEnd?: (e: MoveEndEvent) => void;
 }
 
 export interface ScrollEvent {
   /** The amount moved in the X direction since the last event. */
-  deltaX: number,
+  deltaX: number;
   /** The amount moved in the Y direction since the last event. */
-  deltaY: number
+  deltaY: number;
 }
 
 export interface ScrollEvents {
   /** Handler that is called when the scroll wheel moves. */
-  onScroll?: (e: ScrollEvent) => void
+  onScroll?: (e: ScrollEvent) => void;
 }

package/src/inputs.d.ts

@@ -20,98 +20,103 @@ export type ValidationFunction<T> = (value: T) => ValidationError | true | null
 
 export interface Validation<T = unknown> {
   /** Whether user input is required on the input before form submission. */
-  isRequired?: boolean,
+  isRequired?: boolean;
   /** Whether the input value is invalid. */
-  isInvalid?: boolean,
+  isInvalid?: boolean;
   /** @deprecated Use `isInvalid` instead. */
-  validationState?: ValidationState,
+  validationState?: ValidationState;
   /**
    * Whether to use native HTML form validation to prevent form submission
    * when the value is missing or invalid, or mark the field as required
    * or invalid via ARIA.
+   *
    * @default 'aria'
    */
-  validationBehavior?: 'aria' | 'native',
+  validationBehavior?: 'aria' | 'native';
   /**
    * A function that returns an error message if a given value is invalid.
    * Validation errors are displayed to the user when the form is submitted
    * if `validationBehavior="native"`. For realtime validation, use the `isInvalid`
    * prop instead.
    */
-  validate?: (value: T) => ValidationError | true | null | undefined
+  validate?: (value: T) => ValidationError | true | null | undefined;
 }
 
 export interface ValidationResult {
   /** Whether the input value is invalid. */
-  isInvalid: boolean,
+  isInvalid: boolean;
   /** The current error messages for the input if it is invalid, otherwise an empty array. */
-  validationErrors: string[],
+  validationErrors: string[];
   /** The native validation details for the input. */
-  validationDetails: ValidityState
+  validationDetails: ValidityState;
 }
 
-export interface SpectrumFieldValidation<T> extends Omit<Validation<T>, 'isInvalid' | 'validationState'> {
+export interface SpectrumFieldValidation<T> extends Omit<
+  Validation<T>,
+  'isInvalid' | 'validationState'
+> {
   /** Whether the input should display its "valid" or "invalid" visual styling. */
-  validationState?: ValidationState
+  validationState?: ValidationState;
 }
 
 export interface InputBase {
   /** Whether the input is disabled. */
-  isDisabled?: boolean,
+  isDisabled?: boolean;
   /** Whether the input can be selected but not changed by the user. */
-  isReadOnly?: boolean
+  isReadOnly?: boolean;
 }
 
 export interface ValueBase<T, C = T> {
   /** The current value (controlled). */
-  value?: T,
+  value?: T;
   /** The default value (uncontrolled). */
-  defaultValue?: T,
+  defaultValue?: T;
   /** Handler that is called when the value changes. */
-  onChange?: (value: C) => void
+  onChange?: (value: C) => void;
 }
 
 export interface TextInputBase {
   /** Temporary text that occupies the text input when it is empty. */
-  placeholder?: string
+  placeholder?: string;
 }
 
 export interface SpectrumTextInputBase {
   /**
    * Temporary text that occupies the text input when it is empty.
    * Please use help text instead.
+   *
    * @deprecated
-   **/
-  placeholder?: string
+   */
+  placeholder?: string;
 }
 
 export interface RangeValue<T> {
   /** The start value of the range. */
-  start: T,
+  start: T;
   /** The end value of the range. */
-  end: T
+  end: T;
 }
 
 export interface RangeInputBase<T> {
   /** The smallest value allowed for the input. */
-  minValue?: T,
+  minValue?: T;
   /** The largest value allowed for the input. */
-  maxValue?: T,
+  maxValue?: T;
   /** The amount that the input value changes with each increment or decrement "tick". */
-  step?: T // ??
+  step?: T; // ??
 }
 
 export interface HelpTextProps {
   /** A description for the field. Provides a hint such as specific requirements for what to choose. */
-  description?: ReactNode,
+  description?: ReactNode;
   /** An error message for the field. */
-  errorMessage?: ReactNode | ((v: ValidationResult) => ReactNode)
+  errorMessage?: ReactNode | ((v: ValidationResult) => ReactNode);
 }
 
 // Spectrum specific types. Extends `Validation` so that the `validationState` prop is available.
 export interface SpectrumHelpTextProps extends HelpTextProps {
   /** Whether the description is displayed with lighter text. */
-  isDisabled?: boolean,
+  isDisabled?: boolean;
   /** Whether an error icon is rendered. */
-  showErrorIcon?: boolean
+  showErrorIcon?: boolean;
 }

package/src/labelable.d.ts

@@ -18,31 +18,34 @@ export type NecessityIndicator = 'icon' | 'label';
 
 export interface LabelableProps {
   /** The content to display as the label. */
-  label?: ReactNode
+  label?: ReactNode;
 }
 
 export interface SpectrumLabelableProps extends LabelableProps {
   /**
    * The label's overall position relative to the element it is labeling.
+   *
    * @default 'top'
    */
-  labelPosition?: LabelPosition,
+  labelPosition?: LabelPosition;
   /**
    * The label's horizontal alignment relative to the element it is labeling.
+   *
    * @default 'start'
    */
-  labelAlign?: Alignment,
+  labelAlign?: Alignment;
   /**
    * Whether the required state should be shown as an icon or text.
+   *
    * @default 'icon'
    */
-  necessityIndicator?: NecessityIndicator,
+  necessityIndicator?: NecessityIndicator;
   /**
    * Whether the label is labeling a required field or group.
    */
-  isRequired?: boolean,
+  isRequired?: boolean;
   /**
    * A ContextualHelp element to place next to the label.
    */
-  contextualHelp?: ReactNode
+  contextualHelp?: ReactNode;
 }

package/src/refs.d.ts

@@ -13,18 +13,23 @@
 import {ReactElement, Ref, RefAttributes} from 'react';
 
 export interface DOMRefValue<T extends HTMLElement = HTMLElement> {
-  UNSAFE_getDOMNode(): T | null
+  UNSAFE_getDOMNode(): T | null;
 }
 
-export interface FocusableRefValue<T extends HTMLElement = HTMLElement, D extends HTMLElement = T> extends DOMRefValue<D> {
-  focus(): void
+export interface FocusableRefValue<
+  T extends HTMLElement = HTMLElement,
+  D extends HTMLElement = T
+> extends DOMRefValue<D> {
+  focus(): void;
 }
 
 export type DOMRef<T extends HTMLElement = HTMLElement> = Ref<DOMRefValue<T>>;
-export type FocusableRef<T extends HTMLElement = HTMLElement> = Ref<FocusableRefValue<T>>;
+export type FocusableRef<T extends HTMLElement = HTMLElement, D extends HTMLElement = T> = Ref<
+  FocusableRefValue<T, D>
+>;
 
 export interface RefObject<T> {
-  current: T
+  current: T;
 }
 
 // Override forwardRef types so generics work.

package/src/removable.d.ts

@@ -13,6 +13,6 @@
 import {SyntheticEvent} from 'react';
 
 export interface Removable<T, R> {
-  isRemovable?: boolean,
-  onRemove?: (value: T, event?: SyntheticEvent) => R
+  isRemovable?: boolean;
+  onRemove?: (value: T, event?: SyntheticEvent) => R;
 }

package/src/selection.d.ts

@@ -14,13 +14,13 @@ import {Key} from '@react-types/shared';
 
 export interface SingleSelection {
   /** Whether the collection allows empty selection. */
-  disallowEmptySelection?: boolean,
+  disallowEmptySelection?: boolean;
   /** The currently selected key in the collection (controlled). */
-  selectedKey?: Key | null,
+  selectedKey?: Key | null;
   /** The initial selected key in the collection (uncontrolled). */
-  defaultSelectedKey?: Key | null,
+  defaultSelectedKey?: Key | null;
   /** Handler that is called when the selection changes. */
-  onSelectionChange?: (key: Key | null) => void
+  onSelectionChange?: (key: Key | null) => void;
 }
 
 export type SelectionMode = 'none' | 'single' | 'multiple';
@@ -28,22 +28,22 @@ export type SelectionBehavior = 'toggle' | 'replace';
 export type Selection = 'all' | Set<Key>;
 export interface MultipleSelection {
   /** The type of selection that is allowed in the collection. */
-  selectionMode?: SelectionMode,
+  selectionMode?: SelectionMode;
   /** Whether the collection allows empty selection. */
-  disallowEmptySelection?: boolean,
+  disallowEmptySelection?: boolean;
   /** The currently selected keys in the collection (controlled). */
-  selectedKeys?: 'all' | Iterable<Key>,
+  selectedKeys?: 'all' | Iterable<Key>;
   /** The initial selected keys in the collection (uncontrolled). */
-  defaultSelectedKeys?: 'all' | Iterable<Key>,
+  defaultSelectedKeys?: 'all' | Iterable<Key>;
   /** Handler that is called when the selection changes. */
-  onSelectionChange?: (keys: Selection) => void,
+  onSelectionChange?: (keys: Selection) => void;
   /** The currently disabled keys in the collection (controlled). */
-  disabledKeys?: Iterable<Key>
+  disabledKeys?: Iterable<Key>;
 }
 
 export interface SpectrumSelectionProps {
   /** How selection should be displayed. */
-  selectionStyle?: 'checkbox' | 'highlight'
+  selectionStyle?: 'checkbox' | 'highlight';
 }
 
 export type FocusStrategy = 'first' | 'last';