@cutoff/audio-ui-react 1.0.0-preview.20260123.1125

package/dist/hooks/useBooleanInteraction.d.ts

@@ -0,0 +1,106 @@
+import { default as React } from 'react';
+import { BooleanInteractionMode } from '@cutoff/audio-ui-core';
+
+export interface UseBooleanInteractionProps {
+    /** Current value of the control */
+    value: boolean;
+    /** Interaction mode: toggle (latch) or momentary */
+    mode: BooleanInteractionMode;
+    /** Callback to update the value */
+    onValueChange: (value: boolean) => void;
+    /** Whether the control is disabled */
+    disabled?: boolean;
+    /** Optional user-provided mouse down handler (composed with hook handler) */
+    onMouseDown?: React.MouseEventHandler;
+    /** Optional user-provided mouse up handler (composed with hook handler) */
+    onMouseUp?: React.MouseEventHandler;
+    /** Optional user-provided touch start handler (composed with hook handler) */
+    onTouchStart?: React.TouchEventHandler;
+    /** Optional user-provided touch end handler (composed with hook handler) */
+    onTouchEnd?: React.TouchEventHandler;
+    /** Optional user-provided keyboard key down handler (composed with hook handler) */
+    onKeyDown?: React.KeyboardEventHandler;
+    /** Optional user-provided keyboard key up handler (composed with hook handler) */
+    onKeyUp?: React.KeyboardEventHandler;
+}
+export interface UseBooleanInteractionResult {
+    /** Handler for mouse down events */
+    handleMouseDown: (e: React.MouseEvent) => void;
+    /** Handler for mouse up events */
+    handleMouseUp: (e: React.MouseEvent) => void;
+    /** Handler for mouse enter events (for drag-in behavior) */
+    handleMouseEnter: (e: React.MouseEvent) => void;
+    /** Handler for mouse leave events (for drag-out behavior) */
+    handleMouseLeave: (e: React.MouseEvent) => void;
+    /** Handler for touch start events */
+    handleTouchStart: (e: React.TouchEvent) => void;
+    /** Handler for touch end events */
+    handleTouchEnd: (e: React.TouchEvent) => void;
+    /** Handler for touch move events (for touch drag-in/drag-out behavior) */
+    handleTouchMove: (e: React.TouchEvent) => void;
+    /** Ref callback to attach to the button element for touch tracking */
+    setButtonElement: (element: HTMLElement | SVGSVGElement | null) => void;
+    /** Handler for keyboard key down events (Enter/Space to activate) */
+    handleKeyDown: (e: React.KeyboardEvent) => void;
+    /** Handler for keyboard key up events (Enter/Space to release momentary buttons) */
+    handleKeyUp: (e: React.KeyboardEvent) => void;
+}
+/**
+ * Hook to manage interactions for boolean controls (buttons, toggles).
+ *
+ * Provides standardized logic for:
+ * - Toggle mode: Click or Space/Enter to flip the value
+ * - Momentary mode: Press to activate, release to deactivate (with global pointer tracking)
+ * - Drag-in/drag-out behavior: Buttons respond to pointer entering/leaving while pressed, even when press starts outside the button
+ * - Keyboard support: Enter/Space for activation/release
+ *
+ * The hook wraps the framework-agnostic `BooleanInteractionController` and provides React
+ * event handlers that can be attached directly to DOM elements. It maintains stable callback
+ * references across renders using `useCallback` and updates the controller configuration via
+ * `useEffect` when props change.
+ *
+ * **Drag-In/Drag-Out Behavior:**
+ * - **Momentary Mode**: Press inside → turns on; drag out while pressed → turns off; drag back in while pressed → turns on again. Works even when press starts outside the button.
+ * - **Toggle Mode**: Press inside → toggles state; drag out while pressed → no change; drag back in while pressed → toggles again. Works even when press starts outside the button.
+ *
+ * The hook automatically attaches global pointer listeners (mousedown, mouseup, touchstart, touchmove, touchend)
+ * to track pointer state globally, enabling drag-in behavior from anywhere on the page. For mouse interactions,
+ * it handles mouseenter/mouseleave events to detect when the pointer crosses the button boundary while pressed.
+ * For touch interactions, it manually tracks touch position using touchmove events and elementFromPoint to detect
+ * when the touch point crosses button boundaries (since touch events don't fire mouseenter/mouseleave).
+ *
+ * @param {UseBooleanInteractionProps} props - Configuration for the boolean interaction hook
+ * @param {boolean} props.value - Current value of the control
+ * @param {BooleanInteractionMode} props.mode - Interaction mode: "toggle" or "momentary"
+ * @param {(value: boolean) => void} props.onValueChange - Callback to update the value
+ * @param {boolean} [props.disabled=false] - Whether the control is disabled
+ * @param {React.MouseEventHandler} [props.onMouseDown] - Optional user-provided mouse down handler
+ * @param {React.MouseEventHandler} [props.onMouseUp] - Optional user-provided mouse up handler
+ * @param {React.TouchEventHandler} [props.onTouchStart] - Optional user-provided touch start handler
+ * @param {React.TouchEventHandler} [props.onTouchEnd] - Optional user-provided touch end handler
+ * @param {React.KeyboardEventHandler} [props.onKeyDown] - Optional user-provided keyboard key down handler
+ * @param {React.KeyboardEventHandler} [props.onKeyUp] - Optional user-provided keyboard key up handler
+ * @returns {UseBooleanInteractionResult} Object containing event handlers including handleMouseEnter and handleMouseLeave for drag-in/drag-out behavior
+ *
+ * @example
+ * ```tsx
+ * const { handleMouseDown, handleMouseUp, handleMouseEnter, handleMouseLeave, handleTouchStart, handleTouchEnd, handleKeyDown, handleKeyUp } = useBooleanInteraction({
+ *   value,
+ *   mode: "momentary",
+ *   onValueChange: (val) => setValue(val)
+ * });
+ *
+ * <div
+ *   onMouseDown={handleMouseDown}
+ *   onMouseUp={handleMouseUp}
+ *   onMouseEnter={handleMouseEnter}
+ *   onMouseLeave={handleMouseLeave}
+ *   onTouchStart={handleTouchStart}
+ *   onTouchEnd={handleTouchEnd}
+ *   onKeyDown={handleKeyDown}
+ *   onKeyUp={handleKeyUp}
+ * />
+ * ```
+ */
+export declare function useBooleanInteraction({ value, mode, onValueChange, disabled, onMouseDown: userOnMouseDown, onMouseUp: userOnMouseUp, onTouchStart: userOnTouchStart, onTouchEnd: userOnTouchEnd, onKeyDown: userOnKeyDown, onKeyUp: userOnKeyUp, }: UseBooleanInteractionProps): UseBooleanInteractionResult;
+//# sourceMappingURL=useBooleanInteraction.d.ts.map

