@sproutsocial/seeds-react-menu 1.17.0 → 1.18.1
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 +14 -22
- package/CHANGELOG.md +37 -0
- package/dist/esm/index.js +542 -229
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/v3/index.js +793 -1038
- package/dist/esm/v3/index.js.map +1 -1
- package/dist/v3/index.d.mts +64 -38
- package/dist/v3/index.d.ts +64 -38
- package/dist/v3/index.js +813 -1058
- package/dist/v3/index.js.map +1 -1
- package/dist/v3/menu.css +947 -0
- package/package.json +20 -21
- package/src/v3/ActionMenuStyles.tsx +169 -149
- package/src/v3/Common/ComboboxStyles.tsx +396 -511
- package/src/v3/Common/SelectIcons.tsx +17 -8
- package/src/v3/Common/SelectItem.tsx +25 -38
- package/src/v3/Common/SelectStyles.tsx +146 -144
- package/src/v3/Common/cn.ts +38 -0
- package/src/v3/MenuButtonStyles.tsx +55 -34
- package/src/v3/MultiSearchableSelect.tsx +8 -8
- package/src/v3/MultiSelect.tsx +11 -16
- package/src/v3/SingleSelect.tsx +13 -13
- package/src/v3/menu.css +947 -0
- package/tsup.config.ts +0 -1
- package/dist/esm/chunk-ROQATIB7.js +0 -357
- package/dist/esm/chunk-ROQATIB7.js.map +0 -1
- package/dist/esm/v2/index.js +0 -2089
- package/dist/esm/v2/index.js.map +0 -1
- package/dist/v2/index.d.mts +0 -108
- package/dist/v2/index.d.ts +0 -108
- package/dist/v2/index.js +0 -2280
- package/dist/v2/index.js.map +0 -1
- package/src/v2/Autocomplete/Autocomplete.stories.tsx +0 -645
- package/src/v2/Autocomplete/MultiAutocomplete.tsx +0 -487
- package/src/v2/Autocomplete/SingleAutocomplete.tsx +0 -366
- package/src/v2/Autocomplete/index.ts +0 -2
- package/src/v2/Common-V2/ComboboxContent.tsx +0 -457
- package/src/v2/Common-V2/MenuGroup.tsx +0 -60
- package/src/v2/Common-V2/MenuGroupTypes.ts +0 -30
- package/src/v2/Common-V2/MenuHeading.tsx +0 -83
- package/src/v2/Common-V2/MenuItem.tsx +0 -138
- package/src/v2/Common-V2/Popout.tsx +0 -124
- package/src/v2/Common-V2/PopoutTypes.tsx +0 -109
- package/src/v2/Common-V2/SelectToggleButton.tsx +0 -99
- package/src/v2/Common-V2/index.ts +0 -11
- package/src/v2/Common-V2/props.ts +0 -84
- package/src/v2/Common-V2/styles.tsx +0 -41
- package/src/v2/Common-V2/types.ts +0 -16
- package/src/v2/Common-V2/useHighlightedIndex.ts +0 -62
- package/src/v2/Common-V2/utils.ts +0 -238
- package/src/v2/SearchableSelect/AutocompleteContent.tsx +0 -325
- package/src/v2/SearchableSelect/SearchableMultiSelect.tsx +0 -527
- package/src/v2/SearchableSelect/SearchableSelect.tsx +0 -395
- package/src/v2/SearchableSelect/index.ts +0 -12
- package/src/v2/Select/MultiSelect.tsx +0 -417
- package/src/v2/Select/Select.stories.tsx +0 -593
- package/src/v2/Select/SingleSelect.tsx +0 -285
- package/src/v2/Select/index.ts +0 -2
- package/src/v2/index.ts +0 -2
package/tsup.config.ts
CHANGED
|
@@ -1,357 +0,0 @@
|
|
|
1
|
-
// src/MenuContext.tsx
|
|
2
|
-
import React, { createContext, useMemo, useContext } from "react";
|
|
3
|
-
import { jsx } from "react/jsx-runtime";
|
|
4
|
-
var defaultMenuContext = {
|
|
5
|
-
items: [],
|
|
6
|
-
itemsMap: {},
|
|
7
|
-
isItemSelected: () => false,
|
|
8
|
-
getInputComponentProps: () => ({}),
|
|
9
|
-
hasVisibleItems: false,
|
|
10
|
-
isInitialized: false
|
|
11
|
-
};
|
|
12
|
-
var getSelectedItemIds = (selectedItems) => selectedItems?.reduce(
|
|
13
|
-
(selected, item) => ({ ...selected, [item.id]: true }),
|
|
14
|
-
{}
|
|
15
|
-
);
|
|
16
|
-
var checkIfItemSelected = ({
|
|
17
|
-
id,
|
|
18
|
-
selectedItem,
|
|
19
|
-
selectedItemIds
|
|
20
|
-
}) => selectedItemIds ? !!selectedItemIds[id] : selectedItem?.id === id;
|
|
21
|
-
var useMenu = ({
|
|
22
|
-
items = [],
|
|
23
|
-
isListbox = false,
|
|
24
|
-
isOpen = false,
|
|
25
|
-
itemsMap: itemsMapFromProps,
|
|
26
|
-
selectedItemIds: selectedItemIdsFromProps,
|
|
27
|
-
selectedItem,
|
|
28
|
-
selectedItems,
|
|
29
|
-
getInputProps,
|
|
30
|
-
contentRef: contentRefFromProps,
|
|
31
|
-
autoCloseOnEmpty,
|
|
32
|
-
hiddenItemsCount,
|
|
33
|
-
...rest
|
|
34
|
-
} = {}) => {
|
|
35
|
-
const contentRef = contentRefFromProps || React.createRef();
|
|
36
|
-
const menuProps = useMemo(() => ({ ...rest }), [rest]);
|
|
37
|
-
const itemsMap = useMemo(
|
|
38
|
-
() => itemsMapFromProps || items.reduce((map, item) => {
|
|
39
|
-
map[`${item.id}`] = {
|
|
40
|
-
...item
|
|
41
|
-
};
|
|
42
|
-
return map;
|
|
43
|
-
}, {}),
|
|
44
|
-
[items, itemsMapFromProps]
|
|
45
|
-
);
|
|
46
|
-
const selectedItemIds = useMemo(
|
|
47
|
-
() => selectedItemIdsFromProps || getSelectedItemIds(selectedItems),
|
|
48
|
-
[selectedItems, selectedItemIdsFromProps]
|
|
49
|
-
);
|
|
50
|
-
const isItemSelected = React.useCallback(
|
|
51
|
-
(id) => checkIfItemSelected({ id, selectedItem, selectedItemIds }),
|
|
52
|
-
[selectedItem?.id, selectedItemIds]
|
|
53
|
-
);
|
|
54
|
-
const getInputComponentProps = React.useCallback(
|
|
55
|
-
({ inputProps, ...props }) => {
|
|
56
|
-
if (!getInputProps) return {};
|
|
57
|
-
const {
|
|
58
|
-
["aria-activedescendant"]: activedescendant,
|
|
59
|
-
["aria-autocomplete"]: autocomplete,
|
|
60
|
-
["aria-controls"]: controls,
|
|
61
|
-
["aria-expanded"]: expanded,
|
|
62
|
-
["aria-labelledby"]: labelledby,
|
|
63
|
-
role,
|
|
64
|
-
autoComplete,
|
|
65
|
-
onClick,
|
|
66
|
-
value,
|
|
67
|
-
...restProps
|
|
68
|
-
} = getInputProps(props);
|
|
69
|
-
return {
|
|
70
|
-
...restProps,
|
|
71
|
-
inputProps: {
|
|
72
|
-
["aria-activedescendant"]: activedescendant,
|
|
73
|
-
["aria-autocomplete"]: autocomplete,
|
|
74
|
-
["aria-controls"]: controls,
|
|
75
|
-
["aria-expanded"]: expanded,
|
|
76
|
-
["aria-labelledby"]: labelledby,
|
|
77
|
-
role,
|
|
78
|
-
autoComplete,
|
|
79
|
-
onClick,
|
|
80
|
-
value,
|
|
81
|
-
...inputProps
|
|
82
|
-
}
|
|
83
|
-
};
|
|
84
|
-
},
|
|
85
|
-
[getInputProps]
|
|
86
|
-
);
|
|
87
|
-
const hasVisibleItems = useMemo(() => {
|
|
88
|
-
return (hiddenItemsCount ?? 0) < items.length;
|
|
89
|
-
}, [items, hiddenItemsCount]);
|
|
90
|
-
return {
|
|
91
|
-
isOpen,
|
|
92
|
-
isListbox,
|
|
93
|
-
items,
|
|
94
|
-
itemsMap,
|
|
95
|
-
selectedItem,
|
|
96
|
-
selectedItems,
|
|
97
|
-
selectedItemIds,
|
|
98
|
-
isItemSelected,
|
|
99
|
-
getInputProps,
|
|
100
|
-
getInputComponentProps,
|
|
101
|
-
contentRef,
|
|
102
|
-
hasVisibleItems,
|
|
103
|
-
autoCloseOnEmpty,
|
|
104
|
-
isInitialized: true,
|
|
105
|
-
...menuProps
|
|
106
|
-
};
|
|
107
|
-
};
|
|
108
|
-
var MenuToggleContext = createContext(defaultMenuContext);
|
|
109
|
-
var MenuToggleProvider = ({
|
|
110
|
-
children,
|
|
111
|
-
menuContext
|
|
112
|
-
}) => {
|
|
113
|
-
return /* @__PURE__ */ jsx(MenuToggleContext.Provider, { value: { ...menuContext }, children });
|
|
114
|
-
};
|
|
115
|
-
var useMenuToggleContext = () => {
|
|
116
|
-
const menuContextValue = useContext(MenuToggleContext);
|
|
117
|
-
if (menuContextValue === null) {
|
|
118
|
-
throw new Error(
|
|
119
|
-
"useMenuToggleContext must be used within a <MenuToggleContext.Provider />"
|
|
120
|
-
);
|
|
121
|
-
}
|
|
122
|
-
return menuContextValue;
|
|
123
|
-
};
|
|
124
|
-
var MenuContentContext = createContext(defaultMenuContext);
|
|
125
|
-
var MenuContentProvider = ({
|
|
126
|
-
children,
|
|
127
|
-
menuContext
|
|
128
|
-
}) => {
|
|
129
|
-
return /* @__PURE__ */ jsx(MenuContentContext.Provider, { value: { ...menuContext }, children });
|
|
130
|
-
};
|
|
131
|
-
var useMenuContentContext = () => {
|
|
132
|
-
const menuContextValue = useContext(MenuContentContext);
|
|
133
|
-
if (menuContextValue === null) {
|
|
134
|
-
throw new Error(
|
|
135
|
-
"useMenuContentContext must be used within a <MenuContentContext.Provider />"
|
|
136
|
-
);
|
|
137
|
-
}
|
|
138
|
-
return menuContextValue;
|
|
139
|
-
};
|
|
140
|
-
|
|
141
|
-
// src/MenuItem/styles.tsx
|
|
142
|
-
import styled, { css } from "styled-components";
|
|
143
|
-
import { focusRing, disabled } from "@sproutsocial/seeds-react-mixins";
|
|
144
|
-
import { color, border, flexbox, grid, layout, space } from "styled-system";
|
|
145
|
-
import {
|
|
146
|
-
CheckboxContainer,
|
|
147
|
-
InputWrapper,
|
|
148
|
-
PillInput,
|
|
149
|
-
checkboxContainerHoverStyles,
|
|
150
|
-
inputWrapperHoverStyles,
|
|
151
|
-
pillInputHoverStyles
|
|
152
|
-
} from "@sproutsocial/seeds-react-checkbox";
|
|
153
|
-
var highlightedStyles = css`
|
|
154
|
-
cursor: pointer;
|
|
155
|
-
border: 1px solid ${({ theme }) => theme.colors.listItem.border.base};
|
|
156
|
-
background-color: ${({ theme }) => theme.colors.listItem.background.hover};
|
|
157
|
-
color: ${({ theme }) => theme.colors.text.body};
|
|
158
|
-
text-decoration: none;
|
|
159
|
-
`;
|
|
160
|
-
var activeStyles = css`
|
|
161
|
-
border: 1px solid ${({ theme }) => theme.colors.listItem.border.base};
|
|
162
|
-
background-color: ${({ theme }) => theme.colors.menuItem.background.active};
|
|
163
|
-
color: ${({ theme }) => theme.colors.text.body};
|
|
164
|
-
text-decoration: none;
|
|
165
|
-
`;
|
|
166
|
-
var selectedStyles = css`
|
|
167
|
-
font-weight: ${({ theme }) => theme.fontWeights.semibold};
|
|
168
|
-
`;
|
|
169
|
-
var MenuItemContainer = styled.li`
|
|
170
|
-
box-sizing: border-box;
|
|
171
|
-
list-style-type: none;
|
|
172
|
-
margin-left: ${({ theme }) => theme.space[300]};
|
|
173
|
-
margin-right: ${({ theme }) => theme.space[300]};
|
|
174
|
-
|
|
175
|
-
&:first-child {
|
|
176
|
-
margin-top: ${({ theme }) => theme.space[300]};
|
|
177
|
-
}
|
|
178
|
-
|
|
179
|
-
&:last-child {
|
|
180
|
-
margin-bottom: ${({ theme }) => theme.space[300]};
|
|
181
|
-
}
|
|
182
|
-
`;
|
|
183
|
-
var StyledMenuItem = styled.button`
|
|
184
|
-
display: block;
|
|
185
|
-
box-sizing: border-box;
|
|
186
|
-
width: 100%;
|
|
187
|
-
border-radius: ${({ theme }) => theme.radii[500]};
|
|
188
|
-
background-color: ${({ theme }) => theme.colors.listItem.background.base};
|
|
189
|
-
border: 1px solid ${({ theme }) => theme.colors.listItem.background.base};
|
|
190
|
-
color: ${({ theme }) => theme.colors.text.body};
|
|
191
|
-
font-family: ${({ theme }) => theme.fontFamily};
|
|
192
|
-
font-weight: ${({ theme }) => theme.fontWeights.normal};
|
|
193
|
-
text-align: left;
|
|
194
|
-
text-decoration: none;
|
|
195
|
-
padding: ${({ theme }) => theme.space[300]};
|
|
196
|
-
outline: 0;
|
|
197
|
-
${({ theme }) => theme.typography[200]};
|
|
198
|
-
transition: all ${({ theme }) => theme.duration["fast"]};
|
|
199
|
-
|
|
200
|
-
/* Highlighted */
|
|
201
|
-
${({ $highlighted }) => $highlighted && highlightedStyles}
|
|
202
|
-
|
|
203
|
-
/* Hovered, but not focused */
|
|
204
|
-
&:hover {
|
|
205
|
-
${highlightedStyles}
|
|
206
|
-
${CheckboxContainer} {
|
|
207
|
-
${checkboxContainerHoverStyles}
|
|
208
|
-
}
|
|
209
|
-
${InputWrapper} {
|
|
210
|
-
${inputWrapperHoverStyles}
|
|
211
|
-
}
|
|
212
|
-
${PillInput} {
|
|
213
|
-
${pillInputHoverStyles}
|
|
214
|
-
}
|
|
215
|
-
}
|
|
216
|
-
|
|
217
|
-
/* focused */
|
|
218
|
-
&:focus {
|
|
219
|
-
${focusRing}
|
|
220
|
-
}
|
|
221
|
-
|
|
222
|
-
/* Active */
|
|
223
|
-
${({ $active }) => $active && activeStyles}
|
|
224
|
-
|
|
225
|
-
/* Pressed state*/
|
|
226
|
-
&:active {
|
|
227
|
-
${activeStyles}
|
|
228
|
-
}
|
|
229
|
-
|
|
230
|
-
&[aria-disabled="true"] {
|
|
231
|
-
cursor: not-allowed;
|
|
232
|
-
${disabled}
|
|
233
|
-
}
|
|
234
|
-
|
|
235
|
-
${({ $selected }) => $selected && selectedStyles}
|
|
236
|
-
|
|
237
|
-
${border}
|
|
238
|
-
${color}
|
|
239
|
-
${flexbox}
|
|
240
|
-
${grid}
|
|
241
|
-
${layout}
|
|
242
|
-
${space}
|
|
243
|
-
`;
|
|
244
|
-
var MenuItemRow = styled.div`
|
|
245
|
-
display: flex;
|
|
246
|
-
align-items: center;
|
|
247
|
-
pointer-events: none;
|
|
248
|
-
`;
|
|
249
|
-
var MenuItemAction = styled.div`
|
|
250
|
-
display: flex;
|
|
251
|
-
align-items: center;
|
|
252
|
-
justify-content: center;
|
|
253
|
-
flex-shrink: 0;
|
|
254
|
-
`;
|
|
255
|
-
var MenuItemActionLeft = styled(MenuItemAction)`
|
|
256
|
-
margin-right: ${({ theme }) => theme.space[300]};
|
|
257
|
-
`;
|
|
258
|
-
var MenuItemActionRight = styled(MenuItemAction)`
|
|
259
|
-
margin-left: ${({ theme }) => theme.space[300]};
|
|
260
|
-
`;
|
|
261
|
-
var MenuItemText = styled.div`
|
|
262
|
-
word-break: break-word;
|
|
263
|
-
flex-grow: 1;
|
|
264
|
-
min-width: 0;
|
|
265
|
-
`;
|
|
266
|
-
|
|
267
|
-
// src/MenuToggleButton/MenuToggleButton.tsx
|
|
268
|
-
import { Button } from "@sproutsocial/seeds-react-button";
|
|
269
|
-
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
270
|
-
var MenuToggleButton = (props) => {
|
|
271
|
-
const { getToggleButtonProps, isListbox, getDropdownProps, ref, ariaProps } = useMenuToggleContext();
|
|
272
|
-
const {
|
|
273
|
-
onClick: userOnClick,
|
|
274
|
-
onKeyDown: userOnKeyDown,
|
|
275
|
-
onBlur: userOnBlur,
|
|
276
|
-
...restProps
|
|
277
|
-
} = props;
|
|
278
|
-
const defaultDropdownProps = {
|
|
279
|
-
ref,
|
|
280
|
-
onClick: userOnClick,
|
|
281
|
-
onKeyDown: userOnKeyDown,
|
|
282
|
-
onBlur: userOnBlur
|
|
283
|
-
};
|
|
284
|
-
const dropdownProps = getDropdownProps?.({
|
|
285
|
-
...defaultDropdownProps,
|
|
286
|
-
preventKeyAction: true
|
|
287
|
-
}) ?? defaultDropdownProps;
|
|
288
|
-
const toggleButtonProps = getToggleButtonProps?.({
|
|
289
|
-
...dropdownProps,
|
|
290
|
-
refKey: "innerRef",
|
|
291
|
-
...ariaProps,
|
|
292
|
-
...isListbox ? {} : { role: "button", "aria-haspopup": "menu" }
|
|
293
|
-
});
|
|
294
|
-
if (toggleButtonProps && toggleButtonProps["aria-activedescendant"] === "") {
|
|
295
|
-
toggleButtonProps["aria-activedescendant"] = void 0;
|
|
296
|
-
}
|
|
297
|
-
if (toggleButtonProps && toggleButtonProps["aria-expanded"] === false) {
|
|
298
|
-
toggleButtonProps["aria-controls"] = void 0;
|
|
299
|
-
}
|
|
300
|
-
if (toggleButtonProps) {
|
|
301
|
-
toggleButtonProps["aria-labelledby"] = void 0;
|
|
302
|
-
}
|
|
303
|
-
return /* @__PURE__ */ jsx2(Button, { appearance: "secondary", ...toggleButtonProps, ...restProps });
|
|
304
|
-
};
|
|
305
|
-
|
|
306
|
-
// src/MenuContent/styles.tsx
|
|
307
|
-
import styled2 from "styled-components";
|
|
308
|
-
import {
|
|
309
|
-
border as border2,
|
|
310
|
-
color as color2,
|
|
311
|
-
flexbox as flexbox2,
|
|
312
|
-
grid as grid2,
|
|
313
|
-
layout as layout2,
|
|
314
|
-
position,
|
|
315
|
-
space as space2
|
|
316
|
-
} from "styled-system";
|
|
317
|
-
var StyledMenuContent = styled2.ul`
|
|
318
|
-
margin: 0;
|
|
319
|
-
padding: 0;
|
|
320
|
-
overflow: auto;
|
|
321
|
-
|
|
322
|
-
&:focus {
|
|
323
|
-
outline: none;
|
|
324
|
-
box-shadow: none;
|
|
325
|
-
}
|
|
326
|
-
|
|
327
|
-
${border2}
|
|
328
|
-
${color2}
|
|
329
|
-
${flexbox2}
|
|
330
|
-
${grid2}
|
|
331
|
-
${layout2}
|
|
332
|
-
${space2}
|
|
333
|
-
${position}
|
|
334
|
-
`;
|
|
335
|
-
|
|
336
|
-
export {
|
|
337
|
-
defaultMenuContext,
|
|
338
|
-
getSelectedItemIds,
|
|
339
|
-
checkIfItemSelected,
|
|
340
|
-
useMenu,
|
|
341
|
-
MenuToggleContext,
|
|
342
|
-
MenuToggleProvider,
|
|
343
|
-
useMenuToggleContext,
|
|
344
|
-
MenuContentContext,
|
|
345
|
-
MenuContentProvider,
|
|
346
|
-
useMenuContentContext,
|
|
347
|
-
MenuItemContainer,
|
|
348
|
-
StyledMenuItem,
|
|
349
|
-
MenuItemRow,
|
|
350
|
-
MenuItemAction,
|
|
351
|
-
MenuItemActionLeft,
|
|
352
|
-
MenuItemActionRight,
|
|
353
|
-
MenuItemText,
|
|
354
|
-
StyledMenuContent,
|
|
355
|
-
MenuToggleButton
|
|
356
|
-
};
|
|
357
|
-
//# sourceMappingURL=chunk-ROQATIB7.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/MenuContext.tsx","../../src/MenuItem/styles.tsx","../../src/MenuToggleButton/MenuToggleButton.tsx","../../src/MenuContent/styles.tsx"],"sourcesContent":["import React, { createContext, useMemo, useContext } from \"react\";\nimport type {\n UseComboboxReturnValue,\n UseComboboxProps,\n UseSelectReturnValue,\n UseSelectProps,\n UseMultipleSelectionReturnValue,\n UseMultipleSelectionProps,\n} from \"downshift\";\nimport type { TypeTokenInputProps } from \"@sproutsocial/seeds-react-token-input\";\nimport type {\n TypeInternalItemProps,\n TypeNotEmptyChildren,\n TypeDownshiftMergedInputProps,\n} from \"./types\";\n\nexport interface TypeDownshiftComboboxProps\n extends Partial<UseComboboxProps<TypeInternalItemProps>> {}\n\nexport interface TypeDownshiftSelectProps\n extends Partial<UseSelectProps<TypeInternalItemProps>> {}\n\nexport interface TypeDownshiftMultiSelectProps\n extends Partial<\n Omit<\n UseMultipleSelectionProps<TypeInternalItemProps>,\n \"stateReducer\" | \"onStateChange\" | \"getA11yStatusMessage\"\n >\n > {\n // Multi Select Props with conflicting useSelect prop names\n /** Optional override to the built-in getA11yStatusMessage function for multiple selection*/\n getA11yMultiStatusMessage?: UseMultipleSelectionProps<TypeInternalItemProps>[\"getA11yStatusMessage\"];\n /** Optional override to the built-in onStateChange function for multiple selection*/\n onMultiSelectStateChange?: UseMultipleSelectionProps<TypeInternalItemProps>[\"onStateChange\"];\n /** Optional override to the built-in stateReducer function for multiple selection*/\n multiSelectStateReducer?: UseMultipleSelectionProps<TypeInternalItemProps>[\"stateReducer\"];\n}\n\nexport interface TypeDownshiftComboboxReturnValue\n extends Partial<UseComboboxReturnValue<TypeInternalItemProps>> {}\n\nexport interface TypeDownshiftSelectReturnValue\n extends Partial<UseSelectReturnValue<TypeInternalItemProps>> {}\n\nexport interface TypeDownshiftMultiSelectReturnValue\n extends Partial<UseMultipleSelectionReturnValue<TypeInternalItemProps>> {}\n\ntype TypeDonwshiftSharedReturnValue =\n | \"getLabelProps\"\n | \"getToggleButtonProps\"\n | \"getMenuProps\";\ntype TypeDonwshiftSharedProps =\n | \"onHighlightedIndexChange\"\n | \"onIsOpenChange\"\n | \"onSelectedItemChange\"\n | \"onStateChange\"\n | \"stateReducer\";\n\nexport interface TypeMenuContextBaseProps {\n itemsMap?: { [key: string]: TypeInternalItemProps };\n isListbox?: boolean;\n hiddenItemsMap?: Record<string, boolean>;\n hiddenItemsCount?: number;\n setHiddenItemsMap?: React.Dispatch<\n React.SetStateAction<Record<string, boolean>>\n >;\n subMenuId?: string;\n setSubMenuId?: (id: string) => void;\n contentRef?: React.RefObject<HTMLUListElement>;\n}\n\ninterface TypeAllDownshiftProps\n extends Omit<\n TypeDownshiftComboboxReturnValue,\n TypeDonwshiftSharedReturnValue\n >,\n Omit<TypeDownshiftComboboxProps, TypeDonwshiftSharedProps>,\n Omit<TypeDownshiftSelectReturnValue, TypeDonwshiftSharedReturnValue>,\n Omit<TypeDownshiftSelectProps, TypeDonwshiftSharedProps>,\n TypeDownshiftMultiSelectReturnValue,\n TypeDownshiftMultiSelectProps {\n onHighlightedIndexChange?:\n | TypeDownshiftComboboxProps[\"onHighlightedIndexChange\"]\n | TypeDownshiftSelectProps[\"onHighlightedIndexChange\"];\n onIsOpenChange?:\n | TypeDownshiftComboboxProps[\"onIsOpenChange\"]\n | TypeDownshiftSelectProps[\"onIsOpenChange\"];\n onSelectedItemChange?:\n | TypeDownshiftComboboxProps[\"onSelectedItemChange\"]\n | TypeDownshiftSelectProps[\"onSelectedItemChange\"];\n onStateChange?:\n | TypeDownshiftComboboxProps[\"onStateChange\"]\n | TypeDownshiftSelectProps[\"onStateChange\"];\n stateReducer?:\n | TypeDownshiftComboboxProps[\"stateReducer\"]\n | TypeDownshiftSelectProps[\"stateReducer\"];\n getLabelProps?:\n | TypeDownshiftComboboxReturnValue[\"getLabelProps\"]\n | TypeDownshiftSelectReturnValue[\"getLabelProps\"];\n getToggleButtonProps?:\n | TypeDownshiftComboboxReturnValue[\"getToggleButtonProps\"]\n | TypeDownshiftSelectReturnValue[\"getToggleButtonProps\"];\n getMenuProps?:\n | TypeDownshiftComboboxReturnValue[\"getMenuProps\"]\n | TypeDownshiftSelectReturnValue[\"getMenuProps\"];\n}\nexport interface TypeMenuContextProps\n extends TypeAllDownshiftProps,\n TypeMenuContextBaseProps {\n items: TypeInternalItemProps[];\n itemsMap?: { [key: string]: TypeInternalItemProps };\n selectedItemIds?: { [key: string]: boolean };\n isListbox?: boolean;\n hasVisibleItems?: boolean;\n autoCloseOnEmpty?: boolean;\n}\n\nexport interface TypeMenuContext extends TypeMenuContextProps {\n itemsMap: { [key: string]: TypeInternalItemProps };\n isItemSelected: (id: string) => boolean;\n getInputComponentProps: (\n props: Pick<TypeTokenInputProps, \"inputProps\"> &\n Parameters<Required<TypeMenuContextProps>[\"getInputProps\"]>[0]\n ) => Omit<TypeDownshiftMergedInputProps<TypeTokenInputProps>, \"onClick\">;\n isInitialized?: boolean;\n}\n\nexport interface TypeMenuProviderProps {\n children: TypeNotEmptyChildren;\n menuContext: TypeMenuContext;\n}\n\nexport interface TypeMenuToggleContext extends TypeMenuContext {\n ref?:\n | React.RefObject<any>\n | ((arg0: React.ElementRef<any> | HTMLElement) => void);\n toggle?: () => void;\n show?: () => void;\n hide?: () => void;\n ariaProps?: Record<string, any>;\n}\n\nexport interface TypeMenuToggleProviderProps extends TypeMenuProviderProps {\n menuContext: TypeMenuToggleContext;\n}\n\n/**\n * Object for Initializing the Menu Context\n */\nexport const defaultMenuContext: TypeMenuContext = {\n items: [],\n itemsMap: {},\n isItemSelected: () => false,\n getInputComponentProps: () => ({}),\n hasVisibleItems: false,\n isInitialized: false,\n};\n\nexport const getSelectedItemIds = <\n T extends TypeMenuContextProps[\"selectedItems\"] | undefined,\n R = T extends undefined ? undefined : Record<string, boolean>\n>(\n selectedItems?: T\n): R =>\n selectedItems?.reduce(\n (selected, item) => ({ ...selected, [item.id]: true }),\n {} as Record<string, boolean>\n ) as R;\n\nexport const checkIfItemSelected = ({\n id,\n selectedItem,\n selectedItemIds,\n}: {\n id: string;\n selectedItem?: TypeInternalItemProps | null;\n selectedItemIds?: TypeMenuContextProps[\"selectedItemIds\"];\n}) => (selectedItemIds ? !!selectedItemIds[id] : selectedItem?.id === id);\n\n/**\n * Hook for initializing Menu context\n */\nexport const useMenu = ({\n items = [],\n isListbox = false,\n isOpen = false,\n itemsMap: itemsMapFromProps,\n selectedItemIds: selectedItemIdsFromProps,\n selectedItem,\n selectedItems,\n getInputProps,\n contentRef: contentRefFromProps,\n autoCloseOnEmpty,\n hiddenItemsCount,\n ...rest\n}: Partial<TypeMenuContextProps> = {}): TypeMenuContext => {\n const contentRef = contentRefFromProps || React.createRef<HTMLUListElement>();\n const menuProps = useMemo(() => ({ ...rest }), [rest]);\n const itemsMap = useMemo(\n () =>\n itemsMapFromProps ||\n items.reduce((map, item) => {\n map[`${item.id}`] = {\n ...item,\n };\n return map;\n }, {} as TypeMenuContext[\"itemsMap\"]),\n [items, itemsMapFromProps]\n );\n\n const selectedItemIds = useMemo(\n () => selectedItemIdsFromProps || getSelectedItemIds(selectedItems),\n [selectedItems, selectedItemIdsFromProps]\n );\n\n const isItemSelected = React.useCallback(\n (id: string) => checkIfItemSelected({ id, selectedItem, selectedItemIds }),\n [selectedItem?.id, selectedItemIds]\n );\n\n const getInputComponentProps = React.useCallback<\n TypeMenuContext[\"getInputComponentProps\"]\n >(\n ({ inputProps, ...props }) => {\n if (!getInputProps) return {};\n const {\n [\"aria-activedescendant\"]: activedescendant,\n [\"aria-autocomplete\"]: autocomplete,\n [\"aria-controls\"]: controls,\n [\"aria-expanded\"]: expanded,\n [\"aria-labelledby\"]: labelledby,\n role,\n autoComplete,\n onClick,\n value,\n ...restProps\n } = getInputProps(props);\n return {\n ...restProps,\n inputProps: {\n [\"aria-activedescendant\"]: activedescendant,\n [\"aria-autocomplete\"]: autocomplete,\n [\"aria-controls\"]: controls,\n [\"aria-expanded\"]: expanded,\n [\"aria-labelledby\"]: labelledby,\n role,\n autoComplete,\n onClick,\n value,\n ...inputProps,\n },\n };\n },\n [getInputProps]\n );\n\n const hasVisibleItems = useMemo(() => {\n return (hiddenItemsCount ?? 0) < items.length;\n }, [items, hiddenItemsCount]);\n\n return {\n isOpen,\n isListbox,\n items,\n itemsMap,\n selectedItem,\n selectedItems,\n selectedItemIds,\n isItemSelected,\n getInputProps,\n getInputComponentProps,\n contentRef,\n hasVisibleItems,\n autoCloseOnEmpty,\n isInitialized: true,\n ...menuProps,\n };\n};\n\n/**\n * MenuToggleContext factory, sets the type and the initial object\n * @description Context for the Menu Toggle\n */\nexport const MenuToggleContext =\n createContext<TypeMenuToggleContext>(defaultMenuContext);\n\n/**\n * MenuToggleProvider Component sets the context values into the provider\n * @description Context Provider for the Menu Toggle\n */\nexport const MenuToggleProvider = ({\n children,\n menuContext,\n}: TypeMenuToggleProviderProps) => {\n return (\n <MenuToggleContext.Provider value={{ ...menuContext }}>\n {children}\n </MenuToggleContext.Provider>\n );\n};\n\n/**\n * Utility hook for consuming MenuToggleContext\n */\nexport const useMenuToggleContext = () => {\n const menuContextValue = useContext(MenuToggleContext);\n\n if (menuContextValue === null) {\n throw new Error(\n \"useMenuToggleContext must be used within a <MenuToggleContext.Provider />\"\n );\n }\n\n return menuContextValue;\n};\n\n/**\n * MenuContentContext factory, sets the type and the initial object\n * @description Context for the Menu Content\n */\nexport const MenuContentContext =\n createContext<TypeMenuContext>(defaultMenuContext);\n\n/**\n * MenuContentProvider Component sets the context values into the provider\n * @description Context Provider for the Menu Content\n */\nexport const MenuContentProvider = ({\n children,\n menuContext,\n}: TypeMenuProviderProps) => {\n return (\n <MenuContentContext.Provider value={{ ...menuContext }}>\n {children}\n </MenuContentContext.Provider>\n );\n};\n\n/**\n * Utility hook for consuming MenuContentContext\n */\nexport const useMenuContentContext = () => {\n const menuContextValue = useContext(MenuContentContext);\n\n if (menuContextValue === null) {\n throw new Error(\n \"useMenuContentContext must be used within a <MenuContentContext.Provider />\"\n );\n }\n\n return menuContextValue;\n};\n","import styled, { css } from \"styled-components\";\nimport { focusRing, disabled } from \"@sproutsocial/seeds-react-mixins\";\nimport { color, border, flexbox, grid, layout, space } from \"styled-system\";\nimport {\n CheckboxContainer,\n InputWrapper,\n PillInput,\n checkboxContainerHoverStyles,\n inputWrapperHoverStyles,\n pillInputHoverStyles,\n} from \"@sproutsocial/seeds-react-checkbox\";\n\nconst highlightedStyles = css`\n cursor: pointer;\n border: 1px solid ${({ theme }) => theme.colors.listItem.border.base};\n background-color: ${({ theme }) => theme.colors.listItem.background.hover};\n color: ${({ theme }) => theme.colors.text.body};\n text-decoration: none;\n`;\n\nconst activeStyles = css`\n border: 1px solid ${({ theme }) => theme.colors.listItem.border.base};\n background-color: ${({ theme }) => theme.colors.menuItem.background.active};\n color: ${({ theme }) => theme.colors.text.body};\n text-decoration: none;\n`;\n\nconst selectedStyles = css`\n font-weight: ${({ theme }) => theme.fontWeights.semibold};\n`;\n\nexport const MenuItemContainer = styled.li`\n box-sizing: border-box;\n list-style-type: none;\n margin-left: ${({ theme }) => theme.space[300]};\n margin-right: ${({ theme }) => theme.space[300]};\n\n &:first-child {\n margin-top: ${({ theme }) => theme.space[300]};\n }\n\n &:last-child {\n margin-bottom: ${({ theme }) => theme.space[300]};\n }\n`;\n\nexport const StyledMenuItem = styled.button<{\n $highlighted: boolean;\n $active?: boolean;\n $selected?: boolean;\n}>`\n display: block;\n box-sizing: border-box;\n width: 100%;\n border-radius: ${({ theme }) => theme.radii[500]};\n background-color: ${({ theme }) => theme.colors.listItem.background.base};\n border: 1px solid ${({ theme }) => theme.colors.listItem.background.base};\n color: ${({ theme }) => theme.colors.text.body};\n font-family: ${({ theme }) => theme.fontFamily};\n font-weight: ${({ theme }) => theme.fontWeights.normal};\n text-align: left;\n text-decoration: none;\n padding: ${({ theme }) => theme.space[300]};\n outline: 0;\n ${({ theme }) => theme.typography[200]};\n transition: all ${({ theme }) => theme.duration[\"fast\"]};\n\n /* Highlighted */\n ${({ $highlighted }) => $highlighted && highlightedStyles}\n\n /* Hovered, but not focused */\n &:hover {\n ${highlightedStyles}\n ${CheckboxContainer} {\n ${checkboxContainerHoverStyles}\n }\n ${InputWrapper} {\n ${inputWrapperHoverStyles}\n }\n ${PillInput} {\n ${pillInputHoverStyles}\n }\n }\n\n /* focused */\n &:focus {\n ${focusRing}\n }\n\n /* Active */\n ${({ $active }) => $active && activeStyles}\n\n /* Pressed state*/\n &:active {\n ${activeStyles}\n }\n\n &[aria-disabled=\"true\"] {\n cursor: not-allowed;\n ${disabled}\n }\n\n ${({ $selected }) => $selected && selectedStyles}\n\n ${border}\n ${color}\n ${flexbox}\n ${grid}\n ${layout}\n ${space}\n`;\n\nexport const MenuItemRow = styled.div`\n display: flex;\n align-items: center;\n pointer-events: none;\n`;\nexport const MenuItemAction = styled.div`\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n`;\n\nexport const MenuItemActionLeft = styled(MenuItemAction)`\n margin-right: ${({ theme }) => theme.space[300]};\n`;\n\nexport const MenuItemActionRight = styled(MenuItemAction)`\n margin-left: ${({ theme }) => theme.space[300]};\n`;\n\nexport const MenuItemText = styled.div`\n word-break: break-word;\n flex-grow: 1;\n min-width: 0;\n`;\n","import { Button, type TypeButtonProps } from \"@sproutsocial/seeds-react-button\";\nimport { useMenuToggleContext } from \"../MenuContext\";\nimport type React from \"react\";\n\nexport interface TypeMenuToggleButtonProps extends TypeButtonProps {}\n\n/**\n * @link https://seeds.sproutsocial.com/components/seeds-react-menu/#menutogglebutton\n * @param props - MenuToggleButton accepts all the same props as Button.\n * @description MenuToggleButton extends the Button component to create a toggle for a menu.\n * @see {@link https://seeds.sproutsocial.com/components/button/ Button}\n * @see {@link https://seeds.sproutsocial.com/components/seeds-react-menu/#menulabel MenuLabel}\n */\nexport const MenuToggleButton = (props: TypeMenuToggleButtonProps) => {\n const { getToggleButtonProps, isListbox, getDropdownProps, ref, ariaProps } =\n useMenuToggleContext();\n\n const {\n onClick: userOnClick,\n onKeyDown: userOnKeyDown,\n onBlur: userOnBlur,\n ...restProps\n } = props;\n\n const defaultDropdownProps = {\n ref,\n onClick: userOnClick,\n onKeyDown: userOnKeyDown,\n onBlur: userOnBlur,\n };\n\n const dropdownProps =\n getDropdownProps?.({\n ...defaultDropdownProps,\n preventKeyAction: true,\n }) ?? defaultDropdownProps;\n\n const toggleButtonProps = getToggleButtonProps?.({\n ...dropdownProps,\n refKey: \"innerRef\",\n ...ariaProps,\n ...(isListbox ? {} : { role: \"button\", \"aria-haspopup\": \"menu\" }),\n });\n\n // Clean up default downshift aria attributes\n // If there is not an active descendant, remove the attribute\n if (toggleButtonProps && toggleButtonProps[\"aria-activedescendant\"] === \"\") {\n toggleButtonProps[\"aria-activedescendant\"] = undefined;\n }\n // If the menu is closed, remove the aria-controls attribute\n if (toggleButtonProps && toggleButtonProps[\"aria-expanded\"] === false) {\n // @ts-expect-error downshift types require aria-controls even though it is not required\n toggleButtonProps[\"aria-controls\"] = undefined;\n }\n // Remove aria-labelledby, we add our own Label component\n if (toggleButtonProps) {\n toggleButtonProps[\"aria-labelledby\"] = undefined;\n }\n\n return (\n <Button appearance=\"secondary\" {...toggleButtonProps} {...restProps} />\n );\n};\n","import styled from \"styled-components\";\nimport {\n border,\n color,\n flexbox,\n grid,\n layout,\n position,\n space,\n} from \"styled-system\";\nimport type { TypeMenuContentProps } from \"./MenuContentTypes\";\n\nexport const StyledMenuContent = styled.ul<TypeMenuContentProps>`\n margin: 0;\n padding: 0;\n overflow: auto;\n\n &:focus {\n outline: none;\n box-shadow: none;\n }\n\n ${border}\n ${color}\n ${flexbox}\n ${grid}\n ${layout}\n ${space}\n ${position}\n`;\n"],"mappings":"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","names":["jsx","styled","border","color","flexbox","grid","layout","space"]}
|