npm - @pega/cosmos-react-core - Versions diffs - 6.0.3 → 7.0.0-build.10.0 - Mend

@pega/cosmos-react-core 6.0.3 → 7.0.0-build.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (278) hide show

package/lib/components/AppShell/AppHeader.styles.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import { mix, readableColor, rgba } from 'polished';
+import { mix, rgba } from 'polished';
 import styled, { css } from 'styled-components';
-import { calculateFontSize, getHoverColors } from '../../styles';
+import { calculateFontSize, getHoverColors, readableColor } from '../../styles';
 import { defaultThemeProp } from '../../theme';
 import { tryCatch } from '../../utils';
 import { StyledImage } from '../Image';

package/lib/components/AppShell/AppHeader.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppHeader.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,~~aAAa,EAAE,~~IAAI,EAAE,MAAM,UAAU,CAAC;~~AACpD~~,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;~~AACjE~~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","sourcesContent":["import { mix, ~~readableColor,~~ rgba } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport { calculateFontSize, getHoverColors } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { StyledImage } from '../Image';\nimport { StyledMenuListContainer } from '../Menu/Menu.styles';\nimport { StyledPopover } from '../Popover';\nimport { StyledSearchInput } from '../SearchInput';\nimport { StyledSearchButton, StyledSearchTextInput } from '../SearchInput/SearchInput.styles';\nimport Text from '../Text';\nimport type { TextProps } from '../Text';\n\nimport { headerHeight, navWidth } from './AppShell.styles';\n\nexport const StyledContextSwitcher = styled.div(({ theme }) => {\n return css`\n width: calc(${navWidth} - 2 * ${theme.base.spacing});\n `;\n});\n\nStyledContextSwitcher.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderInfo = styled.div<{ centerLogo: boolean }>(({ centerLogo, theme }) => {\n return css`\n & > :first-child {\n vertical-align: top;\n }\n\n & > a,\n & > button {\n cursor: pointer;\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n }\n\n ${StyledImage} {\n height: 1.625rem;\n\n ${centerLogo &&\n css`\n padding-inline-start: ${theme.base.spacing};\n `}\n }\n `;\n});\n\nStyledAppHeaderInfo.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSearchForm = styled.form<{ isMediumOrAbove: boolean }>(\n ({ isMediumOrAbove, theme }) => {\n const headerColor = theme.components['app-shell'].header['background-color'];\n const contrastColor = tryCatch(() => readableColor(headerColor));\n\n return css`\n max-width: 33vw;\n min-width: 10rem;\n width: 100%;\n justify-self: center;\n margin-inline-start: 0;\n margin-inline-end: auto;\n transition: max-width ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n\n ${!isMediumOrAbove &&\n css`\n max-width: 75%;\n min-width: 2rem;\n margin-inline-start: auto;\n\n &:not([focused]) {\n ${StyledSearchInput} {\n ${StyledSearchButton} {\n background: ${headerColor};\n color: ${contrastColor};\n }\n\n ${StyledSearchTextInput} {\n background: ${headerColor};\n }\n }\n }\n\n &:focus-within {\n min-width: 10rem;\n }\n `}\n `;\n }\n);\n\nStyledAppHeaderSearchForm.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSpacer = styled.div`\n margin: auto;\n`;\n\nexport const StyledAppHeaderText = styled(Text)<{ variant: TextProps['variant'] }>(\n ({ theme, variant }) => {\n const contrastColor = tryCatch(() =>\n readableColor(theme.components['app-shell'].header['background-color'])\n );\n const secondaryColor = tryCatch(() =>\n rgba(\n contrastColor ?? theme.base.palette['foreground-color'],\n theme.base.transparency['transparent-2']\n )\n );\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n color: ${variant === 'secondary' ? secondaryColor : contrastColor};\n font-size: ${fontSize.s};\n\n ${variant !== 'secondary' &&\n css`\n font-weight: ${theme.base['font-weight']['semi-bold']};\n `}\n `;\n }\n);\n\nStyledAppHeaderText.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderOperator = styled.button(\n ({ theme }) => css`\n border-radius: 50%;\n\n :focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `\n);\n\nStyledAppHeaderOperator.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeader = styled.header<{ hideTitle: boolean; drawerOpen: boolean }>(\n ({ hideTitle, drawerOpen, theme }) => {\n const headerColor = theme.components['app-shell'].header['background-color'];\n const contrastColor = tryCatch(() => readableColor(headerColor));\n const hoverColors = getHoverColors(mix(0.01, theme.base.palette.interactive, headerColor));\n\n return css`\n position: sticky;\n z-index: calc(${theme.base['z-index'].backdrop} - 1);\n ${drawerOpen &&\n css`\n z-index: calc(${theme.base['z-index'].backdrop} - 2);\n `}\n top: 0;\n gap: ${theme.base.spacing};\n max-width: 100%;\n height: ${headerHeight};\n background-color: ${headerColor};\n border-bottom: solid 0.0625rem ${theme.base.palette['border-line']};\n\n ${StyledAppHeaderInfo} {\n justify-self: flex-start;\n min-width: 33vw;\n\n ${hideTitle &&\n css`\n min-width: fit-content;\n `}\n }\n\n > ${StyledAppHeaderOperator} {\n justify-self: flex-end;\n\n + ${StyledPopover} {\n &,\n ${StyledMenuListContainer} {\n background-color: ${headerColor};\n }\n\n ${StyledMenuListContainer} li {\n color: ${contrastColor};\n background-color: transparent;\n\n &:hover,\n &[data-current='true'] {\n color: ${hoverColors.foreground};\n background-color: ${hoverColors.background};\n }\n }\n }\n }\n `;\n }\n);\n\nStyledAppHeader.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"AppHeader.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mix, rgba } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport { calculateFontSize, getHoverColors, readableColor } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { StyledImage } from '../Image';\nimport { StyledMenuListContainer } from '../Menu/Menu.styles';\nimport { StyledPopover } from '../Popover';\nimport { StyledSearchInput } from '../SearchInput';\nimport { StyledSearchButton, StyledSearchTextInput } from '../SearchInput/SearchInput.styles';\nimport Text from '../Text';\nimport type { TextProps } from '../Text';\n\nimport { headerHeight, navWidth } from './AppShell.styles';\n\nexport const StyledContextSwitcher = styled.div(({ theme }) => {\n return css`\n width: calc(${navWidth} - 2 * ${theme.base.spacing});\n `;\n});\n\nStyledContextSwitcher.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderInfo = styled.div<{ centerLogo: boolean }>(({ centerLogo, theme }) => {\n return css`\n & > :first-child {\n vertical-align: top;\n }\n\n & > a,\n & > button {\n cursor: pointer;\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n }\n\n ${StyledImage} {\n height: 1.625rem;\n\n ${centerLogo &&\n css`\n padding-inline-start: ${theme.base.spacing};\n `}\n }\n `;\n});\n\nStyledAppHeaderInfo.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSearchForm = styled.form<{ isMediumOrAbove: boolean }>(\n ({ isMediumOrAbove, theme }) => {\n const headerColor = theme.components['app-shell'].header['background-color'];\n const contrastColor = tryCatch(() => readableColor(headerColor));\n\n return css`\n max-width: 33vw;\n min-width: 10rem;\n width: 100%;\n justify-self: center;\n margin-inline-start: 0;\n margin-inline-end: auto;\n transition: max-width ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n\n ${!isMediumOrAbove &&\n css`\n max-width: 75%;\n min-width: 2rem;\n margin-inline-start: auto;\n\n &:not([focused]) {\n ${StyledSearchInput} {\n ${StyledSearchButton} {\n background: ${headerColor};\n color: ${contrastColor};\n }\n\n ${StyledSearchTextInput} {\n background: ${headerColor};\n }\n }\n }\n\n &:focus-within {\n min-width: 10rem;\n }\n `}\n `;\n }\n);\n\nStyledAppHeaderSearchForm.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSpacer = styled.div`\n margin: auto;\n`;\n\nexport const StyledAppHeaderText = styled(Text)<{ variant: TextProps['variant'] }>(\n ({ theme, variant }) => {\n const contrastColor = tryCatch(() =>\n readableColor(theme.components['app-shell'].header['background-color'])\n );\n const secondaryColor = tryCatch(() =>\n rgba(\n contrastColor ?? theme.base.palette['foreground-color'],\n theme.base.transparency['transparent-2']\n )\n );\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n color: ${variant === 'secondary' ? secondaryColor : contrastColor};\n font-size: ${fontSize.s};\n\n ${variant !== 'secondary' &&\n css`\n font-weight: ${theme.base['font-weight']['semi-bold']};\n `}\n `;\n }\n);\n\nStyledAppHeaderText.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderOperator = styled.button(\n ({ theme }) => css`\n border-radius: 50%;\n\n :focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `\n);\n\nStyledAppHeaderOperator.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeader = styled.header<{ hideTitle: boolean; drawerOpen: boolean }>(\n ({ hideTitle, drawerOpen, theme }) => {\n const headerColor = theme.components['app-shell'].header['background-color'];\n const contrastColor = tryCatch(() => readableColor(headerColor));\n const hoverColors = getHoverColors(mix(0.01, theme.base.palette.interactive, headerColor));\n\n return css`\n position: sticky;\n z-index: calc(${theme.base['z-index'].backdrop} - 1);\n ${drawerOpen &&\n css`\n z-index: calc(${theme.base['z-index'].backdrop} - 2);\n `}\n top: 0;\n gap: ${theme.base.spacing};\n max-width: 100%;\n height: ${headerHeight};\n background-color: ${headerColor};\n border-bottom: solid 0.0625rem ${theme.base.palette['border-line']};\n\n ${StyledAppHeaderInfo} {\n justify-self: flex-start;\n min-width: 33vw;\n\n ${hideTitle &&\n css`\n min-width: fit-content;\n `}\n }\n\n > ${StyledAppHeaderOperator} {\n justify-self: flex-end;\n\n + ${StyledPopover} {\n &,\n ${StyledMenuListContainer} {\n background-color: ${headerColor};\n }\n\n ${StyledMenuListContainer} li {\n color: ${contrastColor};\n background-color: transparent;\n\n &:hover,\n &[data-current='true'] {\n color: ${hoverColors.foreground};\n background-color: ${hoverColors.background};\n }\n }\n }\n }\n `;\n }\n);\n\nStyledAppHeader.defaultProps = defaultThemeProp;\n"]}

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

@@ -1,5 +1,5 @@
 import styled, { css } from 'styled-components';
-import { darken, getContrast, lighten, readableColor, transparentize } from 'polished';
+import { darken, getContrast, lighten, transparentize } from 'polished';
 import { useContext } from 'react';
 import { Count } from '../Badges';
 import { StyledAvatar } from '../Avatar';
@@ -7,7 +7,7 @@ import { StyledIcon } from '../Icon';
 import { StyledImage } from '../Image/Image';
 import { defaultThemeProp } from '../../theme';
 import { tryCatch } from '../../utils';
-import { calculateFontSize } from '../../styles';
+import { calculateFontSize, readableColor } from '../../styles';
 import { StyledMenuItem } from '../Menu/Menu.styles';
 import { useDirection } from '../../hooks';
 import { StyledBareButton } from '../Button/BareButton';

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

	@@ -1 +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 { 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"]}
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, 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, readableColor } 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/style-utils.js CHANGED Viewed