package/dist/hooks/useBooleanInteraction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBooleanInteraction.d.ts","sourceRoot":"","sources":["../../src/hooks/useBooleanInteraction.ts"],"names":[],"mappings":"AAMA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAgC,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAE7F,MAAM,WAAW,0BAA0B;IACvC,mCAAmC;IACnC,KAAK,EAAE,OAAO,CAAC;IACf,oDAAoD;IACpD,IAAI,EAAE,sBAAsB,CAAC;IAC7B,mCAAmC;IACnC,aAAa,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,6EAA6E;IAC7E,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACtC,2EAA2E;IAC3E,SAAS,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACpC,8EAA8E;IAC9E,YAAY,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACvC,4EAA4E;IAC5E,UAAU,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACrC,oFAAoF;IACpF,SAAS,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC;IACvC,kFAAkF;IAClF,OAAO,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC;CACxC;AAED,MAAM,WAAW,2BAA2B;IACxC,oCAAoC;IACpC,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC/C,kCAAkC;IAClC,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC7C,4DAA4D;IAC5D,gBAAgB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAChD,6DAA6D;IAC7D,gBAAgB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAChD,qCAAqC;IACrC,gBAAgB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAChD,mCAAmC;IACnC,cAAc,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC9C,0EAA0E;IAC1E,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC/C,sEAAsE;IACtE,gBAAgB,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,aAAa,GAAG,IAAI,KAAK,IAAI,CAAC;IACxE,qEAAqE;IACrE,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IAChD,oFAAoF;IACpF,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;CACjD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwDG;AACH,wBAAgB,qBAAqB,CAAC,EAClC,KAAK,EACL,IAAI,EACJ,aAAa,EACb,QAAgB,EAChB,WAAW,EAAE,eAAe,EAC5B,SAAS,EAAE,aAAa,EACxB,YAAY,EAAE,gBAAgB,EAC9B,UAAU,EAAE,cAAc,EAC1B,SAAS,EAAE,aAAa,EACxB,OAAO,EAAE,WAAW,GACvB,EAAE,0BAA0B,GAAG,2BAA2B,CA4O1D"}

package/dist/hooks/useBooleanParameterResolution.d.ts

@@ -0,0 +1,54 @@
+import { BooleanParameter, MidiResolution } from '@cutoff/audio-ui-core';
+
+export interface UseBooleanParameterResolutionProps {
+    /** The parameter definition (Strict mode) */
+    parameter?: BooleanParameter;
+    /** Identifier for the parameter (used in Ad-Hoc mode) */
+    paramId?: string;
+    /** Label for the parameter (Ad-Hoc mode) */
+    label?: string;
+    /** Whether the button should latch (toggle between states) or momentary (only active while pressed) (Ad-Hoc mode) */
+    latch?: boolean;
+    /** MIDI resolution in bits (Ad-Hoc mode)
+     * @default 7
+     */
+    midiResolution?: MidiResolution;
+}
+export interface UseBooleanParameterResolutionResult {
+    /** The resolved BooleanParameter (derived from props or created from ad-hoc props) */
+    derivedParameter: BooleanParameter;
+}
+/**
+ * Hook to resolve a BooleanParameter from props.
+ *
+ * Supports two modes:
+ * 1. Strict Mode (Parameter only): Model provided via parameter prop.
+ * 2. Ad-Hoc Mode (Props only): Model created from individual props (label, latch, etc.).
+ *
+ * When `parameter` is provided, it takes precedence over ad-hoc props.
+ *
+ * @param props - Configuration object for parameter resolution
+ * @param props.parameter - The parameter definition (Strict mode). When provided, takes precedence over ad-hoc props.
+ * @param props.paramId - Identifier for the parameter (used in Ad-Hoc mode)
+ * @param props.label - Label for the parameter (Ad-Hoc mode)
+ * @param props.latch - Whether the button should latch (toggle) or be momentary (Ad-Hoc mode)
+ * @param props.midiResolution - MIDI resolution in bits (Ad-Hoc mode, default: 7)
+ * @returns Object containing the resolved BooleanParameter
+ *
+ * @example
+ * ```tsx
+ * // Strict mode: use provided parameter
+ * const { derivedParameter } = useBooleanParameterResolution({
+ *   parameter: powerParam
+ * });
+ *
+ * // Ad-Hoc mode: create from props
+ * const { derivedParameter } = useBooleanParameterResolution({
+ *   paramId: "power",
+ *   label: "Power",
+ *   latch: true
+ * });
+ * ```
+ */
+export declare function useBooleanParameterResolution({ parameter, paramId, label, latch, midiResolution, }: UseBooleanParameterResolutionProps): UseBooleanParameterResolutionResult;
+//# sourceMappingURL=useBooleanParameterResolution.d.ts.map

