@pega/cosmos-react-core 7.14.2-1 → 7.16.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.
- package/lib/components/ComboBox/ComboBox.d.ts.map +1 -1
- package/lib/components/ComboBox/ComboBox.js +1 -1
- package/lib/components/ComboBox/ComboBox.js.map +1 -1
- package/lib/components/DateTime/Input/DateInput.js +1 -1
- package/lib/components/DateTime/Input/DateInput.js.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.js +4 -1
- package/lib/components/DateTime/Input/DateTimeInput.js.map +1 -1
- package/lib/components/DateTime/Input/MonthInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/MonthInput.js +0 -2
- package/lib/components/DateTime/Input/MonthInput.js.map +1 -1
- package/lib/components/DateTime/Input/utils.d.ts +3 -3
- package/lib/components/DateTime/Input/utils.d.ts.map +1 -1
- package/lib/components/DateTime/Input/utils.js +61 -41
- package/lib/components/DateTime/Input/utils.js.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.js +0 -2
- package/lib/components/DateTime/Picker/DatePicker.js.map +1 -1
- package/lib/components/Dialog/Dialog.d.ts.map +1 -1
- package/lib/components/Dialog/Dialog.js +3 -2
- package/lib/components/Dialog/Dialog.js.map +1 -1
- package/lib/components/Dialog/Dialog.types.d.ts +5 -0
- package/lib/components/Dialog/Dialog.types.d.ts.map +1 -1
- package/lib/components/Dialog/Dialog.types.js.map +1 -1
- package/lib/components/Dialog/FormDialog.d.ts.map +1 -1
- package/lib/components/Dialog/FormDialog.js +1 -2
- package/lib/components/Dialog/FormDialog.js.map +1 -1
- package/lib/components/Dialog/InfoDialog.d.ts.map +1 -1
- package/lib/components/Dialog/InfoDialog.js +1 -2
- package/lib/components/Dialog/InfoDialog.js.map +1 -1
- package/lib/components/Lightbox/Lightbox.js +1 -1
- package/lib/components/Lightbox/Lightbox.js.map +1 -1
- package/lib/components/Slider/Slider.d.ts.map +1 -1
- package/lib/components/Slider/Slider.js +18 -3
- package/lib/components/Slider/Slider.js.map +1 -1
- package/lib/hooks/useFocusTrap.d.ts +3 -3
- package/lib/hooks/useFocusTrap.d.ts.map +1 -1
- package/lib/hooks/useFocusTrap.js +4 -2
- package/lib/hooks/useFocusTrap.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InfoDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/InfoDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,
|
|
1
|
+
{"version":3,"file":"InfoDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/InfoDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect } from 'react';\nimport type { PropsWithoutRef, FC, HTMLAttributes } from 'react';\n\nimport { useConsolidatedRef, useEscape, useI18n, useOuterEvent, useUID } from '../../hooks';\nimport Text from '../Text';\nimport Icon from '../Icon';\nimport Progress from '../Progress';\nimport Flex from '../Flex';\nimport SummaryItem from '../SummaryItem';\nimport { getFocusables } from '../../utils';\n\nimport { StyledChildrenWrap, StyledDialogContent, StyledDialogHeader } from './Dialog.styles';\nimport type { InfoDialogProps } from './Dialog.types';\nimport { StyledDismissButton, StyledInfoDialog } from './InfoDialog.styles';\n\nconst InfoDialog: FC<InfoDialogProps & HTMLAttributes<HTMLDivElement>> = forwardRef(\n function InfoDialog(\n {\n target,\n heading: headingProp,\n children,\n progress: progressProp,\n onDismiss,\n ...restProps\n }: PropsWithoutRef<InfoDialogProps>,\n ref: InfoDialogProps['ref']\n ) {\n const t = useI18n();\n const headingId = useUID();\n const dialogRef = useConsolidatedRef(ref);\n const dialogContentRef = useRef<HTMLDivElement>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n\n const setFocus = () => {\n if (progressProp) return;\n\n const focusables = getFocusables(dialogRef);\n\n const focusable =\n focusables.find(el => {\n return dialogContentRef.current?.contains(el);\n }) ??\n closeButtonRef.current ??\n focusables[0];\n\n focusable?.focus();\n };\n\n useEscape(\n e => {\n onDismiss?.();\n e.stopPropagation();\n },\n dialogRef,\n [onDismiss]\n );\n\n useOuterEvent('mousedown', [target, dialogRef], () => {\n onDismiss?.();\n });\n\n useEffect(() => {\n if (!progressProp) {\n setFocus();\n }\n }, [progressProp]);\n\n useEffect(() => {\n const closeDialog = () => {\n setTimeout(() => {\n onDismiss?.();\n // The 0 timeout ensures that the dialog will not re-open immediately after the close event is triggered.\n }, 0);\n };\n\n target.addEventListener('click', closeDialog);\n\n return () => {\n if (document.contains(target)) {\n target.focus();\n }\n target.removeEventListener('click', closeDialog);\n };\n }, []);\n\n const heading = headingProp ? (\n <Text id={headingId} variant='h2'>\n {typeof headingProp === 'string' ? headingProp : headingProp.primary}\n </Text>\n ) : null;\n\n const progress = (\n <Progress\n visible={!!progressProp}\n focusOnVisible\n placement='local'\n message={typeof progressProp === 'string' ? progressProp : undefined}\n />\n );\n\n const dismissButton = (\n <StyledDismissButton\n icon\n variant='simple'\n onClick={() => {\n onDismiss();\n }}\n label={t('close')}\n ref={closeButtonRef}\n >\n <Icon name='times' />\n </StyledDismissButton>\n );\n\n return (\n <StyledInfoDialog\n {...restProps}\n {...(typeof headingProp === 'string'\n ? { labelledbyId: headingId }\n : { ariaLabel: headingProp?.primary })}\n arrow\n target={target}\n progress={progressProp}\n ref={dialogRef}\n >\n {headingProp && heading && (\n <Flex\n container={{ alignItems: 'center', justify: 'between', pad: 2, gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledDialogHeader}\n >\n {typeof headingProp === 'string' ? (\n heading\n ) : (\n <SummaryItem\n primary={heading}\n secondary={\n headingProp.secondary ? (\n <Text variant='secondary'>{headingProp.secondary}</Text>\n ) : undefined\n }\n visual={headingProp.visual}\n />\n )}\n {dismissButton}\n </Flex>\n )}\n\n {(!headingProp || children || progressProp) && (\n <Flex\n container={{ direction: 'column' }}\n item={{ grow: 1 }}\n as={StyledDialogContent}\n ref={dialogContentRef}\n >\n {!headingProp && dismissButton}\n {children && (\n <StyledChildrenWrap inert={progressProp ? '' : undefined}>\n {children}\n </StyledChildrenWrap>\n )}\n {progress}\n </Flex>\n )}\n </StyledInfoDialog>\n );\n }\n);\n\nexport default InfoDialog;\n"]}
|
|
@@ -128,7 +128,7 @@ const Lightbox = forwardRef(function Lightbox({ testId, items, defaultIndex = 0,
|
|
|
128
128
|
media = currentItem.src && (_jsx(Image, { "data-testid": testIds.content, src: currentItem.src, alt: currentItem.description ?? t('description_unavailable'), onLoad: handleLoad, onError: handleError, ref: mediaRef }));
|
|
129
129
|
break;
|
|
130
130
|
case 'pdf':
|
|
131
|
-
media = currentItem.src && (_jsx(_Fragment, { children: navigator.pdfViewerEnabled ? (_jsx(StyledObject, { "data-testid": testIds.content, data: currentItem.src, type: 'application/pdf', ref: mediaRef, children: currentItem.description ?? t('description_unavailable') })) : (
|
|
131
|
+
media = currentItem.src && (_jsx(_Fragment, { children: navigator.pdfViewerEnabled ? (_jsx(StyledObject, { "data-testid": testIds.content, data: currentItem.src, type: 'application/pdf', ref: mediaRef, children: currentItem.description ?? t('description_unavailable') })) : (defaultContent) }));
|
|
132
132
|
break;
|
|
133
133
|
case 'video':
|
|
134
134
|
media = currentItem.src && (
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.js","sourceRoot":"","sources":["../../../src/components/Lightbox/Lightbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, useState, forwardRef, useCallback } from 'react';\nimport type {\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n MouseEvent,\n SyntheticEvent,\n RefObject\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport type { ForwardProps } from '../../types';\nimport { cap, getActiveElement, getFocusables, withTestIds } from '../../utils';\nimport Flex from '../Flex';\nimport MetaList from '../MetaList';\nimport Icon from '../Icon';\nimport Image from '../Image';\nimport Text from '../Text';\nimport {\n useConfiguration,\n useConsolidatedRef,\n useDirection,\n useEvent,\n useFocusTrap,\n useI18n,\n useScrollToggle,\n useTestIds\n} from '../../hooks';\nimport ErrorState from '../ErrorState';\nimport Progress from '../Progress';\nimport FileVisual from '../File/FileVisual';\nimport Button from '../Button';\nimport Link from '../Link/Link';\nimport mimeTypes from '../File/mimeTypes.json';\nimport { getKindFromMimeType } from '../File/utils';\nimport type { AttachmentType } from '../File/utils';\n\nimport {\n StyledHeader,\n StyledCountTracker,\n StyledInfo,\n StyledPreviewRegion,\n StyledNavButton,\n StyledMediaContainer,\n StyledLiveRegion,\n StyledLightbox,\n StyledContainer,\n StyledObject\n} from './Lightbox.styles';\nimport type { LightboxProps, MediaElement } from './Lightbox.types';\nimport { getLightboxTestIds } from './Lightbox.test-ids';\n\nconst Lightbox: FunctionComponent<LightboxProps & ForwardProps> = forwardRef(function Lightbox(\n {\n testId,\n items,\n defaultIndex = 0,\n cycle = false,\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 { portalTarget } = useConfiguration();\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 mediaRef = useConsolidatedRef(currentItem.ref);\n const [liveText, setLiveText] = useState('');\n const countTrackerText = items.length > 1 ? t('x_of_y', [currentIndex + 1, items.length]) : '';\n const testIds = useTestIds(testId, getLightboxTestIds);\n\n const initiatorRef = useRef<Element | null>(null);\n\n const close = () => {\n setOpen(false);\n\n if (\n initiatorRef.current?.isConnected &&\n (initiatorRef.current instanceof HTMLElement || initiatorRef.current instanceof SVGElement)\n )\n initiatorRef.current.focus();\n };\n\n const navigate = (direction: 1 | -1) => {\n if (direction === 1) {\n if (currentIndex < items.length - 1) {\n setCurrentIndex(cur => cur + 1);\n } else if (cycle) {\n setCurrentIndex(0);\n }\n } else if (currentIndex > 0) {\n setCurrentIndex(cur => cur - 1);\n } else if (cycle) {\n setCurrentIndex(items.length - 1);\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(`${currentItem.name}. ${countTrackerText ? `${countTrackerText}.` : ''}`);\n }, [currentItem.name, countTrackerText]);\n\n useEffect(() => {\n onNavigate?.(currentItem.id, currentIndex);\n }, [currentIndex]);\n\n useEffect(() => {\n const activeElement = getActiveElement();\n initiatorRef.current = activeElement;\n if (getFocusables(lightboxRef).length > 0) getFocusables(lightboxRef)[0].focus();\n }, []);\n\n const handleLoad = useCallback(\n (e: SyntheticEvent<MediaElement> | Event) => {\n onItemLoad?.(currentItem.id, e);\n },\n [onItemLoad, currentItem.id]\n );\n\n const handleError = useCallback(\n (e: SyntheticEvent<MediaElement> | Event) => {\n onItemError?.(currentItem.id, e);\n },\n [onItemError, currentItem.id]\n );\n\n // Object elements appear to need native event handlers bound as JSX does not work.\n // TODO: Follow up on reason why.\n useEffect(() => {\n if (!mediaRef.current || currentItem.format !== 'pdf') return;\n const pdfObject = mediaRef.current;\n pdfObject.addEventListener('load', handleLoad);\n pdfObject.addEventListener('error', handleError);\n\n return () => {\n pdfObject.removeEventListener('load', handleLoad);\n pdfObject.removeEventListener('error', handleError);\n };\n }, [currentItem]);\n\n let media;\n let validContent = true;\n let attachmentType: AttachmentType = 'generic';\n if (currentItem.format === undefined) {\n validContent = !currentItem.error;\n } else {\n const extractMimeType = (mimeTypes as Record<string, string>)[currentItem.format.toLowerCase()];\n const getType = currentItem.format === 'url' ? 'link' : 'generic';\n attachmentType = extractMimeType ? getKindFromMimeType(extractMimeType) : getType;\n const previewableAttachmentTypes = ['pdf', 'image', 'link', 'video', 'audio'];\n validContent = previewableAttachmentTypes.includes(attachmentType)\n ? !!currentItem.src\n : !!attachmentType;\n }\n\n if (validContent) {\n const nonPreviewableContent = (\n <>\n <Text>\n {t('non_previewable', [\n currentItem.format ? currentItem.format.toUpperCase() : currentItem.name\n ])}\n </Text>\n {onItemDownload && (\n <Button\n aria-label={t('download')}\n onClick={() => onItemDownload(currentItem.id)}\n data-testid={testIds.nonPreviewableDownload}\n >\n {t('download')}\n </Button>\n )}\n </>\n );\n\n const defaultContent = (\n <Flex\n container={{ direction: 'column', gap: 2, alignItems: 'center' }}\n as={StyledInfo}\n data-testid={testIds.content}\n >\n <FileVisual type={attachmentType} size='l' />\n {attachmentType === 'link' && currentItem.src ? (\n <Link href={currentItem.src} data-testid={testIds.link}>\n {currentItem.name}\n </Link>\n ) : (\n nonPreviewableContent\n )}\n </Flex>\n );\n\n switch (attachmentType) {\n case 'image':\n media = currentItem.src && (\n <Image\n data-testid={testIds.content}\n src={currentItem.src}\n alt={currentItem.description ?? t('description_unavailable')}\n onLoad={handleLoad}\n onError={handleError}\n ref={mediaRef as RefObject<HTMLImageElement>}\n />\n );\n break;\n case 'pdf':\n media = currentItem.src && (\n <>\n {navigator.pdfViewerEnabled ? (\n <StyledObject\n data-testid={testIds.content}\n data={currentItem.src}\n type='application/pdf'\n ref={mediaRef as RefObject<HTMLObjectElement>}\n >\n {currentItem.description ?? t('description_unavailable')}\n </StyledObject>\n ) : (\n { defaultContent }\n )}\n </>\n );\n break;\n case 'video':\n media = currentItem.src && (\n // eslint-disable-next-line jsx-a11y/media-has-caption\n <video\n data-testid={testIds.content}\n src={currentItem.src}\n controls\n onLoadedData={handleLoad}\n onError={handleError}\n ref={mediaRef as RefObject<HTMLVideoElement>}\n />\n );\n break;\n case 'audio':\n media = currentItem.src && (\n // eslint-disable-next-line jsx-a11y/media-has-caption\n <audio\n data-testid={testIds.content}\n src={currentItem.src}\n controls\n onLoadedData={handleLoad}\n onError={handleError}\n ref={mediaRef as RefObject<HTMLAudioElement>}\n />\n );\n break;\n default: {\n media = defaultContent;\n }\n }\n } else {\n media = <Progress placement='block' delay />;\n }\n\n const content = (\n <StyledLightbox\n data-testid={testIds.root}\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 data-testid={testIds.pagination} aria-hidden='true'>\n {countTrackerText}\n </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 data-testid={testIds.name} variant='primary' as='h2'>\n {currentItem.name}\n </Text>\n {currentItem.metadata && (\n <MetaList data-testid={testIds.metadata} items={currentItem.metadata} />\n )}\n </Flex>\n\n <Flex container as={StyledContainer}>\n {attachmentType !== 'link' && onItemDownload && (\n <Button\n data-testid={testIds.download}\n variant='simple'\n aria-label={t('download')}\n icon\n onClick={() => onItemDownload(currentItem.id)}\n >\n <Icon name='download' />\n </Button>\n )}\n <Button\n data-testid={testIds.close}\n variant='simple'\n ref={closeButtonRef}\n aria-label={t('close')}\n icon\n onClick={close}\n >\n <Icon name='times' />\n </Button>\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 data-testid={testIds.prev}\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={StyledMediaContainer}>\n <Flex\n container={{ alignItems: 'center', justify: 'center' }}\n onMouseDown={(e: MouseEvent<HTMLDivElement>) => {\n if (e.button !== 0) return;\n if (e.target === e.currentTarget) close();\n }}\n >\n {currentItem.error ? <ErrorState message={t('content_load_error')} /> : media}\n </Flex>\n </Flex>\n\n {items.length > 1 && (\n <StyledNavButton\n data-testid={testIds.next}\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 return portalTarget ? createPortal(content, portalTarget) : content;\n});\n\nexport default withTestIds(Lightbox, getLightboxTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"Lightbox.js","sourceRoot":"","sources":["../../../src/components/Lightbox/Lightbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, useState, forwardRef, useCallback } from 'react';\nimport type {\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n MouseEvent,\n SyntheticEvent,\n RefObject\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport type { ForwardProps } from '../../types';\nimport { cap, getActiveElement, getFocusables, withTestIds } from '../../utils';\nimport Flex from '../Flex';\nimport MetaList from '../MetaList';\nimport Icon from '../Icon';\nimport Image from '../Image';\nimport Text from '../Text';\nimport {\n useConfiguration,\n useConsolidatedRef,\n useDirection,\n useEvent,\n useFocusTrap,\n useI18n,\n useScrollToggle,\n useTestIds\n} from '../../hooks';\nimport ErrorState from '../ErrorState';\nimport Progress from '../Progress';\nimport FileVisual from '../File/FileVisual';\nimport Button from '../Button';\nimport Link from '../Link/Link';\nimport mimeTypes from '../File/mimeTypes.json';\nimport { getKindFromMimeType } from '../File/utils';\nimport type { AttachmentType } from '../File/utils';\n\nimport {\n StyledHeader,\n StyledCountTracker,\n StyledInfo,\n StyledPreviewRegion,\n StyledNavButton,\n StyledMediaContainer,\n StyledLiveRegion,\n StyledLightbox,\n StyledContainer,\n StyledObject\n} from './Lightbox.styles';\nimport type { LightboxProps, MediaElement } from './Lightbox.types';\nimport { getLightboxTestIds } from './Lightbox.test-ids';\n\nconst Lightbox: FunctionComponent<LightboxProps & ForwardProps> = forwardRef(function Lightbox(\n {\n testId,\n items,\n defaultIndex = 0,\n cycle = false,\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 { portalTarget } = useConfiguration();\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 mediaRef = useConsolidatedRef(currentItem.ref);\n const [liveText, setLiveText] = useState('');\n const countTrackerText = items.length > 1 ? t('x_of_y', [currentIndex + 1, items.length]) : '';\n const testIds = useTestIds(testId, getLightboxTestIds);\n\n const initiatorRef = useRef<Element | null>(null);\n\n const close = () => {\n setOpen(false);\n\n if (\n initiatorRef.current?.isConnected &&\n (initiatorRef.current instanceof HTMLElement || initiatorRef.current instanceof SVGElement)\n )\n initiatorRef.current.focus();\n };\n\n const navigate = (direction: 1 | -1) => {\n if (direction === 1) {\n if (currentIndex < items.length - 1) {\n setCurrentIndex(cur => cur + 1);\n } else if (cycle) {\n setCurrentIndex(0);\n }\n } else if (currentIndex > 0) {\n setCurrentIndex(cur => cur - 1);\n } else if (cycle) {\n setCurrentIndex(items.length - 1);\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(`${currentItem.name}. ${countTrackerText ? `${countTrackerText}.` : ''}`);\n }, [currentItem.name, countTrackerText]);\n\n useEffect(() => {\n onNavigate?.(currentItem.id, currentIndex);\n }, [currentIndex]);\n\n useEffect(() => {\n const activeElement = getActiveElement();\n initiatorRef.current = activeElement;\n if (getFocusables(lightboxRef).length > 0) getFocusables(lightboxRef)[0].focus();\n }, []);\n\n const handleLoad = useCallback(\n (e: SyntheticEvent<MediaElement> | Event) => {\n onItemLoad?.(currentItem.id, e);\n },\n [onItemLoad, currentItem.id]\n );\n\n const handleError = useCallback(\n (e: SyntheticEvent<MediaElement> | Event) => {\n onItemError?.(currentItem.id, e);\n },\n [onItemError, currentItem.id]\n );\n\n // Object elements appear to need native event handlers bound as JSX does not work.\n // TODO: Follow up on reason why.\n useEffect(() => {\n if (!mediaRef.current || currentItem.format !== 'pdf') return;\n const pdfObject = mediaRef.current;\n pdfObject.addEventListener('load', handleLoad);\n pdfObject.addEventListener('error', handleError);\n\n return () => {\n pdfObject.removeEventListener('load', handleLoad);\n pdfObject.removeEventListener('error', handleError);\n };\n }, [currentItem]);\n\n let media;\n let validContent = true;\n let attachmentType: AttachmentType = 'generic';\n if (currentItem.format === undefined) {\n validContent = !currentItem.error;\n } else {\n const extractMimeType = (mimeTypes as Record<string, string>)[currentItem.format.toLowerCase()];\n const getType = currentItem.format === 'url' ? 'link' : 'generic';\n attachmentType = extractMimeType ? getKindFromMimeType(extractMimeType) : getType;\n const previewableAttachmentTypes = ['pdf', 'image', 'link', 'video', 'audio'];\n validContent = previewableAttachmentTypes.includes(attachmentType)\n ? !!currentItem.src\n : !!attachmentType;\n }\n\n if (validContent) {\n const nonPreviewableContent = (\n <>\n <Text>\n {t('non_previewable', [\n currentItem.format ? currentItem.format.toUpperCase() : currentItem.name\n ])}\n </Text>\n {onItemDownload && (\n <Button\n aria-label={t('download')}\n onClick={() => onItemDownload(currentItem.id)}\n data-testid={testIds.nonPreviewableDownload}\n >\n {t('download')}\n </Button>\n )}\n </>\n );\n\n const defaultContent = (\n <Flex\n container={{ direction: 'column', gap: 2, alignItems: 'center' }}\n as={StyledInfo}\n data-testid={testIds.content}\n >\n <FileVisual type={attachmentType} size='l' />\n {attachmentType === 'link' && currentItem.src ? (\n <Link href={currentItem.src} data-testid={testIds.link}>\n {currentItem.name}\n </Link>\n ) : (\n nonPreviewableContent\n )}\n </Flex>\n );\n\n switch (attachmentType) {\n case 'image':\n media = currentItem.src && (\n <Image\n data-testid={testIds.content}\n src={currentItem.src}\n alt={currentItem.description ?? t('description_unavailable')}\n onLoad={handleLoad}\n onError={handleError}\n ref={mediaRef as RefObject<HTMLImageElement>}\n />\n );\n break;\n case 'pdf':\n media = currentItem.src && (\n <>\n {navigator.pdfViewerEnabled ? (\n <StyledObject\n data-testid={testIds.content}\n data={currentItem.src}\n type='application/pdf'\n ref={mediaRef as RefObject<HTMLObjectElement>}\n >\n {currentItem.description ?? t('description_unavailable')}\n </StyledObject>\n ) : (\n defaultContent\n )}\n </>\n );\n break;\n case 'video':\n media = currentItem.src && (\n // eslint-disable-next-line jsx-a11y/media-has-caption\n <video\n data-testid={testIds.content}\n src={currentItem.src}\n controls\n onLoadedData={handleLoad}\n onError={handleError}\n ref={mediaRef as RefObject<HTMLVideoElement>}\n />\n );\n break;\n case 'audio':\n media = currentItem.src && (\n // eslint-disable-next-line jsx-a11y/media-has-caption\n <audio\n data-testid={testIds.content}\n src={currentItem.src}\n controls\n onLoadedData={handleLoad}\n onError={handleError}\n ref={mediaRef as RefObject<HTMLAudioElement>}\n />\n );\n break;\n default: {\n media = defaultContent;\n }\n }\n } else {\n media = <Progress placement='block' delay />;\n }\n\n const content = (\n <StyledLightbox\n data-testid={testIds.root}\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 data-testid={testIds.pagination} aria-hidden='true'>\n {countTrackerText}\n </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 data-testid={testIds.name} variant='primary' as='h2'>\n {currentItem.name}\n </Text>\n {currentItem.metadata && (\n <MetaList data-testid={testIds.metadata} items={currentItem.metadata} />\n )}\n </Flex>\n\n <Flex container as={StyledContainer}>\n {attachmentType !== 'link' && onItemDownload && (\n <Button\n data-testid={testIds.download}\n variant='simple'\n aria-label={t('download')}\n icon\n onClick={() => onItemDownload(currentItem.id)}\n >\n <Icon name='download' />\n </Button>\n )}\n <Button\n data-testid={testIds.close}\n variant='simple'\n ref={closeButtonRef}\n aria-label={t('close')}\n icon\n onClick={close}\n >\n <Icon name='times' />\n </Button>\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 data-testid={testIds.prev}\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={StyledMediaContainer}>\n <Flex\n container={{ alignItems: 'center', justify: 'center' }}\n onMouseDown={(e: MouseEvent<HTMLDivElement>) => {\n if (e.button !== 0) return;\n if (e.target === e.currentTarget) close();\n }}\n >\n {currentItem.error ? <ErrorState message={t('content_load_error')} /> : media}\n </Flex>\n </Flex>\n\n {items.length > 1 && (\n <StyledNavButton\n data-testid={testIds.next}\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 return portalTarget ? createPortal(content, portalTarget) : content;\n});\n\nexport default withTestIds(Lightbox, getLightboxTestIds);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,iBAAiB,EAKlB,MAAM,OAAO,CAAC;AAOf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAGhD,OAAO,KAAK,WAAW,MAAM,gBAAgB,CAAC;;;;
|
|
1
|
+
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,iBAAiB,EAKlB,MAAM,OAAO,CAAC;AAOf,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAGhD,OAAO,KAAK,WAAW,MAAM,gBAAgB,CAAC;;;;AA0R9C,wBAAqD"}
|
|
@@ -18,13 +18,18 @@ const Slider = forwardRef(function Slider(props, ref) {
|
|
|
18
18
|
const trackRef = useRef(null);
|
|
19
19
|
const [inDrag, setInDrag] = useState(false);
|
|
20
20
|
const [inputValue, setInputValue] = useState(value.toString());
|
|
21
|
+
useEffect(() => {
|
|
22
|
+
const parsed = parseFloat(inputValue);
|
|
23
|
+
if (!Number.isNaN(parsed) && parsed !== value) {
|
|
24
|
+
setInputValue(value.toString());
|
|
25
|
+
}
|
|
26
|
+
}, [value]);
|
|
21
27
|
const setValue = useCallback((newValue) => {
|
|
22
28
|
if (disabled || readOnly)
|
|
23
29
|
return;
|
|
24
30
|
const normalizedValue = Math.min(Math.max(newValue, min), max);
|
|
25
|
-
setInputValue(normalizedValue.toString());
|
|
26
31
|
onChange(normalizedValue);
|
|
27
|
-
}, [disabled, readOnly, onChange]);
|
|
32
|
+
}, [disabled, readOnly, onChange, min, max]);
|
|
28
33
|
const { start, end } = useDirection();
|
|
29
34
|
const moveThumb = useCallback((e) => {
|
|
30
35
|
if (disabled || readOnly)
|
|
@@ -116,7 +121,17 @@ const Slider = forwardRef(function Slider(props, ref) {
|
|
|
116
121
|
setInDrag(true);
|
|
117
122
|
e.preventDefault(); // Prevent dispatching mouse events as some browser may do that
|
|
118
123
|
onDragStart?.();
|
|
119
|
-
}, "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, "aria-orientation": orientation, "aria-readonly": readOnly || undefined, "aria-disabled": disabled || undefined, id: id, "aria-label": label?.toString(), "aria-describedby": `${id}-info`, "aria-controls": `${id}-value` })] }), Object.keys(ticks).length > 0 && (_jsx(SliderTicks, { ticks: ticks, min: min, max: max, step: step, orientation: orientation, onClick: setValue }))] }), showInput && !preview && (_jsx(NumberInput, { "data-testid": testIds.control, id: `${id}-value`, status: status, min: min, max: max, step: step, value: inputValue, showGroupSeparators: false, onChange: setInputValue, onBlur: v =>
|
|
124
|
+
}, "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, "aria-orientation": orientation, "aria-readonly": readOnly || undefined, "aria-disabled": disabled || undefined, id: id, "aria-label": label?.toString(), "aria-describedby": `${id}-info`, "aria-controls": `${id}-value` })] }), Object.keys(ticks).length > 0 && (_jsx(SliderTicks, { ticks: ticks, min: min, max: max, step: step, orientation: orientation, onClick: setValue }))] }), showInput && !preview && (_jsx(NumberInput, { "data-testid": testIds.control, id: `${id}-value`, status: status, min: min, max: max, step: step, value: inputValue, showGroupSeparators: false, onChange: setInputValue, onBlur: v => {
|
|
125
|
+
const num = Number(v);
|
|
126
|
+
if (!Number.isFinite(num)) {
|
|
127
|
+
setInputValue(value.toString());
|
|
128
|
+
return;
|
|
129
|
+
}
|
|
130
|
+
const normalized = getNearestValue(num, min, max, step);
|
|
131
|
+
const clamped = Math.min(Math.max(normalized, min), max);
|
|
132
|
+
setInputValue(clamped.toString());
|
|
133
|
+
setValue(clamped);
|
|
134
|
+
}, size: size, readOnly: readOnly, disabled: disabled, "aria-label": label?.toString() })), preview && _jsx(StyledPreview, { id: `${id}-value`, value: value, size: size })] }));
|
|
120
135
|
return label ? (_jsx(FormField, { testId: testIds, label: label, labelHidden: labelHidden, id: id, info: info, status: status, required: required, disabled: disabled, additionalInfo: additionalInfo, children: Comp })) : (Comp);
|
|
121
136
|
});
|
|
122
137
|
export default withTestIds(Slider, getSliderTestIds);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useRef, useState, forwardRef } from 'react';\nimport type {\n KeyboardEvent,\n FunctionComponent,\n PropsWithoutRef,\n CSSProperties,\n Ref,\n TouchEvent as ReactTouchEvent\n} from 'react';\n\nimport { NumberInput } from '../Number';\nimport { useConsolidatedRef, useDirection, useTestIds, useUID } from '../../hooks';\nimport FormField from '../FormField';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport type { ForwardProps } from '../../types';\nimport { cap, withTestIds } from '../../utils';\n\nimport type SliderProps from './Slider.types';\nimport {\n StyledSlider,\n StyledTrack,\n StyledThumb,\n StyledSliderTrackWrapper,\n StyledBar,\n StyledPreview\n} from './Slider.styles';\nimport { calculateValueLength, getNearestValue } from './utils';\nimport SliderTicks from './SliderTicks';\nimport { getSliderTestIds } from './Slider.test-ids';\n\nconst Slider: FunctionComponent<SliderProps & ForwardProps> = forwardRef(function Slider(\n props: PropsWithoutRef<SliderProps>,\n ref: Ref<HTMLDivElement>\n) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n required,\n status,\n info,\n label,\n labelHidden,\n min = 0,\n max = 100,\n step = 1,\n value = min,\n orientation = 'horizontal',\n preview,\n disabled = false,\n readOnly = false,\n showInput = true,\n showProgress,\n ticks = {},\n additionalInfo,\n onChange,\n autoFocus,\n onDragStart,\n onDragEnd: onDragEndProp,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getSliderTestIds);\n\n const thumbRef = useConsolidatedRef<HTMLDivElement>(ref);\n const trackRef = useRef<HTMLDivElement>(null);\n const [inDrag, setInDrag] = useState(false);\n const [inputValue, setInputValue] = useState(value.toString());\n\n const setValue = useCallback(\n (newValue: number) => {\n if (disabled || readOnly) return;\n const normalizedValue = Math.min(Math.max(newValue, min), max);\n\n setInputValue(normalizedValue.toString());\n onChange(normalizedValue);\n },\n [disabled, readOnly, onChange]\n );\n\n const { start, end } = useDirection();\n\n const moveThumb = useCallback(\n (e: MouseEvent | TouchEvent) => {\n if (disabled || readOnly) return;\n if (trackRef.current) {\n const track = trackRef.current.getBoundingClientRect();\n const { clientX, clientY } = 'touches' in e ? e.touches[0] : e;\n const newPosition =\n orientation === 'horizontal'\n ? (clientX - track[start]) / (track[end] - track[start])\n : (clientY - track.bottom) / (track.top - track.bottom);\n\n const normalizedValue = Math.min(Math.max(min + (max - min) * newPosition, min), max);\n setValue(getNearestValue(normalizedValue, min, max, step));\n }\n thumbRef.current?.focus();\n },\n [disabled, readOnly, step, min, max, setValue, start, end]\n );\n\n const onThumbKeyDown = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n if (\n [\n 'ArrowDown',\n 'ArrowUp',\n 'ArrowLeft',\n 'ArrowRight',\n 'PageUp',\n 'PageDown',\n 'Home',\n 'End'\n ].includes(e.key)\n )\n e.preventDefault();\n\n switch (e.key) {\n case 'ArrowDown':\n case `Arrow${cap(start)}`:\n setValue(value - step);\n break;\n case 'ArrowUp':\n case `Arrow${cap(end)}`:\n setValue(value + step);\n break;\n case 'PageUp':\n setValue(value + 10 * step);\n break;\n case 'PageDown':\n setValue(value - 10 * step);\n break;\n case 'Home':\n setValue(min);\n break;\n case 'End':\n setValue(max);\n break;\n default:\n }\n },\n [setValue, value, step, start, end]\n );\n\n useEffect(() => {\n const onDragEnd = () => {\n setInDrag(false);\n if (inDrag) onDragEndProp?.();\n };\n\n document.addEventListener('mouseup', onDragEnd);\n document.addEventListener('touchend', onDragEnd);\n document.addEventListener('touchcancel', onDragEnd);\n if (inDrag) {\n document.addEventListener('mousemove', moveThumb);\n document.addEventListener('touchmove', moveThumb);\n }\n\n return () => {\n document.removeEventListener('mouseup', onDragEnd);\n document.removeEventListener('touchend', onDragEnd);\n document.removeEventListener('touchcancel', onDragEnd);\n document.removeEventListener('mousemove', moveThumb);\n document.removeEventListener('touchmove', moveThumb);\n };\n }, [inDrag, moveThumb, onDragEndProp]);\n\n useEffect(() => {\n if (autoFocus) thumbRef.current?.focus();\n }, [autoFocus]);\n\n const percentage = ((Number(value) - min) / (max - min)) * 100;\n const size = calculateValueLength(min, max, step);\n\n const Comp = (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n as={StyledSlider}\n container={{\n alignItems: 'start',\n direction: orientation === 'horizontal' ? 'row' : 'column'\n }}\n orientation={orientation}\n status={status}\n disabled={disabled}\n readOnly={readOnly}\n size={size}\n style={\n {\n '--slider-value': `${percentage}%`,\n userSelect: inDrag ? 'none' : 'auto'\n } as CSSProperties\n }\n >\n <Grid as={StyledSliderTrackWrapper} container>\n <Flex\n as={StyledTrack}\n ref={trackRef}\n onMouseDown={moveThumb}\n container={{ alignItems: 'center', justify: 'center' }}\n >\n <StyledBar showProgress={showProgress} />\n <StyledThumb\n ref={thumbRef}\n role='slider'\n tabIndex={0}\n onKeyDown={onThumbKeyDown}\n onMouseDown={() => {\n setInDrag(true);\n onDragStart?.();\n }}\n onTouchStart={(e: ReactTouchEvent<HTMLDivElement>) => {\n setInDrag(true);\n e.preventDefault(); // Prevent dispatching mouse events as some browser may do that\n onDragStart?.();\n }}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={value}\n aria-orientation={orientation}\n aria-readonly={readOnly || undefined}\n aria-disabled={disabled || undefined}\n id={id}\n aria-label={label?.toString()}\n aria-describedby={`${id}-info`}\n aria-controls={`${id}-value`}\n />\n </Flex>\n {Object.keys(ticks).length > 0 && (\n <SliderTicks\n ticks={ticks}\n min={min}\n max={max}\n step={step}\n orientation={orientation}\n onClick={setValue}\n />\n )}\n </Grid>\n {showInput && !preview && (\n <NumberInput\n data-testid={testIds.control}\n id={`${id}-value`}\n status={status}\n min={min}\n max={max}\n step={step}\n value={inputValue}\n showGroupSeparators={false}\n onChange={setInputValue}\n onBlur={v => setValue(getNearestValue(Number(v), min, max, step))}\n size={size}\n readOnly={readOnly}\n disabled={disabled}\n aria-label={label?.toString()}\n />\n )}\n {preview && <StyledPreview id={`${id}-value`} value={value} size={size} />}\n </Flex>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n additionalInfo={additionalInfo}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n});\n\nexport default withTestIds(Slider, getSliderTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useRef, useState, forwardRef } from 'react';\nimport type {\n KeyboardEvent,\n FunctionComponent,\n PropsWithoutRef,\n CSSProperties,\n Ref,\n TouchEvent as ReactTouchEvent\n} from 'react';\n\nimport { NumberInput } from '../Number';\nimport { useConsolidatedRef, useDirection, useTestIds, useUID } from '../../hooks';\nimport FormField from '../FormField';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport type { ForwardProps } from '../../types';\nimport { cap, withTestIds } from '../../utils';\n\nimport type SliderProps from './Slider.types';\nimport {\n StyledSlider,\n StyledTrack,\n StyledThumb,\n StyledSliderTrackWrapper,\n StyledBar,\n StyledPreview\n} from './Slider.styles';\nimport { calculateValueLength, getNearestValue } from './utils';\nimport SliderTicks from './SliderTicks';\nimport { getSliderTestIds } from './Slider.test-ids';\n\nconst Slider: FunctionComponent<SliderProps & ForwardProps> = forwardRef(function Slider(\n props: PropsWithoutRef<SliderProps>,\n ref: Ref<HTMLDivElement>\n) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n required,\n status,\n info,\n label,\n labelHidden,\n min = 0,\n max = 100,\n step = 1,\n value = min,\n orientation = 'horizontal',\n preview,\n disabled = false,\n readOnly = false,\n showInput = true,\n showProgress,\n ticks = {},\n additionalInfo,\n onChange,\n autoFocus,\n onDragStart,\n onDragEnd: onDragEndProp,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getSliderTestIds);\n\n const thumbRef = useConsolidatedRef<HTMLDivElement>(ref);\n const trackRef = useRef<HTMLDivElement>(null);\n const [inDrag, setInDrag] = useState(false);\n const [inputValue, setInputValue] = useState(value.toString());\n\n useEffect(() => {\n const parsed = parseFloat(inputValue);\n if (!Number.isNaN(parsed) && parsed !== value) {\n setInputValue(value.toString());\n }\n }, [value]);\n\n const setValue = useCallback(\n (newValue: number) => {\n if (disabled || readOnly) return;\n const normalizedValue = Math.min(Math.max(newValue, min), max);\n\n onChange(normalizedValue);\n },\n [disabled, readOnly, onChange, min, max]\n );\n\n const { start, end } = useDirection();\n\n const moveThumb = useCallback(\n (e: MouseEvent | TouchEvent) => {\n if (disabled || readOnly) return;\n if (trackRef.current) {\n const track = trackRef.current.getBoundingClientRect();\n const { clientX, clientY } = 'touches' in e ? e.touches[0] : e;\n const newPosition =\n orientation === 'horizontal'\n ? (clientX - track[start]) / (track[end] - track[start])\n : (clientY - track.bottom) / (track.top - track.bottom);\n\n const normalizedValue = Math.min(Math.max(min + (max - min) * newPosition, min), max);\n setValue(getNearestValue(normalizedValue, min, max, step));\n }\n thumbRef.current?.focus();\n },\n [disabled, readOnly, step, min, max, setValue, start, end]\n );\n\n const onThumbKeyDown = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n if (\n [\n 'ArrowDown',\n 'ArrowUp',\n 'ArrowLeft',\n 'ArrowRight',\n 'PageUp',\n 'PageDown',\n 'Home',\n 'End'\n ].includes(e.key)\n )\n e.preventDefault();\n\n switch (e.key) {\n case 'ArrowDown':\n case `Arrow${cap(start)}`:\n setValue(value - step);\n break;\n case 'ArrowUp':\n case `Arrow${cap(end)}`:\n setValue(value + step);\n break;\n case 'PageUp':\n setValue(value + 10 * step);\n break;\n case 'PageDown':\n setValue(value - 10 * step);\n break;\n case 'Home':\n setValue(min);\n break;\n case 'End':\n setValue(max);\n break;\n default:\n }\n },\n [setValue, value, step, start, end]\n );\n\n useEffect(() => {\n const onDragEnd = () => {\n setInDrag(false);\n if (inDrag) onDragEndProp?.();\n };\n\n document.addEventListener('mouseup', onDragEnd);\n document.addEventListener('touchend', onDragEnd);\n document.addEventListener('touchcancel', onDragEnd);\n if (inDrag) {\n document.addEventListener('mousemove', moveThumb);\n document.addEventListener('touchmove', moveThumb);\n }\n\n return () => {\n document.removeEventListener('mouseup', onDragEnd);\n document.removeEventListener('touchend', onDragEnd);\n document.removeEventListener('touchcancel', onDragEnd);\n document.removeEventListener('mousemove', moveThumb);\n document.removeEventListener('touchmove', moveThumb);\n };\n }, [inDrag, moveThumb, onDragEndProp]);\n\n useEffect(() => {\n if (autoFocus) thumbRef.current?.focus();\n }, [autoFocus]);\n\n const percentage = ((Number(value) - min) / (max - min)) * 100;\n const size = calculateValueLength(min, max, step);\n\n const Comp = (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n as={StyledSlider}\n container={{\n alignItems: 'start',\n direction: orientation === 'horizontal' ? 'row' : 'column'\n }}\n orientation={orientation}\n status={status}\n disabled={disabled}\n readOnly={readOnly}\n size={size}\n style={\n {\n '--slider-value': `${percentage}%`,\n userSelect: inDrag ? 'none' : 'auto'\n } as CSSProperties\n }\n >\n <Grid as={StyledSliderTrackWrapper} container>\n <Flex\n as={StyledTrack}\n ref={trackRef}\n onMouseDown={moveThumb}\n container={{ alignItems: 'center', justify: 'center' }}\n >\n <StyledBar showProgress={showProgress} />\n <StyledThumb\n ref={thumbRef}\n role='slider'\n tabIndex={0}\n onKeyDown={onThumbKeyDown}\n onMouseDown={() => {\n setInDrag(true);\n onDragStart?.();\n }}\n onTouchStart={(e: ReactTouchEvent<HTMLDivElement>) => {\n setInDrag(true);\n e.preventDefault(); // Prevent dispatching mouse events as some browser may do that\n onDragStart?.();\n }}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={value}\n aria-orientation={orientation}\n aria-readonly={readOnly || undefined}\n aria-disabled={disabled || undefined}\n id={id}\n aria-label={label?.toString()}\n aria-describedby={`${id}-info`}\n aria-controls={`${id}-value`}\n />\n </Flex>\n {Object.keys(ticks).length > 0 && (\n <SliderTicks\n ticks={ticks}\n min={min}\n max={max}\n step={step}\n orientation={orientation}\n onClick={setValue}\n />\n )}\n </Grid>\n {showInput && !preview && (\n <NumberInput\n data-testid={testIds.control}\n id={`${id}-value`}\n status={status}\n min={min}\n max={max}\n step={step}\n value={inputValue}\n showGroupSeparators={false}\n onChange={setInputValue}\n onBlur={v => {\n const num = Number(v);\n\n if (!Number.isFinite(num)) {\n setInputValue(value.toString());\n return;\n }\n\n const normalized = getNearestValue(num, min, max, step);\n const clamped = Math.min(Math.max(normalized, min), max);\n setInputValue(clamped.toString());\n setValue(clamped);\n }}\n size={size}\n readOnly={readOnly}\n disabled={disabled}\n aria-label={label?.toString()}\n />\n )}\n {preview && <StyledPreview id={`${id}-value`} value={value} size={size} />}\n </Flex>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n additionalInfo={additionalInfo}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n});\n\nexport default withTestIds(Slider, getSliderTestIds);\n"]}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import type { RefObject, DependencyList } from 'react';
|
|
2
2
|
/**
|
|
3
3
|
* @example useFocusTrap(elementRef)
|
|
4
|
-
* @param elementRef ref of the element
|
|
5
|
-
* @param
|
|
4
|
+
* @param elementRef ref of the element to trap focus within, or null to disable the trap
|
|
5
|
+
* @param attachToDocument boolean value to specify if event to be attached to document or to be taken from elementRef, defaults to true
|
|
6
6
|
* @param dependencies list of variables or functions that will initiate this hook when they are updated.
|
|
7
7
|
* @param returnEscapedFocus boolean value to specify if focus that escapes the elementRef should be returned to the elementRef, defaults to true
|
|
8
8
|
*/
|
|
9
|
-
declare const useFocusTrap: (elementRef: RefObject<HTMLElement
|
|
9
|
+
declare const useFocusTrap: (elementRef: RefObject<HTMLElement> | null, attachToDocument?: boolean, dependencies?: DependencyList, returnEscapedFocus?: boolean) => void;
|
|
10
10
|
export default useFocusTrap;
|
|
11
11
|
//# sourceMappingURL=useFocusTrap.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFocusTrap.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAMvD;;;;;;GAMG;AACH,QAAA,MAAM,YAAY,eACJ,UAAU,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"useFocusTrap.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAMvD;;;;;;GAMG;AACH,QAAA,MAAM,YAAY,eACJ,UAAU,WAAW,CAAC,GAAG,IAAI,qBACvB,OAAO,sDAEL,OAAO,SAiD5B,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -3,13 +3,15 @@ import { getFocusables, getActiveElement } from '../utils';
|
|
|
3
3
|
import useEvent from './useEvent';
|
|
4
4
|
/**
|
|
5
5
|
* @example useFocusTrap(elementRef)
|
|
6
|
-
* @param elementRef ref of the element
|
|
7
|
-
* @param
|
|
6
|
+
* @param elementRef ref of the element to trap focus within, or null to disable the trap
|
|
7
|
+
* @param attachToDocument boolean value to specify if event to be attached to document or to be taken from elementRef, defaults to true
|
|
8
8
|
* @param dependencies list of variables or functions that will initiate this hook when they are updated.
|
|
9
9
|
* @param returnEscapedFocus boolean value to specify if focus that escapes the elementRef should be returned to the elementRef, defaults to true
|
|
10
10
|
*/
|
|
11
11
|
const useFocusTrap = (elementRef, attachToDocument = true, dependencies = [], returnEscapedFocus = true) => {
|
|
12
12
|
const onKeydown = useCallback((e) => {
|
|
13
|
+
if (!elementRef?.current)
|
|
14
|
+
return;
|
|
13
15
|
if (e.key === 'Tab') {
|
|
14
16
|
const focusables = getFocusables(elementRef);
|
|
15
17
|
const { 0: firstFocusable, [focusables.length - 1]: lastFocusable } = focusables;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFocusTrap.js","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAGpC,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAE3D,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC;;;;;;GAMG;AACH,MAAM,YAAY,GAAG,CACnB,
|
|
1
|
+
{"version":3,"file":"useFocusTrap.js","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAGpC,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAE3D,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC;;;;;;GAMG;AACH,MAAM,YAAY,GAAG,CACnB,UAAyC,EACzC,mBAA4B,IAAI,EAChC,eAA+B,EAAE,EACjC,qBAA8B,IAAI,EAClC,EAAE;IACF,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,CAAgB,EAAE,EAAE;QACjD,IAAI,CAAC,UAAU,EAAE,OAAO;YAAE,OAAO;QAEjC,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,EAAE;YACnB,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;YAC7C,MAAM,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,aAAa,EAAE,GAAG,UAAU,CAAC;YACjF,MAAM,QAAQ,GAAG,gBAAgB,EAAE,CAAC;YAEpC,MAAM,aAAa,GACjB,QAAQ,KAAK,UAAU,CAAC,OAAO;gBAC/B,CAAC,UAAU,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,CAAC;gBACvC,CAAC,UAAU,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,QAAuB,CAAC,CAAC,CAAC;YAE5F,IAAI,aAAa,IAAI,kBAAkB,EAAE;gBACvC,CAAC,CAAC,cAAc,EAAE,CAAC;gBAEnB,IAAI,QAAQ,EAAE;oBACZ,MAAM,sBAAsB,GAAG,aAAa,CAAC,UAAU,EAAE,EAAE,eAAe,EAAE,IAAI,EAAE,CAAC,CAAC;oBACpF,MAAM,aAAa,GAAG,sBAAsB,CAAC,SAAS,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;oBAE9E,IAAI,aAAa,KAAK,CAAC,CAAC,EAAE;wBACxB,IAAI,CAAC,CAAC,QAAQ,EAAE;4BACd,sBAAsB,CAAC,CAAC,aAAa,GAAG,CAAC,CAAC,GAAG,sBAAsB,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,CAAC;yBACrF;6BAAM;4BACL,sBAAsB,CAAC,CAAC,aAAa,GAAG,CAAC,CAAC,GAAG,sBAAsB,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,CAAC;yBACrF;qBACF;yBAAM,IAAI,CAAC,CAAC,QAAQ,EAAE;wBACrB,aAAa,EAAE,KAAK,EAAE,CAAC;qBACxB;yBAAM;wBACL,cAAc,EAAE,KAAK,EAAE,CAAC;qBACzB;iBACF;qBAAM,IAAI,CAAC,CAAC,QAAQ,EAAE;oBACrB,aAAa,EAAE,KAAK,EAAE,CAAC;iBACxB;qBAAM;oBACL,cAAc,EAAE,KAAK,EAAE,CAAC;iBACzB;aACF;iBAAM,IAAI,CAAC,CAAC,QAAQ,IAAI,QAAQ,KAAK,cAAc,EAAE;gBACpD,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,aAAa,EAAE,KAAK,EAAE,CAAC;aACxB;iBAAM,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,QAAQ,KAAK,aAAa,EAAE;gBACpD,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,cAAc,EAAE,KAAK,EAAE,CAAC;aACzB;SACF;IACH,CAAC,EAAE,YAAY,CAAC,CAAC;IAEjB,QAAQ,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC;AACxF,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { useCallback } from 'react';\nimport type { RefObject, DependencyList } from 'react';\n\nimport { getFocusables, getActiveElement } from '../utils';\n\nimport useEvent from './useEvent';\n\n/**\n * @example useFocusTrap(elementRef)\n * @param elementRef ref of the element to trap focus within, or null to disable the trap\n * @param attachToDocument boolean value to specify if event to be attached to document or to be taken from elementRef, defaults to true\n * @param dependencies list of variables or functions that will initiate this hook when they are updated.\n * @param returnEscapedFocus boolean value to specify if focus that escapes the elementRef should be returned to the elementRef, defaults to true\n */\nconst useFocusTrap = (\n elementRef: RefObject<HTMLElement> | null,\n attachToDocument: boolean = true,\n dependencies: DependencyList = [],\n returnEscapedFocus: boolean = true\n) => {\n const onKeydown = useCallback((e: KeyboardEvent) => {\n if (!elementRef?.current) return;\n\n if (e.key === 'Tab') {\n const focusables = getFocusables(elementRef);\n const { 0: firstFocusable, [focusables.length - 1]: lastFocusable } = focusables;\n const activeEl = getActiveElement();\n\n const requiresFocus =\n activeEl === elementRef.current ||\n !elementRef.current?.contains(activeEl) ||\n (elementRef.current?.contains(activeEl) && !focusables.includes(activeEl as HTMLElement));\n\n if (requiresFocus && returnEscapedFocus) {\n e.preventDefault();\n\n if (activeEl) {\n const focusablesWithActiveEl = getFocusables(elementRef, { includeActiveEl: true });\n const activeElIndex = focusablesWithActiveEl.findIndex(el => el === activeEl);\n\n if (activeElIndex !== -1) {\n if (e.shiftKey) {\n focusablesWithActiveEl[(activeElIndex - 1) % focusablesWithActiveEl.length].focus();\n } else {\n focusablesWithActiveEl[(activeElIndex + 1) % focusablesWithActiveEl.length].focus();\n }\n } else if (e.shiftKey) {\n lastFocusable?.focus();\n } else {\n firstFocusable?.focus();\n }\n } else if (e.shiftKey) {\n lastFocusable?.focus();\n } else {\n firstFocusable?.focus();\n }\n } else if (e.shiftKey && activeEl === firstFocusable) {\n e.preventDefault();\n lastFocusable?.focus();\n } else if (!e.shiftKey && activeEl === lastFocusable) {\n e.preventDefault();\n firstFocusable?.focus();\n }\n }\n }, dependencies);\n\n useEvent('keydown', onKeydown, { target: attachToDocument ? undefined : elementRef });\n};\n\nexport default useFocusTrap;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-core",
|
|
3
|
-
"version": "7.
|
|
3
|
+
"version": "7.16.0",
|
|
4
4
|
"description": "Cosmos is a visual design system and UI component collection. Its goal is to empower application developers in their pursuit to create engaging and rewarding user experiences.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|