@cloudscape-design/components 3.0.104 → 3.0.106

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 (40) hide show
  1. package/annotation-context/annotation/annotation-popover.d.ts.map +1 -1
  2. package/annotation-context/annotation/annotation-popover.js +4 -8
  3. package/annotation-context/annotation/annotation-popover.js.map +1 -1
  4. package/area-chart/model/use-chart-model.d.ts.map +1 -1
  5. package/area-chart/model/use-chart-model.js +2 -1
  6. package/area-chart/model/use-chart-model.js.map +1 -1
  7. package/internal/components/chart-popover/index.d.ts.map +1 -1
  8. package/internal/components/chart-popover/index.js +1 -1
  9. package/internal/components/chart-popover/index.js.map +1 -1
  10. package/internal/environment.js +1 -1
  11. package/mixed-line-bar-chart/chart-container.d.ts.map +1 -1
  12. package/mixed-line-bar-chart/chart-container.js +2 -1
  13. package/mixed-line-bar-chart/chart-container.js.map +1 -1
  14. package/package.json +1 -1
  15. package/pie-chart/pie-chart.js +2 -2
  16. package/pie-chart/pie-chart.js.map +1 -1
  17. package/pie-chart/segments.d.ts +2 -2
  18. package/pie-chart/segments.d.ts.map +1 -1
  19. package/pie-chart/segments.js +5 -2
  20. package/pie-chart/segments.js.map +1 -1
  21. package/popover/body.d.ts +1 -4
  22. package/popover/body.d.ts.map +1 -1
  23. package/popover/body.js +16 -4
  24. package/popover/body.js.map +1 -1
  25. package/popover/internal.js +6 -1
  26. package/popover/internal.js.map +1 -1
  27. package/table/header-cell/index.d.ts +5 -2
  28. package/table/header-cell/index.d.ts.map +1 -1
  29. package/table/header-cell/index.js +8 -4
  30. package/table/header-cell/index.js.map +1 -1
  31. package/table/resizer/index.d.ts +3 -1
  32. package/table/resizer/index.d.ts.map +1 -1
  33. package/table/resizer/index.js +45 -11
  34. package/table/resizer/index.js.map +1 -1
  35. package/table/resizer/styles.css.js +6 -4
  36. package/table/resizer/styles.scoped.css +29 -7
  37. package/table/resizer/styles.selectors.js +6 -4
  38. package/table/thead.d.ts.map +1 -1
  39. package/table/thead.js +1 -2
  40. package/table/thead.js.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"pie-chart.js","sourceRoot":"","sources":["../../../src/pie-chart/pie-chart.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { pie } from 'd3-shape';\n\nimport { KeyCode } from '../internal/keycode';\nimport { nodeContains } from '../internal/utils/dom';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport ChartPopover from '../internal/components/chart-popover';\nimport SeriesDetails from '../internal/components/chart-series-details';\nimport SeriesMarker from '../internal/components/chart-series-marker';\nimport ChartStatusContainer, { getChartStatus } from '../internal/components/chart-status-container';\nimport InternalBox from '../box/internal';\n\nimport Labels from './labels';\nimport { PieChartProps, SeriesInfo } from './interfaces';\nimport styles from './styles.css.js';\nimport { defaultDetails, dimensionsBySize, refreshDimensionsBySize } from './utils';\nimport Segments from './segments';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport ChartPlot, { ChartPlotRef } from '../internal/components/chart-plot';\nimport { SomeRequired } from '../internal/types';\n\nexport interface InternalChartDatum<T> {\n index: number;\n color: string;\n datum: Readonly<T>;\n}\n\ninterface InternalPieChartProps<T extends PieChartProps.Datum>\n extends SomeRequired<\n Omit<PieChartProps<T>, 'onHighlightChange'>,\n 'variant' | 'size' | 'i18nStrings' | 'hideTitles' | 'hideDescriptions' | 'statusType'\n > {\n visibleData: Array<InternalChartDatum<T>>;\n width: number;\n\n highlightedSegment: T | null;\n onHighlightChange: (segment: null | T) => void;\n\n legendSegment: T | null;\n\n pinnedSegment: T | null;\n setPinnedSegment: React.Dispatch<React.SetStateAction<T | null>>;\n}\n\nexport interface TooltipData<T> {\n datum: T;\n trackRef: React.RefObject<SVGElement>;\n series: SeriesInfo;\n}\n\nexport default <T extends PieChartProps.Datum>({\n variant,\n size,\n i18nStrings,\n ariaLabel,\n ariaLabelledby,\n data,\n visibleData,\n ariaDescription,\n innerMetricValue,\n innerMetricDescription,\n hideTitles,\n hideDescriptions,\n detailPopoverContent,\n detailPopoverSize,\n width,\n additionalFilters,\n hideFilter,\n hideLegend,\n statusType,\n empty,\n noMatch,\n errorText,\n recoveryText,\n loadingText,\n onRecoveryClick,\n segmentDescription,\n highlightedSegment,\n onHighlightChange,\n legendSegment,\n pinnedSegment,\n setPinnedSegment,\n}: InternalPieChartProps<T>) => {\n const plotRef = useRef<ChartPlotRef>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const focusedSegmentRef = useRef<SVGGElement>(null);\n const popoverTrackRef = useRef<SVGCircleElement>(null);\n const isRefresh = useVisualRefresh();\n\n const dimensions = isRefresh ? refreshDimensionsBySize[size] : dimensionsBySize[size];\n const radius = dimensions.outerRadius;\n\n const hasLabels = !(hideTitles && hideDescriptions);\n const height = 2 * (radius + dimensions.padding + (hasLabels ? dimensions.paddingLabels : 0));\n\n // Inner content is only available for donut charts and the inner description is not displayed for small charts\n const hasInnerContent = variant === 'donut' && (innerMetricValue || (innerMetricDescription && size !== 'small'));\n\n const innerMetricId = useUniqueId('awsui-pie-chart__inner');\n\n const [isTooltipOpen, setTooltipOpen] = useState<boolean>(false);\n const [tooltipData, setTooltipData] = useState<TooltipData<T>>();\n\n const { pieData, dataSum } = useMemo(() => {\n const dataSum = visibleData.reduce((sum, d) => sum + d.datum.value, 0);\n\n const pieFactory = pie<InternalChartDatum<T>>()\n // Minimum 1% segment size\n .value(d => (d.datum.value < dataSum / 100 ? dataSum / 100 : d.datum.value))\n .sort(null);\n\n // Filter out segments with value of zero or below\n const pieData = pieFactory(visibleData.filter(d => d.datum.value > 0));\n\n return { pieData, dataSum };\n }, [visibleData]);\n\n const highlightedSegmentIndex = useMemo(() => {\n for (let index = 0; index < pieData.length; index++) {\n if (pieData[index].data.datum === highlightedSegment) {\n return index;\n }\n }\n return null;\n }, [pieData, highlightedSegment]);\n\n const detailFunction = detailPopoverContent || defaultDetails(i18nStrings);\n const details = tooltipData ? detailFunction(tooltipData.datum, dataSum) : [];\n const tooltipContent = tooltipData && <SeriesDetails details={details} />;\n\n const { isEmpty, showChart } = getChartStatus({ externalData: data, visibleData: pieData, statusType });\n\n // Pie charts have a special condition for empty/noMatch due to how zero-value segments are handled.\n const isNoMatch = isEmpty && visibleData.length !== data.length;\n\n const reserveLegendSpace = !showChart && !hideLegend;\n const reserveFilterSpace = statusType !== 'finished' && !isNoMatch && (!hideFilter || additionalFilters);\n\n const popoverDismissedRecently = useRef(false);\n\n const highlightSegment = useCallback(\n (internalDatum: InternalChartDatum<T>) => {\n const segment = internalDatum.datum;\n if (segment !== highlightedSegment) {\n onHighlightChange(segment);\n }\n\n if (popoverTrackRef.current) {\n setTooltipData({\n datum: internalDatum.datum,\n series: {\n color: internalDatum.color,\n index: internalDatum.index,\n label: internalDatum.datum.title,\n markerType: 'rectangle',\n },\n trackRef: popoverTrackRef,\n });\n setTooltipOpen(true);\n }\n },\n [highlightedSegment, setTooltipOpen, onHighlightChange]\n );\n const clearHighlightedSegment = useCallback(() => {\n setTooltipOpen(false);\n onHighlightChange(null);\n }, [onHighlightChange, setTooltipOpen]);\n\n const onClick = useCallback(\n (internalDatum: InternalChartDatum<T>) => {\n if (pinnedSegment === internalDatum.datum) {\n setPinnedSegment(null);\n clearHighlightedSegment();\n } else {\n setPinnedSegment(internalDatum.datum);\n highlightSegment(internalDatum);\n }\n },\n [pinnedSegment, clearHighlightedSegment, setPinnedSegment, highlightSegment]\n );\n const onMouseOver = useCallback(\n (internalDatum: InternalChartDatum<T>) => {\n if (pinnedSegment !== null) {\n return;\n }\n highlightSegment(internalDatum);\n },\n [pinnedSegment, highlightSegment]\n );\n const onMouseOut = useCallback(() => {\n if (pinnedSegment !== null) {\n return;\n }\n\n clearHighlightedSegment();\n }, [pinnedSegment, clearHighlightedSegment]);\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.keyCode !== KeyCode.right && event.keyCode !== KeyCode.left && event.keyCode !== KeyCode.enter) {\n return;\n }\n\n event.preventDefault();\n\n let nextIndex = highlightedSegmentIndex || 0;\n const MAX = pieData.length - 1;\n if (event.keyCode === KeyCode.right) {\n nextIndex++;\n if (nextIndex > MAX) {\n nextIndex = 0;\n }\n } else if (event.keyCode === KeyCode.left) {\n nextIndex--;\n if (nextIndex < 0) {\n nextIndex = MAX;\n }\n }\n if (event.keyCode === KeyCode.enter) {\n setPinnedSegment(pieData[nextIndex].data.datum);\n }\n highlightSegment(pieData[nextIndex].data);\n },\n [setPinnedSegment, highlightSegment, pieData, highlightedSegmentIndex]\n );\n const onFocus = useCallback(\n (_event: any, target: 'keyboard' | 'mouse') => {\n // We need to make sure that we do not re-show the popover when we focus the segment after the popover is dismissed.\n // Normally we would check `event.relatedTarget` for the previously focused element,\n // but this is not supported for SVG elements in IE11. The workaround is this `popoverDismissedRecently` ref.\n if (pinnedSegment !== null || popoverDismissedRecently.current || target === 'mouse') {\n return;\n }\n\n const segment = highlightedSegment || legendSegment || pieData[0].data.datum;\n const matched = pieData.filter(d => d.data.datum === segment);\n highlightSegment(matched[0].data);\n },\n [pinnedSegment, pieData, highlightSegment, highlightedSegment, legendSegment]\n );\n\n const onBlur = useCallback(\n (event: React.FocusEvent) => {\n const blurTarget = event.relatedTarget || event.target;\n if (blurTarget === null || !(blurTarget instanceof Element) || !nodeContains(containerRef.current, blurTarget)) {\n // We only need to close the tooltip and remove the pinned segment so that we keep track of the current\n // highlighted legendSeries. using clearHighlightedSegment() would set the legendSeries to null, in that case\n // using Keyboard Tab will always highlight the first legend item in the legend component.\n setTooltipOpen(false);\n setPinnedSegment(null);\n }\n },\n [setPinnedSegment]\n );\n const onPopoverDismiss = (outsideClick?: boolean) => {\n setTooltipOpen(false);\n setPinnedSegment(null);\n\n if (!outsideClick) {\n // The delay is needed to bypass focus events caused by click or keypress needed to unpin the popover.\n setTimeout(() => {\n popoverDismissedRecently.current = true;\n plotRef.current!.focusApplication();\n popoverDismissedRecently.current = false;\n }, 0);\n }\n };\n\n return (\n <div\n className={clsx(styles.content, styles[`content--${size}`], {\n [styles['content--without-labels']]: !hasLabels,\n [styles['content--reserve-filter']]: reserveFilterSpace,\n [styles['content--reserve-legend']]: reserveLegendSpace,\n })}\n >\n <ChartStatusContainer\n isEmpty={isEmpty}\n isNoMatch={isNoMatch}\n showChart={showChart}\n statusType={statusType}\n empty={empty}\n noMatch={noMatch}\n loadingText={loadingText}\n errorText={errorText}\n recoveryText={recoveryText}\n onRecoveryClick={onRecoveryClick}\n />\n {showChart && (\n <div className={styles['chart-container']} ref={containerRef}>\n <ChartPlot\n ref={plotRef}\n width={width}\n height={height}\n transform={`translate(${width / 2} ${height / 2})`}\n isPrecise={true}\n isClickable={!isTooltipOpen}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n ariaDescribedby={hasInnerContent ? innerMetricId : undefined}\n ariaRoleDescription={i18nStrings?.chartAriaRoleDescription}\n ariaLiveRegion={tooltipContent}\n activeElementRef={focusedSegmentRef}\n activeElementKey={highlightedSegmentIndex?.toString()}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n >\n <Segments\n pieData={pieData}\n size={size}\n variant={variant}\n focusedSegmentRef={focusedSegmentRef}\n popoverTrackRef={popoverTrackRef}\n highlightedSegment={highlightedSegment}\n segmentAriaRoleDescription={i18nStrings?.segmentAriaRoleDescription}\n onClick={onClick}\n onMouseOver={onMouseOver}\n onMouseOut={onMouseOut}\n />\n {hasLabels && (\n <Labels\n pieData={pieData}\n size={size}\n segmentDescription={segmentDescription}\n visibleDataSum={dataSum}\n hideTitles={hideTitles}\n hideDescriptions={hideDescriptions}\n highlightedSegment={highlightedSegment}\n containerRef={containerRef}\n />\n )}\n </ChartPlot>\n {hasInnerContent && (\n <div className={styles['inner-content']} id={innerMetricId}>\n {innerMetricValue && (\n <InternalBox variant={size === 'small' ? 'h3' : 'h1'} tagOverride=\"div\" color=\"inherit\" padding=\"n\">\n {innerMetricValue}\n </InternalBox>\n )}\n {innerMetricDescription && size !== 'small' && (\n <InternalBox variant=\"h3\" color=\"text-body-secondary\" tagOverride=\"div\" padding=\"n\">\n {innerMetricDescription}\n </InternalBox>\n )}\n </div>\n )}\n {isTooltipOpen && tooltipData && (\n <ChartPopover\n title={\n tooltipData.series && (\n <InternalBox className={styles['popover-header']} variant=\"strong\">\n <SeriesMarker color={tooltipData.series.color} type={tooltipData.series.markerType} />{' '}\n {tooltipData.series.label}\n </InternalBox>\n )\n }\n trackRef={tooltipData.trackRef}\n trackKey={tooltipData.series.index}\n dismissButton={pinnedSegment !== null}\n dismissAriaLabel={i18nStrings.detailPopoverDismissAriaLabel}\n onDismiss={onPopoverDismiss}\n container={plotRef.current?.svg || null}\n size={detailPopoverSize}\n >\n {tooltipContent}\n </ChartPopover>\n )}\n </div>\n )}\n </div>\n );\n};\n"]}