package/dist/hooks/useBooleanParameterResolution.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBooleanParameterResolution.d.ts","sourceRoot":"","sources":["../../src/hooks/useBooleanParameterResolution.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,gBAAgB,EAAyB,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEhG,MAAM,WAAW,kCAAkC;IAC/C,6CAA6C;IAC7C,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,yDAAyD;IACzD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qHAAqH;IACrH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;CACnC;AAED,MAAM,WAAW,mCAAmC;IAChD,sFAAsF;IACtF,gBAAgB,EAAE,gBAAgB,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,6BAA6B,CAAC,EAC1C,SAAS,EACT,OAAO,EACP,KAAK,EACL,KAAK,EACL,cAAkB,GACrB,EAAE,kCAAkC,GAAG,mCAAmC,CA8B1E"}

package/dist/hooks/useContinuousInteraction.d.ts

@@ -0,0 +1,94 @@
+import { default as React } from 'react';
+import { ContinuousInteractionConfig } from '@cutoff/audio-ui-core';
+
+export type UseContinuousInteractionProps = Omit<ContinuousInteractionConfig, "adjustValue"> & {
+    adjustValue: (delta: number, sensitivity?: number) => void;
+    editable?: boolean;
+    /** Minimum value (real domain). Used to calculate normalized step if step is not provided. */
+    min?: number;
+    /** Maximum value (real domain). Used to calculate normalized step if step is not provided. */
+    max?: number;
+    /** Step size (real domain). Used to calculate normalized step if step is not provided. */
+    paramStep?: number;
+    /** Function to reset the value to its default (called on double-click) */
+    resetToDefault?: () => void;
+    /** Optional user-provided mouse down handler (composed with hook handler) */
+    onMouseDown?: React.MouseEventHandler;
+    /** Optional user-provided touch start handler (composed with hook handler) */
+    onTouchStart?: React.TouchEventHandler;
+    /** Optional user-provided wheel handler (composed with hook handler) */
+    onWheel?: React.WheelEventHandler;
+    /** Optional user-provided keyboard key down handler (composed with hook handler) */
+    onKeyDown?: React.KeyboardEventHandler;
+    /** Optional user-provided double click handler (composed with hook handler) */
+    onDoubleClick?: React.MouseEventHandler;
+};
+export interface ContinuousInteractionHandlers {
+    onMouseDown: React.MouseEventHandler;
+    onTouchStart: React.TouchEventHandler;
+    onWheel: React.WheelEventHandler;
+    onKeyDown: React.KeyboardEventHandler;
+    onDoubleClick: React.MouseEventHandler;
+    tabIndex: number;
+    role: string;
+    "aria-disabled"?: boolean;
+    style?: React.CSSProperties;
+}
+/**
+ * Hook to standardize user interaction for continuous controls (Knob, Slider).
+ *
+ * This hook provides a unified interface for handling all user input methods:
+ * - Drag interactions (mouse and touch)
+ * - Wheel scrolling
+ * - Keyboard navigation (arrow keys, Home/End)
+ * - Double-click to reset to default value
+ *
+ * The hook wraps the framework-agnostic `ContinuousInteractionController` and provides React
+ * event handlers that can be attached directly to SVG elements. It handles focus
+ * management, accessibility attributes, and cursor styling automatically.
+ *
+ * Cursor types are customizable via CSS variables in themes.css (e.g., `--audioui-cursor-clickable`,
+ * `--audioui-cursor-bidirectional`). The cursor selection logic (which cursor to show when) is
+ * fixed based on interaction state, but the actual cursor values are customizable.
+ *
+ * @param adjustValue Function to adjust the value based on a delta. Receives (delta, sensitivity).
+ * @param keyboardStep Step size for keyboard interaction (normalized 0..1, default: 0.05)
+ * @param interactionMode Interaction mode: "drag", "wheel", or "both" (default: "both")
+ * @param direction Direction of drag interaction: "vertical", "horizontal", "circular", or "both" (default: "both")
+ * @param sensitivity Sensitivity of the control (default: 0.005). Higher = more sensitive.
+ * @param wheelSensitivity Optional separate sensitivity for wheel events. Defaults to DEFAULT_WHEEL_SENSITIVITY (0.005).
+ * @param step Normalized step size (0..1). Used for adaptive wheel interaction and sensitivity scaling.
+ * @param min Minimum value (real domain). Used to calculate normalized step if step is not provided.
+ * @param max Maximum value (real domain). Used to calculate normalized step if step is not provided.
+ * @param paramStep Step size (real domain). Used to calculate normalized step if step is not provided.
+ * @param disabled Whether the control is disabled (default: false)
+ * @param editable Whether the control is editable (default: true). When false, uses `--audioui-cursor-noneditable`.
+ * @param resetToDefault Function to reset the value to its default (called on double-click). Only active when editable and not disabled.
+ * @param onDragStart Callback when drag interaction starts
+ * @param onDragEnd Callback when drag interaction ends
+ * @param onMouseDown Optional user-provided mouse down handler (composed with hook handler)
+ * @param onTouchStart Optional user-provided touch start handler (composed with hook handler)
+ * @param onWheel Optional user-provided wheel handler (composed with hook handler)
+ * @param onKeyDown Optional user-provided keyboard key down handler (composed with hook handler)
+ * @param onDoubleClick Optional user-provided double click handler (composed with hook handler)
+ * @returns Object containing React event handlers (onMouseDown, onTouchStart, onWheel, onKeyDown, onDoubleClick) and accessibility props
+ *
+ * @example
+ * ```tsx
+ * const interactiveProps = useContinuousInteraction({
+ *   adjustValue: (delta, sensitivity) => {
+ *     setValue(v => clamp(v + delta * sensitivity, 0, 100));
+ *   },
+ *   resetToDefault: () => setValue(defaultValue),
+ *   interactionMode: "both",
+ *   direction: "vertical",
+ *   sensitivity: 0.01
+ * });
+ *
+ * <svg {...interactiveProps}>
+ *   <circle cx={50} cy={50} r={30} />
+ * </svg>
+ * ```
+ */
+export declare function useContinuousInteraction({ adjustValue, keyboardStep, interactionMode, direction, sensitivity, wheelSensitivity, step, min, max, paramStep, disabled, editable, onDragStart, onDragEnd, resetToDefault, onMouseDown: userOnMouseDown, onTouchStart: userOnTouchStart, onWheel: userOnWheel, onKeyDown: userOnKeyDown, onDoubleClick: userOnDoubleClick, }: UseContinuousInteractionProps): ContinuousInteractionHandlers;
+//# sourceMappingURL=useContinuousInteraction.d.ts.map

