This commit is contained in:
Iliyan Angelov
2025-09-14 23:24:25 +03:00
commit c67067a2a4
71311 changed files with 6800714 additions and 0 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,10 @@
import { ReactElement, RefAttributes } from 'react';
import Select from './Select';
import { GroupBase } from './types';
import useAsync from './useAsync';
import type { AsyncProps } from './useAsync';
export type { AsyncProps };
declare type AsyncSelect = <Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: AsyncProps<Option, IsMulti, Group> & RefAttributes<Select<Option, IsMulti, Group>>) => ReactElement;
declare const AsyncSelect: AsyncSelect;
export { useAsync };
export default AsyncSelect;

View File

@@ -0,0 +1,10 @@
import { ReactElement, RefAttributes } from 'react';
import Select from './Select';
import { GroupBase } from './types';
import { AsyncAdditionalProps } from './useAsync';
import { StateManagerProps } from './useStateManager';
import { CreatableAdditionalProps } from './useCreatable';
export declare type AsyncCreatableProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = StateManagerProps<Option, IsMulti, Group> & CreatableAdditionalProps<Option, Group> & AsyncAdditionalProps<Option, Group>;
declare type AsyncCreatableSelect = <Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: AsyncCreatableProps<Option, IsMulti, Group> & RefAttributes<Select<Option, IsMulti, Group>>) => ReactElement;
declare const AsyncCreatableSelect: AsyncCreatableSelect;
export default AsyncCreatableSelect;

View File

@@ -0,0 +1,10 @@
import { ReactElement, RefAttributes } from 'react';
import Select from './Select';
import { GroupBase } from './types';
import { StateManagerProps } from './useStateManager';
import useCreatable, { CreatableAdditionalProps } from './useCreatable';
export declare type CreatableProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = StateManagerProps<Option, IsMulti, Group> & CreatableAdditionalProps<Option, Group>;
declare type CreatableSelect = <Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: CreatableProps<Option, IsMulti, Group> & RefAttributes<Select<Option, IsMulti, Group>>) => ReactElement;
declare const CreatableSelect: CreatableSelect;
export { useCreatable };
export default CreatableSelect;

View File

@@ -0,0 +1,9 @@
import * as React from 'react';
import { ReactNode } from 'react';
interface NonceProviderProps {
nonce: string;
children: ReactNode;
cacheKey: string;
}
declare const _default: ({ nonce, children, cacheKey }: NonceProviderProps) => React.JSX.Element;
export default _default;

View File

@@ -0,0 +1,491 @@
import * as React from 'react';
import { AriaAttributes, Component, FocusEventHandler, FormEventHandler, JSX, KeyboardEventHandler, MouseEventHandler, ReactNode, RefCallback, TouchEventHandler } from 'react';
import { FilterOptionOption } from './filters';
import { AriaLiveMessages, AriaSelection } from './accessibility/index';
import { SelectComponentsConfig } from './components/index';
import { ClassNamesConfig, StylesConfig, StylesProps } from './styles';
import { ThemeConfig } from './theme';
import { ActionMeta, FocusDirection, GetOptionLabel, GetOptionValue, GroupBase, InputActionMeta, MenuPlacement, MenuPosition, OnChangeValue, Options, OptionsOrGroups, PropsValue, SetValueAction } from './types';
export declare type FormatOptionLabelContext = 'menu' | 'value';
export interface FormatOptionLabelMeta<Option> {
context: FormatOptionLabelContext;
inputValue: string;
selectValue: Options<Option>;
}
export interface Props<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
/** HTML ID of an element containing an error message related to the input**/
'aria-errormessage'?: AriaAttributes['aria-errormessage'];
/** Indicate if the value entered in the field is invalid **/
'aria-invalid'?: AriaAttributes['aria-invalid'];
/** Aria label (for assistive tech) */
'aria-label'?: AriaAttributes['aria-label'];
/** HTML ID of an element that should be used as the label (for assistive tech) */
'aria-labelledby'?: AriaAttributes['aria-labelledby'];
/** Used to set the priority with which screen reader should treat updates to live regions. The possible settings are: off, polite (default) or assertive */
'aria-live'?: AriaAttributes['aria-live'];
/** Customise the messages used by the aria-live component */
ariaLiveMessages?: AriaLiveMessages<Option, IsMulti, Group>;
/** Focus the control when it is mounted */
autoFocus?: boolean;
/** Remove the currently focused option when the user presses backspace when Select isClearable or isMulti */
backspaceRemovesValue: boolean;
/** Remove focus from the input when the user selects an option (handy for dismissing the keyboard on touch devices) */
blurInputOnSelect: boolean;
/** When the user reaches the top/bottom of the menu, prevent scroll on the scroll-parent */
captureMenuScroll: boolean;
/** Sets a className attribute on the outer component */
className?: string;
/**
* If provided, all inner components will be given a prefixed className attribute.
*
* This is useful when styling via CSS classes instead of the Styles API approach.
*/
classNamePrefix?: string | null;
/**
* Provide classNames based on state for each inner component
*/
classNames: ClassNamesConfig<Option, IsMulti, Group>;
/** Close the select menu when the user selects an option */
closeMenuOnSelect: boolean;
/**
* If `true`, close the select menu when the user scrolls the document/body.
*
* If a function, takes a standard javascript `ScrollEvent` you return a boolean:
*
* `true` => The menu closes
*
* `false` => The menu stays open
*
* This is useful when you have a scrollable modal and want to portal the menu out,
* but want to avoid graphical issues.
*/
closeMenuOnScroll: boolean | ((event: Event) => boolean);
/**
* This complex object includes all the compositional components that are used
* in `react-select`. If you wish to overwrite a component, pass in an object
* with the appropriate namespace.
*
* If you only wish to restyle a component, we recommend using the `styles` prop
* instead. For a list of the components that can be passed in, and the shape
* that will be passed to them, see [the components docs](/components)
*/
components: SelectComponentsConfig<Option, IsMulti, Group>;
/** Whether the value of the select, e.g. SingleValue, should be displayed in the control. */
controlShouldRenderValue: boolean;
/** Delimiter used to join multiple values into a single HTML Input value */
delimiter?: string;
/** Clear all values when the user presses escape AND the menu is closed */
escapeClearsValue: boolean;
/** Custom method to filter whether an option should be displayed in the menu */
filterOption: ((option: FilterOptionOption<Option>, inputValue: string) => boolean) | null;
/**
* Formats group labels in the menu as React components
*
* An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.
*/
formatGroupLabel: (group: Group) => ReactNode;
/** Formats option labels in the menu and control as React components */
formatOptionLabel?: (data: Option, formatOptionLabelMeta: FormatOptionLabelMeta<Option>) => ReactNode;
/**
* Resolves option data to a string to be displayed as the label by components
*
* Note: Failure to resolve to a string type can interfere with filtering and
* screen reader support.
*/
getOptionLabel: GetOptionLabel<Option>;
/** Resolves option data to a string to compare options and specify value attributes */
getOptionValue: GetOptionValue<Option>;
/** Hide the selected option from the menu */
hideSelectedOptions?: boolean;
/** The id to set on the SelectContainer component. */
id?: string;
/** The value of the search input */
inputValue: string;
/** The id of the search input */
inputId?: string;
/** Define an id prefix for the select components e.g. {your-id}-value */
instanceId?: number | string;
/** Is the select value clearable */
isClearable?: boolean;
/** Is the select disabled */
isDisabled: boolean;
/** Is the select in a state of loading (async) */
isLoading: boolean;
/**
* Override the built-in logic to detect whether an option is disabled
*
* An example can be found in the [Replacing builtins](/advanced#replacing-builtins) documentation.
*/
isOptionDisabled: (option: Option, selectValue: Options<Option>) => boolean;
/** Override the built-in logic to detect whether an option is selected */
isOptionSelected?: (option: Option, selectValue: Options<Option>) => boolean;
/** Support multiple selected options */
isMulti: IsMulti;
/** Is the select direction right-to-left */
isRtl: boolean;
/** Whether to enable search functionality */
isSearchable: boolean;
/** Async: Text to display when loading options */
loadingMessage: (obj: {
inputValue: string;
}) => ReactNode;
/** Minimum height of the menu before flipping */
minMenuHeight: number;
/** Maximum height of the menu before scrolling */
maxMenuHeight: number;
/** Whether the menu is open */
menuIsOpen: boolean;
/**
* Default placement of the menu in relation to the control. 'auto' will flip
* when there isn't enough space below the control.
*/
menuPlacement: MenuPlacement;
/** The CSS position value of the menu, when "fixed" extra layout management is required */
menuPosition: MenuPosition;
/**
* Whether the menu should use a portal, and where it should attach
*
* An example can be found in the [Portaling](/advanced#portaling) documentation
*/
menuPortalTarget?: HTMLElement | null;
/** Whether to block scroll events when the menu is open */
menuShouldBlockScroll: boolean;
/** Whether the menu should be scrolled into view when it opens */
menuShouldScrollIntoView: boolean;
/** Name of the HTML Input (optional - without this, no input will be rendered) */
name?: string;
/** Text to display when there are no options */
noOptionsMessage: (obj: {
inputValue: string;
}) => ReactNode;
/** Handle blur events on the control */
onBlur?: FocusEventHandler<HTMLInputElement>;
/** Handle change events on the select */
onChange: (newValue: OnChangeValue<Option, IsMulti>, actionMeta: ActionMeta<Option>) => void;
/** Handle focus events on the control */
onFocus?: FocusEventHandler<HTMLInputElement>;
/** Handle change events on the input */
onInputChange: (newValue: string, actionMeta: InputActionMeta) => void;
/** Handle key down events on the select */
onKeyDown?: KeyboardEventHandler<HTMLDivElement>;
/** Handle the menu opening */
onMenuOpen: () => void;
/** Handle the menu closing */
onMenuClose: () => void;
/** Fired when the user scrolls to the top of the menu */
onMenuScrollToTop?: (event: WheelEvent | TouchEvent) => void;
/** Fired when the user scrolls to the bottom of the menu */
onMenuScrollToBottom?: (event: WheelEvent | TouchEvent) => void;
/** Allows control of whether the menu is opened when the Select is focused */
openMenuOnFocus: boolean;
/** Allows control of whether the menu is opened when the Select is clicked */
openMenuOnClick: boolean;
/** Array of options that populate the select menu */
options: OptionsOrGroups<Option, Group>;
/** Number of options to jump in menu when page{up|down} keys are used */
pageSize: number;
/** Placeholder for the select value */
placeholder: ReactNode;
/** Status to relay to screen readers */
screenReaderStatus: (obj: {
count: number;
}) => string;
/**
* Style modifier methods
*
* A basic example can be found at the bottom of the [Replacing builtins](/advanced#replacing-builtins) documentation.
*/
styles: StylesConfig<Option, IsMulti, Group>;
/** Theme modifier method */
theme?: ThemeConfig;
/** Sets the tabIndex attribute on the input */
tabIndex: number;
/** Select the currently focused option when the user presses tab */
tabSelectsValue: boolean;
/** Remove all non-essential styles */
unstyled: boolean;
/** The value of the select; reflected by the selected option */
value: PropsValue<Option>;
/** Sets the form attribute on the input */
form?: string;
/** Marks the value-holding input as required for form validation */
required?: boolean;
}
export declare const defaultProps: {
'aria-live': string;
backspaceRemovesValue: boolean;
blurInputOnSelect: boolean;
captureMenuScroll: boolean;
classNames: {};
closeMenuOnSelect: boolean;
closeMenuOnScroll: boolean;
components: {};
controlShouldRenderValue: boolean;
escapeClearsValue: boolean;
filterOption: (option: FilterOptionOption<unknown>, rawInput: string) => boolean;
formatGroupLabel: <Option, Group extends GroupBase<Option>>(group: Group) => string;
getOptionLabel: <Option_1>(option: Option_1) => string;
getOptionValue: <Option_2>(option: Option_2) => string;
isDisabled: boolean;
isLoading: boolean;
isMulti: boolean;
isRtl: boolean;
isSearchable: boolean;
isOptionDisabled: <Option_3>(option: Option_3) => boolean;
loadingMessage: () => string;
maxMenuHeight: number;
minMenuHeight: number;
menuIsOpen: boolean;
menuPlacement: string;
menuPosition: string;
menuShouldBlockScroll: boolean;
menuShouldScrollIntoView: boolean;
noOptionsMessage: () => string;
openMenuOnFocus: boolean;
openMenuOnClick: boolean;
options: never[];
pageSize: number;
placeholder: string;
screenReaderStatus: ({ count }: {
count: number;
}) => string;
styles: {};
tabIndex: number;
tabSelectsValue: boolean;
unstyled: boolean;
};
interface State<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
ariaSelection: AriaSelection<Option, IsMulti> | null;
inputIsHidden: boolean;
isFocused: boolean;
focusedOption: Option | null;
focusedOptionId: string | null;
focusableOptionsWithIds: FocusableOptionWithId<Option>[];
focusedValue: Option | null;
selectValue: Options<Option>;
clearFocusValueOnUpdate: boolean;
prevWasFocused: boolean;
inputIsHiddenAfterUpdate: boolean | null | undefined;
prevProps: Props<Option, IsMulti, Group> | void;
instancePrefix: string;
isAppleDevice: boolean;
}
interface CategorizedOption<Option> {
type: 'option';
data: Option;
isDisabled: boolean;
isSelected: boolean;
label: string;
value: string;
index: number;
}
interface FocusableOptionWithId<Option> {
data: Option;
id: string;
}
interface CategorizedGroup<Option, Group extends GroupBase<Option>> {
type: 'group';
data: Group;
options: readonly CategorizedOption<Option>[];
index: number;
}
declare type CategorizedGroupOrOption<Option, Group extends GroupBase<Option>> = CategorizedGroup<Option, Group> | CategorizedOption<Option>;
export default class Select<Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> extends Component<Props<Option, IsMulti, Group>, State<Option, IsMulti, Group>> {
static defaultProps: {
'aria-live': string;
backspaceRemovesValue: boolean;
blurInputOnSelect: boolean;
captureMenuScroll: boolean;
classNames: {};
closeMenuOnSelect: boolean;
closeMenuOnScroll: boolean;
components: {};
controlShouldRenderValue: boolean;
escapeClearsValue: boolean;
filterOption: (option: FilterOptionOption<unknown>, rawInput: string) => boolean;
formatGroupLabel: <Option_1, Group_1 extends GroupBase<Option_1>>(group: Group_1) => string;
getOptionLabel: <Option_2>(option: Option_2) => string;
getOptionValue: <Option_3>(option: Option_3) => string;
isDisabled: boolean;
isLoading: boolean;
isMulti: boolean;
isRtl: boolean;
isSearchable: boolean;
isOptionDisabled: <Option_4>(option: Option_4) => boolean;
loadingMessage: () => string;
maxMenuHeight: number;
minMenuHeight: number;
menuIsOpen: boolean;
menuPlacement: string;
menuPosition: string;
menuShouldBlockScroll: boolean;
menuShouldScrollIntoView: boolean;
noOptionsMessage: () => string;
openMenuOnFocus: boolean;
openMenuOnClick: boolean;
options: never[];
pageSize: number;
placeholder: string;
screenReaderStatus: ({ count }: {
count: number;
}) => string;
styles: {};
tabIndex: number;
tabSelectsValue: boolean;
unstyled: boolean;
};
state: State<Option, IsMulti, Group>;
blockOptionHover: boolean;
isComposing: boolean;
commonProps: any;
initialTouchX: number;
initialTouchY: number;
openAfterFocus: boolean;
scrollToFocusedOptionOnUpdate: boolean;
userIsDragging?: boolean;
controlRef: HTMLDivElement | null;
getControlRef: RefCallback<HTMLDivElement>;
focusedOptionRef: HTMLDivElement | null;
getFocusedOptionRef: RefCallback<HTMLDivElement>;
menuListRef: HTMLDivElement | null;
getMenuListRef: RefCallback<HTMLDivElement>;
inputRef: HTMLInputElement | null;
getInputRef: RefCallback<HTMLInputElement>;
constructor(props: Props<Option, IsMulti, Group>);
static getDerivedStateFromProps(props: Props<unknown, boolean, GroupBase<unknown>>, state: State<unknown, boolean, GroupBase<unknown>>): {
prevProps: Props<unknown, boolean, GroupBase<unknown>>;
ariaSelection: AriaSelection<unknown, boolean> | null;
prevWasFocused: boolean;
inputIsHidden: boolean;
inputIsHiddenAfterUpdate: undefined;
} | {
prevProps: Props<unknown, boolean, GroupBase<unknown>>;
ariaSelection: AriaSelection<unknown, boolean> | null;
prevWasFocused: boolean;
inputIsHidden?: undefined;
inputIsHiddenAfterUpdate?: undefined;
};
componentDidMount(): void;
componentDidUpdate(prevProps: Props<Option, IsMulti, Group>): void;
componentWillUnmount(): void;
onMenuOpen(): void;
onMenuClose(): void;
onInputChange(newValue: string, actionMeta: InputActionMeta): void;
focusInput(): void;
blurInput(): void;
focus: () => void;
blur: () => void;
openMenu(focusOption: 'first' | 'last'): void;
focusValue(direction: 'previous' | 'next'): void;
focusOption(direction?: FocusDirection): void;
onChange: (newValue: OnChangeValue<Option, IsMulti>, actionMeta: ActionMeta<Option>) => void;
setValue: (newValue: OnChangeValue<Option, IsMulti>, action: SetValueAction, option?: Option | undefined) => void;
selectOption: (newValue: Option) => void;
removeValue: (removedValue: Option) => void;
clearValue: () => void;
popValue: () => void;
getTheme(): import("./types").Theme;
getFocusedOptionId: (focusedOption: Option) => string | null;
getFocusableOptionsWithIds: () => FocusableOptionWithId<Option>[];
getValue: () => Options<Option>;
cx: (...args: any) => string;
getCommonProps(): {
clearValue: () => void;
cx: (...args: any) => string;
getStyles: <Key extends keyof StylesProps<Option, IsMulti, Group>>(key: Key, props: StylesProps<Option, IsMulti, Group>[Key]) => import("./types").CSSObjectWithLabel;
getClassNames: <Key_1 extends keyof StylesProps<Option, IsMulti, Group>>(key: Key_1, props: StylesProps<Option, IsMulti, Group>[Key_1]) => string | undefined;
getValue: () => Options<Option>;
hasValue: boolean;
isMulti: IsMulti;
isRtl: boolean;
options: OptionsOrGroups<Option, Group>;
selectOption: (newValue: Option) => void;
selectProps: Readonly<Props<Option, IsMulti, Group>> & Readonly<{
children?: React.ReactNode;
}>;
setValue: (newValue: OnChangeValue<Option, IsMulti>, action: SetValueAction, option?: Option | undefined) => void;
theme: import("./types").Theme;
};
getOptionLabel: (data: Option) => string;
getOptionValue: (data: Option) => string;
getStyles: <Key extends keyof StylesProps<Option, IsMulti, Group>>(key: Key, props: StylesProps<Option, IsMulti, Group>[Key]) => import("./types").CSSObjectWithLabel;
getClassNames: <Key extends keyof StylesProps<Option, IsMulti, Group>>(key: Key, props: StylesProps<Option, IsMulti, Group>[Key]) => string | undefined;
getElementId: (element: 'group' | 'input' | 'listbox' | 'option' | 'placeholder' | 'live-region') => string;
getComponents: () => {
ClearIndicator: <Option_1, IsMulti_1 extends boolean, Group_1 extends GroupBase<Option_1>>(props: import(".").ClearIndicatorProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
Control: <Option_2, IsMulti_2 extends boolean, Group_2 extends GroupBase<Option_2>>(props: import(".").ControlProps<Option_2, IsMulti_2, Group_2>) => import("@emotion/react").jsx.JSX.Element;
DropdownIndicator: <Option_3, IsMulti_3 extends boolean, Group_3 extends GroupBase<Option_3>>(props: import(".").DropdownIndicatorProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;
DownChevron: (props: import("./components/indicators").DownChevronProps) => import("@emotion/react").jsx.JSX.Element;
CrossIcon: (props: import("./components/indicators").CrossIconProps) => import("@emotion/react").jsx.JSX.Element;
Group: <Option_4, IsMulti_4 extends boolean, Group_4 extends GroupBase<Option_4>>(props: import(".").GroupProps<Option_4, IsMulti_4, Group_4>) => import("@emotion/react").jsx.JSX.Element;
GroupHeading: <Option_5, IsMulti_5 extends boolean, Group_5 extends GroupBase<Option_5>>(props: import(".").GroupHeadingProps<Option_5, IsMulti_5, Group_5>) => import("@emotion/react").jsx.JSX.Element;
IndicatorsContainer: <Option_6, IsMulti_6 extends boolean, Group_6 extends GroupBase<Option_6>>(props: import(".").IndicatorsContainerProps<Option_6, IsMulti_6, Group_6>) => import("@emotion/react").jsx.JSX.Element;
IndicatorSeparator: <Option_7, IsMulti_7 extends boolean, Group_7 extends GroupBase<Option_7>>(props: import(".").IndicatorSeparatorProps<Option_7, IsMulti_7, Group_7>) => import("@emotion/react").jsx.JSX.Element;
Input: <Option_8, IsMulti_8 extends boolean, Group_8 extends GroupBase<Option_8>>(props: import(".").InputProps<Option_8, IsMulti_8, Group_8>) => import("@emotion/react").jsx.JSX.Element;
LoadingIndicator: <Option_9, IsMulti_9 extends boolean, Group_9 extends GroupBase<Option_9>>({ innerProps, isRtl, size, ...restProps }: import(".").LoadingIndicatorProps<Option_9, IsMulti_9, Group_9>) => import("@emotion/react").jsx.JSX.Element;
Menu: <Option_10, IsMulti_10 extends boolean, Group_10 extends GroupBase<Option_10>>(props: import("./components/Menu").MenuProps<Option_10, IsMulti_10, Group_10>) => import("@emotion/react").jsx.JSX.Element;
MenuList: <Option_11, IsMulti_11 extends boolean, Group_11 extends GroupBase<Option_11>>(props: import("./components/Menu").MenuListProps<Option_11, IsMulti_11, Group_11>) => import("@emotion/react").jsx.JSX.Element;
MenuPortal: <Option_12, IsMulti_12 extends boolean, Group_12 extends GroupBase<Option_12>>(props: import("./components/Menu").MenuPortalProps<Option_12, IsMulti_12, Group_12>) => import("@emotion/react").jsx.JSX.Element | null;
LoadingMessage: <Option_13, IsMulti_13 extends boolean, Group_13 extends GroupBase<Option_13>>({ children, innerProps, ...restProps }: import("./components/Menu").NoticeProps<Option_13, IsMulti_13, Group_13>) => import("@emotion/react").jsx.JSX.Element;
NoOptionsMessage: <Option_14, IsMulti_14 extends boolean, Group_14 extends GroupBase<Option_14>>({ children, innerProps, ...restProps }: import("./components/Menu").NoticeProps<Option_14, IsMulti_14, Group_14>) => import("@emotion/react").jsx.JSX.Element;
MultiValue: <Option_15, IsMulti_15 extends boolean, Group_15 extends GroupBase<Option_15>>(props: import(".").MultiValueProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
MultiValueContainer: <Option_16, IsMulti_16 extends boolean, Group_16 extends GroupBase<Option_16>>({ children, innerProps, }: import(".").MultiValueGenericProps<Option_16, IsMulti_16, Group_16>) => import("@emotion/react").jsx.JSX.Element;
MultiValueLabel: <Option_16, IsMulti_16 extends boolean, Group_16 extends GroupBase<Option_16>>({ children, innerProps, }: import(".").MultiValueGenericProps<Option_16, IsMulti_16, Group_16>) => import("@emotion/react").jsx.JSX.Element;
MultiValueRemove: typeof import("./components/MultiValue").MultiValueRemove;
Option: <Option_17, IsMulti_17 extends boolean, Group_17 extends GroupBase<Option_17>>(props: import(".").OptionProps<Option_17, IsMulti_17, Group_17>) => import("@emotion/react").jsx.JSX.Element;
Placeholder: <Option_18, IsMulti_18 extends boolean, Group_18 extends GroupBase<Option_18>>(props: import(".").PlaceholderProps<Option_18, IsMulti_18, Group_18>) => import("@emotion/react").jsx.JSX.Element;
SelectContainer: <Option_19, IsMulti_19 extends boolean, Group_19 extends GroupBase<Option_19>>(props: import(".").ContainerProps<Option_19, IsMulti_19, Group_19>) => import("@emotion/react").jsx.JSX.Element;
SingleValue: <Option_20, IsMulti_20 extends boolean, Group_20 extends GroupBase<Option_20>>(props: import(".").SingleValueProps<Option_20, IsMulti_20, Group_20>) => import("@emotion/react").jsx.JSX.Element;
ValueContainer: <Option_21, IsMulti_21 extends boolean, Group_21 extends GroupBase<Option_21>>(props: import(".").ValueContainerProps<Option_21, IsMulti_21, Group_21>) => import("@emotion/react").jsx.JSX.Element;
};
buildCategorizedOptions: () => CategorizedGroupOrOption<Option, Group>[];
getCategorizedOptions: () => CategorizedGroupOrOption<Option, Group>[];
buildFocusableOptions: () => Option[];
getFocusableOptions: () => Option[];
ariaOnChange: (value: OnChangeValue<Option, IsMulti>, actionMeta: ActionMeta<Option>) => void;
hasValue(): boolean;
hasOptions(): boolean;
isClearable(): boolean;
isOptionDisabled(option: Option, selectValue: Options<Option>): boolean;
isOptionSelected(option: Option, selectValue: Options<Option>): boolean;
filterOption(option: FilterOptionOption<Option>, inputValue: string): boolean;
formatOptionLabel(data: Option, context: FormatOptionLabelContext): ReactNode;
formatGroupLabel(data: Group): React.ReactNode;
onMenuMouseDown: MouseEventHandler<HTMLDivElement>;
onMenuMouseMove: MouseEventHandler<HTMLDivElement>;
onControlMouseDown: (event: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>) => void;
onDropdownIndicatorMouseDown: (event: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>) => void;
onClearIndicatorMouseDown: (event: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>) => void;
onScroll: (event: Event) => void;
startListeningComposition(): void;
stopListeningComposition(): void;
onCompositionStart: () => void;
onCompositionEnd: () => void;
startListeningToTouch(): void;
stopListeningToTouch(): void;
onTouchStart: ({ touches }: TouchEvent) => void;
onTouchMove: ({ touches }: TouchEvent) => void;
onTouchEnd: (event: TouchEvent) => void;
onControlTouchEnd: TouchEventHandler<HTMLDivElement>;
onClearIndicatorTouchEnd: TouchEventHandler<HTMLDivElement>;
onDropdownIndicatorTouchEnd: TouchEventHandler<HTMLDivElement>;
handleInputChange: FormEventHandler<HTMLInputElement>;
onInputFocus: FocusEventHandler<HTMLInputElement>;
onInputBlur: FocusEventHandler<HTMLInputElement>;
onOptionHover: (focusedOption: Option) => void;
shouldHideSelectedOptions: () => boolean | IsMulti;
onValueInputFocus: FocusEventHandler;
onKeyDown: KeyboardEventHandler<HTMLDivElement>;
renderInput(): JSX.Element;
renderPlaceholderOrValue(): JSX.Element | JSX.Element[] | null;
renderClearIndicator(): JSX.Element | null;
renderLoadingIndicator(): JSX.Element | null;
renderIndicatorSeparator(): JSX.Element | null;
renderDropdownIndicator(): JSX.Element | null;
renderMenu(): JSX.Element | null;
renderFormField(): JSX.Element | undefined;
renderLiveRegion(): JSX.Element;
render(): JSX.Element;
}
export declare type PublicBaseSelectProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = JSX.LibraryManagedAttributes<typeof Select, Props<Option, IsMulti, Group>>;
export {};

View File

@@ -0,0 +1,5 @@
export declare function isIPhone(): boolean;
export declare function isMac(): boolean;
export declare function isIPad(): boolean;
export declare function isIOS(): boolean;
export declare function isAppleDevice(): boolean;

View File

@@ -0,0 +1,77 @@
import type { AriaAttributes } from 'react';
import { ActionMeta, GroupBase, InitialInputFocusedActionMeta, OnChangeValue, Options, OptionsOrGroups } from '../types';
export declare type OptionContext = 'menu' | 'value';
export declare type GuidanceContext = 'menu' | 'input' | 'value';
export declare type AriaSelection<Option, IsMulti extends boolean> = InitialInputFocusedActionMeta<Option, IsMulti> | (ActionMeta<Option> & {
value: OnChangeValue<Option, IsMulti>;
option?: Option;
options?: Options<Option>;
});
export interface AriaGuidanceProps {
/** String value of selectProp aria-label */
'aria-label': AriaAttributes['aria-label'];
/** String indicating user's current context and available keyboard interactivity */
context: GuidanceContext;
/** Boolean value of selectProp isSearchable */
isSearchable: boolean;
/** Boolean value of selectProp isMulti */
isMulti: boolean;
/** Boolean value of selectProp isDisabled */
isDisabled: boolean | null;
/** Boolean value of selectProp tabSelectsValue */
tabSelectsValue: boolean;
/** Boolean value indicating if user focused the input for the first time */
isInitialFocus: boolean;
}
export declare type AriaOnChangeProps<Option, IsMulti extends boolean> = AriaSelection<Option, IsMulti> & {
/** String derived label from selected or removed option/value */
label: string;
/** Array of labels derived from multiple selected or cleared options */
labels: string[];
/** Boolean indicating if the selected menu option is disabled */
isDisabled: boolean | null;
};
export interface AriaOnFilterProps {
/** String indicating current inputValue of the input */
inputValue: string;
/** String derived from selectProp screenReaderStatus */
resultsMessage: string;
}
export interface AriaOnFocusProps<Option, Group extends GroupBase<Option>> {
/** String indicating whether the option was focused in the menu or as (multi-) value */
context: OptionContext;
/** Option that is being focused */
focused: Option;
/** Boolean indicating whether focused menu option has been disabled */
isDisabled: boolean;
/** Boolean indicating whether focused menu option is an already selected option */
isSelected: boolean;
/** String derived label from focused option/value */
label: string;
/** Options provided as props to Select used to determine indexing */
options: OptionsOrGroups<Option, Group>;
/** selected option(s) of the Select */
selectValue: Options<Option>;
/** Boolean indicating whether user uses Apple device */
isAppleDevice: boolean;
}
export declare type AriaGuidance = (props: AriaGuidanceProps) => string;
export declare type AriaOnChange<Option, IsMulti extends boolean> = (props: AriaOnChangeProps<Option, IsMulti>) => string;
export declare type AriaOnFilter = (props: AriaOnFilterProps) => string;
export declare type AriaOnFocus<Option, Group extends GroupBase<Option> = GroupBase<Option>> = (props: AriaOnFocusProps<Option, Group>) => string;
export interface AriaLiveMessages<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
/** Guidance message used to convey component state and specific keyboard interactivity */
guidance?: (props: AriaGuidanceProps) => string;
/** OnChange message used to convey changes to value but also called when user selects disabled option */
onChange?: (props: AriaOnChangeProps<Option, IsMulti>) => string;
/** OnFilter message used to convey information about filtered results displayed in the menu */
onFilter?: (props: AriaOnFilterProps) => string;
/** OnFocus message used to convey information about the currently focused option or value */
onFocus?: (props: AriaOnFocusProps<Option, Group>) => string;
}
export declare const defaultAriaLiveMessages: {
guidance: (props: AriaGuidanceProps) => string;
onChange: <Option, IsMulti extends boolean>(props: AriaOnChangeProps<Option, IsMulti>) => string;
onFocus: <Option_1, Group extends GroupBase<Option_1>>(props: AriaOnFocusProps<Option_1, Group>) => string;
onFilter: (props: AriaOnFilterProps) => string;
};

View File

@@ -0,0 +1,8 @@
import { ReactElement } from 'react';
import { TransitionProps } from 'react-transition-group/Transition';
import { InputProps } from '../components/Input';
import { GroupBase } from '../types';
export declare type InputComponent = <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: InputProps<Option, IsMulti, Group>) => ReactElement;
export declare type AnimatedInputProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = InputProps<Option, IsMulti, Group> & Partial<TransitionProps>;
declare const AnimatedInput: (WrappedComponent: InputComponent) => InputComponent;
export default AnimatedInput;

View File

@@ -0,0 +1,9 @@
import * as React from 'react';
import { ReactElement } from 'react';
import { TransitionProps } from 'react-transition-group/Transition';
import { MultiValueProps } from '../components/MultiValue';
import { GroupBase } from '../types';
export declare type MultiValueComponent = <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MultiValueProps<Option, IsMulti, Group>) => ReactElement;
export declare type AnimatedMultiValueProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = MultiValueProps<Option, IsMulti, Group> & Partial<TransitionProps>;
declare const AnimatedMultiValue: (WrappedComponent: MultiValueComponent) => <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ in: inProp, onExited, ...props }: AnimatedMultiValueProps<Option, IsMulti, Group>) => React.JSX.Element;
export default AnimatedMultiValue;

