@theroutingcompany/components 0.0.16-alpha.2 → 0.0.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@theroutingcompany/components",
3
- "version": "0.0.16-alpha.2",
3
+ "version": "0.0.16",
4
4
  "description": "The Routing Company Components",
5
5
  "main": "./dist/trc-components.umd.js",
6
6
  "module": "./dist/trc-components.es.js",
@@ -37,7 +37,6 @@
37
37
  "sideEffects": false,
38
38
  "license": "ISC",
39
39
  "dependencies": {
40
- "@internationalized/date": "^3.0.2",
41
40
  "@material-ui/icons": "^4.11.3",
42
41
  "@radix-ui/react-accessible-icon": "^1.0.1",
43
42
  "@radix-ui/react-alert-dialog": "^1.0.2",
@@ -56,38 +55,19 @@
56
55
  "@radix-ui/react-tooltip": "^1.0.3",
57
56
  "@react-aria/breadcrumbs": "^3.4.1",
58
57
  "@react-aria/button": "^3.6.4",
59
- "@react-aria/combobox": "^3.4.4",
60
- "@react-aria/datepicker": "^3.2.1",
61
58
  "@react-aria/dnd": "^3.0.1",
62
59
  "@react-aria/focus": "^3.10.1",
63
- "@react-aria/i18n": "^3.6.3",
64
60
  "@react-aria/interactions": "^3.13.1",
65
61
  "@react-aria/label": "^3.4.4",
66
- "@react-aria/listbox": "^3.7.2",
67
- "@react-aria/menu": "^3.7.1",
68
62
  "@react-aria/numberfield": "^3.3.4",
69
- "@react-aria/overlays": "^3.12.1",
70
63
  "@react-aria/progress": "^3.3.4",
71
64
  "@react-aria/radio": "^3.4.2",
72
65
  "@react-aria/searchfield": "^3.4.4",
73
- "@react-aria/select": "^3.8.4",
74
- "@react-aria/selection": "^3.12.1",
75
66
  "@react-aria/textfield": "^3.8.1",
76
67
  "@react-aria/utils": "^3.14.2",
77
- "@react-stately/collections": "^3.5.1",
78
- "@react-stately/combobox": "^3.3.1",
79
- "@react-stately/datepicker": "^3.2.1",
80
- "@react-stately/list": "^3.6.1",
81
- "@react-stately/menu": "^3.4.4",
82
68
  "@react-stately/numberfield": "^3.3.1",
83
- "@react-stately/overlays": "^3.4.4",
84
69
  "@react-stately/radio": "^3.6.2",
85
70
  "@react-stately/searchfield": "^3.3.4",
86
- "@react-stately/select": "^3.3.4",
87
- "@react-stately/selection": "^3.11.2",
88
- "@react-types/combobox": "^3.5.5",
89
- "@react-types/overlays": "^3.6.5",
90
- "@react-types/select": "^3.6.5",
91
71
  "@tanstack/react-table": "^8.7.8",
92
72
  "@theroutingcompany/design-tokens": "^0.0.3",
93
73
  "styled-components": "^5.3.6"
@@ -1,9 +1,7 @@
1
1
  import { type PropsWithChildren, type ReactNode } from 'react';
2
2
  import { type AriaFieldProps } from '@react-aria/label';
3
3
  import type { AriaTextFieldProps } from '@react-aria/textfield';
4
- import type { ComponentPropsWithoutStyles, InputValidationProps } from 'helpers/typeHelpers';
5
- import { type NumberInputProps } from 'components/Input/NumberInput/NumberInput';
6
- import { type TextAreaInputProps } from 'components/Input/TextArea/TextArea';
4
+ import type { ComponentPropsWithoutStyles } from 'helpers/typeHelpers';
7
5
  type FormControlProps<FieldProps = AriaFieldProps> = PropsWithChildren<{
8
6
  tooltipContent?: string;
9
7
  tooltipIcon?: ReactNode;
@@ -11,10 +9,75 @@ type FormControlProps<FieldProps = AriaFieldProps> = PropsWithChildren<{
11
9
  /** If in a `<FormControl/>`, read `fieldProps` generated by that FormControl's `useField` hook */
12
10
  export declare function useFieldProps(): import("@react-types/shared").AriaLabelingProps & import("@react-types/shared").DOMProps;
13
11
  export declare function FormControl({ children, label, errorMessage, description, tooltipContent, tooltipIcon, validationState, id, ...props }: FormControlProps): JSX.Element;
14
- type TextFormControlProps = FormControlProps<AriaTextFieldProps> & InputValidationProps & ComponentPropsWithoutStyles<'input'>;
15
- export declare const TextFormControl: import("react").ForwardRefExoticComponent<TextFormControlProps & import("react").RefAttributes<HTMLInputElement>>;
16
- type TextAreaFormControlProps = FormControlProps & InputValidationProps & ComponentPropsWithoutStyles<'textarea'> & TextAreaInputProps;
17
- export declare const TextAreaFormControl: import("react").ForwardRefExoticComponent<TextAreaFormControlProps & import("react").RefAttributes<HTMLTextAreaElement>>;
18
- type NumberFormControlProps = FormControlProps & NumberInputProps;
19
- export declare const NumberFormControl: import("react").ForwardRefExoticComponent<NumberFormControlProps & import("react").RefAttributes<HTMLInputElement>>;
12
+ export declare const TextFormControl: import("react").ForwardRefExoticComponent<{
13
+ tooltipContent?: string | undefined;
14
+ tooltipIcon?: ReactNode;
15
+ } & AriaTextFieldProps & {
16
+ children?: ReactNode;
17
+ } & ComponentPropsWithoutStyles<"input"> & import("react").RefAttributes<HTMLInputElement>>;
18
+ export declare const TextAreaFormControl: import("react").ForwardRefExoticComponent<{
19
+ tooltipContent?: string | undefined;
20
+ tooltipIcon?: ReactNode;
21
+ } & AriaFieldProps & {
22
+ children?: ReactNode;
23
+ } & ComponentPropsWithoutStyles<"textarea"> & {
24
+ label?: ReactNode;
25
+ pattern?: string | undefined;
26
+ type?: "text" | (string & {}) | "search" | "tel" | "url" | "email" | "password" | undefined;
27
+ name?: string | undefined;
28
+ defaultValue?: string | undefined;
29
+ id?: string | undefined;
30
+ placeholder?: string | undefined;
31
+ inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
32
+ 'aria-activedescendant'?: string | undefined;
33
+ 'aria-autocomplete'?: "list" | "none" | "inline" | "both" | undefined;
34
+ 'aria-describedby'?: string | undefined;
35
+ 'aria-details'?: string | undefined;
36
+ 'aria-errormessage'?: string | undefined;
37
+ 'aria-haspopup'?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
38
+ 'aria-label'?: string | undefined;
39
+ 'aria-labelledby'?: string | undefined;
40
+ onCopy?: import("react").ClipboardEventHandler<HTMLInputElement> | undefined;
41
+ onCut?: import("react").ClipboardEventHandler<HTMLInputElement> | undefined;
42
+ onPaste?: import("react").ClipboardEventHandler<HTMLInputElement> | undefined;
43
+ onCompositionEnd?: import("react").CompositionEventHandler<HTMLInputElement> | undefined;
44
+ onCompositionStart?: import("react").CompositionEventHandler<HTMLInputElement> | undefined;
45
+ onCompositionUpdate?: import("react").CompositionEventHandler<HTMLInputElement> | undefined;
46
+ onFocus?: ((e: import("react").FocusEvent<Element, Element>) => void) | undefined;
47
+ onBlur?: ((e: import("react").FocusEvent<Element, Element>) => void) | undefined;
48
+ onChange?: ((value: string) => void) | undefined;
49
+ onBeforeInput?: import("react").FormEventHandler<HTMLInputElement> | undefined;
50
+ onInput?: import("react").FormEventHandler<HTMLInputElement> | undefined;
51
+ onKeyDown?: ((e: import("@react-types/shared").KeyboardEvent) => void) | undefined;
52
+ onKeyUp?: ((e: import("@react-types/shared").KeyboardEvent) => void) | undefined;
53
+ onSelect?: import("react").ReactEventHandler<HTMLInputElement> | undefined;
54
+ autoFocus?: boolean | undefined;
55
+ disabled?: boolean | undefined;
56
+ value?: string | undefined;
57
+ autoComplete?: string | undefined;
58
+ maxLength?: number | undefined;
59
+ minLength?: number | undefined;
60
+ readOnly?: boolean | undefined;
61
+ required?: boolean | undefined;
62
+ description?: ReactNode;
63
+ onFocusChange?: ((isFocused: boolean) => void) | undefined;
64
+ excludeFromTabOrder?: boolean | undefined;
65
+ validationState?: import("@react-types/shared").ValidationState | undefined;
66
+ errorMessage?: ReactNode;
67
+ } & import("components/Input/InputBase").InputBaseProps & import("react").RefAttributes<HTMLTextAreaElement>>;
68
+ export declare const NumberFormControl: import("react").ForwardRefExoticComponent<{
69
+ tooltipContent?: string | undefined;
70
+ tooltipIcon?: ReactNode;
71
+ } & AriaFieldProps & {
72
+ children?: ReactNode;
73
+ } & Omit<import("helpers/typeHelpers").RenameBooleanProps<import("@react-types/numberfield").AriaNumberFieldProps>, "minValue" | "maxValue"> & {
74
+ min?: number | undefined;
75
+ max?: number | undefined;
76
+ } & import("components/Input/InputBase").InputBaseProps & {
77
+ name?: string | undefined;
78
+ } & {
79
+ showStepper?: boolean | undefined;
80
+ } & {
81
+ locale?: string | undefined;
82
+ } & import("react").RefAttributes<HTMLInputElement>>;
20
83
  export {};
@@ -1,13 +1,14 @@
1
1
  /// <reference types="react" />
2
2
  import { type AriaNumberFieldProps } from '@react-aria/numberfield';
3
3
  import { type NumberFieldStateOptions } from '@react-stately/numberfield';
4
- import type { ComponentPropsWithoutStyles, InputValidationProps, RenameBooleanProps, RenameMissuffixedProps } from 'helpers/typeHelpers';
4
+ import type { ComponentPropsWithoutStyles, RenameBooleanProps, RenameMissuffixedProps } from 'helpers/typeHelpers';
5
5
  import { type InputBaseProps } from '../InputBase';
6
- type ReactAriaNumberInputProps = Omit<RenameBooleanProps<AriaNumberFieldProps>, 'minValue' | 'maxValue'> & RenameMissuffixedProps<AriaNumberFieldProps, 'Value', 'minValue' | 'maxValue'>;
6
+ type ReactAriaNumberInputProps = RenameMissuffixedProps<RenameBooleanProps<AriaNumberFieldProps>, 'Value', 'minValue' | 'maxValue'>;
7
7
  type ShowStepper = {
8
8
  showStepper?: boolean;
9
9
  };
10
- export type NumberInputProps = Pick<ComponentPropsWithoutStyles<'input'>, 'name'> & ReactAriaNumberInputProps & InputBaseProps & InputValidationProps & ShowStepper & {
10
+ type StandardInputProps = Pick<ComponentPropsWithoutStyles<'input'>, 'name'>;
11
+ export type NumberInputProps = ReactAriaNumberInputProps & InputBaseProps & StandardInputProps & ShowStepper & {
11
12
  locale?: NumberFieldStateOptions['locale'];
12
13
  };
13
14
  /**
@@ -31,5 +32,10 @@ export type NumberInputProps = Pick<ComponentPropsWithoutStyles<'input'>, 'name'
31
32
  * </label>
32
33
  * ```
33
34
  */
34
- export declare const NumberInput: import("react").ForwardRefExoticComponent<NumberInputProps & import("react").RefAttributes<HTMLInputElement>>;
35
+ export declare const NumberInput: import("react").ForwardRefExoticComponent<Omit<RenameBooleanProps<AriaNumberFieldProps>, "minValue" | "maxValue"> & {
36
+ min?: number | undefined;
37
+ max?: number | undefined;
38
+ } & InputBaseProps & StandardInputProps & ShowStepper & {
39
+ locale?: string | undefined;
40
+ } & import("react").RefAttributes<HTMLInputElement>>;
35
41
  export {};
@@ -7,6 +7,6 @@ export interface LabelProps extends ComponentPropsWithoutStyles<'label'> {
7
7
  srOnly?: boolean;
8
8
  display?: 'flex' | 'inline-flex' | 'inline' | 'block' | undefined;
9
9
  children: ReactNode;
10
- as?: "legend" | "span" | undefined;
10
+ as?: 'legend' | 'span' | undefined;
11
11
  }
12
12
  export declare function Label({ children, bold, size, display, srOnly, ...remainingProps }: LabelProps): JSX.Element;
@@ -1,7 +1,12 @@
1
- import { type ReactNode } from 'react';
1
+ /** 12 column grid */
2
2
  export declare const PageGrid: import("styled-components").StyledComponent<"div", any, {}, never>;
3
+ /** Centered page container
4
+ *
5
+ * | Description | CSS Variable | Default |
6
+ * |-------------|---------------------|---------|
7
+ * | Min. width | `--page-min-width` | 750px |
8
+ * | Ideal width | `--page-ideal-width`| 85% |
9
+ * | Max width | `--page-max-width` | 1600px |
10
+ */
11
+ export declare const Page: import("styled-components").StyledComponent<"div", any, {}, never>;
3
12
  export declare const PageContent: import("styled-components").StyledComponent<"div", any, {}, never>;
4
- export declare function Page({ children, className, }: {
5
- children: ReactNode;
6
- className?: string | undefined;
7
- }): JSX.Element;
@@ -0,0 +1,4 @@
1
+ import type { ComponentPropsWithoutRef } from 'react';
2
+ export declare const PageHeader: import("styled-components").StyledComponent<"header", any, {}, never>;
3
+ export declare const StickyPageHeader: ({ children, className, }: ComponentPropsWithoutRef<'div'>) => JSX.Element;
4
+ export declare const PageHeaderContent: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -1,3 +1,5 @@
1
1
  import { type AriaButtonProps } from '@react-aria/button';
2
2
  import { type ComponentPropsWithoutRef } from 'react';
3
- export declare function ReactAriaButton(props: AriaButtonProps & ComponentPropsWithoutRef<'button'>): JSX.Element;
3
+ export type ReactAriaButtonProps = AriaButtonProps & ComponentPropsWithoutRef<'button'>;
4
+ /** Fo internal use only! */
5
+ export declare function ReactAriaButton(props: ReactAriaButtonProps): JSX.Element;
@@ -4,8 +4,8 @@ export declare const Search: import("react").ForwardRefExoticComponent<{
4
4
  size: 'small' | 'large';
5
5
  leadingIcon?: boolean | undefined;
6
6
  hideLabel?: boolean | undefined;
7
- } & Omit<AriaSearchFieldProps, "isRequired" | "isDisabled" | "isReadOnly"> & {
8
- required?: boolean | undefined;
7
+ } & Omit<AriaSearchFieldProps, "isDisabled" | "isRequired" | "isReadOnly"> & {
9
8
  disabled?: boolean | undefined;
9
+ required?: boolean | undefined;
10
10
  readOnly?: boolean | undefined;
11
11
  } & import("react").RefAttributes<HTMLInputElement>>;
@@ -16,6 +16,7 @@ export * from './Label/Label';
16
16
  export * from './Tabs/Tabs';
17
17
  export * from './Toast/Toast';
18
18
  export * from './Page/Page';
19
+ export * from './Page/PageHeader';
19
20
  export * from './Paginator/Paginator';
20
21
  export * from './Popover/Popover';
21
22
  export * from './RadioGroup/RadioGroup';
@@ -25,7 +26,4 @@ export * from './Switch/Switch';
25
26
  export * from './Text/Text';
26
27
  export * from './Title/Title';
27
28
  export * from './Tooltip/Tooltip';
28
- export * from './MultiSelect/MultiSelect';
29
- export * from './SingleSelect/SingleSelect';
30
- export * from './Input/TimeInput/TimeInput';
31
29
  export * from './Tooltip/IconTooltip';
@@ -0,0 +1 @@
1
+ export declare const srOnly: import("styled-components").FlattenSimpleInterpolation;
@@ -1,4 +1,3 @@
1
- import type { AriaFieldProps } from '@react-aria/label';
2
1
  import type { ComponentPropsWithoutRef, ElementType } from 'react';
3
2
  declare module 'csstype' {
4
3
  interface Properties {
@@ -15,13 +14,6 @@ export type RenameMissuffixedProps<InputProps extends Record<PropertyKey, any>,
15
14
  [S in MisnamedKeys as RemoveSuffix<S, Suffix>]?: InputProps[S];
16
15
  };
17
16
  /** Get a type warning when an `errorMessage` is passed without a `validationState` prop. */
18
- export type InputValidationProps = {
19
- validationState: AriaFieldProps['validationState'];
20
- errorMessage?: AriaFieldProps['errorMessage'];
21
- } | {
22
- validationState?: never;
23
- errorMessage?: never;
24
- };
25
17
  type MisprefixedBooleanProps = 'isDisabled' | 'isRequired' | 'isReadOnly';
26
18
  /** renames `isDisabled`, `isRequired,` and `isReadonly` to `disabled`, `required,` and `readOnly` in an object type */
27
19
  export type RenameBooleanProps<InputProps extends Record<PropertyKey, any>> = RenameMisprefixedProps<InputProps, 'is', MisprefixedBooleanProps>;
@@ -1,6 +0,0 @@
1
- /// <reference types="react" />
2
- import type { ComboBoxProps } from "@react-types/combobox";
3
- export { Item, Section } from "@react-stately/collections";
4
- export declare const Wrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
5
- export declare const Label: import("styled-components").StyledComponent<"label", any, {}, never>;
6
- export declare function ComboBox<T extends object>(props: ComboBoxProps<T>): JSX.Element;
@@ -1,3 +0,0 @@
1
- /// <reference types="react" />
2
- export { Time } from '@internationalized/date';
3
- export declare function TimeInput(props: any): JSX.Element;
@@ -1,29 +0,0 @@
1
- import type { AriaListBoxOptions } from '@react-aria/listbox';
2
- import type { AriaPopoverProps } from '@react-aria/overlays';
3
- import type { ListState } from '@react-stately/list';
4
- import type { OverlayTriggerState } from '@react-stately/overlays';
5
- import * as React from 'react';
6
- import { MultiSelectState } from 'components/MultiSelect/useMultiSelectState';
7
- interface ListBoxProps extends AriaListBoxOptions<unknown> {
8
- listBoxRef?: React.RefObject<HTMLUListElement>;
9
- state: ListState<unknown>;
10
- }
11
- interface MultiSelectListBoxProps extends AriaListBoxOptions<unknown> {
12
- listBoxRef?: React.RefObject<HTMLUListElement>;
13
- state: MultiSelectState<unknown>;
14
- }
15
- export declare function ListBox(props: ListBoxProps): JSX.Element;
16
- export declare function MultiSelectListBox(props: MultiSelectListBoxProps): JSX.Element;
17
- export declare function Label({ children }: {
18
- children: React.ReactNode;
19
- }): JSX.Element;
20
- export declare function Description({ children }: {
21
- children: React.ReactNode;
22
- }): JSX.Element;
23
- interface PopoverProps extends Omit<AriaPopoverProps, 'popoverRef'> {
24
- children: React.ReactNode;
25
- state: OverlayTriggerState;
26
- popoverRef?: React.RefObject<HTMLDivElement>;
27
- }
28
- export declare function Popover(props: PopoverProps): JSX.Element;
29
- export {};
@@ -1,4 +0,0 @@
1
- export declare const timezones: {
2
- name: string;
3
- key: string;
4
- }[];
@@ -1,60 +0,0 @@
1
- import { CollectionChildren } from "@react-types/shared";
2
- import React from "react";
3
- import { useMultiSelectState } from "./useMultiSelectState";
4
- export { Item as MultiSelectItem, Section as MultiSelectSection } from "@react-stately/collections";
5
- export type OptionItem = {
6
- children?: never;
7
- id: string;
8
- name: string | React.ReactNode;
9
- /** Textual representation of `name` in case it is not a string. Used for searching. */
10
- textValue?: string;
11
- /** Allow additional properties for an option. */
12
- [prop: string]: unknown;
13
- };
14
- type OptionSection = {
15
- children: OptionItem[];
16
- name: string;
17
- };
18
- export type Option = OptionItem | OptionSection;
19
- type MultiSelectProps = {
20
- /** Whether the element should receive focus on render. */
21
- autoFocus?: boolean;
22
- children: CollectionChildren<Option>;
23
- /** Sets the CSS [`className`](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. */
24
- className?: string;
25
- /** Sets the default open state of the field (uncontrolled). */
26
- defaultOpen?: boolean;
27
- /** The initial selected keys in the collection (uncontrolled). */
28
- defaultSelectedKeys?: Parameters<typeof useMultiSelectState>["0"]["defaultSelectedKeys"];
29
- /** The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with. */
30
- disabledKeys?: Parameters<typeof useMultiSelectState>["0"]["disabledKeys"];
31
- excludeFromTabOrder?: boolean;
32
- items: Option[];
33
- /** Whether the field can be emptied. */
34
- isClearable?: boolean;
35
- /** Whether the field is disabled. */
36
- isDisabled?: boolean;
37
- /** Whether to show a button to select all items. */
38
- isSelectableAll?: boolean;
39
- /** Sets the open state of the field (controlled). */
40
- isOpen?: boolean;
41
- /** The content to display as the label. */
42
- label?: string;
43
- /** The content to display as the placeholder. */
44
- placeholder?: string;
45
- /** Handler that is called when the select's open state changes. */
46
- onOpenChange?: Parameters<typeof useMultiSelectState>["0"]["onOpenChange"];
47
- /** Handler that is called when the selection changes. */
48
- onSelectionChange?: Parameters<typeof useMultiSelectState>["0"]["onSelectionChange"];
49
- /** The currently selected keys in the collection (controlled). */
50
- selectedKeys?: Parameters<typeof useMultiSelectState>["0"]["selectedKeys"];
51
- /** The type of selection that is allowed in the collection. */
52
- selectionMode: "single" | "multiple";
53
- tooltipContent?: string;
54
- tooltipIcon?: string;
55
- };
56
- export declare const MultiSelectComponent: React.ForwardRefExoticComponent<MultiSelectProps & React.RefAttributes<HTMLButtonElement>>;
57
- export declare const MultiSelect: React.ForwardRefExoticComponent<MultiSelectProps & {
58
- /** Item objects in the collection. */
59
- options: Option[];
60
- } & React.RefAttributes<HTMLButtonElement>>;
@@ -1,9 +0,0 @@
1
- import * as React from "react";
2
- import type { AriaListBoxOptions } from "@react-aria/listbox";
3
- import type { MultiSelectState } from "./useMultiSelectState";
4
- interface ListBoxProps<T> extends AriaListBoxOptions<T> {
5
- listBoxRef?: React.RefObject<HTMLUListElement>;
6
- state: MultiSelectState<T>;
7
- }
8
- export declare const MultiSelectListBox: <T>(props: ListBoxProps<T>) => JSX.Element;
9
- export {};
@@ -1,10 +0,0 @@
1
- import * as React from "react";
2
- type PopoverProps = {
3
- children: React.ReactNode;
4
- className?: string;
5
- isOpen?: boolean;
6
- onClose: () => void;
7
- triggerRef: React.RefObject<HTMLButtonElement>;
8
- };
9
- export declare const Popover: React.VFC<PopoverProps>;
10
- export {};
@@ -1,21 +0,0 @@
1
- import { AriaListBoxOptions } from "@react-aria/listbox";
2
- import { HTMLAttributes, RefObject } from "react";
3
- import type { AriaButtonProps } from "@react-types/button";
4
- import type { AriaSelectProps } from "@react-types/select";
5
- import type { MultiSelectProps as MultiSelectStateProps, MultiSelectState } from "./useMultiSelectState";
6
- type MultiSelectProps<T> = Omit<AriaSelectProps<T>, "onSelectionChange"> & {
7
- disallowEmptySelection?: boolean;
8
- onSelectionChange?: MultiSelectStateProps<T>["onSelectionChange"];
9
- };
10
- interface MultiSelectAria<T> {
11
- /** Props for the label element. */
12
- labelProps: HTMLAttributes<HTMLElement>;
13
- /** Props for the popup trigger element. */
14
- triggerProps: AriaButtonProps;
15
- /** Props for the element representing the selected value. */
16
- valueProps: HTMLAttributes<HTMLElement>;
17
- /** Props for the popup. */
18
- menuProps: AriaListBoxOptions<unknown>;
19
- }
20
- export declare function useMultiSelect<T>(props: MultiSelectProps<T>, state: MultiSelectState<T>, ref: RefObject<HTMLElement>): MultiSelectAria<T>;
21
- export {};
@@ -1,17 +0,0 @@
1
- import { ListState } from "@react-stately/list";
2
- import { CollectionBase, MultipleSelection, Node } from "@react-types/shared";
3
- import { Key } from "react";
4
- export interface MultiSelectListProps<T> extends CollectionBase<T>, MultipleSelection {
5
- filter?: (nodes: Iterable<Node<T>>) => Iterable<Node<T>>;
6
- }
7
- export interface MultiSelectListState<T> extends ListState<T> {
8
- /** The keys for the currently selected items. */
9
- selectedKeys: Set<Key>;
10
- /** Sets the selected keys. */
11
- setSelectedKeys(keys: Iterable<Key>): void;
12
- /** The value of the currently selected items. */
13
- selectedItems: Node<T>[] | null;
14
- /** The type of selection. */
15
- selectionMode: MultipleSelection["selectionMode"];
16
- }
17
- export declare function useMultiSelectListState<T extends {}>(props: MultiSelectListProps<T>): MultiSelectListState<T>;
@@ -1,18 +0,0 @@
1
- import { MenuTriggerState } from "@react-stately/menu";
2
- import { MultiSelectListState } from "./useMultiSelectListState";
3
- import type { OverlayTriggerProps } from "@react-types/overlays";
4
- import type { AsyncLoadable, CollectionBase, FocusableProps, InputBase, LabelableProps, MultipleSelection, TextInputBase, Validation } from "@react-types/shared";
5
- export interface MultiSelectProps<T> extends CollectionBase<T>, AsyncLoadable, Omit<InputBase, "isReadOnly">, Validation, LabelableProps, TextInputBase, MultipleSelection, FocusableProps, OverlayTriggerProps {
6
- /**
7
- * Whether the menu should automatically flip direction when space is limited.
8
- * @default true
9
- */
10
- shouldFlip?: boolean;
11
- }
12
- export interface MultiSelectState<T> extends MultiSelectListState<T>, MenuTriggerState {
13
- /** Whether the select is currently focused. */
14
- isFocused: boolean;
15
- /** Sets whether the select is focused. */
16
- setFocused(isFocused: boolean): void;
17
- }
18
- export declare function useMultiSelectState<T extends {}>(props: MultiSelectProps<T>): MultiSelectState<T>;
@@ -1,9 +0,0 @@
1
- /// <reference types="react" />
2
- import type { AriaSelectProps } from "@react-types/select";
3
- export { Item as SingleSelectItem, Section as SingleSelectSection } from "@react-stately/collections";
4
- type SingleSelectProps<T> = AriaSelectProps<T> & {
5
- placeholder?: string;
6
- tooltipIcon?: string;
7
- tooltipContent?: string;
8
- };
9
- export declare function AriaSingleSelect<T extends object>(props: SingleSelectProps<T>): JSX.Element;