@refraction-ui/react 0.4.1 → 0.5.0

package/dist/index.cjs

@@ -3,7 +3,6 @@
 var React11 = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var ReactDOM = require('react-dom');
-var reactHookForm = require('react-hook-form');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -4127,192 +4126,6 @@ var Footer = React11__namespace.forwardRef(
   }
 );
 Footer.displayName = "Footer";
-var Slot = React11__namespace.forwardRef(function Slot2(props, forwardedRef) {
-  const { children, ...slotProps } = props;
-  if (!React11__namespace.isValidElement(children)) {
-    return null;
-  }
-  const childProps = children.props ?? {};
-  const mergedProps = mergeProps(slotProps, childProps);
-  let childRef = childProps.ref;
-  if (childRef === void 0 && !("ref" in childProps)) {
-    childRef = children.ref;
-  }
-  const mergedRef = composeRefs(forwardedRef, childRef);
-  return React11__namespace.cloneElement(
-    children,
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    { ...mergedProps, ref: mergedRef }
-  );
-});
-Slot.displayName = "Slot";
-function mergeProps(slotProps, childProps) {
-  const merged = { ...slotProps };
-  for (const key of Object.keys(childProps)) {
-    const slotValue = slotProps[key];
-    const childValue = childProps[key];
-    if (/^on[A-Z]/.test(key) && typeof slotValue === "function" && typeof childValue === "function") {
-      merged[key] = (...args) => {
-        const child = childValue;
-        const slot = slotValue;
-        child(...args);
-        slot(...args);
-      };
-    } else if (key === "className") {
-      merged[key] = [slotValue, childValue].filter(Boolean).join(" ");
-    } else if (key === "style") {
-      merged[key] = { ...slotValue, ...childValue };
-    } else if (childValue !== void 0) {
-      merged[key] = childValue;
-    }
-  }
-  return merged;
-}
-function composeRefs(...refs) {
-  return (node) => {
-    for (const ref of refs) {
-      if (typeof ref === "function") {
-        ref(node);
-      } else if (ref != null) {
-        const objectRef = ref;
-        objectRef.current = node;
-      }
-    }
-  };
-}
-var Form = reactHookForm.FormProvider;
-var FormFieldContext = React11__namespace.createContext(
-  void 0
-);
-var FormItemContext = React11__namespace.createContext(
-  void 0
-);
-function FormField(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsxRuntime.jsx(reactHookForm.Controller, { ...props }) });
-}
-function useFormField() {
-  const fieldContext = React11__namespace.useContext(FormFieldContext);
-  const itemContext = React11__namespace.useContext(FormItemContext);
-  const formContext = reactHookForm.useFormContext();
-  const { errors } = reactHookForm.useFormState({
-    control: formContext?.control,
-    name: fieldContext?.name,
-    exact: true
-  });
-  if (!fieldContext) {
-    throw new Error("useFormField must be used within a <FormField>");
-  }
-  if (!itemContext) {
-    throw new Error("useFormField must be used within a <FormItem>");
-  }
-  const { id } = itemContext;
-  const error = getNestedError(errors, fieldContext.name);
-  return {
-    id,
-    name: fieldContext.name,
-    formItemId: `${id}-form-item`,
-    formDescriptionId: `${id}-form-item-description`,
-    formMessageId: `${id}-form-item-message`,
-    error,
-    invalid: Boolean(error)
-  };
-}
-function getNestedError(errors, name) {
-  if (!errors) return void 0;
-  const segments = name.replace(/\[(\w+)\]/g, ".$1").split(".");
-  let cursor = errors;
-  for (const seg of segments) {
-    if (cursor && typeof cursor === "object" && seg in cursor) {
-      cursor = cursor[seg];
-    } else {
-      return void 0;
-    }
-  }
-  return cursor;
-}
-var formItemVariants = cva({ base: "space-y-2" });
-var FormItem = React11__namespace.forwardRef(
-  ({ className, ...props }, ref) => {
-    const id = React11__namespace.useId();
-    return /* @__PURE__ */ jsxRuntime.jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn(formItemVariants(), className), ...props }) });
-  }
-);
-FormItem.displayName = "FormItem";
-var formLabelVariants = cva({
-  base: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
-  variants: {
-    invalid: {
-      true: "text-destructive",
-      false: ""
-    }
-  },
-  defaultVariants: {
-    invalid: "false"
-  }
-});
-var FormLabel = React11__namespace.forwardRef(
-  ({ className, ...props }, ref) => {
-    const { invalid, formItemId } = useFormField();
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "label",
-      {
-        ref,
-        htmlFor: formItemId,
-        "data-invalid": invalid ? "" : void 0,
-        className: cn(formLabelVariants({ invalid: invalid ? "true" : "false" }), className),
-        ...props
-      }
-    );
-  }
-);
-FormLabel.displayName = "FormLabel";
-var FormControl = React11__namespace.forwardRef(
-  ({ ...props }, ref) => {
-    const { invalid, formItemId, formDescriptionId, formMessageId } = useFormField();
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      Slot,
-      {
-        ref,
-        id: formItemId,
-        "aria-describedby": invalid ? `${formDescriptionId} ${formMessageId}` : formDescriptionId,
-        "aria-invalid": invalid || void 0,
-        ...props
-      }
-    );
-  }
-);
-FormControl.displayName = "FormControl";
-var FormDescription = React11__namespace.forwardRef(({ className, ...props }, ref) => {
-  const { formDescriptionId } = useFormField();
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "p",
-    {
-      ref,
-      id: formDescriptionId,
-      className: cn("text-sm text-muted-foreground", className),
-      ...props
-    }
-  );
-});
-FormDescription.displayName = "FormDescription";
-var FormMessage = React11__namespace.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    const { error, formMessageId } = useFormField();
-    const body = error?.message ? String(error.message) : children;
-    if (!body) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "p",
-      {
-        ref,
-        id: formMessageId,
-        className: cn("text-sm font-medium text-destructive", className),
-        ...props,
-        children: body
-      }
-    );
-  }
-);
-FormMessage.displayName = "FormMessage";
 
 // ../inline-editor/dist/index.js
 function createInlineEditor(props) {
@@ -7246,21 +7059,22 @@ var voicePillTokens = {
 var voicePillRootStyles = "inline-flex min-w-0 max-w-[min(calc(100vw-2rem),22rem)] items-center gap-3 rounded-full border border-border bg-background px-3 py-2 text-foreground shadow-lg ring-1 ring-border/50 transition-opacity data-[muted=true]:opacity-80";
 var voicePillSpeakerStyles = "[--rfr-voice-pill-accent:hsl(var(--primary))] [--rfr-voice-pill-accent-foreground:hsl(var(--primary-foreground))] data-[speaker=user]:[--rfr-voice-pill-accent:hsl(var(--accent-foreground))] data-[speaker=user]:[--rfr-voice-pill-accent-foreground:hsl(var(--accent))] data-[muted=true]:[--rfr-voice-pill-accent:hsl(var(--muted-foreground))]";
 var voicePillPositionVariants = cva({
-  base: "fixed z-50",
+  base: "z-50",
   variants: {
     position: {
-      "top-start": "top-[calc(env(safe-area-inset-top)+1rem)] left-[calc(env(safe-area-inset-left)+1rem)]",
-      "top-center": "top-[calc(env(safe-area-inset-top)+1rem)] left-1/2 -translate-x-1/2",
-      "top-end": "top-[calc(env(safe-area-inset-top)+1rem)] right-[calc(env(safe-area-inset-right)+1rem)]",
-      "bottom-start": "bottom-[calc(env(safe-area-inset-bottom)+1rem)] left-[calc(env(safe-area-inset-left)+1rem)]",
-      "bottom-center": "bottom-[calc(env(safe-area-inset-bottom)+1rem)] left-1/2 -translate-x-1/2",
-      "bottom-end": "bottom-[calc(env(safe-area-inset-bottom)+1rem)] right-[calc(env(safe-area-inset-right)+1rem)]",
-      "left-start": "left-[calc(env(safe-area-inset-left)+1rem)] top-[calc(env(safe-area-inset-top)+1rem)]",
-      "left-center": "left-[calc(env(safe-area-inset-left)+1rem)] top-1/2 -translate-y-1/2",
-      "left-end": "left-[calc(env(safe-area-inset-left)+1rem)] bottom-[calc(env(safe-area-inset-bottom)+1rem)]",
-      "right-start": "right-[calc(env(safe-area-inset-right)+1rem)] top-[calc(env(safe-area-inset-top)+1rem)]",
-      "right-center": "right-[calc(env(safe-area-inset-right)+1rem)] top-1/2 -translate-y-1/2",
-      "right-end": "right-[calc(env(safe-area-inset-right)+1rem)] bottom-[calc(env(safe-area-inset-bottom)+1rem)]"
+      inline: "relative",
+      "top-start": "fixed top-[calc(env(safe-area-inset-top)+1rem)] left-[calc(env(safe-area-inset-left)+1rem)]",
+      "top-center": "fixed top-[calc(env(safe-area-inset-top)+1rem)] left-1/2 -translate-x-1/2",
+      "top-end": "fixed top-[calc(env(safe-area-inset-top)+1rem)] right-[calc(env(safe-area-inset-right)+1rem)]",
+      "bottom-start": "fixed bottom-[calc(env(safe-area-inset-bottom)+1rem)] left-[calc(env(safe-area-inset-left)+1rem)]",
+      "bottom-center": "fixed bottom-[calc(env(safe-area-inset-bottom)+1rem)] left-1/2 -translate-x-1/2",
+      "bottom-end": "fixed bottom-[calc(env(safe-area-inset-bottom)+1rem)] right-[calc(env(safe-area-inset-right)+1rem)]",
+      "left-start": "fixed left-[calc(env(safe-area-inset-left)+1rem)] top-[calc(env(safe-area-inset-top)+1rem)]",
+      "left-center": "fixed left-[calc(env(safe-area-inset-left)+1rem)] top-1/2 -translate-y-1/2",
+      "left-end": "fixed left-[calc(env(safe-area-inset-left)+1rem)] bottom-[calc(env(safe-area-inset-bottom)+1rem)]",
+      "right-start": "fixed right-[calc(env(safe-area-inset-right)+1rem)] top-[calc(env(safe-area-inset-top)+1rem)]",
+      "right-center": "fixed right-[calc(env(safe-area-inset-right)+1rem)] top-1/2 -translate-y-1/2",
+      "right-end": "fixed right-[calc(env(safe-area-inset-right)+1rem)] bottom-[calc(env(safe-area-inset-bottom)+1rem)]"
     }
   },
   defaultVariants: {
@@ -7401,6 +7215,7 @@ var DEFAULT_WAVEFORM_BAR_COUNT = 48;
 var DEFAULT_WAVEFORM_COLOR = "var(--accent-2)";
 var DEFAULT_WAVEFORM_HEIGHT = 80;
 var DEFAULT_WAVEFORM_INTENSITY = 1;
+var DEFAULT_WAVEFORM_AMPLITUDE = 1;
 var DEFAULT_WAVEFORM_SMOOTHING = 0.8;
 var MAX_BAR_COUNT = 1024;
 var MAX_INTENSITY = 1;
@@ -7416,10 +7231,15 @@ function normalizeIntensity(value) {
   if (value == null || !Number.isFinite(value)) return DEFAULT_WAVEFORM_INTENSITY;
   return Math.min(MAX_INTENSITY, Math.max(0, value));
 }
+function normalizeAmplitude(value) {
+  if (value == null || !Number.isFinite(value)) return DEFAULT_WAVEFORM_AMPLITUDE;
+  return Math.min(1, Math.max(0, value));
+}
 function normalizeWaveformConfig(props = {}) {
   return {
     variant: props.variant ?? "bars",
     intensity: normalizeIntensity(props.intensity),
+    amplitude: normalizeAmplitude(props.amplitude),
     height: props.height ?? DEFAULT_WAVEFORM_HEIGHT,
     width: props.width ?? "100%",
     barCount: normalizeBarCount(props.barCount),
@@ -7434,16 +7254,17 @@ function isWaveformSampleInput(value) {
 function createSilentSamples(count = DEFAULT_WAVEFORM_BAR_COUNT) {
   return new Float32Array(normalizeBarCount(count));
 }
-function createIntensitySamples(intensity = DEFAULT_WAVEFORM_INTENSITY, count = DEFAULT_WAVEFORM_BAR_COUNT) {
+function createIntensitySamples(intensity = DEFAULT_WAVEFORM_INTENSITY, count = DEFAULT_WAVEFORM_BAR_COUNT, phase = 0) {
   const normalizedIntensity = normalizeIntensity(intensity);
   const normalizedCount = normalizeBarCount(count);
   const samples = new Float32Array(normalizedCount);
   if (normalizedIntensity === 0) return samples;
+  const pulse = 0.72 + Math.sin(phase * 1.8) * 0.18;
   for (let i = 0; i < normalizedCount; i += 1) {
     const progress = normalizedCount <= 1 ? 0.5 : i / (normalizedCount - 1);
     const envelope = 0.35 + Math.sin(progress * Math.PI) * 0.65;
-    const carrier = Math.sin(progress * Math.PI * 6);
-    samples[i] = carrier * envelope * normalizedIntensity;
+    const carrier = Math.sin(progress * Math.PI * 6 + phase * 2.8);
+    samples[i] = carrier * envelope * normalizedIntensity * pulse;
   }
   return samples;
 }
@@ -7567,36 +7388,37 @@ function drawWaveform(context, samples, size, options = {}) {
   const variant = options.variant ?? "bars";
   const color = options.color ?? DEFAULT_WAVEFORM_COLOR;
   const intensity = normalizeIntensity(options.intensity ?? DEFAULT_WAVEFORM_INTENSITY);
+  const amplitude = normalizeAmplitude(options.amplitude ?? DEFAULT_WAVEFORM_AMPLITUDE);
   const barCount = normalizeBarCount(options.barCount);
   context.clearRect(0, 0, width, height);
   applyCanvasColor(context, color);
   if (variant === "line") {
-    drawLine(context, samples, width, height, intensity);
+    drawLine(context, samples, width, height, intensity, amplitude);
     return;
   }
   if (variant === "rings") {
-    drawRings(context, samples, width, height, intensity);
+    drawRings(context, samples, width, height, intensity, amplitude);
     return;
   }
-  drawBars(context, samples, width, height, intensity, barCount);
+  drawBars(context, samples, width, height, intensity, amplitude, barCount);
 }
-function drawBars(context, samples, width, height, intensity, barCount) {
+function drawBars(context, samples, width, height, intensity, amplitude, barCount) {
   const bars = scaleWaveformSamples(resampleWaveformSamples(samples, barCount), intensity);
   const slotWidth = width / bars.length;
   const barWidth = Math.max(1, slotWidth * 0.64);
   const center = height / 2;
   for (let i = 0; i < bars.length; i += 1) {
     const value = Math.abs(bars[i]);
-    const barHeight = Math.max(value * height, value > 0 ? 1 : 0);
+    const barHeight = Math.max(value * height * amplitude, value > 0 ? 1 : 0);
     const x = i * slotWidth + (slotWidth - barWidth) / 2;
     const y = center - barHeight / 2;
     context.fillRect(x, y, barWidth, barHeight);
   }
 }
-function drawLine(context, samples, width, height, intensity) {
+function drawLine(context, samples, width, height, intensity, amplitudeScale) {
   const lineSamples = scaleWaveformSamples(samples, intensity);
   const center = height / 2;
-  const amplitude = height * 0.45;
+  const amplitude = height * 0.45 * amplitudeScale;
   context.beginPath();
   for (let i = 0; i < lineSamples.length; i += 1) {
     const x = lineSamples.length <= 1 ? width / 2 : i / (lineSamples.length - 1) * width;
@@ -7612,8 +7434,8 @@ function drawLine(context, samples, width, height, intensity) {
   context.lineJoin = "round";
   context.stroke();
 }
-function drawRings(context, samples, width, height, intensity) {
-  const peak = getWaveformPeak(scaleWaveformSamples(samples, intensity));
+function drawRings(context, samples, width, height, intensity, amplitude) {
+  const peak = getWaveformPeak(scaleWaveformSamples(samples, intensity)) * amplitude;
   const minDimension = Math.min(width, height);
   const centerX = width / 2;
   const centerY = height / 2;
@@ -7663,6 +7485,7 @@ var Waveform = React11__namespace.forwardRef(
     source,
     samples,
     intensity,
+    amplitude,
     variant,
     height,
     width,
@@ -7685,6 +7508,7 @@ var Waveform = React11__namespace.forwardRef(
       source,
       samples,
       intensity,
+      amplitude,
       variant,
       height,
       width,
@@ -7757,7 +7581,7 @@ var Waveform = React11__namespace.forwardRef(
         }
         frame = null;
       };
-      const readSamples = () => {
+      const readSamples = (phase = 0) => {
         if (samples != null) {
           return normalizeWaveformSamples(samples, api.config.barCount);
         }
@@ -7768,15 +7592,15 @@ var Waveform = React11__namespace.forwardRef(
         if (analyser) {
           return readAnalyserSamples(analyser, api.config.barCount, floatBufferRef, byteBufferRef);
         }
-        return createIntensitySamples(api.config.intensity, api.config.barCount);
+        return createIntensitySamples(api.config.intensity, api.config.barCount, phase);
       };
-      const draw = () => {
+      const draw = (time = typeof performance === "undefined" ? 0 : performance.now()) => {
         const context = prepareWaveformCanvas(canvas, {
           ...size,
           pixelRatio: window.devicePixelRatio || 1
         });
         if (!context) return;
-        const nextSamples = readSamples();
+        const nextSamples = readSamples(time / 1e3);
         const renderedSamples = smoothWaveformSamples(
           previousSamplesRef.current ?? void 0,
           nextSamples,
@@ -7787,6 +7611,7 @@ var Waveform = React11__namespace.forwardRef(
           variant: api.config.variant,
           color: resolveCanvasColor(root, api.config.color),
           intensity: api.config.intensity,
+          amplitude: api.config.amplitude,
           barCount: api.config.barCount
         });
       };
@@ -7795,11 +7620,11 @@ var Waveform = React11__namespace.forwardRef(
         if (typeof window.requestAnimationFrame === "function") {
           frame = window.requestAnimationFrame(tick);
         } else {
-          frame = window.setTimeout(() => tick(), 16);
+          frame = window.setTimeout(() => tick(performance.now()), 16);
         }
       };
-      const tick = () => {
-        draw();
+      const tick = (time) => {
+        draw(time);
         schedule();
       };
       draw();
@@ -7819,6 +7644,7 @@ var Waveform = React11__namespace.forwardRef(
       api.config.color,
       api.config.height,
       api.config.intensity,
+      api.config.amplitude,
       api.config.paused,
       api.config.smoothing,
       api.config.variant,
@@ -13632,34 +13458,6 @@ var PaymentButton = React11__namespace.forwardRef(
 );
 PaymentButton.displayName = "PaymentButton";
 
-Object.defineProperty(exports, "Controller", {
-  enumerable: true,
-  get: function () { return reactHookForm.Controller; }
-});
-Object.defineProperty(exports, "FormProvider", {
-  enumerable: true,
-  get: function () { return reactHookForm.FormProvider; }
-});
-Object.defineProperty(exports, "useController", {
-  enumerable: true,
-  get: function () { return reactHookForm.useController; }
-});
-Object.defineProperty(exports, "useForm", {
-  enumerable: true,
-  get: function () { return reactHookForm.useForm; }
-});
-Object.defineProperty(exports, "useFormContext", {
-  enumerable: true,
-  get: function () { return reactHookForm.useFormContext; }
-});
-Object.defineProperty(exports, "useFormState", {
-  enumerable: true,
-  get: function () { return reactHookForm.useFormState; }
-});
-Object.defineProperty(exports, "useWatch", {
-  enumerable: true,
-  get: function () { return reactHookForm.useWatch; }
-});
 exports.Accordion = Accordion;
 exports.AccordionContent = AccordionContent;
 exports.AccordionItem = AccordionItem;
@@ -13753,13 +13551,6 @@ exports.FeedbackDialog = FeedbackDialog;
 exports.FileTree = FileTree;
 exports.FileUpload = FileUpload;
 exports.Footer = Footer;
-exports.Form = Form;
-exports.FormControl = FormControl;
-exports.FormDescription = FormDescription;
-exports.FormField = FormField;
-exports.FormItem = FormItem;
-exports.FormLabel = FormLabel;
-exports.FormMessage = FormMessage;
 exports.IconSystem = IconSystem;
 exports.InlineEditor = InlineEditor;
 exports.Input = Input;
@@ -13823,7 +13614,6 @@ exports.Skeleton = Skeleton;
 exports.SkeletonText = SkeletonText;
 exports.SkipToContent = SkipToContent;
 exports.SlideViewer = SlideViewer;
-exports.Slot = Slot;
 exports.StatsGrid = StatsGrid;
 exports.StatusIndicator = StatusIndicator;
 exports.Step = Step;
@@ -13914,8 +13704,6 @@ exports.fileUploadDropZoneVariants = fileUploadDropZoneVariants;
 exports.fileUploadFileItemStyles = fileUploadFileItemStyles;
 exports.fileUploadFileListStyles = fileUploadFileListStyles;
 exports.footerVariants = footerVariants;
-exports.formItemVariants = formItemVariants;
-exports.formLabelVariants = formLabelVariants;
 exports.formatFileSize = formatFileSize;
 exports.formatRelativeTime = formatRelativeTime;
 exports.formatShortcut = formatShortcut;
@@ -14033,7 +13821,6 @@ exports.toolbarVariants = toolbarVariants;
 exports.tooltipContentVariants = tooltipContentVariants;
 exports.typewriterVariants = typewriterVariants;
 exports.useAuth = useAuth;
-exports.useFormField = useFormField;
 exports.useShortcut = useShortcut;
 exports.useToast = useToast;
 exports.versionSelectorOptionVariants = versionSelectorOptionVariants;