@pega/cosmos-react-core 3.0.0-dev.3.0 → 3.0.0-dev.30.0

package/lib/components/AppShell/AppShell.js

@@ -1,11 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
-import { forwardRef, useState, useCallback, useEffect, useMemo, useContext, useRef, useLayoutEffect } from 'react';
+import { forwardRef, useState, useCallback, useEffect, useMemo, useContext, useRef, isValidElement } from 'react';
 import Flex from '../Flex';
 import Link from '../Link';
 import Count from '../Badges/Count';
-import BareButton from '../Button/BareButton';
-import SearchInput from '../SearchInput';
 import Icon, { registerIcon } from '../Icon';
 import * as timesIcon from '../Icon/icons/times.icon';
 import * as plusIcon from '../Icon/icons/plus.icon';
@@ -13,137 +10,41 @@ import * as caseSolidIcon from '../Icon/icons/case-solid.icon';
 import * as barsIcon from '../Icon/icons/bars.icon';
 import * as caretLeftIcon from '../Icon/icons/caret-left.icon';
 import * as caretRightIcon from '../Icon/icons/caret-right.icon';
-import Text from '../Text';
 import Image from '../Image';
-import ExpandCollapse from '../ExpandCollapse';
-import { useFocusWithin, useI18n, useBreakpoint, useConsolidatedRef, useDirection, useTheme, useElement, useTransitionState } from '../../hooks';
+import { useI18n, useBreakpoint, useConsolidatedRef, useDirection, useTheme, useElement, useTransitionState } from '../../hooks';
 import { openCloseStates } from '../../hooks/useTransitionState';
 import Grid from '../Grid';
 import Button from '../Button';
 import Drawer from '../Drawer';
 import Backdrop from '../Backdrop';
-import { documentIsAvailable } from '../../utils';
-import AppShellContext from './AppShellContext';
+import Tooltip from '../Tooltip/Tooltip';
+import SkipLinks from '../SkipLinks';
+import AppShellContext, { AppShellDrawerContext } from './AppShellContext';
 import AppShellDrawer from './Drawer';
-import AppShellOperator from './Operator';
 import AppHeader from './AppHeader';
-import SkipNavigation from './SkipNavigation';
-import { StyledAppNav, StyledAppInfo, StyledSearchForm, StyledCaseTypes, StyledScrollWrap, StyledUtils, StyledNavList, StyledNestedNavList, StyledNavListItem, StyledNavListMenuButton, StyledAppMain, StyledCaseClose, StyledAppShellNavIcon, StyledNavCasesList, StyledAppEnvironment, StyledBannerRegion, StyledCountIcon, StyledUtilIconCount, StyledMobileNav } from './AppShell.styles';
+import { StyledAppNav, StyledAppInfo, StyledCaseTypes, StyledScrollWrap, StyledUtils, StyledAppMain, StyledAppShellNavIcon, StyledNavCasesList, StyledAppEnvironment, StyledBannerRegion, StyledCountIcon, StyledUtilIconCount, StyledMobileNav, StyledAppShellTooltip, StyledAppShellToggleButton } from './AppShell.styles';
+import NavigationList from './NavigationList';
+import { AppShellSearch } from './AppShellSearch';
 registerIcon(timesIcon, plusIcon, caseSolidIcon, barsIcon, caretRightIcon, caretLeftIcon);
