npm - @cloudscape-design/chart-components - Versions diffs - 1.0.24 → 1.0.26 - Mend

@cloudscape-design/chart-components 1.0.24 → 1.0.26

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 (16) hide show

package/internal/components/chart-legend/index.js +3 -11
package/internal/components/chart-legend/index.js.map +1 -1
package/internal/components/series-details/index.js +3 -2
package/internal/components/series-details/index.js.map +1 -1
package/internal/environment.js +1 -1
package/internal/environment.json +1 -1
package/internal/generated/styles/tokens.js +50 -50
package/internal/generated/theming/index.cjs +732 -152
package/internal/generated/theming/index.cjs.d.ts +2 -1
package/internal/generated/theming/index.d.ts +2 -1
package/internal/generated/theming/index.js +732 -152
package/internal/manifest.json +1 -1
package/internal/utils/dom.d.ts +11 -0
package/internal/utils/dom.js +44 -0
package/internal/utils/dom.js.map +1 -0
package/package.json +1 -1

package/internal/components/chart-legend/index.js CHANGED Viewed

@@ -6,6 +6,7 @@ import clsx from "clsx";
 import { circleIndex, handleKey, KeyCode, SingleTabStopNavigationProvider, useMergeRefs, useSingleTabStopNavigation, } from "@cloudscape-design/component-toolkit/internal";
 import Box from "@cloudscape-design/components/box";
 import { InternalChartTooltip } from "@cloudscape-design/components/internal/do-not-use/chart-tooltip";
+import { scrollIntoViewNearestContainer } from "../../utils/dom";
 import { DebouncedCall } from "../../utils/utils";
 import styles from "./styles.css.js";
 import testClasses from "./test-classes/styles.css.js";
