@tremolo-ui/react 0.1.6 → 0.2.1

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["cleanup: (() => void) | undefined","width","height","m","rawValue","DEFAULT_PROPS: State","valueAsNumber","colors: Record<string, string | undefined>","DEFAULT_PROPS: State","keyLabelProps: KeyLabelProps","props","pitchPositions: Record<NoteKey, number>","padding","DEFAULT_PROPS: State","rawValue","optionsList: {\n    value: number\n    type: ScaleType\n  }[]","trackProps: SliderTrackProps","thumbProps: SliderThumbProps","scaleComponent: ReactElement | undefined","areaProps: AreaProps","thumbProps: ThumbProps","nx","ny","x"],"sources":["../src/components/AnimationCanvas/canvas.ts","../src/components/AnimationCanvas/index.tsx","../src/hooks/useCallbackRef.ts","../src/hooks/useEventListener.ts","../src/hooks/useRefCallbackEvent.ts","../src/hooks/useDrag.ts","../src/components/_util/index.ts","../src/components/AnimationKnob/index.tsx","../src/components/DragObserver/index.tsx","../src/components/Knob/index.tsx","../src/components/NumberInput/type.ts","../src/components/NumberInput/context.tsx","../src/components/NumberInput/InternalInput.tsx","../src/components/NumberInput/Stepper.tsx","../src/hooks/useInterval.ts","../src/hooks/useLongPress.ts","../src/components/NumberInput/IncrementStepper.tsx","../src/components/NumberInput/DecrementStepper.tsx","../src/components/NumberInput/index.tsx","../src/hooks/useDragWithElement.ts","../src/components/Piano/context.tsx","../src/components/Piano/KeyLabel.tsx","../src/components/Piano/key.tsx","../src/components/Piano/keyboardShortcuts.ts","../src/components/Piano/index.tsx","../src/components/Slider/context.tsx","../src/components/Slider/ScaleOption.tsx","../src/components/Slider/type.ts","../src/components/Slider/Scale.tsx","../src/components/Slider/Thumb.tsx","../src/components/Slider/Track.tsx","../src/components/Slider/index.tsx","../src/components/WheelObserver/index.tsx","../src/components/XYPad/Area.tsx","../src/components/XYPad/Thumb.tsx","../src/components/XYPad/index.tsx","../src/hooks/useAnimationFrame.ts","../src/hooks/useMIDIAccess.ts","../src/hooks/useMIDIMessage.ts","../src/hooks/useMIDIInput.ts"],"sourcesContent":["// https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/save\nexport const drawingState = [\n  'strokeStyle',\n  'fillStyle',\n  'globalAlpha',\n  'lineWidth',\n  'lineCap',\n  'lineJoin',\n  'miterLimit',\n  'lineDashOffset',\n  'shadowOffsetX',\n  'shadowOffsetY',\n  'shadowBlur',\n  'shadowColor',\n  'globalCompositeOperation',\n  'font',\n  'textAlign',\n  'textBaseline',\n  'direction',\n  'imageSmoothingEnabled',\n] as const\n\nexport type DrawingState = (typeof drawingState)[number]\nexport type DrawingStateValue = CanvasRenderingContext2D[DrawingState]\nexport type DrawingContext = Pick<CanvasRenderingContext2D, DrawingState>\n\nexport function isDrawingState(obj: unknown): obj is DrawingState {\n  const d: string[] = [...drawingState]\n  return typeof obj == 'string' && d.includes(obj)\n}\n\nexport function setDprConfig(\n  canvas: HTMLCanvasElement,\n  context: CanvasRenderingContext2D,\n  width: number,\n  height: number,\n  dpr: number,\n) {\n  canvas.width = width * dpr\n  canvas.height = height * dpr\n  // Reset current transformation matrix to the identity matrix\n  context.setTransform(1, 0, 0, 1, 0, 0)\n  context.scale(dpr, dpr)\n  canvas.style.width = `${width}px`\n  canvas.style.height = `${height}px`\n}\n","import clsx from 'clsx'\nimport {\n  ComponentPropsWithoutRef,\n  ReactElement,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n} from 'react'\n\nimport {\n  DrawingContext,\n  drawingState,\n  DrawingStateValue,\n  setDprConfig,\n} from './canvas'\n\n/** @category AnimationCanvas */\nexport type InitFunction = (\n  context: CanvasRenderingContext2D,\n  option: {\n    /** current canvas width */\n    width: number\n    /** current canvas height */\n    height: number\n  },\n) => void\n\n/** @category AnimationCanvas */\nexport type DrawFunction = (\n  context: CanvasRenderingContext2D,\n  option: {\n    /** current canvas width */\n    width: number\n    /** current canvas height */\n    height: number\n    /** frame count */\n    count: number\n    /** delta time (ms) */\n    deltaTime: number\n    /** elapsed time (ms) */\n    elapsedTime: number\n    /** frame per second */\n    fps: number\n  },\n) => void\n\n/** @category AnimationCanvas */\nexport interface CommonProps {\n  draw: DrawFunction\n  init?: InitFunction\n  animate?: boolean\n  /**\n   * @see https://developer.mozilla.org/docs/Web/API/HTMLCanvasElement/getContext#contextattributes\n   */\n  options?: CanvasRenderingContext2DSettings\n}\n\n/** @category AnimationCanvas */\nexport interface AbsoluteSizingProps {\n  width?: number\n  height?: number\n}\n\n/** @category AnimationCanvas */\nexport interface RelativeSizingProps {\n  relativeSize?: boolean\n  reduceFlickering?: boolean\n}\n\n/** @category AnimationCanvas */\nexport type AnimationCanvasProps = CommonProps &\n  AbsoluteSizingProps &\n  RelativeSizingProps\n\n/**\n * A simple animatable canvas with requestAnimationFrame()\n * @category AnimationCanvas\n */\nexport function AnimationCanvas(\n  props: CommonProps &\n    AbsoluteSizingProps &\n    Omit<ComponentPropsWithoutRef<'canvas'>, keyof AnimationCanvasProps>,\n): ReactElement\nexport function AnimationCanvas(\n  pros: CommonProps &\n    RelativeSizingProps &\n    Omit<ComponentPropsWithoutRef<'canvas'>, keyof AnimationCanvasProps>,\n): ReactElement\nexport function AnimationCanvas({\n  // common\n  draw,\n  init,\n  animate = true,\n  options,\n  // absolute\n  width: _width = 100,\n  height: _height = 100,\n  // relative\n  relativeSize,\n  reduceFlickering = true,\n  // canvas props\n  className,\n  onContextMenu = (event) => event.preventDefault(),\n  ...props\n}: AnimationCanvasProps &\n  Omit<\n    ComponentPropsWithoutRef<'canvas'>,\n    keyof AnimationCanvasProps\n  >): ReactElement {\n  const canvasRef = useRef<HTMLCanvasElement>(null)\n  const memoCanvasRef = useRef<HTMLCanvasElement>(null)\n  const reqIdRef = useRef(-1)\n  const widthRef = useRef(0)\n  const heightRef = useRef(0)\n  const deltaMemoRef = useRef(-1)\n  const startTimeRef = useRef(-1)\n\n  const loop = useCallback(\n    (\n      context: CanvasRenderingContext2D,\n      width: RefObject<number>,\n      height: RefObject<number>,\n      count: number,\n    ) => {\n      const now = performance.now()\n      const deltaTime = now - deltaMemoRef.current\n      const elapsedTime = now - startTimeRef.current\n      deltaMemoRef.current = now\n      if (animate) {\n        reqIdRef.current = requestAnimationFrame(() =>\n          loop(context, width, height, count + 1),\n        )\n      }\n      draw(context, {\n        width: width.current,\n        height: height.current,\n        count: count + 1,\n        deltaTime,\n        elapsedTime,\n        fps: 1000 / deltaTime,\n      })\n    },\n    [draw, animate],\n  )\n\n  useEffect(() => {\n    if (!canvasRef.current) return\n    const canvas = canvasRef.current\n    const context = canvas.getContext('2d', options)\n    if (!context) throw new Error('Cannot get canvas context.')\n    const dpr = globalThis.devicePixelRatio\n\n    const firstRendering = (width: number, height: number) => {\n      setDprConfig(canvas, context, width, height, dpr)\n      widthRef.current = width\n      heightRef.current = height\n\n      if (init) init(context, { width, height })\n      const now = performance.now()\n      deltaMemoRef.current = now\n      startTimeRef.current = now\n      loop(context, widthRef, heightRef, -1)\n    }\n\n    if (relativeSize) {\n      const parent = canvas.parentElement\n      if (!parent) throw new Error(\"Canvas doesn't have a parent element.\")\n      const memoCanvas = memoCanvasRef.current\n      const memoContext = memoCanvas?.getContext('2d', options)\n\n      const ro = new ResizeObserver((entries) => {\n        for (const entry of entries) {\n          const w = entry.contentRect.width\n          const h = entry.contentRect.height\n          const contextMemo = {} as DrawingContext\n          if (reduceFlickering && memoCanvas && memoContext) {\n            // Prevents loss of some context when the canvas is resized\n            for (const prop of drawingState) {\n              ;(contextMemo[prop] as DrawingStateValue) = context[prop]\n            }\n            memoCanvas.width = w * dpr\n            memoCanvas.height = h * dpr\n            memoContext.scale(1 / dpr, 1 / dpr)\n            if (canvas.width > 0 && canvas.height > 0) {\n              memoContext.drawImage(canvas, 0, 0)\n            }\n          }\n\n          setDprConfig(canvas, context, w, h, dpr)\n          widthRef.current = w\n          heightRef.current = h\n\n          if (\n            reduceFlickering &&\n            memoContext &&\n            memoCanvas &&\n            memoCanvas.width > 0 &&\n            memoCanvas.height > 0\n          ) {\n            for (const prop of drawingState) {\n              ;(context[prop] as DrawingStateValue) = contextMemo[prop]\n            }\n\n            context.drawImage(memoContext.canvas, 0, 0)\n          }\n\n          if (!animate) {\n            // re rendering\n            loop(context, widthRef, heightRef, -1)\n          }\n        }\n      })\n      ro.observe(parent)\n\n      const width = parent.clientWidth\n      const height = parent.clientHeight\n      firstRendering(width, height)\n\n      return () => {\n        if (reqIdRef.current) cancelAnimationFrame(reqIdRef.current)\n        ro.disconnect()\n      }\n    } else {\n      const { width, height } = canvas.getBoundingClientRect()\n      firstRendering(width, height)\n\n      return () => {\n        if (reqIdRef.current) cancelAnimationFrame(reqIdRef.current)\n      }\n    }\n  }, [loop, init, options, reduceFlickering, relativeSize, animate])\n\n  return (\n    <>\n      <canvas\n        className={clsx('tremolo-animation-canvas', className)}\n        width={relativeSize ? 0 : _width}\n        height={relativeSize ? 0 : _height}\n        ref={canvasRef}\n        onContextMenu={onContextMenu}\n        {...props}\n      ></canvas>\n      {relativeSize && reduceFlickering && (\n        <canvas style={{ display: 'none' }} ref={memoCanvasRef}></canvas>\n      )}\n    </>\n  )\n}\n","import { useCallback, useInsertionEffect, useRef } from 'react'\n\n/**\n * Internal\n * @private\n */\nexport function useCallbackRef<Args extends unknown[], Return>(\n  callback: ((...args: Args) => Return) | undefined,\n  deps: React.DependencyList = [],\n) {\n  const callbackRef = useRef<typeof callback>(() => {\n    throw new Error('Cannot call an event handler while rendering.')\n  })\n\n  useInsertionEffect(() => {\n    callbackRef.current = callback\n  })\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useCallback((...args: Args) => callbackRef.current?.(...args), deps)\n}\n","import { useEffect } from 'react'\n\nimport { useCallbackRef } from './useCallbackRef'\n\ntype Target = EventTarget | null | (() => EventTarget | null)\ntype Options = boolean | AddEventListenerOptions\n\n/**\n * @category hooks\n */\nexport function useEventListener<K extends keyof DocumentEventMap>(\n  target: Target,\n  event: K,\n  handler?: (event: DocumentEventMap[K]) => void,\n  options?: Options,\n): VoidFunction\nexport function useEventListener<K extends keyof WindowEventMap>(\n  target: Target,\n  event: K,\n  handler?: (event: WindowEventMap[K]) => void,\n  options?: Options,\n): VoidFunction\nexport function useEventListener<K extends keyof GlobalEventHandlersEventMap>(\n  target: Target,\n  event: K,\n  handler?: (event: GlobalEventHandlersEventMap[K]) => void,\n  options?: Options,\n): VoidFunction\nexport function useEventListener(\n  target: Target,\n  event: string,\n  handler: ((event: Event) => void) | undefined,\n  options?: Options,\n) {\n  const listener = useCallbackRef(handler)\n\n  useEffect(() => {\n    const node = typeof target === 'function' ? target() : (target ?? document)\n\n    if (!handler || !node) return\n\n    node.addEventListener(event, listener, options)\n    return () => {\n      node.removeEventListener(event, listener, options)\n    }\n  }, [event, target, options, listener, handler])\n\n  return () => {\n    const node = typeof target === 'function' ? target() : (target ?? document)\n    node?.removeEventListener(event, listener, options)\n  }\n}\n","import { useMemo } from 'react'\n\n/**\n * Internal\n * @private\n */\nexport function useRefCallbackEvent<K extends keyof DocumentEventMap>(\n  event: K,\n  handler: (event: DocumentEventMap[K]) => void,\n  options?: boolean | AddEventListenerOptions,\n  deps?: React.DependencyList,\n): (div: EventTarget | null) => void\nexport function useRefCallbackEvent(\n  event: string,\n  handler: (event: Event) => void,\n  options?: boolean | AddEventListenerOptions,\n  deps: React.DependencyList = [],\n): (div: EventTarget | null) => void {\n  return useMemo(() => {\n    let cleanup: (() => void) | undefined\n    return (node: EventTarget | null) => {\n      if (!node) {\n        cleanup?.()\n        return\n      }\n      node.addEventListener(event, handler, options)\n\n      cleanup = () => {\n        node.removeEventListener(event, handler, options)\n      }\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, deps)\n}\n","import { useRef, useCallback } from 'react'\n\nimport { useEventListener } from './useEventListener'\nimport { useRefCallbackEvent } from './useRefCallbackEvent'\n\ninterface UseDragProps {\n  threshold?: number\n\n  onDrag: (x: number, y: number, deltaX: number, deltaY: number) => void\n  onDragStart?: () => void\n  onDragEnd?: () => void\n}\n\n/**\n * @category hooks\n * @returns [refCallback, pointerDownHandler]\n */\nexport function useDrag<T extends Element>({\n  threshold = 1,\n  onDrag,\n  onDragStart,\n  onDragEnd,\n}: UseDragProps): [\n  (div: EventTarget | null) => void,\n  (event: React.PointerEvent<T>) => void,\n] {\n  const dragOffsetX = useRef<number | undefined>(undefined)\n  const dragOffsetY = useRef<number | undefined>(undefined)\n  const dragStartX = useRef(0)\n  const dragStartY = useRef(0)\n\n  const handleDrag = useCallback(\n    (\n      event: MouseEvent | React.MouseEvent<T, MouseEvent> | TouchEvent,\n      first = false,\n    ) => {\n      const isTouch = event instanceof TouchEvent\n      if (isTouch && event.cancelable) event.preventDefault()\n      const screenX = isTouch ? event.touches[0].screenX : event.screenX\n      const screenY = isTouch ? event.touches[0].screenY : event.screenY\n      let deltaX = 0\n      let deltaY = 0\n      if (first) {\n        dragStartX.current = screenX\n        dragStartY.current = screenY\n      }\n      if (dragOffsetX.current) {\n        deltaX = screenX - dragOffsetX.current\n        dragOffsetX.current = screenX\n      }\n      if (dragOffsetY.current) {\n        deltaY = screenY - dragOffsetY.current\n        dragOffsetY.current = screenY\n      }\n      if (Math.abs(deltaX) < threshold && Math.abs(deltaY) < threshold) return\n      onDrag(\n        screenX - dragStartX.current,\n        screenY - dragStartY.current,\n        deltaX,\n        deltaY,\n      )\n    },\n    [threshold, onDrag],\n  )\n\n  const refHandler = useRefCallbackEvent(\n    'touchmove',\n    handleDrag,\n    { passive: false },\n    [onDrag],\n  )\n\n  const pointerDownHandler = useCallback(\n    (event: React.PointerEvent<T>) => {\n      dragOffsetX.current = event.screenX\n      dragOffsetY.current = event.screenY\n      handleDrag(event, true)\n      onDragStart?.()\n    },\n    [handleDrag, onDragStart],\n  )\n\n  useEventListener(globalThis.window, 'mousemove', handleDrag)\n\n  useEventListener(globalThis.window, 'pointerup', () => {\n    dragOffsetX.current = undefined\n    dragOffsetY.current = undefined\n    onDragEnd?.()\n  })\n\n  return [refHandler, pointerDownHandler]\n}\n","export function addNoSelect() {\n  document.body.classList.add('tremolo-no-select')\n}\n\nexport function removeNoSelect() {\n  document.body.classList.remove('tremolo-no-select')\n}\n\nexport function toggleNoSelect() {\n  document.body.classList.toggle('tremolo-no-select')\n}\n","import clsx from 'clsx'\nimport React, {\n  ComponentPropsWithoutRef,\n  CSSProperties,\n  forwardRef,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n} from 'react'\n\nimport {\n  clamp,\n  normalizeValue,\n  radian,\n  rawValue,\n  stepValue,\n  InputEventOption,\n} from '@tremolo-ui/functions'\n\nimport { useDrag } from '../../hooks/useDrag'\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\nimport { addNoSelect, removeNoSelect } from '../_util'\nimport { AnimationCanvas, DrawFunction } from '../AnimationCanvas'\n\n/** @category AnimationKnob */\nexport type AnimationKnobProps = {\n  // required\n  value: number\n  min: number\n  max: number\n\n  // optional\n  step?: number\n  skew?: number // | SkewFunction\n  /**\n   * value set when double-clicking\n   * @see enableDoubleClickDefault\n   */\n  defaultValue?: number\n\n  /**\n   * Value to be used as the starting point of the line when drawing.\n   * @default min\n   */\n  startValue?: number\n\n  /** Priority over width or height */\n  size?: number | `${number}%`\n\n  width?: number | `${number}%`\n  height?: number | `${number}%`\n\n  /** active line color */\n  activeColor?: string\n  /** inactive line color */\n  inactiveColor?: string\n  /** background color */\n  bg?: string\n  /** thumb color */\n  thumb?: string\n  lineWeight?: number\n  thumbWeight?: number\n\n  draw?: DrawFunction\n\n  /** Whether to apply `{use-select: none}` when dragging */\n  bodyNoSelect?: boolean\n  /**\n   * wheel control option\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   */\n  keyboard?: InputEventOption | null\n  enableDoubleClickDefault?: boolean\n  style?: CSSProperties\n  onChange?: (value: number) => void\n}\n\n/**\n * @category AnimationKnob\n */\nexport interface AnimationKnobMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = AnimationKnobProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof AnimationKnobProps>\n\n/**\n * Animatable rotary knob.\n * @category AnimationKnob\n */\nexport const AnimationKnob = forwardRef<AnimationKnobMethods, Props>(\n  (\n    {\n      value,\n      min,\n      max,\n      defaultValue = min,\n      startValue = min,\n      step = 1,\n      skew = 1,\n      size,\n      width = 50,\n      height = 50,\n      activeColor = '#7998ec',\n      inactiveColor = '#eee',\n      bg = '#ccc',\n      thumb = '#4e76e6',\n      lineWeight = 6,\n      thumbWeight = 4,\n      draw,\n      bodyNoSelect = true,\n      wheel = ['raw', 1],\n      keyboard = ['raw', 1],\n      enableDoubleClickDefault = true,\n      style,\n      className,\n      onChange,\n      ...props\n    }: Props,\n    ref,\n  ) => {\n    // -- state and ref ---\n    const valueRef = useRef(0)\n    const elmRef = useRef<HTMLDivElement>(null)\n\n    // --- interpret props ---\n    const isRelativeSize =\n      typeof (size ?? width) == 'string' || typeof height == 'string'\n\n    const onDrag = useCallback(\n      (_x: number, y: number) => {\n        if (!onChange) return\n        const v = rawValue(valueRef.current - y / 100, min, max, skew)\n        const v2 = clamp(stepValue(v, step), min, max)\n        onChange(v2)\n      },\n      [max, min, onChange, skew, step],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!keyboard || !onChange) return\n        const key = event.key\n        if (['ArrowRight', 'ArrowLeft', 'ArrowUp', 'ArrowDown'].includes(key)) {\n          event.preventDefault()\n          const x =\n            key == 'ArrowRight' || key == 'ArrowUp' ? keyboard[1] : -keyboard[1]\n          let v\n          if (keyboard[0] == 'normalized') {\n            const n = normalizeValue(value, min, max, skew)\n            v = rawValue(n + x, min, max, skew)\n          } else {\n            v = value + x\n          }\n          onChange(clamp(stepValue(v, step), min, max))\n        }\n      },\n      [value, min, max, step, skew, keyboard, onChange],\n    )\n\n    // --- hooks ---\n    const [touchMoveRefCallback, pointerDownHandler] = useDrag<HTMLDivElement>({\n      onDrag: onDrag,\n      onDragStart: () => {\n        valueRef.current = normalizeValue(value, min, max, skew)\n        if (bodyNoSelect) addNoSelect()\n      },\n      onDragEnd: () => {\n        if (bodyNoSelect) removeNoSelect()\n      },\n    })\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!wheel) return\n        event.preventDefault()\n        const x = event.deltaY > 0 ? -wheel[1] : wheel[1]\n        let v\n        if (wheel[0] == 'normalized') {\n          const n = normalizeValue(value, min, max, skew)\n          v = rawValue(n + x, min, max, skew)\n        } else {\n          v = value + x\n        }\n        if (onChange) onChange(clamp(stepValue(v, step), min, max))\n      },\n      { passive: false },\n      [wheel, value, min, max, skew, step, onChange],\n    )\n\n    useImperativeHandle(ref, () => {\n      return {\n        focus() {\n          elmRef.current?.focus()\n        },\n        blur() {\n          elmRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <div\n        className={clsx('tremolo-animation-knob', className)}\n        ref={(div) => {\n          elmRef.current = div\n          wheelRefCallback(div)\n          touchMoveRefCallback(div)\n        }}\n        role=\"slider\"\n        tabIndex={0}\n        aria-valuenow={value}\n        aria-valuemax={max}\n        aria-valuemin={min}\n        style={{\n          display: 'inline-block',\n          width: size ?? width,\n          height: size ?? height,\n          cursor: 'pointer',\n          WebkitTapHighlightColor: 'transparent',\n          ...style,\n        }}\n        onPointerDown={pointerDownHandler}\n        onDoubleClick={() => {\n          if (enableDoubleClickDefault && onChange) {\n            onChange(defaultValue)\n          }\n        }}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        <AnimationCanvas\n          {...(isRelativeSize\n            ? { relativeSize: true }\n            : {\n                width: size ?? width,\n                height: size ?? height,\n              })}\n          draw={\n            draw\n              ? draw\n              : (ctx, { width, height }) => {\n                  const p = normalizeValue(value, min, max, skew)\n                  const startP = normalizeValue(startValue, min, max, skew)\n                  const cx = width / 2\n                  const cy = height / 2\n                  const r = Math.min(cx, cy)\n                  if (r <= 0) return\n\n                  // reset\n                  ctx.clearRect(0, 0, width, height)\n                  ctx.lineCap = 'butt'\n\n                  // bg\n                  ctx.beginPath()\n                  ctx.fillStyle = bg\n                  ctx.arc(cx, cy, r - 0.5, 0, 2 * Math.PI)\n                  ctx.fill()\n\n                  ctx.lineWidth = lineWeight\n\n                  // inactive rotary\n                  ctx.beginPath()\n                  ctx.strokeStyle = inactiveColor\n                  ctx.arc(\n                    cx,\n                    cy,\n                    r - 0.5 - lineWeight / 2,\n                    radian(135),\n                    radian(45),\n                  )\n                  ctx.stroke()\n\n                  // active rotary\n                  ctx.beginPath()\n                  ctx.strokeStyle = activeColor\n                  ctx.arc(\n                    cx,\n                    cy,\n                    r - 0.5 - lineWeight / 2,\n                    radian(135 + 270 * startP),\n                    radian(135 + 270 * p),\n                    p < startP,\n                  )\n                  ctx.stroke()\n\n                  // thumb\n                  ctx.lineCap = 'round'\n                  ctx.beginPath()\n                  ctx.moveTo(cx, cy)\n                  ctx.lineTo(\n                    cx +\n                      Math.cos(radian(135 + 270 * p)) *\n                        (r - 0.5 - thumbWeight / 2),\n                    cy +\n                      Math.sin(radian(135 + 270 * p)) *\n                        (r - 0.5 - thumbWeight / 2),\n                  )\n                  ctx.strokeStyle = thumb\n                  ctx.lineWidth = thumbWeight\n                  ctx.stroke()\n                }\n          }\n        />\n      </div>\n    )\n  },\n)\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react'\n\nimport { useDrag } from '../../hooks/useDrag'\n\n/** @category DragObserver */\nexport interface DragObserverProps<T extends ElementType> {\n  /**\n   * React.ElementType\n   * @default div\n   */\n  as?: T\n\n  /**\n   * Threshold at which the onDrag event fires.\n   * Prevents onDrag events from firing, for example, when double-clicking.\n   */\n  threshold?: number\n\n  children?: ReactNode\n  onDrag: (x: number, y: number, deltaX: number, deltaY: number) => void\n  onDragStart?: () => void\n  onDragEnd?: () => void\n}\n\n/** @category DragObserver */\nexport function DragObserver<T extends ElementType = 'div'>(\n  props: DragObserverProps<T> &\n    Omit<ComponentPropsWithoutRef<T>, keyof DragObserverProps<T>>,\n) {\n  const {\n    as: Component = 'div',\n    threshold = 1,\n    children,\n    onDrag,\n    onDragStart,\n    onDragEnd,\n    ...attributes\n  } = props\n\n  const [refCallback, pointerDownHandler] = useDrag({\n    threshold: threshold,\n    onDrag: onDrag,\n    onDragStart: onDragStart,\n    onDragEnd: onDragEnd,\n  })\n\n  return (\n    <Component\n      ref={refCallback}\n      onPointerDown={pointerDownHandler}\n      {...attributes}\n    >\n      {children}\n    </Component>\n  )\n}\n","import clsx from 'clsx'\nimport {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n} from 'react'\n\nimport {\n  clamp,\n  InputEventOption,\n  normalizeValue,\n  radian,\n  rawValue,\n  stepValue,\n} from '@tremolo-ui/functions'\n\nimport { useDrag } from '../../hooks/useDrag'\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\nimport { addNoSelect, removeNoSelect } from '../_util'\n\n/** @category Knob */\nexport interface KnobProps {\n  // required\n  value: number\n  min: number\n  max: number\n\n  // optional\n  step?: number\n  skew?: number // | SkewFunction\n  /**\n   * value set when double-clicking\n   * @default min\n   * @see enableDoubleClickDefault\n   */\n  defaultValue?: number\n\n  /**\n   * Value to be used as the starting point of the line when drawing.\n   * @default min\n   */\n  startValue?: number\n\n  /** width and height */\n  size?: number | string\n\n  /** Whether to apply `{use-select: none}` when dragging */\n  bodyNoSelect?: boolean\n  /**\n   * wheel control option\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   */\n  keyboard?: InputEventOption | null\n  enableDoubleClickDefault?: boolean\n\n  disabled?: boolean\n  readonly?: boolean\n\n  /** color */\n  activeLine?: string\n  /** color */\n  inactiveLine?: string\n  /** color */\n  thumb?: string\n  /** color */\n  thumbLine?: string\n  /** percent (0-100) */\n  thumbSize?: number\n  /** percent (0-100) */\n  thumbLineWeight?: number\n  /** percent (0-100) */\n  thumbLineLength?: number\n  /** line weight [px] */\n  lineWeight?: number\n  /** angle range [degree] */\n  angleRange?: number\n\n  classes?: {\n    activeLine?: string\n    inactiveLine?: string\n    thumb?: string\n    thumbLine?: string\n  }\n\n  onChange?: (value: number) => void\n}\n\n/**\n * @category Knob\n */\nexport interface KnobMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = KnobProps & Omit<ComponentPropsWithoutRef<'svg'>, keyof KnobProps>\n\n/**\n * Interactive rotary knob component implemented in SVG.\n *\n * @category Knob\n */\nexport const Knob = forwardRef<KnobMethods, Props>(\n  (\n    {\n      value,\n      min,\n      max,\n      step = 1,\n      skew = 1,\n      defaultValue = min,\n      startValue = min,\n      size = 50,\n      bodyNoSelect = true,\n      wheel = ['raw', 1],\n      keyboard = ['raw', 1],\n      enableDoubleClickDefault = true,\n      disabled = false,\n      readonly = false,\n      activeLine,\n      inactiveLine,\n      thumb,\n      thumbLine,\n      thumbSize = 84,\n      thumbLineWeight = 6,\n      thumbLineLength = 35,\n      lineWeight = 6,\n      angleRange = 270,\n      onChange,\n      onKeyDown,\n      onPointerDown,\n      onDoubleClick,\n      className,\n      classes,\n      ...props\n    }: Props,\n    forwardedRef,\n  ) => {\n    const valueRef = useRef(0)\n    const elmRef = useRef<HTMLOrSVGElement>(null)\n\n    // --- internal functions ---\n    const onDrag = useCallback(\n      (_x: number, y: number) => {\n        if (!onChange || readonly) return\n        const v = rawValue(valueRef.current - y / 100, min, max, skew)\n        const clamped = clamp(stepValue(v, step), min, max)\n        onChange(clamped)\n      },\n      [max, min, onChange, readonly, skew, step],\n    )\n\n    const updateValueByEvent = useCallback(\n      (eventType: InputEventOption[0], x: number) => {\n        let newValue\n        if (eventType == 'normalized') {\n          const n = normalizeValue(value, min, max, skew)\n          newValue = rawValue(n + x, min, max, skew)\n        } else {\n          newValue = value + x\n        }\n        return clamp(stepValue(newValue, step), min, max)\n      },\n      [max, min, skew, step, value],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLOrSVGElement>) => {\n        if (!keyboard || !onChange || readonly) return\n        const key = event.key\n        if (['ArrowRight', 'ArrowLeft', 'ArrowUp', 'ArrowDown'].includes(key)) {\n          event.preventDefault()\n          const x =\n            key == 'ArrowRight' || key == 'ArrowUp' ? keyboard[1] : -keyboard[1]\n          onChange(updateValueByEvent(keyboard[0], x))\n        }\n      },\n      [keyboard, onChange, readonly, updateValueByEvent],\n    )\n\n    // --- hooks ---\n    const [touchMoveRefCallback, pointerDownHandler] = useDrag<SVGElement>({\n      onDrag: onDrag,\n      onDragStart: () => {\n        valueRef.current = normalizeValue(value, min, max, skew)\n        if (bodyNoSelect) addNoSelect()\n      },\n      onDragEnd: () => {\n        if (bodyNoSelect) removeNoSelect()\n      },\n    })\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!wheel || readonly) return\n        event.preventDefault()\n        if (!onChange || event.deltaY == 0) return\n        const x = Math.sign(event.deltaY) * -wheel[1]\n        onChange(updateValueByEvent(wheel[0], x))\n      },\n      { passive: false },\n      [wheel, onChange, readonly, updateValueByEvent],\n    )\n\n    useImperativeHandle(forwardedRef, () => {\n      return {\n        focus() {\n          elmRef.current?.focus()\n        },\n        blur() {\n          elmRef.current?.blur()\n        },\n      }\n    }, [])\n\n    const viewBoxSize = 100\n    const center = viewBoxSize / 2\n    const padding = (viewBoxSize - clamp(thumbSize, 0, 100)) / 2 // %\n    const p = normalizeValue(value, min, max, skew)\n    const s = normalizeValue(startValue, min, max, skew)\n\n    // 時計回りで描画していく\n    const r1 = -angleRange / 2 // ロータリー開始位置\n    const r2 = r1 + Math.min(p, s) * angleRange // activeLineの開始位置\n    const r3 = r1 + Math.max(p, s) * angleRange // activeLineの終了位置\n    const r4 = angleRange / 2 // ロータリー終了位置\n    const x1 = center + center * Math.cos(radian(r1 - 90))\n    const y1 = center + center * Math.sin(radian(r1 - 90))\n    const x2 = center + center * Math.cos(radian(r2 - 90))\n    const y2 = center + center * Math.sin(radian(r2 - 90))\n    const x3 = center + center * Math.cos(radian(r3 - 90))\n    const y3 = center + center * Math.sin(radian(r3 - 90))\n    const x4 = center + center * Math.cos(radian(r4 - 90))\n    const y4 = center + center * Math.sin(radian(r4 - 90))\n\n    return (\n      <svg\n        ref={(div) => {\n          elmRef.current = div\n          wheelRefCallback(div)\n          touchMoveRefCallback(div)\n        }}\n        className={clsx('tremolo-knob', className)}\n        viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n        width={size}\n        height={size}\n        tabIndex={0}\n        role=\"slider\"\n        aria-valuenow={value}\n        aria-valuemin={min}\n        aria-valuemax={max}\n        aria-disabled={disabled}\n        aria-readonly={readonly}\n        onPointerDown={(event) => {\n          pointerDownHandler(event)\n          onPointerDown?.(event)\n        }}\n        onDoubleClick={(event) => {\n          if (enableDoubleClickDefault && onChange) {\n            onChange(defaultValue)\n          }\n          onDoubleClick?.(event)\n        }}\n        onKeyDown={(event) => {\n          handleKeyDown(event)\n          onKeyDown?.(event)\n        }}\n        {...props}\n      >\n        {/* lines */}\n        {startValue > min && (\n          <path\n            className={clsx(\n              'tremolo-knob-inactive-line',\n              classes?.inactiveLine,\n            )}\n            d={`M ${x1} ${y1} A ${center} ${center} -135 ${r2 - r1 > 180 ? 1 : 0} 1 ${x2}, ${y2}`}\n            fill=\"none\"\n            stroke={inactiveLine || 'currentColor'}\n            strokeWidth={lineWeight}\n          />\n        )}\n        <path\n          className={clsx('tremolo-knob-active-line', classes?.activeLine)}\n          d={`M ${x2} ${y2} A ${center} ${center} -135 ${r3 - r2 > 180 ? 1 : 0} 1 ${x3}, ${y3}`}\n          fill=\"none\"\n          stroke={activeLine || 'currentColor'}\n          strokeWidth={lineWeight}\n        />\n        {startValue < max && (\n          <path\n            className={clsx(\n              'tremolo-knob-inactive-line',\n              classes?.inactiveLine,\n            )}\n            d={`M ${x3} ${y3} A ${center} ${center} -135 ${r4 - r3 > 180 ? 1 : 0} 1 ${x4}, ${y4}`}\n            fill=\"none\"\n            stroke={inactiveLine || 'currentColor'}\n            strokeWidth={lineWeight}\n          />\n        )}\n        {/* thumb */}\n        <svg className={clsx('tremolo-knob-thumb', classes?.thumb)}>\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r={`${thumbSize / 2}%`}\n            fill={thumb || 'currentColor'}\n          />\n          <line\n            className={clsx('tremolo-knob-thumb-line', classes?.thumbLine)}\n            x1=\"50%\"\n            y1={`${padding}%`}\n            x2=\"50%\"\n            y2={`${thumbLineLength}%`}\n            stroke={thumbLine || 'currentColor'}\n            strokeWidth={`${thumbLineWeight}%`}\n            // NOTE\n            // https://bugs.webkit.org/show_bug.cgi?id=201854\n            // https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Attribute/transform-origin#browser_compatibility\n            style={{\n              transform: `rotate(${r1 + p * angleRange}deg)`,\n              transformOrigin: '50% 50%',\n            }}\n          />\n        </svg>\n      </svg>\n    )\n  },\n)\n","/**\n * [unit, scale][]\n * @example\n * [['Hz', 1], ['kHz', 1000]]\n */\nexport type Units = [string, number][]\n\nexport function selectUnit(units: Units, value: number): [string, number] {\n  let i = 0\n  for (; i < units.length; i++) {\n    if (Math.abs(units[i][1]) > Math.abs(value)) break\n  }\n  return units[Math.max(0, i - 1)]\n}\n\nexport function parseValue(\n  inputString: string,\n  units?: string | Units,\n  digit?: number,\n): {\n  rawValue: number\n  formatValue: string\n  unit: string\n} {\n  const str = inputString.trim()\n  if (!units || typeof units == 'string') {\n    const m = str.match(/-?\\d+(\\.\\d+)?/)\n    let v = Number(m?.[0] ?? '0')\n    v = isNaN(v) ? 0 : v\n    return {\n      rawValue: v,\n      formatValue: (digit != undefined ? v.toFixed(digit) : v) + (units ?? ''),\n      unit: units ?? '',\n    }\n  }\n\n  const unitList = units.map(([u, _s]) => u)\n  const scaleList = units.map(([_u, s]) => s)\n  let rawValue = 0\n  let unit = unitList[0]\n  let formatValue =\n    (digit != undefined ? rawValue.toFixed(digit) : rawValue) + unit\n  const m = str.match(/^(-?\\d+(\\.\\d+)?)\\s*(\\w*)$/)\n  if (m) {\n    rawValue = Number(m[1]) || 0\n    const uIndex = unitList.indexOf(m[3])\n    rawValue *= uIndex != -1 ? scaleList[uIndex] : 1\n    const [u, scale] = selectUnit(units, rawValue)\n    const v = rawValue / scale\n    formatValue = (digit != undefined ? v.toFixed(digit) : v) + u\n    unit = u\n  }\n  return {\n    rawValue: rawValue,\n    formatValue: formatValue,\n    unit: unit,\n  }\n}\n","import { createContext, useContext, useEffect, useRef } from 'react'\nimport { createStore, useStore } from 'zustand'\n\nimport { clamp } from '@tremolo-ui/functions'\n\nimport { parseValue, Units } from './type'\n\ntype State = {\n  value: string\n  valueAsNumber: number\n  step: number\n\n  min?: number\n  max?: number\n  units?: string | Units\n  digit?: number\n  readonly?: boolean\n  keepWithinRange?: boolean\n  onChange?: (value: number, text: string) => void\n}\n\ntype Action = {\n  increment: () => void\n  decrement: () => void\n  change: (value: string) => void\n}\n\ntype NumberInputStore = ReturnType<typeof createNumberInputStore>\n\ntype ProviderProps = Partial<Omit<State, 'value'> & { value: number | string }>\n\nexport function safeClamp(\n  value: number,\n  min = Number.MIN_SAFE_INTEGER,\n  max = Number.MAX_SAFE_INTEGER,\n) {\n  return clamp(value, min, max)\n}\n\nconst createNumberInputStore = (initProps?: ProviderProps) => {\n  const DEFAULT_PROPS: State = {\n    value: '',\n    valueAsNumber: 0,\n    min: 0,\n    max: 0,\n    step: 1,\n    readonly: false,\n    keepWithinRange: true,\n    onChange: (_v: number, _t: string) => {},\n  }\n\n  return createStore<State & Action>()((set) => ({\n    ...DEFAULT_PROPS,\n    ...initProps,\n    ...{\n      value: parseValue(\n        String(initProps?.value || ''),\n        initProps?.units,\n        initProps?.digit,\n      ).formatValue,\n      valueAsNumber: parseValue(\n        String(initProps?.value || ''),\n        initProps?.units,\n        initProps?.digit,\n      ).rawValue,\n    },\n    increment: () =>\n      set((state) => {\n        if (state.readonly) return {}\n        const current = parseValue(\n          state.value,\n          state.units,\n          state.digit,\n        ).rawValue\n        let next = current + (state.step ?? 1)\n        if (state.keepWithinRange) {\n          next = safeClamp(next, state.min, state.max)\n        }\n        const v = parseValue(String(next), state.units, state.digit).formatValue\n        state?.onChange?.(next, v)\n        return {\n          value: v,\n          valueAsNumber: next,\n        }\n      }),\n    decrement: () =>\n      set((state) => {\n        if (state.readonly) return {}\n        const current = parseValue(\n          state.value,\n          state.units,\n          state.digit,\n        ).rawValue\n        let next = current - (state.step ?? 1)\n        if (state.keepWithinRange) {\n          next = safeClamp(next, state.min, state.max)\n        }\n        const v = parseValue(String(next), state.units, state.digit).formatValue\n        state?.onChange?.(next, v)\n        return {\n          value: v,\n          valueAsNumber: next,\n        }\n      }),\n    change: (value) =>\n      set((state) => {\n        if (state.readonly) return {}\n        const v = value ?? ''\n        return {\n          value: v,\n          valueAsNumber: parseValue(v, state.units, state.digit).rawValue,\n        }\n      }),\n  }))\n}\n\nconst NumberInputContext = createContext<NumberInputStore | null>(null)\n\ntype NumberInputProviderProps = React.PropsWithChildren<ProviderProps>\n\nexport function NumberInputProvider({\n  children,\n  ...props\n}: NumberInputProviderProps) {\n  const storeRef = useRef<NumberInputStore>(null)\n  if (!storeRef.current) {\n    storeRef.current = createNumberInputStore(props)\n  }\n\n  useEffect(() => {\n    if (storeRef.current) {\n      const parsed = parseValue(\n        String(props?.value || ''),\n        props?.units,\n        props?.digit,\n      )\n      storeRef.current.setState({\n        ...props,\n        ...{\n          value: parsed.formatValue,\n          valueAsNumber: parsed.rawValue,\n        },\n      })\n    } else {\n      storeRef.current = createNumberInputStore(props)\n    }\n  }, [props])\n\n  return (\n    <NumberInputContext.Provider value={storeRef.current}>\n      {children}\n    </NumberInputContext.Provider>\n  )\n}\n\n/** @category NumberInput */\nexport function useNumberInputContext<T>(\n  selector: (state: State & Action) => T,\n): T {\n  const store = useContext(NumberInputContext)\n  if (!store) throw new Error('Missing NumberInputContext.Provider in the tree')\n  return useStore(store, selector)\n}\n","import clsx from 'clsx'\nimport {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\n\nimport {\n  clamp,\n  InputEventOption,\n  normalizeValue,\n  rawValue,\n  stepValue,\n} from '@tremolo-ui/functions'\n\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\n\nimport { safeClamp, useNumberInputContext } from './context'\nimport { parseValue } from './type'\n\nimport { NumberInputMethods } from '.'\n\ninterface InternalProps {\n  disabled: boolean\n  readonly: boolean\n  wheel: InputEventOption | null\n  keyboard: InputEventOption | null\n\n  selectWithFocus?: 'all' | 'number' | 'none'\n  blurOnEnter?: boolean\n  keepWithinRange?: boolean\n  clampValueOnBlur?: boolean\n\n  onChange?: (value: number, text: string) => void\n  onFocus?: (\n    value: number,\n    text: string,\n    event: React.FocusEvent<HTMLInputElement, Element>,\n  ) => void\n  onBlur?: (\n    value: number,\n    text: string,\n    event: React.FocusEvent<HTMLInputElement, Element>,\n  ) => void\n}\n\ntype InternalPropsWithAttributes = InternalProps &\n  Omit<ComponentPropsWithoutRef<'input'>, keyof InternalProps>\n\nexport const InternalInput = forwardRef<\n  NumberInputMethods,\n  InternalPropsWithAttributes\n>(\n  (\n    {\n      disabled,\n      readonly,\n      selectWithFocus,\n      blurOnEnter,\n      clampValueOnBlur,\n      wheel,\n      keyboard,\n      className,\n      onChange,\n      onFocus,\n      onBlur,\n      onKeyDown,\n      children: _children,\n      ...props\n    }: InternalPropsWithAttributes,\n    ref,\n  ) => {\n    const elmRef = useRef<HTMLInputElement>(null)\n    const [editing, setEditing] = useState(false)\n    const value = useNumberInputContext((s) => s.value)\n    const valueAsNumber = useNumberInputContext((s) => s.valueAsNumber)\n    const min = useNumberInputContext((s) => s.min)\n    const max = useNumberInputContext((s) => s.max)\n    const step = useNumberInputContext((s) => s.step)\n    const units = useNumberInputContext((s) => s.units)\n    const digit = useNumberInputContext((s) => s.digit)\n    const change = useNumberInputContext((s) => s.change)\n\n    const error = useMemo(() => {\n      if (editing) return false\n      const v = valueAsNumber\n      return (min ?? -Infinity) > v || v > (max ?? Infinity)\n    }, [editing, max, min, valueAsNumber])\n\n    const updateValueByEvent = useCallback(\n      (eventType: InputEventOption[0], x: number) => {\n        let newValue\n        if (eventType == 'normalized') {\n          if (!min || !max) {\n            throw new Error('required parameter: min, max') // TODO\n          }\n          const n = normalizeValue(valueAsNumber, min, max)\n          newValue = rawValue(n + x, min, max)\n          return clamp(stepValue(newValue, step), min, max)\n        } else {\n          newValue = valueAsNumber + x\n          return stepValue(newValue, step)\n        }\n      },\n      [max, min, step, valueAsNumber],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!keyboard || !onChange || readonly) return\n        const key = event.key\n        if (!['ArrowUp', 'ArrowDown'].includes(key)) return\n        event.preventDefault()\n        const x = key == 'ArrowUp' ? keyboard[1] : -keyboard[1]\n        const parsed = parseValue(String(updateValueByEvent(keyboard[0], x)))\n        // console.log('key control')\n        onChange?.(parsed.rawValue, parsed.formatValue)\n      },\n      [keyboard, readonly, onChange, updateValueByEvent],\n    )\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!wheel || readonly) return\n        event.preventDefault()\n        if (!onChange || event.deltaY == 0) return\n        const x = Math.sign(event.deltaY) * -wheel[1]\n        const parsed = parseValue(String(updateValueByEvent(wheel[0], x)))\n        // console.log('wheel control')\n        onChange?.(parsed.rawValue, parsed.formatValue)\n      },\n      { passive: false },\n      [wheel, readonly, onChange, updateValueByEvent],\n    )\n\n    useImperativeHandle(ref, () => {\n      return {\n        focus() {\n          elmRef.current?.focus()\n        },\n        blur() {\n          elmRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <input\n        ref={(input) => {\n          elmRef.current = input\n          wheelRefCallback(input)\n        }}\n        className={clsx('tremolo-number-input', className)}\n        value={value}\n        min={min}\n        max={max}\n        step={step}\n        type=\"text\"\n        aria-disabled={disabled}\n        aria-readonly={readonly}\n        tabIndex={-1}\n        data-error={error}\n        onChange={(event) => {\n          if (readonly) return\n          const v = event.currentTarget.value\n          const cursorPos = event.target.selectionStart\n          change(v)\n          const valueAsNumber = parseValue(v, units, digit).rawValue\n          onChange?.(valueAsNumber, v)\n          if (cursorPos) {\n            event.target.selectionStart = cursorPos\n            event.target.selectionEnd = cursorPos\n          }\n        }}\n        onFocus={(event) => {\n          setEditing(true)\n          const v = event.currentTarget.value\n          const parsed = parseValue(v, units, digit)\n          if (selectWithFocus == 'all') {\n            event.currentTarget.setSelectionRange(0, v.length)\n          } else if (selectWithFocus == 'number') {\n            event.currentTarget.setSelectionRange(\n              0,\n              parsed.formatValue.length - parsed.unit.length,\n            )\n          }\n          onFocus?.(parsed.rawValue, parsed.formatValue, event)\n        }}\n        onBlur={(event) => {\n          setEditing(false)\n          // update value\n          let v = parseValue(event.currentTarget.value, units, digit).rawValue\n          if (clampValueOnBlur) {\n            v = safeClamp(v, min, max)\n          }\n          const parsed = parseValue(String(v), units, digit)\n          change(parsed.formatValue)\n          if (clampValueOnBlur) {\n            onChange?.(parsed.rawValue, parsed.formatValue)\n          }\n          onBlur?.(parsed.rawValue, parsed.formatValue, event)\n        }}\n        onKeyDown={(event) => {\n          if (blurOnEnter && event.key == 'Enter') {\n            event.currentTarget.blur()\n          }\n          handleKeyDown(event)\n          onKeyDown?.(event)\n        }}\n        {...props}\n      />\n    )\n  },\n)\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\n\n/** @category NumberInput */\nexport interface StepperProps {\n  /** Display only when hovering. */\n  dynamic?: boolean\n  children?: ReactNode\n}\n\n/** @category NumberInput */\nexport function Stepper({\n  dynamic = true,\n  children,\n  className,\n  ...props\n}: StepperProps & Omit<ComponentPropsWithoutRef<'div'>, keyof StepperProps>) {\n  return (\n    <div\n      className={clsx('tremolo-number-input-stepper', className)}\n      data-dynamic={dynamic}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n","import { useEffect, useRef } from 'react'\n\n/**\n * @category hooks\n */\nexport function useInterval(callback: () => void, delay: number | null) {\n  const savedCallback = useRef(callback)\n\n  // Remember the latest callback if it changes.\n  useEffect(() => {\n    savedCallback.current = callback\n  }, [callback])\n\n  // Set up the interval.\n  useEffect(() => {\n    // Don't schedule if no delay is specified.\n    // Note: 0 is a valid value for delay.\n    if (delay === null) {\n      return\n    }\n\n    const id = setInterval(() => {\n      savedCallback.current()\n    }, delay)\n\n    return () => {\n      clearInterval(id)\n    }\n  }, [delay])\n}\n","import { useCallback, useState } from 'react'\n\nimport { useEventListener } from './useEventListener'\nimport { useInterval } from './useInterval'\n\n/**\n * @category hooks\n */\nexport function useLongPress(\n  callback: () => void,\n  initialDelay = 500,\n  interval = 40,\n) {\n  const [pressed, setPressed] = useState(false)\n  const [delay, setDelay] = useState(initialDelay)\n\n  useInterval(\n    () => {\n      callback()\n      setDelay(interval)\n    },\n    pressed ? delay : null,\n  )\n\n  useEventListener(globalThis.window, 'pointerup', () => {\n    setPressed(false)\n    setDelay(initialDelay)\n  })\n\n  return useCallback(() => {\n    callback()\n    setPressed(true)\n  }, [callback])\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { useLongPress } from '../../hooks/useLongPress'\n\nimport { useNumberInputContext } from './context'\n\n/** @category NumberInput */\nexport interface IncrementStepperProps {\n  size?: number\n  children?: ReactNode\n}\n\n/** @category NumberInput */\nexport function IncrementStepper({\n  size = 12,\n  children,\n  className,\n  ...props\n}: IncrementStepperProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof IncrementStepperProps>) {\n  const max = useNumberInputContext((s) => s.max)\n  const valueAsNumber = useNumberInputContext((s) => s.valueAsNumber)\n  const readonly = useNumberInputContext((s) => s.readonly)\n  const keepWithinRange = useNumberInputContext((s) => s.keepWithinRange)\n  const increment = useNumberInputContext((s) => s.increment)\n\n  const press = useLongPress(increment)\n\n  return (\n    // eslint-disable-next-line jsx-a11y/role-supports-aria-props\n    <div\n      className={clsx('tremolo-number-input-increment-stepper', className)}\n      role=\"button\"\n      tabIndex={-1}\n      aria-disabled={\n        keepWithinRange && valueAsNumber >= (max ?? Number.MAX_SAFE_INTEGER)\n      }\n      aria-readonly={readonly}\n      onPointerDown={press}\n      {...props}\n    >\n      {children || (\n        <svg\n          width={size}\n          height={size}\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        >\n          <polyline points=\"18 15 12 9 6 15\" />\n        </svg>\n      )}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { useLongPress } from '../../hooks/useLongPress'\n\nimport { useNumberInputContext } from './context'\n\n/** @category NumberInput */\nexport interface DecrementStepperProps {\n  size?: number\n  children?: ReactNode\n}\n\n/** @category NumberInput */\nexport function DecrementStepper({\n  size = 12,\n  children,\n  className,\n  ...props\n}: DecrementStepperProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof DecrementStepperProps>) {\n  const min = useNumberInputContext((s) => s.min)\n  const valueAsNumber = useNumberInputContext((s) => s.valueAsNumber)\n  const readonly = useNumberInputContext((s) => s.readonly)\n  const keepWithinRange = useNumberInputContext((s) => s.keepWithinRange)\n  const decrement = useNumberInputContext((s) => s.decrement)\n\n  const press = useLongPress(decrement)\n\n  return (\n    // eslint-disable-next-line jsx-a11y/role-supports-aria-props\n    <div\n      className={clsx('tremolo-number-input-decrement-stepper', className)}\n      role=\"button\"\n      tabIndex={-1}\n      aria-disabled={\n        keepWithinRange && valueAsNumber <= (min ?? Number.MIN_SAFE_INTEGER)\n      }\n      aria-readonly={readonly}\n      onPointerDown={press}\n      {...props}\n    >\n      {children || (\n        <svg\n          width={size}\n          height={size}\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        >\n          <polyline points=\"6 9 12 15 18 9\" />\n        </svg>\n      )}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, forwardRef, ReactNode } from 'react'\n\nimport { InputEventOption } from '@tremolo-ui/functions'\n\nimport { NumberInputProvider } from './context'\nimport { InternalInput } from './InternalInput'\nimport { Units } from './type'\n\n/*\nTODO\n- numberMode: focusが当たった時だけ、parse + type=\"number\"にする\n- skew\n*/\n\n/** @category NumberInput */\nexport interface NumberInputProps {\n  value: number | string\n\n  /**\n   * @default Number.MIN_SAFE_INTEGER\n   */\n  min?: number\n  /**\n   * @default Number.MAX_SAFE_INTEGER\n   */\n  max?: number\n  step?: number\n\n  /**\n   * @example\n   * units='Hz'\n   * units={[['Hz', 1], ['kHz', 1000]]}\n   * units={[['ms', 1], ['s', 1000]]}\n   */\n  units?: string | Units\n\n  /**\n   * Digits for rounding numbers.\n   * @example\n   * with:\n   * units={[['Hz', 1], ['kHz', 1000]]}\n   * digit={3}\n   * results:\n   * value=100 -> 100Hz, value=1600 -> 1.60Hz\n   */\n  digit?: number\n\n  readonly?: boolean\n\n  variant?: 'outline' | 'filled' | 'flushed' | 'unstyled'\n\n  selectWithFocus?: 'all' | 'number' | 'none'\n  blurOnEnter?: boolean\n  keepWithinRange?: boolean\n  clampValueOnBlur?: boolean\n\n  /**\n   * wheel control option\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   */\n  keyboard?: InputEventOption | null\n\n  activeColor?: string\n\n  wrapperClassName?: string\n\n  onChange?: (value: number, text: string) => void\n  onFocus?: (\n    value: number,\n    text: string,\n    event: React.FocusEvent<HTMLInputElement, Element>,\n  ) => void\n  onBlur?: (\n    value: number,\n    text: string,\n    event: React.FocusEvent<HTMLInputElement, Element>,\n  ) => void\n\n  children?: ReactNode\n}\n\n/**\n * @category NumberInput\n */\nexport interface NumberInputMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = NumberInputProps &\n  Omit<ComponentPropsWithoutRef<'input'>, keyof NumberInputProps | 'type'>\n\n/**\n * Input with some useful functions for entering numerical values.\n * @category NumberInput\n */\nexport const NumberInput = forwardRef<NumberInputMethods, Props>(\n  (\n    {\n      value,\n      min,\n      max,\n      step = 1,\n      units,\n      readonly = false,\n      disabled = false,\n      digit,\n      variant = 'outline',\n      selectWithFocus = 'none',\n      blurOnEnter = true,\n      keepWithinRange = true,\n      clampValueOnBlur = true,\n      wheel = ['raw', 1],\n      keyboard = ['raw', 1],\n      activeColor,\n      wrapperClassName,\n      className,\n      onChange,\n      onFocus,\n      onBlur,\n      children,\n      ...props\n    }: Props,\n    forwardedRef,\n  ) => {\n    const colors: Record<string, string | undefined> = {\n      '--active-color': activeColor,\n    }\n    return (\n      <NumberInputProvider\n        value={String(value)}\n        min={min}\n        max={max}\n        step={step}\n        units={units}\n        digit={digit}\n        readonly={readonly}\n        keepWithinRange={keepWithinRange}\n        onChange={onChange}\n      >\n        <div\n          className={clsx('tremolo-number-input-wrapper', wrapperClassName)}\n          // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n          tabIndex={0}\n          style={{\n            ...colors,\n          }}\n          data-stepper={!!children}\n          data-variant={variant}\n        >\n          <InternalInput\n            ref={forwardedRef}\n            readonly={readonly}\n            disabled={disabled}\n            selectWithFocus={selectWithFocus}\n            blurOnEnter={blurOnEnter}\n            clampValueOnBlur={clampValueOnBlur}\n            wheel={wheel}\n            keyboard={keyboard}\n            className={className}\n            onChange={onChange}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            {...props}\n          />\n          {children}\n        </div>\n      </NumberInputProvider>\n    )\n  },\n)\n\nexport * from './Stepper'\nexport * from './IncrementStepper'\nexport * from './DecrementStepper'\nexport { type Units } from './type'\n","import { useRef, useCallback, RefObject } from 'react'\n\nimport { normalizeValue } from '@tremolo-ui/functions'\n\nimport { useEventListener } from './useEventListener'\nimport { useRefCallbackEvent } from './useRefCallbackEvent'\n\ninterface UseDragWithElementProps<T extends Element> {\n  baseElementRef: RefObject<T | null>\n  onDrag: (normalizedX: number, normalizedY: number) => void\n  onDragStart?: (normalizedX: number, normalizedY: number) => void\n  onDragEnd?: (normalizedX: number, normalizedY: number) => void\n}\n\n/**\n * @category hooks\n * @returns [refCallback, pointerDownHandler]\n */\nexport function useDragWithElement<T extends Element>({\n  baseElementRef,\n  onDrag,\n  onDragStart,\n  onDragEnd,\n}: UseDragWithElementProps<T>): [\n  (div: EventTarget | null) => void,\n  (event: React.PointerEvent<T>) => void,\n] {\n  const dragged = useRef(false)\n  const normalizedX = useRef(0)\n  const normalizedY = useRef(0)\n\n  const handleDrag = useCallback(\n    (event: MouseEvent | React.PointerEvent<T> | TouchEvent) => {\n      if (!baseElementRef.current || !dragged.current) {\n        return\n      }\n      const isTouch = event instanceof TouchEvent\n      if (isTouch && event.cancelable) event.preventDefault()\n      const { left, top, right, bottom } =\n        baseElementRef.current.getBoundingClientRect()\n      const mouseX = isTouch ? event.touches[0].clientX : event.clientX\n      const mouseY = isTouch ? event.touches[0].clientY : event.clientY\n      const nx = normalizeValue(mouseX, left, right)\n      const ny = normalizeValue(mouseY, top, bottom)\n      normalizedX.current = nx\n      normalizedY.current = ny\n      onDrag(nx, ny)\n    },\n    [onDrag, baseElementRef],\n  )\n\n  const refHandler = useRefCallbackEvent(\n    'touchmove',\n    handleDrag,\n    { passive: false },\n    [onDrag],\n  )\n\n  const pointerDownHandler = useCallback(\n    (event: React.PointerEvent<T>) => {\n      dragged.current = true\n      handleDrag(event)\n      onDragStart?.(normalizedX.current, normalizedY.current)\n    },\n    [handleDrag, onDragStart],\n  )\n\n  useEventListener(globalThis.window, 'pointermove', handleDrag)\n\n  useEventListener(globalThis.window, 'pointerup', () => {\n    if (!dragged.current) return\n    dragged.current = false\n    onDragEnd?.(normalizedX.current, normalizedY.current)\n  })\n\n  return [refHandler, pointerDownHandler]\n}\n","import { createContext, ReactNode, useContext, useEffect, useRef } from 'react'\nimport { createStore, useStore } from 'zustand'\n\n/** @category Piano */\nexport type NoteRange = {\n  first: number\n  last: number\n}\n\ntype State = {\n  noteRange: NoteRange\n  glissando: boolean\n  midiMax: number\n  fill: boolean\n  onPlayNote: (noteNumber: number, velocity?: number) => void\n  onStopNote: (noteNumber: number) => void\n  label: (note: number, index: number) => ReactNode\n}\n\ntype Action = {\n  notePosition: (note: number) => number\n}\n\ntype PianoStore = ReturnType<typeof createPianoStore>\n\nconst createPianoStore = (initProps: Partial<State> & Action) => {\n  // const noteRange = initProps.noteRange || { first: 0, last: 127 }\n  const DEFAULT_PROPS: State = {\n    noteRange: { first: 0, last: 127 },\n    glissando: true,\n    midiMax: 127,\n    fill: false,\n    label: () => undefined,\n    onPlayNote: () => {},\n    onStopNote: () => {},\n  }\n\n  return createStore<State & Action>()(() => ({\n    ...DEFAULT_PROPS,\n    ...initProps,\n    notePosition: initProps.notePosition,\n  }))\n}\n\nconst PianoContext = createContext<PianoStore | null>(null)\n\ntype PianoProviderProps = React.PropsWithChildren<Partial<State> & Action>\n\nexport function PianoProvider({ children, ...props }: PianoProviderProps) {\n  const storeRef = useRef<PianoStore>(null)\n  if (!storeRef.current) {\n    storeRef.current = createPianoStore(props)\n  }\n\n  useEffect(() => {\n    if (storeRef.current) {\n      storeRef.current.setState(props)\n    } else {\n      storeRef.current = createPianoStore(props)\n    }\n  }, [props])\n\n  return (\n    <PianoContext.Provider value={storeRef.current}>\n      {children}\n    </PianoContext.Provider>\n  )\n}\n\n/** @category Piano */\nexport function usePianoContext<T>(selector: (state: State & Action) => T): T {\n  const store = useContext(PianoContext)\n  if (!store) throw new Error('Missing PianoContext.Provider in the tree')\n  return useStore(store, selector)\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, CSSProperties, ReactNode } from 'react'\n\nimport { usePianoContext } from './context'\n\nimport { getNoteRangeArray } from '.'\n\n/** @category Piano */\nexport interface KeyLabelProps {\n  /**\n   * override Piano.label\n   */\n  label?: (note: number, index: number) => ReactNode\n\n  wrapperClassName?: string\n  wrapperStyle?: CSSProperties\n\n  /** @internal */\n  __note?: number\n  /** @internal */\n  __label?: (note: number, index: number) => ReactNode\n}\n\n/** @category Piano */\nexport function KeyLabel({\n  label,\n  className,\n  wrapperClassName,\n  wrapperStyle,\n  __note,\n  __label,\n  ...props\n}: KeyLabelProps & Omit<ComponentPropsWithoutRef<'div'>, keyof KeyLabelProps>) {\n  const noteRange = usePianoContext((s) => s.noteRange)\n  const noteRangeArray = getNoteRangeArray(noteRange)\n  const index = noteRangeArray.indexOf(__note!)\n  const content = label\n    ? label(__note!, index)\n    : __label && __label(__note!, index)\n\n  return (\n    (content != undefined || content != null) && (\n      <div\n        className={clsx('tremolo-piano-key-label-wrapper', wrapperClassName)}\n        style={wrapperStyle}\n      >\n        <div className={clsx('tremolo-piano-key-label', className)} {...props}>\n          {content}\n        </div>\n      </div>\n    )\n  )\n}\n","import clsx from 'clsx'\nimport React, {\n  CSSProperties,\n  ComponentPropsWithoutRef,\n  forwardRef,\n  useImperativeHandle,\n  useState,\n  ReactElement,\n} from 'react'\n\nimport { usePianoContext } from './context'\nimport { KeyLabel, KeyLabelProps } from './KeyLabel'\n\n/**\n * @category Piano\n */\nexport interface KeyProps {\n  noteNumber: number\n\n  width?: number\n  height?: number | `${number}%`\n\n  bg?: string\n  color?: string\n  activeBg?: string\n  activeColor?: string\n\n  style?: CSSProperties\n\n  /**\n   * \\<KeyLabel />\n   */\n  children?: ReactElement\n\n  /** @internal */\n  __width?: number\n}\n\n/**\n * @category Piano\n */\nexport interface KeyMethods {\n  play: (velocity?: number) => void\n  stop: () => void\n  played: () => boolean\n}\n\ntype Props = KeyProps & Omit<ComponentPropsWithoutRef<'div'>, keyof KeyProps>\ntype ImplProps = Props & { keyType: 'black' | 'white' }\n\n/** @category Piano */\nexport const defaultWhiteKeyWidth = 40\n/** @category Piano */\nexport const defaultBlackKeyWidth = 26\n\nconst KeyImpl = forwardRef<KeyMethods, ImplProps>(\n  (\n    {\n      keyType,\n      noteNumber,\n      width,\n      height,\n      bg,\n      color,\n      activeBg,\n      activeColor,\n      className,\n      style,\n      children,\n      __width,\n      ...props\n    }: ImplProps,\n    ref,\n  ) => {\n    const [played, setPlayed] = useState(false)\n    const midiMax = usePianoContext((s) => s.midiMax)\n    const fill = usePianoContext((s) => s.fill)\n    // const glissando = usePianoContext(s => s.glissando)\n    const onPlayNote = usePianoContext((s) => s.onPlayNote)\n    const onStopNote = usePianoContext((s) => s.onStopNote)\n    const label = usePianoContext((s) => s.label)\n    const notePosition = usePianoContext((s) => s.notePosition)\n    const position = notePosition(noteNumber)\n\n    const disabled = noteNumber > midiMax\n    const colors = {\n      '--bg': bg,\n      '--color': color,\n      '--active-bg': activeBg,\n      '--active-color': activeColor,\n    }\n\n    useImperativeHandle(ref, () => {\n      return {\n        play(velocity) {\n          if (disabled) return\n          setPlayed(true)\n          if (onPlayNote) onPlayNote(noteNumber, velocity)\n        },\n        stop() {\n          setPlayed(false)\n          if (onStopNote) onStopNote(noteNumber)\n        },\n        played() {\n          return played\n        },\n      }\n    }, [disabled, noteNumber, onPlayNote, onStopNote, played])\n\n    let keyLabelProps: KeyLabelProps = {}\n    if (children != undefined) {\n      React.Children.forEach(children, (child) => {\n        if (React.isValidElement(child)) {\n          if (child.type == KeyLabel) {\n            keyLabelProps = child.props as KeyLabelProps\n          } else {\n            throw new Error('only <KeyLabel>')\n          }\n        } else {\n          throw new Error('children is an invalid element.')\n        }\n      })\n    }\n\n    return (\n      <div\n        className={clsx(`tremolo-piano-${keyType}-key`, className)}\n        aria-disabled={disabled}\n        data-active={played}\n        style={{\n          ...colors,\n          left: position,\n          width: fill ? __width : width,\n          height: height,\n          ...style,\n        }}\n        // onPointerDown={() => {\n        //   if (disabled) return\n        //   setPlayed(true)\n        //   if (onPlayNote) onPlayNote(noteNumber)\n        // }}\n        // onPointerEnter={() => {\n        //   if (disabled) return\n        //   if (glissando) {\n        //     setPlayed(true)\n        //     if (onPlayNote) onPlayNote(noteNumber)\n        //   }\n        // }}\n        // onPointerUp={() => {\n        //   if (disabled) return\n        //   setPlayed(false)\n        //   if (onStopNote) onStopNote(noteNumber)\n        // }}\n        // onPointerLeave={() => {\n        //   if (disabled) return\n        //   if (glissando) {\n        //     setPlayed(false)\n        //     if (onStopNote) onStopNote(noteNumber)\n        //   }\n        // }}\n        {...props}\n      >\n        <KeyLabel label={label} __note={noteNumber} {...keyLabelProps} />\n      </div>\n    )\n  },\n)\n\n/** @category Piano */\nexport const WhiteKey = forwardRef<KeyMethods, Props>(\n  (\n    {\n      width = defaultWhiteKeyWidth,\n      height = '100%',\n      onContextMenu = (e) => e.preventDefault(),\n      ...props\n    }: Props,\n    ref,\n  ) => {\n    return (\n      <KeyImpl\n        ref={ref}\n        keyType=\"white\"\n        width={width}\n        height={height}\n        onContextMenu={onContextMenu}\n        {...props}\n      />\n    )\n  },\n)\n\n/** @category Piano */\nexport const BlackKey = forwardRef<KeyMethods, Props>(\n  (\n    {\n      width = defaultBlackKeyWidth,\n      height = '60%',\n      onContextMenu = (e) => e.preventDefault(),\n      ...props\n    }: Props,\n    ref,\n  ) => {\n    return (\n      <KeyImpl\n        ref={ref}\n        keyType=\"black\"\n        width={width}\n        height={height}\n        onContextMenu={onContextMenu}\n        {...props}\n      />\n    )\n  },\n)\n","/** @category Piano */\nexport type KeyboardShortcuts = {\n  keys: string[]\n  // TODO\n  flags?: {\n    naturalOnly?: boolean\n  }\n}\n\n/** @category Piano */\nexport const SHORTCUTS = {\n  HOME_ROW: {\n    keys: [\n      'a',\n      'w',\n      's',\n      'e',\n      'd',\n      'f',\n      't',\n      'g',\n      'y',\n      'h',\n      'u',\n      'j',\n      'k',\n      'o',\n      'l',\n      'p',\n      ';',\n    ],\n  },\n}\n","import clsx from 'clsx'\nimport React, {\n  ComponentPropsWithoutRef,\n  createRef,\n  CSSProperties,\n  forwardRef,\n  ReactElement,\n  ReactNode,\n  RefObject,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\n\nimport {\n  isBlackKey,\n  isWhiteKey,\n  noteKey,\n  NoteKey,\n  noteKeys,\n} from '@tremolo-ui/functions'\n\nimport { useDragWithElement } from '../../hooks/useDragWithElement'\nimport { useEventListener } from '../../hooks/useEventListener'\n\nimport { NoteRange, PianoProvider } from './context'\nimport {\n  BlackKey,\n  defaultBlackKeyWidth,\n  defaultWhiteKeyWidth,\n  KeyMethods,\n  WhiteKey,\n} from './key'\nimport { KeyboardShortcuts } from './keyboardShortcuts'\n\n/**\n * [noteRange.first, noteRange.first + 1 ..., noteRange.last]\n * @category Piano\n */\nexport function getNoteRangeArray(noteRange: NoteRange) {\n  return Array.from(\n    { length: noteRange.last - noteRange.first + 1 },\n    (_, i) => i + noteRange.first,\n  )\n}\n\n/** @category Piano */\nexport interface PianoProps {\n  noteRange: NoteRange\n\n  glissando?: boolean\n  midiMax?: number\n  keyboardShortcuts?: KeyboardShortcuts\n  fill?: boolean\n  whiteNoteWidth?: number\n  blackNoteWidth?: number\n  height?: number | string\n  style?: CSSProperties\n\n  onPlayNote?: (note: number, velocity?: number) => void\n  onStopNote?: (note: number) => void\n\n  label?: (note: number, index: number) => ReactNode\n\n  /**\n   * \\<WhiteKey /> | \\<BlackKey />\n   */\n  children?: ReactElement | ReactElement[]\n}\n\nconst blackPerWhiteWidth = defaultBlackKeyWidth / defaultWhiteKeyWidth // 0.65\n\n/**\n * @category Piano\n */\nexport interface PianoMethods {\n  playNote: (note: number, velocity?: number) => void\n  stopNote: (note: number) => void\n}\n\ntype Props = PianoProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof PianoProps>\n\n/**\n * Customizable piano component.\n * @category Piano\n */\nexport const Piano = forwardRef<PianoMethods, Props>(\n  (\n    {\n      noteRange,\n      glissando = true,\n      midiMax = 127,\n      keyboardShortcuts,\n      fill = false,\n      height = fill ? '100%' : 160,\n      whiteNoteWidth: _whiteNoteWidth = defaultWhiteKeyWidth,\n      style,\n      className,\n      onPlayNote,\n      onStopNote,\n      label,\n      children,\n      onPointerDown,\n      ...props\n    },\n    forwardedRef,\n  ) => {\n    // -- state and ref ---\n    const [whiteNoteWidth, setWhiteNoteWidth] = useState(_whiteNoteWidth)\n    const keyRefs = useRef<RefObject<KeyMethods | null>[]>([])\n    for (let i = 0; i < noteRange.last - noteRange.first + 1; i++) {\n      keyRefs.current[i] = createRef<KeyMethods>()\n    }\n    const pianoRef = useRef<HTMLDivElement>(null)\n    const hitKeyIndex = useRef(-1)\n\n    // --- interpret props ---\n    const noteRangeArray = getNoteRangeArray(noteRange)\n    const whiteNotes = noteRangeArray.filter((v) => isWhiteKey(v))\n    const blackNotes = noteRangeArray.filter((v) => isBlackKey(v))\n    const whiteNoteCount = whiteNotes.length\n    const padding = 1\n    const staticWidth = (whiteNoteWidth + padding) * whiteNoteCount\n    // const blackNoteShiftPercent = 0.3\n\n    const childrenWithProps = useMemo(() => {\n      return (\n        children &&\n        React.Children.map(children, (child, index) => {\n          if (React.isValidElement(child)) {\n            const __width =\n              child.type == WhiteKey ? whiteNoteWidth : whiteNoteWidth * 0.65\n            const props = { ref: keyRefs.current[index], __width }\n            return React.cloneElement(child, props)\n          }\n          return child\n        })\n      )\n    }, [children, whiteNoteWidth])\n\n    // --- internal functions ---\n    const notePosition = useCallback(\n      (note: number) => {\n        const pitchPositions: Record<NoteKey, number> = {\n          C: 0,\n          'C#': 1,\n          D: 1,\n          'D#': 2,\n          E: 2,\n          F: 3,\n          'F#': 4,\n          G: 4,\n          'G#': 5,\n          A: 5,\n          'A#': 6,\n          B: 6,\n        }\n\n        const blackNoteWidth = whiteNoteWidth * blackPerWhiteWidth\n        const padding = 1\n        const targetNoteKey = noteKey(note)\n        const firstNoteKey = noteKey(noteRange.first)\n        const octave = Math.floor((note - noteRange.first) / 12)\n        const octaveOffset =\n          noteKeys.indexOf(firstNoteKey) > noteKeys.indexOf(targetNoteKey)\n            ? 1\n            : 0\n        const w = whiteNoteWidth + padding\n        const pos = pitchPositions[targetNoteKey] - pitchPositions[firstNoteKey]\n        const blackKeyOffset = isBlackKey(note) ? blackNoteWidth / 2 : 0\n        return pos * w + (octave + octaveOffset) * 7 * w - blackKeyOffset\n      },\n      [noteRange.first, whiteNoteWidth],\n    )\n\n    const getHitKeyIndex = useCallback(\n      (x: number, y: number) => {\n        if (!pianoRef.current) return -1\n        const containerHeight = pianoRef.current.clientHeight\n        const notes = [...blackNotes, ...whiteNotes]\n        for (let i = 0; i < notes.length; i++) {\n          const note = notes[i]\n          const pos = notePosition(note)\n          const w = isWhiteKey(note)\n            ? whiteNoteWidth\n            : whiteNoteWidth * blackPerWhiteWidth\n          const h = isWhiteKey(note) ? containerHeight : containerHeight * 0.6\n          if (pos <= x && x < pos + w && 0 <= y && y < h) {\n            return note\n          }\n        }\n        return -1\n      },\n      [blackNotes, notePosition, whiteNoteWidth, whiteNotes],\n    )\n\n    // TODO: 単一のポインターに対しては、useDragで対応可能だが、\n    // マルチタッチに対しては、TouchEventを使う必要がありそう\n    // 取り敢えず、シングルタッチだけ対応\n    const onDrag = useCallback(\n      (perX: number, perY: number) => {\n        if (!pianoRef.current) return\n        const x = perX * staticWidth\n        const y = perY * pianoRef.current.clientHeight\n        const note = getHitKeyIndex(x, y)\n        const index = noteRangeArray.indexOf(note)\n        if (index == -1) return\n        if (hitKeyIndex.current != index) {\n          keyRefs.current[hitKeyIndex.current]?.current?.stop()\n          keyRefs.current[index]?.current?.play()\n          hitKeyIndex.current = index\n        }\n      },\n      [getHitKeyIndex, noteRangeArray, staticWidth],\n    )\n\n    const onDragEnd = useCallback(() => {\n      if (keyRefs.current[hitKeyIndex.current]?.current?.played()) {\n        keyRefs.current[hitKeyIndex.current]?.current?.stop()\n      }\n      hitKeyIndex.current = -1\n    }, [keyRefs])\n\n    // --- hooks ---\n    useEffect(() => {\n      if (fill && pianoRef.current) {\n        const parent = pianoRef.current.parentElement\n        if (!parent) throw new Error(\"doesn't have a parent element.\")\n        const resizeObserver = new ResizeObserver(() => {\n          const w = pianoRef.current!.clientWidth\n          setWhiteNoteWidth(w / whiteNoteCount - padding)\n        })\n        resizeObserver.observe(parent)\n        return () => {\n          resizeObserver.unobserve(parent)\n        }\n      } else {\n        setWhiteNoteWidth(_whiteNoteWidth)\n      }\n    }, [fill, _whiteNoteWidth, whiteNoteCount])\n\n    const [touchMoveRefCallback, pointerDownHandler] =\n      useDragWithElement<HTMLDivElement>({\n        baseElementRef: pianoRef,\n        onDrag: onDrag,\n        onDragEnd: onDragEnd,\n      })\n\n    useEventListener(globalThis.window, 'keydown', (e) => {\n      if (e.repeat) return\n      if (!keyboardShortcuts) return\n      const index = keyboardShortcuts.keys.indexOf(e.key)\n      if (index != -1) {\n        if (!keyRefs.current[index]?.current?.played()) {\n          keyRefs.current[index]?.current?.play()\n        }\n      }\n    })\n\n    useEventListener(globalThis.window, 'keyup', (e) => {\n      if (e.repeat) return\n      if (!keyboardShortcuts) return\n      const index = keyboardShortcuts.keys.indexOf(e.key)\n      if (index != -1) {\n        keyRefs.current[index]?.current?.stop()\n      }\n    })\n\n    useImperativeHandle(forwardedRef, () => {\n      return {\n        playNote(note, velocity) {\n          const index = noteRangeArray.indexOf(note)\n          if (index != -1) {\n            if (!keyRefs.current[index]?.current?.played()) {\n              keyRefs.current[index]?.current?.play(velocity)\n            }\n          } else {\n            onPlayNote?.(note, velocity)\n          }\n        },\n        stopNote(note: number) {\n          const index = noteRangeArray.indexOf(note)\n          if (index != -1) {\n            keyRefs.current[index]?.current?.stop()\n          } else {\n            onStopNote?.(note)\n          }\n        },\n      }\n    }, [noteRangeArray, onPlayNote, onStopNote])\n\n    return (\n      <PianoProvider\n        notePosition={notePosition}\n        noteRange={noteRange}\n        glissando={glissando}\n        midiMax={midiMax}\n        fill={fill}\n        onPlayNote={onPlayNote}\n        onStopNote={onStopNote}\n        label={label}\n      >\n        <div\n          ref={(div) => {\n            pianoRef.current = div\n            touchMoveRefCallback(div)\n          }}\n          className={clsx('tremolo-piano', className)}\n          style={{\n            width: fill ? '100%' : staticWidth,\n            height: height,\n            ...style,\n          }}\n          onPointerDown={(event) => {\n            pointerDownHandler(event)\n            onPointerDown?.(event)\n          }}\n          {...props}\n        >\n          {childrenWithProps ||\n            noteRangeArray.map((note, index) =>\n              isWhiteKey(note) ? (\n                <WhiteKey\n                  ref={keyRefs.current[index]}\n                  key={note}\n                  noteNumber={note}\n                  __width={whiteNoteWidth}\n                />\n              ) : (\n                <BlackKey\n                  ref={keyRefs.current[index]}\n                  key={note}\n                  noteNumber={note}\n                  __width={whiteNoteWidth * blackPerWhiteWidth}\n                />\n              ),\n            )}\n        </div>\n      </PianoProvider>\n    )\n  },\n)\n\nexport { type KeyboardShortcuts, SHORTCUTS } from './keyboardShortcuts'\nexport { WhiteKey, BlackKey, type KeyProps, type KeyMethods } from './key'\nexport { KeyLabel, type KeyLabelProps } from './KeyLabel'\n","import { createContext, useContext, useEffect, useRef } from 'react'\nimport { createStore, useStore } from 'zustand'\n\ntype State = {\n  min: number\n  max: number\n  step: number\n  skew: number\n  vertical: boolean\n  reverse: boolean\n  disabled: boolean\n  readonly: boolean\n}\n\ntype SliderStore = ReturnType<typeof createSliderStore>\n\nconst createSliderStore = (initProps?: Partial<State>) => {\n  const DEFAULT_PROPS: State = {\n    min: 0,\n    max: 0,\n    step: 0,\n    skew: 0,\n    vertical: false,\n    reverse: false,\n    disabled: false,\n    readonly: false,\n  }\n\n  return createStore<State>()(() => ({\n    ...DEFAULT_PROPS,\n    ...initProps,\n  }))\n}\n\nconst SliderContext = createContext<SliderStore | null>(null)\n\ntype SliderProviderProps = React.PropsWithChildren<Partial<State>>\n\nexport function SliderProvider({ children, ...props }: SliderProviderProps) {\n  const storeRef = useRef<SliderStore>(null)\n  if (!storeRef.current) {\n    storeRef.current = createSliderStore(props)\n  }\n\n  useEffect(() => {\n    if (storeRef.current) {\n      storeRef.current.setState(props)\n    } else {\n      storeRef.current = createSliderStore(props)\n    }\n  }, [props])\n\n  return (\n    <SliderContext.Provider value={storeRef.current}>\n      {children}\n    </SliderContext.Provider>\n  )\n}\n\n/** @category Slider */\nexport function useSliderContext<T>(selector: (state: State) => T): T {\n  const store = useContext(SliderContext)\n  if (!store) throw new Error('Missing SliderContext.Provider in the tree')\n  return useStore(store, selector)\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, CSSProperties, useCallback } from 'react'\n\nimport { toFixed, xor, normalizeValue } from '@tremolo-ui/functions'\n\nimport { useSliderContext } from './context'\nimport { ScaleType } from './type'\n\n/** @category Slider */\nexport interface ScaleOptionProps {\n  // required\n  value: number\n\n  // optional\n  type?: ScaleType\n  /** Display text instead of value. */\n  label?: string\n  /** mark thickness */\n  thickness?: number | string\n  /** mark length */\n  length?: number | string\n  /** Gap between mark and label. */\n  gap?: number | string\n  labelWidth?: number | string\n  classes?: {\n    mark?: string\n    label?: string\n  }\n  styles?: {\n    mark?: CSSProperties\n    label?: CSSProperties\n  }\n}\n\n/** @category Slider */\nexport function ScaleOption({\n  value,\n  type = 'mark-number',\n  label,\n  thickness = 1,\n  length = '0.5rem',\n  gap = 2,\n  labelWidth,\n  classes,\n  styles,\n  className,\n  style,\n  ...props\n}: ScaleOptionProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof ScaleOptionProps>) {\n  const min = useSliderContext((s) => s.min)\n  const max = useSliderContext((s) => s.max)\n  const skew = useSliderContext((s) => s.skew)\n  const vertical = useSliderContext((s) => s.vertical)\n  const reverse = useSliderContext((s) => s.reverse)\n\n  const calcPercent = useCallback(\n    (rawValue: number) => {\n      return toFixed(\n        xor(vertical, reverse)\n          ? 100 - normalizeValue(rawValue, min, max, skew) * 100\n          : normalizeValue(rawValue, min, max, skew) * 100,\n      )\n    },\n    [vertical, reverse, max, min, skew],\n  )\n\n  return (\n    <div\n      className={clsx('tremolo-slider-scale-option', className)}\n      style={{\n        left: !vertical ? `${calcPercent(value)}%` : undefined,\n        top: vertical ? `${calcPercent(value)}%` : undefined,\n        ...style,\n      }}\n      data-vertical={vertical}\n      {...props}\n    >\n      {type != 'number' && (\n        <div\n          className={clsx('tremolo-slider-scale-option-mark', classes?.mark)}\n          style={{\n            width: !vertical ? thickness : length,\n            height: vertical ? thickness : length,\n            marginBottom: !vertical ? gap : undefined,\n            marginRight: vertical ? gap : undefined,\n            ...styles?.mark,\n          }}\n          data-vertical={vertical}\n        ></div>\n      )}\n      {type != 'mark' && (\n        <div\n          className={clsx('tremolo-slider-scale-option-label', classes?.label)}\n          style={{\n            width: labelWidth,\n            ...styles?.label,\n          }}\n        >\n          {label || value}\n        </div>\n      )}\n    </div>\n  )\n}\n","import { decimalPart, toFixed } from '@tremolo-ui/functions'\n\nexport type ScaleType = 'mark' | 'mark-number' | 'number'\nexport type ScaleOptions = ['step', ScaleType] | [number, ScaleType]\n\nexport function generateOptionsList(\n  options: ScaleOptions,\n  min: number,\n  max: number,\n  step: number,\n) {\n  const optionsList: {\n    value: number\n    type: ScaleType\n  }[] = []\n  const per = options[0] == 'step' ? step : options[0]\n  const count = Math.floor(max / per) - Math.ceil(min / per) + 1\n  for (let i = 0; i < count; i++) {\n    const value = toFixed(\n      per * (Math.ceil(min / per) + i),\n      decimalPart(per)?.length,\n    )\n    optionsList.push({ value: value, type: options[1] })\n  }\n  return optionsList\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { xor } from '@tremolo-ui/functions'\n\nimport { useSliderContext } from './context'\nimport { ScaleOption } from './ScaleOption'\nimport { generateOptionsList, ScaleOptions } from './type'\n\n/** @category Slider */\nexport interface ScaleProps {\n  gap?: number | string\n  options?: ScaleOptions\n  children?: ReactNode\n}\n\n/** @category Slider */\nexport function Scale({\n  gap = 6,\n  options,\n  children,\n  className,\n  style,\n  ...props\n}: ScaleProps & Omit<ComponentPropsWithoutRef<'div'>, keyof ScaleProps>) {\n  const min = useSliderContext((s) => s.min)\n  const max = useSliderContext((s) => s.max)\n  const step = useSliderContext((s) => s.step)\n  const vertical = useSliderContext((s) => s.vertical)\n  const reverse = useSliderContext((s) => s.reverse)\n\n  const optionsList = options\n    ? generateOptionsList(options, min, max, step)\n    : []\n  if (xor(vertical, reverse)) optionsList.reverse()\n\n  return (\n    <div\n      className={clsx('tremolo-slider-scale', className)}\n      style={{\n        marginLeft: vertical ? gap : undefined,\n        marginTop: !vertical ? gap : undefined,\n        ...style,\n      }}\n      {...props}\n    >\n      {options\n        ? optionsList.map(({ value, type }, index) => {\n            return <ScaleOption key={index} value={value} type={type} />\n          })\n        : children}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport {\n  CSSProperties,\n  forwardRef,\n  ReactNode,\n  useImperativeHandle,\n  useRef,\n} from 'react'\n\nimport { useSliderContext } from './context'\n\n/** @category Slider */\nexport interface SliderThumbProps {\n  size?: number | string\n  width?: number | string\n  height?: number | string\n\n  color?: string\n\n  className?: string\n  style?: CSSProperties\n  children?: ReactNode\n\n  /** @internal */\n  __percent?: number\n}\n\n/** @category Slider */\nexport interface SliderThumbMethods {\n  focus: () => void\n  blur: () => void\n}\n\n/** @category Slider */\nexport const defaultThumbSize = 22\n\n/** @category Slider */\nexport const SliderThumb = forwardRef<SliderThumbMethods, SliderThumbProps>(\n  (\n    {\n      size,\n      width = defaultThumbSize,\n      height = defaultThumbSize,\n      color,\n      children,\n      className,\n      style,\n      __percent,\n    }: SliderThumbProps,\n    ref,\n  ) => {\n    const wrapperRef = useRef<HTMLDivElement>(null)\n    const vertical = useSliderContext((s) => s.vertical)\n    const disabled = useSliderContext((s) => s.disabled)\n    const readonly = useSliderContext((s) => s.readonly)\n\n    useImperativeHandle(ref, () => {\n      return {\n        focus() {\n          wrapperRef.current?.focus()\n        },\n        blur() {\n          wrapperRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <div\n        className=\"tremolo-slider-thumb-wrapper\"\n        style={{\n          top: vertical ? `${__percent}%` : '50%',\n          left: !vertical ? `${__percent}%` : '50%',\n        }}\n      >\n        {children ? (\n          children\n        ) : (\n          // default slider thumb\n          <div\n            ref={wrapperRef}\n            className={clsx('tremolo-slider-thumb', className)}\n            // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n            tabIndex={0}\n            aria-disabled={disabled}\n            aria-readonly={readonly}\n            style={{\n              ...{ '--color': color },\n              width: size ?? width,\n              height: size ?? height,\n              ...style,\n            }}\n          ></div>\n        )}\n      </div>\n    )\n  },\n)\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, CSSProperties, ReactElement } from 'react'\n\nimport { styleHelper, xor } from '@tremolo-ui/functions'\n\nimport { useSliderContext } from './context'\n\nexport const defaultLength = 140\nexport const defaultThickness = 10\n\n/** @category Slider */\nexport interface SliderTrackProps {\n  length?: number | string\n  thickness?: number | string\n\n  active?: string\n  inactive?: string\n\n  defaultStyle?: boolean\n\n  className?: string\n  style?: CSSProperties\n  children?: ReactElement\n\n  /** @internal */\n  __thumb?: ReactElement\n  /** @internal */\n  __percent?: number\n}\n\n/** @category Slider */\nexport function SliderTrack({\n  length = defaultLength,\n  thickness = defaultThickness,\n  active,\n  inactive,\n  children,\n  className,\n  style,\n  defaultStyle = true,\n  __thumb,\n  __percent = 0,\n  ...props\n}: SliderTrackProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof SliderTrackProps>) {\n  const vertical = useSliderContext((s) => s.vertical)\n  const reverse = useSliderContext((s) => s.reverse)\n  const disabled = useSliderContext((s) => s.disabled)\n\n  const direction = vertical ? 'bottom' : 'right'\n  const colors = {\n    '--active': active,\n    '--inactive': inactive,\n  }\n\n  return (\n    <div\n      className={clsx('tremolo-slider-track', className)}\n      aria-disabled={disabled}\n      data-vertical={vertical}\n      style={\n        !defaultStyle\n          ? style\n          : {\n              ...colors,\n              background: xor(vertical, reverse)\n                ? `linear-gradient(to ${direction}, var(--inactive) ${__percent}%, var(--active) ${__percent}%)`\n                : `linear-gradient(to ${direction}, var(--active) ${__percent}%, var(--inactive) ${__percent}%)`,\n              borderRadius: styleHelper(thickness!, '/', 2),\n              width: !vertical ? length : thickness,\n              height: vertical ? length : thickness,\n              ...style,\n            }\n      }\n      {...props}\n    >\n      {children}\n      {__thumb}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport React, {\n  ComponentPropsWithoutRef,\n  CSSProperties,\n  forwardRef,\n  ReactElement,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from 'react'\n\nimport {\n  clamp,\n  normalizeValue,\n  rawValue,\n  stepValue,\n  toFixed,\n  InputEventOption,\n  styleHelper,\n  xor,\n} from '@tremolo-ui/functions'\n\nimport { useDragWithElement } from '../../hooks/useDragWithElement'\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\nimport { addNoSelect, removeNoSelect } from '../_util'\n\nimport { SliderProvider } from './context'\nimport { Scale } from './Scale'\nimport { SliderThumb, SliderThumbMethods, SliderThumbProps } from './Thumb'\nimport { SliderTrack, SliderTrackProps } from './Track'\n\n/** @category Slider */\nexport interface SliderProps {\n  // required\n  value: number\n  min: number\n  max: number\n\n  // optional\n  step?: number\n  skew?: number // TODO | SkewFunction\n  vertical?: boolean\n  reverse?: boolean\n  bodyNoSelect?: boolean\n  /**\n   * wheel control option\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   */\n  keyboard?: InputEventOption | null\n  /**\n   * Only the appearance will change.\n   * Please consider using with readonly.\n   */\n  disabled?: boolean\n  /**\n   * Make the value unchangeable.\n   */\n  readonly?: boolean\n  className?: string\n  style?: CSSProperties\n  onChange?: (value: number) => void\n  onDragStart?: (value: number) => void\n  onDragEnd?: (value: number) => void\n  /** \\<SliderThumb /> | \\<SliderTrack /> */\n  children?: ReactElement | ReactElement[]\n  // ReactElement<typeof SliderThumb, typeof SliderTrack>[]\n}\n\n/**\n * @category Slider\n */\nexport interface SliderMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = SliderProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof SliderProps>\n\n/**\n * Customizable slider\n * @category Slider\n */\nexport const Slider = forwardRef<SliderMethods, Props>(\n  (\n    {\n      value,\n      min,\n      max,\n      step = 1,\n      skew = 1,\n      vertical = false,\n      reverse = false,\n      bodyNoSelect = true,\n      wheel = ['raw', 1],\n      keyboard = ['raw', 1],\n      disabled = false,\n      readonly = false,\n      onChange,\n      onDragStart,\n      onDragEnd,\n      className,\n      style,\n      children,\n      onFocus,\n      onBlur,\n      onPointerDown,\n      onKeyDown,\n      ...props\n    }: Props,\n    forwardedRef,\n  ) => {\n    // -- state and ref ---\n    const trackElementRef = useRef<HTMLDivElement>(null)\n    const thumbRef = useRef<SliderThumbMethods>(null)\n\n    // --- interpret props ---\n    const p = toFixed(normalizeValue(value, min, max, skew) * 100)\n    const rev = toFixed(100 - p)\n    // NOTE\n    // normal -> normal (right)\n    // vertical -> rev (up)\n    // reverse -> rev (left)\n    // vertical & reverse -> normal (down)\n    const displayReversed = useMemo(\n      () => xor(vertical, reverse),\n      [vertical, reverse],\n    )\n    const percent = displayReversed ? rev : p\n\n    let trackProps: SliderTrackProps = {}\n    let thumbProps: SliderThumbProps = {}\n    let scaleComponent: ReactElement | undefined = undefined\n    if (children != undefined) {\n      React.Children.forEach(children, (child) => {\n        if (React.isValidElement(child)) {\n          if (child.type == SliderThumb) {\n            thumbProps = child.props as SliderThumbProps\n          } else if (child.type == SliderTrack) {\n            trackProps = child.props as SliderTrackProps\n          } else if (child.type == Scale) {\n            scaleComponent = child\n          } else {\n            throw new Error('only <SliderThumb> or <SliderTrack>')\n          }\n        } else {\n          throw new Error('children is an invalid element.')\n        }\n      })\n    }\n\n    // --- internal functions ---\n    const onDrag = useCallback(\n      (nx: number, ny: number) => {\n        if (!onChange || readonly) return\n        const n = vertical ? ny : nx\n        const v = rawValue(displayReversed ? 1 - n : n, min, max, skew)\n        const v2 = clamp(stepValue(v, step), min, max)\n        onChange(v2)\n      },\n      [displayReversed, max, min, onChange, readonly, skew, step, vertical],\n    )\n\n    const updateValueByEvent = useCallback(\n      (eventType: InputEventOption[0], x: number) => {\n        let newValue\n        if (eventType == 'normalized') {\n          const n = normalizeValue(value, min, max, skew)\n          newValue = rawValue(n + x, min, max, skew)\n        } else {\n          newValue = value + x\n        }\n        return clamp(stepValue(newValue, step), min, max)\n      },\n      [max, min, skew, step, value],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!keyboard || !onChange || readonly) return\n        const key = event.key\n        if (['ArrowRight', 'ArrowLeft', 'ArrowUp', 'ArrowDown'].includes(key)) {\n          event.preventDefault()\n          let x =\n            key == 'ArrowRight' || key == 'ArrowUp' ? keyboard[1] : -keyboard[1]\n          if (reverse) x *= -1\n          onChange(updateValueByEvent(keyboard[0], x))\n        }\n      },\n      [keyboard, onChange, readonly, reverse, updateValueByEvent],\n    )\n\n    // --- hooks ---\n    const [touchMoveRefCallback, pointerDownHandler] =\n      useDragWithElement<HTMLDivElement>({\n        baseElementRef: trackElementRef,\n        onDrag: onDrag,\n        onDragStart: (nx, ny) => {\n          if (readonly) return\n          if (bodyNoSelect) addNoSelect()\n          thumbRef.current?.focus()\n          onDragStart?.(\n            clamp(\n              stepValue(rawValue(vertical ? ny : nx, min, max, skew), step),\n              min,\n              max,\n            ),\n          )\n        },\n        onDragEnd: (nx, ny) => {\n          if (readonly) return\n          if (bodyNoSelect) removeNoSelect()\n          onDragEnd?.(\n            clamp(\n              stepValue(rawValue(vertical ? ny : nx, min, max, skew), step),\n              min,\n              max,\n            ),\n          )\n        },\n      })\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!wheel || !onChange || readonly) return\n        event.preventDefault()\n        let x\n        if (!vertical && event.deltaX != 0) {\n          x = event.deltaX > 0 ? wheel[1] : -wheel[1]\n        } else {\n          if (event.deltaY == 0) return\n          x = event.deltaY > 0 ? -wheel[1] : wheel[1]\n        }\n        if (vertical && reverse) x *= -1\n        onChange(updateValueByEvent(wheel[0], x))\n      },\n      {\n        passive: false,\n      },\n      [wheel, vertical, readonly, onChange, updateValueByEvent],\n    )\n\n    useImperativeHandle(forwardedRef, () => {\n      return {\n        focus() {\n          thumbRef.current?.focus()\n        },\n        blur() {\n          thumbRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <SliderProvider\n        min={min}\n        max={max}\n        step={step}\n        skew={skew}\n        vertical={vertical}\n        reverse={reverse}\n        disabled={disabled}\n        readonly={readonly}\n      >\n        <div\n          className={clsx('tremolo-slider', className)}\n          ref={(div) => {\n            wheelRefCallback(div)\n            touchMoveRefCallback(div)\n          }}\n          tabIndex={-1}\n          role=\"slider\"\n          aria-valuenow={value}\n          aria-valuemin={min}\n          aria-valuemax={max}\n          aria-orientation={vertical ? 'vertical' : 'horizontal'}\n          aria-disabled={disabled}\n          aria-readonly={readonly}\n          style={{\n            margin: `calc(${styleHelper(thumbProps?.size ?? 22)} / 2)`, // half thumb size\n            ...style,\n          }}\n          onPointerDown={(event) => {\n            pointerDownHandler(event)\n            onPointerDown?.(event)\n          }}\n          onKeyDown={(event) => {\n            handleKeyDown(event)\n            onKeyDown?.(event)\n          }}\n          onFocus={(event) => {\n            thumbRef.current?.focus()\n            onFocus?.(event)\n          }}\n          onBlur={(event) => {\n            thumbRef.current?.blur()\n            onBlur?.(event)\n          }}\n          {...props}\n        >\n          <div\n            style={{\n              display: 'flex',\n              flexDirection: vertical ? 'row' : 'column',\n              width: !vertical ? '100%' : undefined,\n              height: vertical ? '100%' : undefined,\n            }}\n          >\n            <div className=\"tremolo-slider-track-wrapper\" ref={trackElementRef}>\n              <SliderTrack\n                __percent={percent}\n                __thumb={\n                  <SliderThumb\n                    ref={thumbRef}\n                    __percent={percent}\n                    {...thumbProps}\n                  />\n                }\n                {...trackProps}\n              />\n            </div>\n            {scaleComponent}\n          </div>\n        </div>\n      </SliderProvider>\n    )\n  },\n)\n\nexport { useSliderContext } from './context'\nexport {\n  SliderThumb,\n  type SliderThumbMethods,\n  type SliderThumbProps,\n} from './Thumb'\nexport { SliderTrack, type SliderTrackProps } from './Track'\nexport { Scale, type ScaleProps } from './Scale'\nexport { ScaleOption, type ScaleOptionProps } from './ScaleOption'\nexport { type ScaleOptions, type ScaleType } from './type'\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react'\n\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\n\n/**\n * @example\n * <WheelObserver\n *   onWheel={(event) => {\n *     event.preventDefault()\n *     console.log(event.deltaY)\n *   }\n * >\n *   <div>Wheel here</div>\n * </WheelObserver>\n */\n\n/** @category WheelObserver */\nexport interface WheelObserverProps<T extends ElementType> {\n  /**\n   * React.ElementType\n   * @default div\n   */\n  as?: T\n\n  children?: ReactNode\n  onWheel?: (event: WheelEvent) => void\n}\n\n/** @category WheelObserver */\nexport function WheelObserver<T extends ElementType = 'div'>(\n  props: WheelObserverProps<T> &\n    Omit<ComponentPropsWithoutRef<T>, keyof WheelObserverProps<T>>,\n) {\n  const { children, onWheel, as: Component = 'div', ...attributes } = props\n\n  const wheelRefCallback = useRefCallbackEvent(\n    'wheel',\n    (event) => {\n      if (onWheel) onWheel(event)\n    },\n    { passive: false },\n    [onWheel],\n  )\n\n  return (\n    <Component ref={wheelRefCallback} {...attributes}>\n      {children}\n    </Component>\n  )\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, CSSProperties, ReactElement } from 'react'\n\n/** @category XYPad */\nexport interface AreaProps {\n  width?: number | string\n  height?: number | string\n  color?: string\n  className?: string\n  style?: CSSProperties\n  children?: ReactElement\n\n  /** inherit */\n  __thumb?: ReactElement\n}\n\n/** @category XYPad */\nexport function XYPadArea({\n  width = 120,\n  height = 120,\n  color,\n  children,\n  className,\n  style,\n  __thumb,\n  ...props\n}: AreaProps & Omit<ComponentPropsWithoutRef<'div'>, keyof AreaProps>) {\n  return (\n    <div\n      className={clsx('tremolo-xy-pad-area', className)}\n      style={{\n        ...{ '--color': color },\n        width: width,\n        height: height,\n        ...style,\n      }}\n      {...props}\n    >\n      {children}\n      {__thumb}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport {\n  ComponentPropsWithoutRef,\n  CSSProperties,\n  forwardRef,\n  ReactNode,\n  useImperativeHandle,\n  useRef,\n} from 'react'\n\n/** @category XYPad */\nexport interface ThumbProps {\n  size?: number | string\n  width?: number | string\n  height?: number | string\n\n  color?: string\n\n  wrapperClassName?: string\n  wrapperStyle?: CSSProperties\n\n  children?: ReactNode\n\n  /** @internal */\n  __disabled?: boolean\n  /** @internal */\n  __css?: CSSProperties\n}\n\n/** @category XYPad */\nexport interface XYPadThumbMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = ThumbProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof ThumbProps>\n\n/** @category XYPad */\nexport const XYPadThumb = forwardRef<XYPadThumbMethods, Props>(\n  (\n    {\n      size,\n      width = 22,\n      height = 22,\n      color,\n      children,\n      wrapperClassName,\n      wrapperStyle,\n      className,\n      style,\n      __disabled,\n      __css,\n      ...props\n    }: Props,\n    ref,\n  ) => {\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    useImperativeHandle(ref, () => {\n      return {\n        focus() {\n          wrapperRef.current?.focus()\n        },\n        blur() {\n          wrapperRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <div\n        className={clsx('tremolo-xy-pad-thumb-wrapper', wrapperClassName)}\n        style={{\n          ...__css,\n          ...wrapperStyle,\n        }}\n        {...props}\n      >\n        {children ? (\n          children\n        ) : (\n          // default thumb\n          <div\n            ref={wrapperRef}\n            className={clsx('tremolo-xy-pad-thumb', className)}\n            // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n            tabIndex={0}\n            aria-disabled={__disabled}\n            style={{\n              ...{ '--color': color },\n              width: size ?? width,\n              height: size ?? height,\n              ...style,\n            }}\n          ></div>\n        )}\n      </div>\n    )\n  },\n)\n","import clsx from 'clsx'\nimport React, {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  ReactElement,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from 'react'\n\nimport {\n  clamp,\n  normalizeValue,\n  rawValue,\n  stepValue,\n  toFixed,\n  InputEventOption,\n  styleHelper,\n} from '@tremolo-ui/functions'\n\nimport { useDragWithElement } from '../../hooks/useDragWithElement'\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\nimport { addNoSelect, removeNoSelect } from '../_util'\n\nimport { XYPadArea, AreaProps } from './Area'\nimport { XYPadThumb, XYPadThumbMethods, ThumbProps } from './Thumb'\n\n/**\n * Two-dimensional slider component.\n * @category XYPad\n */\nexport interface ValueOptions {\n  // required\n  value: number\n  min: number\n  max: number\n\n  // optional\n  step?: number\n  skew?: number\n  reverse?: boolean\n  /**\n   * wheel control option\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   */\n  keyboard?: InputEventOption | null\n}\n\n/** @category XYPad */\nexport interface XYPadProps {\n  x: ValueOptions\n  y: ValueOptions\n\n  bodyNoSelect?: boolean\n  disabled?: boolean\n  readonly?: boolean\n  onChange?: (valueX: number, valueY: number) => void\n  onDragStart?: (valueX: number, valueY: number) => void\n  onDragEnd?: (valueX: number, valueY: number) => void\n  /** \\<XYPadThumb /> | \\<XYPadArea /> */\n  children?: ReactElement | ReactElement[]\n}\n\n/** @category XYPad */\nexport interface XYPadMethods {\n  focus: () => void\n  blur: () => void\n}\n\nconst defaultValueOptions = {\n  skew: 1,\n  step: 1,\n  reverse: false,\n  wheel: ['raw', 1] as InputEventOption,\n  keyboard: ['raw', 1] as InputEventOption,\n}\n\ntype Props = XYPadProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof XYPadProps>\n\n/**\n * Simple XYPad\n * @category XYPad\n */\nexport const XYPad = forwardRef<XYPadMethods, Props>(\n  (\n    {\n      x: _x,\n      y: _y,\n      className,\n      style,\n      bodyNoSelect = true,\n      disabled = false,\n      readonly = false,\n      onChange,\n      onDragStart,\n      onDragEnd,\n      onPointerDown,\n      onKeyDown,\n      onFocus,\n      onBlur,\n      children,\n      ...props\n    }: Props,\n    forwardedRef,\n  ) => {\n    const x = useMemo(() => {\n      return { ...defaultValueOptions, ..._x }\n    }, [_x])\n    const y = useMemo(() => {\n      return { ...defaultValueOptions, ..._y }\n    }, [_y])\n\n    // -- state and ref ---\n    const areaElementRef = useRef<HTMLDivElement>(null)\n    const thumbRef = useRef<XYPadThumbMethods>(null)\n\n    // --- interpret props ---\n    const nx = normalizeValue(x.value, x.min, x.max, x.skew)\n    const ny = normalizeValue(y.value, y.min, y.max, y.skew)\n    const percentX = toFixed((x.reverse ? 1 - nx : nx) * 100)\n    const percentY = toFixed((y.reverse ? 1 - ny : ny) * 100)\n\n    let areaProps: AreaProps = {}\n    let thumbProps: ThumbProps = {}\n    if (children != undefined) {\n      React.Children.forEach(children, (child) => {\n        if (React.isValidElement(child)) {\n          if (child.type == XYPadThumb) {\n            thumbProps = child.props as ThumbProps\n          } else if (child.type == XYPadArea) {\n            areaProps = child.props as AreaProps\n          } else {\n            throw new Error('only <XYPadThumb> or <XYPadArea>')\n          }\n        } else {\n          throw new Error('children is an invalid element.')\n        }\n      })\n    }\n\n    // --- internal functions ---\n    const onDrag = useCallback(\n      (nx: number, ny: number) => {\n        if (!onChange || readonly) return\n        const vx = rawValue(x.reverse ? 1 - nx : nx, x.min, x.max, x.skew)\n        const vy = rawValue(y.reverse ? 1 - ny : ny, y.min, y.max, y.skew)\n        const newX = clamp(stepValue(vx, x.step), x.min, x.max)\n        const newY = clamp(stepValue(vy, y.step), y.min, y.max)\n        onChange(newX, newY)\n      },\n      [\n        onChange,\n        readonly,\n        x.max,\n        x.min,\n        x.reverse,\n        x.skew,\n        x.step,\n        y.max,\n        y.min,\n        y.reverse,\n        y.skew,\n        y.step,\n      ],\n    )\n\n    const updateValueByEvent = useCallback(\n      (\n        eventType: InputEventOption[0],\n        target: Required<ValueOptions>,\n        x: number,\n      ) => {\n        let v\n        if (eventType == 'normalized') {\n          const n = normalizeValue(\n            target.value,\n            target.min,\n            target.max,\n            target.skew,\n          )\n          v = rawValue(n + x, target.min, target.max, target.skew)\n        } else {\n          v = target.value + x\n        }\n        return clamp(stepValue(v, target.step), target.min, target.max)\n      },\n      [],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!onChange || readonly) return\n        const key = event.key\n        if (['ArrowRight', 'ArrowLeft', 'ArrowUp', 'ArrowDown'].includes(key)) {\n          const isHorizontal = key == 'ArrowRight' || key == 'ArrowLeft'\n          const target = isHorizontal ? x : y\n          if (!target.keyboard) return\n          event.preventDefault()\n          let delta = target.keyboard[1]\n          if (key == 'ArrowLeft' || key == 'ArrowUp') delta *= -1\n          if (target.reverse) delta *= -1\n          const newValue = updateValueByEvent(target.keyboard[0], target, delta)\n          if (isHorizontal) {\n            onChange(newValue, y.value)\n          } else {\n            onChange(x.value, newValue)\n          }\n        }\n      },\n      [onChange, readonly, x, y, updateValueByEvent],\n    )\n\n    // --- hooks ---\n    const [touchMoveRefCallback, pointerDownHandler] =\n      useDragWithElement<HTMLDivElement>({\n        baseElementRef: areaElementRef,\n        onDrag: onDrag,\n        onDragStart: (nx, ny) => {\n          if (readonly) return\n          if (bodyNoSelect) addNoSelect()\n          thumbRef.current?.focus()\n          const valueX = clamp(\n            stepValue(rawValue(nx, x.min, x.max, x.skew), x.step),\n            x.min,\n            x.max,\n          )\n          const valueY = clamp(\n            stepValue(rawValue(ny, y.min, y.max, y.skew), y.step),\n            y.min,\n            y.max,\n          )\n          onDragStart?.(valueX, valueY)\n        },\n        onDragEnd: (nx, ny) => {\n          if (readonly) return\n          if (bodyNoSelect) removeNoSelect()\n          const valueX = clamp(\n            stepValue(rawValue(nx, x.min, x.max, x.skew), x.step),\n            x.min,\n            x.max,\n          )\n          const valueY = clamp(\n            stepValue(rawValue(ny, y.min, y.max, y.skew), y.step),\n            y.min,\n            y.max,\n          )\n          onDragEnd?.(valueX, valueY)\n        },\n      })\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!onChange || readonly) return\n        const target = event.shiftKey ? x : y\n        if (!target.wheel) return\n        event.preventDefault()\n        let delta = target.wheel[1]\n        if (event.deltaY < 0) delta *= -1\n        if (target.reverse) delta *= -1\n        const newValue = updateValueByEvent(target.wheel[0], target, delta)\n        if (event.shiftKey) {\n          onChange(newValue, y.value)\n        } else {\n          onChange(x.value, newValue)\n        }\n      },\n      {\n        passive: false,\n      },\n      [x, y, onChange, readonly, updateValueByEvent],\n    )\n\n    useImperativeHandle(forwardedRef, () => {\n      return {\n        focus() {\n          thumbRef.current?.focus()\n        },\n        blur() {\n          thumbRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n      <div\n        className={clsx('tremolo-xy-pad', className)}\n        ref={(div) => {\n          wheelRefCallback(div)\n          touchMoveRefCallback(div)\n        }}\n        tabIndex={-1}\n        aria-disabled={disabled}\n        aria-readonly={readonly}\n        style={{\n          margin: `calc(${styleHelper(thumbProps?.size ?? 22)} / 2)`, // half thumb size\n          cursor: readonly ? 'not-allowed' : 'pointer',\n          WebkitTapHighlightColor: 'transparent',\n          ...style,\n        }}\n        onPointerDown={(event) => {\n          pointerDownHandler(event)\n          onPointerDown?.(event)\n        }}\n        onKeyDown={(event) => {\n          handleKeyDown(event)\n          onKeyDown?.(event)\n        }}\n        onFocus={(event) => {\n          thumbRef.current?.focus()\n          onFocus?.(event)\n        }}\n        onBlur={(event) => {\n          thumbRef.current?.blur()\n          onBlur?.(event)\n        }}\n        {...props}\n      >\n        <div className=\"tremolo-xy-pad-area-wrapper\" ref={areaElementRef}>\n          <XYPadArea\n            __thumb={\n              <XYPadThumb\n                ref={thumbRef}\n                __disabled={disabled}\n                __css={{\n                  top: `${percentY}%`,\n                  left: `${percentX}%`,\n                }}\n                {...thumbProps}\n              />\n            }\n            {...areaProps}\n          />\n        </div>\n      </div>\n    )\n  },\n)\n\nexport * from './Thumb'\nexport * from './Area'\n","import { DependencyList, useCallback, useEffect, useRef } from 'react'\n\n/**\n * @category hooks\n */\nexport function useAnimationFrame(\n  callback = () => {},\n  deps: DependencyList = [],\n) {\n  const reqIdRef = useRef(-1)\n  const loop = useCallback(() => {\n    reqIdRef.current = requestAnimationFrame(loop)\n    callback()\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [callback, ...deps])\n\n  useEffect(() => {\n    reqIdRef.current = requestAnimationFrame(loop)\n    return () => cancelAnimationFrame(reqIdRef.current)\n  }, [loop])\n}\n","import { useCallback, useEffect, useState } from 'react'\n\n/** @private */\nexport const PERMISSION_DENIED = 'PERMISSION_DENIED'\n/** @private */\nexport const NOT_SUPPORTED = 'NOT_SUPPORTED'\n\n/** @private */\nexport type MIDIAccessError = typeof PERMISSION_DENIED | typeof NOT_SUPPORTED\n\n/**\n * Hooks for requesting MIDI access in the browser. The first argument allows you to choose whether to request access on mount.\n * @category hooks\n */\nexport function useMIDIAccess(requestOnMount = true) {\n  const [midiAccess, setMidiAccess] = useState<MIDIAccess | null>(null)\n  const [error, setError] = useState<MIDIAccessError | null>(null)\n\n  const request = useCallback(() => {\n    if (navigator.requestMIDIAccess) {\n      navigator\n        .requestMIDIAccess()\n        .then((access) => {\n          setMidiAccess(access)\n          setError(null)\n        })\n        .catch(() => {\n          setError(PERMISSION_DENIED)\n        })\n    } else {\n      setError(NOT_SUPPORTED)\n    }\n  }, [])\n\n  useEffect(() => {\n    if (requestOnMount) request()\n  }, [requestOnMount, request])\n\n  return { request, midiAccess, error }\n}\n","import { useEffect } from 'react'\n\n/**\n * Hooks for when you want to process MIDI events in more detail than useMIDIInput.\n * @category hooks\n */\nexport function useMIDIMessage(\n  midiAccess: MIDIAccess | null,\n  onMIDIMessage: (event: MIDIMessageEvent) => void,\n) {\n  useEffect(() => {\n    if (!midiAccess) return\n\n    for (const input of midiAccess.inputs.values()) {\n      input.addEventListener('midimessage', onMIDIMessage)\n    }\n\n    return () => {\n      for (const input of midiAccess.inputs.values()) {\n        input.removeEventListener('midimessage', onMIDIMessage)\n      }\n    }\n  }, [midiAccess, onMIDIMessage])\n}\n","import { useCallback } from 'react'\n\nimport { useMIDIMessage } from './useMIDIMessage'\n\nconst MIDI_EVENT_TO_NUMBER = {\n  NOTE_ON: 0x90,\n  NOTE_OFF: 0x80,\n  PITCH_BEND: 0xe0,\n}\n\n// const NUMBER_TO_MIDI_EVENT: Record<number, string> = {\n//   0x90: 'NOTE_ON',\n//   0x80: 'NOTE_OFF',\n//   0xe0: 'PITCH_BEND',\n// }\n\n/**\n * Hooks for handling note on/off events. To be used with useMIDIAccess. Internally uses useMIDIMessage.\n * @category hooks\n */\nexport function useMIDIInput(\n  midiAccess: MIDIAccess | null,\n  onNoteOnEvent?: (note: number, velocity: number) => void,\n  onNoteOffEvent?: (note: number) => void,\n  onPitchBendEvent?: (msb: number, lsb: number) => void,\n) {\n  const handleMIDIMessage = useCallback(\n    (event: MIDIMessageEvent) => {\n      if (!event.data) return\n      // event.data[0] ... command\n      // event.data[1] ... note, MSB (Most Significant Byte)\n      // event.data[2] ... velocity, LSB (Least Significant Byte)\n      const kind = event.data[0] & 0xf0\n\n      if (\n        kind == MIDI_EVENT_TO_NUMBER.NOTE_OFF ||\n        (kind == MIDI_EVENT_TO_NUMBER.NOTE_ON && event.data[2] == 0)\n      ) {\n        onNoteOffEvent?.(event.data[1])\n      } else if (kind == MIDI_EVENT_TO_NUMBER.NOTE_ON) {\n        onNoteOnEvent?.(event.data[1], event.data[2])\n      } else if (kind == MIDI_EVENT_TO_NUMBER.PITCH_BEND) {\n        onPitchBendEvent?.(event.data[1], event.data[2])\n      }\n    },\n    [onNoteOffEvent, onNoteOnEvent, onPitchBendEvent],\n  )\n\n  useMIDIMessage(midiAccess, handleMIDIMessage)\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["Thumb","Thumb","defaultExternalStyles","Root","Root","Root","defaultExternalStyles","Root","Thumb","defaultExternalStyles","Root","Thumb"],"sources":["../src/components/AnimationCanvas/canvas.ts","../src/components/AnimationCanvas/index.tsx","../src/hooks/useCallbackRef.ts","../src/hooks/useEventListener.ts","../src/hooks/useRefCallbackEvent.ts","../src/hooks/useDrag.ts","../src/components/DragObserver/index.tsx","../src/components/_util/index.ts","../src/components/Knob/context.tsx","../src/components/Knob/ActiveLine.tsx","../src/components/Knob/InactiveLine.tsx","../src/components/Knob/Thumb.tsx","../src/components/Knob/SVGRoot.tsx","../src/components/Knob/index.tsx","../src/components/NumberInput/type.ts","../src/components/NumberInput/context.tsx","../src/hooks/useInterval.ts","../src/hooks/useLongPress.ts","../src/components/NumberInput/DecrementStepper.tsx","../src/components/NumberInput/IncrementStepper.tsx","../src/components/NumberInput/InternalInput.tsx","../src/components/NumberInput/Stepper.tsx","../src/components/NumberInput/index.tsx","../src/hooks/usePianoDrag.ts","../src/components/Piano/context.tsx","../src/components/Piano/KeyLabel.tsx","../src/components/Piano/key.tsx","../src/components/Piano/keyboardShortcuts.ts","../src/components/Piano/index.tsx","../src/components/PointsEditor/Background.tsx","../src/components/PointsEditor/context.tsx","../src/components/PointsEditor/Container.tsx","../src/hooks/useDragWithElement.ts","../src/components/PointsEditor/Point.tsx","../src/components/PointsEditor/index.tsx","../src/components/Slider/context.tsx","../src/components/Slider/ScaleOption.tsx","../src/components/Slider/type.ts","../src/components/Slider/Scale.tsx","../src/components/Slider/Thumb.tsx","../src/components/Slider/Track.tsx","../src/components/Slider/index.tsx","../src/components/_util/composeRefs.tsx","../src/components/WheelObserver/index.tsx","../src/components/XYPad/Area.tsx","../src/components/XYPad/Thumb.tsx","../src/components/XYPad/index.tsx","../src/hooks/useAnimationFrame.ts","../src/hooks/useMIDIAccess.ts","../src/hooks/useMIDIMessage.ts","../src/hooks/useMIDIInput.ts"],"sourcesContent":["// https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/save\nexport const drawingState = [\n  'strokeStyle',\n  'fillStyle',\n  'globalAlpha',\n  'lineWidth',\n  'lineCap',\n  'lineJoin',\n  'miterLimit',\n  'lineDashOffset',\n  'shadowOffsetX',\n  'shadowOffsetY',\n  'shadowBlur',\n  'shadowColor',\n  'globalCompositeOperation',\n  'font',\n  'textAlign',\n  'textBaseline',\n  'direction',\n  'imageSmoothingEnabled',\n] as const\n\nexport type DrawingState = (typeof drawingState)[number]\nexport type DrawingStateValue = CanvasRenderingContext2D[DrawingState]\nexport type DrawingContext = Pick<CanvasRenderingContext2D, DrawingState>\n\nexport function isDrawingState(obj: unknown): obj is DrawingState {\n  const d: string[] = [...drawingState]\n  return typeof obj == 'string' && d.includes(obj)\n}\n\nexport function setDprConfig(\n  canvas: HTMLCanvasElement,\n  context: CanvasRenderingContext2D,\n  width: number,\n  height: number,\n  dpr: number,\n) {\n  canvas.width = width * dpr\n  canvas.height = height * dpr\n  // Reset current transformation matrix to the identity matrix\n  context.setTransform(1, 0, 0, 1, 0, 0)\n  context.scale(dpr, dpr)\n  canvas.style.width = `${width}px`\n  canvas.style.height = `${height}px`\n}\n","import clsx from 'clsx'\nimport {\n  ComponentPropsWithoutRef,\n  ReactElement,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n} from 'react'\n\nimport {\n  DrawingContext,\n  drawingState,\n  DrawingStateValue,\n  setDprConfig,\n} from './canvas'\n\nexport type InitFunction = (\n  context: CanvasRenderingContext2D,\n  option: {\n    /** current canvas width */\n    width: number\n    /** current canvas height */\n    height: number\n  },\n) => void\n\nexport type DrawFunction = (\n  context: CanvasRenderingContext2D,\n  option: {\n    /** current canvas width */\n    width: number\n    /** current canvas height */\n    height: number\n    /** frame count */\n    count: number\n    /** delta time (ms) */\n    deltaTime: number\n    /** elapsed time (ms) */\n    elapsedTime: number\n    /** frame per second */\n    fps: number\n  },\n) => void\n\nexport interface CommonProps {\n  draw: DrawFunction\n  init?: InitFunction\n  animate?: boolean\n  /**\n   * @see https://developer.mozilla.org/docs/Web/API/HTMLCanvasElement/getContext#contextattributes\n   */\n  options?: CanvasRenderingContext2DSettings\n}\n\nexport interface AbsoluteSizingProps {\n  width?: number\n  height?: number\n}\n\nexport interface RelativeSizingProps {\n  relativeSize?: boolean\n  reduceFlickering?: boolean\n}\n\nexport type AnimationCanvasProps = CommonProps &\n  AbsoluteSizingProps &\n  RelativeSizingProps\n\n/**\n * A simple animatable canvas with requestAnimationFrame()\n */\nexport function AnimationCanvas(\n  props: CommonProps &\n    AbsoluteSizingProps &\n    Omit<ComponentPropsWithoutRef<'canvas'>, keyof AnimationCanvasProps>,\n): ReactElement\nexport function AnimationCanvas(\n  pros: CommonProps &\n    RelativeSizingProps &\n    Omit<ComponentPropsWithoutRef<'canvas'>, keyof AnimationCanvasProps>,\n): ReactElement\nexport function AnimationCanvas({\n  // common\n  draw,\n  init,\n  animate = true,\n  options,\n  // absolute\n  width: _width = 100,\n  height: _height = 100,\n  // relative\n  relativeSize,\n  reduceFlickering = true,\n  // canvas props\n  className,\n  onContextMenu = (event) => event.preventDefault(),\n  ...props\n}: AnimationCanvasProps &\n  Omit<\n    ComponentPropsWithoutRef<'canvas'>,\n    keyof AnimationCanvasProps\n  >): ReactElement {\n  const canvasRef = useRef<HTMLCanvasElement>(null)\n  const memoCanvasRef = useRef<HTMLCanvasElement>(null)\n  const reqIdRef = useRef(-1)\n  const widthRef = useRef(0)\n  const heightRef = useRef(0)\n  const deltaMemoRef = useRef(-1)\n  const startTimeRef = useRef(-1)\n\n  const loop = useCallback(\n    (\n      context: CanvasRenderingContext2D,\n      width: RefObject<number>,\n      height: RefObject<number>,\n      count: number,\n    ) => {\n      const now = performance.now()\n      const deltaTime = now - deltaMemoRef.current\n      const elapsedTime = now - startTimeRef.current\n      deltaMemoRef.current = now\n      if (animate) {\n        reqIdRef.current = requestAnimationFrame(() =>\n          loop(context, width, height, count + 1),\n        )\n      }\n      draw(context, {\n        width: width.current,\n        height: height.current,\n        count: count + 1,\n        deltaTime,\n        elapsedTime,\n        fps: 1000 / deltaTime,\n      })\n    },\n    [draw, animate],\n  )\n\n  useEffect(() => {\n    if (!canvasRef.current) return\n    const canvas = canvasRef.current\n    const context = canvas.getContext('2d', options)\n    if (!context) throw new Error('Cannot get canvas context.')\n    const dpr = globalThis.devicePixelRatio\n\n    const firstRendering = (width: number, height: number) => {\n      setDprConfig(canvas, context, width, height, dpr)\n      widthRef.current = width\n      heightRef.current = height\n\n      if (init) init(context, { width, height })\n      const now = performance.now()\n      deltaMemoRef.current = now\n      startTimeRef.current = now\n      loop(context, widthRef, heightRef, -1)\n    }\n\n    if (relativeSize) {\n      const parent = canvas.parentElement\n      if (!parent) throw new Error(\"Canvas doesn't have a parent element.\")\n      const memoCanvas = memoCanvasRef.current\n      const memoContext = memoCanvas?.getContext('2d', options)\n\n      const ro = new ResizeObserver((entries) => {\n        for (const entry of entries) {\n          const w = entry.contentRect.width\n          const h = entry.contentRect.height\n          const contextMemo = {} as DrawingContext\n          if (reduceFlickering && memoCanvas && memoContext) {\n            // Prevents loss of some context when the canvas is resized\n            for (const prop of drawingState) {\n              ;(contextMemo[prop] as DrawingStateValue) = context[prop]\n            }\n            memoCanvas.width = w * dpr\n            memoCanvas.height = h * dpr\n            memoContext.scale(1 / dpr, 1 / dpr)\n            if (canvas.width > 0 && canvas.height > 0) {\n              memoContext.drawImage(canvas, 0, 0)\n            }\n          }\n\n          setDprConfig(canvas, context, w, h, dpr)\n          widthRef.current = w\n          heightRef.current = h\n\n          if (\n            reduceFlickering &&\n            memoContext &&\n            memoCanvas &&\n            memoCanvas.width > 0 &&\n            memoCanvas.height > 0\n          ) {\n            for (const prop of drawingState) {\n              ;(context[prop] as DrawingStateValue) = contextMemo[prop]\n            }\n\n            context.drawImage(memoContext.canvas, 0, 0)\n          }\n\n          if (!animate) {\n            // re rendering\n            loop(context, widthRef, heightRef, -1)\n          }\n        }\n      })\n      ro.observe(parent)\n\n      const width = parent.clientWidth\n      const height = parent.clientHeight\n      firstRendering(width, height)\n\n      return () => {\n        if (reqIdRef.current) cancelAnimationFrame(reqIdRef.current)\n        ro.disconnect()\n      }\n    } else {\n      const { width, height } = canvas.getBoundingClientRect()\n      firstRendering(width, height)\n\n      return () => {\n        if (reqIdRef.current) cancelAnimationFrame(reqIdRef.current)\n      }\n    }\n  }, [loop, init, options, reduceFlickering, relativeSize, animate])\n\n  return (\n    <>\n      <canvas\n        className={clsx('tremolo-animation-canvas', className)}\n        width={relativeSize ? 0 : _width}\n        height={relativeSize ? 0 : _height}\n        ref={canvasRef}\n        onContextMenu={onContextMenu}\n        {...props}\n      ></canvas>\n      {relativeSize && reduceFlickering && (\n        <canvas style={{ display: 'none' }} ref={memoCanvasRef}></canvas>\n      )}\n    </>\n  )\n}\n","import { DependencyList, useCallback, useInsertionEffect, useRef } from 'react'\n\n/**\n * Internal\n * @private\n */\nexport function useCallbackRef<Args extends unknown[], Return>(\n  callback: ((...args: Args) => Return) | undefined,\n  deps: DependencyList = [],\n) {\n  const callbackRef = useRef<typeof callback>(() => {\n    throw new Error('Cannot call an event handler while rendering.')\n  })\n\n  useInsertionEffect(() => {\n    callbackRef.current = callback\n  })\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useCallback((...args: Args) => callbackRef.current?.(...args), deps)\n}\n","import { useEffect } from 'react'\n\nimport { useCallbackRef } from './useCallbackRef'\n\ntype Target = EventTarget | null | (() => EventTarget | null)\ntype Options = boolean | AddEventListenerOptions\n\nexport function useEventListener<K extends keyof DocumentEventMap>(\n  target: Target,\n  event: K,\n  handler: (event: DocumentEventMap[K]) => void,\n  options?: Options,\n): VoidFunction\nexport function useEventListener<K extends keyof WindowEventMap>(\n  target: Target,\n  event: K,\n  handler: (event: WindowEventMap[K]) => void,\n  options?: Options,\n): VoidFunction\nexport function useEventListener<K extends keyof GlobalEventHandlersEventMap>(\n  target: Target,\n  event: K,\n  handler: (event: GlobalEventHandlersEventMap[K]) => void,\n  options?: Options,\n): VoidFunction\nexport function useEventListener(\n  target: Target,\n  event: string,\n  handler: (event: Event) => void,\n  options?: Options,\n) {\n  const listener = useCallbackRef(handler)\n\n  useEffect(() => {\n    const node = typeof target === 'function' ? target() : (target ?? document)\n\n    if (!node) return\n\n    node.addEventListener(event, listener, options)\n    return () => {\n      node.removeEventListener(event, listener, options)\n    }\n  }, [event, target, options, listener])\n\n  return () => {\n    const node = typeof target === 'function' ? target() : (target ?? document)\n    node?.removeEventListener(event, listener, options)\n  }\n}\n","import { useMemo } from 'react'\n\n/**\n * Internal\n * @private\n */\nexport function useRefCallbackEvent<K extends keyof DocumentEventMap>(\n  event: K,\n  handler: (event: DocumentEventMap[K]) => void,\n  options?: boolean | AddEventListenerOptions,\n  deps?: React.DependencyList,\n): (div: EventTarget | null) => void\nexport function useRefCallbackEvent(\n  event: string,\n  handler: (event: Event) => void,\n  options?: boolean | AddEventListenerOptions,\n  deps: React.DependencyList = [],\n): (div: EventTarget | null) => void {\n  return useMemo(() => {\n    let cleanup: (() => void) | undefined\n    return (node: EventTarget | null) => {\n      if (!node) {\n        cleanup?.()\n        return\n      }\n      node.addEventListener(event, handler, options)\n\n      cleanup = () => {\n        node.removeEventListener(event, handler, options)\n      }\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, deps)\n}\n","import { useRef, useCallback } from 'react'\n\nimport { useEventListener } from './useEventListener'\nimport { useRefCallbackEvent } from './useRefCallbackEvent'\n\ninterface UseDragProps {\n  threshold?: number\n\n  onDrag?: (x: number, y: number, deltaX: number, deltaY: number) => void\n  onDragStart?: () => void\n  onDragEnd?: () => void\n}\n\n/**\n * @returns [refCallback, pointerDownHandler]\n */\nexport function useDrag<T extends Element>({\n  threshold: _threshold = 1,\n  onDrag,\n  onDragStart,\n  onDragEnd,\n}: UseDragProps): [\n  (div: EventTarget | null) => void,\n  (event: React.PointerEvent<T>) => void,\n] {\n  const dragOffsetX = useRef<number | undefined>(undefined)\n  const dragOffsetY = useRef<number | undefined>(undefined)\n  const dragStartX = useRef(0)\n  const dragStartY = useRef(0)\n\n  const threshold = Math.max(_threshold, 1)\n\n  const handleDrag = useCallback(\n    (\n      event: MouseEvent | React.MouseEvent<T, MouseEvent> | TouchEvent,\n      first = false,\n    ) => {\n      const isTouch = event instanceof TouchEvent\n      if (isTouch && event.cancelable) event.preventDefault()\n      const screenX = isTouch ? event.touches[0].screenX : event.screenX\n      const screenY = isTouch ? event.touches[0].screenY : event.screenY\n      let deltaX = 0\n      let deltaY = 0\n      if (first) {\n        dragStartX.current = screenX\n        dragStartY.current = screenY\n      }\n      if (dragOffsetX.current) {\n        deltaX = screenX - dragOffsetX.current\n        dragOffsetX.current = screenX\n      }\n      if (dragOffsetY.current) {\n        deltaY = screenY - dragOffsetY.current\n        dragOffsetY.current = screenY\n      }\n      if (Math.abs(deltaX) < threshold && Math.abs(deltaY) < threshold) return\n      onDrag?.(\n        screenX - dragStartX.current,\n        screenY - dragStartY.current,\n        deltaX,\n        deltaY,\n      )\n    },\n    [threshold, onDrag],\n  )\n\n  const pointerDownHandler = useCallback(\n    (event: React.PointerEvent<T>) => {\n      dragOffsetX.current = event.screenX\n      dragOffsetY.current = event.screenY\n      handleDrag(event, true)\n      onDragStart?.()\n    },\n    [handleDrag, onDragStart],\n  )\n\n  const refHandler = useRefCallbackEvent(\n    'touchmove',\n    handleDrag,\n    { passive: false },\n    [onDrag],\n  )\n\n  useEventListener(globalThis.window, 'mousemove', handleDrag)\n\n  useEventListener(globalThis.window, 'pointerup', () => {\n    dragOffsetX.current = undefined\n    dragOffsetY.current = undefined\n    onDragEnd?.()\n  })\n\n  return [refHandler, pointerDownHandler]\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react'\n\nimport { useDrag } from '../../hooks/useDrag'\nimport { Override } from '../_util/type'\n\nexport interface DragObserverProps<T extends ElementType> {\n  /**\n   * React.ElementType\n   * @default div\n   */\n  as?: T\n\n  /**\n   * Threshold at which the onDrag event fires.\n   * Prevents onDrag events from firing, for example, when double-clicking.\n   */\n  threshold?: number\n\n  children?: ReactNode\n  onDrag?: (x: number, y: number, deltaX: number, deltaY: number) => void\n  onDragStart?: () => void\n  onDragEnd?: () => void\n}\n\nexport function DragObserver<T extends ElementType = 'div'>(\n  props: Override<DragObserverProps<T>, ComponentPropsWithoutRef<T>>,\n) {\n  const {\n    as: Component = 'div',\n    threshold = 1,\n    onDrag,\n    onDragStart,\n    onDragEnd,\n    children,\n    onPointerDown,\n    ...attributes\n  } = props\n\n  const [refCallback, pointerDownHandler] = useDrag({\n    threshold: threshold,\n    onDrag: onDrag,\n    onDragStart: onDragStart,\n    onDragEnd: onDragEnd,\n  })\n\n  return (\n    <Component\n      ref={refCallback}\n      onPointerDown={(e) => {\n        pointerDownHandler(e)\n        onPointerDown?.(e)\n      }}\n      {...attributes}\n    >\n      {children}\n    </Component>\n  )\n}\n","export function addUserSelectNone() {\n  window.document.body.classList.add('tremolo-user-select-none')\n}\n\nexport function removeUserSelectNone() {\n  window.document.body.classList.remove('tremolo-user-select-none')\n}\n\nconst cursorStyles = {\n  grabbing: 'tremolo-cursor-grabbing',\n  grab: 'tremolo-cursor-grab',\n  pointer: 'tremolo-cursor-pointer',\n  move: 'tremolo-cursor-move',\n  none: 'tremolo-cursor-none',\n}\n\nexport type Cursor = keyof typeof cursorStyles\n\nexport function setCursorStyle(type: Cursor) {\n  resetCursorStyle()\n  window.document.body.classList.add(cursorStyles[type])\n}\n\nexport function resetCursorStyle() {\n  Object.values(cursorStyles).forEach((s) => {\n    window.document.body.classList.remove(s)\n  })\n}\n","import {\n  createContext,\n  PropsWithChildren,\n  useContext,\n  useEffect,\n  useRef,\n} from 'react'\nimport { createStore, useStore } from 'zustand'\n\nimport { normalizeValue, radian } from '@tremolo-ui/functions'\n\nexport const viewBoxSize = 100\nexport const center = viewBoxSize / 2\n\ntype State = {\n  value: number\n  min: number\n  max: number\n  step: number\n  skew: number // | SkewFunction // TODO\n  startValue: number\n  angleRange: number\n}\n\ntype DrawingState = {\n  p: number // normalized value\n  r1: number // ロータリー開始位置\n  r2: number // activeLineの開始位置\n  r3: number // activeLineの終了位置\n  r4: number // ロータリー終了位置\n  x1: number\n  y1: number\n  x2: number\n  y2: number\n  x3: number\n  y3: number\n  x4: number\n  y4: number\n}\n\nfunction calcDrawingState({\n  value,\n  min,\n  max,\n  skew,\n  startValue,\n  angleRange,\n}: State) {\n  const p = normalizeValue(value, min, max, skew)\n  const s = normalizeValue(startValue, min, max, skew)\n\n  const r1 = -angleRange / 2\n  const r2 = r1 + Math.min(p, s) * angleRange\n  const r3 = r1 + Math.max(p, s) * angleRange\n  const r4 = angleRange / 2\n  const x1 = center + center * Math.cos(radian(r1 - 90))\n  const y1 = center + center * Math.sin(radian(r1 - 90))\n  const x2 = center + center * Math.cos(radian(r2 - 90))\n  const y2 = center + center * Math.sin(radian(r2 - 90))\n  const x3 = center + center * Math.cos(radian(r3 - 90))\n  const y3 = center + center * Math.sin(radian(r3 - 90))\n  const x4 = center + center * Math.cos(radian(r4 - 90))\n  const y4 = center + center * Math.sin(radian(r4 - 90))\n\n  return {\n    p,\n    r1,\n    r2,\n    r3,\n    r4,\n    x1,\n    y1,\n    x2,\n    y2,\n    x3,\n    y3,\n    x4,\n    y4,\n  }\n}\n\ntype KnobStore = ReturnType<typeof createKnobStore>\n\nconst createKnobStore = (initProps: State) => {\n  return createStore<State & DrawingState>()(() => ({\n    ...initProps,\n    ...calcDrawingState(initProps),\n  }))\n}\n\nconst KnobContext = createContext<KnobStore | null>(null)\n\nexport function KnobProvider({ children, ...props }: PropsWithChildren<State>) {\n  const storeRef = useRef<KnobStore>(null)\n  if (!storeRef.current) {\n    storeRef.current = createKnobStore(props)\n  }\n\n  useEffect(() => {\n    if (storeRef.current) {\n      storeRef.current.setState({ ...props, ...calcDrawingState(props) })\n    } else {\n      storeRef.current = createKnobStore(props)\n    }\n  }, [props])\n\n  return (\n    <KnobContext.Provider value={storeRef.current}>\n      {children}\n    </KnobContext.Provider>\n  )\n}\n\nexport function useKnobContext<T>(\n  selector: (state: State & DrawingState) => T,\n): T {\n  const store = useContext(KnobContext)\n  if (!store) throw new Error('Missing KnobContext.Provider in the tree')\n  return useStore(store, selector)\n}\n","import clsx from 'clsx'\nimport { SVGProps } from 'react'\n\nimport { center, useKnobContext } from './context'\n\nexport function ActiveLine({\n  stroke = 'currentColor',\n  strokeWidth = 6,\n  className,\n  ...props\n}: Omit<SVGProps<SVGPathElement>, 'd'>) {\n  const r2 = useKnobContext((s) => s.r2)\n  const r3 = useKnobContext((s) => s.r3)\n  const x2 = useKnobContext((s) => s.x2)\n  const y2 = useKnobContext((s) => s.y2)\n  const x3 = useKnobContext((s) => s.x3)\n  const y3 = useKnobContext((s) => s.y3)\n\n  return (\n    <path\n      className={clsx('tremolo-knob-active-line', className)}\n      d={`M ${x2} ${y2} A ${center} ${center} -135 ${r3 - r2 > 180 ? 1 : 0} 1 ${x3} ${y3}`}\n      fill=\"none\"\n      stroke={stroke}\n      strokeWidth={strokeWidth}\n      {...props}\n    />\n  )\n}\n","import clsx from 'clsx'\nimport { SVGProps } from 'react'\n\nimport { center, useKnobContext } from './context'\n\nexport function InactiveLine({\n  stroke = 'currentColor',\n  strokeWidth = 6,\n  className,\n  ...props\n}: Omit<SVGProps<SVGPathElement>, 'd'>) {\n  const min = useKnobContext((s) => s.min)\n  const max = useKnobContext((s) => s.max)\n  const startValue = useKnobContext((s) => s.startValue)\n\n  const r1 = useKnobContext((s) => s.r1)\n  const r2 = useKnobContext((s) => s.r2)\n  const r3 = useKnobContext((s) => s.r3)\n  const r4 = useKnobContext((s) => s.r4)\n  const x1 = useKnobContext((s) => s.x1)\n  const y1 = useKnobContext((s) => s.y1)\n  const x2 = useKnobContext((s) => s.x2)\n  const y2 = useKnobContext((s) => s.y2)\n  const x3 = useKnobContext((s) => s.x3)\n  const y3 = useKnobContext((s) => s.y3)\n  const x4 = useKnobContext((s) => s.x4)\n  const y4 = useKnobContext((s) => s.y4)\n\n  return (\n    <>\n      {startValue > min && (\n        <path\n          className={clsx('tremolo-knob-inactive-line', className)}\n          d={`M ${x1} ${y1} A ${center} ${center} -135 ${r2 - r1 > 180 ? 1 : 0} 1 ${x2} ${y2}`}\n          fill=\"none\"\n          stroke={stroke}\n          strokeWidth={strokeWidth}\n          {...props}\n        />\n      )}\n      {startValue < max && (\n        <path\n          className={clsx('tremolo-knob-inactive-line', className)}\n          d={`M ${x3} ${y3} A ${center} ${center} -135 ${r4 - r3 > 180 ? 1 : 0} 1 ${x4} ${y4}`}\n          fill=\"none\"\n          stroke={stroke}\n          strokeWidth={strokeWidth}\n          {...props}\n        />\n      )}\n    </>\n  )\n}\n","import clsx from 'clsx'\nimport { SVGProps } from 'react'\n\nimport { clamp } from '@tremolo-ui/functions'\n\nimport { useKnobContext, viewBoxSize } from './context'\n\ninterface Props {\n  /** color */\n  thumb?: string\n  /** color */\n  thumbLine?: string\n  /** percent (0-100) */\n  thumbSize?: number\n  /** percent (0-100) */\n  thumbLineWeight?: number\n  /** percent (0-100) */\n  thumbLineLength?: number\n\n  classes?: {\n    thumb?: string\n    thumbLine?: string\n  }\n}\n\nexport function Thumb({\n  className,\n\n  thumb = 'currentColor',\n  thumbLine = 'currentColor',\n  thumbSize = 84,\n  thumbLineWeight = 6,\n  thumbLineLength = 35,\n  classes,\n\n  ...props\n}: Props & Omit<SVGProps<SVGSVGElement>, 'd' | keyof Props>) {\n  const angleRange = useKnobContext((s) => s.angleRange)\n\n  const p = useKnobContext((s) => s.p)\n  const r1 = useKnobContext((s) => s.r1)\n\n  return (\n    <svg className={clsx('tremolo-knob-thumb', classes?.thumb)} {...props}>\n      <circle cx=\"50%\" cy=\"50%\" r={`${thumbSize / 2}%`} fill={thumb} />\n      <line\n        className={clsx('tremolo-knob-thumb-line', classes?.thumbLine)}\n        x1=\"50%\"\n        y1={`${(viewBoxSize - clamp(thumbSize, 0, 100)) / 2}%`}\n        x2=\"50%\"\n        y2={`${thumbLineLength}%`}\n        stroke={thumbLine}\n        strokeWidth={`${thumbLineWeight}%`}\n        // NOTE\n        // https://bugs.webkit.org/show_bug.cgi?id=201854\n        // https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Attribute/transform-origin#browser_compatibility\n        style={{\n          transform: `rotate(${r1 + p * angleRange}deg)`,\n          transformOrigin: '50% 50%',\n        }}\n      />\n    </svg>\n  )\n}\n","import { SVGProps } from 'react'\n\nimport { Override } from '../_util/type'\n\nimport { ActiveLine } from './ActiveLine'\nimport { viewBoxSize } from './context'\nimport { InactiveLine } from './InactiveLine'\nimport { Thumb } from './Thumb'\n\ninterface SVGRoot {\n  block?: boolean\n  overflowVisible?: boolean\n}\n\nexport function SVGRoot({\n  children,\n  style,\n  ...props\n}: Override<SVGRoot, SVGProps<SVGSVGElement>>) {\n  return (\n    <svg\n      viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n      style={{\n        display: 'block',\n        overflow: 'visible',\n        ...style,\n      }}\n      {...props}\n    >\n      {children || (\n        <>\n          <InactiveLine />\n          <ActiveLine />\n          <Thumb />\n        </>\n      )}\n    </svg>\n  )\n}\n","import clsx from 'clsx'\nimport {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react'\n\nimport {\n  clamp,\n  InputEventOption,\n  normalizeValue,\n  rawValue,\n  stepValue,\n} from '@tremolo-ui/functions'\n\nimport { useDrag } from '../../hooks/useDrag'\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\nimport {\n  addUserSelectNone,\n  Cursor,\n  removeUserSelectNone,\n  resetCursorStyle,\n  setCursorStyle,\n} from '../_util'\n\nimport { ActiveLine } from './ActiveLine'\nimport { KnobProvider } from './context'\nimport { InactiveLine } from './InactiveLine'\nimport { SVGRoot } from './SVGRoot'\nimport { Thumb } from './Thumb'\n\nconst defaultExternalStyles: KnobProps['externalStyles'] = {\n  userSelectNone: true,\n  cursor: 'grabbing',\n}\n\nexport interface KnobProps {\n  // required\n  value: number\n  min: number\n  max: number\n\n  // optional\n  step?: number\n  skew?: number // | SkewFunction // TODO\n  /**\n   * value set when double-clicking\n   * restriction: enableDoubleClickDefault = true\n   * @default min\n   * @see enableDoubleClickDefault\n   */\n  defaultValue?: number\n\n  /**\n   * Value to be used as the starting point of the line when drawing.\n   * @default min\n   */\n  startValue?: number\n\n  /** width and height */\n  size?: number | string\n\n  /**\n   * Global style to apply when dragged\n   * @default defaultExternalStyles\n   */\n  externalStyles?: {\n    userSelectNone?: boolean\n    cursor?: Cursor\n  }\n  /**\n   * wheel control option\n   * If null, no event will be triggered\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   * If null, no event will be triggered\n   */\n  keyboard?: InputEventOption | null\n  enableDoubleClickDefault?: boolean\n\n  disabled?: boolean\n  readonly?: boolean\n\n  /** angle range [degree] */\n  angleRange?: number\n\n  onChange?: (value: number) => void\n}\n\nexport interface KnobMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = KnobProps & Omit<ComponentPropsWithoutRef<'div'>, keyof KnobProps>\n\nconst Root = forwardRef<KnobMethods, Props>(\n  (\n    {\n      value,\n      min,\n      max,\n      step = 1,\n      skew = 1,\n      defaultValue = min,\n      startValue = min,\n      size,\n      externalStyles: _externalStyles,\n      wheel = ['raw', 1],\n      keyboard = ['raw', 1],\n      enableDoubleClickDefault = true,\n      disabled = false,\n      readonly = false,\n      angleRange = 270,\n      onChange,\n      onKeyDown,\n      onPointerDown,\n      onDoubleClick,\n      className,\n      style,\n      children,\n      ...props\n    }: Props,\n    forwardedRef,\n  ) => {\n    const [dragging, setDragging] = useState(false)\n    const valueRef = useRef(0)\n    const elmRef = useRef<HTMLElement | SVGElement>(null)\n\n    const externalStyles = { ...defaultExternalStyles, ..._externalStyles }\n\n    // --- internal functions ---\n    const onDrag = useCallback(\n      (_x: number, y: number) => {\n        if (!onChange || readonly) return\n        const v = rawValue(valueRef.current - y / 100, min, max, skew)\n        const clamped = clamp(stepValue(v, step), min, max)\n        onChange(clamped)\n      },\n      [max, min, onChange, readonly, skew, step],\n    )\n\n    const updateValueByEvent = useCallback(\n      (eventType: InputEventOption[0], x: number) => {\n        let newValue\n        if (eventType == 'normalized') {\n          const n = normalizeValue(value, min, max, skew)\n          newValue = rawValue(n + x, min, max, skew)\n        } else {\n          newValue = value + x\n        }\n        return clamp(stepValue(newValue, step), min, max)\n      },\n      [max, min, skew, step, value],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLOrSVGElement>) => {\n        if (!keyboard || !onChange || readonly) return\n        const key = event.key\n        if (['ArrowRight', 'ArrowLeft', 'ArrowUp', 'ArrowDown'].includes(key)) {\n          event.preventDefault()\n          const x =\n            key == 'ArrowRight' || key == 'ArrowUp' ? keyboard[1] : -keyboard[1]\n          onChange(updateValueByEvent(keyboard[0], x))\n        }\n      },\n      [keyboard, onChange, readonly, updateValueByEvent],\n    )\n\n    // --- hooks ---\n    const [touchMoveRefCallback, pointerDownHandler] = useDrag<\n      HTMLElement | SVGElement\n    >({\n      onDrag: onDrag,\n      onDragStart: () => {\n        setDragging(true)\n        valueRef.current = normalizeValue(value, min, max, skew)\n        if (externalStyles.userSelectNone) addUserSelectNone()\n        if (externalStyles.cursor) setCursorStyle(externalStyles.cursor)\n      },\n      onDragEnd: () => {\n        setDragging(false)\n        if (externalStyles.userSelectNone) removeUserSelectNone()\n        if (externalStyles.cursor) resetCursorStyle()\n      },\n    })\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!wheel || readonly) return\n        event.preventDefault()\n        if (!onChange || event.deltaY == 0) return\n        const x = Math.sign(event.deltaY) * -wheel[1]\n        onChange(updateValueByEvent(wheel[0], x))\n      },\n      { passive: false },\n      [wheel, onChange, readonly, updateValueByEvent],\n    )\n\n    useImperativeHandle(forwardedRef, () => {\n      return {\n        focus() {\n          elmRef.current?.focus()\n        },\n        blur() {\n          elmRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <KnobProvider\n        value={value}\n        min={min}\n        max={max}\n        step={step}\n        skew={skew}\n        startValue={startValue}\n        angleRange={angleRange}\n      >\n        <div\n          ref={(elm) => {\n            elmRef.current = elm\n            wheelRefCallback(elm)\n            touchMoveRefCallback(elm)\n          }}\n          className={clsx('tremolo-knob', className)}\n          tabIndex={0}\n          role=\"slider\"\n          aria-valuenow={value}\n          aria-valuemin={min}\n          aria-valuemax={max}\n          aria-disabled={disabled}\n          aria-readonly={readonly}\n          data-dragging={dragging}\n          style={{\n            width: size,\n            height: size,\n            ...style,\n          }}\n          onPointerDown={(event) => {\n            pointerDownHandler(event)\n            onPointerDown?.(event)\n          }}\n          onDoubleClick={(event) => {\n            if (enableDoubleClickDefault && onChange) {\n              onChange(defaultValue)\n            }\n            onDoubleClick?.(event)\n          }}\n          onKeyDown={(event) => {\n            handleKeyDown(event)\n            onKeyDown?.(event)\n          }}\n          {...props}\n        >\n          {children || <SVGRoot />}\n        </div>\n      </KnobProvider>\n    )\n  },\n)\n\n/**\n * Interactive rotary knob component implemented in SVG.\n */\nexport const Knob = {\n  Root,\n  SVGRoot,\n  InactiveLine,\n  ActiveLine,\n  Thumb,\n}\n\nexport { useKnobContext } from './context'\n","/**\n * [unit, scale][]\n * @example\n * [['Hz', 1], ['kHz', 1000]]\n */\nexport type Units = [string, number][]\n\nexport function selectUnit(units: Units, value: number): [string, number] {\n  let i = 0\n  for (; i < units.length; i++) {\n    if (Math.abs(units[i][1]) > Math.abs(value)) break\n  }\n  return units[Math.max(0, i - 1)]\n}\n\nexport function parseValue(\n  inputString: string,\n  units?: string | Units,\n  digit?: number,\n): {\n  rawValue: number\n  formatValue: string\n  unit: string\n} {\n  const str = inputString.trim()\n  if (!units || typeof units == 'string') {\n    const m = str.match(/-?\\d+(\\.\\d+)?/)\n    let v = Number(m?.[0] ?? '0')\n    v = isNaN(v) ? 0 : v\n    return {\n      rawValue: v,\n      formatValue: (digit != undefined ? v.toFixed(digit) : v) + (units ?? ''),\n      unit: units ?? '',\n    }\n  }\n\n  const unitList = units.map(([u, _s]) => u)\n  const scaleList = units.map(([_u, s]) => s)\n  let rawValue = 0\n  let unit = unitList[0]\n  let formatValue =\n    (digit != undefined ? rawValue.toFixed(digit) : rawValue) + unit\n  const m = str.match(/^(-?\\d+(\\.\\d+)?)\\s*(\\w*)$/)\n  if (m) {\n    rawValue = Number(m[1]) || 0\n    const uIndex = unitList.indexOf(m[3])\n    rawValue *= uIndex != -1 ? scaleList[uIndex] : 1\n    const [u, scale] = selectUnit(units, rawValue)\n    const v = rawValue / scale\n    formatValue = (digit != undefined ? v.toFixed(digit) : v) + u\n    unit = u\n  }\n  return {\n    rawValue: rawValue,\n    formatValue: formatValue,\n    unit: unit,\n  }\n}\n","import { createContext, useContext, useEffect, useRef } from 'react'\nimport { createStore, useStore } from 'zustand'\n\nimport { clamp } from '@tremolo-ui/functions'\n\nimport { parseValue, Units } from './type'\n\ntype State = {\n  value: string\n  valueAsNumber: number\n  step: number\n\n  min?: number\n  max?: number\n  units?: string | Units\n  digit?: number\n  readonly?: boolean\n  keepWithinRange?: boolean\n  onChange?: (value: number, text: string) => void\n}\n\ntype Action = {\n  increment: () => void\n  decrement: () => void\n  change: (value: string) => void\n}\n\ntype NumberInputStore = ReturnType<typeof createNumberInputStore>\n\ntype ProviderProps = Partial<Omit<State, 'value'> & { value: number | string }>\n\nexport function safeClamp(\n  value: number,\n  min = Number.MIN_SAFE_INTEGER,\n  max = Number.MAX_SAFE_INTEGER,\n) {\n  return clamp(value, min, max)\n}\n\nconst createNumberInputStore = (initProps?: ProviderProps) => {\n  const DEFAULT_PROPS: State = {\n    value: '',\n    valueAsNumber: 0,\n    min: 0,\n    max: 0,\n    step: 1,\n    readonly: false,\n    keepWithinRange: true,\n    onChange: (_v: number, _t: string) => {},\n  }\n\n  return createStore<State & Action>()((set) => ({\n    ...DEFAULT_PROPS,\n    ...initProps,\n    ...{\n      value: parseValue(\n        String(initProps?.value || ''),\n        initProps?.units,\n        initProps?.digit,\n      ).formatValue,\n      valueAsNumber: parseValue(\n        String(initProps?.value || ''),\n        initProps?.units,\n        initProps?.digit,\n      ).rawValue,\n    },\n    increment: () =>\n      set((state) => {\n        if (state.readonly) return {}\n        const current = parseValue(\n          state.value,\n          state.units,\n          state.digit,\n        ).rawValue\n        let next = current + (state.step ?? 1)\n        if (state.keepWithinRange) {\n          next = safeClamp(next, state.min, state.max)\n        }\n        const v = parseValue(String(next), state.units, state.digit).formatValue\n        state?.onChange?.(next, v)\n        return {\n          value: v,\n          valueAsNumber: next,\n        }\n      }),\n    decrement: () =>\n      set((state) => {\n        if (state.readonly) return {}\n        const current = parseValue(\n          state.value,\n          state.units,\n          state.digit,\n        ).rawValue\n        let next = current - (state.step ?? 1)\n        if (state.keepWithinRange) {\n          next = safeClamp(next, state.min, state.max)\n        }\n        const v = parseValue(String(next), state.units, state.digit).formatValue\n        state?.onChange?.(next, v)\n        return {\n          value: v,\n          valueAsNumber: next,\n        }\n      }),\n    change: (value) =>\n      set((state) => {\n        if (state.readonly) return {}\n        const v = value ?? ''\n        return {\n          value: v,\n          valueAsNumber: parseValue(v, state.units, state.digit).rawValue,\n        }\n      }),\n  }))\n}\n\nconst NumberInputContext = createContext<NumberInputStore | null>(null)\n\ntype NumberInputProviderProps = React.PropsWithChildren<ProviderProps>\n\nexport function NumberInputProvider({\n  children,\n  ...props\n}: NumberInputProviderProps) {\n  const storeRef = useRef<NumberInputStore>(null)\n  if (!storeRef.current) {\n    storeRef.current = createNumberInputStore(props)\n  }\n\n  useEffect(() => {\n    if (storeRef.current) {\n      const parsed = parseValue(\n        String(props?.value || ''),\n        props?.units,\n        props?.digit,\n      )\n      storeRef.current.setState({\n        ...props,\n        ...{\n          value: parsed.formatValue,\n          valueAsNumber: parsed.rawValue,\n        },\n      })\n    } else {\n      storeRef.current = createNumberInputStore(props)\n    }\n  }, [props])\n\n  return (\n    <NumberInputContext.Provider value={storeRef.current}>\n      {children}\n    </NumberInputContext.Provider>\n  )\n}\n\nexport function useNumberInputContext<T>(\n  selector: (state: State & Action) => T,\n): T {\n  const store = useContext(NumberInputContext)\n  if (!store) throw new Error('Missing NumberInputContext.Provider in the tree')\n  return useStore(store, selector)\n}\n","import { useEffect, useRef } from 'react'\n\nexport function useInterval(callback: () => void, delay: number | null) {\n  const savedCallback = useRef(callback)\n\n  // Remember the latest callback if it changes.\n  useEffect(() => {\n    savedCallback.current = callback\n  }, [callback])\n\n  // Set up the interval.\n  useEffect(() => {\n    // Don't schedule if no delay is specified.\n    // Note: 0 is a valid value for delay.\n    if (delay === null) {\n      return\n    }\n\n    const id = setInterval(() => {\n      savedCallback.current()\n    }, delay)\n\n    return () => {\n      clearInterval(id)\n    }\n  }, [delay])\n}\n","import { useCallback, useState } from 'react'\n\nimport { useEventListener } from './useEventListener'\nimport { useInterval } from './useInterval'\n\nexport function useLongPress(\n  callback: () => void,\n  initialDelay = 500,\n  interval = 40,\n) {\n  const [pressed, setPressed] = useState(false)\n  const [delay, setDelay] = useState(initialDelay)\n\n  useInterval(\n    () => {\n      callback()\n      setDelay(interval)\n    },\n    pressed ? delay : null,\n  )\n\n  useEventListener(globalThis.window, 'pointerup', () => {\n    setPressed(false)\n    setDelay(initialDelay)\n  })\n\n  return useCallback(() => {\n    callback()\n    setPressed(true)\n  }, [callback])\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { useLongPress } from '../../hooks/useLongPress'\n\nimport { useNumberInputContext } from './context'\n\nexport interface DecrementStepperProps {\n  size?: number\n  children?: ReactNode\n}\n\nexport function DecrementStepper({\n  size = 12,\n  children,\n  className,\n  ...props\n}: DecrementStepperProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof DecrementStepperProps>) {\n  const min = useNumberInputContext((s) => s.min)\n  const valueAsNumber = useNumberInputContext((s) => s.valueAsNumber)\n  const readonly = useNumberInputContext((s) => s.readonly)\n  const keepWithinRange = useNumberInputContext((s) => s.keepWithinRange)\n  const decrement = useNumberInputContext((s) => s.decrement)\n\n  const press = useLongPress(decrement)\n\n  return (\n    // eslint-disable-next-line jsx-a11y/role-supports-aria-props\n    <div\n      className={clsx('tremolo-number-input-decrement-stepper', className)}\n      role=\"button\"\n      tabIndex={-1}\n      aria-disabled={\n        keepWithinRange && valueAsNumber <= (min ?? Number.MIN_SAFE_INTEGER)\n      }\n      aria-readonly={readonly}\n      onPointerDown={press}\n      {...props}\n    >\n      {children || (\n        <svg\n          width={size}\n          height={size}\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        >\n          <polyline points=\"6 9 12 15 18 9\" />\n        </svg>\n      )}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { useLongPress } from '../../hooks/useLongPress'\n\nimport { useNumberInputContext } from './context'\n\nexport interface IncrementStepperProps {\n  size?: number\n  children?: ReactNode\n}\n\nexport function IncrementStepper({\n  size = 12,\n  children,\n  className,\n  ...props\n}: IncrementStepperProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof IncrementStepperProps>) {\n  const max = useNumberInputContext((s) => s.max)\n  const valueAsNumber = useNumberInputContext((s) => s.valueAsNumber)\n  const readonly = useNumberInputContext((s) => s.readonly)\n  const keepWithinRange = useNumberInputContext((s) => s.keepWithinRange)\n  const increment = useNumberInputContext((s) => s.increment)\n\n  const press = useLongPress(increment)\n\n  return (\n    // eslint-disable-next-line jsx-a11y/role-supports-aria-props\n    <div\n      className={clsx('tremolo-number-input-increment-stepper', className)}\n      role=\"button\"\n      tabIndex={-1}\n      aria-disabled={\n        keepWithinRange && valueAsNumber >= (max ?? Number.MAX_SAFE_INTEGER)\n      }\n      aria-readonly={readonly}\n      onPointerDown={press}\n      {...props}\n    >\n      {children || (\n        <svg\n          width={size}\n          height={size}\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        >\n          <polyline points=\"18 15 12 9 6 15\" />\n        </svg>\n      )}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\n\nimport {\n  clamp,\n  InputEventOption,\n  normalizeValue,\n  rawValue,\n  stepValue,\n} from '@tremolo-ui/functions'\n\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\n\nimport { safeClamp, useNumberInputContext } from './context'\nimport { parseValue } from './type'\n\nimport { NumberInputMethods } from '.'\n\ninterface InternalProps {\n  disabled: boolean\n  readonly: boolean\n  wheel: InputEventOption | null\n  keyboard: InputEventOption | null\n\n  selectWithFocus?: 'all' | 'number' | 'none'\n  blurOnEnter?: boolean\n  keepWithinRange?: boolean\n  clampValueOnBlur?: boolean\n\n  onChange?: (value: number, text: string) => void\n  onFocus?: (\n    value: number,\n    text: string,\n    event: React.FocusEvent<HTMLInputElement, Element>,\n  ) => void\n  onBlur?: (\n    value: number,\n    text: string,\n    event: React.FocusEvent<HTMLInputElement, Element>,\n  ) => void\n}\n\ntype InternalPropsWithAttributes = InternalProps &\n  Omit<ComponentPropsWithoutRef<'input'>, keyof InternalProps>\n\nexport const InternalInput = forwardRef<\n  NumberInputMethods,\n  InternalPropsWithAttributes\n>(\n  (\n    {\n      disabled,\n      readonly,\n      selectWithFocus,\n      blurOnEnter,\n      clampValueOnBlur,\n      wheel,\n      keyboard,\n      className,\n      onChange,\n      onFocus,\n      onBlur,\n      onKeyDown,\n      children: _children,\n      ...props\n    }: InternalPropsWithAttributes,\n    ref,\n  ) => {\n    const elmRef = useRef<HTMLInputElement>(null)\n    const [editing, setEditing] = useState(false)\n    const value = useNumberInputContext((s) => s.value)\n    const valueAsNumber = useNumberInputContext((s) => s.valueAsNumber)\n    const min = useNumberInputContext((s) => s.min)\n    const max = useNumberInputContext((s) => s.max)\n    const step = useNumberInputContext((s) => s.step)\n    const units = useNumberInputContext((s) => s.units)\n    const digit = useNumberInputContext((s) => s.digit)\n    const change = useNumberInputContext((s) => s.change)\n\n    const error = useMemo(() => {\n      if (editing) return false\n      const v = valueAsNumber\n      return (min ?? -Infinity) > v || v > (max ?? Infinity)\n    }, [editing, max, min, valueAsNumber])\n\n    const updateValueByEvent = useCallback(\n      (eventType: InputEventOption[0], x: number) => {\n        let newValue\n        if (eventType == 'normalized') {\n          if (!min || !max) {\n            throw new Error(\n              '[NumberInput] \"min\" and \"max\" are required when InputEventOption[0] is set to \"normalized\".',\n            )\n          }\n          const n = normalizeValue(valueAsNumber, min, max)\n          newValue = rawValue(n + x, min, max)\n          return clamp(stepValue(newValue, step), min, max)\n        } else {\n          newValue = valueAsNumber + x\n          return stepValue(newValue, step)\n        }\n      },\n      [max, min, step, valueAsNumber],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!keyboard || !onChange || readonly) return\n        const key = event.key\n        if (!['ArrowUp', 'ArrowDown'].includes(key)) return\n        event.preventDefault()\n        const x = key == 'ArrowUp' ? keyboard[1] : -keyboard[1]\n        const parsed = parseValue(String(updateValueByEvent(keyboard[0], x)))\n        // console.log('key control')\n        onChange?.(parsed.rawValue, parsed.formatValue)\n      },\n      [keyboard, readonly, onChange, updateValueByEvent],\n    )\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!wheel || readonly) return\n        event.preventDefault()\n        if (!onChange || event.deltaY == 0) return\n        const x = Math.sign(event.deltaY) * -wheel[1]\n        const parsed = parseValue(String(updateValueByEvent(wheel[0], x)))\n        // console.log('wheel control')\n        onChange?.(parsed.rawValue, parsed.formatValue)\n      },\n      { passive: false },\n      [wheel, readonly, onChange, updateValueByEvent],\n    )\n\n    useImperativeHandle(ref, () => {\n      return {\n        focus() {\n          elmRef.current?.focus()\n        },\n        blur() {\n          elmRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <input\n        ref={(input) => {\n          elmRef.current = input\n          wheelRefCallback(input)\n        }}\n        className={clsx('tremolo-number-input', className)}\n        value={value}\n        min={min}\n        max={max}\n        step={step}\n        type=\"text\"\n        aria-disabled={disabled}\n        aria-readonly={readonly}\n        tabIndex={-1}\n        data-error={error}\n        onChange={(event) => {\n          if (readonly) return\n          const v = event.currentTarget.value\n          const cursorPos = event.target.selectionStart\n          change(v)\n          const valueAsNumber = parseValue(v, units, digit).rawValue\n          onChange?.(valueAsNumber, v)\n          if (cursorPos) {\n            event.target.selectionStart = cursorPos\n            event.target.selectionEnd = cursorPos\n          }\n        }}\n        onFocus={(event) => {\n          setEditing(true)\n          const v = event.currentTarget.value\n          const parsed = parseValue(v, units, digit)\n          if (selectWithFocus == 'all') {\n            event.currentTarget.setSelectionRange(0, v.length)\n          } else if (selectWithFocus == 'number') {\n            event.currentTarget.setSelectionRange(\n              0,\n              parsed.formatValue.length - parsed.unit.length,\n            )\n          }\n          onFocus?.(parsed.rawValue, parsed.formatValue, event)\n        }}\n        onBlur={(event) => {\n          setEditing(false)\n          // update value\n          let v = parseValue(event.currentTarget.value, units, digit).rawValue\n          if (clampValueOnBlur) {\n            v = safeClamp(v, min, max)\n          }\n          const parsed = parseValue(String(v), units, digit)\n          change(parsed.formatValue)\n          if (clampValueOnBlur) {\n            onChange?.(parsed.rawValue, parsed.formatValue)\n          }\n          onBlur?.(parsed.rawValue, parsed.formatValue, event)\n        }}\n        onKeyDown={(event) => {\n          if (blurOnEnter && event.key == 'Enter') {\n            event.currentTarget.blur()\n          }\n          handleKeyDown(event)\n          onKeyDown?.(event)\n        }}\n        {...props}\n      />\n    )\n  },\n)\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nexport interface StepperProps {\n  /** Display only when hovering. */\n  dynamic?: boolean\n  children?: ReactNode\n}\n\nexport function Stepper({\n  dynamic = true,\n  children,\n  className,\n  ...props\n}: StepperProps & Omit<ComponentPropsWithoutRef<'div'>, keyof StepperProps>) {\n  return (\n    <div\n      className={clsx('tremolo-number-input-stepper', className)}\n      data-dynamic={dynamic}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, forwardRef, ReactNode } from 'react'\n\nimport { InputEventOption } from '@tremolo-ui/functions'\n\nimport { NumberInputProvider } from './context'\nimport { DecrementStepper } from './DecrementStepper'\nimport { IncrementStepper } from './IncrementStepper'\nimport { InternalInput } from './InternalInput'\nimport { Stepper } from './Stepper'\nimport { Units } from './type'\n\n/*\nTODO\n- numberMode: focusが当たった時だけ、parse + type=\"number\"にする\n- skew\n*/\n\nexport interface NumberInputProps {\n  value: number | string\n\n  /**\n   * Number.MIN_SAFE_INTEGER\n   */\n  min?: number\n  /**\n   * Number.MAX_SAFE_INTEGER\n   */\n  max?: number\n  step?: number\n\n  /**\n   * @example\n   * units='Hz'\n   * units={[['Hz', 1], ['kHz', 1000]]}\n   * units={[['ms', 1], ['s', 1000]]}\n   */\n  units?: string | Units\n\n  /**\n   * Digits for rounding numbers.\n   * @example\n   * with:\n   * units={[['Hz', 1], ['kHz', 1000]]}\n   * digit={3}\n   * results:\n   * value=100 -> 100Hz, value=1600 -> 1.60Hz\n   */\n  digit?: number\n\n  readonly?: boolean\n\n  variant?: 'outline' | 'filled' | 'flushed' | 'unstyled'\n\n  selectWithFocus?: 'all' | 'number' | 'none'\n  blurOnEnter?: boolean\n  keepWithinRange?: boolean\n  clampValueOnBlur?: boolean\n\n  /**\n   * wheel control option\n   * If null, no event will be triggered\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   * If null, no event will be triggered\n   */\n  keyboard?: InputEventOption | null\n\n  activeColor?: string\n\n  wrapperClassName?: string\n\n  onChange?: (value: number, text: string) => void\n  onFocus?: (\n    value: number,\n    text: string,\n    event: React.FocusEvent<HTMLInputElement, Element>,\n  ) => void\n  onBlur?: (\n    value: number,\n    text: string,\n    event: React.FocusEvent<HTMLInputElement, Element>,\n  ) => void\n\n  children?: ReactNode\n}\n\nexport interface NumberInputMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = NumberInputProps &\n  Omit<ComponentPropsWithoutRef<'input'>, keyof NumberInputProps | 'type'>\n\nconst Root = forwardRef<NumberInputMethods, Props>(\n  (\n    {\n      value,\n      min,\n      max,\n      step = 1,\n      units,\n      readonly = false,\n      disabled = false,\n      digit,\n      variant = 'outline',\n      selectWithFocus = 'none',\n      blurOnEnter = true,\n      keepWithinRange = true,\n      clampValueOnBlur = true,\n      wheel = ['raw', 1],\n      keyboard = ['raw', 1],\n      activeColor,\n      wrapperClassName,\n      className,\n      onChange,\n      onFocus,\n      onBlur,\n      children,\n      ...props\n    }: Props,\n    forwardedRef,\n  ) => {\n    const colors: Record<string, string | undefined> = {\n      '--active-color': activeColor,\n    }\n    return (\n      <NumberInputProvider\n        value={String(value)}\n        min={min}\n        max={max}\n        step={step}\n        units={units}\n        digit={digit}\n        readonly={readonly}\n        keepWithinRange={keepWithinRange}\n        onChange={onChange}\n      >\n        <div\n          className={clsx('tremolo-number-input-wrapper', wrapperClassName)}\n          // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n          tabIndex={0}\n          style={{\n            ...colors,\n          }}\n          data-stepper={!!children}\n          data-variant={variant}\n        >\n          <InternalInput\n            ref={forwardedRef}\n            readonly={readonly}\n            disabled={disabled}\n            selectWithFocus={selectWithFocus}\n            blurOnEnter={blurOnEnter}\n            clampValueOnBlur={clampValueOnBlur}\n            wheel={wheel}\n            keyboard={keyboard}\n            className={className}\n            onChange={onChange}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            {...props}\n          />\n          {children}\n        </div>\n      </NumberInputProvider>\n    )\n  },\n)\n\n/**\n * Input with some useful functions for entering numerical values.\n */\nexport const NumberInput = {\n  Root,\n  Stepper,\n  IncrementStepper,\n  DecrementStepper,\n}\n\nexport { type StepperProps } from './Stepper'\nexport { type IncrementStepperProps } from './IncrementStepper'\nexport { type DecrementStepperProps } from './DecrementStepper'\nexport { type Units } from './type'\n","import { useRef, useCallback, RefObject } from 'react'\n\nimport { normalizeValue } from '@tremolo-ui/functions'\n\nimport { useEventListener } from './useEventListener'\nimport { useRefCallbackEvent } from './useRefCallbackEvent'\n\ninterface UsePianoDrag<T extends Element> {\n  baseElementRef: RefObject<T | null>\n  onDrag: (normalizedX: number, normalizedY: number) => void\n  onDragStart?: (normalizedX: number, normalizedY: number) => void\n  onDragEnd?: (normalizedX: number, normalizedY: number) => void\n}\n\n/**\n * Internal\n * @returns [refCallback, pointerDownHandler]\n * @private\n */\nexport function usePianoDrag<T extends Element>({\n  baseElementRef,\n  onDrag,\n  onDragStart,\n  onDragEnd,\n}: UsePianoDrag<T>) {\n  const dragged = useRef(false)\n  const normalizedX = useRef(0)\n  const normalizedY = useRef(0)\n\n  const handleDrag = useCallback(\n    (event: MouseEvent | React.PointerEvent<T> | TouchEvent) => {\n      if (!baseElementRef.current || !dragged.current) {\n        return\n      }\n      const isTouch = event instanceof TouchEvent\n      if (isTouch && event.cancelable) event.preventDefault()\n      const { left, top, right, bottom } =\n        baseElementRef.current.getBoundingClientRect()\n      const mouseX = isTouch ? event.touches[0].clientX : event.clientX\n      const mouseY = isTouch ? event.touches[0].clientY : event.clientY\n      const nx = normalizeValue(mouseX, left, right)\n      const ny = normalizeValue(mouseY, top, bottom)\n      normalizedX.current = nx\n      normalizedY.current = ny\n      onDrag(nx, ny)\n    },\n    [onDrag, baseElementRef],\n  )\n\n  const refHandler = useRefCallbackEvent(\n    'touchmove',\n    handleDrag,\n    { passive: false },\n    [onDrag],\n  )\n\n  const pointerDownHandler = useCallback(\n    (event: React.PointerEvent<T>) => {\n      dragged.current = true\n      handleDrag(event)\n      onDragStart?.(normalizedX.current, normalizedY.current)\n    },\n    [handleDrag, onDragStart],\n  )\n\n  useEventListener(globalThis.window, 'pointermove', handleDrag)\n\n  useEventListener(globalThis.window, 'pointerup', () => {\n    if (!dragged.current) return\n    dragged.current = false\n    onDragEnd?.(normalizedX.current, normalizedY.current)\n  })\n\n  return { refHandler, pointerDownHandler }\n}\n","import { createContext, ReactNode, useContext, useEffect, useRef } from 'react'\nimport { createStore, useStore } from 'zustand'\n\nexport type NoteRange = {\n  first: number\n  last: number\n}\n\ntype State = {\n  noteRange: NoteRange\n  glissando: boolean\n  midiMax: number\n  fill: boolean\n  onPlayNote: (noteNumber: number, velocity?: number) => void\n  onStopNote: (noteNumber: number) => void\n  label: (note: number, index: number) => ReactNode\n}\n\ntype Action = {\n  notePosition: (note: number) => number\n}\n\ntype PianoStore = ReturnType<typeof createPianoStore>\n\nconst createPianoStore = (initProps: Partial<State> & Action) => {\n  // const noteRange = initProps.noteRange || { first: 0, last: 127 }\n  const DEFAULT_PROPS: State = {\n    noteRange: { first: 0, last: 127 },\n    glissando: true,\n    midiMax: 127,\n    fill: false,\n    label: () => undefined,\n    onPlayNote: () => {},\n    onStopNote: () => {},\n  }\n\n  return createStore<State & Action>()(() => ({\n    ...DEFAULT_PROPS,\n    ...initProps,\n    notePosition: initProps.notePosition,\n  }))\n}\n\nconst PianoContext = createContext<PianoStore | null>(null)\n\ntype PianoProviderProps = React.PropsWithChildren<Partial<State> & Action>\n\nexport function PianoProvider({ children, ...props }: PianoProviderProps) {\n  const storeRef = useRef<PianoStore>(null)\n  if (!storeRef.current) {\n    storeRef.current = createPianoStore(props)\n  }\n\n  useEffect(() => {\n    if (storeRef.current) {\n      storeRef.current.setState(props)\n    } else {\n      storeRef.current = createPianoStore(props)\n    }\n  }, [props])\n\n  return (\n    <PianoContext.Provider value={storeRef.current}>\n      {children}\n    </PianoContext.Provider>\n  )\n}\n\nexport function usePianoContext<T>(selector: (state: State & Action) => T): T {\n  const store = useContext(PianoContext)\n  if (!store) throw new Error('Missing PianoContext.Provider in the tree')\n  return useStore(store, selector)\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, CSSProperties, ReactNode } from 'react'\n\nimport { usePianoContext } from './context'\n\nimport { getNoteRangeArray } from '.'\n\nexport interface KeyLabelProps {\n  /**\n   * override Piano.label\n   */\n  label?: (note: number, index: number) => ReactNode\n\n  wrapperClassName?: string\n  wrapperStyle?: CSSProperties\n\n  /** @internal */\n  __note?: number\n  /** @internal */\n  __label?: (note: number, index: number) => ReactNode\n}\n\nexport function KeyLabel({\n  label,\n  className,\n  wrapperClassName,\n  wrapperStyle,\n  __note,\n  __label,\n  ...props\n}: KeyLabelProps & Omit<ComponentPropsWithoutRef<'div'>, keyof KeyLabelProps>) {\n  const noteRange = usePianoContext((s) => s.noteRange)\n  const noteRangeArray = getNoteRangeArray(noteRange)\n  const index = noteRangeArray.indexOf(__note!)\n  const content = label\n    ? label(__note!, index)\n    : __label && __label(__note!, index)\n\n  return (\n    (content != undefined || content != null) && (\n      <div\n        className={clsx('tremolo-piano-key-label-wrapper', wrapperClassName)}\n        style={wrapperStyle}\n      >\n        <div className={clsx('tremolo-piano-key-label', className)} {...props}>\n          {content}\n        </div>\n      </div>\n    )\n  )\n}\n","import clsx from 'clsx'\nimport React, {\n  CSSProperties,\n  ComponentPropsWithoutRef,\n  forwardRef,\n  useImperativeHandle,\n  useState,\n  ReactElement,\n} from 'react'\n\nimport { usePianoContext } from './context'\nimport { KeyLabel, KeyLabelProps } from './KeyLabel'\n\nexport interface KeyProps {\n  noteNumber: number\n\n  width?: number\n  height?: number | `${number}%`\n\n  bg?: string\n  color?: string\n  activeBg?: string\n  activeColor?: string\n\n  style?: CSSProperties\n\n  /**\n   * \\<KeyLabel />\n   */\n  children?: ReactElement\n\n  /** @internal */\n  __width?: number\n}\n\nexport interface KeyMethods {\n  play: (velocity?: number) => void\n  stop: () => void\n  played: () => boolean\n}\n\ntype Props = KeyProps & Omit<ComponentPropsWithoutRef<'div'>, keyof KeyProps>\ntype ImplProps = Props & { keyType: 'black' | 'white' }\n\nexport const defaultWhiteKeyWidth = 40\nexport const defaultBlackKeyWidth = 26\n\nconst KeyImpl = forwardRef<KeyMethods, ImplProps>(\n  (\n    {\n      keyType,\n      noteNumber,\n      width,\n      height,\n      bg,\n      color,\n      activeBg,\n      activeColor,\n      className,\n      style,\n      children,\n      __width,\n      ...props\n    }: ImplProps,\n    ref,\n  ) => {\n    const [played, setPlayed] = useState(false)\n    const midiMax = usePianoContext((s) => s.midiMax)\n    const fill = usePianoContext((s) => s.fill)\n    // const glissando = usePianoContext(s => s.glissando)\n    const onPlayNote = usePianoContext((s) => s.onPlayNote)\n    const onStopNote = usePianoContext((s) => s.onStopNote)\n    const label = usePianoContext((s) => s.label)\n    const notePosition = usePianoContext((s) => s.notePosition)\n    const position = notePosition(noteNumber)\n\n    const disabled = noteNumber > midiMax\n    const colors = {\n      '--bg': bg,\n      '--color': color,\n      '--active-bg': activeBg,\n      '--active-color': activeColor,\n    }\n\n    useImperativeHandle(ref, () => {\n      return {\n        play(velocity) {\n          if (disabled) return\n          setPlayed(true)\n          if (onPlayNote) onPlayNote(noteNumber, velocity)\n        },\n        stop() {\n          setPlayed(false)\n          if (onStopNote) onStopNote(noteNumber)\n        },\n        played() {\n          return played\n        },\n      }\n    }, [disabled, noteNumber, onPlayNote, onStopNote, played])\n\n    let keyLabelProps: KeyLabelProps = {}\n    if (children != undefined) {\n      React.Children.forEach(children, (child) => {\n        if (React.isValidElement(child)) {\n          if (child.type == KeyLabel) {\n            keyLabelProps = child.props as KeyLabelProps\n          } else {\n            throw new Error('only <KeyLabel>')\n          }\n        } else {\n          throw new Error('children is an invalid element.')\n        }\n      })\n    }\n\n    return (\n      <div\n        className={clsx(`tremolo-piano-${keyType}-key`, className)}\n        aria-disabled={disabled}\n        data-active={played}\n        style={{\n          ...colors,\n          left: position,\n          width: fill ? __width : width,\n          height: height,\n          ...style,\n        }}\n        // onPointerDown={() => {\n        //   if (disabled) return\n        //   setPlayed(true)\n        //   if (onPlayNote) onPlayNote(noteNumber)\n        // }}\n        // onPointerEnter={() => {\n        //   if (disabled) return\n        //   if (glissando) {\n        //     setPlayed(true)\n        //     if (onPlayNote) onPlayNote(noteNumber)\n        //   }\n        // }}\n        // onPointerUp={() => {\n        //   if (disabled) return\n        //   setPlayed(false)\n        //   if (onStopNote) onStopNote(noteNumber)\n        // }}\n        // onPointerLeave={() => {\n        //   if (disabled) return\n        //   if (glissando) {\n        //     setPlayed(false)\n        //     if (onStopNote) onStopNote(noteNumber)\n        //   }\n        // }}\n        {...props}\n      >\n        <KeyLabel label={label} __note={noteNumber} {...keyLabelProps} />\n      </div>\n    )\n  },\n)\n\nexport const WhiteKey = forwardRef<KeyMethods, Props>(\n  (\n    {\n      width = defaultWhiteKeyWidth,\n      height = '100%',\n      onContextMenu = (e) => e.preventDefault(),\n      ...props\n    }: Props,\n    ref,\n  ) => {\n    return (\n      <KeyImpl\n        ref={ref}\n        keyType=\"white\"\n        width={width}\n        height={height}\n        onContextMenu={onContextMenu}\n        {...props}\n      />\n    )\n  },\n)\n\nexport const BlackKey = forwardRef<KeyMethods, Props>(\n  (\n    {\n      width = defaultBlackKeyWidth,\n      height = '60%',\n      onContextMenu = (e) => e.preventDefault(),\n      ...props\n    }: Props,\n    ref,\n  ) => {\n    return (\n      <KeyImpl\n        ref={ref}\n        keyType=\"black\"\n        width={width}\n        height={height}\n        onContextMenu={onContextMenu}\n        {...props}\n      />\n    )\n  },\n)\n","export type KeyboardShortcuts = {\n  keys: string[]\n  // TODO\n  flags?: {\n    naturalOnly?: boolean\n  }\n}\n\nexport const SHORTCUTS = {\n  HOME_ROW: {\n    keys: [\n      'a',\n      'w',\n      's',\n      'e',\n      'd',\n      'f',\n      't',\n      'g',\n      'y',\n      'h',\n      'u',\n      'j',\n      'k',\n      'o',\n      'l',\n      'p',\n      ';',\n    ],\n  },\n}\n","import clsx from 'clsx'\nimport React, {\n  ComponentPropsWithoutRef,\n  createRef,\n  CSSProperties,\n  forwardRef,\n  ReactElement,\n  ReactNode,\n  RefObject,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\n\nimport {\n  isBlackKey,\n  isWhiteKey,\n  noteKey,\n  NoteKey,\n  noteKeys,\n} from '@tremolo-ui/functions'\n\nimport { useEventListener } from '../../hooks/useEventListener'\nimport { usePianoDrag } from '../../hooks/usePianoDrag'\n\nimport { NoteRange, PianoProvider } from './context'\nimport {\n  BlackKey,\n  defaultBlackKeyWidth,\n  defaultWhiteKeyWidth,\n  KeyMethods,\n  WhiteKey,\n} from './key'\nimport { KeyboardShortcuts } from './keyboardShortcuts'\nimport { KeyLabel } from './KeyLabel'\n\n/**\n * [noteRange.first, noteRange.first + 1 ..., noteRange.last]\n */\nexport function getNoteRangeArray(noteRange: NoteRange) {\n  return Array.from(\n    { length: noteRange.last - noteRange.first + 1 },\n    (_, i) => i + noteRange.first,\n  )\n}\n\nexport interface PianoProps {\n  noteRange: NoteRange\n\n  glissando?: boolean\n  midiMax?: number\n  keyboardShortcuts?: KeyboardShortcuts\n  fill?: boolean\n  whiteNoteWidth?: number\n  blackNoteWidth?: number\n  height?: number | string\n  style?: CSSProperties\n\n  onPlayNote?: (note: number, velocity?: number) => void\n  onStopNote?: (note: number) => void\n\n  label?: (note: number, index: number) => ReactNode\n\n  /**\n   * \\<WhiteKey /> | \\<BlackKey />\n   */\n  children?: ReactElement | ReactElement[]\n}\n\nconst blackPerWhiteWidth = defaultBlackKeyWidth / defaultWhiteKeyWidth // 0.65\n\nexport interface PianoMethods {\n  playNote: (note: number, velocity?: number) => void\n  stopNote: (note: number) => void\n}\n\ntype Props = PianoProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof PianoProps>\n\nconst Root = forwardRef<PianoMethods, Props>(\n  (\n    {\n      noteRange,\n      glissando = true,\n      midiMax = 127,\n      keyboardShortcuts,\n      fill = false,\n      height = fill ? '100%' : 160,\n      whiteNoteWidth: _whiteNoteWidth = defaultWhiteKeyWidth,\n      style,\n      className,\n      onPlayNote,\n      onStopNote,\n      label,\n      children,\n      onPointerDown,\n      ...props\n    },\n    forwardedRef,\n  ) => {\n    // -- state and ref ---\n    const [whiteNoteWidth, setWhiteNoteWidth] = useState(_whiteNoteWidth)\n    const keyRefs = useRef<RefObject<KeyMethods | null>[]>([])\n    for (let i = 0; i < noteRange.last - noteRange.first + 1; i++) {\n      keyRefs.current[i] = createRef<KeyMethods>()\n    }\n    const pianoRef = useRef<HTMLDivElement>(null)\n    const hitKeyIndex = useRef(-1)\n\n    // --- interpret props ---\n    const noteRangeArray = getNoteRangeArray(noteRange)\n    const whiteNotes = noteRangeArray.filter((v) => isWhiteKey(v))\n    const blackNotes = noteRangeArray.filter((v) => isBlackKey(v))\n    const whiteNoteCount = whiteNotes.length\n    const padding = 1\n    const staticWidth = (whiteNoteWidth + padding) * whiteNoteCount\n    // const blackNoteShiftPercent = 0.3\n\n    const childrenWithProps = useMemo(() => {\n      return (\n        children &&\n        React.Children.map(children, (child, index) => {\n          if (React.isValidElement(child)) {\n            const __width =\n              child.type == WhiteKey ? whiteNoteWidth : whiteNoteWidth * 0.65\n            const props = { ref: keyRefs.current[index], __width }\n            return React.cloneElement(child, props)\n          }\n          return child\n        })\n      )\n    }, [children, whiteNoteWidth])\n\n    // --- internal functions ---\n    const notePosition = useCallback(\n      (note: number) => {\n        const pitchPositions: Record<NoteKey, number> = {\n          C: 0,\n          'C#': 1,\n          D: 1,\n          'D#': 2,\n          E: 2,\n          F: 3,\n          'F#': 4,\n          G: 4,\n          'G#': 5,\n          A: 5,\n          'A#': 6,\n          B: 6,\n        }\n\n        const blackNoteWidth = whiteNoteWidth * blackPerWhiteWidth\n        const padding = 1\n        const targetNoteKey = noteKey(note)\n        const firstNoteKey = noteKey(noteRange.first)\n        const octave = Math.floor((note - noteRange.first) / 12)\n        const octaveOffset =\n          noteKeys.indexOf(firstNoteKey) > noteKeys.indexOf(targetNoteKey)\n            ? 1\n            : 0\n        const w = whiteNoteWidth + padding\n        const pos = pitchPositions[targetNoteKey] - pitchPositions[firstNoteKey]\n        const blackKeyOffset = isBlackKey(note) ? blackNoteWidth / 2 : 0\n        return pos * w + (octave + octaveOffset) * 7 * w - blackKeyOffset\n      },\n      [noteRange.first, whiteNoteWidth],\n    )\n\n    const getHitKeyIndex = useCallback(\n      (x: number, y: number) => {\n        if (!pianoRef.current) return -1\n        const containerHeight = pianoRef.current.clientHeight\n        const notes = [...blackNotes, ...whiteNotes]\n        for (let i = 0; i < notes.length; i++) {\n          const note = notes[i]\n          const pos = notePosition(note)\n          const w = isWhiteKey(note)\n            ? whiteNoteWidth\n            : whiteNoteWidth * blackPerWhiteWidth\n          const h = isWhiteKey(note) ? containerHeight : containerHeight * 0.6\n          if (pos <= x && x < pos + w && 0 <= y && y < h) {\n            return note\n          }\n        }\n        return -1\n      },\n      [blackNotes, notePosition, whiteNoteWidth, whiteNotes],\n    )\n\n    // TODO: 単一のポインターに対しては、useDragで対応可能だが、\n    // マルチタッチに対しては、TouchEventを使う必要がありそう\n    // 取り敢えず、シングルタッチだけ対応\n    const onDrag = useCallback(\n      (perX: number, perY: number) => {\n        if (!pianoRef.current) return\n        const x = perX * staticWidth\n        const y = perY * pianoRef.current.clientHeight\n        const note = getHitKeyIndex(x, y)\n        const index = noteRangeArray.indexOf(note)\n        if (index == -1) return\n        if (hitKeyIndex.current != index) {\n          keyRefs.current[hitKeyIndex.current]?.current?.stop()\n          keyRefs.current[index]?.current?.play()\n          hitKeyIndex.current = index\n        }\n      },\n      [getHitKeyIndex, noteRangeArray, staticWidth],\n    )\n\n    const onDragEnd = useCallback(() => {\n      if (keyRefs.current[hitKeyIndex.current]?.current?.played()) {\n        keyRefs.current[hitKeyIndex.current]?.current?.stop()\n      }\n      hitKeyIndex.current = -1\n    }, [keyRefs])\n\n    // --- hooks ---\n    useEffect(() => {\n      if (fill && pianoRef.current) {\n        const parent = pianoRef.current.parentElement\n        if (!parent) throw new Error(\"doesn't have a parent element.\")\n        const resizeObserver = new ResizeObserver(() => {\n          const w = pianoRef.current!.clientWidth\n          setWhiteNoteWidth(w / whiteNoteCount - padding)\n        })\n        resizeObserver.observe(parent)\n        return () => {\n          resizeObserver.unobserve(parent)\n        }\n      } else {\n        setWhiteNoteWidth(_whiteNoteWidth)\n      }\n    }, [fill, _whiteNoteWidth, whiteNoteCount])\n\n    // FIXME\n    const { refHandler: touchMoveRefCallback, pointerDownHandler } =\n      usePianoDrag<HTMLDivElement>({\n        baseElementRef: pianoRef,\n        onDrag: onDrag,\n        // onDragStart: onDrag,\n        onDragEnd: onDragEnd,\n      })\n\n    useEventListener(globalThis.window, 'keydown', (e) => {\n      if (e.repeat) return\n      if (!keyboardShortcuts) return\n      const index = keyboardShortcuts.keys.indexOf(e.key)\n      if (index != -1) {\n        if (!keyRefs.current[index]?.current?.played()) {\n          keyRefs.current[index]?.current?.play()\n        }\n      }\n    })\n\n    useEventListener(globalThis.window, 'keyup', (e) => {\n      if (e.repeat) return\n      if (!keyboardShortcuts) return\n      const index = keyboardShortcuts.keys.indexOf(e.key)\n      if (index != -1) {\n        keyRefs.current[index]?.current?.stop()\n      }\n    })\n\n    useImperativeHandle(forwardedRef, () => {\n      return {\n        playNote(note, velocity) {\n          const index = noteRangeArray.indexOf(note)\n          if (index != -1) {\n            if (!keyRefs.current[index]?.current?.played()) {\n              keyRefs.current[index]?.current?.play(velocity)\n            }\n          } else {\n            onPlayNote?.(note, velocity)\n          }\n        },\n        stopNote(note: number) {\n          const index = noteRangeArray.indexOf(note)\n          if (index != -1) {\n            keyRefs.current[index]?.current?.stop()\n          } else {\n            onStopNote?.(note)\n          }\n        },\n      }\n    }, [noteRangeArray, onPlayNote, onStopNote])\n\n    return (\n      <PianoProvider\n        notePosition={notePosition}\n        noteRange={noteRange}\n        glissando={glissando}\n        midiMax={midiMax}\n        fill={fill}\n        onPlayNote={onPlayNote}\n        onStopNote={onStopNote}\n        label={label}\n      >\n        <div\n          ref={(div) => {\n            pianoRef.current = div\n            touchMoveRefCallback(div)\n          }}\n          className={clsx('tremolo-piano', className)}\n          style={{\n            width: fill ? '100%' : staticWidth,\n            height: height,\n            ...style,\n          }}\n          onPointerDown={(event) => {\n            pointerDownHandler(event)\n            onPointerDown?.(event)\n          }}\n          {...props}\n        >\n          {childrenWithProps ||\n            noteRangeArray.map((note, index) =>\n              isWhiteKey(note) ? (\n                <WhiteKey\n                  ref={keyRefs.current[index]}\n                  key={note}\n                  noteNumber={note}\n                  __width={whiteNoteWidth}\n                />\n              ) : (\n                <BlackKey\n                  ref={keyRefs.current[index]}\n                  key={note}\n                  noteNumber={note}\n                  __width={whiteNoteWidth * blackPerWhiteWidth}\n                />\n              ),\n            )}\n        </div>\n      </PianoProvider>\n    )\n  },\n)\n\n/**\n * Customizable piano component.\n */\nexport const Piano = { Root, WhiteKey, BlackKey, KeyLabel }\n\nexport { type KeyboardShortcuts, SHORTCUTS } from './keyboardShortcuts'\nexport { type KeyProps, type KeyMethods } from './key'\nexport { type KeyLabelProps } from './KeyLabel'\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef } from 'react'\n\nexport function Background({\n  className,\n  children,\n  ...props\n}: ComponentPropsWithoutRef<'div'>) {\n  return (\n    <div\n      className={clsx('tremolo-points-editor-background', className)}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n","import {\n  createContext,\n  createRef,\n  RefObject,\n  useContext,\n  useEffect,\n  useRef,\n} from 'react'\nimport { createStore, useStore } from 'zustand'\n\nimport { Cursor } from '../_util'\n\ntype State = {\n  containerElementRef: RefObject<HTMLDivElement | null>\n  disabled: boolean\n  readonly: boolean\n  externalStyles: {\n    userSelectNone?: boolean\n    cursor?: Cursor\n  }\n}\n\ntype Action = {\n  setContainerElementRef: (\n    containerElementRef: RefObject<HTMLDivElement | null>,\n  ) => void\n}\n\ntype PointsEditorStore = ReturnType<typeof createPointsEditorStore>\n\nconst createPointsEditorStore = (initProps: Partial<State & Action>) => {\n  // const noteRange = initProps.noteRange || { first: 0, last: 127 }\n  const DEFAULT_PROPS: State = {\n    containerElementRef: createRef(),\n    disabled: false,\n    readonly: false,\n    externalStyles: {\n      userSelectNone: true,\n      cursor: 'grabbing',\n    },\n  }\n\n  return createStore<State & Action>()((set) => ({\n    ...DEFAULT_PROPS,\n    ...initProps,\n    setContainerElementRef: (containerElementRef) => {\n      set(() => ({\n        containerElementRef,\n      }))\n    },\n  }))\n}\n\nconst PointsEditorContext = createContext<PointsEditorStore | null>(null)\n\ntype PointsEditorProviderProps = React.PropsWithChildren<\n  Partial<State & Action>\n>\n\nexport function PointsEditorProvider({\n  children,\n  ...props\n}: PointsEditorProviderProps) {\n  const storeRef = useRef<PointsEditorStore>(null)\n  if (!storeRef.current) {\n    storeRef.current = createPointsEditorStore(props)\n  }\n\n  useEffect(() => {\n    if (storeRef.current) {\n      storeRef.current.setState(props)\n    } else {\n      storeRef.current = createPointsEditorStore(props)\n    }\n  }, [props])\n\n  return (\n    <PointsEditorContext.Provider value={storeRef.current}>\n      {children}\n    </PointsEditorContext.Provider>\n  )\n}\n\nexport function usePointsEditorContext<T>(\n  selector: (state: State & Action) => T,\n): T {\n  const store = useContext(PointsEditorContext)\n  if (!store)\n    throw new Error('Missing PointsEditorContext.Provider in the tree')\n  return useStore(store, selector)\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, useRef } from 'react'\n\nimport { usePointsEditorContext } from './context'\n\nexport function Container({\n  className,\n  children,\n  ...props\n}: ComponentPropsWithoutRef<'div'>) {\n  const containerElementRef = useRef<HTMLDivElement>(null)\n  const setContainerElementRef = usePointsEditorContext(\n    (s) => s.setContainerElementRef,\n  )\n  setContainerElementRef(containerElementRef)\n\n  return (\n    <div\n      ref={containerElementRef}\n      className={clsx('tremolo-points-editor-container', className)}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n","import { useRef, useCallback, RefObject, useState } from 'react'\n\nimport { normalizeValue } from '@tremolo-ui/functions'\n\nimport { useEventListener } from './useEventListener'\nimport { useRefCallbackEvent } from './useRefCallbackEvent'\n\ninterface UseDragWithElement<T extends Element> {\n  baseElementRef: RefObject<T | null>\n  onDrag: (normalizedX: number, normalizedY: number) => void\n  onDragStart?: (normalizedX: number, normalizedY: number) => void\n  onDragEnd?: (normalizedX: number, normalizedY: number) => void\n}\n\nexport function useDragWithElement<T extends Element>({\n  baseElementRef,\n  onDrag,\n  onDragStart,\n  onDragEnd,\n}: UseDragWithElement<T>) {\n  const [dragging, setDragging] = useState(false)\n  const normalizedX = useRef(0)\n  const normalizedY = useRef(0)\n\n  const handleDrag = useCallback(\n    (event: MouseEvent | React.PointerEvent<T> | TouchEvent) => {\n      if (!baseElementRef.current || !dragging) {\n        return\n      }\n      const isTouch = event instanceof TouchEvent\n      if (isTouch && event.cancelable) event.preventDefault()\n      const { left, top, right, bottom } =\n        baseElementRef.current.getBoundingClientRect()\n      const mouseX = isTouch ? event.touches[0].clientX : event.clientX\n      const mouseY = isTouch ? event.touches[0].clientY : event.clientY\n      const nx = normalizeValue(mouseX, left, right)\n      const ny = normalizeValue(mouseY, top, bottom)\n      normalizedX.current = nx\n      normalizedY.current = ny\n      onDrag(nx, ny)\n    },\n    [onDrag, baseElementRef, dragging],\n  )\n\n  const refHandler = useRefCallbackEvent(\n    'touchmove',\n    handleDrag,\n    { passive: false },\n    [onDrag],\n  )\n\n  const pointerDownHandler = useCallback(\n    (event: React.PointerEvent<T>) => {\n      // dragging.current = true\n      setDragging(true)\n      handleDrag(event)\n      onDragStart?.(normalizedX.current, normalizedY.current)\n    },\n    [handleDrag, onDragStart],\n  )\n\n  useEventListener(globalThis.window, 'pointermove', handleDrag)\n\n  useEventListener(globalThis.window, 'pointerup', () => {\n    if (!dragging) return\n    // dragging.current = false\n    setDragging(false)\n    onDragEnd?.(normalizedX.current, normalizedY.current)\n  })\n\n  return { refHandler, pointerDownHandler, dragging }\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef } from 'react'\n\nimport { clamp } from '@tremolo-ui/functions'\n\nimport { useDragWithElement } from '../../hooks/useDragWithElement'\nimport {\n  addUserSelectNone,\n  removeUserSelectNone,\n  resetCursorStyle,\n  setCursorStyle,\n} from '../_util'\n\nimport { usePointsEditorContext } from './context'\n\nexport type PointBaseType = { x: number; y: number }\n\nexport function clampPoint(\n  point: PointBaseType,\n  min?: Partial<PointBaseType>,\n  max?: Partial<PointBaseType>,\n) {\n  const { x, y } = point\n  const newX = clamp(x, min?.x ?? 0, max?.x ?? 1)\n  const newY = clamp(y, min?.y ?? 0, max?.y ?? 1)\n  return { x: newX, y: newY }\n}\n\nexport interface PointProps<T extends PointBaseType> {\n  value: T\n  min?: Partial<PointBaseType>\n  max?: Partial<PointBaseType>\n\n  size?: number | string\n  width?: number | string\n  height?: number | string\n  color?: string\n\n  disabled?: boolean\n  readonly?: boolean\n\n  onChange?: (value: PointBaseType) => void\n  onDragStart?: (value: PointBaseType) => void\n  onDragEnd?: (value: PointBaseType) => void\n}\n\nexport function Point<T extends PointBaseType>({\n  value,\n  min,\n  max,\n  size,\n  width = 16,\n  height = 16,\n  color,\n\n  disabled,\n  readonly,\n\n  onChange,\n  onDragStart,\n  onDragEnd,\n\n  className,\n  style,\n  onPointerDown,\n  ...props\n}: PointProps<T> & Omit<ComponentPropsWithoutRef<'div'>, keyof PointProps<T>>) {\n  const containerElementRef = usePointsEditorContext(\n    (s) => s.containerElementRef,\n  )\n  const externalStyles = usePointsEditorContext((s) => s.externalStyles)\n  const __disabled = usePointsEditorContext((s) => s.disabled)\n  const __readonly = usePointsEditorContext((s) => s.readonly)\n\n  // console.log(value.x, value.y)\n\n  // Piano: 値が更新されることで、イベントハンドラがリセットされる\n\n  const {\n    refHandler: touchMoveRefCallback,\n    pointerDownHandler,\n    dragging,\n  } = useDragWithElement<HTMLDivElement>({\n    baseElementRef: containerElementRef,\n    onDrag: (x, y) => {\n      if (readonly) return\n\n      onChange?.(clampPoint({ x, y }, min, max))\n    },\n    onDragStart: (x, y) => {\n      if (readonly) return\n      if (externalStyles.userSelectNone) addUserSelectNone()\n      if (externalStyles.cursor) setCursorStyle(externalStyles.cursor)\n\n      onDragStart?.(clampPoint({ x, y }, min, max))\n    },\n    onDragEnd: (x, y) => {\n      if (readonly) return\n      if (externalStyles.userSelectNone) removeUserSelectNone()\n      if (externalStyles.cursor) resetCursorStyle()\n\n      onDragEnd?.(clampPoint({ x, y }, min, max))\n    },\n  })\n\n  const colors: Record<string, string | undefined> = {\n    '--color': color,\n  }\n\n  return (\n    <div\n      ref={(div) => {\n        // wheelRefCallback(div)\n        touchMoveRefCallback(div)\n      }}\n      className={clsx('tremolo-points-editor-point', className)}\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n      tabIndex={0}\n      aria-disabled={disabled != undefined ? disabled : __disabled}\n      aria-readonly={readonly != undefined ? readonly : __readonly}\n      data-dragging={dragging}\n      style={{\n        ...colors,\n        width: size ?? width,\n        height: size ?? height,\n        left: `${value.x * 100}%`,\n        top: `${value.y * 100}%`,\n        ...style,\n      }}\n      onPointerDown={(event) => {\n        pointerDownHandler(event)\n        onPointerDown?.(event)\n      }}\n      {...props}\n    />\n  )\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, forwardRef } from 'react'\n\nimport { InputEventOption } from '@tremolo-ui/functions'\n\nimport { Cursor } from '../_util'\n\nimport { Background } from './Background'\nimport { Container } from './Container'\nimport { PointsEditorProvider } from './context'\nimport { Point, PointBaseType } from './Point'\n\n/*\nTODO:\n\n- 複数選択\n- modifier\n*/\n\n/*\nimport { useState } from 'react'\n\nexport default function App() {\n  const [points, setPoints] = useState(initialPoints)\n\n  return (\n    <PointsEditor.Root\n      onDoubleClick={({ x, y }, _e) => {\n        const newPoints = [...points, { x, y }]\n        setPoints(newPoints)\n      }}\n    >\n      {points.map((point) => (\n        <PointsEditor.Point key={`${point.x}, ${point.y}`} value={point} />\n      ))}\n    </PointsEditor.Root>\n  )\n}\n*/\n\nconst defaultExternalStyles: PointsEditorProps['externalStyles'] = {\n  userSelectNone: true,\n  cursor: 'grabbing',\n}\n\nexport interface PointsEditorProps {\n  width?: number | string\n  height?: number | string\n\n  // TODO\n  grid?: number | PointBaseType\n  // modifier?:\n\n  disabled?: boolean\n  readonly?: boolean\n\n  externalStyles?: {\n    userSelectNone?: boolean\n    cursor?: Cursor\n  }\n\n  // TODO\n  /**\n   * wheel control option\n   * If null, no event will be triggered\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   * If null, no event will be triggered\n   */\n  keyboard?: InputEventOption | null\n}\n\ntype Props = PointsEditorProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof PointsEditorProps>\n\nconst Root = forwardRef<HTMLDivElement, Props>(\n  (\n    {\n      width = 200,\n      height = 100,\n      disabled = false,\n      readonly = false,\n      externalStyles: _externalStyles,\n      style,\n      className,\n      children,\n      ...props\n    },\n    forwardedRef,\n  ) => {\n    const externalStyles = { ...defaultExternalStyles, ..._externalStyles }\n\n    return (\n      <PointsEditorProvider\n        disabled={disabled}\n        readonly={readonly}\n        externalStyles={externalStyles}\n      >\n        <div\n          ref={forwardedRef}\n          className={clsx('tremolo-points-editor', className)}\n          style={{\n            width,\n            height,\n            ...style,\n          }}\n          {...props}\n        >\n          {children}\n        </div>\n      </PointsEditorProvider>\n    )\n  },\n)\n\n/**\n * Multiple Point Controller\n */\nexport const PointsEditor = {\n  Root,\n  Background,\n  Container,\n  Point,\n}\n\nexport { usePointsEditorContext } from './context'\nexport { clampPoint, type PointBaseType, type PointProps } from './Point'\n","import { createContext, useContext, useEffect, useRef } from 'react'\nimport { createStore, useStore } from 'zustand'\n\ntype State = {\n  min: number\n  max: number\n  step: number\n  skew: number\n  vertical: boolean\n  reverse: boolean\n  disabled: boolean\n  readonly: boolean\n}\n\ntype SliderStore = ReturnType<typeof createSliderStore>\n\nconst createSliderStore = (initProps?: Partial<State>) => {\n  const DEFAULT_PROPS: State = {\n    min: 0,\n    max: 0,\n    step: 0,\n    skew: 0,\n    vertical: false,\n    reverse: false,\n    disabled: false,\n    readonly: false,\n  }\n\n  return createStore<State>()(() => ({\n    ...DEFAULT_PROPS,\n    ...initProps,\n  }))\n}\n\nconst SliderContext = createContext<SliderStore | null>(null)\n\ntype SliderProviderProps = React.PropsWithChildren<Partial<State>>\n\nexport function SliderProvider({ children, ...props }: SliderProviderProps) {\n  const storeRef = useRef<SliderStore>(null)\n  if (!storeRef.current) {\n    storeRef.current = createSliderStore(props)\n  }\n\n  useEffect(() => {\n    if (storeRef.current) {\n      storeRef.current.setState(props)\n    } else {\n      storeRef.current = createSliderStore(props)\n    }\n  }, [props])\n\n  return (\n    <SliderContext.Provider value={storeRef.current}>\n      {children}\n    </SliderContext.Provider>\n  )\n}\n\nexport function useSliderContext<T>(selector: (state: State) => T): T {\n  const store = useContext(SliderContext)\n  if (!store) throw new Error('Missing SliderContext.Provider in the tree')\n  return useStore(store, selector)\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, CSSProperties, useCallback } from 'react'\n\nimport { toFixed, xor, normalizeValue } from '@tremolo-ui/functions'\n\nimport { useSliderContext } from './context'\nimport { ScaleType } from './type'\n\nexport interface ScaleOptionProps {\n  // required\n  value: number\n\n  // optional\n  type?: ScaleType\n  /** Display text instead of value. */\n  label?: string\n  /** mark thickness */\n  thickness?: number | string\n  /** mark length */\n  length?: number | string\n  /** Gap between mark and label. */\n  gap?: number | string\n  labelWidth?: number | string\n  classes?: {\n    mark?: string\n    label?: string\n  }\n  styles?: {\n    mark?: CSSProperties\n    label?: CSSProperties\n  }\n}\n\nexport function ScaleOption({\n  value,\n  type = 'mark-number',\n  label,\n  thickness = 1,\n  length = '0.5rem',\n  gap = 2,\n  labelWidth,\n  classes,\n  styles,\n  className,\n  style,\n  ...props\n}: ScaleOptionProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof ScaleOptionProps>) {\n  const min = useSliderContext((s) => s.min)\n  const max = useSliderContext((s) => s.max)\n  const skew = useSliderContext((s) => s.skew)\n  const vertical = useSliderContext((s) => s.vertical)\n  const reverse = useSliderContext((s) => s.reverse)\n\n  const calcPercent = useCallback(\n    (rawValue: number) => {\n      return toFixed(\n        xor(vertical, reverse)\n          ? 100 - normalizeValue(rawValue, min, max, skew) * 100\n          : normalizeValue(rawValue, min, max, skew) * 100,\n      )\n    },\n    [vertical, reverse, max, min, skew],\n  )\n\n  return (\n    <div\n      className={clsx('tremolo-slider-scale-option', className)}\n      style={{\n        left: !vertical ? `${calcPercent(value)}%` : undefined,\n        top: vertical ? `${calcPercent(value)}%` : undefined,\n        ...style,\n      }}\n      data-vertical={vertical}\n      {...props}\n    >\n      {type != 'number' && (\n        <div\n          className={clsx('tremolo-slider-scale-option-mark', classes?.mark)}\n          style={{\n            width: !vertical ? thickness : length,\n            height: vertical ? thickness : length,\n            marginBottom: !vertical ? gap : undefined,\n            marginRight: vertical ? gap : undefined,\n            ...styles?.mark,\n          }}\n          data-vertical={vertical}\n        ></div>\n      )}\n      {type != 'mark' && (\n        <div\n          className={clsx('tremolo-slider-scale-option-label', classes?.label)}\n          style={{\n            width: labelWidth,\n            ...styles?.label,\n          }}\n        >\n          {label || value}\n        </div>\n      )}\n    </div>\n  )\n}\n","import { decimalPart, toFixed } from '@tremolo-ui/functions'\n\nexport type ScaleType = 'mark' | 'mark-number' | 'number'\nexport type ScaleOptions = ['step', ScaleType] | [number, ScaleType]\n\nexport function generateOptionsList(\n  options: ScaleOptions,\n  min: number,\n  max: number,\n  step: number,\n) {\n  const optionsList: {\n    value: number\n    type: ScaleType\n  }[] = []\n  const per = options[0] == 'step' ? step : options[0]\n  const count = Math.floor(max / per) - Math.ceil(min / per) + 1\n  for (let i = 0; i < count; i++) {\n    const value = toFixed(\n      per * (Math.ceil(min / per) + i),\n      decimalPart(per)?.length,\n    )\n    optionsList.push({ value: value, type: options[1] })\n  }\n  return optionsList\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport { xor } from '@tremolo-ui/functions'\n\nimport { useSliderContext } from './context'\nimport { ScaleOption } from './ScaleOption'\nimport { generateOptionsList, ScaleOptions } from './type'\n\nexport interface ScaleProps {\n  gap?: number | string\n  options?: ScaleOptions\n  children?: ReactNode\n}\n\nexport function Scale({\n  gap = 6,\n  options,\n  children,\n  className,\n  style,\n  ...props\n}: ScaleProps & Omit<ComponentPropsWithoutRef<'div'>, keyof ScaleProps>) {\n  const min = useSliderContext((s) => s.min)\n  const max = useSliderContext((s) => s.max)\n  const step = useSliderContext((s) => s.step)\n  const vertical = useSliderContext((s) => s.vertical)\n  const reverse = useSliderContext((s) => s.reverse)\n\n  const optionsList = options\n    ? generateOptionsList(options, min, max, step)\n    : []\n  if (xor(vertical, reverse)) optionsList.reverse()\n\n  return (\n    <div\n      className={clsx('tremolo-slider-scale', className)}\n      style={{\n        marginLeft: vertical ? gap : undefined,\n        marginTop: !vertical ? gap : undefined,\n        ...style,\n      }}\n      {...props}\n    >\n      {options\n        ? optionsList.map(({ value, type }, index) => {\n            return <ScaleOption key={index} value={value} type={type} />\n          })\n        : children}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport {\n  CSSProperties,\n  forwardRef,\n  ReactNode,\n  useImperativeHandle,\n  useRef,\n} from 'react'\n\nimport { useSliderContext } from './context'\n\nexport interface SliderThumbProps {\n  size?: number | string\n  width?: number | string\n  height?: number | string\n\n  color?: string\n\n  className?: string\n  style?: CSSProperties\n  children?: ReactNode\n\n  /** @internal */\n  __percent?: number\n}\n\nexport interface SliderThumbMethods {\n  focus: () => void\n  blur: () => void\n}\n\nexport const defaultThumbSize = 22\n\nexport const Thumb = forwardRef<SliderThumbMethods, SliderThumbProps>(\n  (\n    {\n      size,\n      width = defaultThumbSize,\n      height = defaultThumbSize,\n      color,\n      children,\n      className,\n      style,\n      __percent,\n    }: SliderThumbProps,\n    ref,\n  ) => {\n    const wrapperRef = useRef<HTMLDivElement>(null)\n    const vertical = useSliderContext((s) => s.vertical)\n    const disabled = useSliderContext((s) => s.disabled)\n    const readonly = useSliderContext((s) => s.readonly)\n\n    useImperativeHandle(ref, () => {\n      return {\n        focus() {\n          wrapperRef.current?.focus()\n        },\n        blur() {\n          wrapperRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <div\n        className=\"tremolo-slider-thumb-wrapper\"\n        style={{\n          top: vertical ? `${__percent}%` : '50%',\n          left: !vertical ? `${__percent}%` : '50%',\n        }}\n      >\n        {children ? (\n          children\n        ) : (\n          // default slider thumb\n          <div\n            ref={wrapperRef}\n            className={clsx('tremolo-slider-thumb', className)}\n            // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n            tabIndex={0}\n            aria-disabled={disabled}\n            aria-readonly={readonly}\n            style={{\n              ...{ '--color': color },\n              width: size ?? width,\n              height: size ?? height,\n              ...style,\n            }}\n          ></div>\n        )}\n      </div>\n    )\n  },\n)\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, CSSProperties, ReactElement } from 'react'\n\nimport { styleHelper, xor } from '@tremolo-ui/functions'\n\nimport { useSliderContext } from './context'\n\nexport const defaultLength = 140\nexport const defaultThickness = 10\n\nexport interface SliderTrackProps {\n  length?: number | string\n  thickness?: number | string\n\n  active?: string\n  inactive?: string\n\n  defaultStyle?: boolean\n\n  className?: string\n  style?: CSSProperties\n  children?: ReactElement\n\n  /** @internal */\n  __thumb?: ReactElement\n  /** @internal */\n  __percent?: number\n}\n\nexport function Track({\n  length = defaultLength,\n  thickness = defaultThickness,\n  active,\n  inactive,\n  children,\n  className,\n  style,\n  defaultStyle = true,\n  __thumb,\n  __percent = 0,\n  ...props\n}: SliderTrackProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof SliderTrackProps>) {\n  const vertical = useSliderContext((s) => s.vertical)\n  const reverse = useSliderContext((s) => s.reverse)\n  const disabled = useSliderContext((s) => s.disabled)\n\n  const direction = vertical ? 'bottom' : 'right'\n  const colors = {\n    '--active': active,\n    '--inactive': inactive,\n  }\n\n  return (\n    <div\n      className={clsx('tremolo-slider-track', className)}\n      aria-disabled={disabled}\n      data-vertical={vertical}\n      style={\n        !defaultStyle\n          ? style\n          : {\n              ...colors,\n              background: xor(vertical, reverse)\n                ? `linear-gradient(to ${direction}, var(--inactive) ${__percent}%, var(--active) ${__percent}%)`\n                : `linear-gradient(to ${direction}, var(--active) ${__percent}%, var(--inactive) ${__percent}%)`,\n              borderRadius: styleHelper(thickness!, '/', 2),\n              width: !vertical ? length : thickness,\n              height: vertical ? length : thickness,\n              ...style,\n            }\n      }\n      {...props}\n    >\n      {children}\n      {__thumb}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport React, {\n  ComponentPropsWithoutRef,\n  CSSProperties,\n  forwardRef,\n  ReactElement,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from 'react'\n\nimport {\n  clamp,\n  normalizeValue,\n  rawValue,\n  stepValue,\n  toFixed,\n  InputEventOption,\n  styleHelper,\n  xor,\n} from '@tremolo-ui/functions'\n\nimport { useDragWithElement } from '../../hooks/useDragWithElement'\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\nimport {\n  addUserSelectNone,\n  Cursor,\n  removeUserSelectNone,\n  resetCursorStyle,\n  setCursorStyle,\n} from '../_util'\n\nimport { SliderProvider } from './context'\nimport { Scale } from './Scale'\nimport { ScaleOption } from './ScaleOption'\nimport { Thumb, SliderThumbMethods, SliderThumbProps } from './Thumb'\nimport { Track, SliderTrackProps } from './Track'\n\nconst defaultExternalStyles: SliderProps['externalStyles'] = {\n  userSelectNone: true,\n  cursor: 'pointer',\n}\n\nexport interface SliderProps {\n  // required\n  value: number\n  min: number\n  max: number\n\n  // optional\n  step?: number\n  skew?: number // TODO | SkewFunction\n  /**\n   * slider orientation\n   * aria-orientation property is also applied.\n   */\n  vertical?: boolean\n  reverse?: boolean\n\n  /** Global style to apply when dragged */\n  externalStyles?: {\n    userSelectNone?: boolean\n    cursor?: Cursor\n  }\n  /**\n   * wheel control option\n   * If null, no event will be triggered\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   * If null, no event will be triggered\n   */\n  keyboard?: InputEventOption | null\n\n  /**\n   * Only the appearance will change.\n   * Please consider using with readonly.\n   * aria-disabled property is also applied.\n   */\n  disabled?: boolean\n  /**\n   * Make the value unchangeable.\n   * aria-readonly property is also applied.\n   */\n  readonly?: boolean\n  className?: string\n  style?: CSSProperties\n  onChange?: (value: number) => void\n  onDragStart?: (value: number) => void\n  onDragEnd?: (value: number) => void\n  /** \\<SliderThumb /> | \\<SliderTrack /> */\n  children?: ReactElement | ReactElement[]\n  // ReactElement<typeof SliderThumb, typeof SliderTrack>[]\n}\n\nexport interface SliderMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = SliderProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof SliderProps>\n\nconst Root = forwardRef<SliderMethods, Props>(\n  (\n    {\n      value,\n      min,\n      max,\n      step = 1,\n      skew = 1,\n      vertical = false,\n      reverse = false,\n      externalStyles: _externalStyles,\n      wheel = ['raw', 1],\n      keyboard = ['raw', 1],\n      disabled = false,\n      readonly = false,\n      onChange,\n      onDragStart,\n      onDragEnd,\n      className,\n      style,\n      children,\n      onFocus,\n      onBlur,\n      onPointerDown,\n      onKeyDown,\n      ...props\n    }: Props,\n    forwardedRef,\n  ) => {\n    // -- state and ref ---\n    const trackElementRef = useRef<HTMLDivElement>(null)\n    const thumbRef = useRef<SliderThumbMethods>(null)\n\n    // --- interpret props ---\n    const externalStyles = { ...defaultExternalStyles, ..._externalStyles }\n\n    const p = toFixed(normalizeValue(value, min, max, skew) * 100)\n    const rev = toFixed(100 - p)\n    // NOTE\n    // normal -> normal (right)\n    // vertical -> rev (up)\n    // reverse -> rev (left)\n    // vertical & reverse -> normal (down)\n    const displayReversed = useMemo(\n      () => xor(vertical, reverse),\n      [vertical, reverse],\n    )\n    const percent = displayReversed ? rev : p\n\n    let trackProps: SliderTrackProps = {}\n    let thumbProps: SliderThumbProps = {}\n    let scaleComponent: ReactElement | undefined = undefined\n    if (children != undefined) {\n      React.Children.forEach(children, (child) => {\n        if (React.isValidElement(child)) {\n          if (child.type == Thumb) {\n            thumbProps = child.props as SliderThumbProps\n          } else if (child.type == Track) {\n            trackProps = child.props as SliderTrackProps\n          } else if (child.type == Scale) {\n            scaleComponent = child\n          } else {\n            throw new Error('only <SliderThumb> or <SliderTrack>')\n          }\n        } else {\n          throw new Error('children is an invalid element.')\n        }\n      })\n    }\n\n    // --- internal functions ---\n    const onDrag = useCallback(\n      (nx: number, ny: number) => {\n        if (!onChange || readonly) return\n        const n = vertical ? ny : nx\n        const v = rawValue(displayReversed ? 1 - n : n, min, max, skew)\n        const v2 = clamp(stepValue(v, step), min, max)\n        onChange(v2)\n      },\n      [displayReversed, max, min, onChange, readonly, skew, step, vertical],\n    )\n\n    const updateValueByEvent = useCallback(\n      (eventType: InputEventOption[0], x: number) => {\n        let newValue\n        if (eventType == 'normalized') {\n          const n = normalizeValue(value, min, max, skew)\n          newValue = rawValue(n + x, min, max, skew)\n        } else {\n          newValue = value + x\n        }\n        return clamp(stepValue(newValue, step), min, max)\n      },\n      [max, min, skew, step, value],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!keyboard || !onChange || readonly) return\n        const key = event.key\n        if (['ArrowRight', 'ArrowLeft', 'ArrowUp', 'ArrowDown'].includes(key)) {\n          event.preventDefault()\n          let x =\n            key == 'ArrowRight' || key == 'ArrowUp' ? keyboard[1] : -keyboard[1]\n          if (reverse) x *= -1\n          onChange(updateValueByEvent(keyboard[0], x))\n        }\n      },\n      [keyboard, onChange, readonly, reverse, updateValueByEvent],\n    )\n\n    // --- hooks ---\n    const { refHandler: touchMoveRefCallback, pointerDownHandler } =\n      useDragWithElement<HTMLDivElement>({\n        baseElementRef: trackElementRef,\n        onDrag: onDrag,\n        onDragStart: (nx, ny) => {\n          if (readonly) return\n          if (externalStyles.userSelectNone) addUserSelectNone()\n          if (externalStyles.cursor) setCursorStyle(externalStyles.cursor)\n\n          thumbRef.current?.focus()\n          onDragStart?.(\n            clamp(\n              stepValue(rawValue(vertical ? ny : nx, min, max, skew), step),\n              min,\n              max,\n            ),\n          )\n        },\n        onDragEnd: (nx, ny) => {\n          if (readonly) return\n\n          if (externalStyles.userSelectNone) removeUserSelectNone()\n          if (externalStyles.cursor) resetCursorStyle()\n\n          onDragEnd?.(\n            clamp(\n              stepValue(rawValue(vertical ? ny : nx, min, max, skew), step),\n              min,\n              max,\n            ),\n          )\n        },\n      })\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!wheel || !onChange || readonly) return\n        event.preventDefault()\n        let x\n        if (!vertical && event.deltaX != 0) {\n          x = event.deltaX > 0 ? wheel[1] : -wheel[1]\n        } else {\n          if (event.deltaY == 0) return\n          x = event.deltaY > 0 ? -wheel[1] : wheel[1]\n        }\n        if (vertical && reverse) x *= -1\n        onChange(updateValueByEvent(wheel[0], x))\n      },\n      {\n        passive: false,\n      },\n      [wheel, vertical, readonly, onChange, updateValueByEvent],\n    )\n\n    useImperativeHandle(forwardedRef, () => {\n      return {\n        focus() {\n          thumbRef.current?.focus()\n        },\n        blur() {\n          thumbRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <SliderProvider\n        min={min}\n        max={max}\n        step={step}\n        skew={skew}\n        vertical={vertical}\n        reverse={reverse}\n        disabled={disabled}\n        readonly={readonly}\n      >\n        <div\n          className={clsx('tremolo-slider', className)}\n          ref={(div) => {\n            wheelRefCallback(div)\n            touchMoveRefCallback(div)\n          }}\n          tabIndex={-1}\n          role=\"slider\"\n          aria-valuenow={value}\n          aria-valuemin={min}\n          aria-valuemax={max}\n          aria-orientation={vertical ? 'vertical' : 'horizontal'}\n          aria-disabled={disabled}\n          aria-readonly={readonly}\n          style={{\n            margin: `calc(${styleHelper(thumbProps?.size ?? 22)} / 2)`, // half thumb size\n            ...style,\n          }}\n          onPointerDown={(event) => {\n            pointerDownHandler(event)\n            onPointerDown?.(event)\n          }}\n          onKeyDown={(event) => {\n            handleKeyDown(event)\n            onKeyDown?.(event)\n          }}\n          onFocus={(event) => {\n            thumbRef.current?.focus()\n            onFocus?.(event)\n          }}\n          onBlur={(event) => {\n            thumbRef.current?.blur()\n            onBlur?.(event)\n          }}\n          {...props}\n        >\n          <div\n            style={{\n              display: 'flex',\n              flexDirection: vertical ? 'row' : 'column',\n              width: !vertical ? '100%' : undefined,\n              height: vertical ? '100%' : undefined,\n            }}\n          >\n            <div className=\"tremolo-slider-track-wrapper\" ref={trackElementRef}>\n              <Track\n                __percent={percent}\n                __thumb={\n                  <Thumb ref={thumbRef} __percent={percent} {...thumbProps} />\n                }\n                {...trackProps}\n              />\n            </div>\n            {scaleComponent}\n          </div>\n        </div>\n      </SliderProvider>\n    )\n  },\n)\n\n/**\n * Customizable slider\n */\nexport const Slider = {\n  Root,\n  Thumb,\n  Track,\n  Scale,\n  ScaleOption,\n}\n\nexport { useSliderContext } from './context'\nexport { type SliderThumbMethods, type SliderThumbProps } from './Thumb'\nexport { type SliderTrackProps } from './Track'\nexport { type ScaleProps } from './Scale'\nexport { type ScaleOptionProps } from './ScaleOption'\nexport { type ScaleOptions, type ScaleType } from './type'\n","// ref:\n// https://github.com/radix-ui/primitives/blob/2bab24a811e45c7a83198659272097f6cfa5a165/packages/react/compose-refs/src/compose-refs.tsx\n\nimport { useCallback } from 'react'\n\ntype PossibleRef<T> = React.Ref<T> | undefined\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n  if (typeof ref === 'function') {\n    return ref(value)\n  } else if (ref !== null && ref !== undefined) {\n    ref.current = value\n  }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n  return (node) => {\n    let hasCleanup = false\n    const cleanups = refs.map((ref) => {\n      const cleanup = setRef(ref, node)\n      if (!hasCleanup && typeof cleanup == 'function') {\n        hasCleanup = true\n      }\n      return cleanup\n    })\n\n    // React <19 will log an error to the console if a callback ref returns a\n    // value. We don't use ref cleanups internally so this will only happen if a\n    // user's ref callback returns a value, which we only expect if they are\n    // using the cleanup functionality added in React 19.\n    if (hasCleanup) {\n      return () => {\n        for (let i = 0; i < cleanups.length; i++) {\n          const cleanup = cleanups[i]\n          if (typeof cleanup == 'function') {\n            cleanup()\n          } else {\n            setRef(refs[i], null)\n          }\n        }\n      }\n    }\n  }\n}\n\n/**\n * A custom hook that composes multiple refs\n * Accepts callback refs and RefObject(s)\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useCallback(composeRefs(...refs), refs)\n}\n\nexport { composeRefs, useComposedRefs }\n","import { ComponentProps, ElementType, ReactNode } from 'react'\n\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\nimport { composeRefs } from '../_util/composeRefs'\nimport { Override } from '../_util/type'\n\nexport interface WheelObserverProps<T extends ElementType> {\n  /**\n   * React.ElementType\n   * @default div\n   */\n  as?: T\n\n  children?: ReactNode\n  onWheel?: (event: WheelEvent) => void\n}\n\n/**\n * @example\n * <WheelObserver\n *   onWheel={(event) => {\n *     event.preventDefault()\n *     console.log(event.deltaY)\n *   }\n * >\n *   <div>Wheel here</div>\n * </WheelObserver>\n */\nexport function WheelObserver<T extends ElementType = 'div'>(\n  props: Override<WheelObserverProps<T>, ComponentProps<T>>,\n) {\n  const { as: Component = 'div', children, onWheel, ref, ...attributes } = props\n\n  const wheelRefCallback = useRefCallbackEvent(\n    'wheel',\n    (event) => {\n      if (onWheel) onWheel(event)\n    },\n    { passive: false },\n    [onWheel],\n  )\n\n  return (\n    <Component ref={composeRefs(ref, wheelRefCallback)} {...attributes}>\n      {children}\n    </Component>\n  )\n}\n","import clsx from 'clsx'\nimport { ComponentPropsWithoutRef, CSSProperties, ReactElement } from 'react'\n\nexport interface XYPadAreaProps {\n  width?: number | string\n  height?: number | string\n  color?: string\n  className?: string\n  style?: CSSProperties\n  children?: ReactElement\n\n  /** inherit */\n  __thumb?: ReactElement\n}\n\nexport function Area({\n  width = 120,\n  height = 120,\n  color,\n  children,\n  className,\n  style,\n  __thumb,\n  ...props\n}: XYPadAreaProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof XYPadAreaProps>) {\n  return (\n    <div\n      className={clsx('tremolo-xy-pad-area', className)}\n      style={{\n        ...{ '--color': color },\n        width: width,\n        height: height,\n        ...style,\n      }}\n      {...props}\n    >\n      {children}\n      {__thumb}\n    </div>\n  )\n}\n","import clsx from 'clsx'\nimport {\n  ComponentPropsWithoutRef,\n  CSSProperties,\n  forwardRef,\n  ReactNode,\n  useImperativeHandle,\n  useRef,\n} from 'react'\n\nexport interface XYPadThumbProps {\n  size?: number | string\n  width?: number | string\n  height?: number | string\n\n  color?: string\n\n  wrapperClassName?: string\n  wrapperStyle?: CSSProperties\n\n  children?: ReactNode\n\n  /** @internal */\n  __disabled?: boolean\n  /** @internal */\n  __readonly?: boolean\n  /** @internal */\n  __css?: CSSProperties\n}\n\nexport interface XYPadThumbMethods {\n  focus: () => void\n  blur: () => void\n}\n\ntype Props = XYPadThumbProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof XYPadThumbProps>\n\nexport const Thumb = forwardRef<XYPadThumbMethods, Props>(\n  (\n    {\n      size,\n      width = 22,\n      height = 22,\n      color,\n      children,\n      wrapperClassName,\n      wrapperStyle,\n      className,\n      style,\n      __disabled,\n      __readonly,\n      __css,\n      ...props\n    }: Props,\n    ref,\n  ) => {\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    useImperativeHandle(ref, () => {\n      return {\n        focus() {\n          wrapperRef.current?.focus()\n        },\n        blur() {\n          wrapperRef.current?.blur()\n        },\n      }\n    }, [])\n\n    return (\n      <div\n        className={clsx('tremolo-xy-pad-thumb-wrapper', wrapperClassName)}\n        style={{\n          ...__css,\n          ...wrapperStyle,\n        }}\n        {...props}\n      >\n        {children ? (\n          children\n        ) : (\n          // default thumb\n          <div\n            ref={wrapperRef}\n            className={clsx('tremolo-xy-pad-thumb', className)}\n            // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n            tabIndex={0}\n            aria-disabled={__disabled}\n            aria-readonly={__readonly}\n            style={{\n              ...{ '--color': color },\n              width: size ?? width,\n              height: size ?? height,\n              ...style,\n            }}\n          ></div>\n        )}\n      </div>\n    )\n  },\n)\n","import clsx from 'clsx'\nimport React, {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  ReactElement,\n  Ref,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from 'react'\n\nimport {\n  clamp,\n  normalizeValue,\n  rawValue,\n  stepValue,\n  toFixed,\n  InputEventOption,\n  styleHelper,\n} from '@tremolo-ui/functions'\n\nimport { useDragWithElement } from '../../hooks/useDragWithElement'\nimport { useRefCallbackEvent } from '../../hooks/useRefCallbackEvent'\nimport {\n  addUserSelectNone,\n  Cursor,\n  removeUserSelectNone,\n  resetCursorStyle,\n  setCursorStyle,\n} from '../_util'\nimport { composeRefs } from '../_util/composeRefs'\n\nimport { Area, XYPadAreaProps } from './Area'\nimport { Thumb, XYPadThumbMethods, XYPadThumbProps } from './Thumb'\n\nconst defaultValueOptions = {\n  skew: 1,\n  step: 1,\n  reverse: false,\n  wheel: ['raw', 1] as InputEventOption,\n  keyboard: ['raw', 1] as InputEventOption,\n}\n\nconst defaultExternalStyles: XYPadProps['externalStyles'] = {\n  userSelectNone: true,\n  cursor: 'pointer',\n}\n\n/**\n * Two-dimensional slider component.\n */\nexport interface ValueOptions {\n  // required\n  value: number\n  min: number\n  max: number\n\n  // optional\n  step?: number\n  skew?: number\n  reverse?: boolean\n  /**\n   * wheel control option\n   */\n  wheel?: InputEventOption | null\n  /**\n   * keyboard control option\n   */\n  keyboard?: InputEventOption | null\n}\n\nexport interface XYPadProps {\n  x: ValueOptions\n  y: ValueOptions\n\n  externalStyles?: {\n    userSelectNone?: boolean\n    cursor?: Cursor\n  }\n\n  disabled?: boolean\n  readonly?: boolean\n\n  onChange?: (valueX: number, valueY: number) => void\n  onDragStart?: (valueX: number, valueY: number) => void\n  onDragEnd?: (valueX: number, valueY: number) => void\n  /** \\<XYPadThumb /> | \\<XYPadArea /> */\n  children?: ReactElement | ReactElement[]\n}\n\nexport interface XYPadMethods {\n  focus: () => void\n  blur: () => void\n  original: Ref<HTMLDivElement>\n}\n\ntype Props = XYPadProps &\n  Omit<ComponentPropsWithoutRef<'div'>, keyof XYPadProps>\n\nexport const Root = forwardRef<XYPadMethods, Props>(\n  (\n    {\n      x: _x,\n      y: _y,\n      className,\n      style,\n      externalStyles: _externalStyles,\n      disabled = false,\n      readonly = false,\n      onChange,\n      onDragStart,\n      onDragEnd,\n      onPointerDown,\n      onKeyDown,\n      onFocus,\n      onBlur,\n      children,\n      ...props\n    }: Props,\n    forwardedRef,\n  ) => {\n    const x = useMemo(() => {\n      return { ...defaultValueOptions, ..._x }\n    }, [_x])\n    const y = useMemo(() => {\n      return { ...defaultValueOptions, ..._y }\n    }, [_y])\n\n    // -- state and ref ---\n    const rootRef = useRef<HTMLDivElement>(null)\n    const areaElementRef = useRef<HTMLDivElement>(null)\n    const thumbRef = useRef<XYPadThumbMethods>(null)\n\n    // --- interpret props ---\n    const externalStyles = { ...defaultExternalStyles, ..._externalStyles }\n\n    const nx = normalizeValue(x.value, x.min, x.max, x.skew)\n    const ny = normalizeValue(y.value, y.min, y.max, y.skew)\n    const percentX = toFixed((x.reverse ? 1 - nx : nx) * 100)\n    const percentY = toFixed((y.reverse ? 1 - ny : ny) * 100)\n\n    let areaProps: XYPadAreaProps = {}\n    let thumbProps: XYPadThumbProps = {}\n    if (children != undefined) {\n      React.Children.forEach(children, (child) => {\n        if (React.isValidElement(child)) {\n          if (child.type == Thumb) {\n            thumbProps = child.props as XYPadThumbProps\n          } else if (child.type == Area) {\n            areaProps = child.props as XYPadAreaProps\n          } else {\n            throw new Error('only <XYPadThumb> or <XYPadArea>')\n          }\n        } else {\n          throw new Error('children is an invalid element.')\n        }\n      })\n    }\n\n    // --- internal functions ---\n    const onDrag = useCallback(\n      (nx: number, ny: number) => {\n        if (!onChange || readonly) return\n        const vx = rawValue(x.reverse ? 1 - nx : nx, x.min, x.max, x.skew)\n        const vy = rawValue(y.reverse ? 1 - ny : ny, y.min, y.max, y.skew)\n        const newX = clamp(stepValue(vx, x.step), x.min, x.max)\n        const newY = clamp(stepValue(vy, y.step), y.min, y.max)\n        onChange(newX, newY)\n      },\n      [\n        onChange,\n        readonly,\n        x.max,\n        x.min,\n        x.reverse,\n        x.skew,\n        x.step,\n        y.max,\n        y.min,\n        y.reverse,\n        y.skew,\n        y.step,\n      ],\n    )\n\n    const updateValueByEvent = useCallback(\n      (\n        eventType: InputEventOption[0],\n        target: Required<ValueOptions>,\n        x: number,\n      ) => {\n        let v\n        if (eventType == 'normalized') {\n          const n = normalizeValue(\n            target.value,\n            target.min,\n            target.max,\n            target.skew,\n          )\n          v = rawValue(n + x, target.min, target.max, target.skew)\n        } else {\n          v = target.value + x\n        }\n        return clamp(stepValue(v, target.step), target.min, target.max)\n      },\n      [],\n    )\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!onChange || readonly) return\n        const key = event.key\n        if (['ArrowRight', 'ArrowLeft', 'ArrowUp', 'ArrowDown'].includes(key)) {\n          const isHorizontal = key == 'ArrowRight' || key == 'ArrowLeft'\n          const target = isHorizontal ? x : y\n          if (!target.keyboard) return\n          event.preventDefault()\n          let delta = target.keyboard[1]\n          if (key == 'ArrowLeft' || key == 'ArrowUp') delta *= -1\n          if (target.reverse) delta *= -1\n          const newValue = updateValueByEvent(target.keyboard[0], target, delta)\n          if (isHorizontal) {\n            onChange(newValue, y.value)\n          } else {\n            onChange(x.value, newValue)\n          }\n        }\n      },\n      [onChange, readonly, x, y, updateValueByEvent],\n    )\n\n    // --- hooks ---\n    const { refHandler: touchMoveRefCallback, pointerDownHandler } =\n      useDragWithElement<HTMLDivElement>({\n        baseElementRef: areaElementRef,\n        onDrag: onDrag,\n        onDragStart: (nx, ny) => {\n          if (readonly) return\n\n          if (externalStyles.userSelectNone) addUserSelectNone()\n          if (externalStyles.cursor) setCursorStyle(externalStyles.cursor)\n\n          thumbRef.current?.focus()\n\n          const valueX = clamp(\n            stepValue(rawValue(nx, x.min, x.max, x.skew), x.step),\n            x.min,\n            x.max,\n          )\n          const valueY = clamp(\n            stepValue(rawValue(ny, y.min, y.max, y.skew), y.step),\n            y.min,\n            y.max,\n          )\n\n          // TODO: ドラッグせず、pointer downだけの場合でも、onChange を発火させるべき\n          // onChange()\n          onDragStart?.(valueX, valueY)\n        },\n        onDragEnd: (nx, ny) => {\n          if (readonly) return\n\n          if (externalStyles.userSelectNone) removeUserSelectNone()\n          if (externalStyles.cursor) resetCursorStyle()\n\n          const valueX = clamp(\n            stepValue(rawValue(nx, x.min, x.max, x.skew), x.step),\n            x.min,\n            x.max,\n          )\n          const valueY = clamp(\n            stepValue(rawValue(ny, y.min, y.max, y.skew), y.step),\n            y.min,\n            y.max,\n          )\n          onDragEnd?.(valueX, valueY)\n        },\n      })\n\n    const wheelRefCallback = useRefCallbackEvent(\n      'wheel',\n      (event) => {\n        if (!onChange || readonly) return\n        const target = event.shiftKey ? x : y\n        if (!target.wheel) return\n        event.preventDefault()\n        let delta = target.wheel[1]\n        if (event.deltaY < 0) delta *= -1\n        if (target.reverse) delta *= -1\n        const newValue = updateValueByEvent(target.wheel[0], target, delta)\n        if (event.shiftKey) {\n          onChange(newValue, y.value)\n        } else {\n          onChange(x.value, newValue)\n        }\n      },\n      {\n        passive: false,\n      },\n      [x, y, onChange, readonly, updateValueByEvent],\n    )\n\n    useImperativeHandle(forwardedRef, () => {\n      return {\n        focus() {\n          thumbRef.current?.focus()\n        },\n        blur() {\n          thumbRef.current?.blur()\n        },\n        original: rootRef,\n      }\n    }, [])\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n      <div\n        className={clsx('tremolo-xy-pad', className)}\n        ref={composeRefs(rootRef, wheelRefCallback, touchMoveRefCallback)}\n        tabIndex={-1}\n        aria-disabled={disabled}\n        aria-readonly={readonly}\n        style={{\n          margin: `calc(${styleHelper(thumbProps?.size ?? 22)} / 2)`, // half thumb size\n          cursor: readonly ? 'not-allowed' : 'pointer',\n          WebkitTapHighlightColor: 'transparent',\n          ...style,\n        }}\n        onPointerDown={(event) => {\n          pointerDownHandler(event)\n          onPointerDown?.(event)\n        }}\n        onKeyDown={(event) => {\n          handleKeyDown(event)\n          onKeyDown?.(event)\n        }}\n        onFocus={(event) => {\n          thumbRef.current?.focus()\n          onFocus?.(event)\n        }}\n        onBlur={(event) => {\n          thumbRef.current?.blur()\n          onBlur?.(event)\n        }}\n        {...props}\n      >\n        <div className=\"tremolo-xy-pad-area-wrapper\" ref={areaElementRef}>\n          <Area\n            __thumb={\n              <Thumb\n                ref={thumbRef}\n                __disabled={disabled}\n                __readonly={readonly}\n                __css={{\n                  top: `${percentY}%`,\n                  left: `${percentX}%`,\n                }}\n                {...thumbProps}\n              />\n            }\n            {...areaProps}\n          />\n        </div>\n      </div>\n    )\n  },\n)\n\n/**\n * Simple XYPad\n */\nexport const XYPad = {\n  Root,\n  Thumb,\n  Area,\n}\n\nexport { type XYPadThumbProps, type XYPadThumbMethods } from './Thumb'\nexport { type XYPadAreaProps } from './Area'\n","import { DependencyList, useCallback, useEffect, useRef } from 'react'\n\nexport function useAnimationFrame(\n  callback = () => {},\n  deps: DependencyList = [],\n) {\n  const reqIdRef = useRef(-1)\n  const loop = useCallback(() => {\n    reqIdRef.current = requestAnimationFrame(loop)\n    callback()\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [callback, ...deps])\n\n  useEffect(() => {\n    reqIdRef.current = requestAnimationFrame(loop)\n    return () => cancelAnimationFrame(reqIdRef.current)\n  }, [loop])\n}\n","import { useCallback, useEffect, useState } from 'react'\n\n/** @private */\nexport const PERMISSION_DENIED = 'PERMISSION_DENIED'\n/** @private */\nexport const NOT_SUPPORTED = 'NOT_SUPPORTED'\n\n/** @private */\nexport type MIDIAccessError = typeof PERMISSION_DENIED | typeof NOT_SUPPORTED\n\n/**\n * Hooks for requesting MIDI access in the browser. The first argument allows you to choose whether to request access on mount.\n */\nexport function useMIDIAccess(requestOnMount = true) {\n  const [midiAccess, setMidiAccess] = useState<MIDIAccess | null>(null)\n  const [error, setError] = useState<MIDIAccessError | null>(null)\n\n  const request = useCallback(() => {\n    if (navigator.requestMIDIAccess) {\n      navigator\n        .requestMIDIAccess()\n        .then((access) => {\n          setMidiAccess(access)\n          setError(null)\n        })\n        .catch(() => {\n          setError(PERMISSION_DENIED)\n        })\n    } else {\n      setError(NOT_SUPPORTED)\n    }\n  }, [])\n\n  useEffect(() => {\n    if (requestOnMount) request()\n  }, [requestOnMount, request])\n\n  return { request, midiAccess, error }\n}\n","import { useEffect } from 'react'\n\n/**\n * Hooks for when you want to process MIDI events in more detail than useMIDIInput.\n */\nexport function useMIDIMessage(\n  midiAccess: MIDIAccess | null,\n  onMIDIMessage: (event: MIDIMessageEvent) => void,\n) {\n  useEffect(() => {\n    if (!midiAccess) return\n\n    for (const input of midiAccess.inputs.values()) {\n      input.addEventListener('midimessage', onMIDIMessage)\n    }\n\n    return () => {\n      for (const input of midiAccess.inputs.values()) {\n        input.removeEventListener('midimessage', onMIDIMessage)\n      }\n    }\n  }, [midiAccess, onMIDIMessage])\n}\n","import { useCallback } from 'react'\n\nimport { useMIDIMessage } from './useMIDIMessage'\n\nconst MIDI_EVENT_TO_NUMBER = {\n  NOTE_ON: 0x90,\n  NOTE_OFF: 0x80,\n  PITCH_BEND: 0xe0,\n}\n\n// const NUMBER_TO_MIDI_EVENT: Record<number, string> = {\n//   0x90: 'NOTE_ON',\n//   0x80: 'NOTE_OFF',\n//   0xe0: 'PITCH_BEND',\n// }\n\n/**\n * Hooks for handling note on/off events. To be used with useMIDIAccess. Internally uses useMIDIMessage.\n */\nexport function useMIDIInput(\n  midiAccess: MIDIAccess | null,\n  onNoteOnEvent?: (note: number, velocity: number) => void,\n  onNoteOffEvent?: (note: number) => void,\n  onPitchBendEvent?: (msb: number, lsb: number) => void,\n) {\n  const handleMIDIMessage = useCallback(\n    (event: MIDIMessageEvent) => {\n      if (!event.data) return\n      // event.data[0] ... command\n      // event.data[1] ... note, MSB (Most Significant Byte)\n      // event.data[2] ... velocity, LSB (Least Significant Byte)\n      const kind = event.data[0] & 0xf0\n\n      if (\n        kind == MIDI_EVENT_TO_NUMBER.NOTE_OFF ||\n        (kind == MIDI_EVENT_TO_NUMBER.NOTE_ON && event.data[2] == 0)\n      ) {\n        onNoteOffEvent?.(event.data[1])\n      } else if (kind == MIDI_EVENT_TO_NUMBER.NOTE_ON) {\n        onNoteOnEvent?.(event.data[1], event.data[2])\n      } else if (kind == MIDI_EVENT_TO_NUMBER.PITCH_BEND) {\n        onPitchBendEvent?.(event.data[1], event.data[2])\n      }\n    },\n    [onNoteOffEvent, onNoteOnEvent, onPitchBendEvent],\n  )\n\n  useMIDIMessage(midiAccess, handleMIDIMessage)\n}\n"],"mappings":"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"}