@deephaven/components 0.56.0 → 0.57.0

package/dist/RandomAreaPlotAnimation.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import './RandomAreaPlotAnimation.scss';
-declare const RandomAreaPlotAnimation: React.MemoExoticComponent<() => JSX.Element | null>;
+declare const RandomAreaPlotAnimation: React.MemoExoticComponent<() => JSX.Element>;
 export default RandomAreaPlotAnimation;
 //# sourceMappingURL=RandomAreaPlotAnimation.d.ts.map

package/dist/RandomAreaPlotAnimation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RandomAreaPlotAnimation.d.ts","sourceRoot":"","sources":["../src/RandomAreaPlotAnimation.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAG3D,OAAO,gCAAgC,CAAC;AAmCxC,QAAA,MAAM,uBAAuB,qDAsT3B,CAAC;AAEH,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"RandomAreaPlotAnimation.d.ts","sourceRoot":"","sources":["../src/RandomAreaPlotAnimation.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAGpE,OAAO,gCAAgC,CAAC;AAmCxC,QAAA,MAAM,uBAAuB,8CAuS3B,CAAC;AAEH,eAAe,uBAAuB,CAAC"}

package/dist/RandomAreaPlotAnimation.js

@@ -1,7 +1,7 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 /* eslint-disable react/display-name */
 
-import React, { useEffect, useState, useRef } from 'react';
+import React, { useEffect, useState, useRef, useMemo } from 'react';
 import debounce from 'lodash.debounce';
 import { assertNotNull } from '@deephaven/utils';
 import "./RandomAreaPlotAnimation.css";