package/dist/hooks/useContinuousInteraction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useContinuousInteraction.d.ts","sourceRoot":"","sources":["../../src/hooks/useContinuousInteraction.ts"],"names":[],"mappings":"AAMA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAmC,2BAA2B,EAAE,MAAM,uBAAuB,CAAC;AAGrG,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAAC,2BAA2B,EAAE,aAAa,CAAC,GAAG;IAC3F,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8FAA8F;IAC9F,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,8FAA8F;IAC9F,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,0FAA0F;IAC1F,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,6EAA6E;IAC7E,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACtC,8EAA8E;IAC9E,YAAY,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACvC,wEAAwE;IACxE,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,oFAAoF;IACpF,SAAS,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC;IACvC,+EAA+E;IAC/E,aAAa,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,6BAA6B;IAC1C,WAAW,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACrC,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACtC,OAAO,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC,SAAS,EAAE,KAAK,CAAC,oBAAoB,CAAC;IACtC,aAAa,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACvC,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC/B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,wBAAgB,wBAAwB,CAAC,EACrC,WAAW,EACX,YAAoC,EACpC,eAAwB,EACxB,SAAkB,EAClB,WAAW,EACX,gBAAgB,EAChB,IAAI,EACJ,GAAG,EACH,GAAG,EACH,SAAS,EACT,QAAgB,EAChB,QAAe,EACf,WAAW,EACX,SAAS,EACT,cAAc,EACd,WAAW,EAAE,eAAe,EAC5B,YAAY,EAAE,gBAAgB,EAC9B,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,aAAa,EAAE,iBAAiB,GACnC,EAAE,6BAA6B,GAAG,6BAA6B,CAiK/D"}

package/dist/hooks/useContinuousParameterResolution.d.ts

