@yamada-ui/react/dist/types/components/select/use-select.d.ts

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

import { HTMLProps, PropGetter } from "../../core/components/index.types.js";
import "../../core/index.js";
import { FieldProps } from "../field/field.js";
import { Descendant, DescendantProps } from "../../hooks/use-descendants/index.js";
import { UsePopoverProps } from "../popover/use-popover.js";
import { ComboboxDescendant, ComboboxDescendantProps, ComboboxItem, ComboboxItemWithValue, UseComboboxItemProps, UseComboboxProps } from "../../hooks/use-combobox/index.js";
import "../../index.js";
import * as react2670 from "react";
import { ReactNode } from "react";

//#region src/components/select/use-select.d.ts
interface SelectRenderProps extends ComboboxItemWithValue {
  count: number;
  index: number;
  separator: string;
  onClear: () => void;
}
interface SelectItemRender {
  (props: SelectRenderProps): ReactNode;
}
interface SelectContext extends Pick<UseSelectReturn, "max" | "value"> {}
declare const SelectContext: react2670.Context<SelectContext>, useSelectContext: () => SelectContext;
interface UseSelectProps<Multiple extends boolean = false> extends Omit<HTMLProps, "defaultValue" | "onChange" | "value">, Omit<UseComboboxProps, "defaultValue" | "initialFocusValue" | "onChange" | "value">, FieldProps {
  /**
   * The `id` attribute of the input element.
   */
  id?: string;
  /**
   * The `name` attribute of the input element.
   */
  name?: string;
  /**
   * The initial value of the select.
   */
  defaultValue?: Multiple extends true ? string[] : string;
  /**
   * If `true`, the field will be focused when the clear icon is clicked.
   *
   * @default true
   */
  focusOnClear?: boolean;
  /**
   * If `true`, include placeholder in options.
   *
   * @default true
   */
  includePlaceholder?: boolean;
  /**
   * If provided, generate options based on items.
   *
   * @default []
   */
  items?: ComboboxItem[];
  /**
   * The maximum selectable value.
   */
  max?: number;
  /**
   * If `true`, the select will be multiple.
   *
   * @default false
   */
  multiple?: Multiple;
  /**
   * The placeholder for select.
   */
  placeholder?: string;
  /**
   * The function to render the selected items.
   */
  render?: (props: SelectRenderProps) => ReactNode;
  /**
   * The visual separator between each value.
   *
   * @default ','
   */
  separator?: string;
  /**
   * The value of the select.
   */
  value?: Multiple extends true ? string[] : string;
  /**
   * The callback invoked when value state changes.
   */
  onChange?: (value: Multiple extends true ? string[] : string) => void;
}
declare const useSelect: <Multiple extends boolean = false>(props?: UseSelectProps<Multiple>) => {
  descendants: {
    active: (target?: HTMLDivElement | Descendant<HTMLDivElement, ComboboxDescendantProps> | null | undefined, options?: FocusOptions) => void;
    count: () => number;
    destroy: () => void;
    enabledCount: () => number;
    enabledFirstValue: () => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    enabledIndexOf: (target?: HTMLDivElement | Descendant<HTMLDivElement, ComboboxDescendantProps> | null | undefined) => number;
    enabledLastValue: () => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    enabledNextValue: (indexOrNode: number | HTMLDivElement | Descendant<HTMLDivElement, ComboboxDescendantProps> | null, loop?: boolean) => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    enabledPrevValue: (indexOrNode: number | HTMLDivElement | Descendant<HTMLDivElement, ComboboxDescendantProps> | null, loop?: boolean) => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    enabledValue: (index: number) => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    enabledValues: () => Descendant<HTMLDivElement, ComboboxDescendantProps>[];
    firstValue: () => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    indexOf: (target?: HTMLDivElement | Descendant<HTMLDivElement, ComboboxDescendantProps> | null | undefined) => number;
    lastValue: () => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    nextValue: (indexOrNode: number | HTMLDivElement | Descendant<HTMLDivElement, ComboboxDescendantProps> | null, loop?: boolean) => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    prevValue: (indexOrNode: number | HTMLDivElement | Descendant<HTMLDivElement, ComboboxDescendantProps> | null, loop?: boolean) => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    register: (props?: DescendantProps<HTMLDivElement, ComboboxDescendantProps> | undefined) => react2670.RefCallback<HTMLDivElement>;
    unregister: (node?: HTMLDivElement | null | undefined) => void;
    value: (indexOrNode: number | HTMLDivElement | null) => Descendant<HTMLDivElement, ComboboxDescendantProps> | undefined;
    values: () => Descendant<HTMLDivElement, ComboboxDescendantProps>[];
  };
  includePlaceholder: boolean;
  interactive: boolean;
  items: ComboboxItem[];
  max: number | undefined;
  open: boolean;
  placeholder: string | undefined;
  setValue: react2670.Dispatch<react2670.SetStateAction<Multiple extends true ? string[] : string>>;
  value: Multiple extends true ? string[] : string;
  valueMap: {
    [key: string]: ComboboxItemWithValue;
  };
  getClearIconProps: PropGetter<"div", undefined, undefined>;
  getContentProps: PropGetter<"div", undefined, undefined>;
  getFieldProps: PropGetter<"div", undefined, undefined>;
  getIconProps: PropGetter<"div", undefined, undefined>;
  getInputProps: PropGetter<"input", undefined, undefined>;
  getRootProps: PropGetter<"div", undefined, undefined>;
  getSeparatorProps: PropGetter<"div", undefined, undefined>;
  popoverProps: UsePopoverProps;
  onActiveDescendant: (descendant?: ComboboxDescendant) => void;
  onChange: (value: string) => void;
  onClose: () => void | Promise<void>;
  onOpen: () => void | Promise<void>;
  onSelect: (value?: string, closeOnSelect?: boolean) => void;
};
type UseSelectReturn = ReturnType<typeof useSelect>;
interface UseSelectOptionProps extends UseComboboxItemProps {}
declare const useSelectOption: ({
  children,
  closeOnSelect,
  disabled,
  hidden,
  value,
  ...rest
}?: UseSelectOptionProps) => {
  getIndicatorProps: PropGetter<"div", undefined, undefined>;
  getOptionProps: PropGetter<"div", undefined, undefined>;
};
type UseSelectOptionReturn = ReturnType<typeof useSelectOption>;
//#endregion
export { SelectContext, SelectItemRender, UseSelectOptionProps, UseSelectOptionReturn, UseSelectProps, UseSelectReturn, useSelect, useSelectContext, useSelectOption };
//# sourceMappingURL=use-select.d.ts.map