@pega/cosmos-react-core 10.0.0-build.1.0 → 10.0.0-build.1.2

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 (42) hide show
  1. package/lib/components/AppShell/AppHeader.styles.js +2 -2
  2. package/lib/components/AppShell/AppHeader.styles.js.map +1 -1
  3. package/lib/components/AppShell/AppShell.styles.js +14 -14
  4. package/lib/components/AppShell/AppShell.styles.js.map +1 -1
  5. package/lib/components/AppShell/AppShellList.styles.js +2 -2
  6. package/lib/components/AppShell/AppShellList.styles.js.map +1 -1
  7. package/lib/components/AppShell/AppShellSearch.styles.js +1 -1
  8. package/lib/components/AppShell/AppShellSearch.styles.js.map +1 -1
  9. package/lib/components/AppShell/Drawer.styles.js +1 -1
  10. package/lib/components/AppShell/Drawer.styles.js.map +1 -1
  11. package/lib/components/Button/Button.js +2 -2
  12. package/lib/components/Button/Button.js.map +1 -1
  13. package/lib/components/Card/Card.js +2 -2
  14. package/lib/components/Card/Card.js.map +1 -1
  15. package/lib/components/DateTime/Picker/TimePicker.js +2 -2
  16. package/lib/components/DateTime/Picker/TimePicker.js.map +1 -1
  17. package/lib/components/File/FileInput.styles.js +1 -1
  18. package/lib/components/File/FileInput.styles.js.map +1 -1
  19. package/lib/components/FormControl/FormControl.js +1 -1
  20. package/lib/components/FormControl/FormControl.js.map +1 -1
  21. package/lib/components/Link/Link.js +1 -1
  22. package/lib/components/Link/Link.js.map +1 -1
  23. package/lib/components/Location/LocationView.styles.js +2 -2
  24. package/lib/components/Location/LocationView.styles.js.map +1 -1
  25. package/lib/components/Menu/Menu.styles.js +3 -3
  26. package/lib/components/Menu/Menu.styles.js.map +1 -1
  27. package/lib/components/Menu/MenuItem.d.ts.map +1 -1
  28. package/lib/components/Menu/MenuItem.js +3 -1
  29. package/lib/components/Menu/MenuItem.js.map +1 -1
  30. package/lib/components/Modal/MinimizedModal.js +1 -1
  31. package/lib/components/Modal/MinimizedModal.js.map +1 -1
  32. package/lib/components/MultiStepForm/FormProgress.styles.js +1 -1
  33. package/lib/components/MultiStepForm/FormProgress.styles.js.map +1 -1
  34. package/lib/components/SearchInput/SearchInput.styles.js +3 -3
  35. package/lib/components/SearchInput/SearchInput.styles.js.map +1 -1
  36. package/lib/components/SelectionCard/SelectionCard.styles.js +2 -2
  37. package/lib/components/SelectionCard/SelectionCard.styles.js.map +1 -1
  38. package/lib/components/Toaster/Toaster.js +2 -2
  39. package/lib/components/Toaster/Toaster.js.map +1 -1
  40. package/lib/i18n/default.js +1 -1
  41. package/lib/i18n/default.js.map +1 -1
  42. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"SelectionCard.styles.js","sourceRoot":"","sources":["../../../src/components/SelectionCard/SelectionCard.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css, type DefaultTheme } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { lineClamp } from '../../styles/mixins';\nimport { calculateFontSize } from '../../styles/utils';\nimport { StyledPseudoRadioCheck } from '../RadioCheck/RadioCheck';\nimport { StyledFieldValueList, StyledStackedFieldValue } from '../FieldValueList';\nimport { StyledIcon } from '../Icon';\n\nimport type { ImagePlacement, ImageSize, SelectionCardProps } from './SelectionCard.types';\n\nconst imageContainerSizes = {\n small: '2.75rem',\n large: '8.875rem',\n flexible: 'minmax(2.5rem, auto)'\n} as const;\n\nexport const StyledSelectionCard = styled.div<\n Pick<SelectionCardProps, 'disabled' | 'onClick' | 'readOnly'>\n>(\n ({\n disabled,\n readOnly,\n onClick,\n theme: {\n base: { palette, 'disabled-opacity': disabledOpacity },\n components: {\n card,\n 'form-control': {\n ':focus': { 'box-shadow': shadow, 'border-color': focusBorderColor },\n ':hover': { 'border-color': hoverBorderColor }\n }\n }\n }\n }) => {\n return css`\n min-width: min-content;\n max-width: max-content;\n background-color: ${card.background};\n border-radius: ${card['border-radius']};\n border: 0.0625rem solid ${palette['border-line']};\n\n ${disabled &&\n css`\n cursor: not-allowed;\n opacity: ${disabledOpacity};\n `}\n\n ${!disabled &&\n css`\n &:focus {\n & ${StyledPseudoRadioCheck} {\n box-shadow: ${shadow};\n border-color: ${focusBorderColor};\n }\n }\n\n &:focus,\n &:not([data-main-focus]):focus-within {\n box-shadow: ${shadow};\n border-color: transparent;\n outline: none;\n }\n `}\n\n ${!disabled &&\n onClick &&\n css`\n cursor: pointer;\n `}\n\n ${!disabled &&\n !readOnly &&\n onClick &&\n css`\n &:hover:not(:focus-within) {\n border-color: ${hoverBorderColor};\n }\n `}\n `;\n }\n);\n\nStyledSelectionCard.defaultProps = defaultThemeProp;\n\nexport const StyledSelectionCardInline = styled(StyledSelectionCard)<{\n placement?: Extract<ImagePlacement, 'inline-start' | 'inline-end'>;\n size?: ImageSize;\n}>(({ placement = 'inline-start', size = 'large' }) => {\n const imageContainerSize = imageContainerSizes[size];\n return css`\n /* stylelint-disable-next-line unit-allowed-list */\n grid-template-columns: ${placement === 'inline-end'\n ? `1fr ${imageContainerSize}`\n : `${imageContainerSize} 1fr`};\n grid-template-rows: minmax(2.75rem, auto);\n `;\n});\n\nStyledSelectionCardInline.defaultProps = defaultThemeProp;\n\nexport const StyledSelectionCardStacked = styled(StyledSelectionCard)<{ size?: ImageSize }>(({\n size = 'large'\n}) => {\n let containerSize;\n switch (size) {\n case 'small':\n containerSize = '2.5rem';\n break;\n case 'large':\n containerSize = '15.125rem';\n break;\n default:\n containerSize = 'minmax(2.5rem, 15.125rem)';\n }\n return css`\n grid-template-columns: minmax(2.75rem, 1fr);\n grid-template-rows: ${containerSize} auto;\n `;\n});\n\nexport const StyledImageCell = styled.div<{\n placement?: ImagePlacement;\n size?: ImageSize;\n isTile?: boolean;\n}>(\n ({\n theme: {\n base: { palette, transparency },\n components: {\n card: { 'border-radius': borderRadius }\n }\n },\n placement = 'inline-start',\n size = 'flexible',\n isTile\n }) => {\n return css`\n ${isTile\n ? css`\n overflow: hidden;\n `\n : css`\n background-color: ${palette['app-background']};\n position: relative;\n `}\n\n ${size === 'flexible' &&\n placement !== 'block-start' &&\n css`\n max-width: 8.875rem;\n min-height: 100%;\n height: var(--content-height, auto);\n `};\n\n /* Recalculation of the border radius by substracting border width */\n ${placement === 'inline-start' &&\n css`\n border-start-start-radius: calc(${borderRadius} - 0.0625rem);\n border-end-start-radius: calc(${borderRadius} - 0.0625rem);\n `}\n\n ${placement === 'inline-end' &&\n css`\n border-end-end-radius: calc(${borderRadius} - 0.0625rem);\n border-start-end-radius: calc(${borderRadius} - 0.0625rem);\n `}\n\n ${placement === 'block-start' &&\n css`\n border-start-start-radius: calc(${borderRadius} - 0.0625rem);\n border-start-end-radius: calc(${borderRadius} - 0.0625rem);\n `}\n\n ${!isTile &&\n css`\n &::before {\n content: '';\n position: absolute;\n inset: 0;\n background: var(--bg-image) center / cover no-repeat;\n filter: blur(1rem);\n opacity: ${transparency['transparent-4']};\n pointer-events: none;\n clip-path: inset(0);\n }\n `}\n `;\n }\n);\n\nStyledImageCell.defaultProps = defaultThemeProp;\n\nexport const StyledContentCell = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nexport const StyledImageContainer = styled.div<{\n placement?: ImagePlacement;\n size?: ImageSize;\n}>(\n ({\n theme: {\n base: { transparency, spacing },\n components: {\n card: { 'border-radius': borderRadius }\n }\n },\n placement = 'inline-start',\n size = 'flexible'\n }) => {\n return css`\n aspect-ratio: 4 / 5;\n max-height: 100%;\n min-height: 2rem;\n min-width: 2rem;\n position: relative;\n padding: min(${spacing}, 10%);\n\n img {\n max-width: 100%;\n max-height: 100%;\n box-shadow: 0 0 0.5rem 0 rgba(0, 0, 0, ${transparency['transparent-5']});\n border-radius: calc(${borderRadius} / 2);\n }\n\n ${placement === 'block-start' &&\n css`\n aspect-ratio: 16 / 9;\n > img {\n max-height: 100%;\n }\n `}\n\n ${size === 'flexible' &&\n css`\n min-height: 100%;\n `}\n\n ${size === 'large' &&\n css`\n min-height: 11.0625rem;\n `}\n\n ${size === 'small' &&\n css`\n aspect-ratio: 1 / 1;\n\n > img {\n max-width: 2rem;\n max-height: 2rem;\n }\n `}\n\n ${StyledIcon} {\n opacity: ${transparency['transparent-3']};\n }\n `;\n }\n);\n\nStyledImageContainer.defaultProps = defaultThemeProp;\n\nexport const StyledValueList = styled.ul`\n width: 100%;\n list-style-type: none;\n`;\n\nexport const StyledHeader = styled.div`\n width: 100%;\n`;\n\nexport const StyledContentContainer = styled.div(({ theme }) => {\n return css`\n padding: ${theme.base.spacing} calc(1.5 * ${theme.base.spacing});\n overflow-wrap: break-word;\n\n > ${StyledHeader} {\n min-height: 2rem;\n }\n\n ${StyledValueList}, ${StyledFieldValueList} {\n margin-block-end: calc(0.75 * ${theme.base.spacing});\n }\n\n ${StyledStackedFieldValue} {\n grid-column: 1 / -1;\n }\n `;\n});\n\nStyledContentContainer.defaultProps = defaultThemeProp;\n\nexport const StyledTileContent = styled.div<{\n foregroundColor: string;\n backgroundColor: string;\n size?: ImageSize;\n}>(({ theme, foregroundColor, backgroundColor, size = 'large' }) => {\n const fg = foregroundColor;\n const bg = backgroundColor;\n const { l: fontSizeL, xs: fontSizeXs } = calculateFontSize(\n theme.base['font-size'],\n theme.base['font-scale']\n );\n const {\n components: {\n icon: { size: iconSize }\n }\n } = theme;\n return css`\n display: flex;\n align-items: center;\n justify-content: center;\n padding: calc(1.5 * ${theme.base.spacing});\n width: 100%;\n height: 100%;\n background: ${bg};\n color: ${fg};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n font-size: ${fontSizeL};\n\n ${StyledIcon} {\n width: ${iconSize.s};\n height: ${iconSize.s};\n color: inherit;\n }\n\n ${size === 'small' &&\n css`\n padding: ${theme.base.spacing};\n font-size: ${fontSizeXs};\n `}\n `;\n});\n\nStyledTileContent.defaultProps = defaultThemeProp;\n\nexport const StyledCardFooter = styled.div(({ theme }) => {\n return css`\n margin-block-start: auto;\n padding-inline: calc(1.5 * ${theme.base.spacing});\n padding-block-end: ${theme.base.spacing};\n `;\n});\n\nStyledCardFooter.defaultProps = defaultThemeProp;\n\nexport const StyledSingleField = styled.div<{ truncate?: boolean }>`\n ${({ truncate }) => truncate && lineClamp(2)}\n`;\n\nexport const getBaseCardContainerStyles = (theme: DefaultTheme) => {\n return css`\n display: grid;\n gap: ${theme.base.spacing};\n grid-template-columns: repeat(\n auto-fit,\n minmax(min(${theme.base['content-width'].sm}, 100%), 1fr)\n );\n grid-auto-rows: minmax(2.75rem, auto);\n\n > ${StyledSelectionCard} {\n max-width: 100%;\n }\n `;\n};\n\nconst getInlineCardColumnTrack = ({\n placement,\n size,\n contentWidth\n}: {\n placement: Extract<ImagePlacement, 'inline-start' | 'inline-end'>;\n size: ImageSize;\n contentWidth: string;\n}): string => {\n const imageContainerSize = imageContainerSizes[size];\n return placement === 'inline-end'\n ? `minmax(20ch, ${contentWidth}) 1fr ${imageContainerSize}`\n : `${imageContainerSize} minmax(20ch, ${contentWidth}) 1fr`;\n};\n\nexport const getInlineImageCardContainerStyles = (\n theme: DefaultTheme,\n {\n placement,\n size\n }: {\n placement: Extract<ImagePlacement, 'inline-start' | 'inline-end'>;\n size: ImageSize;\n }\n) => {\n const columnTrack = getInlineCardColumnTrack({\n placement,\n size,\n contentWidth: theme.base['content-width'].sm\n });\n const singleCardSize = `calc(${theme.base['content-width'].sm} + ${imageContainerSizes[size === 'small' ? 'small' : 'large']})`;\n return css`\n display: grid;\n gap: ${theme.base.spacing};\n grid-template-columns: ${columnTrack};\n\n @container (min-width: calc(2 * ${singleCardSize})) {\n grid-template-columns: repeat(2, ${columnTrack});\n }\n\n @container (min-width: calc(3 * ${singleCardSize})) {\n grid-template-columns: repeat(3, ${columnTrack});\n }\n\n @container (min-width: calc(4 * ${singleCardSize})) {\n grid-template-columns: repeat(4, ${columnTrack});\n }\n\n > ${StyledSelectionCard} {\n grid-template-columns: subgrid;\n grid-column: span 3;\n column-gap: 0;\n\n ${StyledImageCell} {\n grid-column: ${placement === 'inline-start' ? '1 / 2' : '3 / 4'};\n }\n\n ${StyledContentCell} {\n grid-column: span 2;\n }\n }\n `;\n};\n"]}