-const NavComponents = {
-    List(props) {
-        const { items = [], nestedList, collapsed } = props;
-        let Component = StyledNavList;
-        let fwdProps = {
-            collapsed: !!collapsed
-        };
-        const { base: { animation } } = useTheme();
-        if (nestedList) {
-            fwdProps = {
-                as: ExpandCollapse,
-                forwardedAs: 'ul',
-                nullWhenCollapsed: true,
-                transitionSpeed: items.length >= 10 ? `calc(2 * ${animation.speed})` : animation.speed,
-                ...fwdProps
-            };
-            Component = StyledNestedNavList;
-        }
-        return (_jsx(Component, { ...fwdProps, children: items?.map(item => (_createElement(NavComponents.ListItem, { ...item, key: item.id || item.primary }))) }, void 0));
-    },
-    ListItem(props) {
-        const { navOpen } = useContext(AppShellContext);
-        const { visual, primary, secondary, href, onClick, items, collapseItems = false, dismissible = false, onDismiss, active, actions, forwardedRef, ...restProps } = props;
-        const t = useI18n();
-        const hasItems = Array.isArray(items) && items.length > 0;
-        const compProps = {
-            onClick,
-            href
-        };
-        let Component;
-        if (actions) {
-            Component = AppShellOperator;
-            compProps.actions = actions;
-            compProps.as = StyledNavListMenuButton;
-            compProps.popover = {
-                placement: 'right-end',
-                modifiers: [
-                    {
-                        name: 'offset',
-                        options: { offset: [-12, -16] }
-                    },
-                    {
-                        name: 'flip',
-                        options: {
-                            boundary: documentIsAvailable ? document.body : undefined,
-                            fallbackPlacements: ['top-end']
-                        }
-                    }
-                ]
-            };
-        }
-        else if (href) {
-            Component = Link;
-        }
-        else if (onClick) {
-            Component = BareButton;
-        }
-        else {
-            Component = 'div';
-        }
-        useEffect(() => {
-            if (!navOpen && actions) {
-                const node = document.getElementsByTagName('body')[0];
-                const clickEvent = document.createEvent('MouseEvent');
-                clickEvent.initEvent('mousedown', true, true);
-                node.dispatchEvent(clickEvent);
-            }
-        }, [navOpen]);
-        const { end } = useDirection();
-        return (_createElement(StyledNavListItem, { ...restProps, key: primary, nestedListCollapsed: hasItems ? collapseItems : true },
-            _jsxs(Component, { ...compProps, ref: forwardedRef, children: [visual, secondary ? (_jsxs(Flex, { container: { direction: 'column', alignItems: 'start' }, children: [_jsx("span", { children: primary }, void 0), _jsx(Text, { variant: 'secondary', children: secondary }, void 0)] }, void 0)) : (_jsx("span", { children: primary }, void 0)), (hasItems || actions) && _jsx(Icon, { name: `caret-${end}`, as: StyledAppShellNavIcon }, void 0)] }, void 0),
-            dismissible && (_jsx(Button, { icon: true, variant: 'simple', as: StyledCaseClose, onClick: onDismiss, "aria-label": t('dismiss_case'), children: _jsx(Icon, { name: 'times' }, void 0) }, void 0)),
-            hasItems && (_jsx(NavComponents.List, { nestedList: true, items: items, collapsed: !navOpen || collapseItems }, void 0))));
-    }
-};
 const CaseTypes = ({ caseTypes }) => {
-    const { navOpen } = useContext(AppShellContext);
-    const [expanded, setExpanded] = useState(false);
     const t = useI18n();
-    const toggleExpanded = useCallback(() => {
-        setExpanded(state => !state);
-    }, []);
-    useEffect(() => {
-        if (!navOpen)
-            setExpanded(false);
-    }, [navOpen]);
     const transformedCaseTypes = caseTypes.map(caseType => {
         return {
             ...caseType,
             primary: caseType.name
         };
     });
-    return useMemo(() => (_jsx(StyledCaseTypes, { expanded: expanded && navOpen, children: _jsx(NavComponents.List, { items: [
+    return useMemo(() => (_jsx(StyledCaseTypes, { children: _jsx(NavigationList, { items: [
                 {
                     primary: t('app_shell_create'),
-                    visual: _jsx(Icon, { name: 'plus', as: StyledAppShellNavIcon }, void 0),
-                    onClick: toggleExpanded,
-                    items: transformedCaseTypes,
-                    collapseItems: !expanded || !navOpen
+                    visual: _jsx(Icon, { name: 'plus', as: StyledAppShellNavIcon }),
+                    items: transformedCaseTypes
                 }
-            ] }, void 0) }, void 0)), [expanded, navOpen, toggleExpanded, caseTypes]);
+            ] }) })), [caseTypes]);
 };
 const Links = (props) => {
     const { links } = props;
-    const navLinksRef = useRef([]);
     const [transformedLinks, setTransformedLinks] = useState([]);
-    const toggleExpanded = (id) => {
-        const updatedLinks = navLinksRef.current.map(link => {
-            if (link.id === id)
-                return { ...link, collapseItems: !link.collapseItems };
-            return { ...link };
-        });
-        setTransformedLinks(updatedLinks);
-    };
     // TODO: Can this be a memo instead of a state and an effect?
     const mergedNavLinks = (items) => {
         return items.map((link) => {
@@ -151,26 +52,22 @@ const Links = (props) => {
                 ...link,
                 primary: link.name,
                 'aria-current': link.active ? 'page' : null,
-                visual: link.icon ? _jsx(Icon, { name: link.icon, as: StyledAppShellNavIcon }, void 0) : null,
-                onClick: link.links ? () => toggleExpanded(link.id) : link.onClick,
-                items: link.links ? mergedNavLinks(link.links) : undefined,
-                collapseItems: true
+                visual: link.icon ? _jsx(Icon, { name: link.icon, as: StyledAppShellNavIcon }) : null,
+                onClick: link.links ? undefined : link.onClick,
+                items: link.links ? mergedNavLinks(link.links) : undefined
             };
         });
     };
     useEffect(() => {
         setTransformedLinks(mergedNavLinks(links));
     }, [links]);
-    useEffect(() => {
-        navLinksRef.current = transformedLinks;
-    }, [transformedLinks]);
-    return (_jsx("div", { children: _jsx(NavComponents.List, { items: transformedLinks }, void 0) }, void 0));
+    return (_jsx("div", { children: _jsx(NavigationList, { items: transformedLinks }) }));
 };
 const Cases = (props) => {
     const { cases } = props;
     const setupCases = (items) => {
         return items.map((item) => {
-            const { id, primary, secondary, visual = _jsx(Icon, { name: 'case-solid', as: StyledAppShellNavIcon }, void 0), active, onClick, onDismiss } = item;
+            const { id, primary, secondary, visual = _jsx(Icon, { name: 'case-solid', as: StyledAppShellNavIcon }), active, onClick, onDismiss } = item;
             return {
                 id,
                 'aria-current': active ? 'page' : undefined,
@@ -184,79 +81,72 @@ const Cases = (props) => {
             };
         });
     };
-    return (_jsx(StyledNavCasesList, { children: _jsx(NavComponents.List, { items: setupCases(cases) }, void 0) }, void 0));
+    return (_jsx(StyledNavCasesList, { children: _jsx(NavigationList, { items: setupCases(cases) }) }));
 };
-// TODO: Need to add back re-focus support to drawer.
 export const Utils = ({ operator, items, appHeader }) => {
-    const { drawerOpen, setDrawerOpen, focusedImperatively } = useContext(AppShellContext);
-    const [transformedLinks, setTransformedLinks] = useState([]);
+    const { navOpen, navState } = useContext(AppShellContext);
     const [item, setItem] = useState();
-    const [activeUtilItem, setActiveUtilItem] = useState('');
-    const returnFocusRef = useRef(null);
+    const [drawerOpen, setDrawerOpen] = useState(false);
+    useEffect(() => {
+        if (drawerOpen && item) {
+            setItem(items?.find((utilItem) => !isValidElement(utilItem) && utilItem.name === item.name));
+        }
+    }, [items]);
     const operatorInfo = useMemo(() => appHeader
         ? []
         : [
             {
                 primary: operator.name,
                 visual: operator.avatar,
-                actions: operator.actions
+                items: operator.actions
             }
         ], [appHeader, operator.name, operator.avatar, operator.actions]);
-    // TODO: Can this be a memo instead of a state and an effect?
-    const mergedUtilItems = (drawerItems) => {
-        return drawerItems?.map((drawerItem) => {
-            return {
-                onClick: e => {
-                    returnFocusRef.current = e.currentTarget;
-                    if (drawerItem.drawerView) {
-                        setItem(drawerItem);
-                        setActiveUtilItem(drawerItem.name);
-                    }
-                },
-                ...drawerItem,
-                primary: drawerItem.name,
-                visual: drawerItem.count ? (_jsxs(StyledUtilIconCount, { children: [drawerItem.visual, _jsx(Count, { as: StyledCountIcon, variant: 'urgent', children: drawerItem.count }, void 0)] }, void 0)) : (drawerItem.visual)
-            };
-        });
-    };
-    useEffect(() => {
-        if (items) {
-            setTransformedLinks([...mergedUtilItems(items), ...operatorInfo]);
-        }
-        else {
-            setTransformedLinks(operatorInfo);
-        }
-    }, [items, operatorInfo]);
-    useEffect(() => {
-        items?.forEach(uItem => {
-            if (uItem.name === activeUtilItem) {
-                setItem(uItem);
-            }
-        });
-    }, [items]);
+    const transform = useCallback((utilItem) => {
+        const uItem = { ...utilItem };
+        delete uItem.onDrawerClose;
+        delete uItem.onDrawerOpen;
+        return {
+            onClick: () => {
+                if (utilItem.drawerView) {
+                    setItem(utilItem);
+                }
+            },
+            ...uItem,
+            primary: utilItem.name,
+            visual: utilItem.count ? (_jsxs(StyledUtilIconCount, { children: [utilItem.visual, _jsx(Count, { as: StyledCountIcon, variant: 'urgent', children: utilItem.count })] })) : (utilItem.visual),
+            collapseItems: !navOpen
+        };
+    }, [navOpen]);
+    const utilItems = useMemo(() => {
+        return [
+            ...(items ?? []).map(uItem => {
+                return isValidElement(uItem) ? uItem : transform(uItem);
+            }),
+            ...operatorInfo
+        ];
+    }, [items, operatorInfo, transform]);
     useEffect(() => {
         if (item)
             setDrawerOpen(true);
     }, [item]);
     useEffect(() => {
-        if (!drawerOpen) {
-            setActiveUtilItem('');
-            focusedImperatively.current = true;
-            returnFocusRef?.current?.focus();
-        }
-    }, [drawerOpen]);
-    return (_jsxs(_Fragment, { children: [_jsx(StyledUtils, { children: _jsx(NavComponents.List
-                // Pull onDrawerOpen and onDrawerClose off to avoid DOM passthrough warning.
-                , { 
-                    // Pull onDrawerOpen and onDrawerClose off to avoid DOM passthrough warning.
-                    items: transformedLinks.map(({ onDrawerOpen, onDrawerClose, ...util }) => util) }, void 0) }, void 0), item && (_jsx(AppShellDrawer, { content: item.drawerView, header: item.drawerHeader || item.name, onDrawerClose: () => {
+        if (navState === 'closed' || navState === 'closing')
+            setDrawerOpen(false);
+    }, [navState]);
+    return (_jsxs(AppShellDrawerContext.Provider, { value: useMemo(() => ({
+            drawerOpen,
+            closeDrawer: () => {
+                setDrawerOpen(false);
+            },
+            openDrawer: setItem
+        }), [drawerOpen]), children: [_jsx(StyledUtils, { children: _jsx(NavigationList, { items: utilItems, collapsed: true }) }), item && (_jsx(AppShellDrawer, { drawerOpen: drawerOpen, setDrawerOpen: setDrawerOpen, content: item.drawerView, header: item.drawerHeader || item.name, onDrawerClose: () => {
                     setItem(undefined);
                     item.onDrawerClose?.();
-                }, onDrawerOpen: item.onDrawerOpen }, void 0))] }, void 0));
+                }, onDrawerOpen: item.onDrawerOpen }))] }));
 };
 const AppShell = forwardRef((props, ref) => {
-    const { appInfo, searchInput, appHeader, searchLabel = 'Sitewide', // FIXME: TR
-    caseTypes, links, banners, environment: { name: envName, color: envColor } = {}, main, operator, utils, cases, ...restProps } = props;
+    const { appInfo, searchInput, appHeader, searchPage, searchLabel = 'Sitewide', // FIXME: TR
+    caseTypes, links, banners, environment: { name: envName, color: envColor } = {}, main, operator, utils, cases, defaultExpanded = false, collapsedHoverMenus = false, ...restProps } = props;
     const { appName, portalName, href: appInfoHref, onClick: appInfoOnClick, imageSrc: logoSrc, ...appInfoRestProps } = appInfo;
     let appInfoAs = 'div';
     if (appInfoHref)
@@ -264,29 +154,35 @@ const AppShell = forwardRef((props, ref) => {
     else if (appInfoOnClick)
         appInfoAs = Button;
     const t = useI18n();
-    const { start } = useDirection();
+    const { start, end } = useDirection();
     const theme = useTheme();
     const navRef = useConsolidatedRef(ref);
-    const [drawerOpen, setDrawerOpen] = useState(false);
     const [mobileNavOpen, setMobileNavOpen] = useState(false);
     const [mobileNavBackdrop, setMobileNavBackdrop] = useState(false);
-    const [refocusEl, setRefocusEl] = useState(null);
     const focusedImperatively = useRef(false);
     const [headerEl, setHeaderEl] = useElement();
     const [mobileHeaderEl, setMobileHeaderEl] = useElement();
-    const isXlOrAbove = useBreakpoint('xl');
+    const [appInfoEl, setAppInfoEl] = useElement();
+    const [expandCollapseEl, setExpandCollapseEl] = useElement();
     const isSmallOrAbove = useBreakpoint('sm');
     const showAppHeader = !!appHeader && isSmallOrAbove;
     const showMainContent = showAppHeader ? headerEl || mobileHeaderEl : true;
     const openNavTimeoutId = useRef();
     const closeNavTimeoutId = useRef();
     const previewTriggerRef = useRef(null);
+    const [searchContainerEl, setSearchContainerEl] = useState(null);
     const { state: navState, set: setNavState } = useTransitionState({
         ref: navRef,
         property: 'width',
         states: openCloseStates,
-        defaultState: isXlOrAbove ? 'open' : 'closed'
+        defaultState: defaultExpanded ? 'open' : 'closed'
     });
+    const skipLinks = useMemo(() => [
+        {
+            label: t('go_to_main_content'),
+            target: { ariaLabel: t('main_content'), selector: 'main' }
+        }
+    ], [t]);
     const openNav = useCallback((delay = 0) => {
         if (closeNavTimeoutId.current)
             clearTimeout(closeNavTimeoutId.current);
@@ -302,30 +198,12 @@ const AppShell = forwardRef((props, ref) => {
         }, delay);
     }, []);
     const onFocus = useCallback(() => {
-        if (!focusedImperatively.current && isSmallOrAbove)
-            openNav();
         focusedImperatively.current = false;
     }, [openNav, isSmallOrAbove]);
     const onKeydown = useCallback(({ key }) => {
         if (key === 'Escape')
             setMobileNavOpen(false);
     }, []);
-    useFocusWithin([navRef], useCallback((isFocused, navElement) => {
-        if (!isFocused && !navElement?.matches(':hover'))
-            closeNav();
-    }, [closeNav]));
-    useLayoutEffect(() => {
-        if (isXlOrAbove) {
-            openNav();
-        }
-        else {
-            closeNav();
-        }
-    }, [isXlOrAbove]);
-    useEffect(() => {
-        if (navState === 'closed' || navState === 'closing')
-            setDrawerOpen(false);
-    }, [navState]);
     useEffect(() => {
         if (mobileNavOpen) {
             document.addEventListener('keydown', onKeydown);
@@ -343,26 +221,37 @@ const AppShell = forwardRef((props, ref) => {
     const appShellJSX = (_jsxs(Flex, { ...restProps, container: {
             direction: 'column',
             justify: 'between'
-        }, ref: navRef, as: StyledAppNav, appHeader: showAppHeader, navOpen: mobileNavOpen, showEnv: !!envName, onFocus: onFocus, onMouseEnter: isSmallOrAbove && !isXlOrAbove ? () => openNav(200) : undefined, onMouseLeave: isSmallOrAbove && !isXlOrAbove ? () => closeNav(200) : undefined, children: [envName && (_jsx(StyledAppEnvironment, { item: { shrink: 0 }, color: envColor ?? theme.base.colors.red['extra-light'], children: envName }, void 0)), !showAppHeader && (_jsxs(StyledAppInfo, { as: Grid, forwardedAs: appInfoAs, variant: 'link', href: appInfoHref, onClick: appInfoOnClick, "aria-label": `${appName}${portalName ? ` - ${portalName}` : ''}`, ...appInfoRestProps, container: {
-                    alignItems: 'center',
-                    areas: portalName ? '"logo app" "logo portal"' : '"logo app"'
-                }, children: [_jsx(Grid, { item: { area: 'logo' }, as: Image, src: logoSrc, alt: appName }, void 0), _jsx(Grid, { item: { area: 'app' }, as: 'span', children: appName }, void 0), portalName && (_jsx(Grid, { item: { area: 'portal' }, as: 'span', children: portalName }, void 0))] }, void 0)), searchInput && !showAppHeader && (_jsx(StyledSearchForm, { role: 'search', "aria-label": searchLabel, onSubmit: e => e.preventDefault(), children: _jsx(SearchInput, { ...searchInput }, void 0) }, void 0)), _jsxs(StyledScrollWrap, { children: [caseTypes && _jsx(CaseTypes, { caseTypes: caseTypes }, void 0), links && _jsx(Links, { links: links }, void 0), cases && _jsx(Cases, { cases: cases }, void 0)] }, void 0), _jsx(Utils, { appHeader: showAppHeader, operator: operator, items: utils }, void 0)] }, void 0));
+        }, ref: isSmallOrAbove ? navRef : undefined, as: StyledAppNav, appHeader: showAppHeader, navOpen: mobileNavOpen, showEnv: !!envName, onFocus: onFocus, children: [envName && (_jsx(StyledAppEnvironment, { item: { shrink: 0 }, color: envColor ?? theme.base.colors.red['extra-light'], children: envName })), !showAppHeader && (_jsxs(_Fragment, { children: [_jsxs(StyledAppInfo, { as: Grid, forwardedAs: appInfoAs, variant: 'link', href: appInfoHref, onClick: appInfoOnClick, "aria-label": `${appName}${portalName ? ` - ${portalName}` : ''}`, ...appInfoRestProps, container: {
+                            alignItems: 'center',
+                            areas: portalName ? '"logo app" "logo portal"' : '"logo app"'
+                        }, ref: setAppInfoEl, children: [_jsx(Grid, { item: { area: 'logo' }, as: Image, src: logoSrc, alt: appName }), _jsx(Grid, { item: { area: 'app' }, as: 'span', children: appName }), portalName && (_jsx(Grid, { item: { area: 'portal' }, as: 'span', children: portalName }))] }), navState === 'closed' && (_jsx(Tooltip, { target: appInfoEl, placement: 'right', as: StyledAppShellTooltip, showDelay: 'none', hideDelay: 'none', children: appName }))] })), searchInput && !showAppHeader && (_jsx(AppShellSearch, { searchLabel: searchLabel, collapsed: !mobileNavOpen && ['closed', 'closing'].includes(navState), searchInput: searchInput })), _jsxs(StyledScrollWrap, { onClick: isSmallOrAbove
+                    ? () => {
+                        if (['closing', 'closed'].includes(navState)) {
+                            openNav(0);
+                        }
+                        else {
+                            closeNav(0);
+                        }
+                    }
+                    : undefined, children: [caseTypes && caseTypes.length > 0 && _jsx(CaseTypes, { caseTypes: caseTypes }), links && _jsx(Links, { links: links }), cases && _jsx(Cases, { cases: cases })] }), _jsx(Utils, { appHeader: showAppHeader, operator: operator, items: utils }), !mobileNavOpen && (_jsxs(Flex, { container: { justify: 'center' }, children: [_jsx(StyledAppShellToggleButton, { icon: true, ref: setExpandCollapseEl, compact: true, variant: 'simple', onClick: () => {
+                            setNavState(navState === 'closed' ? 'open' : 'closed');
+                        }, open: ['open', 'opening'].includes(navState), "aria-label": navState === 'closed' ? t('expand') : t('collapse'), children: ['closed', 'closing'].includes(navState) ? (_jsx(Icon, { name: `arrow-micro-${end}` })) : (_jsx(Icon, { name: `arrow-micro-${start}` })) }), ['open', 'closed'].includes(navState) && (_jsx(Tooltip, { target: expandCollapseEl, placement: 'right', as: StyledAppShellTooltip, showDelay: 'none', hideDelay: 'none', children: navState === 'closed' ? t('expand') : t('collapse') }))] }))] }));
     return (_jsxs(AppShellContext.Provider, { value: useMemo(() => ({
             navOpen: mobileNavOpen || navState === 'open' || navState === 'opening',
+            collapsedHoverMenus,
             navState,
-            drawerOpen,
-            setDrawerOpen,
-            refocusEl,
-            setRefocusEl,
             focusedImperatively,
             headerEl: headerEl || mobileHeaderEl,
-            previewTriggerRef
-        }), [navState, mobileNavOpen, drawerOpen, refocusEl, headerEl, mobileHeaderEl]), children: [_jsx(SkipNavigation, {}, void 0), showAppHeader && (_jsx(AppHeader, { ...appInfo, searchInput: searchInput, searchLabel: searchLabel, operator: operator, ref: setHeaderEl }, void 0)), isSmallOrAbove ? (appShellJSX) : (_jsxs(_Fragment, { children: [_jsx(Flex, { as: StyledMobileNav, container: { alignItems: 'center' }, ref: setMobileHeaderEl, children: _jsx(Button, { variant: 'simple', onClick: () => setMobileNavBackdrop(true), "aria-label": t('app_shell_open_nav'), icon: true, children: _jsx(Icon, { name: 'bars' }, void 0) }, void 0) }, void 0), _jsx(Backdrop, { open: mobileNavBackdrop, transitionSpeed: 'none', onAfterTransitionIn: () => setMobileNavOpen(true), onBeforeTransitionOut: () => setMobileNavOpen(false), onClick: e => {
+            previewTriggerRef,
+            searchContainerEl,
+            setSearchContainerEl,
+            mobileNavOpen
+        }), [navState, mobileNavOpen, headerEl, mobileHeaderEl, searchContainerEl]), children: [_jsx(SkipLinks, { items: skipLinks }), showAppHeader && (_jsx(AppHeader, { ...appInfo, searchInput: searchInput, searchLabel: searchLabel, operator: operator, searchPage: searchPage, ref: setHeaderEl })), isSmallOrAbove ? (appShellJSX) : (_jsxs(_Fragment, { children: [_jsx(Flex, { as: StyledMobileNav, container: { alignItems: 'center' }, ref: setMobileHeaderEl, children: _jsx(Button, { variant: 'simple', onClick: () => setMobileNavBackdrop(true), "aria-label": t('app_shell_open_nav'), icon: true, children: _jsx(Icon, { name: 'bars' }) }) }), _jsx(Backdrop, { open: mobileNavBackdrop, transitionSpeed: 'none', onAfterTransitionIn: () => setMobileNavOpen(true), onBeforeTransitionOut: () => setMobileNavOpen(false), onClick: e => {
                             if (e.currentTarget === e.target)
                                 setMobileNavOpen(false);
                         }, children: _jsx(Drawer, { open: mobileNavOpen, onAfterClose: () => {
                                 setMobileNavBackdrop(false);
-                            }, position: 'fixed', placement: start, size: 'min(18.75rem, calc(100vw - 3.5rem))', nullWhenClosed: true, children: appShellJSX }, void 0) }, void 0)] }, void 0)), showMainContent && (_jsxs(StyledAppMain, { appHeader: showAppHeader, mobileNav: !isSmallOrAbove, headerOffset: isSmallOrAbove ? headerEl?.offsetHeight : mobileHeaderEl?.offsetHeight, children: [banners && _jsx(StyledBannerRegion, { children: banners }, void 0), main] }, void 0))] }, void 0));
+                            }, position: 'fixed', placement: start, size: 'min(18.75rem, calc(100vw - 3.5rem))', nullWhenClosed: true, children: appShellJSX }) })] })), showMainContent && (_jsxs(StyledAppMain, { appHeader: showAppHeader, mobileNav: !isSmallOrAbove, headerOffset: isSmallOrAbove ? headerEl?.offsetHeight : mobileHeaderEl?.offsetHeight, navOpen: ['open', 'opening'].includes(navState), children: [banners && _jsx(StyledBannerRegion, { children: banners }), main] }))] }));
 });
 export default AppShell;
 //# sourceMappingURL=AppShell.js.map

