@stack-spot/portal-layout 1.0.0-dev.1775671703044 → 1.0.0-dev.1775674176777
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/dist/Layout.d.ts +1 -1
- package/dist/Layout.d.ts.map +1 -1
- package/dist/Layout.js +17 -17
- package/dist/Layout.js.map +1 -1
- package/package.json +1 -1
- package/src/Layout.tsx +82 -83
package/dist/Layout.d.ts
CHANGED
|
@@ -82,7 +82,7 @@ interface RawProps extends WithStyle {
|
|
|
82
82
|
* Renders the layout with the React elements passed in the props.
|
|
83
83
|
* @param props the component's props {@link RawProps}.
|
|
84
84
|
*/
|
|
85
|
-
export declare const RawLayout: ({ menuSections, menuContent, menuInnerContent, header, children, extra, errorDescriptor, onError, className, style
|
|
85
|
+
export declare const RawLayout: ({ menuSections, menuContent, menuInnerContent, header, children, extra, errorDescriptor, onError, className, style }: RawProps) => import("react/jsx-runtime").JSX.Element;
|
|
86
86
|
/**
|
|
87
87
|
* Renders the layout with a menu and header that follow the config objects passed as parameter.
|
|
88
88
|
* @param props the component's props {@link Props}.
|
package/dist/Layout.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":"AACA,OAAO,EAAmC,SAAS,EAAE,MAAM,0BAA0B,CAAA;AACrF,OAAO,yCAAyC,CAAA;AAChD,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAa,MAAM,OAAO,CAAA;AAGrE,OAAO,EAAU,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAGzD,OAAO,EAAE,aAAa,EAAE,YAAY,EAAgB,MAAM,iCAAiC,CAAA;AAK3F,OAAO,EAAE,SAAS,EAAmD,MAAM,yBAAyB,CAAA;AAEpG,OAAO,cAAc,CAAA;AAErB,UAAU,KAAM,SAAQ,SAAS;IAC/B;;OAEG;IACH,IAAI,EAAE,SAAS,CAAC;IAChB;;OAEG;IACH,MAAM,EAAE,WAAW,CAAC;IACpB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC;IAChC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;;OAGG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;CAC1B;AAED,UAAU,QAAS,SAAQ,SAAS;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B;;OAEG;IACH,gBAAgB,CAAC,EAAE,YAAY,CAAC;IAChC;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC;IAChC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;CAC1B;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,GACpB
|
|
1
|
+
{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":"AACA,OAAO,EAAmC,SAAS,EAAE,MAAM,0BAA0B,CAAA;AACrF,OAAO,yCAAyC,CAAA;AAChD,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAa,MAAM,OAAO,CAAA;AAGrE,OAAO,EAAU,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAGzD,OAAO,EAAE,aAAa,EAAE,YAAY,EAAgB,MAAM,iCAAiC,CAAA;AAK3F,OAAO,EAAE,SAAS,EAAmD,MAAM,yBAAyB,CAAA;AAEpG,OAAO,cAAc,CAAA;AAErB,UAAU,KAAM,SAAQ,SAAS;IAC/B;;OAEG;IACH,IAAI,EAAE,SAAS,CAAC;IAChB;;OAEG;IACH,MAAM,EAAE,WAAW,CAAC;IACpB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC;IAChC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;;OAGG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;CAC1B;AAED,UAAU,QAAS,SAAQ,SAAS;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B;;OAEG;IACH,gBAAgB,CAAC,EAAE,YAAY,CAAC;IAChC;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC;IAChC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;CAC1B;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,GACpB,sHAEE,QAAQ,4CAkGX,CAAA;AAcD;;;GAGG;AACH,eAAO,MAAM,MAAM,GAAI,wFAAwF,KAAK,4CAyBnH,CAAA"}
|
package/dist/Layout.js
CHANGED
|
@@ -19,7 +19,7 @@ import './layout.css';
|
|
|
19
19
|
* Renders the layout with the React elements passed in the props.
|
|
20
20
|
* @param props the component's props {@link RawProps}.
|
|
21
21
|
*/
|
|
22
|
-
export const RawLayout = ({ menuSections, menuContent, menuInnerContent, header, children, extra, errorDescriptor, onError, className, style
|
|
22
|
+
export const RawLayout = ({ menuSections, menuContent, menuInnerContent, header, children, extra, errorDescriptor, onError, className, style }) => {
|
|
23
23
|
const { bottomDialog, modal, rightPanel } = overlay.useOverlays();
|
|
24
24
|
overlay.useInitializeRootOverlay();
|
|
25
25
|
useEffect(() => {
|
|
@@ -55,17 +55,17 @@ export const RawLayout = ({ menuSections, menuContent, menuInnerContent, header,
|
|
|
55
55
|
if (className)
|
|
56
56
|
classList.add(...className.split(/\s+/));
|
|
57
57
|
}, [menuContent, menuInnerContent, menuSections, className]);
|
|
58
|
-
return (
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
58
|
+
return (_jsxs(CSSToCitricAdapter, { children: [_jsx(WelcomeTour, {}), _jsxs("div", { id: elementIds.layout, style: style, className: "menu-manual menu-compact", children: [header && _jsx("header", { id: elementIds.header, children: _jsx(SilentErrorBoundary, { children: header }) }), extra && _jsx(SilentErrorBoundary, { children: extra }), _jsxs("aside", { id: elementIds.menu, children: [menuInnerContent &&
|
|
59
|
+
_jsx("nav", { role: "menubar", id: elementIds.menuInnerContent, children: _jsx(SilentErrorBoundary, { children: menuInnerContent }) }), _jsx("nav", { role: "menubar", id: elementIds.menuContent, children: _jsx(SilentErrorBoundary, { children: menuContent }) }), menuSections &&
|
|
60
|
+
_jsx(FadingOverflow, { sides: ['top', 'bottom'], scroll: "arrows", children: _jsx("nav", { role: "menubar", id: elementIds.menuSections, children: _jsx(SilentErrorBoundary, { children: menuSections }) }) })] }), children && _jsx("div", { id: elementIds.page, children: _jsx("article", { id: elementIds.content, children: _jsx(ErrorBoundary, { children: children }) }) }), _jsx("div", { id: elementIds.bottomDialog, role: "dialog", children: _jsx(ErrorBoundary, { children: bottomDialog }) }), _jsxs("div", { id: elementIds.backdrop, children: [_jsx("div", { id: elementIds.rightPanel, "aria-modal": true, role: "dialog", children: _jsx(ErrorBoundary, { children: rightPanel.length === 1 && !rightPanel[0].stack
|
|
61
|
+
? rightPanel[0].element
|
|
62
|
+
: rightPanel.map((m, i) => _jsx("div", { className: listToClass([
|
|
63
|
+
'right-panel-instance',
|
|
64
|
+
(i === rightPanel.length - 1) && 'active',
|
|
65
|
+
modal.length > 0 && 'disabled',
|
|
66
|
+
]), ...(modal.length > 0 ? { inert: true } : {}), children: m.element }, i)) }) }), _jsx("div", { id: elementIds.modal, "aria-modal": true, role: "dialog", children: _jsx(ErrorBoundary, { children: modal.length === 1 && !modal[0].stack
|
|
67
|
+
? modal[0].element
|
|
68
|
+
: modal.map((m, i) => _jsx("div", { className: listToClass(['modal-instance', (i === modal.length - 1) && 'active']), children: m.element }, i)) }) })] }), _jsx(Toaster, {}), _jsx("div", { id: elementIds.accessibilityAnnouncer, "aria-atomic": true, "aria-live": "assertive" })] })] }));
|
|
69
69
|
};
|
|
70
70
|
const MenuContentRenderer = ({ content }) => {
|
|
71
71
|
const menuContent = typeof content === 'function' ? content() : content;
|
|
@@ -80,9 +80,9 @@ const hasInnerContent = (menu) => 'innerContent' in menu;
|
|
|
80
80
|
* Renders the layout with a menu and header that follow the config objects passed as parameter.
|
|
81
81
|
* @param props the component's props {@link Props}.
|
|
82
82
|
*/
|
|
83
|
-
export const Layout = ({ menu, rootRef, header, children, extra, errorDescriptor, onError, className, style }) => (_jsx(RawLayout, { rootRef: rootRef, header: _jsx(Header, { ...header }), menuSections: menu.sections ? _jsx(MenuSections, { ...menu, rootRef: rootRef }) : undefined, menuContent: menu.content
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
83
|
+
export const Layout = ({ menu, rootRef, header, children, extra, errorDescriptor, onError, className, style }) => (_jsx(RootElementProvider, { rootRef: rootRef, children: _jsx(RawLayout, { rootRef: rootRef, header: _jsx(Header, { ...header }), menuSections: menu.sections ? _jsx(MenuSections, { ...menu, rootRef: rootRef }) : undefined, menuContent: menu.content
|
|
84
|
+
? _jsx(MenuContentRenderer, { content: menu.content }, 'contentKey' in menu ? menu.contentKey : undefined)
|
|
85
|
+
: undefined, menuInnerContent: hasInnerContent(menu) && menu.innerContent
|
|
86
|
+
? _jsx(MenuInnerContentRenderer, { content: menu.innerContent }, 'contentKey' in menu ? menu.contentKey : undefined)
|
|
87
|
+
: undefined, errorDescriptor: errorDescriptor, onError: onError, extra: extra, className: className, style: style, children: children }) }));
|
|
88
88
|
//# sourceMappingURL=Layout.js.map
|
package/dist/Layout.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,8CAA8C,CAAA;AAC7E,OAAO,EAAE,kBAAkB,EAAE,WAAW,EAAa,MAAM,0BAA0B,CAAA;AACrF,OAAO,yCAAyC,CAAA;AAChD,OAAO,EAAsC,SAAS,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,EAAE,MAAM,EAAe,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAA;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAA;AAChE,OAAO,EAA+B,YAAY,EAAE,MAAM,iCAAiC,CAAA;AAC3F,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAA;AAC5E,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAA;AAC7D,OAAO,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAA;AAE1E,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AACvC,OAAO,cAAc,CAAA;AA6ErB;;;GAGG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CACvB,EAAE,YAAY,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,EAAE,QAAQ,EAC7D,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,
|
|
1
|
+
{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../src/Layout.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
package/src/Layout.tsx
CHANGED
|
@@ -97,7 +97,7 @@ interface RawProps extends WithStyle {
|
|
|
97
97
|
*/
|
|
98
98
|
export const RawLayout = (
|
|
99
99
|
{ menuSections, menuContent, menuInnerContent, header, children,
|
|
100
|
-
extra, errorDescriptor, onError, className, style
|
|
100
|
+
extra, errorDescriptor, onError, className, style }:
|
|
101
101
|
RawProps,
|
|
102
102
|
) => {
|
|
103
103
|
const { bottomDialog, modal, rightPanel } = overlay.useOverlays()
|
|
@@ -135,69 +135,66 @@ export const RawLayout = (
|
|
|
135
135
|
if (className) classList.add(...className.split(/\s+/))
|
|
136
136
|
}, [menuContent, menuInnerContent, menuSections, className])
|
|
137
137
|
|
|
138
|
-
return (
|
|
139
|
-
<
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
<
|
|
146
|
-
|
|
147
|
-
|
|
138
|
+
return (<CSSToCitricAdapter>
|
|
139
|
+
<WelcomeTour />
|
|
140
|
+
<div id={elementIds.layout} style={style} className="menu-manual menu-compact">
|
|
141
|
+
{header && <header id={elementIds.header}><SilentErrorBoundary>{header}</SilentErrorBoundary></header>}
|
|
142
|
+
{extra && <SilentErrorBoundary>{extra}</SilentErrorBoundary>}
|
|
143
|
+
<aside id={elementIds.menu}>
|
|
144
|
+
{menuInnerContent &&
|
|
145
|
+
<nav role="menubar" id={elementIds.menuInnerContent}><SilentErrorBoundary>{menuInnerContent}</SilentErrorBoundary></nav>
|
|
146
|
+
}
|
|
147
|
+
<nav role="menubar" id={elementIds.menuContent}><SilentErrorBoundary>{menuContent}</SilentErrorBoundary></nav>
|
|
148
|
+
{menuSections &&
|
|
149
|
+
<FadingOverflow sides={['top', 'bottom']} scroll="arrows">
|
|
150
|
+
<nav role="menubar" id={elementIds.menuSections}>
|
|
151
|
+
<SilentErrorBoundary>{menuSections}</SilentErrorBoundary>
|
|
152
|
+
</nav>
|
|
153
|
+
</FadingOverflow>
|
|
154
|
+
}
|
|
155
|
+
</aside>
|
|
156
|
+
{children && <div id={elementIds.page}>
|
|
157
|
+
<article id={elementIds.content}><ErrorBoundary>{children}</ErrorBoundary></article>
|
|
158
|
+
</div>}
|
|
159
|
+
<div id={elementIds.bottomDialog} role="dialog"><ErrorBoundary>{bottomDialog}</ErrorBoundary></div>
|
|
160
|
+
<div id={elementIds.backdrop}>
|
|
161
|
+
<div id={elementIds.rightPanel} aria-modal role="dialog">
|
|
162
|
+
<ErrorBoundary>
|
|
163
|
+
{rightPanel.length === 1 && !rightPanel[0].stack
|
|
164
|
+
? rightPanel[0].element
|
|
165
|
+
: rightPanel.map(
|
|
166
|
+
(m, i) => <div
|
|
167
|
+
key={i}
|
|
168
|
+
className={listToClass([
|
|
169
|
+
'right-panel-instance',
|
|
170
|
+
(i === rightPanel.length - 1) && 'active',
|
|
171
|
+
modal.length > 0 && 'disabled',
|
|
172
|
+
])}
|
|
173
|
+
{...(modal.length > 0 ? { inert: true } : {})}
|
|
174
|
+
>
|
|
175
|
+
{m.element}
|
|
176
|
+
</div>,
|
|
177
|
+
)
|
|
148
178
|
}
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
179
|
+
</ErrorBoundary>
|
|
180
|
+
</div>
|
|
181
|
+
<div id={elementIds.modal} aria-modal role="dialog">
|
|
182
|
+
<ErrorBoundary>
|
|
183
|
+
{modal.length === 1 && !modal[0].stack
|
|
184
|
+
? modal[0].element
|
|
185
|
+
: modal.map(
|
|
186
|
+
(m, i) =>
|
|
187
|
+
<div key={i} className={listToClass(['modal-instance', (i === modal.length - 1) && 'active'])}>{m.element}</div>,
|
|
188
|
+
)
|
|
156
189
|
}
|
|
157
|
-
</
|
|
158
|
-
{children && <div id={elementIds.page}>
|
|
159
|
-
<article id={elementIds.content}><ErrorBoundary>{children}</ErrorBoundary></article>
|
|
160
|
-
</div>}
|
|
161
|
-
<div id={elementIds.bottomDialog} role="dialog"><ErrorBoundary>{bottomDialog}</ErrorBoundary></div>
|
|
162
|
-
<div id={elementIds.backdrop}>
|
|
163
|
-
<div id={elementIds.rightPanel} aria-modal role="dialog">
|
|
164
|
-
<ErrorBoundary>
|
|
165
|
-
{rightPanel.length === 1 && !rightPanel[0].stack
|
|
166
|
-
? rightPanel[0].element
|
|
167
|
-
: rightPanel.map(
|
|
168
|
-
(m, i) => <div
|
|
169
|
-
key={i}
|
|
170
|
-
className={listToClass([
|
|
171
|
-
'right-panel-instance',
|
|
172
|
-
(i === rightPanel.length - 1) && 'active',
|
|
173
|
-
modal.length > 0 && 'disabled',
|
|
174
|
-
])}
|
|
175
|
-
{...(modal.length > 0 ? { inert: true } : {})}
|
|
176
|
-
>
|
|
177
|
-
{m.element}
|
|
178
|
-
</div>,
|
|
179
|
-
)
|
|
180
|
-
}
|
|
181
|
-
</ErrorBoundary>
|
|
182
|
-
</div>
|
|
183
|
-
<div id={elementIds.modal} aria-modal role="dialog">
|
|
184
|
-
<ErrorBoundary>
|
|
185
|
-
{modal.length === 1 && !modal[0].stack
|
|
186
|
-
? modal[0].element
|
|
187
|
-
: modal.map(
|
|
188
|
-
(m, i) =>
|
|
189
|
-
<div key={i} className={listToClass(['modal-instance', (i === modal.length - 1) && 'active'])}>{m.element}</div>,
|
|
190
|
-
)
|
|
191
|
-
}
|
|
192
|
-
</ErrorBoundary>
|
|
193
|
-
</div>
|
|
194
|
-
</div>
|
|
195
|
-
<Toaster />
|
|
196
|
-
<div id={elementIds.accessibilityAnnouncer} aria-atomic aria-live="assertive">
|
|
197
|
-
</div>
|
|
190
|
+
</ErrorBoundary>
|
|
198
191
|
</div>
|
|
199
|
-
</
|
|
200
|
-
|
|
192
|
+
</div>
|
|
193
|
+
<Toaster />
|
|
194
|
+
<div id={elementIds.accessibilityAnnouncer} aria-atomic aria-live="assertive">
|
|
195
|
+
</div>
|
|
196
|
+
</div>
|
|
197
|
+
</CSSToCitricAdapter>
|
|
201
198
|
)
|
|
202
199
|
}
|
|
203
200
|
|
|
@@ -218,26 +215,28 @@ const hasInnerContent = (menu: MenuProps): menu is MenuPropsWithDynamicContent =
|
|
|
218
215
|
* @param props the component's props {@link Props}.
|
|
219
216
|
*/
|
|
220
217
|
export const Layout = ({ menu, rootRef, header, children, extra, errorDescriptor, onError, className, style }: Props) => (
|
|
221
|
-
<
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
218
|
+
<RootElementProvider rootRef={rootRef}>
|
|
219
|
+
<RawLayout
|
|
220
|
+
rootRef={rootRef}
|
|
221
|
+
header={<Header {...header} />}
|
|
222
|
+
menuSections={menu.sections ? <MenuSections {...menu} rootRef={rootRef} /> : undefined}
|
|
223
|
+
menuContent={
|
|
224
|
+
menu.content
|
|
225
|
+
? <MenuContentRenderer key={'contentKey' in menu ? menu.contentKey : undefined} content={menu.content} />
|
|
226
|
+
: undefined
|
|
227
|
+
}
|
|
228
|
+
menuInnerContent={
|
|
229
|
+
hasInnerContent(menu) && menu.innerContent
|
|
230
|
+
? <MenuInnerContentRenderer key={'contentKey' in menu ? menu.contentKey : undefined} content={menu.innerContent} />
|
|
231
|
+
: undefined
|
|
232
|
+
}
|
|
233
|
+
errorDescriptor={errorDescriptor}
|
|
234
|
+
onError={onError}
|
|
235
|
+
extra={extra}
|
|
236
|
+
className={className}
|
|
237
|
+
style={style}
|
|
238
|
+
>
|
|
239
|
+
{children}
|
|
240
|
+
</RawLayout>
|
|
241
|
+
</RootElementProvider>
|
|
243
242
|
)
|