@@ -0,0 +1,75 @@
+import { ContinuousParameter, ScaleType, MidiResolution } from '@cutoff/audio-ui-core';
+
+export interface UseContinuousParameterResolutionProps {
+    /** The parameter definition (Strict mode) */
+    parameter?: ContinuousParameter;
+    /** Identifier for the parameter (used in Ad-Hoc mode) */
+    paramId?: string;
+    /** Label for the parameter (Ad-Hoc mode) */
+    label?: string;
+    /** Minimum value (Ad-Hoc mode) */
+    min?: number;
+    /** Maximum value (Ad-Hoc mode) */
+    max?: number;
+    /** Step size for value adjustments (Ad-Hoc mode) */
+    step?: number;
+    /** Whether the parameter operates in bipolar mode (Ad-Hoc mode) */
+    bipolar?: boolean;
+    /** Unit suffix for the value (Ad-Hoc mode, e.g. "dB", "Hz") */
+    unit?: string;
+    /** Scale function or shortcut for the parameter (Ad-Hoc mode) */
+    scale?: ScaleType;
+    /** MIDI resolution in bits (Ad-Hoc mode)
+     * @default 32
+     */
+    midiResolution?: MidiResolution;
+    /** Default value for the parameter (Ad-Hoc mode) */
+    defaultValue?: number;
+}
+export interface UseContinuousParameterResolutionResult {
+    /** The resolved ContinuousParameter (derived from props or created from ad-hoc props) */
+    derivedParameter: ContinuousParameter;
+}
+/**
+ * Hook to resolve a ContinuousParameter from props.
+ *
+ * Supports two modes:
+ * 1. Strict Mode (Parameter only): Model provided via parameter prop.
+ * 2. Ad-Hoc Mode (Props only): Model created from individual props (min, max, step, etc.).
+ *
+ * When `parameter` is provided, it takes precedence over ad-hoc props.
+ *
+ * @param props - Configuration object for parameter resolution
+ * @param props.parameter - The parameter definition (Strict mode). When provided, takes precedence over ad-hoc props.
+ * @param props.paramId - Identifier for the parameter (used in Ad-Hoc mode)
+ * @param props.label - Label for the parameter (Ad-Hoc mode)
+ * @param props.min - Minimum value (Ad-Hoc mode)
+ * @param props.max - Maximum value (Ad-Hoc mode)
+ * @param props.step - Step size for value adjustments (Ad-Hoc mode)
+ * @param props.bipolar - Whether the parameter operates in bipolar mode (Ad-Hoc mode)
+ * @param props.unit - Unit suffix for the value (Ad-Hoc mode, e.g. "dB", "Hz")
+ * @param props.scale - Scale function or shortcut for the parameter (Ad-Hoc mode)
+ * @param props.midiResolution - MIDI resolution in bits (Ad-Hoc mode, default: 32)
+ * @param props.defaultValue - Default value for the parameter (Ad-Hoc mode)
+ * @returns Object containing the resolved ContinuousParameter
+ *
+ * @example
+ * ```tsx
+ * // Strict mode: use provided parameter
+ * const { derivedParameter } = useContinuousParameterResolution({
+ *   parameter: volumeParam
+ * });
+ *
+ * // Ad-Hoc mode: create from props
+ * const { derivedParameter } = useContinuousParameterResolution({
+ *   paramId: "volume",
+ *   label: "Volume",
+ *   min: 0,
+ *   max: 100,
+ *   step: 1,
+ *   unit: "%"
+ * });
+ * ```
+ */
+export declare function useContinuousParameterResolution({ parameter, paramId, label, min, max, step, bipolar, unit, scale, midiResolution, defaultValue, }: UseContinuousParameterResolutionProps): UseContinuousParameterResolutionResult;
+//# sourceMappingURL=useContinuousParameterResolution.d.ts.map

package/dist/hooks/useContinuousParameterResolution.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useContinuousParameterResolution.d.ts","sourceRoot":"","sources":["../../src/hooks/useContinuousParameterResolution.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,mBAAmB,EAAyB,SAAS,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAE9G,MAAM,WAAW,qCAAqC;IAClD,6CAA6C;IAC7C,SAAS,CAAC,EAAE,mBAAmB,CAAC;IAChC,yDAAyD;IACzD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kCAAkC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,+DAA+D;IAC/D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iEAAiE;IACjE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,oDAAoD;IACpD,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,sCAAsC;IACnD,yFAAyF;IACzF,gBAAgB,EAAE,mBAAmB,CAAC;CACzC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,wBAAgB,gCAAgC,CAAC,EAC7C,SAAS,EACT,OAAO,EACP,KAAK,EACL,GAAG,EACH,GAAG,EACH,IAAI,EACJ,OAAO,EACP,IAAI,EACJ,KAAK,EACL,cAAmB,EACnB,YAAY,GACf,EAAE,qCAAqC,GAAG,sCAAsC,CA2BhF"}

package/dist/hooks/useDiscreteInteraction.d.ts

@@ -0,0 +1,70 @@
+import { default as React } from 'react';
+
+export interface UseDiscreteInteractionProps {
+    /** Current value of the control */
+    value: string | number;
+    /** List of available options */
+    options: Array<{
+        value: string | number;
+    }>;
+    /** Callback to update the value */
+    onValueChange: (value: string | number) => void;
+    /** Whether the control is disabled */
+    disabled?: boolean;
+    /** Optional user-provided click handler (composed with hook handler) */
+    onClick?: React.MouseEventHandler;
+    /** Optional user-provided mouse down handler (composed with hook handler) */
+    onMouseDown?: React.MouseEventHandler;
+    /** Optional user-provided keyboard key down handler (composed with hook handler) */
+    onKeyDown?: React.KeyboardEventHandler;
+}
+export interface UseDiscreteInteractionResult {
+    /** Handler for click events (cycles through options) */
+    handleClick: (e: React.MouseEvent) => void;
+    /** Handler for keyboard events (Arrows to step, Space/Enter to cycle) */
+    handleKeyDown: (e: React.KeyboardEvent) => void;
+    /** Handler for mouse down events (passes through to user handler if provided) */
+    handleMouseDown?: React.MouseEventHandler;
+    /** Manually cycle to the next value (wrapping around) */
+    cycleNext: () => void;
+    /** Manually step to the next value (clamped) */
+    stepNext: () => void;
+    /** Manually step to the previous value (clamped) */
+    stepPrev: () => void;
+}
+/**
+ * Hook to manage interactions for discrete controls (switches, toggles, selectors).
+ *
+ * Provides standardized logic for:
+ * - Cycling through options (wrapping) via Click or Space/Enter
+ * - Stepping through options (clamped) via Arrow keys
+ * - Finding the nearest valid option index when value doesn't match
+ *
+ * The hook wraps the framework-agnostic `DiscreteInteractionController` and provides React
+ * event handlers that can be attached directly to DOM elements. It maintains stable callback
+ * references across renders using `useCallback` and updates the controller configuration via
+ * `useEffect` when props change.
+ *
+ * @param {UseDiscreteInteractionProps} props - Configuration for the discrete interaction hook
+ * @param {string | number} props.value - Current value of the control
+ * @param {Array<{ value: string | number }>} props.options - List of available options
+ * @param {(value: string | number) => void} props.onValueChange - Callback to update the value
+ * @param {boolean} [props.disabled=false] - Whether the control is disabled
+ * @param {React.MouseEventHandler} [props.onClick] - Optional user-provided click handler
+ * @param {React.MouseEventHandler} [props.onMouseDown] - Optional user-provided mouse down handler
+ * @param {React.KeyboardEventHandler} [props.onKeyDown] - Optional user-provided keyboard key down handler
+ * @returns {UseDiscreteInteractionResult} Object containing event handlers and manual control methods
+ *
+ * @example
+ * ```tsx
+ * const { handleClick, handleKeyDown } = useDiscreteInteraction({
+ *   value,
+ *   options,
+ *   onValueChange: (val) => setNormalizedValue(converter.normalize(val))
+ * });
+ *
+ * <div onClick={handleClick} onKeyDown={handleKeyDown} />
+ * ```
+ */
+export declare function useDiscreteInteraction({ value, options, onValueChange, disabled, onClick: userOnClick, onMouseDown: userOnMouseDown, onKeyDown: userOnKeyDown, }: UseDiscreteInteractionProps): UseDiscreteInteractionResult;
+//# sourceMappingURL=useDiscreteInteraction.d.ts.map