package/lib/components/AppShell/AppShell.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useState,\n  useCallback,\n  useEffect,\n  useMemo,\n  ElementType,\n  useContext,\n  useRef,\n  FC,\n  MouseEventHandler,\n  MutableRefObject,\n  useLayoutEffect\n} from 'react';\n\nimport Flex from '../Flex';\nimport Link from '../Link';\nimport Count from '../Badges/Count';\nimport BareButton from '../Button/BareButton';\nimport SearchInput from '../SearchInput';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as caseSolidIcon from '../Icon/icons/case-solid.icon';\nimport * as barsIcon from '../Icon/icons/bars.icon';\nimport * as caretLeftIcon from '../Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport Text from '../Text';\nimport Image from '../Image';\nimport ExpandCollapse from '../ExpandCollapse';\nimport type { ForwardProps, OmitStrict } from '../../types';\nimport {\n  useFocusWithin,\n  useI18n,\n  useBreakpoint,\n  useConsolidatedRef,\n  useDirection,\n  useTheme,\n  useElement,\n  useTransitionState\n} from '../../hooks';\nimport { openCloseStates } from '../../hooks/useTransitionState';\nimport Grid from '../Grid';\nimport Button from '../Button';\nimport Drawer from '../Drawer';\nimport type { PopoverProps } from '../Popover';\nimport Backdrop from '../Backdrop';\nimport { documentIsAvailable } from '../../utils';\n\nimport AppShellContext from './AppShellContext';\nimport AppShellDrawer from './Drawer';\nimport AppShellOperator from './Operator';\nimport AppHeader from './AppHeader';\nimport SkipNavigation from './SkipNavigation';\nimport {\n  StyledAppNav,\n  StyledAppInfo,\n  StyledSearchForm,\n  StyledCaseTypes,\n  StyledScrollWrap,\n  StyledUtils,\n  StyledNavList,\n  StyledNestedNavList,\n  StyledNavListItem,\n  StyledNavListMenuButton,\n  StyledAppMain,\n  StyledCaseClose,\n  StyledAppShellNavIcon,\n  StyledNavCasesList,\n  StyledAppEnvironment,\n  StyledBannerRegion,\n  StyledCountIcon,\n  StyledUtilIconCount,\n  StyledMobileNav\n} from './AppShell.styles';\nimport {\n  AppShellProps,\n  CaseProps,\n  CaseTypeProps,\n  LinkProps,\n  NavListItemProps,\n  NavListProps,\n  UtilItemProps,\n  UtilsProps\n} from './AppShell.types';\n\nregisterIcon(timesIcon, plusIcon, caseSolidIcon, barsIcon, caretRightIcon, caretLeftIcon);\n\nconst NavComponents: {\n  List: FunctionComponent<NavListProps>;\n  ListItem: FunctionComponent<NavListItemProps>;\n} = {\n  List(props: NavListProps) {\n    const { items = [], nestedList, collapsed } = props;\n    let Component: ElementType = StyledNavList;\n    let fwdProps: {\n      as?: ElementType;\n      forwardedAs?: ElementType;\n      nullWhenCollapsed?: boolean;\n      transitionSpeed?: string;\n      collapsed: boolean;\n    } = {\n      collapsed: !!collapsed\n    };\n\n    const {\n      base: { animation }\n    } = useTheme();\n\n    if (nestedList) {\n      fwdProps = {\n        as: ExpandCollapse,\n        forwardedAs: 'ul',\n        nullWhenCollapsed: true,\n        transitionSpeed: items.length >= 10 ? `calc(2 * ${animation.speed})` : animation.speed,\n        ...fwdProps\n      };\n\n      Component = StyledNestedNavList;\n    }\n\n    return (\n      <Component {...fwdProps}>\n        {items?.map(item => (\n          <NavComponents.ListItem {...item} key={item.id || item.primary} />\n        ))}\n      </Component>\n    );\n  },\n  ListItem(props: NavListItemProps) {\n    const { navOpen } = useContext(AppShellContext);\n    const {\n      visual,\n      primary,\n      secondary,\n      href,\n      onClick,\n      items,\n      collapseItems = false,\n      dismissible = false,\n      onDismiss,\n      active,\n      actions,\n      forwardedRef,\n      ...restProps\n    } = props;\n\n    const t = useI18n();\n\n    const hasItems = Array.isArray(items) && items.length > 0;\n    const compProps: {\n      href?: string;\n      variant?: string;\n      onClick?: MouseEventHandler<HTMLAnchorElement | HTMLButtonElement | HTMLDivElement>;\n      actions?: NavListItemProps['actions'];\n      as?: ElementType<any>;\n      popover?: OmitStrict<PopoverProps, 'show' | 'target' | 'children'>;\n    } = {\n      onClick,\n      href\n    };\n\n    let Component: ElementType;\n\n    if (actions) {\n      Component = AppShellOperator;\n      compProps.actions = actions;\n      compProps.as = StyledNavListMenuButton;\n      compProps.popover = {\n        placement: 'right-end',\n        modifiers: [\n          {\n            name: 'offset',\n            options: { offset: [-12, -16] }\n          },\n          {\n            name: 'flip',\n            options: {\n              boundary: documentIsAvailable ? document.body : undefined,\n              fallbackPlacements: ['top-end']\n            }\n          }\n        ]\n      };\n    } else if (href) {\n      Component = Link;\n    } else if (onClick) {\n      Component = BareButton;\n    } else {\n      Component = 'div';\n    }\n\n    useEffect(() => {\n      if (!navOpen && actions) {\n        const node = document.getElementsByTagName('body')[0];\n        const clickEvent = document.createEvent('MouseEvent');\n        clickEvent.initEvent('mousedown', true, true);\n        node.dispatchEvent(clickEvent);\n      }\n    }, [navOpen]);\n\n    const { end } = useDirection();\n\n    return (\n      <StyledNavListItem\n        {...restProps}\n        key={primary}\n        nestedListCollapsed={hasItems ? collapseItems : true}\n      >\n        {/* forwardedRef typed as 'any' due to ambiguity of Component element type */}\n        <Component {...compProps} ref={forwardedRef as any}>\n          {visual}\n          {secondary ? (\n            <Flex container={{ direction: 'column', alignItems: 'start' }}>\n              <span>{primary}</span>\n              <Text variant='secondary'>{secondary}</Text>\n            </Flex>\n          ) : (\n            <span>{primary}</span>\n          )}\n          {(hasItems || actions) && <Icon name={`caret-${end}`} as={StyledAppShellNavIcon} />}\n        </Component>\n        {dismissible && (\n          <Button\n            icon\n            variant='simple'\n            as={StyledCaseClose}\n            onClick={onDismiss}\n            aria-label={t('dismiss_case')}\n          >\n            <Icon name='times' />\n          </Button>\n        )}\n        {hasItems && (\n          <NavComponents.List nestedList items={items} collapsed={!navOpen || collapseItems} />\n        )}\n      </StyledNavListItem>\n    );\n  }\n};\n\nconst CaseTypes: FunctionComponent<{ caseTypes: CaseTypeProps[] }> = ({\n  caseTypes\n}: {\n  caseTypes: CaseTypeProps[];\n}) => {\n  const { navOpen } = useContext(AppShellContext);\n  const [expanded, setExpanded] = useState(false);\n  const t = useI18n();\n\n  const toggleExpanded = useCallback(() => {\n    setExpanded(state => !state);\n  }, []);\n\n  useEffect(() => {\n    if (!navOpen) setExpanded(false);\n  }, [navOpen]);\n  const transformedCaseTypes = caseTypes.map(caseType => {\n    return {\n      ...caseType,\n      primary: caseType.name\n    };\n  });\n  return useMemo(\n    () => (\n      <StyledCaseTypes expanded={expanded && navOpen}>\n        <NavComponents.List\n          items={[\n            {\n              primary: t('app_shell_create'),\n              visual: <Icon name='plus' as={StyledAppShellNavIcon} />,\n              onClick: toggleExpanded,\n              items: transformedCaseTypes,\n              collapseItems: !expanded || !navOpen\n            }\n          ]}\n        />\n      </StyledCaseTypes>\n    ),\n    [expanded, navOpen, toggleExpanded, caseTypes]\n  );\n};\n\nconst Links: FunctionComponent<{ links: LinkProps[] }> = (props: { links: LinkProps[] }) => {\n  const { links } = props;\n  const navLinksRef = useRef<NavListItemProps[]>([]);\n  const [transformedLinks, setTransformedLinks] = useState<NavListItemProps[]>([]);\n\n  const toggleExpanded = (id: string) => {\n    const updatedLinks = navLinksRef.current.map(link => {\n      if (link.id === id) return { ...link, collapseItems: !link.collapseItems };\n      return { ...link };\n    });\n    setTransformedLinks(updatedLinks);\n  };\n\n  // TODO: Can this be a memo instead of a state and an effect?\n  const mergedNavLinks = (items: LinkProps[]): NavListItemProps[] => {\n    return items.map((link: LinkProps) => {\n      return {\n        ...link,\n        primary: link.name,\n        'aria-current': link.active ? 'page' : null,\n        visual: link.icon ? <Icon name={link.icon} as={StyledAppShellNavIcon} /> : null,\n        onClick: link.links ? () => toggleExpanded(link.id) : link.onClick,\n        items: link.links ? mergedNavLinks(link.links) : undefined,\n        collapseItems: true\n      };\n    });\n  };\n\n  useEffect(() => {\n    setTransformedLinks(mergedNavLinks(links));\n  }, [links]);\n\n  useEffect(() => {\n    navLinksRef.current = transformedLinks;\n  }, [transformedLinks]);\n\n  return (\n    <div>\n      <NavComponents.List items={transformedLinks} />\n    </div>\n  );\n};\n\nconst Cases: FunctionComponent<{ cases: CaseProps[] }> = (props: { cases: CaseProps[] }) => {\n  const { cases } = props;\n\n  const setupCases = (items: CaseProps[]): NavListItemProps[] => {\n    return items.map((item: CaseProps) => {\n      const {\n        id,\n        primary,\n        secondary,\n        visual = <Icon name='case-solid' as={StyledAppShellNavIcon} />,\n        active,\n        onClick,\n        onDismiss\n      } = item;\n      return {\n        id,\n        'aria-current': active ? 'page' : undefined,\n        primary,\n        secondary,\n        active: !!active,\n        dismissible: true,\n        onClick,\n        onDismiss,\n        visual\n      };\n    });\n  };\n\n  return (\n    <StyledNavCasesList>\n      <NavComponents.List items={setupCases(cases)} />\n    </StyledNavCasesList>\n  );\n};\n\n// TODO: Need to add back re-focus support to drawer.\nexport const Utils: FC<UtilsProps> = ({ operator, items, appHeader }) => {\n  const { drawerOpen, setDrawerOpen, focusedImperatively } = useContext(AppShellContext);\n  const [transformedLinks, setTransformedLinks] = useState<NavListItemProps[]>([]);\n  const [item, setItem] = useState<UtilItemProps>();\n  const [activeUtilItem, setActiveUtilItem] = useState('');\n  const returnFocusRef: MutableRefObject<\n    HTMLAnchorElement | HTMLDivElement | HTMLButtonElement | null\n  > = useRef(null);\n\n  const operatorInfo: NavListItemProps[] = useMemo(\n    () =>\n      appHeader\n        ? []\n        : [\n            {\n              primary: operator.name,\n              visual: operator.avatar,\n              actions: operator.actions\n            }\n          ],\n    [appHeader, operator.name, operator.avatar, operator.actions]\n  );\n\n  // TODO: Can this be a memo instead of a state and an effect?\n  const mergedUtilItems = (drawerItems: UtilItemProps[]): NavListItemProps[] => {\n    return drawerItems?.map((drawerItem: UtilItemProps) => {\n      return {\n        onClick: e => {\n          returnFocusRef.current = e.currentTarget;\n          if (drawerItem.drawerView) {\n            setItem(drawerItem);\n            setActiveUtilItem(drawerItem.name);\n          }\n        },\n        ...drawerItem,\n        primary: drawerItem.name,\n        visual: drawerItem.count ? (\n          <StyledUtilIconCount>\n            {drawerItem.visual}\n            <Count as={StyledCountIcon} variant='urgent'>\n              {drawerItem.count}\n            </Count>\n          </StyledUtilIconCount>\n        ) : (\n          drawerItem.visual\n        )\n      };\n    });\n  };\n\n  useEffect(() => {\n    if (items) {\n      setTransformedLinks([...mergedUtilItems(items)!, ...operatorInfo]);\n    } else {\n      setTransformedLinks(operatorInfo);\n    }\n  }, [items, operatorInfo]);\n\n  useEffect(() => {\n    items?.forEach(uItem => {\n      if (uItem.name === activeUtilItem) {\n        setItem(uItem);\n      }\n    });\n  }, [items]);\n\n  useEffect(() => {\n    if (item) setDrawerOpen(true);\n  }, [item]);\n\n  useEffect(() => {\n    if (!drawerOpen) {\n      setActiveUtilItem('');\n      focusedImperatively.current = true;\n      returnFocusRef?.current?.focus();\n    }\n  }, [drawerOpen]);\n\n  return (\n    <>\n      <StyledUtils>\n        <NavComponents.List\n          // Pull onDrawerOpen and onDrawerClose off to avoid DOM passthrough warning.\n          items={transformedLinks.map(({ onDrawerOpen, onDrawerClose, ...util }) => util)}\n        />\n      </StyledUtils>\n      {item && (\n        <AppShellDrawer\n          content={item.drawerView}\n          header={item.drawerHeader || item.name}\n          onDrawerClose={() => {\n            setItem(undefined);\n            item.onDrawerClose?.();\n          }}\n          onDrawerOpen={item.onDrawerOpen}\n        />\n      )}\n    </>\n  );\n};\n\nconst AppShell: FunctionComponent<AppShellProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<AppShellProps>, ref: Ref<HTMLDivElement>) => {\n    const {\n      appInfo,\n      searchInput,\n      appHeader,\n      searchLabel = 'Sitewide', // FIXME: TR\n      caseTypes,\n      links,\n      banners,\n      environment: { name: envName, color: envColor } = {},\n      main,\n      operator,\n      utils,\n      cases,\n      ...restProps\n    } = props;\n    const {\n      appName,\n      portalName,\n      href: appInfoHref,\n      onClick: appInfoOnClick,\n      imageSrc: logoSrc,\n      ...appInfoRestProps\n    } = appInfo;\n\n    let appInfoAs: ElementType = 'div';\n    if (appInfoHref) appInfoAs = Link;\n    else if (appInfoOnClick) appInfoAs = Button;\n\n    const t = useI18n();\n    const { start } = useDirection();\n    const theme = useTheme();\n    const navRef = useConsolidatedRef(ref);\n\n    const [drawerOpen, setDrawerOpen] = useState(false);\n    const [mobileNavOpen, setMobileNavOpen] = useState(false);\n    const [mobileNavBackdrop, setMobileNavBackdrop] = useState(false);\n    const [refocusEl, setRefocusEl] = useState<HTMLButtonElement | null>(null);\n\n    const focusedImperatively = useRef(false);\n    const [headerEl, setHeaderEl] = useElement<HTMLDivElement>();\n    const [mobileHeaderEl, setMobileHeaderEl] = useElement<HTMLDivElement>();\n\n    const isXlOrAbove = useBreakpoint('xl');\n    const isSmallOrAbove = useBreakpoint('sm');\n\n    const showAppHeader = !!appHeader && isSmallOrAbove;\n    const showMainContent = showAppHeader ? headerEl || mobileHeaderEl : true;\n\n    const openNavTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n    const closeNavTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n    const previewTriggerRef = useRef<HTMLElement>(null);\n\n    const { state: navState, set: setNavState } = useTransitionState({\n      ref: navRef,\n      property: 'width',\n      states: openCloseStates,\n      defaultState: isXlOrAbove ? 'open' : 'closed'\n    });\n\n    const openNav = useCallback((delay: number = 0) => {\n      if (closeNavTimeoutId.current) clearTimeout(closeNavTimeoutId.current);\n      openNavTimeoutId.current = setTimeout(() => {\n        setNavState('open');\n      }, delay);\n    }, []);\n\n    const closeNav = useCallback((delay: number = 0) => {\n      if (openNavTimeoutId.current) clearTimeout(openNavTimeoutId.current);\n      closeNavTimeoutId.current = setTimeout(() => {\n        setNavState('closed');\n      }, delay);\n    }, []);\n\n    const onFocus = useCallback(() => {\n      if (!focusedImperatively.current && isSmallOrAbove) openNav();\n      focusedImperatively.current = false;\n    }, [openNav, isSmallOrAbove]);\n\n    const onKeydown = useCallback(({ key }: KeyboardEvent) => {\n      if (key === 'Escape') setMobileNavOpen(false);\n    }, []);\n\n    useFocusWithin<HTMLElement>(\n      [navRef],\n      useCallback(\n        (isFocused: boolean, navElement: Element | null) => {\n          if (!isFocused && !navElement?.matches(':hover')) closeNav();\n        },\n        [closeNav]\n      )\n    );\n\n    useLayoutEffect(() => {\n      if (isXlOrAbove) {\n        openNav();\n      } else {\n        closeNav();\n      }\n    }, [isXlOrAbove]);\n\n    useEffect(() => {\n      if (navState === 'closed' || navState === 'closing') setDrawerOpen(false);\n    }, [navState]);\n\n    useEffect(() => {\n      if (mobileNavOpen) {\n        document.addEventListener('keydown', onKeydown);\n        return () => {\n          document.removeEventListener('keydown', onKeydown);\n        };\n      }\n    }, [mobileNavOpen]);\n\n    useEffect(() => {\n      if (isSmallOrAbove && mobileNavOpen) {\n        setMobileNavBackdrop(false);\n        setMobileNavOpen(false);\n      }\n    }, [isSmallOrAbove, mobileNavOpen]);\n\n    const appShellJSX = (\n      <Flex\n        {...restProps}\n        container={{\n          direction: 'column',\n          justify: 'between'\n        }}\n        ref={navRef}\n        as={StyledAppNav}\n        appHeader={showAppHeader}\n        navOpen={mobileNavOpen}\n        showEnv={!!envName}\n        onFocus={onFocus}\n        onMouseEnter={isSmallOrAbove && !isXlOrAbove ? () => openNav(200) : undefined}\n        onMouseLeave={isSmallOrAbove && !isXlOrAbove ? () => closeNav(200) : undefined}\n      >\n        {envName && (\n          <StyledAppEnvironment\n            item={{ shrink: 0 }}\n            color={envColor ?? theme.base.colors.red['extra-light']}\n          >\n            {envName}\n          </StyledAppEnvironment>\n        )}\n        {!showAppHeader && (\n          <StyledAppInfo\n            as={Grid}\n            forwardedAs={appInfoAs}\n            variant='link'\n            href={appInfoHref}\n            onClick={appInfoOnClick}\n            aria-label={`${appName}${portalName ? ` - ${portalName}` : ''}`}\n            {...appInfoRestProps}\n            container={{\n              alignItems: 'center',\n              areas: portalName ? '\"logo app\" \"logo portal\"' : '\"logo app\"'\n            }}\n          >\n            <Grid item={{ area: 'logo' }} as={Image} src={logoSrc} alt={appName} />\n            <Grid item={{ area: 'app' }} as='span'>\n              {appName}\n            </Grid>\n            {portalName && (\n              <Grid item={{ area: 'portal' }} as='span'>\n                {portalName}\n              </Grid>\n            )}\n          </StyledAppInfo>\n        )}\n\n        {searchInput && !showAppHeader && (\n          <StyledSearchForm\n            role='search'\n            aria-label={searchLabel}\n            onSubmit={e => e.preventDefault()}\n          >\n            <SearchInput {...searchInput} />\n          </StyledSearchForm>\n        )}\n\n        <StyledScrollWrap>\n          {caseTypes && <CaseTypes caseTypes={caseTypes} />}\n          {links && <Links links={links} />}\n          {cases && <Cases cases={cases} />}\n        </StyledScrollWrap>\n\n        <Utils appHeader={showAppHeader} operator={operator} items={utils} />\n      </Flex>\n    );\n\n    return (\n      <AppShellContext.Provider\n        value={useMemo(\n          () => ({\n            navOpen: mobileNavOpen || navState === 'open' || navState === 'opening',\n            navState,\n            drawerOpen,\n            setDrawerOpen,\n            refocusEl,\n            setRefocusEl,\n            focusedImperatively,\n            headerEl: headerEl || mobileHeaderEl,\n            previewTriggerRef\n          }),\n          [navState, mobileNavOpen, drawerOpen, refocusEl, headerEl, mobileHeaderEl]\n        )}\n      >\n        <SkipNavigation />\n        {showAppHeader && (\n          <AppHeader\n            {...appInfo}\n            searchInput={searchInput}\n            searchLabel={searchLabel}\n            operator={operator}\n            ref={setHeaderEl}\n          />\n        )}\n\n        {isSmallOrAbove ? (\n          appShellJSX\n        ) : (\n          <>\n            <Flex as={StyledMobileNav} container={{ alignItems: 'center' }} ref={setMobileHeaderEl}>\n              <Button\n                variant='simple'\n                onClick={() => setMobileNavBackdrop(true)}\n                aria-label={t('app_shell_open_nav')}\n                icon\n              >\n                <Icon name='bars' />\n              </Button>\n            </Flex>\n\n            <Backdrop\n              open={mobileNavBackdrop}\n              transitionSpeed='none'\n              onAfterTransitionIn={() => setMobileNavOpen(true)}\n              onBeforeTransitionOut={() => setMobileNavOpen(false)}\n              onClick={e => {\n                if (e.currentTarget === e.target) setMobileNavOpen(false);\n              }}\n            >\n              <Drawer\n                open={mobileNavOpen}\n                onAfterClose={() => {\n                  setMobileNavBackdrop(false);\n                }}\n                position='fixed'\n                placement={start}\n                size='min(18.75rem, calc(100vw - 3.5rem))'\n                nullWhenClosed\n              >\n                {appShellJSX}\n              </Drawer>\n            </Backdrop>\n          </>\n        )}\n        {showMainContent && (\n          <StyledAppMain\n            appHeader={showAppHeader}\n            mobileNav={!isSmallOrAbove}\n            headerOffset={isSmallOrAbove ? headerEl?.offsetHeight : mobileHeaderEl?.offsetHeight}\n          >\n            {banners && <StyledBannerRegion>{banners}</StyledBannerRegion>}\n            {main}\n          </StyledAppMain>\n        )}\n      </AppShellContext.Provider>\n    );\n  }\n);\n\nexport default AppShell;\n"]}
+{"version":3,"file":"AppShell.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useState,\n  useCallback,\n  useEffect,\n  useMemo,\n  ElementType,\n  useContext,\n  useRef,\n  FC,\n  isValidElement\n} from 'react';\n\nimport Flex from '../Flex';\nimport Link from '../Link';\nimport Count from '../Badges/Count';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as caseSolidIcon from '../Icon/icons/case-solid.icon';\nimport * as barsIcon from '../Icon/icons/bars.icon';\nimport * as caretLeftIcon from '../Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport Image from '../Image';\nimport type { ForwardProps } from '../../types';\nimport {\n  useI18n,\n  useBreakpoint,\n  useConsolidatedRef,\n  useDirection,\n  useTheme,\n  useElement,\n  useTransitionState\n} from '../../hooks';\nimport { openCloseStates } from '../../hooks/useTransitionState';\nimport Grid from '../Grid';\nimport Button from '../Button';\nimport Drawer from '../Drawer';\nimport Backdrop from '../Backdrop';\nimport Tooltip from '../Tooltip/Tooltip';\nimport SkipLinks, { SkipLinksProps } from '../SkipLinks';\n\nimport AppShellContext, { AppShellDrawerContext } from './AppShellContext';\nimport AppShellDrawer from './Drawer';\nimport AppHeader from './AppHeader';\nimport {\n  StyledAppNav,\n  StyledAppInfo,\n  StyledCaseTypes,\n  StyledScrollWrap,\n  StyledUtils,\n  StyledAppMain,\n  StyledAppShellNavIcon,\n  StyledNavCasesList,\n  StyledAppEnvironment,\n  StyledBannerRegion,\n  StyledCountIcon,\n  StyledUtilIconCount,\n  StyledMobileNav,\n  StyledAppShellTooltip,\n  StyledAppShellToggleButton\n} from './AppShell.styles';\nimport {\n  AppShellProps,\n  CaseProps,\n  CaseTypeProps,\n  LinkProps,\n  NavListItemProps,\n  UtilItemProps,\n  UtilsProps\n} from './AppShell.types';\nimport NavigationList from './NavigationList';\nimport { AppShellSearch } from './AppShellSearch';\n\nregisterIcon(timesIcon, plusIcon, caseSolidIcon, barsIcon, caretRightIcon, caretLeftIcon);\n\nconst CaseTypes: FunctionComponent<{ caseTypes: CaseTypeProps[] }> = ({\n  caseTypes\n}: {\n  caseTypes: CaseTypeProps[];\n}) => {\n  const t = useI18n();\n\n  const transformedCaseTypes = caseTypes.map(caseType => {\n    return {\n      ...caseType,\n      primary: caseType.name\n    };\n  });\n\n  return useMemo(\n    () => (\n      <StyledCaseTypes>\n        <NavigationList\n          items={[\n            {\n              primary: t('app_shell_create'),\n              visual: <Icon name='plus' as={StyledAppShellNavIcon} />,\n              items: transformedCaseTypes\n            }\n          ]}\n        />\n      </StyledCaseTypes>\n    ),\n    [caseTypes]\n  );\n};\n\nconst Links: FunctionComponent<{ links: LinkProps[] }> = (props: { links: LinkProps[] }) => {\n  const { links } = props;\n  const [transformedLinks, setTransformedLinks] = useState<NavListItemProps[]>([]);\n\n  // TODO: Can this be a memo instead of a state and an effect?\n  const mergedNavLinks = (items: LinkProps[]): NavListItemProps[] => {\n    return items.map((link: LinkProps) => {\n      return {\n        ...link,\n        primary: link.name,\n        'aria-current': link.active ? 'page' : null,\n        visual: link.icon ? <Icon name={link.icon} as={StyledAppShellNavIcon} /> : null,\n        onClick: link.links ? undefined : link.onClick,\n        items: link.links ? mergedNavLinks(link.links) : undefined\n      };\n    });\n  };\n\n  useEffect(() => {\n    setTransformedLinks(mergedNavLinks(links));\n  }, [links]);\n\n  return (\n    <div>\n      <NavigationList items={transformedLinks} />\n    </div>\n  );\n};\n\nconst Cases: FunctionComponent<{ cases: CaseProps[] }> = (props: { cases: CaseProps[] }) => {\n  const { cases } = props;\n\n  const setupCases = (items: CaseProps[]): NavListItemProps[] => {\n    return items.map((item: CaseProps) => {\n      const {\n        id,\n        primary,\n        secondary,\n        visual = <Icon name='case-solid' as={StyledAppShellNavIcon} />,\n        active,\n        onClick,\n        onDismiss\n      } = item;\n      return {\n        id,\n        'aria-current': active ? 'page' : undefined,\n        primary,\n        secondary,\n        active: !!active,\n        dismissible: true,\n        onClick,\n        onDismiss,\n        visual\n      };\n    });\n  };\n\n  return (\n    <StyledNavCasesList>\n      <NavigationList items={setupCases(cases)} />\n    </StyledNavCasesList>\n  );\n};\n\nexport const Utils: FC<UtilsProps> = ({ operator, items, appHeader }) => {\n  const { navOpen, navState } = useContext(AppShellContext);\n  const [item, setItem] = useState<UtilItemProps>();\n  const [drawerOpen, setDrawerOpen] = useState(false);\n\n  useEffect(() => {\n    if (drawerOpen && item) {\n      setItem(\n        items?.find<UtilItemProps>(\n          (utilItem): utilItem is UtilItemProps =>\n            !isValidElement(utilItem) && utilItem.name === item.name\n        )\n      );\n    }\n  }, [items]);\n\n  const operatorInfo: NavListItemProps[] = useMemo(\n    () =>\n      appHeader\n        ? []\n        : [\n            {\n              primary: operator.name,\n              visual: operator.avatar,\n              items: operator.actions\n            }\n          ],\n    [appHeader, operator.name, operator.avatar, operator.actions]\n  );\n\n  const transform = useCallback(\n    (utilItem: UtilItemProps): NavListItemProps => {\n      const uItem = { ...utilItem };\n      delete uItem.onDrawerClose;\n      delete uItem.onDrawerOpen;\n      return {\n        onClick: () => {\n          if (utilItem.drawerView) {\n            setItem(utilItem);\n          }\n        },\n        ...uItem,\n        primary: utilItem.name,\n        visual: utilItem.count ? (\n          <StyledUtilIconCount>\n            {utilItem.visual}\n            <Count as={StyledCountIcon} variant='urgent'>\n              {utilItem.count}\n            </Count>\n          </StyledUtilIconCount>\n        ) : (\n          utilItem.visual\n        ),\n        collapseItems: !navOpen\n      };\n    },\n    [navOpen]\n  );\n\n  const utilItems = useMemo(() => {\n    return [\n      ...(items ?? []).map(uItem => {\n        return isValidElement(uItem) ? uItem : transform(uItem);\n      }),\n      ...operatorInfo\n    ];\n  }, [items, operatorInfo, transform]);\n\n  useEffect(() => {\n    if (item) setDrawerOpen(true);\n  }, [item]);\n\n  useEffect(() => {\n    if (navState === 'closed' || navState === 'closing') setDrawerOpen(false);\n  }, [navState]);\n\n  return (\n    <AppShellDrawerContext.Provider\n      value={useMemo(\n        () => ({\n          drawerOpen,\n          closeDrawer: () => {\n            setDrawerOpen(false);\n          },\n          openDrawer: setItem\n        }),\n        [drawerOpen]\n      )}\n    >\n      <StyledUtils>\n        <NavigationList items={utilItems} collapsed />\n      </StyledUtils>\n      {item && (\n        <AppShellDrawer\n          drawerOpen={drawerOpen}\n          setDrawerOpen={setDrawerOpen}\n          content={item.drawerView}\n          header={item.drawerHeader || item.name}\n          onDrawerClose={() => {\n            setItem(undefined);\n            item.onDrawerClose?.();\n          }}\n          onDrawerOpen={item.onDrawerOpen}\n        />\n      )}\n    </AppShellDrawerContext.Provider>\n  );\n};\n\nconst AppShell: FunctionComponent<AppShellProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<AppShellProps>, ref: Ref<HTMLDivElement>) => {\n    const {\n      appInfo,\n      searchInput,\n      appHeader,\n      searchPage,\n      searchLabel = 'Sitewide', // FIXME: TR\n      caseTypes,\n      links,\n      banners,\n      environment: { name: envName, color: envColor } = {},\n      main,\n      operator,\n      utils,\n      cases,\n      defaultExpanded = false,\n      collapsedHoverMenus = false,\n      ...restProps\n    } = props;\n    const {\n      appName,\n      portalName,\n      href: appInfoHref,\n      onClick: appInfoOnClick,\n      imageSrc: logoSrc,\n      ...appInfoRestProps\n    } = appInfo;\n\n    let appInfoAs: ElementType = 'div';\n    if (appInfoHref) appInfoAs = Link;\n    else if (appInfoOnClick) appInfoAs = Button;\n\n    const t = useI18n();\n    const { start, end } = useDirection();\n    const theme = useTheme();\n    const navRef = useConsolidatedRef(ref);\n\n    const [mobileNavOpen, setMobileNavOpen] = useState(false);\n    const [mobileNavBackdrop, setMobileNavBackdrop] = useState(false);\n\n    const focusedImperatively = useRef(false);\n    const [headerEl, setHeaderEl] = useElement<HTMLDivElement>();\n    const [mobileHeaderEl, setMobileHeaderEl] = useElement<HTMLDivElement>();\n    const [appInfoEl, setAppInfoEl] = useElement<HTMLAnchorElement>();\n    const [expandCollapseEl, setExpandCollapseEl] = useElement<HTMLButtonElement>();\n\n    const isSmallOrAbove = useBreakpoint('sm');\n\n    const showAppHeader = !!appHeader && isSmallOrAbove;\n    const showMainContent = showAppHeader ? headerEl || mobileHeaderEl : true;\n\n    const openNavTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n    const closeNavTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n    const previewTriggerRef = useRef<HTMLElement>(null);\n\n    const [searchContainerEl, setSearchContainerEl] = useState<HTMLElement | null>(null);\n\n    const { state: navState, set: setNavState } = useTransitionState({\n      ref: navRef,\n      property: 'width',\n      states: openCloseStates,\n      defaultState: defaultExpanded ? 'open' : 'closed'\n    });\n\n    const skipLinks: SkipLinksProps['items'] = useMemo(\n      () => [\n        {\n          label: t('go_to_main_content'),\n          target: { ariaLabel: t('main_content'), selector: 'main' }\n        }\n      ],\n      [t]\n    );\n\n    const openNav = useCallback((delay: number = 0) => {\n      if (closeNavTimeoutId.current) clearTimeout(closeNavTimeoutId.current);\n      openNavTimeoutId.current = setTimeout(() => {\n        setNavState('open');\n      }, delay);\n    }, []);\n\n    const closeNav = useCallback((delay: number = 0) => {\n      if (openNavTimeoutId.current) clearTimeout(openNavTimeoutId.current);\n      closeNavTimeoutId.current = setTimeout(() => {\n        setNavState('closed');\n      }, delay);\n    }, []);\n\n    const onFocus = useCallback(() => {\n      focusedImperatively.current = false;\n    }, [openNav, isSmallOrAbove]);\n\n    const onKeydown = useCallback(({ key }: KeyboardEvent) => {\n      if (key === 'Escape') setMobileNavOpen(false);\n    }, []);\n\n    useEffect(() => {\n      if (mobileNavOpen) {\n        document.addEventListener('keydown', onKeydown);\n        return () => {\n          document.removeEventListener('keydown', onKeydown);\n        };\n      }\n    }, [mobileNavOpen]);\n\n    useEffect(() => {\n      if (isSmallOrAbove && mobileNavOpen) {\n        setMobileNavBackdrop(false);\n        setMobileNavOpen(false);\n      }\n    }, [isSmallOrAbove, mobileNavOpen]);\n\n    const appShellJSX = (\n      <Flex\n        {...restProps}\n        container={{\n          direction: 'column',\n          justify: 'between'\n        }}\n        ref={isSmallOrAbove ? navRef : undefined}\n        as={StyledAppNav}\n        appHeader={showAppHeader}\n        navOpen={mobileNavOpen}\n        showEnv={!!envName}\n        onFocus={onFocus}\n      >\n        {envName && (\n          <StyledAppEnvironment\n            item={{ shrink: 0 }}\n            color={envColor ?? theme.base.colors.red['extra-light']}\n          >\n            {envName}\n          </StyledAppEnvironment>\n        )}\n\n        {!showAppHeader && (\n          <>\n            <StyledAppInfo\n              as={Grid}\n              forwardedAs={appInfoAs}\n              variant='link'\n              href={appInfoHref}\n              onClick={appInfoOnClick}\n              aria-label={`${appName}${portalName ? ` - ${portalName}` : ''}`}\n              {...appInfoRestProps}\n              container={{\n                alignItems: 'center',\n                areas: portalName ? '\"logo app\" \"logo portal\"' : '\"logo app\"'\n              }}\n              ref={setAppInfoEl}\n            >\n              <Grid item={{ area: 'logo' }} as={Image} src={logoSrc} alt={appName} />\n              <Grid item={{ area: 'app' }} as='span'>\n                {appName}\n              </Grid>\n              {portalName && (\n                <Grid item={{ area: 'portal' }} as='span'>\n                  {portalName}\n                </Grid>\n              )}\n            </StyledAppInfo>\n            {navState === 'closed' && (\n              <Tooltip\n                target={appInfoEl}\n                placement='right'\n                as={StyledAppShellTooltip}\n                showDelay='none'\n                hideDelay='none'\n              >\n                {appName}\n              </Tooltip>\n            )}\n          </>\n        )}\n\n        {searchInput && !showAppHeader && (\n          <AppShellSearch\n            searchLabel={searchLabel}\n            collapsed={!mobileNavOpen && ['closed', 'closing'].includes(navState)}\n            searchInput={searchInput}\n          />\n        )}\n\n        <StyledScrollWrap\n          onClick={\n            isSmallOrAbove\n              ? () => {\n                  if (['closing', 'closed'].includes(navState)) {\n                    openNav(0);\n                  } else {\n                    closeNav(0);\n                  }\n                }\n              : undefined\n          }\n        >\n          {caseTypes && caseTypes.length > 0 && <CaseTypes caseTypes={caseTypes} />}\n          {links && <Links links={links} />}\n          {cases && <Cases cases={cases} />}\n        </StyledScrollWrap>\n\n        <Utils appHeader={showAppHeader} operator={operator} items={utils} />\n        {!mobileNavOpen && (\n          <Flex container={{ justify: 'center' }}>\n            <StyledAppShellToggleButton\n              icon\n              ref={setExpandCollapseEl}\n              compact\n              variant='simple'\n              onClick={() => {\n                setNavState(navState === 'closed' ? 'open' : 'closed');\n              }}\n              open={['open', 'opening'].includes(navState)}\n              aria-label={navState === 'closed' ? t('expand') : t('collapse')}\n            >\n              {['closed', 'closing'].includes(navState) ? (\n                <Icon name={`arrow-micro-${end}`} />\n              ) : (\n                <Icon name={`arrow-micro-${start}`} />\n              )}\n            </StyledAppShellToggleButton>\n            {['open', 'closed'].includes(navState) && (\n              <Tooltip\n                target={expandCollapseEl}\n                placement='right'\n                as={StyledAppShellTooltip}\n                showDelay='none'\n                hideDelay='none'\n              >\n                {navState === 'closed' ? t('expand') : t('collapse')}\n              </Tooltip>\n            )}\n          </Flex>\n        )}\n      </Flex>\n    );\n\n    return (\n      <AppShellContext.Provider\n        value={useMemo(\n          () => ({\n            navOpen: mobileNavOpen || navState === 'open' || navState === 'opening',\n            collapsedHoverMenus,\n            navState,\n            focusedImperatively,\n            headerEl: headerEl || mobileHeaderEl,\n            previewTriggerRef,\n            searchContainerEl,\n            setSearchContainerEl,\n            mobileNavOpen\n          }),\n          [navState, mobileNavOpen, headerEl, mobileHeaderEl, searchContainerEl]\n        )}\n      >\n        <SkipLinks items={skipLinks} />\n        {showAppHeader && (\n          <AppHeader\n            {...appInfo}\n            searchInput={searchInput}\n            searchLabel={searchLabel}\n            operator={operator}\n            searchPage={searchPage}\n            ref={setHeaderEl}\n          />\n        )}\n\n        {isSmallOrAbove ? (\n          appShellJSX\n        ) : (\n          <>\n            <Flex as={StyledMobileNav} container={{ alignItems: 'center' }} ref={setMobileHeaderEl}>\n              <Button\n                variant='simple'\n                onClick={() => setMobileNavBackdrop(true)}\n                aria-label={t('app_shell_open_nav')}\n                icon\n              >\n                <Icon name='bars' />\n              </Button>\n            </Flex>\n\n            <Backdrop\n              open={mobileNavBackdrop}\n              transitionSpeed='none'\n              onAfterTransitionIn={() => setMobileNavOpen(true)}\n              onBeforeTransitionOut={() => setMobileNavOpen(false)}\n              onClick={e => {\n                if (e.currentTarget === e.target) setMobileNavOpen(false);\n              }}\n            >\n              <Drawer\n                open={mobileNavOpen}\n                onAfterClose={() => {\n                  setMobileNavBackdrop(false);\n                }}\n                position='fixed'\n                placement={start}\n                size='min(18.75rem, calc(100vw - 3.5rem))'\n                nullWhenClosed\n              >\n                {appShellJSX}\n              </Drawer>\n            </Backdrop>\n          </>\n        )}\n        {showMainContent && (\n          <StyledAppMain\n            appHeader={showAppHeader}\n            mobileNav={!isSmallOrAbove}\n            headerOffset={isSmallOrAbove ? headerEl?.offsetHeight : mobileHeaderEl?.offsetHeight}\n            navOpen={['open', 'opening'].includes(navState)}\n          >\n            {banners && <StyledBannerRegion>{banners}</StyledBannerRegion>}\n            {main}\n          </StyledAppMain>\n        )}\n      </AppShellContext.Provider>\n    );\n  }\n);\n\nexport default AppShell;\n"]}