@deephaven/components 1.22.1-alpha-pivot-builder.0 → 1.22.2-alpha-pivot-builder.0

package/dist/RandomAreaPlotAnimation.js.map

@@ -1 +1 @@
-{"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","lineWidth","strokeStyle","stroke","subPixelMotion","translate","fill","setTransform","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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","ignoreList":[]}
+{"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","_useTheme","activeThemes","themeColors","canvas","container","_useState","_useState2","_slicedToArray","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","lineWidth","strokeStyle","stroke","subPixelMotion","translate","fill","setTransform","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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","ignoreList":[]}

package/dist/SearchInput.js

@@ -41,20 +41,19 @@ class SearchInput extends PureComponent {
     }
   }
   render() {
-    var {
-      value,
-      placeholder,
-      endPlaceholder,
-      onBlur,
-      onChange,
-      className,
-      disabled,
-      matchCount,
-      id,
-      onKeyDown,
-      'data-testid': dataTestId,
-      cursor
-    } = this.props;
+    var _this$props = this.props,
+      value = _this$props.value,
+      placeholder = _this$props.placeholder,
+      endPlaceholder = _this$props.endPlaceholder,
+      onBlur = _this$props.onBlur,
+      onChange = _this$props.onChange,
+      className = _this$props.className,
+      disabled = _this$props.disabled,
+      matchCount = _this$props.matchCount,
+      id = _this$props.id,
+      onKeyDown = _this$props.onKeyDown,
+      dataTestId = _this$props['data-testid'],
+      cursor = _this$props.cursor;
     var matchCountSection;
     var contextActions = [{
       action: () => cursor === null || cursor === void 0 ? void 0 : cursor.next('forward'),

package/dist/SearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.js","names":["React","PureComponent","FontAwesomeIcon","vsArrowLeft","vsArrowRight","vsSearch","classNames","Button","GLOBAL_SHORTCUTS","ContextActions","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","SearchInput","constructor","props","_defineProperty","inputField","createRef","searchChangeSelection","componentDidMount","setInputPaddingRight","componentDidUpdate","focus","_this$inputField$curr","current","select","_this$inputField$curr2","paddingRight","getBoundingClientRect","width","style","concat","render","value","placeholder","endPlaceholder","onBlur","onChange","className","disabled","matchCount","id","onKeyDown","dataTestId","cursor","matchCountSection","contextActions","action","next","shortcut","NEXT","PREVIOUS","children","kind","type","onClick","icon","tooltip","getDisplayText","index","undefined","ref","actions"],"sources":["../src/SearchInput.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsArrowLeft, vsArrowRight, vsSearch } from '@deephaven/icons';\nimport classNames from 'classnames';\nimport Button from './Button';\nimport './SearchInput.scss';\nimport { GLOBAL_SHORTCUTS } from './shortcuts';\nimport { ContextActions } from './context-actions';\n\ninterface SearchInputProps {\n  value: string;\n  placeholder: string;\n  /** Placeholder text shown on the right side of the input when empty */\n  endPlaceholder?: string;\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  onChange: React.ChangeEventHandler<HTMLInputElement>;\n  onKeyDown: React.KeyboardEventHandler<HTMLInputElement>;\n  className: string;\n  disabled?: boolean;\n  /** Number of search matches, displayed at the end of the search field. */\n  matchCount: number;\n  id: string;\n  'data-testid'?: string;\n  cursor?: {\n    index: number | undefined;\n    next: (direction: 'forward' | 'back') => void;\n  };\n}\n\nclass SearchInput extends PureComponent<SearchInputProps> {\n  static defaultProps = {\n    placeholder: 'Search',\n    className: '',\n    matchCount: null,\n    onKeyDown(): void {\n      // no-op\n    },\n    id: '',\n    'data-testid': undefined,\n    cursor: undefined,\n  };\n\n  constructor(props: SearchInputProps) {\n    super(props);\n    this.inputField = React.createRef();\n    this.searchChangeSelection = React.createRef();\n  }\n\n  componentDidMount(): void {\n    this.setInputPaddingRight();\n  }\n\n  componentDidUpdate(): void {\n    this.setInputPaddingRight();\n  }\n\n  focus(): void {\n    this.inputField.current?.focus();\n  }\n\n  select(): void {\n    this.inputField.current?.select();\n  }\n\n  inputField: React.RefObject<HTMLInputElement>;\n\n  searchChangeSelection: React.RefObject<HTMLDivElement>;\n\n  setInputPaddingRight(): void {\n    const inputField = this.inputField.current;\n    const searchChangeSelection = this.searchChangeSelection.current;\n    if (inputField && searchChangeSelection) {\n      const paddingRight = searchChangeSelection.getBoundingClientRect().width;\n      inputField.style.paddingRight = `${paddingRight}px`;\n    }\n  }\n\n  render(): JSX.Element {\n    const {\n      value,\n      placeholder,\n      endPlaceholder,\n      onBlur,\n      onChange,\n      className,\n      disabled,\n      matchCount,\n      id,\n      onKeyDown,\n      'data-testid': dataTestId,\n      cursor,\n    } = this.props;\n\n    let matchCountSection;\n    const contextActions = [\n      {\n        action: () => cursor?.next('forward'),\n        shortcut: GLOBAL_SHORTCUTS.NEXT,\n      },\n      {\n        action: () => cursor?.next('back'),\n        shortcut: GLOBAL_SHORTCUTS.PREVIOUS,\n      },\n    ];\n\n    if (cursor && matchCount > 1) {\n      matchCountSection = (\n        <>\n          <Button\n            kind=\"ghost\"\n            className=\"search-change-button\"\n            type=\"button\"\n            onClick={() => {\n              cursor.next('back');\n            }}\n            icon={vsArrowLeft}\n            tooltip={`Previous match (${GLOBAL_SHORTCUTS.PREVIOUS.getDisplayText()})`}\n          />\n          <span className=\"search-change-text\">\n            {cursor.index !== undefined && `${cursor.index + 1} of `}\n            {matchCount}\n          </span>\n          <Button\n            kind=\"ghost\"\n            className=\"search-change-button\"\n            type=\"button\"\n            onClick={() => {\n              cursor.next('forward');\n            }}\n            icon={vsArrowRight}\n            tooltip={`Next match (${GLOBAL_SHORTCUTS.NEXT.getDisplayText()})`}\n          />\n        </>\n      );\n    } else {\n      matchCountSection = matchCount > 0 && (\n        <span className=\"search-match\">{matchCount}</span>\n      );\n    }\n\n    return (\n      <div className={classNames('search-group', className)}>\n        <input\n          type=\"search\"\n          value={value}\n          onBlur={onBlur}\n          onChange={onChange}\n          onKeyDown={onKeyDown}\n          className=\"form-control\"\n          disabled={disabled}\n          placeholder={placeholder}\n          ref={this.inputField}\n          id={id}\n          data-testid={dataTestId}\n        />\n\n        {matchCount != null ? (\n          <>\n            <div\n              className=\"search-change-selection\"\n              ref={this.searchChangeSelection}\n            >\n              {matchCountSection}\n            </div>\n            <ContextActions actions={contextActions} />\n          </>\n        ) : (\n          <span className=\"search-end-content\">\n            {(endPlaceholder ?? '') !== '' && value === '' && (\n              <span className=\"search-end-placeholder\">{endPlaceholder}</span>\n            )}\n            <FontAwesomeIcon icon={vsSearch} />\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n\nexport default SearchInput;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SearchInput.js","names":["React","PureComponent","FontAwesomeIcon","vsArrowLeft","vsArrowRight","vsSearch","classNames","Button","GLOBAL_SHORTCUTS","ContextActions","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","SearchInput","constructor","props","_defineProperty","inputField","createRef","searchChangeSelection","componentDidMount","setInputPaddingRight","componentDidUpdate","focus","_this$inputField$curr","current","select","_this$inputField$curr2","paddingRight","getBoundingClientRect","width","style","concat","render","_this$props","value","placeholder","endPlaceholder","onBlur","onChange","className","disabled","matchCount","id","onKeyDown","dataTestId","cursor","matchCountSection","contextActions","action","next","shortcut","NEXT","PREVIOUS","children","kind","type","onClick","icon","tooltip","getDisplayText","index","undefined","ref","actions"],"sources":["../src/SearchInput.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsArrowLeft, vsArrowRight, vsSearch } from '@deephaven/icons';\nimport classNames from 'classnames';\nimport Button from './Button';\nimport './SearchInput.scss';\nimport { GLOBAL_SHORTCUTS } from './shortcuts';\nimport { ContextActions } from './context-actions';\n\ninterface SearchInputProps {\n  value: string;\n  placeholder: string;\n  /** Placeholder text shown on the right side of the input when empty */\n  endPlaceholder?: string;\n  onBlur?: React.FocusEventHandler<HTMLInputElement>;\n  onChange: React.ChangeEventHandler<HTMLInputElement>;\n  onKeyDown: React.KeyboardEventHandler<HTMLInputElement>;\n  className: string;\n  disabled?: boolean;\n  /** Number of search matches, displayed at the end of the search field. */\n  matchCount: number;\n  id: string;\n  'data-testid'?: string;\n  cursor?: {\n    index: number | undefined;\n    next: (direction: 'forward' | 'back') => void;\n  };\n}\n\nclass SearchInput extends PureComponent<SearchInputProps> {\n  static defaultProps = {\n    placeholder: 'Search',\n    className: '',\n    matchCount: null,\n    onKeyDown(): void {\n      // no-op\n    },\n    id: '',\n    'data-testid': undefined,\n    cursor: undefined,\n  };\n\n  constructor(props: SearchInputProps) {\n    super(props);\n    this.inputField = React.createRef();\n    this.searchChangeSelection = React.createRef();\n  }\n\n  componentDidMount(): void {\n    this.setInputPaddingRight();\n  }\n\n  componentDidUpdate(): void {\n    this.setInputPaddingRight();\n  }\n\n  focus(): void {\n    this.inputField.current?.focus();\n  }\n\n  select(): void {\n    this.inputField.current?.select();\n  }\n\n  inputField: React.RefObject<HTMLInputElement>;\n\n  searchChangeSelection: React.RefObject<HTMLDivElement>;\n\n  setInputPaddingRight(): void {\n    const inputField = this.inputField.current;\n    const searchChangeSelection = this.searchChangeSelection.current;\n    if (inputField && searchChangeSelection) {\n      const paddingRight = searchChangeSelection.getBoundingClientRect().width;\n      inputField.style.paddingRight = `${paddingRight}px`;\n    }\n  }\n\n  render(): JSX.Element {\n    const {\n      value,\n      placeholder,\n      endPlaceholder,\n      onBlur,\n      onChange,\n      className,\n      disabled,\n      matchCount,\n      id,\n      onKeyDown,\n      'data-testid': dataTestId,\n      cursor,\n    } = this.props;\n\n    let matchCountSection;\n    const contextActions = [\n      {\n        action: () => cursor?.next('forward'),\n        shortcut: GLOBAL_SHORTCUTS.NEXT,\n      },\n      {\n        action: () => cursor?.next('back'),\n        shortcut: GLOBAL_SHORTCUTS.PREVIOUS,\n      },\n    ];\n\n    if (cursor && matchCount > 1) {\n      matchCountSection = (\n        <>\n          <Button\n            kind=\"ghost\"\n            className=\"search-change-button\"\n            type=\"button\"\n            onClick={() => {\n              cursor.next('back');\n            }}\n            icon={vsArrowLeft}\n            tooltip={`Previous match (${GLOBAL_SHORTCUTS.PREVIOUS.getDisplayText()})`}\n          />\n          <span className=\"search-change-text\">\n            {cursor.index !== undefined && `${cursor.index + 1} of `}\n            {matchCount}\n          </span>\n          <Button\n            kind=\"ghost\"\n            className=\"search-change-button\"\n            type=\"button\"\n            onClick={() => {\n              cursor.next('forward');\n            }}\n            icon={vsArrowRight}\n            tooltip={`Next match (${GLOBAL_SHORTCUTS.NEXT.getDisplayText()})`}\n          />\n        </>\n      );\n    } else {\n      matchCountSection = matchCount > 0 && (\n        <span className=\"search-match\">{matchCount}</span>\n      );\n    }\n\n    return (\n      <div className={classNames('search-group', className)}>\n        <input\n          type=\"search\"\n          value={value}\n          onBlur={onBlur}\n          onChange={onChange}\n          onKeyDown={onKeyDown}\n          className=\"form-control\"\n          disabled={disabled}\n          placeholder={placeholder}\n          ref={this.inputField}\n          id={id}\n          data-testid={dataTestId}\n        />\n\n        {matchCount != null ? (\n          <>\n            <div\n              className=\"search-change-selection\"\n              ref={this.searchChangeSelection}\n            >\n              {matchCountSection}\n            </div>\n            <ContextActions actions={contextActions} />\n          </>\n        ) : (\n          <span className=\"search-end-content\">\n            {(endPlaceholder ?? '') !== '' && value === '' && (\n              <span className=\"search-end-placeholder\">{endPlaceholder}</span>\n            )}\n            <FontAwesomeIcon icon={vsSearch} />\n          </span>\n        )}\n      </div>\n    );\n  }\n}\n\nexport default SearchInput;\n"],"mappings":"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","ignoreList":[]}

package/dist/SearchableCombobox.js

@@ -12,11 +12,9 @@ import { SpectrumComboBox, Item } from "./spectrum/index.js";
 import TextWithTooltip from "./TextWithTooltip.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export function SearchableCombobox(_ref) {
-  var {
-      scrollRef,
-      getItemDisplayText,
-      getKey
-    } = _ref,
+  var scrollRef = _ref.scrollRef,
+    getItemDisplayText = _ref.getItemDisplayText,
+    getKey = _ref.getKey,
     props = _objectWithoutProperties(_ref, _excluded);
   var renderItem = useCallback(item => {
     var key = getKey(item);

package/dist/SearchableCombobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchableCombobox.js","names":["useCallback","SpectrumComboBox","Item","TextWithTooltip","jsx","_jsx","SearchableCombobox","_ref","scrollRef","getItemDisplayText","getKey","props","_objectWithoutProperties","_excluded","renderItem","item","key","displayText","textValue","String","children","text","_objectSpread","ref","menuTrigger","onSelectionChange"],"sources":["../src/SearchableCombobox.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { type Key, useCallback } from 'react';\nimport type { DOMRefValue, FocusableRef } from '@react-types/shared';\nimport { SpectrumComboBox, Item, type SpectrumComboBoxProps } from './spectrum';\nimport TextWithTooltip from './TextWithTooltip';\n\nexport interface SearchableComboboxProps<TItem, TKey extends Key>\n  extends Omit<\n    SpectrumComboBoxProps<TItem>,\n    'children' | 'menuTrigger' | 'onSelectionChange'\n  > {\n  getItemDisplayText: (item: TItem | null | undefined) => string | null;\n  getKey: (item: TItem | null | undefined) => TKey | null;\n  scrollRef: React.RefObject<DOMRefValue>;\n  onSelectionChange: (key: TKey | null) => void;\n}\n\nexport function SearchableCombobox<TItem, TKey extends Key>({\n  scrollRef,\n  getItemDisplayText,\n  getKey,\n  ...props\n}: SearchableComboboxProps<TItem, TKey>): JSX.Element {\n  const renderItem = useCallback(\n    (item: TItem) => {\n      const key = getKey(item);\n      const displayText = getItemDisplayText(item);\n\n      return (\n        <Item key={key} textValue={displayText ?? String(key)}>\n          <TextWithTooltip text={displayText} />\n        </Item>\n      );\n    },\n    [getItemDisplayText, getKey]\n  );\n\n  return (\n    <SpectrumComboBox\n      {...props}\n      // The `ref`prop type defined by React Spectrum is incorrect here\n      ref={scrollRef as unknown as FocusableRef<HTMLElement>}\n      menuTrigger=\"focus\"\n      // Type assertion is necessary since <ComboBox> types don't recognize the\n      // generic key arg\n      onSelectionChange={props.onSelectionChange as (key: Key | null) => void}\n    >\n      {renderItem}\n    </SpectrumComboBox>\n  );\n}\n\nexport default SearchableCombobox;\n"],"mappings":";;;;;;;;AAAA;AACA,SAAmBA,WAAW,QAAQ,OAAO;AAAC,SAErCC,gBAAgB,EAAEC,IAAI;AAAA,OACxBC,eAAe;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAatB,OAAO,SAASC,kBAAkBA,CAAAC,IAAA,EAKoB;EAAA,IALM;MAC1DC,SAAS;MACTC,kBAAkB;MAClBC;IAEoC,CAAC,GAAAH,IAAA;IADlCI,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAER,IAAMC,UAAU,GAAGd,WAAW,CAC3Be,IAAW,IAAK;IACf,IAAMC,GAAG,GAAGN,MAAM,CAACK,IAAI,CAAC;IACxB,IAAME,WAAW,GAAGR,kBAAkB,CAACM,IAAI,CAAC;IAE5C,oBACEV,IAAA,CAACH,IAAI;MAAWgB,SAAS,EAAED,WAAW,aAAXA,WAAW,cAAXA,WAAW,GAAIE,MAAM,CAACH,GAAG,CAAE;MAAAI,QAAA,eACpDf,IAAA,CAACF,eAAe;QAACkB,IAAI,EAAEJ;MAAY,CAAE;IAAC,GAD7BD,GAEL,CAAC;EAEX,CAAC,EACD,CAACP,kBAAkB,EAAEC,MAAM,CAC7B,CAAC;EAED,oBACEL,IAAA,CAACJ,gBAAgB,EAAAqB,aAAA,CAAAA,aAAA,KACXX,KAAK;IACT;IACAY,GAAG,EAAEf,SAAkD;IACvDgB,WAAW,EAAC;IACZ;IACA;IAAA;IACAC,iBAAiB,EAAEd,KAAK,CAACc,iBAA+C;IAAAL,QAAA,EAEvEN;EAAU,EACK,CAAC;AAEvB;AAEA,eAAeR,kBAAkB","ignoreList":[]}
+{"version":3,"file":"SearchableCombobox.js","names":["useCallback","SpectrumComboBox","Item","TextWithTooltip","jsx","_jsx","SearchableCombobox","_ref","scrollRef","getItemDisplayText","getKey","props","_objectWithoutProperties","_excluded","renderItem","item","key","displayText","textValue","String","children","text","_objectSpread","ref","menuTrigger","onSelectionChange"],"sources":["../src/SearchableCombobox.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { type Key, useCallback } from 'react';\nimport type { DOMRefValue, FocusableRef } from '@react-types/shared';\nimport { SpectrumComboBox, Item, type SpectrumComboBoxProps } from './spectrum';\nimport TextWithTooltip from './TextWithTooltip';\n\nexport interface SearchableComboboxProps<TItem, TKey extends Key>\n  extends Omit<\n    SpectrumComboBoxProps<TItem>,\n    'children' | 'menuTrigger' | 'onSelectionChange'\n  > {\n  getItemDisplayText: (item: TItem | null | undefined) => string | null;\n  getKey: (item: TItem | null | undefined) => TKey | null;\n  scrollRef: React.RefObject<DOMRefValue>;\n  onSelectionChange: (key: TKey | null) => void;\n}\n\nexport function SearchableCombobox<TItem, TKey extends Key>({\n  scrollRef,\n  getItemDisplayText,\n  getKey,\n  ...props\n}: SearchableComboboxProps<TItem, TKey>): JSX.Element {\n  const renderItem = useCallback(\n    (item: TItem) => {\n      const key = getKey(item);\n      const displayText = getItemDisplayText(item);\n\n      return (\n        <Item key={key} textValue={displayText ?? String(key)}>\n          <TextWithTooltip text={displayText} />\n        </Item>\n      );\n    },\n    [getItemDisplayText, getKey]\n  );\n\n  return (\n    <SpectrumComboBox\n      {...props}\n      // The `ref`prop type defined by React Spectrum is incorrect here\n      ref={scrollRef as unknown as FocusableRef<HTMLElement>}\n      menuTrigger=\"focus\"\n      // Type assertion is necessary since <ComboBox> types don't recognize the\n      // generic key arg\n      onSelectionChange={props.onSelectionChange as (key: Key | null) => void}\n    >\n      {renderItem}\n    </SpectrumComboBox>\n  );\n}\n\nexport default SearchableCombobox;\n"],"mappings":";;;;;;;;AAAA;AACA,SAAmBA,WAAW,QAAQ,OAAO;AAAC,SAErCC,gBAAgB,EAAEC,IAAI;AAAA,OACxBC,eAAe;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAatB,OAAO,SAASC,kBAAkBA,CAAAC,IAAA,EAKoB;EAAA,IAJpDC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,kBAAkB,GAAAF,IAAA,CAAlBE,kBAAkB;IAClBC,MAAM,GAAAH,IAAA,CAANG,MAAM;IACHC,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAER,IAAMC,UAAU,GAAGd,WAAW,CAC3Be,IAAW,IAAK;IACf,IAAMC,GAAG,GAAGN,MAAM,CAACK,IAAI,CAAC;IACxB,IAAME,WAAW,GAAGR,kBAAkB,CAACM,IAAI,CAAC;IAE5C,oBACEV,IAAA,CAACH,IAAI;MAAWgB,SAAS,EAAED,WAAW,aAAXA,WAAW,cAAXA,WAAW,GAAIE,MAAM,CAACH,GAAG,CAAE;MAAAI,QAAA,eACpDf,IAAA,CAACF,eAAe;QAACkB,IAAI,EAAEJ;MAAY,CAAE;IAAC,GAD7BD,GAEL,CAAC;EAEX,CAAC,EACD,CAACP,kBAAkB,EAAEC,MAAM,CAC7B,CAAC;EAED,oBACEL,IAAA,CAACJ,gBAAgB,EAAAqB,aAAA,CAAAA,aAAA,KACXX,KAAK;IACT;IACAY,GAAG,EAAEf,SAAkD;IACvDgB,WAAW,EAAC;IACZ;IACA;IAAA;IACAC,iBAAiB,EAAEd,KAAK,CAACc,iBAA+C;IAAAL,QAAA,EAEvEN;EAAU,EACK,CAAC;AAEvB;AAEA,eAAeR,kBAAkB","ignoreList":[]}

package/dist/Select.js

@@ -17,13 +17,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
  */
 
 var Select = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
-  var {
-      children,
-      className,
-      isInvalid,
-      onChange,
-      'data-testid': dataTestId
-    } = props,
+  var children = props.children,
+    className = props.className,
+    isInvalid = props.isInvalid,
+    onChange = props.onChange,
+    dataTestId = props['data-testid'],
     rest = _objectWithoutProperties(props, _excluded);
   var ref = useForwardedRef(forwardedRef);
   var handleChange = useCallback(event => {

package/dist/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","names":["React","useCallback","classNames","useForwardedRef","jsx","_jsx","Select","forwardRef","props","forwardedRef","children","className","isInvalid","onChange","dataTestId","rest","_objectWithoutProperties","_excluded","ref","handleChange","event","target","value","_objectSpread","displayName"],"sources":["../src/Select.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport classNames from 'classnames';\nimport { useForwardedRef } from '@deephaven/react-hooks';\n\ntype baseSelectProps = Omit<React.HTMLProps<HTMLSelectElement>, 'onChange'>;\n\nexport type SelectProps = baseSelectProps & {\n  isInvalid?: boolean;\n  onChange: (value: string) => void;\n  'data-testid'?: string;\n};\n\n/**\n * A custom select component with styling, which is a wrapper around the\n * native select element.\n * @param props.onChange returns a string value and not the event\n */\n\nconst Select = React.forwardRef<HTMLSelectElement, SelectProps>(\n  (props, forwardedRef) => {\n    const {\n      children,\n      className,\n      isInvalid,\n      onChange,\n      'data-testid': dataTestId,\n      ...rest\n    } = props;\n\n    const ref = useForwardedRef<HTMLSelectElement>(forwardedRef);\n\n    const handleChange = useCallback(\n      (event: React.ChangeEvent<HTMLSelectElement>): void => {\n        onChange(event.target.value);\n      },\n      [onChange]\n    );\n\n    return (\n      <select\n        ref={ref}\n        className={classNames('custom-select', className, {\n          'is-invalid': isInvalid,\n        })}\n        onChange={handleChange}\n        data-testid={dataTestId}\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...rest}\n      >\n        {children}\n      </select>\n    );\n  }\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,wBAAwB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAUzD;AACA;AACA;AACA;AACA;;AAEA,IAAMC,MAAM,gBAAGN,KAAK,CAACO,UAAU,CAC7B,CAACC,KAAK,EAAEC,YAAY,KAAK;EACvB,IAAM;MACJC,QAAQ;MACRC,SAAS;MACTC,SAAS;MACTC,QAAQ;MACR,aAAa,EAAEC;IAEjB,CAAC,GAAGN,KAAK;IADJO,IAAI,GAAAC,wBAAA,CACLR,KAAK,EAAAS,SAAA;EAET,IAAMC,GAAG,GAAGf,eAAe,CAAoBM,YAAY,CAAC;EAE5D,IAAMU,YAAY,GAAGlB,WAAW,CAC7BmB,KAA2C,IAAW;IACrDP,QAAQ,CAACO,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;EAC9B,CAAC,EACD,CAACT,QAAQ,CACX,CAAC;EAED,oBACER,IAAA,WAAAkB,aAAA,CAAAA,aAAA;IACEL,GAAG,EAAEA,GAAI;IACTP,SAAS,EAAET,UAAU,CAAC,eAAe,EAAES,SAAS,EAAE;MAChD,YAAY,EAAEC;IAChB,CAAC,CAAE;IACHC,QAAQ,EAAEM,YAAa;IACvB,eAAaL;IACb;EAAA,GACIC,IAAI;IAAAL,QAAA,EAEPA;EAAQ,EACH,CAAC;AAEb,CACF,CAAC;AAEDJ,MAAM,CAACkB,WAAW,GAAG,QAAQ;AAE7B,eAAelB,MAAM","ignoreList":[]}
+{"version":3,"file":"Select.js","names":["React","useCallback","classNames","useForwardedRef","jsx","_jsx","Select","forwardRef","props","forwardedRef","children","className","isInvalid","onChange","dataTestId","rest","_objectWithoutProperties","_excluded","ref","handleChange","event","target","value","_objectSpread","displayName"],"sources":["../src/Select.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport classNames from 'classnames';\nimport { useForwardedRef } from '@deephaven/react-hooks';\n\ntype baseSelectProps = Omit<React.HTMLProps<HTMLSelectElement>, 'onChange'>;\n\nexport type SelectProps = baseSelectProps & {\n  isInvalid?: boolean;\n  onChange: (value: string) => void;\n  'data-testid'?: string;\n};\n\n/**\n * A custom select component with styling, which is a wrapper around the\n * native select element.\n * @param props.onChange returns a string value and not the event\n */\n\nconst Select = React.forwardRef<HTMLSelectElement, SelectProps>(\n  (props, forwardedRef) => {\n    const {\n      children,\n      className,\n      isInvalid,\n      onChange,\n      'data-testid': dataTestId,\n      ...rest\n    } = props;\n\n    const ref = useForwardedRef<HTMLSelectElement>(forwardedRef);\n\n    const handleChange = useCallback(\n      (event: React.ChangeEvent<HTMLSelectElement>): void => {\n        onChange(event.target.value);\n      },\n      [onChange]\n    );\n\n    return (\n      <select\n        ref={ref}\n        className={classNames('custom-select', className, {\n          'is-invalid': isInvalid,\n        })}\n        onChange={handleChange}\n        data-testid={dataTestId}\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...rest}\n      >\n        {children}\n      </select>\n    );\n  }\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,wBAAwB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAUzD;AACA;AACA;AACA;AACA;;AAEA,IAAMC,MAAM,gBAAGN,KAAK,CAACO,UAAU,CAC7B,CAACC,KAAK,EAAEC,YAAY,KAAK;EACvB,IACEC,QAAQ,GAMNF,KAAK,CANPE,QAAQ;IACRC,SAAS,GAKPH,KAAK,CALPG,SAAS;IACTC,SAAS,GAIPJ,KAAK,CAJPI,SAAS;IACTC,QAAQ,GAGNL,KAAK,CAHPK,QAAQ;IACOC,UAAU,GAEvBN,KAAK,CAFP,aAAa;IACVO,IAAI,GAAAC,wBAAA,CACLR,KAAK,EAAAS,SAAA;EAET,IAAMC,GAAG,GAAGf,eAAe,CAAoBM,YAAY,CAAC;EAE5D,IAAMU,YAAY,GAAGlB,WAAW,CAC7BmB,KAA2C,IAAW;IACrDP,QAAQ,CAACO,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;EAC9B,CAAC,EACD,CAACT,QAAQ,CACX,CAAC;EAED,oBACER,IAAA,WAAAkB,aAAA,CAAAA,aAAA;IACEL,GAAG,EAAEA,GAAI;IACTP,SAAS,EAAET,UAAU,CAAC,eAAe,EAAES,SAAS,EAAE;MAChD,YAAY,EAAEC;IAChB,CAAC,CAAE;IACHC,QAAQ,EAAEM,YAAa;IACvB,eAAaL;IACb;EAAA,GACIC,IAAI;IAAAL,QAAA,EAEPA;EAAQ,EACH,CAAC;AAEb,CACF,CAAC;AAEDJ,MAAM,CAACkB,WAAW,GAAG,QAAQ;AAE7B,eAAelB,MAAM","ignoreList":[]}

package/dist/SelectValueList.js

@@ -44,11 +44,9 @@ class SelectValueList extends PureComponent {
       var itemElements = [];
       for (var i = 0; i < items.length; i += 1) {
         var item = items[i];
-        var {
-          value,
-          displayValue,
-          isSelected
-        } = item;
+        var value = item.value,
+          displayValue = item.displayValue,
+          isSelected = item.isSelected;
         var itemIndex = offset + i;
         var key = itemIndex;
         var element = this.getCachedItem(itemIndex, key, value, displayValue, rowHeight, isSelected, disabled);
@@ -74,9 +72,7 @@ class SelectValueList extends PureComponent {
   handleBlur(e) {
     if (!e.relatedTarget || this.list.current && e.relatedTarget instanceof HTMLElement && !this.list.current.contains(e.relatedTarget)) {
       // Next focused element is outside of the list
-      var {
-        onBlur
-      } = this.props;
+      var onBlur = this.props.onBlur;
       onBlur === null || onBlur === void 0 || onBlur(e);
     }
   }
@@ -84,17 +80,14 @@ class SelectValueList extends PureComponent {
     this.sendViewportUpdate();
   }
   handleSelect(itemIndex) {
-    var {
-      items,
-      offset,
-      onSelect
-    } = this.props;
+    var _this$props = this.props,
+      items = _this$props.items,
+      offset = _this$props.offset,
+      onSelect = _this$props.onSelect;
     var visibleItemIndex = itemIndex - offset;
     if (visibleItemIndex >= 0 && visibleItemIndex < items.length) {
       var item = items[visibleItemIndex];
-      var {
-        value
-      } = item;
+      var value = item.value;
       onSelect(itemIndex, value);
     } else {
       onSelect(itemIndex, null);
@@ -104,10 +97,9 @@ class SelectValueList extends PureComponent {
     if (!this.list.current || this.list.current.clientHeight === 0) {
       return;
     }
-    var {
-      onViewportChange,
-      rowHeight
-    } = this.props;
+    var _this$props2 = this.props,
+      onViewportChange = _this$props2.onViewportChange,
+      rowHeight = _this$props2.rowHeight;
     var top = this.list.current.scrollTop;
     var bottom = top + this.list.current.clientHeight;
     var topRow = Math.floor(top / rowHeight);
@@ -132,16 +124,15 @@ class SelectValueList extends PureComponent {
     });
   }
   render() {
-    var {
-      className,
-      disabled,
-      isInvalid,
-      items,
-      itemCount,
-      offset,
-      rowHeight,
-      'data-testid': dataTestId
-    } = this.props;
+    var _this$props3 = this.props,
+      className = _this$props3.className,
+      disabled = _this$props3.disabled,
+      isInvalid = _this$props3.isInvalid,
+      items = _this$props3.items,
+      itemCount = _this$props3.itemCount,
+      offset = _this$props3.offset,
+      rowHeight = _this$props3.rowHeight,
+      dataTestId = _this$props3['data-testid'];
     var itemElements = this.getCachedItems(items, rowHeight, offset, disabled);
     return /*#__PURE__*/_jsx("div", {
       className: classNames('select-value-list-scroll-pane h-100 w-100', {

package/dist/SelectValueList.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectValueList.js","names":["React","PureComponent","classNames","memoize","Checkbox","jsx","_jsx","SelectValueList","constructor","props","_defineProperty","itemIndex","key","value","displayValue","rowHeight","isSelected","disabled","style","height","text","concat","className","tabIndex","children","checked","onChange","handleSelect","max","items","offset","itemElements","i","length","item","element","getCachedItem","push","handleBlur","bind","handleScroll","list","createRef","topRow","bottomRow","componentDidMount","sendViewportUpdate","componentDidUpdate","e","relatedTarget","current","HTMLElement","contains","onBlur","onSelect","visibleItemIndex","clientHeight","onViewportChange","top","scrollTop","bottom","Math","floor","ceil","getElement","elements","querySelectorAll","scrollIntoView","index","block","render","isInvalid","itemCount","dataTestId","getCachedItems","onScroll","ref","position","left","undefined"],"sources":["../src/SelectValueList.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport './SelectValueList.scss';\nimport classNames from 'classnames';\nimport memoize from 'memoizee';\nimport Checkbox from './Checkbox';\n\nexport interface SelectItem<T> {\n  value: T;\n  displayValue?: string | JSX.Element;\n  isSelected: boolean;\n}\n\ntype SelectValueListProps<T> = {\n  className?: string;\n  disabled: boolean;\n  isInvalid?: boolean;\n  // Total item count\n  itemCount: number;\n  rowHeight: number;\n\n  // Offset of the top item in the items array\n  offset: number;\n  items: SelectItem<T>[];\n\n  onBlur?: React.FocusEventHandler<Element>;\n  onSelect: (itemIndex: number, value: T | null) => void;\n  onViewportChange: (topRow: number, bottomRow: number) => void;\n\n  'data-testid'?: string;\n};\n\n/**\n * Select values from a long scrollable list.\n * Swaps items in and out for infinite scrolling\n */\nclass SelectValueList<T> extends PureComponent<SelectValueListProps<T>> {\n  static defaultProps = {\n    disabled: false,\n    rowHeight: 21,\n    onBlur: (): void => undefined,\n    'data-testid': undefined,\n  };\n\n  constructor(props: SelectValueListProps<T>) {\n    super(props);\n\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleScroll = this.handleScroll.bind(this);\n    this.handleSelect = this.handleSelect.bind(this);\n\n    this.list = React.createRef();\n    this.topRow = null;\n    this.bottomRow = null;\n  }\n\n  componentDidMount(): void {\n    this.sendViewportUpdate();\n  }\n\n  componentDidUpdate(): void {\n    this.sendViewportUpdate();\n  }\n\n  list: React.RefObject<HTMLDivElement>;\n\n  topRow: number | null;\n\n  bottomRow: number | null;\n\n  getCachedItem = memoize(\n    (\n      itemIndex: number,\n      key: number,\n      value: T,\n      displayValue: string | JSX.Element | undefined,\n      rowHeight: number,\n      isSelected: boolean,\n      disabled: boolean\n    ): JSX.Element => {\n      const style = {\n        height: rowHeight,\n      };\n      const text = displayValue != null ? displayValue : `${value}`;\n\n      return (\n        // Tab index is needed so the item could be a related target in the blur event details\n        <li className=\"value-list-item\" style={style} key={key} tabIndex={-1}>\n          <Checkbox\n            checked={isSelected}\n            disabled={disabled}\n            onChange={() => this.handleSelect(itemIndex)}\n          >\n            {text}\n          </Checkbox>\n        </li>\n      );\n    },\n    { max: 1000 }\n  );\n\n  getCachedItems = memoize(\n    (\n      items: SelectItem<T>[],\n      rowHeight: number,\n      offset: number,\n      disabled: boolean\n    ): React.ReactNode => {\n      const itemElements: JSX.Element[] = [];\n      for (let i = 0; i < items.length; i += 1) {\n        const item = items[i];\n        const { value, displayValue, isSelected } = item;\n        const itemIndex = offset + i;\n        const key = itemIndex;\n        const element = this.getCachedItem(\n          itemIndex,\n          key,\n          value,\n          displayValue,\n          rowHeight,\n          isSelected,\n          disabled\n        );\n        itemElements.push(element);\n      }\n      return itemElements;\n    },\n    { max: 1 }\n  );\n\n  handleBlur(e: React.FocusEvent): void {\n    if (\n      !e.relatedTarget ||\n      (this.list.current &&\n        e.relatedTarget instanceof HTMLElement &&\n        !this.list.current.contains(e.relatedTarget))\n    ) {\n      // Next focused element is outside of the list\n      const { onBlur } = this.props;\n      onBlur?.(e);\n    }\n  }\n\n  handleScroll(): void {\n    this.sendViewportUpdate();\n  }\n\n  handleSelect(itemIndex: number): void {\n    const { items, offset, onSelect } = this.props;\n    const visibleItemIndex = itemIndex - offset;\n    if (visibleItemIndex >= 0 && visibleItemIndex < items.length) {\n      const item = items[visibleItemIndex];\n      const { value } = item;\n      onSelect(itemIndex, value);\n    } else {\n      onSelect(itemIndex, null);\n    }\n  }\n\n  sendViewportUpdate(): void {\n    if (!this.list.current || this.list.current.clientHeight === 0) {\n      return;\n    }\n\n    const { onViewportChange, rowHeight } = this.props;\n    const top = this.list.current.scrollTop;\n    const bottom = top + this.list.current.clientHeight;\n\n    const topRow = Math.floor(top / rowHeight);\n    const bottomRow = Math.ceil(bottom / rowHeight);\n\n    if (this.topRow !== topRow || this.bottomRow !== bottomRow) {\n      this.topRow = topRow;\n      this.bottomRow = bottomRow;\n      onViewportChange(topRow, bottomRow);\n    }\n  }\n\n  getElement(itemIndex: number): Element | null {\n    if (this.list.current == null) {\n      return null;\n    }\n    const elements = this.list.current.querySelectorAll('.value-list-item');\n    return elements[itemIndex];\n  }\n\n  scrollIntoView(index: number): void {\n    const element = this.getElement(index);\n    element?.scrollIntoView({ block: 'center' });\n  }\n\n  render(): JSX.Element {\n    const {\n      className,\n      disabled,\n      isInvalid,\n      items,\n      itemCount,\n      offset,\n      rowHeight,\n      'data-testid': dataTestId,\n    } = this.props;\n    const itemElements = this.getCachedItems(\n      items,\n      rowHeight,\n      offset,\n      disabled\n    );\n\n    return (\n      <div\n        className={classNames(\n          'select-value-list-scroll-pane h-100 w-100',\n          { 'is-invalid': isInvalid },\n          className\n        )}\n        onBlur={this.handleBlur}\n        onScroll={this.handleScroll}\n        ref={this.list}\n        data-testid={dataTestId}\n      >\n        <div\n          className=\"select-value-list\"\n          style={{ height: itemCount * rowHeight }}\n        >\n          <ol\n            className=\"select-value-list-content\"\n            style={{\n              position: 'absolute',\n              height: items.length * rowHeight,\n              top: offset * rowHeight,\n              left: 0,\n            }}\n          >\n            {itemElements}\n          </ol>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default SelectValueList;\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;AAAC;AAE7C,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,OAAO,MAAM,UAAU;AAAC,OACxBC,QAAQ;AAAA,SAAAC,GAAA,IAAAC,IAAA;AA2Bf;AACA;AACA;AACA;AACA,MAAMC,eAAe,SAAYN,aAAa,CAA0B;EAQtEO,WAAWA,CAACC,KAA8B,EAAE;IAC1C,KAAK,CAACA,KAAK,CAAC;IAACC,eAAA;IAAAA,eAAA;IAAAA,eAAA;IAAAA,eAAA,wBAyBCP,OAAO,CACrB,CACEQ,SAAiB,EACjBC,GAAW,EACXC,KAAQ,EACRC,YAA8C,EAC9CC,SAAiB,EACjBC,UAAmB,EACnBC,QAAiB,KACD;MAChB,IAAMC,KAAK,GAAG;QACZC,MAAM,EAAEJ;MACV,CAAC;MACD,IAAMK,IAAI,GAAGN,YAAY,IAAI,IAAI,GAAGA,YAAY,MAAAO,MAAA,CAAMR,KAAK,CAAE;MAE7D;QAAA;QACE;QACAP,IAAA;UAAIgB,SAAS,EAAC,iBAAiB;UAACJ,KAAK,EAAEA,KAAM;UAAWK,QAAQ,EAAE,CAAC,CAAE;UAAAC,QAAA,eACnElB,IAAA,CAACF,QAAQ;YACPqB,OAAO,EAAET,UAAW;YACpBC,QAAQ,EAAEA,QAAS;YACnBS,QAAQ,EAAEA,CAAA,KAAM,IAAI,CAACC,YAAY,CAAChB,SAAS,CAAE;YAAAa,QAAA,EAE5CJ;UAAI,CACG;QAAC,GAPsCR,GAQ/C;MAAC;IAET,CAAC,EACD;MAAEgB,GAAG,EAAE;IAAK,CACd,CAAC;IAAAlB,eAAA,yBAEgBP,OAAO,CACtB,CACE0B,KAAsB,EACtBd,SAAiB,EACjBe,MAAc,EACdb,QAAiB,KACG;MACpB,IAAMc,YAA2B,GAAG,EAAE;MACtC,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGH,KAAK,CAACI,MAAM,EAAED,CAAC,IAAI,CAAC,EAAE;QACxC,IAAME,IAAI,GAAGL,KAAK,CAACG,CAAC,CAAC;QACrB,IAAM;UAAEnB,KAAK;UAAEC,YAAY;UAAEE;QAAW,CAAC,GAAGkB,IAAI;QAChD,IAAMvB,SAAS,GAAGmB,MAAM,GAAGE,CAAC;QAC5B,IAAMpB,GAAG,GAAGD,SAAS;QACrB,IAAMwB,OAAO,GAAG,IAAI,CAACC,aAAa,CAChCzB,SAAS,EACTC,GAAG,EACHC,KAAK,EACLC,YAAY,EACZC,SAAS,EACTC,UAAU,EACVC,QACF,CAAC;QACDc,YAAY,CAACM,IAAI,CAACF,OAAO,CAAC;MAC5B;MACA,OAAOJ,YAAY;IACrB,CAAC,EACD;MAAEH,GAAG,EAAE;IAAE,CACX,CAAC;IAjFC,IAAI,CAACU,UAAU,GAAG,IAAI,CAACA,UAAU,CAACC,IAAI,CAAC,IAAI,CAAC;IAC5C,IAAI,CAACC,YAAY,GAAG,IAAI,CAACA,YAAY,CAACD,IAAI,CAAC,IAAI,CAAC;IAChD,IAAI,CAACZ,YAAY,GAAG,IAAI,CAACA,YAAY,CAACY,IAAI,CAAC,IAAI,CAAC;IAEhD,IAAI,CAACE,IAAI,gBAAGzC,KAAK,CAAC0C,SAAS,CAAC,CAAC;IAC7B,IAAI,CAACC,MAAM,GAAG,IAAI;IAClB,IAAI,CAACC,SAAS,GAAG,IAAI;EACvB;EAEAC,iBAAiBA,CAAA,EAAS;IACxB,IAAI,CAACC,kBAAkB,CAAC,CAAC;EAC3B;EAEAC,kBAAkBA,CAAA,EAAS;IACzB,IAAI,CAACD,kBAAkB,CAAC,CAAC;EAC3B;EAoEAR,UAAUA,CAACU,CAAmB,EAAQ;IACpC,IACE,CAACA,CAAC,CAACC,aAAa,IACf,IAAI,CAACR,IAAI,CAACS,OAAO,IAChBF,CAAC,CAACC,aAAa,YAAYE,WAAW,IACtC,CAAC,IAAI,CAACV,IAAI,CAACS,OAAO,CAACE,QAAQ,CAACJ,CAAC,CAACC,aAAa,CAAE,EAC/C;MACA;MACA,IAAM;QAAEI;MAAO,CAAC,GAAG,IAAI,CAAC5C,KAAK;MAC7B4C,MAAM,aAANA,MAAM,eAANA,MAAM,CAAGL,CAAC,CAAC;IACb;EACF;EAEAR,YAAYA,CAAA,EAAS;IACnB,IAAI,CAACM,kBAAkB,CAAC,CAAC;EAC3B;EAEAnB,YAAYA,CAAChB,SAAiB,EAAQ;IACpC,IAAM;MAAEkB,KAAK;MAAEC,MAAM;MAAEwB;IAAS,CAAC,GAAG,IAAI,CAAC7C,KAAK;IAC9C,IAAM8C,gBAAgB,GAAG5C,SAAS,GAAGmB,MAAM;IAC3C,IAAIyB,gBAAgB,IAAI,CAAC,IAAIA,gBAAgB,GAAG1B,KAAK,CAACI,MAAM,EAAE;MAC5D,IAAMC,IAAI,GAAGL,KAAK,CAAC0B,gBAAgB,CAAC;MACpC,IAAM;QAAE1C;MAAM,CAAC,GAAGqB,IAAI;MACtBoB,QAAQ,CAAC3C,SAAS,EAAEE,KAAK,CAAC;IAC5B,CAAC,MAAM;MACLyC,QAAQ,CAAC3C,SAAS,EAAE,IAAI,CAAC;IAC3B;EACF;EAEAmC,kBAAkBA,CAAA,EAAS;IACzB,IAAI,CAAC,IAAI,CAACL,IAAI,CAACS,OAAO,IAAI,IAAI,CAACT,IAAI,CAACS,OAAO,CAACM,YAAY,KAAK,CAAC,EAAE;MAC9D;IACF;IAEA,IAAM;MAAEC,gBAAgB;MAAE1C;IAAU,CAAC,GAAG,IAAI,CAACN,KAAK;IAClD,IAAMiD,GAAG,GAAG,IAAI,CAACjB,IAAI,CAACS,OAAO,CAACS,SAAS;IACvC,IAAMC,MAAM,GAAGF,GAAG,GAAG,IAAI,CAACjB,IAAI,CAACS,OAAO,CAACM,YAAY;IAEnD,IAAMb,MAAM,GAAGkB,IAAI,CAACC,KAAK,CAACJ,GAAG,GAAG3C,SAAS,CAAC;IAC1C,IAAM6B,SAAS,GAAGiB,IAAI,CAACE,IAAI,CAACH,MAAM,GAAG7C,SAAS,CAAC;IAE/C,IAAI,IAAI,CAAC4B,MAAM,KAAKA,MAAM,IAAI,IAAI,CAACC,SAAS,KAAKA,SAAS,EAAE;MAC1D,IAAI,CAACD,MAAM,GAAGA,MAAM;MACpB,IAAI,CAACC,SAAS,GAAGA,SAAS;MAC1Ba,gBAAgB,CAACd,MAAM,EAAEC,SAAS,CAAC;IACrC;EACF;EAEAoB,UAAUA,CAACrD,SAAiB,EAAkB;IAC5C,IAAI,IAAI,CAAC8B,IAAI,CAACS,OAAO,IAAI,IAAI,EAAE;MAC7B,OAAO,IAAI;IACb;IACA,IAAMe,QAAQ,GAAG,IAAI,CAACxB,IAAI,CAACS,OAAO,CAACgB,gBAAgB,CAAC,kBAAkB,CAAC;IACvE,OAAOD,QAAQ,CAACtD,SAAS,CAAC;EAC5B;EAEAwD,cAAcA,CAACC,KAAa,EAAQ;IAClC,IAAMjC,OAAO,GAAG,IAAI,CAAC6B,UAAU,CAACI,KAAK,CAAC;IACtCjC,OAAO,aAAPA,OAAO,eAAPA,OAAO,CAAEgC,cAAc,CAAC;MAAEE,KAAK,EAAE;IAAS,CAAC,CAAC;EAC9C;EAEAC,MAAMA,CAAA,EAAgB;IACpB,IAAM;MACJhD,SAAS;MACTL,QAAQ;MACRsD,SAAS;MACT1C,KAAK;MACL2C,SAAS;MACT1C,MAAM;MACNf,SAAS;MACT,aAAa,EAAE0D;IACjB,CAAC,GAAG,IAAI,CAAChE,KAAK;IACd,IAAMsB,YAAY,GAAG,IAAI,CAAC2C,cAAc,CACtC7C,KAAK,EACLd,SAAS,EACTe,MAAM,EACNb,QACF,CAAC;IAED,oBACEX,IAAA;MACEgB,SAAS,EAAEpB,UAAU,CACnB,2CAA2C,EAC3C;QAAE,YAAY,EAAEqE;MAAU,CAAC,EAC3BjD,SACF,CAAE;MACF+B,MAAM,EAAE,IAAI,CAACf,UAAW;MACxBqC,QAAQ,EAAE,IAAI,CAACnC,YAAa;MAC5BoC,GAAG,EAAE,IAAI,CAACnC,IAAK;MACf,eAAagC,UAAW;MAAAjD,QAAA,eAExBlB,IAAA;QACEgB,SAAS,EAAC,mBAAmB;QAC7BJ,KAAK,EAAE;UAAEC,MAAM,EAAEqD,SAAS,GAAGzD;QAAU,CAAE;QAAAS,QAAA,eAEzClB,IAAA;UACEgB,SAAS,EAAC,2BAA2B;UACrCJ,KAAK,EAAE;YACL2D,QAAQ,EAAE,UAAU;YACpB1D,MAAM,EAAEU,KAAK,CAACI,MAAM,GAAGlB,SAAS;YAChC2C,GAAG,EAAE5B,MAAM,GAAGf,SAAS;YACvB+D,IAAI,EAAE;UACR,CAAE;UAAAtD,QAAA,EAEDO;QAAY,CACX;MAAC,CACF;IAAC,CACH,CAAC;EAEV;AACF;AAACrB,eAAA,CA5MKH,eAAe,kBACG;EACpBU,QAAQ,EAAE,KAAK;EACfF,SAAS,EAAE,EAAE;EACbsC,MAAM,EAAEA,CAAA,KAAY0B,SAAS;EAC7B,aAAa,EAAEA;AACjB,CAAC;AAwMH,eAAexE,eAAe","ignoreList":[]}
+{"version":3,"file":"SelectValueList.js","names":["React","PureComponent","classNames","memoize","Checkbox","jsx","_jsx","SelectValueList","constructor","props","_defineProperty","itemIndex","key","value","displayValue","rowHeight","isSelected","disabled","style","height","text","concat","className","tabIndex","children","checked","onChange","handleSelect","max","items","offset","itemElements","i","length","item","element","getCachedItem","push","handleBlur","bind","handleScroll","list","createRef","topRow","bottomRow","componentDidMount","sendViewportUpdate","componentDidUpdate","e","relatedTarget","current","HTMLElement","contains","onBlur","_this$props","onSelect","visibleItemIndex","clientHeight","_this$props2","onViewportChange","top","scrollTop","bottom","Math","floor","ceil","getElement","elements","querySelectorAll","scrollIntoView","index","block","render","_this$props3","isInvalid","itemCount","dataTestId","getCachedItems","onScroll","ref","position","left","undefined"],"sources":["../src/SelectValueList.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport './SelectValueList.scss';\nimport classNames from 'classnames';\nimport memoize from 'memoizee';\nimport Checkbox from './Checkbox';\n\nexport interface SelectItem<T> {\n  value: T;\n  displayValue?: string | JSX.Element;\n  isSelected: boolean;\n}\n\ntype SelectValueListProps<T> = {\n  className?: string;\n  disabled: boolean;\n  isInvalid?: boolean;\n  // Total item count\n  itemCount: number;\n  rowHeight: number;\n\n  // Offset of the top item in the items array\n  offset: number;\n  items: SelectItem<T>[];\n\n  onBlur?: React.FocusEventHandler<Element>;\n  onSelect: (itemIndex: number, value: T | null) => void;\n  onViewportChange: (topRow: number, bottomRow: number) => void;\n\n  'data-testid'?: string;\n};\n\n/**\n * Select values from a long scrollable list.\n * Swaps items in and out for infinite scrolling\n */\nclass SelectValueList<T> extends PureComponent<SelectValueListProps<T>> {\n  static defaultProps = {\n    disabled: false,\n    rowHeight: 21,\n    onBlur: (): void => undefined,\n    'data-testid': undefined,\n  };\n\n  constructor(props: SelectValueListProps<T>) {\n    super(props);\n\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleScroll = this.handleScroll.bind(this);\n    this.handleSelect = this.handleSelect.bind(this);\n\n    this.list = React.createRef();\n    this.topRow = null;\n    this.bottomRow = null;\n  }\n\n  componentDidMount(): void {\n    this.sendViewportUpdate();\n  }\n\n  componentDidUpdate(): void {\n    this.sendViewportUpdate();\n  }\n\n  list: React.RefObject<HTMLDivElement>;\n\n  topRow: number | null;\n\n  bottomRow: number | null;\n\n  getCachedItem = memoize(\n    (\n      itemIndex: number,\n      key: number,\n      value: T,\n      displayValue: string | JSX.Element | undefined,\n      rowHeight: number,\n      isSelected: boolean,\n      disabled: boolean\n    ): JSX.Element => {\n      const style = {\n        height: rowHeight,\n      };\n      const text = displayValue != null ? displayValue : `${value}`;\n\n      return (\n        // Tab index is needed so the item could be a related target in the blur event details\n        <li className=\"value-list-item\" style={style} key={key} tabIndex={-1}>\n          <Checkbox\n            checked={isSelected}\n            disabled={disabled}\n            onChange={() => this.handleSelect(itemIndex)}\n          >\n            {text}\n          </Checkbox>\n        </li>\n      );\n    },\n    { max: 1000 }\n  );\n\n  getCachedItems = memoize(\n    (\n      items: SelectItem<T>[],\n      rowHeight: number,\n      offset: number,\n      disabled: boolean\n    ): React.ReactNode => {\n      const itemElements: JSX.Element[] = [];\n      for (let i = 0; i < items.length; i += 1) {\n        const item = items[i];\n        const { value, displayValue, isSelected } = item;\n        const itemIndex = offset + i;\n        const key = itemIndex;\n        const element = this.getCachedItem(\n          itemIndex,\n          key,\n          value,\n          displayValue,\n          rowHeight,\n          isSelected,\n          disabled\n        );\n        itemElements.push(element);\n      }\n      return itemElements;\n    },\n    { max: 1 }\n  );\n\n  handleBlur(e: React.FocusEvent): void {\n    if (\n      !e.relatedTarget ||\n      (this.list.current &&\n        e.relatedTarget instanceof HTMLElement &&\n        !this.list.current.contains(e.relatedTarget))\n    ) {\n      // Next focused element is outside of the list\n      const { onBlur } = this.props;\n      onBlur?.(e);\n    }\n  }\n\n  handleScroll(): void {\n    this.sendViewportUpdate();\n  }\n\n  handleSelect(itemIndex: number): void {\n    const { items, offset, onSelect } = this.props;\n    const visibleItemIndex = itemIndex - offset;\n    if (visibleItemIndex >= 0 && visibleItemIndex < items.length) {\n      const item = items[visibleItemIndex];\n      const { value } = item;\n      onSelect(itemIndex, value);\n    } else {\n      onSelect(itemIndex, null);\n    }\n  }\n\n  sendViewportUpdate(): void {\n    if (!this.list.current || this.list.current.clientHeight === 0) {\n      return;\n    }\n\n    const { onViewportChange, rowHeight } = this.props;\n    const top = this.list.current.scrollTop;\n    const bottom = top + this.list.current.clientHeight;\n\n    const topRow = Math.floor(top / rowHeight);\n    const bottomRow = Math.ceil(bottom / rowHeight);\n\n    if (this.topRow !== topRow || this.bottomRow !== bottomRow) {\n      this.topRow = topRow;\n      this.bottomRow = bottomRow;\n      onViewportChange(topRow, bottomRow);\n    }\n  }\n\n  getElement(itemIndex: number): Element | null {\n    if (this.list.current == null) {\n      return null;\n    }\n    const elements = this.list.current.querySelectorAll('.value-list-item');\n    return elements[itemIndex];\n  }\n\n  scrollIntoView(index: number): void {\n    const element = this.getElement(index);\n    element?.scrollIntoView({ block: 'center' });\n  }\n\n  render(): JSX.Element {\n    const {\n      className,\n      disabled,\n      isInvalid,\n      items,\n      itemCount,\n      offset,\n      rowHeight,\n      'data-testid': dataTestId,\n    } = this.props;\n    const itemElements = this.getCachedItems(\n      items,\n      rowHeight,\n      offset,\n      disabled\n    );\n\n    return (\n      <div\n        className={classNames(\n          'select-value-list-scroll-pane h-100 w-100',\n          { 'is-invalid': isInvalid },\n          className\n        )}\n        onBlur={this.handleBlur}\n        onScroll={this.handleScroll}\n        ref={this.list}\n        data-testid={dataTestId}\n      >\n        <div\n          className=\"select-value-list\"\n          style={{ height: itemCount * rowHeight }}\n        >\n          <ol\n            className=\"select-value-list-content\"\n            style={{\n              position: 'absolute',\n              height: items.length * rowHeight,\n              top: offset * rowHeight,\n              left: 0,\n            }}\n          >\n            {itemElements}\n          </ol>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default SelectValueList;\n"],"mappings":"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","ignoreList":[]}

package/dist/SocketedButton.js

@@ -6,29 +6,30 @@ import { dhExclamation, vsLink } from '@deephaven/icons';
 import "./SocketedButton.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var SocketedButton = /*#__PURE__*/React.forwardRef((props, ref) => {
-  var {
-    children,
-    className,
-    disabled = false,
-    id,
-    isLinked = false,
-    isLinkedSource = false,
-    isInvalid = false,
-    onClick,
-    onMouseEnter,
-    onMouseLeave,
-    style,
-    'data-testid': dataTestId
-  } = props;
+  var children = props.children,
+    className = props.className,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    id = props.id,
+    _props$isLinked = props.isLinked,
+    isLinked = _props$isLinked === void 0 ? false : _props$isLinked,
+    _props$isLinkedSource = props.isLinkedSource,
+    isLinkedSource = _props$isLinkedSource === void 0 ? false : _props$isLinkedSource,
+    _props$isInvalid = props.isInvalid,
+    isInvalid = _props$isInvalid === void 0 ? false : _props$isInvalid,
+    onClick = props.onClick,
+    onMouseEnter = props.onMouseEnter,
+    onMouseLeave = props.onMouseLeave,
+    style = props.style,
+    dataTestId = props['data-testid'];
 
   // Spectrum container components such as `ButtonGroup` provide
   // UNSAFE_className prop for the `button` slot via a SlotProvider (
   // https://github.com/adobe/react-spectrum/blob/%40adobe/react-spectrum%403.33.1/packages/%40react-spectrum/buttongroup/src/ButtonGroup.tsx#L104-L107)
   // This can be retrieved via `useSlotProps` to allow our buttons to be styled
   // correctly inside the container.
-  var {
-    UNSAFE_className
-  } = useSlotProps({}, 'button');
+  var _useSlotProps = useSlotProps({}, 'button'),
+    UNSAFE_className = _useSlotProps.UNSAFE_className;
   return /*#__PURE__*/_jsxs("button", {
     ref: ref,
     type: "button",

package/dist/SocketedButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SocketedButton.js","names":["React","classNames","FontAwesomeIcon","useSlotProps","dhExclamation","vsLink","jsx","_jsx","jsxs","_jsxs","SocketedButton","forwardRef","props","ref","children","className","disabled","id","isLinked","isLinkedSource","isInvalid","onClick","onMouseEnter","onMouseLeave","style","dataTestId","UNSAFE_className","type","undefined","icon","transform","displayName"],"sources":["../src/SocketedButton.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { useSlotProps } from '@react-spectrum/utils';\nimport { dhExclamation, vsLink } from '@deephaven/icons';\n\nimport './SocketedButton.scss';\n\ntype SocketedButtonProps = React.PropsWithChildren<{\n  className?: string;\n  disabled?: boolean;\n  id?: string;\n  isLinked?: boolean;\n  isLinkedSource?: boolean;\n  isInvalid?: boolean;\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;\n  onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;\n  style?: React.CSSProperties;\n  'data-testid'?: string;\n}>;\n\nconst SocketedButton = React.forwardRef<HTMLButtonElement, SocketedButtonProps>(\n  (props: SocketedButtonProps, ref) => {\n    const {\n      children,\n      className,\n      disabled = false,\n      id,\n      isLinked = false,\n      isLinkedSource = false,\n      isInvalid = false,\n      onClick,\n      onMouseEnter,\n      onMouseLeave,\n      style,\n      'data-testid': dataTestId,\n    } = props;\n\n    // Spectrum container components such as `ButtonGroup` provide\n    // UNSAFE_className prop for the `button` slot via a SlotProvider (\n    // https://github.com/adobe/react-spectrum/blob/%40adobe/react-spectrum%403.33.1/packages/%40react-spectrum/buttongroup/src/ButtonGroup.tsx#L104-L107)\n    // This can be retrieved via `useSlotProps` to allow our buttons to be styled\n    // correctly inside the container.\n    const { UNSAFE_className } = useSlotProps<{ UNSAFE_className?: string }>(\n      {},\n      'button'\n    );\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={classNames(\n          'btn-socketed',\n          {\n            'btn-socketed-linked':\n              (isLinked !== undefined && isLinked) || isLinkedSource,\n          },\n          { 'btn-socketed-linked-source': isLinkedSource },\n          { 'is-invalid': isInvalid },\n          className,\n          UNSAFE_className\n        )}\n        id={id}\n        onClick={onClick}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        style={style}\n        disabled={disabled}\n        data-testid={dataTestId}\n      >\n        {children}\n        <FontAwesomeIcon\n          icon={vsLink}\n          className=\"linked btn-socketed-icon\"\n          transform=\"down-1\"\n        />\n        <FontAwesomeIcon\n          icon={dhExclamation}\n          className=\"is-invalid btn-socketed-icon\"\n        />\n      </button>\n    );\n  }\n);\n\nSocketedButton.displayName = 'SocketedButton';\n\nexport default SocketedButton;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,YAAY,QAAQ,uBAAuB;AACpD,SAASC,aAAa,EAAEC,MAAM,QAAQ,kBAAkB;AAAC;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAkBzD,IAAMC,cAAc,gBAAGV,KAAK,CAACW,UAAU,CACrC,CAACC,KAA0B,EAAEC,GAAG,KAAK;EACnC,IAAM;IACJC,QAAQ;IACRC,SAAS;IACTC,QAAQ,GAAG,KAAK;IAChBC,EAAE;IACFC,QAAQ,GAAG,KAAK;IAChBC,cAAc,GAAG,KAAK;IACtBC,SAAS,GAAG,KAAK;IACjBC,OAAO;IACPC,YAAY;IACZC,YAAY;IACZC,KAAK;IACL,aAAa,EAAEC;EACjB,CAAC,GAAGb,KAAK;;EAET;EACA;EACA;EACA;EACA;EACA,IAAM;IAAEc;EAAiB,CAAC,GAAGvB,YAAY,CACvC,CAAC,CAAC,EACF,QACF,CAAC;EAED,oBACEM,KAAA;IACEI,GAAG,EAAEA,GAAI;IACTc,IAAI,EAAC,QAAQ;IACbZ,SAAS,EAAEd,UAAU,CACnB,cAAc,EACd;MACE,qBAAqB,EAClBiB,QAAQ,KAAKU,SAAS,IAAIV,QAAQ,IAAKC;IAC5C,CAAC,EACD;MAAE,4BAA4B,EAAEA;IAAe,CAAC,EAChD;MAAE,YAAY,EAAEC;IAAU,CAAC,EAC3BL,SAAS,EACTW,gBACF,CAAE;IACFT,EAAE,EAAEA,EAAG;IACPI,OAAO,EAAEA,OAAQ;IACjBC,YAAY,EAAEA,YAAa;IAC3BC,YAAY,EAAEA,YAAa;IAC3BC,KAAK,EAAEA,KAAM;IACbR,QAAQ,EAAEA,QAAS;IACnB,eAAaS,UAAW;IAAAX,QAAA,GAEvBA,QAAQ,eACTP,IAAA,CAACL,eAAe;MACd2B,IAAI,EAAExB,MAAO;MACbU,SAAS,EAAC,0BAA0B;MACpCe,SAAS,EAAC;IAAQ,CACnB,CAAC,eACFvB,IAAA,CAACL,eAAe;MACd2B,IAAI,EAAEzB,aAAc;MACpBW,SAAS,EAAC;IAA8B,CACzC,CAAC;EAAA,CACI,CAAC;AAEb,CACF,CAAC;AAEDL,cAAc,CAACqB,WAAW,GAAG,gBAAgB;AAE7C,eAAerB,cAAc","ignoreList":[]}
+{"version":3,"file":"SocketedButton.js","names":["React","classNames","FontAwesomeIcon","useSlotProps","dhExclamation","vsLink","jsx","_jsx","jsxs","_jsxs","SocketedButton","forwardRef","props","ref","children","className","_props$disabled","disabled","id","_props$isLinked","isLinked","_props$isLinkedSource","isLinkedSource","_props$isInvalid","isInvalid","onClick","onMouseEnter","onMouseLeave","style","dataTestId","_useSlotProps","UNSAFE_className","type","undefined","icon","transform","displayName"],"sources":["../src/SocketedButton.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { useSlotProps } from '@react-spectrum/utils';\nimport { dhExclamation, vsLink } from '@deephaven/icons';\n\nimport './SocketedButton.scss';\n\ntype SocketedButtonProps = React.PropsWithChildren<{\n  className?: string;\n  disabled?: boolean;\n  id?: string;\n  isLinked?: boolean;\n  isLinkedSource?: boolean;\n  isInvalid?: boolean;\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;\n  onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;\n  style?: React.CSSProperties;\n  'data-testid'?: string;\n}>;\n\nconst SocketedButton = React.forwardRef<HTMLButtonElement, SocketedButtonProps>(\n  (props: SocketedButtonProps, ref) => {\n    const {\n      children,\n      className,\n      disabled = false,\n      id,\n      isLinked = false,\n      isLinkedSource = false,\n      isInvalid = false,\n      onClick,\n      onMouseEnter,\n      onMouseLeave,\n      style,\n      'data-testid': dataTestId,\n    } = props;\n\n    // Spectrum container components such as `ButtonGroup` provide\n    // UNSAFE_className prop for the `button` slot via a SlotProvider (\n    // https://github.com/adobe/react-spectrum/blob/%40adobe/react-spectrum%403.33.1/packages/%40react-spectrum/buttongroup/src/ButtonGroup.tsx#L104-L107)\n    // This can be retrieved via `useSlotProps` to allow our buttons to be styled\n    // correctly inside the container.\n    const { UNSAFE_className } = useSlotProps<{ UNSAFE_className?: string }>(\n      {},\n      'button'\n    );\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={classNames(\n          'btn-socketed',\n          {\n            'btn-socketed-linked':\n              (isLinked !== undefined && isLinked) || isLinkedSource,\n          },\n          { 'btn-socketed-linked-source': isLinkedSource },\n          { 'is-invalid': isInvalid },\n          className,\n          UNSAFE_className\n        )}\n        id={id}\n        onClick={onClick}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        style={style}\n        disabled={disabled}\n        data-testid={dataTestId}\n      >\n        {children}\n        <FontAwesomeIcon\n          icon={vsLink}\n          className=\"linked btn-socketed-icon\"\n          transform=\"down-1\"\n        />\n        <FontAwesomeIcon\n          icon={dhExclamation}\n          className=\"is-invalid btn-socketed-icon\"\n        />\n      </button>\n    );\n  }\n);\n\nSocketedButton.displayName = 'SocketedButton';\n\nexport default SocketedButton;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,YAAY,QAAQ,uBAAuB;AACpD,SAASC,aAAa,EAAEC,MAAM,QAAQ,kBAAkB;AAAC;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAkBzD,IAAMC,cAAc,gBAAGV,KAAK,CAACW,UAAU,CACrC,CAACC,KAA0B,EAAEC,GAAG,KAAK;EACnC,IACEC,QAAQ,GAYNF,KAAK,CAZPE,QAAQ;IACRC,SAAS,GAWPH,KAAK,CAXPG,SAAS;IAAAC,eAAA,GAWPJ,KAAK,CAVPK,QAAQ;IAARA,QAAQ,GAAAD,eAAA,cAAG,KAAK,GAAAA,eAAA;IAChBE,EAAE,GASAN,KAAK,CATPM,EAAE;IAAAC,eAAA,GASAP,KAAK,CARPQ,QAAQ;IAARA,QAAQ,GAAAD,eAAA,cAAG,KAAK,GAAAA,eAAA;IAAAE,qBAAA,GAQdT,KAAK,CAPPU,cAAc;IAAdA,cAAc,GAAAD,qBAAA,cAAG,KAAK,GAAAA,qBAAA;IAAAE,gBAAA,GAOpBX,KAAK,CANPY,SAAS;IAATA,SAAS,GAAAD,gBAAA,cAAG,KAAK,GAAAA,gBAAA;IACjBE,OAAO,GAKLb,KAAK,CALPa,OAAO;IACPC,YAAY,GAIVd,KAAK,CAJPc,YAAY;IACZC,YAAY,GAGVf,KAAK,CAHPe,YAAY;IACZC,KAAK,GAEHhB,KAAK,CAFPgB,KAAK;IACUC,UAAU,GACvBjB,KAAK,CADP,aAAa;;EAGf;EACA;EACA;EACA;EACA;EACA,IAAAkB,aAAA,GAA6B3B,YAAY,CACvC,CAAC,CAAC,EACF,QACF,CAAC;IAHO4B,gBAAgB,GAAAD,aAAA,CAAhBC,gBAAgB;EAKxB,oBACEtB,KAAA;IACEI,GAAG,EAAEA,GAAI;IACTmB,IAAI,EAAC,QAAQ;IACbjB,SAAS,EAAEd,UAAU,CACnB,cAAc,EACd;MACE,qBAAqB,EAClBmB,QAAQ,KAAKa,SAAS,IAAIb,QAAQ,IAAKE;IAC5C,CAAC,EACD;MAAE,4BAA4B,EAAEA;IAAe,CAAC,EAChD;MAAE,YAAY,EAAEE;IAAU,CAAC,EAC3BT,SAAS,EACTgB,gBACF,CAAE;IACFb,EAAE,EAAEA,EAAG;IACPO,OAAO,EAAEA,OAAQ;IACjBC,YAAY,EAAEA,YAAa;IAC3BC,YAAY,EAAEA,YAAa;IAC3BC,KAAK,EAAEA,KAAM;IACbX,QAAQ,EAAEA,QAAS;IACnB,eAAaY,UAAW;IAAAf,QAAA,GAEvBA,QAAQ,eACTP,IAAA,CAACL,eAAe;MACdgC,IAAI,EAAE7B,MAAO;MACbU,SAAS,EAAC,0BAA0B;MACpCoB,SAAS,EAAC;IAAQ,CACnB,CAAC,eACF5B,IAAA,CAACL,eAAe;MACdgC,IAAI,EAAE9B,aAAc;MACpBW,SAAS,EAAC;IAA8B,CACzC,CAAC;EAAA,CACI,CAAC;AAEb,CACF,CAAC;AAEDL,cAAc,CAAC0B,WAAW,GAAG,gBAAgB;AAE7C,eAAe1B,cAAc","ignoreList":[]}

package/dist/SplitButtonGroup.js

@@ -2,12 +2,10 @@ import React from 'react';
 import classNames from 'classnames';
 import { jsx as _jsx } from "react/jsx-runtime";
 export function SplitButtonGroup(props) {
-  var {
-    children,
-    className,
-    style,
-    'data-testid': dataTestId
-  } = props;
+  var children = props.children,
+    className = props.className,
+    style = props.style,
+    dataTestId = props['data-testid'];
   return /*#__PURE__*/_jsx("div", {
     className: classNames('btn-group', className),
     style: style,

package/dist/SplitButtonGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"SplitButtonGroup.js","names":["React","classNames","jsx","_jsx","SplitButtonGroup","props","children","className","style","dataTestId","role"],"sources":["../src/SplitButtonGroup.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\n\ntype SplitButtonGroupProps = React.PropsWithChildren<{\n  className?: string;\n  style?: React.CSSProperties;\n  'data-testid'?: string;\n}>;\n\nexport function SplitButtonGroup(props: SplitButtonGroupProps): JSX.Element {\n  const { children, className, style, 'data-testid': dataTestId } = props;\n\n  return (\n    <div\n      className={classNames('btn-group', className)}\n      style={style}\n      role=\"group\"\n      data-testid={dataTestId}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport default SplitButtonGroup;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQpC,OAAO,SAASC,gBAAgBA,CAACC,KAA4B,EAAe;EAC1E,IAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAEC,KAAK;IAAE,aAAa,EAAEC;EAAW,CAAC,GAAGJ,KAAK;EAEvE,oBACEF,IAAA;IACEI,SAAS,EAAEN,UAAU,CAAC,WAAW,EAAEM,SAAS,CAAE;IAC9CC,KAAK,EAAEA,KAAM;IACbE,IAAI,EAAC,OAAO;IACZ,eAAaD,UAAW;IAAAH,QAAA,EAEvBA;EAAQ,CACN,CAAC;AAEV;AAEA,eAAeF,gBAAgB","ignoreList":[]}
+{"version":3,"file":"SplitButtonGroup.js","names":["React","classNames","jsx","_jsx","SplitButtonGroup","props","children","className","style","dataTestId","role"],"sources":["../src/SplitButtonGroup.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\n\ntype SplitButtonGroupProps = React.PropsWithChildren<{\n  className?: string;\n  style?: React.CSSProperties;\n  'data-testid'?: string;\n}>;\n\nexport function SplitButtonGroup(props: SplitButtonGroupProps): JSX.Element {\n  const { children, className, style, 'data-testid': dataTestId } = props;\n\n  return (\n    <div\n      className={classNames('btn-group', className)}\n      style={style}\n      role=\"group\"\n      data-testid={dataTestId}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport default SplitButtonGroup;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQpC,OAAO,SAASC,gBAAgBA,CAACC,KAA4B,EAAe;EAC1E,IAAQC,QAAQ,GAAkDD,KAAK,CAA/DC,QAAQ;IAAEC,SAAS,GAAuCF,KAAK,CAArDE,SAAS;IAAEC,KAAK,GAAgCH,KAAK,CAA1CG,KAAK;IAAiBC,UAAU,GAAKJ,KAAK,CAAnC,aAAa;EAEjD,oBACEF,IAAA;IACEI,SAAS,EAAEN,UAAU,CAAC,WAAW,EAAEM,SAAS,CAAE;IAC9CC,KAAK,EAAEA,KAAM;IACbE,IAAI,EAAC,OAAO;IACZ,eAAaD,UAAW;IAAAH,QAAA,EAEvBA;EAAQ,CACN,CAAC;AAEV;AAEA,eAAeF,gBAAgB","ignoreList":[]}

package/dist/TableViewEmptyState.js

@@ -1,3 +1,9 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 import { useEffect, useState } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { vsEmptyWindow } from '@deephaven/icons';
@@ -5,12 +11,14 @@ import { Content, Heading, Icon, IllustratedMessage } from "./spectrum/index.js"
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var DEFAULT_DELAY_MS = 500;
 export function TableViewEmptyState(_ref) {
-  var {
-    heading,
-    content,
-    delayMs = DEFAULT_DELAY_MS
-  } = _ref;
-  var [show, setShow] = useState(false);
+  var heading = _ref.heading,
+    content = _ref.content,
+    _ref$delayMs = _ref.delayMs,
+    delayMs = _ref$delayMs === void 0 ? DEFAULT_DELAY_MS : _ref$delayMs;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    show = _useState2[0],
+    setShow = _useState2[1];
 
   // Spectrum `TableView` will render the result of `renderEmptyState` prop
   // immediately, and it will be hidden once data loads. In cases where the data

package/dist/TableViewEmptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableViewEmptyState.js","names":["useEffect","useState","FontAwesomeIcon","vsEmptyWindow","Content","Heading","Icon","IllustratedMessage","jsx","_jsx","jsxs","_jsxs","DEFAULT_DELAY_MS","TableViewEmptyState","_ref","heading","content","delayMs","show","setShow","window","setTimeout","children","size","icon"],"sources":["../src/TableViewEmptyState.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsEmptyWindow } from '@deephaven/icons';\nimport { Content, Heading, Icon, IllustratedMessage } from './spectrum';\n\nconst DEFAULT_DELAY_MS = 500;\n\nexport interface TableViewEmptyStateProps {\n  heading: string;\n  content?: string;\n  delayMs?: number;\n}\n\nexport function TableViewEmptyState({\n  heading,\n  content,\n  delayMs = DEFAULT_DELAY_MS,\n}: TableViewEmptyStateProps): JSX.Element | null {\n  const [show, setShow] = useState(false);\n\n  // Spectrum `TableView` will render the result of `renderEmptyState` prop\n  // immediately, and it will be hidden once data loads. In cases where the data\n  // load is quick, there is a jarring flicker, and the empty data message is\n  // not helpful. This delay will avoid showing the message if data loads within\n  // the `delayMs`.\n  useEffect(() => {\n    window.setTimeout(() => {\n      setShow(true);\n    }, delayMs);\n  }, [delayMs]);\n\n  return show ? (\n    <IllustratedMessage>\n      <Icon size=\"XXL\">\n        <FontAwesomeIcon icon={vsEmptyWindow} />\n      </Icon>\n      <Heading>{heading}</Heading>\n      {content == null ? null : <Content>{content}</Content>}\n    </IllustratedMessage>\n  ) : null;\n}\n\nexport default TableViewEmptyState;\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,aAAa,QAAQ,kBAAkB;AAAC,SACxCC,OAAO,EAAEC,OAAO,EAAEC,IAAI,EAAEC,kBAAkB;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEnD,IAAMC,gBAAgB,GAAG,GAAG;AAQ5B,OAAO,SAASC,mBAAmBA,CAAAC,IAAA,EAIc;EAAA,IAJb;IAClCC,OAAO;IACPC,OAAO;IACPC,OAAO,GAAGL;EACc,CAAC,GAAAE,IAAA;EACzB,IAAM,CAACI,IAAI,EAAEC,OAAO,CAAC,GAAGlB,QAAQ,CAAC,KAAK,CAAC;;EAEvC;EACA;EACA;EACA;EACA;EACAD,SAAS,CAAC,MAAM;IACdoB,MAAM,CAACC,UAAU,CAAC,MAAM;MACtBF,OAAO,CAAC,IAAI,CAAC;IACf,CAAC,EAAEF,OAAO,CAAC;EACb,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,OAAOC,IAAI,gBACTP,KAAA,CAACJ,kBAAkB;IAAAe,QAAA,gBACjBb,IAAA,CAACH,IAAI;MAACiB,IAAI,EAAC,KAAK;MAAAD,QAAA,eACdb,IAAA,CAACP,eAAe;QAACsB,IAAI,EAAErB;MAAc,CAAE;IAAC,CACpC,CAAC,eACPM,IAAA,CAACJ,OAAO;MAAAiB,QAAA,EAAEP;IAAO,CAAU,CAAC,EAC3BC,OAAO,IAAI,IAAI,GAAG,IAAI,gBAAGP,IAAA,CAACL,OAAO;MAAAkB,QAAA,EAAEN;IAAO,CAAU,CAAC;EAAA,CACpC,CAAC,GACnB,IAAI;AACV;AAEA,eAAeH,mBAAmB","ignoreList":[]}
+{"version":3,"file":"TableViewEmptyState.js","names":["useEffect","useState","FontAwesomeIcon","vsEmptyWindow","Content","Heading","Icon","IllustratedMessage","jsx","_jsx","jsxs","_jsxs","DEFAULT_DELAY_MS","TableViewEmptyState","_ref","heading","content","_ref$delayMs","delayMs","_useState","_useState2","_slicedToArray","show","setShow","window","setTimeout","children","size","icon"],"sources":["../src/TableViewEmptyState.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsEmptyWindow } from '@deephaven/icons';\nimport { Content, Heading, Icon, IllustratedMessage } from './spectrum';\n\nconst DEFAULT_DELAY_MS = 500;\n\nexport interface TableViewEmptyStateProps {\n  heading: string;\n  content?: string;\n  delayMs?: number;\n}\n\nexport function TableViewEmptyState({\n  heading,\n  content,\n  delayMs = DEFAULT_DELAY_MS,\n}: TableViewEmptyStateProps): JSX.Element | null {\n  const [show, setShow] = useState(false);\n\n  // Spectrum `TableView` will render the result of `renderEmptyState` prop\n  // immediately, and it will be hidden once data loads. In cases where the data\n  // load is quick, there is a jarring flicker, and the empty data message is\n  // not helpful. This delay will avoid showing the message if data loads within\n  // the `delayMs`.\n  useEffect(() => {\n    window.setTimeout(() => {\n      setShow(true);\n    }, delayMs);\n  }, [delayMs]);\n\n  return show ? (\n    <IllustratedMessage>\n      <Icon size=\"XXL\">\n        <FontAwesomeIcon icon={vsEmptyWindow} />\n      </Icon>\n      <Heading>{heading}</Heading>\n      {content == null ? null : <Content>{content}</Content>}\n    </IllustratedMessage>\n  ) : null;\n}\n\nexport default TableViewEmptyState;\n"],"mappings":";;;;;;AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,aAAa,QAAQ,kBAAkB;AAAC,SACxCC,OAAO,EAAEC,OAAO,EAAEC,IAAI,EAAEC,kBAAkB;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEnD,IAAMC,gBAAgB,GAAG,GAAG;AAQ5B,OAAO,SAASC,mBAAmBA,CAAAC,IAAA,EAIc;EAAA,IAH/CC,OAAO,GAAAD,IAAA,CAAPC,OAAO;IACPC,OAAO,GAAAF,IAAA,CAAPE,OAAO;IAAAC,YAAA,GAAAH,IAAA,CACPI,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAGL,gBAAgB,GAAAK,YAAA;EAE1B,IAAAE,SAAA,GAAwBlB,QAAQ,CAAC,KAAK,CAAC;IAAAmB,UAAA,GAAAC,cAAA,CAAAF,SAAA;IAAhCG,IAAI,GAAAF,UAAA;IAAEG,OAAO,GAAAH,UAAA;;EAEpB;EACA;EACA;EACA;EACA;EACApB,SAAS,CAAC,MAAM;IACdwB,MAAM,CAACC,UAAU,CAAC,MAAM;MACtBF,OAAO,CAAC,IAAI,CAAC;IACf,CAAC,EAAEL,OAAO,CAAC;EACb,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,OAAOI,IAAI,gBACTX,KAAA,CAACJ,kBAAkB;IAAAmB,QAAA,gBACjBjB,IAAA,CAACH,IAAI;MAACqB,IAAI,EAAC,KAAK;MAAAD,QAAA,eACdjB,IAAA,CAACP,eAAe;QAAC0B,IAAI,EAAEzB;MAAc,CAAE;IAAC,CACpC,CAAC,eACPM,IAAA,CAACJ,OAAO;MAAAqB,QAAA,EAAEX;IAAO,CAAU,CAAC,EAC3BC,OAAO,IAAI,IAAI,GAAG,IAAI,gBAAGP,IAAA,CAACL,OAAO;MAAAsB,QAAA,EAAEV;IAAO,CAAU,CAAC;EAAA,CACpC,CAAC,GACnB,IAAI;AACV;AAEA,eAAeH,mBAAmB","ignoreList":[]}

package/dist/TextWithTooltip.js

@@ -4,10 +4,9 @@ import stylesCommon from "./SpectrumComponent.module.css";
 import { Tooltip } from "./popper/index.js";
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function TextWithTooltip(_ref) {
-  var {
-    text,
-    placement = 'top-start'
-  } = _ref;
+  var text = _ref.text,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? 'top-start' : _ref$placement;
   var options = useMemo(() => ({
     placement
   }), [placement]);