@cloudscape-design/chart-components 1.0.102 → 1.0.104

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 (12) hide show
  1. package/internal/components/chart-legend/index.js +14 -5
  2. package/internal/components/chart-legend/index.js.map +1 -1
  3. package/internal/environment.js +1 -1
  4. package/internal/environment.json +1 -1
  5. package/internal/generated/styles/tokens.d.ts +23 -1
  6. package/internal/generated/styles/tokens.js +23 -1
  7. package/internal/generated/theming/index.cjs +476 -4
  8. package/internal/generated/theming/index.cjs.d.ts +216 -0
  9. package/internal/generated/theming/index.d.ts +216 -0
  10. package/internal/generated/theming/index.js +476 -4
  11. package/internal/manifest.json +1 -1
  12. package/package.json +1 -1
package/internal/components/chart-legend/index.js CHANGED
@@ -53,7 +53,7 @@ export const ChartLegend = ({ items, legendTitle, ariaLabel, axisId, actions, al
53
53
  return () => {
54
54
  document.removeEventListener("keydown", onDocumentKeyDown, true);
55
55
  };
56
- }, [items, tooltipItemId, hideTooltip]);
56
+ }, [tooltipItemId, hideTooltip]);
57
57
  const isMouseInContainer = useRef(false);
58
58
  // Scrolling to the highlighted legend item.
59
59
  useEffect(() => {
@@ -91,9 +91,14 @@ export const ChartLegend = ({ items, legendTitle, ariaLabel, axisId, actions, al
91
91
  showTooltip(itemId);
92
92
  }
93
93
  function onBlur(event) {
94
+ var _a;
94
95
  navigationAPI.current.updateFocusTarget();
95
- // Hide tooltip and clear highlight unless focus moves inside tooltip;
96
- if (tooltipRef.current && event.relatedTarget && !tooltipRef.current.contains(event.relatedTarget)) {
96
+ // Hide tooltip and clear highlight unless focus moves inside the tooltip.
97
+ const next = event.relatedTarget;
98
+ if (next && ((_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.contains(next))) {
99
+ return;
100
+ }
101
+ if (next) {
97
102
  clearHighlight();
98
103
  hideTooltip();
99
104
  }
@@ -148,7 +153,7 @@ export const ChartLegend = ({ items, legendTitle, ariaLabel, axisId, actions, al
148
153
  tooltipTrack.current = tooltipItemId ? elementsByIdRef.current[tooltipItemId] : null;
149
154
  const tooltipContent = tooltipTarget && getTooltipContent({ legendItem: tooltipTarget });
150
155
  const tooltipPosition = isVertical ? "left" : "bottom";
151
- return (_jsx(SingleTabStopNavigationProvider, { ref: navigationAPI, navigationActive: true, getNextFocusTarget: () => getNextFocusTarget(), onUnregisterActive: (element) => onUnregisterActive(element, navigationAPI), children: _jsxs("div", { role: "toolbar", "aria-label": legendTitle || ariaLabel, className: clsx(testClasses.root, styles.root, className), "data-axisid": axisId, onMouseEnter: () => (isMouseInContainer.current = true), onMouseLeave: () => (isMouseInContainer.current = false), children: [legendTitle && (_jsx(Box, { fontWeight: "bold", className: testClasses.title, textAlign: getBoxTextAlignment(horizontalAlignment), children: legendTitle })), _jsxs("div", {
156
+ return (_jsxs("div", { role: "toolbar", "aria-label": legendTitle || ariaLabel, className: clsx(testClasses.root, styles.root, className), "data-axisid": axisId, onMouseEnter: () => (isMouseInContainer.current = true), onMouseLeave: () => (isMouseInContainer.current = false), children: [legendTitle && (_jsx(Box, { fontWeight: "bold", className: testClasses.title, textAlign: getBoxTextAlignment(horizontalAlignment), children: legendTitle })), _jsx(SingleTabStopNavigationProvider, { ref: navigationAPI, navigationActive: true, getNextFocusTarget: () => getNextFocusTarget(), onUnregisterActive: (element) => onUnregisterActive(element, navigationAPI), children: _jsxs("div", {
152
157
  // The list element is not focusable. However, the focus lands on it regardless, when testing in Firefox.
153
158
  // Setting the tab index to -1 does fix the problem.
154
159
  tabIndex: -1, ref: containerRef, className: clsx(styles.list, {
@@ -192,7 +197,11 @@ export const ChartLegend = ({ items, legendTitle, ariaLabel, axisId, actions, al
192
197
  onSelectItem(item.id);
193
198
  }
194
199
  }, isHighlighted: item.highlighted, someHighlighted: someHighlighted, itemId: item.id, label: item.name, visible: item.visible, marker: item.marker }, index));
195
- })] }), tooltipContent && (_jsx(InternalChartTooltip, { trackRef: tooltipTrack, triggerClampRef: containerRef, trackKey: tooltipTarget.id, container: null, dismissButton: false, onDismiss: () => { }, position: tooltipPosition, title: tooltipContent.header, onMouseEnter: () => showTooltip(tooltipTarget.id), onMouseLeave: () => hideTooltip(), onBlur: () => hideTooltip(), footer: tooltipContent.footer && (_jsxs(_Fragment, { children: [_jsx("hr", { "aria-hidden": true }), tooltipContent.footer] })), children: tooltipContent.body }))] }) }));
200
+ })] }) }), tooltipContent && (_jsx(InternalChartTooltip, { ref: tooltipRef, trackRef: tooltipTrack, triggerClampRef: containerRef, trackKey: tooltipTarget.id, container: null, dismissButton: true, disableDismissAutoFocus: true, onDismiss: () => {
201
+ var _a;
202
+ hideTooltip(true);
203
+ (_a = elementsByIdRef.current[tooltipTarget.id]) === null || _a === void 0 ? void 0 : _a.focus();
204
+ }, position: tooltipPosition, title: tooltipContent.header, onMouseEnter: () => showTooltip(tooltipTarget.id), onMouseLeave: () => hideTooltip(), footer: tooltipContent.footer && (_jsxs(_Fragment, { children: [_jsx("hr", { "aria-hidden": true }), tooltipContent.footer] })), children: tooltipContent.body }))] }));
196
205
  };
