// axi0 Motion 0.2.0: Send. A quick airy lift for sending a message.
// Generated from src/send-lift/meta.json by motion-pack: a thin wrapper. The loader (motion.js) must be on the page once;
// it starts the effect on the element this renders. Options left out keep the effect's own defaults.
import { createElement } from "react";
import type { HTMLAttributes, ReactNode } from "react";

export interface SendLiftProps extends HTMLAttributes<HTMLElement> {
  /** loudness of this sound on top of the page level, which starts quiet (default 1) */
  volume?: number;
  /** semitones up or down (default 0) */
  pitch?: number;
  /** darker below 0, brighter above 0 (default 0) */
  tone?: number;
  /** stretches (above 1) or shortens (below 1) the sound (default 1) */
  length?: number;
  /** how much of the soft room around it (default 0.12) */
  space?: number;
  /** click, press (pointer down), hover (mouse only), focus, key (typing in a field) or input (a slider moving) (default "click") */
  on?: "click" | "press" | "hover" | "focus" | "key" | "input";
  /** The element to render (default "button") */
  as?: string;
  children?: ReactNode;
}

const s = (v: unknown) => (v === undefined ? undefined : String(v));

export function SendLift({ as = "button", volume, pitch, tone, length, space, on, ...rest }: SendLiftProps) {
  return createElement(as, { ...rest, "data-sound": "send-lift", "data-motion-volume": s(volume), "data-motion-pitch": s(pitch), "data-motion-tone": s(tone), "data-motion-length": s(length), "data-motion-space": s(space), "data-motion-on": s(on) });
}

export default SendLift;