npm - @pega/cosmos-react-core - Versions diffs - 3.0.0-dev.4.1 → 3.0.0-dev.6.0 - Mend

@pega/cosmos-react-core 3.0.0-dev.4.1 → 3.0.0-dev.6.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 (1989) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Lightbox.js","sourceRoot":"","sources":["../../../src/components/Lightbox/Lightbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n PropsWithoutRef,\n useEffect,\n useRef,\n Ref,\n useState,\n forwardRef,\n MouseEvent,\n SyntheticEvent\n} from 'react';\n\nimport { ForwardProps } from '../../types';\nimport { cap, getFocusables } from '../../utils';\nimport Flex from '../Flex';\nimport MetaList from '../MetaList';\nimport Icon from '../Icon';\nimport Text from '../Text';\nimport { useConsolidatedRef, useDirection, useI18n, useScrollToggle } from '../../hooks';\nimport ErrorState from '../ErrorState';\n\nimport {\n StyledHeader,\n StyledCountTracker,\n StyledInfo,\n StyledActionButton,\n StyledPreviewRegion,\n StyledNavButton,\n StyledImageContainer,\n StyledImage,\n StyledLiveRegion,\n StyledLightbox\n} from './Lightbox.styles';\nimport { LightboxProps } from './Lightbox.types';\n\nconst Lightbox: FunctionComponent<LightboxProps & ForwardProps> = forwardRef(\n (\n {\n items,\n defaultIndex = 0,\n cycle,\n onItemLoad,\n onItemError,\n onNavigate,\n onItemDownload,\n onAfterClose,\n ...restProps\n }: PropsWithoutRef<LightboxProps>,\n refArg: Ref<HTMLDivElement>\n ) => {\n const t = useI18n();\n const { start, end } = useDirection();\n const [currentIndex, setCurrentIndex] = useState(defaultIndex);\n const currentItem = items[currentIndex];\n const { disableScroll, enableScroll } = useScrollToggle();\n const lightboxRef = useConsolidatedRef(refArg);\n const headerRef = useRef<HTMLDivElement>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n const prevButtonRef = useRef<HTMLButtonElement>(null);\n const nextButtonRef = useRef<HTMLButtonElement>(null);\n const [open, setOpen] = useState(true);\n const imageRef = useConsolidatedRef(currentItem.ref);\n const [error, setError] = useState(false);\n const [liveText, setLiveText] = useState('');\n const countTrackerText = items.length > 1 ? t('x_of_y', [currentIndex + 1, items.length]) : '';\n\n const close = () => {\n setOpen(false);\n };\n\n const navigate = (direction: 1 \| -1) => {\n if (direction === 1) {\n if (currentIndex < items.length - 1) {\n setCurrentIndex(cur => cur + 1);\n setError(false);\n } else if (cycle) {\n setCurrentIndex(0);\n setError(false);\n }\n } else if (currentIndex > 0) {\n setCurrentIndex(cur => cur - 1);\n setError(false);\n } else if (cycle) {\n setCurrentIndex(items.length - 1);\n setError(false);\n }\n };\n\n const onKeydown = (e: KeyboardEvent) => {\n if (e.repeat) return;\n\n if (e.key === 'Escape') {\n close();\n } else if (e.key === `Arrow${cap(end)}`) {\n navigate(1);\n } else if (e.key === `Arrow${cap(start)}`) {\n navigate(-1);\n }\n\n if (e.key === 'Tab') {\n const focusables = getFocusables(lightboxRef);\n if (!focusables \|\| focusables.length < 2) return;\n const firstFocusable = focusables[0];\n const lastFocusable = focusables[focusables.length - 1];\n\n if (\n !e.shiftKey &&\n (document.activeElement === lightboxRef.current \|\|\n document.activeElement === lastFocusable)\n ) {\n firstFocusable?.focus();\n e.preventDefault();\n } else if (\n e.shiftKey &&\n (document.activeElement === lightboxRef.current \|\|\n document.activeElement === firstFocusable)\n ) {\n lastFocusable?.focus();\n e.preventDefault();\n }\n }\n };\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, [onKeydown]);\n\n useEffect(() => {\n setLiveText(\n `${currentItem.name}. ${countTrackerText ? `${countTrackerText}.` : ''} ${\n currentItem.description\n }.`\n );\n }, [currentItem.name, countTrackerText, currentItem.description]);\n\n useEffect(() => {\n lightboxRef.current?.focus();\n }, []);\n\n return (\n <StyledLightbox\n {...restProps}\n tabIndex={-1}\n ref={lightboxRef}\n open={open}\n role='dialog'\n aria-modal='true'\n container={{ alignItems: 'start', justify: 'start', direction: 'column' }}\n alpha={0.9}\n variant='dark'\n transitionSpeed='slow'\n onBeforeTransitionIn={disableScroll}\n onAfterTransitionOut={() => {\n enableScroll();\n onAfterClose?.();\n }}\n >\n <Flex\n as={StyledHeader}\n ref={headerRef}\n container={{\n justify: 'between',\n alignItems: 'center',\n gap: 2\n }}\n onMouseDown={(e: MouseEvent<HTMLDivElement>) => {\n if (e.button !== 0) return;\n if (e.target === e.currentTarget) close();\n }}\n >\n <StyledCountTracker aria-hidden='true'>{countTrackerText}</StyledCountTracker>\n\n <Flex\n as={StyledInfo}\n container={{\n wrap: 'wrap',\n alignItems: 'center',\n justify: 'center',\n colGap: 2,\n rowGap: 0.5\n }}\n >\n <Text variant='primary' as='h2'>\n {currentItem.name}\n </Text>\n {currentItem.metadata && <MetaList items={currentItem.metadata} />}\n </Flex>\n\n <Flex container>\n {onItemDownload && (\n <StyledActionButton\n variant='simple'\n aria-label={t('download')}\n icon\n onClick={() => onItemDownload(currentItem.id)}\n >\n <Icon name='download' />\n </StyledActionButton>\n )}\n <StyledActionButton\n variant='simple'\n ref={closeButtonRef}\n aria-label={t('close')}\n icon\n onClick={close}\n >\n <Icon name='times' />\n </StyledActionButton>\n </Flex>\n </Flex>\n\n <Flex\n container={{ justify: 'between' }}\n as={StyledPreviewRegion}\n item={{ grow: 1, shrink: 0 }}\n >\n {items.length > 1 && (\n <StyledNavButton\n ref={prevButtonRef}\n variant='simple'\n aria-label={t('pagination_prev')}\n hidden={!cycle && currentIndex === 0}\n icon\n onClick={() => {\n navigate(-1);\n }}\n >\n <span>\n <Icon name='caret-left' />\n </span>\n </StyledNavButton>\n )}\n\n <Flex item={{ grow: 1 }} as={StyledImageContainer}>\n <Flex\n container={{ alignItems: 'center' }}\n onMouseDown={(e: MouseEvent<HTMLDivElement>) => {\n if (e.button !== 0) return;\n if (e.target === e.currentTarget) close();\n }}\n >\n {error ? (\n <ErrorState message={t('image_load_error')} />\n ) : (\n <StyledImage\n ref={imageRef}\n src={currentItem.src}\n alt={currentItem.description}\n onLoad={(e: SyntheticEvent<HTMLImageElement>) => {\n onItemLoad?.(currentItem.id, e);\n }}\n onError={(e: SyntheticEvent<HTMLImageElement>) => {\n onItemError?.(currentItem.id, e);\n setError(true);\n }}\n />\n )}\n </Flex>\n </Flex>\n\n {items.length > 1 && (\n <StyledNavButton\n ref={nextButtonRef}\n variant='simple'\n aria-label={t('pagination_next')}\n hidden={!cycle && currentIndex === items.length - 1}\n icon\n onClick={() => {\n navigate(1);\n }}\n >\n <span>\n <Icon name='caret-right' />\n </span>\n </StyledNavButton>\n )}\n </Flex>\n <StyledLiveRegion aria-live='polite' aria-label={liveText} />\n </StyledLightbox>\n );\n }\n);\n\nexport default Lightbox;\n"]}
1	+ {"version":3,"file":"Lightbox.js","sourceRoot":"","sources":["../../../src/components/Lightbox/Lightbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n PropsWithoutRef,\n useEffect,\n useRef,\n Ref,\n useState,\n forwardRef,\n MouseEvent,\n SyntheticEvent\n} from 'react';\n\nimport { ForwardProps } from '../../types';\nimport { cap } from '../../utils';\nimport Flex from '../Flex';\nimport MetaList from '../MetaList';\nimport Icon from '../Icon';\nimport Text from '../Text';\nimport {\n useConsolidatedRef,\n useDirection,\n useEvent,\n useFocusTrap,\n useI18n,\n useScrollToggle\n} from '../../hooks';\nimport ErrorState from '../ErrorState';\n\nimport {\n StyledHeader,\n StyledCountTracker,\n StyledInfo,\n StyledActionButton,\n StyledPreviewRegion,\n StyledNavButton,\n StyledImageContainer,\n StyledImage,\n StyledLiveRegion,\n StyledLightbox\n} from './Lightbox.styles';\nimport { LightboxProps } from './Lightbox.types';\n\nconst Lightbox: FunctionComponent<LightboxProps & ForwardProps> = forwardRef(\n (\n {\n items,\n defaultIndex = 0,\n cycle,\n onItemLoad,\n onItemError,\n onNavigate,\n onItemDownload,\n onAfterClose,\n ...restProps\n }: PropsWithoutRef<LightboxProps>,\n refArg: Ref<HTMLDivElement>\n ) => {\n const t = useI18n();\n const { start, end } = useDirection();\n const [currentIndex, setCurrentIndex] = useState(defaultIndex);\n const currentItem = items[currentIndex];\n const { disableScroll, enableScroll } = useScrollToggle();\n const lightboxRef = useConsolidatedRef(refArg);\n const headerRef = useRef<HTMLDivElement>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n const prevButtonRef = useRef<HTMLButtonElement>(null);\n const nextButtonRef = useRef<HTMLButtonElement>(null);\n const [open, setOpen] = useState(true);\n const imageRef = useConsolidatedRef(currentItem.ref);\n const [error, setError] = useState(false);\n const [liveText, setLiveText] = useState('');\n const countTrackerText = items.length > 1 ? t('x_of_y', [currentIndex + 1, items.length]) : '';\n\n const close = () => {\n setOpen(false);\n };\n\n const navigate = (direction: 1 \| -1) => {\n if (direction === 1) {\n if (currentIndex < items.length - 1) {\n setCurrentIndex(cur => cur + 1);\n setError(false);\n } else if (cycle) {\n setCurrentIndex(0);\n setError(false);\n }\n } else if (currentIndex > 0) {\n setCurrentIndex(cur => cur - 1);\n setError(false);\n } else if (cycle) {\n setCurrentIndex(items.length - 1);\n setError(false);\n }\n };\n const keyDownHandler = (e: KeyboardEvent) => {\n if (e.repeat) return;\n\n if (e.key === 'Escape') {\n close();\n } else if (e.key === `Arrow${cap(end)}`) {\n navigate(1);\n } else if (e.key === `Arrow${cap(start)}`) {\n navigate(-1);\n }\n };\n\n useEvent('keydown', keyDownHandler);\n useFocusTrap(lightboxRef);\n\n useEffect(() => {\n setLiveText(\n `${currentItem.name}. ${countTrackerText ? `${countTrackerText}.` : ''} ${\n currentItem.description\n }.`\n );\n }, [currentItem.name, countTrackerText, currentItem.description]);\n\n useEffect(() => {\n lightboxRef.current?.focus();\n }, []);\n\n return (\n <StyledLightbox\n {...restProps}\n tabIndex={-1}\n ref={lightboxRef}\n open={open}\n role='dialog'\n aria-modal='true'\n container={{ alignItems: 'start', justify: 'start', direction: 'column' }}\n alpha={0.9}\n variant='dark'\n transitionSpeed='slow'\n onBeforeTransitionIn={disableScroll}\n onAfterTransitionOut={() => {\n enableScroll();\n onAfterClose?.();\n }}\n >\n <Flex\n as={StyledHeader}\n ref={headerRef}\n container={{\n justify: 'between',\n alignItems: 'center',\n gap: 2\n }}\n onMouseDown={(e: MouseEvent<HTMLDivElement>) => {\n if (e.button !== 0) return;\n if (e.target === e.currentTarget) close();\n }}\n >\n <StyledCountTracker aria-hidden='true'>{countTrackerText}</StyledCountTracker>\n\n <Flex\n as={StyledInfo}\n container={{\n wrap: 'wrap',\n alignItems: 'center',\n justify: 'center',\n colGap: 2,\n rowGap: 0.5\n }}\n >\n <Text variant='primary' as='h2'>\n {currentItem.name}\n </Text>\n {currentItem.metadata && <MetaList items={currentItem.metadata} />}\n </Flex>\n\n <Flex container>\n {onItemDownload && (\n <StyledActionButton\n variant='simple'\n aria-label={t('download')}\n icon\n onClick={() => onItemDownload(currentItem.id)}\n >\n <Icon name='download' />\n </StyledActionButton>\n )}\n <StyledActionButton\n variant='simple'\n ref={closeButtonRef}\n aria-label={t('close')}\n icon\n onClick={close}\n >\n <Icon name='times' />\n </StyledActionButton>\n </Flex>\n </Flex>\n\n <Flex\n container={{ justify: 'between' }}\n as={StyledPreviewRegion}\n item={{ grow: 1, shrink: 0 }}\n >\n {items.length > 1 && (\n <StyledNavButton\n ref={prevButtonRef}\n variant='simple'\n aria-label={t('pagination_prev')}\n hidden={!cycle && currentIndex === 0}\n icon\n onClick={() => {\n navigate(-1);\n }}\n >\n <span>\n <Icon name='caret-left' />\n </span>\n </StyledNavButton>\n )}\n\n <Flex item={{ grow: 1 }} as={StyledImageContainer}>\n <Flex\n container={{ alignItems: 'center' }}\n onMouseDown={(e: MouseEvent<HTMLDivElement>) => {\n if (e.button !== 0) return;\n if (e.target === e.currentTarget) close();\n }}\n >\n {error ? (\n <ErrorState message={t('image_load_error')} />\n ) : (\n <StyledImage\n ref={imageRef}\n src={currentItem.src}\n alt={currentItem.description}\n onLoad={(e: SyntheticEvent<HTMLImageElement>) => {\n onItemLoad?.(currentItem.id, e);\n }}\n onError={(e: SyntheticEvent<HTMLImageElement>) => {\n onItemError?.(currentItem.id, e);\n setError(true);\n }}\n />\n )}\n </Flex>\n </Flex>\n\n {items.length > 1 && (\n <StyledNavButton\n ref={nextButtonRef}\n variant='simple'\n aria-label={t('pagination_next')}\n hidden={!cycle && currentIndex === items.length - 1}\n icon\n onClick={() => {\n navigate(1);\n }}\n >\n <span>\n <Icon name='caret-right' />\n </span>\n </StyledNavButton>\n )}\n </Flex>\n <StyledLiveRegion aria-live='polite' aria-label={liveText} />\n </StyledLightbox>\n );\n }\n);\n\nexport default Lightbox;\n"]}

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