@@ -38,14 +38,7 @@ var RandomAreaPlotAnimation = /*#__PURE__*/React.memo(() => {
   var {
     activeThemes
   } = useTheme();
-  var [themeColors, setThemeColors] = useState(null);
-
-  // Resolving css variables has to run in `useEffect` or `useLayoutEffect` so
-  // that we know React has updated the DOM with any styles set by the
-  // ThemeProvider.
-  useEffect(() => {
-    setThemeColors(getRandomAreaPlotAnimationThemeColors());
-  }, [activeThemes]);
+  var themeColors = useMemo(getRandomAreaPlotAnimationThemeColors, [activeThemes]);
   var canvas = useRef(null);
   var container = useRef(null);
   var [shade, setShade] = useState(false);
@@ -75,9 +68,6 @@ var RandomAreaPlotAnimation = /*#__PURE__*/React.memo(() => {
 
   // Returns the background fill create offscreen as pattern
   function createPatternFill() {
-    if (themeColors == null) {
-      return null;
-    }
     var {
       foregroundFill,
       foregroundStroke
@@ -174,9 +164,6 @@ var RandomAreaPlotAnimation = /*#__PURE__*/React.memo(() => {
    */
   function drawCanvas(timestamp) {
     var _lastTimestamp, _lastTimestamp2, _lastTimestamp3;
-    if (themeColors == null) {
-      return;
-    }
     lastTimestamp = (_lastTimestamp = lastTimestamp) !== null && _lastTimestamp !== void 0 ? _lastTimestamp : timestamp;
     var {
       background,
@@ -315,7 +302,7 @@ var RandomAreaPlotAnimation = /*#__PURE__*/React.memo(() => {
       debouncedHandleResize.cancel();
     };
   }, [themeColors]);
-  return themeColors && /*#__PURE__*/_jsx("div", {
+  return /*#__PURE__*/_jsx("div", {
     className: "random-area-plot-animation-container",
     ref: container,
     children: /*#__PURE__*/_jsx("canvas", {

package/dist/RandomAreaPlotAnimation.js.map

@@ -1 +1 @@
-{"version":3,"file":"RandomAreaPlotAnimation.js","names":["React","useEffect","useState","useRef","debounce","assertNotNull","resolveCssVariablesInRecord","useTheme","jsx","_jsx","VOLATILITY","LOW","HIGH","START_Y","GRID_SIZE","PATTERN","SIZE","DOT_SIZE","PX_PER_SECOND","RESIZE_DEBOUNCE","INTERACTION_TIMEOUT","THEME_COLOR_VARIABLES","background","foregroundFill","foregroundStroke","gridColor","getRandomAreaPlotAnimationThemeColors","RandomAreaPlotAnimation","memo","activeThemes","themeColors","setThemeColors","canvas","container","shade","setShade","scale","window","devicePixelRatio","ctx","pattern","width","height","rAF","lastTimestamp","data","setCanvasSize","_ctx","current","offsetWidth","offsetHeight","style","concat","createPatternFill","canvasPattern","document","createElement","contextPattern","getContext","fillStyle","fillRect","createPattern","randomWalk","prev","rand","Math","random","change","abs","initData","startingData","y","x","push","setDataSize","length","pop","drawAreaLine","path","context","beginPath","moveTo","lineTo","i","closePath","drawGridLines","drawCanvas","timestamp","_lastTimestamp","_lastTimestamp2","_lastTimestamp3","lineWidth","strokeStyle","stroke","subPixelMotion","translate","fill","setTransform","_lastTimestamp4","numberOfPoints","floor","shift","cancelAnimationFrame","requestAnimationFrame","debouncedHandleResize","leading","pauseAnimation","resetIdleTimeout","startAnimation","handleActivity","hasFocus","handleResize","_canvas$current","alpha","addEventListener","removeEventListener","cancel","className","ref","children"],"sources":["../src/RandomAreaPlotAnimation.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable react/display-name */\n\nimport React, { useEffect, useState, useRef } from 'react';\nimport debounce from 'lodash.debounce';\nimport { assertNotNull } from '@deephaven/utils';\nimport './RandomAreaPlotAnimation.scss';\nimport { resolveCssVariablesInRecord, useTheme } from './theme';\n\nconst VOLATILITY = 0.025; // how spikey the data gets\nconst LOW = 0.9;\nconst HIGH = 0.1;\nconst START_Y = 0.618;\nconst GRID_SIZE = 80;\nconst PATTERN = { SIZE: 8, DOT_SIZE: 2 };\nconst PX_PER_SECOND = 18;\nconst RESIZE_DEBOUNCE = 250;\nconst INTERACTION_TIMEOUT = 60 * 1000;\n\ninterface ThemeColors {\n  background: string;\n  foregroundFill: string;\n  foregroundStroke: string;\n  gridColor: string;\n}\n\nconst THEME_COLOR_VARIABLES = {\n  background: 'var(--dh-color-random-area-plot-animation-bg)',\n  foregroundFill: 'var(--dh-color-random-area-plot-animation-fg-fill)',\n  foregroundStroke: 'var(--dh-color-random-area-plot-animation-fg-stroke)',\n  gridColor: 'var(--dh-color-random-area-plot-animation-grid)',\n} satisfies ThemeColors;\n\n/**\n * Resolve theme colors needed for our animation.\n */\nfunction getRandomAreaPlotAnimationThemeColors(): ThemeColors {\n  return resolveCssVariablesInRecord(THEME_COLOR_VARIABLES);\n}\n\n// Draw a background canvas, paint it with a fun chart looking animation\nconst RandomAreaPlotAnimation = React.memo(() => {\n  const { activeThemes } = useTheme();\n\n  const [themeColors, setThemeColors] = useState<ThemeColors | null>(null);\n\n  // Resolving css variables has to run in `useEffect` or `useLayoutEffect` so\n  // that we know React has updated the DOM with any styles set by the\n  // ThemeProvider.\n  useEffect(() => {\n    setThemeColors(getRandomAreaPlotAnimationThemeColors());\n  }, [activeThemes]);\n\n  const canvas = useRef<HTMLCanvasElement>(null);\n  const container = useRef<HTMLDivElement>(null);\n  const [shade, setShade] = useState(false);\n  const scale = window.devicePixelRatio;\n\n  let ctx: CanvasRenderingContext2D | null | undefined;\n  let pattern: CanvasPattern | null | undefined;\n  let width: number;\n  let height: number;\n  let rAF: number | null;\n\n  let lastTimestamp: DOMHighResTimeStamp | null | undefined = null;\n  let data: number[] = [];\n\n  function setCanvasSize(): void {\n    // Set canvas size to fill screen\n    if (container.current != null) {\n      width = container.current.offsetWidth;\n      height = container.current.offsetHeight;\n    }\n\n    if (canvas.current != null) {\n      canvas.current.style.width = `${width}px`;\n      canvas.current.style.height = `${height}px`;\n\n      canvas.current.width = width * scale;\n      canvas.current.height = height * scale;\n    }\n\n    ctx?.scale(scale, scale);\n  }\n\n  // Returns the background fill create offscreen as pattern\n  function createPatternFill(): CanvasPattern | null | undefined {\n    if (themeColors == null) {\n      return null;\n    }\n\n    const { foregroundFill, foregroundStroke } = themeColors;\n\n    // create the off-screen canvas\n    const canvasPattern = document.createElement('canvas');\n    canvasPattern.width = PATTERN.SIZE;\n    canvasPattern.height = PATTERN.SIZE;\n    const contextPattern = canvasPattern.getContext('2d');\n\n    // draw pattern to off-screen context\n    if (contextPattern != null) {\n      contextPattern.fillStyle = foregroundStroke;\n      contextPattern.fillRect(0, 0, PATTERN.DOT_SIZE, PATTERN.DOT_SIZE);\n\n      // add an overlay fill\n      contextPattern.fillStyle = foregroundFill;\n      contextPattern.fillRect(0, 0, PATTERN.SIZE, PATTERN.SIZE);\n    }\n    return contextPattern?.createPattern(canvasPattern, 'repeat');\n  }\n\n  /**\n   * Generates a step in a random walk between LOW - HIGH given a previous value\n   * data is always in 0-1 data space so its scaleable\n   * data space is converted to screen space inside draw functions\n   * @param prev previous random walk step\n   * @return new random walk step\n   */\n  function randomWalk(prev: number): number {\n    const rand = Math.random() - 0.5; // give it directionality\n    let change = VOLATILITY * rand; // scale by volatity constant\n\n    // ensure directional bounce off approaching edges\n    if (prev < HIGH) {\n      change = Math.abs(change);\n    } else if (prev > LOW) {\n      change = -Math.abs(change);\n    }\n\n    return prev + change;\n  }\n\n  function initData(): number[] {\n    const startingData = [];\n    let y = START_Y; // always start towards the bottom of the screen\n    for (let x = 0; x < width + PX_PER_SECOND; x += 1) {\n      y = randomWalk(y);\n      startingData.push(y);\n    }\n    return startingData;\n  }\n\n  function setDataSize(): void {\n    while (data.length >= width + PX_PER_SECOND) {\n      data.pop();\n    }\n    while (data.length < width + PX_PER_SECOND) {\n      data.push(randomWalk(data[data.length - 1]));\n    }\n  }\n\n  function drawAreaLine(\n    path: number[],\n    context: CanvasRenderingContext2D\n  ): void {\n    context.beginPath();\n    // start offscreen\n    context.moveTo(-1, height + 1);\n    context.lineTo(-1, height * path[0]);\n\n    // draw the line\n    for (let i = 0; i < path.length; i += 1) {\n      context.lineTo(i, height * path[i]);\n    }\n\n    // close offscreen\n    context.lineTo(width + PX_PER_SECOND, height * path[path.length - 1]);\n    context.lineTo(width + PX_PER_SECOND, height + 1);\n    context.closePath();\n  }\n\n  function drawGridLines(context: CanvasRenderingContext2D): void {\n    context.beginPath();\n    // draw verticals\n    for (let x = 1; x < width; x += GRID_SIZE) {\n      context.moveTo(x, 0);\n      context.lineTo(x, height);\n    }\n    // draw horizontals\n    for (let y = 1; y < height; y += GRID_SIZE) {\n      context.moveTo(0, y);\n      context.lineTo(width, y);\n    }\n  }\n\n  /**\n   * Main draw loop for where the animation happens\n   * all the styling happens within drawCanvas from paths generated by other functions\n   * @param timestamp passed in callback from requestAnimationFrame\n   */\n  function drawCanvas(timestamp?: DOMHighResTimeStamp): void {\n    if (themeColors == null) {\n      return;\n    }\n\n    lastTimestamp = lastTimestamp ?? timestamp;\n\n    const { background, foregroundStroke, gridColor } = themeColors;\n\n    assertNotNull(ctx);\n    // clear the canvas\n    ctx.fillStyle = background;\n    ctx.fillRect(0, 0, width, height);\n\n    drawGridLines(ctx);\n    ctx.lineWidth = 1;\n    ctx.strokeStyle = gridColor;\n    ctx.stroke();\n\n    // for speeds less then 60 px per second, subpixel motion is required to look smooth\n    const subPixelMotion =\n      ((lastTimestamp ?? 0) - (timestamp ?? 0)) / (1000 / PX_PER_SECOND);\n    ctx.translate(subPixelMotion, 0);\n\n    drawAreaLine(data, ctx);\n    ctx.lineWidth = 2;\n    ctx.strokeStyle = foregroundStroke;\n    ctx.stroke();\n\n    ctx.translate(-subPixelMotion, 0); // we don't pattern to shift however\n    if (pattern != null) {\n      ctx.fillStyle = pattern;\n    }\n    ctx.fill();\n    ctx.setTransform(scale, 0, 0, scale, 0, 0); // reset the translate matrix to normal\n\n    // generate new data points\n    if ((timestamp ?? 0) - (lastTimestamp ?? 0) > 1000 / PX_PER_SECOND) {\n      // number of points to add since last update\n      const numberOfPoints = Math.floor(\n        ((timestamp ?? 0) - (lastTimestamp ?? 0)) / (1000 / PX_PER_SECOND)\n      );\n      for (let i = 0; i < numberOfPoints; i += 1) {\n        data.shift();\n        data.push(randomWalk(data[data.length - 1]));\n      }\n      lastTimestamp = timestamp;\n    }\n\n    if (rAF != null) {\n      cancelAnimationFrame(rAF);\n    }\n    rAF = requestAnimationFrame(drawCanvas);\n  }\n\n  // debounce the resize so its not overly aggresive\n  const debouncedHandleResize = debounce(\n    () => {\n      rAF = requestAnimationFrame(timestamp => {\n        setCanvasSize(); // setCanvas can cause lag if not debounced\n\n        // fill or remove extra data points\n        setDataSize();\n\n        // opening devtools triggers a blur then resize,\n        // need to reset shade as we are restarting animation\n        setShade(false);\n        drawCanvas(timestamp);\n      });\n    },\n    RESIZE_DEBOUNCE,\n    { leading: true } // resize immediately, once.\n  );\n\n  function pauseAnimation(): void {\n    // pause animation when browser window is blurred to conserve CPU usage\n    setShade(true);\n    if (rAF != null) {\n      cancelAnimationFrame(rAF);\n    }\n    rAF = null;\n    lastTimestamp = null;\n  }\n\n  // when timeout expires, pause animation\n  const resetIdleTimeout = debounce(() => {\n    pauseAnimation();\n  }, INTERACTION_TIMEOUT);\n\n  function startAnimation(): void {\n    // can fire multiple times, check if rAF is null first\n    // restart animation loop, and fade back in\n    if (rAF == null) {\n      setShade(false);\n      setCanvasSize();\n      setDataSize();\n      rAF = requestAnimationFrame(drawCanvas);\n    }\n    resetIdleTimeout();\n  }\n\n  function handleActivity(): void {\n    if (document.hasFocus()) {\n      // only if document has focus (mousemove can fire on non-focused tabs)\n      startAnimation();\n    }\n  }\n\n  function handleResize(): void {\n    // pause and debounce animation during resize for better resizing performance\n    if (rAF != null) {\n      cancelAnimationFrame(rAF);\n    }\n    resetIdleTimeout(); // treat resizing as a form of activity\n    debouncedHandleResize();\n  }\n\n  // react mount/unmount hooks\n  useEffect(() => {\n    ctx = canvas.current?.getContext('2d', { alpha: false });\n    setCanvasSize();\n    data = initData();\n    pattern = createPatternFill();\n\n    // start draw loop\n    drawCanvas();\n    resetIdleTimeout();\n\n    window.addEventListener('resize', handleResize);\n\n    window.addEventListener('focus', startAnimation);\n    window.addEventListener('blur', pauseAnimation);\n\n    // don't burn cpu if the user is \"idle\", start a timer that resets\n    // on any user activity, and on timeout expiry pause the animation\n    window.addEventListener('mousemove', handleActivity);\n    window.addEventListener('keydown', handleActivity);\n\n    return () => {\n      if (rAF != null) {\n        cancelAnimationFrame(rAF);\n      }\n      window.removeEventListener('resize', handleResize);\n      window.removeEventListener('focus', startAnimation);\n      window.removeEventListener('blur', pauseAnimation);\n\n      window.removeEventListener('mousemove', handleActivity);\n      window.removeEventListener('keydown', handleActivity);\n\n      resetIdleTimeout.cancel();\n      debouncedHandleResize.cancel();\n    };\n  }, [themeColors]);\n\n  return (\n    themeColors && (\n      <div className=\"random-area-plot-animation-container\" ref={container}>\n        <canvas ref={canvas} className={shade ? 'shade' : ''} />\n      </div>\n    )\n  );\n});\n\nexport default RandomAreaPlotAnimation;\n"],"mappings":"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"}
+{"version":3,"file":"RandomAreaPlotAnimation.js","names":["React","useEffect","useState","useRef","useMemo","debounce","assertNotNull","resolveCssVariablesInRecord","useTheme","jsx","_jsx","VOLATILITY","LOW","HIGH","START_Y","GRID_SIZE","PATTERN","SIZE","DOT_SIZE","PX_PER_SECOND","RESIZE_DEBOUNCE","INTERACTION_TIMEOUT","THEME_COLOR_VARIABLES","background","foregroundFill","foregroundStroke","gridColor","getRandomAreaPlotAnimationThemeColors","RandomAreaPlotAnimation","memo","activeThemes","themeColors","canvas","container","shade","setShade","scale","window","devicePixelRatio","ctx","pattern","width","height","rAF","lastTimestamp","data","setCanvasSize","_ctx","current","offsetWidth","offsetHeight","style","concat","createPatternFill","canvasPattern","document","createElement","contextPattern","getContext","fillStyle","fillRect","createPattern","randomWalk","prev","rand","Math","random","change","abs","initData","startingData","y","x","push","setDataSize","length","pop","drawAreaLine","path","context","beginPath","moveTo","lineTo","i","closePath","drawGridLines","drawCanvas","timestamp","_lastTimestamp","_lastTimestamp2","_lastTimestamp3","lineWidth","strokeStyle","stroke","subPixelMotion","translate","fill","setTransform","_lastTimestamp4","numberOfPoints","floor","shift","cancelAnimationFrame","requestAnimationFrame","debouncedHandleResize","leading","pauseAnimation","resetIdleTimeout","startAnimation","handleActivity","hasFocus","handleResize","_canvas$current","alpha","addEventListener","removeEventListener","cancel","className","ref","children"],"sources":["../src/RandomAreaPlotAnimation.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable react/display-name */\n\nimport React, { useEffect, useState, useRef, useMemo } from 'react';\nimport debounce from 'lodash.debounce';\nimport { assertNotNull } from '@deephaven/utils';\nimport './RandomAreaPlotAnimation.scss';\nimport { resolveCssVariablesInRecord, useTheme } from './theme';\n\nconst VOLATILITY = 0.025; // how spikey the data gets\nconst LOW = 0.9;\nconst HIGH = 0.1;\nconst START_Y = 0.618;\nconst GRID_SIZE = 80;\nconst PATTERN = { SIZE: 8, DOT_SIZE: 2 };\nconst PX_PER_SECOND = 18;\nconst RESIZE_DEBOUNCE = 250;\nconst INTERACTION_TIMEOUT = 60 * 1000;\n\ninterface ThemeColors {\n  background: string;\n  foregroundFill: string;\n  foregroundStroke: string;\n  gridColor: string;\n}\n\nconst THEME_COLOR_VARIABLES = {\n  background: 'var(--dh-color-random-area-plot-animation-bg)',\n  foregroundFill: 'var(--dh-color-random-area-plot-animation-fg-fill)',\n  foregroundStroke: 'var(--dh-color-random-area-plot-animation-fg-stroke)',\n  gridColor: 'var(--dh-color-random-area-plot-animation-grid)',\n} satisfies ThemeColors;\n\n/**\n * Resolve theme colors needed for our animation.\n */\nfunction getRandomAreaPlotAnimationThemeColors(): ThemeColors {\n  return resolveCssVariablesInRecord(THEME_COLOR_VARIABLES);\n}\n\n// Draw a background canvas, paint it with a fun chart looking animation\nconst RandomAreaPlotAnimation = React.memo(() => {\n  const { activeThemes } = useTheme();\n\n  const themeColors = useMemo(getRandomAreaPlotAnimationThemeColors, [\n    activeThemes,\n  ]);\n\n  const canvas = useRef<HTMLCanvasElement>(null);\n  const container = useRef<HTMLDivElement>(null);\n  const [shade, setShade] = useState(false);\n  const scale = window.devicePixelRatio;\n\n  let ctx: CanvasRenderingContext2D | null | undefined;\n  let pattern: CanvasPattern | null | undefined;\n  let width: number;\n  let height: number;\n  let rAF: number | null;\n\n  let lastTimestamp: DOMHighResTimeStamp | null | undefined = null;\n  let data: number[] = [];\n\n  function setCanvasSize(): void {\n    // Set canvas size to fill screen\n    if (container.current != null) {\n      width = container.current.offsetWidth;\n      height = container.current.offsetHeight;\n    }\n\n    if (canvas.current != null) {\n      canvas.current.style.width = `${width}px`;\n      canvas.current.style.height = `${height}px`;\n\n      canvas.current.width = width * scale;\n      canvas.current.height = height * scale;\n    }\n\n    ctx?.scale(scale, scale);\n  }\n\n  // Returns the background fill create offscreen as pattern\n  function createPatternFill(): CanvasPattern | null | undefined {\n    const { foregroundFill, foregroundStroke } = themeColors;\n\n    // create the off-screen canvas\n    const canvasPattern = document.createElement('canvas');\n    canvasPattern.width = PATTERN.SIZE;\n    canvasPattern.height = PATTERN.SIZE;\n    const contextPattern = canvasPattern.getContext('2d');\n\n    // draw pattern to off-screen context\n    if (contextPattern != null) {\n      contextPattern.fillStyle = foregroundStroke;\n      contextPattern.fillRect(0, 0, PATTERN.DOT_SIZE, PATTERN.DOT_SIZE);\n\n      // add an overlay fill\n      contextPattern.fillStyle = foregroundFill;\n      contextPattern.fillRect(0, 0, PATTERN.SIZE, PATTERN.SIZE);\n    }\n    return contextPattern?.createPattern(canvasPattern, 'repeat');\n  }\n\n  /**\n   * Generates a step in a random walk between LOW - HIGH given a previous value\n   * data is always in 0-1 data space so its scaleable\n   * data space is converted to screen space inside draw functions\n   * @param prev previous random walk step\n   * @return new random walk step\n   */\n  function randomWalk(prev: number): number {\n    const rand = Math.random() - 0.5; // give it directionality\n    let change = VOLATILITY * rand; // scale by volatity constant\n\n    // ensure directional bounce off approaching edges\n    if (prev < HIGH) {\n      change = Math.abs(change);\n    } else if (prev > LOW) {\n      change = -Math.abs(change);\n    }\n\n    return prev + change;\n  }\n\n  function initData(): number[] {\n    const startingData = [];\n    let y = START_Y; // always start towards the bottom of the screen\n    for (let x = 0; x < width + PX_PER_SECOND; x += 1) {\n      y = randomWalk(y);\n      startingData.push(y);\n    }\n    return startingData;\n  }\n\n  function setDataSize(): void {\n    while (data.length >= width + PX_PER_SECOND) {\n      data.pop();\n    }\n    while (data.length < width + PX_PER_SECOND) {\n      data.push(randomWalk(data[data.length - 1]));\n    }\n  }\n\n  function drawAreaLine(\n    path: number[],\n    context: CanvasRenderingContext2D\n  ): void {\n    context.beginPath();\n    // start offscreen\n    context.moveTo(-1, height + 1);\n    context.lineTo(-1, height * path[0]);\n\n    // draw the line\n    for (let i = 0; i < path.length; i += 1) {\n      context.lineTo(i, height * path[i]);\n    }\n\n    // close offscreen\n    context.lineTo(width + PX_PER_SECOND, height * path[path.length - 1]);\n    context.lineTo(width + PX_PER_SECOND, height + 1);\n    context.closePath();\n  }\n\n  function drawGridLines(context: CanvasRenderingContext2D): void {\n    context.beginPath();\n    // draw verticals\n    for (let x = 1; x < width; x += GRID_SIZE) {\n      context.moveTo(x, 0);\n      context.lineTo(x, height);\n    }\n    // draw horizontals\n    for (let y = 1; y < height; y += GRID_SIZE) {\n      context.moveTo(0, y);\n      context.lineTo(width, y);\n    }\n  }\n\n  /**\n   * Main draw loop for where the animation happens\n   * all the styling happens within drawCanvas from paths generated by other functions\n   * @param timestamp passed in callback from requestAnimationFrame\n   */\n  function drawCanvas(timestamp?: DOMHighResTimeStamp): void {\n    lastTimestamp = lastTimestamp ?? timestamp;\n\n    const { background, foregroundStroke, gridColor } = themeColors;\n\n    assertNotNull(ctx);\n    // clear the canvas\n    ctx.fillStyle = background;\n    ctx.fillRect(0, 0, width, height);\n\n    drawGridLines(ctx);\n    ctx.lineWidth = 1;\n    ctx.strokeStyle = gridColor;\n    ctx.stroke();\n\n    // for speeds less then 60 px per second, subpixel motion is required to look smooth\n    const subPixelMotion =\n      ((lastTimestamp ?? 0) - (timestamp ?? 0)) / (1000 / PX_PER_SECOND);\n    ctx.translate(subPixelMotion, 0);\n\n    drawAreaLine(data, ctx);\n    ctx.lineWidth = 2;\n    ctx.strokeStyle = foregroundStroke;\n    ctx.stroke();\n\n    ctx.translate(-subPixelMotion, 0); // we don't pattern to shift however\n    if (pattern != null) {\n      ctx.fillStyle = pattern;\n    }\n    ctx.fill();\n    ctx.setTransform(scale, 0, 0, scale, 0, 0); // reset the translate matrix to normal\n\n    // generate new data points\n    if ((timestamp ?? 0) - (lastTimestamp ?? 0) > 1000 / PX_PER_SECOND) {\n      // number of points to add since last update\n      const numberOfPoints = Math.floor(\n        ((timestamp ?? 0) - (lastTimestamp ?? 0)) / (1000 / PX_PER_SECOND)\n      );\n      for (let i = 0; i < numberOfPoints; i += 1) {\n        data.shift();\n        data.push(randomWalk(data[data.length - 1]));\n      }\n      lastTimestamp = timestamp;\n    }\n\n    if (rAF != null) {\n      cancelAnimationFrame(rAF);\n    }\n    rAF = requestAnimationFrame(drawCanvas);\n  }\n\n  // debounce the resize so its not overly aggresive\n  const debouncedHandleResize = debounce(\n    () => {\n      rAF = requestAnimationFrame(timestamp => {\n        setCanvasSize(); // setCanvas can cause lag if not debounced\n\n        // fill or remove extra data points\n        setDataSize();\n\n        // opening devtools triggers a blur then resize,\n        // need to reset shade as we are restarting animation\n        setShade(false);\n        drawCanvas(timestamp);\n      });\n    },\n    RESIZE_DEBOUNCE,\n    { leading: true } // resize immediately, once.\n  );\n\n  function pauseAnimation(): void {\n    // pause animation when browser window is blurred to conserve CPU usage\n    setShade(true);\n    if (rAF != null) {\n      cancelAnimationFrame(rAF);\n    }\n    rAF = null;\n    lastTimestamp = null;\n  }\n\n  // when timeout expires, pause animation\n  const resetIdleTimeout = debounce(() => {\n    pauseAnimation();\n  }, INTERACTION_TIMEOUT);\n\n  function startAnimation(): void {\n    // can fire multiple times, check if rAF is null first\n    // restart animation loop, and fade back in\n    if (rAF == null) {\n      setShade(false);\n      setCanvasSize();\n      setDataSize();\n      rAF = requestAnimationFrame(drawCanvas);\n    }\n    resetIdleTimeout();\n  }\n\n  function handleActivity(): void {\n    if (document.hasFocus()) {\n      // only if document has focus (mousemove can fire on non-focused tabs)\n      startAnimation();\n    }\n  }\n\n  function handleResize(): void {\n    // pause and debounce animation during resize for better resizing performance\n    if (rAF != null) {\n      cancelAnimationFrame(rAF);\n    }\n    resetIdleTimeout(); // treat resizing as a form of activity\n    debouncedHandleResize();\n  }\n\n  // react mount/unmount hooks\n  useEffect(() => {\n    ctx = canvas.current?.getContext('2d', { alpha: false });\n    setCanvasSize();\n    data = initData();\n    pattern = createPatternFill();\n\n    // start draw loop\n    drawCanvas();\n    resetIdleTimeout();\n\n    window.addEventListener('resize', handleResize);\n\n    window.addEventListener('focus', startAnimation);\n    window.addEventListener('blur', pauseAnimation);\n\n    // don't burn cpu if the user is \"idle\", start a timer that resets\n    // on any user activity, and on timeout expiry pause the animation\n    window.addEventListener('mousemove', handleActivity);\n    window.addEventListener('keydown', handleActivity);\n\n    return () => {\n      if (rAF != null) {\n        cancelAnimationFrame(rAF);\n      }\n      window.removeEventListener('resize', handleResize);\n      window.removeEventListener('focus', startAnimation);\n      window.removeEventListener('blur', pauseAnimation);\n\n      window.removeEventListener('mousemove', handleActivity);\n      window.removeEventListener('keydown', handleActivity);\n\n      resetIdleTimeout.cancel();\n      debouncedHandleResize.cancel();\n    };\n  }, [themeColors]);\n\n  return (\n    <div className=\"random-area-plot-animation-container\" ref={container}>\n      <canvas ref={canvas} className={shade ? 'shade' : ''} />\n    </div>\n  );\n});\n\nexport default RandomAreaPlotAnimation;\n"],"mappings":"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"}

package/dist/theme/ThemeProvider.d.ts

@@ -12,6 +12,6 @@ export interface ThemeProviderProps {
     themes: ThemeData[] | null;
     children: ReactNode;
 }
-export declare function ThemeProvider({ themes: customThemes, children, }: ThemeProviderProps): JSX.Element;
+export declare function ThemeProvider({ themes: customThemes, children, }: ThemeProviderProps): JSX.Element | null;
 export default ThemeProvider;
 //# sourceMappingURL=ThemeProvider.d.ts.map

package/dist/theme/ThemeProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/theme/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAgC,MAAM,OAAO,CAAC;AAE/E,OAAO,EAA0B,SAAS,EAAE,MAAM,cAAc,CAAC;AAUjE,OAAO,kBAAkB,CAAC;AAE1B,MAAM,WAAW,iBAAiB;IAChC,YAAY,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IACjC,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CACjD;AAID,eAAO,MAAM,YAAY,mDAAgD,CAAC;AAE1E,MAAM,WAAW,kBAAkB;IAMjC,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EAAE,YAAY,EACpB,QAAQ,GACT,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CA4ElC;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/theme/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAgC,MAAM,OAAO,CAAC;AAE/E,OAAO,EAA0B,SAAS,EAAE,MAAM,cAAc,CAAC;AAUjE,OAAO,kBAAkB,CAAC;AAE1B,MAAM,WAAW,iBAAiB;IAChC,YAAY,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IACjC,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,mBAAmB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CACjD;AAID,eAAO,MAAM,YAAY,mDAAgD,CAAC;AAE1E,MAAM,WAAW,kBAAkB;IAMjC,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EAAE,YAAY,EACpB,QAAQ,GACT,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAiFzC;AAED,eAAe,aAAa,CAAC"}

package/dist/theme/ThemeProvider.js

@@ -15,6 +15,7 @@ export function ThemeProvider(_ref) {
     children
   } = _ref;
   var baseThemes = useMemo(() => getDefaultBaseThemes(), []);
+  var [value, setValue] = useState(null);
   var [selectedThemeKey, setSelectedThemeKey] = useState(() => {
     var _getThemePreloadData$, _getThemePreloadData;
     return (_getThemePreloadData$ = (_getThemePreloadData = getThemePreloadData()) === null || _getThemePreloadData === void 0 ? void 0 : _getThemePreloadData.themeKey) !== null && _getThemePreloadData$ !== void 0 ? _getThemePreloadData$ : DEFAULT_DARK_THEME_KEY;
@@ -47,21 +48,25 @@ export function ThemeProvider(_ref) {
       preloadStyleContent
     });
   }, [activeThemes, selectedThemeKey, customThemes]);
-  var value = useMemo(() => ({
-    activeThemes,
-    selectedThemeKey,
-    themes,
-    setSelectedThemeKey
-  }), [activeThemes, selectedThemeKey, themes]);
-  return /*#__PURE__*/_jsxs(ThemeContext.Provider, {
-    value: value,
+  useEffect(() => {
+    setValue({
+      activeThemes,
+      selectedThemeKey,
+      themes,
+      setSelectedThemeKey
+    });
+  }, [activeThemes, selectedThemeKey, themes]);
+  return /*#__PURE__*/_jsxs(_Fragment, {
     children: [activeThemes == null ? null : /*#__PURE__*/_jsx(_Fragment, {
       children: activeThemes.map(theme => /*#__PURE__*/_jsx("style", {
         "data-theme-key": theme.themeKey,
         children: theme.styleContent
       }, theme.themeKey))
-    }), /*#__PURE__*/_jsx(SpectrumThemeProvider, {
-      children: children
+    }), value == null ? null : /*#__PURE__*/_jsx(ThemeContext.Provider, {
+      value: value,
+      children: /*#__PURE__*/_jsx(SpectrumThemeProvider, {
+        children: children
+      })
     })]
   });
 }

package/dist/theme/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","names":["createContext","useEffect","useMemo","useState","Log","DEFAULT_DARK_THEME_KEY","calculatePreloadStyleContent","getActiveThemes","getDefaultBaseThemes","getThemePreloadData","setThemePreloadData","overrideSVGFillColors","SpectrumThemeProvider","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","log","module","ThemeContext","ThemeProvider","_ref","themes","customThemes","children","baseThemes","selectedThemeKey","setSelectedThemeKey","_getThemePreloadData$","_getThemePreloadData","themeKey","activeThemes","base","custom","updateThemePreloadData","preloadStyleContent","debug2","active","map","theme","value","Provider","styleContent"],"sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import { createContext, ReactNode, useEffect, useMemo, useState } from 'react';\nimport Log from '@deephaven/log';\nimport { DEFAULT_DARK_THEME_KEY, ThemeData } from './ThemeModel';\nimport {\n  calculatePreloadStyleContent,\n  getActiveThemes,\n  getDefaultBaseThemes,\n  getThemePreloadData,\n  setThemePreloadData,\n  overrideSVGFillColors,\n} from './ThemeUtils';\nimport { SpectrumThemeProvider } from './SpectrumThemeProvider';\nimport './theme-svg.scss';\n\nexport interface ThemeContextValue {\n  activeThemes: ThemeData[] | null;\n  selectedThemeKey: string;\n  themes: ThemeData[];\n  setSelectedThemeKey: (themeKey: string) => void;\n}\n\nconst log = Log.module('ThemeProvider');\n\nexport const ThemeContext = createContext<ThemeContextValue | null>(null);\n\nexport interface ThemeProviderProps {\n  /*\n   * Additional themes to load in addition to the base themes. If no additional\n   * themes are to be loaded, this must be set to an empty array in order to\n   * tell the provider to activate the base themes.\n   */\n  themes: ThemeData[] | null;\n  children: ReactNode;\n}\n\nexport function ThemeProvider({\n  themes: customThemes,\n  children,\n}: ThemeProviderProps): JSX.Element {\n  const baseThemes = useMemo(() => getDefaultBaseThemes(), []);\n\n  const [selectedThemeKey, setSelectedThemeKey] = useState<string>(\n    () => getThemePreloadData()?.themeKey ?? DEFAULT_DARK_THEME_KEY\n  );\n\n  // Calculate active themes once a non-null themes array is provided.\n  const activeThemes = useMemo(\n    () =>\n      customThemes == null\n        ? null\n        : getActiveThemes(selectedThemeKey, {\n            base: baseThemes,\n            custom: customThemes ?? [],\n          }),\n    [baseThemes, selectedThemeKey, customThemes]\n  );\n\n  const themes = useMemo(\n    () => [...baseThemes, ...(customThemes ?? [])],\n    [baseThemes, customThemes]\n  );\n\n  useEffect(\n    function updateThemePreloadData() {\n      // Don't update preload data until themes have been loaded and activated\n      if (activeThemes == null || customThemes == null) {\n        return;\n      }\n\n      // Override fill color for certain inline SVGs (the originals are provided\n      // by theme-svg.scss)\n      overrideSVGFillColors();\n\n      const preloadStyleContent = calculatePreloadStyleContent();\n\n      log.debug2('updateThemePreloadData:', {\n        active: activeThemes.map(theme => theme.themeKey),\n        custom: customThemes.map(theme => theme.themeKey),\n        preloadStyleContent,\n        selectedThemeKey,\n      });\n\n      setThemePreloadData({\n        themeKey: selectedThemeKey,\n        preloadStyleContent,\n      });\n    },\n    [activeThemes, selectedThemeKey, customThemes]\n  );\n\n  const value = useMemo(\n    () => ({\n      activeThemes,\n      selectedThemeKey,\n      themes,\n      setSelectedThemeKey,\n    }),\n    [activeThemes, selectedThemeKey, themes]\n  );\n\n  return (\n    <ThemeContext.Provider value={value}>\n      {activeThemes == null ? null : (\n        <>\n          {activeThemes.map(theme => (\n            <style data-theme-key={theme.themeKey} key={theme.themeKey}>\n              {theme.styleContent}\n            </style>\n          ))}\n        </>\n      )}\n      <SpectrumThemeProvider>{children}</SpectrumThemeProvider>\n    </ThemeContext.Provider>\n  );\n}\n\nexport default ThemeProvider;\n"],"mappings":"AAAA,SAASA,aAAa,EAAaC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAC9E,OAAOC,GAAG,MAAM,gBAAgB;AAAC,SACxBC,sBAAsB;AAAA,SAE7BC,4BAA4B,EAC5BC,eAAe,EACfC,oBAAoB,EACpBC,mBAAmB,EACnBC,mBAAmB,EACnBC,qBAAqB;AAAA,SAEdC,qBAAqB;AAAA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAU9B,IAAMC,GAAG,GAAGf,GAAG,CAACgB,MAAM,CAAC,eAAe,CAAC;AAEvC,OAAO,IAAMC,YAAY,gBAAGrB,aAAa,CAA2B,IAAI,CAAC;AAYzE,OAAO,SAASsB,aAAaA,CAAAC,IAAA,EAGO;EAAA,IAHN;IAC5BC,MAAM,EAAEC,YAAY;IACpBC;EACkB,CAAC,GAAAH,IAAA;EACnB,IAAMI,UAAU,GAAGzB,OAAO,CAAC,MAAMM,oBAAoB,CAAC,CAAC,EAAE,EAAE,CAAC;EAE5D,IAAM,CAACoB,gBAAgB,EAAEC,mBAAmB,CAAC,GAAG1B,QAAQ,CACtD;IAAA,IAAA2B,qBAAA,EAAAC,oBAAA;IAAA,QAAAD,qBAAA,IAAAC,oBAAA,GAAMtB,mBAAmB,CAAC,CAAC,cAAAsB,oBAAA,uBAArBA,oBAAA,CAAuBC,QAAQ,cAAAF,qBAAA,cAAAA,qBAAA,GAAIzB,sBAAsB;EAAA,CACjE,CAAC;;EAED;EACA,IAAM4B,YAAY,GAAG/B,OAAO,CAC1B,MACEuB,YAAY,IAAI,IAAI,GAChB,IAAI,GACJlB,eAAe,CAACqB,gBAAgB,EAAE;IAChCM,IAAI,EAAEP,UAAU;IAChBQ,MAAM,EAAEV,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAI;EAC1B,CAAC,CAAC,EACR,CAACE,UAAU,EAAEC,gBAAgB,EAAEH,YAAY,CAC7C,CAAC;EAED,IAAMD,MAAM,GAAGtB,OAAO,CACpB,MAAM,CAAC,GAAGyB,UAAU,EAAE,IAAIF,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAI,EAAE,CAAC,CAAC,EAC9C,CAACE,UAAU,EAAEF,YAAY,CAC3B,CAAC;EAEDxB,SAAS,CACP,SAASmC,sBAAsBA,CAAA,EAAG;IAChC;IACA,IAAIH,YAAY,IAAI,IAAI,IAAIR,YAAY,IAAI,IAAI,EAAE;MAChD;IACF;;IAEA;IACA;IACAd,qBAAqB,CAAC,CAAC;IAEvB,IAAM0B,mBAAmB,GAAG/B,4BAA4B,CAAC,CAAC;IAE1Da,GAAG,CAACmB,MAAM,CAAC,yBAAyB,EAAE;MACpCC,MAAM,EAAEN,YAAY,CAACO,GAAG,CAACC,KAAK,IAAIA,KAAK,CAACT,QAAQ,CAAC;MACjDG,MAAM,EAAEV,YAAY,CAACe,GAAG,CAACC,KAAK,IAAIA,KAAK,CAACT,QAAQ,CAAC;MACjDK,mBAAmB;MACnBT;IACF,CAAC,CAAC;IAEFlB,mBAAmB,CAAC;MAClBsB,QAAQ,EAAEJ,gBAAgB;MAC1BS;IACF,CAAC,CAAC;EACJ,CAAC,EACD,CAACJ,YAAY,EAAEL,gBAAgB,EAAEH,YAAY,CAC/C,CAAC;EAED,IAAMiB,KAAK,GAAGxC,OAAO,CACnB,OAAO;IACL+B,YAAY;IACZL,gBAAgB;IAChBJ,MAAM;IACNK;EACF,CAAC,CAAC,EACF,CAACI,YAAY,EAAEL,gBAAgB,EAAEJ,MAAM,CACzC,CAAC;EAED,oBACEN,KAAA,CAACG,YAAY,CAACsB,QAAQ;IAACD,KAAK,EAAEA,KAAM;IAAAhB,QAAA,GACjCO,YAAY,IAAI,IAAI,GAAG,IAAI,gBAC1BnB,IAAA,CAAAE,SAAA;MAAAU,QAAA,EACGO,YAAY,CAACO,GAAG,CAACC,KAAK,iBACrB3B,IAAA;QAAO,kBAAgB2B,KAAK,CAACT,QAAS;QAAAN,QAAA,EACnCe,KAAK,CAACG;MAAY,GADuBH,KAAK,CAACT,QAE3C,CACR;IAAC,CACF,CACH,eACDlB,IAAA,CAACF,qBAAqB;MAAAc,QAAA,EAAEA;IAAQ,CAAwB,CAAC;EAAA,CACpC,CAAC;AAE5B;AAEA,eAAeJ,aAAa"}
+{"version":3,"file":"ThemeProvider.js","names":["createContext","useEffect","useMemo","useState","Log","DEFAULT_DARK_THEME_KEY","calculatePreloadStyleContent","getActiveThemes","getDefaultBaseThemes","getThemePreloadData","setThemePreloadData","overrideSVGFillColors","SpectrumThemeProvider","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","log","module","ThemeContext","ThemeProvider","_ref","themes","customThemes","children","baseThemes","value","setValue","selectedThemeKey","setSelectedThemeKey","_getThemePreloadData$","_getThemePreloadData","themeKey","activeThemes","base","custom","updateThemePreloadData","preloadStyleContent","debug2","active","map","theme","styleContent","Provider"],"sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import { createContext, ReactNode, useEffect, useMemo, useState } from 'react';\nimport Log from '@deephaven/log';\nimport { DEFAULT_DARK_THEME_KEY, ThemeData } from './ThemeModel';\nimport {\n  calculatePreloadStyleContent,\n  getActiveThemes,\n  getDefaultBaseThemes,\n  getThemePreloadData,\n  setThemePreloadData,\n  overrideSVGFillColors,\n} from './ThemeUtils';\nimport { SpectrumThemeProvider } from './SpectrumThemeProvider';\nimport './theme-svg.scss';\n\nexport interface ThemeContextValue {\n  activeThemes: ThemeData[] | null;\n  selectedThemeKey: string;\n  themes: ThemeData[];\n  setSelectedThemeKey: (themeKey: string) => void;\n}\n\nconst log = Log.module('ThemeProvider');\n\nexport const ThemeContext = createContext<ThemeContextValue | null>(null);\n\nexport interface ThemeProviderProps {\n  /*\n   * Additional themes to load in addition to the base themes. If no additional\n   * themes are to be loaded, this must be set to an empty array in order to\n   * tell the provider to activate the base themes.\n   */\n  themes: ThemeData[] | null;\n  children: ReactNode;\n}\n\nexport function ThemeProvider({\n  themes: customThemes,\n  children,\n}: ThemeProviderProps): JSX.Element | null {\n  const baseThemes = useMemo(() => getDefaultBaseThemes(), []);\n\n  const [value, setValue] = useState<ThemeContextValue | null>(null);\n\n  const [selectedThemeKey, setSelectedThemeKey] = useState<string>(\n    () => getThemePreloadData()?.themeKey ?? DEFAULT_DARK_THEME_KEY\n  );\n\n  // Calculate active themes once a non-null themes array is provided.\n  const activeThemes = useMemo(\n    () =>\n      customThemes == null\n        ? null\n        : getActiveThemes(selectedThemeKey, {\n            base: baseThemes,\n            custom: customThemes ?? [],\n          }),\n    [baseThemes, selectedThemeKey, customThemes]\n  );\n\n  const themes = useMemo(\n    () => [...baseThemes, ...(customThemes ?? [])],\n    [baseThemes, customThemes]\n  );\n\n  useEffect(\n    function updateThemePreloadData() {\n      // Don't update preload data until themes have been loaded and activated\n      if (activeThemes == null || customThemes == null) {\n        return;\n      }\n\n      // Override fill color for certain inline SVGs (the originals are provided\n      // by theme-svg.scss)\n      overrideSVGFillColors();\n\n      const preloadStyleContent = calculatePreloadStyleContent();\n\n      log.debug2('updateThemePreloadData:', {\n        active: activeThemes.map(theme => theme.themeKey),\n        custom: customThemes.map(theme => theme.themeKey),\n        preloadStyleContent,\n        selectedThemeKey,\n      });\n\n      setThemePreloadData({\n        themeKey: selectedThemeKey,\n        preloadStyleContent,\n      });\n    },\n    [activeThemes, selectedThemeKey, customThemes]\n  );\n\n  useEffect(() => {\n    setValue({\n      activeThemes,\n      selectedThemeKey,\n      themes,\n      setSelectedThemeKey,\n    });\n  }, [activeThemes, selectedThemeKey, themes]);\n\n  return (\n    <>\n      {activeThemes == null ? null : (\n        <>\n          {activeThemes.map(theme => (\n            <style data-theme-key={theme.themeKey} key={theme.themeKey}>\n              {theme.styleContent}\n            </style>\n          ))}\n        </>\n      )}\n      {value == null ? null : (\n        <ThemeContext.Provider value={value}>\n          <SpectrumThemeProvider>{children}</SpectrumThemeProvider>\n        </ThemeContext.Provider>\n      )}\n    </>\n  );\n}\n\nexport default ThemeProvider;\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deephaven/components",
-  "version": "0.56.0",
+  "version": "0.57.0",
   "description": "Deephaven React component library",
   "author": "Deephaven Data Labs LLC",
   "license": "Apache-2.0",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@adobe/react-spectrum": "^3.29.0",
-    "@deephaven/icons": "^0.56.0",
-    "@deephaven/log": "^0.56.0",
-    "@deephaven/react-hooks": "^0.56.0",
-    "@deephaven/utils": "^0.56.0",
+    "@deephaven/icons": "^0.57.0",
+    "@deephaven/log": "^0.57.0",
+    "@deephaven/react-hooks": "^0.57.0",
+    "@deephaven/utils": "^0.57.0",
     "@fortawesome/fontawesome-svg-core": "^6.2.1",
     "@fortawesome/react-fontawesome": "^0.2.0",
     "@react-spectrum/theme-default": "^3.5.1",
@@ -52,7 +52,7 @@
     "react-dom": "^17.x"
   },
   "devDependencies": {
-    "@deephaven/mocks": "^0.56.0"
+    "@deephaven/mocks": "^0.57.0"
   },
   "files": [
     "dist",
@@ -65,5 +65,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "ce7c33f8f44023b8fa7c60164c1fd88fe049e2ea"
+  "gitHead": "c8a74a2f6e87110710e395115f0f68802b9f7c67"
 }