View File

@@ -0,0 +1,7 @@
import * as React from 'react';
import { ReactElement } from 'react';
import { PlaceholderProps } from '../components/Placeholder';
import { GroupBase } from '../types';
export declare type PlaceholderComponent = <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: PlaceholderProps<Option, IsMulti, Group>) => ReactElement;
declare const AnimatedPlaceholder: (WrappedComponent: PlaceholderComponent) => <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: PlaceholderProps<Option, IsMulti, Group>) => React.JSX.Element;
export default AnimatedPlaceholder;

View File

@@ -0,0 +1,7 @@
import * as React from 'react';
import { ReactElement } from 'react';
import { SingleValueProps } from '../components/SingleValue';
import { GroupBase } from '../types';
export declare type SingleValueComponent = <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: SingleValueProps<Option, IsMulti, Group>) => ReactElement;
declare const AnimatedSingleValue: (WrappedComponent: SingleValueComponent) => <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: SingleValueProps<Option, IsMulti, Group>) => React.JSX.Element;
export default AnimatedSingleValue;

View File

@@ -0,0 +1,7 @@
import * as React from 'react';
import { ReactElement } from 'react';
import { ValueContainerProps } from '../components/containers';
import { GroupBase } from '../types';
export declare type ValueContainerComponent = <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ValueContainerProps<Option, IsMulti, Group>) => ReactElement;
declare const AnimatedValueContainer: (WrappedComponent: ValueContainerComponent) => <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ValueContainerProps<Option, IsMulti, Group>) => React.JSX.Element;
export default AnimatedValueContainer;

View File