@@ -103,7 +103,7 @@ const Link = forwardRef(({ href, variant = 'link', previewable, onPreview, ...re
         previewTriggerRef.current = linkRef.current;
         onPreview?.({ href });
     };
-    return (_jsxs(_Fragment, { children: [_jsx(StyledLink, { href: href, variant: variant, ref: linkRef, ...restProps, onMouseEnter: onEnterLink, onMouseLeave: closePopover, onFocus: onEnterLink, onKeyUp: onKeyUp, onBlur: closePopover, "aria-describedby": previewable ? `${uid}-preview-instructions` : undefined }, void 0), _jsxs(Popover, { show: popover, groupId: 'link_preview', showDelay: 'short', hideDelay: 'short', placement: 'bottom', target: linkRef.current, onMouseEnter: openPopover, onMouseLeave: closePopover, as: StyledLinkPopover, arrow: true, children: [!inModal && (_jsx(StyledLinkPopoverBtn, { preview: true, type: 'button', ref: previewBtnRef, onClick: onPreviewClick, tabIndex: '-1', onFocus: openPopover, onBlur: closePopover, onKeyUp: onKeyUp, children: t('preview') }, void 0)), _jsx(StyledLinkPopoverBtn, { forwardedAs: 'a', href: href, ref: openInTabBtnRef, target: '_blank', rel: 'noreferrer', tabIndex: '-1', onFocus: openPopover, onBlur: closePopover, onKeyUp: onKeyUp, children: t('link_open_in_tab_text') }, void 0)] }, void 0), previewable && (_jsx(VisuallyHiddenText, { id: `${uid}-preview-instructions`, children: t('preview_link_arrow_navigation') }, void 0))] }, void 0));
+    return (_jsxs(_Fragment, { children: [_jsx(StyledLink, { href: href, variant: variant, ref: linkRef, ...restProps, onMouseEnter: onEnterLink, onMouseLeave: closePopover, onFocus: onEnterLink, onKeyUp: onKeyUp, onBlur: closePopover, "aria-describedby": previewable ? `${uid}-preview-instructions` : undefined }), _jsxs(Popover, { show: popover, groupId: 'link_preview', showDelay: 'short', hideDelay: 'short', placement: 'bottom', target: linkRef.current, onMouseEnter: openPopover, onMouseLeave: closePopover, as: StyledLinkPopover, arrow: true, children: [!inModal && (_jsx(StyledLinkPopoverBtn, { preview: true, type: 'button', ref: previewBtnRef, onClick: onPreviewClick, tabIndex: '-1', onFocus: openPopover, onBlur: closePopover, onKeyUp: onKeyUp, children: t('preview') })), _jsx(StyledLinkPopoverBtn, { forwardedAs: 'a', href: href, ref: openInTabBtnRef, target: '_blank', rel: 'noreferrer', tabIndex: '-1', onFocus: openPopover, onBlur: closePopover, onKeyUp: onKeyUp, children: t('link_open_in_tab_text') })] }), previewable && (_jsx(VisuallyHiddenText, { id: `${uid}-preview-instructions`, children: t('preview_link_arrow_navigation') }))] }));
 });
 export default Link;
 //# sourceMappingURL=Link.js.map

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 {\n forwardRef,\n ReactNode,\n FunctionComponent,\n Ref,\n PropsWithoutRef,\n useState,\n useRef,\n KeyboardEvent,\n useContext\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport Button, { ButtonProps } from '../Button';\nimport Popover from '../Popover';\nimport BareButton from '../Button/BareButton';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { useBreakpoint, useConsolidatedRef, useI18n, useUID } from '../../hooks';\nimport { tryCatch } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport { ModalManagerContext } from '../Modal';\nimport { modalInitializedKey } from '../Modal/Modal.types';\nimport AppShellContext from '../AppShell/AppShellContext';\n\nexport interface LinkProps extends BaseProps {\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 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 /* Determines if the Link should render a popover when focused or hovered over. /\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`\n background-color: ${props => props.theme.components.tooltip['background-color']};\n`;\n\nStyledLinkPopover.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPopoverBtn = styled(BareButton)(({ theme }) => {\n const contrastColor = tryCatch(() => readableColor(theme.base.palette.interactive));\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: 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 StyledLink = styled(Button)``;\n\nStyledLink.defaultProps = defaultThemeProp;\n\nconst Link: FunctionComponent<LinkProps & ForwardProps> = forwardRef(\n (\n { href, variant = 'link', previewable, onPreview, ...restProps }: PropsWithoutRef<LinkProps>,\n ref: LinkProps['ref']\n ) => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { [modalInitializedKey]: inModal } = useContext(ModalContext);\n const { previewTriggerRef } = useContext(AppShellContext);\n const uid = useUID();\n const linkRef = useConsolidatedRef(ref);\n const [popover, setPopover] = useState(false);\n const previewBtnRef = useRef<HTMLButtonElement>(null);\n const openInTabBtnRef = useRef<HTMLAnchorElement>(null);\n const isSmallOrAbove = useBreakpoint('sm');\n const t = useI18n();\n\n const openPopover = () => {\n if (isSmallOrAbove) setPopover(true);\n };\n\n const closePopover = () => {\n setPopover(false);\n };\n\n const onKeyUp = (event: KeyboardEvent) => {\n if (event.keyCode === 27) {\n closePopover();\n }\n\n if (event.keyCode === 38 \|\| event.keyCode === 40) {\n previewBtnRef?.current?.focus();\n }\n\n if (event.keyCode === 37 \|\| event.keyCode === 39) {\n if (previewBtnRef.current === document.activeElement) {\n openInTabBtnRef?.current?.focus();\n } else {\n previewBtnRef?.current?.focus();\n }\n }\n };\n\n const onEnterLink = () => {\n if (previewable) openPopover();\n };\n\n const onPreviewClick = () => {\n previewTriggerRef.current = linkRef.current;\n onPreview?.({ href });\n };\n\n return (\n <>\n <StyledLink\n href={href}\n variant={variant}\n ref={linkRef as any}\n {...restProps}\n onMouseEnter={onEnterLink}\n onMouseLeave={closePopover}\n onFocus={onEnterLink}\n onKeyUp={onKeyUp}\n onBlur={closePopover}\n aria-describedby={previewable ? `${uid}-preview-instructions` : undefined}\n />\n\n <Popover\n show={popover}\n groupId='link_preview'\n showDelay='short'\n hideDelay='short'\n placement='bottom'\n target={linkRef.current}\n onMouseEnter={openPopover}\n onMouseLeave={closePopover}\n as={StyledLinkPopover}\n arrow\n >\n {!inModal && (\n <StyledLinkPopoverBtn\n preview\n type='button'\n ref={previewBtnRef}\n onClick={onPreviewClick}\n tabIndex='-1'\n onFocus={openPopover}\n onBlur={closePopover}\n onKeyUp={onKeyUp}\n >\n {t('preview')}\n </StyledLinkPopoverBtn>\n )}\n <StyledLinkPopoverBtn\n forwardedAs='a'\n href={href}\n ref={openInTabBtnRef}\n target='_blank'\n rel='noreferrer'\n tabIndex='-1'\n onFocus={openPopover}\n onBlur={closePopover}\n onKeyUp={onKeyUp}\n >\n {t('link_open_in_tab_text')}\n </StyledLinkPopoverBtn>\n </Popover>\n\n {previewable && (\n <VisuallyHiddenText id={`${uid}-preview-instructions`}>\n {t('preview_link_arrow_navigation')}\n </VisuallyHiddenText>\n )}\n </>\n );\n }\n);\n\nexport default Link;\n"]}
1	+ {"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n ReactNode,\n FunctionComponent,\n Ref,\n PropsWithoutRef,\n useState,\n useRef,\n KeyboardEvent,\n useContext\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport Button, { ButtonProps } from '../Button';\nimport Popover from '../Popover';\nimport BareButton from '../Button/BareButton';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { useBreakpoint, useConsolidatedRef, useI18n, useUID } from '../../hooks';\nimport { tryCatch } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport { ModalManagerContext } from '../Modal';\nimport { modalInitializedKey } from '../Modal/Modal.types';\nimport AppShellContext from '../AppShell/AppShellContext';\n\nexport interface LinkProps extends BaseProps {\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 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 /* Determines if the Link should render a popover when focused or hovered over. /\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`\n background-color: ${props => props.theme.components.tooltip['background-color']};\n`;\n\nStyledLinkPopover.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPopoverBtn = styled(BareButton)(({ theme }) => {\n const contrastColor = tryCatch(() => readableColor(theme.base.palette.interactive));\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: 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 StyledLink = styled(Button)``;\n\nStyledLink.defaultProps = defaultThemeProp;\n\nconst Link: FunctionComponent<LinkProps & ForwardProps> = forwardRef(\n (\n { href, variant = 'link', previewable, onPreview, ...restProps }: PropsWithoutRef<LinkProps>,\n ref: LinkProps['ref']\n ) => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { [modalInitializedKey]: inModal } = useContext(ModalContext);\n const { previewTriggerRef } = useContext(AppShellContext);\n const uid = useUID();\n const linkRef = useConsolidatedRef(ref);\n const [popover, setPopover] = useState(false);\n const previewBtnRef = useRef<HTMLButtonElement>(null);\n const openInTabBtnRef = useRef<HTMLAnchorElement>(null);\n const isSmallOrAbove = useBreakpoint('sm');\n const t = useI18n();\n\n const openPopover = () => {\n if (isSmallOrAbove) setPopover(true);\n };\n\n const closePopover = () => {\n setPopover(false);\n };\n\n const onKeyUp = (event: KeyboardEvent) => {\n if (event.keyCode === 27) {\n closePopover();\n }\n\n if (event.keyCode === 38 \|\| event.keyCode === 40) {\n previewBtnRef?.current?.focus();\n }\n\n if (event.keyCode === 37 \|\| event.keyCode === 39) {\n if (previewBtnRef.current === document.activeElement) {\n openInTabBtnRef?.current?.focus();\n } else {\n previewBtnRef?.current?.focus();\n }\n }\n };\n\n const onEnterLink = () => {\n if (previewable) openPopover();\n };\n\n const onPreviewClick = () => {\n previewTriggerRef.current = linkRef.current;\n onPreview?.({ href });\n };\n\n return (\n <>\n <StyledLink\n href={href}\n variant={variant}\n ref={linkRef as any}\n {...restProps}\n onMouseEnter={onEnterLink}\n onMouseLeave={closePopover}\n onFocus={onEnterLink}\n onKeyUp={onKeyUp}\n onBlur={closePopover}\n aria-describedby={previewable ? `${uid}-preview-instructions` : undefined}\n />\n\n <Popover\n show={popover}\n groupId='link_preview'\n showDelay='short'\n hideDelay='short'\n placement='bottom'\n target={linkRef.current}\n onMouseEnter={openPopover}\n onMouseLeave={closePopover}\n as={StyledLinkPopover}\n arrow\n >\n {!inModal && (\n <StyledLinkPopoverBtn\n preview\n type='button'\n ref={previewBtnRef}\n onClick={onPreviewClick}\n tabIndex='-1'\n onFocus={openPopover}\n onBlur={closePopover}\n onKeyUp={onKeyUp}\n >\n {t('preview')}\n </StyledLinkPopoverBtn>\n )}\n <StyledLinkPopoverBtn\n forwardedAs='a'\n href={href}\n ref={openInTabBtnRef}\n target='_blank'\n rel='noreferrer'\n tabIndex='-1'\n onFocus={openPopover}\n onBlur={closePopover}\n onKeyUp={onKeyUp}\n >\n {t('link_open_in_tab_text')}\n </StyledLinkPopoverBtn>\n </Popover>\n\n {previewable && (\n <VisuallyHiddenText id={`${uid}-preview-instructions`}>\n {t('preview_link_arrow_navigation')}\n </VisuallyHiddenText>\n )}\n </>\n );\n }\n);\n\nexport default Link;\n"]}

package/lib/components/List/CommaSeparatedList.js CHANGED Viewed

@@ -50,12 +50,12 @@ const DynamicHeightValue = ({ children }) => {
             observer.disconnect();
         };
     }, [textRef.current, maxTextHeight]);
-    return (_jsxs(_Fragment, { children: [_jsx(ExpandCollapse, { collapsed: collapsed, min: exceedsMaxHeight ? `${maxTextHeight}px` : 'max-content', children: _jsx("div", { ref: textRef, children: children }, void 0) }, void 0), exceedsMaxHeight && (_jsx(Button, { variant: 'link', onClick: () => setCollapsed(current => !current), children: collapsed ? t('show_more') : t('show_less') }, void 0))] }, void 0));
+    return (_jsxs(_Fragment, { children: [_jsx(ExpandCollapse, { collapsed: collapsed, min: exceedsMaxHeight ? `${maxTextHeight}px` : 'max-content', children: _jsx("div", { ref: textRef, children: children }) }), exceedsMaxHeight && (_jsx(Button, { variant: 'link', onClick: () => setCollapsed(current => !current), children: collapsed ? t('show_more') : t('show_less') }))] }));
 };
 const CommaSeparatedList = forwardRef(({ items, heading }, ref) => {
-    return (_jsxs(StyledCommaSeparatedList, { ref: ref, children: [heading && _jsx(Text, { variant: 'h3', children: heading }, void 0), _jsx(DynamicHeightValue, { children: _jsx("ul", { style: { listStyle: 'none' }, children: items.map((value, i) => (
+    return (_jsxs(StyledCommaSeparatedList, { ref: ref, children: [heading && _jsx(Text, { variant: 'h3', children: heading }), _jsx(DynamicHeightValue, { children: _jsx("ul", { style: { listStyle: 'none' }, children: items.map((value, i) => (
                     // eslint-disable-next-line react/no-array-index-key
-                    _jsx(StyledCommaSeparatedListItem, { children: value }, i))) }, void 0) }, void 0)] }, void 0));
+                    _jsx(StyledCommaSeparatedListItem, { children: value }, i))) }) })] }));
 });
 export default CommaSeparatedList;
 //# sourceMappingURL=CommaSeparatedList.js.map

package/lib/components/List/CommaSeparatedList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommaSeparatedList.js","sourceRoot":"","sources":["../../../src/components/List/CommaSeparatedList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAGL,UAAU,EACV,QAAQ,EAGR,eAAe,EACf,OAAO,EACP,MAAM,EACP,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAWhD,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC/D,OAAO,GAAG,CAAA;eACG,KAAK,CAAC,IAAI,CAAC,OAAO;;oCAEG,KAAK,CAAC,IAAI,CAAC,OAAO;;GAEnD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEzD,MAAM,CAAC,MAAM,4BAA4B,GAAG,MAAM,CAAC,EAAE,CAAA;;;;;;CAMpD,CAAC;AAEF,MAAM,kBAAkB,GAAG,CAAC,EAAE,QAAQ,EAA2B,EAAe,EAAE;IAChF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChE,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC7C,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,IAAI,CAAC,iBAAiB;YAAE,OAAO,QAAQ,CAAC;QAExC,MAAM,kBAAkB,GACtB,MAAM,CAAC,QAAQ,CACb,MAAM,CAAC,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,WAAW,CAAC,EAC/E,EAAE,CACH,GAAG,IAAI,CAAC;QAEX,OAAO,CAAC,GAAG,kBAAkB,CAAC;IAChC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,OAAO,CAAC,OAAO;YAAE,OAAO;QAE7B,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;YAC5C,MAAM,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,EAAE,EAAE;gBAC7D,IAAI,MAAM,KAAK,OAAO,CAAC,OAAO;oBAAE,OAAO;gBAEvC,OAAO,WAAW,CAAC,MAAM,GAAG,aAAa,CAAC;YAC5C,CAAC,CAAC,CAAC;YAEH,mBAAmB,CAAC,aAAa,CAAC,CAAC;QACrC,CAAC,CAAC,CAAC;QAEH,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QAElC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,UAAU,EAAE,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC;IAErC,OAAO,CACL,8BACE,KAAC,cAAc,IACb,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,gBAAgB,CAAC,CAAC,CAAC,GAAG,aAAa,IAAI,CAAC,CAAC,CAAC,aAAa,YAE5D,cAAK,GAAG,EAAE,OAAO,YAAG,QAAQ,~~WAAO~~,~~WACpB~~,EAChB,gBAAgB,IAAI,CACnB,KAAC,MAAM,IAAC,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,YACpE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,~~WACrC~~,CACV,~~YACA~~,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,kBAAkB,GAA8D,UAAU,CAC9F,CACE,EAAE,KAAK,EAAE,OAAO,EAA4C,EAC5D,GAAmC,EACnC,EAAE;IACF,OAAO,CACL,MAAC,wBAAwB,IAAC,GAAG,EAAE,GAAG,aAC/B,OAAO,IAAI,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,OAAO,~~WAAQ~~,EAC/C,KAAC,kBAAkB,cACjB,aAAI,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,YAC7B,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC;oBACvB,oDAAoD;oBACpD,KAAC,4BAA4B,cAAU,KAAK,IAAT,CAAC,CAAwC,CAC7E,CAAC,~~WACC~~,~~WACc~~,~~YACI~~,CAC5B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import {\n FunctionComponent,\n ReactNode,\n forwardRef,\n useState,\n PropsWithoutRef,\n Ref,\n useLayoutEffect,\n useMemo,\n useRef\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { useI18n } from '../../hooks';\nimport Button from '../Button';\nimport Text from '../Text';\nimport ExpandCollapse from '../ExpandCollapse';\nimport { windowIsAvailable } from '../../utils';\n\nexport interface CommaSeparatedListProps extends BaseProps {\n /** List content. /\n items: ReactNode[];\n /* List Heading. /\n heading?: string;\n /* Ref forwarded to the wrapping element. /\n ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledCommaSeparatedList = styled.div(({ theme }) => {\n return css`\n padding: ${theme.base.spacing};\n h3 {\n padding-block-end: calc(2 ${theme.base.spacing});\n }\n `;\n});\n\nStyledCommaSeparatedList.defaultProps = defaultThemeProp;\n\nexport const StyledCommaSeparatedListItem = styled.li`\n display: inline;\n\n &:not(:last-child)::after {\n content: ', ';\n }\n`;\n\nconst DynamicHeightValue = ({ children }: { children: ReactNode }): JSX.Element => {\n const [collapsed, setCollapsed] = useState(true);\n const [exceedsMaxHeight, setExceedsMaxHeight] = useState(false);\n const textRef = useRef<HTMLDivElement>(null);\n const t = useI18n();\n\n const maxTextHeight = useMemo(() => {\n if (!windowIsAvailable) return Infinity;\n\n const computedLineHeight =\n Number.parseInt(\n window.getComputedStyle(document.documentElement).getPropertyValue('font-size'),\n 10\n ) * 1.25;\n\n return 3 * computedLineHeight;\n }, []);\n\n useLayoutEffect(() => {\n if (!textRef.current) return;\n\n const observer = new ResizeObserver(entries => {\n const exceedsHeight = entries.some(({ target, contentRect }) => {\n if (target !== textRef.current) return;\n\n return contentRect.height > maxTextHeight;\n });\n\n setExceedsMaxHeight(exceedsHeight);\n });\n\n observer.observe(textRef.current);\n\n return () => {\n observer.disconnect();\n };\n }, [textRef.current, maxTextHeight]);\n\n return (\n <>\n <ExpandCollapse\n collapsed={collapsed}\n min={exceedsMaxHeight ? `${maxTextHeight}px` : 'max-content'}\n >\n <div ref={textRef}>{children}</div>\n </ExpandCollapse>\n {exceedsMaxHeight && (\n <Button variant='link' onClick={() => setCollapsed(current => !current)}>\n {collapsed ? t('show_more') : t('show_less')}\n </Button>\n )}\n </>\n );\n};\n\nconst CommaSeparatedList: FunctionComponent<CommaSeparatedListProps & ForwardProps> = forwardRef(\n (\n { items, heading }: PropsWithoutRef<CommaSeparatedListProps>,\n ref: CommaSeparatedListProps['ref']\n ) => {\n return (\n <StyledCommaSeparatedList ref={ref}>\n {heading && <Text variant='h3'>{heading}</Text>}\n <DynamicHeightValue>\n <ul style={{ listStyle: 'none' }}>\n {items.map((value, i) => (\n // eslint-disable-next-line react/no-array-index-key\n <StyledCommaSeparatedListItem key={i}>{value}</StyledCommaSeparatedListItem>\n ))}\n </ul>\n </DynamicHeightValue>\n </StyledCommaSeparatedList>\n );\n }\n);\n\nexport default CommaSeparatedList;\n"]}
1	+ {"version":3,"file":"CommaSeparatedList.js","sourceRoot":"","sources":["../../../src/components/List/CommaSeparatedList.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n ReactNode,\n forwardRef,\n useState,\n PropsWithoutRef,\n Ref,\n useLayoutEffect,\n useMemo,\n useRef\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { useI18n } from '../../hooks';\nimport Button from '../Button';\nimport Text from '../Text';\nimport ExpandCollapse from '../ExpandCollapse';\nimport { windowIsAvailable } from '../../utils';\n\nexport interface CommaSeparatedListProps extends BaseProps {\n /** List content. /\n items: ReactNode[];\n /* List Heading. /\n heading?: string;\n /* Ref forwarded to the wrapping element. /\n ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledCommaSeparatedList = styled.div(({ theme }) => {\n return css`\n padding: ${theme.base.spacing};\n h3 {\n padding-block-end: calc(2 ${theme.base.spacing});\n }\n `;\n});\n\nStyledCommaSeparatedList.defaultProps = defaultThemeProp;\n\nexport const StyledCommaSeparatedListItem = styled.li`\n display: inline;\n\n &:not(:last-child)::after {\n content: ', ';\n }\n`;\n\nconst DynamicHeightValue = ({ children }: { children: ReactNode }): JSX.Element => {\n const [collapsed, setCollapsed] = useState(true);\n const [exceedsMaxHeight, setExceedsMaxHeight] = useState(false);\n const textRef = useRef<HTMLDivElement>(null);\n const t = useI18n();\n\n const maxTextHeight = useMemo(() => {\n if (!windowIsAvailable) return Infinity;\n\n const computedLineHeight =\n Number.parseInt(\n window.getComputedStyle(document.documentElement).getPropertyValue('font-size'),\n 10\n ) * 1.25;\n\n return 3 * computedLineHeight;\n }, []);\n\n useLayoutEffect(() => {\n if (!textRef.current) return;\n\n const observer = new ResizeObserver(entries => {\n const exceedsHeight = entries.some(({ target, contentRect }) => {\n if (target !== textRef.current) return;\n\n return contentRect.height > maxTextHeight;\n });\n\n setExceedsMaxHeight(exceedsHeight);\n });\n\n observer.observe(textRef.current);\n\n return () => {\n observer.disconnect();\n };\n }, [textRef.current, maxTextHeight]);\n\n return (\n <>\n <ExpandCollapse\n collapsed={collapsed}\n min={exceedsMaxHeight ? `${maxTextHeight}px` : 'max-content'}\n >\n <div ref={textRef}>{children}</div>\n </ExpandCollapse>\n {exceedsMaxHeight && (\n <Button variant='link' onClick={() => setCollapsed(current => !current)}>\n {collapsed ? t('show_more') : t('show_less')}\n </Button>\n )}\n </>\n );\n};\n\nconst CommaSeparatedList: FunctionComponent<CommaSeparatedListProps & ForwardProps> = forwardRef(\n (\n { items, heading }: PropsWithoutRef<CommaSeparatedListProps>,\n ref: CommaSeparatedListProps['ref']\n ) => {\n return (\n <StyledCommaSeparatedList ref={ref}>\n {heading && <Text variant='h3'>{heading}</Text>}\n <DynamicHeightValue>\n <ul style={{ listStyle: 'none' }}>\n {items.map((value, i) => (\n // eslint-disable-next-line react/no-array-index-key\n <StyledCommaSeparatedListItem key={i}>{value}</StyledCommaSeparatedListItem>\n ))}\n </ul>\n </DynamicHeightValue>\n </StyledCommaSeparatedList>\n );\n }\n);\n\nexport default CommaSeparatedList;\n"]}

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

@@ -47,10 +47,10 @@ const List = forwardRef(({ items, variant, count, onToggleShow, depth = 0, headi
     const t = useI18n();
     const listContent = items.map((value, idx) => Array.isArray(value) ? (
     // eslint-disable-next-line react/no-array-index-key
-    _jsx(StyledSublistItem, { children: _jsx(List, { depth: depth + 1, variant: variant, items: value }, void 0) }, idx)) : (
+    _jsx(StyledSublistItem, { children: _jsx(List, { depth: depth + 1, variant: variant, items: value }) }, idx)) : (
     // eslint-disable-next-line react/no-array-index-key
     _jsx("li", { children: value }, idx)));
-    return (_jsxs(StyledList, { ...restProps, ref: ref, depth: depth, listType: (variant === 'ordered' ? olTypes : ulTypes)[depth % 3], children: [heading && _jsx(Text, { variant: 'h3', children: heading }, void 0), variant === 'ordered' ? _jsx("ol", { children: listContent }, void 0) : _jsx("ul", { children: listContent }, void 0), count && onToggleShow && (_jsx(Button, { variant: 'link', onClick: onToggleShow, children: count > items.flat().length ? t('show_more') : t('show_less') }, void 0))] }, void 0));
+    return (_jsxs(StyledList, { ...restProps, ref: ref, depth: depth, listType: (variant === 'ordered' ? olTypes : ulTypes)[depth % 3], children: [heading && _jsx(Text, { variant: 'h3', children: heading }), variant === 'ordered' ? _jsx("ol", { children: listContent }) : _jsx("ul", { children: listContent }), count && onToggleShow && (_jsx(Button, { variant: 'link', onClick: onToggleShow, children: count > items.flat().length ? t('show_more') : t('show_less') }))] }));
 });
 export default List;
 //# sourceMappingURL=List.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"List.js","sourceRoot":"","sources":["../../../src/components/List/List.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgC,UAAU,EAAwB,MAAM,OAAO,CAAC;AACvF,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAsBtC,MAAM,OAAO,GAAG,CAAC,SAAS,EAAE,aAAa,EAAE,aAAa,CAAU,CAAC;AACnE,MAAM,OAAO,GAAG,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAU,CAAC;AAEtD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAGjC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;IAChC,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IAEtF,OAAO,GAAG,CAAA;qCACyB,KAAK,CAAC,IAAI,CAAC,OAAO;;;mCAGpB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;yBAK5B,QAAQ;;;;yCAIQ,KAAK,CAAC,IAAI,CAAC,OAAO;;;UAGjD,KAAK,GAAG,CAAC;QACT,CAAC,CAAC,GAAG,CAAA;2BACY,QAAQ,CAAC,EAAE;aACzB;QACH,CAAC,CAAC,GAAG,CAAA;;+BAEgB,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,IAAI;;aAEhD;;;GAGV,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,EAAE,CAAA;;CAEzC,CAAC;AAEF,MAAM,IAAI,GAAsD,UAAU,CACxE,CACE,EACE,KAAK,EACL,OAAO,EACP,KAAK,EACL,YAAY,EACZ,KAAK,GAAG,CAAC,EACT,OAAO,EACP,GAAG,SAAS,EACqB,EACnC,GAA2B,EAC3B,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,WAAW,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAC3C,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IACrB,oDAAoD;IACpD,KAAC,iBAAiB,cAChB,KAAC,IAAI,IAAC,KAAK,EAAE,KAAK,GAAG,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,~~WAAI~~,IADpC,GAAG,CAEP,CACrB,CAAC,CAAC,CAAC;IACF,oDAAoD;IACpD,uBAAe,KAAK,IAAX,GAAG,CAAc,CAC3B,CACF,CAAC;IAEF,OAAO,CACL,MAAC,UAAU,OACL,SAAS,EACb,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,aAE/D,OAAO,IAAI,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,OAAO,~~WAAQ~~,EAC9C,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,uBAAK,WAAW,~~WAAM~~,CAAC,CAAC,CAAC,uBAAK,WAAW,~~WAAM~~,EACvE,KAAK,IAAI,YAAY,IAAI,CACxB,KAAC,MAAM,IAAC,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,YAAY,YACzC,KAAK,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,~~WACvD~~,CACV,~~YACU~~,CACd,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { FunctionComponent, ReactNode, forwardRef, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize } from '../../styles';\nimport Button from '../Button';\nimport Text from '../Text';\nimport { useI18n } from '../../hooks';\n\nexport interface ListProps extends BaseProps, NoChildrenProp {\n /** List content. /\n items: ReactNode[];\n /* List Heading. /\n heading?: string;\n /* Number of list items that need to be shown. /\n count?: number;\n /* Callback to display more/less items. /\n onToggleShow?: () => void;\n /* Ref forwarded to the wrapping element. /\n ref?: Ref<HTMLDivElement>;\n}\n\ninterface VisualListProps extends ListProps {\n /* Type of list. /\n variant: 'ordered' \| 'unordered';\n /* Depth of list (used for recursion). /\n depth?: number;\n}\n\nconst olTypes = ['decimal', 'lower-alpha', 'lower-roman'] as const;\nconst ulTypes = ['disc', 'circle', 'square'] as const;\n\nexport const StyledList = styled.div<{\n depth: number;\n listType: typeof olTypes[number] \| typeof ulTypes[number];\n}>(({ theme, depth, listType }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding-inline-start: calc(2 ${theme.base.spacing});\n list-style-position: inside;\n h3 {\n margin-block-end: calc(2 * ${theme.base.spacing});\n }\n\n & > ol,\n & > ul {\n list-style-type: ${listType};\n\n & > li {\n &:not(:last-child) {\n margin-block-end: calc(0.5 * ${theme.base.spacing});\n }\n\n ${depth > 0\n ? css`\n font-size: ${fontSize.xs};\n `\n : css`\n &::marker {\n font-weight: ${theme.base['font-weight'].bold};\n }\n `}\n }\n }\n `;\n});\n\nStyledList.defaultProps = defaultThemeProp;\n\nexport const StyledSublistItem = styled.li`\n list-style: none;\n`;\n\nconst List: FunctionComponent<VisualListProps & ForwardProps> = forwardRef(\n (\n {\n items,\n variant,\n count,\n onToggleShow,\n depth = 0,\n heading,\n ...restProps\n }: PropsWithoutRef<VisualListProps>,\n ref: VisualListProps['ref']\n ) => {\n const t = useI18n();\n const listContent = items.map((value, idx) =>\n Array.isArray(value) ? (\n // eslint-disable-next-line react/no-array-index-key\n <StyledSublistItem key={idx}>\n <List depth={depth + 1} variant={variant} items={value} />\n </StyledSublistItem>\n ) : (\n // eslint-disable-next-line react/no-array-index-key\n <li key={idx}>{value}</li>\n )\n );\n\n return (\n <StyledList\n {...restProps}\n ref={ref}\n depth={depth}\n listType={(variant === 'ordered' ? olTypes : ulTypes)[depth % 3]}\n >\n {heading && <Text variant='h3'>{heading}</Text>}\n {variant === 'ordered' ? <ol>{listContent}</ol> : <ul>{listContent}</ul>}\n {count && onToggleShow && (\n <Button variant='link' onClick={onToggleShow}>\n {count > items.flat().length ? t('show_more') : t('show_less')}\n </Button>\n )}\n </StyledList>\n );\n }\n);\n\nexport default List;\n"]}
1	+ {"version":3,"file":"List.js","sourceRoot":"","sources":["../../../src/components/List/List.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, ReactNode, forwardRef, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize } from '../../styles';\nimport Button from '../Button';\nimport Text from '../Text';\nimport { useI18n } from '../../hooks';\n\nexport interface ListProps extends BaseProps, NoChildrenProp {\n /** List content. /\n items: ReactNode[];\n /* List Heading. /\n heading?: string;\n /* Number of list items that need to be shown. /\n count?: number;\n /* Callback to display more/less items. /\n onToggleShow?: () => void;\n /* Ref forwarded to the wrapping element. /\n ref?: Ref<HTMLDivElement>;\n}\n\ninterface VisualListProps extends ListProps {\n /* Type of list. /\n variant: 'ordered' \| 'unordered';\n /* Depth of list (used for recursion). /\n depth?: number;\n}\n\nconst olTypes = ['decimal', 'lower-alpha', 'lower-roman'] as const;\nconst ulTypes = ['disc', 'circle', 'square'] as const;\n\nexport const StyledList = styled.div<{\n depth: number;\n listType: typeof olTypes[number] \| typeof ulTypes[number];\n}>(({ theme, depth, listType }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding-inline-start: calc(2 ${theme.base.spacing});\n list-style-position: inside;\n h3 {\n margin-block-end: calc(2 * ${theme.base.spacing});\n }\n\n & > ol,\n & > ul {\n list-style-type: ${listType};\n\n & > li {\n &:not(:last-child) {\n margin-block-end: calc(0.5 * ${theme.base.spacing});\n }\n\n ${depth > 0\n ? css`\n font-size: ${fontSize.xs};\n `\n : css`\n &::marker {\n font-weight: ${theme.base['font-weight'].bold};\n }\n `}\n }\n }\n `;\n});\n\nStyledList.defaultProps = defaultThemeProp;\n\nexport const StyledSublistItem = styled.li`\n list-style: none;\n`;\n\nconst List: FunctionComponent<VisualListProps & ForwardProps> = forwardRef(\n (\n {\n items,\n variant,\n count,\n onToggleShow,\n depth = 0,\n heading,\n ...restProps\n }: PropsWithoutRef<VisualListProps>,\n ref: VisualListProps['ref']\n ) => {\n const t = useI18n();\n const listContent = items.map((value, idx) =>\n Array.isArray(value) ? (\n // eslint-disable-next-line react/no-array-index-key\n <StyledSublistItem key={idx}>\n <List depth={depth + 1} variant={variant} items={value} />\n </StyledSublistItem>\n ) : (\n // eslint-disable-next-line react/no-array-index-key\n <li key={idx}>{value}</li>\n )\n );\n\n return (\n <StyledList\n {...restProps}\n ref={ref}\n depth={depth}\n listType={(variant === 'ordered' ? olTypes : ulTypes)[depth % 3]}\n >\n {heading && <Text variant='h3'>{heading}</Text>}\n {variant === 'ordered' ? <ol>{listContent}</ol> : <ul>{listContent}</ul>}\n {count && onToggleShow && (\n <Button variant='link' onClick={onToggleShow}>\n {count > items.flat().length ? t('show_more') : t('show_less')}\n </Button>\n )}\n </StyledList>\n );\n }\n);\n\nexport default List;\n"]}

package/lib/components/List/OrderedList.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import List from './List';
-const OrderedList = forwardRef((props, ref) => _jsx(List, { ...props, variant: 'ordered', ref: ref }, void 0));
+const OrderedList = forwardRef((props, ref) => _jsx(List, { ...props, variant: 'ordered', ref: ref }));
 export default OrderedList;
 //# sourceMappingURL=OrderedList.js.map

package/lib/components/List/OrderedList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OrderedList.js","sourceRoot":"","sources":["../../../src/components/List/OrderedList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,IAAmB,MAAM,QAAQ,CAAC;AAEzC,MAAM,WAAW,GAAiC,UAAU,CAC1D,CAAC,KAAgB,EAAE,GAAqB,EAAE,EAAE,CAAC,KAAC,IAAI,OAAK,KAAK,EAAE,OAAO,EAAC,SAAS,EAAC,GAAG,EAAE,GAAG,~~WAAI~~,CAC7F,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { FC, forwardRef } from 'react';\n\nimport { ForwardProps } from '../../types';\n\nimport List, { ListProps } from './List';\n\nconst OrderedList: FC<ListProps & ForwardProps> = forwardRef(\n (props: ListProps, ref: ListProps['ref']) => <List {...props} variant='ordered' ref={ref} />\n);\n\nexport default OrderedList;\n"]}
1	+ {"version":3,"file":"OrderedList.js","sourceRoot":"","sources":["../../../src/components/List/OrderedList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,IAAmB,MAAM,QAAQ,CAAC;AAEzC,MAAM,WAAW,GAAiC,UAAU,CAC1D,CAAC,KAAgB,EAAE,GAAqB,EAAE,EAAE,CAAC,KAAC,IAAI,OAAK,KAAK,EAAE,OAAO,EAAC,SAAS,EAAC,GAAG,EAAE,GAAG,GAAI,CAC7F,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { FC, forwardRef } from 'react';\n\nimport { ForwardProps } from '../../types';\n\nimport List, { ListProps } from './List';\n\nconst OrderedList: FC<ListProps & ForwardProps> = forwardRef(\n (props: ListProps, ref: ListProps['ref']) => <List {...props} variant='ordered' ref={ref} />\n);\n\nexport default OrderedList;\n"]}

package/lib/components/List/UnorderedList.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import List from './List';
-const UnorderedList = forwardRef((props, ref) => _jsx(List, { ...props, variant: 'unordered', ref: ref }, void 0));
+const UnorderedList = forwardRef((props, ref) => _jsx(List, { ...props, variant: 'unordered', ref: ref }));
 export default UnorderedList;
 //# sourceMappingURL=UnorderedList.js.map

package/lib/components/List/UnorderedList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UnorderedList.js","sourceRoot":"","sources":["../../../src/components/List/UnorderedList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,IAAmB,MAAM,QAAQ,CAAC;AAEzC,MAAM,aAAa,GAAiC,UAAU,CAC5D,CAAC,KAAgB,EAAE,GAAqB,EAAE,EAAE,CAAC,KAAC,IAAI,OAAK,KAAK,EAAE,OAAO,EAAC,WAAW,EAAC,GAAG,EAAE,GAAG,~~WAAI~~,CAC/F,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { FC, forwardRef } from 'react';\n\nimport { ForwardProps } from '../../types';\n\nimport List, { ListProps } from './List';\n\nconst UnorderedList: FC<ListProps & ForwardProps> = forwardRef(\n (props: ListProps, ref: ListProps['ref']) => <List {...props} variant='unordered' ref={ref} />\n);\n\nexport default UnorderedList;\n"]}
1	+ {"version":3,"file":"UnorderedList.js","sourceRoot":"","sources":["../../../src/components/List/UnorderedList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,IAAmB,MAAM,QAAQ,CAAC;AAEzC,MAAM,aAAa,GAAiC,UAAU,CAC5D,CAAC,KAAgB,EAAE,GAAqB,EAAE,EAAE,CAAC,KAAC,IAAI,OAAK,KAAK,EAAE,OAAO,EAAC,WAAW,EAAC,GAAG,EAAE,GAAG,GAAI,CAC/F,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { FC, forwardRef } from 'react';\n\nimport { ForwardProps } from '../../types';\n\nimport List, { ListProps } from './List';\n\nconst UnorderedList: FC<ListProps & ForwardProps> = forwardRef(\n (props: ListProps, ref: ListProps['ref']) => <List {...props} variant='unordered' ref={ref} />\n);\n\nexport default UnorderedList;\n"]}

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

@@ -21,7 +21,7 @@ registerIcon(filterIcon, arrowUpDownIcon, rowIcon, plusIcon, moreIcon);
 const CountMeta = ({ count }) => {
     const t = useI18n();
     return (_jsxs(Text, { variant: 'secondary', children: [count.total !== undefined && t('results_count', [count.total], { count: count.total }), count.total && count.selected && ' ', count.selected !== undefined &&
-                `(${t('selected_count', [count.selected], { count: count.selected })})`] }, void 0));
+                `(${t('selected_count', [count.selected], { count: count.selected })})`] }));
 };
 const QueryOptionButton = ({ id, queryOptionProps, iconOnly, setCurrentQueryOption }) => {
     const t = useI18n();
@@ -61,14 +61,14 @@ const QueryOptionButton = ({ id, queryOptionProps, iconOnly, setCurrentQueryOpti
                         props: queryOptionProps,
                         popoverTarget: e.currentTarget
                     });
-                }, children: _jsxs(Flex, { container: { inline: true, alignItems: 'center', gap: 1 }, as: 'span', children: [_jsx(Icon, { name: icon }, void 0), !iconOnly && text, !iconOnly && queryOptionProps.count && _jsx(Count, { children: queryOptionProps.count }, void 0)] }, void 0) }, void 0) }, void 0));
+                }, children: _jsxs(Flex, { container: { inline: true, alignItems: 'center', gap: 1 }, as: 'span', children: [_jsx(Icon, { name: icon }), !iconOnly && text, !iconOnly && queryOptionProps.count && _jsx(Count, { children: queryOptionProps.count })] }) }) }));
     }
     if (hasProp(queryOptionProps, 'items')) {
         return (_jsx("div", { children: _jsx(MenuButton, { variant: variant, text: text, icon: icon, iconOnly: iconOnly, count: queryOptionProps.count, menu: {
                     mode: queryOptionProps.mode,
                     items: queryOptionProps.items.map(item => ({ ...item, primary: item.text })),
                     onItemClick: queryOptionProps.onItemClick
-                } }, void 0) }, void 0));
+                } }) }));
     }
     return null;
 };
@@ -82,11 +82,11 @@ const ListToolbar = forwardRef(({ heading, onCreateNew, search, count, filter, s
         if (!onCreateNew)
             return null;
         const text = t('create_new');
-        return (_jsx(Button, { variant: isSmallOrAbove ? 'secondary' : 'simple', icon: !isSmallOrAbove, label: isSmallOrAbove ? undefined : text, onClick: onCreateNew, children: _jsxs(Flex, { as: 'span', container: { inline: true, alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: 'plus' }, void 0), isSmallOrAbove && _jsx("span", { children: text }, void 0)] }, void 0) }, void 0));
+        return (_jsx(Button, { variant: isSmallOrAbove ? 'secondary' : 'simple', icon: !isSmallOrAbove, label: isSmallOrAbove ? undefined : text, onClick: onCreateNew, children: _jsxs(Flex, { as: 'span', container: { inline: true, alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: 'plus' }), isSmallOrAbove && _jsx("span", { children: text })] }) }));
     }, [t, onCreateNew, isSmallOrAbove]);
-    const filterButton = filter && (_jsx(QueryOptionButton, { id: 'filter', queryOptionProps: filter, iconOnly: !isMediumOrAbove, setCurrentQueryOption: setQueryOptionDialogState }, void 0));
-    const sortButton = sort && (_jsx(QueryOptionButton, { id: 'sort', queryOptionProps: sort, iconOnly: !isMediumOrAbove, setCurrentQueryOption: setQueryOptionDialogState }, void 0));
-    const groupButton = group && (_jsx(QueryOptionButton, { id: 'group', queryOptionProps: group, iconOnly: !isMediumOrAbove, setCurrentQueryOption: setQueryOptionDialogState }, void 0));
+    const filterButton = filter && (_jsx(QueryOptionButton, { id: 'filter', queryOptionProps: filter, iconOnly: !isMediumOrAbove, setCurrentQueryOption: setQueryOptionDialogState }));
+    const sortButton = sort && (_jsx(QueryOptionButton, { id: 'sort', queryOptionProps: sort, iconOnly: !isMediumOrAbove, setCurrentQueryOption: setQueryOptionDialogState }));
+    const groupButton = group && (_jsx(QueryOptionButton, { id: 'group', queryOptionProps: group, iconOnly: !isMediumOrAbove, setCurrentQueryOption: setQueryOptionDialogState }));
     const onQueryOptionCancel = useCallback(() => {
         if (queryOptionDialogState?.props.onCancel() === false)
             return;
@@ -97,14 +97,14 @@ const ListToolbar = forwardRef(({ heading, onCreateNew, search, count, filter, s
             return;
         setQueryOptionDialogState(null);
     }, [queryOptionDialogState]);
-    return (_jsxs(Flex, { as: StyledListToolbar, container: { direction: 'column', gap: 2 }, item: { grow: 1 }, ref: ref, children: [_jsxs(Flex, { container: { alignItems: 'center', justify: 'between' }, children: [typeof heading === 'string' ? (_jsx(Text, { variant: 'h3', children: heading }, void 0)) : (_jsx(StyledViewSelector, { variant: 'text', text: heading.views.find(view => view.selected)?.text ?? heading.views[0].text, menu: {
+    return (_jsxs(Flex, { as: StyledListToolbar, container: { direction: 'column', gap: 2 }, item: { grow: 1 }, ref: ref, children: [_jsxs(Flex, { container: { alignItems: 'center', justify: 'between' }, children: [typeof heading === 'string' ? (_jsx(Text, { variant: 'h3', children: heading })) : (_jsx(StyledViewSelector, { variant: 'text', text: heading.views.find(view => view.selected)?.text ?? heading.views[0].text, menu: {
                             mode: 'single-select',
                             items: heading.views.map(view => ({ ...view, primary: view.text })),
                             onItemClick: heading.onViewSelect
-                        } }, void 0)), createNewButton] }, void 0), _jsxs(Flex, { container: { alignItems: 'start', justify: 'between', gap: 2 }, children: [_jsxs(Flex, { as: StyledSearchForm, container: { alignItems: 'center', wrap: 'wrap', gap: 2 }, item: { grow: 1 }, children: [search && _jsx(SearchInput, { ...search }, void 0), isSmallOrAbove && count && _jsx(CountMeta, { count: count }, void 0)] }, void 0), (filterButton || sortButton || groupButton || actions) && (_jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, md: { container: { gap: 3 } }, children: [_jsxs(_Fragment, { children: [filterButton, sortButton, groupButton] }, void 0), actions && (_jsx(Actions, { items: actions.map(({ icon, ...restProps }) => ({
-                                    visual: icon ? _jsx(Icon, { name: icon }, void 0) : undefined,
+                        } })), createNewButton] }), _jsxs(Flex, { container: { alignItems: 'start', justify: 'between', gap: 2 }, children: [_jsxs(Flex, { as: StyledSearchForm, container: { alignItems: 'center', wrap: 'wrap', gap: 2 }, item: { grow: 1 }, children: [search && _jsx(SearchInput, { ...search }), isSmallOrAbove && count && _jsx(CountMeta, { count: count })] }), (filterButton || sortButton || groupButton || actions) && (_jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, md: { container: { gap: 3 } }, children: [_jsxs(_Fragment, { children: [filterButton, sortButton, groupButton] }), actions && (_jsx(Actions, { items: actions.map(({ icon, ...restProps }) => ({
+                                    visual: icon ? _jsx(Icon, { name: icon }) : undefined,
                                     ...restProps
-                                })), menuAt: 1, ref: actionsButtonRef }, void 0))] }, void 0))] }, void 0), !isSmallOrAbove && count && (_jsx(Flex, { container: { alignItems: 'center', wrap: 'wrap', gap: 2 }, children: _jsx(CountMeta, { count: count }, void 0) }, void 0)), queryOptionDialogState && (_jsx(QueryOptionPopover, { target: queryOptionDialogState.popoverTarget, heading: t(`${queryOptionDialogState.id}_by`), onCancel: onQueryOptionCancel, onSubmit: onQueryOptionSubmit, children: _jsx(queryOptionDialogState.props.renderer, {}, void 0) }, void 0))] }, void 0));
+                                })), menuAt: 1, ref: actionsButtonRef }))] }))] }), !isSmallOrAbove && count && (_jsx(Flex, { container: { alignItems: 'center', wrap: 'wrap', gap: 2 }, children: _jsx(CountMeta, { count: count }) })), queryOptionDialogState && (_jsx(QueryOptionPopover, { target: queryOptionDialogState.popoverTarget, heading: t(`${queryOptionDialogState.id}_by`), onCancel: onQueryOptionCancel, onSubmit: onQueryOptionSubmit, children: _jsx(queryOptionDialogState.props.renderer, {}) }))] }));
 });
 export default ListToolbar;
 //# sourceMappingURL=ListToolbar.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ListToolbar.js","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Dispatch,\n forwardRef,\n FunctionComponent,\n MouseEvent,\n PropsWithoutRef,\n SetStateAction,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport Actions from '../Actions';\nimport Text from '../Text';\nimport Button from '../Button';\nimport { ForwardProps } from '../../types';\nimport { useBreakpoint, useI18n } from '../../hooks';\nimport Flex from '../Flex';\nimport SearchInput from '../SearchInput';\nimport Icon, { registerIcon } from '../Icon';\nimport * as filterIcon from '../Icon/icons/filter.icon';\nimport * as arrowUpDownIcon from '../Icon/icons/arrow-up-down.icon';\nimport * as rowIcon from '../Icon/icons/row.icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as moreIcon from '../Icon/icons/more.icon';\nimport { hasProp } from '../../utils';\nimport MenuButton from '../MenuButton';\nimport { Count } from '../Badges';\n\nimport { StyledViewSelector, StyledSearchForm, StyledListToolbar } from './ListToolbar.styles';\nimport {\n ListToolbarProps,\n PresetMenuProps,\n QueryOptionDialogProps,\n QueryOptionDialogState,\n QueryOptionId\n} from './ListToolbar.types';\nimport QueryOptionPopover from './QueryOptionPopover';\n\nregisterIcon(filterIcon, arrowUpDownIcon, rowIcon, plusIcon, moreIcon);\n\nconst CountMeta = ({ count }: { count: NonNullable<ListToolbarProps['count']> }) => {\n const t = useI18n();\n return (\n <Text variant='secondary'>\n {count.total !== undefined && t('results_count', [count.total], { count: count.total })}\n {count.total && count.selected && ' '}\n {count.selected !== undefined &&\n `(${t('selected_count', [count.selected], { count: count.selected })})`}\n </Text>\n );\n};\n\nconst QueryOptionButton = ({\n id,\n queryOptionProps,\n iconOnly,\n setCurrentQueryOption\n}: {\n id: QueryOptionId;\n queryOptionProps: QueryOptionDialogProps \| PresetMenuProps;\n iconOnly: boolean;\n setCurrentQueryOption: Dispatch<SetStateAction<QueryOptionDialogState>>;\n}) => {\n const t = useI18n();\n let i18nKey!: 'filter' \| 'sort' \| 'group';\n let icon!: 'filter' \| 'arrow-up-down' \| 'row';\n\n if (id === 'filter') {\n i18nKey = 'filter';\n icon = 'filter';\n } else if (id === 'sort') {\n i18nKey = 'sort';\n icon = 'arrow-up-down';\n } else if (id === 'group') {\n i18nKey = 'group';\n icon = 'row';\n }\n\n const text = t(i18nKey);\n const variant = iconOnly ? 'simple' : 'text';\n\n useEffect(() => {\n if (!queryOptionProps \|\| !hasProp(queryOptionProps, 'renderer')) {\n return;\n }\n\n setCurrentQueryOption(cur => {\n if (!cur) return null;\n return {\n ...cur,\n props: queryOptionProps\n };\n });\n }, [queryOptionProps, setCurrentQueryOption]);\n\n if (hasProp(queryOptionProps, 'renderer')) {\n return (\n <div>\n <Button\n variant={variant}\n icon={iconOnly}\n label={iconOnly ? text : undefined}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n setCurrentQueryOption({\n id,\n props: queryOptionProps,\n popoverTarget: e.currentTarget\n });\n }}\n >\n <Flex container={{ inline: true, alignItems: 'center', gap: 1 }} as='span'>\n <Icon name={icon} />\n {!iconOnly && text}\n {!iconOnly && queryOptionProps.count && <Count>{queryOptionProps.count}</Count>}\n </Flex>\n </Button>\n </div>\n );\n }\n\n if (hasProp(queryOptionProps, 'items')) {\n return (\n <div>\n <MenuButton\n variant={variant}\n text={text}\n icon={icon}\n iconOnly={iconOnly}\n count={queryOptionProps.count}\n menu={{\n mode: queryOptionProps.mode,\n items: queryOptionProps.items.map(item => ({ ...item, primary: item.text })),\n onItemClick: queryOptionProps.onItemClick\n }}\n />\n </div>\n );\n }\n\n return null;\n};\n\nconst ListToolbar: FunctionComponent<ListToolbarProps & ForwardProps> = forwardRef(\n (\n {\n heading,\n onCreateNew,\n search,\n count,\n filter,\n sort,\n group,\n actions\n }: PropsWithoutRef<ListToolbarProps>,\n ref: ListToolbarProps['ref']\n ) => {\n const t = useI18n();\n const isSmallOrAbove = useBreakpoint('sm');\n const isMediumOrAbove = useBreakpoint('md');\n const actionsButtonRef = useRef<HTMLButtonElement>(null);\n\n const [queryOptionDialogState, setQueryOptionDialogState] =\n useState<QueryOptionDialogState>(null);\n\n const createNewButton = useMemo(() => {\n if (!onCreateNew) return null;\n const text = t('create_new');\n\n return (\n <Button\n variant={isSmallOrAbove ? 'secondary' : 'simple'}\n icon={!isSmallOrAbove}\n label={isSmallOrAbove ? undefined : text}\n onClick={onCreateNew}\n >\n <Flex as='span' container={{ inline: true, alignItems: 'center', gap: 1 }}>\n <Icon name='plus' />\n {isSmallOrAbove && <span>{text}</span>}\n </Flex>\n </Button>\n );\n }, [t, onCreateNew, isSmallOrAbove]);\n\n const filterButton = filter && (\n <QueryOptionButton\n id='filter'\n queryOptionProps={filter}\n iconOnly={!isMediumOrAbove}\n setCurrentQueryOption={setQueryOptionDialogState}\n />\n );\n\n const sortButton = sort && (\n <QueryOptionButton\n id='sort'\n queryOptionProps={sort}\n iconOnly={!isMediumOrAbove}\n setCurrentQueryOption={setQueryOptionDialogState}\n />\n );\n\n const groupButton = group && (\n <QueryOptionButton\n id='group'\n queryOptionProps={group}\n iconOnly={!isMediumOrAbove}\n setCurrentQueryOption={setQueryOptionDialogState}\n />\n );\n\n const onQueryOptionCancel = useCallback(() => {\n if (queryOptionDialogState?.props.onCancel() === false) return;\n setQueryOptionDialogState(null);\n }, [queryOptionDialogState]);\n\n const onQueryOptionSubmit = useCallback(() => {\n if (queryOptionDialogState?.props.onSubmit() === false) return;\n setQueryOptionDialogState(null);\n }, [queryOptionDialogState]);\n\n return (\n <Flex\n as={StyledListToolbar}\n container={{ direction: 'column', gap: 2 }}\n item={{ grow: 1 }}\n ref={ref}\n >\n <Flex container={{ alignItems: 'center', justify: 'between' }}>\n {typeof heading === 'string' ? (\n <Text variant='h3'>{heading}</Text>\n ) : (\n <StyledViewSelector\n variant='text'\n text={heading.views.find(view => view.selected)?.text ?? heading.views[0].text}\n menu={{\n mode: 'single-select',\n items: heading.views.map(view => ({ ...view, primary: view.text })),\n onItemClick: heading.onViewSelect\n }}\n />\n )}\n {createNewButton}\n </Flex>\n <Flex container={{ alignItems: 'start', justify: 'between', gap: 2 }}>\n <Flex\n as={StyledSearchForm}\n container={{ alignItems: 'center', wrap: 'wrap', gap: 2 }}\n item={{ grow: 1 }}\n >\n {search && <SearchInput {...search} />}\n {isSmallOrAbove && count && <CountMeta count={count} />}\n </Flex>\n {(filterButton \|\| sortButton \|\| groupButton \|\| actions) && (\n <Flex container={{ alignItems: 'center', gap: 1 }} md={{ container: { gap: 3 } }}>\n <>\n {filterButton}\n {sortButton}\n {groupButton}\n </>\n {actions && (\n <Actions\n items={actions.map(({ icon, ...restProps }) => ({\n visual: icon ? <Icon name={icon} /> : undefined,\n ...restProps\n }))}\n menuAt={1}\n ref={actionsButtonRef}\n />\n )}\n </Flex>\n )}\n </Flex>\n {!isSmallOrAbove && count && (\n <Flex container={{ alignItems: 'center', wrap: 'wrap', gap: 2 }}>\n <CountMeta count={count} />\n </Flex>\n )}\n\n {queryOptionDialogState && (\n <QueryOptionPopover\n target={queryOptionDialogState.popoverTarget}\n heading={t(`${queryOptionDialogState.id}_by`)}\n onCancel={onQueryOptionCancel}\n onSubmit={onQueryOptionSubmit}\n >\n <queryOptionDialogState.props.renderer />\n </QueryOptionPopover>\n )}\n </Flex>\n );\n }\n);\n\nexport default ListToolbar;\n"]}
1	+ {"version":3,"file":"ListToolbar.js","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Dispatch,\n forwardRef,\n FunctionComponent,\n MouseEvent,\n PropsWithoutRef,\n SetStateAction,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport Actions from '../Actions';\nimport Text from '../Text';\nimport Button from '../Button';\nimport { ForwardProps } from '../../types';\nimport { useBreakpoint, useI18n } from '../../hooks';\nimport Flex from '../Flex';\nimport SearchInput from '../SearchInput';\nimport Icon, { registerIcon } from '../Icon';\nimport * as filterIcon from '../Icon/icons/filter.icon';\nimport * as arrowUpDownIcon from '../Icon/icons/arrow-up-down.icon';\nimport * as rowIcon from '../Icon/icons/row.icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as moreIcon from '../Icon/icons/more.icon';\nimport { hasProp } from '../../utils';\nimport MenuButton from '../MenuButton';\nimport { Count } from '../Badges';\n\nimport { StyledViewSelector, StyledSearchForm, StyledListToolbar } from './ListToolbar.styles';\nimport {\n ListToolbarProps,\n PresetMenuProps,\n QueryOptionDialogProps,\n QueryOptionDialogState,\n QueryOptionId\n} from './ListToolbar.types';\nimport QueryOptionPopover from './QueryOptionPopover';\n\nregisterIcon(filterIcon, arrowUpDownIcon, rowIcon, plusIcon, moreIcon);\n\nconst CountMeta = ({ count }: { count: NonNullable<ListToolbarProps['count']> }) => {\n const t = useI18n();\n return (\n <Text variant='secondary'>\n {count.total !== undefined && t('results_count', [count.total], { count: count.total })}\n {count.total && count.selected && ' '}\n {count.selected !== undefined &&\n `(${t('selected_count', [count.selected], { count: count.selected })})`}\n </Text>\n );\n};\n\nconst QueryOptionButton = ({\n id,\n queryOptionProps,\n iconOnly,\n setCurrentQueryOption\n}: {\n id: QueryOptionId;\n queryOptionProps: QueryOptionDialogProps \| PresetMenuProps;\n iconOnly: boolean;\n setCurrentQueryOption: Dispatch<SetStateAction<QueryOptionDialogState>>;\n}) => {\n const t = useI18n();\n let i18nKey!: 'filter' \| 'sort' \| 'group';\n let icon!: 'filter' \| 'arrow-up-down' \| 'row';\n\n if (id === 'filter') {\n i18nKey = 'filter';\n icon = 'filter';\n } else if (id === 'sort') {\n i18nKey = 'sort';\n icon = 'arrow-up-down';\n } else if (id === 'group') {\n i18nKey = 'group';\n icon = 'row';\n }\n\n const text = t(i18nKey);\n const variant = iconOnly ? 'simple' : 'text';\n\n useEffect(() => {\n if (!queryOptionProps \|\| !hasProp(queryOptionProps, 'renderer')) {\n return;\n }\n\n setCurrentQueryOption(cur => {\n if (!cur) return null;\n return {\n ...cur,\n props: queryOptionProps\n };\n });\n }, [queryOptionProps, setCurrentQueryOption]);\n\n if (hasProp(queryOptionProps, 'renderer')) {\n return (\n <div>\n <Button\n variant={variant}\n icon={iconOnly}\n label={iconOnly ? text : undefined}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n setCurrentQueryOption({\n id,\n props: queryOptionProps,\n popoverTarget: e.currentTarget\n });\n }}\n >\n <Flex container={{ inline: true, alignItems: 'center', gap: 1 }} as='span'>\n <Icon name={icon} />\n {!iconOnly && text}\n {!iconOnly && queryOptionProps.count && <Count>{queryOptionProps.count}</Count>}\n </Flex>\n </Button>\n </div>\n );\n }\n\n if (hasProp(queryOptionProps, 'items')) {\n return (\n <div>\n <MenuButton\n variant={variant}\n text={text}\n icon={icon}\n iconOnly={iconOnly}\n count={queryOptionProps.count}\n menu={{\n mode: queryOptionProps.mode,\n items: queryOptionProps.items.map(item => ({ ...item, primary: item.text })),\n onItemClick: queryOptionProps.onItemClick\n }}\n />\n </div>\n );\n }\n\n return null;\n};\n\nconst ListToolbar: FunctionComponent<ListToolbarProps & ForwardProps> = forwardRef(\n (\n {\n heading,\n onCreateNew,\n search,\n count,\n filter,\n sort,\n group,\n actions\n }: PropsWithoutRef<ListToolbarProps>,\n ref: ListToolbarProps['ref']\n ) => {\n const t = useI18n();\n const isSmallOrAbove = useBreakpoint('sm');\n const isMediumOrAbove = useBreakpoint('md');\n const actionsButtonRef = useRef<HTMLButtonElement>(null);\n\n const [queryOptionDialogState, setQueryOptionDialogState] =\n useState<QueryOptionDialogState>(null);\n\n const createNewButton = useMemo(() => {\n if (!onCreateNew) return null;\n const text = t('create_new');\n\n return (\n <Button\n variant={isSmallOrAbove ? 'secondary' : 'simple'}\n icon={!isSmallOrAbove}\n label={isSmallOrAbove ? undefined : text}\n onClick={onCreateNew}\n >\n <Flex as='span' container={{ inline: true, alignItems: 'center', gap: 1 }}>\n <Icon name='plus' />\n {isSmallOrAbove && <span>{text}</span>}\n </Flex>\n </Button>\n );\n }, [t, onCreateNew, isSmallOrAbove]);\n\n const filterButton = filter && (\n <QueryOptionButton\n id='filter'\n queryOptionProps={filter}\n iconOnly={!isMediumOrAbove}\n setCurrentQueryOption={setQueryOptionDialogState}\n />\n );\n\n const sortButton = sort && (\n <QueryOptionButton\n id='sort'\n queryOptionProps={sort}\n iconOnly={!isMediumOrAbove}\n setCurrentQueryOption={setQueryOptionDialogState}\n />\n );\n\n const groupButton = group && (\n <QueryOptionButton\n id='group'\n queryOptionProps={group}\n iconOnly={!isMediumOrAbove}\n setCurrentQueryOption={setQueryOptionDialogState}\n />\n );\n\n const onQueryOptionCancel = useCallback(() => {\n if (queryOptionDialogState?.props.onCancel() === false) return;\n setQueryOptionDialogState(null);\n }, [queryOptionDialogState]);\n\n const onQueryOptionSubmit = useCallback(() => {\n if (queryOptionDialogState?.props.onSubmit() === false) return;\n setQueryOptionDialogState(null);\n }, [queryOptionDialogState]);\n\n return (\n <Flex\n as={StyledListToolbar}\n container={{ direction: 'column', gap: 2 }}\n item={{ grow: 1 }}\n ref={ref}\n >\n <Flex container={{ alignItems: 'center', justify: 'between' }}>\n {typeof heading === 'string' ? (\n <Text variant='h3'>{heading}</Text>\n ) : (\n <StyledViewSelector\n variant='text'\n text={heading.views.find(view => view.selected)?.text ?? heading.views[0].text}\n menu={{\n mode: 'single-select',\n items: heading.views.map(view => ({ ...view, primary: view.text })),\n onItemClick: heading.onViewSelect\n }}\n />\n )}\n {createNewButton}\n </Flex>\n <Flex container={{ alignItems: 'start', justify: 'between', gap: 2 }}>\n <Flex\n as={StyledSearchForm}\n container={{ alignItems: 'center', wrap: 'wrap', gap: 2 }}\n item={{ grow: 1 }}\n >\n {search && <SearchInput {...search} />}\n {isSmallOrAbove && count && <CountMeta count={count} />}\n </Flex>\n {(filterButton \|\| sortButton \|\| groupButton \|\| actions) && (\n <Flex container={{ alignItems: 'center', gap: 1 }} md={{ container: { gap: 3 } }}>\n <>\n {filterButton}\n {sortButton}\n {groupButton}\n </>\n {actions && (\n <Actions\n items={actions.map(({ icon, ...restProps }) => ({\n visual: icon ? <Icon name={icon} /> : undefined,\n ...restProps\n }))}\n menuAt={1}\n ref={actionsButtonRef}\n />\n )}\n </Flex>\n )}\n </Flex>\n {!isSmallOrAbove && count && (\n <Flex container={{ alignItems: 'center', wrap: 'wrap', gap: 2 }}>\n <CountMeta count={count} />\n </Flex>\n )}\n\n {queryOptionDialogState && (\n <QueryOptionPopover\n target={queryOptionDialogState.popoverTarget}\n heading={t(`${queryOptionDialogState.id}_by`)}\n onCancel={onQueryOptionCancel}\n onSubmit={onQueryOptionSubmit}\n >\n <queryOptionDialogState.props.renderer />\n </QueryOptionPopover>\n )}\n </Flex>\n );\n }\n);\n\nexport default ListToolbar;\n"]}

package/lib/components/ListToolbar/QueryOptionPopover.js CHANGED Viewed

@@ -54,13 +54,13 @@ const QueryOptionPopover = forwardRef(({ target, heading, children, onCancel, on
     useEffect(() => {
         getFocusables(popoverRef)[0]?.focus();
     }, [popoverRef]);
-    return (_jsx(StyledQueryListPopover, { target: target, ref: popoverRef, role: 'dialog', "aria-labelledby": headingId, arrow: true, onKeyDown: onKeydown, children: _jsxs(Flex, { container: { direction: 'column', gap: 2, pad: 2 }, children: [_jsx(Text, { variant: 'h3', id: headingId, children: heading }, void 0), children, _jsxs(Flex, { container: { justify: 'between' }, children: [_jsx(Button, { onClick: () => {
+    return (_jsx(StyledQueryListPopover, { target: target, ref: popoverRef, role: 'dialog', "aria-labelledby": headingId, arrow: true, onKeyDown: onKeydown, children: _jsxs(Flex, { container: { direction: 'column', gap: 2, pad: 2 }, children: [_jsx(Text, { variant: 'h3', id: headingId, children: heading }), children, _jsxs(Flex, { container: { justify: 'between' }, children: [_jsx(Button, { onClick: () => {
                                 onCancel();
                                 target?.focus();
-                            }, children: t('cancel') }, void 0), _jsx(Button, { variant: 'primary', onClick: () => {
+                            }, children: t('cancel') }), _jsx(Button, { variant: 'primary', onClick: () => {
                                 onSubmit();
                                 target?.focus();
-                            }, children: t('submit') }, void 0)] }, void 0)] }, void 0) }, void 0));
+                            }, children: t('submit') })] })] }) }));
 });
 export default QueryOptionPopover;
 //# sourceMappingURL=QueryOptionPopover.js.map

package/lib/components/ListToolbar/QueryOptionPopover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"QueryOptionPopover.js","sourceRoot":"","sources":["../../../src/components/ListToolbar/QueryOptionPopover.tsx"],"names":[],"mappings":"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~~WACH~~,EACN,QAAQ,EACT,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,aACrC,KAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE;gCACZ,QAAQ,EAAE,CAAC;gCACX,MAAM,EAAE,KAAK,EAAE,CAAC;4BAClB,CAAC,YAEA,CAAC,CAAC,QAAQ,CAAC,~~WACL~~,EACT,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,GAAG,EAAE;gCACZ,QAAQ,EAAE,CAAC;gCACX,MAAM,EAAE,KAAK,EAAE,CAAC;4BAClB,CAAC,YAEA,CAAC,CAAC,QAAQ,CAAC,~~WACL~~,~~YACJ~~,~~YACF~~,~~WACgB~~,CAC1B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import {\n FunctionComponent,\n PropsWithoutRef,\n forwardRef,\n ReactNode,\n useEffect,\n useCallback\n} from 'react';\nimport styled from 'styled-components';\n\nimport { useConsolidatedRef, useI18n, useOuterEvent, useUID } from '../../hooks';\nimport { ForwardProps, OmitStrict } from '../../types';\nimport { getFocusables } from '../../utils';\nimport Button from '../Button';\nimport Flex from '../Flex';\nimport Popover, { PopoverProps } from '../Popover';\nimport Text from '../Text';\n\nimport { QueryOptionDialogProps } from './ListToolbar.types';\n\ninterface ListToolbarPopoverProps\n extends OmitStrict<PopoverProps, 'target'>,\n Pick<QueryOptionDialogProps, 'onCancel' \| 'onSubmit'> {\n heading: string;\n children: ReactNode;\n target?: HTMLButtonElement \| null;\n}\n\nconst StyledQueryListPopover = styled(Popover)`\n min-width: 40ch;\n`;\n\nconst QueryOptionPopover: FunctionComponent<ListToolbarPopoverProps & ForwardProps> = forwardRef(\n (\n { target, heading, children, onCancel, onSubmit }: PropsWithoutRef<ListToolbarPopoverProps>,\n ref: ListToolbarPopoverProps['ref']\n ) => {\n const t = useI18n();\n const headingId = useUID();\n const popoverRef = useConsolidatedRef(ref);\n\n const onKeydown = useCallback(\n (e: KeyboardEvent) => {\n if (e.repeat) return;\n\n if (e.key === 'Escape') {\n onCancel();\n target?.focus();\n return;\n }\n\n if (e.key === 'Tab') {\n const focusables = getFocusables(popoverRef);\n if (!focusables \|\| focusables.length < 2) return;\n const firstFocusable = focusables[0];\n const lastFocusable = focusables[focusables.length - 1];\n\n if (\n !e.shiftKey &&\n (document.activeElement === popoverRef.current \|\|\n document.activeElement === lastFocusable)\n ) {\n firstFocusable?.focus();\n e.preventDefault();\n } else if (\n e.shiftKey &&\n (document.activeElement === popoverRef.current \|\|\n document.activeElement === firstFocusable)\n ) {\n lastFocusable?.focus();\n e.preventDefault();\n }\n }\n },\n [onCancel, popoverRef, target]\n );\n\n useOuterEvent('mousedown', [popoverRef], () => {\n onCancel();\n });\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, [onKeydown]);\n\n useEffect(() => {\n getFocusables(popoverRef)[0]?.focus();\n }, [popoverRef]);\n\n return (\n <StyledQueryListPopover\n target={target}\n ref={popoverRef}\n role='dialog'\n aria-labelledby={headingId}\n arrow\n onKeyDown={onKeydown}\n >\n <Flex container={{ direction: 'column', gap: 2, pad: 2 }}>\n <Text variant='h3' id={headingId}>\n {heading}\n </Text>\n {children}\n <Flex container={{ justify: 'between' }}>\n <Button\n onClick={() => {\n onCancel();\n target?.focus();\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n variant='primary'\n onClick={() => {\n onSubmit();\n target?.focus();\n }}\n >\n {t('submit')}\n </Button>\n </Flex>\n </Flex>\n </StyledQueryListPopover>\n );\n }\n);\n\nexport default QueryOptionPopover;\n"]}
1	+ {"version":3,"file":"QueryOptionPopover.js","sourceRoot":"","sources":["../../../src/components/ListToolbar/QueryOptionPopover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n PropsWithoutRef,\n forwardRef,\n ReactNode,\n useEffect,\n useCallback\n} from 'react';\nimport styled from 'styled-components';\n\nimport { useConsolidatedRef, useI18n, useOuterEvent, useUID } from '../../hooks';\nimport { ForwardProps, OmitStrict } from '../../types';\nimport { getFocusables } from '../../utils';\nimport Button from '../Button';\nimport Flex from '../Flex';\nimport Popover, { PopoverProps } from '../Popover';\nimport Text from '../Text';\n\nimport { QueryOptionDialogProps } from './ListToolbar.types';\n\ninterface ListToolbarPopoverProps\n extends OmitStrict<PopoverProps, 'target'>,\n Pick<QueryOptionDialogProps, 'onCancel' \| 'onSubmit'> {\n heading: string;\n children: ReactNode;\n target?: HTMLButtonElement \| null;\n}\n\nconst StyledQueryListPopover = styled(Popover)`\n min-width: 40ch;\n`;\n\nconst QueryOptionPopover: FunctionComponent<ListToolbarPopoverProps & ForwardProps> = forwardRef(\n (\n { target, heading, children, onCancel, onSubmit }: PropsWithoutRef<ListToolbarPopoverProps>,\n ref: ListToolbarPopoverProps['ref']\n ) => {\n const t = useI18n();\n const headingId = useUID();\n const popoverRef = useConsolidatedRef(ref);\n\n const onKeydown = useCallback(\n (e: KeyboardEvent) => {\n if (e.repeat) return;\n\n if (e.key === 'Escape') {\n onCancel();\n target?.focus();\n return;\n }\n\n if (e.key === 'Tab') {\n const focusables = getFocusables(popoverRef);\n if (!focusables \|\| focusables.length < 2) return;\n const firstFocusable = focusables[0];\n const lastFocusable = focusables[focusables.length - 1];\n\n if (\n !e.shiftKey &&\n (document.activeElement === popoverRef.current \|\|\n document.activeElement === lastFocusable)\n ) {\n firstFocusable?.focus();\n e.preventDefault();\n } else if (\n e.shiftKey &&\n (document.activeElement === popoverRef.current \|\|\n document.activeElement === firstFocusable)\n ) {\n lastFocusable?.focus();\n e.preventDefault();\n }\n }\n },\n [onCancel, popoverRef, target]\n );\n\n useOuterEvent('mousedown', [popoverRef], () => {\n onCancel();\n });\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, [onKeydown]);\n\n useEffect(() => {\n getFocusables(popoverRef)[0]?.focus();\n }, [popoverRef]);\n\n return (\n <StyledQueryListPopover\n target={target}\n ref={popoverRef}\n role='dialog'\n aria-labelledby={headingId}\n arrow\n onKeyDown={onKeydown}\n >\n <Flex container={{ direction: 'column', gap: 2, pad: 2 }}>\n <Text variant='h3' id={headingId}>\n {heading}\n </Text>\n {children}\n <Flex container={{ justify: 'between' }}>\n <Button\n onClick={() => {\n onCancel();\n target?.focus();\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n variant='primary'\n onClick={() => {\n onSubmit();\n target?.focus();\n }}\n >\n {t('submit')}\n </Button>\n </Flex>\n </Flex>\n </StyledQueryListPopover>\n );\n }\n);\n\nexport default QueryOptionPopover;\n"]}

package/lib/components/Location/CurrentLocationButton.js CHANGED Viewed

@@ -43,7 +43,7 @@ const CurrentLocationButton = ({ onChange, onError, defaultToCurrentLocation })
             loadMapsAPI(name, providerOpts).then(getCurrentLocation);
         }
     }, []);
-    return (_jsxs(_Fragment, { children: [_jsx(Button, { ref: setEl, as: StyledCurrentLocationButton, variant: 'simple', icon: true, onClick: getCurrentLocation, "aria-label": t('my_current_location_button_a11y'), currentLocationDisabled: currentLocationDisabled, children: _jsx(Icon, { name: 'location' }, void 0) }, void 0), el && currentLocationDisabled && (_jsx(Tooltip, { shown: true, target: el, children: t('allow_location_permissions_text') }, void 0))] }, void 0));
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { ref: setEl, as: StyledCurrentLocationButton, variant: 'simple', icon: true, onClick: getCurrentLocation, "aria-label": t('my_current_location_button_a11y'), currentLocationDisabled: currentLocationDisabled, children: _jsx(Icon, { name: 'location' }) }), el && currentLocationDisabled && (_jsx(Tooltip, { shown: true, target: el, children: t('allow_location_permissions_text') }))] }));
 };
 export default CurrentLocationButton;
 //# sourceMappingURL=CurrentLocationButton.js.map

package/lib/components/Location/CurrentLocationButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CurrentLocationButton.js","sourceRoot":"","sources":["../../../src/components/Location/CurrentLocationButton.tsx"],"names":[],"mappings":"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~~WAAG~~,~~WACjB~~,EACR,EAAE,IAAI,uBAAuB,IAAI,CAChC,KAAC,OAAO,IAAC,KAAK,QAAC,MAAM,EAAE,EAAE,YACtB,CAAC,CAAC,iCAAiC,CAAC,~~WAC7B~~,CACX,~~YACA~~,CACJ,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,qBAAqB,CAAC","sourcesContent":["import { FC, useCallback, useContext, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Tooltip from '../Tooltip';\nimport { useElement, useI18n } from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as locationIcon from '../Icon/icons/location.icon';\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\n\nimport MapsContext from './MapsContext';\nimport { getNavigatorPosition, getAddress, loadMapsAPI } from './utils';\n\nregisterIcon(locationIcon);\n\nexport type CurrentLocationButtonProps = {\n /** Callback fired after click on my current location button if location was found. /\n onChange?: (value: {\n name: string;\n address?: string;\n latitude?: number;\n longitude?: number;\n }) => void;\n /* Callback fired when an error occurs. /\n onError?: (error: Error) => void;\n /* Get current location on component first render */\n defaultToCurrentLocation?: boolean;\n};\n\nexport const StyledCurrentLocationButton = styled(Button)<{ currentLocationDisabled: boolean }>(\n ({\n currentLocationDisabled,\n theme: {\n base: { 'disabled-opacity': disabledOpacity }\n }\n }) => css`\n ${currentLocationDisabled &&\n css`\n opacity: ${disabledOpacity};\n cursor: auto;\n `}\n `\n);\n\nStyledCurrentLocationButton.defaultProps = defaultThemeProp;\n\nconst CurrentLocationButton: FC<CurrentLocationButtonProps> = ({\n onChange,\n onError,\n defaultToCurrentLocation\n}: CurrentLocationButtonProps) => {\n const t = useI18n();\n const { name, ...providerOpts } = useContext(MapsContext);\n const [currentLocationDisabled, setCurrentLocationDisabled] = useState(false);\n const [el, setEl] = useElement();\n\n const getCurrentLocation = useCallback(() => {\n getNavigatorPosition()\n .catch(error => {\n setCurrentLocationDisabled(true);\n throw error;\n })\n .then(getAddress)\n .then(address => onChange?.(address))\n .catch(error => onError?.(error));\n }, [onChange, onError]);\n\n useEffect(() => {\n navigator.permissions?.query({ name: 'geolocation' }).then(result => {\n if (result.state === 'denied') {\n setCurrentLocationDisabled(true);\n }\n });\n if (defaultToCurrentLocation) {\n loadMapsAPI(name, providerOpts).then(getCurrentLocation);\n }\n }, []);\n\n return (\n <>\n <Button\n ref={setEl}\n as={StyledCurrentLocationButton}\n variant='simple'\n icon\n onClick={getCurrentLocation}\n aria-label={t('my_current_location_button_a11y')}\n currentLocationDisabled={currentLocationDisabled}\n >\n <Icon name='location' />\n </Button>\n {el && currentLocationDisabled && (\n <Tooltip shown target={el}>\n {t('allow_location_permissions_text')}\n </Tooltip>\n )}\n </>\n );\n};\nexport default CurrentLocationButton;\n"]}
1	+ {"version":3,"file":"CurrentLocationButton.js","sourceRoot":"","sources":["../../../src/components/Location/CurrentLocationButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useCallback, useContext, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Tooltip from '../Tooltip';\nimport { useElement, useI18n } from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as locationIcon from '../Icon/icons/location.icon';\nimport Button from '../Button';\nimport { defaultThemeProp } from '../../theme';\n\nimport MapsContext from './MapsContext';\nimport { getNavigatorPosition, getAddress, loadMapsAPI } from './utils';\n\nregisterIcon(locationIcon);\n\nexport type CurrentLocationButtonProps = {\n /** Callback fired after click on my current location button if location was found. /\n onChange?: (value: {\n name: string;\n address?: string;\n latitude?: number;\n longitude?: number;\n }) => void;\n /* Callback fired when an error occurs. /\n onError?: (error: Error) => void;\n /* Get current location on component first render */\n defaultToCurrentLocation?: boolean;\n};\n\nexport const StyledCurrentLocationButton = styled(Button)<{ currentLocationDisabled: boolean }>(\n ({\n currentLocationDisabled,\n theme: {\n base: { 'disabled-opacity': disabledOpacity }\n }\n }) => css`\n ${currentLocationDisabled &&\n css`\n opacity: ${disabledOpacity};\n cursor: auto;\n `}\n `\n);\n\nStyledCurrentLocationButton.defaultProps = defaultThemeProp;\n\nconst CurrentLocationButton: FC<CurrentLocationButtonProps> = ({\n onChange,\n onError,\n defaultToCurrentLocation\n}: CurrentLocationButtonProps) => {\n const t = useI18n();\n const { name, ...providerOpts } = useContext(MapsContext);\n const [currentLocationDisabled, setCurrentLocationDisabled] = useState(false);\n const [el, setEl] = useElement();\n\n const getCurrentLocation = useCallback(() => {\n getNavigatorPosition()\n .catch(error => {\n setCurrentLocationDisabled(true);\n throw error;\n })\n .then(getAddress)\n .then(address => onChange?.(address))\n .catch(error => onError?.(error));\n }, [onChange, onError]);\n\n useEffect(() => {\n navigator.permissions?.query({ name: 'geolocation' }).then(result => {\n if (result.state === 'denied') {\n setCurrentLocationDisabled(true);\n }\n });\n if (defaultToCurrentLocation) {\n loadMapsAPI(name, providerOpts).then(getCurrentLocation);\n }\n }, []);\n\n return (\n <>\n <Button\n ref={setEl}\n as={StyledCurrentLocationButton}\n variant='simple'\n icon\n onClick={getCurrentLocation}\n aria-label={t('my_current_location_button_a11y')}\n currentLocationDisabled={currentLocationDisabled}\n >\n <Icon name='location' />\n </Button>\n {el && currentLocationDisabled && (\n <Tooltip shown target={el}>\n {t('allow_location_permissions_text')}\n </Tooltip>\n )}\n </>\n );\n};\nexport default CurrentLocationButton;\n"]}

package/lib/components/Location/LocationDisplay.js CHANGED Viewed

@@ -7,13 +7,13 @@ import MapsContext from './MapsContext';
 const LocationDisplay = forwardRef(({ value = '', displayText, variant = 'text-map', height = '25rem', zoomLevel = 13, ...restProps }, ref) => {
     const { name } = useContext(MapsContext);
     const valueString = typeof value === 'string' ? value : `${value?.latitude}, ${value?.longitude}`;
-    return !value ? (_jsx(Text, { ref: ref, ...restProps, "aria-hidden": 'true', children: _jsx("span", { "aria-hidden": 'true', children: "\u2013\u2013" }, void 0) }, void 0)) : (_jsxs(_Fragment, { children: [(variant === 'text' || variant === 'text-map') &&
-                (name === 'google' ? (_jsx(Link, { ref: ref, ...restProps, target: '_blank', rel: 'noopener noreferrer', href: `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(typeof value === 'string' ? value : `${value?.latitude}, ${value?.longitude}`)}`, children: displayText || valueString }, void 0)) : (_jsx(Text, { ref: ref, ...restProps, children: displayText || valueString }, void 0))), (variant === 'text-map' || variant === 'map') && (_jsx(LocationView, { ...{
+    return !value ? (_jsx(Text, { ref: ref, ...restProps, "aria-hidden": 'true', children: _jsx("span", { "aria-hidden": 'true', children: "\u2013\u2013" }) })) : (_jsxs(_Fragment, { children: [(variant === 'text' || variant === 'text-map') &&
+                (name === 'google' ? (_jsx(Link, { ref: ref, ...restProps, target: '_blank', rel: 'noopener noreferrer', href: `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(typeof value === 'string' ? value : `${value?.latitude}, ${value?.longitude}`)}`, children: displayText || valueString })) : (_jsx(Text, { ref: ref, ...restProps, children: displayText || valueString }))), (variant === 'text-map' || variant === 'map') && (_jsx(LocationView, { ...{
                     location: value,
                     centerMapOnChange: true,
                     height,
                     zoomLevel
-                } }, void 0))] }, void 0));
+                } }))] }));
 });
 export default LocationDisplay;
 //# sourceMappingURL=LocationDisplay.js.map