1
+ {"version":3,"file":"pie-chart.js","sourceRoot":"","sources":["../../../src/pie-chart/pie-chart.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { pie } from 'd3-shape';\n\nimport { KeyCode } from '../internal/keycode';\nimport { nodeContains } from '../internal/utils/dom';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport ChartPopover from '../internal/components/chart-popover';\nimport SeriesDetails from '../internal/components/chart-series-details';\nimport SeriesMarker from '../internal/components/chart-series-marker';\nimport ChartStatusContainer, { getChartStatus } from '../internal/components/chart-status-container';\nimport InternalBox from '../box/internal';\n\nimport Labels from './labels';\nimport { PieChartProps, SeriesInfo } from './interfaces';\nimport styles from './styles.css.js';\nimport { defaultDetails, dimensionsBySize, refreshDimensionsBySize } from './utils';\nimport Segments from './segments';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport ChartPlot, { ChartPlotRef } from '../internal/components/chart-plot';\nimport { SomeRequired } from '../internal/types';\n\nexport interface InternalChartDatum<T> {\n index: number;\n color: string;\n datum: Readonly<T>;\n}\n\ninterface InternalPieChartProps<T extends PieChartProps.Datum>\n extends SomeRequired<\n Omit<PieChartProps<T>, 'onHighlightChange'>,\n 'variant' | 'size' | 'i18nStrings' | 'hideTitles' | 'hideDescriptions' | 'statusType'\n > {\n visibleData: Array<InternalChartDatum<T>>;\n width: number;\n\n highlightedSegment: T | null;\n onHighlightChange: (segment: null | T) => void;\n\n legendSegment: T | null;\n\n pinnedSegment: T | null;\n setPinnedSegment: React.Dispatch<React.SetStateAction<T | null>>;\n}\n\nexport interface TooltipData<T> {\n datum: T;\n trackRef: React.RefObject<SVGElement>;\n series: SeriesInfo;\n}\n\nexport default <T extends PieChartProps.Datum>({\n variant,\n size,\n i18nStrings,\n ariaLabel,\n ariaLabelledby,\n data,\n visibleData,\n ariaDescription,\n innerMetricValue,\n innerMetricDescription,\n hideTitles,\n hideDescriptions,\n detailPopoverContent,\n detailPopoverSize,\n width,\n additionalFilters,\n hideFilter,\n hideLegend,\n statusType,\n empty,\n noMatch,\n errorText,\n recoveryText,\n loadingText,\n onRecoveryClick,\n segmentDescription,\n highlightedSegment,\n onHighlightChange,\n legendSegment,\n pinnedSegment,\n setPinnedSegment,\n}: InternalPieChartProps<T>) => {\n const plotRef = useRef<ChartPlotRef>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const focusedSegmentRef = useRef<SVGGElement>(null);\n const popoverTrackRef = useRef<SVGCircleElement>(null);\n const isRefresh = useVisualRefresh();\n\n const dimensions = isRefresh ? refreshDimensionsBySize[size] : dimensionsBySize[size];\n const radius = dimensions.outerRadius;\n\n const hasLabels = !(hideTitles && hideDescriptions);\n const height = 2 * (radius + dimensions.padding + (hasLabels ? dimensions.paddingLabels : 0));\n\n // Inner content is only available for donut charts and the inner description is not displayed for small charts\n const hasInnerContent = variant === 'donut' && (innerMetricValue || (innerMetricDescription && size !== 'small'));\n\n const innerMetricId = useUniqueId('awsui-pie-chart__inner');\n\n const [isTooltipOpen, setTooltipOpen] = useState<boolean>(false);\n const [tooltipData, setTooltipData] = useState<TooltipData<T>>();\n\n const { pieData, dataSum } = useMemo(() => {\n const dataSum = visibleData.reduce((sum, d) => sum + d.datum.value, 0);\n\n const pieFactory = pie<InternalChartDatum<T>>()\n // Minimum 1% segment size\n .value(d => (d.datum.value < dataSum / 100 ? dataSum / 100 : d.datum.value))\n .sort(null);\n\n // Filter out segments with value of zero or below\n const pieData = pieFactory(visibleData.filter(d => d.datum.value > 0));\n\n return { pieData, dataSum };\n }, [visibleData]);\n\n const highlightedSegmentIndex = useMemo(() => {\n for (let index = 0; index < pieData.length; index++) {\n if (pieData[index].data.datum === highlightedSegment) {\n return index;\n }\n }\n return null;\n }, [pieData, highlightedSegment]);\n\n const detailFunction = detailPopoverContent || defaultDetails(i18nStrings);\n const details = tooltipData ? detailFunction(tooltipData.datum, dataSum) : [];\n const tooltipContent = tooltipData && <SeriesDetails details={details} />;\n\n const { isEmpty, showChart } = getChartStatus({ externalData: data, visibleData: pieData, statusType });\n\n // Pie charts have a special condition for empty/noMatch due to how zero-value segments are handled.\n const isNoMatch = isEmpty && visibleData.length !== data.length;\n\n const reserveLegendSpace = !showChart && !hideLegend;\n const reserveFilterSpace = statusType !== 'finished' && !isNoMatch && (!hideFilter || additionalFilters);\n\n const popoverDismissedRecently = useRef(false);\n\n const highlightSegment = useCallback(\n (internalDatum: InternalChartDatum<T>) => {\n const segment = internalDatum.datum;\n if (segment !== highlightedSegment) {\n onHighlightChange(segment);\n }\n\n if (popoverTrackRef.current) {\n setTooltipData({\n datum: internalDatum.datum,\n series: {\n color: internalDatum.color,\n index: internalDatum.index,\n label: internalDatum.datum.title,\n markerType: 'rectangle',\n },\n trackRef: popoverTrackRef,\n });\n setTooltipOpen(true);\n }\n },\n [highlightedSegment, setTooltipOpen, onHighlightChange]\n );\n const clearHighlightedSegment = useCallback(() => {\n setTooltipOpen(false);\n onHighlightChange(null);\n }, [onHighlightChange, setTooltipOpen]);\n\n const onMouseDown = useCallback(\n (internalDatum: InternalChartDatum<T>) => {\n if (pinnedSegment === internalDatum.datum) {\n setPinnedSegment(null);\n clearHighlightedSegment();\n } else {\n setPinnedSegment(internalDatum.datum);\n highlightSegment(internalDatum);\n }\n },\n [pinnedSegment, clearHighlightedSegment, setPinnedSegment, highlightSegment]\n );\n const onMouseOver = useCallback(\n (internalDatum: InternalChartDatum<T>) => {\n if (pinnedSegment !== null) {\n return;\n }\n highlightSegment(internalDatum);\n },\n [pinnedSegment, highlightSegment]\n );\n const onMouseOut = useCallback(() => {\n if (pinnedSegment !== null) {\n return;\n }\n\n clearHighlightedSegment();\n }, [pinnedSegment, clearHighlightedSegment]);\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.keyCode !== KeyCode.right && event.keyCode !== KeyCode.left && event.keyCode !== KeyCode.enter) {\n return;\n }\n\n event.preventDefault();\n\n let nextIndex = highlightedSegmentIndex || 0;\n const MAX = pieData.length - 1;\n if (event.keyCode === KeyCode.right) {\n nextIndex++;\n if (nextIndex > MAX) {\n nextIndex = 0;\n }\n } else if (event.keyCode === KeyCode.left) {\n nextIndex--;\n if (nextIndex < 0) {\n nextIndex = MAX;\n }\n }\n if (event.keyCode === KeyCode.enter) {\n setPinnedSegment(pieData[nextIndex].data.datum);\n }\n highlightSegment(pieData[nextIndex].data);\n },\n [setPinnedSegment, highlightSegment, pieData, highlightedSegmentIndex]\n );\n const onFocus = useCallback(\n (_event: any, target: 'keyboard' | 'mouse') => {\n // We need to make sure that we do not re-show the popover when we focus the segment after the popover is dismissed.\n // Normally we would check `event.relatedTarget` for the previously focused element,\n // but this is not supported for SVG elements in IE11. The workaround is this `popoverDismissedRecently` ref.\n if (pinnedSegment !== null || popoverDismissedRecently.current || target === 'mouse') {\n return;\n }\n\n const segment = highlightedSegment || legendSegment || pieData[0].data.datum;\n const matched = pieData.filter(d => d.data.datum === segment);\n highlightSegment(matched[0].data);\n },\n [pinnedSegment, pieData, highlightSegment, highlightedSegment, legendSegment]\n );\n\n const onBlur = useCallback(\n (event: React.FocusEvent) => {\n const blurTarget = event.relatedTarget || event.target;\n if (blurTarget === null || !(blurTarget instanceof Element) || !nodeContains(containerRef.current, blurTarget)) {\n // We only need to close the tooltip and remove the pinned segment so that we keep track of the current\n // highlighted legendSeries. using clearHighlightedSegment() would set the legendSeries to null, in that case\n // using Keyboard Tab will always highlight the first legend item in the legend component.\n setTooltipOpen(false);\n setPinnedSegment(null);\n }\n },\n [setPinnedSegment]\n );\n const onPopoverDismiss = (outsideClick?: boolean) => {\n setTooltipOpen(false);\n setPinnedSegment(null);\n\n if (!outsideClick) {\n // The delay is needed to bypass focus events caused by click or keypress needed to unpin the popover.\n setTimeout(() => {\n popoverDismissedRecently.current = true;\n plotRef.current!.focusApplication();\n popoverDismissedRecently.current = false;\n }, 0);\n }\n };\n\n return (\n <div\n className={clsx(styles.content, styles[`content--${size}`], {\n [styles['content--without-labels']]: !hasLabels,\n [styles['content--reserve-filter']]: reserveFilterSpace,\n [styles['content--reserve-legend']]: reserveLegendSpace,\n })}\n >\n <ChartStatusContainer\n isEmpty={isEmpty}\n isNoMatch={isNoMatch}\n showChart={showChart}\n statusType={statusType}\n empty={empty}\n noMatch={noMatch}\n loadingText={loadingText}\n errorText={errorText}\n recoveryText={recoveryText}\n onRecoveryClick={onRecoveryClick}\n />\n {showChart && (\n <div className={styles['chart-container']} ref={containerRef}>\n <ChartPlot\n ref={plotRef}\n width={width}\n height={height}\n transform={`translate(${width / 2} ${height / 2})`}\n isPrecise={true}\n isClickable={!isTooltipOpen}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n ariaDescribedby={hasInnerContent ? innerMetricId : undefined}\n ariaRoleDescription={i18nStrings?.chartAriaRoleDescription}\n ariaLiveRegion={tooltipContent}\n activeElementRef={focusedSegmentRef}\n activeElementKey={highlightedSegmentIndex?.toString()}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n >\n <Segments\n pieData={pieData}\n size={size}\n variant={variant}\n focusedSegmentRef={focusedSegmentRef}\n popoverTrackRef={popoverTrackRef}\n highlightedSegment={highlightedSegment}\n segmentAriaRoleDescription={i18nStrings?.segmentAriaRoleDescription}\n onMouseDown={onMouseDown}\n onMouseOver={onMouseOver}\n onMouseOut={onMouseOut}\n />\n {hasLabels && (\n <Labels\n pieData={pieData}\n size={size}\n segmentDescription={segmentDescription}\n visibleDataSum={dataSum}\n hideTitles={hideTitles}\n hideDescriptions={hideDescriptions}\n highlightedSegment={highlightedSegment}\n containerRef={containerRef}\n />\n )}\n </ChartPlot>\n {hasInnerContent && (\n <div className={styles['inner-content']} id={innerMetricId}>\n {innerMetricValue && (\n <InternalBox variant={size === 'small' ? 'h3' : 'h1'} tagOverride=\"div\" color=\"inherit\" padding=\"n\">\n {innerMetricValue}\n </InternalBox>\n )}\n {innerMetricDescription && size !== 'small' && (\n <InternalBox variant=\"h3\" color=\"text-body-secondary\" tagOverride=\"div\" padding=\"n\">\n {innerMetricDescription}\n </InternalBox>\n )}\n </div>\n )}\n {isTooltipOpen && tooltipData && (\n <ChartPopover\n title={\n tooltipData.series && (\n <InternalBox className={styles['popover-header']} variant=\"strong\">\n <SeriesMarker color={tooltipData.series.color} type={tooltipData.series.markerType} />{' '}\n {tooltipData.series.label}\n </InternalBox>\n )\n }\n trackRef={tooltipData.trackRef}\n trackKey={tooltipData.series.index}\n dismissButton={pinnedSegment !== null}\n dismissAriaLabel={i18nStrings.detailPopoverDismissAriaLabel}\n onDismiss={onPopoverDismiss}\n container={plotRef.current?.svg || null}\n size={detailPopoverSize}\n >\n {tooltipContent}\n </ChartPopover>\n )}\n </div>\n )}\n </div>\n );\n};\n"]}
@@ -10,10 +10,10 @@ interface SegmentsProps<T> {
10
10
  focusedSegmentRef: React.RefObject<SVGGElement>;
11
11
  popoverTrackRef: React.RefObject<SVGCircleElement>;
12
12
  segmentAriaRoleDescription?: string;
13
- onClick: (datum: InternalChartDatum<T>) => void;
13
+ onMouseDown: (datum: InternalChartDatum<T>) => void;
14
14
  onMouseOver: (datum: InternalChartDatum<T>) => void;
15
15
  onMouseOut: () => void;
16
16
  }