@@ -0,0 +1,59 @@
export declare const Input: (<Option, IsMulti extends boolean, Group extends import("..").GroupBase<Option>>(props: import("..").InputProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element) | undefined;
export declare const MultiValue: (<Option, IsMulti extends boolean, Group extends import("..").GroupBase<Option>>(props: import("..").MultiValueProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element) | undefined;
export declare const Placeholder: (<Option, IsMulti extends boolean, Group extends import("..").GroupBase<Option>>(props: import("..").PlaceholderProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element) | undefined;
export declare const SingleValue: (<Option, IsMulti extends boolean, Group extends import("..").GroupBase<Option>>(props: import("..").SingleValueProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element) | undefined;
export declare const ValueContainer: (<Option, IsMulti extends boolean, Group extends import("..").GroupBase<Option>>(props: import("..").ValueContainerProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element) | undefined;
declare const _default: import("memoize-one").MemoizedFn<(externalComponents?: Partial<{
ClearIndicator: <Option, IsMulti extends boolean, Group extends import("..").GroupBase<Option>>(props: import("..").ClearIndicatorProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element;
Control: <Option_1, IsMulti_1 extends boolean, Group_1 extends import("..").GroupBase<Option_1>>(props: import("..").ControlProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
DropdownIndicator: <Option_2, IsMulti_2 extends boolean, Group_2 extends import("..").GroupBase<Option_2>>(props: import("..").DropdownIndicatorProps<Option_2, IsMulti_2, Group_2>) => import("@emotion/react").jsx.JSX.Element;
DownChevron: (props: import("../components/indicators").DownChevronProps) => import("@emotion/react").jsx.JSX.Element;
CrossIcon: (props: import("../components/indicators").CrossIconProps) => import("@emotion/react").jsx.JSX.Element;
Group: <Option_3, IsMulti_3 extends boolean, Group_3 extends import("..").GroupBase<Option_3>>(props: import("..").GroupProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;
GroupHeading: <Option_4, IsMulti_4 extends boolean, Group_4 extends import("..").GroupBase<Option_4>>(props: import("..").GroupHeadingProps<Option_4, IsMulti_4, Group_4>) => import("@emotion/react").jsx.JSX.Element;
IndicatorsContainer: <Option_5, IsMulti_5 extends boolean, Group_5 extends import("..").GroupBase<Option_5>>(props: import("..").IndicatorsContainerProps<Option_5, IsMulti_5, Group_5>) => import("@emotion/react").jsx.JSX.Element;
IndicatorSeparator: <Option_6, IsMulti_6 extends boolean, Group_6 extends import("..").GroupBase<Option_6>>(props: import("..").IndicatorSeparatorProps<Option_6, IsMulti_6, Group_6>) => import("@emotion/react").jsx.JSX.Element;
Input: <Option_7, IsMulti_7 extends boolean, Group_7 extends import("..").GroupBase<Option_7>>(props: import("..").InputProps<Option_7, IsMulti_7, Group_7>) => import("@emotion/react").jsx.JSX.Element;
LoadingIndicator: <Option_8, IsMulti_8 extends boolean, Group_8 extends import("..").GroupBase<Option_8>>({ innerProps, isRtl, size, ...restProps }: import("..").LoadingIndicatorProps<Option_8, IsMulti_8, Group_8>) => import("@emotion/react").jsx.JSX.Element;
Menu: <Option_9, IsMulti_9 extends boolean, Group_9 extends import("..").GroupBase<Option_9>>(props: import("..").MenuProps<Option_9, IsMulti_9, Group_9>) => import("@emotion/react").jsx.JSX.Element;
MenuList: <Option_10, IsMulti_10 extends boolean, Group_10 extends import("..").GroupBase<Option_10>>(props: import("..").MenuListProps<Option_10, IsMulti_10, Group_10>) => import("@emotion/react").jsx.JSX.Element;
MenuPortal: <Option_11, IsMulti_11 extends boolean, Group_11 extends import("..").GroupBase<Option_11>>(props: import("../components/Menu").MenuPortalProps<Option_11, IsMulti_11, Group_11>) => import("@emotion/react").jsx.JSX.Element | null;
LoadingMessage: <Option_12, IsMulti_12 extends boolean, Group_12 extends import("..").GroupBase<Option_12>>({ children, innerProps, ...restProps }: import("..").NoticeProps<Option_12, IsMulti_12, Group_12>) => import("@emotion/react").jsx.JSX.Element;
NoOptionsMessage: <Option_13, IsMulti_13 extends boolean, Group_13 extends import("..").GroupBase<Option_13>>({ children, innerProps, ...restProps }: import("..").NoticeProps<Option_13, IsMulti_13, Group_13>) => import("@emotion/react").jsx.JSX.Element;
MultiValue: <Option_14, IsMulti_14 extends boolean, Group_14 extends import("..").GroupBase<Option_14>>(props: import("..").MultiValueProps<Option_14, IsMulti_14, Group_14>) => import("@emotion/react").jsx.JSX.Element;
MultiValueContainer: <Option_15, IsMulti_15 extends boolean, Group_15 extends import("..").GroupBase<Option_15>>({ children, innerProps, }: import("..").MultiValueGenericProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
MultiValueLabel: <Option_15, IsMulti_15 extends boolean, Group_15 extends import("..").GroupBase<Option_15>>({ children, innerProps, }: import("..").MultiValueGenericProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
MultiValueRemove: typeof import("../components/MultiValue").MultiValueRemove;
Option: <Option_16, IsMulti_16 extends boolean, Group_16 extends import("..").GroupBase<Option_16>>(props: import("..").OptionProps<Option_16, IsMulti_16, Group_16>) => import("@emotion/react").jsx.JSX.Element;
Placeholder: <Option_17, IsMulti_17 extends boolean, Group_17 extends import("..").GroupBase<Option_17>>(props: import("..").PlaceholderProps<Option_17, IsMulti_17, Group_17>) => import("@emotion/react").jsx.JSX.Element;
SelectContainer: <Option_18, IsMulti_18 extends boolean, Group_18 extends import("..").GroupBase<Option_18>>(props: import("..").ContainerProps<Option_18, IsMulti_18, Group_18>) => import("@emotion/react").jsx.JSX.Element;
SingleValue: <Option_19, IsMulti_19 extends boolean, Group_19 extends import("..").GroupBase<Option_19>>(props: import("..").SingleValueProps<Option_19, IsMulti_19, Group_19>) => import("@emotion/react").jsx.JSX.Element;
ValueContainer: <Option_20, IsMulti_20 extends boolean, Group_20 extends import("..").GroupBase<Option_20>>(props: import("..").ValueContainerProps<Option_20, IsMulti_20, Group_20>) => import("@emotion/react").jsx.JSX.Element;
}>) => Partial<{
ClearIndicator: <Option, IsMulti extends boolean, Group extends import("..").GroupBase<Option>>(props: import("..").ClearIndicatorProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element;
Control: <Option_1, IsMulti_1 extends boolean, Group_1 extends import("..").GroupBase<Option_1>>(props: import("..").ControlProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
DropdownIndicator: <Option_2, IsMulti_2 extends boolean, Group_2 extends import("..").GroupBase<Option_2>>(props: import("..").DropdownIndicatorProps<Option_2, IsMulti_2, Group_2>) => import("@emotion/react").jsx.JSX.Element;
DownChevron: (props: import("../components/indicators").DownChevronProps) => import("@emotion/react").jsx.JSX.Element;
CrossIcon: (props: import("../components/indicators").CrossIconProps) => import("@emotion/react").jsx.JSX.Element;
Group: <Option_3, IsMulti_3 extends boolean, Group_3 extends import("..").GroupBase<Option_3>>(props: import("..").GroupProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;
GroupHeading: <Option_4, IsMulti_4 extends boolean, Group_4 extends import("..").GroupBase<Option_4>>(props: import("..").GroupHeadingProps<Option_4, IsMulti_4, Group_4>) => import("@emotion/react").jsx.JSX.Element;
IndicatorsContainer: <Option_5, IsMulti_5 extends boolean, Group_5 extends import("..").GroupBase<Option_5>>(props: import("..").IndicatorsContainerProps<Option_5, IsMulti_5, Group_5>) => import("@emotion/react").jsx.JSX.Element;
IndicatorSeparator: <Option_6, IsMulti_6 extends boolean, Group_6 extends import("..").GroupBase<Option_6>>(props: import("..").IndicatorSeparatorProps<Option_6, IsMulti_6, Group_6>) => import("@emotion/react").jsx.JSX.Element;
Input: <Option_7, IsMulti_7 extends boolean, Group_7 extends import("..").GroupBase<Option_7>>(props: import("..").InputProps<Option_7, IsMulti_7, Group_7>) => import("@emotion/react").jsx.JSX.Element;
LoadingIndicator: <Option_8, IsMulti_8 extends boolean, Group_8 extends import("..").GroupBase<Option_8>>({ innerProps, isRtl, size, ...restProps }: import("..").LoadingIndicatorProps<Option_8, IsMulti_8, Group_8>) => import("@emotion/react").jsx.JSX.Element;
Menu: <Option_9, IsMulti_9 extends boolean, Group_9 extends import("..").GroupBase<Option_9>>(props: import("..").MenuProps<Option_9, IsMulti_9, Group_9>) => import("@emotion/react").jsx.JSX.Element;
MenuList: <Option_10, IsMulti_10 extends boolean, Group_10 extends import("..").GroupBase<Option_10>>(props: import("..").MenuListProps<Option_10, IsMulti_10, Group_10>) => import("@emotion/react").jsx.JSX.Element;
MenuPortal: <Option_11, IsMulti_11 extends boolean, Group_11 extends import("..").GroupBase<Option_11>>(props: import("../components/Menu").MenuPortalProps<Option_11, IsMulti_11, Group_11>) => import("@emotion/react").jsx.JSX.Element | null;
LoadingMessage: <Option_12, IsMulti_12 extends boolean, Group_12 extends import("..").GroupBase<Option_12>>({ children, innerProps, ...restProps }: import("..").NoticeProps<Option_12, IsMulti_12, Group_12>) => import("@emotion/react").jsx.JSX.Element;
NoOptionsMessage: <Option_13, IsMulti_13 extends boolean, Group_13 extends import("..").GroupBase<Option_13>>({ children, innerProps, ...restProps }: import("..").NoticeProps<Option_13, IsMulti_13, Group_13>) => import("@emotion/react").jsx.JSX.Element;
MultiValue: <Option_14, IsMulti_14 extends boolean, Group_14 extends import("..").GroupBase<Option_14>>(props: import("..").MultiValueProps<Option_14, IsMulti_14, Group_14>) => import("@emotion/react").jsx.JSX.Element;
MultiValueContainer: <Option_15, IsMulti_15 extends boolean, Group_15 extends import("..").GroupBase<Option_15>>({ children, innerProps, }: import("..").MultiValueGenericProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
MultiValueLabel: <Option_15, IsMulti_15 extends boolean, Group_15 extends import("..").GroupBase<Option_15>>({ children, innerProps, }: import("..").MultiValueGenericProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
MultiValueRemove: typeof import("../components/MultiValue").MultiValueRemove;
Option: <Option_16, IsMulti_16 extends boolean, Group_16 extends import("..").GroupBase<Option_16>>(props: import("..").OptionProps<Option_16, IsMulti_16, Group_16>) => import("@emotion/react").jsx.JSX.Element;
Placeholder: <Option_17, IsMulti_17 extends boolean, Group_17 extends import("..").GroupBase<Option_17>>(props: import("..").PlaceholderProps<Option_17, IsMulti_17, Group_17>) => import("@emotion/react").jsx.JSX.Element;
SelectContainer: <Option_18, IsMulti_18 extends boolean, Group_18 extends import("..").GroupBase<Option_18>>(props: import("..").ContainerProps<Option_18, IsMulti_18, Group_18>) => import("@emotion/react").jsx.JSX.Element;
SingleValue: <Option_19, IsMulti_19 extends boolean, Group_19 extends import("..").GroupBase<Option_19>>(props: import("..").SingleValueProps<Option_19, IsMulti_19, Group_19>) => import("@emotion/react").jsx.JSX.Element;
ValueContainer: <Option_20, IsMulti_20 extends boolean, Group_20 extends import("..").GroupBase<Option_20>>(props: import("..").ValueContainerProps<Option_20, IsMulti_20, Group_20>) => import("@emotion/react").jsx.JSX.Element;
}>>;
export default _default;

View File

@@ -0,0 +1,18 @@
import * as React from 'react';
import { ComponentType, ReactNode } from 'react';
import { ExitHandler } from 'react-transition-group/Transition';
declare type FadeProps<ComponentProps> = {
component: ComponentType<ComponentProps>;
in?: boolean;
onExited?: ExitHandler<undefined | HTMLElement>;
duration?: number;
} & ComponentProps;
export declare const Fade: <ComponentProps extends {}>({ component: Tag, duration, in: inProp, onExited, ...props }: FadeProps<ComponentProps>) => React.JSX.Element;
export declare const collapseDuration = 260;
interface CollapseProps {
children: ReactNode;
in?: boolean;
onExited?: ExitHandler<undefined | HTMLElement>;
}
export declare const Collapse: ({ children, in: _in, onExited }: CollapseProps) => React.JSX.Element;
export {};

View File

@@ -0,0 +1,2 @@
export * from '../AsyncCreatable';
export { default } from '../AsyncCreatable';

View File

@@ -0,0 +1,2 @@
export * from '../Async';
export { default } from '../Async';

View File

@@ -0,0 +1,2 @@
export * from '../Select';
export { default } from '../Select';

View File

@@ -0,0 +1,5 @@
import { GroupBase } from './types';
export declare const formatGroupLabel: <Option, Group extends GroupBase<Option>>(group: Group) => string;
export declare const getOptionLabel: <Option>(option: Option) => string;
export declare const getOptionValue: <Option>(option: Option) => string;
export declare const isOptionDisabled: <Option>(option: Option) => boolean;

View File

@@ -0,0 +1,20 @@
/** @jsx jsx */
import { JSX, ReactNode, Ref } from 'react';
import { jsx } from '@emotion/react';
import { CommonPropsAndClassName, CSSObjectWithLabel, GroupBase } from '../types';
export interface ControlProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** Children to render. */
children: ReactNode;
innerRef: Ref<HTMLDivElement>;
/** The mouse down event and the innerRef to pass down to the controller element. */
innerProps: JSX.IntrinsicElements['div'];
/** Whether the select is disabled. */
isDisabled: boolean;
/** Whether the select is focused. */
isFocused: boolean;
/** Whether the select is expanded. */
menuIsOpen: boolean;
}
export declare const css: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isDisabled, isFocused, theme: { colors, borderRadius, spacing }, }: ControlProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
declare const Control: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ControlProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default Control;

View File

@@ -0,0 +1,38 @@
/** @jsx jsx */
import { ComponentType, JSX, ReactNode } from 'react';
import { jsx } from '@emotion/react';
import { CommonProps, CommonPropsAndClassName, CSSObjectWithLabel, CX, GetStyles, GroupBase, Options, Theme } from '../types';
import { Props } from '../Select';
export interface ForwardedHeadingProps<Option, Group extends GroupBase<Option>> {
id: string;
data: Group;
}
export interface GroupProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** The children to be rendered. */
children: ReactNode;
/** Component to wrap the label, receives headingProps. */
Heading: ComponentType<GroupHeadingProps<Option, IsMulti, Group>>;
/** Props to pass to Heading. */
headingProps: ForwardedHeadingProps<Option, Group>;
/** Props to be passed to the group element. */
innerProps: JSX.IntrinsicElements['div'];
/** Label to be displayed in the heading component. */
label: ReactNode;
/** The data of the group. */
data: Group;
options: Options<Option>;
}
export declare const groupCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { spacing } }: GroupProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
declare const Group: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: GroupProps<Option, IsMulti, Group>) => jsx.JSX.Element;
interface GroupHeadingPropsDefinedProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> extends ForwardedHeadingProps<Option, Group> {
className?: string | undefined;
selectProps: Props<Option, IsMulti, Group>;
theme: Theme;
getStyles: GetStyles<Option, IsMulti, Group>;
getClassNames: CommonProps<Option, IsMulti, Group>['getClassNames'];
cx: CX;
}
export declare type GroupHeadingProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> = GroupHeadingPropsDefinedProps<Option, IsMulti, Group> & JSX.IntrinsicElements['div'];
export declare const groupHeadingCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { colors, spacing } }: GroupHeadingProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const GroupHeading: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: GroupHeadingProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default Group;

View File

@@ -0,0 +1,20 @@
/** @jsx jsx */
import { InputHTMLAttributes } from 'react';
import { jsx } from '@emotion/react';
import { CommonPropsAndClassName, CSSObjectWithLabel, GroupBase } from '../types';
export interface InputSpecificProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends InputHTMLAttributes<HTMLInputElement>, CommonPropsAndClassName<Option, IsMulti, Group> {
/** Reference to the internal element */
innerRef?: (instance: HTMLInputElement | null) => void;
/** Set whether the input should be visible. Does not affect input size. */
isHidden: boolean;
/** Whether the input is disabled */
isDisabled?: boolean;
/** The ID of the form that the input belongs to */
form?: string;
/** Set className for the input element */
inputClassName?: string;
}
export declare type InputProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> = InputSpecificProps<Option, IsMulti, Group>;
export declare const inputCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isDisabled, value, theme: { spacing, colors }, }: InputProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
declare const Input: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: InputProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default Input;

View File

@@ -0,0 +1,21 @@
/** @jsx jsx */
import { ReactNode } from 'react';
import { jsx } from '@emotion/react';
import { AriaSelection } from '../accessibility';
import { CommonProps, GroupBase, Options } from '../types';
export interface LiveRegionProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> extends CommonProps<Option, IsMulti, Group> {
children: ReactNode;
innerProps: {
className?: string;
};
ariaSelection: AriaSelection<Option, IsMulti>;
focusedOption: Option | null;
focusedValue: Option | null;
selectValue: Options<Option>;
focusableOptions: Options<Option>;
isFocused: boolean;
id: string;
isAppleDevice: boolean;
}
declare const LiveRegion: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: LiveRegionProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default LiveRegion;

View File

@@ -0,0 +1,97 @@
/** @jsx jsx */
import { JSX, ReactElement, ReactNode, Ref } from 'react';
import { jsx } from '@emotion/react';
import { MenuPlacement, MenuPosition, CommonProps, GroupBase, CommonPropsAndClassName, CoercedMenuPlacement, CSSObjectWithLabel } from '../types';
interface CalculatedMenuPlacementAndHeight {
placement: CoercedMenuPlacement;
maxHeight: number;
}
interface PlacementArgs {
maxHeight: number;
menuEl: HTMLDivElement | null;
minHeight: number;
placement: MenuPlacement;
shouldScroll: boolean;
isFixedPosition: boolean;
controlHeight: number;
}
export declare function getMenuPlacement({ maxHeight: preferredMaxHeight, menuEl, minHeight, placement: preferredPlacement, shouldScroll, isFixedPosition, controlHeight, }: PlacementArgs): CalculatedMenuPlacementAndHeight;
export interface MenuPlacementProps {
/** Set the minimum height of the menu. */
minMenuHeight: number;
/** Set the maximum height of the menu. */
maxMenuHeight: number;
/** Set whether the menu should be at the top, at the bottom. The auto options sets it to bottom. */
menuPlacement: MenuPlacement;
/** The CSS position value of the menu, when "fixed" extra layout management is required */
menuPosition: MenuPosition;
/** Set whether the page should scroll to show the menu. */
menuShouldScrollIntoView: boolean;
}
export interface MenuProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group>, MenuPlacementProps {
/** Reference to the internal element, consumed by the MenuPlacer component */
innerRef: Ref<HTMLDivElement>;
innerProps: JSX.IntrinsicElements['div'];
isLoading: boolean;
placement: CoercedMenuPlacement;
/** The children to be rendered. */
children: ReactNode;
}
interface PlacerProps {
placement: CoercedMenuPlacement;
maxHeight: number;
}
interface ChildrenProps {
ref: Ref<HTMLDivElement>;
placerProps: PlacerProps;
}
export interface MenuPlacerProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> extends CommonProps<Option, IsMulti, Group>, MenuPlacementProps {
/** The children to be rendered. */
children: (childrenProps: ChildrenProps) => ReactElement;
}
export declare const menuCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ placement, theme: { borderRadius, spacing, colors }, }: MenuProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const MenuPlacer: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MenuPlacerProps<Option, IsMulti, Group>) => ReactElement<any, string | import("react").JSXElementConstructor<any>>;
declare const Menu: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MenuProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default Menu;
export interface MenuListProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** Set the max height of the Menu component */
maxHeight: number;
/** The children to be rendered. */
children: ReactNode;
/** Inner ref to DOM ReactNode */
innerRef: Ref<HTMLDivElement>;
/** The currently focused option */
focusedOption: Option;
/** Props to be passed to the menu-list wrapper. */
innerProps: JSX.IntrinsicElements['div'];
}
export declare const menuListCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ maxHeight, theme: { spacing: { baseUnit }, }, }: MenuListProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const MenuList: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MenuListProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export declare const noOptionsMessageCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { spacing: { baseUnit }, colors, }, }: NoticeProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const loadingMessageCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { spacing: { baseUnit }, colors, }, }: NoticeProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export interface NoticeProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** The children to be rendered. */
children: ReactNode;
/** Props to be passed on to the wrapper. */
innerProps: JSX.IntrinsicElements['div'];
}
export declare const NoOptionsMessage: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ children, innerProps, ...restProps }: NoticeProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export declare const LoadingMessage: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ children, innerProps, ...restProps }: NoticeProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export interface MenuPortalProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
appendTo: HTMLElement | undefined;
children: ReactNode;
controlElement: HTMLDivElement | null;
innerProps: JSX.IntrinsicElements['div'];
menuPlacement: MenuPlacement;
menuPosition: MenuPosition;
}
export interface PortalStyleArgs {
offset: number;
position: MenuPosition;
rect: {
left: number;
width: number;
};
}
export declare const menuPortalCSS: ({ rect, offset, position, }: PortalStyleArgs) => CSSObjectWithLabel;
export declare const MenuPortal: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MenuPortalProps<Option, IsMulti, Group>) => jsx.JSX.Element | null;