1
+ {"version":3,"file":"SelectionCard.styles.js","sourceRoot":"","sources":["../../../src/components/SelectionCard/SelectionCard.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css, type DefaultTheme } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { lineClamp } from '../../styles/mixins';\nimport { calculateFontSize } from '../../styles/utils';\nimport { StyledPseudoRadioCheck } from '../RadioCheck/RadioCheck';\nimport { StyledFieldValueList, StyledStackedFieldValue } from '../FieldValueList';\nimport { StyledIcon } from '../Icon';\n\nimport type { ImagePlacement, ImageSize, SelectionCardProps } from './SelectionCard.types';\n\nconst imageContainerSizes = {\n small: '2.75rem',\n large: '8.875rem',\n flexible: 'minmax(2.5rem, auto)'\n} as const;\n\nexport const StyledSelectionCard = styled.div<\n Pick<SelectionCardProps, 'disabled' | 'onClick' | 'readOnly'>\n>(\n ({\n disabled,\n readOnly,\n onClick,\n theme: {\n base: { palette, 'disabled-opacity': disabledOpacity },\n components: {\n card,\n 'form-control': {\n ':focus': { 'box-shadow': shadow, 'border-color': focusBorderColor },\n ':hover': { 'border-color': hoverBorderColor }\n }\n }\n }\n }) => {\n return css`\n min-width: min-content;\n max-width: max-content;\n background-color: ${card.background};\n border-radius: ${card['border-radius']};\n border: 0.0625rem solid ${palette['border-line']};\n\n ${disabled &&\n css`\n cursor: not-allowed;\n opacity: ${disabledOpacity};\n `}\n\n ${!disabled &&\n css`\n &:focus-visible {\n & ${StyledPseudoRadioCheck} {\n box-shadow: ${shadow};\n border-color: ${focusBorderColor};\n }\n }\n\n &:focus-visible,\n &:not([data-main-focus]):focus-within {\n box-shadow: ${shadow};\n border-color: transparent;\n outline: none;\n }\n `}\n\n ${!disabled &&\n onClick &&\n css`\n cursor: pointer;\n `}\n\n ${!disabled &&\n !readOnly &&\n onClick &&\n css`\n &:hover:not(:focus-within) {\n border-color: ${hoverBorderColor};\n }\n `}\n `;\n }\n);\n\nStyledSelectionCard.defaultProps = defaultThemeProp;\n\nexport const StyledSelectionCardInline = styled(StyledSelectionCard)<{\n placement?: Extract<ImagePlacement, 'inline-start' | 'inline-end'>;\n size?: ImageSize;\n}>(({ placement = 'inline-start', size = 'large' }) => {\n const imageContainerSize = imageContainerSizes[size];\n return css`\n /* stylelint-disable-next-line unit-allowed-list */\n grid-template-columns: ${placement === 'inline-end'\n ? `1fr ${imageContainerSize}`\n : `${imageContainerSize} 1fr`};\n grid-template-rows: minmax(2.75rem, auto);\n `;\n});\n\nStyledSelectionCardInline.defaultProps = defaultThemeProp;\n\nexport const StyledSelectionCardStacked = styled(StyledSelectionCard)<{ size?: ImageSize }>(({\n size = 'large'\n}) => {\n let containerSize;\n switch (size) {\n case 'small':\n containerSize = '2.5rem';\n break;\n case 'large':\n containerSize = '15.125rem';\n break;\n default:\n containerSize = 'minmax(2.5rem, 15.125rem)';\n }\n return css`\n grid-template-columns: minmax(2.75rem, 1fr);\n grid-template-rows: ${containerSize} auto;\n `;\n});\n\nexport const StyledImageCell = styled.div<{\n placement?: ImagePlacement;\n size?: ImageSize;\n isTile?: boolean;\n}>(\n ({\n theme: {\n base: { palette, transparency },\n components: {\n card: { 'border-radius': borderRadius }\n }\n },\n placement = 'inline-start',\n size = 'flexible',\n isTile\n }) => {\n return css`\n ${isTile\n ? css`\n overflow: hidden;\n `\n : css`\n background-color: ${palette['app-background']};\n position: relative;\n `}\n\n ${size === 'flexible' &&\n placement !== 'block-start' &&\n css`\n max-width: 8.875rem;\n min-height: 100%;\n height: var(--content-height, auto);\n `};\n\n /* Recalculation of the border radius by substracting border width */\n ${placement === 'inline-start' &&\n css`\n border-start-start-radius: calc(${borderRadius} - 0.0625rem);\n border-end-start-radius: calc(${borderRadius} - 0.0625rem);\n `}\n\n ${placement === 'inline-end' &&\n css`\n border-end-end-radius: calc(${borderRadius} - 0.0625rem);\n border-start-end-radius: calc(${borderRadius} - 0.0625rem);\n `}\n\n ${placement === 'block-start' &&\n css`\n border-start-start-radius: calc(${borderRadius} - 0.0625rem);\n border-start-end-radius: calc(${borderRadius} - 0.0625rem);\n `}\n\n ${!isTile &&\n css`\n &::before {\n content: '';\n position: absolute;\n inset: 0;\n background: var(--bg-image) center / cover no-repeat;\n filter: blur(1rem);\n opacity: ${transparency['transparent-4']};\n pointer-events: none;\n clip-path: inset(0);\n }\n `}\n `;\n }\n);\n\nStyledImageCell.defaultProps = defaultThemeProp;\n\nexport const StyledContentCell = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nexport const StyledImageContainer = styled.div<{\n placement?: ImagePlacement;\n size?: ImageSize;\n}>(\n ({\n theme: {\n base: { transparency, spacing },\n components: {\n card: { 'border-radius': borderRadius }\n }\n },\n placement = 'inline-start',\n size = 'flexible'\n }) => {\n return css`\n aspect-ratio: 4 / 5;\n max-height: 100%;\n min-height: 2rem;\n min-width: 2rem;\n position: relative;\n padding: min(${spacing}, 10%);\n\n img {\n max-width: 100%;\n max-height: 100%;\n box-shadow: 0 0 0.5rem 0 rgba(0, 0, 0, ${transparency['transparent-5']});\n border-radius: calc(${borderRadius} / 2);\n }\n\n ${placement === 'block-start' &&\n css`\n aspect-ratio: 16 / 9;\n > img {\n max-height: 100%;\n }\n `}\n\n ${size === 'flexible' &&\n css`\n min-height: 100%;\n `}\n\n ${size === 'large' &&\n css`\n min-height: 11.0625rem;\n `}\n\n ${size === 'small' &&\n css`\n aspect-ratio: 1 / 1;\n\n > img {\n max-width: 2rem;\n max-height: 2rem;\n }\n `}\n\n ${StyledIcon} {\n opacity: ${transparency['transparent-3']};\n }\n `;\n }\n);\n\nStyledImageContainer.defaultProps = defaultThemeProp;\n\nexport const StyledValueList = styled.ul`\n width: 100%;\n list-style-type: none;\n`;\n\nexport const StyledHeader = styled.div`\n width: 100%;\n`;\n\nexport const StyledContentContainer = styled.div(({ theme }) => {\n return css`\n padding: ${theme.base.spacing} calc(1.5 * ${theme.base.spacing});\n overflow-wrap: break-word;\n\n > ${StyledHeader} {\n min-height: 2rem;\n }\n\n ${StyledValueList}, ${StyledFieldValueList} {\n margin-block-end: calc(0.75 * ${theme.base.spacing});\n }\n\n ${StyledStackedFieldValue} {\n grid-column: 1 / -1;\n }\n `;\n});\n\nStyledContentContainer.defaultProps = defaultThemeProp;\n\nexport const StyledTileContent = styled.div<{\n foregroundColor: string;\n backgroundColor: string;\n size?: ImageSize;\n}>(({ theme, foregroundColor, backgroundColor, size = 'large' }) => {\n const fg = foregroundColor;\n const bg = backgroundColor;\n const { l: fontSizeL, xs: fontSizeXs } = calculateFontSize(\n theme.base['font-size'],\n theme.base['font-scale']\n );\n const {\n components: {\n icon: { size: iconSize }\n }\n } = theme;\n return css`\n display: flex;\n align-items: center;\n justify-content: center;\n padding: calc(1.5 * ${theme.base.spacing});\n width: 100%;\n height: 100%;\n background: ${bg};\n color: ${fg};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n font-size: ${fontSizeL};\n\n ${StyledIcon} {\n width: ${iconSize.s};\n height: ${iconSize.s};\n color: inherit;\n }\n\n ${size === 'small' &&\n css`\n padding: ${theme.base.spacing};\n font-size: ${fontSizeXs};\n `}\n `;\n});\n\nStyledTileContent.defaultProps = defaultThemeProp;\n\nexport const StyledCardFooter = styled.div(({ theme }) => {\n return css`\n margin-block-start: auto;\n padding-inline: calc(1.5 * ${theme.base.spacing});\n padding-block-end: ${theme.base.spacing};\n `;\n});\n\nStyledCardFooter.defaultProps = defaultThemeProp;\n\nexport const StyledSingleField = styled.div<{ truncate?: boolean }>`\n ${({ truncate }) => truncate && lineClamp(2)}\n`;\n\nexport const getBaseCardContainerStyles = (theme: DefaultTheme) => {\n return css`\n display: grid;\n gap: ${theme.base.spacing};\n grid-template-columns: repeat(\n auto-fit,\n minmax(min(${theme.base['content-width'].sm}, 100%), 1fr)\n );\n grid-auto-rows: minmax(2.75rem, auto);\n\n > ${StyledSelectionCard} {\n max-width: 100%;\n }\n `;\n};\n\nconst getInlineCardColumnTrack = ({\n placement,\n size,\n contentWidth\n}: {\n placement: Extract<ImagePlacement, 'inline-start' | 'inline-end'>;\n size: ImageSize;\n contentWidth: string;\n}): string => {\n const imageContainerSize = imageContainerSizes[size];\n return placement === 'inline-end'\n ? `minmax(20ch, ${contentWidth}) 1fr ${imageContainerSize}`\n : `${imageContainerSize} minmax(20ch, ${contentWidth}) 1fr`;\n};\n\nexport const getInlineImageCardContainerStyles = (\n theme: DefaultTheme,\n {\n placement,\n size\n }: {\n placement: Extract<ImagePlacement, 'inline-start' | 'inline-end'>;\n size: ImageSize;\n }\n) => {\n const columnTrack = getInlineCardColumnTrack({\n placement,\n size,\n contentWidth: theme.base['content-width'].sm\n });\n const singleCardSize = `calc(${theme.base['content-width'].sm} + ${imageContainerSizes[size === 'small' ? 'small' : 'large']})`;\n return css`\n display: grid;\n gap: ${theme.base.spacing};\n grid-template-columns: ${columnTrack};\n\n @container (min-width: calc(2 * ${singleCardSize})) {\n grid-template-columns: repeat(2, ${columnTrack});\n }\n\n @container (min-width: calc(3 * ${singleCardSize})) {\n grid-template-columns: repeat(3, ${columnTrack});\n }\n\n @container (min-width: calc(4 * ${singleCardSize})) {\n grid-template-columns: repeat(4, ${columnTrack});\n }\n\n > ${StyledSelectionCard} {\n grid-template-columns: subgrid;\n grid-column: span 3;\n column-gap: 0;\n\n ${StyledImageCell} {\n grid-column: ${placement === 'inline-start' ? '1 / 2' : '3 / 4'};\n }\n\n ${StyledContentCell} {\n grid-column: span 2;\n }\n }\n `;\n};\n"]}
@@ -31,7 +31,7 @@ const StyledToastButton = styled.button(({ theme }) => css `
31
31
  background: #ffffff19;
32
32
  }
33
33
 
34
- &:enabled:focus {
34
+ &:enabled:focus-visible {
35
35
  box-shadow: ${theme.base.shadow.focus};
36
36
  }
37
37
  `);