package/dist/hooks/useDiscreteInteraction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDiscreteInteraction.d.ts","sourceRoot":"","sources":["../../src/hooks/useDiscreteInteraction.ts"],"names":[],"mappings":"AAMA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAG9D,MAAM,WAAW,2BAA2B;IACxC,mCAAmC;IACnC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,gCAAgC;IAChC,OAAO,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC,CAAC;IAC3C,mCAAmC;IACnC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAChD,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wEAAwE;IACxE,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,6EAA6E;IAC7E,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACtC,oFAAoF;IACpF,SAAS,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC;CAC1C;AAED,MAAM,WAAW,4BAA4B;IACzC,wDAAwD;IACxD,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC3C,yEAAyE;IACzE,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IAChD,iFAAiF;IACjF,eAAe,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAC1C,yDAAyD;IACzD,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,gDAAgD;IAChD,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,oDAAoD;IACpD,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,wBAAgB,sBAAsB,CAAC,EACnC,KAAK,EACL,OAAO,EACP,aAAa,EACb,QAAgB,EAChB,OAAO,EAAE,WAAW,EACpB,WAAW,EAAE,eAAe,EAC5B,SAAS,EAAE,aAAa,GAC3B,EAAE,2BAA2B,GAAG,4BAA4B,CA+D5D"}

package/dist/hooks/useDiscreteParameterResolution.d.ts