View File

@@ -0,0 +1,44 @@
/** @jsx jsx */
import { ComponentType, JSX, ReactNode } from 'react';
import { jsx } from '@emotion/react';
import { CommonPropsAndClassName, CSSObjectWithLabel, GroupBase } from '../types';
import { Props } from '../Select';
interface MultiValueComponents<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
Container: ComponentType<MultiValueGenericProps<Option, IsMulti, Group>>;
Label: ComponentType<MultiValueGenericProps<Option, IsMulti, Group>>;
Remove: ComponentType<MultiValueRemoveProps<Option, IsMulti, Group>>;
}
export interface MultiValueProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
children: ReactNode;
components: MultiValueComponents<Option, IsMulti, Group>;
cropWithEllipsis?: boolean;
data: Option;
innerProps: JSX.IntrinsicElements['div'];
isFocused: boolean;
isDisabled: boolean;
removeProps: JSX.IntrinsicElements['div'];
index: number;
}
export declare const multiValueCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { spacing, borderRadius, colors }, }: MultiValueProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const multiValueLabelCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { borderRadius, colors }, cropWithEllipsis, }: MultiValueProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const multiValueRemoveCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { spacing, borderRadius, colors }, isFocused, }: MultiValueProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export interface MultiValueGenericProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> {
children: ReactNode;
data: any;
innerProps: {
className?: string;
};
selectProps: Props<Option, IsMulti, Group>;
}
export declare const MultiValueGeneric: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ children, innerProps, }: MultiValueGenericProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export declare const MultiValueContainer: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ children, innerProps, }: MultiValueGenericProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export declare const MultiValueLabel: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ children, innerProps, }: MultiValueGenericProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export interface MultiValueRemoveProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> {
children?: ReactNode;
data: Option;
innerProps: JSX.IntrinsicElements['div'];
selectProps: Props<Option, IsMulti, Group>;
}
export declare function MultiValueRemove<Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ children, innerProps }: MultiValueRemoveProps<Option, IsMulti, Group>): jsx.JSX.Element;
declare const MultiValue: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MultiValueProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default MultiValue;

View File

@@ -0,0 +1,28 @@
/** @jsx jsx */
import { JSX, ReactNode, RefCallback } from 'react';
import { jsx } from '@emotion/react';
import { CommonPropsAndClassName, CSSObjectWithLabel, GroupBase } from '../types';
export interface OptionProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** The children to be rendered. */
children: ReactNode;
/** Inner ref to DOM Node */
innerRef: RefCallback<HTMLDivElement>;
/** props passed to the wrapping element for the group. */
innerProps: JSX.IntrinsicElements['div'];
/** Text to be displayed representing the option. */
label: string;
/** Type is used by the menu to determine whether this is an option or a group.
In the case of option this is always `option`. **/
type: 'option';
/** The data of the selected option. */
data: Option;
/** Whether the option is disabled. */
isDisabled: boolean;
/** Whether the option is focused. */
isFocused: boolean;
/** Whether the option is selected. */
isSelected: boolean;
}
export declare const optionCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isDisabled, isFocused, isSelected, theme: { spacing, colors }, }: OptionProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
declare const Option: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: OptionProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default Option;

View File

@@ -0,0 +1,15 @@
/** @jsx jsx */
import { JSX, ReactNode } from 'react';
import { jsx } from '@emotion/react';
import { CommonPropsAndClassName, CSSObjectWithLabel, GroupBase } from '../types';
export interface PlaceholderProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** The children to be rendered. */
children: ReactNode;
/** props passed to the wrapping element for the group. */
innerProps: JSX.IntrinsicElements['div'];
isDisabled: boolean;
isFocused: boolean;
}
export declare const placeholderCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { spacing, colors } }: PlaceholderProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
declare const Placeholder: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: PlaceholderProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default Placeholder;

View File

@@ -0,0 +1,17 @@
/** @jsx jsx */
import { JSX, ReactNode } from 'react';
import { jsx } from '@emotion/react';
import { CommonPropsAndClassName, CSSObjectWithLabel, GroupBase } from '../types';
export interface SingleValueProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** The children to be rendered. */
children: ReactNode;
/** The data of the selected option rendered in the Single Value component. */
data: Option;
/** Props passed to the wrapping element for the group. */
innerProps: JSX.IntrinsicElements['div'];
/** Whether this is disabled. */
isDisabled: boolean;
}
export declare const css: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isDisabled, theme: { spacing, colors }, }: SingleValueProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
declare const SingleValue: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: SingleValueProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export default SingleValue;

View File

@@ -0,0 +1,33 @@
/** @jsx jsx */
import { JSX, ReactNode } from 'react';
import { jsx } from '@emotion/react';
import { CommonPropsAndClassName, CSSObjectWithLabel, GroupBase } from '../types';
export interface ContainerProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** Whether the select is disabled. */
isDisabled: boolean;
isFocused: boolean;
/** The children to be rendered. */
children: ReactNode;
/** Inner props to be passed down to the container. */
innerProps: JSX.IntrinsicElements['div'];
}
export declare const containerCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isDisabled, isRtl, }: ContainerProps<Option, IsMulti, Group>) => CSSObjectWithLabel;
export declare const SelectContainer: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ContainerProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export interface ValueContainerProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** Props to be passed to the value container element. */
innerProps?: JSX.IntrinsicElements['div'];
/** The children to be rendered. */
children: ReactNode;
isDisabled: boolean;
}
export declare const valueContainerCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ theme: { spacing }, isMulti, hasValue, selectProps: { controlShouldRenderValue }, }: ValueContainerProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const ValueContainer: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ValueContainerProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export interface IndicatorsContainerProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
isDisabled: boolean;
/** The children to be rendered. */
children: ReactNode;
/** Props to be passed to the indicators container element. */
innerProps?: {};
}
export declare const indicatorsContainerCSS: () => CSSObjectWithLabel;
export declare const IndicatorsContainer: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: IndicatorsContainerProps<Option, IsMulti, Group>) => jsx.JSX.Element;

View File

@@ -0,0 +1,73 @@
import { ComponentType } from 'react';
import { ContainerProps, IndicatorsContainerProps, ValueContainerProps } from './containers';
import { ClearIndicatorProps, CrossIconProps, DownChevronProps, DropdownIndicatorProps, IndicatorSeparatorProps, LoadingIndicatorProps } from './indicators';
import { ControlProps } from './Control';
import { GroupHeadingProps, GroupProps } from './Group';
import { InputProps } from './Input';
import { MenuListProps, MenuPortalProps, MenuProps, NoticeProps } from './Menu';
import { MultiValueGenericProps, MultiValueProps, MultiValueRemove, MultiValueRemoveProps } from './MultiValue';
import { OptionProps } from './Option';
import { PlaceholderProps } from './Placeholder';
import { SingleValueProps } from './SingleValue';
import { GroupBase } from '../types';
export interface SelectComponents<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
ClearIndicator: ComponentType<ClearIndicatorProps<Option, IsMulti, Group>>;
Control: ComponentType<ControlProps<Option, IsMulti, Group>>;
DropdownIndicator: ComponentType<DropdownIndicatorProps<Option, IsMulti, Group>> | null;
DownChevron: ComponentType<DownChevronProps>;
CrossIcon: ComponentType<CrossIconProps>;
Group: ComponentType<GroupProps<Option, IsMulti, Group>>;
GroupHeading: ComponentType<GroupHeadingProps<Option, IsMulti, Group>>;
IndicatorsContainer: ComponentType<IndicatorsContainerProps<Option, IsMulti, Group>>;
IndicatorSeparator: ComponentType<IndicatorSeparatorProps<Option, IsMulti, Group>> | null;
Input: ComponentType<InputProps<Option, IsMulti, Group>>;
LoadingIndicator: ComponentType<LoadingIndicatorProps<Option, IsMulti, Group>>;
Menu: ComponentType<MenuProps<Option, IsMulti, Group>>;
MenuList: ComponentType<MenuListProps<Option, IsMulti, Group>>;
MenuPortal: ComponentType<MenuPortalProps<Option, IsMulti, Group>>;
LoadingMessage: ComponentType<NoticeProps<Option, IsMulti, Group>>;
NoOptionsMessage: ComponentType<NoticeProps<Option, IsMulti, Group>>;
MultiValue: ComponentType<MultiValueProps<Option, IsMulti, Group>>;
MultiValueContainer: ComponentType<MultiValueGenericProps<Option, IsMulti, Group>>;
MultiValueLabel: ComponentType<MultiValueGenericProps<Option, IsMulti, Group>>;
MultiValueRemove: ComponentType<MultiValueRemoveProps<Option, IsMulti, Group>>;
Option: ComponentType<OptionProps<Option, IsMulti, Group>>;
Placeholder: ComponentType<PlaceholderProps<Option, IsMulti, Group>>;
SelectContainer: ComponentType<ContainerProps<Option, IsMulti, Group>>;
SingleValue: ComponentType<SingleValueProps<Option, IsMulti, Group>>;
ValueContainer: ComponentType<ValueContainerProps<Option, IsMulti, Group>>;
}
export declare type SelectComponentsConfig<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = Partial<SelectComponents<Option, IsMulti, Group>>;
export declare const components: {
ClearIndicator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ClearIndicatorProps<Option, IsMulti, Group>) => import("@emotion/react").jsx.JSX.Element;
Control: <Option_1, IsMulti_1 extends boolean, Group_1 extends GroupBase<Option_1>>(props: ControlProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
DropdownIndicator: <Option_2, IsMulti_2 extends boolean, Group_2 extends GroupBase<Option_2>>(props: DropdownIndicatorProps<Option_2, IsMulti_2, Group_2>) => import("@emotion/react").jsx.JSX.Element;
DownChevron: (props: DownChevronProps) => import("@emotion/react").jsx.JSX.Element;
CrossIcon: (props: CrossIconProps) => import("@emotion/react").jsx.JSX.Element;
Group: <Option_3, IsMulti_3 extends boolean, Group_3 extends GroupBase<Option_3>>(props: GroupProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;
GroupHeading: <Option_4, IsMulti_4 extends boolean, Group_4 extends GroupBase<Option_4>>(props: GroupHeadingProps<Option_4, IsMulti_4, Group_4>) => import("@emotion/react").jsx.JSX.Element;
IndicatorsContainer: <Option_5, IsMulti_5 extends boolean, Group_5 extends GroupBase<Option_5>>(props: IndicatorsContainerProps<Option_5, IsMulti_5, Group_5>) => import("@emotion/react").jsx.JSX.Element;
IndicatorSeparator: <Option_6, IsMulti_6 extends boolean, Group_6 extends GroupBase<Option_6>>(props: IndicatorSeparatorProps<Option_6, IsMulti_6, Group_6>) => import("@emotion/react").jsx.JSX.Element;
Input: <Option_7, IsMulti_7 extends boolean, Group_7 extends GroupBase<Option_7>>(props: InputProps<Option_7, IsMulti_7, Group_7>) => import("@emotion/react").jsx.JSX.Element;
LoadingIndicator: <Option_8, IsMulti_8 extends boolean, Group_8 extends GroupBase<Option_8>>({ innerProps, isRtl, size, ...restProps }: LoadingIndicatorProps<Option_8, IsMulti_8, Group_8>) => import("@emotion/react").jsx.JSX.Element;
Menu: <Option_9, IsMulti_9 extends boolean, Group_9 extends GroupBase<Option_9>>(props: MenuProps<Option_9, IsMulti_9, Group_9>) => import("@emotion/react").jsx.JSX.Element;
MenuList: <Option_10, IsMulti_10 extends boolean, Group_10 extends GroupBase<Option_10>>(props: MenuListProps<Option_10, IsMulti_10, Group_10>) => import("@emotion/react").jsx.JSX.Element;
MenuPortal: <Option_11, IsMulti_11 extends boolean, Group_11 extends GroupBase<Option_11>>(props: MenuPortalProps<Option_11, IsMulti_11, Group_11>) => import("@emotion/react").jsx.JSX.Element | null;
LoadingMessage: <Option_12, IsMulti_12 extends boolean, Group_12 extends GroupBase<Option_12>>({ children, innerProps, ...restProps }: NoticeProps<Option_12, IsMulti_12, Group_12>) => import("@emotion/react").jsx.JSX.Element;
NoOptionsMessage: <Option_13, IsMulti_13 extends boolean, Group_13 extends GroupBase<Option_13>>({ children, innerProps, ...restProps }: NoticeProps<Option_13, IsMulti_13, Group_13>) => import("@emotion/react").jsx.JSX.Element;
MultiValue: <Option_14, IsMulti_14 extends boolean, Group_14 extends GroupBase<Option_14>>(props: MultiValueProps<Option_14, IsMulti_14, Group_14>) => import("@emotion/react").jsx.JSX.Element;
MultiValueContainer: <Option_15, IsMulti_15 extends boolean, Group_15 extends GroupBase<Option_15>>({ children, innerProps, }: MultiValueGenericProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
MultiValueLabel: <Option_15, IsMulti_15 extends boolean, Group_15 extends GroupBase<Option_15>>({ children, innerProps, }: MultiValueGenericProps<Option_15, IsMulti_15, Group_15>) => import("@emotion/react").jsx.JSX.Element;
MultiValueRemove: typeof MultiValueRemove;
Option: <Option_16, IsMulti_16 extends boolean, Group_16 extends GroupBase<Option_16>>(props: OptionProps<Option_16, IsMulti_16, Group_16>) => import("@emotion/react").jsx.JSX.Element;
Placeholder: <Option_17, IsMulti_17 extends boolean, Group_17 extends GroupBase<Option_17>>(props: PlaceholderProps<Option_17, IsMulti_17, Group_17>) => import("@emotion/react").jsx.JSX.Element;
SelectContainer: <Option_18, IsMulti_18 extends boolean, Group_18 extends GroupBase<Option_18>>(props: ContainerProps<Option_18, IsMulti_18, Group_18>) => import("@emotion/react").jsx.JSX.Element;
SingleValue: <Option_19, IsMulti_19 extends boolean, Group_19 extends GroupBase<Option_19>>(props: SingleValueProps<Option_19, IsMulti_19, Group_19>) => import("@emotion/react").jsx.JSX.Element;
ValueContainer: <Option_20, IsMulti_20 extends boolean, Group_20 extends GroupBase<Option_20>>(props: ValueContainerProps<Option_20, IsMulti_20, Group_20>) => import("@emotion/react").jsx.JSX.Element;
};
export declare type SelectComponentsGeneric = typeof components;
interface Props<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
components: SelectComponentsConfig<Option, IsMulti, Group>;
}
export declare const defaultComponents: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: Props<Option, IsMulti, Group>) => SelectComponentsGeneric;
export {};

View File

@@ -0,0 +1,51 @@
/** @jsx jsx */
import { JSX, ReactNode } from 'react';
import { jsx } from '@emotion/react';
import { CommonPropsAndClassName, CSSObjectWithLabel, GroupBase } from '../types';
export declare type CrossIconProps = JSX.IntrinsicElements['svg'] & {
size?: number;
};
export declare const CrossIcon: (props: CrossIconProps) => jsx.JSX.Element;
export declare type DownChevronProps = JSX.IntrinsicElements['svg'] & {
size?: number;
};
export declare const DownChevron: (props: DownChevronProps) => jsx.JSX.Element;
export interface DropdownIndicatorProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** The children to be rendered inside the indicator. */
children?: ReactNode;
/** Props that will be passed on to the children. */
innerProps: JSX.IntrinsicElements['div'];
/** The focused state of the select. */
isFocused: boolean;
isDisabled: boolean;
}
export declare const dropdownIndicatorCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isFocused, theme: { spacing: { baseUnit }, colors, }, }: DropdownIndicatorProps<Option, IsMulti, Group> | ClearIndicatorProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const DropdownIndicator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: DropdownIndicatorProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export interface ClearIndicatorProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** The children to be rendered inside the indicator. */
children?: ReactNode;
/** Props that will be passed on to the children. */
innerProps: JSX.IntrinsicElements['div'];
/** The focused state of the select. */
isFocused: boolean;
}
export declare const clearIndicatorCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isFocused, theme: { spacing: { baseUnit }, colors, }, }: DropdownIndicatorProps<Option, IsMulti, Group> | ClearIndicatorProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const ClearIndicator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ClearIndicatorProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export interface IndicatorSeparatorProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
isDisabled: boolean;
isFocused: boolean;
innerProps?: JSX.IntrinsicElements['span'];
}
export declare const indicatorSeparatorCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isDisabled, theme: { spacing: { baseUnit }, colors, }, }: IndicatorSeparatorProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export declare const IndicatorSeparator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: IndicatorSeparatorProps<Option, IsMulti, Group>) => jsx.JSX.Element;
export declare const loadingIndicatorCSS: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ isFocused, size, theme: { colors, spacing: { baseUnit }, }, }: LoadingIndicatorProps<Option, IsMulti, Group>, unstyled: boolean) => CSSObjectWithLabel;
export interface LoadingIndicatorProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> extends CommonPropsAndClassName<Option, IsMulti, Group> {
/** Props that will be passed on to the children. */
innerProps: JSX.IntrinsicElements['div'];
/** The focused state of the select. */
isFocused: boolean;
isDisabled: boolean;
/** Set size of the container. */
size: number;
}
export declare const LoadingIndicator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ innerProps, isRtl, size, ...restProps }: LoadingIndicatorProps<Option, IsMulti, Group>) => jsx.JSX.Element;

View File

