@sproutsocial/seeds-react-menu 0.3.0 → 0.4.0
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/.turbo/turbo-build.log +10 -10
- package/CHANGELOG.md +15 -0
- package/dist/esm/index.js +234 -80
- package/dist/esm/index.js.map +1 -1
- package/dist/index.d.mts +43 -17
- package/dist/index.d.ts +43 -17
- package/dist/index.js +228 -72
- package/dist/index.js.map +1 -1
- package/package.json +3 -1
- package/src/Autocomplete/Autocomplete.feature +14 -43
- package/src/Autocomplete/Autocomplete.stories.tsx +128 -0
- package/src/Autocomplete/Autocomplete.tsx +29 -11
- package/src/Autocomplete/AutocompleteInput.tsx +51 -0
- package/src/Autocomplete/AutocompleteTypes.ts +8 -1
- package/src/Autocomplete/__tests__/Autocomplete.test.tsx +142 -89
- package/src/Autocomplete/__tests__/Autocomplete.typetest.tsx +25 -43
- package/src/Autocomplete/index.ts +1 -0
- package/src/MenuContext.tsx +11 -5
- package/src/MenuGroup/MenuGroup.feature +6 -24
- package/src/MenuGroup/MenuGroup.tsx +12 -1
- package/src/MenuGroup/MenuGroupTypes.ts +4 -1
- package/src/MenuGroup/__tests__/MenuGroup.test.tsx +41 -18
- package/src/MenuGroup/__tests__/MenuGroup.typetest.tsx +4 -2
- package/src/MenuItem/MenuItem.tsx +8 -5
- package/src/MenuLabel.tsx +4 -4
- package/src/MenuRoot/MenuRoot.tsx +5 -3
- package/src/SingleSelectMenu/SingleSelectMenu.tsx +2 -2
- package/src/__fixtures__/menu-test-data.ts +36 -0
- package/src/__tests__/Menu.test.tsx +29 -96
- package/src/hooks/useItemsFromChildren.tsx +70 -27
- package/src/index.ts +1 -0
- package/src/reducers/useComboboxStateReducer.tsx +11 -8
- package/src/storybookUtilities/menu-storybook-components.tsx +39 -0
- package/src/types.ts +1 -0
package/dist/index.d.mts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as downshift from 'downshift';
|
|
3
|
-
import { GetItemPropsOptions, UseComboboxProps, UseSelectProps, UseMultipleSelectionProps, UseComboboxReturnValue, UseSelectReturnValue, UseMultipleSelectionReturnValue } from 'downshift';
|
|
3
|
+
import { GetItemPropsOptions, UseComboboxProps, UseSelectProps, UseMultipleSelectionProps, UseComboboxReturnValue, UseSelectReturnValue, UseMultipleSelectionReturnValue, UseComboboxGetInputPropsOptions } from 'downshift';
|
|
4
4
|
import * as React$1 from 'react';
|
|
5
5
|
import React__default, { ReactNode } from 'react';
|
|
6
6
|
import { TypeBorderSystemProps, TypeColorSystemProps, TypeFlexboxSystemProps, TypeGridSystemProps, TypeLayoutSystemProps, TypePositionSystemProps, TypeSpaceSystemProps, TypeTypographySystemProps, TypeStyledComponentsCommonProps } from '@sproutsocial/seeds-react-system-props';
|
|
@@ -9,9 +9,10 @@ import { HTMLMotionProps } from 'motion/react';
|
|
|
9
9
|
import { TypeBoxProps } from '@sproutsocial/seeds-react-box';
|
|
10
10
|
export { TypeBoxProps as TypeMenuFooterProps } from '@sproutsocial/seeds-react-box';
|
|
11
11
|
import * as _sproutsocial_seeds_react_text from '@sproutsocial/seeds-react-text';
|
|
12
|
-
import { TypeTextProps } from '@sproutsocial/seeds-react-text';
|
|
13
12
|
import { TypePopoutProps } from '@sproutsocial/seeds-react-popout';
|
|
13
|
+
import { TypeLabelProps } from '@sproutsocial/seeds-react-label';
|
|
14
14
|
import { TypeButtonProps } from '@sproutsocial/seeds-react-button';
|
|
15
|
+
import { TypeInputProps } from '@sproutsocial/seeds-react-input';
|
|
15
16
|
|
|
16
17
|
declare const MENU_ITEM_ROLES: {
|
|
17
18
|
readonly MENUITEM: "menuitem";
|
|
@@ -28,7 +29,9 @@ interface TypeMenuGroupProps extends TypeMenuGroupStyledProps, Omit<React.Compon
|
|
|
28
29
|
id: string;
|
|
29
30
|
isSingleSelect?: boolean;
|
|
30
31
|
title?: string;
|
|
31
|
-
children
|
|
32
|
+
children?: ReactNode;
|
|
33
|
+
items?: TypeMenuItemProps[];
|
|
34
|
+
MenuItemComponent?: typeof MenuItem;
|
|
32
35
|
titleAs?: string | React.ComponentType<any>;
|
|
33
36
|
}
|
|
34
37
|
|
|
@@ -51,7 +54,7 @@ interface TypeMenuGroupProps extends TypeMenuGroupStyledProps, Omit<React.Compon
|
|
|
51
54
|
*
|
|
52
55
|
* @see {@link https://seeds.sproutsocial.com/components/menu-item/ | MenuItem}
|
|
53
56
|
*/
|
|
54
|
-
declare const MenuGroup: ({ titleAs, children, title, color, isSingleSelect, id, ...rest }: TypeMenuGroupProps) => react_jsx_runtime.JSX.Element;
|
|
57
|
+
declare const MenuGroup: ({ titleAs, children: childrenProp, title, color, isSingleSelect, id, items, MenuItemComponent, ...rest }: TypeMenuGroupProps) => react_jsx_runtime.JSX.Element | null;
|
|
55
58
|
|
|
56
59
|
declare const StyledMenuGroup: styled_components.StyledComponent<"li", styled_components.DefaultTheme, TypeMenuGroupProps, never>;
|
|
57
60
|
declare const StyledTitle: styled_components.StyledComponent<React$1.FC<_sproutsocial_seeds_react_text.TypeTextProps>, styled_components.DefaultTheme, {}, never>;
|
|
@@ -61,6 +64,7 @@ interface TypeDefaultItemProps {
|
|
|
61
64
|
id: string;
|
|
62
65
|
index: number;
|
|
63
66
|
disabled?: boolean;
|
|
67
|
+
hidden?: boolean;
|
|
64
68
|
menuItemProps?: TypeMenuItemProps;
|
|
65
69
|
menuGroupProps?: TypeMenuGroupProps;
|
|
66
70
|
}
|
|
@@ -166,6 +170,9 @@ type TypeDonwshiftSharedReturnValue = "getLabelProps" | "getToggleButtonProps" |
|
|
|
166
170
|
type TypeDonwshiftSharedProps = "onHighlightedIndexChange" | "onIsOpenChange" | "onSelectedItemChange" | "onStateChange" | "stateReducer";
|
|
167
171
|
interface TypeMenuContextProps extends Omit<TypeDownshiftComboboxReturnValue, TypeDonwshiftSharedReturnValue>, Omit<TypeDownshiftComboboxProps, TypeDonwshiftSharedProps>, Omit<TypeDownshiftSelectReturnValue, TypeDonwshiftSharedReturnValue>, Omit<TypeDownshiftSelectProps, TypeDonwshiftSharedProps>, TypeDownshiftMultiSelectReturnValue, TypeDownshiftMultiSelectProps {
|
|
168
172
|
items: TypeDefaultItemProps[];
|
|
173
|
+
itemsMap?: {
|
|
174
|
+
[key: string]: TypeDefaultItemProps;
|
|
175
|
+
};
|
|
169
176
|
isListbox?: boolean;
|
|
170
177
|
onHighlightedIndexChange?: TypeDownshiftComboboxProps["onHighlightedIndexChange"] | TypeDownshiftSelectProps["onHighlightedIndexChange"];
|
|
171
178
|
onIsOpenChange?: TypeDownshiftComboboxProps["onIsOpenChange"] | TypeDownshiftSelectProps["onIsOpenChange"];
|
|
@@ -181,13 +188,14 @@ interface TypeMenuContext extends TypeMenuContextProps {
|
|
|
181
188
|
[key: string]: TypeDefaultItemProps;
|
|
182
189
|
};
|
|
183
190
|
}
|
|
184
|
-
interface TypeMenuProviderProps
|
|
191
|
+
interface TypeMenuProviderProps {
|
|
185
192
|
children: TypeNotEmptyChildren;
|
|
193
|
+
menuProps: Partial<TypeMenuContextProps>;
|
|
186
194
|
}
|
|
187
195
|
/**
|
|
188
196
|
* Hook for initializing Menu context
|
|
189
197
|
*/
|
|
190
|
-
declare const useMenu: ({ items, isListbox, isOpen, ...rest }?: Partial<TypeMenuContextProps>) => TypeMenuContext;
|
|
198
|
+
declare const useMenu: ({ items, isListbox, isOpen, itemsMap: itemsMapFromProps, ...rest }?: Partial<TypeMenuContextProps>) => TypeMenuContext;
|
|
191
199
|
/**
|
|
192
200
|
* MenuContext factory, sets the type and the initial object
|
|
193
201
|
*/
|
|
@@ -195,7 +203,7 @@ declare const MenuContext: React__default.Context<TypeMenuContext>;
|
|
|
195
203
|
/**
|
|
196
204
|
* Provider Component sets the context values into the provider
|
|
197
205
|
*/
|
|
198
|
-
declare const MenuProvider: ({ children,
|
|
206
|
+
declare const MenuProvider: ({ children, menuProps, }: TypeMenuProviderProps) => react_jsx_runtime.JSX.Element;
|
|
199
207
|
/**
|
|
200
208
|
* Utility hook for consuming MenuContext
|
|
201
209
|
*/
|
|
@@ -206,16 +214,16 @@ interface TypeMenuRootOwnProps {
|
|
|
206
214
|
popoutProps?: Partial<Omit<TypePopoutProps, "isOpen" | "setIsOpen" | "content" | "children">>;
|
|
207
215
|
width?: TypePopoutProps["width"];
|
|
208
216
|
}
|
|
209
|
-
interface TypeMenuRootProps extends Partial<TypeMenuProviderProps>, TypeMenuRootOwnProps {
|
|
217
|
+
interface TypeMenuRootProps extends Partial<TypeMenuProviderProps["menuProps"]>, Pick<TypeMenuProviderProps, "children">, TypeMenuRootOwnProps {
|
|
210
218
|
}
|
|
211
219
|
/**
|
|
212
220
|
* @link https://seeds.sproutsocial.com/components/menu-root/
|
|
213
221
|
*
|
|
214
222
|
* @description MenuRoot is a utility component used to handle {@link https://github.com/sproutsocial/seeds/blob/dev/seeds-react/seeds-react-menu/src/MenuContext.tsx | MenuContext}. This component should rarely, if ever, be used directly unless building a custom menu type.
|
|
215
223
|
*/
|
|
216
|
-
declare const MenuRoot: ({ children, menuToggleElement, popoutProps, width, ...contextProps }: TypeMenuRootProps) => react_jsx_runtime.JSX.Element;
|
|
224
|
+
declare const MenuRoot: ({ children, menuToggleElement, popoutProps: { focusLockProps, ...popoutProps }, width, ...contextProps }: TypeMenuRootProps) => react_jsx_runtime.JSX.Element;
|
|
217
225
|
|
|
218
|
-
declare const MenuLabel: ({ children, ...rest }:
|
|
226
|
+
declare const MenuLabel: ({ children, ...rest }: Partial<TypeLabelProps>) => react_jsx_runtime.JSX.Element;
|
|
219
227
|
|
|
220
228
|
interface TypeMenuToggleButtonProps extends Partial<TypeButtonProps> {
|
|
221
229
|
children: ReactNode;
|
|
@@ -265,15 +273,33 @@ interface TypeMultiSelectMenuProps extends TypeMenuRootOwnProps, TypeDownshiftSe
|
|
|
265
273
|
*/
|
|
266
274
|
declare const MultiSelectMenu: ({ children, stateReducer: externalStateReducer, getA11yMultiStatusMessage, onMultiSelectStateChange, multiSelectStateReducer, ...useSelectProps }: TypeMultiSelectMenuProps) => react_jsx_runtime.JSX.Element;
|
|
267
275
|
|
|
276
|
+
interface TypeAutocompleteProps extends TypeMenuRootOwnProps, TypeDownshiftComboboxProps {
|
|
277
|
+
children: TypeMenuRootProps["children"];
|
|
278
|
+
getIsItemVisible?: (item: TypeMenuContext["items"][number], inputValue: string) => boolean;
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
/**
|
|
282
|
+
* @link https://seeds.sproutsocial.com/components/multiselect-menu/
|
|
283
|
+
*
|
|
284
|
+
* @description A Autocomplete allows multiple {@link https://github.com/sproutsocial/seeds/tree/dev/seeds-react/seeds-react-menu/src/MenuItem | MenuItems} to be selected from a list or groups of lists.
|
|
285
|
+
*
|
|
286
|
+
* @see {@link https://seeds.sproutsocial.com/components/menu-group/ | MenuGroup}
|
|
287
|
+
*/
|
|
288
|
+
declare const Autocomplete: ({ children, stateReducer: externalStateReducer, itemToString, getIsItemVisible, ...useComboboxProps }: TypeAutocompleteProps) => react_jsx_runtime.JSX.Element;
|
|
289
|
+
|
|
290
|
+
type TypeInputEventListeners = "onKeyDown" | "onChange" | "onInput" | "onBlur" | "onClick" | "refKey";
|
|
291
|
+
interface TypeAutocompleteInputProps extends Pick<UseComboboxGetInputPropsOptions, TypeInputEventListeners>, Omit<Partial<TypeInputProps>, TypeInputEventListeners> {
|
|
292
|
+
}
|
|
293
|
+
declare const AutocompleteInput: ({ onKeyDown, onChange, onInput, onBlur, onClick, inputProps, ...rest }: TypeAutocompleteInputProps) => react_jsx_runtime.JSX.Element;
|
|
294
|
+
|
|
268
295
|
interface TypeUseItemsFromChildrenProps {
|
|
269
296
|
children: ReactNode;
|
|
270
297
|
}
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
element: React__default.ReactElement<TypeMenuGroupProps>;
|
|
298
|
+
type TypeItemElement = React__default.ReactElement<TypeMenuItemProps>;
|
|
299
|
+
type TypeMenuGroupElement = React__default.ReactElement<TypeMenuGroupProps>;
|
|
300
|
+
interface TypeMenuChildren {
|
|
301
|
+
type: "item" | "group";
|
|
302
|
+
element: React__default.ReactElement<TypeMenuGroupProps> | React__default.ReactElement<TypeMenuItemProps>;
|
|
277
303
|
}
|
|
278
304
|
declare const useItemsFromChildren: ({ children, }: TypeUseItemsFromChildrenProps) => {
|
|
279
305
|
allMenuItems: TypeDefaultItemProps[];
|
|
@@ -288,4 +314,4 @@ declare const defaultUseSelectProps: {
|
|
|
288
314
|
isItemDisabled: (item: any) => boolean;
|
|
289
315
|
};
|
|
290
316
|
|
|
291
|
-
export { ActionMenu, INPUT_TYPES, type InputType, MenuContent, MenuContext, MenuFooter, MenuGroup, MenuHeader, MenuItem, MenuItemAction, MenuItemContainer, MenuItemRow, MenuItemText, MenuLabel, MenuProvider, MenuRoot, MenuToggleButton, MultiSelectMenu, SingleSelectMenu, StyledMenuGroup, StyledMenuGroupUl, StyledMenuItem, StyledTitle, type TypeActionMenuProps, type TypeDefaultItemProps, type TypeDownshiftComboboxProps, type TypeDownshiftComboboxReturnValue, type TypeDownshiftMultiSelectProps, type TypeDownshiftMultiSelectReturnValue, type TypeDownshiftSelectProps, type TypeDownshiftSelectReturnValue, type TypeItemElement, type TypeMenuContentProps, type TypeMenuContext, type TypeMenuContextProps, type TypeMenuGroupElement, type TypeMenuGroupProps, type TypeMenuGroupStyledProps, type TypeMenuHeaderProps, type TypeMenuItemProps, type TypeMenuItemStyledProps, type TypeMenuProviderProps, type TypeMenuRootOwnProps, type TypeMenuRootProps, type TypeMenuToggleButtonProps, type TypeMultiSelectMenuProps, type TypeNotEmptyChildren, type TypeSingleSelectMenuProps, type TypeUseItemsFromChildrenProps, defaultUseSelectProps, useItemsFromChildren, useMenu, useMenuContext, useSelectStateReducer };
|
|
317
|
+
export { ActionMenu, Autocomplete, AutocompleteInput, INPUT_TYPES, type InputType, MenuContent, MenuContext, MenuFooter, MenuGroup, MenuHeader, MenuItem, MenuItemAction, MenuItemContainer, MenuItemRow, MenuItemText, MenuLabel, MenuProvider, MenuRoot, MenuToggleButton, MultiSelectMenu, SingleSelectMenu, StyledMenuGroup, StyledMenuGroupUl, StyledMenuItem, StyledTitle, type TypeActionMenuProps, type TypeAutocompleteInputProps, type TypeAutocompleteProps, type TypeDefaultItemProps, type TypeDownshiftComboboxProps, type TypeDownshiftComboboxReturnValue, type TypeDownshiftMultiSelectProps, type TypeDownshiftMultiSelectReturnValue, type TypeDownshiftSelectProps, type TypeDownshiftSelectReturnValue, type TypeItemElement, type TypeMenuChildren, type TypeMenuContentProps, type TypeMenuContext, type TypeMenuContextProps, type TypeMenuGroupElement, type TypeMenuGroupProps, type TypeMenuGroupStyledProps, type TypeMenuHeaderProps, type TypeMenuItemProps, type TypeMenuItemStyledProps, type TypeMenuProviderProps, type TypeMenuRootOwnProps, type TypeMenuRootProps, type TypeMenuToggleButtonProps, type TypeMultiSelectMenuProps, type TypeNotEmptyChildren, type TypeSingleSelectMenuProps, type TypeUseItemsFromChildrenProps, defaultUseSelectProps, useItemsFromChildren, useMenu, useMenuContext, useSelectStateReducer };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as downshift from 'downshift';
|
|
3
|
-
import { GetItemPropsOptions, UseComboboxProps, UseSelectProps, UseMultipleSelectionProps, UseComboboxReturnValue, UseSelectReturnValue, UseMultipleSelectionReturnValue } from 'downshift';
|
|
3
|
+
import { GetItemPropsOptions, UseComboboxProps, UseSelectProps, UseMultipleSelectionProps, UseComboboxReturnValue, UseSelectReturnValue, UseMultipleSelectionReturnValue, UseComboboxGetInputPropsOptions } from 'downshift';
|
|
4
4
|
import * as React$1 from 'react';
|
|
5
5
|
import React__default, { ReactNode } from 'react';
|
|
6
6
|
import { TypeBorderSystemProps, TypeColorSystemProps, TypeFlexboxSystemProps, TypeGridSystemProps, TypeLayoutSystemProps, TypePositionSystemProps, TypeSpaceSystemProps, TypeTypographySystemProps, TypeStyledComponentsCommonProps } from '@sproutsocial/seeds-react-system-props';
|
|
@@ -9,9 +9,10 @@ import { HTMLMotionProps } from 'motion/react';
|
|
|
9
9
|
import { TypeBoxProps } from '@sproutsocial/seeds-react-box';
|
|
10
10
|
export { TypeBoxProps as TypeMenuFooterProps } from '@sproutsocial/seeds-react-box';
|
|
11
11
|
import * as _sproutsocial_seeds_react_text from '@sproutsocial/seeds-react-text';
|
|
12
|
-
import { TypeTextProps } from '@sproutsocial/seeds-react-text';
|
|
13
12
|
import { TypePopoutProps } from '@sproutsocial/seeds-react-popout';
|
|
13
|
+
import { TypeLabelProps } from '@sproutsocial/seeds-react-label';
|
|
14
14
|
import { TypeButtonProps } from '@sproutsocial/seeds-react-button';
|
|
15
|
+
import { TypeInputProps } from '@sproutsocial/seeds-react-input';
|
|
15
16
|
|
|
16
17
|
declare const MENU_ITEM_ROLES: {
|
|
17
18
|
readonly MENUITEM: "menuitem";
|
|
@@ -28,7 +29,9 @@ interface TypeMenuGroupProps extends TypeMenuGroupStyledProps, Omit<React.Compon
|
|
|
28
29
|
id: string;
|
|
29
30
|
isSingleSelect?: boolean;
|
|
30
31
|
title?: string;
|
|
31
|
-
children
|
|
32
|
+
children?: ReactNode;
|
|
33
|
+
items?: TypeMenuItemProps[];
|
|
34
|
+
MenuItemComponent?: typeof MenuItem;
|
|
32
35
|
titleAs?: string | React.ComponentType<any>;
|
|
33
36
|
}
|
|
34
37
|
|
|
@@ -51,7 +54,7 @@ interface TypeMenuGroupProps extends TypeMenuGroupStyledProps, Omit<React.Compon
|
|
|
51
54
|
*
|
|
52
55
|
* @see {@link https://seeds.sproutsocial.com/components/menu-item/ | MenuItem}
|
|
53
56
|
*/
|
|
54
|
-
declare const MenuGroup: ({ titleAs, children, title, color, isSingleSelect, id, ...rest }: TypeMenuGroupProps) => react_jsx_runtime.JSX.Element;
|
|
57
|
+
declare const MenuGroup: ({ titleAs, children: childrenProp, title, color, isSingleSelect, id, items, MenuItemComponent, ...rest }: TypeMenuGroupProps) => react_jsx_runtime.JSX.Element | null;
|
|
55
58
|
|
|
56
59
|
declare const StyledMenuGroup: styled_components.StyledComponent<"li", styled_components.DefaultTheme, TypeMenuGroupProps, never>;
|
|
57
60
|
declare const StyledTitle: styled_components.StyledComponent<React$1.FC<_sproutsocial_seeds_react_text.TypeTextProps>, styled_components.DefaultTheme, {}, never>;
|
|
@@ -61,6 +64,7 @@ interface TypeDefaultItemProps {
|
|
|
61
64
|
id: string;
|
|
62
65
|
index: number;
|
|
63
66
|
disabled?: boolean;
|
|
67
|
+
hidden?: boolean;
|
|
64
68
|
menuItemProps?: TypeMenuItemProps;
|
|
65
69
|
menuGroupProps?: TypeMenuGroupProps;
|
|
66
70
|
}
|
|
@@ -166,6 +170,9 @@ type TypeDonwshiftSharedReturnValue = "getLabelProps" | "getToggleButtonProps" |
|
|
|
166
170
|
type TypeDonwshiftSharedProps = "onHighlightedIndexChange" | "onIsOpenChange" | "onSelectedItemChange" | "onStateChange" | "stateReducer";
|
|
167
171
|
interface TypeMenuContextProps extends Omit<TypeDownshiftComboboxReturnValue, TypeDonwshiftSharedReturnValue>, Omit<TypeDownshiftComboboxProps, TypeDonwshiftSharedProps>, Omit<TypeDownshiftSelectReturnValue, TypeDonwshiftSharedReturnValue>, Omit<TypeDownshiftSelectProps, TypeDonwshiftSharedProps>, TypeDownshiftMultiSelectReturnValue, TypeDownshiftMultiSelectProps {
|
|
168
172
|
items: TypeDefaultItemProps[];
|
|
173
|
+
itemsMap?: {
|
|
174
|
+
[key: string]: TypeDefaultItemProps;
|
|
175
|
+
};
|
|
169
176
|
isListbox?: boolean;
|
|
170
177
|
onHighlightedIndexChange?: TypeDownshiftComboboxProps["onHighlightedIndexChange"] | TypeDownshiftSelectProps["onHighlightedIndexChange"];
|
|
171
178
|
onIsOpenChange?: TypeDownshiftComboboxProps["onIsOpenChange"] | TypeDownshiftSelectProps["onIsOpenChange"];
|
|
@@ -181,13 +188,14 @@ interface TypeMenuContext extends TypeMenuContextProps {
|
|
|
181
188
|
[key: string]: TypeDefaultItemProps;
|
|
182
189
|
};
|
|
183
190
|
}
|
|
184
|
-
interface TypeMenuProviderProps
|
|
191
|
+
interface TypeMenuProviderProps {
|
|
185
192
|
children: TypeNotEmptyChildren;
|
|
193
|
+
menuProps: Partial<TypeMenuContextProps>;
|
|
186
194
|
}
|
|
187
195
|
/**
|
|
188
196
|
* Hook for initializing Menu context
|
|
189
197
|
*/
|
|
190
|
-
declare const useMenu: ({ items, isListbox, isOpen, ...rest }?: Partial<TypeMenuContextProps>) => TypeMenuContext;
|
|
198
|
+
declare const useMenu: ({ items, isListbox, isOpen, itemsMap: itemsMapFromProps, ...rest }?: Partial<TypeMenuContextProps>) => TypeMenuContext;
|
|
191
199
|
/**
|
|
192
200
|
* MenuContext factory, sets the type and the initial object
|
|
193
201
|
*/
|
|
@@ -195,7 +203,7 @@ declare const MenuContext: React__default.Context<TypeMenuContext>;
|
|
|
195
203
|
/**
|
|
196
204
|
* Provider Component sets the context values into the provider
|
|
197
205
|
*/
|
|
198
|
-
declare const MenuProvider: ({ children,
|
|
206
|
+
declare const MenuProvider: ({ children, menuProps, }: TypeMenuProviderProps) => react_jsx_runtime.JSX.Element;
|
|
199
207
|
/**
|
|
200
208
|
* Utility hook for consuming MenuContext
|
|
201
209
|
*/
|
|
@@ -206,16 +214,16 @@ interface TypeMenuRootOwnProps {
|
|
|
206
214
|
popoutProps?: Partial<Omit<TypePopoutProps, "isOpen" | "setIsOpen" | "content" | "children">>;
|
|
207
215
|
width?: TypePopoutProps["width"];
|
|
208
216
|
}
|
|
209
|
-
interface TypeMenuRootProps extends Partial<TypeMenuProviderProps>, TypeMenuRootOwnProps {
|
|
217
|
+
interface TypeMenuRootProps extends Partial<TypeMenuProviderProps["menuProps"]>, Pick<TypeMenuProviderProps, "children">, TypeMenuRootOwnProps {
|
|
210
218
|
}
|
|
211
219
|
/**
|
|
212
220
|
* @link https://seeds.sproutsocial.com/components/menu-root/
|
|
213
221
|
*
|
|
214
222
|
* @description MenuRoot is a utility component used to handle {@link https://github.com/sproutsocial/seeds/blob/dev/seeds-react/seeds-react-menu/src/MenuContext.tsx | MenuContext}. This component should rarely, if ever, be used directly unless building a custom menu type.
|
|
215
223
|
*/
|
|
216
|
-
declare const MenuRoot: ({ children, menuToggleElement, popoutProps, width, ...contextProps }: TypeMenuRootProps) => react_jsx_runtime.JSX.Element;
|
|
224
|
+
declare const MenuRoot: ({ children, menuToggleElement, popoutProps: { focusLockProps, ...popoutProps }, width, ...contextProps }: TypeMenuRootProps) => react_jsx_runtime.JSX.Element;
|
|
217
225
|
|
|
218
|
-
declare const MenuLabel: ({ children, ...rest }:
|
|
226
|
+
declare const MenuLabel: ({ children, ...rest }: Partial<TypeLabelProps>) => react_jsx_runtime.JSX.Element;
|
|
219
227
|
|
|
220
228
|
interface TypeMenuToggleButtonProps extends Partial<TypeButtonProps> {
|
|
221
229
|
children: ReactNode;
|
|
@@ -265,15 +273,33 @@ interface TypeMultiSelectMenuProps extends TypeMenuRootOwnProps, TypeDownshiftSe
|
|
|
265
273
|
*/
|
|
266
274
|
declare const MultiSelectMenu: ({ children, stateReducer: externalStateReducer, getA11yMultiStatusMessage, onMultiSelectStateChange, multiSelectStateReducer, ...useSelectProps }: TypeMultiSelectMenuProps) => react_jsx_runtime.JSX.Element;
|
|
267
275
|
|
|
276
|
+
interface TypeAutocompleteProps extends TypeMenuRootOwnProps, TypeDownshiftComboboxProps {
|
|
277
|
+
children: TypeMenuRootProps["children"];
|
|
278
|
+
getIsItemVisible?: (item: TypeMenuContext["items"][number], inputValue: string) => boolean;
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
/**
|
|
282
|
+
* @link https://seeds.sproutsocial.com/components/multiselect-menu/
|
|
283
|
+
*
|
|
284
|
+
* @description A Autocomplete allows multiple {@link https://github.com/sproutsocial/seeds/tree/dev/seeds-react/seeds-react-menu/src/MenuItem | MenuItems} to be selected from a list or groups of lists.
|
|
285
|
+
*
|
|
286
|
+
* @see {@link https://seeds.sproutsocial.com/components/menu-group/ | MenuGroup}
|
|
287
|
+
*/
|
|
288
|
+
declare const Autocomplete: ({ children, stateReducer: externalStateReducer, itemToString, getIsItemVisible, ...useComboboxProps }: TypeAutocompleteProps) => react_jsx_runtime.JSX.Element;
|
|
289
|
+
|
|
290
|
+
type TypeInputEventListeners = "onKeyDown" | "onChange" | "onInput" | "onBlur" | "onClick" | "refKey";
|
|
291
|
+
interface TypeAutocompleteInputProps extends Pick<UseComboboxGetInputPropsOptions, TypeInputEventListeners>, Omit<Partial<TypeInputProps>, TypeInputEventListeners> {
|
|
292
|
+
}
|
|
293
|
+
declare const AutocompleteInput: ({ onKeyDown, onChange, onInput, onBlur, onClick, inputProps, ...rest }: TypeAutocompleteInputProps) => react_jsx_runtime.JSX.Element;
|
|
294
|
+
|
|
268
295
|
interface TypeUseItemsFromChildrenProps {
|
|
269
296
|
children: ReactNode;
|
|
270
297
|
}
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
element: React__default.ReactElement<TypeMenuGroupProps>;
|
|
298
|
+
type TypeItemElement = React__default.ReactElement<TypeMenuItemProps>;
|
|
299
|
+
type TypeMenuGroupElement = React__default.ReactElement<TypeMenuGroupProps>;
|
|
300
|
+
interface TypeMenuChildren {
|
|
301
|
+
type: "item" | "group";
|
|
302
|
+
element: React__default.ReactElement<TypeMenuGroupProps> | React__default.ReactElement<TypeMenuItemProps>;
|
|
277
303
|
}
|
|
278
304
|
declare const useItemsFromChildren: ({ children, }: TypeUseItemsFromChildrenProps) => {
|
|
279
305
|
allMenuItems: TypeDefaultItemProps[];
|
|
@@ -288,4 +314,4 @@ declare const defaultUseSelectProps: {
|
|
|
288
314
|
isItemDisabled: (item: any) => boolean;
|
|
289
315
|
};
|
|
290
316
|
|
|
291
|
-
export { ActionMenu, INPUT_TYPES, type InputType, MenuContent, MenuContext, MenuFooter, MenuGroup, MenuHeader, MenuItem, MenuItemAction, MenuItemContainer, MenuItemRow, MenuItemText, MenuLabel, MenuProvider, MenuRoot, MenuToggleButton, MultiSelectMenu, SingleSelectMenu, StyledMenuGroup, StyledMenuGroupUl, StyledMenuItem, StyledTitle, type TypeActionMenuProps, type TypeDefaultItemProps, type TypeDownshiftComboboxProps, type TypeDownshiftComboboxReturnValue, type TypeDownshiftMultiSelectProps, type TypeDownshiftMultiSelectReturnValue, type TypeDownshiftSelectProps, type TypeDownshiftSelectReturnValue, type TypeItemElement, type TypeMenuContentProps, type TypeMenuContext, type TypeMenuContextProps, type TypeMenuGroupElement, type TypeMenuGroupProps, type TypeMenuGroupStyledProps, type TypeMenuHeaderProps, type TypeMenuItemProps, type TypeMenuItemStyledProps, type TypeMenuProviderProps, type TypeMenuRootOwnProps, type TypeMenuRootProps, type TypeMenuToggleButtonProps, type TypeMultiSelectMenuProps, type TypeNotEmptyChildren, type TypeSingleSelectMenuProps, type TypeUseItemsFromChildrenProps, defaultUseSelectProps, useItemsFromChildren, useMenu, useMenuContext, useSelectStateReducer };
|
|
317
|
+
export { ActionMenu, Autocomplete, AutocompleteInput, INPUT_TYPES, type InputType, MenuContent, MenuContext, MenuFooter, MenuGroup, MenuHeader, MenuItem, MenuItemAction, MenuItemContainer, MenuItemRow, MenuItemText, MenuLabel, MenuProvider, MenuRoot, MenuToggleButton, MultiSelectMenu, SingleSelectMenu, StyledMenuGroup, StyledMenuGroupUl, StyledMenuItem, StyledTitle, type TypeActionMenuProps, type TypeAutocompleteInputProps, type TypeAutocompleteProps, type TypeDefaultItemProps, type TypeDownshiftComboboxProps, type TypeDownshiftComboboxReturnValue, type TypeDownshiftMultiSelectProps, type TypeDownshiftMultiSelectReturnValue, type TypeDownshiftSelectProps, type TypeDownshiftSelectReturnValue, type TypeItemElement, type TypeMenuChildren, type TypeMenuContentProps, type TypeMenuContext, type TypeMenuContextProps, type TypeMenuGroupElement, type TypeMenuGroupProps, type TypeMenuGroupStyledProps, type TypeMenuHeaderProps, type TypeMenuItemProps, type TypeMenuItemStyledProps, type TypeMenuProviderProps, type TypeMenuRootOwnProps, type TypeMenuRootProps, type TypeMenuToggleButtonProps, type TypeMultiSelectMenuProps, type TypeNotEmptyChildren, type TypeSingleSelectMenuProps, type TypeUseItemsFromChildrenProps, defaultUseSelectProps, useItemsFromChildren, useMenu, useMenuContext, useSelectStateReducer };
|