@sproutsocial/seeds-react-menu 1.3.2 → 1.4.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 +10 -10
- package/CHANGELOG.md +18 -0
- package/dist/esm/index.js +63 -55
- package/dist/esm/index.js.map +1 -1
- package/dist/index.d.mts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +63 -55
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/Menu.tsx +7 -1
- package/src/MenuContent/MenuContentTypes.ts +22 -1
- package/src/MenuContent/styles.tsx +20 -1
- package/src/MenuGroup/MenuGroupTypes.ts +0 -1
- package/src/MenuRoot/MenuRoot.tsx +2 -0
- package/src/NestedMenu/NestedMenu.stories.tsx +35 -14
- package/src/NestedMenu/NestedMenu.tsx +13 -3
- package/src/NestedMenu/NestedMenuPopout.tsx +8 -2
package/.turbo/turbo-build.log
CHANGED
|
@@ -84,14 +84,14 @@ ESM Build start
|
|
|
84
84
|
╵ [32m~~~~~~~~~[0m
|
|
85
85
|
|
|
86
86
|
|
|
87
|
-
CJS dist/index.js
|
|
88
|
-
CJS dist/index.js.map
|
|
89
|
-
CJS ⚡️ Build success in
|
|
90
|
-
ESM dist/esm/index.js 133.
|
|
91
|
-
ESM dist/esm/index.js.map
|
|
92
|
-
ESM ⚡️ Build success in
|
|
87
|
+
CJS dist/index.js 143.00 KB
|
|
88
|
+
CJS dist/index.js.map 369.68 KB
|
|
89
|
+
CJS ⚡️ Build success in 665ms
|
|
90
|
+
ESM dist/esm/index.js 133.33 KB
|
|
91
|
+
ESM dist/esm/index.js.map 368.41 KB
|
|
92
|
+
ESM ⚡️ Build success in 668ms
|
|
93
93
|
DTS Build start
|
|
94
|
-
DTS ⚡️ Build success in
|
|
95
|
-
DTS dist/index.d.ts 37.
|
|
96
|
-
DTS dist/index.d.mts 37.
|
|
97
|
-
Done in 15.
|
|
94
|
+
DTS ⚡️ Build success in 11765ms
|
|
95
|
+
DTS dist/index.d.ts 37.42 KB
|
|
96
|
+
DTS dist/index.d.mts 37.42 KB
|
|
97
|
+
Done in 15.66s.
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,23 @@
|
|
|
1
1
|
# @sproutsocial/seeds-react-menu
|
|
2
2
|
|
|
3
|
+
## 1.4.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- ea81c0a: Add ListboxToggleButton, AutocompleteInput, and AutocompleteTokenInput to the Menu.tsx docs exports
|
|
8
|
+
|
|
9
|
+
## 1.4.0
|
|
10
|
+
|
|
11
|
+
### Minor Changes
|
|
12
|
+
|
|
13
|
+
- 37915da: Add system props to the `MenuContent` component
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- cc72db4: Smooths Menu animations when the height changes [[DS-3495)](https://sprout.atlassian.net/browse/DS-3495)]
|
|
18
|
+
- Updated dependencies [37915da]
|
|
19
|
+
- @sproutsocial/seeds-react-popout@2.3.0
|
|
20
|
+
|
|
3
21
|
## 1.3.2
|
|
4
22
|
|
|
5
23
|
### Patch Changes
|
package/dist/esm/index.js
CHANGED
|
@@ -239,58 +239,46 @@ import styled, { css as css4 } from "styled-components";
|
|
|
239
239
|
|
|
240
240
|
// ../../node_modules/@babel/runtime/helpers/esm/extends.js
|
|
241
241
|
function _extends() {
|
|
242
|
-
_extends = Object.assign ? Object.assign.bind() : function(
|
|
243
|
-
for (var
|
|
244
|
-
var
|
|
245
|
-
for (var
|
|
246
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
247
|
-
target[key] = source[key];
|
|
248
|
-
}
|
|
249
|
-
}
|
|
242
|
+
return _extends = Object.assign ? Object.assign.bind() : function(n) {
|
|
243
|
+
for (var e = 1; e < arguments.length; e++) {
|
|
244
|
+
var t = arguments[e];
|
|
245
|
+
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
250
246
|
}
|
|
251
|
-
return
|
|
252
|
-
};
|
|
253
|
-
return _extends.apply(this, arguments);
|
|
247
|
+
return n;
|
|
248
|
+
}, _extends.apply(null, arguments);
|
|
254
249
|
}
|
|
255
250
|
|
|
256
251
|
// ../../node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js
|
|
257
|
-
function _assertThisInitialized(
|
|
258
|
-
if (
|
|
259
|
-
|
|
260
|
-
}
|
|
261
|
-
return self;
|
|
252
|
+
function _assertThisInitialized(e) {
|
|
253
|
+
if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
|
254
|
+
return e;
|
|
262
255
|
}
|
|
263
256
|
|
|
264
257
|
// ../../node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js
|
|
265
|
-
function _setPrototypeOf(
|
|
266
|
-
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
};
|
|
270
|
-
return _setPrototypeOf(o, p);
|
|
258
|
+
function _setPrototypeOf(t, e) {
|
|
259
|
+
return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(t2, e2) {
|
|
260
|
+
return t2.__proto__ = e2, t2;
|
|
261
|
+
}, _setPrototypeOf(t, e);
|
|
271
262
|
}
|
|
272
263
|
|
|
273
264
|
// ../../node_modules/@babel/runtime/helpers/esm/inheritsLoose.js
|
|
274
|
-
function _inheritsLoose(
|
|
275
|
-
|
|
276
|
-
subClass.prototype.constructor = subClass;
|
|
277
|
-
_setPrototypeOf(subClass, superClass);
|
|
265
|
+
function _inheritsLoose(t, o) {
|
|
266
|
+
t.prototype = Object.create(o.prototype), t.prototype.constructor = t, _setPrototypeOf(t, o);
|
|
278
267
|
}
|
|
279
268
|
|
|
280
269
|
// ../../node_modules/@babel/runtime/helpers/esm/getPrototypeOf.js
|
|
281
|
-
function _getPrototypeOf(
|
|
282
|
-
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function
|
|
283
|
-
return
|
|
284
|
-
};
|
|
285
|
-
return _getPrototypeOf(o);
|
|
270
|
+
function _getPrototypeOf(t) {
|
|
271
|
+
return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(t2) {
|
|
272
|
+
return t2.__proto__ || Object.getPrototypeOf(t2);
|
|
273
|
+
}, _getPrototypeOf(t);
|
|
286
274
|
}
|
|
287
275
|
|
|
288
276
|
// ../../node_modules/@babel/runtime/helpers/esm/isNativeFunction.js
|
|
289
|
-
function _isNativeFunction(
|
|
277
|
+
function _isNativeFunction(t) {
|
|
290
278
|
try {
|
|
291
|
-
return Function.toString.call(
|
|
292
|
-
} catch (
|
|
293
|
-
return
|
|
279
|
+
return -1 !== Function.toString.call(t).indexOf("[native code]");
|
|
280
|
+
} catch (n) {
|
|
281
|
+
return "function" == typeof t;
|
|
294
282
|
}
|
|
295
283
|
}
|
|
296
284
|
|
|
@@ -316,31 +304,27 @@ function _construct(t, e, r) {
|
|
|
316
304
|
}
|
|
317
305
|
|
|
318
306
|
// ../../node_modules/@babel/runtime/helpers/esm/wrapNativeSuper.js
|
|
319
|
-
function _wrapNativeSuper(
|
|
320
|
-
var
|
|
321
|
-
_wrapNativeSuper = function _wrapNativeSuper2(
|
|
322
|
-
if (
|
|
323
|
-
if (typeof
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
if (_cache.has(Class2)) return _cache.get(Class2);
|
|
328
|
-
_cache.set(Class2, Wrapper);
|
|
307
|
+
function _wrapNativeSuper(t) {
|
|
308
|
+
var r = "function" == typeof Map ? /* @__PURE__ */ new Map() : void 0;
|
|
309
|
+
return _wrapNativeSuper = function _wrapNativeSuper2(t2) {
|
|
310
|
+
if (null === t2 || !_isNativeFunction(t2)) return t2;
|
|
311
|
+
if ("function" != typeof t2) throw new TypeError("Super expression must either be null or a function");
|
|
312
|
+
if (void 0 !== r) {
|
|
313
|
+
if (r.has(t2)) return r.get(t2);
|
|
314
|
+
r.set(t2, Wrapper);
|
|
329
315
|
}
|
|
330
316
|
function Wrapper() {
|
|
331
|
-
return _construct(
|
|
317
|
+
return _construct(t2, arguments, _getPrototypeOf(this).constructor);
|
|
332
318
|
}
|
|
333
|
-
Wrapper.prototype = Object.create(
|
|
319
|
+
return Wrapper.prototype = Object.create(t2.prototype, {
|
|
334
320
|
constructor: {
|
|
335
321
|
value: Wrapper,
|
|
336
322
|
enumerable: false,
|
|
337
323
|
writable: true,
|
|
338
324
|
configurable: true
|
|
339
325
|
}
|
|
340
|
-
});
|
|
341
|
-
|
|
342
|
-
};
|
|
343
|
-
return _wrapNativeSuper(Class);
|
|
326
|
+
}), _setPrototypeOf(Wrapper, t2);
|
|
327
|
+
}, _wrapNativeSuper(t);
|
|
344
328
|
}
|
|
345
329
|
|
|
346
330
|
// ../../node_modules/polished/dist/polished.esm.js
|
|
@@ -2131,11 +2115,20 @@ import styled3 from "styled-components";
|
|
|
2131
2115
|
var StyledMenuContent = styled3.ul`
|
|
2132
2116
|
margin: 0;
|
|
2133
2117
|
padding: 0;
|
|
2118
|
+
overflow: auto;
|
|
2134
2119
|
|
|
2135
2120
|
&:focus {
|
|
2136
2121
|
outline: none;
|
|
2137
2122
|
box-shadow: none;
|
|
2138
2123
|
}
|
|
2124
|
+
|
|
2125
|
+
${border}
|
|
2126
|
+
${color}
|
|
2127
|
+
${flexbox}
|
|
2128
|
+
${grid}
|
|
2129
|
+
${layout}
|
|
2130
|
+
${space}
|
|
2131
|
+
${position}
|
|
2139
2132
|
`;
|
|
2140
2133
|
|
|
2141
2134
|
// src/hooks/useMenuChildren.tsx
|
|
@@ -2602,8 +2595,10 @@ var CustomPopoutContent = styled8(Popout.Content)`
|
|
|
2602
2595
|
padding: 0;
|
|
2603
2596
|
margin-left: 0;
|
|
2604
2597
|
margin-right: 0;
|
|
2598
|
+
overflow: hidden;
|
|
2605
2599
|
`;
|
|
2606
2600
|
var menuAnimationConfig = {
|
|
2601
|
+
layout: true,
|
|
2607
2602
|
initial: {
|
|
2608
2603
|
scale: 0,
|
|
2609
2604
|
opacity: 0,
|
|
@@ -4195,19 +4190,23 @@ var NestedMenuPopout = ({
|
|
|
4195
4190
|
content,
|
|
4196
4191
|
menuToggleElement,
|
|
4197
4192
|
width: width2,
|
|
4193
|
+
onClose,
|
|
4198
4194
|
...popoutProps
|
|
4199
4195
|
}) => {
|
|
4200
4196
|
const { activeMenuContext, rootMenuContextProps, resetSelectedMenuPath } = useNestedMenuContext();
|
|
4201
4197
|
return /* @__PURE__ */ jsx33(
|
|
4202
4198
|
MenuPopout,
|
|
4203
4199
|
{
|
|
4204
|
-
|
|
4205
|
-
|
|
4200
|
+
onClose: () => {
|
|
4201
|
+
onClose?.();
|
|
4202
|
+
setTimeout(() => resetSelectedMenuPath?.(), 100);
|
|
4203
|
+
},
|
|
4206
4204
|
isOpen: !!rootMenuContextProps.isOpen,
|
|
4207
4205
|
openMenu: rootMenuContextProps.openMenu,
|
|
4208
4206
|
closeMenu: rootMenuContextProps.closeMenu,
|
|
4209
4207
|
width: width2,
|
|
4210
4208
|
content: (props) => /* @__PURE__ */ jsx33(StyledDiv, { layout: "position", children: typeof content === "function" ? content(props) : content }),
|
|
4209
|
+
...popoutProps,
|
|
4211
4210
|
children: (toggleProps) => /* @__PURE__ */ jsx33(
|
|
4212
4211
|
MenuToggleProvider,
|
|
4213
4212
|
{
|
|
@@ -4231,7 +4230,10 @@ var NestedMenu = ({
|
|
|
4231
4230
|
onBackButtonClick,
|
|
4232
4231
|
backArrowLabel,
|
|
4233
4232
|
menuToggleElement,
|
|
4234
|
-
popoutProps
|
|
4233
|
+
popoutProps: {
|
|
4234
|
+
scheduleUpdateRef: externalPopoutUpdateRef,
|
|
4235
|
+
...restPopoutProps
|
|
4236
|
+
} = {},
|
|
4235
4237
|
width: width2 = "300px",
|
|
4236
4238
|
stateReducer: rootExternalStateReducer,
|
|
4237
4239
|
id: externalNestedMenuId,
|
|
@@ -4280,6 +4282,7 @@ var NestedMenu = ({
|
|
|
4280
4282
|
const [activeMenuContext, setActiveMenuContext] = useState(defaultMenuContext);
|
|
4281
4283
|
const [currentMenuId, setCurrentMenuId] = useState(initialMenuId);
|
|
4282
4284
|
const [isAdding, setIsAdding] = useState(false);
|
|
4285
|
+
const [popoutUpdateRef, setPopoutUpdateRef] = useState();
|
|
4283
4286
|
const setSelectedMenuId = (id) => {
|
|
4284
4287
|
setIsAdding(true);
|
|
4285
4288
|
setSelectedMenuPath((currentPath) => [...currentPath, id]);
|
|
@@ -4288,6 +4291,7 @@ var NestedMenu = ({
|
|
|
4288
4291
|
if (selectedMenuPath.length > 0) {
|
|
4289
4292
|
const newMenuId = selectedMenuPath[selectedMenuPath.length - 1];
|
|
4290
4293
|
setCurrentMenuId(newMenuId);
|
|
4294
|
+
popoutUpdateRef?.();
|
|
4291
4295
|
}
|
|
4292
4296
|
}, [selectedMenuPath.join("-")]);
|
|
4293
4297
|
const resetSelectedMenuPath = () => {
|
|
@@ -4441,7 +4445,11 @@ var NestedMenu = ({
|
|
|
4441
4445
|
) }),
|
|
4442
4446
|
menuToggleElement,
|
|
4443
4447
|
width: width2,
|
|
4444
|
-
|
|
4448
|
+
scheduleUpdateRef: (callback) => {
|
|
4449
|
+
setPopoutUpdateRef(callback);
|
|
4450
|
+
externalPopoutUpdateRef?.(callback);
|
|
4451
|
+
},
|
|
4452
|
+
...restPopoutProps
|
|
4445
4453
|
}
|
|
4446
4454
|
)
|
|
4447
4455
|
}
|