@stack-spot/portal-layout 0.0.23 → 0.0.25

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.
Files changed (35) hide show
  1. package/dist/Layout.d.ts +2 -2
  2. package/dist/Layout.d.ts.map +1 -1
  3. package/dist/Layout.js +1 -1
  4. package/dist/Layout.js.map +1 -1
  5. package/dist/LayoutOverlayManager.js.map +1 -1
  6. package/dist/components/PortalSwitcher.d.ts.map +1 -1
  7. package/dist/components/PortalSwitcher.js +12 -4
  8. package/dist/components/PortalSwitcher.js.map +1 -1
  9. package/dist/components/SelectionList.js.map +1 -1
  10. package/dist/components/menu/MenuContent.d.ts +546 -1
  11. package/dist/components/menu/MenuContent.d.ts.map +1 -1
  12. package/dist/components/menu/MenuContent.js +3 -3
  13. package/dist/components/menu/MenuContent.js.map +1 -1
  14. package/dist/components/menu/MenuSections.d.ts.map +1 -1
  15. package/dist/components/menu/MenuSections.js +13 -8
  16. package/dist/components/menu/MenuSections.js.map +1 -1
  17. package/dist/components/menu/PageSelector.js.map +1 -1
  18. package/dist/components/menu/types.d.ts +9 -1
  19. package/dist/components/menu/types.d.ts.map +1 -1
  20. package/dist/components/menu/useCheckTextOverflow.js.map +1 -1
  21. package/dist/dictionary.d.ts +1 -1
  22. package/dist/index.d.ts +3 -2
  23. package/dist/index.d.ts.map +1 -1
  24. package/dist/index.js +3 -2
  25. package/dist/index.js.map +1 -1
  26. package/dist/layout.css +2 -1
  27. package/dist/utils.js.map +1 -1
  28. package/package.json +1 -1
  29. package/src/Layout.tsx +8 -6
  30. package/src/components/PortalSwitcher.tsx +32 -17
  31. package/src/components/menu/MenuContent.tsx +3 -3
  32. package/src/components/menu/MenuSections.tsx +22 -12
  33. package/src/components/menu/types.ts +9 -1
  34. package/src/index.ts +3 -2
  35. package/src/layout.css +2 -1