@@ -1,5 +1,5 @@
-import { darken, getContrast, lighten, readableColor, transparentize } from 'polished';
-import { readableHue } from '../../styles';
+import { darken, getContrast, lighten, transparentize } from 'polished';
+import { readableColor, readableHue } from '../../styles';
 export const navContrastColors = (theme) => {
     const { base: { palette: { interactive } }, components: { 'app-shell': { nav: { 'background-color': navBg } } } } = theme;
     let hoverBg = darken(0.05, navBg);

package/lib/components/AppShell/style-utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"style-utils.js","sourceRoot":"","sources":["../../../src/components/AppShell/style-utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,~~aAAa,EAAE,~~cAAc,EAAE,MAAM,UAAU,CAAC;~~AAGvF~~,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;~~AAE3C~~,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,KAAmB,EAMnB,EAAE;IACF,MAAM,EACJ,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,WAAW,EAAE,EACzB,EACD,UAAU,EAAE,EACV,WAAW,EAAE,EACX,GAAG,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,EACnC,EACF,EACF,GAAG,KAAK,CAAC;IACV,IAAI,OAAO,GAAG,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAClC,IAAI,WAAW,CAAC,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,EAAE;QACrC,OAAO,GAAG,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;KAChC;IAED,MAAM,eAAe,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7C,MAAM,WAAW,GAAG,cAAc,CAAC,GAAG,EAAE,eAAe,CAAC,CAAC;IACzD,MAAM,gBAAgB,GAAG,WAAW,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;IAEzD,OAAO;QACL,OAAO;QACP,UAAU,EAAE,eAAe;QAC3B,MAAM,EAAE,WAAW;QACnB,WAAW,EAAE,gBAAgB;KAC9B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,CAAS,EAAU,EAAE,CAAC,GAAG,CAAC,GAAG,MAAM,KAAK,CAAC","sourcesContent":["import { darken, getContrast, lighten, ~~readableColor,~~ transparentize } from 'polished';\nimport type { DefaultTheme } from 'styled-components';\n\nimport { readableHue } from '../../styles';\n\nexport const navContrastColors = (\n theme: DefaultTheme\n): {\n hoverBg: string;\n foreground: string;\n border: string;\n interactive: string;\n} => {\n const {\n base: {\n palette: { interactive }\n },\n components: {\n 'app-shell': {\n nav: { 'background-color': navBg }\n }\n }\n } = theme;\n let hoverBg = darken(0.05, navBg);\n if (getContrast(navBg, hoverBg) === 1) {\n hoverBg = lighten(0.15, navBg);\n }\n\n const foregroundColor = readableColor(navBg);\n const borderColor = transparentize(0.8, foregroundColor);\n const interactiveColor = readableHue(interactive, navBg);\n\n return {\n hoverBg,\n foreground: foregroundColor,\n border: borderColor,\n interactive: interactiveColor\n };\n};\n\nexport const pxToRem = (n: number): string => `${n * 0.0625}rem`;\n"]}
1	+ {"version":3,"file":"style-utils.js","sourceRoot":"","sources":["../../../src/components/AppShell/style-utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAGxE,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE1D,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,KAAmB,EAMnB,EAAE;IACF,MAAM,EACJ,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,WAAW,EAAE,EACzB,EACD,UAAU,EAAE,EACV,WAAW,EAAE,EACX,GAAG,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,EACnC,EACF,EACF,GAAG,KAAK,CAAC;IACV,IAAI,OAAO,GAAG,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAClC,IAAI,WAAW,CAAC,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,EAAE;QACrC,OAAO,GAAG,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;KAChC;IAED,MAAM,eAAe,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7C,MAAM,WAAW,GAAG,cAAc,CAAC,GAAG,EAAE,eAAe,CAAC,CAAC;IACzD,MAAM,gBAAgB,GAAG,WAAW,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;IAEzD,OAAO;QACL,OAAO;QACP,UAAU,EAAE,eAAe;QAC3B,MAAM,EAAE,WAAW;QACnB,WAAW,EAAE,gBAAgB;KAC9B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,CAAS,EAAU,EAAE,CAAC,GAAG,CAAC,GAAG,MAAM,KAAK,CAAC","sourcesContent":["import { darken, getContrast, lighten, transparentize } from 'polished';\nimport type { DefaultTheme } from 'styled-components';\n\nimport { readableColor, readableHue } from '../../styles';\n\nexport const navContrastColors = (\n theme: DefaultTheme\n): {\n hoverBg: string;\n foreground: string;\n border: string;\n interactive: string;\n} => {\n const {\n base: {\n palette: { interactive }\n },\n components: {\n 'app-shell': {\n nav: { 'background-color': navBg }\n }\n }\n } = theme;\n let hoverBg = darken(0.05, navBg);\n if (getContrast(navBg, hoverBg) === 1) {\n hoverBg = lighten(0.15, navBg);\n }\n\n const foregroundColor = readableColor(navBg);\n const borderColor = transparentize(0.8, foregroundColor);\n const interactiveColor = readableHue(interactive, navBg);\n\n return {\n hoverBg,\n foreground: foregroundColor,\n border: borderColor,\n interactive: interactiveColor\n };\n};\n\nexport const pxToRem = (n: number): string => `${n * 0.0625}rem`;\n"]}

package/lib/components/Avatar/Avatar.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAAmB,cAAc,EAAE,MAAM,OAAO,CAAC;AAKrF,OAAO,KAAK,EACV,SAAS,EACT,YAAY,EACZ,iBAAiB,EACjB,cAAc,EAEd,UAAU,EACX,MAAM,aAAa,CAAC;~~AASrB~~,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IACxE,sDAAsD;IACtD,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oFAAoF;IACpF,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC9B;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;IAC9B,yDAAyD;IACzD,MAAM,CAAC,EAAE,QAAQ,CAAC;IAClB,kEAAkE;IAClE,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,cAAc,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC/D,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,GAAG,gBAAgB,CAAC,CAAC;CAC9C;AAED,KAAK,uBAAuB,GAAG,iBAAiB,CAAC,WAAW,EAAE,OAAO,GAAG,MAAM,CAAC,CAAC;AAgBhF,eAAO,MAAM,iBAAiB,mKAQ7B,CAAC;AAEF,eAAO,MAAM,YAAY;;;SA4ExB,CAAC;AAIF,eAAO,MAAM,YAAY;;0FA4BxB,CAAC;;;;AAqFF,wBAAqD"}
1	+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAAmB,cAAc,EAAE,MAAM,OAAO,CAAC;AAKrF,OAAO,KAAK,EACV,SAAS,EACT,YAAY,EACZ,iBAAiB,EACjB,cAAc,EAEd,UAAU,EACX,MAAM,aAAa,CAAC;AAUrB,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IACxE,sDAAsD;IACtD,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oFAAoF;IACpF,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC9B;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;IAC9B,yDAAyD;IACzD,MAAM,CAAC,EAAE,QAAQ,CAAC;IAClB,kEAAkE;IAClE,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,cAAc,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC/D,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,GAAG,gBAAgB,CAAC,CAAC;CAC9C;AAED,KAAK,uBAAuB,GAAG,iBAAiB,CAAC,WAAW,EAAE,OAAO,GAAG,MAAM,CAAC,CAAC;AAgBhF,eAAO,MAAM,iBAAiB,mKAQ7B,CAAC;AAEF,eAAO,MAAM,YAAY;;;SA4ExB,CAAC;AAIF,eAAO,MAAM,YAAY;;0FA4BxB,CAAC;;;;AAqFF,wBAAqD"}

package/lib/components/Avatar/Avatar.js CHANGED Viewed

@@ -1,13 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useState, useEffect, useMemo } from 'react';
 import styled, { css } from 'styled-components';
-import { readableColor, rgba } from 'polished';
+import { rgba } from 'polished';
 import Image from '../Image';
 import { defaultThemeProp } from '../../theme';
 import Icon, { StyledIcon } from '../Icon';
 import { Alert } from '../Badges';
 import { useI18n, useTestIds } from '../../hooks';
 import { tryCatch, withTestIds } from '../../utils';
+import { readableColor } from '../../styles';
 import { getAvatarTestIds } from './Avatar.test-ids';
 const sizeToRem = {
     s: 1,

package/lib/components/Avatar/Avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect, useMemo } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef, SyntheticEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor, rgba } from 'polished';\n\nimport Image from '../Image';\nimport type {\n BaseProps,\n ForwardProps,\n PropsWithDefaults,\n NoChildrenProp,\n OmitStrict,\n TestIdProp\n} from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Icon, { StyledIcon } from '../Icon';\nimport { Alert } from '../Badges';\nimport { useI18n, useTestIds } from '../../hooks';\nimport { tryCatch, withTestIds } from '../../utils';\n\nimport { getAvatarTestIds } from './Avatar.test-ids';\n\nexport interface AvatarProps extends BaseProps, NoChildrenProp, TestIdProp {\n /** The name of the identity the Avatar represents. /\n name: string;\n /* Content of the Avatar as an image source url. /\n imageSrc?: string;\n /* An icon to render as the content of the avatar. imageSrc will take precedence if passed. /\n icon?: string;\n /* Optional color for the icon to be rendered /\n color?: string;\n /* Optional background color for the avatar. Will be auto computed if not passed /\n backgroundColor?: string;\n /\n Shape of the Avatar.\n * @default 'circle'\n /\n shape?: 'circle' \| 'squircle';\n /\n Avatar size.\n * @default 'm'\n /\n size?: 's' \| 'm' \| 'l' \| 'xl';\n /* If defined, will render status icon on the avatar. /\n status?: 'active';\n /* Optional error handler in the event an image fails to load. /\n onImageError?: (err: SyntheticEvent<HTMLImageElement>) => void;\n /* Ref for the wrapping element. /\n ref?: Ref<HTMLDivElement \| HTMLImageElement>;\n}\n\ntype AvatarPropsWithDefaults = PropsWithDefaults<AvatarProps, 'shape' \| 'size'>;\n\nconst sizeToRem = {\n s: 1,\n m: 2,\n l: 2.5,\n xl: 4\n};\n\nconst fontSizeToRem = {\n s: 0.5625,\n m: 0.8125,\n l: 1,\n xl: 1.5\n};\n\nexport const StyledAvatarImage = styled(Image)`\n min-height: 100%;\n min-width: 100%;\n aspect-ratio: 1 / 1;\n object-fit: cover;\n border-radius: inherit;\n height: fit-content;\n width: fit-content;\n`;\n\nexport const StyledAvatar = styled.div<\n OmitStrict<AvatarPropsWithDefaults, 'name' \| 'children'> & {\n hasSrc?: boolean;\n hasBrokenImage?: boolean;\n }\n>(\n ({\n hasBrokenImage,\n hasSrc,\n size,\n shape,\n color,\n backgroundColor,\n theme: {\n base: {\n palette: { 'foreground-color': foregroundColor, 'primary-background': primaryBackground },\n 'border-radius': baseBorderRadius\n },\n components: {\n avatar: { 'background-color': avatarBackground },\n icon: { 'border-radius-multiplier': borderRadiusMultiplier }\n }\n }\n }) => {\n const sizeRem = sizeToRem[size];\n const fontSize = fontSizeToRem[size];\n let bgColor =\n hasSrc && !hasBrokenImage ? primaryBackground : backgroundColor \|\| avatarBackground;\n if (color && !backgroundColor && !(hasSrc && !hasBrokenImage))\n bgColor = tryCatch(\n () => readableColor(color),\n () => avatarBackground\n );\n const shadowColor = tryCatch(() => rgba(foregroundColor, 0.1));\n const iconColor = color \|\| tryCatch(() => readableColor(bgColor));\n\n return css`\n position: relative;\n flex-shrink: 0;\n background-color: ${bgColor};\n color: ${iconColor};\n width: ${sizeRem}rem;\n height: ${sizeRem}rem;\n min-width: ${sizeRem}rem;\n min-height: ${sizeRem}rem;\n font-size: ${fontSize}rem;\n text-transform: uppercase;\n line-height: ${sizeRem}rem;\n text-align: center;\n vertical-align: top;\n display: inline-block;\n border-radius: 100%;\n user-select: none;\n -webkit-user-select: none;\n\n ${shape === 'squircle' &&\n css`\n border-radius: calc(${borderRadiusMultiplier} ${baseBorderRadius});\n `}\n\n ${StyledIcon} {\n width: 50%;\n height: 100%;\n vertical-align: initial;\n }\n\n ::after {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n pointer-events: none;\n box-shadow: inset 0 0 0 0.0625rem ${shadowColor};\n }\n `;\n }\n);\n\nStyledAvatar.defaultProps = defaultThemeProp;\n\nexport const StyledStatus = styled(Alert)<Pick<AvatarPropsWithDefaults, 'size'>>(\n ({ size, theme }) => {\n /** Scales alert badge dimensions based on size of avatar /\n const sizeDimensions = (0.625 sizeToRem[size]) / sizeToRem.m;\n\n return css`\n position: absolute;\n height: ${sizeDimensions}rem;\n width: ${sizeDimensions}rem;\n inset-block-end: 0;\n inset-inline-end: 0;\n z-index: 1;\n animation: pop calc(${theme.base.animation.speed} * 2) cubic-bezier(1, 1.65, 0.3, 1.24);\n\n @keyframes pop {\n 0% {\n opacity: 0;\n transform: scale(0);\n }\n 50% {\n opacity: 1;\n }\n 100% {\n transform: scale(1);\n }\n }\n `;\n }\n);\n\nStyledStatus.defaultProps = defaultThemeProp;\n\n/*\n Helper function to construct a two or one letter initial from the title prop.\n * This text will be displayed if no valid image source is provided.\n * @param name\n * @param size\n /\nconst getInitials = (name: AvatarProps['name'], size: AvatarProps['size']) => {\n const words = name.split(' ');\n const firstInitial = words[0][0];\n\n return words.length === 1 \|\| size === 's' ? firstInitial : `${firstInitial}${words[1][0]}`;\n};\n\n/\n Generally, avatars are used to distinguish between different operators and\n * objects when they are shown in a list or in a small space. Users of applications\n * can upload a custom avatar of their choice.\n */\nconst Avatar: FunctionComponent<AvatarProps & ForwardProps> = forwardRef(function Avatar(\n props: PropsWithoutRef<AvatarProps>,\n ref: Ref<HTMLDivElement \| HTMLImageElement>\n) {\n const {\n testId,\n shape = 'circle',\n size = 'm',\n imageSrc,\n icon,\n name,\n status,\n onImageError,\n ...restProps\n } = props;\n const [hasBrokenImage, setHasBrokenImage] = useState<undefined \| boolean>();\n const t = useI18n();\n const testIds = useTestIds(testId, getAvatarTestIds);\n\n useEffect(() => {\n setHasBrokenImage(undefined);\n }, [imageSrc]);\n\n const content = useMemo(() => {\n if (icon) {\n return <Icon name={icon} />;\n }\n if (imageSrc && !hasBrokenImage) {\n return (\n <StyledAvatarImage\n src={imageSrc}\n alt={name}\n onError={(e: SyntheticEvent<HTMLImageElement>) => {\n setHasBrokenImage(true);\n onImageError?.(e);\n }}\n onLoad={() => {\n setHasBrokenImage(false);\n }}\n />\n );\n }\n return getInitials(name, size);\n }, [imageSrc, name, size, icon, hasBrokenImage, onImageError]);\n\n return (\n <StyledAvatar\n data-testid={testIds.root}\n role='img'\n hasSrc={!!imageSrc}\n hasBrokenImage={hasBrokenImage}\n shape={shape}\n size={size}\n ref={ref}\n aria-label={`${name}${status ? ` ${t('status')} ${status}` : ''}`}\n {...restProps}\n >\n {content}\n {status === 'active' && <StyledStatus size={size} variant='success' />}\n </StyledAvatar>\n );\n});\n\nexport default withTestIds(Avatar, getAvatarTestIds);\n"]}
1	+ {"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEjE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,OAAO,KAAK,MAAM,UAAU,CAAC;AAS7B,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,EAAE,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAClC,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAiCrD,MAAM,SAAS,GAAG;IAChB,CAAC,EAAE,CAAC;IACJ,CAAC,EAAE,CAAC;IACJ,CAAC,EAAE,GAAG;IACN,EAAE,EAAE,CAAC;CACN,CAAC;AAEF,MAAM,aAAa,GAAG;IACpB,CAAC,EAAE,MAAM;IACT,CAAC,EAAE,MAAM;IACT,CAAC,EAAE,CAAC;IACJ,EAAE,EAAE,GAAG;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;;;;;;;;CAQ7C,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAMpC,CAAC,EACC,cAAc,EACd,MAAM,EACN,IAAI,EACJ,KAAK,EACL,KAAK,EACL,eAAe,EACf,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,kBAAkB,EAAE,eAAe,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,EACzF,eAAe,EAAE,gBAAgB,EAClC,EACD,UAAU,EAAE,EACV,MAAM,EAAE,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,EAChD,IAAI,EAAE,EAAE,0BAA0B,EAAE,sBAAsB,EAAE,EAC7D,EACF,EACF,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC;IAChC,MAAM,QAAQ,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IACrC,IAAI,OAAO,GACT,MAAM,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,eAAe,IAAI,gBAAgB,CAAC;IACtF,IAAI,KAAK,IAAI,CAAC,eAAe,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,cAAc,CAAC;QAC3D,OAAO,GAAG,QAAQ,CAChB,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,EAC1B,GAAG,EAAE,CAAC,gBAAgB,CACvB,CAAC;IACJ,MAAM,WAAW,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,GAAG,CAAC,CAAC,CAAC;IAC/D,MAAM,SAAS,GAAG,KAAK,IAAI,QAAQ,CAAC,GAAG,EAAE,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;IAElE,OAAO,GAAG,CAAA;;;0BAGY,OAAO;eAClB,SAAS;eACT,OAAO;gBACN,OAAO;mBACJ,OAAO;oBACN,OAAO;mBACR,QAAQ;;qBAEN,OAAO;;;;;;;;QAQpB,KAAK,KAAK,UAAU;QACtB,GAAG,CAAA;8BACqB,sBAAsB,MAAM,gBAAgB;OACnE;;QAEC,UAAU;;;;;;;;;;;;4CAY0B,WAAW;;KAElD,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,CACvC,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE;IAClB,4DAA4D;IAC5D,MAAM,cAAc,GAAG,CAAC,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC;IAE/D,OAAO,GAAG,CAAA;;gBAEE,cAAc;eACf,cAAc;;;;4BAID,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;;;;;;;;;;;;;;KAcjD,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C;;;;;GAKG;AACH,MAAM,WAAW,GAAG,CAAC,IAAyB,EAAE,IAAyB,EAAE,EAAE;IAC3E,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC9B,MAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAEjC,OAAO,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;AAC7F,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,MAAM,GAAkD,UAAU,CAAC,SAAS,MAAM,CACtF,KAAmC,EACnC,GAA2C;IAE3C,MAAM,EACJ,MAAM,EACN,KAAK,GAAG,QAAQ,EAChB,IAAI,GAAG,GAAG,EACV,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,YAAY,EACZ,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,EAAuB,CAAC;IAC5E,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAErD,SAAS,CAAC,GAAG,EAAE;QACb,iBAAiB,CAAC,SAAS,CAAC,CAAC;IAC/B,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,IAAI,IAAI,EAAE;YACR,OAAO,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,GAAI,CAAC;SAC7B;QACD,IAAI,QAAQ,IAAI,CAAC,cAAc,EAAE;YAC/B,OAAO,CACL,KAAC,iBAAiB,IAChB,GAAG,EAAE,QAAQ,EACb,GAAG,EAAE,IAAI,EACT,OAAO,EAAE,CAAC,CAAmC,EAAE,EAAE;oBAC/C,iBAAiB,CAAC,IAAI,CAAC,CAAC;oBACxB,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;gBACpB,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;oBACX,iBAAiB,CAAC,KAAK,CAAC,CAAC;gBAC3B,CAAC,GACD,CACH,CAAC;SACH;QACD,OAAO,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IACjC,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC,CAAC;IAE/D,OAAO,CACL,MAAC,YAAY,mBACE,OAAO,CAAC,IAAI,EACzB,IAAI,EAAC,KAAK,EACV,MAAM,EAAE,CAAC,CAAC,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,gBACI,GAAG,IAAI,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,KAC7D,SAAS,aAEZ,OAAO,EACP,MAAM,KAAK,QAAQ,IAAI,KAAC,YAAY,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAC,SAAS,GAAG,IACzD,CAChB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC","sourcesContent":["import { forwardRef, useState, useEffect, useMemo } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef, SyntheticEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\n\nimport Image from '../Image';\nimport type {\n BaseProps,\n ForwardProps,\n PropsWithDefaults,\n NoChildrenProp,\n OmitStrict,\n TestIdProp\n} from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Icon, { StyledIcon } from '../Icon';\nimport { Alert } from '../Badges';\nimport { useI18n, useTestIds } from '../../hooks';\nimport { tryCatch, withTestIds } from '../../utils';\nimport { readableColor } from '../../styles';\n\nimport { getAvatarTestIds } from './Avatar.test-ids';\n\nexport interface AvatarProps extends BaseProps, NoChildrenProp, TestIdProp {\n /** The name of the identity the Avatar represents. /\n name: string;\n /* Content of the Avatar as an image source url. /\n imageSrc?: string;\n /* An icon to render as the content of the avatar. imageSrc will take precedence if passed. /\n icon?: string;\n /* Optional color for the icon to be rendered /\n color?: string;\n /* Optional background color for the avatar. Will be auto computed if not passed /\n backgroundColor?: string;\n /\n Shape of the Avatar.\n * @default 'circle'\n /\n shape?: 'circle' \| 'squircle';\n /\n Avatar size.\n * @default 'm'\n /\n size?: 's' \| 'm' \| 'l' \| 'xl';\n /* If defined, will render status icon on the avatar. /\n status?: 'active';\n /* Optional error handler in the event an image fails to load. /\n onImageError?: (err: SyntheticEvent<HTMLImageElement>) => void;\n /* Ref for the wrapping element. /\n ref?: Ref<HTMLDivElement \| HTMLImageElement>;\n}\n\ntype AvatarPropsWithDefaults = PropsWithDefaults<AvatarProps, 'shape' \| 'size'>;\n\nconst sizeToRem = {\n s: 1,\n m: 2,\n l: 2.5,\n xl: 4\n};\n\nconst fontSizeToRem = {\n s: 0.5625,\n m: 0.8125,\n l: 1,\n xl: 1.5\n};\n\nexport const StyledAvatarImage = styled(Image)`\n min-height: 100%;\n min-width: 100%;\n aspect-ratio: 1 / 1;\n object-fit: cover;\n border-radius: inherit;\n height: fit-content;\n width: fit-content;\n`;\n\nexport const StyledAvatar = styled.div<\n OmitStrict<AvatarPropsWithDefaults, 'name' \| 'children'> & {\n hasSrc?: boolean;\n hasBrokenImage?: boolean;\n }\n>(\n ({\n hasBrokenImage,\n hasSrc,\n size,\n shape,\n color,\n backgroundColor,\n theme: {\n base: {\n palette: { 'foreground-color': foregroundColor, 'primary-background': primaryBackground },\n 'border-radius': baseBorderRadius\n },\n components: {\n avatar: { 'background-color': avatarBackground },\n icon: { 'border-radius-multiplier': borderRadiusMultiplier }\n }\n }\n }) => {\n const sizeRem = sizeToRem[size];\n const fontSize = fontSizeToRem[size];\n let bgColor =\n hasSrc && !hasBrokenImage ? primaryBackground : backgroundColor \|\| avatarBackground;\n if (color && !backgroundColor && !(hasSrc && !hasBrokenImage))\n bgColor = tryCatch(\n () => readableColor(color),\n () => avatarBackground\n );\n const shadowColor = tryCatch(() => rgba(foregroundColor, 0.1));\n const iconColor = color \|\| tryCatch(() => readableColor(bgColor));\n\n return css`\n position: relative;\n flex-shrink: 0;\n background-color: ${bgColor};\n color: ${iconColor};\n width: ${sizeRem}rem;\n height: ${sizeRem}rem;\n min-width: ${sizeRem}rem;\n min-height: ${sizeRem}rem;\n font-size: ${fontSize}rem;\n text-transform: uppercase;\n line-height: ${sizeRem}rem;\n text-align: center;\n vertical-align: top;\n display: inline-block;\n border-radius: 100%;\n user-select: none;\n -webkit-user-select: none;\n\n ${shape === 'squircle' &&\n css`\n border-radius: calc(${borderRadiusMultiplier} ${baseBorderRadius});\n `}\n\n ${StyledIcon} {\n width: 50%;\n height: 100%;\n vertical-align: initial;\n }\n\n ::after {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n pointer-events: none;\n box-shadow: inset 0 0 0 0.0625rem ${shadowColor};\n }\n `;\n }\n);\n\nStyledAvatar.defaultProps = defaultThemeProp;\n\nexport const StyledStatus = styled(Alert)<Pick<AvatarPropsWithDefaults, 'size'>>(\n ({ size, theme }) => {\n /** Scales alert badge dimensions based on size of avatar /\n const sizeDimensions = (0.625 sizeToRem[size]) / sizeToRem.m;\n\n return css`\n position: absolute;\n height: ${sizeDimensions}rem;\n width: ${sizeDimensions}rem;\n inset-block-end: 0;\n inset-inline-end: 0;\n z-index: 1;\n animation: pop calc(${theme.base.animation.speed} * 2) cubic-bezier(1, 1.65, 0.3, 1.24);\n\n @keyframes pop {\n 0% {\n opacity: 0;\n transform: scale(0);\n }\n 50% {\n opacity: 1;\n }\n 100% {\n transform: scale(1);\n }\n }\n `;\n }\n);\n\nStyledStatus.defaultProps = defaultThemeProp;\n\n/*\n Helper function to construct a two or one letter initial from the title prop.\n * This text will be displayed if no valid image source is provided.\n * @param name\n * @param size\n /\nconst getInitials = (name: AvatarProps['name'], size: AvatarProps['size']) => {\n const words = name.split(' ');\n const firstInitial = words[0][0];\n\n return words.length === 1 \|\| size === 's' ? firstInitial : `${firstInitial}${words[1][0]}`;\n};\n\n/\n Generally, avatars are used to distinguish between different operators and\n * objects when they are shown in a list or in a small space. Users of applications\n * can upload a custom avatar of their choice.\n */\nconst Avatar: FunctionComponent<AvatarProps & ForwardProps> = forwardRef(function Avatar(\n props: PropsWithoutRef<AvatarProps>,\n ref: Ref<HTMLDivElement \| HTMLImageElement>\n) {\n const {\n testId,\n shape = 'circle',\n size = 'm',\n imageSrc,\n icon,\n name,\n status,\n onImageError,\n ...restProps\n } = props;\n const [hasBrokenImage, setHasBrokenImage] = useState<undefined \| boolean>();\n const t = useI18n();\n const testIds = useTestIds(testId, getAvatarTestIds);\n\n useEffect(() => {\n setHasBrokenImage(undefined);\n }, [imageSrc]);\n\n const content = useMemo(() => {\n if (icon) {\n return <Icon name={icon} />;\n }\n if (imageSrc && !hasBrokenImage) {\n return (\n <StyledAvatarImage\n src={imageSrc}\n alt={name}\n onError={(e: SyntheticEvent<HTMLImageElement>) => {\n setHasBrokenImage(true);\n onImageError?.(e);\n }}\n onLoad={() => {\n setHasBrokenImage(false);\n }}\n />\n );\n }\n return getInitials(name, size);\n }, [imageSrc, name, size, icon, hasBrokenImage, onImageError]);\n\n return (\n <StyledAvatar\n data-testid={testIds.root}\n role='img'\n hasSrc={!!imageSrc}\n hasBrokenImage={hasBrokenImage}\n shape={shape}\n size={size}\n ref={ref}\n aria-label={`${name}${status ? ` ${t('status')} ${status}` : ''}`}\n {...restProps}\n >\n {content}\n {status === 'active' && <StyledStatus size={size} variant='success' />}\n </StyledAvatar>\n );\n});\n\nexport default withTestIds(Avatar, getAvatarTestIds);\n"]}

package/lib/components/Badges/Keyboard.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Keyboard.d.ts","sourceRoot":"","sources":["../../../src/components/Badges/Keyboard.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAc,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;~~AA0E1F~~,eAAO,MAAM,cAAc,yGA+B1B,CAAC;AAGF,MAAM,MAAM,aAAa,GAAG,cAAc,CACxC,KAAK,EACL,cAAc,GAAG,UAAU,GAAG;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAClD,CAAC;;;;AAEF,wBAkBE"}
1	+ {"version":3,"file":"Keyboard.d.ts","sourceRoot":"","sources":["../../../src/components/Badges/Keyboard.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAc,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AA2E1F,eAAO,MAAM,cAAc,yGA+B1B,CAAC;AAGF,MAAM,MAAM,aAAa,GAAG,cAAc,CACxC,KAAK,EACL,cAAc,GAAG,UAAU,GAAG;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAClD,CAAC;;;;AAEF,wBAkBE"}

package/lib/components/Badges/Keyboard.js CHANGED Viewed

@@ -5,31 +5,32 @@ import { defaultThemeProp } from '../../theme';
 import useOS from '../../hooks/useOS';
 import { useTestIds } from '../../hooks';
 import { withTestIds } from '../../utils';
+import VisuallyHiddenText from '../VisuallyHiddenText';
 import { getKeyboardTestIds } from './Badges.test-ids';
 const osxKeyMapper = {
     Command: '⌘',
     Alt: '⌥',
     Option: '⌥',
     Control: '⌃',
-    Return: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Return' }), _jsx("span", { "aria-hidden": 'true', children: "\u21B5" })] })),
-    Enter: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Enter' }), _jsx("span", { "aria-hidden": 'true', children: "\u21B5" })] })),
-    Delete: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Delete' }), _jsx("span", { "aria-hidden": 'true', children: "Del" })] })),
+    Return: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: "\u21B5" }), _jsx(VisuallyHiddenText, { children: "Return" })] })),
+    Enter: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: "\u21B5" }), _jsx(VisuallyHiddenText, { children: "Enter" })] })),
+    Delete: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: "Del" }), _jsx(VisuallyHiddenText, { children: "Delete" })] })),
     CommandOrControl: '⌘'
 };
 const windowsKeyMapper = {
     Control: 'Ctrl',
     Alt: 'Alt',
     Option: 'Alt',
-    Meta: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Windows' }), _jsx("span", { "aria-hidden": 'true', children: "\u229E" })] })),
-    Command: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Windows' }), _jsx("span", { "aria-hidden": 'true', children: "\u229E" })] })),
+    Meta: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: "\u229E" }), _jsx(VisuallyHiddenText, { children: "Windows" })] })),
+    Command: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: "\u229E" }), _jsx(VisuallyHiddenText, { children: "Windows" })] })),
     Backspace: 'Backspace',
     CommandOrControl: 'Ctrl'
 };
 const generalKeyMapper = {
-    'Page up': (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Page up' }), _jsx("span", { "aria-hidden": 'true', children: "Pg up" })] })),
-    'Page down': (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Page down' }), _jsx("span", { "aria-hidden": 'true', children: "Pg dn" })] })),
+    'Page up': (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: "Pg up" }), _jsx(VisuallyHiddenText, { children: "Page up" })] })),
+    'Page down': (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: "Pg dn" }), _jsx(VisuallyHiddenText, { children: "Page down" })] })),
     Ins: 'Insert',
