@pega/cosmos-react-core 5.0.0-dev.1.0 → 5.0.0-dev.10.0

package/lib/components/AppShell/AppShell.styles.d.ts

@@ -3,9 +3,11 @@ export declare const navOpenWidth = "18.75rem";
 export declare const headerHeight = "3rem";
 export declare const StyledAppInfo: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledScrollWrap: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledCountIcon: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledCountIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<import("../Badges").CountProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>> & {
+    getTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly []>;
+}, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledSingleSelectIconBox: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledNavListItemExpandCollapse: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledNavListItemExpandCollapse: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../Icon").IconProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledUtilIconCount: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledNavItemIconBox: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledAppNav: import("styled-components").StyledComponent<"nav", import("styled-components").DefaultTheme, {

package/lib/components/AppShell/AppShell.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"AAoBA,eAAO,MAAM,QAAQ,SAAS,CAAC;AAC/B,eAAO,MAAM,YAAY,aAAa,CAAC;AACvC,eAAO,MAAM,YAAY,SAAS,CAAC;AAEnC,eAAO,MAAM,aAAa,uGAwCxB,CAAC;AAIH,eAAO,MAAM,gBAAgB,yGAM3B,CAAC;AAIH,eAAO,MAAM,eAAe,0GAa3B,CAAC;AAIF,eAAO,MAAM,yBAAyB,0GAOpC,CAAC;AAIH,eAAO,MAAM,+BAA+B,yGAAe,CAAC;AAE5D,eAAO,MAAM,mBAAmB,0GAE/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,0GAY/B,CAAC;AAIH,eAAO,MAAM,YAAY;eAA2B,OAAO;aAAW,OAAO;SAmF5E,CAAC;AAIF,eAAO,MAAM,eAAe,4GAAkB,CAAC;AAE/C,eAAO,MAAM,iBAAiB;yBACP,OAAO;kBACd,OAAO;SA+HrB,CAAC;AAIH,eAAO,MAAM,aAAa,wGAAc,CAAC;AAEzC,eAAO,MAAM,kBAAkB,yGAQ7B,CAAC;AAIH,eAAO,MAAM,mBAAmB,wGAS9B,CAAC;AAIH,eAAO,MAAM,eAAe,yGA2B1B,CAAC;AAIH,eAAO,MAAM,WAAW,yGAUtB,CAAC;AAIH,eAAO,MAAM,eAAe,4GAmB1B,CAAC;AAIH,eAAO,MAAM,aAAa,yGAEzB,CAAC;AAEF,eAAO,MAAM,aAAa;eACb,OAAO;eACP,OAAO;aACT,OAAO;;SA6ChB,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAI7B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAsBhC,CAAC;AAIH,eAAO,MAAM,0BAA0B,qMA2BrC,CAAC"}
+{"version":3,"file":"AppShell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"AAsBA,eAAO,MAAM,QAAQ,SAAS,CAAC;AAC/B,eAAO,MAAM,YAAY,aAAa,CAAC;AACvC,eAAO,MAAM,YAAY,SAAS,CAAC;AAEnC,eAAO,MAAM,aAAa,uGAwCxB,CAAC;AAIH,eAAO,MAAM,gBAAgB,yGAM3B,CAAC;AAIH,eAAO,MAAM,eAAe;;uDAa3B,CAAC;AAIF,eAAO,MAAM,yBAAyB,0GAOpC,CAAC;AAIH,eAAO,MAAM,+BAA+B,0KAAiB,CAAC;AAE9D,eAAO,MAAM,mBAAmB,0GAE/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,0GAa/B,CAAC;AAIH,eAAO,MAAM,YAAY;eAA2B,OAAO;aAAW,OAAO;SAmF5E,CAAC;AAIF,eAAO,MAAM,eAAe,4GAAkB,CAAC;AAE/C,eAAO,MAAM,iBAAiB;yBACP,OAAO;kBACd,OAAO;SA+HrB,CAAC;AAIH,eAAO,MAAM,aAAa,wGAAc,CAAC;AAEzC,eAAO,MAAM,kBAAkB,yGAQ7B,CAAC;AAIH,eAAO,MAAM,mBAAmB,wGAS9B,CAAC;AAIH,eAAO,MAAM,eAAe,yGA2B1B,CAAC;AAIH,eAAO,MAAM,WAAW,yGAUtB,CAAC;AAIH,eAAO,MAAM,eAAe,4GAmB1B,CAAC;AAIH,eAAO,MAAM,aAAa,yGAEzB,CAAC;AAEF,eAAO,MAAM,aAAa;eACb,OAAO;eACP,OAAO;aACT,OAAO;;SA6ChB,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAI7B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAsBhC,CAAC;AAIH,eAAO,MAAM,0BAA0B,qMA2BrC,CAAC"}

package/lib/components/AppShell/AppShell.styles.js

@@ -1,6 +1,7 @@
 import styled, { css } from 'styled-components';
 import { darken, getContrast, lighten, readableColor, transparentize } from 'polished';
 import { useContext } from 'react';
+import { Count } from '../Badges';
 import { StyledAvatar } from '../Avatar';
 import { StyledIcon } from '../Icon';
 import { StyledImage } from '../Image/Image';
@@ -13,6 +14,7 @@ import { StyledBareButton } from '../Button/BareButton';
 import Button from '../Button';
 import { StyledTooltip } from '../Tooltip';
 import { StyledProgressBackdrop } from '../Progress';
+import Icon from '../Icon/Icon';
 import AppShellContext from './AppShellContext';
 import { navContrastColors, pxToRem } from './style-utils';
 export const navWidth = '4rem';
@@ -67,7 +69,7 @@ export const StyledScrollWrap = styled.div(() => {
   `;
 });
 StyledScrollWrap.defaultProps = defaultThemeProp;
-export const StyledCountIcon = styled.span(({ theme: { base: { spacing } } }) => {
+export const StyledCountIcon = styled(Count)(({ theme: { base: { spacing } } }) => {
     return css `
       position: absolute;
       inset-inline-start: calc(4 * ${spacing});
@@ -85,7 +87,7 @@ export const StyledSingleSelectIconBox = styled.span(({ theme }) => {
   `;
 });
 StyledSingleSelectIconBox.defaultProps = defaultThemeProp;
-export const StyledNavListItemExpandCollapse = styled.svg ``;
+export const StyledNavListItemExpandCollapse = styled(Icon) ``;
 export const StyledUtilIconCount = styled.span `
   flex-shrink: 0;
 `;
@@ -98,6 +100,7 @@ export const StyledNavItemIconBox = styled.span(({ theme }) => {
 
     ${StyledAvatar} {
       margin-inline: calc((${navWidth} - ${theme.base['hit-area']['mouse-min']}) / 2);
+      margin-block: calc(0.5 * ${theme.base.spacing});
       font-weight: ${theme.base['font-weight'].normal};
     }
   `;

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

@@ -1 +1 @@
-{"version":3,"file":"AppShell.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { darken, getContrast, lighten, readableColor, transparentize } from 'polished';\nimport { useContext } from 'react';\n\nimport { StyledAvatar } from '../Avatar';\nimport { StyledIcon } from '../Icon';\nimport { StyledImage } from '../Image/Image';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport { StyledMenuItem } from '../Menu/Menu.styles';\nimport { useDirection } from '../../hooks';\nimport { StyledBareButton } from '../Button/BareButton';\nimport Button from '../Button';\nimport { StyledTooltip } from '../Tooltip';\nimport { StyledProgressBackdrop } from '../Progress';\n\nimport AppShellContext from './AppShellContext';\nimport { navContrastColors, pxToRem } from './style-utils';\n\nexport const navWidth = '4rem';\nexport const navOpenWidth = '18.75rem';\nexport const headerHeight = '3rem';\n\nexport const StyledAppInfo = styled.a(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n  const { hoverBg, foreground } = navContrastColors(theme);\n\n  return css`\n    padding: ${theme.base.spacing} calc(${navWidth} / 4);\n    grid-template-columns: calc(${navWidth} / 2) auto;\n    column-gap: calc(${navWidth} / 4);\n\n    &:hover,\n    button&:hover {\n      background-color: ${hoverBg};\n      text-decoration: none;\n    }\n\n    &:focus:not([disabled]) {\n      outline: none;\n      box-shadow: ${theme.base.shadow['focus-inset']};\n    }\n\n    ${StyledImage} {\n      display: inline-block;\n      width: calc(${navWidth} / 2);\n    }\n\n    span {\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    span:last-of-type {\n      font-size: ${fontSize.xs};\n      color: ${foreground};\n    }\n\n    span:first-of-type {\n      font-size: ${fontSize.s};\n      color: ${foreground};\n    }\n  `;\n});\n\nStyledAppInfo.defaultProps = defaultThemeProp;\n\nexport const StyledScrollWrap = styled.div(() => {\n  return css`\n    flex-grow: 1;\n    overflow-x: hidden;\n    overflow-y: auto;\n  `;\n});\n\nStyledScrollWrap.defaultProps = defaultThemeProp;\n\nexport const StyledCountIcon = styled.span(\n  ({\n    theme: {\n      base: { spacing }\n    }\n  }) => {\n    return css`\n      position: absolute;\n      inset-inline-start: calc(4 * ${spacing});\n      top: calc(0.5 * ${spacing});\n      padding: 0 calc(0.5 * ${spacing});\n    `;\n  }\n);\n\nStyledCountIcon.defaultProps = defaultThemeProp;\n\nexport const StyledSingleSelectIconBox = styled.span(({ theme }) => {\n  return css`\n    flex-shrink: 0;\n    height: ${theme.base['hit-area']['mouse-min']};\n    width: ${theme.base['hit-area']['mouse-min']};\n    margin-inline-start: calc(2 * ${theme.base.spacing});\n  `;\n});\n\nStyledSingleSelectIconBox.defaultProps = defaultThemeProp;\n\nexport const StyledNavListItemExpandCollapse = styled.svg``;\n\nexport const StyledUtilIconCount = styled.span`\n  flex-shrink: 0;\n`;\n\nexport const StyledNavItemIconBox = styled.span(({ theme }) => {\n  return css`\n    flex-shrink: 0;\n    > ${StyledIcon}, ${StyledUtilIconCount} > ${StyledIcon} {\n      margin-inline: calc((${navWidth} - 1.125rem) / 2);\n    }\n\n    ${StyledAvatar} {\n      margin-inline: calc((${navWidth} - ${theme.base['hit-area']['mouse-min']}) / 2);\n      font-weight: ${theme.base['font-weight'].normal};\n    }\n  `;\n});\n\nStyledNavItemIconBox.defaultProps = defaultThemeProp;\n\nexport const StyledAppNav = styled.nav<{ appHeader: boolean; showEnv: boolean }>(\n  ({ appHeader, showEnv, theme }) => {\n    const navBg = theme.components['app-shell'].nav['background-color'];\n    const { navOpen } = useContext(AppShellContext);\n\n    return css`\n      position: fixed;\n      z-index: calc(${theme.base['z-index'].backdrop} - 2);\n      background: ${navBg};\n      max-width: calc(100vw - ${theme.base['hit-area']['mouse-min']});\n      width: ${navOpen ? navOpenWidth : navWidth};\n      height: calc(100vh - ${appHeader ? headerHeight : '0rem'});\n      overflow: hidden;\n      white-space: nowrap;\n      transition: width ${`${theme.base.animation.speed} ${theme.base.animation.timing.ease}`};\n      padding-block-end: ${theme.base.spacing};\n      border-inline-end: ${pxToRem(1)} solid ${transparentize(0.9, '#000')};\n      ${!showEnv &&\n      css`\n        padding-block-start: ${theme.base.spacing};\n      `}\n      @media (pointer: coarse) {\n        max-width: calc(100vw - ${theme.base['hit-area']['finger-min']});\n      }\n\n      /* App navigation can be focused with shortcut */\n      :focus-visible {\n        box-shadow: ${theme.base.shadow['focus-inset']};\n      }\n\n      ${theme.base['custom-scrollbar'] &&\n      css`\n        * {\n          scrollbar-color: rgba(255, 255, 255, 0.6) rgba(0, 0, 0, 0.2);\n          scrollbar-width: thin;\n        }\n\n        @supports not ((scrollbar-width: thin) or (scrollbar-color: black white)) {\n          /* stylelint-disable unit-allowed-list */\n\n          *::-webkit-scrollbar {\n            width: 12px;\n            height: 12px;\n          }\n\n          *::-webkit-scrollbar-track {\n            background-color: rgba(0, 0, 0, 0.2);\n          }\n\n          *::-webkit-scrollbar-corner {\n            background-color: rgba(0, 0, 0, 0.2);\n            border-bottom-right-radius: inherit;\n          }\n\n          *::-webkit-scrollbar-thumb {\n            background-color: transparent;\n            border: 3px solid transparent;\n            border-radius: calc(1.125 * ${theme.base['border-radius']});\n            box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.6);\n          }\n\n          *::-webkit-scrollbar-thumb:hover {\n            box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.7);\n          }\n\n          *::-webkit-scrollbar-track:horizontal {\n            border-bottom-left-radius: inherit;\n          }\n\n          *::-webkit-scrollbar-track:vertical {\n            border-top-right-radius: inherit;\n          }\n\n          /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n          *::-webkit-scrollbar-track:not(:corner-present) {\n            border-bottom-right-radius: inherit;\n          }\n\n          /* stylelint-enable unit-allowed-list */\n        }\n      `}\n    `;\n  }\n);\n\nStyledAppNav.defaultProps = defaultThemeProp;\n\nexport const StyledCaseClose = styled.button``;\n\nexport const StyledNavListItem = styled.li<{\n  nestedListCollapsed: boolean;\n  singleSelect: boolean;\n}>(({ theme, nestedListCollapsed, singleSelect }) => {\n  const {\n    base: {\n      'font-weight': { 'semi-bold': semiBold }\n    }\n  } = theme;\n\n  const { navOpen } = useContext(AppShellContext);\n  const { hoverBg, foreground, border: borderColor } = navContrastColors(theme);\n  const { rtl } = useDirection();\n\n  return css`\n    display: block;\n    position: relative;\n\n    ${StyledIcon} {\n      font-size: 1.25rem;\n    }\n\n    ${StyledCaseClose} {\n      display: flex;\n      position: absolute;\n      opacity: 0;\n      left: ${navOpen ? 'auto' : '100%'};\n      top: 50%;\n      bottom: 50%;\n      margin: auto 0;\n      color: ${foreground};\n      transition-property: transform, opacity;\n      transition-duration: ${theme.base.animation.speed};\n      transition-timing-function: ${theme.base.animation.timing.ease};\n      ${navOpen &&\n      css`\n        inset-inline-end: 1rem;\n\n        &:hover,\n        &:focus {\n          opacity: 1;\n        }\n      `}\n    }\n\n    > :first-child {\n      position: relative;\n      display: flex;\n      align-items: center;\n      width: 100%;\n      padding: calc(1.25 * ${theme.base.spacing}) 0;\n      white-space: nowrap;\n      color: ${foreground};\n      cursor: pointer;\n      text-decoration: none;\n      border-block: ${pxToRem(1)} solid transparent;\n\n      span:not(${StyledCountIcon}) {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        color: inherit;\n        white-space: nowrap;\n      }\n\n      &:hover,\n      &:focus {\n        color: ${foreground};\n        background: ${hoverBg};\n      }\n\n      &:hover + ${StyledCaseClose}, &:focus + ${StyledCaseClose} {\n        ${navOpen &&\n        css`\n          opacity: 1;\n        `}\n      }\n\n      &:focus {\n        outline: none;\n        box-shadow: ${theme.base.shadow['focus-inset']};\n      }\n\n      ${StyledNavListItemExpandCollapse} {\n        position: absolute;\n        left: ${navOpen ? 'auto' : '100%'};\n        ${navOpen &&\n        css`\n          inset-inline-end: 1rem;\n        `}\n        margin: 0;\n        opacity: ${navOpen ? '1' : '0'};\n        transition-property: transform, opacity;\n        transition-duration: ${theme.base.animation.speed};\n        transition-timing-function: ${theme.base.animation.timing.ease};\n\n        ${!nestedListCollapsed &&\n        css`\n          transform: rotateZ(${rtl ? '-90deg' : '90deg'});\n        `}\n      }\n\n      ${singleSelect &&\n      css`\n        ${StyledNavItemIconBox} > ${StyledIcon} {\n          margin-inline: ${theme.base.spacing};\n        }\n      `}\n\n      ${StyledSingleSelectIconBox} + span {\n        margin-inline-start: ${theme.base.spacing};\n      }\n    }\n\n    [aria-current='page'] {\n      position: relative;\n      font-weight: ${semiBold};\n      border-block: ${pxToRem(1)} solid ${borderColor};\n\n      &::before {\n        content: '';\n        position: absolute;\n        width: ${pxToRem(4)};\n        inset-inline-start: 0;\n        top: 0;\n        bottom: 0;\n        background-color: ${foreground};\n      }\n    }\n  `;\n});\n\nStyledNavListItem.defaultProps = defaultThemeProp;\n\nexport const StyledNavList = styled.ul``;\n\nexport const StyledNavCasesList = styled.div(({ theme }) => {\n  return css`\n    ${StyledNavListItem} {\n      > :first-child {\n        padding: ${theme.base.spacing} 0;\n      }\n    }\n  `;\n});\n\nStyledNavCasesList.defaultProps = defaultThemeProp;\n\nexport const StyledNestedNavList = styled(StyledNavList)(({ theme }) => {\n  return css`\n    ${StyledNavListItem} {\n      > :first-child {\n        padding-inline-start: calc(${navWidth} + 2 * ${theme.base.spacing});\n        font-weight: ${theme.base['font-weight'].normal};\n      }\n    }\n  `;\n});\n\nStyledNestedNavList.defaultProps = defaultThemeProp;\n\nexport const StyledCaseTypes = styled.div(props => {\n  const {\n    theme: {\n      base: {\n        animation: {\n          speed,\n          timing: { ease: acceleration }\n        }\n      }\n    }\n  } = props;\n\n  return css`\n    button {\n      ${StyledNavItemIconBox} {\n        transition: transform ${speed} ${acceleration};\n      }\n\n      &[aria-expanded='false'] ${StyledNavItemIconBox} {\n        transform: none;\n      }\n\n      &[aria-expanded='true'] ${StyledNavItemIconBox} {\n        transform: rotateZ(45deg);\n      }\n    }\n  `;\n});\n\nStyledCaseTypes.defaultProps = defaultThemeProp;\n\nexport const StyledUtils = styled.div(({ theme }) => {\n  const { border: borderColor } = navContrastColors(theme);\n\n  return css`\n    border-top: 0.0625rem solid ${borderColor};\n\n    ${StyledBareButton} > ${StyledIcon}:first-child, ${StyledBareButton} > ${StyledUtilIconCount} {\n      margin: 0 calc((${navWidth} - 1.125rem) / 2);\n    }\n  `;\n});\n\nStyledUtils.defaultProps = defaultThemeProp;\n\nexport const StyledMobileNav = styled.header(({ theme }) => {\n  const mobileNavColor = theme.base.palette['brand-primary'];\n\n  const contrastColor = tryCatch(() => readableColor(mobileNavColor));\n\n  return css`\n    min-width: 100%;\n    min-height: ${headerHeight};\n    z-index: ${theme.base['z-index'].drawer};\n    background-color: ${mobileNavColor};\n    color: ${contrastColor};\n    position: sticky;\n    top: 0;\n    padding-inline-start: ${theme.base.spacing};\n\n    @media (pointer: coarse) {\n      padding-inline-start: 0;\n    }\n  `;\n});\n\nStyledMobileNav.defaultProps = defaultThemeProp;\n\nexport const StyledLoading = styled.div`\n  font-size: 2rem;\n`;\n\nexport const StyledAppMain = styled.main<{\n  appHeader: boolean;\n  mobileNav: boolean;\n  navOpen: boolean;\n  headerOffset?: number;\n}>(({ appHeader, mobileNav, navOpen, headerOffset = 0, theme }) => {\n  const heightOffset = appHeader || mobileNav ? headerHeight : '0rem';\n\n  return css`\n    --appshell-offset: ${headerOffset}px;\n    /* stylelint-disable-next-line length-zero-no-unit */\n    --appshell-horizontal-offset: 0rem;\n\n    @media (min-width: ${theme.base.breakpoints.sm}) {\n      --appshell-horizontal-offset: ${navOpen ? navOpenWidth : navWidth};\n    }\n    position: relative;\n    margin-inline-start: ${mobileNav ? 0 : navWidth};\n    min-height: calc(100vh - ${heightOffset});\n    background-color: ${theme.base.palette['app-background']};\n\n    :focus {\n      outline: none;\n    }\n\n    ${navOpen &&\n    !mobileNav &&\n    css`\n      margin-inline-start: ${navOpenWidth};\n    `}\n\n    ${!mobileNav &&\n    css`\n      transition: margin-inline-start\n        ${`${theme.base.animation.speed} ${theme.base.animation.timing.ease}`};\n    `}\n\n    & > ${StyledProgressBackdrop} {\n      max-height: calc(100vh - ${heightOffset});\n      max-width: calc(100vw - ${navOpen ? navOpenWidth : navWidth});\n      inset-block-start: ${heightOffset};\n      inset-inline-start: ${navOpen ? navOpenWidth : navWidth};\n      position: fixed;\n      transition-property: opacity, max-height, max-width, inset-block-start, inset-inline-start;\n      transition-duration: ${theme.base.animation.speed};\n      transition-timing-function: ${theme.base.animation.timing.ease};\n    }\n  `;\n});\n\nStyledAppMain.defaultProps = defaultThemeProp;\n\nexport const StyledBannerRegion = styled.div(({ theme }) => {\n  return css`\n    padding: calc(2 * ${theme.base.spacing});\n  `;\n});\n\nStyledBannerRegion.defaultProps = defaultThemeProp;\n\nexport const StyledAppShellTooltip = styled(StyledTooltip)(({ theme }) => {\n  const bg = theme.components.tooltip['background-color'];\n  const color = readableColor(bg);\n\n  return css`\n    background-color: ${bg};\n    padding: 0;\n    header {\n      color: ${color};\n      border-bottom: none;\n    }\n    ${StyledMenuItem} {\n      background-color: ${bg};\n      color: ${color};\n\n      &:hover,\n      &:focus {\n        background-color: ${bg};\n        box-shadow: ${theme.base.shadow.focus};\n      }\n    }\n  `;\n});\n\nStyledAppShellTooltip.defaultProps = defaultThemeProp;\n\nexport const StyledAppShellToggleButton = styled(Button)(({ theme }) => {\n  const navBg = theme.components['app-shell'].nav['background-color'];\n  let bg = darken(0.2, navBg);\n\n  if (getContrast(navBg, bg) < 1.3) {\n    bg = lighten(0.2, navBg);\n  }\n\n  const color = readableColor(bg);\n\n  return css`\n    background-color: ${bg};\n    color: ${color};\n    border: none;\n    margin-top: calc(1 * ${theme.base.spacing});\n\n    ${StyledIcon} {\n      width: 1.25rem;\n      height: 1.25rem;\n      font-weight: bold;\n    }\n\n    &:enabled:focus,\n    :not([disabled]):focus {\n      box-shadow: ${theme.base.shadow.focus};\n    }\n  `;\n});\n\nStyledAppShellToggleButton.defaultProps = defaultThemeProp;\n"]}
+{"version":3,"file":"AppShell.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { darken, getContrast, lighten, readableColor, transparentize } from 'polished';\nimport { useContext } from 'react';\n\nimport { Count } from '../Badges';\nimport { StyledAvatar } from '../Avatar';\nimport { StyledIcon } from '../Icon';\nimport { StyledImage } from '../Image/Image';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport { StyledMenuItem } from '../Menu/Menu.styles';\nimport { useDirection } from '../../hooks';\nimport { StyledBareButton } from '../Button/BareButton';\nimport Button from '../Button';\nimport { StyledTooltip } from '../Tooltip';\nimport { StyledProgressBackdrop } from '../Progress';\nimport Icon from '../Icon/Icon';\n\nimport AppShellContext from './AppShellContext';\nimport { navContrastColors, pxToRem } from './style-utils';\n\nexport const navWidth = '4rem';\nexport const navOpenWidth = '18.75rem';\nexport const headerHeight = '3rem';\n\nexport const StyledAppInfo = styled.a(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n  const { hoverBg, foreground } = navContrastColors(theme);\n\n  return css`\n    padding: ${theme.base.spacing} calc(${navWidth} / 4);\n    grid-template-columns: calc(${navWidth} / 2) auto;\n    column-gap: calc(${navWidth} / 4);\n\n    &:hover,\n    button&:hover {\n      background-color: ${hoverBg};\n      text-decoration: none;\n    }\n\n    &:focus:not([disabled]) {\n      outline: none;\n      box-shadow: ${theme.base.shadow['focus-inset']};\n    }\n\n    ${StyledImage} {\n      display: inline-block;\n      width: calc(${navWidth} / 2);\n    }\n\n    span {\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    span:last-of-type {\n      font-size: ${fontSize.xs};\n      color: ${foreground};\n    }\n\n    span:first-of-type {\n      font-size: ${fontSize.s};\n      color: ${foreground};\n    }\n  `;\n});\n\nStyledAppInfo.defaultProps = defaultThemeProp;\n\nexport const StyledScrollWrap = styled.div(() => {\n  return css`\n    flex-grow: 1;\n    overflow-x: hidden;\n    overflow-y: auto;\n  `;\n});\n\nStyledScrollWrap.defaultProps = defaultThemeProp;\n\nexport const StyledCountIcon = styled(Count)(\n  ({\n    theme: {\n      base: { spacing }\n    }\n  }) => {\n    return css`\n      position: absolute;\n      inset-inline-start: calc(4 * ${spacing});\n      top: calc(0.5 * ${spacing});\n      padding: 0 calc(0.5 * ${spacing});\n    `;\n  }\n);\n\nStyledCountIcon.defaultProps = defaultThemeProp;\n\nexport const StyledSingleSelectIconBox = styled.span(({ theme }) => {\n  return css`\n    flex-shrink: 0;\n    height: ${theme.base['hit-area']['mouse-min']};\n    width: ${theme.base['hit-area']['mouse-min']};\n    margin-inline-start: calc(2 * ${theme.base.spacing});\n  `;\n});\n\nStyledSingleSelectIconBox.defaultProps = defaultThemeProp;\n\nexport const StyledNavListItemExpandCollapse = styled(Icon)``;\n\nexport const StyledUtilIconCount = styled.span`\n  flex-shrink: 0;\n`;\n\nexport const StyledNavItemIconBox = styled.span(({ theme }) => {\n  return css`\n    flex-shrink: 0;\n    > ${StyledIcon}, ${StyledUtilIconCount} > ${StyledIcon} {\n      margin-inline: calc((${navWidth} - 1.125rem) / 2);\n    }\n\n    ${StyledAvatar} {\n      margin-inline: calc((${navWidth} - ${theme.base['hit-area']['mouse-min']}) / 2);\n      margin-block: calc(0.5 * ${theme.base.spacing});\n      font-weight: ${theme.base['font-weight'].normal};\n    }\n  `;\n});\n\nStyledNavItemIconBox.defaultProps = defaultThemeProp;\n\nexport const StyledAppNav = styled.nav<{ appHeader: boolean; showEnv: boolean }>(\n  ({ appHeader, showEnv, theme }) => {\n    const navBg = theme.components['app-shell'].nav['background-color'];\n    const { navOpen } = useContext(AppShellContext);\n\n    return css`\n      position: fixed;\n      z-index: calc(${theme.base['z-index'].backdrop} - 2);\n      background: ${navBg};\n      max-width: calc(100vw - ${theme.base['hit-area']['mouse-min']});\n      width: ${navOpen ? navOpenWidth : navWidth};\n      height: calc(100vh - ${appHeader ? headerHeight : '0rem'});\n      overflow: hidden;\n      white-space: nowrap;\n      transition: width ${`${theme.base.animation.speed} ${theme.base.animation.timing.ease}`};\n      padding-block-end: ${theme.base.spacing};\n      border-inline-end: ${pxToRem(1)} solid ${transparentize(0.9, '#000')};\n      ${!showEnv &&\n      css`\n        padding-block-start: ${theme.base.spacing};\n      `}\n      @media (pointer: coarse) {\n        max-width: calc(100vw - ${theme.base['hit-area']['finger-min']});\n      }\n\n      /* App navigation can be focused with shortcut */\n      :focus-visible {\n        box-shadow: ${theme.base.shadow['focus-inset']};\n      }\n\n      ${theme.base['custom-scrollbar'] &&\n      css`\n        * {\n          scrollbar-color: rgba(255, 255, 255, 0.6) rgba(0, 0, 0, 0.2);\n          scrollbar-width: thin;\n        }\n\n        @supports not ((scrollbar-width: thin) or (scrollbar-color: black white)) {\n          /* stylelint-disable unit-allowed-list */\n\n          *::-webkit-scrollbar {\n            width: 12px;\n            height: 12px;\n          }\n\n          *::-webkit-scrollbar-track {\n            background-color: rgba(0, 0, 0, 0.2);\n          }\n\n          *::-webkit-scrollbar-corner {\n            background-color: rgba(0, 0, 0, 0.2);\n            border-bottom-right-radius: inherit;\n          }\n\n          *::-webkit-scrollbar-thumb {\n            background-color: transparent;\n            border: 3px solid transparent;\n            border-radius: calc(1.125 * ${theme.base['border-radius']});\n            box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.6);\n          }\n\n          *::-webkit-scrollbar-thumb:hover {\n            box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.7);\n          }\n\n          *::-webkit-scrollbar-track:horizontal {\n            border-bottom-left-radius: inherit;\n          }\n\n          *::-webkit-scrollbar-track:vertical {\n            border-top-right-radius: inherit;\n          }\n\n          /* stylelint-disable-next-line selector-pseudo-class-no-unknown */\n          *::-webkit-scrollbar-track:not(:corner-present) {\n            border-bottom-right-radius: inherit;\n          }\n\n          /* stylelint-enable unit-allowed-list */\n        }\n      `}\n    `;\n  }\n);\n\nStyledAppNav.defaultProps = defaultThemeProp;\n\nexport const StyledCaseClose = styled.button``;\n\nexport const StyledNavListItem = styled.li<{\n  nestedListCollapsed: boolean;\n  singleSelect: boolean;\n}>(({ theme, nestedListCollapsed, singleSelect }) => {\n  const {\n    base: {\n      'font-weight': { 'semi-bold': semiBold }\n    }\n  } = theme;\n\n  const { navOpen } = useContext(AppShellContext);\n  const { hoverBg, foreground, border: borderColor } = navContrastColors(theme);\n  const { rtl } = useDirection();\n\n  return css`\n    display: block;\n    position: relative;\n\n    ${StyledIcon} {\n      font-size: 1.25rem;\n    }\n\n    ${StyledCaseClose} {\n      display: flex;\n      position: absolute;\n      opacity: 0;\n      left: ${navOpen ? 'auto' : '100%'};\n      top: 50%;\n      bottom: 50%;\n      margin: auto 0;\n      color: ${foreground};\n      transition-property: transform, opacity;\n      transition-duration: ${theme.base.animation.speed};\n      transition-timing-function: ${theme.base.animation.timing.ease};\n      ${navOpen &&\n      css`\n        inset-inline-end: 1rem;\n\n        &:hover,\n        &:focus {\n          opacity: 1;\n        }\n      `}\n    }\n\n    > :first-child {\n      position: relative;\n      display: flex;\n      align-items: center;\n      width: 100%;\n      padding: calc(1.25 * ${theme.base.spacing}) 0;\n      white-space: nowrap;\n      color: ${foreground};\n      cursor: pointer;\n      text-decoration: none;\n      border-block: ${pxToRem(1)} solid transparent;\n\n      span:not(${StyledCountIcon}) {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        color: inherit;\n        white-space: nowrap;\n      }\n\n      &:hover,\n      &:focus {\n        color: ${foreground};\n        background: ${hoverBg};\n      }\n\n      &:hover + ${StyledCaseClose}, &:focus + ${StyledCaseClose} {\n        ${navOpen &&\n        css`\n          opacity: 1;\n        `}\n      }\n\n      &:focus {\n        outline: none;\n        box-shadow: ${theme.base.shadow['focus-inset']};\n      }\n\n      ${StyledNavListItemExpandCollapse} {\n        position: absolute;\n        left: ${navOpen ? 'auto' : '100%'};\n        ${navOpen &&\n        css`\n          inset-inline-end: 1rem;\n        `}\n        margin: 0;\n        opacity: ${navOpen ? '1' : '0'};\n        transition-property: transform, opacity;\n        transition-duration: ${theme.base.animation.speed};\n        transition-timing-function: ${theme.base.animation.timing.ease};\n\n        ${!nestedListCollapsed &&\n        css`\n          transform: rotateZ(${rtl ? '-90deg' : '90deg'});\n        `}\n      }\n\n      ${singleSelect &&\n      css`\n        ${StyledNavItemIconBox} > ${StyledIcon} {\n          margin-inline: ${theme.base.spacing};\n        }\n      `}\n\n      ${StyledSingleSelectIconBox} + span {\n        margin-inline-start: ${theme.base.spacing};\n      }\n    }\n\n    [aria-current='page'] {\n      position: relative;\n      font-weight: ${semiBold};\n      border-block: ${pxToRem(1)} solid ${borderColor};\n\n      &::before {\n        content: '';\n        position: absolute;\n        width: ${pxToRem(4)};\n        inset-inline-start: 0;\n        top: 0;\n        bottom: 0;\n        background-color: ${foreground};\n      }\n    }\n  `;\n});\n\nStyledNavListItem.defaultProps = defaultThemeProp;\n\nexport const StyledNavList = styled.ul``;\n\nexport const StyledNavCasesList = styled.div(({ theme }) => {\n  return css`\n    ${StyledNavListItem} {\n      > :first-child {\n        padding: ${theme.base.spacing} 0;\n      }\n    }\n  `;\n});\n\nStyledNavCasesList.defaultProps = defaultThemeProp;\n\nexport const StyledNestedNavList = styled(StyledNavList)(({ theme }) => {\n  return css`\n    ${StyledNavListItem} {\n      > :first-child {\n        padding-inline-start: calc(${navWidth} + 2 * ${theme.base.spacing});\n        font-weight: ${theme.base['font-weight'].normal};\n      }\n    }\n  `;\n});\n\nStyledNestedNavList.defaultProps = defaultThemeProp;\n\nexport const StyledCaseTypes = styled.div(props => {\n  const {\n    theme: {\n      base: {\n        animation: {\n          speed,\n          timing: { ease: acceleration }\n        }\n      }\n    }\n  } = props;\n\n  return css`\n    button {\n      ${StyledNavItemIconBox} {\n        transition: transform ${speed} ${acceleration};\n      }\n\n      &[aria-expanded='false'] ${StyledNavItemIconBox} {\n        transform: none;\n      }\n\n      &[aria-expanded='true'] ${StyledNavItemIconBox} {\n        transform: rotateZ(45deg);\n      }\n    }\n  `;\n});\n\nStyledCaseTypes.defaultProps = defaultThemeProp;\n\nexport const StyledUtils = styled.div(({ theme }) => {\n  const { border: borderColor } = navContrastColors(theme);\n\n  return css`\n    border-top: 0.0625rem solid ${borderColor};\n\n    ${StyledBareButton} > ${StyledIcon}:first-child, ${StyledBareButton} > ${StyledUtilIconCount} {\n      margin: 0 calc((${navWidth} - 1.125rem) / 2);\n    }\n  `;\n});\n\nStyledUtils.defaultProps = defaultThemeProp;\n\nexport const StyledMobileNav = styled.header(({ theme }) => {\n  const mobileNavColor = theme.base.palette['brand-primary'];\n\n  const contrastColor = tryCatch(() => readableColor(mobileNavColor));\n\n  return css`\n    min-width: 100%;\n    min-height: ${headerHeight};\n    z-index: ${theme.base['z-index'].drawer};\n    background-color: ${mobileNavColor};\n    color: ${contrastColor};\n    position: sticky;\n    top: 0;\n    padding-inline-start: ${theme.base.spacing};\n\n    @media (pointer: coarse) {\n      padding-inline-start: 0;\n    }\n  `;\n});\n\nStyledMobileNav.defaultProps = defaultThemeProp;\n\nexport const StyledLoading = styled.div`\n  font-size: 2rem;\n`;\n\nexport const StyledAppMain = styled.main<{\n  appHeader: boolean;\n  mobileNav: boolean;\n  navOpen: boolean;\n  headerOffset?: number;\n}>(({ appHeader, mobileNav, navOpen, headerOffset = 0, theme }) => {\n  const heightOffset = appHeader || mobileNav ? headerHeight : '0rem';\n\n  return css`\n    --appshell-offset: ${headerOffset}px;\n    /* stylelint-disable-next-line length-zero-no-unit */\n    --appshell-horizontal-offset: 0rem;\n\n    @media (min-width: ${theme.base.breakpoints.sm}) {\n      --appshell-horizontal-offset: ${navOpen ? navOpenWidth : navWidth};\n    }\n    position: relative;\n    margin-inline-start: ${mobileNav ? 0 : navWidth};\n    min-height: calc(100vh - ${heightOffset});\n    background-color: ${theme.base.palette['app-background']};\n\n    :focus {\n      outline: none;\n    }\n\n    ${navOpen &&\n    !mobileNav &&\n    css`\n      margin-inline-start: ${navOpenWidth};\n    `}\n\n    ${!mobileNav &&\n    css`\n      transition: margin-inline-start\n        ${`${theme.base.animation.speed} ${theme.base.animation.timing.ease}`};\n    `}\n\n    & > ${StyledProgressBackdrop} {\n      max-height: calc(100vh - ${heightOffset});\n      max-width: calc(100vw - ${navOpen ? navOpenWidth : navWidth});\n      inset-block-start: ${heightOffset};\n      inset-inline-start: ${navOpen ? navOpenWidth : navWidth};\n      position: fixed;\n      transition-property: opacity, max-height, max-width, inset-block-start, inset-inline-start;\n      transition-duration: ${theme.base.animation.speed};\n      transition-timing-function: ${theme.base.animation.timing.ease};\n    }\n  `;\n});\n\nStyledAppMain.defaultProps = defaultThemeProp;\n\nexport const StyledBannerRegion = styled.div(({ theme }) => {\n  return css`\n    padding: calc(2 * ${theme.base.spacing});\n  `;\n});\n\nStyledBannerRegion.defaultProps = defaultThemeProp;\n\nexport const StyledAppShellTooltip = styled(StyledTooltip)(({ theme }) => {\n  const bg = theme.components.tooltip['background-color'];\n  const color = readableColor(bg);\n\n  return css`\n    background-color: ${bg};\n    padding: 0;\n    header {\n      color: ${color};\n      border-bottom: none;\n    }\n    ${StyledMenuItem} {\n      background-color: ${bg};\n      color: ${color};\n\n      &:hover,\n      &:focus {\n        background-color: ${bg};\n        box-shadow: ${theme.base.shadow.focus};\n      }\n    }\n  `;\n});\n\nStyledAppShellTooltip.defaultProps = defaultThemeProp;\n\nexport const StyledAppShellToggleButton = styled(Button)(({ theme }) => {\n  const navBg = theme.components['app-shell'].nav['background-color'];\n  let bg = darken(0.2, navBg);\n\n  if (getContrast(navBg, bg) < 1.3) {\n    bg = lighten(0.2, navBg);\n  }\n\n  const color = readableColor(bg);\n\n  return css`\n    background-color: ${bg};\n    color: ${color};\n    border: none;\n    margin-top: calc(1 * ${theme.base.spacing});\n\n    ${StyledIcon} {\n      width: 1.25rem;\n      height: 1.25rem;\n      font-weight: bold;\n    }\n\n    &:enabled:focus,\n    :not([disabled]):focus {\n      box-shadow: ${theme.base.shadow.focus};\n    }\n  `;\n});\n\nStyledAppShellToggleButton.defaultProps = defaultThemeProp;\n"]}

package/lib/components/AppShell/AppShellContext.d.ts

@@ -1,6 +1,6 @@
-import { MutableRefObject } from 'react';
-import { openCloseStates } from '../../hooks/useTransitionState';
-import { AppShellProps, UtilItemProps } from './AppShell.types';
+import type { MutableRefObject } from 'react';
+import type { openCloseStates } from '../../hooks/useTransitionState';
+import type { AppShellProps, UtilItemProps } from './AppShell.types';
 export interface AppShellDrawerContextValue {
     drawerOpen: boolean;
     openDrawer: (item: UtilItemProps) => void;

package/lib/components/AppShell/AppShellContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppShellContext.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAExD,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAEjE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEhE,MAAM,WAAW,0BAA0B;IACzC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IAC1C,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,eAAO,MAAM,qBAAqB,qDAIhC,CAAC;AAEH,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,OAAO,eAAe,CAAC,CAAC;IACjE,mBAAmB,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC/C,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;IAChC,iBAAiB,EAAE,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACxD,iBAAiB,EAAE,WAAW,GAAG,IAAI,CAAC;IACtC,oBAAoB,EAAE,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACvD,mBAAmB,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAC3D,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,eAAe,+CAsBnB,CAAC;AAEH,eAAe,eAAe,CAAC"}
+{"version":3,"file":"AppShellContext.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellContext.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAEtE,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAErE,MAAM,WAAW,0BAA0B;IACzC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IAC1C,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,eAAO,MAAM,qBAAqB,qDAIhC,CAAC;AAEH,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,OAAO,eAAe,CAAC,CAAC;IACjE,mBAAmB,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC/C,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;IAChC,iBAAiB,EAAE,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACxD,iBAAiB,EAAE,WAAW,GAAG,IAAI,CAAC;IACtC,oBAAoB,EAAE,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACvD,mBAAmB,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAC3D,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,eAAe,+CAsBnB,CAAC;AAEH,eAAe,eAAe,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"AppShellContext.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAoB,MAAM,OAAO,CAAC;AAYxD,MAAM,CAAC,MAAM,qBAAqB,GAAG,aAAa,CAA6B;IAC7E,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,GAAG,EAAE,GAAE,CAAC;IACpB,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;CACtB,CAAC,CAAC;AAgBH,MAAM,eAAe,GAAG,aAAa,CAAuB;IAC1D,OAAO,EAAE,KAAK;IACd,UAAU,EAAE,KAAK;IACjB,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;IACvB,QAAQ,EAAE,QAAQ;IAClB,mBAAmB,EAAE,KAAK;IAC1B,mBAAmB,EAAE;QACnB,IAAI,OAAO;YACT,OAAO,KAAK,CAAC;QACf,CAAC;KACF;IACD,QAAQ,EAAE,IAAI;IACd,iBAAiB,EAAE;QACjB,IAAI,OAAO;YACT,OAAO,IAAI,CAAC;QACd,CAAC;QACD,gEAAgE;QAChE,IAAI,OAAO,CAAC,GAAG,IAAG,CAAC;KACpB;IACD,iBAAiB,EAAE,IAAI;IACvB,oBAAoB,EAAE,GAAG,EAAE,GAAE,CAAC;IAC9B,aAAa,EAAE,KAAK;CACrB,CAAC,CAAC;AAEH,eAAe,eAAe,CAAC","sourcesContent":["import { createContext, MutableRefObject } from 'react';\n\nimport { openCloseStates } from '../../hooks/useTransitionState';\n\nimport { AppShellProps, UtilItemProps } from './AppShell.types';\n\nexport interface AppShellDrawerContextValue {\n  drawerOpen: boolean;\n  openDrawer: (item: UtilItemProps) => void;\n  closeDrawer: () => void;\n}\n\nexport const AppShellDrawerContext = createContext<AppShellDrawerContextValue>({\n  drawerOpen: false,\n  openDrawer: () => {},\n  closeDrawer: () => {}\n});\n\nexport interface AppShellContextValue {\n  navOpen: boolean;\n  drawerOpen: boolean;\n  setDrawerOpen: (val: boolean) => void;\n  navState: (typeof openCloseStates)[keyof typeof openCloseStates];\n  focusedImperatively: MutableRefObject<boolean>;\n  headerEl: HTMLDivElement | null;\n  previewTriggerRef: MutableRefObject<HTMLElement | null>;\n  searchContainerEl: HTMLElement | null;\n  setSearchContainerEl: (el: HTMLElement | null) => void;\n  collapsedHoverMenus?: AppShellProps['collapsedHoverMenus'];\n  mobileNavOpen: boolean;\n}\n\nconst AppShellContext = createContext<AppShellContextValue>({\n  navOpen: false,\n  drawerOpen: false,\n  setDrawerOpen: () => {},\n  navState: 'closed',\n  collapsedHoverMenus: false,\n  focusedImperatively: {\n    get current() {\n      return false;\n    }\n  },\n  headerEl: null,\n  previewTriggerRef: {\n    get current() {\n      return null;\n    },\n    // eslint-disable-next-line @typescript-eslint/no-empty-function\n    set current(val) {}\n  },\n  searchContainerEl: null,\n  setSearchContainerEl: () => {},\n  mobileNavOpen: false\n});\n\nexport default AppShellContext;\n"]}
+{"version":3,"file":"AppShellContext.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAatC,MAAM,CAAC,MAAM,qBAAqB,GAAG,aAAa,CAA6B;IAC7E,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,GAAG,EAAE,GAAE,CAAC;IACpB,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;CACtB,CAAC,CAAC;AAgBH,MAAM,eAAe,GAAG,aAAa,CAAuB;IAC1D,OAAO,EAAE,KAAK;IACd,UAAU,EAAE,KAAK;IACjB,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;IACvB,QAAQ,EAAE,QAAQ;IAClB,mBAAmB,EAAE,KAAK;IAC1B,mBAAmB,EAAE;QACnB,IAAI,OAAO;YACT,OAAO,KAAK,CAAC;QACf,CAAC;KACF;IACD,QAAQ,EAAE,IAAI;IACd,iBAAiB,EAAE;QACjB,IAAI,OAAO;YACT,OAAO,IAAI,CAAC;QACd,CAAC;QACD,gEAAgE;QAChE,IAAI,OAAO,CAAC,GAAG,IAAG,CAAC;KACpB;IACD,iBAAiB,EAAE,IAAI;IACvB,oBAAoB,EAAE,GAAG,EAAE,GAAE,CAAC;IAC9B,aAAa,EAAE,KAAK;CACrB,CAAC,CAAC;AAEH,eAAe,eAAe,CAAC","sourcesContent":["import { createContext } from 'react';\nimport type { MutableRefObject } from 'react';\n\nimport type { openCloseStates } from '../../hooks/useTransitionState';\n\nimport type { AppShellProps, UtilItemProps } from './AppShell.types';\n\nexport interface AppShellDrawerContextValue {\n  drawerOpen: boolean;\n  openDrawer: (item: UtilItemProps) => void;\n  closeDrawer: () => void;\n}\n\nexport const AppShellDrawerContext = createContext<AppShellDrawerContextValue>({\n  drawerOpen: false,\n  openDrawer: () => {},\n  closeDrawer: () => {}\n});\n\nexport interface AppShellContextValue {\n  navOpen: boolean;\n  drawerOpen: boolean;\n  setDrawerOpen: (val: boolean) => void;\n  navState: (typeof openCloseStates)[keyof typeof openCloseStates];\n  focusedImperatively: MutableRefObject<boolean>;\n  headerEl: HTMLDivElement | null;\n  previewTriggerRef: MutableRefObject<HTMLElement | null>;\n  searchContainerEl: HTMLElement | null;\n  setSearchContainerEl: (el: HTMLElement | null) => void;\n  collapsedHoverMenus?: AppShellProps['collapsedHoverMenus'];\n  mobileNavOpen: boolean;\n}\n\nconst AppShellContext = createContext<AppShellContextValue>({\n  navOpen: false,\n  drawerOpen: false,\n  setDrawerOpen: () => {},\n  navState: 'closed',\n  collapsedHoverMenus: false,\n  focusedImperatively: {\n    get current() {\n      return false;\n    }\n  },\n  headerEl: null,\n  previewTriggerRef: {\n    get current() {\n      return null;\n    },\n    // eslint-disable-next-line @typescript-eslint/no-empty-function\n    set current(val) {}\n  },\n  searchContainerEl: null,\n  setSearchContainerEl: () => {},\n  mobileNavOpen: false\n});\n\nexport default AppShellContext;\n"]}

package/lib/components/AppShell/AppShellList.d.ts

@@ -1,5 +1,5 @@
-import { FunctionComponent, Ref, MouseEvent, ReactNode, KeyboardEvent } from 'react';
-import { BaseProps, ForwardProps } from '../../types';
+import type { FunctionComponent, Ref, MouseEvent, ReactNode, KeyboardEvent } from 'react';
+import type { BaseProps, ForwardProps } from '../../types';
 export type ListInteractionEvent = MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>;
 export interface ListProps {
     /** An id representing the item. */

package/lib/components/AppShell/AppShellList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppShellList.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellList.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,GAAG,EACH,UAAU,EACV,SAAS,EACT,aAAa,EAGd,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAiCtD,MAAM,MAAM,oBAAoB,GAAG,UAAU,CAAC,WAAW,CAAC,GAAG,aAAa,CAAC,WAAW,CAAC,CAAC;AACxF,MAAM,WAAW,SAAS;IACxB,mCAAmC;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,KAAK,EAAE,CAAC,qBAAqB,GAAG,YAAY,CAAC,EAAE,CAAC;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE;QACR,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;QAClC,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,GAAG,YAAY,CAAC;IACjB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAChE,eAAe,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC;AACD,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,SAAS,EAAE,CAAC;CACvB;AACD,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,mCAAmC;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;IACrB,yCAAyC;IACzC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mDAAmD;IACnD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oCAAoC;IACpC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC5D,uEAAuE;IACvE,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAuID,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAQtD,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"AppShellList.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE1F,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAiC3D,MAAM,MAAM,oBAAoB,GAAG,UAAU,CAAC,WAAW,CAAC,GAAG,aAAa,CAAC,WAAW,CAAC,CAAC;AACxF,MAAM,WAAW,SAAS;IACxB,mCAAmC;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,KAAK,EAAE,CAAC,qBAAqB,GAAG,YAAY,CAAC,EAAE,CAAC;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE;QACR,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;QAClC,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,GAAG,YAAY,CAAC;IACjB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAChE,eAAe,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC;AACD,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,SAAS,EAAE,CAAC;CACvB;AACD,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,mCAAmC;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;IACrB,yCAAyC;IACzC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,mDAAmD;IACnD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oCAAoC;IACpC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC5D,uEAAuE;IACvE,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAuID,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAQtD,CAAC;AAEF,eAAe,YAAY,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"AppShellList.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellList.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAML,UAAU,EACV,MAAM,EACP,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,MAAM,iBAAiB,CAAC;AACpC,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,OAAO,MAAM,wBAAwB,CAAC;AAClD,OAAO,KAAK,YAAY,MAAM,8BAA8B,CAAC;AAC7D,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,UAAU,MAAM,eAAe,CAAC;AACvC,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EACL,yBAAyB,EACzB,kBAAkB,EAClB,yBAAyB,EACzB,sBAAsB,EACtB,yBAAyB,EACzB,2BAA2B,EAC3B,uBAAuB,EACvB,uBAAuB,EACvB,yBAAyB,EACzB,yBAAyB,EACzB,wBAAwB,EACzB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAE1D,YAAY,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;AA4CpC,MAAM,IAAI,GAAG,CAAC,EACZ,WAAW,EACX,SAAS,EACT,KAAK,EACL,OAAO,GAAG,KAAK,EACf,WAAW,GAAG,KAAK,EACnB,WAAW,EACX,eAAe,EACf,OAAO,EAAE,YAAY,EACX,EAAE,EAAE;IACd,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,qBAAqB,CAAC,CAAC;IAC1D,MAAM,UAAU,GAAG,MAAM,CAAoC,EAAE,CAAC,CAAC;IAEjE,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CACnC,KAAC,IAAI,IAAC,EAAE,EAAE,kBAAkB,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YAC5C,KAAK,CAAC,GAAG,CACR,CAAC,EACC,EAAE,EACF,OAAO,EACP,SAAS,EACT,MAAM,EACN,MAAM,EACN,IAAI,EACJ,OAAO,EACP,MAAM,EACN,WAAW,EACX,GAAG,SAAS,EACU,EAAE,EAAE;YAC1B,MAAM,kBAAkB,GAAG,CAAC,CAAuB,EAAE,EAAE;gBACrD,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;gBACjB,WAAW,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;gBAErB,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAc,CAAC,EAAE;oBACvD,WAAW,EAAE,CAAC;iBACf;YACH,CAAC,CAAC;YAEF,OAAO,CACL,KAAC,yBAAyB,cACxB,KAAC,WAAW,OACN,SAAS,EACb,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,EACzB,OAAO,EACL,KAAC,yBAAyB,IAAC,MAAM,EAAE,MAAM,YAAG,OAAO,GAA6B,EAElF,SAAS,EACP,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,CAClB,KAAC,2BAA2B,IAAC,MAAM,EAAE,MAAM,YACzC,KAAC,QAAQ,IAAC,EAAE,EAAE,sBAAsB,EAAE,KAAK,EAAE,SAAS,GAAI,GAC9B,CAC/B,CAAC,CAAC,CAAC,SAAS,EAEf,MAAM,EACJ,MAAM,IAAI,MAAM,CAAC,CAAC,CAAC,CACjB,MAAC,wBAAwB,IAAC,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,CAAC,CAAC,MAAM,aAC/D,MAAM,OAAE,KAAC,KAAK,IAAC,OAAO,EAAC,QAAQ,GAAG,IACV,CAC5B,CAAC,CAAC,CAAC,SAAS,EAEf,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,kBAAkB,EAC3B,SAAS,EAAE,CAAC,CAA6B,EAAE,EAAE;wBAC3C,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE;4BACtC,kBAAkB,CAAC,CAAC,CAAC,CAAC;yBACvB;oBACH,CAAC,EACD,OAAO,EACL,WAAW,CAAC,CAAC,CAAC,CACZ,KAAC,MAAM,IACL,GAAG,EAAE,EAAE,CAAC,EAAE;4BACR,IAAI,CAAC,EAAE;gCAAE,OAAO,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;;gCAClC,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC;wBACnC,CAAC,EACD,IAAI,QACJ,EAAE,EAAE,uBAAuB,EAC3B,WAAW,EAAC,KAAK,EACjB,OAAO,EAAE,GAAG,EAAE;4BACZ,WAAW,EAAE,CAAC,EAAE,CAAC,CAAC;4BAClB,eAAe,EAAE,CAAC,EAAE,CAAC,CAAC;wBACxB,CAAC,EACD,SAAS,EAAE,CAAC,CAA6B,EAAE,EAAE;4BAC3C,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;gCACrB,WAAW,EAAE,CAAC,EAAE,CAAC,CAAC;gCAClB,eAAe,EAAE,CAAC,EAAE,CAAC,CAAC;6BACvB;wBACH,CAAC,EACD,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,YAEX,KAAC,IAAI,IAAC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,GAAI,GACrC,CACV,CAAC,CAAC,CAAC,SAAS,EAEf,QAAQ,EAAE,CAAC,GACX,IAxD4B,EAAE,CAyDN,CAC7B,CAAC;QACJ,CAAC,CACF,GACI,CACR,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IACH,EAAE,EAAE,uBAAuB,EAC3B,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,EACtD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YAEjB,KAAC,UAAU,IAAC,OAAO,EAAE,SAAS,GAAI,GAC7B,CACR,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,IAAC,EAAE,EAAE,yBAAyB,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,aACpE,WAAW,IAAI,CACd,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,EAAC,EAAE,EAAE,yBAAyB,YAC7C,WAAW,GACP,CACR,EACA,OAAO,CAAC,CAAC,CAAC,CACT,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YAC7E,KAAC,QAAQ,IAAC,EAAE,EAAE,aAAa,EAAE,SAAS,EAAC,QAAQ,GAAG,GAC7C,CACR,CAAC,CAAC,CAAC,CACF,aAAa,CACd,EACA,CAAC,YAAY,EAAE,IAAI,IAAI,YAAY,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,OAAO,IAAI,CAC9E,KAAC,mBAAmB,OAAK,YAAY,EAAE,EAAE,EAAE,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,YAC1E,CAAC,CAAC,UAAU,CAAC,GACM,CACvB,IACI,CACR,CAAC;AACJ,CAAC,CAAC;AACF,MAAM,YAAY,GAAyC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC1E,OAAO,CACL,KAAC,IAAI,IAAC,EAAE,EAAE,yBAAyB,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,YACpE,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CACxB,eAAC,IAAI,OAAK,QAAQ,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,GAAI,CACzC,CAAC,GACG,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import {\n  FunctionComponent,\n  Ref,\n  MouseEvent,\n  ReactNode,\n  KeyboardEvent,\n  useContext,\n  useRef\n} 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 { StyledLoading } from './AppShell.styles';\nimport {\n  StyledAppShellListWrapper,\n  StyledAppShellList,\n  StyledAppShellSummaryList,\n  StyledAppShellMetaList,\n  StyledNotificationPrimary,\n  StyledNotificationSecondary,\n  StyledAppShellPinButton,\n  EmptyStateColorContrast,\n  StyledAppShellListSection,\n  StyledAppShellListHeading,\n  StyledNotificationVisual\n} from './AppShellList.styles';\nimport { StyledDrawerViewAll } from './Drawer.styles';\nimport { AppShellDrawerContext } from './AppShellContext';\n\nregisterIcon(pinIcon, pinSolidIcon);\n\nexport type ListInteractionEvent = MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>;\nexport interface 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  const { closeDrawer } = useContext(AppShellDrawerContext);\n  const pinButtons = useRef<Record<string, HTMLButtonElement>>({});\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            if (!pinButtons.current[id]?.contains(e.target as Node)) {\n              closeDrawer();\n            }\n          };\n\n          return (\n            <StyledAppShellSummaryList key={id}>\n              <SummaryItem\n                {...restProps}\n                as={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                onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n                  if (e.key === 'Enter' || e.key === ' ') {\n                    onSummaryItemClick(e);\n                  }\n                }}\n                actions={\n                  displayPins ? (\n                    <Button\n                      ref={el => {\n                        if (!el) delete pinButtons.current[id];\n                        else pinButtons.current[id] = el;\n                      }}\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            </StyledAppShellSummaryList>\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 { useContext, useRef } from 'react';\nimport type { FunctionComponent, Ref, MouseEvent, ReactNode, KeyboardEvent } from 'react';\n\nimport type { 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 { StyledLoading } from './AppShell.styles';\nimport {\n  StyledAppShellListWrapper,\n  StyledAppShellList,\n  StyledAppShellSummaryList,\n  StyledAppShellMetaList,\n  StyledNotificationPrimary,\n  StyledNotificationSecondary,\n  StyledAppShellPinButton,\n  EmptyStateColorContrast,\n  StyledAppShellListSection,\n  StyledAppShellListHeading,\n  StyledNotificationVisual\n} from './AppShellList.styles';\nimport { StyledDrawerViewAll } from './Drawer.styles';\nimport { AppShellDrawerContext } from './AppShellContext';\n\nregisterIcon(pinIcon, pinSolidIcon);\n\nexport type ListInteractionEvent = MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>;\nexport interface 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  const { closeDrawer } = useContext(AppShellDrawerContext);\n  const pinButtons = useRef<Record<string, HTMLButtonElement>>({});\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            if (!pinButtons.current[id]?.contains(e.target as Node)) {\n              closeDrawer();\n            }\n          };\n\n          return (\n            <StyledAppShellSummaryList key={id}>\n              <SummaryItem\n                {...restProps}\n                as={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                onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n                  if (e.key === 'Enter' || e.key === ' ') {\n                    onSummaryItemClick(e);\n                  }\n                }}\n                actions={\n                  displayPins ? (\n                    <Button\n                      ref={el => {\n                        if (!el) delete pinButtons.current[id];\n                        else pinButtons.current[id] = el;\n                      }}\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            </StyledAppShellSummaryList>\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/AppShellSearch.d.ts

@@ -1,5 +1,5 @@
-import { FC } from 'react';
-import { AppShellProps } from './AppShell.types';
+import type { FC } from 'react';
+import type { AppShellProps } from './AppShell.types';
 export interface AppShellSearchProps {
     collapsed: boolean;
     searchLabel: string;

package/lib/components/AppShell/AppShellSearch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppShellSearch.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellSearch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAsD,MAAM,OAAO,CAAC;AAO/E,OAAO,EAAE,aAAa,EAA2B,MAAM,kBAAkB,CAAC;AAS1E,MAAM,WAAW,mBAAmB;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;CAC3C;AAED,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAiElD,CAAC"}
+{"version":3,"file":"AppShellSearch.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellSearch.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAa,MAAM,OAAO,CAAC;AAO3C,OAAO,KAAK,EAAE,aAAa,EAA2B,MAAM,kBAAkB,CAAC;AAS/E,MAAM,WAAW,mBAAmB;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;CAC3C;AAED,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAiElD,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"AppShellSearch.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellSearch.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useEffect, useRef, useState, useContext, FormEvent } from 'react';\n\nimport { useBreakpoint, useI18n } from '../../hooks';\nimport Icon from '../Icon';\nimport SearchInput from '../SearchInput';\n\nimport NavigationListItemWrapper from './NavigationListItemWrapper';\nimport { AppShellProps, NavListItemWrapperProps } from './AppShell.types';\nimport {\n  StyledAppShellSearchButton,\n  StyledAppshellSearchContainer,\n  StyledAppShellSearchDecoration,\n  StyledSearch\n} from './AppShellSearch.styles';\nimport AppShellContext from './AppShellContext';\n\nexport interface AppShellSearchProps {\n  collapsed: boolean;\n  searchLabel: string;\n  searchInput: AppShellProps['searchInput'];\n}\n\nexport const AppShellSearch: FC<AppShellSearchProps> = ({\n  collapsed,\n  searchLabel,\n  searchInput\n}) => {\n  const btnElRef = useRef<HTMLButtonElement>(null);\n  const formElRef = useRef<HTMLFormElement>(null);\n  const searchRef = useRef<HTMLInputElement>();\n  const t = useI18n();\n  const [menuOpen, setMenuOpen] = useState(false);\n  const isMediumOrAbove = useBreakpoint('md');\n  const { navState, mobileNavOpen } = useContext(AppShellContext);\n\n  const onMenuToggle: NavListItemWrapperProps['onMenuToggle'] = state => {\n    setMenuOpen(state === 'open');\n  };\n\n  useEffect(() => {\n    const onTab = (e: KeyboardEvent) => {\n      if (menuOpen && e.key === 'Tab') {\n        e.preventDefault();\n        searchRef.current?.focus();\n      }\n    };\n    btnElRef.current?.addEventListener('keydown', onTab);\n    return () => {\n      btnElRef.current?.removeEventListener('keydown', onTab);\n    };\n  }, [searchRef, menuOpen]);\n\n  const searchFormProps = {\n    role: 'search',\n    'aria-label': searchLabel,\n    onSubmit: (e: FormEvent) => e.preventDefault()\n  };\n\n  return (\n    <StyledSearch collapsed={collapsed} isMediumOrAbove={isMediumOrAbove}>\n      {navState === 'closed' && !mobileNavOpen ? (\n        <NavigationListItemWrapper\n          childElementRef={formElRef}\n          label={t('search_placeholder_default')}\n          tooltipLabel={t('search_placeholder_default')}\n          onMenuToggle={onMenuToggle}\n          content={\n            <StyledAppshellSearchContainer>\n              <SearchInput {...searchInput} resultsPopover={false} ref={searchRef} />\n            </StyledAppshellSearchContainer>\n          }\n        >\n          <form {...searchFormProps} ref={formElRef}>\n            <StyledAppShellSearchButton ref={btnElRef}>\n              <StyledAppShellSearchDecoration>\n                <Icon name='search' />\n              </StyledAppShellSearchDecoration>\n            </StyledAppShellSearchButton>\n          </form>\n        </NavigationListItemWrapper>\n      ) : (\n        <form {...searchFormProps}>\n          <SearchInput {...searchInput} />\n        </form>\n      )}\n    </StyledSearch>\n  );\n};\n"]}
+{"version":3,"file":"AppShellSearch.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellSearch.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, useState, useContext } from 'react';\nimport type { FC, FormEvent } from 'react';\n\nimport { useBreakpoint, useI18n } from '../../hooks';\nimport Icon from '../Icon';\nimport SearchInput from '../SearchInput';\n\nimport NavigationListItemWrapper from './NavigationListItemWrapper';\nimport type { AppShellProps, NavListItemWrapperProps } from './AppShell.types';\nimport {\n  StyledAppShellSearchButton,\n  StyledAppshellSearchContainer,\n  StyledAppShellSearchDecoration,\n  StyledSearch\n} from './AppShellSearch.styles';\nimport AppShellContext from './AppShellContext';\n\nexport interface AppShellSearchProps {\n  collapsed: boolean;\n  searchLabel: string;\n  searchInput: AppShellProps['searchInput'];\n}\n\nexport const AppShellSearch: FC<AppShellSearchProps> = ({\n  collapsed,\n  searchLabel,\n  searchInput\n}) => {\n  const btnElRef = useRef<HTMLButtonElement>(null);\n  const formElRef = useRef<HTMLFormElement>(null);\n  const searchRef = useRef<HTMLInputElement>();\n  const t = useI18n();\n  const [menuOpen, setMenuOpen] = useState(false);\n  const isMediumOrAbove = useBreakpoint('md');\n  const { navState, mobileNavOpen } = useContext(AppShellContext);\n\n  const onMenuToggle: NavListItemWrapperProps['onMenuToggle'] = state => {\n    setMenuOpen(state === 'open');\n  };\n\n  useEffect(() => {\n    const onTab = (e: KeyboardEvent) => {\n      if (menuOpen && e.key === 'Tab') {\n        e.preventDefault();\n        searchRef.current?.focus();\n      }\n    };\n    btnElRef.current?.addEventListener('keydown', onTab);\n    return () => {\n      btnElRef.current?.removeEventListener('keydown', onTab);\n    };\n  }, [searchRef, menuOpen]);\n\n  const searchFormProps = {\n    role: 'search',\n    'aria-label': searchLabel,\n    onSubmit: (e: FormEvent) => e.preventDefault()\n  };\n\n  return (\n    <StyledSearch collapsed={collapsed} isMediumOrAbove={isMediumOrAbove}>\n      {navState === 'closed' && !mobileNavOpen ? (\n        <NavigationListItemWrapper\n          childElementRef={formElRef}\n          label={t('search_placeholder_default')}\n          tooltipLabel={t('search_placeholder_default')}\n          onMenuToggle={onMenuToggle}\n          content={\n            <StyledAppshellSearchContainer>\n              <SearchInput {...searchInput} resultsPopover={false} ref={searchRef} />\n            </StyledAppshellSearchContainer>\n          }\n        >\n          <form {...searchFormProps} ref={formElRef}>\n            <StyledAppShellSearchButton ref={btnElRef}>\n              <StyledAppShellSearchDecoration>\n                <Icon name='search' />\n              </StyledAppShellSearchDecoration>\n            </StyledAppShellSearchButton>\n          </form>\n        </NavigationListItemWrapper>\n      ) : (\n        <form {...searchFormProps}>\n          <SearchInput {...searchInput} />\n        </form>\n      )}\n    </StyledSearch>\n  );\n};\n"]}

package/lib/components/AppShell/ContextSwitcher.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { type ForwardProps } from '../../types';
-import { type ContextSwitcherProps } from './AppShell.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '../../types';
+import type { ContextSwitcherProps } from './AppShell.types';
 declare const ContextSwitcher: FunctionComponent<ContextSwitcherProps & ForwardProps>;
 export default ContextSwitcher;
 //# sourceMappingURL=ContextSwitcher.d.ts.map

package/lib/components/AppShell/ContextSwitcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContextSwitcher.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/ContextSwitcher.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAO1C,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AAGhD,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAI7D,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,CAuB3E,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"ContextSwitcher.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/ContextSwitcher.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAO/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAGhD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAI7D,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,CAuB3E,CAAC;AAEF,eAAe,eAAe,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"ContextSwitcher.js","sourceRoot":"","sources":["../../../src/components/AppShell/ContextSwitcher.tsx"],"names":[],"mappings":";AAEA,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,KAAK,WAAW,MAAM,gCAAgC,CAAC;AAC9D,OAAO,UAAU,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAGtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAG3D,YAAY,CAAC,WAAW,CAAC,CAAC;AAE1B,MAAM,eAAe,GAA2D,CAAC,EAC/E,QAAQ,EACR,cAAc,EACd,KAAK,EACL,GAAG,SAAS,EACb,EAAE,EAAE;IACH,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,qBAAqB,KAAM,SAAS,YAC9E,KAAC,UAAU,IACT,IAAI,EAAE,KAAK,IAAI,CAAC,CAAC,WAAW,CAAC,EAC7B,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,aAAa,EAClB,QAAQ,QACR,IAAI,EAAE;gBACJ,IAAI,EAAE,eAAe;gBACrB,KAAK,EAAE,QAAQ;gBACf,WAAW,EAAE,cAAc;aAC5B,GACD,GACG,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\n\nimport Flex from '../Flex';\nimport { registerIcon } from '../Icon';\nimport * as nineDotIcon from '../Icon/icons/dot-9-solid.icon';\nimport MenuButton from '../MenuButton';\nimport { useI18n } from '../../hooks';\nimport { type ForwardProps } from '../../types';\n\nimport { StyledContextSwitcher } from './AppHeader.styles';\nimport { type ContextSwitcherProps } from './AppShell.types';\n\nregisterIcon(nineDotIcon);\n\nconst ContextSwitcher: FunctionComponent<ContextSwitcherProps & ForwardProps> = ({\n  contexts,\n  onContextClick,\n  label,\n  ...restProps\n}) => {\n  const t = useI18n();\n\n  return (\n    <Flex container={{ justify: 'center' }} as={StyledContextSwitcher} {...restProps}>\n      <MenuButton\n        text={label ?? t('switch_to')}\n        variant='simple'\n        icon='dot-9-solid'\n        iconOnly\n        menu={{\n          mode: 'single-select',\n          items: contexts,\n          onItemClick: onContextClick\n        }}\n      />\n    </Flex>\n  );\n};\n\nexport default ContextSwitcher;\n"]}
+{"version":3,"file":"ContextSwitcher.js","sourceRoot":"","sources":["../../../src/components/AppShell/ContextSwitcher.tsx"],"names":[],"mappings":";AAEA,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,KAAK,WAAW,MAAM,gCAAgC,CAAC;AAC9D,OAAO,UAAU,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAGtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAG3D,YAAY,CAAC,WAAW,CAAC,CAAC;AAE1B,MAAM,eAAe,GAA2D,CAAC,EAC/E,QAAQ,EACR,cAAc,EACd,KAAK,EACL,GAAG,SAAS,EACb,EAAE,EAAE;IACH,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,qBAAqB,KAAM,SAAS,YAC9E,KAAC,UAAU,IACT,IAAI,EAAE,KAAK,IAAI,CAAC,CAAC,WAAW,CAAC,EAC7B,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,aAAa,EAClB,QAAQ,QACR,IAAI,EAAE;gBACJ,IAAI,EAAE,eAAe;gBACrB,KAAK,EAAE,QAAQ;gBACf,WAAW,EAAE,cAAc;aAC5B,GACD,GACG,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import type { FunctionComponent } from 'react';\n\nimport Flex from '../Flex';\nimport { registerIcon } from '../Icon';\nimport * as nineDotIcon from '../Icon/icons/dot-9-solid.icon';\nimport MenuButton from '../MenuButton';\nimport { useI18n } from '../../hooks';\nimport type { ForwardProps } from '../../types';\n\nimport { StyledContextSwitcher } from './AppHeader.styles';\nimport type { ContextSwitcherProps } from './AppShell.types';\n\nregisterIcon(nineDotIcon);\n\nconst ContextSwitcher: FunctionComponent<ContextSwitcherProps & ForwardProps> = ({\n  contexts,\n  onContextClick,\n  label,\n  ...restProps\n}) => {\n  const t = useI18n();\n\n  return (\n    <Flex container={{ justify: 'center' }} as={StyledContextSwitcher} {...restProps}>\n      <MenuButton\n        text={label ?? t('switch_to')}\n        variant='simple'\n        icon='dot-9-solid'\n        iconOnly\n        menu={{\n          mode: 'single-select',\n          items: contexts,\n          onItemClick: onContextClick\n        }}\n      />\n    </Flex>\n  );\n};\n\nexport default ContextSwitcher;\n"]}

package/lib/components/AppShell/Drawer.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 interface DrawerViewProps {
     content: ReactNode;
     header: string;

package/lib/components/AppShell/Drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,SAAS,EAAE,MAAM,OAAO,CAAC;AA+BtD,UAAU,eAAe;IACvB,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;sGASE,eAAe;AAPlB,wBAgGE"}
+{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AA+BvC,UAAU,eAAe;IACvB,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;sGASE,eAAe;AAPlB,wBAgGE"}

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';\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 {\n  useConsolidatedRef,\n  useDirection,\n  useElement,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useTheme,\n  useUID\n} from '../../hooks';\nimport Configuration from '../Configuration/Configuration';\n\nimport AppShellContext from './AppShellContext';\nimport {\n  StyledDrawerWrapper,\n  StyledDrawerBackButton,\n  StyledDrawerHeading,\n  StyledDrawerListContainer\n} from './Drawer.styles';\nimport { navContrastColors } from './style-utils';\n\nregisterIcon(arrowLeftIcon);\n\ninterface DrawerViewProps {\n  content: ReactNode;\n  header: string;\n  onDrawerOpen?: () => void;\n  onDrawerClose?: () => void;\n  drawerOpen: boolean;\n  setDrawerOpen: (open: boolean) => void;\n}\n\nexport default ({\n  content,\n  header,\n  onDrawerOpen,\n  onDrawerClose,\n  drawerOpen,\n  setDrawerOpen\n}: DrawerViewProps) => {\n  const t = useI18n();\n  const theme = useTheme();\n  const { focusedImperatively } = useContext(AppShellContext);\n  const { ltr, rtl } = useDirection();\n  const returnFocusRef = useRef<HTMLElement>();\n  const [drawerEl, setDrawerEl] = useElement<HTMLDivElement>();\n  const drawerRef = useConsolidatedRef(setDrawerEl);\n  const backButtonRef = useRef<HTMLButtonElement>(null);\n  const headerId = useUID();\n\n  useEscape(\n    () => {\n      setDrawerOpen(false);\n    },\n    drawerEl,\n    [drawerEl]\n  );\n\n  useFocusTrap(drawerRef);\n\n  const { foreground, interactive } = navContrastColors(theme);\n  const navTheme = {\n    base: {\n      palette: {\n        'primary-background': theme.components['app-shell'].nav['background-color'],\n        'foreground-color': foreground,\n        interactive\n      }\n    }\n  };\n\n  return (\n    <Configuration theme={navTheme} portalTarget={drawerEl ?? undefined}>\n      <Drawer\n        role='dialog'\n        aria-labelledby={headerId}\n        as={StyledDrawerWrapper}\n        position='fixed'\n        placement='left'\n        open={drawerOpen}\n        nullWhenClosed\n        onBeforeOpen={() => {\n          returnFocusRef.current = (document.activeElement as HTMLElement) ?? undefined;\n        }}\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          onDrawerClose?.();\n          returnFocusRef.current?.focus();\n        }}\n        onOuterClick={() => setDrawerOpen(false)}\n        ref={drawerRef}\n      >\n        <Flex as={StyledDrawerHeading} container={{ alignItems: 'center' }}>\n          {rtl && (\n            <Text variant='h2' id={headerId}>\n              {header}\n            </Text>\n          )}\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 && (\n            <Text variant='h2' id={headerId}>\n              {header}\n            </Text>\n          )}\n        </Flex>\n        <Flex\n          as={StyledDrawerListContainer}\n          container={{ direction: 'column' }}\n          aria-labelledby={headerId}\n        >\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 } from 'react';\nimport type { ReactNode } from 'react';\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 {\n  useConsolidatedRef,\n  useDirection,\n  useElement,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useTheme,\n  useUID\n} from '../../hooks';\nimport Configuration from '../Configuration/Configuration';\n\nimport AppShellContext from './AppShellContext';\nimport {\n  StyledDrawerWrapper,\n  StyledDrawerBackButton,\n  StyledDrawerHeading,\n  StyledDrawerListContainer\n} from './Drawer.styles';\nimport { navContrastColors } from './style-utils';\n\nregisterIcon(arrowLeftIcon);\n\ninterface DrawerViewProps {\n  content: ReactNode;\n  header: string;\n  onDrawerOpen?: () => void;\n  onDrawerClose?: () => void;\n  drawerOpen: boolean;\n  setDrawerOpen: (open: boolean) => void;\n}\n\nexport default ({\n  content,\n  header,\n  onDrawerOpen,\n  onDrawerClose,\n  drawerOpen,\n  setDrawerOpen\n}: DrawerViewProps) => {\n  const t = useI18n();\n  const theme = useTheme();\n  const { focusedImperatively } = useContext(AppShellContext);\n  const { ltr, rtl } = useDirection();\n  const returnFocusRef = useRef<HTMLElement>();\n  const [drawerEl, setDrawerEl] = useElement<HTMLDivElement>();\n  const drawerRef = useConsolidatedRef(setDrawerEl);\n  const backButtonRef = useRef<HTMLButtonElement>(null);\n  const headerId = useUID();\n\n  useEscape(\n    () => {\n      setDrawerOpen(false);\n    },\n    drawerEl,\n    [drawerEl]\n  );\n\n  useFocusTrap(drawerRef);\n\n  const { foreground, interactive } = navContrastColors(theme);\n  const navTheme = {\n    base: {\n      palette: {\n        'primary-background': theme.components['app-shell'].nav['background-color'],\n        'foreground-color': foreground,\n        interactive\n      }\n    }\n  };\n\n  return (\n    <Configuration theme={navTheme} portalTarget={drawerEl ?? undefined}>\n      <Drawer\n        role='dialog'\n        aria-labelledby={headerId}\n        as={StyledDrawerWrapper}\n        position='fixed'\n        placement='left'\n        open={drawerOpen}\n        nullWhenClosed\n        onBeforeOpen={() => {\n          returnFocusRef.current = (document.activeElement as HTMLElement) ?? undefined;\n        }}\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          onDrawerClose?.();\n          returnFocusRef.current?.focus();\n        }}\n        onOuterClick={() => setDrawerOpen(false)}\n        ref={drawerRef}\n      >\n        <Flex as={StyledDrawerHeading} container={{ alignItems: 'center' }}>\n          {rtl && (\n            <Text variant='h2' id={headerId}>\n              {header}\n            </Text>\n          )}\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 && (\n            <Text variant='h2' id={headerId}>\n              {header}\n            </Text>\n          )}\n        </Flex>\n        <Flex\n          as={StyledDrawerListContainer}\n          container={{ direction: 'column' }}\n          aria-labelledby={headerId}\n        >\n          {content}\n        </Flex>\n      </Drawer>\n    </Configuration>\n  );\n};\n"]}

package/lib/components/AppShell/Drawer.styles.d.ts

@@ -1,4 +1,4 @@
-import { DrawerProps } from '../Drawer';
+import type { DrawerProps } from '../Drawer';
 export declare const StyledDrawerWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, DrawerProps, never>;
 export declare const StyledDrawerHeading: import("styled-components").StyledComponent<"header", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledDrawerBackButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;

package/lib/components/AppShell/Drawer.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.styles.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAQxC,eAAO,MAAM,mBAAmB,kHAwB9B,CAAC;AAIH,eAAO,MAAM,mBAAmB,4GAsB9B,CAAC;AAIH,eAAO,MAAM,sBAAsB,4GAqBjC,CAAC;AAIH,eAAO,MAAM,gBAAgB;iBAA4B,OAAO;SAE9D,CAAC;AAIH,eAAO,MAAM,oBAAoB,wGAIhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,yGAK5B,CAAC;AAIH,eAAO,MAAM,uBAAuB,wGAWlC,CAAC;AAIH,eAAO,MAAM,mBAAmB,uGAiB9B,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAQlC,CAAC;AAIH,eAAO,MAAM,yBAAyB,yGAOpC,CAAC"}
+{"version":3,"file":"Drawer.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.styles.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAQ7C,eAAO,MAAM,mBAAmB,kHAwB9B,CAAC;AAIH,eAAO,MAAM,mBAAmB,4GAsB9B,CAAC;AAIH,eAAO,MAAM,sBAAsB,4GAqBjC,CAAC;AAIH,eAAO,MAAM,gBAAgB;iBAA4B,OAAO;SAE9D,CAAC;AAIH,eAAO,MAAM,oBAAoB,wGAIhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,yGAK5B,CAAC;AAIH,eAAO,MAAM,uBAAuB,wGAWlC,CAAC;AAIH,eAAO,MAAM,mBAAmB,uGAiB9B,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAQlC,CAAC;AAIH,eAAO,MAAM,yBAAyB,yGAOpC,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"Drawer.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { calculateFontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { DrawerProps } from '../Drawer';\nimport { StyledMetaListItem } from '../MetaList/MetaList';\nimport { StyledLabel } from '../Label';\nimport { StyledForm } from '../MultiStepForm/MultiStepForm';\n\nimport { navOpenWidth } from './AppShell.styles';\nimport { navContrastColors, pxToRem } from './style-utils';\n\nexport const StyledDrawerWrapper = styled.div<DrawerProps>(({ theme, open }) => {\n  const {\n    components: {\n      'app-shell': {\n        nav: { 'background-color': navBg }\n      }\n    }\n  } = theme;\n  const { foreground, border: borderColor } = navContrastColors(theme);\n\n  return css`\n    background: ${navBg};\n    width: ${navOpenWidth};\n    height: 100%;\n    color: ${foreground};\n    opacity: ${open ? 1 : 0};\n    border-inline-end: ${pxToRem(1)} solid ${borderColor};\n\n    ${StyledForm},\n    ${StyledLabel},\n    ${StyledMetaListItem} {\n      color: ${foreground};\n    }\n  `;\n});\n\nStyledDrawerWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerHeading = styled.header(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n  const { foreground } = navContrastColors(theme);\n\n  return css`\n    padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n    line-height: 1;\n\n    h2 {\n      font-size: ${fontSize.s};\n      font-weight: ${theme.base['font-weight']['semi-bold']};\n      margin: 0 auto;\n      position: relative;\n      left: -0.7rem;\n    }\n\n    svg {\n      font-size: ${fontSize.xxl};\n      cursor: pointer;\n      color: ${foreground};\n    }\n  `;\n});\n\nStyledDrawerHeading.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerBackButton = styled.button(({ theme }) => {\n  const { hoverBg, foreground } = navContrastColors(theme);\n\n  return css`\n    height: ${theme.base['hit-area']['mouse-min']};\n    width: ${theme.base['hit-area']['mouse-min']};\n    border-radius: calc(\n      ${`${theme.base['border-radius']} * ${theme.components.button['border-radius']}`}\n    );\n\n    &:hover,\n    &:focus {\n      color: ${foreground};\n      background-color: ${hoverBg};\n    }\n\n    &:focus {\n      outline: none;\n      box-shadow: ${theme.base.shadow['focus-inset']};\n    }\n  `;\n});\n\nStyledDrawerBackButton.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerList = styled.ul<{ displayPins: boolean }>(() => {\n  return css``;\n});\n\nStyledDrawerList.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerMetaList = styled.ul`\n  li {\n    color: inherit;\n  }\n`;\n\nexport const EmptyDrawerVisual = styled.div(({ theme }) => {\n  return css`\n    width: calc(4 * ${theme.base.spacing});\n    height: calc(4 * ${theme.base.spacing});\n  `;\n});\n\nEmptyDrawerVisual.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListHeading = styled.h3(({ theme }) => {\n  const { hoverBg, foreground } = navContrastColors(theme);\n\n  return css`\n    position: sticky;\n    top: 0;\n    padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n    background-color: ${hoverBg};\n    color: ${foreground};\n    z-index: 1;\n  `;\n});\n\nStyledDrawerListHeading.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerViewAll = styled.a(({ theme }) => {\n  const { foreground } = navContrastColors(theme);\n\n  return css`\n    position: sticky;\n    bottom: 0;\n    padding: ${theme.base.spacing} 0;\n    color: ${foreground};\n    background-color: ${theme.components['app-shell'].nav['background-color']};\n    text-align: center;\n    margin-top: 0.0625rem;\n\n    &:focus {\n      outline: none;\n      box-shadow: ${theme.base.shadow['focus-inset']};\n    }\n  `;\n});\n\nStyledDrawerViewAll.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListSection = styled.div(({ theme }) => {\n  const { border: borderColor } = navContrastColors(theme);\n\n  return css`\n    border-top: 0.0625rem solid ${borderColor};\n    min-height: max(20%, 8rem);\n    overflow-y: auto;\n  `;\n});\n\nStyledDrawerListSection.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListContainer = styled.div(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    height: calc(100% - 4 * ${theme.base.spacing} - ${fontSize.xxl});\n    overflow: auto;\n  `;\n});\n\nStyledDrawerListContainer.defaultProps = defaultThemeProp;\n"]}
+{"version":3,"file":"Drawer.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAE5D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAE3D,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAc,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;IAC7E,MAAM,EACJ,UAAU,EAAE,EACV,WAAW,EAAE,EACX,GAAG,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,EACnC,EACF,EACF,GAAG,KAAK,CAAC;IACV,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAErE,OAAO,GAAG,CAAA;kBACM,KAAK;aACV,YAAY;;aAEZ,UAAU;eACR,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;yBACF,OAAO,CAAC,CAAC,CAAC,UAAU,WAAW;;MAElD,UAAU;MACV,WAAW;MACX,kBAAkB;eACT,UAAU;;GAEtB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtF,MAAM,EAAE,UAAU,EAAE,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAEhD,OAAO,GAAG,CAAA;eACG,KAAK,CAAC,IAAI,CAAC,OAAO,aAAa,KAAK,CAAC,IAAI,CAAC,OAAO;;;;mBAI7C,QAAQ,CAAC,CAAC;qBACR,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,WAAW,CAAC;;;;;;;mBAOxC,QAAQ,CAAC,GAAG;;eAEhB,UAAU;;GAEtB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAChE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAEzD,OAAO,GAAG,CAAA;cACE,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;aACpC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;;QAExC,GAAG,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,eAAe,CAAC,EAAE;;;;;eAKvE,UAAU;0BACC,OAAO;;;;;oBAKb,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;;GAEjD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,EAAE,CAA2B,GAAG,EAAE;IACvE,OAAO,GAAG,CAAA,EAAE,CAAC;AACf,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,EAAE,CAAA;;;;CAI5C,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;sBACU,KAAK,CAAC,IAAI,CAAC,OAAO;uBACjB,KAAK,CAAC,IAAI,CAAC,OAAO;GACtC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAEzD,OAAO,GAAG,CAAA;;;eAGG,KAAK,CAAC,IAAI,CAAC,OAAO,aAAa,KAAK,CAAC,IAAI,CAAC,OAAO;wBACxC,OAAO;aAClB,UAAU;;GAEpB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,MAAM,EAAE,UAAU,EAAE,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAEhD,OAAO,GAAG,CAAA;;;eAGG,KAAK,CAAC,IAAI,CAAC,OAAO;aACpB,UAAU;wBACC,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAkB,CAAC;;;;;;oBAMzD,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;;GAEjD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9D,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAEzD,OAAO,GAAG,CAAA;kCACsB,WAAW;;;GAG1C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAChE,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IAEtF,OAAO,GAAG,CAAA;8BACkB,KAAK,CAAC,IAAI,CAAC,OAAO,MAAM,QAAQ,CAAC,GAAG;;GAE/D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,yBAAyB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { calculateFontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport type { DrawerProps } from '../Drawer';\nimport { StyledMetaListItem } from '../MetaList/MetaList';\nimport { StyledLabel } from '../Label';\nimport { StyledForm } from '../MultiStepForm/MultiStepForm';\n\nimport { navOpenWidth } from './AppShell.styles';\nimport { navContrastColors, pxToRem } from './style-utils';\n\nexport const StyledDrawerWrapper = styled.div<DrawerProps>(({ theme, open }) => {\n  const {\n    components: {\n      'app-shell': {\n        nav: { 'background-color': navBg }\n      }\n    }\n  } = theme;\n  const { foreground, border: borderColor } = navContrastColors(theme);\n\n  return css`\n    background: ${navBg};\n    width: ${navOpenWidth};\n    height: 100%;\n    color: ${foreground};\n    opacity: ${open ? 1 : 0};\n    border-inline-end: ${pxToRem(1)} solid ${borderColor};\n\n    ${StyledForm},\n    ${StyledLabel},\n    ${StyledMetaListItem} {\n      color: ${foreground};\n    }\n  `;\n});\n\nStyledDrawerWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerHeading = styled.header(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n  const { foreground } = navContrastColors(theme);\n\n  return css`\n    padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n    line-height: 1;\n\n    h2 {\n      font-size: ${fontSize.s};\n      font-weight: ${theme.base['font-weight']['semi-bold']};\n      margin: 0 auto;\n      position: relative;\n      left: -0.7rem;\n    }\n\n    svg {\n      font-size: ${fontSize.xxl};\n      cursor: pointer;\n      color: ${foreground};\n    }\n  `;\n});\n\nStyledDrawerHeading.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerBackButton = styled.button(({ theme }) => {\n  const { hoverBg, foreground } = navContrastColors(theme);\n\n  return css`\n    height: ${theme.base['hit-area']['mouse-min']};\n    width: ${theme.base['hit-area']['mouse-min']};\n    border-radius: calc(\n      ${`${theme.base['border-radius']} * ${theme.components.button['border-radius']}`}\n    );\n\n    &:hover,\n    &:focus {\n      color: ${foreground};\n      background-color: ${hoverBg};\n    }\n\n    &:focus {\n      outline: none;\n      box-shadow: ${theme.base.shadow['focus-inset']};\n    }\n  `;\n});\n\nStyledDrawerBackButton.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerList = styled.ul<{ displayPins: boolean }>(() => {\n  return css``;\n});\n\nStyledDrawerList.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerMetaList = styled.ul`\n  li {\n    color: inherit;\n  }\n`;\n\nexport const EmptyDrawerVisual = styled.div(({ theme }) => {\n  return css`\n    width: calc(4 * ${theme.base.spacing});\n    height: calc(4 * ${theme.base.spacing});\n  `;\n});\n\nEmptyDrawerVisual.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListHeading = styled.h3(({ theme }) => {\n  const { hoverBg, foreground } = navContrastColors(theme);\n\n  return css`\n    position: sticky;\n    top: 0;\n    padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n    background-color: ${hoverBg};\n    color: ${foreground};\n    z-index: 1;\n  `;\n});\n\nStyledDrawerListHeading.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerViewAll = styled.a(({ theme }) => {\n  const { foreground } = navContrastColors(theme);\n\n  return css`\n    position: sticky;\n    bottom: 0;\n    padding: ${theme.base.spacing} 0;\n    color: ${foreground};\n    background-color: ${theme.components['app-shell'].nav['background-color']};\n    text-align: center;\n    margin-top: 0.0625rem;\n\n    &:focus {\n      outline: none;\n      box-shadow: ${theme.base.shadow['focus-inset']};\n    }\n  `;\n});\n\nStyledDrawerViewAll.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListSection = styled.div(({ theme }) => {\n  const { border: borderColor } = navContrastColors(theme);\n\n  return css`\n    border-top: 0.0625rem solid ${borderColor};\n    min-height: max(20%, 8rem);\n    overflow-y: auto;\n  `;\n});\n\nStyledDrawerListSection.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListContainer = styled.div(({ theme }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    height: calc(100% - 4 * ${theme.base.spacing} - ${fontSize.xxl});\n    overflow: auto;\n  `;\n});\n\nStyledDrawerListContainer.defaultProps = defaultThemeProp;\n"]}

package/lib/components/AppShell/NavigationList.d.ts

@@ -1,5 +1,5 @@
-import { FC } from 'react';
-import { NavListItemProps, NavListProps } from './AppShell.types';
+import type { FC } from 'react';
+import type { NavListItemProps, NavListProps } from './AppShell.types';
 export declare const NavigationListItem: FC<NavListItemProps>;
 declare const NavigationList: FC<NavListProps>;
 export default NavigationList;

package/lib/components/AppShell/NavigationList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationList.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/NavigationList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,EAAE,EASH,MAAM,OAAO,CAAC;AA0Bf,OAAO,EACL,gBAAgB,EAEhB,YAAY,EAEb,MAAM,kBAAkB,CAAC;AA0F1B,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,gBAAgB,CA4InD,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,YAAY,CA4DpC,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"NavigationList.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/NavigationList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAe,EAAE,EAAiC,MAAM,OAAO,CAAC;AA0B5E,OAAO,KAAK,EACV,gBAAgB,EAEhB,YAAY,EAEb,MAAM,kBAAkB,CAAC;AA0F1B,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,gBAAgB,CA4InD,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,YAAY,CA4DpC,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/AppShell/NavigationList.js

@@ -36,7 +36,7 @@ const NavigationMenu = props => {
     }, menuRef);
     const { end } = useDirection();
     return (_createElement(StyledNavListItem, { ...restProps, key: primary, nestedListCollapsed: collapsed, ref: menuRef },
-        _jsxs(BareButton, { id: uid, ref: itemRef, "aria-expanded": !collapsed, "aria-controls": `${uid}-menu`, "aria-label": primary, onClick: toggleCollapsed, children: [visual && _jsx(StyledNavItemIconBox, { children: visual }), secondary ? (_jsxs(Flex, { container: { direction: 'column', alignItems: 'start' }, children: [_jsx("span", { children: primary }), _jsx(Text, { variant: 'secondary', children: secondary })] })) : (_jsx("span", { children: primary })), navState === 'open' && _jsx(Icon, { name: `caret-${end}`, as: StyledNavListItemExpandCollapse })] }),
+        _jsxs(BareButton, { id: uid, ref: itemRef, "aria-expanded": !collapsed, "aria-controls": `${uid}-menu`, "aria-label": primary, onClick: toggleCollapsed, children: [visual && _jsx(StyledNavItemIconBox, { children: visual }), secondary ? (_jsxs(Flex, { container: { direction: 'column', alignItems: 'start' }, children: [_jsx("span", { children: primary }), _jsx(Text, { variant: 'secondary', children: secondary })] })) : (_jsx("span", { children: primary })), navState === 'open' && _jsx(StyledNavListItemExpandCollapse, { name: `caret-${end}` })] }),
         _jsx(NavigationList, { id: `${uid}-menu`, nestedList: true, items: items, collapsed: !navOpen || collapsed })));
 };
 export const NavigationListItem = ({ visual, primary, secondary, href, onClick, items, collapseItems = false, onDismiss, actions, forwardedRef, isMenuItem, count, singleSelect, selected, 'aria-labelledby': ariaLabelledBy, 'aria-current': ariaCurrent, ...restProps }) => {
@@ -85,7 +85,7 @@ export const NavigationListItem = ({ visual, primary, secondary, href, onClick,
     const { end } = useDirection();
     const primaryId = useUID();
     return (_createElement(StyledNavListItem, { ...restProps, key: primary, singleSelect: singleSelect, nestedListCollapsed: true },
-        _jsx(NavigationListItemWrapper, { tooltipLabel: secondary ? `${primary} ${secondary}` : primary, label: primary, childElementRef: listItemRef, items: actions || items || caseItems, onMenuToggle: setMenuState, children: _jsxs(Component, { ...compProps, ref: listItemRef, ...(navOpen && isMenuItem ? { tabIndex: -1, role: 'menuitem' } : {}), "aria-labelledby": `${primaryId} ${count ? `${primary}-count` : ''} ${ariaLabelledBy}`, ...(hasItems && { 'aria-haspopup': 'menu', 'aria-expanded': menuState === 'open' }), "aria-current": ariaCurrent, children: [singleSelect && (_jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, as: StyledSingleSelectIconBox, children: selected && _jsx(Icon, { name: 'check' }) })), visual && _jsx(StyledNavItemIconBox, { children: visual }), secondary ? (_jsxs(Flex, { container: { direction: 'column', alignItems: 'start' }, item: { shrink: 0 }, as: 'span', children: [_jsx("span", { id: primaryId, children: primary }), _jsx(Text, { variant: 'secondary', children: secondary })] })) : (_jsx("span", { id: primaryId, children: primary })), (hasItems || actions) && navState === 'open' && (_jsx(Icon, { name: `caret-${end}`, as: StyledNavListItemExpandCollapse }))] }) }),
+        _jsx(NavigationListItemWrapper, { tooltipLabel: secondary ? `${primary} ${secondary}` : primary, label: primary, childElementRef: listItemRef, items: actions || items || caseItems, onMenuToggle: setMenuState, children: _jsxs(Component, { ...compProps, ref: listItemRef, ...(navOpen && isMenuItem ? { tabIndex: -1, role: 'menuitem' } : {}), "aria-labelledby": `${primaryId} ${count ? `${primary}-count` : ''} ${ariaLabelledBy}`, ...(hasItems && { 'aria-haspopup': 'menu', 'aria-expanded': menuState === 'open' }), "aria-current": ariaCurrent, children: [singleSelect && (_jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, as: StyledSingleSelectIconBox, children: selected && _jsx(Icon, { name: 'check' }) })), visual && _jsx(StyledNavItemIconBox, { children: visual }), secondary ? (_jsxs(Flex, { container: { direction: 'column', alignItems: 'start' }, item: { shrink: 0 }, as: 'span', children: [_jsx("span", { id: primaryId, children: primary }), _jsx(Text, { variant: 'secondary', children: secondary })] })) : (_jsx("span", { id: primaryId, children: primary })), (hasItems || actions) && navState === 'open' && (_jsx(StyledNavListItemExpandCollapse, { name: `caret-${end}` }))] }) }),
         onDismiss && navOpen && (_jsx(Button, { icon: true, variant: 'simple', as: StyledCaseClose, onClick: onDismiss, "aria-label": t('dismiss_case'), children: _jsx(Icon, { name: 'times' }) })),
         hasItems && (
         // eslint-disable-next-line @typescript-eslint/no-use-before-define