@pega/cosmos-react-core 2.0.0-dev.18.0 → 2.0.0-dev.20.0

package/lib/components/Actions/Actions.js

@@ -15,7 +15,7 @@ const Actions = forwardRef(({ items, menuAt = 2, iconOnly = true }, ref) => {
                 ...restProps
             }))
         } }, void 0)) : (_jsx(_Fragment, { children: items.map(({ id, icon, text, onClick, ...restProps }) => {
-            return (_jsx(Button, Object.assign({ ref: ref, variant: icon && iconOnly ? 'simple' : undefined, onClick: (event) => onClick?.(id, event), label: icon ? text : undefined, icon: !!icon && iconOnly }, restProps, { children: icon && iconOnly ? _jsx(Icon, { name: icon }, void 0) : text }), id));
+            return (_jsx(Button, { ref: ref, variant: icon && iconOnly ? 'simple' : undefined, onClick: (event) => onClick?.(id, event), label: icon ? text : undefined, icon: !!icon && iconOnly, ...restProps, children: icon && iconOnly ? _jsx(Icon, { name: icon }, void 0) : text }, id));
         }) }, void 0));
 });
 export default Actions;

package/lib/components/Actions/Actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../src/components/Actions/Actions.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAuD,MAAM,OAAO,CAAC;AAExF,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,UAAU,MAAM,eAAe,CAAC;AAWvC,MAAM,OAAO,GAAmD,UAAU,CACxE,CACE,EAAE,KAAK,EAAE,MAAM,GAAG,CAAC,EAAE,QAAQ,GAAG,IAAI,EAAiC,EACrE,GAAwB,EACxB,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;QAChC,OAAO,IAAI,CAAC;KACb;IAED,OAAO,KAAK,CAAC,MAAM,IAAI,MAAM,CAAC,CAAC,CAAC,CAC9B,KAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,CAAC,CAAC,SAAS,CAAC,EAClB,QAAQ,QACR,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAE;YACJ,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE,CAAC,CAAC;gBAC5C,OAAO,EAAE,IAAI;gBACb,GAAG,SAAS;aACb,CAAC,CAAC;SACJ,WACD,CACH,CAAC,CAAC,CAAC,CACF,4BACG,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE;YACvD,OAAO,CACL,KAAC,MAAM,kBAEL,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAChD,OAAO,EAAE,CAAC,KAAoC,EAAE,EAAE,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE,KAAK,CAAC,EACvE,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC9B,IAAI,EAAE,CAAC,CAAC,IAAI,IAAI,QAAQ,IACpB,SAAS,cAEZ,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,WAAI,CAAC,CAAC,CAAC,IAAI,KAR1C,EAAE,CASA,CACV,CAAC;QACJ,CAAC,CAAC,WACD,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref, MouseEvent } from 'react';\n\nimport { useI18n } from '../../hooks';\nimport { Action, ForwardProps, NoChildrenProp } from '../../types';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport MenuButton from '../MenuButton';\n\nexport interface ActionsProps extends NoChildrenProp {\n  items: Action[];\n  /** @default 2 */\n  menuAt?: number;\n  /** @default true */\n  iconOnly?: boolean;\n  ref?: Ref<HTMLButtonElement>;\n}\n\nconst Actions: FunctionComponent<ActionsProps & ForwardProps> = forwardRef(\n  (\n    { items, menuAt = 2, iconOnly = true }: PropsWithoutRef<ActionsProps>,\n    ref: ActionsProps['ref']\n  ) => {\n    const t = useI18n();\n\n    if (!items || items.length === 0) {\n      return null;\n    }\n\n    return items.length >= menuAt ? (\n      <MenuButton\n        ref={ref}\n        text={t('actions')}\n        iconOnly\n        icon='more'\n        variant='simple'\n        menu={{\n          items: items.map(({ text, ...restProps }) => ({\n            primary: text,\n            ...restProps\n          }))\n        }}\n      />\n    ) : (\n      <>\n        {items.map(({ id, icon, text, onClick, ...restProps }) => {\n          return (\n            <Button\n              key={id}\n              ref={ref}\n              variant={icon && iconOnly ? 'simple' : undefined}\n              onClick={(event: MouseEvent<HTMLButtonElement>) => onClick?.(id, event)}\n              label={icon ? text : undefined}\n              icon={!!icon && iconOnly}\n              {...restProps}\n            >\n              {icon && iconOnly ? <Icon name={icon} /> : text}\n            </Button>\n          );\n        })}\n      </>\n    );\n  }\n);\n\nexport default Actions;\n"]}
+{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../src/components/Actions/Actions.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAuD,MAAM,OAAO,CAAC;AAExF,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,UAAU,MAAM,eAAe,CAAC;AAWvC,MAAM,OAAO,GAAmD,UAAU,CACxE,CACE,EAAE,KAAK,EAAE,MAAM,GAAG,CAAC,EAAE,QAAQ,GAAG,IAAI,EAAiC,EACrE,GAAwB,EACxB,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;QAChC,OAAO,IAAI,CAAC;KACb;IAED,OAAO,KAAK,CAAC,MAAM,IAAI,MAAM,CAAC,CAAC,CAAC,CAC9B,KAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,CAAC,CAAC,SAAS,CAAC,EAClB,QAAQ,QACR,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAE;YACJ,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE,CAAC,CAAC;gBAC5C,OAAO,EAAE,IAAI;gBACb,GAAG,SAAS;aACb,CAAC,CAAC;SACJ,WACD,CACH,CAAC,CAAC,CAAC,CACF,4BACG,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE;YACvD,OAAO,CACL,KAAC,MAAM,IAEL,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAChD,OAAO,EAAE,CAAC,KAAoC,EAAE,EAAE,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE,KAAK,CAAC,EACvE,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC9B,IAAI,EAAE,CAAC,CAAC,IAAI,IAAI,QAAQ,KACpB,SAAS,YAEZ,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,WAAI,CAAC,CAAC,CAAC,IAAI,IAR1C,EAAE,CASA,CACV,CAAC;QACJ,CAAC,CAAC,WACD,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref, MouseEvent } from 'react';\n\nimport { useI18n } from '../../hooks';\nimport { Action, ForwardProps, NoChildrenProp } from '../../types';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport MenuButton from '../MenuButton';\n\nexport interface ActionsProps extends NoChildrenProp {\n  items: Action[];\n  /** @default 2 */\n  menuAt?: number;\n  /** @default true */\n  iconOnly?: boolean;\n  ref?: Ref<HTMLButtonElement>;\n}\n\nconst Actions: FunctionComponent<ActionsProps & ForwardProps> = forwardRef(\n  (\n    { items, menuAt = 2, iconOnly = true }: PropsWithoutRef<ActionsProps>,\n    ref: ActionsProps['ref']\n  ) => {\n    const t = useI18n();\n\n    if (!items || items.length === 0) {\n      return null;\n    }\n\n    return items.length >= menuAt ? (\n      <MenuButton\n        ref={ref}\n        text={t('actions')}\n        iconOnly\n        icon='more'\n        variant='simple'\n        menu={{\n          items: items.map(({ text, ...restProps }) => ({\n            primary: text,\n            ...restProps\n          }))\n        }}\n      />\n    ) : (\n      <>\n        {items.map(({ id, icon, text, onClick, ...restProps }) => {\n          return (\n            <Button\n              key={id}\n              ref={ref}\n              variant={icon && iconOnly ? 'simple' : undefined}\n              onClick={(event: MouseEvent<HTMLButtonElement>) => onClick?.(id, event)}\n              label={icon ? text : undefined}\n              icon={!!icon && iconOnly}\n              {...restProps}\n            >\n              {icon && iconOnly ? <Icon name={icon} /> : text}\n            </Button>\n          );\n        })}\n      </>\n    );\n  }\n);\n\nexport default Actions;\n"]}

package/lib/components/AppShell/AppHeader.js

