@stack-spot/portal-layout 2.35.1 → 2.36.0-beta.1

package/dist/components/menu/types.d.ts

@@ -300,6 +300,13 @@ export interface MenuPropsWithDynamicContent extends BaseMenuProps {
      * Identifies each content that might be rendered by the menu. This prevents React Hook errors when the content is a React Hook function.
      */
     contentKey: React.Key;
+    /**
+     * The function that creates a config to render a third level nav menu content. It will be called only when the content is rendered,
+     * i.e. only when the content really needs to be rendered.
+     *
+     * Tip: this function can be a React Hook.
+     */
+    innerContent?: MenuSectionContent | (() => MenuSectionContent);
 }
 export type MenuProps = MenuPropsWithStaticContent | MenuPropsWithDynamicContent;
 export {};

package/dist/components/menu/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/menu/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,6CAA6C,CAAA;AACpE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE/C,UAAU,YAAY;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,UAAU,CAAC;CAC3C;AAED,MAAM,WAAW,SAAU,SAAQ,YAAY;IAC7C;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,QAAQ,EAAE,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,UAAW,SAAQ,MAAM,EAAE,YAAY;IACtD;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,UAAU,CAAA;AAE7C,MAAM,WAAW,YAAa,SAAQ,MAAM;IAC1C;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,QAAQ;IACvB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B;;OAEG;IACH,YAAY,CAAC,EAAE,QAAQ,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,QAAQ,EAAE,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,WAAY,SAAQ,MAAM;IACzC;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC;IACb;;OAEG;IACH,IAAI,EAAE,YAAY,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,kBAAkB,GAAG,CAAC,MAAM,kBAAkB,CAAC,CAAC;IAC1D;;;;;OAKG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;OAIG;IACH,gCAAgC,CAAC,EAAE,OAAO,CAAC;CAC5C;AAED,MAAM,WAAW,qBAAqB;IACpC;;OAEG;IACH,IAAI,EAAE,gBAAgB,CAAC;IACvB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,IAAI,EAAE,YAAY,CAAC;IAEnB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf;AAED,UAAU,aAAa;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,WAAW,GAAG,qBAAqB,CAAC,EAAE,CAAC;IACnD;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE;QACT;;WAEG;QACH,IAAI,CAAC,EAAE,OAAO,CAAC;QACf;;WAEG;QACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;QACrB;;WAEG;QACH,IAAI,CAAC,EAAE,MAAM,CAAC;QACd;;WAEG;QACH,MAAM,CAAC,EAAE,OAAO,CAAC;QACjB;;WAEG;QACH,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF;;OAEG;IACH,MAAM,CAAC,EAAE;QACP;;WAEG;QACH,IAAI,CAAC,EAAE,OAAO,CAAC;QACf;;WAEG;QACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;QACrB;;WAEG;QACH,IAAI,CAAC,EAAE,MAAM,CAAC;QACd;;WAEG;QACH,MAAM,CAAC,EAAE,OAAO,CAAC;QACjB;;WAEG;QACH,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF;;OAEG;IACH,SAAS,CAAC,EAAE;QACV;;WAEG;QACH,IAAI,CAAC,EAAE,OAAO,CAAC;QACf;;WAEG;QACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;QACrB;;WAEG;QACH,IAAI,CAAC,EAAE,MAAM,CAAC;QACd;;WAEG;QACH,MAAM,CAAC,EAAE,OAAO,CAAC;QACjB;;WAEG;QACH,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB;;WAEG;QACH,MAAM,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC,QAAQ,CAAC,CAAC;KAClE,CAAC;CACH;AAED,MAAM,WAAW,0BAA2B,SAAQ,aAAa;IAC/D;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED,MAAM,WAAW,2BAA4B,SAAQ,aAAa;IAChE;;;;;OAKG;IACH,OAAO,EAAE,kBAAkB,GAAG,CAAC,MAAM,kBAAkB,CAAC,CAAC;IACzD;;OAEG;IACH,UAAU,EAAE,KAAK,CAAC,GAAG,CAAC;CACvB;AAED,MAAM,MAAM,SAAS,GAAG,0BAA0B,GAAG,2BAA2B,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/menu/types.ts"],"names":[],"mappings":"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"}

