mirror of
https://github.com/nextui-org/nextui.git
synced 2025-12-08 19:26:11 +00:00
fix: onSelectionChange type incorrect (#3336)
* fix: onSelectionChange type incorrect * feat: export shardSelection * fix: typo * fix: review --------- Co-authored-by: WK Wong <wingkwong.code@gmail.com>
This commit is contained in:
winches
GitHub
parent
5652e7bddc
commit
0cdfdb48bc
8
.changeset/chilled-worms-develop.md
Normal file
8
.changeset/chilled-worms-develop.md
Normal file
@ -0,0 +1,8 @@
|
||||
---
|
||||
"@nextui-org/dropdown": patch
|
||||
"@nextui-org/menu": patch
|
||||
"@nextui-org/select": patch
|
||||
"@nextui-org/system-rsc": patch
|
||||
---
|
||||
|
||||
Fix onSelectionChange type incorrect (#2512)
|
||||
@ -322,9 +322,9 @@ you to customize each item individually.
|
||||
| variant | `solid` \| `bordered` \| `light` \| `flat` \| `faded` \| `shadow` | The dropdown items appearance style. | `solid` |
|
||||
| color | `default` \| `primary` \| `secondary` \| `success` \| `warning` \| `danger` | The dropdown items color theme. | `default` |
|
||||
| selectionMode | `none` \| `single` \| `multiple` | The type of selection that is allowed in the collection. | - |
|
||||
| selectedKeys | `React.Key[]` | The currently selected keys in the collection (controlled). | - |
|
||||
| disabledKeys | `React.Key[]` | The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with. | - |
|
||||
| defaultSelectedKeys | `all` \| `React.Key[]` | The initial selected keys in the collection (uncontrolled). | - |
|
||||
| selectedKeys | `all` \| `Iterable<React.Key>` | The currently selected keys in the collection (controlled). | - |
|
||||
| disabledKeys | `Iterable<React.Key>` | The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with. | - |
|
||||
| defaultSelectedKeys | `all` \| `Iterable<React.Key>` | The initial selected keys in the collection (uncontrolled). | - |
|
||||
| disallowEmptySelection | `boolean` | Whether the collection allows empty selection. | `false` |
|
||||
| autoFocus | `boolean` \| `first` \| `last` | Where the focus should be set. | `false` |
|
||||
| topContent | `ReactNode` | The content to display above the listbox items. | - |
|
||||
@ -343,7 +343,7 @@ you to customize each item individually.
|
||||
| Attribute | Type | Description |
|
||||
| ----------------- | ----------------------------- | -------------------------------------------------------------------------- |
|
||||
| onAction | `(key: React.Key) => void` | Handler that is called when an item is selected. |
|
||||
| onSelectionChange | `(keys: React.Key[]) => void` | Handler that is called when the selection changes. |
|
||||
| onSelectionChange | `(keys: "all" \| Set<React.Key> & {anchorKey?: string; currentKey?: string}) => void` | Handler that is called when the selection changes. |
|
||||
| onClose | `() => void` | Handler that is called when the menu should close after selecting an item. |
|
||||
|
||||
---
|
||||
|
||||
@ -359,9 +359,9 @@ the popover and listbox components.
|
||||
| children\* | `ReactNode[]` | The children to render. Usually a list of `SelectItem` and `SelectSection` elements. | - |
|
||||
| items | [`Iterable<T>`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | Item objects in the select. (dynamic) | - |
|
||||
| selectionMode | `single` \| `multiple` | The type of selection that is allowed in the collection. | - |
|
||||
| selectedKeys | `all` \| `React.Key[]` | The currently selected keys in the collection (controlled). | - |
|
||||
| disabledKeys | `all` \| `React.Key[]` | The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with. | - |
|
||||
| defaultSelectedKeys | `all` \| `React.Key[]` | The initial selected keys in the collection (uncontrolled). | - |
|
||||
| selectedKeys | `all` \| `Iterable<React.Key>` | The currently selected keys in the collection (controlled). | - |
|
||||
| disabledKeys | `Iterable<React.Key>` | The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with. | - |
|
||||
| defaultSelectedKeys | `all` \| `Iterable<React.Key>` | The initial selected keys in the collection (uncontrolled). | - |
|
||||
| variant | `flat` \| `bordered` \| `faded` \| `underlined` | The variant of the select. | `flat` |
|
||||
| color | `default` \| `primary` \| `secondary` \| `success` \| `warning` \| `danger` | The color of the select. | `default` |
|
||||
| size | `sm` \| `md` \| `lg` | The size of the select. | `md` |
|
||||
@ -400,7 +400,7 @@ the popover and listbox components.
|
||||
| ----------------- | --------------------------------------------- | ------------------------------------------------------------------------------------ |
|
||||
| onClose | `() => void` | Callback fired when the select popover is closed. |
|
||||
| onOpenChange | `(isOpen: boolean) => void` | Callback fired when the select popover is opened or closed. |
|
||||
| onSelectionChange | `(keys: React.Key[]) => void` | Callback fired when the selected keys change. |
|
||||
| onSelectionChange | `(keys: "all" \| Set<React.Key> & {anchorKey?: string; currentKey?: string}) => void` | Callback fired when the selected keys change. |
|
||||
| onChange | `React.ChangeEvent<HTMLSelectElement>` | Native select change event, fired when the selected value changes. |
|
||||
| renderValue | [RenderValueFunction](#render-value-function) | Function to render the value of the select. It renders the selected item by default. |
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import type {HTMLNextUIProps, PropGetter} from "@nextui-org/system";
|
||||
import type {HTMLNextUIProps, PropGetter, SharedSelection} from "@nextui-org/system";
|
||||
|
||||
import {useProviderContext} from "@nextui-org/system";
|
||||
import {AriaMenuProps} from "@react-types/menu";
|
||||
@ -83,11 +83,15 @@ interface Props<T> {
|
||||
* The menu items classNames.
|
||||
*/
|
||||
itemClasses?: MenuItemProps["classNames"];
|
||||
/**
|
||||
* Handler that is called when the selection changes.
|
||||
*/
|
||||
onSelectionChange?: (keys: SharedSelection) => void;
|
||||
}
|
||||
|
||||
export type UseMenuProps<T = object> = Props<T> &
|
||||
Omit<HTMLNextUIProps<"ul">, keyof AriaMenuProps<T>> &
|
||||
AriaMenuProps<T> &
|
||||
Omit<AriaMenuProps<T>, "onSelectionChange"> &
|
||||
MenuVariantProps;
|
||||
|
||||
export function useMenu<T extends object>(props: UseMenuProps<T>) {
|
||||
|
||||
@ -6,6 +6,7 @@ import {
|
||||
HTMLNextUIProps,
|
||||
mapPropsVariants,
|
||||
PropGetter,
|
||||
SharedSelection,
|
||||
useProviderContext,
|
||||
} from "@nextui-org/system";
|
||||
import {select} from "@nextui-org/theme";
|
||||
@ -128,6 +129,10 @@ interface Props<T> extends Omit<HTMLNextUIProps<"select">, keyof SelectVariantPr
|
||||
* Classes object to style the select and its children.
|
||||
*/
|
||||
classNames?: SlotsToClasses<SelectSlots>;
|
||||
/**
|
||||
* Handler that is called when the selection changes.
|
||||
*/
|
||||
onSelectionChange?: (keys: SharedSelection) => void;
|
||||
}
|
||||
|
||||
interface SelectData {
|
||||
@ -139,8 +144,11 @@ interface SelectData {
|
||||
|
||||
export const selectData = new WeakMap<MultiSelectState<any>, SelectData>();
|
||||
|
||||
export type UseSelectProps<T> = Omit<Props<T>, keyof MultiSelectProps<T>> &
|
||||
MultiSelectProps<T> &
|
||||
export type UseSelectProps<T> = Omit<
|
||||
Props<T>,
|
||||
keyof Omit<MultiSelectProps<T>, "onSelectionChange">
|
||||
> &
|
||||
Omit<MultiSelectProps<T>, "onSelectionChange"> &
|
||||
SelectVariantProps;
|
||||
|
||||
export function useSelect<T extends object>(originalProps: UseSelectProps<T>) {
|
||||
|
||||
@ -12,6 +12,7 @@ export type {
|
||||
Merge,
|
||||
HTMLNextUIProps,
|
||||
PropGetter,
|
||||
SharedSelection,
|
||||
} from "./types";
|
||||
|
||||
export {
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
* Part of this code is taken from @chakra-ui/system ❤️
|
||||
*/
|
||||
|
||||
import {Selection as AriaSharedSelection} from "@react-types/shared";
|
||||
|
||||
export type As<Props = any> = React.ElementType<Props>;
|
||||
export type DOMElements = keyof JSX.IntrinsicElements;
|
||||
export type CapitalizedDOMElements = Capitalize<DOMElements>;
|
||||
@ -79,3 +81,8 @@ export type PropGetter<P = Record<string, unknown>, R = DOMAttributes> = (
|
||||
props?: Merge<DOMAttributes, P>,
|
||||
ref?: React.Ref<any>,
|
||||
) => R & React.RefAttributes<any>;
|
||||
|
||||
export type SharedSelection = AriaSharedSelection & {
|
||||
anchorKey?: string;
|
||||
currentKey?: string;
|
||||
};
|
||||
|
||||
@ -15,6 +15,7 @@ export type {
|
||||
ExtendVariantProps,
|
||||
ExtendVariantWithSlotsProps,
|
||||
ExtendVariants,
|
||||
SharedSelection,
|
||||
} from "@nextui-org/system-rsc";
|
||||
|
||||
export {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user