@@ -31,7 +31,7 @@ function showOverlay() {
31
31
  function isMenuContentVisible() {
32
32
  return !!document.getElementById('layout')?.classList?.contains('menu-content-visible');
33
33
  }
34
- const Section = ({ icon, label, href, target, onClick, active, content, onOpen, setCurrentOverlay, id, hasContent, }) => {
34
+ const Section = ({ icon, label, href, target, onClick, active, content, customContent, onOpen, setCurrentOverlay, id, hasContent, }) => {
35
35
  const contentToRender = typeof content === 'function' ? content() : content;
36
36
  function shouldShowOverlay() {
37
37
  /* The overlay should appear if:
@@ -40,7 +40,7 @@ const Section = ({ icon, label, href, target, onClick, active, content, onOpen,
40
40
  * 2. The section is inactive OR:
41
41
  * 2.1. The contextual menu is hidden.
42
42
  */
43
- return (!!contentToRender || (hasContent && active)) && (!active || !isMenuContentVisible());
43
+ return (!!contentToRender || !!customContent || (hasContent && active)) && (!active || !isMenuContentVisible());
44
44
  }
45
45
  function showOverlayAndFixArrowPosition(event) {
46
46
  if (!shouldShowOverlay())
@@ -61,7 +61,10 @@ const Section = ({ icon, label, href, target, onClick, active, content, onOpen,
61
61
  }
62
62
  return (_jsx("li", { title: label, className: active ? 'active' : undefined, children: _jsxs("a", { href: href, target: target, onClick: click, onMouseEnter: showOverlayAndFixArrowPosition, onMouseLeave: () => shouldShowOverlay() && hideOverlay(), title: label, "aria-label": label, onKeyDown: onClick ? e => e.key === 'Enter' && onClick() : undefined, ...(active ? { 'aria-current': 'page' } : undefined), children: [icon, _jsx(Text, { appearance: "microtext1", className: "section-label", children: label })] }) }, label));
63
63
  };
64
- const OverlayRenderer = ({ content }) => {
64
+ const OverlayRenderer = ({ content, customContent }) => {
65
+ if (customContent) {
66
+ return _jsxs(_Fragment, { children: [" ", customContent, " "] });
67
+ }
65
68
  const data = typeof content === 'function' ? content() : content;
66
69
  return _jsx("div", { children: _jsx(MenuContent, { ...data }) });
67
70
  };
@@ -83,7 +86,7 @@ export const MenuSections = ({ sections = [], ...props }) => {
83
86
  }, []);
84
87
  // the current overlay showing, when the user hovers the section icon. This is the index of the item in the sections array.
85
88
  const [currentOverlay, setCurrentOverlay] = useState();
86
- const sectionItems = useMemo(() => sections.map((s, i) => _jsx(Section, { id: i, ...s, setCurrentOverlay: setCurrentOverlay, hasContent: !!props.content }, i)), [sections]);
89
+ const sectionItems = useMemo(() => sections.map((s, i) => _jsx(Section, { id: i, ...s, setCurrentOverlay: setCurrentOverlay, hasContent: !!props.content || !!props.customContent }, i)), [sections]);
87
90
  /* This function renders the section preview in the overlay in normal circumstances. If the menu is hidden and the section is active,
88
91
  instead of rendering the section preview, it will render the actual menu content, which would be invisible otherwise.
89
92
  Below, the key is of extreme importance. It ensures React will consider every section content to be an entirely different
@@ -92,12 +95,14 @@ export const MenuSections = ({ sections = [], ...props }) => {
92
95
  function renderMenuOverlay() {
93
96
  if (currentOverlay === undefined)
94
97
  return null;
95
- const shouldRenderMenuContentInstead = !isMenuContentVisible() && sections[currentOverlay].active && !!props.content;
98
+ const shouldRenderMenuContentInstead = !isMenuContentVisible() && sections[currentOverlay].active &&
99
+ (!!props.content || !!props.customContent);
96
100
  return shouldRenderMenuContentInstead
97
- ? _jsx(OverlayRenderer, { content: props.content }, 'contentKey' in props ? props.contentKey : undefined)
98
- : _jsx(OverlayRenderer, { content: sections[currentOverlay].content }, currentOverlay);
101
+ ? _jsx(OverlayRenderer, { content: props.content, customContent: props.customContent }, 'contentKey' in props ? props.contentKey : undefined)
102
+ : _jsx(OverlayRenderer, { content: sections[currentOverlay].content, customContent: sections[currentOverlay].customContent }, currentOverlay);
99
103
  }
100
- return (_jsxs(_Fragment, { children: [_jsx("ul", { children: sectionItems }), !!props.content && _jsx("button", { className: "toggle", onClick: toggleMenu, title: t.toggle, tabIndex: -1, "aria-hidden": true, children: _jsxs(IconBox, { children: [_jsx(MenuIcon, { className: "expand" }), _jsx(ChevronLeft, { className: "collapse" })] }) }), _jsxs("div", { id: "menuContentOverlay", onMouseEnter: showOverlay, onMouseLeave: hideOverlay, children: [renderMenuOverlay(), _jsx("div", { className: "arrow" })] })] }));
104
+ return (_jsxs(_Fragment, { children: [_jsx("ul", { children: sectionItems }), (!!props.content || !!props.customContent) &&
105
+ _jsx("button", { className: "toggle", onClick: toggleMenu, title: t.toggle, tabIndex: -1, "aria-hidden": true, children: _jsxs(IconBox, { children: [_jsx(MenuIcon, { className: "expand" }), _jsx(ChevronLeft, { className: "collapse" })] }) }), _jsxs("div", { id: "menuContentOverlay", onMouseEnter: showOverlay, onMouseLeave: hideOverlay, children: [renderMenuOverlay(), _jsx("div", { className: "arrow" })] })] }));
101
106
  };
102
107
  const dictionary = {
103
108
  en: {
@@ -1 +1 @@
1
- {"version":3,"file":"MenuSections.js","sourceRoot":"","sources":["../../../src/components/menu/MenuSections.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"MenuSections.js","sourceRoot":"","sources":["../../../src/components/menu/MenuSections.tsx"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"PageSelector.js","sourceRoot":"","sources":["../../../src/components/menu/PageSelector.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"PageSelector.js","sourceRoot":"","sources":["../../../src/components/menu/PageSelector.tsx"],"names":[],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import { ReactElement } from 'react';
1
+ import { ReactElement, ReactNode } from 'react';
2
2
  import { Action } from '../types.js';
3
3
  interface BaseMenuItem {
4
4
  hidden?: boolean;
@@ -58,12 +58,20 @@ export interface MenuSection extends Action {
58
58
  * Tip: this function can be a React Hook.
59
59
  */
60
60
  content?: MenuSectionContent | (() => MenuSectionContent);
61
+ /**
62
+ * The content or a function that creates the content.
63
+ * If this is a function, it will be called only when the section is hovered, i.e. only when the content really needs to be rendered.
64
+ * Tip: this function can be a React Hook.
65
+ * This should be used when the content you want to render is not the default content
66
+ */
67
+ customContent?: ReactNode;
61
68
  active?: boolean;
62
69
  onOpen?: () => void;
63
70
  }
64
71
  interface BaseMenuProps {
65
72
  sections?: MenuSection[];
66
73
  compact?: boolean;
74
+ customContent?: ReactNode;
67
75
  }
68
76
  interface MenuPropsWithStaticContent extends BaseMenuProps {
69
77
  content?: MenuSectionContent;
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/menu/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,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,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,QAAQ,EAAE,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,UAAW,SAAQ,MAAM,EAAE,YAAY;IACtD,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,UAAU,CAAA;AAE7C,MAAM,WAAW,UAAW,SAAQ,MAAM;IACxC,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,MAAM;IAC1C,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,YAAY,CAAC,EAAE,QAAQ,CAAC;IACxB,OAAO,CAAC,EAAE,QAAQ,EAAE,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,WAAY,SAAQ,MAAM;IACzC,IAAI,EAAE,YAAY,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,kBAAkB,GAAG,CAAC,MAAM,kBAAkB,CAAC,CAAC;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,UAAU,aAAa;IACrB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,UAAU,0BAA2B,SAAQ,aAAa;IACxD,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED,UAAU,2BAA4B,SAAQ,aAAa;IACzD;;;;;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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/menu/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,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,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,QAAQ,EAAE,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,UAAW,SAAQ,MAAM,EAAE,YAAY;IACtD,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,UAAU,CAAA;AAE7C,MAAM,WAAW,UAAW,SAAQ,MAAM;IACxC,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,MAAM;IAC1C,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,YAAY,CAAC,EAAE,QAAQ,CAAC;IACxB,OAAO,CAAC,EAAE,QAAQ,EAAE,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,WAAY,SAAQ,MAAM;IACzC,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,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,UAAU,aAAa;IACrB,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,SAAS,CAAC;CAC3B;AAED,UAAU,0BAA2B,SAAQ,aAAa;IACxD,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED,UAAU,2BAA4B,SAAQ,aAAa;IACzD;;;;;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"}
@@ -1 +1 @@
1
- {"version":3,"file":"useCheckTextOverflow.js","sourceRoot":"","sources":["../../../src/components/menu/useCheckTextOverflow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEpD,MAAM,UAAU,oBAAoB;IAClC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAA;IACxD,MAAM,GAAG,GAAG,MAAM,CAAuB,IAAI,CAAC,CAAA;IAE9C,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE;YAChB,OAAM;SACP;QAED,MAAM,WAAW,GAAG,GAAG,CAAC,OAAO,CAAC,WAAW,GAAG,GAAG,CAAC,OAAO,CAAC,WAAW,CAAA;QAErE,IAAI,WAAW,KAAK,QAAQ,EAAE;YAC5B,OAAM;SACP;QAED,WAAW,CAAC,WAAW,CAAC,CAAA;IAC1B,CAAC,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,EAAE,CAAA;IACjB,CAAC,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAA;IAEjB,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAA;AAC1B,CAAC"}
1
+ {"version":3,"file":"useCheckTextOverflow.js","sourceRoot":"","sources":["../../../src/components/menu/useCheckTextOverflow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEpD,MAAM,UAAU,oBAAoB;IAClC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAA;IACxD,MAAM,GAAG,GAAG,MAAM,CAAuB,IAAI,CAAC,CAAA;IAE9C,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC;YACjB,OAAM;QACR,CAAC;QAED,MAAM,WAAW,GAAG,GAAG,CAAC,OAAO,CAAC,WAAW,GAAG,GAAG,CAAC,OAAO,CAAC,WAAW,CAAA;QAErE,IAAI,WAAW,KAAK,QAAQ,EAAE,CAAC;YAC7B,OAAM;QACR,CAAC;QAED,WAAW,CAAC,WAAW,CAAC,CAAA;IAC1B,CAAC,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,EAAE,CAAA;IACjB,CAAC,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAA;IAEjB,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAA;AAC1B,CAAC"}
@@ -1,4 +1,4 @@
1
- export declare const useDictionary: () => Record<"cancel" | "close" | "validationLabel" | "dismiss" | "confirm", string>;
1
+ export declare const useDictionary: () => Record<"close" | "validationLabel" | "dismiss" | "confirm" | "cancel", string>;
2
2
  export declare function getDictionary(): {
3
3
  close: string;
4
4
  validationLabel: string;
package/dist/index.d.ts CHANGED
@@ -1,10 +1,11 @@
1
- export { Layout } from './Layout.js';
1
+ export { Layout, RawLayout } from './Layout.js';
2
2
  export { overlay } from './LayoutOverlayManager.js';
3
3
  export { Dialog } from './components/Dialog.js';
4
4
  export { Header, HeaderProps } from './components/Header.js';
5
5
  export { OverlayContent } from './components/OverlayContent.js';
6
+ export { PortalSwitcher } from './components/PortalSwitcher.js';
6
7
  export { ListAction, SelectionList, SelectionListProps } from './components/SelectionList.js';
7
- export { MenuContent } from './components/menu/MenuContent.js';
8
+ export { MenuContent, Title, MenuGroup, ActionItem } from './components/menu/MenuContent.js';
8
9
  export { MenuSections } from './components/menu/MenuSections.js';
9
10
  export * from './components/menu/types.js';
10
11
  export * from './components/types.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAA;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAA;AAC1F,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAA;AAC7D,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,UAAU,CAAA;AACxB,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,YAAY,CAAA;AAClD,cAAc,SAAS,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAA;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAA;AAC1F,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAA;AACzF,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAA;AAC7D,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,UAAU,CAAA;AACxB,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,YAAY,CAAA;AAClD,cAAc,SAAS,CAAA"}
package/dist/index.js CHANGED
@@ -1,10 +1,11 @@
1
- export { Layout } from './Layout.js';
1
+ export { Layout, RawLayout } from './Layout.js';
2
2
  export { overlay } from './LayoutOverlayManager.js';
3
3
  export { Dialog } from './components/Dialog.js';
4
4
  export { Header } from './components/Header.js';
5
5
  export { OverlayContent } from './components/OverlayContent.js';
6
+ export { PortalSwitcher } from './components/PortalSwitcher.js';
6
7
  export { SelectionList } from './components/SelectionList.js';
7
- export { MenuContent } from './components/menu/MenuContent.js';
8
+ export { MenuContent, Title, MenuGroup, ActionItem } from './components/menu/MenuContent.js';
8
9
  export { MenuSections } from './components/menu/MenuSections.js';
9
10
  export * from './components/menu/types.js';
10
11
  export * from './components/types.js';
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAA;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,MAAM,EAAe,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAc,aAAa,EAAsB,MAAM,4BAA4B,CAAA;AAC1F,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAA;AAC7D,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,UAAU,CAAA;AACxB,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,YAAY,CAAA;AAClD,cAAc,SAAS,CAAA"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAA;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,MAAM,EAAe,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAA;AAC5D,OAAO,EAAc,aAAa,EAAsB,MAAM,4BAA4B,CAAA;AAC1F,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAA;AACzF,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAA;AAC7D,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,UAAU,CAAA;AACxB,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,YAAY,CAAA;AAClD,cAAc,SAAS,CAAA"}
package/dist/layout.css CHANGED
@@ -45,6 +45,7 @@ body {
45
45
  --modal-animation-duration: 0.3s;
46
46
  --right-panel-animation-duration: 0.3s;
47
47
  --menu-animation-duration: 0.3s;
48
+ --menu-overlay-width: 332px;
48
49
  --toastify-font-family: 'Roboto', sans-serif;
49
50
  }
50
51
 
@@ -199,7 +200,7 @@ body {
199
200
  }
200
201
 
201
202
  #menuContentOverlay {
202
- width: 232px;
203
+ width: var(--menu-overlay-width);
203
204
  position: fixed;
204
205
  top: calc(var(--header-height) + 15px);
205
206
  left: calc(var(--menu-sections-width) + 15px);
package/dist/utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stack-spot/portal-layout",
3
- "version": "0.0.23",
3
+ "version": "0.0.25",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
package/src/Layout.tsx CHANGED
@@ -25,8 +25,8 @@ interface Props extends WithStyle {
25
25
  interface RawProps extends WithStyle {
26
26
  menuSections?: ReactElement,
27
27
  menuContent?: ReactElement,
28
- header: ReactElement,
29
- children: ReactNode,
28
+ header?: ReactElement,
29
+ children?: ReactNode,
30
30
  compactMenu?: boolean,
31
31
  extra?: ReactNode,
32
32
  errorDescriptor?: DescriptionFn,
@@ -34,7 +34,9 @@ interface RawProps extends WithStyle {
34
34
  }
35
35
 
36
36
  export const RawLayout = (
37
- { menuSections, menuContent, header, compactMenu = true, children, extra, errorDescriptor, onError, className, style }: RawProps,
37
+ { menuSections, menuContent, header, compactMenu = true, children,
38
+ extra, errorDescriptor, onError, className, style }:
39
+ RawProps,
38
40
  ) => {
39
41
  // @ts-ignore
40
42
  const { bottomDialog, modal, rightPanel } = overlay.useOverlays()
@@ -53,15 +55,15 @@ export const RawLayout = (
53
55
  return (
54
56
  <CSSToCitricAdapter>
55
57
  <div id={elementIds.layout} className={listToClass(classes)} style={style}>
56
- <div id={elementIds.page}>
58
+ {children && <div id={elementIds.page}>
57
59
  <article id={elementIds.content}><ErrorBoundary>{children}</ErrorBoundary></article>
58
- </div>
60
+ </div>}
59
61
  {extra && <SilentErrorBoundary>{extra}</SilentErrorBoundary>}
60
62
  <aside id={elementIds.menu}>
61
63
  <nav id={elementIds.menuContent}><SilentErrorBoundary>{menuContent}</SilentErrorBoundary></nav>
62
64
  {menuSections && <nav id={elementIds.menuSections}><SilentErrorBoundary>{menuSections}</SilentErrorBoundary></nav>}
63
65
  </aside>
64
- <header id={elementIds.header}><SilentErrorBoundary>{header}</SilentErrorBoundary></header>
66
+ {header && <header id={elementIds.header}><SilentErrorBoundary>{header}</SilentErrorBoundary></header>}
65
67
  <div id={elementIds.bottomDialog} role="dialog"><ErrorBoundary>{bottomDialog}</ErrorBoundary></div>
66
68
  <div id={elementIds.backdrop}>
67
69
  <div id={elementIds.rightPanel} aria-modal role="dialog"><ErrorBoundary>{rightPanel}</ErrorBoundary></div>
@@ -1,4 +1,4 @@
1
- import { Box, Flex, IconBox, LinkBox, Styles, Text } from '@citric/core'
1
+ import { Box, Button, Flex, IconBox, Styles, Text } from '@citric/core'
2
2
  import { ArrowRight, CheckCircleFill, Select } from '@citric/icons'
3
3
  import { Dropdown, DropdownItem } from '@citric/ui'
4
4
  import { useTranslate } from '@stack-spot/portal-translate'
@@ -7,6 +7,7 @@ import { AI } from '../svg/AI'
7
7
  import { EDP } from '../svg/EDP'
8
8
  import { HUB } from '../svg/HUB'
9
9
  import { Logo } from '../svg/Logo'
10
+ import { announce } from '..'
10
11
  import { PortalAcronym } from './types'
11
12
 
12
13
 
@@ -69,31 +70,41 @@ export const PortalSwitcher = ({ portals }: PortalSwitcherProps) => {
69
70
  const currentPortal = portals?.find(portal => location.href.startsWith(portal.url))
70
71
 
71
72
  return <Flex flexDirection="column">
72
- <Box onClick={() => currentPortal && setIsOpen(true)} sx={styles.currentPortal}>
73
- {currentPortal ?
73
+ {currentPortal ?
74
+ <Button
75
+ appearance="text"
76
+ colorScheme="light"
77
+ aria-label={t.portalSwitcher}
78
+ onClick={() => {
79
+ setIsOpen(true)
80
+ announce(`${t.portalSwitcher} ${t.selected}`)
81
+ }} sx={styles.currentPortal}>
74
82
  <Flex alignItems="center">
75
83
  {Logos[currentPortal.acronym]}
76
84
  <IconBox size="xs" ml={3}>
77
85
  <Select />
78
86
  </IconBox>
79
- </Flex> :
80
- <Logo />}
81
- </Box>
87
+ </Flex>
88
+ </Button> :
89
+ <Logo />}
82
90
  <Dropdown sx={styles.dropdown} ref={dropRef} onClose={() => setIsOpen(false)} visible={isOpen} visibleHeight="24rem">
83
91
  <Box sx={styles.dropdownWraper}>
84
92
  {portals?.map((portal, index) => (
85
- <DropdownItem key={index} sx={styles.dropdownItem}>
86
- <LinkBox href={portal.url}>
87
- <Flex flexWrap="nowrap">
88
- <Flex flexDirection="column">
89
- {Logos[portal.acronym]}
90
- <Text appearance="microtext1" mt={3} colorScheme="light.700">{t[portal.acronym]}</Text>
91
- </Flex>
92
- <IconBox>
93
- {portal.acronym === currentPortal?.acronym ? <CheckCircleFill /> : <ArrowRight />}
94
- </IconBox>
93
+ <DropdownItem
94
+ as="a"
95
+ key={index}
96
+ onClick={() => announce(`${portal.acronym} ${t.selected}`)}
97
+ sx={styles.dropdownItem}
98
+ aria-label={`${portal.acronym}: ${t[portal.acronym]}`} href={portal.url}>
99
+ <Flex flexWrap="nowrap">
100
+ <Flex flexDirection="column">
101
+ {Logos[portal.acronym]}
102
+ <Text appearance="microtext1" mt={3} colorScheme="light.700">{t[portal.acronym]}</Text>
95
103
  </Flex>
96
- </LinkBox>
104
+ <IconBox>
105
+ {portal.acronym === currentPortal?.acronym ? <CheckCircleFill /> : <ArrowRight />}
106
+ </IconBox>
107
+ </Flex>
97
108
  </DropdownItem>))}
98
109
  </Box>
99
110
  </Dropdown>
@@ -106,10 +117,14 @@ const translations = {
106
117
  EDP: 'Efficient and secure solutions from code to production deployment.',
107
118
  AI: 'Speed up coding with efficient suggestions and high-quality results.',
108
119
  HUB: 'Discover AI Stacks, knowledge sources, and quick commands, all in one streamlined hub.',
120
+ portalSwitcher: 'Portal switcher',
121
+ selected: 'selected',
109
122
  },
110
123
  pt: {
111
124
  EDP: 'Soluções eficientes e seguras do código até a implantação em produção.',
112
125
  AI: 'Acelere o desenvolvimento com sugestões eficientes e resultados de alta qualidade.',
113
126
  HUB: 'Descubra AI Stacks, knownledge sources e quick commands, tudo em um hub simplificado.',
127
+ portalSwitcher: 'Seletor de portais',
128
+ selected: 'selecionado',
114
129
  },
115
130
  }
@@ -20,7 +20,7 @@ const BackLink = styled.a`
20
20
  gap: 6px;
21
21
  `
22
22
 
23
- const MenuGroup = styled.ul`
23
+ export const MenuGroup = styled.ul`
24
24
  padding: 0 0 0 16px;
25
25
  display: flex;
26
26
  flex-direction: column;
@@ -127,13 +127,13 @@ const MenuGroup = styled.ul`
127
127
  }
128
128
  `
129
129
 
130
- const Title = styled.header`
130
+ export const Title = styled.header`
131
131
  display: flex;
132
132
  flex-direction: column;
133
133
  margin: ${PADDING}px 0 24px ${PADDING}px;
134
134
  `
135
135
 
136
- const ActionItem = ({ label, onClick, href, active, icon, badge, overflow = 'wrap' }: MenuAction) => {
136
+ export const ActionItem = ({ label, onClick, href, active, icon, badge, overflow = 'wrap' }: MenuAction) => {
137
137
  const { ref, overflow: textOverflow } = useCheckTextOverflow()
138
138
  return (
139
139
  <a
@@ -45,6 +45,7 @@ const Section = ({
45
45
  onClick,
46
46
  active,
47
47
  content,
48
+ customContent,
48
49
  onOpen,
49
50
  setCurrentOverlay,
50
51
  id,
@@ -59,7 +60,7 @@ const Section = ({
59
60
  * 2. The section is inactive OR:
60
61
  * 2.1. The contextual menu is hidden.
61
62
  */
62
- return (!!contentToRender || (hasContent && active)) && (!active || !isMenuContentVisible())
63
+ return (!!contentToRender || !!customContent || (hasContent && active)) && (!active || !isMenuContentVisible())
63
64
  }
64
65
 
65
66
  function showOverlayAndFixArrowPosition(event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) {
@@ -99,7 +100,11 @@ const Section = ({
99
100
  )
100
101
  }
101
102
 
102
- const OverlayRenderer = ({ content }: Pick<MenuSection, 'content'>) => {
103
+ const OverlayRenderer = ({ content, customContent }: Pick<MenuSection, 'content' | 'customContent'>) => {
104
+ if (customContent) {
105
+ return <> {customContent} </>
106
+ }
107
+
103
108
  const data = typeof content === 'function' ? content() : content
104
109
  return <div><MenuContent {...data} /></div>
105
110
  }
@@ -122,7 +127,8 @@ export const MenuSections = ({ sections = [], ...props }: MenuProps) => {
122
127
  const [currentOverlay, setCurrentOverlay] = useState<number | undefined>()
123
128
 
124
129
  const sectionItems = useMemo(
125
- () => sections.map((s, i) => <Section key={i} id={i} {...s} setCurrentOverlay={setCurrentOverlay} hasContent={!!props.content} />),
130
+ () => sections.map((s, i) => <Section key={i} id={i} {...s} setCurrentOverlay={setCurrentOverlay}
131
+ hasContent={!!props.content || !!props.customContent} />),
126
132
  [sections],
127
133
  )
128
134
 
@@ -133,21 +139,25 @@ export const MenuSections = ({ sections = [], ...props }: MenuProps) => {
133
139
  hook, this would cause some serious problems. */
134
140
  function renderMenuOverlay() {
135
141
  if (currentOverlay === undefined) return null
136
- const shouldRenderMenuContentInstead = !isMenuContentVisible() && sections[currentOverlay].active && !!props.content
142
+ const shouldRenderMenuContentInstead = !isMenuContentVisible() && sections[currentOverlay].active &&
143
+ (!!props.content || !!props.customContent)
137
144
  return shouldRenderMenuContentInstead
138
- ? <OverlayRenderer key={'contentKey' in props ? props.contentKey : undefined} content={props.content} />
139
- : <OverlayRenderer key={currentOverlay} content={sections[currentOverlay].content} />
145
+ ? <OverlayRenderer key={'contentKey' in props ? props.contentKey : undefined} content={props.content}
146
+ customContent={props.customContent} />
147
+ : <OverlayRenderer key={currentOverlay} content={sections[currentOverlay].content}
148
+ customContent={sections[currentOverlay].customContent} />
140
149
  }
141
150
 
142
151
  return (
143
152
  <>
144
153
  <ul>{sectionItems}</ul>
145
- {!!props.content && <button className="toggle" onClick={toggleMenu} title={t.toggle} tabIndex={-1} aria-hidden>
146
- <IconBox>
147
- <MenuIcon className="expand" />
148
- <ChevronLeft className="collapse" />
149
- </IconBox>
150
- </button>}
154
+ {(!!props.content || !!props.customContent) &&
155
+ <button className="toggle" onClick={toggleMenu} title={t.toggle} tabIndex={-1} aria-hidden>
156
+ <IconBox>
157
+ <MenuIcon className="expand" />
158
+ <ChevronLeft className="collapse" />
159
+ </IconBox>
160
+ </button>}
151
161
  <div id="menuContentOverlay" onMouseEnter={showOverlay} onMouseLeave={hideOverlay}>
152
162
  {renderMenuOverlay()}
153
163
  <div className="arrow"></div>
@@ -1,4 +1,4 @@
1
- import { ReactElement } from 'react'
1
+ import { ReactElement, ReactNode } from 'react'
2
2
  import { Action } from '../types'
3
3
 
4
4
  interface BaseMenuItem {
@@ -67,6 +67,13 @@ export interface MenuSection extends Action {
67
67
  * Tip: this function can be a React Hook.
68
68
  */
69
69
  content?: MenuSectionContent | (() => MenuSectionContent),
70
+ /**
71
+ * The content or a function that creates the content.
72
+ * If this is a function, it will be called only when the section is hovered, i.e. only when the content really needs to be rendered.
73
+ * Tip: this function can be a React Hook.
74
+ * This should be used when the content you want to render is not the default content
75
+ */
76
+ customContent?: ReactNode,
70
77
  active?: boolean,
71
78
  onOpen?: () => void,
72
79
  }
@@ -74,6 +81,7 @@ export interface MenuSection extends Action {
74
81
  interface BaseMenuProps {
75
82
  sections?: MenuSection[],
76
83
  compact?: boolean,
84
+ customContent?: ReactNode,
77
85
  }
78
86
 
79
87
  interface MenuPropsWithStaticContent extends BaseMenuProps {
package/src/index.ts CHANGED
@@ -1,10 +1,11 @@
1
- export { Layout } from './Layout'
1
+ export { Layout, RawLayout } from './Layout'
2
2
  export { overlay } from './LayoutOverlayManager'
3
3
  export { Dialog } from './components/Dialog'
4
4
  export { Header, HeaderProps } from './components/Header'
5
5
  export { OverlayContent } from './components/OverlayContent'
6
+ export { PortalSwitcher } from './components/PortalSwitcher'
6
7
  export { ListAction, SelectionList, SelectionListProps } from './components/SelectionList'
7
- export { MenuContent } from './components/menu/MenuContent'
8
+ export { MenuContent, Title, MenuGroup, ActionItem } from './components/menu/MenuContent'
8
9
  export { MenuSections } from './components/menu/MenuSections'
9
10
  export * from './components/menu/types'
10
11
  export * from './components/types'
package/src/layout.css CHANGED
@@ -45,6 +45,7 @@ body {
45
45
  --modal-animation-duration: 0.3s;
46
46
  --right-panel-animation-duration: 0.3s;
47
47
  --menu-animation-duration: 0.3s;
48
+ --menu-overlay-width: 332px;
48
49
  --toastify-font-family: 'Roboto', sans-serif;
49
50
  }
50
51
 
@@ -199,7 +200,7 @@ body {
199
200
  }
200
201
 
201
202
  #menuContentOverlay {
202
- width: 232px;
203
+ width: var(--menu-overlay-width);
203
204
  position: fixed;
204
205
  top: calc(var(--header-height) + 15px);
205
206
  left: calc(var(--menu-sections-width) + 15px);