@cloudscape-design/components 3.0.696 → 3.0.697

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.
@@ -22,7 +22,7 @@ export default function FlexibleColumnLayout({ columns = 1, minColumnWidth = 0,
22
22
  // Flattening the children allows us to "see through" React Fragments and nested arrays.
23
23
  const flattenedChildren = flattenChildren(children);
24
24
  const Tag = (__tagOverride !== null && __tagOverride !== void 0 ? __tagOverride : 'div');
25
- return (React.createElement(Tag, { ref: containerRef, className: clsx(styles['css-grid'], styles[`grid-variant-${variant}`], shouldDisableGutters && [styles['grid-no-gutters']]), style: { gridTemplateColumns: `repeat(${columnCount}, 1fr)` } }, flattenedChildren.map((child, i) => {
25
+ return (React.createElement(Tag, { ref: containerRef, className: clsx(styles['css-grid'], styles[`grid-variant-${variant}`], shouldDisableGutters && [styles['grid-no-gutters']]), style: { gridTemplateColumns: `repeat(${columnCount}, minmax(0, 1fr))` } }, flattenedChildren.map((child, i) => {
26
26
  // If this react child is a primitive value, the key will be undefined
27
27
  const key = child.key;
28
28
  return (React.createElement("div", { key: key ? String(key) : undefined, className: clsx(styles.item, {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/column-layout/flexible-column-layout/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,eAAe,MAAM,8BAA8B,CAAC;AAC3D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAIzE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,KAAK,GAAG,CAAC,KAAa,EAAW,EAAE,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC;AAE1D,MAAM,UAAU,wBAAwB,CACtC,OAAe,EACf,cAAsB,EACtB,cAA6B;IAE7B,IAAI,CAAC,cAAc,EAAE;QACnB,OAAO,OAAO,CAAC;KAChB;IAED,yGAAyG;IACzG,MAAM,iBAAiB,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,GAAG,cAAc,CAAC,CAAC,CAAC;IAEzF,sGAAsG;IACtG,OAAO,IAAI,CAAC,GAAG,CACb,CAAC,EACD,iBAAiB,GAAG,OAAO,IAAI,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,iBAAiB,GAAG,CAAC,CAAC,CAAC,CAAC,iBAAiB,CACpG,CAAC;AACJ,CAAC;AAUD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,OAAO,GAAG,CAAC,EACX,cAAc,GAAG,CAAC,EAClB,cAAc,EACd,OAAO,EACP,QAAQ,EACR,aAAa,GACa;IAC1B,MAAM,CAAC,cAAc,EAAE,YAAY,CAAC,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IAEvF,MAAM,WAAW,GAAG,wBAAwB,CAAC,OAAO,EAAE,cAAc,EAAE,cAAc,CAAC,CAAC;IACtF,MAAM,oBAAoB,GAAG,OAAO,KAAK,WAAW,IAAI,cAAc,CAAC;IAEvE,wFAAwF;IACxF,MAAM,iBAAiB,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACpD,MAAM,GAAG,GAAG,CAAC,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,KAAK,CAAU,CAAC;IAE9C,OAAO,CACL,oBAAC,GAAG,IACF,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,UAAU,CAAC,EAClB,MAAM,CAAC,gBAAgB,OAAO,EAAE,CAAC,EACjC,oBAAoB,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,CACpD,EACD,KAAK,EAAE,EAAE,mBAAmB,EAAE,UAAU,WAAW,QAAQ,EAAE,IAE5D,iBAAiB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;QAClC,sEAAsE;QACtE,MAAM,GAAG,GAAI,KAAgC,CAAC,GAAG,CAAC;QAElD,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,EAClC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;gBAC3B,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,GAAG,WAAW,KAAK,CAAC;aAChD,CAAC,IAED,KAAK,CACF,CACP,CAAC;IACJ,CAAC,CAAC,CACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport flattenChildren from 'react-keyed-flatten-children';\nimport clsx from 'clsx';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\nimport { InternalColumnLayoutProps } from '../interfaces';\n\nimport styles from './styles.css.js';\n\nconst isOdd = (value: number): boolean => value % 2 !== 0;\n\nexport function calculcateCssColumnCount(\n columns: number,\n minColumnWidth: number,\n containerWidth: number | null\n): number {\n if (!containerWidth) {\n return columns;\n }\n\n // First, calculate how many columns we can have based on the current container width and minColumnWidth.\n const targetColumnCount = Math.min(columns, Math.floor(containerWidth / minColumnWidth));\n\n // When we start wrapping into fewer columns than desired, we want to keep the number of columns even.\n return Math.max(\n 1,\n targetColumnCount < columns && isOdd(targetColumnCount) ? targetColumnCount - 1 : targetColumnCount\n );\n}\n\ninterface FlexibleColumnLayoutProps\n extends Pick<\n InternalColumnLayoutProps,\n 'minColumnWidth' | 'columns' | 'variant' | 'borders' | 'disableGutters' | '__tagOverride'\n > {\n children: React.ReactNode;\n}\n\nexport default function FlexibleColumnLayout({\n columns = 1,\n minColumnWidth = 0,\n disableGutters,\n variant,\n children,\n __tagOverride,\n}: FlexibleColumnLayoutProps) {\n const [containerWidth, containerRef] = useContainerQuery(rect => rect.contentBoxWidth);\n\n const columnCount = calculcateCssColumnCount(columns, minColumnWidth, containerWidth);\n const shouldDisableGutters = variant !== 'text-grid' && disableGutters;\n\n // Flattening the children allows us to \"see through\" React Fragments and nested arrays.\n const flattenedChildren = flattenChildren(children);\n const Tag = (__tagOverride ?? 'div') as 'div';\n\n return (\n <Tag\n ref={containerRef}\n className={clsx(\n styles['css-grid'],\n styles[`grid-variant-${variant}`],\n shouldDisableGutters && [styles['grid-no-gutters']]\n )}\n style={{ gridTemplateColumns: `repeat(${columnCount}, 1fr)` }}\n >\n {flattenedChildren.map((child, i) => {\n // If this react child is a primitive value, the key will be undefined\n const key = (child as Record<'key', unknown>).key;\n\n return (\n <div\n key={key ? String(key) : undefined}\n className={clsx(styles.item, {\n [styles['first-column']]: i % columnCount === 0,\n })}\n >\n {child}\n </div>\n );\n })}\n </Tag>\n );\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/column-layout/flexible-column-layout/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,eAAe,MAAM,8BAA8B,CAAC;AAC3D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAIzE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,KAAK,GAAG,CAAC,KAAa,EAAW,EAAE,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC;AAE1D,MAAM,UAAU,wBAAwB,CACtC,OAAe,EACf,cAAsB,EACtB,cAA6B;IAE7B,IAAI,CAAC,cAAc,EAAE;QACnB,OAAO,OAAO,CAAC;KAChB;IAED,yGAAyG;IACzG,MAAM,iBAAiB,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,GAAG,cAAc,CAAC,CAAC,CAAC;IAEzF,sGAAsG;IACtG,OAAO,IAAI,CAAC,GAAG,CACb,CAAC,EACD,iBAAiB,GAAG,OAAO,IAAI,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,iBAAiB,GAAG,CAAC,CAAC,CAAC,CAAC,iBAAiB,CACpG,CAAC;AACJ,CAAC;AAUD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,OAAO,GAAG,CAAC,EACX,cAAc,GAAG,CAAC,EAClB,cAAc,EACd,OAAO,EACP,QAAQ,EACR,aAAa,GACa;IAC1B,MAAM,CAAC,cAAc,EAAE,YAAY,CAAC,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IAEvF,MAAM,WAAW,GAAG,wBAAwB,CAAC,OAAO,EAAE,cAAc,EAAE,cAAc,CAAC,CAAC;IACtF,MAAM,oBAAoB,GAAG,OAAO,KAAK,WAAW,IAAI,cAAc,CAAC;IAEvE,wFAAwF;IACxF,MAAM,iBAAiB,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IACpD,MAAM,GAAG,GAAG,CAAC,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,KAAK,CAAU,CAAC;IAE9C,OAAO,CACL,oBAAC,GAAG,IACF,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,UAAU,CAAC,EAClB,MAAM,CAAC,gBAAgB,OAAO,EAAE,CAAC,EACjC,oBAAoB,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,CACpD,EACD,KAAK,EAAE,EAAE,mBAAmB,EAAE,UAAU,WAAW,mBAAmB,EAAE,IAEvE,iBAAiB,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;QAClC,sEAAsE;QACtE,MAAM,GAAG,GAAI,KAAgC,CAAC,GAAG,CAAC;QAElD,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,EAClC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;gBAC3B,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,GAAG,WAAW,KAAK,CAAC;aAChD,CAAC,IAED,KAAK,CACF,CACP,CAAC;IACJ,CAAC,CAAC,CACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport flattenChildren from 'react-keyed-flatten-children';\nimport clsx from 'clsx';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\nimport { InternalColumnLayoutProps } from '../interfaces';\n\nimport styles from './styles.css.js';\n\nconst isOdd = (value: number): boolean => value % 2 !== 0;\n\nexport function calculcateCssColumnCount(\n columns: number,\n minColumnWidth: number,\n containerWidth: number | null\n): number {\n if (!containerWidth) {\n return columns;\n }\n\n // First, calculate how many columns we can have based on the current container width and minColumnWidth.\n const targetColumnCount = Math.min(columns, Math.floor(containerWidth / minColumnWidth));\n\n // When we start wrapping into fewer columns than desired, we want to keep the number of columns even.\n return Math.max(\n 1,\n targetColumnCount < columns && isOdd(targetColumnCount) ? targetColumnCount - 1 : targetColumnCount\n );\n}\n\ninterface FlexibleColumnLayoutProps\n extends Pick<\n InternalColumnLayoutProps,\n 'minColumnWidth' | 'columns' | 'variant' | 'borders' | 'disableGutters' | '__tagOverride'\n > {\n children: React.ReactNode;\n}\n\nexport default function FlexibleColumnLayout({\n columns = 1,\n minColumnWidth = 0,\n disableGutters,\n variant,\n children,\n __tagOverride,\n}: FlexibleColumnLayoutProps) {\n const [containerWidth, containerRef] = useContainerQuery(rect => rect.contentBoxWidth);\n\n const columnCount = calculcateCssColumnCount(columns, minColumnWidth, containerWidth);\n const shouldDisableGutters = variant !== 'text-grid' && disableGutters;\n\n // Flattening the children allows us to \"see through\" React Fragments and nested arrays.\n const flattenedChildren = flattenChildren(children);\n const Tag = (__tagOverride ?? 'div') as 'div';\n\n return (\n <Tag\n ref={containerRef}\n className={clsx(\n styles['css-grid'],\n styles[`grid-variant-${variant}`],\n shouldDisableGutters && [styles['grid-no-gutters']]\n )}\n style={{ gridTemplateColumns: `repeat(${columnCount}, minmax(0, 1fr))` }}\n >\n {flattenedChildren.map((child, i) => {\n // If this react child is a primitive value, the key will be undefined\n const key = (child as Record<'key', unknown>).key;\n\n return (\n <div\n key={key ? String(key) : undefined}\n className={clsx(styles.item, {\n [styles['first-column']]: i % columnCount === 0,\n })}\n >\n {child}\n </div>\n );\n })}\n </Tag>\n );\n}\n"]}
@@ -1,4 +1,4 @@
1
1
  export var PACKAGE_SOURCE = "components";
2
- export var PACKAGE_VERSION = "3.0.0 (89f643f6)";
2
+ export var PACKAGE_VERSION = "3.0.0 (d7217eba)";
3
3
  export var THEME = "open-source-visual-refresh";
4
4
  export var ALWAYS_VISUAL_REFRESH = true;
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "PACKAGE_SOURCE": "components",
3
- "PACKAGE_VERSION": "3.0.0 (89f643f6)",
3
+ "PACKAGE_VERSION": "3.0.0 (d7217eba)",
4
4
  "THEME": "default",
5
5
  "ALWAYS_VISUAL_REFRESH": false
6
6
  }
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "89f643f68d2e7ff8cdf7946eda03e578be4683c3"
2
+ "commit": "d7217eba424382cda67cfbcda92c6bb5007fc8c3"
3
3
  }
package/package.json CHANGED
@@ -124,7 +124,7 @@
124
124
  "./internal/base-component/index.js",
125
125
  "./internal/base-component/styles.css.js"
126
126
  ],
127
- "version": "3.0.696",
127
+ "version": "3.0.697",
128
128
  "repository": {
129
129
  "type": "git",
130
130
  "url": "https://github.com/cloudscape-design/components.git"
@@ -1 +1 @@
1
- {"version":3,"file":"pie-chart.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/pie-chart.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAEjF,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAgBvC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAOzD,MAAM,WAAW,kBAAkB,CAAC,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;CACpB;AAED,UAAU,qBAAqB,CAAC,CAAC,SAAS,aAAa,CAAC,KAAK,CAC3D,SAAQ,YAAY,CAClB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,mBAAmB,GAAG,YAAY,CAAC,EAC1D,SAAS,GAAG,MAAM,GAAG,aAAa,GAAG,YAAY,GAAG,kBAAkB,CACvE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IAEf,kBAAkB,EAAE,CAAC,GAAG,IAAI,CAAC;IAC7B,iBAAiB,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,CAAC,KAAK,IAAI,CAAC;IAE/C,aAAa,EAAE,CAAC,GAAG,IAAI,CAAC;IAExB,OAAO,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IACtC,MAAM,EAAE,UAAU,CAAC;CACpB;;AAED,wBA8UE"}
1
+ {"version":3,"file":"pie-chart.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/pie-chart.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAEjF,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAgBvC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAOzD,MAAM,WAAW,kBAAkB,CAAC,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;CACpB;AAED,UAAU,qBAAqB,CAAC,CAAC,SAAS,aAAa,CAAC,KAAK,CAC3D,SAAQ,YAAY,CAClB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,mBAAmB,GAAG,YAAY,CAAC,EAC1D,SAAS,GAAG,MAAM,GAAG,aAAa,GAAG,YAAY,GAAG,kBAAkB,CACvE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IAEf,kBAAkB,EAAE,CAAC,GAAG,IAAI,CAAC;IAC7B,iBAAiB,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,CAAC,KAAK,IAAI,CAAC;IAE/C,aAAa,EAAE,CAAC,GAAG,IAAI,CAAC;IAExB,OAAO,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IACtC,MAAM,EAAE,UAAU,CAAC;CACpB;;AAED,wBAuVE"}
@@ -53,6 +53,7 @@ export default ({ fitHeight, height: explicitHeight, variant, size, width, i18nS
53
53
  const popoverContent = popoverData && React.createElement(SeriesDetails, { details: details, compactList: true, ref: popoverContentRef });
54
54
  const popoverDismissedRecently = useRef(false);
55
55
  const escapePressed = useRef(false);
56
+ const duringTouch = useRef(false);
56
57
  const highlightSegment = useCallback((internalDatum) => {
57
58
  const segment = internalDatum.datum;
58
59
  if (segment !== highlightedSegment) {
@@ -111,11 +112,18 @@ export default ({ fitHeight, height: explicitHeight, variant, size, width, i18nS
111
112
  escapePressed.current = false;
112
113
  return;
113
114
  }
115
+ if (duringTouch.current) {
116
+ duringTouch.current = false;
117
+ return;
118
+ }
114
119
  if (pinnedSegment !== null) {
115
120
  return;
116
121
  }
117
122
  highlightSegment(internalDatum);
118
123
  }, [pinnedSegment, highlightSegment]);
124
+ const onTouchStart = useCallback(() => {
125
+ duringTouch.current = true;
126
+ }, []);
119
127
  const onKeyDown = useCallback((event) => {
120
128
  const keyCode = event.keyCode;
121
129
  if (keyCode !== KeyCode.right &&
@@ -180,7 +188,7 @@ export default ({ fitHeight, height: explicitHeight, variant, size, width, i18nS
180
188
  return (React.createElement("div", { className: clsx(styles['chart-container'], fitHeight && styles['chart-container--fit-height']), ref: containerRef },
181
189
  React.createElement("div", { className: clsx(styles['chart-container-chart-plot'], fitHeight && styles['chart-container-chart-plot--fit-height']) },
182
190
  React.createElement(ChartPlot, { ref: plotRef, width: "100%", height: fitHeight ? '100%' : height, transform: `translate(${width / 2} ${height / 2})`, isPrecise: true, isClickable: !isPopoverOpen, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescription: ariaDescription, ariaDescribedby: hasInnerContent ? innerMetricId : undefined, ariaRoleDescription: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.chartAriaRoleDescription, activeElementRef: focusedSegmentRef, activeElementKey: highlightedSegmentIndex === null || highlightedSegmentIndex === void 0 ? void 0 : highlightedSegmentIndex.toString(), onApplicationFocus: onApplicationFocus, onApplicationBlur: onApplicationBlur, onKeyDown: onKeyDown, onMouseOut: checkMouseLeave },
183
- React.createElement(Segments, { pieData: pieData, dimensions: dimensions, variant: variant, focusedSegmentRef: focusedSegmentRef, popoverTrackRef: popoverTrackRef, highlightedSegment: highlightedSegment, segmentAriaRoleDescription: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.segmentAriaRoleDescription, onMouseDown: onMouseDown, onMouseOver: onMouseOver }),
191
+ React.createElement(Segments, { pieData: pieData, dimensions: dimensions, variant: variant, focusedSegmentRef: focusedSegmentRef, popoverTrackRef: popoverTrackRef, highlightedSegment: highlightedSegment, segmentAriaRoleDescription: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.segmentAriaRoleDescription, onMouseDown: onMouseDown, onMouseOver: onMouseOver, onTouchStart: onTouchStart }),
184
192
  hasLabels && (React.createElement(Labels, { pieData: pieData, dimensions: dimensions, segmentDescription: segmentDescription, visibleDataSum: dataSum, hideTitles: hideTitles, hideDescriptions: hideDescriptions, highlightedSegment: highlightedSegment, containerRef: containerRef })))),
185
193
  hasInnerContent && (React.createElement("div", { className: styles['inner-content'], id: innerMetricId },
186
194
  innerMetricValue && (React.createElement(InternalBox, { variant: dimensions.size === 'small' ? 'h3' : 'h1', tagOverride: "div", color: "inherit", padding: "n" }, innerMetricValue)),
@@ -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, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { PieArcDatum } from 'd3-shape';\n\nimport { nodeContains } from '@cloudscape-design/component-toolkit/dom';\n\nimport InternalBox from '../box/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport ChartPlot, { ChartPlotRef } from '../internal/components/chart-plot';\nimport ChartPopover from '../internal/components/chart-popover';\nimport ChartPopoverFooter from '../internal/components/chart-popover-footer';\nimport SeriesDetails from '../internal/components/chart-series-details';\nimport SeriesMarker from '../internal/components/chart-series-marker';\nimport LiveRegion from '../internal/components/live-region';\nimport { useHeightMeasure } from '../internal/hooks/container-queries/use-height-measure';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { KeyCode } from '../internal/keycode';\nimport { SomeRequired } from '../internal/types';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport { PieChartProps, SeriesInfo } from './interfaces';\nimport Labels from './labels';\nimport Segments from './segments';\nimport { defaultDetails, getDimensionsBySize } from './utils';\n\nimport styles from './styles.css.js';\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' | 'statusType'>,\n 'variant' | 'size' | 'i18nStrings' | 'hideTitles' | 'hideDescriptions'\n > {\n width: number;\n height: number;\n\n highlightedSegment: T | null;\n onHighlightChange: (segment: null | T) => void;\n\n legendSegment: T | null;\n\n pieData: PieArcDatum<InternalChartDatum<T>>[];\n dataSum: number;\n}\n\nexport interface PopoverData<T> {\n datum: T;\n trackRef: React.RefObject<SVGElement>;\n series: SeriesInfo;\n}\n\nexport default <T extends PieChartProps.Datum>({\n fitHeight,\n height: explicitHeight,\n variant,\n size,\n width,\n i18nStrings,\n ariaLabel,\n ariaLabelledby,\n ariaDescription,\n innerMetricValue,\n innerMetricDescription,\n hideTitles,\n hideDescriptions,\n detailPopoverContent,\n detailPopoverSize,\n detailPopoverFooter,\n segmentDescription,\n highlightedSegment,\n onHighlightChange,\n legendSegment,\n pieData,\n dataSum,\n}: InternalPieChartProps<T>) => {\n const [pinnedSegment, setPinnedSegment] = useState<T | null>(null);\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 popoverRef = useRef<HTMLElement | null>(null);\n\n const hasLabels = !(hideTitles && hideDescriptions);\n const isRefresh = useVisualRefresh();\n\n const height = useHeightMeasure(() => plotRef.current?.svg ?? null, !fitHeight) ?? explicitHeight;\n\n const dimensions = useMemo(\n () =>\n getDimensionsBySize({ size: fitHeight ? Math.min(height, width) : size, hasLabels, visualRefresh: isRefresh }),\n [fitHeight, height, width, size, hasLabels, isRefresh]\n );\n\n // Inner content is only available for donut charts and the inner description is not displayed for small charts\n const hasInnerContent =\n variant === 'donut' && (innerMetricValue || (innerMetricDescription && dimensions.size !== 'small'));\n\n const innerMetricId = useUniqueId('awsui-pie-chart__inner');\n\n const [isPopoverOpen, setPopoverOpen] = useState<boolean>(false);\n const [popoverData, setPopoverData] = useState<PopoverData<T>>();\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 detailPopoverFooterContent = useMemo(\n () => (detailPopoverFooter && highlightedSegment ? detailPopoverFooter(highlightedSegment) : null),\n [detailPopoverFooter, highlightedSegment]\n );\n\n const i18n = useInternalI18n('pie-chart');\n const detailFunction = detailPopoverContent || defaultDetails(i18n, i18nStrings);\n const details = popoverData ? detailFunction(popoverData.datum, dataSum) : [];\n const popoverContentRef = useRef<HTMLDivElement | null>(null);\n const popoverContent = popoverData && <SeriesDetails details={details} compactList={true} ref={popoverContentRef} />;\n\n const popoverDismissedRecently = useRef(false);\n const escapePressed = 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 setPopoverData({\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 setPopoverOpen(true);\n }\n },\n [highlightedSegment, setPopoverOpen, onHighlightChange]\n );\n\n const clearHighlightedSegment = useCallback(() => {\n setPopoverOpen(false);\n onHighlightChange(null);\n }, [onHighlightChange, setPopoverOpen]);\n\n const checkMouseLeave = (event: React.MouseEvent) => {\n if (pinnedSegment !== null) {\n return;\n }\n\n if (\n nodeContains(popoverRef.current, event.relatedTarget) ||\n nodeContains(focusedSegmentRef.current, event.relatedTarget)\n ) {\n return;\n }\n\n clearHighlightedSegment();\n };\n\n useEffect(() => {\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n clearHighlightedSegment();\n escapePressed.current = true;\n }\n };\n document.addEventListener('keydown', onKeyDown);\n return () => document.removeEventListener('keydown', onKeyDown);\n }, [clearHighlightedSegment]);\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 (escapePressed.current) {\n escapePressed.current = false;\n return;\n }\n if (pinnedSegment !== null) {\n return;\n }\n highlightSegment(internalDatum);\n },\n [pinnedSegment, highlightSegment]\n );\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n const keyCode = event.keyCode;\n if (\n keyCode !== KeyCode.right &&\n keyCode !== KeyCode.left &&\n keyCode !== KeyCode.enter &&\n keyCode !== KeyCode.space\n ) {\n return;\n }\n\n event.preventDefault();\n\n let nextIndex = highlightedSegmentIndex || 0;\n const MAX = pieData.length - 1;\n if (keyCode === KeyCode.right) {\n nextIndex++;\n if (nextIndex > MAX) {\n nextIndex = 0;\n }\n } else if (keyCode === KeyCode.left) {\n nextIndex--;\n if (nextIndex < 0) {\n nextIndex = MAX;\n }\n }\n if (keyCode === KeyCode.enter || keyCode === KeyCode.space) {\n setPinnedSegment(pieData[nextIndex].data.datum);\n }\n highlightSegment(pieData[nextIndex].data);\n },\n [setPinnedSegment, highlightSegment, pieData, highlightedSegmentIndex]\n );\n const onApplicationFocus = useCallback(\n (_event: any, target: 'keyboard' | 'mouse') => {\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 onApplicationBlur = useCallback(\n (event: React.FocusEvent) => {\n const blurTarget = event.relatedTarget || event.target;\n if (blurTarget === null || !(blurTarget instanceof Element) || !nodeBelongs(containerRef.current, blurTarget)) {\n // We only need to close the popover 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 setPopoverOpen(false);\n setPinnedSegment(null);\n }\n },\n [setPinnedSegment]\n );\n const onPopoverDismiss = (outsideClick?: boolean) => {\n setPopoverOpen(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 } else {\n onHighlightChange(null);\n }\n };\n\n return (\n <div\n className={clsx(styles['chart-container'], fitHeight && styles['chart-container--fit-height'])}\n ref={containerRef}\n >\n <div\n className={clsx(\n styles['chart-container-chart-plot'],\n fitHeight && styles['chart-container-chart-plot--fit-height']\n )}\n >\n <ChartPlot\n ref={plotRef}\n width=\"100%\"\n height={fitHeight ? '100%' : height}\n transform={`translate(${width / 2} ${height / 2})`}\n isPrecise={true}\n isClickable={!isPopoverOpen}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n ariaDescribedby={hasInnerContent ? innerMetricId : undefined}\n ariaRoleDescription={i18nStrings?.chartAriaRoleDescription}\n activeElementRef={focusedSegmentRef}\n activeElementKey={highlightedSegmentIndex?.toString()}\n onApplicationFocus={onApplicationFocus}\n onApplicationBlur={onApplicationBlur}\n onKeyDown={onKeyDown}\n onMouseOut={checkMouseLeave}\n >\n <Segments\n pieData={pieData}\n dimensions={dimensions}\n variant={variant}\n focusedSegmentRef={focusedSegmentRef}\n popoverTrackRef={popoverTrackRef}\n highlightedSegment={highlightedSegment}\n segmentAriaRoleDescription={i18nStrings?.segmentAriaRoleDescription}\n onMouseDown={onMouseDown}\n onMouseOver={onMouseOver}\n />\n {hasLabels && (\n <Labels\n pieData={pieData}\n dimensions={dimensions}\n segmentDescription={segmentDescription}\n visibleDataSum={dataSum}\n hideTitles={hideTitles}\n hideDescriptions={hideDescriptions}\n highlightedSegment={highlightedSegment}\n containerRef={containerRef}\n />\n )}\n </ChartPlot>\n </div>\n\n {hasInnerContent && (\n <div className={styles['inner-content']} id={innerMetricId}>\n {innerMetricValue && (\n <InternalBox\n variant={dimensions.size === 'small' ? 'h3' : 'h1'}\n tagOverride=\"div\"\n color=\"inherit\"\n padding=\"n\"\n >\n {innerMetricValue}\n </InternalBox>\n )}\n {innerMetricDescription && dimensions.size !== 'small' && (\n <InternalBox variant=\"h3\" color=\"text-body-secondary\" tagOverride=\"div\" padding=\"n\">\n {innerMetricDescription}\n </InternalBox>\n )}\n </div>\n )}\n {isPopoverOpen && popoverData && (\n <ChartPopover\n ref={popoverRef}\n title={\n popoverData.series && (\n <InternalBox className={styles['popover-header']} variant=\"strong\">\n <SeriesMarker color={popoverData.series.color} type={popoverData.series.markerType} />{' '}\n {popoverData.series.label}\n </InternalBox>\n )\n }\n trackRef={popoverData.trackRef}\n trackKey={popoverData.series.index}\n dismissButton={pinnedSegment !== null}\n dismissAriaLabel={i18nStrings.detailPopoverDismissAriaLabel}\n onDismiss={onPopoverDismiss}\n container={plotRef.current?.svg || null}\n size={detailPopoverSize}\n onMouseLeave={checkMouseLeave}\n onBlur={onApplicationBlur}\n >\n {popoverContent}\n {detailPopoverFooterContent && <ChartPopoverFooter>{detailPopoverFooterContent}</ChartPopoverFooter>}\n </ChartPopover>\n )}\n <LiveRegion source={[popoverContentRef]} />\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, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { PieArcDatum } from 'd3-shape';\n\nimport { nodeContains } from '@cloudscape-design/component-toolkit/dom';\n\nimport InternalBox from '../box/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport ChartPlot, { ChartPlotRef } from '../internal/components/chart-plot';\nimport ChartPopover from '../internal/components/chart-popover';\nimport ChartPopoverFooter from '../internal/components/chart-popover-footer';\nimport SeriesDetails from '../internal/components/chart-series-details';\nimport SeriesMarker from '../internal/components/chart-series-marker';\nimport LiveRegion from '../internal/components/live-region';\nimport { useHeightMeasure } from '../internal/hooks/container-queries/use-height-measure';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { KeyCode } from '../internal/keycode';\nimport { SomeRequired } from '../internal/types';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport { PieChartProps, SeriesInfo } from './interfaces';\nimport Labels from './labels';\nimport Segments from './segments';\nimport { defaultDetails, getDimensionsBySize } from './utils';\n\nimport styles from './styles.css.js';\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' | 'statusType'>,\n 'variant' | 'size' | 'i18nStrings' | 'hideTitles' | 'hideDescriptions'\n > {\n width: number;\n height: number;\n\n highlightedSegment: T | null;\n onHighlightChange: (segment: null | T) => void;\n\n legendSegment: T | null;\n\n pieData: PieArcDatum<InternalChartDatum<T>>[];\n dataSum: number;\n}\n\nexport interface PopoverData<T> {\n datum: T;\n trackRef: React.RefObject<SVGElement>;\n series: SeriesInfo;\n}\n\nexport default <T extends PieChartProps.Datum>({\n fitHeight,\n height: explicitHeight,\n variant,\n size,\n width,\n i18nStrings,\n ariaLabel,\n ariaLabelledby,\n ariaDescription,\n innerMetricValue,\n innerMetricDescription,\n hideTitles,\n hideDescriptions,\n detailPopoverContent,\n detailPopoverSize,\n detailPopoverFooter,\n segmentDescription,\n highlightedSegment,\n onHighlightChange,\n legendSegment,\n pieData,\n dataSum,\n}: InternalPieChartProps<T>) => {\n const [pinnedSegment, setPinnedSegment] = useState<T | null>(null);\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 popoverRef = useRef<HTMLElement | null>(null);\n\n const hasLabels = !(hideTitles && hideDescriptions);\n const isRefresh = useVisualRefresh();\n\n const height = useHeightMeasure(() => plotRef.current?.svg ?? null, !fitHeight) ?? explicitHeight;\n\n const dimensions = useMemo(\n () =>\n getDimensionsBySize({ size: fitHeight ? Math.min(height, width) : size, hasLabels, visualRefresh: isRefresh }),\n [fitHeight, height, width, size, hasLabels, isRefresh]\n );\n\n // Inner content is only available for donut charts and the inner description is not displayed for small charts\n const hasInnerContent =\n variant === 'donut' && (innerMetricValue || (innerMetricDescription && dimensions.size !== 'small'));\n\n const innerMetricId = useUniqueId('awsui-pie-chart__inner');\n\n const [isPopoverOpen, setPopoverOpen] = useState<boolean>(false);\n const [popoverData, setPopoverData] = useState<PopoverData<T>>();\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 detailPopoverFooterContent = useMemo(\n () => (detailPopoverFooter && highlightedSegment ? detailPopoverFooter(highlightedSegment) : null),\n [detailPopoverFooter, highlightedSegment]\n );\n\n const i18n = useInternalI18n('pie-chart');\n const detailFunction = detailPopoverContent || defaultDetails(i18n, i18nStrings);\n const details = popoverData ? detailFunction(popoverData.datum, dataSum) : [];\n const popoverContentRef = useRef<HTMLDivElement | null>(null);\n const popoverContent = popoverData && <SeriesDetails details={details} compactList={true} ref={popoverContentRef} />;\n\n const popoverDismissedRecently = useRef(false);\n const escapePressed = useRef(false);\n const duringTouch = 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 setPopoverData({\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 setPopoverOpen(true);\n }\n },\n [highlightedSegment, setPopoverOpen, onHighlightChange]\n );\n\n const clearHighlightedSegment = useCallback(() => {\n setPopoverOpen(false);\n onHighlightChange(null);\n }, [onHighlightChange, setPopoverOpen]);\n\n const checkMouseLeave = (event: React.MouseEvent) => {\n if (pinnedSegment !== null) {\n return;\n }\n\n if (\n nodeContains(popoverRef.current, event.relatedTarget) ||\n nodeContains(focusedSegmentRef.current, event.relatedTarget)\n ) {\n return;\n }\n\n clearHighlightedSegment();\n };\n\n useEffect(() => {\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n clearHighlightedSegment();\n escapePressed.current = true;\n }\n };\n document.addEventListener('keydown', onKeyDown);\n return () => document.removeEventListener('keydown', onKeyDown);\n }, [clearHighlightedSegment]);\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 (escapePressed.current) {\n escapePressed.current = false;\n return;\n }\n if (duringTouch.current) {\n duringTouch.current = false;\n return;\n }\n if (pinnedSegment !== null) {\n return;\n }\n highlightSegment(internalDatum);\n },\n [pinnedSegment, highlightSegment]\n );\n const onTouchStart = useCallback(() => {\n duringTouch.current = true;\n }, []);\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n const keyCode = event.keyCode;\n if (\n keyCode !== KeyCode.right &&\n keyCode !== KeyCode.left &&\n keyCode !== KeyCode.enter &&\n keyCode !== KeyCode.space\n ) {\n return;\n }\n\n event.preventDefault();\n\n let nextIndex = highlightedSegmentIndex || 0;\n const MAX = pieData.length - 1;\n if (keyCode === KeyCode.right) {\n nextIndex++;\n if (nextIndex > MAX) {\n nextIndex = 0;\n }\n } else if (keyCode === KeyCode.left) {\n nextIndex--;\n if (nextIndex < 0) {\n nextIndex = MAX;\n }\n }\n if (keyCode === KeyCode.enter || keyCode === KeyCode.space) {\n setPinnedSegment(pieData[nextIndex].data.datum);\n }\n highlightSegment(pieData[nextIndex].data);\n },\n [setPinnedSegment, highlightSegment, pieData, highlightedSegmentIndex]\n );\n const onApplicationFocus = useCallback(\n (_event: any, target: 'keyboard' | 'mouse') => {\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 onApplicationBlur = useCallback(\n (event: React.FocusEvent) => {\n const blurTarget = event.relatedTarget || event.target;\n if (blurTarget === null || !(blurTarget instanceof Element) || !nodeBelongs(containerRef.current, blurTarget)) {\n // We only need to close the popover 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 setPopoverOpen(false);\n setPinnedSegment(null);\n }\n },\n [setPinnedSegment]\n );\n const onPopoverDismiss = (outsideClick?: boolean) => {\n setPopoverOpen(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 } else {\n onHighlightChange(null);\n }\n };\n\n return (\n <div\n className={clsx(styles['chart-container'], fitHeight && styles['chart-container--fit-height'])}\n ref={containerRef}\n >\n <div\n className={clsx(\n styles['chart-container-chart-plot'],\n fitHeight && styles['chart-container-chart-plot--fit-height']\n )}\n >\n <ChartPlot\n ref={plotRef}\n width=\"100%\"\n height={fitHeight ? '100%' : height}\n transform={`translate(${width / 2} ${height / 2})`}\n isPrecise={true}\n isClickable={!isPopoverOpen}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n ariaDescribedby={hasInnerContent ? innerMetricId : undefined}\n ariaRoleDescription={i18nStrings?.chartAriaRoleDescription}\n activeElementRef={focusedSegmentRef}\n activeElementKey={highlightedSegmentIndex?.toString()}\n onApplicationFocus={onApplicationFocus}\n onApplicationBlur={onApplicationBlur}\n onKeyDown={onKeyDown}\n onMouseOut={checkMouseLeave}\n >\n <Segments\n pieData={pieData}\n dimensions={dimensions}\n variant={variant}\n focusedSegmentRef={focusedSegmentRef}\n popoverTrackRef={popoverTrackRef}\n highlightedSegment={highlightedSegment}\n segmentAriaRoleDescription={i18nStrings?.segmentAriaRoleDescription}\n onMouseDown={onMouseDown}\n onMouseOver={onMouseOver}\n onTouchStart={onTouchStart}\n />\n {hasLabels && (\n <Labels\n pieData={pieData}\n dimensions={dimensions}\n segmentDescription={segmentDescription}\n visibleDataSum={dataSum}\n hideTitles={hideTitles}\n hideDescriptions={hideDescriptions}\n highlightedSegment={highlightedSegment}\n containerRef={containerRef}\n />\n )}\n </ChartPlot>\n </div>\n\n {hasInnerContent && (\n <div className={styles['inner-content']} id={innerMetricId}>\n {innerMetricValue && (\n <InternalBox\n variant={dimensions.size === 'small' ? 'h3' : 'h1'}\n tagOverride=\"div\"\n color=\"inherit\"\n padding=\"n\"\n >\n {innerMetricValue}\n </InternalBox>\n )}\n {innerMetricDescription && dimensions.size !== 'small' && (\n <InternalBox variant=\"h3\" color=\"text-body-secondary\" tagOverride=\"div\" padding=\"n\">\n {innerMetricDescription}\n </InternalBox>\n )}\n </div>\n )}\n {isPopoverOpen && popoverData && (\n <ChartPopover\n ref={popoverRef}\n title={\n popoverData.series && (\n <InternalBox className={styles['popover-header']} variant=\"strong\">\n <SeriesMarker color={popoverData.series.color} type={popoverData.series.markerType} />{' '}\n {popoverData.series.label}\n </InternalBox>\n )\n }\n trackRef={popoverData.trackRef}\n trackKey={popoverData.series.index}\n dismissButton={pinnedSegment !== null}\n dismissAriaLabel={i18nStrings.detailPopoverDismissAriaLabel}\n onDismiss={onPopoverDismiss}\n container={plotRef.current?.svg || null}\n size={detailPopoverSize}\n onMouseLeave={checkMouseLeave}\n onBlur={onApplicationBlur}\n >\n {popoverContent}\n {detailPopoverFooterContent && <ChartPopoverFooter>{detailPopoverFooterContent}</ChartPopoverFooter>}\n </ChartPopover>\n )}\n <LiveRegion source={[popoverContentRef]} />\n </div>\n );\n};\n"]}
@@ -13,7 +13,8 @@ interface SegmentsProps<T> {
13
13
  segmentAriaRoleDescription?: string;
14
14
  onMouseDown: (datum: InternalChartDatum<T>) => void;
15
15
  onMouseOver: (datum: InternalChartDatum<T>) => void;
16
+ onTouchStart: () => void;
16
17
  }
17
- export default function Segments<T extends PieChartProps.Datum>({ pieData, highlightedSegment, dimensions, variant, focusedSegmentRef, popoverTrackRef, segmentAriaRoleDescription, onMouseDown, onMouseOver, }: SegmentsProps<T>): JSX.Element;
18
+ export default function Segments<T extends PieChartProps.Datum>({ pieData, highlightedSegment, dimensions, variant, focusedSegmentRef, popoverTrackRef, segmentAriaRoleDescription, onMouseDown, onMouseOver, onTouchStart, }: SegmentsProps<T>): JSX.Element;
18
19
  export {};
19
20
  //# 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;AAEvC,OAAO,EAAO,WAAW,EAAE,MAAM,UAAU,CAAC;AAG5C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAIpC,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,UAAU,EAAE,SAAS,CAAC;IACtB,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;IACpC,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;CACrD;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,CAAC,SAAS,aAAa,CAAC,KAAK,EAAE,EAC9D,OAAO,EACP,kBAAkB,EAClB,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,0BAA0B,EAC1B,WAAW,EACX,WAAW,GACZ,EAAE,aAAa,CAAC,CAAC,CAAC,eAuElB"}
1
+ {"version":3,"file":"segments.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/segments.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAO,WAAW,EAAE,MAAM,UAAU,CAAC;AAG5C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAIpC,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,UAAU,EAAE,SAAS,CAAC;IACtB,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;IACpC,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,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,CAAC,SAAS,aAAa,CAAC,KAAK,EAAE,EAC9D,OAAO,EACP,kBAAkB,EAClB,UAAU,EACV,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,0BAA0B,EAC1B,WAAW,EACX,WAAW,EACX,YAAY,GACb,EAAE,aAAa,CAAC,CAAC,CAAC,eAwElB"}
@@ -5,7 +5,7 @@ import clsx from 'clsx';
5
5
  import { arc } from 'd3-shape';
6
6
  import { useInternalI18n } from '../i18n/context';
7
7
  import styles from './styles.css.js';
8
- export default function Segments({ pieData, highlightedSegment, dimensions, variant, focusedSegmentRef, popoverTrackRef, segmentAriaRoleDescription, onMouseDown, onMouseOver, }) {
8
+ export default function Segments({ pieData, highlightedSegment, dimensions, variant, focusedSegmentRef, popoverTrackRef, segmentAriaRoleDescription, onMouseDown, onMouseOver, onTouchStart, }) {
9
9
  const i18n = useInternalI18n('pie-chart');
10
10
  const { arcFactory, highlightedArcFactory } = useMemo(() => {
11
11
  const radius = dimensions.outerRadius;
@@ -38,7 +38,7 @@ export default function Segments({ pieData, highlightedSegment, dimensions, vari
38
38
  const isDimmed = highlightedSegment !== null && !isHighlighted;
39
39
  const arcPath = arcFactory(datum) || undefined;
40
40
  const highlightedPath = highlightedArcFactory(datum) || undefined;
41
- return (React.createElement("g", { key: datum.data.index, onMouseDown: e => {
41
+ return (React.createElement("g", { key: datum.data.index, onTouchStart: () => onTouchStart(), onMouseDown: e => {
42
42
  onMouseDown(datum.data);
43
43
  e.preventDefault();
44
44
  }, onMouseOver: () => onMouseOver(datum.data), className: clsx(styles.segment, {
@@ -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 clsx from 'clsx';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { PieChartProps } from './interfaces';\nimport { InternalChartDatum } from './pie-chart';\nimport { Dimension } from './utils';\n\nimport styles from './styles.css.js';\n\ninterface SegmentsProps<T> {\n pieData: Array<PieArcDatum<InternalChartDatum<T>>>;\n highlightedSegment: T | null;\n dimensions: Dimension;\n variant: PieChartProps['variant'];\n focusedSegmentRef: React.RefObject<SVGGElement>;\n popoverTrackRef: React.RefObject<SVGCircleElement>;\n segmentAriaRoleDescription?: string;\n onMouseDown: (datum: InternalChartDatum<T>) => void;\n onMouseOver: (datum: InternalChartDatum<T>) => void;\n}\n\nexport default function Segments<T extends PieChartProps.Datum>({\n pieData,\n highlightedSegment,\n dimensions,\n variant,\n focusedSegmentRef,\n popoverTrackRef,\n segmentAriaRoleDescription,\n onMouseDown,\n onMouseOver,\n}: SegmentsProps<T>) {\n const i18n = useInternalI18n('pie-chart');\n\n const { arcFactory, highlightedArcFactory } = useMemo(() => {\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 }, [dimensions, variant]);\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>\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={i18n('i18nStrings.segmentAriaRoleDescription', 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 clsx from 'clsx';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { PieChartProps } from './interfaces';\nimport { InternalChartDatum } from './pie-chart';\nimport { Dimension } from './utils';\n\nimport styles from './styles.css.js';\n\ninterface SegmentsProps<T> {\n pieData: Array<PieArcDatum<InternalChartDatum<T>>>;\n highlightedSegment: T | null;\n dimensions: Dimension;\n variant: PieChartProps['variant'];\n focusedSegmentRef: React.RefObject<SVGGElement>;\n popoverTrackRef: React.RefObject<SVGCircleElement>;\n segmentAriaRoleDescription?: string;\n onMouseDown: (datum: InternalChartDatum<T>) => void;\n onMouseOver: (datum: InternalChartDatum<T>) => void;\n onTouchStart: () => void;\n}\n\nexport default function Segments<T extends PieChartProps.Datum>({\n pieData,\n highlightedSegment,\n dimensions,\n variant,\n focusedSegmentRef,\n popoverTrackRef,\n segmentAriaRoleDescription,\n onMouseDown,\n onMouseOver,\n onTouchStart,\n}: SegmentsProps<T>) {\n const i18n = useInternalI18n('pie-chart');\n\n const { arcFactory, highlightedArcFactory } = useMemo(() => {\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 }, [dimensions, variant]);\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>\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 onTouchStart={() => onTouchStart()}\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={i18n('i18nStrings.segmentAriaRoleDescription', 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"]}