@@ -11,7 +11,7 @@ const AppHeader = forwardRef(({ appName, fullImageSrc, imageSrc, href, onClick,
     const searchRef = useRef(null);
     const [searchFocused, setSearchFocused] = useState(false);
     useFocusWithin([searchRef], setSearchFocused);
-    return (_jsxs(Flex, Object.assign({ as: StyledAppHeader, container: { alignItems: 'center', pad: 1 }, hideTitle: !isMediumOrAbove && searchFocused, ref: ref }, { children: [_jsx(StyledAppHeaderInfo, Object.assign({ centerLogo: !fullImageSrc }, { children: _jsxs(Flex, Object.assign({ container: { inline: true, alignItems: 'center', gap: 1 }, as: href ? 'a' : 'div', href: href, onClick: onClick, target: target }, { children: [_jsx(Image, { src: fullImageSrc || imageSrc, alt: '', "aria-hidden": 'true' }, void 0), (isMediumOrAbove || !searchFocused) && (_jsxs(_Fragment, { children: [_jsx(StyledAppHeaderText, { children: appName }, void 0), _jsx(StyledAppHeaderText, Object.assign({ variant: 'secondary' }, { children: portalName }), void 0)] }, void 0))] }), void 0) }), void 0), searchInput ? (_jsx(StyledAppHeaderSearchForm, Object.assign({ ref: searchRef, role: 'search', "aria-label": searchLabel, onSubmit: e => e.preventDefault(), isMediumOrAbove: isMediumOrAbove }, { children: _jsx(SearchInput, Object.assign({}, searchInput), void 0) }), void 0)) : (_jsx(StyledAppHeaderSpacer, {}, void 0)), _jsx(AppShellOperator, Object.assign({ as: StyledAppHeaderOperator, actions: operator.actions, popover: { placement: 'bottom-start' } }, { children: operator.avatar }), void 0)] }), void 0));
+    return (_jsxs(Flex, { as: StyledAppHeader, container: { alignItems: 'center', pad: 1 }, hideTitle: !isMediumOrAbove && searchFocused, ref: ref, children: [_jsx(StyledAppHeaderInfo, { centerLogo: !fullImageSrc, children: _jsxs(Flex, { container: { inline: true, alignItems: 'center', gap: 1 }, as: href ? 'a' : 'div', href: href, onClick: onClick, target: target, children: [_jsx(Image, { src: fullImageSrc || imageSrc, alt: '', "aria-hidden": 'true' }, void 0), (isMediumOrAbove || !searchFocused) && (_jsxs(_Fragment, { children: [_jsx(StyledAppHeaderText, { children: appName }, void 0), _jsx(StyledAppHeaderText, { variant: 'secondary', children: portalName }, void 0)] }, void 0))] }, void 0) }, void 0), searchInput ? (_jsx(StyledAppHeaderSearchForm, { ref: searchRef, role: 'search', "aria-label": searchLabel, onSubmit: e => e.preventDefault(), isMediumOrAbove: isMediumOrAbove, children: _jsx(SearchInput, { ...searchInput }, void 0) }, void 0)) : (_jsx(StyledAppHeaderSpacer, {}, void 0)), _jsx(AppShellOperator, { as: StyledAppHeaderOperator, actions: operator.actions, popover: { placement: 'bottom-start' }, children: operator.avatar }, void 0)] }, void 0));
 });
 export default AppHeader;
 //# sourceMappingURL=AppHeader.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"AppHeader.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA0B,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE7E,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,KAAK,MAAM,UAAU,CAAC;AAC7B,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAI5D,OAAO,gBAAgB,MAAM,YAAY,CAAC;AAC1C,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,yBAAyB,EACzB,qBAAqB,EACrB,mBAAmB,EACnB,uBAAuB,EACxB,MAAM,mBAAmB,CAAC;AAE3B,MAAM,SAAS,GAAqD,UAAU,CAC5E,CACE,EACE,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,UAAU,EACV,MAAM,EACN,QAAQ,EACR,WAAW,EACX,WAAW,EACI,EACjB,GAAiB,EACjB,EAAE;IACF,MAAM,eAAe,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5C,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC/B,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1D,cAAc,CAAC,CAAC,SAAS,CAAC,EAAE,gBAAgB,CAAC,CAAC;IAE9C,OAAO,CACL,MAAC,IAAI,kBACH,EAAE,EAAE,eAAe,EACnB,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAC3C,SAAS,EAAE,CAAC,eAAe,IAAI,aAAa,EAC5C,GAAG,EAAE,GAAG,iBAER,KAAC,mBAAmB,kBAAC,UAAU,EAAE,CAAC,YAAY,gBAC5C,MAAC,IAAI,kBACH,SAAS,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EACzD,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EACtB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,iBAEd,KAAC,KAAK,IAAC,GAAG,EAAE,YAAY,IAAI,QAAQ,EAAE,GAAG,EAAC,EAAE,iBAAa,MAAM,WAAG,EACjE,CAAC,eAAe,IAAI,CAAC,aAAa,CAAC,IAAI,CACtC,8BACE,KAAC,mBAAmB,cAAE,OAAO,WAAuB,EACpD,KAAC,mBAAmB,kBAAC,OAAO,EAAC,WAAW,gBAAE,UAAU,YAAuB,YAC1E,CACJ,aACI,YACa,EAErB,WAAW,CAAC,CAAC,CAAC,CACb,KAAC,yBAAyB,kBACxB,GAAG,EAAE,SAAS,EACd,IAAI,EAAC,QAAQ,gBACD,WAAW,EACvB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EACjC,eAAe,EAAE,eAAe,gBAEhC,KAAC,WAAW,oBAAK,WAAW,UAAI,YACN,CAC7B,CAAC,CAAC,CAAC,CACF,KAAC,qBAAqB,aAAG,CAC1B,EAED,KAAC,gBAAgB,kBACf,EAAE,EAAE,uBAAuB,EAC3B,OAAO,EAAE,QAAQ,CAAC,OAAO,EACzB,OAAO,EAAE,EAAE,SAAS,EAAE,cAAc,EAAE,gBAErC,QAAQ,CAAC,MAAM,YACC,aACd,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, Ref, useRef, useState } from 'react';\n\nimport Flex from '../Flex';\nimport Image from '../Image';\nimport SearchInput from '../SearchInput';\nimport { useBreakpoint, useFocusWithin } from '../../hooks';\nimport { ForwardProps } from '../../types';\n\nimport { AppHeaderProps } from './AppShell.types';\nimport AppShellOperator from './Operator';\nimport {\n  StyledAppHeader,\n  StyledAppHeaderInfo,\n  StyledAppHeaderSearchForm,\n  StyledAppHeaderSpacer,\n  StyledAppHeaderText,\n  StyledAppHeaderOperator\n} from './AppShell.styles';\n\nconst AppHeader: FunctionComponent<AppHeaderProps & ForwardProps> = forwardRef(\n  (\n    {\n      appName,\n      fullImageSrc,\n      imageSrc,\n      href,\n      onClick,\n      portalName,\n      target,\n      operator,\n      searchInput,\n      searchLabel\n    }: AppHeaderProps,\n    ref: Ref<Element>\n  ) => {\n    const isMediumOrAbove = useBreakpoint('md');\n    const searchRef = useRef(null);\n    const [searchFocused, setSearchFocused] = useState(false);\n\n    useFocusWithin([searchRef], setSearchFocused);\n\n    return (\n      <Flex\n        as={StyledAppHeader}\n        container={{ alignItems: 'center', pad: 1 }}\n        hideTitle={!isMediumOrAbove && searchFocused}\n        ref={ref}\n      >\n        <StyledAppHeaderInfo centerLogo={!fullImageSrc}>\n          <Flex\n            container={{ inline: true, alignItems: 'center', gap: 1 }}\n            as={href ? 'a' : 'div'}\n            href={href}\n            onClick={onClick}\n            target={target}\n          >\n            <Image src={fullImageSrc || imageSrc} alt='' aria-hidden='true' />\n            {(isMediumOrAbove || !searchFocused) && (\n              <>\n                <StyledAppHeaderText>{appName}</StyledAppHeaderText>\n                <StyledAppHeaderText variant='secondary'>{portalName}</StyledAppHeaderText>\n              </>\n            )}\n          </Flex>\n        </StyledAppHeaderInfo>\n\n        {searchInput ? (\n          <StyledAppHeaderSearchForm\n            ref={searchRef}\n            role='search'\n            aria-label={searchLabel}\n            onSubmit={e => e.preventDefault()}\n            isMediumOrAbove={isMediumOrAbove}\n          >\n            <SearchInput {...searchInput} />\n          </StyledAppHeaderSearchForm>\n        ) : (\n          <StyledAppHeaderSpacer />\n        )}\n\n        <AppShellOperator\n          as={StyledAppHeaderOperator}\n          actions={operator.actions}\n          popover={{ placement: 'bottom-start' }}\n        >\n          {operator.avatar}\n        </AppShellOperator>\n      </Flex>\n    );\n  }\n);\n\nexport default AppHeader;\n"]}
+{"version":3,"file":"AppHeader.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA0B,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE7E,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,KAAK,MAAM,UAAU,CAAC;AAC7B,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAI5D,OAAO,gBAAgB,MAAM,YAAY,CAAC;AAC1C,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,yBAAyB,EACzB,qBAAqB,EACrB,mBAAmB,EACnB,uBAAuB,EACxB,MAAM,mBAAmB,CAAC;AAE3B,MAAM,SAAS,GAAqD,UAAU,CAC5E,CACE,EACE,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,UAAU,EACV,MAAM,EACN,QAAQ,EACR,WAAW,EACX,WAAW,EACI,EACjB,GAAiB,EACjB,EAAE;IACF,MAAM,eAAe,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5C,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC/B,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1D,cAAc,CAAC,CAAC,SAAS,CAAC,EAAE,gBAAgB,CAAC,CAAC;IAE9C,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,eAAe,EACnB,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAC3C,SAAS,EAAE,CAAC,eAAe,IAAI,aAAa,EAC5C,GAAG,EAAE,GAAG,aAER,KAAC,mBAAmB,IAAC,UAAU,EAAE,CAAC,YAAY,YAC5C,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EACzD,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EACtB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,aAEd,KAAC,KAAK,IAAC,GAAG,EAAE,YAAY,IAAI,QAAQ,EAAE,GAAG,EAAC,EAAE,iBAAa,MAAM,WAAG,EACjE,CAAC,eAAe,IAAI,CAAC,aAAa,CAAC,IAAI,CACtC,8BACE,KAAC,mBAAmB,cAAE,OAAO,WAAuB,EACpD,KAAC,mBAAmB,IAAC,OAAO,EAAC,WAAW,YAAE,UAAU,WAAuB,YAC1E,CACJ,YACI,WACa,EAErB,WAAW,CAAC,CAAC,CAAC,CACb,KAAC,yBAAyB,IACxB,GAAG,EAAE,SAAS,EACd,IAAI,EAAC,QAAQ,gBACD,WAAW,EACvB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EACjC,eAAe,EAAE,eAAe,YAEhC,KAAC,WAAW,OAAK,WAAW,WAAI,WACN,CAC7B,CAAC,CAAC,CAAC,CACF,KAAC,qBAAqB,aAAG,CAC1B,EAED,KAAC,gBAAgB,IACf,EAAE,EAAE,uBAAuB,EAC3B,OAAO,EAAE,QAAQ,CAAC,OAAO,EACzB,OAAO,EAAE,EAAE,SAAS,EAAE,cAAc,EAAE,YAErC,QAAQ,CAAC,MAAM,WACC,YACd,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, Ref, useRef, useState } from 'react';\n\nimport Flex from '../Flex';\nimport Image from '../Image';\nimport SearchInput from '../SearchInput';\nimport { useBreakpoint, useFocusWithin } from '../../hooks';\nimport { ForwardProps } from '../../types';\n\nimport { AppHeaderProps } from './AppShell.types';\nimport AppShellOperator from './Operator';\nimport {\n  StyledAppHeader,\n  StyledAppHeaderInfo,\n  StyledAppHeaderSearchForm,\n  StyledAppHeaderSpacer,\n  StyledAppHeaderText,\n  StyledAppHeaderOperator\n} from './AppShell.styles';\n\nconst AppHeader: FunctionComponent<AppHeaderProps & ForwardProps> = forwardRef(\n  (\n    {\n      appName,\n      fullImageSrc,\n      imageSrc,\n      href,\n      onClick,\n      portalName,\n      target,\n      operator,\n      searchInput,\n      searchLabel\n    }: AppHeaderProps,\n    ref: Ref<Element>\n  ) => {\n    const isMediumOrAbove = useBreakpoint('md');\n    const searchRef = useRef(null);\n    const [searchFocused, setSearchFocused] = useState(false);\n\n    useFocusWithin([searchRef], setSearchFocused);\n\n    return (\n      <Flex\n        as={StyledAppHeader}\n        container={{ alignItems: 'center', pad: 1 }}\n        hideTitle={!isMediumOrAbove && searchFocused}\n        ref={ref}\n      >\n        <StyledAppHeaderInfo centerLogo={!fullImageSrc}>\n          <Flex\n            container={{ inline: true, alignItems: 'center', gap: 1 }}\n            as={href ? 'a' : 'div'}\n            href={href}\n            onClick={onClick}\n            target={target}\n          >\n            <Image src={fullImageSrc || imageSrc} alt='' aria-hidden='true' />\n            {(isMediumOrAbove || !searchFocused) && (\n              <>\n                <StyledAppHeaderText>{appName}</StyledAppHeaderText>\n                <StyledAppHeaderText variant='secondary'>{portalName}</StyledAppHeaderText>\n              </>\n            )}\n          </Flex>\n        </StyledAppHeaderInfo>\n\n        {searchInput ? (\n          <StyledAppHeaderSearchForm\n            ref={searchRef}\n            role='search'\n            aria-label={searchLabel}\n            onSubmit={e => e.preventDefault()}\n            isMediumOrAbove={isMediumOrAbove}\n          >\n            <SearchInput {...searchInput} />\n          </StyledAppHeaderSearchForm>\n        ) : (\n          <StyledAppHeaderSpacer />\n        )}\n\n        <AppShellOperator\n          as={StyledAppHeaderOperator}\n          actions={operator.actions}\n          popover={{ placement: 'bottom-start' }}\n        >\n          {operator.avatar}\n        </AppShellOperator>\n      </Flex>\n    );\n  }\n);\n\nexport default AppHeader;\n"]}