@@ -0,0 +1,120 @@
+import { default as React } from 'react';
+import { DiscreteParameter, DiscreteOption, MidiResolution } from '@cutoff/audio-ui-core';
+
+export interface UseDiscreteParameterResolutionProps {
+    /** Child elements (OptionView components) for visual content mapping (Hybrid mode)
+     *
+     * **Visual Content Only**: Children provide ReactNodes for rendering (icons, text, custom components).
+     * They do NOT define the parameter model - use `options` prop or `parameter` prop for that.
+     *
+     * When both `options` and `children` are provided, children are matched to options by value
+     * to create the visual content map.
+     */
+    children?: React.ReactNode;
+    /** Option definitions for the parameter model (Ad-Hoc mode)
+     *
+     * **Parameter Model Only**: This prop defines the parameter structure (value, label, midiValue).
+     * It does NOT provide visual content - use `children` (OptionView components) for that.
+     *
+     * When both `options` and `children` are provided:
+     * - `options` defines the parameter model
+     * - `children` provide visual content (matched by value)
+     */
+    options?: DiscreteOption[];
+    /** Identifier for the parameter (used in Ad-Hoc mode) */
+    paramId?: string;
+    /** The parameter definition (Strict or Hybrid mode) */
+    parameter?: DiscreteParameter;
+    /** Default value (Ad-Hoc mode) or override for parameter default */
+    defaultValue?: string | number;
+    /** Label for the parameter (Ad-Hoc mode) */
+    label?: string;
+    /** MIDI resolution in bits (Ad-Hoc mode)
+     * @default 7
+     */
+    midiResolution?: MidiResolution;
+    /** MIDI mapping strategy (Ad-Hoc mode)
+     * @default "spread"
+     */
+    midiMapping?: "spread" | "sequential" | "custom";
+}
+export interface UseDiscreteParameterResolutionResult {
+    /** The resolved DiscreteParameter (derived from props or children) */
+    derivedParameter: DiscreteParameter;
+    /** Map of values to visual content (ReactNodes) from children */
+    visualContentMap: Map<string | number, React.ReactNode>;
+    /** The effective default value (resolved from parameter, prop, or first option) */
+    effectiveDefaultValue: string | number;
+}
+/**
+ * Hook to resolve a DiscreteParameter and visual content from props and/or children.
+ *
+ * **Important: Options vs Children**
+ *
+ * - **`options` prop**: Defines the parameter model (value, label, midiValue). Used for parameter structure.
+ * - **`children` (OptionView components)**: Provides visual content (ReactNodes) for rendering. Used for display.
+ *
+ * These serve different purposes and can be used together:
+ * - Use `options` when you have data-driven option definitions
+ * - Use `children` when you want to provide custom visual content (icons, styled text, etc.)
+ * - Use both: `options` for the model, `children` for visuals (matched by value)
+ *
+ * Supports four modes of operation:
+ * 1. **Ad-Hoc Mode (Options prop)**: Model from `options` prop, visual from `children` (if provided) or default rendering
+ * 2. **Ad-Hoc Mode (Children only)**: Model inferred from OptionView children, visual from children
+ * 3. **Strict Mode (Parameter only)**: Model from `parameter` prop, visual via `renderOption` callback
+ * 4. **Hybrid Mode (Parameter + Children)**: Model from `parameter` prop, visual from children (matched by value)
+ *
+ * @param props - Configuration object for discrete parameter resolution
+ * @param props.options - Option definitions for parameter model (Ad-Hoc mode). Takes precedence over children for model.
+ * @param props.children - Child elements (OptionView components) for visual content mapping (Hybrid/Ad-Hoc mode)
+ * @param props.paramId - Identifier for the parameter (used in Ad-Hoc mode)
+ * @param props.parameter - The parameter definition (Strict or Hybrid mode)
+ * @param props.defaultValue - Default value (Ad-Hoc mode) or override for parameter default
+ * @param props.label - Label for the parameter (Ad-Hoc mode)
+ * @param props.midiResolution - MIDI resolution in bits (Ad-Hoc mode, default: 7)
+ * @param props.midiMapping - MIDI mapping strategy (Ad-Hoc mode, default: "spread")
+ * @returns Object containing the resolved DiscreteParameter, visual content map, and effective default value
+ *
+ * @example
+ * ```tsx
+ * // Ad-Hoc Mode with options prop (data-driven)
+ * const { derivedParameter } = useDiscreteParameterResolution({
+ *   options: [
+ *     { value: "sine", label: "Sine Wave" },
+ *     { value: "square", label: "Square Wave" }
+ *   ],
+ *   paramId: "waveform"
+ * });
+ *
+ * // Ad-Hoc Mode with children (visual content)
+ * const { derivedParameter, visualContentMap } = useDiscreteParameterResolution({
+ *   children: [
+ *     <OptionView value="sine"><SineIcon /></OptionView>,
+ *     <OptionView value="square"><SquareIcon /></OptionView>
+ *   ],
+ *   paramId: "waveform"
+ * });
+ *
+ * // Hybrid: options for model, children for visuals
+ * const { derivedParameter, visualContentMap } = useDiscreteParameterResolution({
+ *   options: [
+ *     { value: "sine", label: "Sine Wave", midiValue: 0 },
+ *     { value: "square", label: "Square Wave", midiValue: 1 }
+ *   ],
+ *   children: [
+ *     <OptionView value="sine"><SineIcon /></OptionView>,
+ *     <OptionView value="square"><SquareIcon /></OptionView>
+ *   ],
+ *   paramId: "waveform"
+ * });
+ *
+ * // Strict Mode
+ * const result = useDiscreteParameterResolution({
+ *   parameter: myDiscreteParameter,
+ *   defaultValue: "custom"
+ * });
+ * ```
+ */
+export declare function useDiscreteParameterResolution({ children, options, paramId, parameter, defaultValue, label, midiResolution, midiMapping, }: UseDiscreteParameterResolutionProps): UseDiscreteParameterResolutionResult;
+//# sourceMappingURL=useDiscreteParameterResolution.d.ts.map

package/dist/hooks/useDiscreteParameterResolution.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDiscreteParameterResolution.d.ts","sourceRoot":"","sources":["../../src/hooks/useDiscreteParameterResolution.ts"],"names":[],"mappings":"AAMA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAG1F,MAAM,WAAW,mCAAmC;IAChD;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,yDAAyD;IACzD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uDAAuD;IACvD,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,oEAAoE;IACpE,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;OAEG;IACH,WAAW,CAAC,EAAE,QAAQ,GAAG,YAAY,GAAG,QAAQ,CAAC;CACpD;AAED,MAAM,WAAW,oCAAoC;IACjD,sEAAsE;IACtE,gBAAgB,EAAE,iBAAiB,CAAC;IACpC,iEAAiE;IACjE,gBAAgB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IACxD,mFAAmF;IACnF,qBAAqB,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqEG;AACH,wBAAgB,8BAA8B,CAAC,EAC3C,QAAQ,EACR,OAAO,EACP,OAAO,EACP,SAAS,EACT,YAAY,EACZ,KAAK,EACL,cAAkB,EAClB,WAAsB,GACzB,EAAE,mCAAmC,GAAG,oCAAoC,CAiF5E"}

package/dist/hooks/useNoteInteraction.d.ts