17
- export default function Segments<T extends PieChartProps.Datum>({ pieData, highlightedSegment, size, variant, focusedSegmentRef, popoverTrackRef, segmentAriaRoleDescription, onClick, onMouseOver, onMouseOut, }: SegmentsProps<T>): JSX.Element;
17
+ export default function Segments<T extends PieChartProps.Datum>({ pieData, highlightedSegment, size, variant, focusedSegmentRef, popoverTrackRef, segmentAriaRoleDescription, onMouseDown, onMouseOver, onMouseOut, }: SegmentsProps<T>): JSX.Element;
18
18
  export {};
19
19
  //# sourceMappingURL=segments.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"segments.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/segments.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAO,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAKjD,UAAU,aAAa,CAAC,CAAC;IACvB,OAAO,EAAE,KAAK,CAAC,WAAW,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACnD,kBAAkB,EAAE,CAAC,GAAG,IAAI,CAAC;IAC7B,IAAI,EAAE,WAAW,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;IACzC,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAClC,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAChD,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACnD,0BAA0B,CAAC,EAAE,MAAM,CAAC;IAEpC,OAAO,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAChD,WAAW,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACpD,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,CAAC,SAAS,aAAa,CAAC,KAAK,EAAE,EAC9D,OAAO,EACP,kBAAkB,EAClB,IAAI,EACJ,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,0BAA0B,EAC1B,OAAO,EACP,WAAW,EACX,UAAU,GACX,EAAE,aAAa,CAAC,CAAC,CAAC,eAqElB"}