package/lib/components/AppShell/AppShell.js

@@ -47,7 +47,7 @@ const NavComponents = {
             };
             Component = StyledNestedNavList;
         }
-        return (_jsx(Component, Object.assign({}, fwdProps, { children: items?.map(item => (_createElement(NavComponents.ListItem, { ...item, key: item.id || item.primary }))) }), void 0));
+        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);
@@ -99,8 +99,8 @@ const NavComponents = {
         }, [navOpen]);
         const { end } = useDirection();
         return (_createElement(StyledNavListItem, { ...restProps, key: primary, nestedListCollapsed: hasItems ? collapseItems : true, active: !!active, navOpen: navOpen },
-            _jsxs(Component, Object.assign({}, compProps, { ref: forwardedRef }, { children: [visual, secondary ? (_jsxs(Flex, Object.assign({ container: { direction: 'column', alignItems: 'start' } }, { children: [_jsx("span", { children: primary }, void 0), _jsx(Text, Object.assign({ 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, Object.assign({ icon: true, variant: 'simple', as: StyledCaseClose, onClick: onDismiss, "aria-label": t('dismiss_case') }, { children: _jsx(Icon, { name: 'times' }, void 0) }), void 0)),
+            _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))));
     }
 };
@@ -121,7 +121,7 @@ const CaseTypes = ({ caseTypes }) => {
             primary: caseType.name
         };
     });
-    return useMemo(() => (_jsx(StyledCaseTypes, Object.assign({ expanded: expanded && navOpen }, { children: _jsx(NavComponents.List, { items: [
+    return useMemo(() => (_jsx(StyledCaseTypes, { expanded: expanded && navOpen, children: _jsx(NavComponents.List, { items: [
                 {
                     primary: t('app_shell_create'),
                     visual: _jsx(Icon, { name: 'plus', as: StyledAppShellNavIcon }, void 0),
@@ -129,7 +129,7 @@ const CaseTypes = ({ caseTypes }) => {
                     items: transformedCaseTypes,
                     collapseItems: !expanded || !navOpen
                 }
-            ] }, void 0) }), void 0)), [expanded, navOpen, toggleExpanded, caseTypes]);
+            ] }, void 0) }, void 0)), [expanded, navOpen, toggleExpanded, caseTypes]);
 };
 const Links = (props) => {
     const { links } = props;
@@ -214,7 +214,7 @@ export const Utils = ({ operator, items, appHeader }) => {
                 },
                 ...drawerItem,
                 primary: drawerItem.name,
-                visual: drawerItem.count ? (_jsxs(StyledUtilIconCount, { children: [drawerItem.visual, _jsx(Count, Object.assign({ as: StyledCountIcon, variant: 'urgent' }, { children: drawerItem.count }), void 0)] }, void 0)) : (drawerItem.visual)
+                visual: drawerItem.count ? (_jsxs(StyledUtilIconCount, { children: [drawerItem.visual, _jsx(Count, { as: StyledCountIcon, variant: 'urgent', children: drawerItem.count }, void 0)] }, void 0)) : (drawerItem.visual)
             };
         });
     };
@@ -320,15 +320,15 @@ const AppShell = forwardRef((props, ref) => {
         }
     }, [isSmallOrAbove, mobileNavOpen]);
     const theme = useTheme();