@@ -69,7 +69,7 @@ const StyledToast = styled.div(({ theme }) => {
69
69
  transition-timing-function: ${theme.base.animation.timing.ease};
70
70
  font-weight: ${theme.base['font-weight']['semi-bold']};
71
71
 
72
- :focus {
72
+ :focus-visible {
73
73
  box-shadow: ${theme.base.shadow.focus};
74
74
  }
75
75
 
@@ -1 +1 @@
1
- {"version":3,"file":"Toaster.js","sourceRoot":"","sources":["../../../src/components/Toaster/Toaster.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useContext,\n useReducer,\n useMemo,\n useLayoutEffect,\n useRef,\n useState,\n forwardRef,\n useEffect\n} from 'react';\nimport type {\n FunctionComponent,\n CSSProperties,\n TransitionEvent,\n Context,\n PropsWithoutRef,\n Ref,\n Dispatch\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport Link, { StyledLink } from '../Link';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport {\n createUID,\n windowIsAvailable,\n withTestIds,\n hasProp,\n getActiveElement,\n getFocusables\n} from '../../utils';\nimport {\n useConfiguration,\n useI18n,\n useLiveLog,\n useOS,\n useShortcut,\n useTestIds,\n useConsolidatedRef,\n useEscape,\n useFocusWithin\n} from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport '../../init';\nimport { registerAction } from '../ShortcutManager';\nimport { Keyboard } from '../Badges';\nimport { StyledKeyboard } from '../Badges/Keyboard';\n\nimport type { ToastMessage, ToasterProps, BaseToastMessage, CreatedMessage } from './Toaster.types';\nimport { ToasterContext } from './Context';\nimport type { ToasterContextValue } from './Context';\nimport { getToasterTestIds } from './Toaster.test-ids';\n\nregisterIcon(timesIcon);\nregisterAction(\n { id: 'JumpToToast', defaultKeyBinding: 'Alt+Enter' },\n { id: 'DismissToast', defaultKeyBinding: 'Alt+Q' }\n);\n\ntype ToastState = (BaseToastMessage | CreatedMessage) & {\n id: NonNullable<ToastMessage['id']>;\n dismissAfter?: number;\n};\n\ntype ToastReducerAction =\n | { type: 'push'; payload: ToastState }\n | { type: 'unmount'; payload: ToastState['id'] };\n\ntype ToastProps = ToastState & {\n // determines if this is the first toast in the list, used to dismiss the first toast with a shortcut, not exposed outside\n firstToast: boolean;\n topLevelDismiss: ToasterProps['onDismiss'];\n translateY: number;\n dispatch: Dispatch<ToastReducerAction>;\n ref: Ref<HTMLDivElement>;\n};\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n toasterContext?: Context<ToasterContextValue>;\n }\n}\n\nconst StyledToastButton = styled.button(\n ({ theme }) => css`\n border: none;\n color: inherit;\n padding: 0;\n font-size: 1rem;\n margin-block: calc(${theme.base.spacing} / 2);\n margin-inline-end: calc(${theme.base.spacing} / 2);\n\n &:enabled:hover {\n background: #ffffff19;\n }\n\n &:enabled:focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `\n);\n\nStyledToastButton.defaultProps = defaultThemeProp;\n\nconst StyledToastContent = styled.div(({ theme }) => {\n return css`\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: clip;\n text-overflow: ellipsis;\n font-size: ${theme.base['font-size']};\n margin-inline-start: calc(${theme.base['border-radius']} / 2);\n padding-inline-start: calc(${theme.base.spacing} / 2);\n\n ${StyledLink} {\n color: ${theme.base.colors.blue.light};\n }\n `;\n});\n\nStyledToastContent.defaultProps = defaultThemeProp;\n\nconst StyledToast = styled.div(({ theme }) => {\n return css`\n position: absolute;\n inset-block-start: 0;\n inset-inline-start: 0;\n width: 100%;\n background: ${theme.base.colors.slate['extra-dark']};\n color: ${theme.base.colors.white};\n border-radius: calc(${theme.base['border-radius']} / 2);\n opacity: var(--opacity);\n transform: translateY(var(--translateY)) scale(var(--scale));\n transition-property: transform, opacity;\n transition-duration: ${theme.base.animation.speed};\n transition-timing-function: ${theme.base.animation.timing.ease};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n\n :focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n\n ${StyledKeyboard} {\n color: ${theme.base.palette.light};\n background-color: ${theme.base.colors.gray.dark};\n border-color: ${theme.base.colors.gray.medium};\n inset-block-start: unset;\n }\n `;\n});\n\nStyledToast.defaultProps = defaultThemeProp;\n\nconst StyledToaster = styled.div(({ theme }) => {\n return css`\n position: fixed;\n z-index: ${theme.base['z-index'].toast};\n width: min(40ch, calc(100% - 1rem));\n inset-inline-start: 50%;\n transform: translateX(-50%);\n top: calc(100dvh - var(--appshell-bottom-offset, 0rem));\n `;\n});\n\nStyledToaster.defaultProps = defaultThemeProp;\n\nfunction reducer(current: ToastState[], action: ToastReducerAction) {\n switch (action.type) {\n case 'push':\n return [\n ...current,\n {\n ...action.payload\n }\n ];\n\n case 'unmount':\n return current.filter(m => m.id !== action.payload);\n\n default:\n return current;\n }\n}\n\nconst Toast = forwardRef(function Toast(\n {\n id,\n firstToast,\n dispatch,\n topLevelDismiss,\n translateY,\n onDismiss,\n dismissAfter,\n ...restProps\n }: PropsWithoutRef<ToastProps>,\n ref: ToastProps['ref']\n) {\n const [dismissed, setDismissed] = useState(false);\n const timeoutRef = useRef(NaN);\n const t = useI18n();\n const { macintosh } = useOS();\n const { announcePolite } = useLiveLog();\n const content = hasProp(restProps, 'href') ? t('created') : restProps.content;\n const initiatorRef = useRef<HTMLElement | null>(null);\n const containerRef = useConsolidatedRef(ref);\n\n useEffect(() => {\n let fullMessage = content;\n if (hasProp(restProps, 'href')) {\n // CreatedMessage\n fullMessage = restProps.caseId\n ? `${content} ${restProps.caseId} ${restProps.label}`\n : `${content} ${restProps.label}`;\n }\n\n const shortcutJumpMessage = t('keypress_instruction', [\n macintosh ? 'Option + Enter' : 'Alt + Enter',\n t('shortcut_JumpToToast')\n ]);\n\n const shortcutDismissMessage = t('keypress_instruction', [\n macintosh ? 'Option + Q' : 'Alt + Q',\n t('shortcut_DismissToast')\n ]);\n\n announcePolite({\n message: `${fullMessage}. ${shortcutJumpMessage}. ${shortcutDismissMessage}.`,\n type: 'acknowledgement'\n });\n }, []);\n\n const onTransitionEnd = (e: TransitionEvent<HTMLDivElement>) => {\n if (dismissed && e.propertyName === 'opacity' && e.target === e.currentTarget) {\n dispatch({ type: 'unmount', payload: id });\n }\n };\n\n const dismiss = (timeout: boolean) => () => {\n if (initiatorRef.current) {\n initiatorRef.current?.focus?.();\n initiatorRef.current = null;\n }\n clearTimeout(timeoutRef.current);\n if (dismissed) return;\n setDismissed(true);\n onDismiss?.({ id, timeout });\n topLevelDismiss?.({ id, timeout });\n };\n\n const startTimer = () => {\n if (dismissAfter) {\n timeoutRef.current = window.setTimeout(dismiss(true), dismissAfter);\n }\n };\n\n useEffect(() => {\n startTimer();\n return () => {\n window.clearTimeout(timeoutRef.current);\n };\n }, []);\n\n // Alt+Enter focuses on the first focusable element in the first toast.\n // Tab to the next toast if there are multiple.\n useShortcut('JumpToToast', () => {\n const activeElement = getActiveElement();\n if (activeElement && activeElement !== document.body) {\n initiatorRef.current = activeElement as HTMLElement;\n }\n if (firstToast && containerRef.current) {\n getFocusables(containerRef.current)[0]?.focus();\n }\n });\n\n // Alt+Q dismisses the first toast.\n useShortcut('DismissToast', () => {\n if (firstToast) dismiss(false)();\n });\n\n // Escape dismisses the toast and focuses the initiator.\n useEscape(() => {\n const currentFocus = getActiveElement();\n if (containerRef.current?.contains(currentFocus)) {\n dismiss(false)();\n }\n });\n\n useFocusWithin([containerRef], (focused: boolean) => {\n if (focused) {\n window.clearTimeout(timeoutRef.current);\n } else {\n startTimer();\n }\n });\n\n return (\n <Flex\n {...restProps}\n data-app-region\n container={{ alignItems: 'center', gap: 0.25 }}\n as={StyledToast}\n ref={containerRef}\n style={\n {\n '--translateY': `${-translateY}px`,\n '--opacity': dismissed ? '0' : '1',\n '--scale': dismissed ? '0' : '1'\n } as CSSProperties\n }\n onTransitionEnd={onTransitionEnd}\n >\n <Flex item={{ grow: 1 }} as={StyledToastContent}>\n {content}\n {hasProp(restProps, 'href') ? (\n <>\n &nbsp;\n <Link href={restProps.href}>\n {restProps.caseId ? `(${restProps.caseId}): ${restProps.label}` : restProps.label}\n </Link>\n </>\n ) : undefined}\n </Flex>\n <Flex container={{ inline: true, justify: 'end', gap: 0.5 }}>\n <Keyboard keyName='Alt' />\n <Keyboard keyName='Enter' />\n </Flex>\n <Button\n as={StyledToastButton}\n variant='simple'\n onClick={dismiss(false)}\n icon\n aria-label={t('dismiss_label')}\n >\n <Icon name='times' />\n </Button>\n </Flex>\n );\n});\n\nconst Toaster: FunctionComponent<ToasterProps> = ({\n testId,\n children,\n onDismiss\n}: ToasterProps) => {\n const { portalTarget } = useConfiguration();\n const [messages, dispatch] = useReducer(reducer, []);\n const [yOffsets, setYOffsets] = useState<number[]>([]);\n const heightHashRef = useRef<{\n [id: string]: number;\n }>({});\n const testIds = useTestIds(testId, getToasterTestIds);\n\n // This effect will cause a re-render with a translateY value set for each toast.\n useLayoutEffect(() => {\n const heights = [...messages].reverse().map(({ id }) => heightHashRef.current[id]);\n\n setYOffsets(\n heights\n .map((_, i) => heights.slice(0, i + 1).reduce((sum, cur) => sum + cur + 4, 0))\n .reverse()\n );\n }, [messages.length]);\n\n const providerValue = useMemo(\n () => ({\n push(incoming: ToastMessage) {\n const message: ToastState = {\n ...incoming,\n id: incoming.id ?? createUID(),\n dismissAfter: hasProp(incoming, 'href') ? 15_000 : 7_500\n };\n\n dispatch({\n type: 'push',\n payload: message\n });\n },\n initialized: true\n }),\n []\n );\n\n // Don't create additional ToasterContext.Providers.\n const context = windowIsAvailable\n ? window.cosmos.toasterContext ?? ToasterContext\n : ToasterContext;\n const priorCtx = useContext(context);\n if (priorCtx.initialized) {\n return <context.Provider value={priorCtx}>{children}</context.Provider>;\n }\n\n return (\n <>\n <context.Provider value={providerValue}>{children}</context.Provider>\n {!!messages.length &&\n portalTarget &&\n createPortal(\n <StyledToaster data-testid={testIds.root}>\n {messages.map((message, i) => {\n const sharedProps = {\n translateY: yOffsets[i] ?? 0,\n firstToast: i === 0,\n topLevelDismiss: onDismiss,\n dispatch,\n ref: el => {\n if (el) {\n heightHashRef.current[message.id] = el.offsetHeight;\n } else {\n delete heightHashRef.current[message.id];\n }\n }\n } satisfies Partial<ToastProps>;\n\n if (hasProp(message, 'href')) {\n return (\n // Toast with Link\n <Toast\n data-testid={testIds.toast}\n {...message}\n {...sharedProps}\n key={message.id}\n />\n );\n }\n\n return (\n // Base Toast\n <Toast data-testid={testIds.toast} {...message} {...sharedProps} key={message.id} />\n );\n })}\n </StyledToaster>,\n portalTarget\n )}\n </>\n );\n};\n\nexport default withTestIds(Toaster, getToasterTestIds);\n"]}
1
+ {"version":3,"file":"Toaster.js","sourceRoot":"","sources":["../../../src/components/Toaster/Toaster.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useContext,\n useReducer,\n useMemo,\n useLayoutEffect,\n useRef,\n useState,\n forwardRef,\n useEffect\n} from 'react';\nimport type {\n FunctionComponent,\n CSSProperties,\n TransitionEvent,\n Context,\n PropsWithoutRef,\n Ref,\n Dispatch\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport Link, { StyledLink } from '../Link';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport {\n createUID,\n windowIsAvailable,\n withTestIds,\n hasProp,\n getActiveElement,\n getFocusables\n} from '../../utils';\nimport {\n useConfiguration,\n useI18n,\n useLiveLog,\n useOS,\n useShortcut,\n useTestIds,\n useConsolidatedRef,\n useEscape,\n useFocusWithin\n} from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport '../../init';\nimport { registerAction } from '../ShortcutManager';\nimport { Keyboard } from '../Badges';\nimport { StyledKeyboard } from '../Badges/Keyboard';\n\nimport type { ToastMessage, ToasterProps, BaseToastMessage, CreatedMessage } from './Toaster.types';\nimport { ToasterContext } from './Context';\nimport type { ToasterContextValue } from './Context';\nimport { getToasterTestIds } from './Toaster.test-ids';\n\nregisterIcon(timesIcon);\nregisterAction(\n { id: 'JumpToToast', defaultKeyBinding: 'Alt+Enter' },\n { id: 'DismissToast', defaultKeyBinding: 'Alt+Q' }\n);\n\ntype ToastState = (BaseToastMessage | CreatedMessage) & {\n id: NonNullable<ToastMessage['id']>;\n dismissAfter?: number;\n};\n\ntype ToastReducerAction =\n | { type: 'push'; payload: ToastState }\n | { type: 'unmount'; payload: ToastState['id'] };\n\ntype ToastProps = ToastState & {\n // determines if this is the first toast in the list, used to dismiss the first toast with a shortcut, not exposed outside\n firstToast: boolean;\n topLevelDismiss: ToasterProps['onDismiss'];\n translateY: number;\n dispatch: Dispatch<ToastReducerAction>;\n ref: Ref<HTMLDivElement>;\n};\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n toasterContext?: Context<ToasterContextValue>;\n }\n}\n\nconst StyledToastButton = styled.button(\n ({ theme }) => css`\n border: none;\n color: inherit;\n padding: 0;\n font-size: 1rem;\n margin-block: calc(${theme.base.spacing} / 2);\n margin-inline-end: calc(${theme.base.spacing} / 2);\n\n &:enabled:hover {\n background: #ffffff19;\n }\n\n &:enabled:focus-visible {\n box-shadow: ${theme.base.shadow.focus};\n }\n `\n);\n\nStyledToastButton.defaultProps = defaultThemeProp;\n\nconst StyledToastContent = styled.div(({ theme }) => {\n return css`\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: clip;\n text-overflow: ellipsis;\n font-size: ${theme.base['font-size']};\n margin-inline-start: calc(${theme.base['border-radius']} / 2);\n padding-inline-start: calc(${theme.base.spacing} / 2);\n\n ${StyledLink} {\n color: ${theme.base.colors.blue.light};\n }\n `;\n});\n\nStyledToastContent.defaultProps = defaultThemeProp;\n\nconst StyledToast = styled.div(({ theme }) => {\n return css`\n position: absolute;\n inset-block-start: 0;\n inset-inline-start: 0;\n width: 100%;\n background: ${theme.base.colors.slate['extra-dark']};\n color: ${theme.base.colors.white};\n border-radius: calc(${theme.base['border-radius']} / 2);\n opacity: var(--opacity);\n transform: translateY(var(--translateY)) scale(var(--scale));\n transition-property: transform, opacity;\n transition-duration: ${theme.base.animation.speed};\n transition-timing-function: ${theme.base.animation.timing.ease};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n\n :focus-visible {\n box-shadow: ${theme.base.shadow.focus};\n }\n\n ${StyledKeyboard} {\n color: ${theme.base.palette.light};\n background-color: ${theme.base.colors.gray.dark};\n border-color: ${theme.base.colors.gray.medium};\n inset-block-start: unset;\n }\n `;\n});\n\nStyledToast.defaultProps = defaultThemeProp;\n\nconst StyledToaster = styled.div(({ theme }) => {\n return css`\n position: fixed;\n z-index: ${theme.base['z-index'].toast};\n width: min(40ch, calc(100% - 1rem));\n inset-inline-start: 50%;\n transform: translateX(-50%);\n top: calc(100dvh - var(--appshell-bottom-offset, 0rem));\n `;\n});\n\nStyledToaster.defaultProps = defaultThemeProp;\n\nfunction reducer(current: ToastState[], action: ToastReducerAction) {\n switch (action.type) {\n case 'push':\n return [\n ...current,\n {\n ...action.payload\n }\n ];\n\n case 'unmount':\n return current.filter(m => m.id !== action.payload);\n\n default:\n return current;\n }\n}\n\nconst Toast = forwardRef(function Toast(\n {\n id,\n firstToast,\n dispatch,\n topLevelDismiss,\n translateY,\n onDismiss,\n dismissAfter,\n ...restProps\n }: PropsWithoutRef<ToastProps>,\n ref: ToastProps['ref']\n) {\n const [dismissed, setDismissed] = useState(false);\n const timeoutRef = useRef(NaN);\n const t = useI18n();\n const { macintosh } = useOS();\n const { announcePolite } = useLiveLog();\n const content = hasProp(restProps, 'href') ? t('created') : restProps.content;\n const initiatorRef = useRef<HTMLElement | null>(null);\n const containerRef = useConsolidatedRef(ref);\n\n useEffect(() => {\n let fullMessage = content;\n if (hasProp(restProps, 'href')) {\n // CreatedMessage\n fullMessage = restProps.caseId\n ? `${content} ${restProps.caseId} ${restProps.label}`\n : `${content} ${restProps.label}`;\n }\n\n const shortcutJumpMessage = t('keypress_instruction', [\n macintosh ? 'Option + Enter' : 'Alt + Enter',\n t('shortcut_JumpToToast')\n ]);\n\n const shortcutDismissMessage = t('keypress_instruction', [\n macintosh ? 'Option + Q' : 'Alt + Q',\n t('shortcut_DismissToast')\n ]);\n\n announcePolite({\n message: `${fullMessage}. ${shortcutJumpMessage}. ${shortcutDismissMessage}.`,\n type: 'acknowledgement'\n });\n }, []);\n\n const onTransitionEnd = (e: TransitionEvent<HTMLDivElement>) => {\n if (dismissed && e.propertyName === 'opacity' && e.target === e.currentTarget) {\n dispatch({ type: 'unmount', payload: id });\n }\n };\n\n const dismiss = (timeout: boolean) => () => {\n if (initiatorRef.current) {\n initiatorRef.current?.focus?.();\n initiatorRef.current = null;\n }\n clearTimeout(timeoutRef.current);\n if (dismissed) return;\n setDismissed(true);\n onDismiss?.({ id, timeout });\n topLevelDismiss?.({ id, timeout });\n };\n\n const startTimer = () => {\n if (dismissAfter) {\n timeoutRef.current = window.setTimeout(dismiss(true), dismissAfter);\n }\n };\n\n useEffect(() => {\n startTimer();\n return () => {\n window.clearTimeout(timeoutRef.current);\n };\n }, []);\n\n // Alt+Enter focuses on the first focusable element in the first toast.\n // Tab to the next toast if there are multiple.\n useShortcut('JumpToToast', () => {\n const activeElement = getActiveElement();\n if (activeElement && activeElement !== document.body) {\n initiatorRef.current = activeElement as HTMLElement;\n }\n if (firstToast && containerRef.current) {\n getFocusables(containerRef.current)[0]?.focus();\n }\n });\n\n // Alt+Q dismisses the first toast.\n useShortcut('DismissToast', () => {\n if (firstToast) dismiss(false)();\n });\n\n // Escape dismisses the toast and focuses the initiator.\n useEscape(() => {\n const currentFocus = getActiveElement();\n if (containerRef.current?.contains(currentFocus)) {\n dismiss(false)();\n }\n });\n\n useFocusWithin([containerRef], (focused: boolean) => {\n if (focused) {\n window.clearTimeout(timeoutRef.current);\n } else {\n startTimer();\n }\n });\n\n return (\n <Flex\n {...restProps}\n data-app-region\n container={{ alignItems: 'center', gap: 0.25 }}\n as={StyledToast}\n ref={containerRef}\n style={\n {\n '--translateY': `${-translateY}px`,\n '--opacity': dismissed ? '0' : '1',\n '--scale': dismissed ? '0' : '1'\n } as CSSProperties\n }\n onTransitionEnd={onTransitionEnd}\n >\n <Flex item={{ grow: 1 }} as={StyledToastContent}>\n {content}\n {hasProp(restProps, 'href') ? (\n <>\n &nbsp;\n <Link href={restProps.href}>\n {restProps.caseId ? `(${restProps.caseId}): ${restProps.label}` : restProps.label}\n </Link>\n </>\n ) : undefined}\n </Flex>\n <Flex container={{ inline: true, justify: 'end', gap: 0.5 }}>\n <Keyboard keyName='Alt' />\n <Keyboard keyName='Enter' />\n </Flex>\n <Button\n as={StyledToastButton}\n variant='simple'\n onClick={dismiss(false)}\n icon\n aria-label={t('dismiss_label')}\n >\n <Icon name='times' />\n </Button>\n </Flex>\n );\n});\n\nconst Toaster: FunctionComponent<ToasterProps> = ({\n testId,\n children,\n onDismiss\n}: ToasterProps) => {\n const { portalTarget } = useConfiguration();\n const [messages, dispatch] = useReducer(reducer, []);\n const [yOffsets, setYOffsets] = useState<number[]>([]);\n const heightHashRef = useRef<{\n [id: string]: number;\n }>({});\n const testIds = useTestIds(testId, getToasterTestIds);\n\n // This effect will cause a re-render with a translateY value set for each toast.\n useLayoutEffect(() => {\n const heights = [...messages].reverse().map(({ id }) => heightHashRef.current[id]);\n\n setYOffsets(\n heights\n .map((_, i) => heights.slice(0, i + 1).reduce((sum, cur) => sum + cur + 4, 0))\n .reverse()\n );\n }, [messages.length]);\n\n const providerValue = useMemo(\n () => ({\n push(incoming: ToastMessage) {\n const message: ToastState = {\n ...incoming,\n id: incoming.id ?? createUID(),\n dismissAfter: hasProp(incoming, 'href') ? 15_000 : 7_500\n };\n\n dispatch({\n type: 'push',\n payload: message\n });\n },\n initialized: true\n }),\n []\n );\n\n // Don't create additional ToasterContext.Providers.\n const context = windowIsAvailable\n ? window.cosmos.toasterContext ?? ToasterContext\n : ToasterContext;\n const priorCtx = useContext(context);\n if (priorCtx.initialized) {\n return <context.Provider value={priorCtx}>{children}</context.Provider>;\n }\n\n return (\n <>\n <context.Provider value={providerValue}>{children}</context.Provider>\n {!!messages.length &&\n portalTarget &&\n createPortal(\n <StyledToaster data-testid={testIds.root}>\n {messages.map((message, i) => {\n const sharedProps = {\n translateY: yOffsets[i] ?? 0,\n firstToast: i === 0,\n topLevelDismiss: onDismiss,\n dispatch,\n ref: el => {\n if (el) {\n heightHashRef.current[message.id] = el.offsetHeight;\n } else {\n delete heightHashRef.current[message.id];\n }\n }\n } satisfies Partial<ToastProps>;\n\n if (hasProp(message, 'href')) {\n return (\n // Toast with Link\n <Toast\n data-testid={testIds.toast}\n {...message}\n {...sharedProps}\n key={message.id}\n />\n );\n }\n\n return (\n // Base Toast\n <Toast data-testid={testIds.toast} {...message} {...sharedProps} key={message.id} />\n );\n })}\n </StyledToaster>,\n portalTarget\n )}\n </>\n );\n};\n\nexport default withTestIds(Toaster, getToasterTestIds);\n"]}
@@ -759,7 +759,7 @@ export default {
759
759
  rte_link: 'Link',
760
760
  rte_link_text: 'Text',
761
761
  rte_link_url: 'URL',
762
- rte_image: 'Image',
762
+ rte_image: 'Insert image',
763
763
  rte_link_field: 'Field',
764
764
  rte_link_source: 'Source',
765
765
  rte_invalid_html: 'Invalid HTML',