@@ -0,0 +1,2 @@
export * from '../Creatable';
export { default } from '../Creatable';

View File

@@ -0,0 +1 @@
export declare const stripDiacritics: (str: string) => string;

View File

@@ -0,0 +1,14 @@
export interface FilterOptionOption<Option> {
readonly label: string;
readonly value: string;
readonly data: Option;
}
interface Config<Option> {
readonly ignoreCase?: boolean;
readonly ignoreAccents?: boolean;
readonly stringify?: (option: FilterOptionOption<Option>) => string;
readonly trim?: boolean;
readonly matchFrom?: 'any' | 'start';
}
export declare const createFilter: <Option>(config?: Config<Option> | undefined) => (option: FilterOptionOption<Option>, rawInput: string) => boolean;
export {};

View File

@@ -0,0 +1,29 @@
import Select from './Select';
import type { GroupBase } from './types';
export type { FilterOptionOption } from './filters';
import useStateManager from './useStateManager';
export { default } from './stateManager';
export { default as NonceProvider } from './NonceProvider';
export { mergeStyles } from './styles';
export { defaultTheme } from './theme';
export { createFilter } from './filters';
export { components } from './components';
export declare type SelectInstance<Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> = Select<Option, IsMulti, Group>;
export type { StateManagerProps as Props } from './useStateManager';
export { useStateManager };
export type { SelectComponentsConfig } from './components';
export type { ContainerProps, IndicatorsContainerProps, ValueContainerProps, } from './components/containers';
export type { ControlProps } from './components/Control';
export type { GroupProps, GroupHeadingProps } from './components/Group';
export type { ClearIndicatorProps, DropdownIndicatorProps, IndicatorSeparatorProps, LoadingIndicatorProps, } from './components/indicators';
export type { InputProps } from './components/Input';
export type { MenuListProps, MenuProps, NoticeProps } from './components/Menu';
export type { MultiValueGenericProps, MultiValueProps, MultiValueRemoveProps, } from './components/MultiValue';
export type { OptionProps } from './components/Option';
export type { PlaceholderProps } from './components/Placeholder';
export type { SingleValueProps } from './components/SingleValue';
export type { ThemeConfig } from './theme';
export type { ClassNamesConfig, StylesConfig } from './styles';
export * from './types';
export type { OptionContext, GuidanceContext, AriaGuidanceProps, AriaOnChangeProps, AriaOnFilterProps, AriaOnFocusProps, AriaLiveMessages, AriaGuidance, AriaOnChange, AriaOnFilter, AriaOnFocus, } from './accessibility';
export type { FormatOptionLabelContext, FormatOptionLabelMeta } from './Select';

View File

@@ -0,0 +1,5 @@
/** @jsx jsx */
import { JSX } from 'react';
import { jsx } from '@emotion/react';
declare const A11yText: (props: JSX.IntrinsicElements['span']) => jsx.JSX.Element;
export default A11yText;

View File

@@ -0,0 +1,6 @@
/** @jsx jsx */
import { JSX, Ref } from 'react';
import { jsx } from '@emotion/react';
export default function DummyInput({ innerRef, ...props }: JSX.IntrinsicElements['input'] & {
readonly innerRef: Ref<HTMLInputElement>;
}): jsx.JSX.Element;

View File

@@ -0,0 +1,7 @@
/** @jsx jsx */
import { FocusEventHandler, FunctionComponent } from 'react';
declare const RequiredInput: FunctionComponent<{
readonly name?: string;
readonly onFocus: FocusEventHandler<HTMLInputElement>;
}>;
export default RequiredInput;

View File

@@ -0,0 +1,14 @@
/** @jsx jsx */
import { jsx } from '@emotion/react';
import { ReactElement, RefCallback } from 'react';
interface Props {
readonly children: (ref: RefCallback<HTMLElement>) => ReactElement;
readonly lockEnabled: boolean;
readonly captureEnabled: boolean;
readonly onBottomArrive?: (event: WheelEvent | TouchEvent) => void;
readonly onBottomLeave?: (event: WheelEvent | TouchEvent) => void;
readonly onTopArrive?: (event: WheelEvent | TouchEvent) => void;
readonly onTopLeave?: (event: WheelEvent | TouchEvent) => void;
}
export default function ScrollManager({ children, lockEnabled, captureEnabled, onBottomArrive, onBottomLeave, onTopArrive, onTopLeave, }: Props): jsx.JSX.Element;
export {};

View File

@@ -0,0 +1,4 @@
export { default as A11yText } from './A11yText';
export { default as DummyInput } from './DummyInput';
export { default as ScrollManager } from './ScrollManager';
export { default as RequiredInput } from './RequiredInput';

View File

@@ -0,0 +1,9 @@
interface Options {
readonly isEnabled: boolean;
readonly onBottomArrive?: (event: WheelEvent | TouchEvent) => void;
readonly onBottomLeave?: (event: WheelEvent | TouchEvent) => void;
readonly onTopArrive?: (event: WheelEvent | TouchEvent) => void;
readonly onTopLeave?: (event: WheelEvent | TouchEvent) => void;
}
export default function useScrollCapture({ isEnabled, onBottomArrive, onBottomLeave, onTopArrive, onTopLeave, }: Options): (element: HTMLElement | null) => void;
export {};

View File

@@ -0,0 +1,6 @@
interface Options {
readonly isEnabled: boolean;
readonly accountForScrollbars?: boolean;
}
export default function useScrollLock({ isEnabled, accountForScrollbars, }: Options): (element: HTMLElement | null) => void;
export {};

View File

@@ -0,0 +1,8 @@
import { ReactElement, RefAttributes } from 'react';
import { GroupBase } from './types';
import Select from './Select';
import type { StateManagerProps } from './useStateManager';
export type { StateManagerProps };
declare type StateManagedSelect = <Option = unknown, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: StateManagerProps<Option, IsMulti, Group> & RefAttributes<Select<Option, IsMulti, Group>>) => ReactElement;
declare const StateManagedSelect: StateManagedSelect;
export default StateManagedSelect;

View File