-    const appShellJSX = (_jsxs(Flex, Object.assign({}, restProps, { container: {
+    const appShellJSX = (_jsxs(Flex, { ...restProps, container: {
             direction: 'column',
             justify: 'between'
-        }, ref: navRef, as: StyledAppNav, appHeader: showAppHeader, navOpen: mobileNavOpen || navOpen, showEnv: !!envName, onFocus: onFocus, onMouseEnter: isSmallOrAbove ? () => openNav(200) : undefined, onMouseLeave: isSmallOrAbove ? () => closeNav(200) : undefined }, { children: [envName && (_jsx(StyledAppEnvironment, Object.assign({ item: { shrink: 0 }, color: envColor ?? theme.base.colors.red['extra-light'] }, { children: envName }), void 0)), !showAppHeader && (_jsxs(StyledAppInfo, Object.assign({ as: Grid, forwardedAs: appInfoHref ? Link : 'div', href: appInfoHref, "aria-label": `${appName}${portalName ? ` - ${portalName}` : ''}` }, appInfoRestProps, { container: {
+        }, ref: navRef, as: StyledAppNav, appHeader: showAppHeader, navOpen: mobileNavOpen || navOpen, showEnv: !!envName, onFocus: onFocus, onMouseEnter: isSmallOrAbove ? () => openNav(200) : undefined, onMouseLeave: isSmallOrAbove ? () => 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: appInfoHref ? Link : 'div', href: appInfoHref, "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, Object.assign({ item: { area: 'app' }, as: 'span' }, { children: appName }), void 0), portalName && (_jsx(Grid, Object.assign({ item: { area: 'portal' }, as: 'span' }, { children: portalName }), void 0))] }), void 0)), searchInput && !showAppHeader && (_jsx(StyledSearchForm, Object.assign({ role: 'search', "aria-label": searchLabel, onSubmit: e => e.preventDefault() }, { children: _jsx(SearchInput, Object.assign({}, searchInput), void 0) }), void 0)), _jsxs(StyledScrollWrap, Object.assign({ navOpen: mobileNavOpen || navOpen }, { 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));
+                }, 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, { navOpen: mobileNavOpen || navOpen, 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));
     const { start } = useDirection();
-    return (_jsxs(AppShellContext.Provider, Object.assign({ value: useMemo(() => ({
+    return (_jsxs(AppShellContext.Provider, { value: useMemo(() => ({
             navOpen: mobileNavOpen || navOpen,
             drawerOpen,
             setDrawerOpen,
@@ -336,12 +336,12 @@ const AppShell = forwardRef((props, ref) => {
             setRefocusEl,
             focusedImperatively,
             headerEl: headerEl || mobileHeaderEl
-        }), [navOpen, mobileNavOpen, drawerOpen, refocusEl, headerEl, mobileHeaderEl]) }, { children: [_jsx(SkipNavigation, {}, void 0), showAppHeader && (_jsx(AppHeader, Object.assign({}, appInfo, { searchInput: searchInput, searchLabel: searchLabel, operator: operator, ref: setHeaderEl }), void 0)), isSmallOrAbove ? (appShellJSX) : (_jsxs(_Fragment, { children: [_jsx(Flex, Object.assign({ as: StyledMobileNav, container: { alignItems: 'center' }, ref: setMobileHeaderEl }, { children: _jsx(Button, Object.assign({ 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, Object.assign({ open: mobileNavBackdrop, transitionSpeed: 'none', onAfterTransitionIn: () => setMobileNavOpen(true), onBeforeTransitionOut: () => setMobileNavOpen(false), onClick: e => {
+        }), [navOpen, 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 => {
                             if (e.currentTarget === e.target)
                                 setMobileNavOpen(false);
-                        } }, { children: _jsx(Drawer, Object.assign({ open: mobileNavOpen, onAfterClose: () => {
+                        }, 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, Object.assign({ tabIndex: -1, 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 }, void 0) }, void 0)] }, void 0)), showMainContent && (_jsxs(StyledAppMain, { tabIndex: -1, appHeader: showAppHeader, mobileNav: !isSmallOrAbove, headerOffset: isSmallOrAbove ? headerEl?.offsetHeight : mobileHeaderEl?.offsetHeight, children: [banners && _jsx(StyledBannerRegion, { children: banners }, void 0), main] }, void 0))] }, void 0));
 });
 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} 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} from '../../hooks';\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    };\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 (onClick) {\n      Component = BareButton;\n    } else if (href) {\n      Component = Link;\n      compProps.href = href;\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        active={!!active}\n        navOpen={navOpen}\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      imageSrc: logoSrc,\n      ...appInfoRestProps\n    } = appInfo;\n\n    const t = useI18n();\n    const [navOpenState, setNavOpen] = useState(false);\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    const focusedImperatively = useRef(false);\n    const [headerEl, setHeaderEl] = useElement<HTMLDivElement>();\n    const [mobileHeaderEl, setMobileHeaderEl] = useElement<HTMLDivElement>();\n    const isXlOrAbove = useBreakpoint('xl');\n    const isSmallOrAbove = useBreakpoint('sm');\n    const navOpen = isXlOrAbove || navOpenState;\n    const showAppHeader = !!appHeader && isSmallOrAbove;\n    const showMainContent = showAppHeader ? headerEl || mobileHeaderEl : true;\n    const openNavTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n    const closeNavTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n\n    const openNav = useCallback((delay: number = 0) => {\n      if (closeNavTimeoutId.current) clearTimeout(closeNavTimeoutId.current);\n      openNavTimeoutId.current = setTimeout(() => {\n        setNavOpen(true);\n      }, delay);\n    }, []);\n\n    const closeNav = useCallback((delay: number = 0) => {\n      if (openNavTimeoutId.current) clearTimeout(openNavTimeoutId.current);\n      closeNavTimeoutId.current = setTimeout(() => {\n        setNavOpen(false);\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    const navRef = useConsolidatedRef(ref);\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    useEffect(() => {\n      if (!navOpen) setDrawerOpen(false);\n    }, [navOpen]);\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 theme = useTheme();\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 || navOpen}\n        showEnv={!!envName}\n        onFocus={onFocus}\n        onMouseEnter={isSmallOrAbove ? () => openNav(200) : undefined}\n        onMouseLeave={isSmallOrAbove ? () => 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={appInfoHref ? (Link as any) : 'div'}\n            href={appInfoHref}\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 navOpen={mobileNavOpen || navOpen}>\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    const { start } = useDirection();\n\n    return (\n      <AppShellContext.Provider\n        value={useMemo(\n          () => ({\n            navOpen: mobileNavOpen || navOpen,\n            drawerOpen,\n            setDrawerOpen,\n            refocusEl,\n            setRefocusEl,\n            focusedImperatively,\n            headerEl: headerEl || mobileHeaderEl\n          }),\n          [navOpen, 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            tabIndex={-1}\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  MouseEventHandler,\n  MutableRefObject\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} from '../../hooks';\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    };\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 (onClick) {\n      Component = BareButton;\n    } else if (href) {\n      Component = Link;\n      compProps.href = href;\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        active={!!active}\n        navOpen={navOpen}\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      imageSrc: logoSrc,\n      ...appInfoRestProps\n    } = appInfo;\n\n    const t = useI18n();\n    const [navOpenState, setNavOpen] = useState(false);\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    const focusedImperatively = useRef(false);\n    const [headerEl, setHeaderEl] = useElement<HTMLDivElement>();\n    const [mobileHeaderEl, setMobileHeaderEl] = useElement<HTMLDivElement>();\n    const isXlOrAbove = useBreakpoint('xl');\n    const isSmallOrAbove = useBreakpoint('sm');\n    const navOpen = isXlOrAbove || navOpenState;\n    const showAppHeader = !!appHeader && isSmallOrAbove;\n    const showMainContent = showAppHeader ? headerEl || mobileHeaderEl : true;\n    const openNavTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n    const closeNavTimeoutId = useRef<ReturnType<typeof setTimeout>>();\n\n    const openNav = useCallback((delay: number = 0) => {\n      if (closeNavTimeoutId.current) clearTimeout(closeNavTimeoutId.current);\n      openNavTimeoutId.current = setTimeout(() => {\n        setNavOpen(true);\n      }, delay);\n    }, []);\n\n    const closeNav = useCallback((delay: number = 0) => {\n      if (openNavTimeoutId.current) clearTimeout(openNavTimeoutId.current);\n      closeNavTimeoutId.current = setTimeout(() => {\n        setNavOpen(false);\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    const navRef = useConsolidatedRef(ref);\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    useEffect(() => {\n      if (!navOpen) setDrawerOpen(false);\n    }, [navOpen]);\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 theme = useTheme();\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 || navOpen}\n        showEnv={!!envName}\n        onFocus={onFocus}\n        onMouseEnter={isSmallOrAbove ? () => openNav(200) : undefined}\n        onMouseLeave={isSmallOrAbove ? () => 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={appInfoHref ? (Link as any) : 'div'}\n            href={appInfoHref}\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 navOpen={mobileNavOpen || navOpen}>\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    const { start } = useDirection();\n\n    return (\n      <AppShellContext.Provider\n        value={useMemo(\n          () => ({\n            navOpen: mobileNavOpen || navOpen,\n            drawerOpen,\n            setDrawerOpen,\n            refocusEl,\n            setRefocusEl,\n            focusedImperatively,\n            headerEl: headerEl || mobileHeaderEl\n          }),\n          [navOpen, 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            tabIndex={-1}\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"]}

package/lib/components/AppShell/AppShellList.js

@@ -16,12 +16,12 @@ import { StyledAppShellListWrapper, StyledAppShellList, StyledAppShellSummaryIte
 registerIcon(pinIcon, pinSolidIcon);
 const List = ({ headingText, emptyText, items, loading = false, displayPins = false, onItemClick, onItemPinToggle, viewAll: viewAllProps }) => {
     const t = useI18n();
-    const renderContent = items.length ? (_jsx(Flex, Object.assign({ as: StyledAppShellList, item: { grow: 1 } }, { children: items.map(({ id, primary, secondary, visual, unread, href, onClick, pinned, onPinToggle, ...restProps }) => {
+    const renderContent = items.length ? (_jsx(Flex, { as: StyledAppShellList, item: { grow: 1 }, children: items.map(({ id, primary, secondary, visual, unread, href, onClick, pinned, onPinToggle, ...restProps }) => {
             const onSummaryItemClick = (e) => {
                 onClick?.(id, e);
                 onItemClick?.(id, e);
             };
-            return (_jsx("li", { children: _jsx(SummaryItem, Object.assign({}, restProps, { as: StyledAppShellSummaryItem, forwardedAs: href ? 'a' : 'button', primary: _jsx(StyledNotificationPrimary, Object.assign({ unread: unread }, { children: primary }), void 0), secondary: secondary?.length ? (_jsx(StyledNotificationSecondary, Object.assign({ unread: unread }, { children: _jsx(MetaList, { as: StyledAppShellMetaList, items: secondary }, void 0) }), void 0)) : undefined, visual: visual || unread ? (_jsxs(StyledNotificationVisual, Object.assign({ unread: unread, visualIncluded: !!visual }, { children: [visual, " ", _jsx(Alert, { variant: 'urgent' }, void 0)] }), void 0)) : undefined, href: href, onClick: onSummaryItemClick, actions: displayPins ? (_jsx(Button, Object.assign({ icon: true, as: StyledAppShellPinButton, forwardedAs: 'div', onClick: () => {
+            return (_jsx("li", { children: _jsx(SummaryItem, { ...restProps, as: StyledAppShellSummaryItem, forwardedAs: href ? 'a' : 'button', primary: _jsx(StyledNotificationPrimary, { unread: unread, children: primary }, void 0), secondary: secondary?.length ? (_jsx(StyledNotificationSecondary, { unread: unread, children: _jsx(MetaList, { as: StyledAppShellMetaList, items: secondary }, void 0) }, void 0)) : undefined, visual: visual || unread ? (_jsxs(StyledNotificationVisual, { unread: unread, visualIncluded: !!visual, children: [visual, " ", _jsx(Alert, { variant: 'urgent' }, void 0)] }, void 0)) : undefined, href: href, onClick: onSummaryItemClick, actions: displayPins ? (_jsx(Button, { icon: true, as: StyledAppShellPinButton, forwardedAs: 'div', onClick: () => {
                             onPinToggle?.(id);
                             onItemPinToggle?.(id);
                         }, onKeyDown: (e) => {
@@ -29,12 +29,12 @@ const List = ({ headingText, emptyText, items, loading = false, displayPins = fa
                                 onPinToggle?.(id);
                                 onItemPinToggle?.(id);
                             }
-                        }, role: 'button', tabIndex: 0 }, { children: _jsx(Icon, { name: pinned ? 'pin-solid' : 'pin' }, void 0) }), void 0)) : undefined, tabIndex: 0 }), void 0) }, id));
-        }) }), void 0)) : (_jsx(Flex, Object.assign({ as: EmptyStateColorContrast, container: { justify: 'center', alignItems: 'center' }, item: { grow: 1 } }, { children: _jsx(EmptyState, { message: emptyText }, void 0) }), void 0));
-    return (_jsxs(Flex, Object.assign({ as: StyledAppShellListSection, container: { direction: 'column' } }, { children: [headingText && (_jsx(Text, Object.assign({ variant: 'h3', as: StyledAppShellListHeading }, { children: headingText }), void 0)), loading ? (_jsx(Flex, Object.assign({ container: { justify: 'center', alignItems: 'center' }, item: { grow: 1 } }, { children: _jsx(Progress, { as: StyledLoading, placement: 'inline' }, void 0) }), void 0)) : (renderContent), (viewAllProps?.href || viewAllProps?.onClick) && !!items.length && !loading && (_jsx(StyledDrawerViewAll, Object.assign({}, viewAllProps, { as: viewAllProps.href ? 'a' : 'button' }, { children: t('view_all') }), void 0))] }), void 0));
+                        }, role: 'button', tabIndex: 0, children: _jsx(Icon, { name: pinned ? 'pin-solid' : 'pin' }, void 0) }, void 0)) : undefined, tabIndex: 0 }, void 0) }, id));
+        }) }, void 0)) : (_jsx(Flex, { as: EmptyStateColorContrast, container: { justify: 'center', alignItems: 'center' }, item: { grow: 1 }, children: _jsx(EmptyState, { message: emptyText }, void 0) }, void 0));
+    return (_jsxs(Flex, { as: StyledAppShellListSection, container: { direction: 'column' }, children: [headingText && (_jsx(Text, { variant: 'h3', as: StyledAppShellListHeading, children: headingText }, void 0)), loading ? (_jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, item: { grow: 1 }, children: _jsx(Progress, { as: StyledLoading, placement: 'inline' }, void 0) }, void 0)) : (renderContent), (viewAllProps?.href || viewAllProps?.onClick) && !!items.length && !loading && (_jsx(StyledDrawerViewAll, { ...viewAllProps, as: viewAllProps.href ? 'a' : 'button', children: t('view_all') }, void 0))] }, void 0));
 };
 const AppShellList = ({ listView }) => {
-    return (_jsx(Flex, Object.assign({ as: StyledAppShellListWrapper, container: { direction: 'column' } }, { children: listView.map(listItem => (_createElement(List, { ...listItem, key: listItem.id }))) }), void 0));
+    return (_jsx(Flex, { as: StyledAppShellListWrapper, container: { direction: 'column' }, children: listView.map(listItem => (_createElement(List, { ...listItem, key: listItem.id }))) }, void 0));
 };
 export default AppShellList;
 //# sourceMappingURL=AppShellList.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"AppShellList.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, Ref, MouseEvent, ReactNode, KeyboardEvent } from 'react';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport Alert from '../Badges/Alert';\nimport Button from '../Button';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as pinIcon from '../Icon/icons/pin.icon';\nimport * as pinSolidIcon from '../Icon/icons/pin-solid.icon';\nimport MetaList from '../MetaList';\nimport EmptyState from '../EmptyState';\nimport Progress from '../Progress';\nimport SummaryItem from '../SummaryItem';\nimport Text from '../Text';\nimport { useI18n } from '../../hooks';\n\nimport {\n  StyledAppShellListWrapper,\n  StyledAppShellList,\n  StyledAppShellSummaryItem,\n  StyledAppShellMetaList,\n  StyledNotificationPrimary,\n  StyledNotificationSecondary,\n  StyledAppShellPinButton,\n  EmptyStateColorContrast,\n  StyledAppShellListSection,\n  StyledAppShellListHeading,\n  StyledLoading,\n  StyledDrawerViewAll,\n  StyledNotificationVisual\n} from './AppShell.styles';\n\nregisterIcon(pinIcon, pinSolidIcon);\n\ntype ListInteractionEvent = MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>;\ninterface ListProps {\n  /** An id representing the item. */\n  id: string;\n  ref?: Ref<HTMLDivElement>;\n  items: (AppShellListItemProps & ForwardProps)[];\n  headingText?: string;\n  emptyText: string;\n  loading?: boolean;\n  viewAll?: {\n    onClick?: (e: MouseEvent) => void;\n    href?: string;\n  } & ForwardProps;\n  newNotifications?: number;\n  displayPins?: boolean;\n  onItemClick?: (id: string, event: ListInteractionEvent) => void;\n  onItemPinToggle?: (id: string) => void;\n}\nexport interface AppShellListProps {\n  listView: ListProps[];\n}\nexport interface AppShellListItemProps extends BaseProps {\n  /** An id representing the item. */\n  id: string;\n  /** The primary text for the item. */\n  primary: string;\n  /** Secondary text that will be rendered as a Meta List. */\n  secondary?: string[];\n  /** A visual associated with the item. */\n  visual?: ReactNode;\n  /** A flag indicating if the item has been read. */\n  unread?: boolean;\n  /** Icon for displaying at the end of items  */\n  pinned?: boolean;\n  /** URL or DOM id to navigate to. */\n  href?: string;\n  /** The onClick handler for the item. */\n  onClick?: (id: string, event: ListInteractionEvent) => void;\n  /** The handler hat is called when a pin icon is toggled on an item. */\n  onPinToggle?: (id: string) => void;\n}\n\nconst List = ({\n  headingText,\n  emptyText,\n  items,\n  loading = false,\n  displayPins = false,\n  onItemClick,\n  onItemPinToggle,\n  viewAll: viewAllProps\n}: ListProps) => {\n  const t = useI18n();\n\n  const renderContent = items.length ? (\n    <Flex as={StyledAppShellList} item={{ grow: 1 }}>\n      {items.map(\n        ({\n          id,\n          primary,\n          secondary,\n          visual,\n          unread,\n          href,\n          onClick,\n          pinned,\n          onPinToggle,\n          ...restProps\n        }: AppShellListItemProps) => {\n          const onSummaryItemClick = (e: ListInteractionEvent) => {\n            onClick?.(id, e);\n            onItemClick?.(id, e);\n          };\n          return (\n            <li key={id}>\n              <SummaryItem\n                {...restProps}\n                as={StyledAppShellSummaryItem}\n                forwardedAs={href ? 'a' : 'button'}\n                primary={\n                  <StyledNotificationPrimary unread={unread}>{primary}</StyledNotificationPrimary>\n                }\n                secondary={\n                  secondary?.length ? (\n                    <StyledNotificationSecondary unread={unread}>\n                      <MetaList as={StyledAppShellMetaList} items={secondary} />\n                    </StyledNotificationSecondary>\n                  ) : undefined\n                }\n                visual={\n                  visual || unread ? (\n                    <StyledNotificationVisual unread={unread} visualIncluded={!!visual}>\n                      {visual} <Alert variant='urgent' />\n                    </StyledNotificationVisual>\n                  ) : undefined\n                }\n                href={href}\n                onClick={onSummaryItemClick}\n                actions={\n                  displayPins ? (\n                    <Button\n                      icon\n                      as={StyledAppShellPinButton}\n                      forwardedAs='div'\n                      onClick={() => {\n                        onPinToggle?.(id);\n                        onItemPinToggle?.(id);\n                      }}\n                      onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n                        if (e.key === 'Enter') {\n                          onPinToggle?.(id);\n                          onItemPinToggle?.(id);\n                        }\n                      }}\n                      role='button'\n                      tabIndex={0}\n                    >\n                      <Icon name={pinned ? 'pin-solid' : 'pin'} />\n                    </Button>\n                  ) : undefined\n                }\n                tabIndex={0}\n              />\n            </li>\n          );\n        }\n      )}\n    </Flex>\n  ) : (\n    <Flex\n      as={EmptyStateColorContrast}\n      container={{ justify: 'center', alignItems: 'center' }}\n      item={{ grow: 1 }}\n    >\n      <EmptyState message={emptyText} />\n    </Flex>\n  );\n\n  return (\n    <Flex as={StyledAppShellListSection} container={{ direction: 'column' }}>\n      {headingText && (\n        <Text variant='h3' as={StyledAppShellListHeading}>\n          {headingText}\n        </Text>\n      )}\n      {loading ? (\n        <Flex container={{ justify: 'center', alignItems: 'center' }} item={{ grow: 1 }}>\n          <Progress as={StyledLoading} placement='inline' />\n        </Flex>\n      ) : (\n        renderContent\n      )}\n      {(viewAllProps?.href || viewAllProps?.onClick) && !!items.length && !loading && (\n        <StyledDrawerViewAll {...viewAllProps} as={viewAllProps.href ? 'a' : 'button'}>\n          {t('view_all')}\n        </StyledDrawerViewAll>\n      )}\n    </Flex>\n  );\n};\nconst AppShellList: FunctionComponent<AppShellListProps> = ({ listView }) => {\n  return (\n    <Flex as={StyledAppShellListWrapper} container={{ direction: 'column' }}>\n      {listView.map(listItem => (\n        <List {...listItem} key={listItem.id} />\n      ))}\n    </Flex>\n  );\n};\n\nexport default AppShellList;\n"]}
+{"version":3,"file":"AppShellList.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, Ref, MouseEvent, ReactNode, KeyboardEvent } from 'react';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport Alert from '../Badges/Alert';\nimport Button from '../Button';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as pinIcon from '../Icon/icons/pin.icon';\nimport * as pinSolidIcon from '../Icon/icons/pin-solid.icon';\nimport MetaList from '../MetaList';\nimport EmptyState from '../EmptyState';\nimport Progress from '../Progress';\nimport SummaryItem from '../SummaryItem';\nimport Text from '../Text';\nimport { useI18n } from '../../hooks';\n\nimport {\n  StyledAppShellListWrapper,\n  StyledAppShellList,\n  StyledAppShellSummaryItem,\n  StyledAppShellMetaList,\n  StyledNotificationPrimary,\n  StyledNotificationSecondary,\n  StyledAppShellPinButton,\n  EmptyStateColorContrast,\n  StyledAppShellListSection,\n  StyledAppShellListHeading,\n  StyledLoading,\n  StyledDrawerViewAll,\n  StyledNotificationVisual\n} from './AppShell.styles';\n\nregisterIcon(pinIcon, pinSolidIcon);\n\ntype ListInteractionEvent = MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>;\ninterface ListProps {\n  /** An id representing the item. */\n  id: string;\n  ref?: Ref<HTMLDivElement>;\n  items: (AppShellListItemProps & ForwardProps)[];\n  headingText?: string;\n  emptyText: string;\n  loading?: boolean;\n  viewAll?: {\n    onClick?: (e: MouseEvent) => void;\n    href?: string;\n  } & ForwardProps;\n  newNotifications?: number;\n  displayPins?: boolean;\n  onItemClick?: (id: string, event: ListInteractionEvent) => void;\n  onItemPinToggle?: (id: string) => void;\n}\nexport interface AppShellListProps {\n  listView: ListProps[];\n}\nexport interface AppShellListItemProps extends BaseProps {\n  /** An id representing the item. */\n  id: string;\n  /** The primary text for the item. */\n  primary: string;\n  /** Secondary text that will be rendered as a Meta List. */\n  secondary?: string[];\n  /** A visual associated with the item. */\n  visual?: ReactNode;\n  /** A flag indicating if the item has been read. */\n  unread?: boolean;\n  /** Icon for displaying at the end of items  */\n  pinned?: boolean;\n  /** URL or DOM id to navigate to. */\n  href?: string;\n  /** The onClick handler for the item. */\n  onClick?: (id: string, event: ListInteractionEvent) => void;\n  /** The handler hat is called when a pin icon is toggled on an item. */\n  onPinToggle?: (id: string) => void;\n}\n\nconst List = ({\n  headingText,\n  emptyText,\n  items,\n  loading = false,\n  displayPins = false,\n  onItemClick,\n  onItemPinToggle,\n  viewAll: viewAllProps\n}: ListProps) => {\n  const t = useI18n();\n\n  const renderContent = items.length ? (\n    <Flex as={StyledAppShellList} item={{ grow: 1 }}>\n      {items.map(\n        ({\n          id,\n          primary,\n          secondary,\n          visual,\n          unread,\n          href,\n          onClick,\n          pinned,\n          onPinToggle,\n          ...restProps\n        }: AppShellListItemProps) => {\n          const onSummaryItemClick = (e: ListInteractionEvent) => {\n            onClick?.(id, e);\n            onItemClick?.(id, e);\n          };\n          return (\n            <li key={id}>\n              <SummaryItem\n                {...restProps}\n                as={StyledAppShellSummaryItem}\n                forwardedAs={href ? 'a' : 'button'}\n                primary={\n                  <StyledNotificationPrimary unread={unread}>{primary}</StyledNotificationPrimary>\n                }\n                secondary={\n                  secondary?.length ? (\n                    <StyledNotificationSecondary unread={unread}>\n                      <MetaList as={StyledAppShellMetaList} items={secondary} />\n                    </StyledNotificationSecondary>\n                  ) : undefined\n                }\n                visual={\n                  visual || unread ? (\n                    <StyledNotificationVisual unread={unread} visualIncluded={!!visual}>\n                      {visual} <Alert variant='urgent' />\n                    </StyledNotificationVisual>\n                  ) : undefined\n                }\n                href={href}\n                onClick={onSummaryItemClick}\n                actions={\n                  displayPins ? (\n                    <Button\n                      icon\n                      as={StyledAppShellPinButton}\n                      forwardedAs='div'\n                      onClick={() => {\n                        onPinToggle?.(id);\n                        onItemPinToggle?.(id);\n                      }}\n                      onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n                        if (e.key === 'Enter') {\n                          onPinToggle?.(id);\n                          onItemPinToggle?.(id);\n                        }\n                      }}\n                      role='button'\n                      tabIndex={0}\n                    >\n                      <Icon name={pinned ? 'pin-solid' : 'pin'} />\n                    </Button>\n                  ) : undefined\n                }\n                tabIndex={0}\n              />\n            </li>\n          );\n        }\n      )}\n    </Flex>\n  ) : (\n    <Flex\n      as={EmptyStateColorContrast}\n      container={{ justify: 'center', alignItems: 'center' }}\n      item={{ grow: 1 }}\n    >\n      <EmptyState message={emptyText} />\n    </Flex>\n  );\n\n  return (\n    <Flex as={StyledAppShellListSection} container={{ direction: 'column' }}>\n      {headingText && (\n        <Text variant='h3' as={StyledAppShellListHeading}>\n          {headingText}\n        </Text>\n      )}\n      {loading ? (\n        <Flex container={{ justify: 'center', alignItems: 'center' }} item={{ grow: 1 }}>\n          <Progress as={StyledLoading} placement='inline' />\n        </Flex>\n      ) : (\n        renderContent\n      )}\n      {(viewAllProps?.href || viewAllProps?.onClick) && !!items.length && !loading && (\n        <StyledDrawerViewAll {...viewAllProps} as={viewAllProps.href ? 'a' : 'button'}>\n          {t('view_all')}\n        </StyledDrawerViewAll>\n      )}\n    </Flex>\n  );\n};\nconst AppShellList: FunctionComponent<AppShellListProps> = ({ listView }) => {\n  return (\n    <Flex as={StyledAppShellListWrapper} container={{ direction: 'column' }}>\n      {listView.map(listItem => (\n        <List {...listItem} key={listItem.id} />\n      ))}\n    </Flex>\n  );\n};\n\nexport default AppShellList;\n"]}

package/lib/components/AppShell/Drawer.js

@@ -33,7 +33,7 @@ export default (props) => {
     };
     const { ltr, rtl } = useDirection();
     const t = useI18n();
-    return (_jsx(Configuration, Object.assign({ theme: appShellTheme }, { children: _jsxs(Drawer, Object.assign({ as: StyledDrawerWrapper, position: 'absolute', placement: 'right', open: drawerOpen, nullWhenClosed: true, onAfterOpen: () => {
+    return (_jsx(Configuration, { theme: appShellTheme, children: _jsxs(Drawer, { as: StyledDrawerWrapper, position: 'absolute', placement: 'right', open: drawerOpen, nullWhenClosed: true, onAfterOpen: () => {
                 if (backButtonRef.current && document.activeElement !== backButtonRef.current) {
                     focusedImperatively.current = true;
                     backButtonRef.current.focus();
@@ -45,6 +45,6 @@ export default (props) => {
                     refocusEl.focus();
                 }
                 onDrawerClose?.();
-            } }, { children: [_jsxs(Flex, Object.assign({ as: StyledDrawerHeading, container: { alignItems: 'center' } }, { children: [rtl && _jsx(Text, { children: header }, void 0), _jsx(BareButton, Object.assign({ as: StyledDrawerBackButton, ref: backButtonRef, onClick: () => setDrawerOpen(false), "aria-label": t('close_noun', [header]) }, { children: _jsx(Icon, { name: 'arrow-left' }, void 0) }), void 0), ltr && _jsx(Text, { children: header }, void 0)] }), void 0), _jsx(Flex, Object.assign({ as: StyledDrawerListContainer, container: { direction: 'column' } }, { children: content }), void 0)] }), void 0) }), void 0));
+            }, children: [_jsxs(Flex, { as: StyledDrawerHeading, container: { alignItems: 'center' }, children: [rtl && _jsx(Text, { children: header }, void 0), _jsx(BareButton, { as: StyledDrawerBackButton, ref: backButtonRef, onClick: () => setDrawerOpen(false), "aria-label": t('close_noun', [header]), children: _jsx(Icon, { name: 'arrow-left' }, void 0) }, void 0), ltr && _jsx(Text, { children: header }, void 0)] }, void 0), _jsx(Flex, { as: StyledDrawerListContainer, container: { direction: 'column' }, children: content }, void 0)] }, void 0) }, void 0));
 };
 //# sourceMappingURL=Drawer.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useContext, useRef, ReactNode } from 'react';\nimport { lighten } from 'polished';\n\nimport BareButton from '../Button/BareButton';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as arrowLeftIcon from '../Icon/icons/arrow-left.icon';\nimport Text from '../Text';\nimport { useDirection, useI18n, useTheme } from '../../hooks';\nimport Configuration from '../Configuration';\nimport { tryCatch } from '../../utils';\n\nimport AppShellContext from './AppShellContext';\nimport {\n  StyledDrawerWrapper,\n  StyledDrawerBackButton,\n  StyledDrawerHeading,\n  StyledDrawerListContainer\n} from './AppShell.styles';\n\nregisterIcon(arrowLeftIcon);\n\ninterface DrawerViewProps {\n  content: ReactNode;\n  header: string;\n  onDrawerOpen?: () => void;\n  onDrawerClose?: () => void;\n}\n\nexport default (props: DrawerViewProps) => {\n  const { setDrawerOpen, drawerOpen, refocusEl, focusedImperatively } = useContext(AppShellContext);\n  const { content, header, onDrawerOpen, onDrawerClose } = props;\n  const theme = useTheme();\n\n  const backButtonRef = useRef<HTMLButtonElement>(null);\n  const appShellBg = tryCatch(() =>\n    lighten(0.1, theme.components['app-shell'].nav['background-color'])\n  );\n  const appShellTheme = {\n    base: {\n      palette: {\n        'primary-background': appShellBg,\n        'foreground-color': 'rgba(255, 255, 255, 0.7)',\n        interactive: theme.base.colors.blue.light\n      },\n      shadow: {\n        focus: theme.base.shadow['focus-inverted']\n      }\n    }\n  };\n\n  const { ltr, rtl } = useDirection();\n  const t = useI18n();\n\n  return (\n    <Configuration theme={appShellTheme}>\n      <Drawer\n        as={StyledDrawerWrapper}\n        position='absolute'\n        placement='right'\n        open={drawerOpen}\n        nullWhenClosed\n        onAfterOpen={() => {\n          if (backButtonRef.current && document.activeElement !== backButtonRef.current) {\n            focusedImperatively.current = true;\n            backButtonRef.current.focus();\n          }\n          onDrawerOpen?.();\n        }}\n        onAfterClose={() => {\n          if (refocusEl && document.activeElement !== refocusEl) {\n            focusedImperatively.current = true;\n            refocusEl.focus();\n          }\n          onDrawerClose?.();\n        }}\n      >\n        <Flex as={StyledDrawerHeading} container={{ alignItems: 'center' }}>\n          {rtl && <Text>{header}</Text>}\n          <BareButton\n            as={StyledDrawerBackButton}\n            ref={backButtonRef}\n            onClick={() => setDrawerOpen(false)}\n            aria-label={t('close_noun', [header])}\n          >\n            <Icon name='arrow-left' />\n          </BareButton>\n          {ltr && <Text>{header}</Text>}\n        </Flex>\n        <Flex as={StyledDrawerListContainer} container={{ direction: 'column' }}>\n          {content}\n        </Flex>\n      </Drawer>\n    </Configuration>\n  );\n};\n"]}
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useContext, useRef, ReactNode } from 'react';\nimport { lighten } from 'polished';\n\nimport BareButton from '../Button/BareButton';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as arrowLeftIcon from '../Icon/icons/arrow-left.icon';\nimport Text from '../Text';\nimport { useDirection, useI18n, useTheme } from '../../hooks';\nimport Configuration from '../Configuration';\nimport { tryCatch } from '../../utils';\n\nimport AppShellContext from './AppShellContext';\nimport {\n  StyledDrawerWrapper,\n  StyledDrawerBackButton,\n  StyledDrawerHeading,\n  StyledDrawerListContainer\n} from './AppShell.styles';\n\nregisterIcon(arrowLeftIcon);\n\ninterface DrawerViewProps {\n  content: ReactNode;\n  header: string;\n  onDrawerOpen?: () => void;\n  onDrawerClose?: () => void;\n}\n\nexport default (props: DrawerViewProps) => {\n  const { setDrawerOpen, drawerOpen, refocusEl, focusedImperatively } = useContext(AppShellContext);\n  const { content, header, onDrawerOpen, onDrawerClose } = props;\n  const theme = useTheme();\n\n  const backButtonRef = useRef<HTMLButtonElement>(null);\n  const appShellBg = tryCatch(() =>\n    lighten(0.1, theme.components['app-shell'].nav['background-color'])\n  );\n  const appShellTheme = {\n    base: {\n      palette: {\n        'primary-background': appShellBg,\n        'foreground-color': 'rgba(255, 255, 255, 0.7)',\n        interactive: theme.base.colors.blue.light\n      },\n      shadow: {\n        focus: theme.base.shadow['focus-inverted']\n      }\n    }\n  };\n\n  const { ltr, rtl } = useDirection();\n  const t = useI18n();\n\n  return (\n    <Configuration theme={appShellTheme}>\n      <Drawer\n        as={StyledDrawerWrapper}\n        position='absolute'\n        placement='right'\n        open={drawerOpen}\n        nullWhenClosed\n        onAfterOpen={() => {\n          if (backButtonRef.current && document.activeElement !== backButtonRef.current) {\n            focusedImperatively.current = true;\n            backButtonRef.current.focus();\n          }\n          onDrawerOpen?.();\n        }}\n        onAfterClose={() => {\n          if (refocusEl && document.activeElement !== refocusEl) {\n            focusedImperatively.current = true;\n            refocusEl.focus();\n          }\n          onDrawerClose?.();\n        }}\n      >\n        <Flex as={StyledDrawerHeading} container={{ alignItems: 'center' }}>\n          {rtl && <Text>{header}</Text>}\n          <BareButton\n            as={StyledDrawerBackButton}\n            ref={backButtonRef}\n            onClick={() => setDrawerOpen(false)}\n            aria-label={t('close_noun', [header])}\n          >\n            <Icon name='arrow-left' />\n          </BareButton>\n          {ltr && <Text>{header}</Text>}\n        </Flex>\n        <Flex as={StyledDrawerListContainer} container={{ direction: 'column' }}>\n          {content}\n        </Flex>\n      </Drawer>\n    </Configuration>\n  );\n};\n"]}

package/lib/components/AppShell/Operator.js

@@ -21,14 +21,14 @@ const Operator = forwardRef(({ children, actions, popover, as }, ref) => {
         if (!navOpen)
             setShowMenu(false);
     }, [navOpen]);
-    return (_jsxs(_Fragment, { children: [_jsx(BareButton, Object.assign({ as: as, ref: buttonRef, onClick: () => {
+    return (_jsxs(_Fragment, { children: [_jsx(BareButton, { as: as, ref: buttonRef, onClick: () => {
                     setShowMenu(cur => !cur);
                 }, onKeyDown: (e) => {
                     if (e.key === 'Escape')
                         setShowMenu(false);
                 }, onBlur: () => {
                     setShowMenu(false);
-                } }, { children: children }), void 0), _jsx(Popover, Object.assign({}, popover, { show: showMenu, target: buttonRef.current }, { children: _jsx(Menu, { focusControlEl: buttonRef.current ?? undefined, mode: 'action', items: operatorMenuItems, 
+                }, children: children }, void 0), _jsx(Popover, { ...popover, show: showMenu, target: buttonRef.current, children: _jsx(Menu, { focusControlEl: buttonRef.current ?? undefined, mode: 'action', items: operatorMenuItems, 
                     /**
                      * @see {@link MenuButton} implementation for explanation of conditions. This is in essence duplicated.
                      */
@@ -37,7 +37,7 @@ const Operator = forwardRef(({ children, actions, popover, as }, ref) => {
                             .detail > 0) {
                             setShowMenu(false);
                         }
-                    } }, void 0) }), void 0)] }, void 0));
+                    } }, void 0) }, void 0)] }, void 0));
 });
 export default Operator;
 //# sourceMappingURL=Operator.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Operator.js","sourceRoot":"","sources":["../../../src/components/AppShell/Operator.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAG7E,OAAO,UAAU,MAAM,sBAAsB,CAAC;AAC9C,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGjD,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAGhD,MAAM,QAAQ,GAAG,UAAU,CACzB,CACE,EACE,QAAQ,EACR,OAAO,EACP,OAAO,EACP,EAAE,EAKM,EACV,GAAuC,EACvC,EAAE;IACF,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAChD,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAE1C,MAAM,iBAAiB,GAAG,OAAO,CAAC,GAAG,EAAE;QACrC,OAAO,OAAO,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC;YACpE,EAAE;YACF,OAAO,EAAE,IAAI;YACb,OAAO,EAAE,KAAK;YACd,GAAG,IAAI;SACR,CAAC,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO;YAAE,WAAW,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,CACL,8BACE,KAAC,UAAU,kBACT,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,GAAG,EAAE;oBACZ,WAAW,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;gBAC3B,CAAC,EACD,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE;oBAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;wBAAE,WAAW,CAAC,KAAK,CAAC,CAAC;gBAC7C,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;oBACX,WAAW,CAAC,KAAK,CAAC,CAAC;gBACrB,CAAC,gBAEA,QAAQ,YACE,EACb,KAAC,OAAO,oBAAK,OAAO,IAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,CAAC,OAAO,gBAC7D,KAAC,IAAI,IACH,cAAc,EAAE,SAAS,CAAC,OAAO,IAAI,SAAS,EAC9C,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,iBAAiB;oBACxB;;uBAEG;oBACH,WAAW,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;wBACpB,IACG,CAAgF;6BAC9E,MAAM,GAAG,CAAC,EACb;4BACA,WAAW,CAAC,KAAK,CAAC,CAAC;yBACpB;oBACH,CAAC,WACD,YACM,YACT,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { forwardRef, useState, useEffect, useContext, useMemo } from 'react';\nimport type { Ref, ReactNode, MouseEvent, UIEvent } from 'react';\n\nimport BareButton from '../Button/BareButton';\nimport Popover from '../Popover';\nimport type { PopoverProps } from '../Popover';\nimport Menu from '../Menu';\nimport type { AcceptedMouseEventElement } from '../Menu/Menu.types';\nimport { useConsolidatedRef } from '../../hooks';\nimport type { AsProp, OmitStrict } from '../../types';\n\nimport AppShellContext from './AppShellContext';\nimport { OperatorProps } from './AppShell.types';\n\nconst Operator = forwardRef(\n  (\n    {\n      children,\n      actions,\n      popover,\n      as\n    }: {\n      children: ReactNode;\n      actions: OperatorProps['actions'];\n      popover?: OmitStrict<PopoverProps, 'show' | 'target' | 'children'>;\n    } & AsProp,\n    ref: Ref<HTMLButtonElement> | undefined\n  ) => {\n    const { navOpen } = useContext(AppShellContext);\n    const buttonRef = useConsolidatedRef(ref);\n\n    const operatorMenuItems = useMemo(() => {\n      return actions.flat().map(({ id, text, onClick: click, ...rest }) => ({\n        id,\n        primary: text,\n        onClick: click,\n        ...rest\n      }));\n    }, [actions]);\n\n    const [showMenu, setShowMenu] = useState(false);\n\n    useEffect(() => {\n      if (!navOpen) setShowMenu(false);\n    }, [navOpen]);\n\n    return (\n      <>\n        <BareButton\n          as={as}\n          ref={buttonRef}\n          onClick={() => {\n            setShowMenu(cur => !cur);\n          }}\n          onKeyDown={(e: KeyboardEvent) => {\n            if (e.key === 'Escape') setShowMenu(false);\n          }}\n          onBlur={() => {\n            setShowMenu(false);\n          }}\n        >\n          {children}\n        </BareButton>\n        <Popover {...popover} show={showMenu} target={buttonRef.current}>\n          <Menu\n            focusControlEl={buttonRef.current ?? undefined}\n            mode='action'\n            items={operatorMenuItems}\n            /**\n             * @see {@link MenuButton} implementation for explanation of conditions. This is in essence duplicated.\n             */\n            onItemClick={(_, e) => {\n              if (\n                (e as MouseEvent<AcceptedMouseEventElement> & UIEvent<AcceptedMouseEventElement>)\n                  .detail > 0\n              ) {\n                setShowMenu(false);\n              }\n            }}\n          />\n        </Popover>\n      </>\n    );\n  }\n);\n\nexport default Operator;\n"]}
+{"version":3,"file":"Operator.js","sourceRoot":"","sources":["../../../src/components/AppShell/Operator.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAG7E,OAAO,UAAU,MAAM,sBAAsB,CAAC;AAC9C,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGjD,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAGhD,MAAM,QAAQ,GAAG,UAAU,CACzB,CACE,EACE,QAAQ,EACR,OAAO,EACP,OAAO,EACP,EAAE,EAKM,EACV,GAAuC,EACvC,EAAE;IACF,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAChD,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAE1C,MAAM,iBAAiB,GAAG,OAAO,CAAC,GAAG,EAAE;QACrC,OAAO,OAAO,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC;YACpE,EAAE;YACF,OAAO,EAAE,IAAI;YACb,OAAO,EAAE,KAAK;YACd,GAAG,IAAI;SACR,CAAC,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO;YAAE,WAAW,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,CACL,8BACE,KAAC,UAAU,IACT,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,GAAG,EAAE;oBACZ,WAAW,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;gBAC3B,CAAC,EACD,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE;oBAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;wBAAE,WAAW,CAAC,KAAK,CAAC,CAAC;gBAC7C,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;oBACX,WAAW,CAAC,KAAK,CAAC,CAAC;gBACrB,CAAC,YAEA,QAAQ,WACE,EACb,KAAC,OAAO,OAAK,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,CAAC,OAAO,YAC7D,KAAC,IAAI,IACH,cAAc,EAAE,SAAS,CAAC,OAAO,IAAI,SAAS,EAC9C,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,iBAAiB;oBACxB;;uBAEG;oBACH,WAAW,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;wBACpB,IACG,CAAgF;6BAC9E,MAAM,GAAG,CAAC,EACb;4BACA,WAAW,CAAC,KAAK,CAAC,CAAC;yBACpB;oBACH,CAAC,WACD,WACM,YACT,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { forwardRef, useState, useEffect, useContext, useMemo } from 'react';\nimport type { Ref, ReactNode, MouseEvent, UIEvent } from 'react';\n\nimport BareButton from '../Button/BareButton';\nimport Popover from '../Popover';\nimport type { PopoverProps } from '../Popover';\nimport Menu from '../Menu';\nimport type { AcceptedMouseEventElement } from '../Menu/Menu.types';\nimport { useConsolidatedRef } from '../../hooks';\nimport type { AsProp, OmitStrict } from '../../types';\n\nimport AppShellContext from './AppShellContext';\nimport { OperatorProps } from './AppShell.types';\n\nconst Operator = forwardRef(\n  (\n    {\n      children,\n      actions,\n      popover,\n      as\n    }: {\n      children: ReactNode;\n      actions: OperatorProps['actions'];\n      popover?: OmitStrict<PopoverProps, 'show' | 'target' | 'children'>;\n    } & AsProp,\n    ref: Ref<HTMLButtonElement> | undefined\n  ) => {\n    const { navOpen } = useContext(AppShellContext);\n    const buttonRef = useConsolidatedRef(ref);\n\n    const operatorMenuItems = useMemo(() => {\n      return actions.flat().map(({ id, text, onClick: click, ...rest }) => ({\n        id,\n        primary: text,\n        onClick: click,\n        ...rest\n      }));\n    }, [actions]);\n\n    const [showMenu, setShowMenu] = useState(false);\n\n    useEffect(() => {\n      if (!navOpen) setShowMenu(false);\n    }, [navOpen]);\n\n    return (\n      <>\n        <BareButton\n          as={as}\n          ref={buttonRef}\n          onClick={() => {\n            setShowMenu(cur => !cur);\n          }}\n          onKeyDown={(e: KeyboardEvent) => {\n            if (e.key === 'Escape') setShowMenu(false);\n          }}\n          onBlur={() => {\n            setShowMenu(false);\n          }}\n        >\n          {children}\n        </BareButton>\n        <Popover {...popover} show={showMenu} target={buttonRef.current}>\n          <Menu\n            focusControlEl={buttonRef.current ?? undefined}\n            mode='action'\n            items={operatorMenuItems}\n            /**\n             * @see {@link MenuButton} implementation for explanation of conditions. This is in essence duplicated.\n             */\n            onItemClick={(_, e) => {\n              if (\n                (e as MouseEvent<AcceptedMouseEventElement> & UIEvent<AcceptedMouseEventElement>)\n                  .detail > 0\n              ) {\n                setShowMenu(false);\n              }\n            }}\n          />\n        </Popover>\n      </>\n    );\n  }\n);\n\nexport default Operator;\n"]}

package/lib/components/AppShell/SkipNavigation.js

@@ -36,7 +36,7 @@ const onClick = () => {
 };
 export default memo(() => {
     const t = useI18n();
-    return (_jsx(StyledSkipNavigation, Object.assign({ show: true, placement: 'bottom-end', target: {
+    return (_jsx(StyledSkipNavigation, { show: true, placement: 'bottom-end', target: {
             getBoundingClientRect: () => ({
                 height: 0,
                 width: 0,
@@ -47,6 +47,6 @@ export default memo(() => {
                 left: 24,
                 right: 24
             })
-        } }, { children: _jsx(Button, Object.assign({ variant: 'link', onClick: onClick }, { children: t('go_to_main_content') }), void 0) }), void 0));
+        }, children: _jsx(Button, { variant: 'link', onClick: onClick, children: t('go_to_main_content') }, void 0) }, void 0));
 });
 //# sourceMappingURL=SkipNavigation.js.map