@@ -0,0 +1,84 @@
+import { default as React } from 'react';
+
+/**
+ * Props for the useNoteInteraction hook.
+ */
+export interface UseNoteInteractionProps {
+    /** Callback triggered when a note is pressed */
+    onNoteOn: (note: number) => void;
+    /** Callback triggered when a note is released */
+    onNoteOff: (note: number) => void;
+    /** Whether the interaction is disabled */
+    disabled?: boolean;
+    /** Optional user-provided pointer down handler */
+    onPointerDown?: React.PointerEventHandler;
+    /** Optional user-provided pointer move handler */
+    onPointerMove?: React.PointerEventHandler;
+    /** Optional user-provided pointer up handler */
+    onPointerUp?: React.PointerEventHandler;
+    /** Optional user-provided pointer cancel handler */
+    onPointerCancel?: React.PointerEventHandler;
+}
+/**
+ * Result object for the useNoteInteraction hook.
+ */
+export interface UseNoteInteractionResult {
+    /** Pointer down handler to be attached to the target element */
+    onPointerDown: React.PointerEventHandler;
+    /** Pointer move handler to be attached to the target element */
+    onPointerMove: React.PointerEventHandler;
+    /** Pointer up handler to be attached to the target element */
+    onPointerUp: React.PointerEventHandler;
+    /** Pointer cancel handler to be attached to the target element */
+    onPointerCancel: React.PointerEventHandler;
+    /** Standardized styles for the interactive element (e.g., touchAction: "none") */
+    style: React.CSSProperties;
+}
+/**
+ * Hook to manage note interactions for keyboard-like components.
+ *
+ * Provides standardized logic for:
+ * - Multi-touch support via PointerEvents
+ * - Glissando (sliding across keys) detection
+ * - Standardized note on/off event triggering
+ *
+ * It uses the framework-agnostic `NoteInteractionController` to handle the
+ * core interaction logic and manages pointer capture for reliable glissando.
+ *
+ * The hook returns pointer event handlers and a style object containing
+ * `touchAction: "none"` to prevent default touch behaviors. Cursor styling
+ * is handled by the consuming component based on its interactivity state.
+ *
+ * @param {UseNoteInteractionProps} props - Configuration for the note interaction hook
+ * @param {(note: number) => void} props.onNoteOn - Callback triggered when a note is pressed
+ * @param {(note: number) => void} props.onNoteOff - Callback triggered when a note is released
+ * @param {boolean} [props.disabled=false] - Whether the interaction is disabled
+ * @param {React.PointerEventHandler} [props.onPointerDown] - Optional user-provided pointer down handler
+ * @param {React.PointerEventHandler} [props.onPointerMove] - Optional user-provided pointer move handler
+ * @param {React.PointerEventHandler} [props.onPointerUp] - Optional user-provided pointer up handler
+ * @param {React.PointerEventHandler} [props.onPointerCancel] - Optional user-provided pointer cancel handler
+ * @returns {UseNoteInteractionResult} Object containing pointer event handlers and styles
+ *
+ * @example
+ * ```tsx
+ * const { onPointerDown, onPointerMove, onPointerUp, style } = useNoteInteraction({
+ *   onNoteOn: (note) => synth.noteOn(note),
+ *   onNoteOff: (note) => synth.noteOff(note)
+ * });
+ *
+ * return (
+ *   <svg
+ *     onPointerDown={onPointerDown}
+ *     onPointerMove={onPointerMove}
+ *     onPointerUp={onPointerUp}
+ *     style={style}
+ *   >
+ *     {keys.map(key => (
+ *       <rect key={key.note} data-note={key.note} {...key.rectProps} />
+ *     ))}
+ *   </svg>
+ * );
+ * ```
+ */
+export declare function useNoteInteraction({ onNoteOn, onNoteOff, disabled, onPointerDown: userOnPointerDown, onPointerMove: userOnPointerMove, onPointerUp: userOnPointerUp, onPointerCancel: userOnPointerCancel, }: UseNoteInteractionProps): UseNoteInteractionResult;
+//# sourceMappingURL=useNoteInteraction.d.ts.map

package/dist/hooks/useNoteInteraction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNoteInteraction.d.ts","sourceRoot":"","sources":["../../src/hooks/useNoteInteraction.ts"],"names":[],"mappings":"AAMA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAG9D;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACpC,gDAAgD;IAChD,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,iDAAiD;IACjD,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,aAAa,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC;IAC1C,kDAAkD;IAClD,aAAa,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC;IAC1C,gDAAgD;IAChD,WAAW,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC;IACxC,oDAAoD;IACpD,eAAe,CAAC,EAAE,KAAK,CAAC,mBAAmB,CAAC;CAC/C;AAED;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACrC,gEAAgE;IAChE,aAAa,EAAE,KAAK,CAAC,mBAAmB,CAAC;IACzC,gEAAgE;IAChE,aAAa,EAAE,KAAK,CAAC,mBAAmB,CAAC;IACzC,8DAA8D;IAC9D,WAAW,EAAE,KAAK,CAAC,mBAAmB,CAAC;IACvC,kEAAkE;IAClE,eAAe,EAAE,KAAK,CAAC,mBAAmB,CAAC;IAC3C,kFAAkF;IAClF,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC;CAC9B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,wBAAgB,kBAAkB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,QAAgB,EAChB,aAAa,EAAE,iBAAiB,EAChC,aAAa,EAAE,iBAAiB,EAChC,WAAW,EAAE,eAAe,EAC5B,eAAe,EAAE,mBAAmB,GACvC,EAAE,uBAAuB,GAAG,wBAAwB,CA0FpD"}