1
+ {"version":3,"file":"segments.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/segments.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAO,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAKjD,UAAU,aAAa,CAAC,CAAC;IACvB,OAAO,EAAE,KAAK,CAAC,WAAW,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACnD,kBAAkB,EAAE,CAAC,GAAG,IAAI,CAAC;IAC7B,IAAI,EAAE,WAAW,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;IACzC,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAClC,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAChD,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACnD,0BAA0B,CAAC,EAAE,MAAM,CAAC;IAEpC,WAAW,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACpD,WAAW,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACpD,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,CAAC,SAAS,aAAa,CAAC,KAAK,EAAE,EAC9D,OAAO,EACP,kBAAkB,EAClB,IAAI,EACJ,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,0BAA0B,EAC1B,WAAW,EACX,WAAW,EACX,UAAU,GACX,EAAE,aAAa,CAAC,CAAC,CAAC,eAwElB"}
@@ -8,7 +8,7 @@ import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
8
8
  import styles from './styles.css.js';
9
9
  import clsx from 'clsx';
10
10
  export default function Segments(_a) {
11
- var pieData = _a.pieData, highlightedSegment = _a.highlightedSegment, size = _a.size, variant = _a.variant, focusedSegmentRef = _a.focusedSegmentRef, popoverTrackRef = _a.popoverTrackRef, segmentAriaRoleDescription = _a.segmentAriaRoleDescription, onClick = _a.onClick, onMouseOver = _a.onMouseOver, onMouseOut = _a.onMouseOut;
11
+ var pieData = _a.pieData, highlightedSegment = _a.highlightedSegment, size = _a.size, variant = _a.variant, focusedSegmentRef = _a.focusedSegmentRef, popoverTrackRef = _a.popoverTrackRef, segmentAriaRoleDescription = _a.segmentAriaRoleDescription, onMouseDown = _a.onMouseDown, onMouseOver = _a.onMouseOver, onMouseOut = _a.onMouseOut;
12
12
  var isRefresh = useVisualRefresh();
13
13
  var _b = useMemo(function () {
14
14
  var dimensions = isRefresh ? refreshDimensionsBySize[size] : dimensionsBySize[size];
@@ -44,7 +44,10 @@ export default function Segments(_a) {
44
44
  var isDimmed = highlightedSegment !== null && !isHighlighted;
45
45
  var arcPath = arcFactory(datum) || undefined;
46
46
  var highlightedPath = highlightedArcFactory(datum) || undefined;
47
- return (React.createElement("g", { key: datum.data.index, onClick: function () { return onClick(datum.data); }, onMouseOver: function () { return onMouseOver(datum.data); }, className: clsx(styles.segment, (_a = {},
47
+ return (React.createElement("g", { key: datum.data.index, onMouseDown: function (e) {
48
+ onMouseDown(datum.data);
49
+ e.preventDefault();
50
+ }, onMouseOver: function () { return onMouseOver(datum.data); }, className: clsx(styles.segment, (_a = {},
48
51
  _a[styles['segment--highlighted']] = isHighlighted,
49
52
  _a[styles['segment--dimmed']] = isDimmed,
50
53
  _a)), ref: isHighlighted ? focusedSegmentRef : undefined, "aria-label": "".concat(datum.data.datum.title, " (").concat(datum.data.datum.value, ")"), role: "button", "aria-roledescription": segmentAriaRoleDescription },
@@ -1 +1 @@
1
- {"version":3,"file":"segments.js","sourceRoot":"","sources":["../../../src/pie-chart/segments.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo } from 'react';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { PieChartProps } from './interfaces';\nimport { dimensionsBySize, refreshDimensionsBySize } from './utils';\nimport { InternalChartDatum } from './pie-chart';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport clsx from 'clsx';\n\ninterface SegmentsProps<T> {\n pieData: Array<PieArcDatum<InternalChartDatum<T>>>;\n highlightedSegment: T | null;\n size: NonNullable<PieChartProps['size']>;\n variant: PieChartProps['variant'];\n focusedSegmentRef: React.RefObject<SVGGElement>;\n popoverTrackRef: React.RefObject<SVGCircleElement>;\n segmentAriaRoleDescription?: string;\n\n onClick: (datum: InternalChartDatum<T>) => void;\n onMouseOver: (datum: InternalChartDatum<T>) => void;\n onMouseOut: () => void;\n}\n\nexport default function Segments<T extends PieChartProps.Datum>({\n pieData,\n highlightedSegment,\n size,\n variant,\n focusedSegmentRef,\n popoverTrackRef,\n segmentAriaRoleDescription,\n onClick,\n onMouseOver,\n onMouseOut,\n}: SegmentsProps<T>) {\n const isRefresh = useVisualRefresh();\n\n const { arcFactory, highlightedArcFactory } = useMemo(() => {\n const dimensions = isRefresh ? refreshDimensionsBySize[size] : dimensionsBySize[size];\n const radius = dimensions.outerRadius;\n const innerRadius = variant === 'pie' ? 0 : dimensions.innerRadius;\n const cornerRadius = dimensions.cornerRadius || 0;\n\n const arcFactory = arc<PieArcDatum<InternalChartDatum<any>>>()\n .innerRadius(innerRadius)\n .outerRadius(radius)\n .cornerRadius(cornerRadius);\n\n const highlightedArcFactory = arc<PieArcDatum<InternalChartDatum<any>>>()\n .innerRadius(radius + 4)\n .outerRadius(radius + 6);\n\n return {\n arcFactory,\n highlightedArcFactory,\n };\n }, [size, variant, isRefresh]);\n\n const centroid = useMemo(() => {\n for (const datum of pieData) {\n if (datum.data.datum === highlightedSegment) {\n const [centroidLeft, centroidTop] = arcFactory.centroid(datum);\n return { cx: centroidLeft, cy: centroidTop };\n }\n }\n return null;\n }, [highlightedSegment, pieData, arcFactory]);\n\n return (\n <g onMouseLeave={() => onMouseOut()}>\n {pieData.map(datum => {\n const isHighlighted = highlightedSegment === datum.data.datum;\n const isDimmed = highlightedSegment !== null && !isHighlighted;\n const arcPath = arcFactory(datum) || undefined;\n const highlightedPath = highlightedArcFactory(datum) || undefined;\n return (\n <g\n key={datum.data.index}\n onClick={() => onClick(datum.data)}\n onMouseOver={() => onMouseOver(datum.data)}\n className={clsx(styles.segment, {\n [styles['segment--highlighted']]: isHighlighted,\n [styles['segment--dimmed']]: isDimmed,\n })}\n ref={isHighlighted ? focusedSegmentRef : undefined}\n aria-label={`${datum.data.datum.title} (${datum.data.datum.value})`}\n role=\"button\"\n aria-roledescription={segmentAriaRoleDescription}\n >\n <path d={arcPath} fill={datum.data.color} className={styles.segment__path} aria-hidden=\"true\" />\n <path\n d={highlightedPath}\n fill={datum.data.color}\n className={clsx(styles.segment__path, styles.segment__highlight)}\n aria-hidden=\"true\"\n />\n </g>\n );\n })}\n\n <circle {...centroid} ref={popoverTrackRef} r=\"1\" opacity=\"0\" aria-hidden=\"true\" />\n </g>\n );\n}\n"]}
1
+ {"version":3,"file":"segments.js","sourceRoot":"","sources":["../../../src/pie-chart/segments.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo } from 'react';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { PieChartProps } from './interfaces';\nimport { dimensionsBySize, refreshDimensionsBySize } from './utils';\nimport { InternalChartDatum } from './pie-chart';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\nimport clsx from 'clsx';\n\ninterface SegmentsProps<T> {\n pieData: Array<PieArcDatum<InternalChartDatum<T>>>;\n highlightedSegment: T | null;\n size: NonNullable<PieChartProps['size']>;\n variant: PieChartProps['variant'];\n focusedSegmentRef: React.RefObject<SVGGElement>;\n popoverTrackRef: React.RefObject<SVGCircleElement>;\n segmentAriaRoleDescription?: string;\n\n onMouseDown: (datum: InternalChartDatum<T>) => void;\n onMouseOver: (datum: InternalChartDatum<T>) => void;\n onMouseOut: () => void;\n}\n\nexport default function Segments<T extends PieChartProps.Datum>({\n pieData,\n highlightedSegment,\n size,\n variant,\n focusedSegmentRef,\n popoverTrackRef,\n segmentAriaRoleDescription,\n onMouseDown,\n onMouseOver,\n onMouseOut,\n}: SegmentsProps<T>) {\n const isRefresh = useVisualRefresh();\n\n const { arcFactory, highlightedArcFactory } = useMemo(() => {\n const dimensions = isRefresh ? refreshDimensionsBySize[size] : dimensionsBySize[size];\n const radius = dimensions.outerRadius;\n const innerRadius = variant === 'pie' ? 0 : dimensions.innerRadius;\n const cornerRadius = dimensions.cornerRadius || 0;\n\n const arcFactory = arc<PieArcDatum<InternalChartDatum<any>>>()\n .innerRadius(innerRadius)\n .outerRadius(radius)\n .cornerRadius(cornerRadius);\n\n const highlightedArcFactory = arc<PieArcDatum<InternalChartDatum<any>>>()\n .innerRadius(radius + 4)\n .outerRadius(radius + 6);\n\n return {\n arcFactory,\n highlightedArcFactory,\n };\n }, [size, variant, isRefresh]);\n\n const centroid = useMemo(() => {\n for (const datum of pieData) {\n if (datum.data.datum === highlightedSegment) {\n const [centroidLeft, centroidTop] = arcFactory.centroid(datum);\n return { cx: centroidLeft, cy: centroidTop };\n }\n }\n return null;\n }, [highlightedSegment, pieData, arcFactory]);\n\n return (\n <g onMouseLeave={() => onMouseOut()}>\n {pieData.map(datum => {\n const isHighlighted = highlightedSegment === datum.data.datum;\n const isDimmed = highlightedSegment !== null && !isHighlighted;\n const arcPath = arcFactory(datum) || undefined;\n const highlightedPath = highlightedArcFactory(datum) || undefined;\n return (\n <g\n key={datum.data.index}\n onMouseDown={e => {\n onMouseDown(datum.data);\n e.preventDefault();\n }}\n onMouseOver={() => onMouseOver(datum.data)}\n className={clsx(styles.segment, {\n [styles['segment--highlighted']]: isHighlighted,\n [styles['segment--dimmed']]: isDimmed,\n })}\n ref={isHighlighted ? focusedSegmentRef : undefined}\n aria-label={`${datum.data.datum.title} (${datum.data.datum.value})`}\n role=\"button\"\n aria-roledescription={segmentAriaRoleDescription}\n >\n <path d={arcPath} fill={datum.data.color} className={styles.segment__path} aria-hidden=\"true\" />\n <path\n d={highlightedPath}\n fill={datum.data.color}\n className={clsx(styles.segment__path, styles.segment__highlight)}\n aria-hidden=\"true\"\n />\n </g>\n );\n })}\n\n <circle {...centroid} ref={popoverTrackRef} r=\"1\" opacity=\"0\" aria-hidden=\"true\" />\n </g>\n );\n}\n"]}
package/popover/body.d.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  import React from 'react';
2
- import { ButtonProps } from '../button/interfaces';
3
2
  export interface PopoverBodyProps {
4
3
  dismissButton: boolean;
5
4
  dismissAriaLabel: string | undefined;
@@ -7,10 +6,8 @@ export interface PopoverBodyProps {
7
6
  header: React.ReactNode | undefined;
8
7
  children: React.ReactNode;
9
8
  variant?: 'annotation';
10
- returnFocus?: boolean;
11
9
  overflowVisible?: 'content' | 'both';
12
- dismissButtonRef?: React.Ref<ButtonProps.Ref>;
13
10
  className?: string;
14
11
  }
15
- export default function PopoverBody({ dismissButton: showDismissButton, dismissAriaLabel, header, children, onDismiss, variant, returnFocus, overflowVisible, dismissButtonRef, className, }: PopoverBodyProps): JSX.Element;
12
+ export default function PopoverBody({ dismissButton: showDismissButton, dismissAriaLabel, header, children, onDismiss, variant, overflowVisible, className, }: PopoverBodyProps): JSX.Element;
16
13
  //# sourceMappingURL=body.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"body.d.ts","sourceRoot":"","sources":["../../../src/popover/body.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAM3C,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAKnD,MAAM,WAAW,gBAAgB;IAC/B,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,SAAS,EAAE,MAAM,IAAI,CAAC;IAEtB,MAAM,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAErC,gBAAgB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;IAE9C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,aAAa,EAAE,iBAAiB,EAChC,gBAAgB,EAChB,MAAM,EACN,QAAQ,EACR,SAAS,EACT,OAAO,EACP,WAAkB,EAClB,eAAe,EACf,gBAAgB,EAChB,SAAS,GACV,EAAE,gBAAgB,eAsDlB"}
1
+ {"version":3,"file":"body.d.ts","sourceRoot":"","sources":["../../../src/popover/body.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAW9D,MAAM,WAAW,gBAAgB;IAC/B,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,SAAS,EAAE,MAAM,IAAI,CAAC;IAEtB,MAAM,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,eAAe,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAErC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,aAAa,EAAE,iBAAiB,EAChC,gBAAgB,EAChB,MAAM,EACN,QAAQ,EACR,SAAS,EACT,OAAO,EACP,eAAe,EACf,SAAS,GACV,EAAE,gBAAgB,eAkElB"}
package/popover/body.js CHANGED
@@ -1,27 +1,39 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
- import React, { useCallback } from 'react';
3
+ import React, { useCallback, useEffect, useRef } from 'react';
4
4
  import clsx from 'clsx';
5
- import FocusLock from 'react-focus-lock';
6
5
  import { KeyCode } from '../internal/keycode';
7
6
  import { useUniqueId } from '../internal/hooks/use-unique-id';
8
7
  import { InternalButton } from '../button/internal';
8
+ import FocusLock from '../internal/components/focus-lock';
9
9
  import styles from './styles.css.js';
10
10
  export default function PopoverBody(_a) {
11
11
  var _b, _c;
12
- var showDismissButton = _a.dismissButton, dismissAriaLabel = _a.dismissAriaLabel, header = _a.header, children = _a.children, onDismiss = _a.onDismiss, variant = _a.variant, _d = _a.returnFocus, returnFocus = _d === void 0 ? true : _d, overflowVisible = _a.overflowVisible, dismissButtonRef = _a.dismissButtonRef, className = _a.className;
12
+ var showDismissButton = _a.dismissButton, dismissAriaLabel = _a.dismissAriaLabel, header = _a.header, children = _a.children, onDismiss = _a.onDismiss, variant = _a.variant, overflowVisible = _a.overflowVisible, className = _a.className;
13
13
  var labelledById = useUniqueId('awsui-popover-');
14
+ var dismissButtonFocused = useRef(false);
15
+ var dismissButtonRef = useRef(null);
14
16
  var onKeyDown = useCallback(function (event) {
15
17
  if (event.keyCode === KeyCode.escape) {
16
18
  onDismiss();
17
19
  }
18
20
  }, [onDismiss]);
21
+ // Implement our own auto-focus rather than using FocusLock's,
22
+ // because we also want to focus the dismiss button when it
23
+ // is added dyamically (e.g. in chart popovers)
24
+ useEffect(function () {
25
+ var _a;
26
+ if (showDismissButton && !dismissButtonFocused.current) {
27
+ (_a = dismissButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
28
+ }
29
+ dismissButtonFocused.current = showDismissButton;
30
+ }, [showDismissButton]);
19
31
  var dismissButton = (showDismissButton !== null && showDismissButton !== void 0 ? showDismissButton : null) && (React.createElement("div", { className: styles.dismiss },
20
32
  React.createElement(InternalButton, { variant: "icon", formAction: "none", iconName: "close", className: styles['dismiss-control'], ariaLabel: dismissAriaLabel, onClick: function () { return onDismiss(); }, ref: dismissButtonRef })));
21
33
  return (React.createElement("div", { className: clsx(styles.body, className, (_b = {},
22
34
  _b[styles['body-overflow-visible']] = overflowVisible === 'both',
23
35
  _b)), role: header ? 'dialog' : undefined, onKeyDown: onKeyDown, "aria-modal": showDismissButton && variant !== 'annotation' ? true : undefined, "aria-labelledby": header ? labelledById : undefined },
24
- React.createElement(FocusLock, { disabled: variant === 'annotation' || !showDismissButton, autoFocus: true, returnFocus: returnFocus },
36
+ React.createElement(FocusLock, { disabled: variant === 'annotation' || !showDismissButton, autoFocus: false },
25
37
  header && (React.createElement("div", { className: clsx(styles['header-row'], showDismissButton && styles['has-dismiss']) },
26
38
  dismissButton,
27
39
  React.createElement("div", { className: styles.header, id: labelledById },
@@ -1 +1 @@
1
- {"version":3,"file":"body.js","sourceRoot":"","sources":["../../../src/popover/body.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback } from 'react';\nimport clsx from 'clsx';\nimport FocusLock from 'react-focus-lock';\n\nimport { KeyCode } from '../internal/keycode';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\n\nimport styles from './styles.css.js';\n\nexport interface PopoverBodyProps {\n dismissButton: boolean;\n dismissAriaLabel: string | undefined;\n onDismiss: () => void;\n\n header: React.ReactNode | undefined;\n children: React.ReactNode;\n variant?: 'annotation';\n returnFocus?: boolean;\n overflowVisible?: 'content' | 'both';\n\n dismissButtonRef?: React.Ref<ButtonProps.Ref>;\n\n className?: string;\n}\n\nexport default function PopoverBody({\n dismissButton: showDismissButton,\n dismissAriaLabel,\n header,\n children,\n onDismiss,\n variant,\n returnFocus = true,\n overflowVisible,\n dismissButtonRef,\n className,\n}: PopoverBodyProps) {\n const labelledById = useUniqueId('awsui-popover-');\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n onDismiss();\n }\n },\n [onDismiss]\n );\n\n const dismissButton = (showDismissButton ?? null) && (\n <div className={styles.dismiss}>\n <InternalButton\n variant=\"icon\"\n formAction=\"none\"\n iconName=\"close\"\n className={styles['dismiss-control']}\n ariaLabel={dismissAriaLabel}\n onClick={() => onDismiss()}\n ref={dismissButtonRef}\n />\n </div>\n );\n\n return (\n <div\n className={clsx(styles.body, className, {\n [styles['body-overflow-visible']]: overflowVisible === 'both',\n })}\n role={header ? 'dialog' : undefined}\n onKeyDown={onKeyDown}\n aria-modal={showDismissButton && variant !== 'annotation' ? true : undefined}\n aria-labelledby={header ? labelledById : undefined}\n >\n <FocusLock disabled={variant === 'annotation' || !showDismissButton} autoFocus={true} returnFocus={returnFocus}>\n {header && (\n <div className={clsx(styles['header-row'], showDismissButton && styles['has-dismiss'])}>\n {dismissButton}\n <div className={styles.header} id={labelledById}>\n <h2>{header}</h2>\n </div>\n </div>\n )}\n <div className={!header && showDismissButton ? styles['has-dismiss'] : undefined}>\n {!header && dismissButton}\n <div className={clsx(styles.content, { [styles['content-overflow-visible']]: !!overflowVisible })}>\n {children}\n </div>\n </div>\n </FocusLock>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"body.js","sourceRoot":"","sources":["../../../src/popover/body.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { KeyCode } from '../internal/keycode';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport FocusLock from '../internal/components/focus-lock';\n\nimport styles from './styles.css.js';\n\nexport interface PopoverBodyProps {\n dismissButton: boolean;\n dismissAriaLabel: string | undefined;\n onDismiss: () => void;\n\n header: React.ReactNode | undefined;\n children: React.ReactNode;\n variant?: 'annotation';\n overflowVisible?: 'content' | 'both';\n\n className?: string;\n}\n\nexport default function PopoverBody({\n dismissButton: showDismissButton,\n dismissAriaLabel,\n header,\n children,\n onDismiss,\n variant,\n overflowVisible,\n className,\n}: PopoverBodyProps) {\n const labelledById = useUniqueId('awsui-popover-');\n const dismissButtonFocused = useRef(false);\n const dismissButtonRef = useRef<ButtonProps.Ref>(null);\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n onDismiss();\n }\n },\n [onDismiss]\n );\n\n // Implement our own auto-focus rather than using FocusLock's,\n // because we also want to focus the dismiss button when it\n // is added dyamically (e.g. in chart popovers)\n useEffect(() => {\n if (showDismissButton && !dismissButtonFocused.current) {\n dismissButtonRef.current?.focus({ preventScroll: true });\n }\n dismissButtonFocused.current = showDismissButton;\n }, [showDismissButton]);\n\n const dismissButton = (showDismissButton ?? null) && (\n <div className={styles.dismiss}>\n <InternalButton\n variant=\"icon\"\n formAction=\"none\"\n iconName=\"close\"\n className={styles['dismiss-control']}\n ariaLabel={dismissAriaLabel}\n onClick={() => onDismiss()}\n ref={dismissButtonRef}\n />\n </div>\n );\n\n return (\n <div\n className={clsx(styles.body, className, {\n [styles['body-overflow-visible']]: overflowVisible === 'both',\n })}\n role={header ? 'dialog' : undefined}\n onKeyDown={onKeyDown}\n aria-modal={showDismissButton && variant !== 'annotation' ? true : undefined}\n aria-labelledby={header ? labelledById : undefined}\n >\n <FocusLock disabled={variant === 'annotation' || !showDismissButton} autoFocus={false}>\n {header && (\n <div className={clsx(styles['header-row'], showDismissButton && styles['has-dismiss'])}>\n {dismissButton}\n <div className={styles.header} id={labelledById}>\n <h2>{header}</h2>\n </div>\n </div>\n )}\n <div className={!header && showDismissButton ? styles['has-dismiss'] : undefined}>\n {!header && dismissButton}\n <div className={clsx(styles.content, { [styles['content-overflow-visible']]: !!overflowVisible })}>\n {children}\n </div>\n </div>\n </FocusLock>\n </div>\n );\n}\n"]}
@@ -23,13 +23,18 @@ function InternalPopover(_a, ref) {
23
23
  var popoverRef = useRef(null);
24
24
  var clickFrameId = useRef(null);
25
25
  var _j = useState(false), visible = _j[0], setVisible = _j[1];
26
+ var focusTrigger = useCallback(function () {
27
+ var _a;
28
+ (_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
29
+ }, []);
26
30
  var onTriggerClick = useCallback(function () {
27
31
  fireNonCancelableEvent(__onOpen);
28
32
  setVisible(true);
29
33
  }, [__onOpen]);
30
34
  var onDismiss = useCallback(function () {
31
35
  setVisible(false);
32
- }, []);
36
+ focusTrigger();
37
+ }, [focusTrigger]);
33
38
  var onTriggerKeyDown = useCallback(function (event) {
34
39
  if (event.keyCode === KeyCode.tab || event.keyCode === KeyCode.escape) {
35
40
  setVisible(false);
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/popover/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useRef, useState, useImperativeHandle } from 'react';\nimport clsx from 'clsx';\n\nimport { KeyCode } from '../internal/keycode';\nimport { getBaseProps } from '../internal/base-component';\nimport useFocusVisible from '../internal/hooks/focus-visible';\n\nimport Arrow from './arrow';\nimport Portal from '../internal/components/portal';\nimport { PopoverProps } from './interfaces';\nimport PopoverContainer from './container';\nimport PopoverBody from './body';\n\nimport styles from './styles.css.js';\nimport { NonCancelableEventHandler, fireNonCancelableEvent } from '../internal/events/index';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { usePortalModeClasses } from '../internal/hooks/use-portal-mode-classes';\n\nexport interface InternalPopoverProps extends PopoverProps, InternalBaseComponentProps {\n __onOpen?: NonCancelableEventHandler<null>;\n}\n\nexport interface InternalPopoverRef {\n dismissPopover: () => void;\n}\n\nexport default React.forwardRef(InternalPopover);\n\nfunction InternalPopover(\n {\n position = 'right',\n size = 'medium',\n fixedWidth = false,\n triggerType = 'text',\n dismissButton = true,\n dismissAriaLabel,\n\n children,\n header,\n content,\n\n renderWithPortal = false,\n\n __onOpen,\n __internalRootRef = null,\n ...restProps\n }: InternalPopoverProps,\n ref: React.Ref<InternalPopoverRef>\n) {\n const baseProps = getBaseProps(restProps);\n const focusVisible = useFocusVisible();\n const triggerRef = useRef<HTMLElement | null>(null);\n const popoverRef = useRef<HTMLDivElement | null>(null);\n const clickFrameId = useRef<number | null>(null);\n\n const [visible, setVisible] = useState(false);\n\n const onTriggerClick = useCallback(() => {\n fireNonCancelableEvent(__onOpen);\n setVisible(true);\n }, [__onOpen]);\n\n const onDismiss = useCallback(() => {\n setVisible(false);\n }, []);\n\n const onTriggerKeyDown = useCallback((event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.tab || event.keyCode === KeyCode.escape) {\n setVisible(false);\n }\n }, []);\n\n useImperativeHandle(ref, () => ({\n dismissPopover: onDismiss,\n }));\n\n useEffect(() => {\n if (!triggerRef.current) {\n return;\n }\n const document = triggerRef.current.ownerDocument;\n\n const onDocumentClick = () => {\n // Dismiss popover unless there was a click inside within the last animation frame.\n if (clickFrameId.current === null) {\n setVisible(false);\n }\n };\n\n // useCapture=false makes sure this listener is called after the one attached to the element.\n // the options.capture notation is unsupported by IE.\n document.addEventListener('mousedown', onDocumentClick, false);\n\n return () => {\n document.removeEventListener('mousedown', onDocumentClick, false);\n };\n }, []);\n\n const popoverClasses = usePortalModeClasses(triggerRef);\n\n const triggerProps = {\n // https://github.com/microsoft/TypeScript/issues/36659\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref: triggerRef as any,\n onClick: onTriggerClick,\n onKeyDown: onTriggerKeyDown,\n className: clsx(styles.trigger, styles[`trigger-type-${triggerType}`]),\n };\n\n const popoverContent = (\n <div\n aria-live={dismissButton ? undefined : 'polite'}\n aria-atomic={dismissButton ? undefined : true}\n className={clsx(popoverClasses, styles['popover-content'])}\n >\n {visible && (\n <PopoverContainer\n size={size}\n fixedWidth={fixedWidth}\n position={position}\n trackRef={triggerRef}\n arrow={position => <Arrow position={position} />}\n renderWithPortal={renderWithPortal}\n zIndex={renderWithPortal ? 7000 : undefined}\n >\n <PopoverBody\n dismissButton={dismissButton}\n dismissAriaLabel={dismissAriaLabel}\n header={header}\n onDismiss={onDismiss}\n overflowVisible=\"both\"\n >\n {content}\n </PopoverBody>\n </PopoverContainer>\n )}\n </div>\n );\n\n const mergedRef = useMergeRefs(popoverRef, __internalRootRef);\n\n return (\n <div\n {...baseProps}\n className={clsx(styles.root, baseProps.className)}\n ref={mergedRef}\n onMouseDown={() => {\n // Indicate there was a click inside popover recently, including nested portals.\n clickFrameId.current = requestAnimationFrame(() => {\n clickFrameId.current = null;\n });\n }}\n >\n {triggerType === 'text' ? (\n <button {...triggerProps} type=\"button\" aria-haspopup=\"dialog\" {...focusVisible}>\n <span className={styles['trigger-inner-text']}>{children}</span>\n </button>\n ) : (\n <span {...triggerProps}>{children}</span>\n )}\n {renderWithPortal ? <Portal>{popoverContent}</Portal> : popoverContent}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/popover/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useRef, useState, useImperativeHandle } from 'react';\nimport clsx from 'clsx';\n\nimport { KeyCode } from '../internal/keycode';\nimport { getBaseProps } from '../internal/base-component';\nimport useFocusVisible from '../internal/hooks/focus-visible';\n\nimport Arrow from './arrow';\nimport Portal from '../internal/components/portal';\nimport { PopoverProps } from './interfaces';\nimport PopoverContainer from './container';\nimport PopoverBody from './body';\n\nimport styles from './styles.css.js';\nimport { NonCancelableEventHandler, fireNonCancelableEvent } from '../internal/events/index';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { usePortalModeClasses } from '../internal/hooks/use-portal-mode-classes';\n\nexport interface InternalPopoverProps extends PopoverProps, InternalBaseComponentProps {\n __onOpen?: NonCancelableEventHandler<null>;\n}\n\nexport interface InternalPopoverRef {\n dismissPopover: () => void;\n}\n\nexport default React.forwardRef(InternalPopover);\n\nfunction InternalPopover(\n {\n position = 'right',\n size = 'medium',\n fixedWidth = false,\n triggerType = 'text',\n dismissButton = true,\n dismissAriaLabel,\n\n children,\n header,\n content,\n\n renderWithPortal = false,\n\n __onOpen,\n __internalRootRef = null,\n ...restProps\n }: InternalPopoverProps,\n ref: React.Ref<InternalPopoverRef>\n) {\n const baseProps = getBaseProps(restProps);\n const focusVisible = useFocusVisible();\n const triggerRef = useRef<HTMLElement | null>(null);\n const popoverRef = useRef<HTMLDivElement | null>(null);\n const clickFrameId = useRef<number | null>(null);\n\n const [visible, setVisible] = useState(false);\n\n const focusTrigger = useCallback(() => {\n triggerRef.current?.focus();\n }, []);\n\n const onTriggerClick = useCallback(() => {\n fireNonCancelableEvent(__onOpen);\n setVisible(true);\n }, [__onOpen]);\n\n const onDismiss = useCallback(() => {\n setVisible(false);\n focusTrigger();\n }, [focusTrigger]);\n\n const onTriggerKeyDown = useCallback((event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.tab || event.keyCode === KeyCode.escape) {\n setVisible(false);\n }\n }, []);\n\n useImperativeHandle(ref, () => ({\n dismissPopover: onDismiss,\n }));\n\n useEffect(() => {\n if (!triggerRef.current) {\n return;\n }\n const document = triggerRef.current.ownerDocument;\n\n const onDocumentClick = () => {\n // Dismiss popover unless there was a click inside within the last animation frame.\n if (clickFrameId.current === null) {\n setVisible(false);\n }\n };\n\n // useCapture=false makes sure this listener is called after the one attached to the element.\n // the options.capture notation is unsupported by IE.\n document.addEventListener('mousedown', onDocumentClick, false);\n\n return () => {\n document.removeEventListener('mousedown', onDocumentClick, false);\n };\n }, []);\n\n const popoverClasses = usePortalModeClasses(triggerRef);\n\n const triggerProps = {\n // https://github.com/microsoft/TypeScript/issues/36659\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref: triggerRef as any,\n onClick: onTriggerClick,\n onKeyDown: onTriggerKeyDown,\n className: clsx(styles.trigger, styles[`trigger-type-${triggerType}`]),\n };\n\n const popoverContent = (\n <div\n aria-live={dismissButton ? undefined : 'polite'}\n aria-atomic={dismissButton ? undefined : true}\n className={clsx(popoverClasses, styles['popover-content'])}\n >\n {visible && (\n <PopoverContainer\n size={size}\n fixedWidth={fixedWidth}\n position={position}\n trackRef={triggerRef}\n arrow={position => <Arrow position={position} />}\n renderWithPortal={renderWithPortal}\n zIndex={renderWithPortal ? 7000 : undefined}\n >\n <PopoverBody\n dismissButton={dismissButton}\n dismissAriaLabel={dismissAriaLabel}\n header={header}\n onDismiss={onDismiss}\n overflowVisible=\"both\"\n >\n {content}\n </PopoverBody>\n </PopoverContainer>\n )}\n </div>\n );\n\n const mergedRef = useMergeRefs(popoverRef, __internalRootRef);\n\n return (\n <div\n {...baseProps}\n className={clsx(styles.root, baseProps.className)}\n ref={mergedRef}\n onMouseDown={() => {\n // Indicate there was a click inside popover recently, including nested portals.\n clickFrameId.current = requestAnimationFrame(() => {\n clickFrameId.current = null;\n });\n }}\n >\n {triggerType === 'text' ? (\n <button {...triggerProps} type=\"button\" aria-haspopup=\"dialog\" {...focusVisible}>\n <span className={styles['trigger-inner-text']}>{children}</span>\n </button>\n ) : (\n <span {...triggerProps}>{children}</span>\n )}\n {renderWithPortal ? <Portal>{popoverContent}</Portal> : popoverContent}\n </div>\n );\n}\n"]}
@@ -9,12 +9,15 @@ interface TableHeaderCellProps {
9
9
  sortingDescending: boolean | undefined;
10
10
  sortingDisabled: boolean | undefined;
11
11
  wrapLines: boolean | undefined;
12
- resizer: React.ReactNode;
13
12
  showFocusRing: boolean;
14
13
  onClick(detail: TableProps.SortingState<any>): void;
14
+ onResizeFinish: () => void;
15
+ colIndex: number;
16
+ updateColumn: (colIndex: number, newWidth: number) => void;
15
17
  onFocus?: () => void;
16
18
  onBlur?: () => void;
19
+ resizableColumns?: boolean;
17
20
  }
18
- export declare function TableHeaderCell({ className, style, tabIndex, column, activeSortingColumn, sortingDescending, sortingDisabled, wrapLines, resizer, showFocusRing, onClick, onFocus, onBlur, }: TableHeaderCellProps): JSX.Element;
21
+ export declare function TableHeaderCell({ className, style, tabIndex, column, activeSortingColumn, sortingDescending, sortingDisabled, wrapLines, showFocusRing, onClick, colIndex, onFocus, onBlur, updateColumn, resizableColumns, onResizeFinish, }: TableHeaderCellProps): JSX.Element;
19
22
  export {};
20
23
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/table/header-cell/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAI3C,UAAU,oBAAoB;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACzC,mBAAmB,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;IAC/D,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,aAAa,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACpD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,SAAS,EACT,OAAO,EACP,aAAa,EACb,OAAO,EACP,OAAO,EACP,MAAM,GACP,EAAE,oBAAoB,eAyEtB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/table/header-cell/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAM3C,UAAU,oBAAoB;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACzC,mBAAmB,EAAE,UAAU,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC;IAC/D,iBAAiB,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,eAAe,EAAE,OAAO,GAAG,SAAS,CAAC;IACrC,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,aAAa,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACpD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,SAAS,EACT,aAAa,EACb,OAAO,EACP,QAAQ,EACR,OAAO,EACP,MAAM,EACN,YAAY,EACZ,gBAAgB,EAChB,cAAc,GACf,EAAE,oBAAoB,eAoFtB"}
@@ -8,9 +8,11 @@ import useFocusVisible from '../../internal/hooks/focus-visible';
8
8
  import { KeyCode } from '../../internal/keycode';
9
9
  import { getAriaSort, getSortingIconName, getSortingStatus, isSorted } from './utils';
10
10
  import styles from './styles.css.js';
11
+ import { Resizer } from '../resizer';
12
+ import { useUniqueId } from '../../internal/hooks/use-unique-id';
11
13
  export function TableHeaderCell(_a) {
12
14
  var _b, _c, _d;
13
- var className = _a.className, style = _a.style, tabIndex = _a.tabIndex, column = _a.column, activeSortingColumn = _a.activeSortingColumn, sortingDescending = _a.sortingDescending, sortingDisabled = _a.sortingDisabled, wrapLines = _a.wrapLines, resizer = _a.resizer, showFocusRing = _a.showFocusRing, onClick = _a.onClick, onFocus = _a.onFocus, onBlur = _a.onBlur;
15
+ var className = _a.className, style = _a.style, tabIndex = _a.tabIndex, column = _a.column, activeSortingColumn = _a.activeSortingColumn, sortingDescending = _a.sortingDescending, sortingDisabled = _a.sortingDisabled, wrapLines = _a.wrapLines, showFocusRing = _a.showFocusRing, onClick = _a.onClick, colIndex = _a.colIndex, onFocus = _a.onFocus, onBlur = _a.onBlur, updateColumn = _a.updateColumn, resizableColumns = _a.resizableColumns, onResizeFinish = _a.onResizeFinish;
14
16
  var focusVisible = useFocusVisible();
15
17
  var sortable = !!column.sortingComparator || !!column.sortingField;
16
18
  var sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);
@@ -32,8 +34,9 @@ export function TableHeaderCell(_a) {
32
34
  handleClick();
33
35
  }
34
36
  };
37
+ var headerId = useUniqueId('table-header-');
35
38
  return (React.createElement("th", { className: clsx(className, (_b = {},
36
- _b[styles['header-cell-resizable']] = !!resizer,
39
+ _b[styles['header-cell-resizable']] = !!resizableColumns,
37
40
  _b[styles['header-cell-sortable']] = sortingStatus,
38
41
  _b[styles['header-cell-sorted']] = sortingStatus === 'ascending' || sortingStatus === 'descending',
39
42
  _b[styles['header-cell-disabled']] = sortingDisabled,
@@ -50,9 +53,10 @@ export function TableHeaderCell(_a) {
50
53
  })
51
54
  : undefined }, (sortingDisabled || !sortingStatus
52
55
  ? (_d = {}, _d['aria-disabled'] = 'true', _d) : __assign(__assign({ onKeyPress: handleKeyPress, tabIndex: tabIndex, role: 'button' }, focusVisible), { onClick: handleClick, onFocus: onFocus, onBlur: onBlur }))),
53
- React.createElement("div", { className: clsx(styles['header-cell-text'], wrapLines && styles['header-cell-text-wrap']) }, column.header),
56
+ React.createElement("div", { className: clsx(styles['header-cell-text'], wrapLines && styles['header-cell-text-wrap']), id: headerId }, column.header),
54
57
  sortingStatus && (React.createElement("span", { className: styles['sorting-icon'] },
55
58
  React.createElement(InternalIcon, { name: getSortingIconName(sortingStatus) })))),
56
- resizer));
59
+ resizableColumns && (React.createElement(React.Fragment, null,
60
+ React.createElement(Resizer, { onDragMove: function (newWidth) { return updateColumn(colIndex, newWidth); }, onFinish: onResizeFinish, ariaLabelledby: headerId, minWidth: typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth })))));
57
61
  }
58
62
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/table/header-cell/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport InternalIcon from '../../icon/internal';\nimport useFocusVisible from '../../internal/hooks/focus-visible';\nimport { KeyCode } from '../../internal/keycode';\nimport { TableProps } from '../interfaces';\nimport { getAriaSort, getSortingIconName, getSortingStatus, isSorted } from './utils';\nimport styles from './styles.css.js';\n\ninterface TableHeaderCellProps {\n className?: string;\n style?: React.CSSProperties;\n tabIndex: number;\n column: TableProps.ColumnDefinition<any>;\n activeSortingColumn: TableProps.SortingColumn<any> | undefined;\n sortingDescending: boolean | undefined;\n sortingDisabled: boolean | undefined;\n wrapLines: boolean | undefined;\n resizer: React.ReactNode;\n showFocusRing: boolean;\n onClick(detail: TableProps.SortingState<any>): void;\n onFocus?: () => void;\n onBlur?: () => void;\n}\n\nexport function TableHeaderCell({\n className,\n style,\n tabIndex,\n column,\n activeSortingColumn,\n sortingDescending,\n sortingDisabled,\n wrapLines,\n resizer,\n showFocusRing,\n onClick,\n onFocus,\n onBlur,\n}: TableHeaderCellProps) {\n const focusVisible = useFocusVisible();\n const sortable = !!column.sortingComparator || !!column.sortingField;\n const sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);\n const sortingStatus = getSortingStatus(sortable, sorted, !!sortingDescending, !!sortingDisabled);\n const handleClick = () =>\n onClick({\n sortingColumn: column,\n isDescending: sorted ? !sortingDescending : false,\n });\n\n // Elements with role=\"button\" do not have the default behavior of <button>, where pressing\n // Enter or Space will trigger a click event. Therefore we need to add this ourselves.\n // The native <button> element cannot be used due to a misaligned implementation in Firefox:\n // https://bugzilla.mozilla.org/show_bug.cgi?id=843003\n const handleKeyPress = ({ nativeEvent: e }: React.KeyboardEvent) => {\n if (e.keyCode === KeyCode.enter || e.keyCode === KeyCode.space) {\n e.preventDefault();\n handleClick();\n }\n };\n\n return (\n <th\n className={clsx(className, {\n [styles['header-cell-resizable']]: !!resizer,\n [styles['header-cell-sortable']]: sortingStatus,\n [styles['header-cell-sorted']]: sortingStatus === 'ascending' || sortingStatus === 'descending',\n [styles['header-cell-disabled']]: sortingDisabled,\n [styles['header-cell-ascending']]: sortingStatus === 'ascending',\n [styles['header-cell-descending']]: sortingStatus === 'descending',\n })}\n aria-sort={sortingStatus && getAriaSort(sortingStatus)}\n style={style}\n scope=\"col\"\n >\n <div\n className={clsx(styles['header-cell-content'], {\n [styles['header-cell-fake-focus']]: showFocusRing && focusVisible['data-awsui-focus-visible'],\n })}\n aria-label={\n column.ariaLabel\n ? column.ariaLabel({\n sorted: sorted,\n descending: sorted && !!sortingDescending,\n disabled: !!sortingDisabled,\n })\n : undefined\n }\n {...(sortingDisabled || !sortingStatus\n ? { ['aria-disabled']: 'true' }\n : {\n onKeyPress: handleKeyPress,\n tabIndex: tabIndex,\n role: 'button',\n ...focusVisible,\n onClick: handleClick,\n onFocus,\n onBlur,\n })}\n >\n <div className={clsx(styles['header-cell-text'], wrapLines && styles['header-cell-text-wrap'])}>\n {column.header}\n </div>\n {sortingStatus && (\n <span className={styles['sorting-icon']}>\n <InternalIcon name={getSortingIconName(sortingStatus)} />\n </span>\n )}\n </div>\n {resizer}\n </th>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/table/header-cell/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport InternalIcon from '../../icon/internal';\nimport useFocusVisible from '../../internal/hooks/focus-visible';\nimport { KeyCode } from '../../internal/keycode';\nimport { TableProps } from '../interfaces';\nimport { getAriaSort, getSortingIconName, getSortingStatus, isSorted } from './utils';\nimport styles from './styles.css.js';\nimport { Resizer } from '../resizer';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\n\ninterface TableHeaderCellProps {\n className?: string;\n style?: React.CSSProperties;\n tabIndex: number;\n column: TableProps.ColumnDefinition<any>;\n activeSortingColumn: TableProps.SortingColumn<any> | undefined;\n sortingDescending: boolean | undefined;\n sortingDisabled: boolean | undefined;\n wrapLines: boolean | undefined;\n showFocusRing: boolean;\n onClick(detail: TableProps.SortingState<any>): void;\n onResizeFinish: () => void;\n colIndex: number;\n updateColumn: (colIndex: number, newWidth: number) => void;\n onFocus?: () => void;\n onBlur?: () => void;\n resizableColumns?: boolean;\n}\n\nexport function TableHeaderCell({\n className,\n style,\n tabIndex,\n column,\n activeSortingColumn,\n sortingDescending,\n sortingDisabled,\n wrapLines,\n showFocusRing,\n onClick,\n colIndex,\n onFocus,\n onBlur,\n updateColumn,\n resizableColumns,\n onResizeFinish,\n}: TableHeaderCellProps) {\n const focusVisible = useFocusVisible();\n const sortable = !!column.sortingComparator || !!column.sortingField;\n const sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);\n const sortingStatus = getSortingStatus(sortable, sorted, !!sortingDescending, !!sortingDisabled);\n const handleClick = () =>\n onClick({\n sortingColumn: column,\n isDescending: sorted ? !sortingDescending : false,\n });\n\n // Elements with role=\"button\" do not have the default behavior of <button>, where pressing\n // Enter or Space will trigger a click event. Therefore we need to add this ourselves.\n // The native <button> element cannot be used due to a misaligned implementation in Firefox:\n // https://bugzilla.mozilla.org/show_bug.cgi?id=843003\n const handleKeyPress = ({ nativeEvent: e }: React.KeyboardEvent) => {\n if (e.keyCode === KeyCode.enter || e.keyCode === KeyCode.space) {\n e.preventDefault();\n handleClick();\n }\n };\n\n const headerId = useUniqueId('table-header-');\n\n return (\n <th\n className={clsx(className, {\n [styles['header-cell-resizable']]: !!resizableColumns,\n [styles['header-cell-sortable']]: sortingStatus,\n [styles['header-cell-sorted']]: sortingStatus === 'ascending' || sortingStatus === 'descending',\n [styles['header-cell-disabled']]: sortingDisabled,\n [styles['header-cell-ascending']]: sortingStatus === 'ascending',\n [styles['header-cell-descending']]: sortingStatus === 'descending',\n })}\n aria-sort={sortingStatus && getAriaSort(sortingStatus)}\n style={style}\n scope=\"col\"\n >\n <div\n className={clsx(styles['header-cell-content'], {\n [styles['header-cell-fake-focus']]: showFocusRing && focusVisible['data-awsui-focus-visible'],\n })}\n aria-label={\n column.ariaLabel\n ? column.ariaLabel({\n sorted: sorted,\n descending: sorted && !!sortingDescending,\n disabled: !!sortingDisabled,\n })\n : undefined\n }\n {...(sortingDisabled || !sortingStatus\n ? { ['aria-disabled']: 'true' }\n : {\n onKeyPress: handleKeyPress,\n tabIndex: tabIndex,\n role: 'button',\n ...focusVisible,\n onClick: handleClick,\n onFocus,\n onBlur,\n })}\n >\n <div className={clsx(styles['header-cell-text'], wrapLines && styles['header-cell-text-wrap'])} id={headerId}>\n {column.header}\n </div>\n {sortingStatus && (\n <span className={styles['sorting-icon']}>\n <InternalIcon name={getSortingIconName(sortingStatus)} />\n </span>\n )}\n </div>\n {resizableColumns && (\n <>\n <Resizer\n onDragMove={newWidth => updateColumn(colIndex, newWidth)}\n onFinish={onResizeFinish}\n ariaLabelledby={headerId}\n minWidth={typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth}\n />\n </>\n )}\n </th>\n );\n}\n"]}
@@ -1,8 +1,10 @@
1
1
  interface ResizerProps {
2
2
  onDragMove: (newWidth: number) => void;
3
3
  onFinish: () => void;
4
+ ariaLabelledby?: string;
5
+ minWidth?: number;
4
6
  }
5
- export declare function Resizer({ onDragMove, onFinish }: ResizerProps): JSX.Element;
7
+ export declare function Resizer({ onDragMove, onFinish, ariaLabelledby, minWidth }: ResizerProps): JSX.Element;
6
8
  export declare function ResizeTracker(): JSX.Element;
7
9
  export {};
8
10
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/table/resizer/index.tsx"],"names":[],"mappings":"AAUA,UAAU,YAAY;IACpB,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAMD,wBAAgB,OAAO,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,YAAY,eAuF7D;AAED,wBAAgB,aAAa,gBAE5B"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/table/resizer/index.tsx"],"names":[],"mappings":"AAYA,UAAU,YAAY;IACpB,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAMD,wBAAgB,OAAO,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAwB,EAAE,EAAE,YAAY,eAoIvG;AAED,wBAAgB,aAAa,gBAE5B"}