197
206
  function getBoxTextAlignment(horizontalAlignment) {
198
207
  switch (horizontalAlignment) {
package/internal/components/chart-legend/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-legend/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\n\nimport { forwardRef, Ref, useEffect, useMemo, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\n\nimport {\n circleIndex,\n handleKey,\n KeyCode,\n SingleTabStopNavigationAPI,\n SingleTabStopNavigationProvider,\n useMergeRefs,\n useSingleTabStopNavigation,\n} from \"@cloudscape-design/component-toolkit/internal\";\nimport Box, { BoxProps } from \"@cloudscape-design/components/box\";\nimport { InternalChartTooltip } from \"@cloudscape-design/components/internal/do-not-use/chart-tooltip\";\n\nimport { scrollIntoViewNearestContainer } from \"../../utils/dom\";\nimport { DebouncedCall } from \"../../utils/utils\";\nimport { GetLegendTooltipContentProps, LegendItem, LegendTooltipContent } from \"../interfaces\";\n\nimport styles from \"./styles.css.js\";\nimport testClasses from \"./test-classes/styles.css.js\";\n\nconst TOOLTIP_SHOW_DELAY = 300;\nconst TOOLTIP_BLUR_DELAY = 50;\nconst HIGHLIGHT_LOST_DELAY = 50;\nconst SCROLL_DELAY = 100;\n\nexport type LegendAlignment = \"horizontal\" | \"vertical\";\nexport type LegendHorizontalAlignment = \"start\" | \"center\" | \"end\";\n\nexport interface ChartLegendProps {\n items: readonly LegendItem[];\n legendTitle?: string;\n ariaLabel?: string;\n axisId?: string;\n className?: string;\n actions?: React.ReactNode;\n someHighlighted: boolean;\n alignment: LegendAlignment;\n enableHorizontalScroll?: boolean;\n horizontalAlignment: LegendHorizontalAlignment;\n onToggleItem: (itemId: string) => void;\n onSelectItem: (itemId: string) => void;\n onItemHighlightEnter: (item: LegendItem) => void;\n onItemHighlightExit: () => void;\n getTooltipContent: (props: GetLegendTooltipContentProps) => null | LegendTooltipContent;\n}\n\nexport const ChartLegend = ({\n items,\n legendTitle,\n ariaLabel,\n axisId,\n actions,\n alignment,\n className,\n someHighlighted,\n onToggleItem,\n onSelectItem,\n onItemHighlightEnter,\n onItemHighlightExit,\n getTooltipContent,\n horizontalAlignment,\n enableHorizontalScroll,\n}: ChartLegendProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const elementsByIndexRef = useRef<Record<number, HTMLElement>>([]);\n const elementsByIdRef = useRef<Record<string, HTMLElement>>({});\n const tooltipRef = useRef<HTMLElement>(null);\n const highlightControl = useMemo(() => new DebouncedCall(), []);\n const scrollIntoViewControl = useMemo(() => new DebouncedCall(), []);\n const [selectedIndex, setSelectedIndex] = useState<number>(0);\n const [tooltipItemId, setTooltipItemId] = useState<string | null>(null);\n const { showTooltip, hideTooltip } = useMemo(() => {\n const control = new DebouncedCall();\n return {\n showTooltip(itemId: string) {\n control.call(() => setTooltipItemId(itemId), TOOLTIP_SHOW_DELAY);\n },\n hideTooltip(lock = false) {\n control.call(() => setTooltipItemId(null), TOOLTIP_BLUR_DELAY);\n if (lock) {\n control.lock(TOOLTIP_BLUR_DELAY);\n }\n },\n };\n }, []);\n\n useEffect(() => {\n if (!tooltipItemId) {\n return;\n }\n const onDocumentKeyDown = (event: KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n hideTooltip(true);\n elementsByIdRef.current[tooltipItemId]?.focus();\n }\n };\n document.addEventListener(\"keydown\", onDocumentKeyDown, true);\n return () => {\n document.removeEventListener(\"keydown\", onDocumentKeyDown, true);\n };\n }, [items, tooltipItemId, hideTooltip]);\n const isMouseInContainer = useRef<boolean>(false);\n\n // Scrolling to the highlighted legend item.\n useEffect(() => {\n const highlightedIndex = items.findIndex((item) => item.highlighted);\n if (highlightedIndex === -1) {\n return;\n }\n scrollIntoViewControl.call(() => {\n if (isMouseInContainer.current) {\n return;\n }\n const element = elementsByIndexRef.current?.[highlightedIndex];\n if (!element) {\n return;\n }\n scrollIntoViewNearestContainer(element, { behavior: \"smooth\", scrollMode: \"if-needed\" });\n }, SCROLL_DELAY);\n }, [items, scrollIntoViewControl]);\n\n const showHighlight = (itemId: string) => {\n const item = items.find((item) => item.id === itemId);\n if (item?.visible) {\n highlightControl.cancelPrevious();\n onItemHighlightEnter(item);\n }\n };\n const clearHighlight = () => {\n highlightControl.call(onItemHighlightExit, HIGHLIGHT_LOST_DELAY);\n };\n\n const navigationAPI = useRef<SingleTabStopNavigationAPI>(null);\n\n function onFocus(index: number, itemId: string) {\n setSelectedIndex(index);\n navigationAPI.current!.updateFocusTarget();\n showHighlight(itemId);\n showTooltip(itemId);\n }\n\n function onBlur(event: React.FocusEvent) {\n navigationAPI.current!.updateFocusTarget();\n\n // Hide tooltip and clear highlight unless focus moves inside tooltip;\n if (tooltipRef.current && event.relatedTarget && !tooltipRef.current.contains(event.relatedTarget)) {\n clearHighlight();\n hideTooltip();\n }\n }\n\n function focusElement(index: number) {\n elementsByIndexRef.current[index]?.focus();\n }\n\n function onKeyDown(event: React.KeyboardEvent<HTMLElement>) {\n if (\n event.keyCode === KeyCode.right ||\n event.keyCode === KeyCode.left ||\n event.keyCode === KeyCode.up ||\n event.keyCode === KeyCode.down ||\n event.keyCode === KeyCode.home ||\n event.keyCode === KeyCode.end ||\n event.keyCode === KeyCode.escape\n ) {\n // Preventing default fixes an issue in Safari+VO when VO additionally interprets arrow keys as its commands.\n event.preventDefault();\n\n const range = [0, items.length - 1] as [number, number];\n\n handleKey(event, {\n onInlineStart: () => focusElement(circleIndex(selectedIndex - 1, range)),\n onInlineEnd: () => focusElement(circleIndex(selectedIndex + 1, range)),\n onBlockStart: () => focusElement(circleIndex(selectedIndex - 1, range)),\n onBlockEnd: () => focusElement(circleIndex(selectedIndex + 1, range)),\n onHome: () => focusElement(0),\n onEnd: () => focusElement(items.length - 1),\n onEscape: () => onItemHighlightExit(),\n });\n }\n }\n\n function getNextFocusTarget(): null | HTMLElement {\n if (containerRef.current) {\n const buttons: HTMLButtonElement[] = Array.from(containerRef.current.querySelectorAll(`.${styles.item}`));\n return buttons[selectedIndex] ?? null;\n }\n return null;\n }\n\n function onUnregisterActive(\n focusableElement: HTMLElement,\n navigationAPI: React.RefObject<{ getFocusTarget: () => HTMLElement | null }>,\n ) {\n const target = navigationAPI.current?.getFocusTarget();\n\n if (target && target.dataset.itemid !== focusableElement.dataset.itemid) {\n target.focus();\n }\n }\n\n useEffect(() => {\n navigationAPI.current!.updateFocusTarget();\n });\n\n const isVertical = alignment === \"vertical\";\n\n const tooltipTrack = useRef<null | HTMLElement>(null);\n const tooltipTarget = items.find((item) => item.id === tooltipItemId) ?? null;\n tooltipTrack.current = tooltipItemId ? elementsByIdRef.current[tooltipItemId] : null;\n const tooltipContent = tooltipTarget && getTooltipContent({ legendItem: tooltipTarget });\n const tooltipPosition = isVertical ? \"left\" : \"bottom\";\n\n return (\n <SingleTabStopNavigationProvider\n ref={navigationAPI}\n navigationActive={true}\n getNextFocusTarget={() => getNextFocusTarget()}\n onUnregisterActive={(element: HTMLElement) => onUnregisterActive(element, navigationAPI)}\n >\n <div\n role=\"toolbar\"\n aria-label={legendTitle || ariaLabel}\n className={clsx(testClasses.root, styles.root, className)}\n data-axisid={axisId}\n onMouseEnter={() => (isMouseInContainer.current = true)}\n onMouseLeave={() => (isMouseInContainer.current = false)}\n >\n {legendTitle && (\n <Box fontWeight=\"bold\" className={testClasses.title} textAlign={getBoxTextAlignment(horizontalAlignment)}>\n {legendTitle}\n </Box>\n )}\n <div\n // The list element is not focusable. However, the focus lands on it regardless, when testing in Firefox.\n // Setting the tab index to -1 does fix the problem.\n tabIndex={-1}\n ref={containerRef}\n className={clsx(styles.list, {\n [styles[`list-bottom-${horizontalAlignment}`]]: !isVertical,\n [styles[\"list-horizontal-scroll\"]]: enableHorizontalScroll,\n [styles[\"list-bottom\"]]: !isVertical,\n [styles[\"list-side\"]]: isVertical,\n })}\n >\n {actions && (\n <>\n <div className={clsx(testClasses.actions, styles.actions, styles[\"actions-bottom\"])}>\n {actions}\n {!isVertical && <div className={styles[\"actions-divider-bottom\"]} />}\n </div>\n {isVertical && <div className={styles[\"actions-divider-side\"]} />}\n </>\n )}\n {items.map((item, index) => {\n const handlers = {\n onMouseEnter: () => {\n showHighlight(item.id);\n showTooltip(item.id);\n },\n onMouseLeave: () => {\n clearHighlight();\n hideTooltip();\n },\n onFocus: () => {\n onFocus(index, item.id);\n },\n onBlur: (event: React.FocusEvent) => {\n onBlur(event);\n },\n onKeyDown,\n };\n const thisTriggerRef = (elem: null | HTMLElement) => {\n if (elem) {\n elementsByIndexRef.current[index] = elem;\n elementsByIdRef.current[item.id] = elem;\n } else {\n delete elementsByIndexRef.current[index];\n delete elementsByIdRef.current[item.id];\n }\n };\n return (\n <LegendItemTrigger\n key={index}\n {...handlers}\n ref={thisTriggerRef}\n onClick={(event) => {\n if (event.metaKey || event.ctrlKey) {\n onToggleItem(item.id);\n } else {\n onSelectItem(item.id);\n }\n }}\n isHighlighted={item.highlighted}\n someHighlighted={someHighlighted}\n itemId={item.id}\n label={item.name}\n visible={item.visible}\n marker={item.marker}\n />\n );\n })}\n </div>\n {tooltipContent && (\n <InternalChartTooltip\n trackRef={tooltipTrack}\n triggerClampRef={containerRef}\n trackKey={tooltipTarget.id}\n container={null}\n dismissButton={false}\n onDismiss={() => {}}\n position={tooltipPosition}\n title={tooltipContent.header}\n onMouseEnter={() => showTooltip(tooltipTarget.id)}\n onMouseLeave={() => hideTooltip()}\n onBlur={() => hideTooltip()}\n footer={\n tooltipContent.footer && (\n <>\n <hr aria-hidden={true} />\n {tooltipContent.footer}\n </>\n )\n }\n >\n {tooltipContent.body}\n </InternalChartTooltip>\n )}\n </div>\n </SingleTabStopNavigationProvider>\n );\n};\n\nfunction getBoxTextAlignment(horizontalAlignment: LegendHorizontalAlignment): BoxProps.TextAlign {\n switch (horizontalAlignment) {\n case \"start\":\n return \"left\";\n case \"center\":\n return \"center\";\n case \"end\":\n return \"right\";\n }\n}\n\nconst LegendItemTrigger = forwardRef(\n (\n {\n isHighlighted,\n someHighlighted,\n itemId,\n label,\n marker,\n visible,\n onClick,\n triggerRef,\n onMouseEnter,\n onMouseLeave,\n onFocus,\n onBlur,\n onKeyDown,\n }: {\n isHighlighted?: boolean;\n someHighlighted?: boolean;\n itemId: string;\n label: string;\n marker?: React.ReactNode;\n visible: boolean;\n onClick: (event: React.MouseEvent) => void;\n onMarkerClick?: () => void;\n triggerRef?: Ref<HTMLElement>;\n onMouseEnter?: () => void;\n onMouseLeave?: () => void;\n onFocus?: () => void;\n onBlur?: (event: React.FocusEvent) => void;\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n },\n ref: Ref<HTMLButtonElement>,\n ) => {\n const refObject = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs(ref, triggerRef, refObject);\n const { tabIndex } = useSingleTabStopNavigation(refObject);\n return (\n <button\n data-itemid={itemId}\n aria-pressed={visible}\n aria-current={isHighlighted}\n className={clsx(testClasses.item, styles.item, {\n [styles[\"item--inactive\"]]: !visible,\n [testClasses[\"hidden-item\"]]: !visible,\n [styles[\"item--dimmed\"]]: someHighlighted && !isHighlighted,\n [testClasses[\"dimmed-item\"]]: someHighlighted && !isHighlighted,\n })}\n ref={mergedRef}\n tabIndex={tabIndex}\n onClick={onClick}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n >\n {marker}\n <span className={styles[\"item-label\"]}>{label}</span>\n </button>\n );\n },\n);\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-legend/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\n\nimport { forwardRef, Ref, useEffect, useMemo, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\n\nimport {\n circleIndex,\n handleKey,\n KeyCode,\n SingleTabStopNavigationAPI,\n SingleTabStopNavigationProvider,\n useMergeRefs,\n useSingleTabStopNavigation,\n} from \"@cloudscape-design/component-toolkit/internal\";\nimport Box, { BoxProps } from \"@cloudscape-design/components/box\";\nimport { InternalChartTooltip } from \"@cloudscape-design/components/internal/do-not-use/chart-tooltip\";\n\nimport { scrollIntoViewNearestContainer } from \"../../utils/dom\";\nimport { DebouncedCall } from \"../../utils/utils\";\nimport { GetLegendTooltipContentProps, LegendItem, LegendTooltipContent } from \"../interfaces\";\n\nimport styles from \"./styles.css.js\";\nimport testClasses from \"./test-classes/styles.css.js\";\n\nconst TOOLTIP_SHOW_DELAY = 300;\nconst TOOLTIP_BLUR_DELAY = 50;\nconst HIGHLIGHT_LOST_DELAY = 50;\nconst SCROLL_DELAY = 100;\n\nexport type LegendAlignment = \"horizontal\" | \"vertical\";\nexport type LegendHorizontalAlignment = \"start\" | \"center\" | \"end\";\n\nexport interface ChartLegendProps {\n items: readonly LegendItem[];\n legendTitle?: string;\n ariaLabel?: string;\n axisId?: string;\n className?: string;\n actions?: React.ReactNode;\n someHighlighted: boolean;\n alignment: LegendAlignment;\n enableHorizontalScroll?: boolean;\n horizontalAlignment: LegendHorizontalAlignment;\n onToggleItem: (itemId: string) => void;\n onSelectItem: (itemId: string) => void;\n onItemHighlightEnter: (item: LegendItem) => void;\n onItemHighlightExit: () => void;\n getTooltipContent: (props: GetLegendTooltipContentProps) => null | LegendTooltipContent;\n}\n\nexport const ChartLegend = ({\n items,\n legendTitle,\n ariaLabel,\n axisId,\n actions,\n alignment,\n className,\n someHighlighted,\n onToggleItem,\n onSelectItem,\n onItemHighlightEnter,\n onItemHighlightExit,\n getTooltipContent,\n horizontalAlignment,\n enableHorizontalScroll,\n}: ChartLegendProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const elementsByIndexRef = useRef<Record<number, HTMLElement>>([]);\n const elementsByIdRef = useRef<Record<string, HTMLElement>>({});\n const tooltipRef = useRef<HTMLElement>(null);\n const highlightControl = useMemo(() => new DebouncedCall(), []);\n const scrollIntoViewControl = useMemo(() => new DebouncedCall(), []);\n const [selectedIndex, setSelectedIndex] = useState<number>(0);\n const [tooltipItemId, setTooltipItemId] = useState<string | null>(null);\n const { showTooltip, hideTooltip } = useMemo(() => {\n const control = new DebouncedCall();\n return {\n showTooltip(itemId: string) {\n control.call(() => setTooltipItemId(itemId), TOOLTIP_SHOW_DELAY);\n },\n hideTooltip(lock = false) {\n control.call(() => setTooltipItemId(null), TOOLTIP_BLUR_DELAY);\n if (lock) {\n control.lock(TOOLTIP_BLUR_DELAY);\n }\n },\n };\n }, []);\n\n useEffect(() => {\n if (!tooltipItemId) {\n return;\n }\n const onDocumentKeyDown = (event: KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n hideTooltip(true);\n elementsByIdRef.current[tooltipItemId]?.focus();\n }\n };\n document.addEventListener(\"keydown\", onDocumentKeyDown, true);\n return () => {\n document.removeEventListener(\"keydown\", onDocumentKeyDown, true);\n };\n }, [tooltipItemId, hideTooltip]);\n\n const isMouseInContainer = useRef<boolean>(false);\n\n // Scrolling to the highlighted legend item.\n useEffect(() => {\n const highlightedIndex = items.findIndex((item) => item.highlighted);\n if (highlightedIndex === -1) {\n return;\n }\n scrollIntoViewControl.call(() => {\n if (isMouseInContainer.current) {\n return;\n }\n const element = elementsByIndexRef.current?.[highlightedIndex];\n if (!element) {\n return;\n }\n scrollIntoViewNearestContainer(element, { behavior: \"smooth\", scrollMode: \"if-needed\" });\n }, SCROLL_DELAY);\n }, [items, scrollIntoViewControl]);\n\n const showHighlight = (itemId: string) => {\n const item = items.find((item) => item.id === itemId);\n if (item?.visible) {\n highlightControl.cancelPrevious();\n onItemHighlightEnter(item);\n }\n };\n const clearHighlight = () => {\n highlightControl.call(onItemHighlightExit, HIGHLIGHT_LOST_DELAY);\n };\n\n const navigationAPI = useRef<SingleTabStopNavigationAPI>(null);\n\n function onFocus(index: number, itemId: string) {\n setSelectedIndex(index);\n navigationAPI.current!.updateFocusTarget();\n showHighlight(itemId);\n showTooltip(itemId);\n }\n\n function onBlur(event: React.FocusEvent) {\n navigationAPI.current!.updateFocusTarget();\n\n // Hide tooltip and clear highlight unless focus moves inside the tooltip.\n const next = event.relatedTarget as Node | null;\n if (next && tooltipRef.current?.contains(next)) {\n return;\n }\n if (next) {\n clearHighlight();\n hideTooltip();\n }\n }\n\n function focusElement(index: number) {\n elementsByIndexRef.current[index]?.focus();\n }\n\n function onKeyDown(event: React.KeyboardEvent<HTMLElement>) {\n if (\n event.keyCode === KeyCode.right ||\n event.keyCode === KeyCode.left ||\n event.keyCode === KeyCode.up ||\n event.keyCode === KeyCode.down ||\n event.keyCode === KeyCode.home ||\n event.keyCode === KeyCode.end ||\n event.keyCode === KeyCode.escape\n ) {\n // Preventing default fixes an issue in Safari+VO when VO additionally interprets arrow keys as its commands.\n event.preventDefault();\n\n const range = [0, items.length - 1] as [number, number];\n\n handleKey(event, {\n onInlineStart: () => focusElement(circleIndex(selectedIndex - 1, range)),\n onInlineEnd: () => focusElement(circleIndex(selectedIndex + 1, range)),\n onBlockStart: () => focusElement(circleIndex(selectedIndex - 1, range)),\n onBlockEnd: () => focusElement(circleIndex(selectedIndex + 1, range)),\n onHome: () => focusElement(0),\n onEnd: () => focusElement(items.length - 1),\n onEscape: () => onItemHighlightExit(),\n });\n }\n }\n\n function getNextFocusTarget(): null | HTMLElement {\n if (containerRef.current) {\n const buttons: HTMLButtonElement[] = Array.from(containerRef.current.querySelectorAll(`.${styles.item}`));\n return buttons[selectedIndex] ?? null;\n }\n return null;\n }\n\n function onUnregisterActive(\n focusableElement: HTMLElement,\n navigationAPI: React.RefObject<{ getFocusTarget: () => HTMLElement | null }>,\n ) {\n const target = navigationAPI.current?.getFocusTarget();\n\n if (target && target.dataset.itemid !== focusableElement.dataset.itemid) {\n target.focus();\n }\n }\n\n useEffect(() => {\n navigationAPI.current!.updateFocusTarget();\n });\n\n const isVertical = alignment === \"vertical\";\n\n const tooltipTrack = useRef<null | HTMLElement>(null);\n const tooltipTarget = items.find((item) => item.id === tooltipItemId) ?? null;\n tooltipTrack.current = tooltipItemId ? elementsByIdRef.current[tooltipItemId] : null;\n const tooltipContent = tooltipTarget && getTooltipContent({ legendItem: tooltipTarget });\n const tooltipPosition = isVertical ? \"left\" : \"bottom\";\n\n return (\n <div\n role=\"toolbar\"\n aria-label={legendTitle || ariaLabel}\n className={clsx(testClasses.root, styles.root, className)}\n data-axisid={axisId}\n onMouseEnter={() => (isMouseInContainer.current = true)}\n onMouseLeave={() => (isMouseInContainer.current = false)}\n >\n {legendTitle && (\n <Box fontWeight=\"bold\" className={testClasses.title} textAlign={getBoxTextAlignment(horizontalAlignment)}>\n {legendTitle}\n </Box>\n )}\n <SingleTabStopNavigationProvider\n ref={navigationAPI}\n navigationActive={true}\n getNextFocusTarget={() => getNextFocusTarget()}\n onUnregisterActive={(element: HTMLElement) => onUnregisterActive(element, navigationAPI)}\n >\n <div\n // The list element is not focusable. However, the focus lands on it regardless, when testing in Firefox.\n // Setting the tab index to -1 does fix the problem.\n tabIndex={-1}\n ref={containerRef}\n className={clsx(styles.list, {\n [styles[`list-bottom-${horizontalAlignment}`]]: !isVertical,\n [styles[\"list-horizontal-scroll\"]]: enableHorizontalScroll,\n [styles[\"list-bottom\"]]: !isVertical,\n [styles[\"list-side\"]]: isVertical,\n })}\n >\n {actions && (\n <>\n <div className={clsx(testClasses.actions, styles.actions, styles[\"actions-bottom\"])}>\n {actions}\n {!isVertical && <div className={styles[\"actions-divider-bottom\"]} />}\n </div>\n {isVertical && <div className={styles[\"actions-divider-side\"]} />}\n </>\n )}\n {items.map((item, index) => {\n const handlers = {\n onMouseEnter: () => {\n showHighlight(item.id);\n showTooltip(item.id);\n },\n onMouseLeave: () => {\n clearHighlight();\n hideTooltip();\n },\n onFocus: () => {\n onFocus(index, item.id);\n },\n onBlur: (event: React.FocusEvent) => {\n onBlur(event);\n },\n onKeyDown,\n };\n const thisTriggerRef = (elem: null | HTMLElement) => {\n if (elem) {\n elementsByIndexRef.current[index] = elem;\n elementsByIdRef.current[item.id] = elem;\n } else {\n delete elementsByIndexRef.current[index];\n delete elementsByIdRef.current[item.id];\n }\n };\n return (\n <LegendItemTrigger\n key={index}\n {...handlers}\n ref={thisTriggerRef}\n onClick={(event) => {\n if (event.metaKey || event.ctrlKey) {\n onToggleItem(item.id);\n } else {\n onSelectItem(item.id);\n }\n }}\n isHighlighted={item.highlighted}\n someHighlighted={someHighlighted}\n itemId={item.id}\n label={item.name}\n visible={item.visible}\n marker={item.marker}\n />\n );\n })}\n </div>\n </SingleTabStopNavigationProvider>\n {tooltipContent && (\n <InternalChartTooltip\n ref={tooltipRef}\n trackRef={tooltipTrack}\n triggerClampRef={containerRef}\n trackKey={tooltipTarget.id}\n container={null}\n dismissButton={true}\n disableDismissAutoFocus={true}\n onDismiss={() => {\n hideTooltip(true);\n elementsByIdRef.current[tooltipTarget.id]?.focus();\n }}\n position={tooltipPosition}\n title={tooltipContent.header}\n onMouseEnter={() => showTooltip(tooltipTarget.id)}\n onMouseLeave={() => hideTooltip()}\n footer={\n tooltipContent.footer && (\n <>\n <hr aria-hidden={true} />\n {tooltipContent.footer}\n </>\n )\n }\n >\n {tooltipContent.body}\n </InternalChartTooltip>\n )}\n </div>\n );\n};\n\nfunction getBoxTextAlignment(horizontalAlignment: LegendHorizontalAlignment): BoxProps.TextAlign {\n switch (horizontalAlignment) {\n case \"start\":\n return \"left\";\n case \"center\":\n return \"center\";\n case \"end\":\n return \"right\";\n }\n}\n\nconst LegendItemTrigger = forwardRef(\n (\n {\n isHighlighted,\n someHighlighted,\n itemId,\n label,\n marker,\n visible,\n onClick,\n triggerRef,\n onMouseEnter,\n onMouseLeave,\n onFocus,\n onBlur,\n onKeyDown,\n }: {\n isHighlighted?: boolean;\n someHighlighted?: boolean;\n itemId: string;\n label: string;\n marker?: React.ReactNode;\n visible: boolean;\n onClick: (event: React.MouseEvent) => void;\n onMarkerClick?: () => void;\n triggerRef?: Ref<HTMLElement>;\n onMouseEnter?: () => void;\n onMouseLeave?: () => void;\n onFocus?: () => void;\n onBlur?: (event: React.FocusEvent) => void;\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n },\n ref: Ref<HTMLButtonElement>,\n ) => {\n const refObject = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs(ref, triggerRef, refObject);\n const { tabIndex } = useSingleTabStopNavigation(refObject);\n return (\n <button\n data-itemid={itemId}\n aria-pressed={visible}\n aria-current={isHighlighted}\n className={clsx(testClasses.item, styles.item, {\n [styles[\"item--inactive\"]]: !visible,\n [testClasses[\"hidden-item\"]]: !visible,\n [styles[\"item--dimmed\"]]: someHighlighted && !isHighlighted,\n [testClasses[\"dimmed-item\"]]: someHighlighted && !isHighlighted,\n })}\n ref={mergedRef}\n tabIndex={tabIndex}\n onClick={onClick}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n >\n {marker}\n <span className={styles[\"item-label\"]}>{label}</span>\n </button>\n );\n },\n);\n"]}
package/internal/environment.js CHANGED
@@ -1,5 +1,5 @@
1
1
  export var PACKAGE_SOURCE = "chart-components";
2
- export var PACKAGE_VERSION = "1.0.0 (3b627b10)";
2
+ export var PACKAGE_VERSION = "1.0.0 (23d09e04)";
3
3
  export var THEME = "open-source-visual-refresh";
4
4
  export var ALWAYS_VISUAL_REFRESH = true;
5
5
  export var SYSTEM = "core";
package/internal/environment.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "PACKAGE_SOURCE": "chart-components",
3
- "PACKAGE_VERSION": "1.0.0 (3b627b10)",
3
+ "PACKAGE_VERSION": "1.0.0 (23d09e04)",
4
4
  "THEME": "open-source-visual-refresh",
5
5
  "ALWAYS_VISUAL_REFRESH": true,
6
6
  "SYSTEM": "core"
package/internal/generated/styles/tokens.d.ts CHANGED
@@ -269,6 +269,16 @@ export const colorTextNotificationSeverityHigh: string;
269
269
  export const colorTextNotificationSeverityMedium: string;
270
270
  export const colorTextNotificationSeverityLow: string;
271
271
  export const colorTextNotificationSeverityNeutral: string;
272
+ export const colorBorderBadgeSeverityCritical: string;
273
+ export const colorBorderBadgeSeverityHigh: string;
274
+ export const colorBorderBadgeSeverityMedium: string;
275
+ export const colorBorderBadgeSeverityLow: string;
276
+ export const colorBorderBadgeSeverityNeutral: string;
277
+ export const colorTextBadgeSeverityCritical: string;
278
+ export const colorTextBadgeSeverityHigh: string;
279
+ export const colorTextBadgeSeverityMedium: string;
280
+ export const colorTextBadgeSeverityLow: string;
281
+ export const colorTextBadgeSeverityNeutral: string;
272
282
  export const colorGreyOpaque10: string;
273
283
  export const colorGreyOpaque25: string;
274
284
  export const colorGreyOpaque40: string;
@@ -517,6 +527,7 @@ export const colorTextEmpty: string;
517
527
  export const colorTextExpandableSectionDefault: string;
518
528
  export const colorTextExpandableSectionHover: string;
519
529
  export const colorTextExpandableSectionNavigationIconDefault: string;
530
+ export const colorBorderExpandableSectionDefault: string;
520
531
  export const colorTextFormDefault: string;
521
532
  export const colorTextFormLabel: string;
522
533
  export const colorTextFormSecondary: string;
@@ -600,6 +611,15 @@ export const colorIconActionCardActive: string;
600
611
  export const colorIconActionCardDisabled: string;
601
612
  export const colorBackgroundSkeleton: string;
602
613
  export const colorBackgroundSkeletonWave: string;
614
+ export const colorBorderBadge: string;
615
+ export const colorBorderBadgeGrey: string;
616
+ export const colorBorderBadgeGreen: string;
617
+ export const colorBorderBadgeBlue: string;
618
+ export const colorBorderBadgeRed: string;
619
+ export const colorTextBadgeGrey: string;
620
+ export const colorTextBadgeGreen: string;
621
+ export const colorTextBadgeBlue: string;
622
+ export const colorTextBadgeRed: string;
603
623
  export const fontBoxValueLargeWeight: string;
604
624
  export const fontButtonLetterSpacing: string;
605
625
  export const fontChartDetailSize: string;
@@ -607,7 +627,7 @@ export const fontDecorationStyleLink: string;
607
627
  export const fontDecorationThicknessLink: string;
608
628
  export const fontDecorationThicknessLinkDisplayL: string;
609
629
  export const fontDisplayLabelWeight: string;
610
- export const fontExpandableHeadingSize: string;
630
+ export const fontSizeExpandableHeading: string;
611
631
  export const fontFamilyBase: string;
612
632
  export const fontFamilyDisplay: string;
613
633
  export const fontFamilyHeading: string;
@@ -733,9 +753,11 @@ export const borderWidthIconLarge: string;
733
753
  export const borderWidthIconMedium: string;
734
754
  export const borderWidthIconNormal: string;
735
755
  export const borderWidthIconSmall: string;
756
+ export const borderWidthIconXSmall: string;
736
757
  export const borderWidthItemCard: string;
737
758
  export const borderWidthItemCardHighlighted: string;
738
759
  export const borderWidthItemSelected: string;
760
+ export const borderWidthBadge: string;
739
761
  export const borderWidthPopover: string;
740
762
  export const borderWidthToken: string;
741
763
  export const motionDurationExtraFast: string;
package/internal/generated/styles/tokens.js CHANGED
@@ -269,6 +269,16 @@ export var colorTextNotificationSeverityHigh = "var(--color-text-notification-se
269
269
  export var colorTextNotificationSeverityMedium = "var(--color-text-notification-severity-medium-8f60kb, #0f141a)";
270
270
  export var colorTextNotificationSeverityLow = "var(--color-text-notification-severity-low-gvojhi, #0f141a)";
271
271
  export var colorTextNotificationSeverityNeutral = "var(--color-text-notification-severity-neutral-ynm2wl, #f9f9fa)";
272
+ export var colorBorderBadgeSeverityCritical = "var(--color-border-badge-severity-critical-7qfda3, transparent)";
273
+ export var colorBorderBadgeSeverityHigh = "var(--color-border-badge-severity-high-rrj15l, transparent)";
274
+ export var colorBorderBadgeSeverityMedium = "var(--color-border-badge-severity-medium-my5686, transparent)";
275
+ export var colorBorderBadgeSeverityLow = "var(--color-border-badge-severity-low-x8a8mq, transparent)";
276
+ export var colorBorderBadgeSeverityNeutral = "var(--color-border-badge-severity-neutral-qzs2tc, transparent)";
277
+ export var colorTextBadgeSeverityCritical = "var(--color-text-badge-severity-critical-l2utht, #f9f9fa)";
278
+ export var colorTextBadgeSeverityHigh = "var(--color-text-badge-severity-high-ldc6qv, #f9f9fa)";
279
+ export var colorTextBadgeSeverityMedium = "var(--color-text-badge-severity-medium-mqg7v9, #0f141a)";
280
+ export var colorTextBadgeSeverityLow = "var(--color-text-badge-severity-low-nnaksf, #0f141a)";
281
+ export var colorTextBadgeSeverityNeutral = "var(--color-text-badge-severity-neutral-ogr3rw, #f9f9fa)";
272
282
  export var colorGreyOpaque10 = "var(--color-grey-opaque-10-vwfmts, rgba(0, 0, 0, 0.1))";
273
283
  export var colorGreyOpaque25 = "var(--color-grey-opaque-25-cjy3al, rgba(255, 255, 255, 0.25))";
274
284
  export var colorGreyOpaque40 = "var(--color-grey-opaque-40-yj2cvz, rgba(0, 0, 0, 0.4))";
@@ -517,6 +527,7 @@ export var colorTextEmpty = "var(--color-text-empty-tlohug, #656871)";
517
527
  export var colorTextExpandableSectionDefault = "var(--color-text-expandable-section-default-ynw8my, #0f141a)";
518
528
  export var colorTextExpandableSectionHover = "var(--color-text-expandable-section-hover-ojzwhd, #006ce0)";
519
529
  export var colorTextExpandableSectionNavigationIconDefault = "var(--color-text-expandable-section-navigation-icon-default-mklu1s, #424650)";
530
+ export var colorBorderExpandableSectionDefault = "var(--color-border-expandable-section-default-inl8g4, #c6c6cd)";
520
531
  export var colorTextFormDefault = "var(--color-text-form-default-47mtz6, #0f141a)";
521
532
  export var colorTextFormLabel = "var(--color-text-form-label-6sbm75, #0f141a)";
522
533
  export var colorTextFormSecondary = "var(--color-text-form-secondary-1nm780, #656871)";
@@ -600,6 +611,15 @@ export var colorIconActionCardActive = "var(--color-icon-action-card-active-rhp9
600
611
  export var colorIconActionCardDisabled = "var(--color-icon-action-card-disabled-wm3kyf, #b4b4bb)";
601
612
  export var colorBackgroundSkeleton = "var(--color-background-skeleton-sjxg4n, #ebebf0)";
602
613
  export var colorBackgroundSkeletonWave = "var(--color-background-skeleton-wave-1dy97d, #f6f6f9)";
614
+ export var colorBorderBadge = "var(--color-border-badge-un9qea, transparent)";
615
+ export var colorBorderBadgeGrey = "var(--color-border-badge-grey-n3ma6u, transparent)";
616
+ export var colorBorderBadgeGreen = "var(--color-border-badge-green-9thsha, transparent)";
617
+ export var colorBorderBadgeBlue = "var(--color-border-badge-blue-8otq6p, transparent)";
618
+ export var colorBorderBadgeRed = "var(--color-border-badge-red-z936s1, transparent)";
619
+ export var colorTextBadgeGrey = "var(--color-text-badge-grey-5u533n, #f9f9fa)";
620
+ export var colorTextBadgeGreen = "var(--color-text-badge-green-xkzw5d, #f9f9fa)";
621
+ export var colorTextBadgeBlue = "var(--color-text-badge-blue-cq2uzn, #f9f9fa)";
622
+ export var colorTextBadgeRed = "var(--color-text-badge-red-60jprp, #f9f9fa)";
603
623
  export var fontBoxValueLargeWeight = "var(--font-box-value-large-weight-wr00sw, 700)";
604
624
  export var fontButtonLetterSpacing = "var(--font-button-letter-spacing-ufowe3, 0.005em)";
605
625
  export var fontChartDetailSize = "var(--font-chart-detail-size-9qr25q, 12px)";
@@ -607,7 +627,7 @@ export var fontDecorationStyleLink = "var(--font-decoration-style-link-pk2xmp, s
607
627
  export var fontDecorationThicknessLink = "var(--font-decoration-thickness-link-uesuo7, 1px)";
608
628
  export var fontDecorationThicknessLinkDisplayL = "var(--font-decoration-thickness-link-display-l-6g5fyl, 2px)";
609
629
  export var fontDisplayLabelWeight = "var(--font-display-label-weight-zavpeo, 700)";
610
- export var fontExpandableHeadingSize = "var(--font-expandable-heading-size-0uk059, 16px)";
630
+ export var fontSizeExpandableHeading = "var(--font-size-expandable-heading-duh2ta, 16px)";
611
631
  export var fontFamilyBase = "var(--font-family-base-gmnpzl, 'Open Sans', 'Helvetica Neue', Roboto, Arial, sans-serif)";
612
632
  export var fontFamilyDisplay = "var(--font-family-display-a93nj0, 'Open Sans', 'Helvetica Neue', Roboto, Arial, sans-serif)";
613
633
  export var fontFamilyHeading = "var(--font-family-heading-ugphat, 'Open Sans', 'Helvetica Neue', Roboto, Arial, sans-serif)";
@@ -733,9 +753,11 @@ export var borderWidthIconLarge = "var(--border-width-icon-large-u645rg, 4px)";
733
753
  export var borderWidthIconMedium = "var(--border-width-icon-medium-b7icqv, 2px)";
734
754
  export var borderWidthIconNormal = "var(--border-width-icon-normal-9h7vj7, 2px)";
735
755
  export var borderWidthIconSmall = "var(--border-width-icon-small-z55i5t, 2px)";
756
+ export var borderWidthIconXSmall = "var(--border-width-icon-x-small-45lnog, 1.5px)";
736
757
  export var borderWidthItemCard = "var(--border-width-item-card-3wmyp3, 1px)";
737
758
  export var borderWidthItemCardHighlighted = "var(--border-width-item-card-highlighted-jay4ll, 2px)";
738
759
  export var borderWidthItemSelected = "var(--border-width-item-selected-yv93vd, 2px)";
760
+ export var borderWidthBadge = "var(--border-width-badge-7pmgfh, 0px)";
739
761
  export var borderWidthPopover = "var(--border-width-popover-nflirh, 2px)";
740
762
  export var borderWidthToken = "var(--border-width-token-2ukdpu, 2px)";
741
763
  export var motionDurationExtraFast = "var(--motion-duration-extra-fast-l4w48j, 45ms)";