package/dist/components/tour/StepNavigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StepNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/tour/StepNavigation.tsx"],"names":[],"mappings":"AACA,OAAO,yCAAyC,CAAA;AAIhD,UAAU,sBAAsB;IAC9B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,eAAe;IAC9B;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE,sBAAsB,CAAC;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,sBAAsB,CAAC;CACrC;AAED;;;GAGG;AACH,eAAO,MAAM,cAAc,GAAI,qCAAqC,eAAe,4CAsBlF,CAAA"}
+{"version":3,"file":"StepNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/tour/StepNavigation.tsx"],"names":[],"mappings":"AACA,OAAO,yCAAyC,CAAA;AAIhD,UAAU,sBAAsB;IAC9B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,eAAe;IAC9B;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE,sBAAsB,CAAC;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,sBAAsB,CAAC;CACrC;AAED;;;GAGG;AACH,eAAO,MAAM,cAAc,GAAI,qCAAqC,eAAe,4CAwBlF,CAAA"}

package/dist/components/tour/StepNavigation.js

@@ -10,7 +10,8 @@ import { useTour } from './hook.js';
 export const StepNavigation = ({ stepKey, nextButton, prevButton }) => {
     const { currentStep, steps, prevStep, finishStep } = useTour();
     const t = useTranslate(translations);
-    return _jsxs(Flex, { w: 12, px: 5, py: 2, mt: "-1px", bg: "inverse.500", justifyContent: "space-between", alignItems: "center", children: [_jsxs(Text, { appearance: "microtext1", colorScheme: "inverse.contrastText", children: [currentStep + 1, " ", t.of, " ", steps.length] }), _jsxs(Flex, { sx: { gap: '8px' }, children: [currentStep >= 1 &&
+    return _jsxs(Flex, { w: 12, px: 5, py: 2, mt: "-1px", bg: "inverse.500", justifyContent: "space-between", alignItems: "center", children: [steps.length > 1 &&
+                _jsxs(Text, { appearance: "microtext1", colorScheme: "inverse.contrastText", children: [currentStep + 1, " ", t.of, " ", steps.length] }), _jsxs(Flex, { sx: { gap: '8px' }, children: [currentStep >= 1 &&
                         _jsx(Button, { sx: { paddingInline: '20px' }, onClick: () => {
                                 prevStep?.();
                                 prevButton?.onClick?.();

package/dist/components/tour/StepNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepNavigation.js","sourceRoot":"","sources":["../../../src/components/tour/StepNavigation.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AACjD,OAAO,yCAAyC,CAAA;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAyBhC;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,UAAU,EAAmB,EAAE,EAAE;IACrF,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,OAAO,EAAE,CAAA;IAC9D,MAAM,CAAC,GAAG,YAAY,CAAC,YAAY,CAAC,CAAA;IAEpC,OAAO,MAAC,IAAI,IAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,aAAa,EAAC,cAAc,EAAC,eAAe,EAAC,UAAU,EAAC,QAAQ,aAC7G,MAAC,IAAI,IAAC,UAAU,EAAC,YAAY,EAAC,WAAW,EAAC,sBAAsB,aAAE,WAAW,GAAG,CAAC,OAAG,CAAC,CAAC,EAAE,OAAG,KAAK,CAAC,MAAM,IAAQ,EAC/G,MAAC,IAAI,IAAC,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,aACrB,WAAW,IAAI,CAAC;wBACf,KAAC,MAAM,IAAC,EAAE,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE;gCACnD,QAAQ,EAAE,EAAE,CAAA;gCACZ,UAAU,EAAE,OAAO,EAAE,EAAE,CAAA;4BACzB,CAAC,EAAE,IAAI,EAAC,IAAI,EAAC,UAAU,EAAC,MAAM,EAAC,WAAW,EAAC,OAAO,YAC/C,UAAU,EAAE,IAAI,IAAI,CAAC,CAAC,IAAI,GACpB,EACX,KAAC,MAAM,IAAC,EAAE,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE;4BACnD,UAAU,EAAE,OAAO,EAAE,EAAE,CAAA;4BACvB,UAAU,CAAC,OAAO,CAAC,CAAA;wBACrB,CAAC,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,OAAO,YAC7B,UAAU,EAAE,IAAI,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAChE,IACJ,IACF,CAAA;AACT,CAAC,CAAA;AAED,MAAM,YAAY,GAAG;IACnB,EAAE,EAAE;QACF,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;KACb;IACD,EAAE,EAAE;QACF,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,YAAY;KACnB;CACF,CAAA"}
+{"version":3,"file":"StepNavigation.js","sourceRoot":"","sources":["../../../src/components/tour/StepNavigation.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AACjD,OAAO,yCAAyC,CAAA;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAyBhC;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,UAAU,EAAmB,EAAE,EAAE;IACrF,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,OAAO,EAAE,CAAA;IAC9D,MAAM,CAAC,GAAG,YAAY,CAAC,YAAY,CAAC,CAAA;IAEpC,OAAO,MAAC,IAAI,IAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,aAAa,EAAC,cAAc,EAAC,eAAe,EAAC,UAAU,EAAC,QAAQ,aAC3G,KAAK,CAAC,MAAM,GAAG,CAAC;gBAChB,MAAC,IAAI,IAAC,UAAU,EAAC,YAAY,EAAC,WAAW,EAAC,sBAAsB,aAAE,WAAW,GAAG,CAAC,OAAG,CAAC,CAAC,EAAE,OAAG,KAAK,CAAC,MAAM,IAAQ,EAEjH,MAAC,IAAI,IAAC,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,aACrB,WAAW,IAAI,CAAC;wBACf,KAAC,MAAM,IAAC,EAAE,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE;gCACnD,QAAQ,EAAE,EAAE,CAAA;gCACZ,UAAU,EAAE,OAAO,EAAE,EAAE,CAAA;4BACzB,CAAC,EAAE,IAAI,EAAC,IAAI,EAAC,UAAU,EAAC,MAAM,EAAC,WAAW,EAAC,OAAO,YAC/C,UAAU,EAAE,IAAI,IAAI,CAAC,CAAC,IAAI,GACpB,EACX,KAAC,MAAM,IAAC,EAAE,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE;4BACnD,UAAU,EAAE,OAAO,EAAE,EAAE,CAAA;4BACvB,UAAU,CAAC,OAAO,CAAC,CAAA;wBACrB,CAAC,EAAE,IAAI,EAAC,IAAI,EAAC,WAAW,EAAC,OAAO,YAC7B,UAAU,EAAE,IAAI,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAChE,IACJ,IACF,CAAA;AACT,CAAC,CAAA;AAED,MAAM,YAAY,GAAG;IACnB,EAAE,EAAE;QACF,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,MAAM;KACb;IACD,EAAE,EAAE;QACF,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,YAAY;KACnB;CACF,CAAA"}

package/dist/dictionary.js

@@ -1,4 +1,4 @@
-import { getLanguage, useTranslate } from '@stack-spot/portal-translate';
+import { getLanguage, ptEn, useTranslate } from '@stack-spot/portal-translate';
 const dictionary = {
     en: {
         close: 'Close',
@@ -22,7 +22,7 @@ const dictionary = {
  */
 export const useDictionary = () => useTranslate(dictionary);
 export function getDictionary() {
-    const language = getLanguage();
+    const language = getLanguage(ptEn);
     return dictionary[language];
 }
 //# sourceMappingURL=dictionary.js.map

package/dist/dictionary.js.map

@@ -1 +1 @@
-{"version":3,"file":"dictionary.js","sourceRoot":"","sources":["../src/dictionary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,WAAW,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAEpF,MAAM,UAAU,GAAG;IACjB,EAAE,EAAE;QACF,KAAK,EAAE,OAAO;QACd,eAAe,EAAE,kDAAkD;QACnE,OAAO,EAAE,SAAS;QAClB,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,QAAQ;QAChB,MAAM,EAAE,QAAQ;KACjB;IACD,EAAE,EAAE;QACF,KAAK,EAAE,QAAQ;QACf,eAAe,EAAE,4DAA4D;QAC7E,OAAO,EAAE,WAAW;QACpB,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,UAAU;QAClB,MAAM,EAAE,QAAQ;KACjB;CACmB,CAAA;AAEtB;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC,YAAY,CAAC,UAAU,CAAC,CAAA;AAE3D,MAAM,UAAU,aAAa;IAC3B,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAA;IAC9B,OAAO,UAAU,CAAC,QAAQ,CAAC,CAAA;AAC7B,CAAC"}
+{"version":3,"file":"dictionary.js","sourceRoot":"","sources":["../src/dictionary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,WAAW,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAE1F,MAAM,UAAU,GAAG;IACjB,EAAE,EAAE;QACF,KAAK,EAAE,OAAO;QACd,eAAe,EAAE,kDAAkD;QACnE,OAAO,EAAE,SAAS;QAClB,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,QAAQ;QAChB,MAAM,EAAE,QAAQ;KACjB;IACD,EAAE,EAAE;QACF,KAAK,EAAE,QAAQ;QACf,eAAe,EAAE,4DAA4D;QAC7E,OAAO,EAAE,WAAW;QACpB,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,UAAU;QAClB,MAAM,EAAE,QAAQ;KACjB;CACmB,CAAA;AAEtB;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC,YAAY,CAAC,UAAU,CAAC,CAAA;AAE3D,MAAM,UAAU,aAAa;IAC3B,MAAM,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,CAAA;IAClC,OAAO,UAAU,CAAC,QAAQ,CAAC,CAAA;AAC7B,CAAC"}

package/dist/elements.d.ts

@@ -12,6 +12,7 @@ export declare const elementIds: {
     readonly header: "header";
     readonly menu: "menu";
     readonly menuContent: "menuContent";
+    readonly menuInnerContent: "menuInnerContent";
     readonly menuSections: "menuSections";
     readonly accessibilityAnnouncer: "accessibilityAnnouncer";
 };

package/dist/elements.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;CAab,CAAA;AAEV,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,UAAU,CAAA;AACnD,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,CAAC,CAAA;AAEtE;;GAEG;AACH,wBAAgB,iBAAiB,mBAKhC"}
+{"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;CAcb,CAAA;AAEV,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,UAAU,CAAA;AACnD,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,CAAC,CAAA;AAEtE;;GAEG;AACH,wBAAgB,iBAAiB,mBAKhC"}

package/dist/elements.js

@@ -12,6 +12,7 @@ export const elementIds = {
     header: 'header',
     menu: 'menu',
     menuContent: 'menuContent',
+    menuInnerContent: 'menuInnerContent',
     menuSections: 'menuSections',
     accessibilityAnnouncer: 'accessibilityAnnouncer',
 };

package/dist/elements.js.map

@@ -1 +1 @@
-{"version":3,"file":"elements.js","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,MAAM,EAAE,QAAQ;IAChB,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,YAAY;IACxB,YAAY,EAAE,cAAc;IAC5B,IAAI,EAAE,MAAM;IACZ,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,QAAQ;IAChB,IAAI,EAAE,MAAM;IACZ,WAAW,EAAE,aAAa;IAC1B,YAAY,EAAE,cAAc;IAC5B,sBAAsB,EAAE,wBAAwB;CACxC,CAAA;AAKV;;GAEG;AACH,MAAM,UAAU,iBAAiB;IAC/B,OAAQ,MAAM,CAAC,IAAI,CAAC,UAAU,CAAqB,CAAC,MAAM,CACxD,CAAC,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,CAAC,EAClE,EAAoB,CACrB,CAAA;AACH,CAAC"}
+{"version":3,"file":"elements.js","sourceRoot":"","sources":["../src/elements.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,MAAM,EAAE,QAAQ;IAChB,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,YAAY;IACxB,YAAY,EAAE,cAAc;IAC5B,IAAI,EAAE,MAAM;IACZ,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,QAAQ;IAChB,IAAI,EAAE,MAAM;IACZ,WAAW,EAAE,aAAa;IAC1B,gBAAgB,EAAE,kBAAkB;IACpC,YAAY,EAAE,cAAc;IAC5B,sBAAsB,EAAE,wBAAwB;CACxC,CAAA;AAKV;;GAEG;AACH,MAAM,UAAU,iBAAiB;IAC/B,OAAQ,MAAM,CAAC,IAAI,CAAC,UAAU,CAAqB,CAAC,MAAM,CACxD,CAAC,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,CAAC,EAClE,EAAoB,CACrB,CAAA;AACH,CAAC"}

package/dist/layout.css

@@ -98,7 +98,12 @@ body {
   left: calc(var(--menu-sections-width) + var(--menu-content-width));
 }
 
-#layout.no-menu-sections:not(.menu-content-visible) #page {
+#layout.menu-inner-content-visible #page {
+  left: calc(var(--menu-sections-width) + calc(var(--menu-content-width) * 2));
+}
+
+#layout.no-menu-sections:not(.menu-content-visible) #page,
+#layout.no-menu-sections:not(.menu-inner-content-visible) #page {
   border-top-left-radius: 0;
 }
 
@@ -363,7 +368,8 @@ body {
   pointer-events: auto;
 }
 
-#menuContent {
+#menuContent,
+#menuInnerContent {
   width: var(--menu-content-width);
   transition: left ease-out var(--menu-animation-duration);
   background-color: var(--light-400);
@@ -375,7 +381,13 @@ body {
   border-top: 1px solid var(--light-300);
 }
 
-#menuContent .goBackLink {
+#menuInnerContent {
+  left: var(--menu-content-width);
+  border-left: 1px solid var(--light-300);
+}
+
+#menuContent .goBackLink,
+#menuInnerContent .goBackLink {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -482,6 +494,21 @@ body {
   right: 0;
 }
 
+#modal .modal-instance,
+#rightPanel .right-panel-instance {
+  flex-direction: column;
+  flex: 1;
+  overflow: hidden;
+  display: none;
+  &.active {
+    display: flex;
+  }
+  &.disabled {
+    pointer-events: none;
+    opacity: 0.7;
+  }
+}
+
 #bottomPanel {
   position: fixed;
   display: flex;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stack-spot/portal-layout",
-  "version": "2.35.1",
+  "version": "2.36.0-beta.1",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -14,13 +14,14 @@
     "@citric/icons": "^5.9.0",
     "@citric/ui": "^6.10.1",
     "@stack-spot/portal-theme": "^1.1.1",
-    "@stack-spot/portal-translate": "^1.1.0",
-    "@stack-spot/portal-components": "^2.22.4",
+    "@stack-spot/portal-translate": "~2.1.0",
+    "@stack-spot/portal-components": "^2.27.5",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "styled-components": "^6.1.10"
   },
   "devDependencies": {
+    "@types/lodash": "^4.14.202",
     "@types/react": "^18.2.37",
     "@types/react-dom": "^18.2.15",
     "@typescript-eslint/eslint-plugin": "^6.10.0",
@@ -45,6 +46,7 @@
   },
   "dependencies": {
     "react-toastify": "^10.0.5",
-    "reactour": "^1.19.4"
+    "reactour": "^1.19.4",
+    "lodash": "^4.17.21"
   }
 }

package/src/Layout.tsx

@@ -1,5 +1,5 @@
 import { FadingOverflow } from '@stack-spot/portal-components/FadingOverflow'
-import { CSSToCitricAdapter, WithStyle } from '@stack-spot/portal-theme'
+import { CSSToCitricAdapter, listToClass, WithStyle } from '@stack-spot/portal-theme'
 import '@stack-spot/portal-theme/dist/theme.css'
 import { ReactElement, ReactNode, useEffect } from 'react'
 import { overlay } from './LayoutOverlayManager'
@@ -11,7 +11,7 @@ import { DescriptionFn, ErrorHandler, ErrorManager } from './components/error/Er
 import { SilentErrorBoundary } from './components/error/SilentErrorBoundary'
 import { MenuContent } from './components/menu/MenuContent'
 import { MenuSections } from './components/menu/MenuSections'
-import { MenuProps } from './components/menu/types'
+import { MenuProps, MenuPropsWithDynamicContent } from './components/menu/types'
 import { elementIds } from './elements'
 import './layout.css'
 
@@ -56,6 +56,10 @@ interface RawProps extends WithStyle {
    * The React element to go in the menu content.
    */
   menuContent?: ReactElement,
+  /**
+   * The React element to go in the menu inner content (third level nav).
+   */
+  menuInnerContent?: ReactElement,
   /**
    * The React element to go in the header.
    */
@@ -83,7 +87,7 @@ interface RawProps extends WithStyle {
  * @param props the component's props {@link RawProps}.
  */
 export const RawLayout = (
-  { menuSections, menuContent, header, children,
+  { menuSections, menuContent, menuInnerContent, header, children,
     extra, errorDescriptor, onError, className, style }:
     RawProps,
 ) => {
@@ -99,30 +103,38 @@ export const RawLayout = (
   useEffect(() => {
     const classList = document.getElementById(elementIds.layout)?.classList
     if (!classList) return
+    const hasMenuContent = !!menuContent && !!document.getElementById(elementIds.menuContent)?.children.length
+    const hasMenuInnerContent = !!menuInnerContent && !!document.getElementById(elementIds.menuInnerContent)?.children.length
 
-    if (menuContent && document.getElementById(elementIds.menuContent)?.children.length) {
+    if (hasMenuContent) {
       classList.add('menu-content-visible')
-      if (!classList.contains('menu-manual'))
+      if (!classList.contains('menu-manual')) {
         classList.add('menu-compact')
-    }
-    else {
+      }
+    } else {
       classList.remove('menu-content-visible')
-      if (!classList.contains('menu-manual'))
-        classList.remove('menu-compact')
     }
+
+    if (hasMenuInnerContent) {
+      classList.add('menu-inner-content-visible')
+    } else {
+      classList.remove('menu-inner-content-visible')
+    }
+
     classList[menuSections ? 'remove' : 'add']('no-menu-sections')
     if (className) classList.add(...className.split(/\s+/))
-      
-  })
-
+  }, [menuContent, menuInnerContent, menuSections, className])
 
   return (
     <CSSToCitricAdapter>
       <WelcomeTour />
-      <div id={elementIds.layout} style={style}>
+      <div id={elementIds.layout} style={style} className="menu-manual menu-compact">
         {header && <header id={elementIds.header}><SilentErrorBoundary>{header}</SilentErrorBoundary></header>}
         {extra && <SilentErrorBoundary>{extra}</SilentErrorBoundary>}
         <aside id={elementIds.menu}>
+          {menuInnerContent &&
+            <nav role="menubar" id={elementIds.menuInnerContent}><SilentErrorBoundary>{menuInnerContent}</SilentErrorBoundary></nav>
+          }
           <nav role="menubar" id={elementIds.menuContent}><SilentErrorBoundary>{menuContent}</SilentErrorBoundary></nav>
           {menuSections &&
             <FadingOverflow sides={['top', 'bottom']} scroll="arrows">
@@ -137,8 +149,37 @@ export const RawLayout = (
         </div>}
         <div id={elementIds.bottomDialog} role="dialog"><ErrorBoundary>{bottomDialog}</ErrorBoundary></div>
         <div id={elementIds.backdrop}>
-          <div id={elementIds.rightPanel} aria-modal role="dialog"><ErrorBoundary>{rightPanel}</ErrorBoundary></div>
-          <div id={elementIds.modal} aria-modal role="dialog"><ErrorBoundary>{modal}</ErrorBoundary></div>
+          <div id={elementIds.rightPanel} aria-modal role="dialog">
+            <ErrorBoundary>
+              {rightPanel.length === 1 && !rightPanel[0].stack
+                ? rightPanel[0].element
+                : rightPanel.map(
+                  (m, i) => <div
+                    key={i}
+                    className={listToClass([
+                      'right-panel-instance',
+                      (i === rightPanel.length - 1) && 'active',
+                      modal.length > 0 && 'disabled',
+                    ])}
+                    {...(modal.length > 0 ? { inert: true } : {})}
+                  >
+                    {m.element}
+                  </div>,
+                )
+              }
+            </ErrorBoundary>
+          </div>
+          <div id={elementIds.modal} aria-modal role="dialog">
+            <ErrorBoundary>
+              {modal.length === 1 && !modal[0].stack
+                ? modal[0].element
+                : modal.map(
+                  (m, i) =>
+                    <div key={i} className={listToClass(['modal-instance', (i === modal.length - 1) && 'active'])}>{m.element}</div>,
+                )
+              }
+            </ErrorBoundary>
+          </div>
         </div>
         <Toaster />
         <div id={elementIds.accessibilityAnnouncer} aria-atomic aria-live="assertive">
@@ -153,6 +194,8 @@ const MenuContentRenderer = ({ content }: Required<Pick<Props['menu'], 'content'
   return <MenuContent {...menuContent} />
 }
 
+const hasInnerContent = (menu: MenuProps): menu is MenuPropsWithDynamicContent => 'innerContent' in menu
+
 /**
  * Renders the layout with a menu and header that follow the config objects passed as parameter.
  * @param props the component's props {@link Props}.
@@ -161,9 +204,15 @@ export const Layout = ({ menu, header, children, extra, errorDescriptor, onError
   <RawLayout
     header={<Header {...header} />}
     menuSections={menu.sections ? <MenuSections {...menu} /> : undefined}
-    menuContent={menu.content
-      ? <MenuContentRenderer key={'contentKey' in menu ? menu.contentKey : undefined} content={menu.content} />
-      : undefined
+    menuContent={
+      menu.content
+        ? <MenuContentRenderer key={'contentKey' in menu ? menu.contentKey : undefined} content={menu.content} />
+        : undefined
+    }
+    menuInnerContent={
+      hasInnerContent(menu) && menu.innerContent
+        ? <MenuContentRenderer key={'contentKey' in menu ? menu.contentKey : undefined} content={menu.innerContent} />
+        : undefined
     }
     errorDescriptor={errorDescriptor}
     onError={onError}