npm - @pega/cosmos-react-core - Versions diffs - 9.7.0 → 9.8.0 - Mend

@pega/cosmos-react-core 9.7.0 → 9.8.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 (50) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useRef, useEffect } from 'react';\nimport type {\n ReactNode,\n Ref,\n PropsWithoutRef,\n KeyboardEvent as ReactKeyboardEvent,\n MouseEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport type { VirtualElement } from '@popperjs/core';\n\nimport Button from '../Button';\nimport type { ButtonProps } from '../Button';\nimport Popover from '../Popover';\nimport type { PopoverProps } from '../Popover';\nimport BareButton from '../Button/BareButton';\nimport type { BaseProps, ForwardRefForwardPropsComponent, TestIdProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport {\n useBreakpoint,\n useConsolidatedRef,\n useI18n,\n usePreviewContext,\n useUID,\n useModalContext,\n useOS,\n useTestIds\n} from '../../hooks';\nimport { documentIsAvailable, tryCatch, withTestIds, disallowedURI } from '../../utils';\nimport { calculateFontSize, readableColor } from '../../styles';\nimport { Keyboard } from '../Badges';\nimport { StyledKeyboard } from '../Badges/Keyboard';\nimport Flex from '../Flex';\nimport Icon, { StyledIcon, registerIcon } from '../Icon';\nimport * as openIcon from '../Icon/icons/open.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport HiddenText from '../HiddenText';\nimport { useFullscreenContext } from '../Fullscreen';\n\nimport { getLinkTestIds } from './Link.test-ids';\n\nexport interface LinkProps extends BaseProps, TestIdProp {\n /** Text or content for the Link. /\n children: ReactNode;\n /* URL or DOM id to navigate to. /\n href: string;\n /\n Controls the styling of the Link.\n * @default 'link'\n /\n variant?: ButtonProps['variant'];\n /\n Hides new tab icon which appears for links with target=\"_blank\".\n * @default false\n /\n hideNewTabIcon?: boolean;\n /\n Set the Icon prop to `true` if you're using just an Icon in your Link. Make sure to pass an Icon as children if `true`.\n * @default false\n /\n icon?: ButtonProps['icon'];\n /\n Determines if the Link should render a popover when focused or hovered over.\n * @default false\n /\n previewable?: boolean;\n /* Callback function that is run when the preview popover is interacted with. /\n onPreview?: (e: { href: string }) => void;\n /* Specifies where to open the link href. /\n target?: string;\n /* Ref for the wrapping element. /\n ref?: Ref<HTMLAnchorElement>;\n}\n\nexport const StyledLinkPopover = styled.div<{ preview: boolean }>(\n ({ theme, preview }) => css`\n background-color: ${theme.components.tooltip['background-color']};\n z-index: ${theme.base['z-index'].tooltip};\n --scale-in-size: 0;\n --animation-duration: ${theme.base.animation.speed};\n\n ${preview &&\n css`\n padding: calc(${theme.base.spacing} / 4);\n `}\n `\n);\n\nStyledLinkPopover.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPopoverBtn = styled(BareButton)(({ theme }) => {\n const contrastColor = tryCatch(() => readableColor(theme.components.tooltip['background-color']));\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n position: relative;\n display: inline-flex;\n align-items: center;\n z-index: 1;\n padding: 0 ${theme.base.spacing};\n min-height: 1.5rem;\n line-height: 1;\n color: ${contrastColor};\n font-size: ${fontSize.xs};\n text-decoration: none;\n\n / FIXME: Button selector specificity... /\n & + & {\n margin: 0;\n }\n\n & + &::before {\n content: '';\n position: absolute;\n inset-inline-start: 0;\n inset-block: 0;\n width: 1px; / stylelint-disable-line unit-allowed-list */\n background-color: ${contrastColor};\n opacity: ${theme.base.transparency['transparent-3']};\n }\n\n &:hover,\n &:active {\n text-decoration: underline;\n }\n\n &:focus {\n box-shadow:\n inset 0 0 0 0.0625rem ${theme.base.palette.light},\n 0 0 0.125rem 0.0625rem ${theme.base.palette.interactive};\n }\n `;\n});\n\nStyledLinkPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPreviewPopoverText = styled.div``;\n\nexport const StyledLinkPreviewPopoverBtn = styled(StyledLinkPopoverBtn)(({ theme }) => {\n return css`\n padding: calc(${theme.base.spacing} / 2);\n\n & + & {\n padding-inline-start: calc(${theme.base.spacing} - ${theme.base.spacing} / 4);\n padding-inline-end: calc(${theme.base.spacing} / 4);\n }\n\n &:hover,\n &:active {\n text-decoration: none;\n ${StyledLinkPreviewPopoverText} span {\n text-decoration: underline;\n }\n ${StyledLinkPreviewPopoverText} ${StyledKeyboard} span {\n text-decoration: none;\n }\n }\n\n ${StyledLinkPreviewPopoverText} {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\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 margin-inline: calc(${theme.base.spacing} / 4);\n\n &:first-of-type {\n margin-inline-start: calc(${theme.base.spacing} / 2);\n }\n\n &:last-of-type {\n margin-inline-end: calc(${theme.base.spacing} / 2);\n }\n }\n `;\n});\n\nStyledLinkPreviewPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLink = styled(Button)`\n &:has(> img) {\n display: inline-block;\n\n ${StyledIcon} {\n vertical-align: top;\n }\n }\n`;\n\nStyledLink.defaultProps = defaultThemeProp;\n\nregisterIcon(openIcon);\n\nconst Link: ForwardRefForwardPropsComponent<LinkProps> = forwardRef(function Link(\n {\n testId,\n href: hrefProp,\n variant = 'link',\n icon = false,\n previewable: showPreviewOpenInTabPopoverProp = false,\n onPreview,\n target: targetProp,\n hideNewTabIcon = false,\n children,\n ...restProps\n }: PropsWithoutRef<LinkProps>,\n ref: LinkProps['ref']\n) {\n const href = disallowedURI.test(hrefProp) ? undefined : hrefProp;\n\n const { initialized: inModal } = useModalContext();\n const fullscreen = useFullscreenContext();\n const inFullscreen = !!(fullscreen && fullscreen[0]);\n const { previewTriggerRef } = usePreviewContext();\n const uid = useUID();\n const linkRef = useConsolidatedRef(ref);\n const [popover, setPopover] = useState(false);\n const [popoverHideDelay, setPopoverHideDelay] = useState<PopoverProps['hideDelay']>('short');\n const [previewPopover, setPreviewPopover] = useState(false);\n const previewBtnRef = useRef<HTMLButtonElement>(null);\n const isSmallOrAbove = useBreakpoint('sm');\n const t = useI18n();\n const { macintosh } = useOS();\n const contextMenuOpened = useRef(false);\n const testIds = useTestIds(testId, getLinkTestIds);\n\n const mousePositionRef = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n const virtualElementCoordsRef = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n const virtualElementRef = useRef<VirtualElement>({\n get contextElement() {\n return linkRef.current ?? undefined;\n },\n getBoundingClientRect: () => {\n return {\n width: 0,\n height: 0,\n top: virtualElementCoordsRef.current.y,\n bottom: virtualElementCoordsRef.current.y,\n left: virtualElementCoordsRef.current.x,\n right: virtualElementCoordsRef.current.x,\n x: virtualElementCoordsRef.current.x,\n y: virtualElementCoordsRef.current.y,\n toJSON() {\n return JSON.stringify(this);\n }\n };\n }\n });\n\n const previewable = showPreviewOpenInTabPopoverProp && !inModal && !inFullscreen;\n\n let crossOrigin: boolean;\n try {\n if (href) {\n const url = new URL(href, document.location.href);\n crossOrigin = documentIsAvailable\n ? /^https?:$/.test(url.protocol) && document.location.origin !== url.origin\n : false;\n } else {\n crossOrigin = false;\n }\n } catch {\n crossOrigin = false;\n }\n\n const target = crossOrigin ? '_blank' : targetProp;\n\n const showPopover = () => {\n if (isSmallOrAbove && !previewPopover) {\n setPopover(true);\n }\n };\n\n const showPreviewPopover = () => {\n if (isSmallOrAbove && !popover && !contextMenuOpened.current) setPreviewPopover(true);\n };\n\n const hidePopover = () => {\n setPopover(false);\n };\n\n const hidePreviewPopover = () => {\n setPreviewPopover(false);\n };\n\n const onBlurLink = () => {\n contextMenuOpened.current = false;\n hidePreviewPopover();\n };\n\n const onPreviewClick = () => {\n previewTriggerRef.current = linkRef.current;\n if (href !== undefined) {\n onPreview?.({ href });\n }\n };\n\n const onKeyUp = (e: ReactKeyboardEvent) => {\n if (e.getModifierState('Alt') && e.code === 'KeyP') {\n onPreviewClick();\n }\n };\n\n useEffect(() => {\n if (popoverHideDelay === 'none' && !popover && !previewPopover) {\n setPopoverHideDelay('short');\n }\n }, [popoverHideDelay, popover, previewPopover]);\n\n useEffect(() => {\n const onKeyDown = ({ key }: KeyboardEvent) => {\n if (key === 'Escape' && (popover \|\| previewPopover)) {\n setPopoverHideDelay('none');\n setPopover(false);\n setPreviewPopover(false);\n }\n };\n\n document.addEventListener('keydown', onKeyDown);\n\n return () => {\n document.removeEventListener('keydown', onKeyDown);\n };\n }, [popover, previewPopover]);\n\n return (\n <>\n <StyledLink\n data-testid={testIds.root}\n href={href}\n variant={variant}\n ref={linkRef}\n target={target}\n {...restProps}\n aria-describedby={previewable ? `${uid}-preview-instructions` : undefined}\n onMouseEnter={\n showPreviewOpenInTabPopoverProp\n ? (e: MouseEvent) => {\n mousePositionRef.current = { x: e.clientX, y: e.clientY };\n showPopover();\n }\n : undefined\n }\n onMouseLeave={hidePopover}\n onMouseMove={(e: MouseEvent) => {\n mousePositionRef.current = { x: e.clientX, y: e.clientY };\n }}\n onFocus={\n showPreviewOpenInTabPopoverProp\n ? () => {\n showPreviewPopover();\n }\n : undefined\n }\n onBlur={onBlurLink}\n onKeyUp={onKeyUp}\n onContextMenu={() => {\n contextMenuOpened.current = true;\n\n setPopoverHideDelay('none');\n hidePreviewPopover();\n hidePopover();\n }}\n >\n {children}\n {target === '_blank' && <VisuallyHiddenText>{t('opens_in_a_new_tab')}</VisuallyHiddenText>}\n {!icon && target === '_blank' && !hideNewTabIcon && <Icon name='open' />}\n </StyledLink>\n\n {previewable && (\n <Popover\n data-testid={testIds.previewPopover}\n show={previewPopover}\n placement='top'\n groupId='tooltip'\n showDelay='short'\n hideDelay={popoverHideDelay}\n target={linkRef.current}\n as={StyledLinkPopover}\n arrow\n preview\n portal\n onHide={hidePreviewPopover}\n onClick={(e: MouseEvent) => {\n e.stopPropagation();\n }}\n >\n <StyledLinkPreviewPopoverBtn\n data-testid={testIds.preview}\n preview\n type='button'\n ref={previewBtnRef}\n onClick={onPreviewClick}\n tabIndex='-1'\n >\n <StyledLinkPreviewPopoverText>\n <span>{t('preview')}</span>\n <Flex container={{ inline: true, justify: 'end' }}>\n <Keyboard keyName='Alt' />\n <Keyboard keyName='P' />\n </Flex>\n </StyledLinkPreviewPopoverText>\n </StyledLinkPreviewPopoverBtn>\n <StyledLinkPreviewPopoverBtn\n data-testid={testIds.newTab}\n forwardedAs='a'\n href={href}\n target='_blank'\n rel='noreferrer'\n tabIndex='-1'\n >\n <StyledLinkPreviewPopoverText>\n <span>{t('link_open_in_tab_text')}</span>\n <Flex container={{ inline: true, justify: 'end' }}>\n <Keyboard keyName='CommandOrControl' />\n <Keyboard keyName='Enter' />\n </Flex>\n </StyledLinkPreviewPopoverText>\n </StyledLinkPreviewPopoverBtn>\n </Popover>\n )}\n\n <Popover\n data-testid={testIds.previewPopover}\n show={popover}\n placement='top'\n groupId='tooltip'\n showDelay='short'\n hideDelay={popoverHideDelay}\n target={virtualElementRef.current}\n onMouseEnter={showPopover}\n onMouseLeave={hidePopover}\n as={StyledLinkPopover}\n arrow\n portal\n onClick={(e: MouseEvent) => {\n e.stopPropagation();\n }}\n onShow={() => {\n const clientRects = linkRef.current?.getClientRects() ?? [];\n const { x: mouseX, y: mouseY } = mousePositionRef.current;\n const containingRect = Array.from(clientRects).find(\n // Assumes the rects are returned in order of appearance (left to right, top down) and don't overlap\n rect => mouseY < rect.bottom && mouseX < rect.right\n );\n if (containingRect) {\n virtualElementCoordsRef.current = {\n x: mouseX,\n y: containingRect.top\n };\n }\n }}\n >\n {previewable && (\n <StyledLinkPopoverBtn\n data-testid={testIds.preview}\n preview\n type='button'\n ref={previewBtnRef}\n onClick={onPreviewClick}\n tabIndex='-1'\n >\n {t('preview')}\n </StyledLinkPopoverBtn>\n )}\n <StyledLinkPopoverBtn\n data-testid={testIds.newTab}\n forwardedAs='a'\n href={href}\n target='_blank'\n rel='noreferrer'\n tabIndex='-1'\n >\n {t('link_open_in_tab_text')}\n </StyledLinkPopoverBtn>\n </Popover>\n\n {previewable && (\n <HiddenText id={`${uid}-preview-instructions`}>\n {t('preview_link_instruction', [macintosh ? 'option' : 'alt'])}\n </HiddenText>\n )}\n </>\n );\n});\n\nexport default withTestIds(Link, getLinkTestIds);\n"]}
1	+ {"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useRef, useEffect } from 'react';\nimport type {\n ReactNode,\n Ref,\n PropsWithoutRef,\n KeyboardEvent as ReactKeyboardEvent,\n MouseEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport type { VirtualElement } from '@popperjs/core';\n\nimport Button from '../Button';\nimport type { ButtonProps } from '../Button';\nimport Popover from '../Popover';\nimport type { PopoverProps } from '../Popover';\nimport BareButton from '../Button/BareButton';\nimport type { BaseProps, ForwardRefForwardPropsComponent, TestIdProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport {\n useBreakpoint,\n useConsolidatedRef,\n useI18n,\n usePreviewContext,\n useUID,\n useModalContext,\n useOS,\n useTestIds\n} from '../../hooks';\nimport { documentIsAvailable, tryCatch, withTestIds, disallowedURI } from '../../utils';\nimport { calculateFontSize, readableColor } from '../../styles';\nimport { Keyboard } from '../Badges';\nimport { StyledKeyboard } from '../Badges/Keyboard';\nimport Flex from '../Flex';\nimport Icon, { StyledIcon, registerIcon } from '../Icon';\nimport * as openIcon from '../Icon/icons/open.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport HiddenText from '../HiddenText';\nimport { useFullscreenContext } from '../Fullscreen';\n\nimport { getLinkTestIds } from './Link.test-ids';\n\nexport interface LinkProps extends BaseProps, TestIdProp {\n /** Text or content for the Link. /\n children: ReactNode;\n /* URL or DOM id to navigate to. /\n href: string;\n /\n Controls the styling of the Link.\n * @default 'link'\n /\n variant?: ButtonProps['variant'];\n /\n Hides new tab icon which appears for links with target=\"_blank\".\n * @default false\n /\n hideNewTabIcon?: boolean;\n /\n Set the Icon prop to `true` if you're using just an Icon in your Link. Make sure to pass an Icon as children if `true`.\n * @default false\n /\n icon?: ButtonProps['icon'];\n /\n Determines if the Link should render a popover when focused or hovered over.\n * @default false\n /\n previewable?: boolean;\n /* Callback function that is run when the preview popover is interacted with. /\n onPreview?: (e: { href: string }) => void;\n /* Specifies where to open the link href. /\n target?: string;\n /* Ref for the wrapping element. /\n ref?: Ref<HTMLAnchorElement>;\n}\n\nexport const StyledLinkPopover = styled.div<{ preview: boolean }>(\n ({ theme, preview }) => css`\n background-color: ${theme.components.tooltip['background-color']};\n z-index: ${theme.base['z-index'].tooltip};\n --scale-in-size: 0;\n --animation-duration: ${theme.base.animation.speed};\n\n ${preview &&\n css`\n padding: calc(${theme.base.spacing} / 4);\n `}\n `\n);\n\nStyledLinkPopover.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPopoverBtn = styled(BareButton)(({ theme }) => {\n const contrastColor = tryCatch(() => readableColor(theme.components.tooltip['background-color']));\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n position: relative;\n display: inline-flex;\n align-items: center;\n z-index: 1;\n padding: 0 ${theme.base.spacing};\n min-height: 1.5rem;\n line-height: 1;\n color: ${contrastColor};\n font-size: ${fontSize.xs};\n text-decoration: none;\n\n / FIXME: Button selector specificity... /\n & + & {\n margin: 0;\n }\n\n & + &::before {\n content: '';\n position: absolute;\n inset-inline-start: 0;\n inset-block: 0;\n width: 1px; / stylelint-disable-line unit-allowed-list */\n background-color: ${contrastColor};\n opacity: ${theme.base.transparency['transparent-3']};\n }\n\n &:hover,\n &:active {\n text-decoration: underline;\n }\n\n &:focus-visible {\n box-shadow:\n inset 0 0 0 0.0625rem ${theme.base.palette.light},\n 0 0 0.125rem 0.0625rem ${theme.base.palette.interactive};\n }\n `;\n});\n\nStyledLinkPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPreviewPopoverText = styled.div``;\n\nexport const StyledLinkPreviewPopoverBtn = styled(StyledLinkPopoverBtn)(({ theme }) => {\n return css`\n padding: calc(${theme.base.spacing} / 2);\n\n & + & {\n padding-inline-start: calc(${theme.base.spacing} - ${theme.base.spacing} / 4);\n padding-inline-end: calc(${theme.base.spacing} / 4);\n }\n\n &:hover,\n &:active {\n text-decoration: none;\n ${StyledLinkPreviewPopoverText} span {\n text-decoration: underline;\n }\n ${StyledLinkPreviewPopoverText} ${StyledKeyboard} span {\n text-decoration: none;\n }\n }\n\n ${StyledLinkPreviewPopoverText} {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\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 margin-inline: calc(${theme.base.spacing} / 4);\n\n &:first-of-type {\n margin-inline-start: calc(${theme.base.spacing} / 2);\n }\n\n &:last-of-type {\n margin-inline-end: calc(${theme.base.spacing} / 2);\n }\n }\n `;\n});\n\nStyledLinkPreviewPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLink = styled(Button)`\n &:has(> img) {\n display: inline-block;\n\n ${StyledIcon} {\n vertical-align: top;\n }\n }\n`;\n\nStyledLink.defaultProps = defaultThemeProp;\n\nregisterIcon(openIcon);\n\nconst Link: ForwardRefForwardPropsComponent<LinkProps> = forwardRef(function Link(\n {\n testId,\n href: hrefProp,\n variant = 'link',\n icon = false,\n previewable: showPreviewOpenInTabPopoverProp = false,\n onPreview,\n target: targetProp,\n hideNewTabIcon = false,\n children,\n ...restProps\n }: PropsWithoutRef<LinkProps>,\n ref: LinkProps['ref']\n) {\n const href = disallowedURI.test(hrefProp) ? undefined : hrefProp;\n\n const { initialized: inModal } = useModalContext();\n const fullscreen = useFullscreenContext();\n const inFullscreen = !!(fullscreen && fullscreen[0]);\n const { previewTriggerRef } = usePreviewContext();\n const uid = useUID();\n const linkRef = useConsolidatedRef(ref);\n const [popover, setPopover] = useState(false);\n const [popoverHideDelay, setPopoverHideDelay] = useState<PopoverProps['hideDelay']>('short');\n const [previewPopover, setPreviewPopover] = useState(false);\n const previewBtnRef = useRef<HTMLButtonElement>(null);\n const isSmallOrAbove = useBreakpoint('sm');\n const t = useI18n();\n const { macintosh } = useOS();\n const contextMenuOpened = useRef(false);\n const testIds = useTestIds(testId, getLinkTestIds);\n\n const mousePositionRef = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n const virtualElementCoordsRef = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n const virtualElementRef = useRef<VirtualElement>({\n get contextElement() {\n return linkRef.current ?? undefined;\n },\n getBoundingClientRect: () => {\n return {\n width: 0,\n height: 0,\n top: virtualElementCoordsRef.current.y,\n bottom: virtualElementCoordsRef.current.y,\n left: virtualElementCoordsRef.current.x,\n right: virtualElementCoordsRef.current.x,\n x: virtualElementCoordsRef.current.x,\n y: virtualElementCoordsRef.current.y,\n toJSON() {\n return JSON.stringify(this);\n }\n };\n }\n });\n\n const previewable = showPreviewOpenInTabPopoverProp && !inModal && !inFullscreen;\n\n let crossOrigin: boolean;\n try {\n if (href) {\n const url = new URL(href, document.location.href);\n crossOrigin = documentIsAvailable\n ? /^https?:$/.test(url.protocol) && document.location.origin !== url.origin\n : false;\n } else {\n crossOrigin = false;\n }\n } catch {\n crossOrigin = false;\n }\n\n const target = crossOrigin ? '_blank' : targetProp;\n\n const showPopover = () => {\n if (isSmallOrAbove && !previewPopover) {\n setPopover(true);\n }\n };\n\n const showPreviewPopover = () => {\n if (isSmallOrAbove && !popover && !contextMenuOpened.current) setPreviewPopover(true);\n };\n\n const hidePopover = () => {\n setPopover(false);\n };\n\n const hidePreviewPopover = () => {\n setPreviewPopover(false);\n };\n\n const onBlurLink = () => {\n contextMenuOpened.current = false;\n hidePreviewPopover();\n };\n\n const onPreviewClick = () => {\n previewTriggerRef.current = linkRef.current;\n if (href !== undefined) {\n onPreview?.({ href });\n }\n };\n\n const onKeyUp = (e: ReactKeyboardEvent) => {\n if (e.getModifierState('Alt') && e.code === 'KeyP') {\n onPreviewClick();\n }\n };\n\n useEffect(() => {\n if (popoverHideDelay === 'none' && !popover && !previewPopover) {\n setPopoverHideDelay('short');\n }\n }, [popoverHideDelay, popover, previewPopover]);\n\n useEffect(() => {\n const onKeyDown = ({ key }: KeyboardEvent) => {\n if (key === 'Escape' && (popover \|\| previewPopover)) {\n setPopoverHideDelay('none');\n setPopover(false);\n setPreviewPopover(false);\n }\n };\n\n document.addEventListener('keydown', onKeyDown);\n\n return () => {\n document.removeEventListener('keydown', onKeyDown);\n };\n }, [popover, previewPopover]);\n\n return (\n <>\n <StyledLink\n data-testid={testIds.root}\n href={href}\n variant={variant}\n ref={linkRef}\n target={target}\n {...restProps}\n aria-describedby={previewable ? `${uid}-preview-instructions` : undefined}\n onMouseEnter={\n showPreviewOpenInTabPopoverProp\n ? (e: MouseEvent) => {\n mousePositionRef.current = { x: e.clientX, y: e.clientY };\n showPopover();\n }\n : undefined\n }\n onMouseLeave={hidePopover}\n onMouseMove={(e: MouseEvent) => {\n mousePositionRef.current = { x: e.clientX, y: e.clientY };\n }}\n onFocus={\n showPreviewOpenInTabPopoverProp\n ? () => {\n showPreviewPopover();\n }\n : undefined\n }\n onBlur={onBlurLink}\n onKeyUp={onKeyUp}\n onContextMenu={() => {\n contextMenuOpened.current = true;\n\n setPopoverHideDelay('none');\n hidePreviewPopover();\n hidePopover();\n }}\n >\n {children}\n {target === '_blank' && <VisuallyHiddenText>{t('opens_in_a_new_tab')}</VisuallyHiddenText>}\n {!icon && target === '_blank' && !hideNewTabIcon && <Icon name='open' />}\n </StyledLink>\n\n {previewable && (\n <Popover\n data-testid={testIds.previewPopover}\n show={previewPopover}\n placement='top'\n groupId='tooltip'\n showDelay='short'\n hideDelay={popoverHideDelay}\n target={linkRef.current}\n as={StyledLinkPopover}\n arrow\n preview\n portal\n onHide={hidePreviewPopover}\n onClick={(e: MouseEvent) => {\n e.stopPropagation();\n }}\n >\n <StyledLinkPreviewPopoverBtn\n data-testid={testIds.preview}\n preview\n type='button'\n ref={previewBtnRef}\n onClick={onPreviewClick}\n tabIndex='-1'\n >\n <StyledLinkPreviewPopoverText>\n <span>{t('preview')}</span>\n <Flex container={{ inline: true, justify: 'end' }}>\n <Keyboard keyName='Alt' />\n <Keyboard keyName='P' />\n </Flex>\n </StyledLinkPreviewPopoverText>\n </StyledLinkPreviewPopoverBtn>\n <StyledLinkPreviewPopoverBtn\n data-testid={testIds.newTab}\n forwardedAs='a'\n href={href}\n target='_blank'\n rel='noreferrer'\n tabIndex='-1'\n >\n <StyledLinkPreviewPopoverText>\n <span>{t('link_open_in_tab_text')}</span>\n <Flex container={{ inline: true, justify: 'end' }}>\n <Keyboard keyName='CommandOrControl' />\n <Keyboard keyName='Enter' />\n </Flex>\n </StyledLinkPreviewPopoverText>\n </StyledLinkPreviewPopoverBtn>\n </Popover>\n )}\n\n <Popover\n data-testid={testIds.previewPopover}\n show={popover}\n placement='top'\n groupId='tooltip'\n showDelay='short'\n hideDelay={popoverHideDelay}\n target={virtualElementRef.current}\n onMouseEnter={showPopover}\n onMouseLeave={hidePopover}\n as={StyledLinkPopover}\n arrow\n portal\n onClick={(e: MouseEvent) => {\n e.stopPropagation();\n }}\n onShow={() => {\n const clientRects = linkRef.current?.getClientRects() ?? [];\n const { x: mouseX, y: mouseY } = mousePositionRef.current;\n const containingRect = Array.from(clientRects).find(\n // Assumes the rects are returned in order of appearance (left to right, top down) and don't overlap\n rect => mouseY < rect.bottom && mouseX < rect.right\n );\n if (containingRect) {\n virtualElementCoordsRef.current = {\n x: mouseX,\n y: containingRect.top\n };\n }\n }}\n >\n {previewable && (\n <StyledLinkPopoverBtn\n data-testid={testIds.preview}\n preview\n type='button'\n ref={previewBtnRef}\n onClick={onPreviewClick}\n tabIndex='-1'\n >\n {t('preview')}\n </StyledLinkPopoverBtn>\n )}\n <StyledLinkPopoverBtn\n data-testid={testIds.newTab}\n forwardedAs='a'\n href={href}\n target='_blank'\n rel='noreferrer'\n tabIndex='-1'\n >\n {t('link_open_in_tab_text')}\n </StyledLinkPopoverBtn>\n </Popover>\n\n {previewable && (\n <HiddenText id={`${uid}-preview-instructions`}>\n {t('preview_link_instruction', [macintosh ? 'option' : 'alt'])}\n </HiddenText>\n )}\n </>\n );\n});\n\nexport default withTestIds(Link, getLinkTestIds);\n"]}

package/lib/components/Location/LocationView.styles.js CHANGED Viewed

@@ -66,8 +66,8 @@ export const StyledLocationView = styled.div(({ $height, theme }) => {
           translate: 0 0.0625rem;
         }
-        &:enabled:focus,
-        &:not([disabled]):focus {
+        &:enabled:focus-visible,
+        &:not([disabled]):focus-visible {
           box-shadow: ${theme.components.button['focus-shadow']};
         }

package/lib/components/Location/LocationView.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LocationView.styles.js","sourceRoot":"","sources":["../../../src/components/Location/LocationView.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAEnC,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;;;;;CAKhD,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAsB,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;IACvF,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtF,OAAO,GAAG,CAAA;;cAEE,OAAO;;;qBAGA,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;;;;mBAK7B,QAAQ,CAAC,CAAC;qBACR,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,WAAW,CAAC;;;;;;;;;qBAStC,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC;uBACvB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;0BAC3B,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU;;UAEhD,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;0BAElE,KAAK,CAAC,IAAI,CAAC,OAAO;;;;wBAIpB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,QAAQ;;;;;;;iBAOrC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;kBAClC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;kBACnC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC;;YAE7C,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,eAAe,CAAC;;;;;;;;;;;;;;;;wBAgB7D,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC;;;;mBAI5C,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;oBACnC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;;;;;;;0BAO9B,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC;;;;;;;;;;0BAUvC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC;;;;;;;;GAQ9D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAIjC,CAAC,EACC,QAAQ,EACR,MAAM,EACN,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,kBAAkB,EAAE,eAAe,EAAE,EAC9C,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;;QAIN,QAAQ;QACV,GAAG,CAAA;mBACU,eAAe;OAC3B;;QAEC,MAAM,KAAK,OAAO;QACpB,GAAG,CAAA;mBACU,eAAe;OAC3B;KACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize } from '../../styles';\nimport { Status } from '../Badges';\n\nexport const StyledLocationError = styled(Status)`\n position: absolute;\n top: 40%;\n left: 50%;\n transform: translate(-50%, -50%);\n`;\n\nStyledLocationError.defaultProps = defaultThemeProp;\n\nexport const StyledLocationView = styled.div<{ $height: string }>(({ $height, theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n min-height: inherit;\n height: ${$height};\n position: relative;\n flex: auto;\n border-radius: ${theme.base['border-radius']};\n mask-image: radial-gradient(white, black);\n -webkit-mask-image: radial-gradient(white, black);\n\n div.gm-style-iw.gm-style-iw-c .gm-style-iw-chr {\n font-size: ${fontSize.s};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n }\n\n div.gm-style-iw.gm-style-iw-c div.gm-style-iw-d {\n overflow: auto !important;\n }\n\n div.gm-style-iw.gm-style-iw-c {\n display: flex;\n font-family: ${theme.base['font-family']};\n min-width: min(${theme.base['content-width'].sm}, calc(100vw - 2rem)) !important;\n background-color: ${theme.components.card.background};\n border-radius: calc(\n ${theme.components['form-control']['border-radius']} * ${theme.base['border-radius']}\n );\n padding: calc(2 * ${theme.base.spacing}) !important;\n > button {\n opacity: 1;\n position: relative !important;\n z-index: calc(${theme.base['z-index'].backdrop} + 1);\n top: 0 !important;\n right: 0 !important;\n align-self: end;\n display: inline-flex !important;\n align-items: center;\n justify-content: center;\n width: ${theme.base['hit-area']['mouse-min']} !important;\n height: ${theme.base['hit-area']['mouse-min']} !important;\n border: ${theme.components.button['border-width']} solid transparent !important;\n border-radius: calc(\n ${theme.base['border-radius']} * ${theme.components.button['border-radius']}\n );\n color: currentColor;\n\n > span {\n margin: 0 !important;\n height: 1.25rem !important;\n width: 1.25rem !important;\n }\n\n &:active {\n translate: 0 0.0625rem;\n }\n\n &:enabled:focus,\n &:not([disabled]):focus {\n box-shadow: ${theme.components.button['focus-shadow']};\n }\n\n @media (pointer: coarse) {\n width: ${theme.base['hit-area']['finger-min']} !important;\n height: ${theme.base['hit-area']['finger-min']} !important;\n }\n\n @media (hover: hover) {\n &:hover::before {\n content: '';\n position: absolute;\n inset: calc(${theme.components.button['border-width']} * -1);\n border-radius: inherit;\n background-color: currentColor;\n color: currentColor;\n opacity: 0.1;\n }\n\n &:active::before {\n content: '';\n position: absolute;\n inset: calc(${theme.components.button['border-width']} * -1);\n border-radius: inherit;\n background-color: currentColor;\n opacity: 0.2;\n }\n }\n }\n }\n `;\n});\n\nStyledLocationView.defaultProps = defaultThemeProp;\n\nexport const StyledMap = styled.div<{\n status: string;\n disabled: boolean;\n}>(\n ({\n disabled,\n status,\n theme: {\n base: { 'disabled-opacity': disabledOpacity }\n }\n }) => {\n return css`\n position: absolute;\n inset: 0;\n\n ${disabled &&\n css`\n opacity: ${disabledOpacity};\n `}\n\n ${status === 'error' &&\n css`\n opacity: ${disabledOpacity};\n `}\n `;\n }\n);\n\nStyledMap.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"LocationView.styles.js","sourceRoot":"","sources":["../../../src/components/Location/LocationView.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAEnC,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;;;;;CAKhD,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAsB,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;IACvF,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IACtF,OAAO,GAAG,CAAA;;cAEE,OAAO;;;qBAGA,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;;;;mBAK7B,QAAQ,CAAC,CAAC;qBACR,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,WAAW,CAAC;;;;;;;;;qBAStC,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC;uBACvB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;0BAC3B,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU;;UAEhD,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;0BAElE,KAAK,CAAC,IAAI,CAAC,OAAO;;;;wBAIpB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,QAAQ;;;;;;;iBAOrC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;kBAClC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;kBACnC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC;;YAE7C,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,eAAe,CAAC;;;;;;;;;;;;;;;;wBAgB7D,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC;;;;mBAI5C,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;oBACnC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;;;;;;;0BAO9B,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC;;;;;;;;;;0BAUvC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC;;;;;;;;GAQ9D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAIjC,CAAC,EACC,QAAQ,EACR,MAAM,EACN,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,kBAAkB,EAAE,eAAe,EAAE,EAC9C,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;;QAIN,QAAQ;QACV,GAAG,CAAA;mBACU,eAAe;OAC3B;;QAEC,MAAM,KAAK,OAAO;QACpB,GAAG,CAAA;mBACU,eAAe;OAC3B;KACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize } from '../../styles';\nimport { Status } from '../Badges';\n\nexport const StyledLocationError = styled(Status)`\n position: absolute;\n top: 40%;\n left: 50%;\n transform: translate(-50%, -50%);\n`;\n\nStyledLocationError.defaultProps = defaultThemeProp;\n\nexport const StyledLocationView = styled.div<{ $height: string }>(({ $height, theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n min-height: inherit;\n height: ${$height};\n position: relative;\n flex: auto;\n border-radius: ${theme.base['border-radius']};\n mask-image: radial-gradient(white, black);\n -webkit-mask-image: radial-gradient(white, black);\n\n div.gm-style-iw.gm-style-iw-c .gm-style-iw-chr {\n font-size: ${fontSize.s};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n }\n\n div.gm-style-iw.gm-style-iw-c div.gm-style-iw-d {\n overflow: auto !important;\n }\n\n div.gm-style-iw.gm-style-iw-c {\n display: flex;\n font-family: ${theme.base['font-family']};\n min-width: min(${theme.base['content-width'].sm}, calc(100vw - 2rem)) !important;\n background-color: ${theme.components.card.background};\n border-radius: calc(\n ${theme.components['form-control']['border-radius']} * ${theme.base['border-radius']}\n );\n padding: calc(2 * ${theme.base.spacing}) !important;\n > button {\n opacity: 1;\n position: relative !important;\n z-index: calc(${theme.base['z-index'].backdrop} + 1);\n top: 0 !important;\n right: 0 !important;\n align-self: end;\n display: inline-flex !important;\n align-items: center;\n justify-content: center;\n width: ${theme.base['hit-area']['mouse-min']} !important;\n height: ${theme.base['hit-area']['mouse-min']} !important;\n border: ${theme.components.button['border-width']} solid transparent !important;\n border-radius: calc(\n ${theme.base['border-radius']} * ${theme.components.button['border-radius']}\n );\n color: currentColor;\n\n > span {\n margin: 0 !important;\n height: 1.25rem !important;\n width: 1.25rem !important;\n }\n\n &:active {\n translate: 0 0.0625rem;\n }\n\n &:enabled:focus-visible,\n &:not([disabled]):focus-visible {\n box-shadow: ${theme.components.button['focus-shadow']};\n }\n\n @media (pointer: coarse) {\n width: ${theme.base['hit-area']['finger-min']} !important;\n height: ${theme.base['hit-area']['finger-min']} !important;\n }\n\n @media (hover: hover) {\n &:hover::before {\n content: '';\n position: absolute;\n inset: calc(${theme.components.button['border-width']} * -1);\n border-radius: inherit;\n background-color: currentColor;\n color: currentColor;\n opacity: 0.1;\n }\n\n &:active::before {\n content: '';\n position: absolute;\n inset: calc(${theme.components.button['border-width']} * -1);\n border-radius: inherit;\n background-color: currentColor;\n opacity: 0.2;\n }\n }\n }\n }\n `;\n});\n\nStyledLocationView.defaultProps = defaultThemeProp;\n\nexport const StyledMap = styled.div<{\n status: string;\n disabled: boolean;\n}>(\n ({\n disabled,\n status,\n theme: {\n base: { 'disabled-opacity': disabledOpacity }\n }\n }) => {\n return css`\n position: absolute;\n inset: 0;\n\n ${disabled &&\n css`\n opacity: ${disabledOpacity};\n `}\n\n ${status === 'error' &&\n css`\n opacity: ${disabledOpacity};\n `}\n `;\n }\n);\n\nStyledMap.defaultProps = defaultThemeProp;\n"]}

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

@@ -384,7 +384,7 @@ export const StyledMenu = styled.div(({ theme }) => {
       max-height: inherit;
     }
-    &:focus {
+    &:focus-visible {
       box-shadow: ${theme.base.shadow.focus};
       outline: none;
     }
@@ -471,7 +471,7 @@ export const StyledMenuFilter = styled.div(({ theme }) => {
         -webkit-appearance: none;
       }
-      &:focus:not([disabled]) {
+      &:focus-visible:not([disabled]) {
         box-shadow: ${theme.base.shadow['focus-inset']};
         border-color: ${theme.components['form-control']['border-color']};

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.styles.js","sourceRoot":"","sources":["../../../src/components/Menu/Menu.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { hideVisually, mix, transparentize } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { StyledEmptyState } from '../EmptyState';\nimport Icon, { StyledIcon } from '../Icon';\nimport { StyledGrid } from '../Grid';\nimport { tryCatch } from '../../utils';\nimport { StyledText } from '../Text';\nimport { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';\nimport { StyledMetaList, StyledMetaListItem } from '../MetaList/MetaList';\nimport Button, { StyledButton } from '../Button';\nimport { readableColor } from '../../styles';\nimport {\n StyledPrimary,\n StyledSecondary,\n StyledSummaryItem,\n StyledSummaryItemActions,\n StyledVisual\n} from '../SummaryItem';\nimport { ellipsisOverflow } from '../../styles/mixins';\nimport { StyledFlex } from '../Flex';\nimport { StyledFormControl } from '../FormControl';\n\nimport type { MenuProps } from './Menu.types';\n\nexport const StyledExpandButton = styled(Button)`\n align-self: center;\n`;\n\nexport const StyledCheckMarkIcon = styled(Icon)``;\n\nexport const StyledMenuItem = styled.li<{\n isParentItem: boolean;\n mode?: MenuProps['mode'];\n itemLayout?: MenuProps['itemLayout'];\n isChecked?: boolean;\n selectableParent?: boolean;\n}>(\n ({\n theme: { base, components },\n isParentItem,\n itemLayout,\n mode = 'action',\n isChecked = false,\n selectableParent = false\n }) => {\n const activeColor = tryCatch(() =>\n mix(0.85, base.palette['primary-background'], base.palette.interactive)\n );\n const hoverColor = tryCatch(() =>\n mix(0.95, base.palette['primary-background'], base.palette.interactive)\n );\n\n const checkedBackground = components['radio-check'][':checked']['background-color'];\n const checkedForeground = tryCatch(() => readableColor(checkedBackground));\n\n return css`\n min-height: ${base['hit-area']['mouse-min']};\n padding-block: calc(0.75 * ${base.spacing});\n padding-inline: ${base.spacing};\n cursor: pointer;\n\n > ${StyledSummaryItem} {\n ${StyledSummaryItemActions}, ${StyledVisual} {\n display: grid;\n align-items: center;\n }\n\n > ${StyledVisual}:has(> :nth-child(2)) {\n grid-template-columns: auto auto;\n grid-column-gap: ${base.spacing};\n }\n\n ${itemLayout === 'stacked' &&\n css`\n &:has(${StyledSecondary})\n > ${StyledVisual},\n &:has(${StyledSecondary})\n > ${StyledSummaryItemActions} {\n height: ${base['hit-area']['mouse-min']};\n align-self: start;\n }\n `}\n }\n\n ${itemLayout === 'inline' &&\n css`\n justify-content: flex-start;\n\n ${StyledSummaryItem} {\n /* Sets grid columns based on SummaryItem content combinations /\n\n &:has(${StyledVisual}):has(${StyledSecondary}):has(${StyledSummaryItemActions}) {\n grid-template-areas: 'visual primary secondary actions';\n grid-template-columns: auto auto 1fr auto;\n }\n\n &:has(${StyledVisual}):has(${StyledSecondary}):not(:has(${StyledSummaryItemActions})) {\n grid-template-areas: 'visual primary secondary';\n grid-template-columns: auto auto 1fr;\n }\n\n &:has(${StyledVisual}):not(:has(${StyledSecondary})):has(${StyledSummaryItemActions}) {\n grid-template-areas: 'visual primary actions';\n grid-template-columns: auto 1fr auto;\n }\n\n &:has(${StyledVisual}):not(:has(${StyledSecondary})):not(\n :has(${StyledSummaryItemActions})\n ) {\n grid-template-areas: 'visual primary';\n grid-template-columns: auto 1fr;\n }\n\n &:not(:has(${StyledVisual})):has(${StyledSecondary}):has(${StyledSummaryItemActions}) {\n grid-template-areas: 'primary secondary actions';\n grid-template-columns: auto 1fr auto;\n }\n\n &:not(:has(${StyledVisual})):has(${StyledSecondary}):not(\n :has(${StyledSummaryItemActions})\n ) {\n grid-template-areas: 'primary secondary';\n grid-template-columns: auto 1fr;\n }\n\n &:not(:has(${StyledVisual})):not(:has(${StyledSecondary})):has(\n ${StyledSummaryItemActions}\n ) {\n grid-template-areas: 'primary actions';\n grid-template-columns: auto 1fr;\n }\n\n &:not(:has(${StyledVisual})):not(:has(${StyledSecondary})):not(\n :has(${StyledSummaryItemActions})\n ) {\n grid-template-areas: 'primary';\n grid-template-columns: 1fr;\n flex-grow: 0;\n }\n\n & > ${StyledPrimary} {\n ${ellipsisOverflow};\n }\n\n & > ${StyledSecondary} {\n ${ellipsisOverflow};\n\n ul {\n li {\n ${ellipsisOverflow};\n }\n justify-content: end;\n }\n }\n\n & > ${StyledSummaryItemActions} > ${StyledFlex} {\n justify-content: end;\n }\n }\n `}\n\n @media (pointer: coarse) {\n min-height: ${base['hit-area']['finger-min']};\n ${itemLayout === 'stacked' &&\n css`\n &:has(${StyledSecondary})\n > ${StyledVisual},\n &:has(${StyledSecondary})\n > ${StyledSummaryItemActions} {\n height: ${base['hit-area']['finger-min']};\n }\n `}\n }\n\n &:focus-within {\n background-color: ${activeColor};\n }\n\n &:hover {\n ${StyledCheckMarkIcon} {\n visibility: visible;\n ${mode === 'single-select' &&\n css`\n ${isChecked\n ? css`\n color: ${checkedBackground};\n `\n : css`\n visibility: hidden;\n `}\n `}\n ${mode === 'multi-select' &&\n css`\n ${!isChecked &&\n css`\n border-color: ${components['form-control'][':hover']['border-color']};\n `}\n `}\n }\n }\n\n &:hover:not([aria-disabled='true']) {\n background-color: ${hoverColor};\n }\n\n a:first-of-type {\n display: block;\n width: 100%;\n text-decoration: none;\n color: inherit;\n }\n\n / The enclosing menu item has required min-height already set /\n ${isParentItem &&\n selectableParent &&\n css`\n ${StyledSummaryItemActions} ${StyledButton} {\n min-height: unset;\n }\n `}\n\n ${isParentItem &&\n !selectableParent &&\n (mode === 'multi-select' \|\| mode === 'single-select') &&\n css`\n padding-inline-start: calc(1.125rem + ${base.spacing});\n `}\n\n ${StyledGrid} {\n flex-grow: 1;\n }\n\n ${StyledCheckMarkIcon} {\n margin-inline-start: 0;\n ${mode === 'single-select' &&\n css`\n ${isChecked\n ? css`\n color: ${checkedBackground};\n `\n : css`\n visibility: hidden;\n `}\n `}\n ${mode === 'multi-select' &&\n css`\n ${isChecked\n ? css`\n color: ${checkedForeground};\n background-color: ${checkedBackground};\n border: 0.0625rem solid ${components['radio-check'][':checked']['border-color']};\n `\n : css`\n color: transparent;\n border: 0.0625rem solid ${components['radio-check']['border-color']};\n `}\n border-radius: min(\n calc(${base['border-radius']} ${components.checkbox['border-radius']}),\n 0.25rem\n );\n `}\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: ${components['form-control'][':disabled']['background-color']};\n opacity: ${base['disabled-opacity']};\n }\n `;\n }\n);\n\nStyledMenuItem.defaultProps = defaultThemeProp;\n\nexport const StyledAncestors = styled.div`\n ${StyledIcon} {\n width: 1em;\n height: 1em;\n }\n\n & > ${StyledText} {\n ${ellipsisOverflow};\n }\n`;\n\nexport const StyledVisibilityHidden = styled.p`\n ${hideVisually}\n`;\n\nexport const StyledSeparator = styled.li(({ theme }) => {\n return css`\n height: 0.0625rem;\n background-color: ${theme.base.palette['border-line']};\n margin: ${theme.base.spacing} 0;\n `;\n});\n\nStyledSeparator.defaultProps = defaultThemeProp;\n\nexport const StyledMenuGroupHeader = styled.div(({ theme }) => {\n return css`\n min-height: ${theme.base['hit-area']['mouse-min']};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n background-color: ${theme.base.palette['secondary-background']};\n\n @media (pointer: coarse) {\n min-height: ${theme.base['hit-area']['finger-min']};\n }\n `;\n});\n\nStyledMenuGroupHeader.defaultProps = defaultThemeProp;\n\nexport const StyledMenuListHeader = styled.legend(({ theme: { base } }) => {\n const hoverColor = tryCatch(() =>\n mix(0.95, base.palette['primary-background'], base.palette.interactive)\n );\n const activeColor = tryCatch(() =>\n mix(0.85, base.palette['primary-background'], base.palette.interactive)\n );\n\n return css`\n cursor: pointer;\n width: 100%;\n background-color: ${base.palette['primary-background']};\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n &:focus-within {\n box-shadow: ${base.shadow['focus-inset']};\n background-color: ${activeColor};\n }\n\n &:hover:not([aria-disabled='true']):not([data-current='true']) {\n background-color: ${hoverColor};\n }\n color: ${base.palette['foreground-color']};\n padding: calc(0.5 * ${base.spacing}) ${base.spacing};\n text-align: start;\n border-radius: inherit;\n\n > ${StyledGrid} {\n grid-column-gap: ${base.spacing};\n }\n\n ${StyledIcon} {\n /* Fixes vertical align issue increasing box size beyond square /\n display: block;\n }\n `;\n});\n\nStyledMenuListHeader.defaultProps = defaultThemeProp;\n\nexport const StyledMenuList = styled.ul(\n ({ theme }) => css`\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n height: 100%;\n border-radius: inherit;\n\n ${StyledEmptyState} {\n padding: ${theme.base.spacing};\n height: auto;\n }\n\n li:not(:first-child):not([role='presentation']) > ${StyledMenuGroupHeader} {\n margin-block-start: ${theme.base.spacing};\n }\n `\n);\n\nStyledMenuList.defaultProps = defaultThemeProp;\n\nexport const StyledMenuListContainer = styled.fieldset(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['primary-background']};\n border: 0;\n border-radius: inherit;\n `;\n});\n\nStyledMenuListContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFlyoutMenuListContainer = styled(StyledMenuListContainer)`\n min-width: 10rem;\n`;\n\nexport const StyledLoadingItem = styled.li`\n display: block;\n position: relative;\n height: 2.8rem;\n`;\n\nexport const StyledMenuListWrapper = styled.div(\n ({ theme }) => css`\n position: relative;\n overflow: hidden;\n transition: height ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n\n & > fieldset:first-child {\n position: relative;\n }\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n ${StyledMetaList} ${StyledMetaListItem} {\n display: inline;\n vertical-align: baseline;\n margin: 0;\n }\n `\n);\n\nStyledMenuListWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledMenu = styled.div(({ theme }) => {\n const borderStyle = `0.0625rem solid ${theme.base.palette['border-line']}`;\n\n return css`\n display: flex;\n flex-direction: column;\n\n &,\n ${StyledMenuListWrapper} {\n max-height: inherit;\n }\n\n &:focus {\n box-shadow: ${theme.base.shadow.focus};\n outline: none;\n }\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n &[data-active-scope='true'] [data-current='true'] {\n box-shadow: ${theme.base.shadow['focus-inset']};\n\n @media (forced-colors: active) {\n outline: 0.125rem solid Highlight;\n outline-offset: -0.125rem;\n }\n\n &:first-child {\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n }\n\n &:last-child {\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n }\n }\n\n ${StyledVisuallyHiddenText}:first-child {\n + ${StyledMenuListWrapper}, + header {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n }\n\n > header,\n > footer {\n padding: ${theme.base.spacing};\n }\n\n > header {\n border-bottom: ${borderStyle};\n }\n\n > footer {\n border-top: ${borderStyle};\n }\n `;\n});\n\nStyledMenu.defaultProps = defaultThemeProp;\n\nexport const StyledMenuFilter = styled.div(({ theme }) => {\n const borderRadius = `calc(${theme.components['search-input']['border-radius']} * ${theme.base['border-radius']})`;\n\n return css`\n position: relative;\n min-height: ${theme.components.input.height};\n height: ${theme.components.input.height};\n --icon-start-padding: calc(1.5 * ${theme.components.input.padding});\n /* stylelint-disable-next-line unit-allowed-list /\n --icon-size: max(1.125rem, 14px);\n\n @media (pointer: coarse) {\n min-height: ${theme.base['hit-area']['finger-min']};\n min-width: ${theme.base['hit-area']['finger-min']};\n }\n\n ${StyledFormControl} {\n height: 100%;\n border-radius: ${borderRadius};\n padding-inline-start: calc(\n var(--icon-start-padding) + var(--icon-size) + (0.5 ${theme.components.input.padding})\n );\n padding-inline-end: calc(1.5 * ${theme.components.input.padding});\n\n &::-webkit-search-cancel-button {\n display: none;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n &:focus:not([disabled]) {\n box-shadow: ${theme.base.shadow['focus-inset']};\n border-color: ${theme.components['form-control']['border-color']};\n\n :hover {\n border-color: ${theme.components['form-control'][':hover']['border-color']};\n }\n }\n }\n `;\n});\n\nStyledMenuFilter.defaultProps = defaultThemeProp;\n\nexport const StyledFilterIcon = styled(Icon)(({ theme }) => {\n const iconColor = tryCatch(() => transparentize(0.3, theme.base.palette['foreground-color']));\n\n return css`\n position: absolute;\n pointer-events: none;\n color: ${iconColor};\n inset-inline-start: var(--icon-start-padding);\n /* stylelint-disable unit-allowed-list /\n inset-block-start: calc(0.5 (${theme.components.input.height} - max(1.125rem, 14px)));\n\n @media (pointer: coarse) {\n inset-block-start: calc(\n 0.5 * (${theme.base['hit-area']['finger-min']} - max(1.125rem, 14px))\n );\n }\n /* stylelint-enable unit-allowed-list */\n `;\n});\n\nStyledFilterIcon.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"Menu.styles.js","sourceRoot":"","sources":["../../../src/components/Menu/Menu.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { hideVisually, mix, transparentize } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { StyledEmptyState } from '../EmptyState';\nimport Icon, { StyledIcon } from '../Icon';\nimport { StyledGrid } from '../Grid';\nimport { tryCatch } from '../../utils';\nimport { StyledText } from '../Text';\nimport { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';\nimport { StyledMetaList, StyledMetaListItem } from '../MetaList/MetaList';\nimport Button, { StyledButton } from '../Button';\nimport { readableColor } from '../../styles';\nimport {\n StyledPrimary,\n StyledSecondary,\n StyledSummaryItem,\n StyledSummaryItemActions,\n StyledVisual\n} from '../SummaryItem';\nimport { ellipsisOverflow } from '../../styles/mixins';\nimport { StyledFlex } from '../Flex';\nimport { StyledFormControl } from '../FormControl';\n\nimport type { MenuProps } from './Menu.types';\n\nexport const StyledExpandButton = styled(Button)`\n align-self: center;\n`;\n\nexport const StyledCheckMarkIcon = styled(Icon)``;\n\nexport const StyledMenuItem = styled.li<{\n isParentItem: boolean;\n mode?: MenuProps['mode'];\n itemLayout?: MenuProps['itemLayout'];\n isChecked?: boolean;\n selectableParent?: boolean;\n}>(\n ({\n theme: { base, components },\n isParentItem,\n itemLayout,\n mode = 'action',\n isChecked = false,\n selectableParent = false\n }) => {\n const activeColor = tryCatch(() =>\n mix(0.85, base.palette['primary-background'], base.palette.interactive)\n );\n const hoverColor = tryCatch(() =>\n mix(0.95, base.palette['primary-background'], base.palette.interactive)\n );\n\n const checkedBackground = components['radio-check'][':checked']['background-color'];\n const checkedForeground = tryCatch(() => readableColor(checkedBackground));\n\n return css`\n min-height: ${base['hit-area']['mouse-min']};\n padding-block: calc(0.75 * ${base.spacing});\n padding-inline: ${base.spacing};\n cursor: pointer;\n\n > ${StyledSummaryItem} {\n ${StyledSummaryItemActions}, ${StyledVisual} {\n display: grid;\n align-items: center;\n }\n\n > ${StyledVisual}:has(> :nth-child(2)) {\n grid-template-columns: auto auto;\n grid-column-gap: ${base.spacing};\n }\n\n ${itemLayout === 'stacked' &&\n css`\n &:has(${StyledSecondary})\n > ${StyledVisual},\n &:has(${StyledSecondary})\n > ${StyledSummaryItemActions} {\n height: ${base['hit-area']['mouse-min']};\n align-self: start;\n }\n `}\n }\n\n ${itemLayout === 'inline' &&\n css`\n justify-content: flex-start;\n\n ${StyledSummaryItem} {\n /* Sets grid columns based on SummaryItem content combinations /\n\n &:has(${StyledVisual}):has(${StyledSecondary}):has(${StyledSummaryItemActions}) {\n grid-template-areas: 'visual primary secondary actions';\n grid-template-columns: auto auto 1fr auto;\n }\n\n &:has(${StyledVisual}):has(${StyledSecondary}):not(:has(${StyledSummaryItemActions})) {\n grid-template-areas: 'visual primary secondary';\n grid-template-columns: auto auto 1fr;\n }\n\n &:has(${StyledVisual}):not(:has(${StyledSecondary})):has(${StyledSummaryItemActions}) {\n grid-template-areas: 'visual primary actions';\n grid-template-columns: auto 1fr auto;\n }\n\n &:has(${StyledVisual}):not(:has(${StyledSecondary})):not(\n :has(${StyledSummaryItemActions})\n ) {\n grid-template-areas: 'visual primary';\n grid-template-columns: auto 1fr;\n }\n\n &:not(:has(${StyledVisual})):has(${StyledSecondary}):has(${StyledSummaryItemActions}) {\n grid-template-areas: 'primary secondary actions';\n grid-template-columns: auto 1fr auto;\n }\n\n &:not(:has(${StyledVisual})):has(${StyledSecondary}):not(\n :has(${StyledSummaryItemActions})\n ) {\n grid-template-areas: 'primary secondary';\n grid-template-columns: auto 1fr;\n }\n\n &:not(:has(${StyledVisual})):not(:has(${StyledSecondary})):has(\n ${StyledSummaryItemActions}\n ) {\n grid-template-areas: 'primary actions';\n grid-template-columns: auto 1fr;\n }\n\n &:not(:has(${StyledVisual})):not(:has(${StyledSecondary})):not(\n :has(${StyledSummaryItemActions})\n ) {\n grid-template-areas: 'primary';\n grid-template-columns: 1fr;\n flex-grow: 0;\n }\n\n & > ${StyledPrimary} {\n ${ellipsisOverflow};\n }\n\n & > ${StyledSecondary} {\n ${ellipsisOverflow};\n\n ul {\n li {\n ${ellipsisOverflow};\n }\n justify-content: end;\n }\n }\n\n & > ${StyledSummaryItemActions} > ${StyledFlex} {\n justify-content: end;\n }\n }\n `}\n\n @media (pointer: coarse) {\n min-height: ${base['hit-area']['finger-min']};\n ${itemLayout === 'stacked' &&\n css`\n &:has(${StyledSecondary})\n > ${StyledVisual},\n &:has(${StyledSecondary})\n > ${StyledSummaryItemActions} {\n height: ${base['hit-area']['finger-min']};\n }\n `}\n }\n\n &:focus-within {\n background-color: ${activeColor};\n }\n\n &:hover {\n ${StyledCheckMarkIcon} {\n visibility: visible;\n ${mode === 'single-select' &&\n css`\n ${isChecked\n ? css`\n color: ${checkedBackground};\n `\n : css`\n visibility: hidden;\n `}\n `}\n ${mode === 'multi-select' &&\n css`\n ${!isChecked &&\n css`\n border-color: ${components['form-control'][':hover']['border-color']};\n `}\n `}\n }\n }\n\n &:hover:not([aria-disabled='true']) {\n background-color: ${hoverColor};\n }\n\n a:first-of-type {\n display: block;\n width: 100%;\n text-decoration: none;\n color: inherit;\n }\n\n / The enclosing menu item has required min-height already set /\n ${isParentItem &&\n selectableParent &&\n css`\n ${StyledSummaryItemActions} ${StyledButton} {\n min-height: unset;\n }\n `}\n\n ${isParentItem &&\n !selectableParent &&\n (mode === 'multi-select' \|\| mode === 'single-select') &&\n css`\n padding-inline-start: calc(1.125rem + ${base.spacing});\n `}\n\n ${StyledGrid} {\n flex-grow: 1;\n }\n\n ${StyledCheckMarkIcon} {\n margin-inline-start: 0;\n ${mode === 'single-select' &&\n css`\n ${isChecked\n ? css`\n color: ${checkedBackground};\n `\n : css`\n visibility: hidden;\n `}\n `}\n ${mode === 'multi-select' &&\n css`\n ${isChecked\n ? css`\n color: ${checkedForeground};\n background-color: ${checkedBackground};\n border: 0.0625rem solid ${components['radio-check'][':checked']['border-color']};\n `\n : css`\n color: transparent;\n border: 0.0625rem solid ${components['radio-check']['border-color']};\n `}\n border-radius: min(\n calc(${base['border-radius']} ${components.checkbox['border-radius']}),\n 0.25rem\n );\n `}\n }\n\n &[aria-disabled='true'] {\n cursor: not-allowed;\n background-color: ${components['form-control'][':disabled']['background-color']};\n opacity: ${base['disabled-opacity']};\n }\n `;\n }\n);\n\nStyledMenuItem.defaultProps = defaultThemeProp;\n\nexport const StyledAncestors = styled.div`\n ${StyledIcon} {\n width: 1em;\n height: 1em;\n }\n\n & > ${StyledText} {\n ${ellipsisOverflow};\n }\n`;\n\nexport const StyledVisibilityHidden = styled.p`\n ${hideVisually}\n`;\n\nexport const StyledSeparator = styled.li(({ theme }) => {\n return css`\n height: 0.0625rem;\n background-color: ${theme.base.palette['border-line']};\n margin: ${theme.base.spacing} 0;\n `;\n});\n\nStyledSeparator.defaultProps = defaultThemeProp;\n\nexport const StyledMenuGroupHeader = styled.div(({ theme }) => {\n return css`\n min-height: ${theme.base['hit-area']['mouse-min']};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n background-color: ${theme.base.palette['secondary-background']};\n\n @media (pointer: coarse) {\n min-height: ${theme.base['hit-area']['finger-min']};\n }\n `;\n});\n\nStyledMenuGroupHeader.defaultProps = defaultThemeProp;\n\nexport const StyledMenuListHeader = styled.legend(({ theme: { base } }) => {\n const hoverColor = tryCatch(() =>\n mix(0.95, base.palette['primary-background'], base.palette.interactive)\n );\n const activeColor = tryCatch(() =>\n mix(0.85, base.palette['primary-background'], base.palette.interactive)\n );\n\n return css`\n cursor: pointer;\n width: 100%;\n background-color: ${base.palette['primary-background']};\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n &:focus-within {\n box-shadow: ${base.shadow['focus-inset']};\n background-color: ${activeColor};\n }\n\n &:hover:not([aria-disabled='true']):not([data-current='true']) {\n background-color: ${hoverColor};\n }\n color: ${base.palette['foreground-color']};\n padding: calc(0.5 * ${base.spacing}) ${base.spacing};\n text-align: start;\n border-radius: inherit;\n\n > ${StyledGrid} {\n grid-column-gap: ${base.spacing};\n }\n\n ${StyledIcon} {\n /* Fixes vertical align issue increasing box size beyond square /\n display: block;\n }\n `;\n});\n\nStyledMenuListHeader.defaultProps = defaultThemeProp;\n\nexport const StyledMenuList = styled.ul(\n ({ theme }) => css`\n overflow-x: hidden;\n overflow-y: auto;\n list-style: none;\n height: 100%;\n border-radius: inherit;\n\n ${StyledEmptyState} {\n padding: ${theme.base.spacing};\n height: auto;\n }\n\n li:not(:first-child):not([role='presentation']) > ${StyledMenuGroupHeader} {\n margin-block-start: ${theme.base.spacing};\n }\n `\n);\n\nStyledMenuList.defaultProps = defaultThemeProp;\n\nexport const StyledMenuListContainer = styled.fieldset(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['primary-background']};\n border: 0;\n border-radius: inherit;\n `;\n});\n\nStyledMenuListContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFlyoutMenuListContainer = styled(StyledMenuListContainer)`\n min-width: 10rem;\n`;\n\nexport const StyledLoadingItem = styled.li`\n display: block;\n position: relative;\n height: 2.8rem;\n`;\n\nexport const StyledMenuListWrapper = styled.div(\n ({ theme }) => css`\n position: relative;\n overflow: hidden;\n transition: height ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n\n & > fieldset:first-child {\n position: relative;\n }\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n ${StyledMetaList} ${StyledMetaListItem} {\n display: inline;\n vertical-align: baseline;\n margin: 0;\n }\n `\n);\n\nStyledMenuListWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledMenu = styled.div(({ theme }) => {\n const borderStyle = `0.0625rem solid ${theme.base.palette['border-line']}`;\n\n return css`\n display: flex;\n flex-direction: column;\n\n &,\n ${StyledMenuListWrapper} {\n max-height: inherit;\n }\n\n &:focus-visible {\n box-shadow: ${theme.base.shadow.focus};\n outline: none;\n }\n\n &:first-child {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n\n &:last-child {\n border-bottom-left-radius: inherit;\n border-bottom-right-radius: inherit;\n }\n\n &[data-active-scope='true'] [data-current='true'] {\n box-shadow: ${theme.base.shadow['focus-inset']};\n\n @media (forced-colors: active) {\n outline: 0.125rem solid Highlight;\n outline-offset: -0.125rem;\n }\n\n &:first-child {\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n }\n\n &:last-child {\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n }\n }\n\n ${StyledVisuallyHiddenText}:first-child {\n + ${StyledMenuListWrapper}, + header {\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n }\n }\n\n > header,\n > footer {\n padding: ${theme.base.spacing};\n }\n\n > header {\n border-bottom: ${borderStyle};\n }\n\n > footer {\n border-top: ${borderStyle};\n }\n `;\n});\n\nStyledMenu.defaultProps = defaultThemeProp;\n\nexport const StyledMenuFilter = styled.div(({ theme }) => {\n const borderRadius = `calc(${theme.components['search-input']['border-radius']} * ${theme.base['border-radius']})`;\n\n return css`\n position: relative;\n min-height: ${theme.components.input.height};\n height: ${theme.components.input.height};\n --icon-start-padding: calc(1.5 * ${theme.components.input.padding});\n /* stylelint-disable-next-line unit-allowed-list /\n --icon-size: max(1.125rem, 14px);\n\n @media (pointer: coarse) {\n min-height: ${theme.base['hit-area']['finger-min']};\n min-width: ${theme.base['hit-area']['finger-min']};\n }\n\n ${StyledFormControl} {\n height: 100%;\n border-radius: ${borderRadius};\n padding-inline-start: calc(\n var(--icon-start-padding) + var(--icon-size) + (0.5 ${theme.components.input.padding})\n );\n padding-inline-end: calc(1.5 * ${theme.components.input.padding});\n\n &::-webkit-search-cancel-button {\n display: none;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n &:focus-visible:not([disabled]) {\n box-shadow: ${theme.base.shadow['focus-inset']};\n border-color: ${theme.components['form-control']['border-color']};\n\n :hover {\n border-color: ${theme.components['form-control'][':hover']['border-color']};\n }\n }\n }\n `;\n});\n\nStyledMenuFilter.defaultProps = defaultThemeProp;\n\nexport const StyledFilterIcon = styled(Icon)(({ theme }) => {\n const iconColor = tryCatch(() => transparentize(0.3, theme.base.palette['foreground-color']));\n\n return css`\n position: absolute;\n pointer-events: none;\n color: ${iconColor};\n inset-inline-start: var(--icon-start-padding);\n /* stylelint-disable unit-allowed-list /\n inset-block-start: calc(0.5 (${theme.components.input.height} - max(1.125rem, 14px)));\n\n @media (pointer: coarse) {\n inset-block-start: calc(\n 0.5 * (${theme.base['hit-area']['finger-min']} - max(1.125rem, 14px))\n );\n }\n /* stylelint-enable unit-allowed-list */\n `;\n});\n\nStyledFilterIcon.defaultProps = defaultThemeProp;\n"]}

package/lib/components/Modal/MinimizedModal.js CHANGED Viewed

@@ -39,7 +39,7 @@ const StyledMinimizedModal = styled(BareRoleButton)(({ theme: { base } }) => {
       box-shadow: ${base.shadow.high};
     }
-    &:focus {
+    &:focus-visible {
       outline: none;
       box-shadow: ${base.shadow.focus};
     }

package/lib/components/Modal/MinimizedModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MinimizedModal.js","sourceRoot":"","sources":["../../../src/components/Modal/MinimizedModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef } from 'react';\nimport type { FunctionComponent, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport BareRoleButton from '../Button/BareRoleButton';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport { defaultThemeProp } from '../../theme';\nimport type { ForwardProps } from '../../types';\nimport Flex from '../Flex';\nimport { useElement, useI18n, useModalContext, useTheme } from '../../hooks';\nimport Text from '../Text';\nimport Tooltip from '../Tooltip';\n\nimport type { ModalProps } from './Modal.types';\nimport useModalMove from './useModalMove';\nimport { StyledMinimizedLabel } from './Modal.styles';\n\nregisterIcon(timesIcon, minusIcon, undockIcon);\n\nconst StyledMinimizedModal = styled(BareRoleButton)(({ theme: { base } }) => {\n return css`\n height: 3rem;\n width: fit-content;\n min-width: 30ch;\n max-width: 56ch;\n border-radius: calc(0.5 * ${base['border-radius']}) calc(0.5 * ${base['border-radius']}) 0 0;\n color: ${base.palette['foreground-color']};\n background-color: ${base.palette['primary-background']};\n box-shadow: ${base.shadow.low};\n padding: ${base.spacing};\n cursor: pointer;\n user-select: none;\n pointer-events: auto;\n transition: box-shadow ${base.animation.speed} ${base.animation.timing.ease};\n\n @media (width < ${base.breakpoints.sm}) {\n border-radius: ${base['border-radius']};\n }\n\n &:hover {\n box-shadow: ${base.shadow.high};\n }\n\n &:focus {\n outline: none;\n box-shadow: ${base.shadow.focus};\n }\n\n ${StyledMinimizedLabel} {\n margin-inline-end: auto;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &[data-moveable] {\n position: absolute;\n }\n `;\n});\n\nStyledMinimizedModal.defaultProps = defaultThemeProp;\n\nconst MinimizedModal: FunctionComponent<ModalProps & ForwardProps> = ({\n heading,\n onBeforeClose,\n onAfterClose,\n onRequestDismiss,\n onRequestActivate,\n onRequestMinimize,\n onRequestMaximize,\n onRequestDock,\n icon,\n ...restProps\n}) => {\n const { dismissible, dockable, moveable, maximizable, dock, maximize, activate, unmount } =\n useModalContext();\n\n const [titleTarget, setTitleTarget] = useElement();\n\n const t = useI18n();\n\n // Note StyledMinimizedModal is a div but has the role of button\n const ref = useRef<HTMLDivElement>(null);\n\n const modalMoveReturnRef = useModalMove({\n enabled: !!moveable,\n moveRef: ref\n });\n const theme = useTheme();\n\n return (\n <Flex\n {...restProps}\n container={{ alignItems: 'center', justify: 'between', pad: [undefined, 2], gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledMinimizedModal}\n aria-label={`${t('activate')} ${heading}`}\n onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n // Prevent issues when auto focusing on close button.\n if ((e.key === 'Space' \|\| e.key === 'Enter') && e.target === e.currentTarget)\n e.preventDefault();\n }}\n onClick={() => {\n if (modalMoveReturnRef.current?.mouseMoved) return;\n if (onRequestActivate?.() !== false && !dockable) activate();\n if (onRequestDock?.() !== false && dockable) dock();\n }}\n data-app-region\n data-moveable={moveable ? '' : undefined}\n ref={ref}\n >\n {icon && (\n <Icon\n name={icon}\n shape='square'\n size='m'\n background={theme.base.palette['app-background']}\n />\n )}\n <Text as={StyledMinimizedLabel} ref={setTitleTarget}>\n {heading}\n </Text>\n\n {(maximizable \|\| dockable \|\| dismissible) && (\n <Flex container>\n {maximizable && (\n <Button\n label={t('maximize')}\n aria-label={t('modal_maximize')}\n variant='simple'\n onClick={() => {\n if (onRequestMaximize?.() !== false) {\n maximize();\n }\n }}\n icon\n >\n <Icon name='undock' />\n </Button>\n )}\n\n {dockable && (\n <Button\n label={t('dock')}\n aria-label={t('modal_dock')}\n variant='simple'\n onClick={() => {\n if (onRequestDock?.() !== false) {\n dock();\n }\n }}\n icon\n >\n <Icon name='dock' />\n </Button>\n )}\n\n {dismissible && (\n <Button\n label={t('close')}\n aria-label={t('modal_close')}\n variant='simple'\n onClick={() => {\n if (onRequestDismiss?.() !== false) {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }}\n icon\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n )}\n\n {titleTarget && (\n <Tooltip target={titleTarget} smart describeTarget={false}>\n {heading}\n </Tooltip>\n )}\n </Flex>\n );\n};\n\nexport default MinimizedModal;\n"]}
1	+ {"version":3,"file":"MinimizedModal.js","sourceRoot":"","sources":["../../../src/components/Modal/MinimizedModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef } from 'react';\nimport type { FunctionComponent, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport BareRoleButton from '../Button/BareRoleButton';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport { defaultThemeProp } from '../../theme';\nimport type { ForwardProps } from '../../types';\nimport Flex from '../Flex';\nimport { useElement, useI18n, useModalContext, useTheme } from '../../hooks';\nimport Text from '../Text';\nimport Tooltip from '../Tooltip';\n\nimport type { ModalProps } from './Modal.types';\nimport useModalMove from './useModalMove';\nimport { StyledMinimizedLabel } from './Modal.styles';\n\nregisterIcon(timesIcon, minusIcon, undockIcon);\n\nconst StyledMinimizedModal = styled(BareRoleButton)(({ theme: { base } }) => {\n return css`\n height: 3rem;\n width: fit-content;\n min-width: 30ch;\n max-width: 56ch;\n border-radius: calc(0.5 * ${base['border-radius']}) calc(0.5 * ${base['border-radius']}) 0 0;\n color: ${base.palette['foreground-color']};\n background-color: ${base.palette['primary-background']};\n box-shadow: ${base.shadow.low};\n padding: ${base.spacing};\n cursor: pointer;\n user-select: none;\n pointer-events: auto;\n transition: box-shadow ${base.animation.speed} ${base.animation.timing.ease};\n\n @media (width < ${base.breakpoints.sm}) {\n border-radius: ${base['border-radius']};\n }\n\n &:hover {\n box-shadow: ${base.shadow.high};\n }\n\n &:focus-visible {\n outline: none;\n box-shadow: ${base.shadow.focus};\n }\n\n ${StyledMinimizedLabel} {\n margin-inline-end: auto;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &[data-moveable] {\n position: absolute;\n }\n `;\n});\n\nStyledMinimizedModal.defaultProps = defaultThemeProp;\n\nconst MinimizedModal: FunctionComponent<ModalProps & ForwardProps> = ({\n heading,\n onBeforeClose,\n onAfterClose,\n onRequestDismiss,\n onRequestActivate,\n onRequestMinimize,\n onRequestMaximize,\n onRequestDock,\n icon,\n ...restProps\n}) => {\n const { dismissible, dockable, moveable, maximizable, dock, maximize, activate, unmount } =\n useModalContext();\n\n const [titleTarget, setTitleTarget] = useElement();\n\n const t = useI18n();\n\n // Note StyledMinimizedModal is a div but has the role of button\n const ref = useRef<HTMLDivElement>(null);\n\n const modalMoveReturnRef = useModalMove({\n enabled: !!moveable,\n moveRef: ref\n });\n const theme = useTheme();\n\n return (\n <Flex\n {...restProps}\n container={{ alignItems: 'center', justify: 'between', pad: [undefined, 2], gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledMinimizedModal}\n aria-label={`${t('activate')} ${heading}`}\n onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n // Prevent issues when auto focusing on close button.\n if ((e.key === 'Space' \|\| e.key === 'Enter') && e.target === e.currentTarget)\n e.preventDefault();\n }}\n onClick={() => {\n if (modalMoveReturnRef.current?.mouseMoved) return;\n if (onRequestActivate?.() !== false && !dockable) activate();\n if (onRequestDock?.() !== false && dockable) dock();\n }}\n data-app-region\n data-moveable={moveable ? '' : undefined}\n ref={ref}\n >\n {icon && (\n <Icon\n name={icon}\n shape='square'\n size='m'\n background={theme.base.palette['app-background']}\n />\n )}\n <Text as={StyledMinimizedLabel} ref={setTitleTarget}>\n {heading}\n </Text>\n\n {(maximizable \|\| dockable \|\| dismissible) && (\n <Flex container>\n {maximizable && (\n <Button\n label={t('maximize')}\n aria-label={t('modal_maximize')}\n variant='simple'\n onClick={() => {\n if (onRequestMaximize?.() !== false) {\n maximize();\n }\n }}\n icon\n >\n <Icon name='undock' />\n </Button>\n )}\n\n {dockable && (\n <Button\n label={t('dock')}\n aria-label={t('modal_dock')}\n variant='simple'\n onClick={() => {\n if (onRequestDock?.() !== false) {\n dock();\n }\n }}\n icon\n >\n <Icon name='dock' />\n </Button>\n )}\n\n {dismissible && (\n <Button\n label={t('close')}\n aria-label={t('modal_close')}\n variant='simple'\n onClick={() => {\n if (onRequestDismiss?.() !== false) {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }}\n icon\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n )}\n\n {titleTarget && (\n <Tooltip target={titleTarget} smart describeTarget={false}>\n {heading}\n </Tooltip>\n )}\n </Flex>\n );\n};\n\nexport default MinimizedModal;\n"]}

package/lib/components/MultiStepForm/FormProgress.styles.js CHANGED Viewed

@@ -127,7 +127,7 @@ export const StepMarker = styled(BareButton)(({ current, depth, completed, click
       transition: all calc(2 * ${animationSpeed}) ${animationTiming};
     }
-    &:focus::before {
+    &:focus-visible::before {
       box-shadow: ${focusShadow};
       @media (forced-colors: active) {

package/lib/components/MultiStepForm/FormProgress.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormProgress.styles.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/FormProgress.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { size } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport BareButton from '../Button/BareButton';\nimport Popover from '../Popover';\nimport { StyledText } from '../Text';\nimport { calculateFontSize, type FontSize } from '../../styles';\nimport { useDirection } from '../../hooks';\nimport Flex from '../Flex';\nimport { ellipsisOverflow } from '../../styles/mixins';\n\nimport type { Step } from './MultiStepForm.types';\n\n/** Min width of each step item including labels in ch units /\nexport const stepItemMinWidth = 15;\n\n/* Min width of step marker without labels in ch units /\nexport const stepMarkerMinWidth = 3;\n\nexport const CurrentStepPopover = styled(Popover)`\n max-width: 100%;\n background-color: transparent;\n z-index: 0;\n box-shadow: none;\n animation: none;\n\n & > ${StyledText} {\n ${ellipsisOverflow}\n }\n`;\n\nconst calculateStepMarkerSizes = (fontSize: string, fontScale: string \| number) => {\n const { m: stepMarkerSize } = calculateFontSize(fontSize, fontScale);\n return {\n stepMarkerSize,\n smallStepMarkerSize: `calc(${stepMarkerSize} / 1.5)`,\n bigStepMarkerSize: `calc(${stepMarkerSize} 1.5)`\n };\n};\n\nconst calculateBarTopPadding = (\n fontSize: string,\n fontScale: string \| number,\n lineHeight: string\n) => {\n const { bigStepMarkerSize } = calculateStepMarkerSizes(fontSize, fontScale);\n return {\n // assuming the step progress always contains current step marker which is the biggest one,\n // the top padding of the bar should be half of the big step marker size minus line height of the bar\n // to be vertically centered\n stepBarTopPadding: `calc((${bigStepMarkerSize} / 2) - (${lineHeight} / 2))`\n };\n};\n\nexport const StyledBar = styled.div<{ shifted?: boolean }>(({ shifted, theme }) => {\n const {\n base: { 'font-size': fontSize, 'font-scale': fontScale },\n components: {\n 'form-control': { 'border-color': borderColor }\n }\n } = theme;\n\n const lineHeight = '0.125rem';\n const { stepBarTopPadding } = calculateBarTopPadding(fontSize, fontScale, lineHeight);\n\n return css`\n position: absolute;\n ${shifted && `inset-block-start: ${stepBarTopPadding};`}\n width: 100%;\n height: ${lineHeight};\n background: ${borderColor};\n\n @media (forced-colors: active) {\n background: CanvasText;\n }\n `;\n});\n\nStyledBar.defaultProps = defaultThemeProp;\n\nexport const StyledFill = styled.div(({ theme }) => {\n const {\n base: {\n animation: {\n speed: animationSpeed,\n timing: { ease: animationTiming }\n },\n palette: { interactive }\n }\n } = theme;\n\n const { ltr } = useDirection();\n\n const markedLineThicknessFactor = 2;\n\n return css`\n position: absolute;\n width: 100%;\n height: calc(100% * ${markedLineThicknessFactor});\n\n /* top position based on line thickness factor to keep the fill centered /\n top: calc(-50% (${markedLineThicknessFactor} - 1));\n background: ${interactive};\n transition: all calc(2 * ${animationSpeed}) ${animationTiming};\n transform: scaleX(var(--fillScale));\n transform-origin: ${ltr ? 0 : '100%'} 0;\n\n @media (forced-colors: active) {\n background: Highlight;\n }\n `;\n});\n\nStyledFill.defaultProps = defaultThemeProp;\n\nexport const StyledFormProgress = styled(Flex)<{ showStepNames?: boolean }>(({\n showStepNames,\n theme\n}) => {\n const {\n base: { spacing, 'font-size': fontSize, 'font-scale': fontScale },\n components: {\n text: {\n h4: { 'font-size': h3fontSize }\n }\n }\n } = theme;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n position: relative;\n ${!showStepNames &&\n `padding-block-end: calc(${spacing} + ${fontSizes[h3fontSize as FontSize]} * 1.35);`}\n `;\n});\n\nStyledFormProgress.defaultProps = defaultThemeProp;\n\nexport const StepMarker = styled(BareButton)<{\n current: boolean;\n depth: Step['depth'];\n completed?: Step['completed'];\n clickable?: boolean;\n}>(({ current, depth, completed, clickable, theme }) => {\n const {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n animation: {\n speed: animationSpeed,\n timing: { ease: animationTiming }\n },\n palette: { interactive, 'primary-background': primaryBackground },\n shadow: { focus: focusShadow },\n 'hit-area': { 'mouse-min': buttonSize, 'finger-min': touchButtonSize }\n },\n components: {\n 'form-control': { 'border-color': borderColor, 'border-width': borderWidth }\n }\n } = theme;\n\n const { stepMarkerSize, smallStepMarkerSize, bigStepMarkerSize } = calculateStepMarkerSizes(\n fontSize,\n fontScale\n );\n\n // Determine the actual size for this marker based on its state\n let markerSize = stepMarkerSize;\n if (current) {\n markerSize = bigStepMarkerSize;\n } else if (depth === 1) {\n markerSize = smallStepMarkerSize;\n }\n\n return css`\n position: relative;\n z-index: 1;\n\n /* Fixed container size based on the biggest marker to prevent layout shifts /\n ${size(bigStepMarkerSize)}\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n\n ${clickable\n ? css`\n border-color: ${interactive};\n `\n : css`\n cursor: default;\n `}\n\n &::before {\n content: '';\n ${size(markerSize)}\n position: absolute;\n border-radius: 100%;\n transition: all calc(2 ${animationSpeed}) ${animationTiming};\n }\n\n &:focus::before {\n box-shadow: ${focusShadow};\n\n @media (forced-colors: active) {\n outline: 0.125rem solid Highlight;\n outline-offset: 0.125rem;\n }\n }\n\n ${!current &&\n css`\n border-color: transparent;\n background: transparent;\n\n &::before {\n background: ${primaryBackground};\n border: calc(2 * ${borderWidth}) solid ${clickable ? interactive : borderColor};\n\n ${completed &&\n css`\n background: ${interactive};\n border-color: ${interactive};\n `}\n\n @media (forced-colors: active) {\n background: ${completed ? 'Highlight' : 'Canvas'};\n border-color: ${clickable ? 'Highlight' : 'CanvasText'};\n }\n }\n `}\n\n ${current &&\n css`\n &::before {\n background: ${interactive};\n\n @media (forced-colors: active) {\n background: Highlight;\n }\n }\n `}\n\n ::after {\n content: '';\n position: absolute;\n ${size(buttonSize)}\n inset-block-start: ${`calc((${buttonSize} - ${bigStepMarkerSize}) / -2) `};\n inset-inline-start: ${`calc((${buttonSize} - ${bigStepMarkerSize}) / -2) `};\n\n @media (pointer: coarse) {\n inset-block-start: ${`calc((${touchButtonSize} - ${bigStepMarkerSize}) / -2) `};\n inset-inline-start: ${`calc((${touchButtonSize} - ${bigStepMarkerSize}) / -2) `};\n ${size(touchButtonSize)}\n }\n }\n `;\n});\n\nStepMarker.defaultProps = defaultThemeProp;\n\nexport const StyleHorizontalStepMarkers = styled.ol<{ showStepNames?: boolean }>(\n ({ showStepNames, theme }) => {\n return css`\n list-style-type: none;\n justify-content: space-between;\n\n li {\n display: flex;\n position: relative;\n flex: 1 1 0;\n\n /* min width changes based on whether step names are shown /\n min-width: ${`${showStepNames ? stepItemMinWidth : stepMarkerMinWidth}ch`};\n font-size: small;\n margin-inline: ${theme.base.spacing};\n flex-direction: column;\n align-items: center;\n text-align: center;\n }\n\n li:first-child,\n li:last-child {\n flex: 0.5 1 0;\n / stylelint-disable-next-line unit-allowed-list /\n min-width: ${`${showStepNames ? stepItemMinWidth / 2 : stepMarkerMinWidth / 2}ch`};\n }\n\n li:first-child {\n align-items: flex-start;\n text-align: left;\n margin-inline-start: 0;\n padding-inline-start: 0;\n\n ${StepMarker}::before {\n inset-inline-start: 0;\n }\n }\n\n li:last-child {\n align-items: flex-end;\n text-align: right;\n margin-inline-end: 0;\n padding-inline-end: 0;\n\n ${StepMarker}::before {\n inset-inline-end: 0;\n }\n }\n\n &:has(:focus-visible) {\n box-shadow: ${theme.base.shadow['focus-group']};\n }\n `;\n }\n);\n\nStyleHorizontalStepMarkers.defaultProps = defaultThemeProp;\n\nexport const StyledVerticalStepMarkers = styled.ol`\n list-style-type: none;\n`;\n\nexport const StyledBulletWrapper = styled.div<{\n hasNext: boolean;\n prior: boolean;\n}>(({ theme, hasNext, prior }) => {\n const {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n animation: { speed: animationSpeed },\n palette: { interactive }\n },\n components: {\n 'form-control': { 'border-color': borderColor }\n }\n } = theme;\n\n const baseLineWidth = '0.125rem';\n const lineWidth = prior ? `calc(2 ${baseLineWidth})` : baseLineWidth;\n\n const { bigStepMarkerSize } = calculateStepMarkerSizes(fontSize, fontScale);\n\n return css`\n position: relative;\n min-width: 2rem;\n\n ${hasNext &&\n css`\n &::after {\n content: '';\n position: absolute;\n\n /* Center the line horizontally and vertically relative to the step marker /\n inset-block-start: calc(${bigStepMarkerSize});\n inset-inline-start: calc(50% - (${lineWidth} / 2));\n width: ${lineWidth};\n height: 100%;\n background: ${prior ? interactive : borderColor};\n transition: background calc(2 ${animationSpeed});\n\n @media (forced-colors: active) {\n background: ${prior ? 'Highlight' : 'CanvasText'};\n }\n }\n `}\n `;\n});\n\nStyledBulletWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledStepText = styled.div(({ theme }) => {\n return css`\n padding-block: ${theme.base.spacing};\n overflow-wrap: break-word;\n `;\n});\n\nStyledStepText.defaultProps = defaultThemeProp;\n\nexport const StyledHorizontalStepText = styled.div(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding-block: ${theme.base.spacing};\n overflow-wrap: break-word;\n min-width: inherit;\n font-size: ${fontSize.xxs};\n text-align: inherit;\n `;\n});\n\nStyledHorizontalStepText.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"FormProgress.styles.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/FormProgress.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { size } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport BareButton from '../Button/BareButton';\nimport Popover from '../Popover';\nimport { StyledText } from '../Text';\nimport { calculateFontSize, type FontSize } from '../../styles';\nimport { useDirection } from '../../hooks';\nimport Flex from '../Flex';\nimport { ellipsisOverflow } from '../../styles/mixins';\n\nimport type { Step } from './MultiStepForm.types';\n\n/** Min width of each step item including labels in ch units /\nexport const stepItemMinWidth = 15;\n\n/* Min width of step marker without labels in ch units /\nexport const stepMarkerMinWidth = 3;\n\nexport const CurrentStepPopover = styled(Popover)`\n max-width: 100%;\n background-color: transparent;\n z-index: 0;\n box-shadow: none;\n animation: none;\n\n & > ${StyledText} {\n ${ellipsisOverflow}\n }\n`;\n\nconst calculateStepMarkerSizes = (fontSize: string, fontScale: string \| number) => {\n const { m: stepMarkerSize } = calculateFontSize(fontSize, fontScale);\n return {\n stepMarkerSize,\n smallStepMarkerSize: `calc(${stepMarkerSize} / 1.5)`,\n bigStepMarkerSize: `calc(${stepMarkerSize} 1.5)`\n };\n};\n\nconst calculateBarTopPadding = (\n fontSize: string,\n fontScale: string \| number,\n lineHeight: string\n) => {\n const { bigStepMarkerSize } = calculateStepMarkerSizes(fontSize, fontScale);\n return {\n // assuming the step progress always contains current step marker which is the biggest one,\n // the top padding of the bar should be half of the big step marker size minus line height of the bar\n // to be vertically centered\n stepBarTopPadding: `calc((${bigStepMarkerSize} / 2) - (${lineHeight} / 2))`\n };\n};\n\nexport const StyledBar = styled.div<{ shifted?: boolean }>(({ shifted, theme }) => {\n const {\n base: { 'font-size': fontSize, 'font-scale': fontScale },\n components: {\n 'form-control': { 'border-color': borderColor }\n }\n } = theme;\n\n const lineHeight = '0.125rem';\n const { stepBarTopPadding } = calculateBarTopPadding(fontSize, fontScale, lineHeight);\n\n return css`\n position: absolute;\n ${shifted && `inset-block-start: ${stepBarTopPadding};`}\n width: 100%;\n height: ${lineHeight};\n background: ${borderColor};\n\n @media (forced-colors: active) {\n background: CanvasText;\n }\n `;\n});\n\nStyledBar.defaultProps = defaultThemeProp;\n\nexport const StyledFill = styled.div(({ theme }) => {\n const {\n base: {\n animation: {\n speed: animationSpeed,\n timing: { ease: animationTiming }\n },\n palette: { interactive }\n }\n } = theme;\n\n const { ltr } = useDirection();\n\n const markedLineThicknessFactor = 2;\n\n return css`\n position: absolute;\n width: 100%;\n height: calc(100% * ${markedLineThicknessFactor});\n\n /* top position based on line thickness factor to keep the fill centered /\n top: calc(-50% (${markedLineThicknessFactor} - 1));\n background: ${interactive};\n transition: all calc(2 * ${animationSpeed}) ${animationTiming};\n transform: scaleX(var(--fillScale));\n transform-origin: ${ltr ? 0 : '100%'} 0;\n\n @media (forced-colors: active) {\n background: Highlight;\n }\n `;\n});\n\nStyledFill.defaultProps = defaultThemeProp;\n\nexport const StyledFormProgress = styled(Flex)<{ showStepNames?: boolean }>(({\n showStepNames,\n theme\n}) => {\n const {\n base: { spacing, 'font-size': fontSize, 'font-scale': fontScale },\n components: {\n text: {\n h4: { 'font-size': h3fontSize }\n }\n }\n } = theme;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n position: relative;\n ${!showStepNames &&\n `padding-block-end: calc(${spacing} + ${fontSizes[h3fontSize as FontSize]} * 1.35);`}\n `;\n});\n\nStyledFormProgress.defaultProps = defaultThemeProp;\n\nexport const StepMarker = styled(BareButton)<{\n current: boolean;\n depth: Step['depth'];\n completed?: Step['completed'];\n clickable?: boolean;\n}>(({ current, depth, completed, clickable, theme }) => {\n const {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n animation: {\n speed: animationSpeed,\n timing: { ease: animationTiming }\n },\n palette: { interactive, 'primary-background': primaryBackground },\n shadow: { focus: focusShadow },\n 'hit-area': { 'mouse-min': buttonSize, 'finger-min': touchButtonSize }\n },\n components: {\n 'form-control': { 'border-color': borderColor, 'border-width': borderWidth }\n }\n } = theme;\n\n const { stepMarkerSize, smallStepMarkerSize, bigStepMarkerSize } = calculateStepMarkerSizes(\n fontSize,\n fontScale\n );\n\n // Determine the actual size for this marker based on its state\n let markerSize = stepMarkerSize;\n if (current) {\n markerSize = bigStepMarkerSize;\n } else if (depth === 1) {\n markerSize = smallStepMarkerSize;\n }\n\n return css`\n position: relative;\n z-index: 1;\n\n /* Fixed container size based on the biggest marker to prevent layout shifts /\n ${size(bigStepMarkerSize)}\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n\n ${clickable\n ? css`\n border-color: ${interactive};\n `\n : css`\n cursor: default;\n `}\n\n &::before {\n content: '';\n ${size(markerSize)}\n position: absolute;\n border-radius: 100%;\n transition: all calc(2 ${animationSpeed}) ${animationTiming};\n }\n\n &:focus-visible::before {\n box-shadow: ${focusShadow};\n\n @media (forced-colors: active) {\n outline: 0.125rem solid Highlight;\n outline-offset: 0.125rem;\n }\n }\n\n ${!current &&\n css`\n border-color: transparent;\n background: transparent;\n\n &::before {\n background: ${primaryBackground};\n border: calc(2 * ${borderWidth}) solid ${clickable ? interactive : borderColor};\n\n ${completed &&\n css`\n background: ${interactive};\n border-color: ${interactive};\n `}\n\n @media (forced-colors: active) {\n background: ${completed ? 'Highlight' : 'Canvas'};\n border-color: ${clickable ? 'Highlight' : 'CanvasText'};\n }\n }\n `}\n\n ${current &&\n css`\n &::before {\n background: ${interactive};\n\n @media (forced-colors: active) {\n background: Highlight;\n }\n }\n `}\n\n ::after {\n content: '';\n position: absolute;\n ${size(buttonSize)}\n inset-block-start: ${`calc((${buttonSize} - ${bigStepMarkerSize}) / -2) `};\n inset-inline-start: ${`calc((${buttonSize} - ${bigStepMarkerSize}) / -2) `};\n\n @media (pointer: coarse) {\n inset-block-start: ${`calc((${touchButtonSize} - ${bigStepMarkerSize}) / -2) `};\n inset-inline-start: ${`calc((${touchButtonSize} - ${bigStepMarkerSize}) / -2) `};\n ${size(touchButtonSize)}\n }\n }\n `;\n});\n\nStepMarker.defaultProps = defaultThemeProp;\n\nexport const StyleHorizontalStepMarkers = styled.ol<{ showStepNames?: boolean }>(\n ({ showStepNames, theme }) => {\n return css`\n list-style-type: none;\n justify-content: space-between;\n\n li {\n display: flex;\n position: relative;\n flex: 1 1 0;\n\n /* min width changes based on whether step names are shown /\n min-width: ${`${showStepNames ? stepItemMinWidth : stepMarkerMinWidth}ch`};\n font-size: small;\n margin-inline: ${theme.base.spacing};\n flex-direction: column;\n align-items: center;\n text-align: center;\n }\n\n li:first-child,\n li:last-child {\n flex: 0.5 1 0;\n / stylelint-disable-next-line unit-allowed-list /\n min-width: ${`${showStepNames ? stepItemMinWidth / 2 : stepMarkerMinWidth / 2}ch`};\n }\n\n li:first-child {\n align-items: flex-start;\n text-align: left;\n margin-inline-start: 0;\n padding-inline-start: 0;\n\n ${StepMarker}::before {\n inset-inline-start: 0;\n }\n }\n\n li:last-child {\n align-items: flex-end;\n text-align: right;\n margin-inline-end: 0;\n padding-inline-end: 0;\n\n ${StepMarker}::before {\n inset-inline-end: 0;\n }\n }\n\n &:has(:focus-visible) {\n box-shadow: ${theme.base.shadow['focus-group']};\n }\n `;\n }\n);\n\nStyleHorizontalStepMarkers.defaultProps = defaultThemeProp;\n\nexport const StyledVerticalStepMarkers = styled.ol`\n list-style-type: none;\n`;\n\nexport const StyledBulletWrapper = styled.div<{\n hasNext: boolean;\n prior: boolean;\n}>(({ theme, hasNext, prior }) => {\n const {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n animation: { speed: animationSpeed },\n palette: { interactive }\n },\n components: {\n 'form-control': { 'border-color': borderColor }\n }\n } = theme;\n\n const baseLineWidth = '0.125rem';\n const lineWidth = prior ? `calc(2 ${baseLineWidth})` : baseLineWidth;\n\n const { bigStepMarkerSize } = calculateStepMarkerSizes(fontSize, fontScale);\n\n return css`\n position: relative;\n min-width: 2rem;\n\n ${hasNext &&\n css`\n &::after {\n content: '';\n position: absolute;\n\n /* Center the line horizontally and vertically relative to the step marker /\n inset-block-start: calc(${bigStepMarkerSize});\n inset-inline-start: calc(50% - (${lineWidth} / 2));\n width: ${lineWidth};\n height: 100%;\n background: ${prior ? interactive : borderColor};\n transition: background calc(2 ${animationSpeed});\n\n @media (forced-colors: active) {\n background: ${prior ? 'Highlight' : 'CanvasText'};\n }\n }\n `}\n `;\n});\n\nStyledBulletWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledStepText = styled.div(({ theme }) => {\n return css`\n padding-block: ${theme.base.spacing};\n overflow-wrap: break-word;\n `;\n});\n\nStyledStepText.defaultProps = defaultThemeProp;\n\nexport const StyledHorizontalStepText = styled.div(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding-block: ${theme.base.spacing};\n overflow-wrap: break-word;\n min-width: inherit;\n font-size: ${fontSize.xxs};\n text-align: inherit;\n `;\n});\n\nStyledHorizontalStepText.defaultProps = defaultThemeProp;\n"]}

package/lib/components/PageTemplates/GridLayout/EditorBackground.js CHANGED Viewed

@@ -43,7 +43,7 @@ const StyledPageBreak = styled.div(({ containerPadding, rowHeight, theme, margin
         font-size: 0.75rem;
         line-height: 1;
         transform: translate(0, -50%);
-        background-color: ${palette['app-background']};
+        background: ${palette['app-background']};
         color: ${palette['border-line']};
         padding-inline-end: 0.25rem;
       }

package/lib/components/PageTemplates/GridLayout/EditorBackground.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EditorBackground.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorBackground.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,OAAO,IAAI,MAAM,YAAY,CAAC;AAE9B,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,OAAO,mBAAmB,MAAM,UAAU,CAAC;AAC3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;CAK9B,CAAC;AAEF,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAC/B,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,EAAE;IACpC,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,KAAK,CAAC;IACV,MAAM,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IAClE,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC;IAEzE,OAAO,GAAG,CAAA;;0BAEY,WAAW;oBACjB,UAAU;oBACV,SAAS;uBACN,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;KACxD,CAAC;AACJ,CAAC,CACF,CAAC;AACF,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAU/C,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAChC,CAAC,EAAE,gBAAgB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE;IACpE,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;4BAEc,gBAAgB,CAAC,CAAC,CAAC;0BACrB,gBAAgB,CAAC,CAAC,CAAC;2BAClB,gBAAgB,CAAC,CAAC,CAAC,GAAG,SAAS,GAAG,CAAC,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;;4BAExD,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;;uCAEP,OAAO,CAAC,aAAa,CAAC;;;oBAGzC,MAAM;;;;;~~4BAKE~~,OAAO,CAAC,gBAAgB,CAAC;~~iBACpC~~,OAAO,CAAC,aAAa,CAAC;;;KAGlC,CAAC;AACJ,CAAC,CACF,CAAC;AACF,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAUhD;;;GAGG;AACH,MAAM,gBAAgB,GAA8B,CAAC,EACnD,MAAM,EACN,UAAU,EACV,SAAS,EACT,WAAW,EACX,WAAW,EACZ,EAAE,EAAE;IACH,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,GAAG,mBAAmB,CAAC,IAAI,CAAC,CAAC;IAE/D,MAAM,YAAY,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACnF,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,WAAW,IAAI,CAAC,CAAC,CAAC;IACtD,MAAM,YAAY,GAAG,CAAC,IAAI,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC;IAC7C,MAAM,KAAK,GAAG,iBAAiB,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC;IAExD,wFAAwF;IACxF,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACvE,MAAM,UAAU,GAAG,iBAAiB,CAAC,CAAC,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC;IAE9D,OAAO,CACL,MAAC,UAAU,IAAC,SAAS,EAAE,EAAE,IAAI,EAAE,UAAU,UAAU,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,aACrF,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CACd,KAAC,cAAc,IAEb,SAAS,EAAE,SAAS;gBACpB,yDAAyD;gBACzD,WAAW,EAAE,WAAW,IAAI,CAAC,GAAG,YAAY,GAAG,UAAU,IAHpD,CAAC,CAIN,CACH,CAAC,EACD,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CACnB,KAAC,eAAe,IAEd,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,WAAY,EACjC,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,CAAC,CAAC,aAAa,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAL5B,CAAC,CAMN,CACH,CAAC,IACS,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import type { FC } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { Layout } from 'react-grid-layout';\nimport { rgba } from 'polished';\n\nimport Grid from '../../Grid';\nimport type { NoChildrenProp } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport { useI18n } from '../../../hooks';\n\nimport useGridLayoutConfig from './config';\nimport { getArrayFromRange } from './utils';\n\nconst StyledGrid = styled(Grid)`\n position: absolute;\n z-index: -1;\n pointer-events: none;\n inline-size: 100%;\n`;\n\nconst StyledGridCell = styled.div<{ rowHeight: number; highlighted: boolean }>(\n ({ theme, highlighted, rowHeight }) => {\n const {\n base: { palette }\n } = theme;\n const borderColor = palette[highlighted ? 'warn' : 'border-line'];\n const background = highlighted ? rgba(palette.warn, 0.1) : 'transparent';\n\n return css`\n /* stylelint-disable-next-line unit-allowed-list /\n border: 1px solid ${borderColor};\n background: ${background};\n block-size: ${rowHeight}px;\n border-radius: ${theme.components.card['border-radius']};\n `;\n }\n);\nStyledGridCell.defaultProps = defaultThemeProp;\n\ninterface PageBreakProps {\n rowsAbove: number;\n rowHeight: number;\n margin: [number, number];\n containerPadding: [number, number];\n prefix: string;\n}\n\nconst StyledPageBreak = styled.div<PageBreakProps>(\n ({ containerPadding, rowHeight, theme, margin, rowsAbove, prefix }) => {\n const {\n base: { palette }\n } = theme;\n return css`\n position: absolute;\n inset-inline-start: ${containerPadding[0]}px;\n inset-inline-end: ${containerPadding[0]}px;\n inset-block-start: ${containerPadding[1] + rowsAbove (rowHeight + margin[1])}px;\n /* stylelint-disable-next-line unit-allowed-list /\n margin-block-start: ${-margin[1] / 2 - 1}px;\n / stylelint-disable-next-line unit-allowed-list /\n border-block-start: 2px dashed ${palette['border-line']};\n\n &::before {\n content: '${prefix}';\n position: absolute;\n font-size: 0.75rem;\n line-height: 1;\n transform: translate(0, -50%);\n background~~-color~~: ${palette['app-background']};\n color: ${palette['border-line']};\n padding-inline-end: 0.25rem;\n }\n `;\n }\n);\nStyledPageBreak.defaultProps = defaultThemeProp;\n\ninterface EditorBackgroundProps extends NoChildrenProp {\n layout?: Layout[];\n numColumns: number;\n rowHeight: number;\n rowsPerPage: number \| null; // null when not applying auto-fit\n highlighted: boolean;\n}\n\n/\n Renders background grid-cells for GridEditor\n * @component\n /\nconst EditorBackground: FC<EditorBackgroundProps> = ({\n layout,\n numColumns,\n rowHeight,\n rowsPerPage,\n highlighted\n}) => {\n const t = useI18n();\n const { margin, containerPadding } = useGridLayoutConfig(true);\n\n const maxYInLayout = layout ? Math.max(...layout.map(item => item.y + item.h)) : 0;\n const maxY = Math.max(maxYInLayout, rowsPerPage \|\| 0);\n const numGridCells = (maxY + 1) numColumns;\n const cells = getArrayFromRange(0, numGridCells, false);\n\n // rowsPerPage will be null if auto-fit is disabled. Don't show pageBreaks in that case.\n const numPageBreaks = rowsPerPage ? Math.floor(maxY / rowsPerPage) : 0;\n const pageBreaks = getArrayFromRange(0, numPageBreaks, false);\n\n return (\n <StyledGrid container={{ cols: `repeat(${numColumns}, 1fr)`, gap: 2, pad: [0, 2, 2, 2] }}>\n {cells.map(n => (\n <StyledGridCell\n key={n}\n rowHeight={rowHeight}\n // Highlight all cells except the dummy row at the bottom\n highlighted={highlighted && n < numGridCells - numColumns}\n />\n ))}\n {pageBreaks.map(n => (\n <StyledPageBreak\n key={n}\n rowsAbove={(n + 1) * rowsPerPage!}\n rowHeight={rowHeight}\n margin={margin}\n containerPadding={containerPadding}\n prefix={t('page_number', [n + 1])}\n />\n ))}\n </StyledGrid>\n );\n};\n\nexport default EditorBackground;\n"]}
1	+ {"version":3,"file":"EditorBackground.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorBackground.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { FC } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { Layout } from 'react-grid-layout';\nimport { rgba } from 'polished';\n\nimport Grid from '../../Grid';\nimport type { NoChildrenProp } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport { useI18n } from '../../../hooks';\n\nimport useGridLayoutConfig from './config';\nimport { getArrayFromRange } from './utils';\n\nconst StyledGrid = styled(Grid)`\n position: absolute;\n z-index: -1;\n pointer-events: none;\n inline-size: 100%;\n`;\n\nconst StyledGridCell = styled.div<{ rowHeight: number; highlighted: boolean }>(\n ({ theme, highlighted, rowHeight }) => {\n const {\n base: { palette }\n } = theme;\n const borderColor = palette[highlighted ? 'warn' : 'border-line'];\n const background = highlighted ? rgba(palette.warn, 0.1) : 'transparent';\n\n return css`\n /* stylelint-disable-next-line unit-allowed-list /\n border: 1px solid ${borderColor};\n background: ${background};\n block-size: ${rowHeight}px;\n border-radius: ${theme.components.card['border-radius']};\n `;\n }\n);\nStyledGridCell.defaultProps = defaultThemeProp;\n\ninterface PageBreakProps {\n rowsAbove: number;\n rowHeight: number;\n margin: [number, number];\n containerPadding: [number, number];\n prefix: string;\n}\n\nconst StyledPageBreak = styled.div<PageBreakProps>(\n ({ containerPadding, rowHeight, theme, margin, rowsAbove, prefix }) => {\n const {\n base: { palette }\n } = theme;\n return css`\n position: absolute;\n inset-inline-start: ${containerPadding[0]}px;\n inset-inline-end: ${containerPadding[0]}px;\n inset-block-start: ${containerPadding[1] + rowsAbove (rowHeight + margin[1])}px;\n /* stylelint-disable-next-line unit-allowed-list /\n margin-block-start: ${-margin[1] / 2 - 1}px;\n / stylelint-disable-next-line unit-allowed-list /\n border-block-start: 2px dashed ${palette['border-line']};\n\n &::before {\n content: '${prefix}';\n position: absolute;\n font-size: 0.75rem;\n line-height: 1;\n transform: translate(0, -50%);\n background: ${palette['app-background']};\n color: ${palette['border-line']};\n padding-inline-end: 0.25rem;\n }\n `;\n }\n);\nStyledPageBreak.defaultProps = defaultThemeProp;\n\ninterface EditorBackgroundProps extends NoChildrenProp {\n layout?: Layout[];\n numColumns: number;\n rowHeight: number;\n rowsPerPage: number \| null; // null when not applying auto-fit\n highlighted: boolean;\n}\n\n/\n Renders background grid-cells for GridEditor\n * @component\n /\nconst EditorBackground: FC<EditorBackgroundProps> = ({\n layout,\n numColumns,\n rowHeight,\n rowsPerPage,\n highlighted\n}) => {\n const t = useI18n();\n const { margin, containerPadding } = useGridLayoutConfig(true);\n\n const maxYInLayout = layout ? Math.max(...layout.map(item => item.y + item.h)) : 0;\n const maxY = Math.max(maxYInLayout, rowsPerPage \|\| 0);\n const numGridCells = (maxY + 1) numColumns;\n const cells = getArrayFromRange(0, numGridCells, false);\n\n // rowsPerPage will be null if auto-fit is disabled. Don't show pageBreaks in that case.\n const numPageBreaks = rowsPerPage ? Math.floor(maxY / rowsPerPage) : 0;\n const pageBreaks = getArrayFromRange(0, numPageBreaks, false);\n\n return (\n <StyledGrid container={{ cols: `repeat(${numColumns}, 1fr)`, gap: 2, pad: [0, 2, 2, 2] }}>\n {cells.map(n => (\n <StyledGridCell\n key={n}\n rowHeight={rowHeight}\n // Highlight all cells except the dummy row at the bottom\n highlighted={highlighted && n < numGridCells - numColumns}\n />\n ))}\n {pageBreaks.map(n => (\n <StyledPageBreak\n key={n}\n rowsAbove={(n + 1) * rowsPerPage!}\n rowHeight={rowHeight}\n margin={margin}\n containerPadding={containerPadding}\n prefix={t('page_number', [n + 1])}\n />\n ))}\n </StyledGrid>\n );\n};\n\nexport default EditorBackground;\n"]}

package/lib/components/Preview/PreviewPanel.js CHANGED Viewed

@@ -27,7 +27,7 @@ export const StyledPreviewDrawer = styled(Drawer)(({ theme }) => {
     min-width: ${resizeDrawerMinWidth};
     max-width: ${resizeDrawerMaxWidth};
     width: var(--resize-drawer-width);
-    background-color: ${theme.base.palette['app-background']};
+    background: ${theme.base.palette['app-background']};
     height: auto;
     inset-block-start: calc(var(--app-header-height, 0rem) + var(--appshell-top-offset, 0rem));
     inset-block-end: var(--appshell-bottom-offset, 0);

package/lib/components/Preview/PreviewPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PreviewPanel.js","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport getFocusables from '../../utils/getFocusables';\nimport Icon, { registerIcon } from '../Icon';\nimport Progress from '../Progress';\nimport { readableHue } from '../../styles/utils';\nimport {\n resizeDrawerDefaultWidth,\n resizeDrawerMaxWidth,\n resizeDrawerMinWidth\n} from '../../styles/constants';\nimport { StyledResizeHandle } from '../Drawer/ResizeHandle';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport useConsolidatedRef from '../../hooks/useConsolidatedRef';\nimport useDirection from '../../hooks/useDirection';\nimport useElement from '../../hooks/useElement';\nimport useFocusTrap from '../../hooks/useFocusTrap';\nimport useI18n from '../../hooks/useI18n';\nimport usePreviewContext from '../../hooks/usePreviewContext';\nimport useTestIds from '../../hooks/useTestIds';\nimport { withTestIds } from '../../utils';\n\nimport { getPreviewPanelTestIds } from './PreviewPanel.test-ids';\nimport type { PreviewPanelProps } from './Preview.types';\n\nregisterIcon(timesIcon);\n\nexport const StyledPreviewDrawer = styled(Drawer)(({ theme }) => {\n return css`\n min-width: ${resizeDrawerMinWidth};\n max-width: ${resizeDrawerMaxWidth};\n width: var(--resize-drawer-width);\n background-color: ${theme.base.palette['app-background']};\n height: auto;\n inset-block-start: calc(var(--app-header-height, 0rem) + var(--appshell-top-offset, 0rem));\n inset-block-end: var(--appshell-bottom-offset, 0);\n z-index: calc(${theme.base['z-index'].backdrop} - 1);\n transition-property: transform, box-shadow, opacity, border-inline-start;\n transition-duration: max(${theme.base.animation.speed}, 1ms);\n transition-timing-function: ${theme.base.animation.timing.ease};\n\n ${StyledResizeHandle} {\n z-index: calc(${theme.base['z-index'].max - 1});\n }\n\n @media (width >= ${theme.base.breakpoints.md}) {\n box-shadow: none;\n border-inline-start: 0.0625rem solid\n ${readableHue(theme.base.palette['border-line'], theme.base.palette['app-background'], {\n mode: 'both',\n level: 'AANonText'\n })};\n }\n `;\n});\n\nStyledPreviewDrawer.defaultProps = defaultThemeProp;\n\nconst StyledCloseButton = styled(Button)(({ theme }) => {\n return css`\n --half-btn-compact-difference: calc(\n (${theme.base['hit-area'].mouse} - ${theme.base['hit-area'].compact}) / 2\n );\n @media (pointer: coarse) {\n --half-btn-compact-difference: calc(\n (${theme.base['hit-area'].finger} - ${theme.base['hit-area'].compact}) / 2\n );\n }\n position: absolute;\n border: none;\n\n /* Places above resize handle /\n z-index: ${theme.base['z-index'].max};\n box-shadow: ${theme.base.shadow.low};\n inset-inline-start: calc(-${theme.base['hit-area'].compact} / 2);\n inset-block-start: calc(2 ${theme.base.spacing} + var(--half-btn-compact-difference));\n `;\n});\n\nStyledCloseButton.defaultProps = defaultThemeProp;\n\nconst PreviewPanel = forwardRef(function PreviewPanel(\n {\n testId,\n previewLabel,\n open,\n children,\n progress,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n ...restProps\n }: PropsWithoutRef<PreviewPanelProps>,\n ref: Ref<HTMLDivElement>\n) {\n const testIds = useTestIds(testId, getPreviewPanelTestIds);\n\n const t = useI18n();\n const direction = useDirection();\n const previewRef = useConsolidatedRef(ref);\n const { previewTriggerRef } = usePreviewContext();\n\n const [closeButtonEl, setCloseButtonEl] = useElement<HTMLButtonElement>();\n const [progressVisible, setProgressVisible] = useState(false);\n\n const setFocus = () => {\n if (progressVisible) return;\n\n const focusables = getFocusables(previewRef).filter(el => el !== closeButtonEl);\n const focusable = focusables[0] ?? closeButtonEl;\n focusable?.focus();\n };\n\n useEffect(() => {\n if (!progressVisible) {\n setFocus();\n }\n }, [progressVisible]);\n\n useFocusTrap(previewRef, true, [], false);\n\n return (\n <Drawer\n data-testid={testIds.root}\n onBeforeOpen={() => {\n onBeforeOpen?.();\n }}\n onAfterOpen={() => {\n setFocus();\n onAfterOpen?.();\n }}\n as={StyledPreviewDrawer}\n role='complementary'\n forwardedAs={Flex}\n container={{ direction: 'column' }}\n ref={previewRef}\n position='fixed'\n placement={direction.end}\n size={resizeDrawerDefaultWidth}\n aria-label={previewLabel ? t('preview_of_noun', [previewLabel]) : t('preview')}\n open={open}\n resizeable\n shadow\n nullWhenClosed\n {...restProps}\n >\n <StyledCloseButton\n data-testid={testIds.close}\n icon\n compact\n onClick={() => {\n onBeforeClose?.();\n onAfterClose?.();\n previewTriggerRef.current?.focus();\n }}\n ref={setCloseButtonEl}\n label={t('close_preview')}\n >\n <Icon name='times' size='font-size' />\n </StyledCloseButton>\n\n <Progress\n data-testid={testIds.progress}\n placement='local'\n visible={!!progress}\n focusOnVisible\n delay\n onTransitionStartIn={() => {\n setProgressVisible(true);\n }}\n onTransitionEndOut={() => setProgressVisible(false)}\n />\n {!progress && children}\n </Drawer>\n );\n});\n\nexport default withTestIds(PreviewPanel, getPreviewPanelTestIds);\n"]}
1	+ {"version":3,"file":"PreviewPanel.js","sourceRoot":"","sources":["../../../src/components/Preview/PreviewPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport getFocusables from '../../utils/getFocusables';\nimport Icon, { registerIcon } from '../Icon';\nimport Progress from '../Progress';\nimport { readableHue } from '../../styles/utils';\nimport {\n resizeDrawerDefaultWidth,\n resizeDrawerMaxWidth,\n resizeDrawerMinWidth\n} from '../../styles/constants';\nimport { StyledResizeHandle } from '../Drawer/ResizeHandle';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport useConsolidatedRef from '../../hooks/useConsolidatedRef';\nimport useDirection from '../../hooks/useDirection';\nimport useElement from '../../hooks/useElement';\nimport useFocusTrap from '../../hooks/useFocusTrap';\nimport useI18n from '../../hooks/useI18n';\nimport usePreviewContext from '../../hooks/usePreviewContext';\nimport useTestIds from '../../hooks/useTestIds';\nimport { withTestIds } from '../../utils';\n\nimport { getPreviewPanelTestIds } from './PreviewPanel.test-ids';\nimport type { PreviewPanelProps } from './Preview.types';\n\nregisterIcon(timesIcon);\n\nexport const StyledPreviewDrawer = styled(Drawer)(({ theme }) => {\n return css`\n min-width: ${resizeDrawerMinWidth};\n max-width: ${resizeDrawerMaxWidth};\n width: var(--resize-drawer-width);\n background: ${theme.base.palette['app-background']};\n height: auto;\n inset-block-start: calc(var(--app-header-height, 0rem) + var(--appshell-top-offset, 0rem));\n inset-block-end: var(--appshell-bottom-offset, 0);\n z-index: calc(${theme.base['z-index'].backdrop} - 1);\n transition-property: transform, box-shadow, opacity, border-inline-start;\n transition-duration: max(${theme.base.animation.speed}, 1ms);\n transition-timing-function: ${theme.base.animation.timing.ease};\n\n ${StyledResizeHandle} {\n z-index: calc(${theme.base['z-index'].max - 1});\n }\n\n @media (width >= ${theme.base.breakpoints.md}) {\n box-shadow: none;\n border-inline-start: 0.0625rem solid\n ${readableHue(theme.base.palette['border-line'], theme.base.palette['app-background'], {\n mode: 'both',\n level: 'AANonText'\n })};\n }\n `;\n});\n\nStyledPreviewDrawer.defaultProps = defaultThemeProp;\n\nconst StyledCloseButton = styled(Button)(({ theme }) => {\n return css`\n --half-btn-compact-difference: calc(\n (${theme.base['hit-area'].mouse} - ${theme.base['hit-area'].compact}) / 2\n );\n @media (pointer: coarse) {\n --half-btn-compact-difference: calc(\n (${theme.base['hit-area'].finger} - ${theme.base['hit-area'].compact}) / 2\n );\n }\n position: absolute;\n border: none;\n\n /* Places above resize handle /\n z-index: ${theme.base['z-index'].max};\n box-shadow: ${theme.base.shadow.low};\n inset-inline-start: calc(-${theme.base['hit-area'].compact} / 2);\n inset-block-start: calc(2 ${theme.base.spacing} + var(--half-btn-compact-difference));\n `;\n});\n\nStyledCloseButton.defaultProps = defaultThemeProp;\n\nconst PreviewPanel = forwardRef(function PreviewPanel(\n {\n testId,\n previewLabel,\n open,\n children,\n progress,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n ...restProps\n }: PropsWithoutRef<PreviewPanelProps>,\n ref: Ref<HTMLDivElement>\n) {\n const testIds = useTestIds(testId, getPreviewPanelTestIds);\n\n const t = useI18n();\n const direction = useDirection();\n const previewRef = useConsolidatedRef(ref);\n const { previewTriggerRef } = usePreviewContext();\n\n const [closeButtonEl, setCloseButtonEl] = useElement<HTMLButtonElement>();\n const [progressVisible, setProgressVisible] = useState(false);\n\n const setFocus = () => {\n if (progressVisible) return;\n\n const focusables = getFocusables(previewRef).filter(el => el !== closeButtonEl);\n const focusable = focusables[0] ?? closeButtonEl;\n focusable?.focus();\n };\n\n useEffect(() => {\n if (!progressVisible) {\n setFocus();\n }\n }, [progressVisible]);\n\n useFocusTrap(previewRef, true, [], false);\n\n return (\n <Drawer\n data-testid={testIds.root}\n onBeforeOpen={() => {\n onBeforeOpen?.();\n }}\n onAfterOpen={() => {\n setFocus();\n onAfterOpen?.();\n }}\n as={StyledPreviewDrawer}\n role='complementary'\n forwardedAs={Flex}\n container={{ direction: 'column' }}\n ref={previewRef}\n position='fixed'\n placement={direction.end}\n size={resizeDrawerDefaultWidth}\n aria-label={previewLabel ? t('preview_of_noun', [previewLabel]) : t('preview')}\n open={open}\n resizeable\n shadow\n nullWhenClosed\n {...restProps}\n >\n <StyledCloseButton\n data-testid={testIds.close}\n icon\n compact\n onClick={() => {\n onBeforeClose?.();\n onAfterClose?.();\n previewTriggerRef.current?.focus();\n }}\n ref={setCloseButtonEl}\n label={t('close_preview')}\n >\n <Icon name='times' size='font-size' />\n </StyledCloseButton>\n\n <Progress\n data-testid={testIds.progress}\n placement='local'\n visible={!!progress}\n focusOnVisible\n delay\n onTransitionStartIn={() => {\n setProgressVisible(true);\n }}\n onTransitionEndOut={() => setProgressVisible(false)}\n />\n {!progress && children}\n </Drawer>\n );\n});\n\nexport default withTestIds(PreviewPanel, getPreviewPanelTestIds);\n"]}