@@ -64,20 +65,11 @@ export const ChartLegend = ({ items, legendTitle, ariaLabel, actions, alignment,
             if (isMouseInContainer.current) {
                 return;
             }
-            const container = containerRef.current;
             const element = (_a = elementsByIndexRef.current) === null || _a === void 0 ? void 0 : _a[highlightedIndex];
-            if (!container || !element) {
+            if (!element) {
                 return;
             }
-            const elementRect = element.getBoundingClientRect();
-            const containerRect = container.getBoundingClientRect();
-            const isVisible = elementRect.top >= containerRect.top && elementRect.bottom <= containerRect.bottom;
-            if (!isVisible) {
-                const elementCenter = elementRect.top + elementRect.height / 2;
-                const containerCenter = containerRect.top + containerRect.height / 2;
-                const top = container.scrollTop + (elementCenter - containerCenter);
-                container.scrollTo({ top, behavior: "smooth" });
-            }
+            scrollIntoViewNearestContainer(element, { behavior: "smooth", scrollMode: "if-needed" });
         }, SCROLL_DELAY);
     }, [items, scrollIntoViewControl]);
     const showHighlight = (itemId) => {

package/internal/components/chart-legend/index.js.map CHANGED Viewed

	@@ -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 { 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_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 className?: string;\n actions?: React.ReactNode;\n someHighlighted: boolean;\n alignment: LegendAlignment;\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 actions,\n alignment,\n className,\n someHighlighted,\n onToggleItem,\n onSelectItem,\n onItemHighlightEnter,\n onItemHighlightExit,\n getTooltipContent,\n horizontalAlignment,\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));\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 container = containerRef.current;\n const element = elementsByIndexRef.current?.[highlightedIndex];\n if (!container \|\| !element) {\n return;\n }\n const elementRect = element.getBoundingClientRect();\n const containerRect = container.getBoundingClientRect();\n const isVisible = elementRect.top >= containerRect.top && elementRect.bottom <= containerRect.bottom;\n if (!isVisible) {\n const elementCenter = elementRect.top + elementRect.height / 2;\n const containerCenter = containerRect.top + containerRect.height / 2;\n const top = container.scrollTop + (elementCenter - containerCenter);\n container.scrollTo({ top, behavior: \"smooth\" });\n }\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 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-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 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_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 className?: string;\n actions?: React.ReactNode;\n someHighlighted: boolean;\n alignment: LegendAlignment;\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 actions,\n alignment,\n className,\n someHighlighted,\n onToggleItem,\n onSelectItem,\n onItemHighlightEnter,\n onItemHighlightExit,\n getTooltipContent,\n horizontalAlignment,\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));\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 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-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 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"]}

package/internal/components/series-details/index.js CHANGED Viewed

@@ -6,6 +6,7 @@ import clsx from "clsx";
 import { useMergeRefs } from "@cloudscape-design/component-toolkit/internal";
 import { InternalExpandableSection } from "@cloudscape-design/components/internal/do-not-use/expandable-section";
 import { getDataAttributes } from "../../base-component/get-data-attributes";
+import { scrollIntoViewNearestContainer } from "../../utils/dom";
 import styles from "./styles.css.js";
 import testClasses from "./test-classes/styles.css.js";
 export default memo(forwardRef(ChartSeriesDetails));
@@ -18,8 +19,8 @@ function ChartSeriesDetails({ details, expandedSeries, setExpandedState, compact
     const isExpanded = (seriesTitle) => !!expandedSeries && expandedSeries.has(seriesTitle);
     const selectedIndex = details.findIndex((d) => d.highlighted);
     useEffect(() => {
-        if (selectedIndex !== -1 && selectedRef.current && "scrollIntoView" in selectedRef.current) {
-            selectedRef.current.scrollIntoView({ behavior: "smooth", block: "center" });
+        if (selectedIndex !== -1 && selectedRef.current) {
+            scrollIntoViewNearestContainer(selectedRef.current, { behavior: "smooth", scrollMode: "always" });
         }
     }, [selectedIndex]);
     return (_jsx("div", { ...baseProps, className: className, ref: mergedRef, children: _jsx("ul", { className: clsx(styles.list, compactList && styles.compact), children: details.map(({ key, value, marker, isDimmed, subItems, expandableId, description, highlighted }, index) => (_jsxs("li", { className: clsx({

package/internal/components/series-details/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/series-details/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, memo, ReactNode, useEffect, useRef } from \"react\";\nimport clsx from \"clsx\";\n\nimport { useMergeRefs } from \"@cloudscape-design/component-toolkit/internal\";\nimport { BaseComponentProps } from \"@cloudscape-design/components/internal/base-component\";\nimport { InternalExpandableSection } from \"@cloudscape-design/components/internal/do-not-use/expandable-section\";\n\nimport { getDataAttributes } from \"../../base-component/get-data-attributes\";\n\nimport styles from \"./styles.css.js\";\nimport testClasses from \"./test-classes/styles.css.js\";\n\ninterface ChartDetailPair {\n key: ReactNode;\n value: ReactNode;\n}\n\ninterface ListItemProps {\n itemKey: ReactNode;\n value: ReactNode;\n subItems?: ReadonlyArray<ChartDetailPair>;\n marker?: React.ReactNode;\n description?: ReactNode;\n}\n\nexport interface ChartSeriesDetailItem extends ChartDetailPair {\n highlighted?: boolean;\n marker?: React.ReactNode;\n isDimmed?: boolean;\n subItems?: ReadonlyArray<ChartDetailPair>;\n expandableId?: string;\n description?: ReactNode;\n}\nexport type ExpandedSeries = Set<string>;\n\ninterface ChartSeriesDetailsProps extends BaseComponentProps {\n details: ReadonlyArray<ChartSeriesDetailItem>;\n expandedSeries?: ExpandedSeries;\n setExpandedState?: (seriesTitle: string, state: boolean) => void;\n compactList?: boolean;\n}\n\nexport default memo(forwardRef(ChartSeriesDetails));\n\nfunction ChartSeriesDetails(\n { details, expandedSeries, setExpandedState, compactList, ...restProps }: ChartSeriesDetailsProps,\n ref: React.Ref<HTMLDivElement>,\n) {\n const baseProps = getDataAttributes(restProps);\n const className = clsx(baseProps.className, styles.root);\n const detailsRef = useRef<HTMLDivElement \| null>(null);\n const mergedRef = useMergeRefs(ref, detailsRef);\n const selectedRef = useRef<HTMLDivElement>(null);\n\n const isExpanded = (seriesTitle: string) => !!expandedSeries && expandedSeries.has(seriesTitle);\n\n const selectedIndex = details.findIndex((d) => d.highlighted);\n useEffect(() => {\n if (selectedIndex !== -1 && selectedRef.current && \"scrollIntoView\" in selectedRef.current) {\n selectedRef.current.scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n }\n }, [selectedIndex]);\n\n return (\n <div {...baseProps} className={className} ref={mergedRef}>\n <ul className={clsx(styles.list, compactList && styles.compact)}>\n {details.map(({ key, value, marker, isDimmed, subItems, expandableId, description, highlighted }, index) => (\n <li\n // Include 'highlighted' in the key to force React re-render when highlight state changes.\n // Without this, the highlight indicator div may not be removed when cursor moves away from data points\n // due to React's reconciliation algorithm not detecting the state change in complex data scenarios.\n // This ensures proper cleanup of visual highlight indicators.\n key={[index, highlighted].join(\"-\")}\n className={clsx({\n [styles.dimmed]: isDimmed,\n [styles[\"list-item\"]]: true,\n [testClasses[\"list-item\"]]: true,\n [styles[\"with-sub-items\"]]: subItems?.length,\n [styles.expandable]: !!expandableId,\n })}\n >\n {details.length > 1 && highlighted ? (\n <div ref={selectedRef} className={styles[\"highlight-indicator\"]}></div>\n ) : null}\n {subItems?.length && !!expandableId ? (\n <ExpandableSeries\n itemKey={key}\n value={value}\n marker={marker}\n description={description}\n subItems={subItems}\n expanded={isExpanded(expandableId)}\n setExpandedState={(state) => setExpandedState && setExpandedState(expandableId, state)}\n />\n ) : (\n <NonExpandableSeries\n itemKey={key}\n value={value}\n marker={marker}\n description={description}\n subItems={subItems}\n />\n )}\n </li>\n ))}\n </ul>\n </div>\n );\n}\n\nfunction SubItems({\n items,\n expandable,\n expanded,\n}: {\n items: ReadonlyArray<ChartDetailPair>;\n expandable?: boolean;\n expanded?: boolean;\n}) {\n return (\n <ul className={clsx(styles[\"sub-items\"], expandable && styles.expandable)}>\n {items.map(({ key, value }, index) => (\n <li\n key={index}\n className={clsx(\n testClasses[\"inner-list-item\"],\n styles[\"inner-list-item\"],\n styles[\"key-value-pair\"],\n (expanded \|\| !expandable) && styles.announced,\n )}\n >\n <span className={clsx(testClasses.key, styles.key)}>{key}</span>\n <span className={clsx(testClasses.value, styles.value)}>{value}</span>\n </li>\n ))}\n </ul>\n );\n}\n\nfunction ExpandableSeries({\n itemKey,\n value,\n subItems,\n marker,\n expanded,\n setExpandedState,\n description,\n}: ListItemProps &\n Required<Pick<ListItemProps, \"subItems\">> & {\n expanded: boolean;\n setExpandedState: (state: boolean) => void;\n }) {\n return (\n <div className={styles[\"expandable-section\"]}>\n {marker}\n <div className={styles[\"full-width\"]}>\n <InternalExpandableSection\n headerText={<span className={clsx(testClasses.key, styles.key)}>{itemKey}</span>}\n headerActions={<span className={clsx(testClasses.value, styles.value, styles.expandable)}>{value}</span>}\n expanded={expanded}\n onChange={({ detail }) => setExpandedState(detail.expanded)}\n variant=\"compact\"\n >\n <SubItems items={subItems} expandable={true} expanded={expanded} />\n </InternalExpandableSection>\n <Details>{description}</Details>\n </div>\n </div>\n );\n}\n\nfunction NonExpandableSeries({ itemKey, value, subItems, marker, description }: ListItemProps) {\n return (\n <>\n <div className={clsx(styles[\"key-value-pair\"], styles.announced)}>\n <div className={clsx(testClasses.key, styles.key)}>\n {marker}\n <span>{itemKey}</span>\n </div>\n <span className={clsx(testClasses.value, styles.value)}>{value}</span>\n </div>\n {subItems && <SubItems items={subItems} />}\n <Details>{description}</Details>\n </>\n );\n}\n\nfunction Details({ children }: { children: ReactNode }) {\n return children ? <div className={clsx(testClasses.description, styles.description)}>{children}</div> : null;\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/series-details/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, memo, ReactNode, useEffect, useRef } from \"react\";\nimport clsx from \"clsx\";\n\nimport { useMergeRefs } from \"@cloudscape-design/component-toolkit/internal\";\nimport { BaseComponentProps } from \"@cloudscape-design/components/internal/base-component\";\nimport { InternalExpandableSection } from \"@cloudscape-design/components/internal/do-not-use/expandable-section\";\n\nimport { getDataAttributes } from \"../../base-component/get-data-attributes\";\nimport { scrollIntoViewNearestContainer } from \"../../utils/dom\";\n\nimport styles from \"./styles.css.js\";\nimport testClasses from \"./test-classes/styles.css.js\";\n\ninterface ChartDetailPair {\n key: ReactNode;\n value: ReactNode;\n}\n\ninterface ListItemProps {\n itemKey: ReactNode;\n value: ReactNode;\n subItems?: ReadonlyArray<ChartDetailPair>;\n marker?: React.ReactNode;\n description?: ReactNode;\n}\n\nexport interface ChartSeriesDetailItem extends ChartDetailPair {\n highlighted?: boolean;\n marker?: React.ReactNode;\n isDimmed?: boolean;\n subItems?: ReadonlyArray<ChartDetailPair>;\n expandableId?: string;\n description?: ReactNode;\n}\nexport type ExpandedSeries = Set<string>;\n\ninterface ChartSeriesDetailsProps extends BaseComponentProps {\n details: ReadonlyArray<ChartSeriesDetailItem>;\n expandedSeries?: ExpandedSeries;\n setExpandedState?: (seriesTitle: string, state: boolean) => void;\n compactList?: boolean;\n}\n\nexport default memo(forwardRef(ChartSeriesDetails));\n\nfunction ChartSeriesDetails(\n { details, expandedSeries, setExpandedState, compactList, ...restProps }: ChartSeriesDetailsProps,\n ref: React.Ref<HTMLDivElement>,\n) {\n const baseProps = getDataAttributes(restProps);\n const className = clsx(baseProps.className, styles.root);\n const detailsRef = useRef<HTMLDivElement \| null>(null);\n const mergedRef = useMergeRefs(ref, detailsRef);\n const selectedRef = useRef<HTMLDivElement>(null);\n\n const isExpanded = (seriesTitle: string) => !!expandedSeries && expandedSeries.has(seriesTitle);\n\n const selectedIndex = details.findIndex((d) => d.highlighted);\n useEffect(() => {\n if (selectedIndex !== -1 && selectedRef.current) {\n scrollIntoViewNearestContainer(selectedRef.current, { behavior: \"smooth\", scrollMode: \"always\" });\n }\n }, [selectedIndex]);\n\n return (\n <div {...baseProps} className={className} ref={mergedRef}>\n <ul className={clsx(styles.list, compactList && styles.compact)}>\n {details.map(({ key, value, marker, isDimmed, subItems, expandableId, description, highlighted }, index) => (\n <li\n // Include 'highlighted' in the key to force React re-render when highlight state changes.\n // Without this, the highlight indicator div may not be removed when cursor moves away from data points\n // due to React's reconciliation algorithm not detecting the state change in complex data scenarios.\n // This ensures proper cleanup of visual highlight indicators.\n key={[index, highlighted].join(\"-\")}\n className={clsx({\n [styles.dimmed]: isDimmed,\n [styles[\"list-item\"]]: true,\n [testClasses[\"list-item\"]]: true,\n [styles[\"with-sub-items\"]]: subItems?.length,\n [styles.expandable]: !!expandableId,\n })}\n >\n {details.length > 1 && highlighted ? (\n <div ref={selectedRef} className={styles[\"highlight-indicator\"]}></div>\n ) : null}\n {subItems?.length && !!expandableId ? (\n <ExpandableSeries\n itemKey={key}\n value={value}\n marker={marker}\n description={description}\n subItems={subItems}\n expanded={isExpanded(expandableId)}\n setExpandedState={(state) => setExpandedState && setExpandedState(expandableId, state)}\n />\n ) : (\n <NonExpandableSeries\n itemKey={key}\n value={value}\n marker={marker}\n description={description}\n subItems={subItems}\n />\n )}\n </li>\n ))}\n </ul>\n </div>\n );\n}\n\nfunction SubItems({\n items,\n expandable,\n expanded,\n}: {\n items: ReadonlyArray<ChartDetailPair>;\n expandable?: boolean;\n expanded?: boolean;\n}) {\n return (\n <ul className={clsx(styles[\"sub-items\"], expandable && styles.expandable)}>\n {items.map(({ key, value }, index) => (\n <li\n key={index}\n className={clsx(\n testClasses[\"inner-list-item\"],\n styles[\"inner-list-item\"],\n styles[\"key-value-pair\"],\n (expanded \|\| !expandable) && styles.announced,\n )}\n >\n <span className={clsx(testClasses.key, styles.key)}>{key}</span>\n <span className={clsx(testClasses.value, styles.value)}>{value}</span>\n </li>\n ))}\n </ul>\n );\n}\n\nfunction ExpandableSeries({\n itemKey,\n value,\n subItems,\n marker,\n expanded,\n setExpandedState,\n description,\n}: ListItemProps &\n Required<Pick<ListItemProps, \"subItems\">> & {\n expanded: boolean;\n setExpandedState: (state: boolean) => void;\n }) {\n return (\n <div className={styles[\"expandable-section\"]}>\n {marker}\n <div className={styles[\"full-width\"]}>\n <InternalExpandableSection\n headerText={<span className={clsx(testClasses.key, styles.key)}>{itemKey}</span>}\n headerActions={<span className={clsx(testClasses.value, styles.value, styles.expandable)}>{value}</span>}\n expanded={expanded}\n onChange={({ detail }) => setExpandedState(detail.expanded)}\n variant=\"compact\"\n >\n <SubItems items={subItems} expandable={true} expanded={expanded} />\n </InternalExpandableSection>\n <Details>{description}</Details>\n </div>\n </div>\n );\n}\n\nfunction NonExpandableSeries({ itemKey, value, subItems, marker, description }: ListItemProps) {\n return (\n <>\n <div className={clsx(styles[\"key-value-pair\"], styles.announced)}>\n <div className={clsx(testClasses.key, styles.key)}>\n {marker}\n <span>{itemKey}</span>\n </div>\n <span className={clsx(testClasses.value, styles.value)}>{value}</span>\n </div>\n {subItems && <SubItems items={subItems} />}\n <Details>{description}</Details>\n </>\n );\n}\n\nfunction Details({ children }: { children: ReactNode }) {\n return children ? <div className={clsx(testClasses.description, styles.description)}>{children}</div> : null;\n}\n"]}

package/internal/environment.js CHANGED Viewed

@@ -1,5 +1,5 @@
 export var PACKAGE_SOURCE = "chart-components";
-export var PACKAGE_VERSION = "1.0.0 (80443d98)";
+export var PACKAGE_VERSION = "1.0.0 (1e9c64fd)";
 export var THEME = "open-source-visual-refresh";
 export var ALWAYS_VISUAL_REFRESH = true;
 export var SYSTEM = "console";

package/internal/environment.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "chart-components",
-  "PACKAGE_VERSION": "1.0.0 (80443d98)",
+  "PACKAGE_VERSION": "1.0.0 (1e9c64fd)",
   "THEME": "open-source-visual-refresh",
   "ALWAYS_VISUAL_REFRESH": true,
   "SYSTEM": "console"

package/internal/generated/styles/tokens.js CHANGED Viewed

@@ -1,53 +1,53 @@
-export var colorPrimary50 = "var(--color-primary-50-td7wvr, #f0fbff)";
-export var colorPrimary100 = "var(--color-primary-100-86rmdj, #d1f1ff)";
-export var colorPrimary200 = "var(--color-primary-200-11ynqt, #b8e7ff)";
-export var colorPrimary300 = "var(--color-primary-300-lyb6yj, #75cfff)";
-export var colorPrimary400 = "var(--color-primary-400-300njg, #42b4ff)";
-export var colorPrimary500 = "var(--color-primary-500-arnr8y, #0099ff)";
-export var colorPrimary600 = "var(--color-primary-600-cd5bf7, #006ce0)";
-export var colorPrimary700 = "var(--color-primary-700-c13hdw, #004a9e)";
-export var colorPrimary800 = "var(--color-primary-800-aqxpib, #003b8f)";
-export var colorPrimary900 = "var(--color-primary-900-w6w555, #002b66)";
-export var colorPrimary1000 = "var(--color-primary-1000-850d3r, #001129)";
-export var colorNeutral50 = "var(--color-neutral-50-5dhhnc, #fcfcfd)";
-export var colorNeutral100 = "var(--color-neutral-100-iyufdc, #f9f9fa)";
-export var colorNeutral150 = "var(--color-neutral-150-vh3b0e, #f6f6f9)";
-export var colorNeutral200 = "var(--color-neutral-200-bp3uln, #f3f3f7)";
-export var colorNeutral250 = "var(--color-neutral-250-8ph6w8, #ebebf0)";
-export var colorNeutral300 = "var(--color-neutral-300-3mh1rj, #dedee3)";
-export var colorNeutral350 = "var(--color-neutral-350-paabud, #c6c6cd)";
-export var colorNeutral400 = "var(--color-neutral-400-1xj0yi, #b4b4bb)";
-export var colorNeutral450 = "var(--color-neutral-450-y9l0a7, #a4a4ad)";
-export var colorNeutral500 = "var(--color-neutral-500-5f8k0v, #8c8c94)";
-export var colorNeutral550 = "var(--color-neutral-550-d3ngta, #72747e)";
-export var colorNeutral600 = "var(--color-neutral-600-y2oro3, #656871)";
-export var colorNeutral650 = "var(--color-neutral-650-zvawvh, #424650)";
-export var colorNeutral700 = "var(--color-neutral-700-ellt94, #333843)";
-export var colorNeutral750 = "var(--color-neutral-750-zdq34i, #232b37)";
-export var colorNeutral800 = "var(--color-neutral-800-o819br, #1b232d)";
-export var colorNeutral850 = "var(--color-neutral-850-p9f55h, #161d26)";
-export var colorNeutral900 = "var(--color-neutral-900-6qrwt3, #131920)";
-export var colorNeutral950 = "var(--color-neutral-950-k8rydl, #0f141a)";
-export var colorNeutral1000 = "var(--color-neutral-1000-vufrw5, #06080a)";
-export var colorError50 = "var(--color-error-50-efsno2, #fff5f5)";
-export var colorError400 = "var(--color-error-400-qzvlg4, #ff7a7a)";
-export var colorError600 = "var(--color-error-600-dy90ln, #db0000)";
-export var colorError900 = "var(--color-error-900-3jrwn3, #700000)";
-export var colorError1000 = "var(--color-error-1000-zjfrpt, #1f0000)";
-export var colorSuccess50 = "var(--color-success-50-541lw0, #effff1)";
-export var colorSuccess500 = "var(--color-success-500-x0vil5, #2bb534)";
-export var colorSuccess600 = "var(--color-success-600-xcd7cp, #00802f)";
-export var colorSuccess1000 = "var(--color-success-1000-ylh1uc, #001401)";
-export var colorWarning50 = "var(--color-warning-50-oz1s9r, #fffef0)";
-export var colorWarning400 = "var(--color-warning-400-yn8er0, #ffe347)";
-export var colorWarning500 = "var(--color-warning-500-fomvs3, #fbd332)";
-export var colorWarning900 = "var(--color-warning-900-ppemwk, #855900)";
-export var colorWarning1000 = "var(--color-warning-1000-uu09m9, #191100)";
-export var colorInfo50 = "var(--color-info-50-2e9qco, #f0fbff)";
-export var colorInfo300 = "var(--color-info-300-8l53sl, #75cfff)";
-export var colorInfo400 = "var(--color-info-400-lytzgp, #42b4ff)";
-export var colorInfo600 = "var(--color-info-600-djf2aw, #006ce0)";
-export var colorInfo1000 = "var(--color-info-1000-zxphnk, #001129)";
+export var colorPrimary50 = "var(--color-primary-50-1y05xv, #f0fbff)";
+export var colorPrimary100 = "var(--color-primary-100-f62fz9, #d1f1ff)";
+export var colorPrimary200 = "var(--color-primary-200-vubr4w, #b8e7ff)";
+export var colorPrimary300 = "var(--color-primary-300-5q65ox, #75cfff)";
+export var colorPrimary400 = "var(--color-primary-400-n8h4bx, #42b4ff)";
+export var colorPrimary500 = "var(--color-primary-500-q9c16y, #0099ff)";
+export var colorPrimary600 = "var(--color-primary-600-1lcy1k, #006ce0)";
+export var colorPrimary700 = "var(--color-primary-700-n6k121, #004a9e)";
+export var colorPrimary800 = "var(--color-primary-800-j9rj38, #003b8f)";
+export var colorPrimary900 = "var(--color-primary-900-a5kqrr, #002b66)";
+export var colorPrimary1000 = "var(--color-primary-1000-7umopx, #001129)";
+export var colorNeutral50 = "var(--color-neutral-50-pvu04n, #fcfcfd)";
+export var colorNeutral100 = "var(--color-neutral-100-gk3lvf, #f9f9fa)";
+export var colorNeutral150 = "var(--color-neutral-150-gezhen, #f6f6f9)";
+export var colorNeutral200 = "var(--color-neutral-200-fqt4tz, #f3f3f7)";
+export var colorNeutral250 = "var(--color-neutral-250-vs1is4, #ebebf0)";
+export var colorNeutral300 = "var(--color-neutral-300-08wi6k, #dedee3)";
+export var colorNeutral350 = "var(--color-neutral-350-dq6kfr, #c6c6cd)";
+export var colorNeutral400 = "var(--color-neutral-400-wtst55, #b4b4bb)";
+export var colorNeutral450 = "var(--color-neutral-450-kn0235, #a4a4ad)";
+export var colorNeutral500 = "var(--color-neutral-500-8van0b, #8c8c94)";
+export var colorNeutral550 = "var(--color-neutral-550-z2a44u, #72747e)";
+export var colorNeutral600 = "var(--color-neutral-600-fln1ww, #656871)";
+export var colorNeutral650 = "var(--color-neutral-650-miik4f, #424650)";
+export var colorNeutral700 = "var(--color-neutral-700-qw8ats, #333843)";
+export var colorNeutral750 = "var(--color-neutral-750-pi9qqd, #232b37)";
+export var colorNeutral800 = "var(--color-neutral-800-t7j5ap, #1b232d)";
+export var colorNeutral850 = "var(--color-neutral-850-3f0gro, #161d26)";
+export var colorNeutral900 = "var(--color-neutral-900-v0mtoc, #131920)";
+export var colorNeutral950 = "var(--color-neutral-950-lxybh8, #0f141a)";
+export var colorNeutral1000 = "var(--color-neutral-1000-7ovvlt, #06080a)";
+export var colorError50 = "var(--color-error-50-1upkvz, #fff5f5)";
+export var colorError400 = "var(--color-error-400-c0knb8, #ff7a7a)";
+export var colorError600 = "var(--color-error-600-mdn3ng, #db0000)";
+export var colorError900 = "var(--color-error-900-skonp1, #700000)";
+export var colorError1000 = "var(--color-error-1000-ecmudm, #1f0000)";
+export var colorSuccess50 = "var(--color-success-50-yow9uc, #effff1)";
+export var colorSuccess500 = "var(--color-success-500-hhxb4g, #2bb534)";
+export var colorSuccess600 = "var(--color-success-600-g7hz2i, #00802f)";
+export var colorSuccess1000 = "var(--color-success-1000-xy1gvq, #001401)";
+export var colorWarning50 = "var(--color-warning-50-uxheb8, #fffef0)";
+export var colorWarning400 = "var(--color-warning-400-55puga, #ffe347)";
+export var colorWarning500 = "var(--color-warning-500-zidhub, #fbd332)";
+export var colorWarning900 = "var(--color-warning-900-kpxt8c, #855900)";
+export var colorWarning1000 = "var(--color-warning-1000-65l070, #191100)";
+export var colorInfo50 = "var(--color-info-50-cdvtrs, #f0fbff)";
+export var colorInfo300 = "var(--color-info-300-q9xd1l, #75cfff)";
+export var colorInfo400 = "var(--color-info-400-674xac, #42b4ff)";
+export var colorInfo600 = "var(--color-info-600-un21zh, #006ce0)";
+export var colorInfo1000 = "var(--color-info-1000-s77ok9, #001129)";
 export var colorGrey50 = "var(--color-grey-50-mhbfod, #fcfcfd)";
 export var colorGrey100 = "var(--color-grey-100-2sczed, #f9f9fa)";
 export var colorGrey150 = "var(--color-grey-150-znah9n, #f6f6f9)";