@@ -0,0 +1,68 @@
import { ContainerProps, IndicatorsContainerProps, ValueContainerProps } from './components/containers';
import { ControlProps } from './components/Control';
import { GroupHeadingProps, GroupProps } from './components/Group';
import { ClearIndicatorProps, DropdownIndicatorProps, IndicatorSeparatorProps, LoadingIndicatorProps } from './components/indicators';
import { InputProps } from './components/Input';
import { PlaceholderProps } from './components/Placeholder';
import { OptionProps } from './components/Option';
import { NoticeProps, MenuProps, MenuListProps, PortalStyleArgs } from './components/Menu';
import { SingleValueProps } from './components/SingleValue';
import { MultiValueProps } from './components/MultiValue';
import { CSSObjectWithLabel, GroupBase } from './types';
export interface StylesProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
clearIndicator: ClearIndicatorProps<Option, IsMulti, Group>;
container: ContainerProps<Option, IsMulti, Group>;
control: ControlProps<Option, IsMulti, Group>;
dropdownIndicator: DropdownIndicatorProps<Option, IsMulti, Group>;
group: GroupProps<Option, IsMulti, Group>;
groupHeading: GroupHeadingProps<Option, IsMulti, Group>;
indicatorsContainer: IndicatorsContainerProps<Option, IsMulti, Group>;
indicatorSeparator: IndicatorSeparatorProps<Option, IsMulti, Group>;
input: InputProps<Option, IsMulti, Group>;
loadingIndicator: LoadingIndicatorProps<Option, IsMulti, Group>;
loadingMessage: NoticeProps<Option, IsMulti, Group>;
menu: MenuProps<Option, IsMulti, Group>;
menuList: MenuListProps<Option, IsMulti, Group>;
menuPortal: PortalStyleArgs;
multiValue: MultiValueProps<Option, IsMulti, Group>;
multiValueLabel: MultiValueProps<Option, IsMulti, Group>;
multiValueRemove: MultiValueProps<Option, IsMulti, Group>;
noOptionsMessage: NoticeProps<Option, IsMulti, Group>;
option: OptionProps<Option, IsMulti, Group>;
placeholder: PlaceholderProps<Option, IsMulti, Group>;
singleValue: SingleValueProps<Option, IsMulti, Group>;
valueContainer: ValueContainerProps<Option, IsMulti, Group>;
}
export declare const defaultStyles: {
[K in keyof StylesProps<any, any, any>]: (props: StylesProps<unknown, boolean, GroupBase<unknown>>[K], unstyled: boolean) => CSSObjectWithLabel;
};
export declare type StylesConfig<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> = {
[K in keyof StylesProps<Option, IsMulti, Group>]?: (base: CSSObjectWithLabel, props: StylesProps<Option, IsMulti, Group>[K]) => CSSObjectWithLabel;
};
export declare type ClassNamesConfig<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> = {
[K in keyof StylesProps<Option, IsMulti, Group>]?: (props: StylesProps<Option, IsMulti, Group>[K]) => string;
};
export declare function mergeStyles<Option, IsMulti extends boolean, Group extends GroupBase<Option>>(source: StylesConfig<Option, IsMulti, Group>, target?: StylesConfig<Option, IsMulti, Group>): {
clearIndicator?: ((base: CSSObjectWithLabel, props: ClearIndicatorProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
container?: ((base: CSSObjectWithLabel, props: ContainerProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
control?: ((base: CSSObjectWithLabel, props: ControlProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
dropdownIndicator?: ((base: CSSObjectWithLabel, props: DropdownIndicatorProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
group?: ((base: CSSObjectWithLabel, props: GroupProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
groupHeading?: ((base: CSSObjectWithLabel, props: GroupHeadingProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
indicatorsContainer?: ((base: CSSObjectWithLabel, props: IndicatorsContainerProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
indicatorSeparator?: ((base: CSSObjectWithLabel, props: IndicatorSeparatorProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
input?: ((base: CSSObjectWithLabel, props: InputProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
loadingIndicator?: ((base: CSSObjectWithLabel, props: LoadingIndicatorProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
loadingMessage?: ((base: CSSObjectWithLabel, props: NoticeProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
menu?: ((base: CSSObjectWithLabel, props: MenuProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
menuList?: ((base: CSSObjectWithLabel, props: MenuListProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
menuPortal?: ((base: CSSObjectWithLabel, props: PortalStyleArgs) => CSSObjectWithLabel) | undefined;
multiValue?: ((base: CSSObjectWithLabel, props: MultiValueProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
multiValueLabel?: ((base: CSSObjectWithLabel, props: MultiValueProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
multiValueRemove?: ((base: CSSObjectWithLabel, props: MultiValueProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
noOptionsMessage?: ((base: CSSObjectWithLabel, props: NoticeProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
option?: ((base: CSSObjectWithLabel, props: OptionProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
placeholder?: ((base: CSSObjectWithLabel, props: PlaceholderProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
singleValue?: ((base: CSSObjectWithLabel, props: SingleValueProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
valueContainer?: ((base: CSSObjectWithLabel, props: ValueContainerProps<Option, IsMulti, Group>) => CSSObjectWithLabel) | undefined;
};

View File

@@ -0,0 +1,27 @@
import { Theme } from './types';
export declare const colors: {
primary: string;
primary75: string;
primary50: string;
primary25: string;
danger: string;
dangerLight: string;
neutral0: string;
neutral5: string;
neutral10: string;
neutral20: string;
neutral30: string;
neutral40: string;
neutral50: string;
neutral60: string;
neutral70: string;
neutral80: string;
neutral90: string;
};
export declare const spacing: {
baseUnit: number;
controlHeight: number;
menuGutter: number;
};
export declare const defaultTheme: Theme;
export declare type ThemeConfig = Theme | ((theme: Theme) => Theme);

View File

@@ -0,0 +1,128 @@
import { CSSObject } from '@emotion/react';
import { Props } from './Select';
import { StylesProps } from './styles';
export interface GroupBase<Option> {
readonly options: readonly Option[];
readonly label?: string;
}
export declare type OptionsOrGroups<Option, Group extends GroupBase<Option>> = readonly (Option | Group)[];
export declare type Options<Option> = readonly Option[];
export declare type SingleValue<Option> = Option | null;
export declare type MultiValue<Option> = readonly Option[];
export declare type PropsValue<Option> = MultiValue<Option> | SingleValue<Option>;
export declare type OnChangeValue<Option, IsMulti extends boolean> = IsMulti extends true ? MultiValue<Option> : SingleValue<Option>;
export interface Colors {
primary: string;
primary75: string;
primary50: string;
primary25: string;
danger: string;
dangerLight: string;
neutral0: string;
neutral5: string;
neutral10: string;
neutral20: string;
neutral30: string;
neutral40: string;
neutral50: string;
neutral60: string;
neutral70: string;
neutral80: string;
neutral90: string;
}
export interface ThemeSpacing {
baseUnit: number;
controlHeight: number;
menuGutter: number;
}
export interface Theme {
borderRadius: number;
colors: Colors;
spacing: ThemeSpacing;
}
export declare type ClassNamesState = {
[key: string]: boolean;
};
export declare type CX = (state: ClassNamesState, ...classNames: (string | undefined)[]) => string;
export declare type GetStyles<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = <Key extends keyof StylesProps<Option, IsMulti, Group>>(propertyName: Key, props: StylesProps<Option, IsMulti, Group>[Key]) => CSSObjectWithLabel;
export interface CommonProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {
clearValue: () => void;
cx: CX;
/**
Get the styles of a particular part of the select. Pass in the name of the
property as the first argument, and the current props as the second argument.
See the `styles` object for the properties available.
*/
getStyles: GetStyles<Option, IsMulti, Group>;
getClassNames: <Key extends keyof StylesProps<Option, IsMulti, Group>>(propertyName: Key, props: StylesProps<Option, IsMulti, Group>[Key]) => string | undefined;
getValue: () => Options<Option>;
hasValue: boolean;
isMulti: boolean;
isRtl: boolean;
options: OptionsOrGroups<Option, Group>;
selectOption: (newValue: Option) => void;
selectProps: Props<Option, IsMulti, Group>;
setValue: (newValue: OnChangeValue<Option, IsMulti>, action: SetValueAction, option?: Option) => void;
theme: Theme;
}
export interface CommonPropsAndClassName<Option, IsMulti extends boolean, Group extends GroupBase<Option>> extends CommonProps<Option, IsMulti, Group> {
className?: string | undefined;
}
export interface ActionMetaBase<Option> {
option?: Option | undefined;
removedValue?: Option;
removedValues?: Options<Option>;
name?: string;
}
export interface SelectOptionActionMeta<Option> extends ActionMetaBase<Option> {
action: 'select-option';
option: Option | undefined;
name?: string;
}
export interface DeselectOptionActionMeta<Option> extends ActionMetaBase<Option> {
action: 'deselect-option';
option: Option | undefined;
name?: string;
}
export interface RemoveValueActionMeta<Option> extends ActionMetaBase<Option> {
action: 'remove-value';
removedValue: Option;
name?: string;
}
export interface PopValueActionMeta<Option> extends ActionMetaBase<Option> {
action: 'pop-value';
removedValue: Option;
name?: string;
}
export interface ClearActionMeta<Option> extends ActionMetaBase<Option> {
action: 'clear';
removedValues: Options<Option>;
name?: string;
}
export interface CreateOptionActionMeta<Option> extends ActionMetaBase<Option> {
action: 'create-option';
name?: string;
option: Option;
}
export interface InitialInputFocusedActionMeta<Option, IsMulti extends boolean> extends ActionMetaBase<Option> {
action: 'initial-input-focus';
value: OnChangeValue<Option, IsMulti>;
options?: Options<Option>;
}
export declare type ActionMeta<Option> = SelectOptionActionMeta<Option> | DeselectOptionActionMeta<Option> | RemoveValueActionMeta<Option> | PopValueActionMeta<Option> | ClearActionMeta<Option> | CreateOptionActionMeta<Option>;
export declare type SetValueAction = 'select-option' | 'deselect-option';
export declare type InputAction = 'set-value' | 'input-change' | 'input-blur' | 'menu-close';
export interface InputActionMeta {
action: InputAction;
/** The previous value of the search input. */
prevInputValue: string;
}
export declare type MenuPlacement = 'auto' | 'bottom' | 'top';
export declare type CoercedMenuPlacement = 'bottom' | 'top';
export declare type MenuPosition = 'absolute' | 'fixed';
export declare type FocusDirection = 'up' | 'down' | 'pageup' | 'pagedown' | 'first' | 'last';
export declare type GetOptionLabel<Option> = (option: Option) => string;
export declare type GetOptionValue<Option> = (option: Option) => string;
export declare type CSSObjectWithLabel = CSSObject & {
label?: string;
};

View File

@@ -0,0 +1,28 @@
import { StateManagerProps } from './useStateManager';
import { GroupBase, OptionsOrGroups } from './types';
declare type AsyncManagedPropKeys = 'options' | 'isLoading' | 'onInputChange' | 'filterOption';
export interface AsyncAdditionalProps<Option, Group extends GroupBase<Option>> {
/**
* The default set of options to show before the user starts searching. When
* set to `true`, the results for loadOptions('') will be autoloaded.
*/
defaultOptions?: OptionsOrGroups<Option, Group> | boolean;
/**
* If cacheOptions is truthy, then the loaded data will be cached. The cache
* will remain until `cacheOptions` changes value.
*/
cacheOptions?: any;
/**
* Function that returns a promise, which is the set of options to be used
* once the promise resolves.
*/
loadOptions?: (inputValue: string, callback: (options: OptionsOrGroups<Option, Group>) => void) => Promise<OptionsOrGroups<Option, Group>> | void;
/**
* Will cause the select to be displayed in the loading state, even if the
* Async select is not currently waiting for loadOptions to resolve
*/
isLoading?: boolean;
}
export declare type AsyncProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = StateManagerProps<Option, IsMulti, Group> & AsyncAdditionalProps<Option, Group>;
export default function useAsync<Option, IsMulti extends boolean, Group extends GroupBase<Option>, AdditionalProps>({ defaultOptions: propsDefaultOptions, cacheOptions, loadOptions: propsLoadOptions, options: propsOptions, isLoading: propsIsLoading, onInputChange: propsOnInputChange, filterOption, ...restSelectProps }: AsyncProps<Option, IsMulti, Group> & AdditionalProps): StateManagerProps<Option, IsMulti, Group> & Omit<AdditionalProps, keyof AsyncAdditionalProps<Option, Group> | AsyncManagedPropKeys>;
export {};

View File

@@ -0,0 +1,41 @@
import { ReactNode } from 'react';
import { PublicBaseSelectProps } from './Select';
import { GetOptionLabel, GetOptionValue, GroupBase, Options, OptionsOrGroups } from './types';
export interface Accessors<Option> {
getOptionValue: GetOptionValue<Option>;
getOptionLabel: GetOptionLabel<Option>;
}
export interface CreatableAdditionalProps<Option, Group extends GroupBase<Option>> {
/**
* Allow options to be created while the `isLoading` prop is true. Useful to
* prevent the "create new ..." option being displayed while async results are
* still being loaded.
*/
allowCreateWhileLoading?: boolean;
/** Sets the position of the createOption element in your options list. Defaults to 'last' */
createOptionPosition?: 'first' | 'last';
/**
* Gets the label for the "create new ..." option in the menu. Is given the
* current input value.
*/
formatCreateLabel?: (inputValue: string) => ReactNode;
/**
* Determines whether the "create new ..." option should be displayed based on
* the current input value, select value and options array.
*/
isValidNewOption?: (inputValue: string, value: Options<Option>, options: OptionsOrGroups<Option, Group>, accessors: Accessors<Option>) => boolean;
/**
* Returns the data for the new option when it is created. Used to display the
* value, and is passed to `onChange`.
*/
getNewOptionData?: (inputValue: string, optionLabel: ReactNode) => Option;
/**
* If provided, this will be called with the input value when a new option is
* created, and `onChange` will **not** be called. Use this when you need more
* control over what happens when new options are created.
*/
onCreateOption?: (inputValue: string) => void;
}
declare type BaseCreatableProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = PublicBaseSelectProps<Option, IsMulti, Group> & CreatableAdditionalProps<Option, Group>;
export default function useCreatable<Option, IsMulti extends boolean, Group extends GroupBase<Option>>({ allowCreateWhileLoading, createOptionPosition, formatCreateLabel, isValidNewOption, getNewOptionData, onCreateOption, options: propsOptions, onChange: propsOnChange, ...restSelectProps }: BaseCreatableProps<Option, IsMulti, Group>): PublicBaseSelectProps<Option, IsMulti, Group>;
export {};

View File

@@ -0,0 +1,12 @@
import { GroupBase, PropsValue } from './types';
import { PublicBaseSelectProps } from './Select';
declare type StateManagedPropKeys = 'inputValue' | 'menuIsOpen' | 'onChange' | 'onInputChange' | 'onMenuClose' | 'onMenuOpen' | 'value';
declare type SelectPropsWithOptionalStateManagedProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = Omit<PublicBaseSelectProps<Option, IsMulti, Group>, StateManagedPropKeys> & Partial<PublicBaseSelectProps<Option, IsMulti, Group>>;
export interface StateManagerAdditionalProps<Option> {
defaultInputValue?: string;
defaultMenuIsOpen?: boolean;
defaultValue?: PropsValue<Option>;
}
export declare type StateManagerProps<Option = unknown, IsMulti extends boolean = boolean, Group extends GroupBase<Option> = GroupBase<Option>> = SelectPropsWithOptionalStateManagedProps<Option, IsMulti, Group> & StateManagerAdditionalProps<Option>;
export default function useStateManager<Option, IsMulti extends boolean, Group extends GroupBase<Option>, AdditionalProps>({ defaultInputValue, defaultMenuIsOpen, defaultValue, inputValue: propsInputValue, menuIsOpen: propsMenuIsOpen, onChange: propsOnChange, onInputChange: propsOnInputChange, onMenuClose: propsOnMenuClose, onMenuOpen: propsOnMenuOpen, value: propsValue, ...restSelectProps }: StateManagerProps<Option, IsMulti, Group> & AdditionalProps): PublicBaseSelectProps<Option, IsMulti, Group> & Omit<AdditionalProps, keyof StateManagerAdditionalProps<Option> | StateManagedPropKeys>;
export {};

View File

@@ -0,0 +1,44 @@
import type { StylesProps } from './styles';
import type { ClassNamesState, CommonPropsAndClassName, GroupBase, InputActionMeta, MultiValue, OnChangeValue, Options, PropsValue, SingleValue } from './types';
export declare const noop: () => void;
export declare const emptyString: () => string;
export declare function classNames(prefix?: string | null, state?: ClassNamesState, ...classNameList: string[]): string;
export declare const cleanValue: <Option>(value: PropsValue<Option>) => Options<Option>;
export declare const cleanCommonProps: <Option, IsMulti extends boolean, Group extends GroupBase<Option>, AdditionalProps>(props: Partial<CommonPropsAndClassName<Option, IsMulti, Group>> & AdditionalProps) => Omit<AdditionalProps, keyof CommonPropsAndClassName<Option, IsMulti, Group>>;
export declare const getStyleProps: <Option, IsMulti extends boolean, Group extends GroupBase<Option>, Key extends keyof StylesProps<Option, IsMulti, Group>>(props: Pick<CommonPropsAndClassName<Option, IsMulti, Group>, "className" | "cx" | "getStyles" | "getClassNames"> & StylesProps<Option, IsMulti, Group>[Key], name: Key, classNamesState?: ClassNamesState | undefined) => {
css: import("./types").CSSObjectWithLabel;
className: string;
};
export declare function handleInputChange(inputValue: string, actionMeta: InputActionMeta, onInputChange?: (newValue: string, actionMeta: InputActionMeta) => string | void): string;
export declare function isDocumentElement(el: HTMLElement | typeof window): el is typeof window;
export declare function normalizedHeight(el: HTMLElement | typeof window): number;
export declare function getScrollTop(el: HTMLElement | typeof window): number;
export declare function scrollTo(el: HTMLElement | typeof window, top: number): void;
export declare function getScrollParent(element: HTMLElement): HTMLElement;
export declare function animatedScrollTo(element: HTMLElement | typeof window, to: number, duration?: number, callback?: (element: HTMLElement | typeof window) => void): void;
export declare function scrollIntoView(menuEl: HTMLElement, focusedEl: HTMLElement): void;
export declare function getBoundingClientObj(element: HTMLElement): {
bottom: number;
height: number;
left: number;
right: number;
top: number;
width: number;
};
export interface RectType {
left: number;
right: number;
bottom: number;
height: number;
width: number;
}
export declare function toKey(str: string): string;
export declare function isTouchCapable(): boolean;
export declare function isMobileDevice(): boolean;
export declare const supportsPassiveEvents: boolean;
export declare function notNullish<T>(item: T | null | undefined): item is T;
export declare function isArray<T>(arg: unknown): arg is readonly T[];
export declare function valueTernary<Option, IsMulti extends boolean>(isMulti: IsMulti | undefined, multiValue: MultiValue<Option>, singleValue: SingleValue<Option>): OnChangeValue<Option, IsMulti>;
export declare function singleValueAsValue<Option, IsMulti extends boolean>(singleValue: SingleValue<Option>): OnChangeValue<Option, IsMulti>;
export declare function multiValueAsValue<Option, IsMulti extends boolean>(multiValue: MultiValue<Option>): OnChangeValue<Option, IsMulti>;
export declare const removeProps: <Props extends object, K extends string[]>(propsObj: Props, ...properties: K) => Omit<Props, K[number]>;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,3 @@
export * from "./declarations/src/index.js";
export { _default as default } from "./react-select.cjs.default.js";
//# sourceMappingURL=react-select.cjs.d.mts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"react-select.cjs.d.mts","sourceRoot":"","sources":["./declarations/src/index.d.ts"],"names":[],"mappings":"AAAA"}

View File

@@ -0,0 +1,3 @@
export * from "./declarations/src/index";
export { default } from "./declarations/src/index";
//# sourceMappingURL=react-select.cjs.d.ts.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"react-select.cjs.d.ts","sourceRoot":"","sources":["./declarations/src/index.d.ts"],"names":[],"mappings":"AAAA"}

View File

@@ -0,0 +1 @@
export { default as _default } from "./declarations/src/index.js"

View File

@@ -0,0 +1 @@
exports._default = require("./react-select.cjs.js").default;

View File

@@ -0,0 +1,80 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var useStateManager = require('./useStateManager-7748b351.cjs.dev.js');
var _extends = require('@babel/runtime/helpers/extends');
var React = require('react');
var Select = require('./Select-1b9abbe3.cjs.dev.js');
var react = require('@emotion/react');
var createCache = require('@emotion/cache');
var index = require('./index-42b266b1.cjs.dev.js');
require('@babel/runtime/helpers/objectSpread2');
require('@babel/runtime/helpers/slicedToArray');
require('@babel/runtime/helpers/objectWithoutProperties');
require('@babel/runtime/helpers/classCallCheck');
require('@babel/runtime/helpers/createClass');
require('@babel/runtime/helpers/inherits');
require('@babel/runtime/helpers/createSuper');
require('@babel/runtime/helpers/toConsumableArray');
require('memoize-one');
require('@babel/runtime/helpers/typeof');
require('@babel/runtime/helpers/taggedTemplateLiteral');
require('@babel/runtime/helpers/defineProperty');
require('react-dom');
require('@floating-ui/dom');
require('use-isomorphic-layout-effect');
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
function _interopNamespace(e) {
if (e && e.__esModule) return e;
var n = Object.create(null);
if (e) {
Object.keys(e).forEach(function (k) {
if (k !== 'default') {
var d = Object.getOwnPropertyDescriptor(e, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function () { return e[k]; }
});
}
});
}
n["default"] = e;
return Object.freeze(n);
}
var React__namespace = /*#__PURE__*/_interopNamespace(React);
var createCache__default = /*#__PURE__*/_interopDefault(createCache);
var StateManagedSelect = /*#__PURE__*/React.forwardRef(function (props, ref) {
var baseSelectProps = useStateManager.useStateManager(props);
return /*#__PURE__*/React__namespace.createElement(Select.Select, _extends({
ref: ref
}, baseSelectProps));
});
var StateManagedSelect$1 = StateManagedSelect;
var NonceProvider = (function (_ref) {
var nonce = _ref.nonce,
children = _ref.children,
cacheKey = _ref.cacheKey;
var emotionCache = React.useMemo(function () {
return createCache__default["default"]({
key: cacheKey,
nonce: nonce
});
}, [cacheKey, nonce]);
return /*#__PURE__*/React__namespace.createElement(react.CacheProvider, {
value: emotionCache
}, children);
});
exports.useStateManager = useStateManager.useStateManager;
exports.createFilter = Select.createFilter;
exports.defaultTheme = Select.defaultTheme;
exports.mergeStyles = Select.mergeStyles;
exports.components = index.components;
exports.NonceProvider = NonceProvider;
exports["default"] = StateManagedSelect$1;

View File

@@ -0,0 +1,7 @@
'use strict';
if (process.env.NODE_ENV === "production") {
module.exports = require("./react-select.cjs.prod.js");
} else {
module.exports = require("./react-select.cjs.dev.js");
}

View File

@@ -0,0 +1,9 @@
export {
NonceProvider,
components,
createFilter,
defaultTheme,
mergeStyles,
useStateManager
} from "./react-select.cjs.js";
export { _default as default } from "./react-select.cjs.default.js";

View File

@@ -0,0 +1,80 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var useStateManager = require('./useStateManager-ce23061c.cjs.prod.js');
var _extends = require('@babel/runtime/helpers/extends');
var React = require('react');
var Select = require('./Select-8685a2b1.cjs.prod.js');
var react = require('@emotion/react');
var createCache = require('@emotion/cache');
var index = require('./index-665c4ed8.cjs.prod.js');
require('@babel/runtime/helpers/objectSpread2');
require('@babel/runtime/helpers/slicedToArray');
require('@babel/runtime/helpers/objectWithoutProperties');
require('@babel/runtime/helpers/classCallCheck');
require('@babel/runtime/helpers/createClass');
require('@babel/runtime/helpers/inherits');
require('@babel/runtime/helpers/createSuper');
require('@babel/runtime/helpers/toConsumableArray');
require('memoize-one');
require('@babel/runtime/helpers/typeof');
require('@babel/runtime/helpers/taggedTemplateLiteral');
require('@babel/runtime/helpers/defineProperty');
require('react-dom');
require('@floating-ui/dom');
require('use-isomorphic-layout-effect');
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
function _interopNamespace(e) {
if (e && e.__esModule) return e;
var n = Object.create(null);
if (e) {
Object.keys(e).forEach(function (k) {
if (k !== 'default') {
var d = Object.getOwnPropertyDescriptor(e, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function () { return e[k]; }
});
}
});
}
n["default"] = e;
return Object.freeze(n);
}
var React__namespace = /*#__PURE__*/_interopNamespace(React);
var createCache__default = /*#__PURE__*/_interopDefault(createCache);
var StateManagedSelect = /*#__PURE__*/React.forwardRef(function (props, ref) {
var baseSelectProps = useStateManager.useStateManager(props);
return /*#__PURE__*/React__namespace.createElement(Select.Select, _extends({
ref: ref
}, baseSelectProps));
});
var StateManagedSelect$1 = StateManagedSelect;
var NonceProvider = (function (_ref) {
var nonce = _ref.nonce,
children = _ref.children,
cacheKey = _ref.cacheKey;
var emotionCache = React.useMemo(function () {
return createCache__default["default"]({
key: cacheKey,
nonce: nonce
});
}, [cacheKey, nonce]);
return /*#__PURE__*/React__namespace.createElement(react.CacheProvider, {
value: emotionCache
}, children);
});
exports.useStateManager = useStateManager.useStateManager;
exports.createFilter = Select.createFilter;
exports.defaultTheme = Select.defaultTheme;
exports.mergeStyles = Select.mergeStyles;
exports.components = index.components;
exports.NonceProvider = NonceProvider;
exports["default"] = StateManagedSelect$1;

View File

@@ -0,0 +1,50 @@
import { u as useStateManager } from './useStateManager-7e1e8489.esm.js';
export { u as useStateManager } from './useStateManager-7e1e8489.esm.js';
import _extends from '@babel/runtime/helpers/esm/extends';
import * as React from 'react';
import { forwardRef, useMemo } from 'react';
import { S as Select } from './Select-ef7c0426.esm.js';
export { c as createFilter, d as defaultTheme, m as mergeStyles } from './Select-ef7c0426.esm.js';
import { CacheProvider } from '@emotion/react';
import createCache from '@emotion/cache';
export { c as components } from './index-641ee5b8.esm.js';
import '@babel/runtime/helpers/objectSpread2';
import '@babel/runtime/helpers/slicedToArray';
import '@babel/runtime/helpers/objectWithoutProperties';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import '@babel/runtime/helpers/inherits';
import '@babel/runtime/helpers/createSuper';
import '@babel/runtime/helpers/toConsumableArray';
import 'memoize-one';
import '@babel/runtime/helpers/typeof';
import '@babel/runtime/helpers/taggedTemplateLiteral';
import '@babel/runtime/helpers/defineProperty';
import 'react-dom';
import '@floating-ui/dom';
import 'use-isomorphic-layout-effect';
var StateManagedSelect = /*#__PURE__*/forwardRef(function (props, ref) {
var baseSelectProps = useStateManager(props);
return /*#__PURE__*/React.createElement(Select, _extends({
ref: ref
}, baseSelectProps));
});
var StateManagedSelect$1 = StateManagedSelect;
var NonceProvider = (function (_ref) {
var nonce = _ref.nonce,
children = _ref.children,
cacheKey = _ref.cacheKey;
var emotionCache = useMemo(function () {
return createCache({
key: cacheKey,
nonce: nonce
});
}, [cacheKey, nonce]);
return /*#__PURE__*/React.createElement(CacheProvider, {
value: emotionCache
}, children);
});
export { NonceProvider, StateManagedSelect$1 as default };

View File

@@ -0,0 +1,141 @@
'use strict';
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var index = require('./index-42b266b1.cjs.dev.js');
var _excluded = ["defaultOptions", "cacheOptions", "loadOptions", "options", "isLoading", "onInputChange", "filterOption"];
function useAsync(_ref) {
var _ref$defaultOptions = _ref.defaultOptions,
propsDefaultOptions = _ref$defaultOptions === void 0 ? false : _ref$defaultOptions,
_ref$cacheOptions = _ref.cacheOptions,
cacheOptions = _ref$cacheOptions === void 0 ? false : _ref$cacheOptions,
propsLoadOptions = _ref.loadOptions;
_ref.options;
var _ref$isLoading = _ref.isLoading,
propsIsLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
propsOnInputChange = _ref.onInputChange,
_ref$filterOption = _ref.filterOption,
filterOption = _ref$filterOption === void 0 ? null : _ref$filterOption,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var propsInputValue = restSelectProps.inputValue;
var lastRequest = React.useRef(undefined);
var mounted = React.useRef(false);
var _useState = React.useState(Array.isArray(propsDefaultOptions) ? propsDefaultOptions : undefined),
_useState2 = _slicedToArray(_useState, 2),
defaultOptions = _useState2[0],
setDefaultOptions = _useState2[1];
var _useState3 = React.useState(typeof propsInputValue !== 'undefined' ? propsInputValue : ''),
_useState4 = _slicedToArray(_useState3, 2),
stateInputValue = _useState4[0],
setStateInputValue = _useState4[1];
var _useState5 = React.useState(propsDefaultOptions === true),
_useState6 = _slicedToArray(_useState5, 2),
isLoading = _useState6[0],
setIsLoading = _useState6[1];
var _useState7 = React.useState(undefined),
_useState8 = _slicedToArray(_useState7, 2),
loadedInputValue = _useState8[0],
setLoadedInputValue = _useState8[1];
var _useState9 = React.useState([]),
_useState10 = _slicedToArray(_useState9, 2),
loadedOptions = _useState10[0],
setLoadedOptions = _useState10[1];
var _useState11 = React.useState(false),
_useState12 = _slicedToArray(_useState11, 2),
passEmptyOptions = _useState12[0],
setPassEmptyOptions = _useState12[1];
var _useState13 = React.useState({}),
_useState14 = _slicedToArray(_useState13, 2),
optionsCache = _useState14[0],
setOptionsCache = _useState14[1];
var _useState15 = React.useState(undefined),
_useState16 = _slicedToArray(_useState15, 2),
prevDefaultOptions = _useState16[0],
setPrevDefaultOptions = _useState16[1];
var _useState17 = React.useState(undefined),
_useState18 = _slicedToArray(_useState17, 2),
prevCacheOptions = _useState18[0],
setPrevCacheOptions = _useState18[1];
if (cacheOptions !== prevCacheOptions) {
setOptionsCache({});
setPrevCacheOptions(cacheOptions);
}
if (propsDefaultOptions !== prevDefaultOptions) {
setDefaultOptions(Array.isArray(propsDefaultOptions) ? propsDefaultOptions : undefined);
setPrevDefaultOptions(propsDefaultOptions);
}
React.useEffect(function () {
mounted.current = true;
return function () {
mounted.current = false;
};
}, []);
var loadOptions = React.useCallback(function (inputValue, callback) {
if (!propsLoadOptions) return callback();
var loader = propsLoadOptions(inputValue, callback);
if (loader && typeof loader.then === 'function') {
loader.then(callback, function () {
return callback();
});
}
}, [propsLoadOptions]);
React.useEffect(function () {
if (propsDefaultOptions === true) {
loadOptions(stateInputValue, function (options) {
if (!mounted.current) return;
setDefaultOptions(options || []);
setIsLoading(!!lastRequest.current);
});
}
// NOTE: this effect is designed to only run when the component mounts,
// so we don't want to include any hook dependencies
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
var onInputChange = React.useCallback(function (newValue, actionMeta) {
var inputValue = index.handleInputChange(newValue, actionMeta, propsOnInputChange);
if (!inputValue) {
lastRequest.current = undefined;
setStateInputValue('');
setLoadedInputValue('');
setLoadedOptions([]);
setIsLoading(false);
setPassEmptyOptions(false);
return;
}
if (cacheOptions && optionsCache[inputValue]) {
setStateInputValue(inputValue);
setLoadedInputValue(inputValue);
setLoadedOptions(optionsCache[inputValue]);
setIsLoading(false);
setPassEmptyOptions(false);
} else {
var request = lastRequest.current = {};
setStateInputValue(inputValue);
setIsLoading(true);
setPassEmptyOptions(!loadedInputValue);
loadOptions(inputValue, function (options) {
if (!mounted) return;
if (request !== lastRequest.current) return;
lastRequest.current = undefined;
setIsLoading(false);
setLoadedInputValue(inputValue);
setLoadedOptions(options || []);
setPassEmptyOptions(false);
setOptionsCache(options ? _objectSpread(_objectSpread({}, optionsCache), {}, _defineProperty({}, inputValue, options)) : optionsCache);
});
}
}, [cacheOptions, loadOptions, loadedInputValue, optionsCache, propsOnInputChange]);
var options = passEmptyOptions ? [] : stateInputValue && loadedInputValue ? loadedOptions : defaultOptions || [];
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
options: options,
isLoading: isLoading || propsIsLoading,
onInputChange: onInputChange,
filterOption: filterOption
});
}
exports.useAsync = useAsync;

View File

@@ -0,0 +1,141 @@
'use strict';
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var index = require('./index-665c4ed8.cjs.prod.js');
var _excluded = ["defaultOptions", "cacheOptions", "loadOptions", "options", "isLoading", "onInputChange", "filterOption"];
function useAsync(_ref) {
var _ref$defaultOptions = _ref.defaultOptions,
propsDefaultOptions = _ref$defaultOptions === void 0 ? false : _ref$defaultOptions,
_ref$cacheOptions = _ref.cacheOptions,
cacheOptions = _ref$cacheOptions === void 0 ? false : _ref$cacheOptions,
propsLoadOptions = _ref.loadOptions;
_ref.options;
var _ref$isLoading = _ref.isLoading,
propsIsLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
propsOnInputChange = _ref.onInputChange,
_ref$filterOption = _ref.filterOption,
filterOption = _ref$filterOption === void 0 ? null : _ref$filterOption,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var propsInputValue = restSelectProps.inputValue;
var lastRequest = React.useRef(undefined);
var mounted = React.useRef(false);
var _useState = React.useState(Array.isArray(propsDefaultOptions) ? propsDefaultOptions : undefined),
_useState2 = _slicedToArray(_useState, 2),
defaultOptions = _useState2[0],
setDefaultOptions = _useState2[1];
var _useState3 = React.useState(typeof propsInputValue !== 'undefined' ? propsInputValue : ''),
_useState4 = _slicedToArray(_useState3, 2),
stateInputValue = _useState4[0],
setStateInputValue = _useState4[1];
var _useState5 = React.useState(propsDefaultOptions === true),
_useState6 = _slicedToArray(_useState5, 2),
isLoading = _useState6[0],
setIsLoading = _useState6[1];
var _useState7 = React.useState(undefined),
_useState8 = _slicedToArray(_useState7, 2),
loadedInputValue = _useState8[0],
setLoadedInputValue = _useState8[1];
var _useState9 = React.useState([]),
_useState10 = _slicedToArray(_useState9, 2),
loadedOptions = _useState10[0],
setLoadedOptions = _useState10[1];
var _useState11 = React.useState(false),
_useState12 = _slicedToArray(_useState11, 2),
passEmptyOptions = _useState12[0],
setPassEmptyOptions = _useState12[1];
var _useState13 = React.useState({}),
_useState14 = _slicedToArray(_useState13, 2),
optionsCache = _useState14[0],
setOptionsCache = _useState14[1];
var _useState15 = React.useState(undefined),
_useState16 = _slicedToArray(_useState15, 2),
prevDefaultOptions = _useState16[0],
setPrevDefaultOptions = _useState16[1];
var _useState17 = React.useState(undefined),
_useState18 = _slicedToArray(_useState17, 2),
prevCacheOptions = _useState18[0],
setPrevCacheOptions = _useState18[1];
if (cacheOptions !== prevCacheOptions) {
setOptionsCache({});
setPrevCacheOptions(cacheOptions);
}
if (propsDefaultOptions !== prevDefaultOptions) {
setDefaultOptions(Array.isArray(propsDefaultOptions) ? propsDefaultOptions : undefined);
setPrevDefaultOptions(propsDefaultOptions);
}
React.useEffect(function () {
mounted.current = true;
return function () {
mounted.current = false;
};
}, []);
var loadOptions = React.useCallback(function (inputValue, callback) {
if (!propsLoadOptions) return callback();
var loader = propsLoadOptions(inputValue, callback);
if (loader && typeof loader.then === 'function') {
loader.then(callback, function () {
return callback();
});
}
}, [propsLoadOptions]);
React.useEffect(function () {
if (propsDefaultOptions === true) {
loadOptions(stateInputValue, function (options) {
if (!mounted.current) return;
setDefaultOptions(options || []);
setIsLoading(!!lastRequest.current);
});
}
// NOTE: this effect is designed to only run when the component mounts,
// so we don't want to include any hook dependencies
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
var onInputChange = React.useCallback(function (newValue, actionMeta) {
var inputValue = index.handleInputChange(newValue, actionMeta, propsOnInputChange);
if (!inputValue) {
lastRequest.current = undefined;
setStateInputValue('');
setLoadedInputValue('');
setLoadedOptions([]);
setIsLoading(false);
setPassEmptyOptions(false);
return;
}
if (cacheOptions && optionsCache[inputValue]) {
setStateInputValue(inputValue);
setLoadedInputValue(inputValue);
setLoadedOptions(optionsCache[inputValue]);
setIsLoading(false);
setPassEmptyOptions(false);
} else {
var request = lastRequest.current = {};
setStateInputValue(inputValue);
setIsLoading(true);
setPassEmptyOptions(!loadedInputValue);
loadOptions(inputValue, function (options) {
if (!mounted) return;
if (request !== lastRequest.current) return;
lastRequest.current = undefined;
setIsLoading(false);
setLoadedInputValue(inputValue);
setLoadedOptions(options || []);
setPassEmptyOptions(false);
setOptionsCache(options ? _objectSpread(_objectSpread({}, optionsCache), {}, _defineProperty({}, inputValue, options)) : optionsCache);
});
}
}, [cacheOptions, loadOptions, loadedInputValue, optionsCache, propsOnInputChange]);
var options = passEmptyOptions ? [] : stateInputValue && loadedInputValue ? loadedOptions : defaultOptions || [];
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
options: options,
isLoading: isLoading || propsIsLoading,
onInputChange: onInputChange,
filterOption: filterOption
});
}
exports.useAsync = useAsync;

View File

@@ -0,0 +1,139 @@
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
import { useRef, useState, useEffect, useCallback } from 'react';
import { L as handleInputChange } from './index-641ee5b8.esm.js';
var _excluded = ["defaultOptions", "cacheOptions", "loadOptions", "options", "isLoading", "onInputChange", "filterOption"];
function useAsync(_ref) {
var _ref$defaultOptions = _ref.defaultOptions,
propsDefaultOptions = _ref$defaultOptions === void 0 ? false : _ref$defaultOptions,
_ref$cacheOptions = _ref.cacheOptions,
cacheOptions = _ref$cacheOptions === void 0 ? false : _ref$cacheOptions,
propsLoadOptions = _ref.loadOptions;
_ref.options;
var _ref$isLoading = _ref.isLoading,
propsIsLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
propsOnInputChange = _ref.onInputChange,
_ref$filterOption = _ref.filterOption,
filterOption = _ref$filterOption === void 0 ? null : _ref$filterOption,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var propsInputValue = restSelectProps.inputValue;
var lastRequest = useRef(undefined);
var mounted = useRef(false);
var _useState = useState(Array.isArray(propsDefaultOptions) ? propsDefaultOptions : undefined),
_useState2 = _slicedToArray(_useState, 2),
defaultOptions = _useState2[0],
setDefaultOptions = _useState2[1];
var _useState3 = useState(typeof propsInputValue !== 'undefined' ? propsInputValue : ''),
_useState4 = _slicedToArray(_useState3, 2),
stateInputValue = _useState4[0],
setStateInputValue = _useState4[1];
var _useState5 = useState(propsDefaultOptions === true),
_useState6 = _slicedToArray(_useState5, 2),
isLoading = _useState6[0],
setIsLoading = _useState6[1];
var _useState7 = useState(undefined),
_useState8 = _slicedToArray(_useState7, 2),
loadedInputValue = _useState8[0],
setLoadedInputValue = _useState8[1];
var _useState9 = useState([]),
_useState10 = _slicedToArray(_useState9, 2),
loadedOptions = _useState10[0],
setLoadedOptions = _useState10[1];
var _useState11 = useState(false),
_useState12 = _slicedToArray(_useState11, 2),
passEmptyOptions = _useState12[0],
setPassEmptyOptions = _useState12[1];
var _useState13 = useState({}),
_useState14 = _slicedToArray(_useState13, 2),
optionsCache = _useState14[0],
setOptionsCache = _useState14[1];
var _useState15 = useState(undefined),
_useState16 = _slicedToArray(_useState15, 2),
prevDefaultOptions = _useState16[0],
setPrevDefaultOptions = _useState16[1];
var _useState17 = useState(undefined),
_useState18 = _slicedToArray(_useState17, 2),
prevCacheOptions = _useState18[0],
setPrevCacheOptions = _useState18[1];
if (cacheOptions !== prevCacheOptions) {
setOptionsCache({});
setPrevCacheOptions(cacheOptions);
}
if (propsDefaultOptions !== prevDefaultOptions) {
setDefaultOptions(Array.isArray(propsDefaultOptions) ? propsDefaultOptions : undefined);
setPrevDefaultOptions(propsDefaultOptions);
}
useEffect(function () {
mounted.current = true;
return function () {
mounted.current = false;
};
}, []);
var loadOptions = useCallback(function (inputValue, callback) {
if (!propsLoadOptions) return callback();
var loader = propsLoadOptions(inputValue, callback);
if (loader && typeof loader.then === 'function') {
loader.then(callback, function () {
return callback();
});
}
}, [propsLoadOptions]);
useEffect(function () {
if (propsDefaultOptions === true) {
loadOptions(stateInputValue, function (options) {
if (!mounted.current) return;
setDefaultOptions(options || []);
setIsLoading(!!lastRequest.current);
});
}
// NOTE: this effect is designed to only run when the component mounts,
// so we don't want to include any hook dependencies
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
var onInputChange = useCallback(function (newValue, actionMeta) {
var inputValue = handleInputChange(newValue, actionMeta, propsOnInputChange);
if (!inputValue) {
lastRequest.current = undefined;
setStateInputValue('');
setLoadedInputValue('');
setLoadedOptions([]);
setIsLoading(false);
setPassEmptyOptions(false);
return;
}
if (cacheOptions && optionsCache[inputValue]) {
setStateInputValue(inputValue);
setLoadedInputValue(inputValue);
setLoadedOptions(optionsCache[inputValue]);
setIsLoading(false);
setPassEmptyOptions(false);
} else {
var request = lastRequest.current = {};
setStateInputValue(inputValue);
setIsLoading(true);
setPassEmptyOptions(!loadedInputValue);
loadOptions(inputValue, function (options) {
if (!mounted) return;
if (request !== lastRequest.current) return;
lastRequest.current = undefined;
setIsLoading(false);
setLoadedInputValue(inputValue);
setLoadedOptions(options || []);
setPassEmptyOptions(false);
setOptionsCache(options ? _objectSpread(_objectSpread({}, optionsCache), {}, _defineProperty({}, inputValue, options)) : optionsCache);
});
}
}, [cacheOptions, loadOptions, loadedInputValue, optionsCache, propsOnInputChange]);
var options = passEmptyOptions ? [] : stateInputValue && loadedInputValue ? loadedOptions : defaultOptions || [];
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
options: options,
isLoading: isLoading || propsIsLoading,
onInputChange: onInputChange,
filterOption: filterOption
});
}
export { useAsync as u };

View File

@@ -0,0 +1,96 @@
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
import { useMemo, useCallback } from 'react';
import { H as cleanValue, D as valueTernary } from './index-641ee5b8.esm.js';
import { g as getOptionValue, b as getOptionLabel } from './Select-ef7c0426.esm.js';
var _excluded = ["allowCreateWhileLoading", "createOptionPosition", "formatCreateLabel", "isValidNewOption", "getNewOptionData", "onCreateOption", "options", "onChange"];
var compareOption = function compareOption() {
var inputValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
var option = arguments.length > 1 ? arguments[1] : undefined;
var accessors = arguments.length > 2 ? arguments[2] : undefined;
var candidate = String(inputValue).toLowerCase();
var optionValue = String(accessors.getOptionValue(option)).toLowerCase();
var optionLabel = String(accessors.getOptionLabel(option)).toLowerCase();
return optionValue === candidate || optionLabel === candidate;
};
var builtins = {
formatCreateLabel: function formatCreateLabel(inputValue) {
return "Create \"".concat(inputValue, "\"");
},
isValidNewOption: function isValidNewOption(inputValue, selectValue, selectOptions, accessors) {
return !(!inputValue || selectValue.some(function (option) {
return compareOption(inputValue, option, accessors);
}) || selectOptions.some(function (option) {
return compareOption(inputValue, option, accessors);
}));
},
getNewOptionData: function getNewOptionData(inputValue, optionLabel) {
return {
label: optionLabel,
value: inputValue,
__isNew__: true
};
}
};
function useCreatable(_ref) {
var _ref$allowCreateWhile = _ref.allowCreateWhileLoading,
allowCreateWhileLoading = _ref$allowCreateWhile === void 0 ? false : _ref$allowCreateWhile,
_ref$createOptionPosi = _ref.createOptionPosition,
createOptionPosition = _ref$createOptionPosi === void 0 ? 'last' : _ref$createOptionPosi,
_ref$formatCreateLabe = _ref.formatCreateLabel,
formatCreateLabel = _ref$formatCreateLabe === void 0 ? builtins.formatCreateLabel : _ref$formatCreateLabe,
_ref$isValidNewOption = _ref.isValidNewOption,
isValidNewOption = _ref$isValidNewOption === void 0 ? builtins.isValidNewOption : _ref$isValidNewOption,
_ref$getNewOptionData = _ref.getNewOptionData,
getNewOptionData = _ref$getNewOptionData === void 0 ? builtins.getNewOptionData : _ref$getNewOptionData,
onCreateOption = _ref.onCreateOption,
_ref$options = _ref.options,
propsOptions = _ref$options === void 0 ? [] : _ref$options,
propsOnChange = _ref.onChange,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var _restSelectProps$getO = restSelectProps.getOptionValue,
getOptionValue$1 = _restSelectProps$getO === void 0 ? getOptionValue : _restSelectProps$getO,
_restSelectProps$getO2 = restSelectProps.getOptionLabel,
getOptionLabel$1 = _restSelectProps$getO2 === void 0 ? getOptionLabel : _restSelectProps$getO2,
inputValue = restSelectProps.inputValue,
isLoading = restSelectProps.isLoading,
isMulti = restSelectProps.isMulti,
value = restSelectProps.value,
name = restSelectProps.name;
var newOption = useMemo(function () {
return isValidNewOption(inputValue, cleanValue(value), propsOptions, {
getOptionValue: getOptionValue$1,
getOptionLabel: getOptionLabel$1
}) ? getNewOptionData(inputValue, formatCreateLabel(inputValue)) : undefined;
}, [formatCreateLabel, getNewOptionData, getOptionLabel$1, getOptionValue$1, inputValue, isValidNewOption, propsOptions, value]);
var options = useMemo(function () {
return (allowCreateWhileLoading || !isLoading) && newOption ? createOptionPosition === 'first' ? [newOption].concat(_toConsumableArray(propsOptions)) : [].concat(_toConsumableArray(propsOptions), [newOption]) : propsOptions;
}, [allowCreateWhileLoading, createOptionPosition, isLoading, newOption, propsOptions]);
var onChange = useCallback(function (newValue, actionMeta) {
if (actionMeta.action !== 'select-option') {
return propsOnChange(newValue, actionMeta);
}
var valueArray = Array.isArray(newValue) ? newValue : [newValue];
if (valueArray[valueArray.length - 1] === newOption) {
if (onCreateOption) onCreateOption(inputValue);else {
var newOptionData = getNewOptionData(inputValue, inputValue);
var newActionMeta = {
action: 'create-option',
name: name,
option: newOptionData
};
propsOnChange(valueTernary(isMulti, [].concat(_toConsumableArray(cleanValue(value)), [newOptionData]), newOptionData), newActionMeta);
}
return;
}
propsOnChange(newValue, actionMeta);
}, [getNewOptionData, inputValue, isMulti, name, newOption, onCreateOption, propsOnChange, value]);
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
options: options,
onChange: onChange
});
}
export { useCreatable as u };

View File

@@ -0,0 +1,98 @@
'use strict';
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var index = require('./index-42b266b1.cjs.dev.js');
var Select = require('./Select-1b9abbe3.cjs.dev.js');
var _excluded = ["allowCreateWhileLoading", "createOptionPosition", "formatCreateLabel", "isValidNewOption", "getNewOptionData", "onCreateOption", "options", "onChange"];
var compareOption = function compareOption() {
var inputValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
var option = arguments.length > 1 ? arguments[1] : undefined;
var accessors = arguments.length > 2 ? arguments[2] : undefined;
var candidate = String(inputValue).toLowerCase();
var optionValue = String(accessors.getOptionValue(option)).toLowerCase();
var optionLabel = String(accessors.getOptionLabel(option)).toLowerCase();
return optionValue === candidate || optionLabel === candidate;
};
var builtins = {
formatCreateLabel: function formatCreateLabel(inputValue) {
return "Create \"".concat(inputValue, "\"");
},
isValidNewOption: function isValidNewOption(inputValue, selectValue, selectOptions, accessors) {
return !(!inputValue || selectValue.some(function (option) {
return compareOption(inputValue, option, accessors);
}) || selectOptions.some(function (option) {
return compareOption(inputValue, option, accessors);
}));
},
getNewOptionData: function getNewOptionData(inputValue, optionLabel) {
return {
label: optionLabel,
value: inputValue,
__isNew__: true
};
}
};
function useCreatable(_ref) {
var _ref$allowCreateWhile = _ref.allowCreateWhileLoading,
allowCreateWhileLoading = _ref$allowCreateWhile === void 0 ? false : _ref$allowCreateWhile,
_ref$createOptionPosi = _ref.createOptionPosition,
createOptionPosition = _ref$createOptionPosi === void 0 ? 'last' : _ref$createOptionPosi,
_ref$formatCreateLabe = _ref.formatCreateLabel,
formatCreateLabel = _ref$formatCreateLabe === void 0 ? builtins.formatCreateLabel : _ref$formatCreateLabe,
_ref$isValidNewOption = _ref.isValidNewOption,
isValidNewOption = _ref$isValidNewOption === void 0 ? builtins.isValidNewOption : _ref$isValidNewOption,
_ref$getNewOptionData = _ref.getNewOptionData,
getNewOptionData = _ref$getNewOptionData === void 0 ? builtins.getNewOptionData : _ref$getNewOptionData,
onCreateOption = _ref.onCreateOption,
_ref$options = _ref.options,
propsOptions = _ref$options === void 0 ? [] : _ref$options,
propsOnChange = _ref.onChange,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var _restSelectProps$getO = restSelectProps.getOptionValue,
getOptionValue = _restSelectProps$getO === void 0 ? Select.getOptionValue : _restSelectProps$getO,
_restSelectProps$getO2 = restSelectProps.getOptionLabel,
getOptionLabel = _restSelectProps$getO2 === void 0 ? Select.getOptionLabel : _restSelectProps$getO2,
inputValue = restSelectProps.inputValue,
isLoading = restSelectProps.isLoading,
isMulti = restSelectProps.isMulti,
value = restSelectProps.value,
name = restSelectProps.name;
var newOption = React.useMemo(function () {
return isValidNewOption(inputValue, index.cleanValue(value), propsOptions, {
getOptionValue: getOptionValue,
getOptionLabel: getOptionLabel
}) ? getNewOptionData(inputValue, formatCreateLabel(inputValue)) : undefined;
}, [formatCreateLabel, getNewOptionData, getOptionLabel, getOptionValue, inputValue, isValidNewOption, propsOptions, value]);
var options = React.useMemo(function () {
return (allowCreateWhileLoading || !isLoading) && newOption ? createOptionPosition === 'first' ? [newOption].concat(_toConsumableArray(propsOptions)) : [].concat(_toConsumableArray(propsOptions), [newOption]) : propsOptions;
}, [allowCreateWhileLoading, createOptionPosition, isLoading, newOption, propsOptions]);
var onChange = React.useCallback(function (newValue, actionMeta) {
if (actionMeta.action !== 'select-option') {
return propsOnChange(newValue, actionMeta);
}
var valueArray = Array.isArray(newValue) ? newValue : [newValue];
if (valueArray[valueArray.length - 1] === newOption) {
if (onCreateOption) onCreateOption(inputValue);else {
var newOptionData = getNewOptionData(inputValue, inputValue);
var newActionMeta = {
action: 'create-option',
name: name,
option: newOptionData
};
propsOnChange(index.valueTernary(isMulti, [].concat(_toConsumableArray(index.cleanValue(value)), [newOptionData]), newOptionData), newActionMeta);
}
return;
}
propsOnChange(newValue, actionMeta);
}, [getNewOptionData, inputValue, isMulti, name, newOption, onCreateOption, propsOnChange, value]);
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
options: options,
onChange: onChange
});
}
exports.useCreatable = useCreatable;

View File

@@ -0,0 +1,98 @@
'use strict';
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var index = require('./index-665c4ed8.cjs.prod.js');
var Select = require('./Select-8685a2b1.cjs.prod.js');
var _excluded = ["allowCreateWhileLoading", "createOptionPosition", "formatCreateLabel", "isValidNewOption", "getNewOptionData", "onCreateOption", "options", "onChange"];
var compareOption = function compareOption() {
var inputValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
var option = arguments.length > 1 ? arguments[1] : undefined;
var accessors = arguments.length > 2 ? arguments[2] : undefined;
var candidate = String(inputValue).toLowerCase();
var optionValue = String(accessors.getOptionValue(option)).toLowerCase();
var optionLabel = String(accessors.getOptionLabel(option)).toLowerCase();
return optionValue === candidate || optionLabel === candidate;
};
var builtins = {
formatCreateLabel: function formatCreateLabel(inputValue) {
return "Create \"".concat(inputValue, "\"");
},
isValidNewOption: function isValidNewOption(inputValue, selectValue, selectOptions, accessors) {
return !(!inputValue || selectValue.some(function (option) {
return compareOption(inputValue, option, accessors);
}) || selectOptions.some(function (option) {
return compareOption(inputValue, option, accessors);
}));
},
getNewOptionData: function getNewOptionData(inputValue, optionLabel) {
return {
label: optionLabel,
value: inputValue,
__isNew__: true
};
}
};
function useCreatable(_ref) {
var _ref$allowCreateWhile = _ref.allowCreateWhileLoading,
allowCreateWhileLoading = _ref$allowCreateWhile === void 0 ? false : _ref$allowCreateWhile,
_ref$createOptionPosi = _ref.createOptionPosition,
createOptionPosition = _ref$createOptionPosi === void 0 ? 'last' : _ref$createOptionPosi,
_ref$formatCreateLabe = _ref.formatCreateLabel,
formatCreateLabel = _ref$formatCreateLabe === void 0 ? builtins.formatCreateLabel : _ref$formatCreateLabe,
_ref$isValidNewOption = _ref.isValidNewOption,
isValidNewOption = _ref$isValidNewOption === void 0 ? builtins.isValidNewOption : _ref$isValidNewOption,
_ref$getNewOptionData = _ref.getNewOptionData,
getNewOptionData = _ref$getNewOptionData === void 0 ? builtins.getNewOptionData : _ref$getNewOptionData,
onCreateOption = _ref.onCreateOption,
_ref$options = _ref.options,
propsOptions = _ref$options === void 0 ? [] : _ref$options,
propsOnChange = _ref.onChange,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var _restSelectProps$getO = restSelectProps.getOptionValue,
getOptionValue = _restSelectProps$getO === void 0 ? Select.getOptionValue : _restSelectProps$getO,
_restSelectProps$getO2 = restSelectProps.getOptionLabel,
getOptionLabel = _restSelectProps$getO2 === void 0 ? Select.getOptionLabel : _restSelectProps$getO2,
inputValue = restSelectProps.inputValue,
isLoading = restSelectProps.isLoading,
isMulti = restSelectProps.isMulti,
value = restSelectProps.value,
name = restSelectProps.name;
var newOption = React.useMemo(function () {
return isValidNewOption(inputValue, index.cleanValue(value), propsOptions, {
getOptionValue: getOptionValue,
getOptionLabel: getOptionLabel
}) ? getNewOptionData(inputValue, formatCreateLabel(inputValue)) : undefined;
}, [formatCreateLabel, getNewOptionData, getOptionLabel, getOptionValue, inputValue, isValidNewOption, propsOptions, value]);
var options = React.useMemo(function () {
return (allowCreateWhileLoading || !isLoading) && newOption ? createOptionPosition === 'first' ? [newOption].concat(_toConsumableArray(propsOptions)) : [].concat(_toConsumableArray(propsOptions), [newOption]) : propsOptions;
}, [allowCreateWhileLoading, createOptionPosition, isLoading, newOption, propsOptions]);
var onChange = React.useCallback(function (newValue, actionMeta) {
if (actionMeta.action !== 'select-option') {
return propsOnChange(newValue, actionMeta);
}
var valueArray = Array.isArray(newValue) ? newValue : [newValue];
if (valueArray[valueArray.length - 1] === newOption) {
if (onCreateOption) onCreateOption(inputValue);else {
var newOptionData = getNewOptionData(inputValue, inputValue);
var newActionMeta = {
action: 'create-option',
name: name,
option: newOptionData
};
propsOnChange(index.valueTernary(isMulti, [].concat(_toConsumableArray(index.cleanValue(value)), [newOptionData]), newOptionData), newActionMeta);
}
return;
}
propsOnChange(newValue, actionMeta);
}, [getNewOptionData, inputValue, isMulti, name, newOption, onCreateOption, propsOnChange, value]);
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
options: options,
onChange: onChange
});
}
exports.useCreatable = useCreatable;

View File

@@ -0,0 +1,75 @@
'use strict';
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var _excluded = ["defaultInputValue", "defaultMenuIsOpen", "defaultValue", "inputValue", "menuIsOpen", "onChange", "onInputChange", "onMenuClose", "onMenuOpen", "value"];
function useStateManager(_ref) {
var _ref$defaultInputValu = _ref.defaultInputValue,
defaultInputValue = _ref$defaultInputValu === void 0 ? '' : _ref$defaultInputValu,
_ref$defaultMenuIsOpe = _ref.defaultMenuIsOpen,
defaultMenuIsOpen = _ref$defaultMenuIsOpe === void 0 ? false : _ref$defaultMenuIsOpe,
_ref$defaultValue = _ref.defaultValue,
defaultValue = _ref$defaultValue === void 0 ? null : _ref$defaultValue,
propsInputValue = _ref.inputValue,
propsMenuIsOpen = _ref.menuIsOpen,
propsOnChange = _ref.onChange,
propsOnInputChange = _ref.onInputChange,
propsOnMenuClose = _ref.onMenuClose,
propsOnMenuOpen = _ref.onMenuOpen,
propsValue = _ref.value,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var _useState = React.useState(propsInputValue !== undefined ? propsInputValue : defaultInputValue),
_useState2 = _slicedToArray(_useState, 2),
stateInputValue = _useState2[0],
setStateInputValue = _useState2[1];
var _useState3 = React.useState(propsMenuIsOpen !== undefined ? propsMenuIsOpen : defaultMenuIsOpen),
_useState4 = _slicedToArray(_useState3, 2),
stateMenuIsOpen = _useState4[0],
setStateMenuIsOpen = _useState4[1];
var _useState5 = React.useState(propsValue !== undefined ? propsValue : defaultValue),
_useState6 = _slicedToArray(_useState5, 2),
stateValue = _useState6[0],
setStateValue = _useState6[1];
var onChange = React.useCallback(function (value, actionMeta) {
if (typeof propsOnChange === 'function') {
propsOnChange(value, actionMeta);
}
setStateValue(value);
}, [propsOnChange]);
var onInputChange = React.useCallback(function (value, actionMeta) {
var newValue;
if (typeof propsOnInputChange === 'function') {
newValue = propsOnInputChange(value, actionMeta);
}
setStateInputValue(newValue !== undefined ? newValue : value);
}, [propsOnInputChange]);
var onMenuOpen = React.useCallback(function () {
if (typeof propsOnMenuOpen === 'function') {
propsOnMenuOpen();
}
setStateMenuIsOpen(true);
}, [propsOnMenuOpen]);
var onMenuClose = React.useCallback(function () {
if (typeof propsOnMenuClose === 'function') {
propsOnMenuClose();
}
setStateMenuIsOpen(false);
}, [propsOnMenuClose]);
var inputValue = propsInputValue !== undefined ? propsInputValue : stateInputValue;
var menuIsOpen = propsMenuIsOpen !== undefined ? propsMenuIsOpen : stateMenuIsOpen;
var value = propsValue !== undefined ? propsValue : stateValue;
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
inputValue: inputValue,
menuIsOpen: menuIsOpen,
onChange: onChange,
onInputChange: onInputChange,
onMenuClose: onMenuClose,
onMenuOpen: onMenuOpen,
value: value
});
}
exports.useStateManager = useStateManager;

View File

@@ -0,0 +1,73 @@
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
import { useState, useCallback } from 'react';
var _excluded = ["defaultInputValue", "defaultMenuIsOpen", "defaultValue", "inputValue", "menuIsOpen", "onChange", "onInputChange", "onMenuClose", "onMenuOpen", "value"];
function useStateManager(_ref) {
var _ref$defaultInputValu = _ref.defaultInputValue,
defaultInputValue = _ref$defaultInputValu === void 0 ? '' : _ref$defaultInputValu,
_ref$defaultMenuIsOpe = _ref.defaultMenuIsOpen,
defaultMenuIsOpen = _ref$defaultMenuIsOpe === void 0 ? false : _ref$defaultMenuIsOpe,
_ref$defaultValue = _ref.defaultValue,
defaultValue = _ref$defaultValue === void 0 ? null : _ref$defaultValue,
propsInputValue = _ref.inputValue,
propsMenuIsOpen = _ref.menuIsOpen,
propsOnChange = _ref.onChange,
propsOnInputChange = _ref.onInputChange,
propsOnMenuClose = _ref.onMenuClose,
propsOnMenuOpen = _ref.onMenuOpen,
propsValue = _ref.value,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var _useState = useState(propsInputValue !== undefined ? propsInputValue : defaultInputValue),
_useState2 = _slicedToArray(_useState, 2),
stateInputValue = _useState2[0],
setStateInputValue = _useState2[1];
var _useState3 = useState(propsMenuIsOpen !== undefined ? propsMenuIsOpen : defaultMenuIsOpen),
_useState4 = _slicedToArray(_useState3, 2),
stateMenuIsOpen = _useState4[0],
setStateMenuIsOpen = _useState4[1];
var _useState5 = useState(propsValue !== undefined ? propsValue : defaultValue),
_useState6 = _slicedToArray(_useState5, 2),
stateValue = _useState6[0],
setStateValue = _useState6[1];
var onChange = useCallback(function (value, actionMeta) {
if (typeof propsOnChange === 'function') {
propsOnChange(value, actionMeta);
}
setStateValue(value);
}, [propsOnChange]);
var onInputChange = useCallback(function (value, actionMeta) {
var newValue;
if (typeof propsOnInputChange === 'function') {
newValue = propsOnInputChange(value, actionMeta);
}
setStateInputValue(newValue !== undefined ? newValue : value);
}, [propsOnInputChange]);
var onMenuOpen = useCallback(function () {
if (typeof propsOnMenuOpen === 'function') {
propsOnMenuOpen();
}
setStateMenuIsOpen(true);
}, [propsOnMenuOpen]);
var onMenuClose = useCallback(function () {
if (typeof propsOnMenuClose === 'function') {
propsOnMenuClose();
}
setStateMenuIsOpen(false);
}, [propsOnMenuClose]);
var inputValue = propsInputValue !== undefined ? propsInputValue : stateInputValue;
var menuIsOpen = propsMenuIsOpen !== undefined ? propsMenuIsOpen : stateMenuIsOpen;
var value = propsValue !== undefined ? propsValue : stateValue;
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
inputValue: inputValue,
menuIsOpen: menuIsOpen,
onChange: onChange,
onInputChange: onInputChange,
onMenuClose: onMenuClose,
onMenuOpen: onMenuOpen,
value: value
});
}
export { useStateManager as u };

View File

@@ -0,0 +1,75 @@
'use strict';
var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var _excluded = ["defaultInputValue", "defaultMenuIsOpen", "defaultValue", "inputValue", "menuIsOpen", "onChange", "onInputChange", "onMenuClose", "onMenuOpen", "value"];
function useStateManager(_ref) {
var _ref$defaultInputValu = _ref.defaultInputValue,
defaultInputValue = _ref$defaultInputValu === void 0 ? '' : _ref$defaultInputValu,
_ref$defaultMenuIsOpe = _ref.defaultMenuIsOpen,
defaultMenuIsOpen = _ref$defaultMenuIsOpe === void 0 ? false : _ref$defaultMenuIsOpe,
_ref$defaultValue = _ref.defaultValue,
defaultValue = _ref$defaultValue === void 0 ? null : _ref$defaultValue,
propsInputValue = _ref.inputValue,
propsMenuIsOpen = _ref.menuIsOpen,
propsOnChange = _ref.onChange,
propsOnInputChange = _ref.onInputChange,
propsOnMenuClose = _ref.onMenuClose,
propsOnMenuOpen = _ref.onMenuOpen,
propsValue = _ref.value,
restSelectProps = _objectWithoutProperties(_ref, _excluded);
var _useState = React.useState(propsInputValue !== undefined ? propsInputValue : defaultInputValue),
_useState2 = _slicedToArray(_useState, 2),
stateInputValue = _useState2[0],
setStateInputValue = _useState2[1];
var _useState3 = React.useState(propsMenuIsOpen !== undefined ? propsMenuIsOpen : defaultMenuIsOpen),
_useState4 = _slicedToArray(_useState3, 2),
stateMenuIsOpen = _useState4[0],
setStateMenuIsOpen = _useState4[1];
var _useState5 = React.useState(propsValue !== undefined ? propsValue : defaultValue),
_useState6 = _slicedToArray(_useState5, 2),
stateValue = _useState6[0],
setStateValue = _useState6[1];
var onChange = React.useCallback(function (value, actionMeta) {
if (typeof propsOnChange === 'function') {
propsOnChange(value, actionMeta);
}
setStateValue(value);
}, [propsOnChange]);
var onInputChange = React.useCallback(function (value, actionMeta) {
var newValue;
if (typeof propsOnInputChange === 'function') {
newValue = propsOnInputChange(value, actionMeta);
}
setStateInputValue(newValue !== undefined ? newValue : value);
}, [propsOnInputChange]);
var onMenuOpen = React.useCallback(function () {
if (typeof propsOnMenuOpen === 'function') {
propsOnMenuOpen();
}
setStateMenuIsOpen(true);
}, [propsOnMenuOpen]);
var onMenuClose = React.useCallback(function () {
if (typeof propsOnMenuClose === 'function') {
propsOnMenuClose();
}
setStateMenuIsOpen(false);
}, [propsOnMenuClose]);
var inputValue = propsInputValue !== undefined ? propsInputValue : stateInputValue;
var menuIsOpen = propsMenuIsOpen !== undefined ? propsMenuIsOpen : stateMenuIsOpen;
var value = propsValue !== undefined ? propsValue : stateValue;
return _objectSpread(_objectSpread({}, restSelectProps), {}, {
inputValue: inputValue,
menuIsOpen: menuIsOpen,
onChange: onChange,
onInputChange: onInputChange,
onMenuClose: onMenuClose,
onMenuOpen: onMenuOpen,
value: value
});
}
exports.useStateManager = useStateManager;