-    Shift: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Shift' }), _jsx("span", { "aria-hidden": 'true', children: "\u21E7" })] }))
+    Shift: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, children: "\u21E7" }), _jsx(VisuallyHiddenText, { children: "Shift" })] }))
 };
 export const StyledKeyboard = styled.kbd(({ theme: { base, components: { text: { primary }, badges: { keyboard } } } }) => {
     return css `

package/lib/components/Badges/Keyboard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Keyboard.js","sourceRoot":"","sources":["../../../src/components/Badges/Keyboard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;~~AAE1C~~,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAEvD,MAAM,YAAY,GAA4C;IAC5D,OAAO,EAAE,GAAG;IACZ,GAAG,EAAE,GAAG;IACR,MAAM,EAAE,GAAG;IACX,OAAO,EAAE,GAAG;IACZ,MAAM,EAAE,CACN,8BACE,~~6BAAiB~~,~~QAAQ~~,~~GAAG~~,~~EAC5B~~,~~8BAAkB~~,~~MAAM~~,~~uBAAS,IAChC,~~CACJ;IACD,KAAK,EAAE,CACL,8BACE,~~6BAAiB~~,~~OAAO~~,~~GAAG~~,~~EAC3B~~,~~8BAAkB~~,~~MAAM~~,~~uBAAS,IAChC,~~CACJ;IACD,MAAM,EAAE,CACN,8BACE,~~6BAAiB~~,~~QAAQ,GAAG,~~EAC5B,~~8BAAkB~~,~~MAAM~~,~~oBAAW~~,~~IAClC~~,CACJ;IACD,gBAAgB,EAAE,GAAG;CACtB,CAAC;AAEF,MAAM,gBAAgB,GAA4C;IAChE,OAAO,EAAE,MAAM;IACf,GAAG,EAAE,KAAK;IACV,MAAM,EAAE,KAAK;IACb,IAAI,EAAE,CACJ,8BACE,~~6BAAiB~~,~~SAAS~~,~~GAAG~~,~~EAC7B~~,~~8BAAkB~~,~~MAAM~~,~~uBAAS,IAChC,~~CACJ;IACD,OAAO,EAAE,CACP,8BACE,~~6BAAiB~~,~~SAAS~~,~~GAAG~~,~~EAC7B~~,~~8BAAkB~~,~~MAAM~~,~~uBAAS,IAChC,~~CACJ;IACD,SAAS,EAAE,WAAW;IACtB,gBAAgB,EAAE,MAAM;CACzB,CAAC;AAEF,MAAM,gBAAgB,GAA4C;IAChE,SAAS,EAAE,CACT,8BACE,~~6BAAiB~~,~~SAAS~~,~~GAAG~~,~~EAC7B~~,~~8BAAkB~~,~~MAAM~~,~~sBAAa,IACpC,~~CACJ;IACD,WAAW,EAAE,CACX,8BACE,~~6BAAiB~~,~~WAAW~~,~~GAAG~~,~~EAC/~~B,~~8BAAkB~~,~~MAAM,sBAAa,IACpC,~~CACJ;IACD,GAAG,EAAE,QAAQ;IACb,KAAK,EAAE,CACL,8BACE,~~6BAAiB~~,~~OAAO~~,~~GAAG~~,~~EAC3B~~,~~8BAAkB~~,~~MAAM~~,~~uBAAS,IAChC,~~CACJ;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CACtC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EACJ,UAAU,EAAE,EACV,IAAI,EAAE,EAAE,OAAO,EAAE,EACjB,MAAM,EAAE,EAAE,QAAQ,EAAE,EACrB,EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;0BACY,QAAQ,CAAC,kBAAkB,CAAC;eACvC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC;;;qBAG1B,IAAI,CAAC,aAAa,CAAC;qBACnB,OAAO,CAAC,aAAa,CAAC;;;;gCAIX,QAAQ,CAAC,cAAc,CAAC;4BAC5B,IAAI,CAAC,eAAe,CAAC;;;;;;;;KAQ5C,CAAC;AACJ,CAAC,CACF,CAAC;AACF,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAO/C,eAAe,WAAW,CACxB,UAAU,CAA4D,SAAS,QAAQ,CACrF,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,EACjC,GAAG;IAEH,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,CAAC;IACvC,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAEvD,OAAO,CACL,KAAC,cAAc,mBAAc,OAAO,CAAC,IAAI,KAAM,SAAS,EAAE,GAAG,EAAE,GAAG,YAC/D,CAAC,SAAS,IAAI,gBAAgB,CAAC,OAAO,CAAC,CAAC;YACvC,YAAY,CAAC,OAAO,CAAC;YACrB,gBAAgB,CAAC,OAAO,CAAC;YACzB,OAAO,GACM,CAClB,CAAC;AACJ,CAAC,CAAC,EACF,kBAAkB,CACnB,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport useOS from '../../hooks/useOS';\nimport type { NoChildrenProp, RefElement, WithAttributes, TestIdProp } from '../../types';\nimport { useTestIds } from '../../hooks';\nimport { withTestIds } from '../../utils';\n\nimport { getKeyboardTestIds } from './Badges.test-ids';\n\nconst osxKeyMapper: { [key: string]: string \| JSX.Element } = {\n Command: '⌘',\n Alt: '⌥',\n Option: '⌥',\n Control: '⌃',\n Return: (\n <>\n <span aria-~~label='Return' />\n <span aria-~~hidden~~='true'~~>↵</span>\n </>\n ),\n Enter: (\n <>\n <span aria-~~label='Enter' />\n <span aria-~~hidden~~='true'~~>↵</span>\n </>\n ),\n Delete: (\n <>\n <span aria-~~label='Delete' />\n <span aria-~~hidden~~='true'~~>Del</span>\n </>\n ),\n CommandOrControl: '⌘'\n};\n\nconst windowsKeyMapper: { [key: string]: string \| JSX.Element } = {\n Control: 'Ctrl',\n Alt: 'Alt',\n Option: 'Alt',\n Meta: (\n <>\n <span aria-~~label='Windows' />\n <span aria-~~hidden~~='true'~~>⊞</span>\n </>\n ),\n Command: (\n <>\n <span aria-~~label='Windows' />\n <span aria-~~hidden~~='true'~~>⊞</span>\n </>\n ),\n Backspace: 'Backspace',\n CommandOrControl: 'Ctrl'\n};\n\nconst generalKeyMapper: { [key: string]: string \| JSX.Element } = {\n 'Page up': (\n <>\n <span aria-~~label='Page~~ up~~' />\~~n <~~span aria-hidden='true'~~>Pg up</~~span~~>\n </>\n ),\n 'Page down': (\n <>\n <span aria-~~label='Page down' />\n <span aria-~~hidden~~='true'~~>Pg dn</span>\n </>\n ),\n Ins: 'Insert',\n Shift: (\n <>\n <span aria-~~label='Shift' />\n <span aria-~~hidden~~='true'~~>⇧</span>\n </>\n )\n};\n\nexport const StyledKeyboard = styled.kbd(\n ({\n theme: {\n base,\n components: {\n text: { primary },\n badges: { keyboard }\n }\n }\n }) => {\n return css`\n background-color: ${keyboard['background-color']};\n color: ${base.palette['foreground-color']};\n display: inline-block;\n position: relative;\n font-family: ${base['font-family']};\n font-weight: ${primary['font-weight']};\n overflow: hidden;\n white-space: nowrap;\n padding: 0.125rem;\n border: 0.0125rem solid ${keyboard['border-color']};\n border-radius: calc(${base['border-radius']} / 4);\n text-transform: capitalize;\n text-align: center;\n min-width: 1.25rem;\n height: 1.25rem;\n text-overflow: ellipsis;\n line-height: 1rem;\n inset-block-start: calc(1.25rem / 4 - 0.125rem);\n `;\n }\n);\nStyledKeyboard.defaultProps = defaultThemeProp;\n\nexport type KeyboardProps = WithAttributes<\n 'kbd',\n NoChildrenProp & TestIdProp & { keyName: string }\n>;\n\nexport default withTestIds(\n forwardRef<RefElement<KeyboardProps>, PropsWithoutRef<KeyboardProps>>(function Keyboard(\n { testId, keyName, ...restProps },\n ref\n ) {\n const { windows: isWindows } = useOS();\n const testIds = useTestIds(testId, getKeyboardTestIds);\n\n return (\n <StyledKeyboard data-testid={testIds.root} {...restProps} ref={ref}>\n {(isWindows && windowsKeyMapper[keyName]) \|\|\n osxKeyMapper[keyName] \|\|\n generalKeyMapper[keyName] \|\|\n keyName}\n </StyledKeyboard>\n );\n }),\n getKeyboardTestIds\n);\n"]}
1	+ {"version":3,"file":"Keyboard.js","sourceRoot":"","sources":["../../../src/components/Badges/Keyboard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport useOS from '../../hooks/useOS';\nimport type { NoChildrenProp, RefElement, WithAttributes, TestIdProp } from '../../types';\nimport { useTestIds } from '../../hooks';\nimport { withTestIds } from '../../utils';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport { getKeyboardTestIds } from './Badges.test-ids';\n\nconst osxKeyMapper: { [key: string]: string \| JSX.Element } = {\n Command: '⌘',\n Alt: '⌥',\n Option: '⌥',\n Control: '⌃',\n Return: (\n <>\n <span aria-hidden>↵</span>\n <VisuallyHiddenText>Return</VisuallyHiddenText>\n </>\n ),\n Enter: (\n <>\n <span aria-hidden>↵</span>\n <VisuallyHiddenText>Enter</VisuallyHiddenText>\n </>\n ),\n Delete: (\n <>\n <span aria-hidden>Del</span>\n <VisuallyHiddenText>Delete</VisuallyHiddenText>\n </>\n ),\n CommandOrControl: '⌘'\n};\n\nconst windowsKeyMapper: { [key: string]: string \| JSX.Element } = {\n Control: 'Ctrl',\n Alt: 'Alt',\n Option: 'Alt',\n Meta: (\n <>\n <span aria-hidden>⊞</span>\n <VisuallyHiddenText>Windows</VisuallyHiddenText>\n </>\n ),\n Command: (\n <>\n <span aria-hidden>⊞</span>\n <VisuallyHiddenText>Windows</VisuallyHiddenText>\n </>\n ),\n Backspace: 'Backspace',\n CommandOrControl: 'Ctrl'\n};\n\nconst generalKeyMapper: { [key: string]: string \| JSX.Element } = {\n 'Page up': (\n <>\n <span aria-hidden>Pg up</span>\n <VisuallyHiddenText>Page up</VisuallyHiddenText>\n </>\n ),\n 'Page down': (\n <>\n <span aria-hidden>Pg dn</span>\n <VisuallyHiddenText>Page down</VisuallyHiddenText>\n </>\n ),\n Ins: 'Insert',\n Shift: (\n <>\n <span aria-hidden>⇧</span>\n <VisuallyHiddenText>Shift</VisuallyHiddenText>\n </>\n )\n};\n\nexport const StyledKeyboard = styled.kbd(\n ({\n theme: {\n base,\n components: {\n text: { primary },\n badges: { keyboard }\n }\n }\n }) => {\n return css`\n background-color: ${keyboard['background-color']};\n color: ${base.palette['foreground-color']};\n display: inline-block;\n position: relative;\n font-family: ${base['font-family']};\n font-weight: ${primary['font-weight']};\n overflow: hidden;\n white-space: nowrap;\n padding: 0.125rem;\n border: 0.0125rem solid ${keyboard['border-color']};\n border-radius: calc(${base['border-radius']} / 4);\n text-transform: capitalize;\n text-align: center;\n min-width: 1.25rem;\n height: 1.25rem;\n text-overflow: ellipsis;\n line-height: 1rem;\n inset-block-start: calc(1.25rem / 4 - 0.125rem);\n `;\n }\n);\nStyledKeyboard.defaultProps = defaultThemeProp;\n\nexport type KeyboardProps = WithAttributes<\n 'kbd',\n NoChildrenProp & TestIdProp & { keyName: string }\n>;\n\nexport default withTestIds(\n forwardRef<RefElement<KeyboardProps>, PropsWithoutRef<KeyboardProps>>(function Keyboard(\n { testId, keyName, ...restProps },\n ref\n ) {\n const { windows: isWindows } = useOS();\n const testIds = useTestIds(testId, getKeyboardTestIds);\n\n return (\n <StyledKeyboard data-testid={testIds.root} {...restProps} ref={ref}>\n {(isWindows && windowsKeyMapper[keyName]) \|\|\n osxKeyMapper[keyName] \|\|\n generalKeyMapper[keyName] \|\|\n keyName}\n </StyledKeyboard>\n );\n }),\n getKeyboardTestIds\n);\n"]}

package/lib/components/Banner/Banner.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAKhF,OAAO,KAAK,EACV,YAAY,EACZ,UAAU,EACV,cAAc,EAGd,UAAU,EACV,cAAc,EACf,MAAM,aAAa,CAAC;~~AA8BrB~~,MAAM,WAAW,iBAAiB;IAChC,kEAAkE;IAClE,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE;QACP,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;QACnE,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,CAAC,EAAE,CAAC,aAAa,GAAG,MAAM,CAAC,EAAE,CAAC;CACpC;AAED,MAAM,MAAM,WAAW,GAAG,cAAc,CACtC,KAAK,EACL,UAAU,GACR,cAAc,GAAG;IACf,0CAA0C,CAAC,OAAO,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;IAC9F;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,gEAAgE;IAChE,QAAQ,EAAE,CAAC,MAAM,GAAG,aAAa,CAAC,EAAE,CAAC;IACrC,0DAA0D;IAC1D,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CACjC,CACJ,CAAC;AAEF,eAAO,MAAM,YAAY;gBAA4B,WAAW,CAAC,YAAY,CAAC;SAU7E,CAAC;AAIF,eAAO,MAAM,kBAAkB,mIAiB7B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAoB7B,CAAC;AAIH,eAAO,MAAM,mBAAmB;;SAW9B,CAAC;AAIH,eAAO,MAAM,uBAAuB,2KAMnC,CAAC;AAIF,eAAO,MAAM,mBAAmB,0GAG/B,CAAC;;;;AAoEF,wBA2JE"}
1	+ {"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAKhF,OAAO,KAAK,EACV,YAAY,EACZ,UAAU,EACV,cAAc,EAGd,UAAU,EACV,cAAc,EACf,MAAM,aAAa,CAAC;AA+BrB,MAAM,WAAW,iBAAiB;IAChC,kEAAkE;IAClE,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE;QACP,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;QACnE,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;IACF,KAAK,CAAC,EAAE,CAAC,aAAa,GAAG,MAAM,CAAC,EAAE,CAAC;CACpC;AAED,MAAM,MAAM,WAAW,GAAG,cAAc,CACtC,KAAK,EACL,UAAU,GACR,cAAc,GAAG;IACf,0CAA0C,CAAC,OAAO,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;IAC9F;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,gEAAgE;IAChE,QAAQ,EAAE,CAAC,MAAM,GAAG,aAAa,CAAC,EAAE,CAAC;IACrC,0DAA0D;IAC1D,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,4DAA4D;IAC5D,MAAM,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CACjC,CACJ,CAAC;AAEF,eAAO,MAAM,YAAY;gBAA4B,WAAW,CAAC,YAAY,CAAC;SAU7E,CAAC;AAIF,eAAO,MAAM,kBAAkB,mIAiB7B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAoB7B,CAAC;AAIH,eAAO,MAAM,mBAAmB;;SAW9B,CAAC;AAIH,eAAO,MAAM,uBAAuB,2KAMnC,CAAC;AAIF,eAAO,MAAM,mBAAmB,0GAG/B,CAAC;;;;AAoEF,wBA2JE"}

package/lib/components/Banner/Banner.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, forwardRef, useMemo, useImperativeHandle } from 'react';
 import styled, { css } from 'styled-components';
-import { getContrast, readableColor } from 'polished';
+import { getContrast } from 'polished';
 import { defaultThemeProp } from '../../theme';
 import Button, { StyledButton } from '../Button';
 import { focusHeadingOrContainer, tryCatch, withTestIds } from '../../utils';
@@ -20,6 +20,7 @@ import * as informationSolidIcon from '../Icon/icons/information-solid.icon';
 import * as checkIcon from '../Icon/icons/check.icon';
 import VisuallyHiddenText from '../VisuallyHiddenText';
 import { UnorderedList } from '../List';
+import { readableColor } from '../../styles';
 import { getBannerTestIds } from './Banner.test-ids';
 registerIcon(timesIcon, caretRightIcon, warnSolidIcon, flagWaveSolidIcon, informationSolidIcon, checkIcon);
 export const StyledBanner = styled.div(({ headingTag, theme }) => {

package/lib/components/Banner/Banner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, forwardRef, useMemo, useImperativeHandle } from 'react';\nimport type { PropsWithoutRef, Ref, MouseEventHandler, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\nimport { getContrast, readableColor } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport type {\n ForwardProps,\n HeadingTag,\n NoChildrenProp,\n OmitStrict,\n RefElement,\n TestIdProp,\n WithAttributes\n} from '../../types';\nimport Button, { StyledButton } from '../Button';\nimport { focusHeadingOrContainer, tryCatch, withTestIds } from '../../utils';\nimport { useConsolidatedRef, useDirection, useI18n, useTestIds } from '../../hooks';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Grid from '../Grid';\nimport ExpandCollapse from '../ExpandCollapse';\nimport { Count } from '../Badges';\nimport Icon, { StyledIcon, registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport * as flagWaveSolidIcon from '../Icon/icons/flag-wave-solid.icon';\nimport * as informationSolidIcon from '../Icon/icons/information-solid.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { UnorderedList } from '../List';\n\nimport { getBannerTestIds } from './Banner.test-ids';\n\nregisterIcon(\n timesIcon,\n caretRightIcon,\n warnSolidIcon,\n flagWaveSolidIcon,\n informationSolidIcon,\n checkIcon\n);\n\nexport interface BannerHandleValue {\n /** Used to apply focus to the banner via an imperative handle. /\n focus: () => void;\n}\n\nexport interface BannerMessage {\n label: string;\n description?: string;\n action?: {\n text: string;\n onClick?: MouseEventHandler<HTMLButtonElement \| HTMLAnchorElement>;\n href?: string;\n };\n items?: (BannerMessage \| string)[];\n}\n\nexport type BannerProps = WithAttributes<\n 'div',\n TestIdProp &\n NoChildrenProp & {\n /* Controls the styling of the Banner. / variant: 'urgent' \| 'warning' \| 'success' \| 'info';\n /\n The heading tag to render the provided heading as. This is agnostic to the styling of the heading.\n * @default 'h2'\n /\n headingTag?: HeadingTag;\n /* Pass one or more descriptive messages to inform the user. /\n messages: (string \| BannerMessage)[];\n /* Callback when user explicitly dismisses the Banner. /\n onDismiss?: MouseEventHandler;\n /* Ref that can be used to access the imperative handle. /\n handle?: Ref<BannerHandleValue>;\n }\n>;\n\nexport const StyledBanner = styled.div<{ headingTag: BannerProps['headingTag'] }>(\n ({ headingTag, theme }) => {\n return css`\n border-radius: ${theme.components.card['border-radius']};\n\n &:has(${headingTag}:focus) {\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n }\n);\n\nStyledBanner.defaultProps = defaultThemeProp;\n\nexport const StyledBannerStatus = styled.div<Pick<BannerProps, 'variant'>>(({ variant, theme }) => {\n const { background } = theme.components.banner[variant];\n const color = tryCatch(() =>\n getContrast(background, theme.base.palette['primary-background']) >= 3\n ? theme.base.palette['primary-background']\n : readableColor(background)\n );\n\n return css`\n background-color: ${background};\n color: ${color};\n border-start-start-radius: inherit;\n border-end-start-radius: inherit;\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n border-inline-end: none;\n font-size: 1.25rem;\n `;\n});\n\nStyledBannerStatus.defaultProps = defaultThemeProp;\n\nexport const StyledBannerHeader = styled.div(({ theme }) => {\n const { rtl } = useDirection();\n\n return css`\n min-height: 2.125rem;\n\n ${StyledButton}[aria-expanded] {\n ${StyledIcon} {\n transition: rotate ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n }\n\n &[aria-expanded='true'] ${StyledIcon} {\n rotate: 90deg;\n }\n\n &[aria-expanded='false'] ${StyledIcon} {\n rotate: ${rtl ? 180 : 0}deg;\n }\n }\n `;\n});\n\nStyledBannerHeader.defaultProps = defaultThemeProp;\n\nexport const StyledBannerContent = styled.div<{ expandable?: boolean }>(({ expandable, theme }) => {\n return css`\n background: ${theme.components.card.background};\n padding-block: calc(0.5 ${theme.base.spacing});\n padding-inline-start: calc(${expandable ? 0.5 : 2} * ${theme.base.spacing});\n padding-inline-end: calc(0.5 * ${theme.base.spacing});\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n border-inline-start: none;\n border-start-end-radius: inherit;\n border-end-end-radius: inherit;\n `;\n});\n\nStyledBannerContent.defaultProps = defaultThemeProp;\n\nexport const StyledBannerMessageList = styled(UnorderedList)(\n ({ theme }) => css`\n padding-block-end: calc(0.5 * ${theme.base.spacing});\n padding-inline-start: calc(5 * ${theme.base.spacing});\n padding-inline-end: calc(2 * ${theme.base.spacing});\n `\n);\n\nStyledBannerMessageList.defaultProps = defaultThemeProp;\n\nexport const StyledBannerMessage = styled.span`\n overflow-wrap: break-word;\n list-style: none;\n`;\n\nStyledBannerMessage.defaultProps = defaultThemeProp;\n\nconst BannerMessageItem = forwardRef<\n HTMLLIElement,\n TestIdProp & OmitStrict<BannerMessage, 'items'> & ForwardProps\n>(function BannerMessageItem({ testId, label, description, action, ...restProps }, ref) {\n const testIds = useTestIds(testId, getBannerTestIds);\n\n return (\n <StyledBannerMessage {...restProps} ref={ref}>\n <span data-testid={testIds.messageLabel}>{label}</span>\n {description && (\n <>\n {' '}\n <Text data-testid={testIds.messageDescription} variant='secondary'>\n {description}\n </Text>\n </>\n )}\n {action && (\n <>\n {' '}\n <Text variant='secondary'>\n <Button\n data-testid={testIds.messageAction}\n variant='link'\n href={action.href}\n onClick={action.onClick}\n {...action}\n >\n {action.text}\n </Button>\n </Text>\n </>\n )}\n </StyledBannerMessage>\n );\n});\n\nconst prepareMessages = (\n messages: (string \| BannerMessage)[],\n testId: TestIdProp['testId']\n): [messages: ReactNode[], count: number] => {\n let count = 0;\n\n return [\n messages.flatMap(msg => {\n count += 1;\n\n if (typeof msg === 'string') {\n return [<BannerMessageItem label={msg} />];\n }\n\n if (msg.items) {\n const { items, ...restMsg } = msg;\n const [subMessages, subCount] = prepareMessages(items, testId);\n count += subCount;\n return [<BannerMessageItem {...restMsg} testId={testId} />, subMessages];\n }\n\n return [<BannerMessageItem {...msg} testId={testId} />];\n }),\n count\n ];\n};\n\nexport default withTestIds(\n forwardRef<RefElement<BannerProps>, PropsWithoutRef<BannerProps>>(function Banner(\n { testId, variant, headingTag = 'h2', messages, onDismiss, handle, ...restProps },\n ref\n ) {\n const testIds = useTestIds(testId, getBannerTestIds);\n const [messagesToRender, count] = useMemo(() => prepareMessages(messages, testId), [messages]);\n const t = useI18n();\n const [collapsed, setCollapsed] = useState(count > 2);\n\n const bannerRef = useConsolidatedRef(ref);\n\n let role: string;\n let icon: string;\n let heading: string;\n let ariaLive: string;\n\n switch (variant) {\n case 'urgent':\n heading = t('error');\n icon = 'warn-solid';\n role = 'alert';\n ariaLive = 'assertive';\n break;\n case 'warning':\n heading = t('warning');\n icon = 'flag-wave-solid';\n role = 'alert';\n ariaLive = 'assertive';\n break;\n case 'success':\n heading = t('success');\n icon = 'check';\n role = 'none';\n ariaLive = 'polite';\n break;\n case 'info':\n default:\n heading = t('information');\n icon = 'information-solid';\n role = 'none';\n ariaLive = 'polite';\n break;\n }\n\n useImperativeHandle(\n handle,\n () => ({\n focus: () => {\n // Empty timeout ensures that the banner will take focus after any other programmatic focus events\n setTimeout(() => {\n if (bannerRef.current) {\n focusHeadingOrContainer(bannerRef.current, heading);\n }\n });\n }\n }),\n []\n );\n\n return (\n <Grid\n data-testid={testIds.root}\n {...restProps}\n as={StyledBanner}\n container={{ cols: '2rem minmax(0, 1fr)' }}\n role={role}\n aria-live={ariaLive}\n headingTag={headingTag}\n ref={bannerRef}\n >\n <Flex\n as={StyledBannerStatus}\n container={{ justify: 'center', alignItems: 'start', pad: [1.5, 0] }}\n variant={variant}\n >\n <Icon name={icon} />\n </Flex>\n {count === 1 ? (\n <Flex container={{ alignItems: 'start' }} as={StyledBannerContent}>\n <VisuallyHiddenText as={headingTag}>{`${heading} ${count}`}</VisuallyHiddenText>\n <Flex item={{ alignSelf: 'center', grow: 1 }} as='ul'>\n {typeof messages[0] === 'string' ? (\n <BannerMessageItem testId={testId} label={messages[0]} as='li' />\n ) : (\n <BannerMessageItem {...messages[0]} testId={testId} as='li' />\n )}\n </Flex>\n {onDismiss && (\n <Button\n data-testid={testIds.dismiss}\n onClick={onDismiss}\n label={t('dismiss')}\n aria-label={t('banner_dismiss_button_label_a11y')}\n variant='simple'\n icon\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n ) : (\n <StyledBannerContent expandable>\n <Grid\n as={StyledBannerHeader}\n container={{ cols: 'auto 1fr auto', areas: '\"toggle heading dismiss\"', gap: 0.5 }}\n >\n <Grid\n data-testid={testIds.heading}\n container={{ cols: 'min-content min-content', gap: 0.5, alignItems: 'center' }}\n item={{ area: 'heading', alignSelf: 'center' }}\n as={Text}\n forwardedAs={headingTag}\n variant='h2'\n >\n {heading} <Count>{count}</Count>\n </Grid>\n <Grid item={{ area: 'toggle', alignSelf: 'center' }}>\n <Button\n data-testid={testIds.expandCollapse}\n onClick={() => {\n setCollapsed(cur => !cur);\n }}\n label={t(collapsed ? 'expand' : 'collapse')}\n aria-expanded={collapsed ? 'false' : 'true'}\n variant='simple'\n icon\n >\n <Icon name='caret-right' />\n </Button>\n </Grid>\n <Grid item={{ area: 'dismiss', alignSelf: 'center' }}>\n {onDismiss && (\n <Button\n data-testid={testIds.dismiss}\n onClick={onDismiss}\n label={t('dismiss')}\n aria-label={t('banner_dismiss_button_label_a11y')}\n variant='simple'\n icon\n >\n <Icon name='times' />\n </Button>\n )}\n </Grid>\n </Grid>\n <ExpandCollapse collapsed={collapsed}>\n <StyledBannerMessageList items={messagesToRender} />\n </ExpandCollapse>\n </StyledBannerContent>\n )}\n </Grid>\n );\n }),\n getBannerTestIds\n);\n"]}
1	+ {"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAEvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAU/C,OAAO,MAAM,EAAE,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAE,uBAAuB,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACpF,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAClC,OAAO,IAAI,EAAE,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACzD,OAAO,KAAK,SAAS,MAAM,0BAA0B,CAAC;AACtD,OAAO,KAAK,cAAc,MAAM,gCAAgC,CAAC;AACjE,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,KAAK,iBAAiB,MAAM,oCAAoC,CAAC;AACxE,OAAO,KAAK,oBAAoB,MAAM,sCAAsC,CAAC;AAC7E,OAAO,KAAK,SAAS,MAAM,0BAA0B,CAAC;AACtD,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAErD,YAAY,CACV,SAAS,EACT,cAAc,EACd,aAAa,EACb,iBAAiB,EACjB,oBAAoB,EACpB,SAAS,CACV,CAAC;AAqCF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CACpC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE;IACxB,OAAO,GAAG,CAAA;uBACS,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;;cAE/C,UAAU;sBACF,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;KAExC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAA+B,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;IAChG,MAAM,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IACxD,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CAC1B,WAAW,CAAC,UAAU,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAC,IAAI,CAAC;QACpE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;QAC1C,CAAC,CAAC,aAAa,CAAC,UAAU,CAAC,CAC9B,CAAC;IAEF,OAAO,GAAG,CAAA;wBACY,UAAU;aACrB,KAAK;;;8BAGY,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;;GAG5D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACzD,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAE/B,OAAO,GAAG,CAAA;;;MAGN,YAAY;QACV,UAAU;6BACW,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;;;gCAG3D,UAAU;;;;iCAIT,UAAU;kBACzB,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;;;GAG5B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAA2B,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE;IAChG,OAAO,GAAG,CAAA;kBACM,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU;gCAClB,KAAK,CAAC,IAAI,CAAC,OAAO;iCACjB,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,OAAO;qCACxC,KAAK,CAAC,IAAI,CAAC,OAAO;8BACzB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;;;GAI5D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,aAAa,CAAC,CAC1D,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;oCACgB,KAAK,CAAC,IAAI,CAAC,OAAO;qCACjB,KAAK,CAAC,IAAI,CAAC,OAAO;mCACpB,KAAK,CAAC,IAAI,CAAC,OAAO;GAClD,CACF,CAAC;AAEF,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAG7C,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,iBAAiB,GAAG,UAAU,CAGlC,SAAS,iBAAiB,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE,EAAE,GAAG;IACpF,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAErD,OAAO,CACL,MAAC,mBAAmB,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,aAC1C,8BAAmB,OAAO,CAAC,YAAY,YAAG,KAAK,GAAQ,EACtD,WAAW,IAAI,CACd,8BACG,GAAG,EACJ,KAAC,IAAI,mBAAc,OAAO,CAAC,kBAAkB,EAAE,OAAO,EAAC,WAAW,YAC/D,WAAW,GACP,IACN,CACJ,EACA,MAAM,IAAI,CACT,8BACG,GAAG,EACJ,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,YACvB,KAAC,MAAM,mBACQ,OAAO,CAAC,aAAa,EAClC,OAAO,EAAC,MAAM,EACd,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,OAAO,EAAE,MAAM,CAAC,OAAO,KACnB,MAAM,YAET,MAAM,CAAC,IAAI,GACL,GACJ,IACN,CACJ,IACmB,CACvB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,eAAe,GAAG,CACtB,QAAoC,EACpC,MAA4B,EACY,EAAE;IAC1C,IAAI,KAAK,GAAG,CAAC,CAAC;IAEd,OAAO;QACL,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;YACrB,KAAK,IAAI,CAAC,CAAC;YAEX,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE;gBAC3B,OAAO,CAAC,KAAC,iBAAiB,IAAC,KAAK,EAAE,GAAG,GAAI,CAAC,CAAC;aAC5C;YAED,IAAI,GAAG,CAAC,KAAK,EAAE;gBACb,MAAM,EAAE,KAAK,EAAE,GAAG,OAAO,EAAE,GAAG,GAAG,CAAC;gBAClC,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,GAAG,eAAe,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;gBAC/D,KAAK,IAAI,QAAQ,CAAC;gBAClB,OAAO,CAAC,KAAC,iBAAiB,OAAK,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,EAAE,WAAW,CAAC,CAAC;aAC1E;YAED,OAAO,CAAC,KAAC,iBAAiB,OAAK,GAAG,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC,CAAC;QAC1D,CAAC,CAAC;QACF,KAAK;KACN,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CACxB,UAAU,CAAwD,SAAS,MAAM,CAC/E,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,GAAG,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE,EACjF,GAAG;IAEH,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IACrD,MAAM,CAAC,gBAAgB,EAAE,KAAK,CAAC,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,eAAe,CAAC,QAAQ,EAAE,MAAM,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAC/F,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;IAEtD,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAE1C,IAAI,IAAY,CAAC;IACjB,IAAI,IAAY,CAAC;IACjB,IAAI,OAAe,CAAC;IACpB,IAAI,QAAgB,CAAC;IAErB,QAAQ,OAAO,EAAE;QACf,KAAK,QAAQ;YACX,OAAO,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC;YACrB,IAAI,GAAG,YAAY,CAAC;YACpB,IAAI,GAAG,OAAO,CAAC;YACf,QAAQ,GAAG,WAAW,CAAC;YACvB,MAAM;QACR,KAAK,SAAS;YACZ,OAAO,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC;YACvB,IAAI,GAAG,iBAAiB,CAAC;YACzB,IAAI,GAAG,OAAO,CAAC;YACf,QAAQ,GAAG,WAAW,CAAC;YACvB,MAAM;QACR,KAAK,SAAS;YACZ,OAAO,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC;YACvB,IAAI,GAAG,OAAO,CAAC;YACf,IAAI,GAAG,MAAM,CAAC;YACd,QAAQ,GAAG,QAAQ,CAAC;YACpB,MAAM;QACR,KAAK,MAAM,CAAC;QACZ;YACE,OAAO,GAAG,CAAC,CAAC,aAAa,CAAC,CAAC;YAC3B,IAAI,GAAG,mBAAmB,CAAC;YAC3B,IAAI,GAAG,MAAM,CAAC;YACd,QAAQ,GAAG,QAAQ,CAAC;YACpB,MAAM;KACT;IAED,mBAAmB,CACjB,MAAM,EACN,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,GAAG,EAAE;YACV,kGAAkG;YAClG,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,SAAS,CAAC,OAAO,EAAE;oBACrB,uBAAuB,CAAC,SAAS,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;iBACrD;YACH,CAAC,CAAC,CAAC;QACL,CAAC;KACF,CAAC,EACF,EAAE,CACH,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,mBACU,OAAO,CAAC,IAAI,KACrB,SAAS,EACb,EAAE,EAAE,YAAY,EAChB,SAAS,EAAE,EAAE,IAAI,EAAE,qBAAqB,EAAE,EAC1C,IAAI,EAAE,IAAI,eACC,QAAQ,EACnB,UAAU,EAAE,UAAU,EACtB,GAAG,EAAE,SAAS,aAEd,KAAC,IAAI,IACH,EAAE,EAAE,kBAAkB,EACtB,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,EACpE,OAAO,EAAE,OAAO,YAEhB,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,GAAI,GACf,EACN,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CACb,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,mBAAmB,aAC/D,KAAC,kBAAkB,IAAC,EAAE,EAAE,UAAU,YAAG,GAAG,OAAO,IAAI,KAAK,EAAE,GAAsB,EAChF,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAC,IAAI,YAClD,OAAO,QAAQ,CAAC,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,CACjC,KAAC,iBAAiB,IAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,EAAC,IAAI,GAAG,CAClE,CAAC,CAAC,CAAC,CACF,KAAC,iBAAiB,OAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,EAAC,IAAI,GAAG,CAC/D,GACI,EACN,SAAS,IAAI,CACZ,KAAC,MAAM,mBACQ,OAAO,CAAC,OAAO,EAC5B,OAAO,EAAE,SAAS,EAClB,KAAK,EAAE,CAAC,CAAC,SAAS,CAAC,gBACP,CAAC,CAAC,kCAAkC,CAAC,EACjD,OAAO,EAAC,QAAQ,EAChB,IAAI,kBAEJ,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,IACI,CACR,CAAC,CAAC,CAAC,CACF,MAAC,mBAAmB,IAAC,UAAU,mBAC7B,MAAC,IAAI,IACH,EAAE,EAAE,kBAAkB,EACtB,SAAS,EAAE,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,0BAA0B,EAAE,GAAG,EAAE,GAAG,EAAE,aAEjF,MAAC,IAAI,mBACU,OAAO,CAAC,OAAO,EAC5B,SAAS,EAAE,EAAE,IAAI,EAAE,yBAAyB,EAAE,GAAG,EAAE,GAAG,EAAE,UAAU,EAAE,QAAQ,EAAE,EAC9E,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,EAC9C,EAAE,EAAE,IAAI,EACR,WAAW,EAAE,UAAU,EACvB,OAAO,EAAC,IAAI,aAEX,OAAO,OAAE,KAAC,KAAK,cAAE,KAAK,GAAS,IAC3B,EACP,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,YACjD,KAAC,MAAM,mBACQ,OAAO,CAAC,cAAc,EACnC,OAAO,EAAE,GAAG,EAAE;wCACZ,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;oCAC5B,CAAC,EACD,KAAK,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,mBAC5B,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAC3C,OAAO,EAAC,QAAQ,EAChB,IAAI,kBAEJ,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,GAAG,GACpB,GACJ,EACP,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,YACjD,SAAS,IAAI,CACZ,KAAC,MAAM,mBACQ,OAAO,CAAC,OAAO,EAC5B,OAAO,EAAE,SAAS,EAClB,KAAK,EAAE,CAAC,CAAC,SAAS,CAAC,gBACP,CAAC,CAAC,kCAAkC,CAAC,EACjD,OAAO,EAAC,QAAQ,EAChB,IAAI,kBAEJ,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,GACI,IACF,EACP,KAAC,cAAc,IAAC,SAAS,EAAE,SAAS,YAClC,KAAC,uBAAuB,IAAC,KAAK,EAAE,gBAAgB,GAAI,GACrC,IACG,CACvB,IACI,CACR,CAAC;AACJ,CAAC,CAAC,EACF,gBAAgB,CACjB,CAAC","sourcesContent":["import { useState, forwardRef, useMemo, useImperativeHandle } from 'react';\nimport type { PropsWithoutRef, Ref, MouseEventHandler, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\nimport { getContrast } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport type {\n ForwardProps,\n HeadingTag,\n NoChildrenProp,\n OmitStrict,\n RefElement,\n TestIdProp,\n WithAttributes\n} from '../../types';\nimport Button, { StyledButton } from '../Button';\nimport { focusHeadingOrContainer, tryCatch, withTestIds } from '../../utils';\nimport { useConsolidatedRef, useDirection, useI18n, useTestIds } from '../../hooks';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Grid from '../Grid';\nimport ExpandCollapse from '../ExpandCollapse';\nimport { Count } from '../Badges';\nimport Icon, { StyledIcon, registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport * as flagWaveSolidIcon from '../Icon/icons/flag-wave-solid.icon';\nimport * as informationSolidIcon from '../Icon/icons/information-solid.icon';\nimport * as checkIcon from '../Icon/icons/check.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { UnorderedList } from '../List';\nimport { readableColor } from '../../styles';\n\nimport { getBannerTestIds } from './Banner.test-ids';\n\nregisterIcon(\n timesIcon,\n caretRightIcon,\n warnSolidIcon,\n flagWaveSolidIcon,\n informationSolidIcon,\n checkIcon\n);\n\nexport interface BannerHandleValue {\n /** Used to apply focus to the banner via an imperative handle. /\n focus: () => void;\n}\n\nexport interface BannerMessage {\n label: string;\n description?: string;\n action?: {\n text: string;\n onClick?: MouseEventHandler<HTMLButtonElement \| HTMLAnchorElement>;\n href?: string;\n };\n items?: (BannerMessage \| string)[];\n}\n\nexport type BannerProps = WithAttributes<\n 'div',\n TestIdProp &\n NoChildrenProp & {\n /* Controls the styling of the Banner. / variant: 'urgent' \| 'warning' \| 'success' \| 'info';\n /\n The heading tag to render the provided heading as. This is agnostic to the styling of the heading.\n * @default 'h2'\n /\n headingTag?: HeadingTag;\n /* Pass one or more descriptive messages to inform the user. /\n messages: (string \| BannerMessage)[];\n /* Callback when user explicitly dismisses the Banner. /\n onDismiss?: MouseEventHandler;\n /* Ref that can be used to access the imperative handle. /\n handle?: Ref<BannerHandleValue>;\n }\n>;\n\nexport const StyledBanner = styled.div<{ headingTag: BannerProps['headingTag'] }>(\n ({ headingTag, theme }) => {\n return css`\n border-radius: ${theme.components.card['border-radius']};\n\n &:has(${headingTag}:focus) {\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n }\n);\n\nStyledBanner.defaultProps = defaultThemeProp;\n\nexport const StyledBannerStatus = styled.div<Pick<BannerProps, 'variant'>>(({ variant, theme }) => {\n const { background } = theme.components.banner[variant];\n const color = tryCatch(() =>\n getContrast(background, theme.base.palette['primary-background']) >= 3\n ? theme.base.palette['primary-background']\n : readableColor(background)\n );\n\n return css`\n background-color: ${background};\n color: ${color};\n border-start-start-radius: inherit;\n border-end-start-radius: inherit;\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n border-inline-end: none;\n font-size: 1.25rem;\n `;\n});\n\nStyledBannerStatus.defaultProps = defaultThemeProp;\n\nexport const StyledBannerHeader = styled.div(({ theme }) => {\n const { rtl } = useDirection();\n\n return css`\n min-height: 2.125rem;\n\n ${StyledButton}[aria-expanded] {\n ${StyledIcon} {\n transition: rotate ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n }\n\n &[aria-expanded='true'] ${StyledIcon} {\n rotate: 90deg;\n }\n\n &[aria-expanded='false'] ${StyledIcon} {\n rotate: ${rtl ? 180 : 0}deg;\n }\n }\n `;\n});\n\nStyledBannerHeader.defaultProps = defaultThemeProp;\n\nexport const StyledBannerContent = styled.div<{ expandable?: boolean }>(({ expandable, theme }) => {\n return css`\n background: ${theme.components.card.background};\n padding-block: calc(0.5 ${theme.base.spacing});\n padding-inline-start: calc(${expandable ? 0.5 : 2} * ${theme.base.spacing});\n padding-inline-end: calc(0.5 * ${theme.base.spacing});\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n border-inline-start: none;\n border-start-end-radius: inherit;\n border-end-end-radius: inherit;\n `;\n});\n\nStyledBannerContent.defaultProps = defaultThemeProp;\n\nexport const StyledBannerMessageList = styled(UnorderedList)(\n ({ theme }) => css`\n padding-block-end: calc(0.5 * ${theme.base.spacing});\n padding-inline-start: calc(5 * ${theme.base.spacing});\n padding-inline-end: calc(2 * ${theme.base.spacing});\n `\n);\n\nStyledBannerMessageList.defaultProps = defaultThemeProp;\n\nexport const StyledBannerMessage = styled.span`\n overflow-wrap: break-word;\n list-style: none;\n`;\n\nStyledBannerMessage.defaultProps = defaultThemeProp;\n\nconst BannerMessageItem = forwardRef<\n HTMLLIElement,\n TestIdProp & OmitStrict<BannerMessage, 'items'> & ForwardProps\n>(function BannerMessageItem({ testId, label, description, action, ...restProps }, ref) {\n const testIds = useTestIds(testId, getBannerTestIds);\n\n return (\n <StyledBannerMessage {...restProps} ref={ref}>\n <span data-testid={testIds.messageLabel}>{label}</span>\n {description && (\n <>\n {' '}\n <Text data-testid={testIds.messageDescription} variant='secondary'>\n {description}\n </Text>\n </>\n )}\n {action && (\n <>\n {' '}\n <Text variant='secondary'>\n <Button\n data-testid={testIds.messageAction}\n variant='link'\n href={action.href}\n onClick={action.onClick}\n {...action}\n >\n {action.text}\n </Button>\n </Text>\n </>\n )}\n </StyledBannerMessage>\n );\n});\n\nconst prepareMessages = (\n messages: (string \| BannerMessage)[],\n testId: TestIdProp['testId']\n): [messages: ReactNode[], count: number] => {\n let count = 0;\n\n return [\n messages.flatMap(msg => {\n count += 1;\n\n if (typeof msg === 'string') {\n return [<BannerMessageItem label={msg} />];\n }\n\n if (msg.items) {\n const { items, ...restMsg } = msg;\n const [subMessages, subCount] = prepareMessages(items, testId);\n count += subCount;\n return [<BannerMessageItem {...restMsg} testId={testId} />, subMessages];\n }\n\n return [<BannerMessageItem {...msg} testId={testId} />];\n }),\n count\n ];\n};\n\nexport default withTestIds(\n forwardRef<RefElement<BannerProps>, PropsWithoutRef<BannerProps>>(function Banner(\n { testId, variant, headingTag = 'h2', messages, onDismiss, handle, ...restProps },\n ref\n ) {\n const testIds = useTestIds(testId, getBannerTestIds);\n const [messagesToRender, count] = useMemo(() => prepareMessages(messages, testId), [messages]);\n const t = useI18n();\n const [collapsed, setCollapsed] = useState(count > 2);\n\n const bannerRef = useConsolidatedRef(ref);\n\n let role: string;\n let icon: string;\n let heading: string;\n let ariaLive: string;\n\n switch (variant) {\n case 'urgent':\n heading = t('error');\n icon = 'warn-solid';\n role = 'alert';\n ariaLive = 'assertive';\n break;\n case 'warning':\n heading = t('warning');\n icon = 'flag-wave-solid';\n role = 'alert';\n ariaLive = 'assertive';\n break;\n case 'success':\n heading = t('success');\n icon = 'check';\n role = 'none';\n ariaLive = 'polite';\n break;\n case 'info':\n default:\n heading = t('information');\n icon = 'information-solid';\n role = 'none';\n ariaLive = 'polite';\n break;\n }\n\n useImperativeHandle(\n handle,\n () => ({\n focus: () => {\n // Empty timeout ensures that the banner will take focus after any other programmatic focus events\n setTimeout(() => {\n if (bannerRef.current) {\n focusHeadingOrContainer(bannerRef.current, heading);\n }\n });\n }\n }),\n []\n );\n\n return (\n <Grid\n data-testid={testIds.root}\n {...restProps}\n as={StyledBanner}\n container={{ cols: '2rem minmax(0, 1fr)' }}\n role={role}\n aria-live={ariaLive}\n headingTag={headingTag}\n ref={bannerRef}\n >\n <Flex\n as={StyledBannerStatus}\n container={{ justify: 'center', alignItems: 'start', pad: [1.5, 0] }}\n variant={variant}\n >\n <Icon name={icon} />\n </Flex>\n {count === 1 ? (\n <Flex container={{ alignItems: 'start' }} as={StyledBannerContent}>\n <VisuallyHiddenText as={headingTag}>{`${heading} ${count}`}</VisuallyHiddenText>\n <Flex item={{ alignSelf: 'center', grow: 1 }} as='ul'>\n {typeof messages[0] === 'string' ? (\n <BannerMessageItem testId={testId} label={messages[0]} as='li' />\n ) : (\n <BannerMessageItem {...messages[0]} testId={testId} as='li' />\n )}\n </Flex>\n {onDismiss && (\n <Button\n data-testid={testIds.dismiss}\n onClick={onDismiss}\n label={t('dismiss')}\n aria-label={t('banner_dismiss_button_label_a11y')}\n variant='simple'\n icon\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n ) : (\n <StyledBannerContent expandable>\n <Grid\n as={StyledBannerHeader}\n container={{ cols: 'auto 1fr auto', areas: '\"toggle heading dismiss\"', gap: 0.5 }}\n >\n <Grid\n data-testid={testIds.heading}\n container={{ cols: 'min-content min-content', gap: 0.5, alignItems: 'center' }}\n item={{ area: 'heading', alignSelf: 'center' }}\n as={Text}\n forwardedAs={headingTag}\n variant='h2'\n >\n {heading} <Count>{count}</Count>\n </Grid>\n <Grid item={{ area: 'toggle', alignSelf: 'center' }}>\n <Button\n data-testid={testIds.expandCollapse}\n onClick={() => {\n setCollapsed(cur => !cur);\n }}\n label={t(collapsed ? 'expand' : 'collapse')}\n aria-expanded={collapsed ? 'false' : 'true'}\n variant='simple'\n icon\n >\n <Icon name='caret-right' />\n </Button>\n </Grid>\n <Grid item={{ area: 'dismiss', alignSelf: 'center' }}>\n {onDismiss && (\n <Button\n data-testid={testIds.dismiss}\n onClick={onDismiss}\n label={t('dismiss')}\n aria-label={t('banner_dismiss_button_label_a11y')}\n variant='simple'\n icon\n >\n <Icon name='times' />\n </Button>\n )}\n </Grid>\n </Grid>\n <ExpandCollapse collapsed={collapsed}>\n <StyledBannerMessageList items={messagesToRender} />\n </ExpandCollapse>\n </StyledBannerContent>\n )}\n </Grid>\n );\n }),\n getBannerTestIds\n);\n"]}

package/lib/components/Button/Button.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,iBAAiB,EACjB,SAAS,EAET,GAAG,EAGJ,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGtD,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;~~AAWtF~~,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,MAAM;IACpD,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2FAA2F;IAC3F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IAC/D;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;IACrC;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,KAAK,uBAAuB,GAAG,iBAAiB,CAC9C,WAAW,EACX,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,CACrD,CAAC;AAgDF,eAAO,MAAM,YAAY,~~qGAyLxB~~,CAAC;AAIF,eAAO,MAAM,gBAAgB,~~gGA6C5B~~,CAAC;AAIF,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAyExD,CAAC;AAEH,eAAe,MAAM,CAAC"}
1	+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,iBAAiB,EACjB,SAAS,EAET,GAAG,EAGJ,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGtD,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAiBtF,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,MAAM;IACpD,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2FAA2F;IAC3F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IAC/D;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;IACrC;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,KAAK,uBAAuB,GAAG,iBAAiB,CAC9C,WAAW,EACX,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,CACrD,CAAC;AAgDF,eAAO,MAAM,YAAY,qGAsPxB,CAAC;AAIF,eAAO,MAAM,gBAAgB,gGAkD5B,CAAC;AAIF,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAyExD,CAAC;AAEH,eAAe,MAAM,CAAC"}