@mieweb/ui 0.6.1 → 0.7.0-dev.179

package/dist/{chunk-K7IGBNZA.cjs → chunk-TR2OJKQ4.cjs}

@@ -25,12 +25,17 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-function MicIcon({ className }) {
+function MicIcon({
+  className,
+  size = 20
+}) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
+      width: size,
+      height: size,
       fill: "none",
       stroke: "currentColor",
       strokeWidth: "2",
@@ -46,12 +51,17 @@ function MicIcon({ className }) {
     }
   );
 }
-function MicOffIcon({ className }) {
+function MicOffIcon({
+  className,
+  size = 20
+}) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
+      width: size,
+      height: size,
       fill: "none",
       stroke: "currentColor",
       strokeWidth: "2",
@@ -70,12 +80,17 @@ function MicOffIcon({ className }) {
     }
   );
 }
-function StopIcon({ className }) {
+function StopIcon({
+  className,
+  size = 20
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
+      width: size,
+      height: size,
       fill: "currentColor",
       className,
       "aria-hidden": "true",
@@ -83,12 +98,17 @@ function StopIcon({ className }) {
     }
   );
 }
-function CheckIcon({ className }) {
+function CheckIcon({
+  className,
+  size = 20
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
+      width: size,
+      height: size,
       fill: "none",
       stroke: "currentColor",
       strokeWidth: "2.5",
@@ -100,12 +120,17 @@ function CheckIcon({ className }) {
     }
   );
 }
-function LoadingSpinner({ className }) {
+function LoadingSpinner({
+  className,
+  size = 20
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 24 24",
+      width: size,
+      height: size,
       fill: "none",
       stroke: "currentColor",
       strokeWidth: "2",
@@ -140,6 +165,7 @@ function PulseRings({ variant }) {
 }
 function WaveformBars({ size }) {
   const barHeight = size === "sm" ? "h-2" : size === "md" ? "h-3" : "h-4";
+  const barHeightRem = size === "sm" ? "0.5rem" : size === "md" ? "0.75rem" : "1rem";
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -153,6 +179,8 @@ function WaveformBars({ size }) {
             barHeight
           ),
           style: {
+            width: "0.125rem",
+            height: barHeightRem,
             animationDelay: `${i * 0.1}s`
           }
         },
@@ -192,6 +220,11 @@ var iconSizes = {
   md: "size-5",
   lg: "size-6"
 };
+var iconPxSizes = {
+  sm: 16,
+  md: 20,
+  lg: 24
+};
 function getStateStyles(state, variant) {
   const styles = {
     default: {
@@ -296,6 +329,7 @@ var RecordButton = React__namespace.forwardRef(
       }
     }, [disabled, controlledState, transcriptionState]);
     const iconSize = iconSizes[size];
+    const iconPx = iconPxSizes[size];
     const isRecording = effectiveState === "recording";
     const isDisabled = effectiveState === "disabled" || effectiveState === "processing";
     React__namespace.useEffect(() => {
@@ -410,16 +444,16 @@ var RecordButton = React__namespace.forwardRef(
           if (showWaveform) {
             return /* @__PURE__ */ jsxRuntime.jsx(WaveformBars, { size });
           }
-          return recordingIcon || /* @__PURE__ */ jsxRuntime.jsx(StopIcon, { className: iconSize });
+          return recordingIcon || /* @__PURE__ */ jsxRuntime.jsx(StopIcon, { className: iconSize, size: iconPx });
         case "processing":
-          return /* @__PURE__ */ jsxRuntime.jsx(LoadingSpinner, { className: iconSize });
+          return /* @__PURE__ */ jsxRuntime.jsx(LoadingSpinner, { className: iconSize, size: iconPx });
         case "disabled":
         case "error":
-          return /* @__PURE__ */ jsxRuntime.jsx(MicOffIcon, { className: iconSize });
+          return /* @__PURE__ */ jsxRuntime.jsx(MicOffIcon, { className: iconSize, size: iconPx });
         case "success":
-          return /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, { className: iconSize });
+          return /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, { className: iconSize, size: iconPx });
         default:
-          return idleIcon || /* @__PURE__ */ jsxRuntime.jsx(MicIcon, { className: iconSize });
+          return idleIcon || /* @__PURE__ */ jsxRuntime.jsx(MicIcon, { className: iconSize, size: iconPx });
       }
     };
     const getAriaLabel = () => {
@@ -498,5 +532,5 @@ RecordButton.displayName = "RecordButton";
 exports.RecordButton = RecordButton;
 exports.formatDuration = formatDuration;
 exports.recordButtonVariants = recordButtonVariants;
-//# sourceMappingURL=chunk-K7IGBNZA.cjs.map
-//# sourceMappingURL=chunk-K7IGBNZA.cjs.map
+//# sourceMappingURL=chunk-TR2OJKQ4.cjs.map
+//# sourceMappingURL=chunk-TR2OJKQ4.cjs.map

package/dist/chunk-TR2OJKQ4.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/RecordButton/RecordButton.tsx"],"names":["jsxs","jsx","cn","Fragment","cva","React"],"mappings":"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","file":"chunk-TR2OJKQ4.cjs","sourcesContent":["import * as React from 'react';\nimport { cva } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type RecordButtonState =\n  | 'idle'\n  | 'recording'\n  | 'processing'\n  | 'disabled'\n  | 'error'\n  | 'success';\n\nexport type RecordButtonVariant = 'default' | 'outline' | 'ghost' | 'minimal';\nexport type RecordButtonSize = 'sm' | 'md' | 'lg';\n\n/** Transcription state for integration with transcription services */\nexport type TranscriptionState =\n  | 'idle'\n  | 'recording'\n  | 'transcribing'\n  | 'streaming'\n  | 'complete'\n  | 'error';\n\nexport interface TranscriptionResult {\n  /** The transcribed text */\n  text: string;\n  /** Whether this is a partial (streaming) or final result */\n  isFinal: boolean;\n  /** Confidence score (0-1) if available */\n  confidence?: number;\n}\n\nexport interface RecordButtonProps extends Omit<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  'children'\n> {\n  /** Current state of the button */\n  state?: RecordButtonState;\n  /** Size of the button */\n  size?: RecordButtonSize;\n  /** Visual style variant */\n  variant?: RecordButtonVariant;\n  /** Show waveform bars when recording (instead of stop icon) */\n  showWaveform?: boolean;\n  /** Show pulse rings when recording */\n  showPulse?: boolean;\n  /** Show recording duration while recording */\n  showDuration?: boolean;\n  /** Custom idle icon */\n  idleIcon?: React.ReactNode;\n  /** Custom recording icon */\n  recordingIcon?: React.ReactNode;\n  /** Current transcription state (for external control) */\n  transcriptionState?: TranscriptionState;\n  /** Show transcription state indicator */\n  showTranscriptionState?: boolean;\n\n  // Recording callbacks (for uncontrolled usage)\n  /** Callback when recording is complete with the audio blob */\n  onRecordingComplete?: (blob: Blob, duration: number) => void;\n  /** Callback when recording starts */\n  onRecordingStart?: () => void;\n  /** Callback when a recording error occurs */\n  onRecordingError?: (error: Error) => void;\n  /** Maximum recording duration in seconds (0 for unlimited) */\n  maxDuration?: number;\n  /** Audio MIME type */\n  mimeType?: string;\n}\n\n// ============================================================================\n// Icons\n// ============================================================================\n\nfunction MicIcon({\n  className,\n  size = 20,\n}: {\n  className?: string;\n  size?: number;\n}) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      width={size}\n      height={size}\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className={className}\n      aria-hidden=\"true\"\n    >\n      <path d=\"M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z\" />\n      <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\" />\n      <line x1=\"12\" x2=\"12\" y1=\"19\" y2=\"22\" />\n    </svg>\n  );\n}\n\nfunction MicOffIcon({\n  className,\n  size = 20,\n}: {\n  className?: string;\n  size?: number;\n}) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      width={size}\n      height={size}\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className={className}\n      aria-hidden=\"true\"\n    >\n      <line x1=\"2\" x2=\"22\" y1=\"2\" y2=\"22\" />\n      <path d=\"M18.89 13.23A7.12 7.12 0 0 0 19 12v-2\" />\n      <path d=\"M5 10v2a7 7 0 0 0 12 5\" />\n      <path d=\"M15 9.34V5a3 3 0 0 0-5.68-1.33\" />\n      <path d=\"M9 9v3a3 3 0 0 0 5.12 2.12\" />\n      <line x1=\"12\" x2=\"12\" y1=\"19\" y2=\"22\" />\n    </svg>\n  );\n}\n\nfunction StopIcon({\n  className,\n  size = 20,\n}: {\n  className?: string;\n  size?: number;\n}) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      width={size}\n      height={size}\n      fill=\"currentColor\"\n      className={className}\n      aria-hidden=\"true\"\n    >\n      <rect x=\"6\" y=\"6\" width=\"12\" height=\"12\" rx=\"2\" />\n    </svg>\n  );\n}\n\nfunction CheckIcon({\n  className,\n  size = 20,\n}: {\n  className?: string;\n  size?: number;\n}) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      width={size}\n      height={size}\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className={className}\n      aria-hidden=\"true\"\n    >\n      <polyline points=\"20 6 9 17 4 12\" />\n    </svg>\n  );\n}\n\nfunction LoadingSpinner({\n  className,\n  size = 20,\n}: {\n  className?: string;\n  size?: number;\n}) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      width={size}\n      height={size}\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className={cn('animate-spin', className)}\n      aria-hidden=\"true\"\n    >\n      <path d=\"M21 12a9 9 0 1 1-6.219-8.56\" />\n    </svg>\n  );\n}\n\n// ============================================================================\n// Pulse Ring Animation (for recording state)\n// ============================================================================\n\nfunction PulseRings({ variant }: { variant: RecordButtonVariant }) {\n  const ringColor = variant === 'minimal' ? 'bg-red-500/30' : 'bg-red-400/40';\n\n  return (\n    <>\n      <span\n        data-slot=\"record-button-pulse\"\n        className={cn('absolute inset-0 animate-ping rounded-full', ringColor)}\n        style={{ animationDuration: '1.5s' }}\n      />\n      <span\n        data-slot=\"record-button-pulse\"\n        className={cn('absolute inset-0 animate-ping rounded-full', ringColor)}\n        style={{ animationDuration: '1.5s', animationDelay: '0.5s' }}\n      />\n    </>\n  );\n}\n\n// ============================================================================\n// Waveform Animation (for recording state)\n// ============================================================================\n\nfunction WaveformBars({ size }: { size: RecordButtonSize }) {\n  const barHeight = size === 'sm' ? 'h-2' : size === 'md' ? 'h-3' : 'h-4';\n  // rem fallback (matching the Tailwind utility values: h-2/h-3/h-4) so the\n  // bars still render if the consuming app's CSS build does not include these\n  // size utilities. Using rem (not px) keeps scaling consistent with the\n  // utilities and lets condensed `!important` overrides still win.\n  const barHeightRem =\n    size === 'sm' ? '0.5rem' : size === 'md' ? '0.75rem' : '1rem';\n\n  return (\n    <div\n      data-slot=\"record-button-waveform\"\n      className=\"flex items-center gap-0.5\"\n    >\n      {[0, 1, 2, 3, 4].map((i) => (\n        <span\n          key={i}\n          className={cn(\n            'animate-waveform w-0.5 rounded-full bg-current',\n            barHeight\n          )}\n          style={{\n            width: '0.125rem',\n            height: barHeightRem,\n            animationDelay: `${i * 0.1}s`,\n          }}\n        />\n      ))}\n    </div>\n  );\n}\n\n// ============================================================================\n// Style Variants\n// ============================================================================\n\nconst recordButtonVariants = cva(\n  [\n    'relative inline-flex items-center justify-center rounded-full',\n    'transition-all duration-200',\n    'outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',\n  ],\n  {\n    variants: {\n      variant: {\n        default: '',\n        outline: 'border-2',\n        ghost: '',\n        minimal: '',\n      },\n      size: {\n        sm: 'size-10',\n        md: 'size-12',\n        lg: 'size-14',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'md',\n    },\n  }\n);\n\nconst iconSizes: Record<RecordButtonSize, string> = {\n  sm: 'size-4',\n  md: 'size-5',\n  lg: 'size-6',\n};\n\n// Intrinsic px sizes mirroring `iconSizes`, applied as width/height attributes\n// so the icons render at the correct size even when a consuming app's CSS build\n// does not include the Tailwind size utilities (e.g. it only scans its own\n// source and not node_modules/@mieweb/ui).\nconst iconPxSizes: Record<RecordButtonSize, number> = {\n  sm: 16,\n  md: 20,\n  lg: 24,\n};\n\n// ============================================================================\n// State Styles\n// ============================================================================\n\nfunction getStateStyles(\n  state: RecordButtonState,\n  variant: RecordButtonVariant\n): string {\n  const styles: Record<\n    RecordButtonVariant,\n    Record<RecordButtonState, string>\n  > = {\n    default: {\n      idle: 'bg-primary/10 text-primary hover:bg-primary/20',\n      recording: 'bg-red-500/10 text-red-500 hover:bg-red-500/20',\n      processing: 'bg-primary/10 text-primary cursor-wait',\n      disabled: 'bg-muted text-muted-foreground cursor-not-allowed opacity-50',\n      error: 'bg-destructive/10 text-destructive',\n      success: 'bg-success/10 text-success',\n    },\n    outline: {\n      idle: 'border-primary/50 text-primary bg-transparent hover:bg-primary/10 hover:border-primary',\n      recording:\n        'border-red-500/50 text-red-500 bg-transparent hover:bg-red-500/10 hover:border-red-500',\n      processing: 'border-primary/50 text-primary bg-transparent cursor-wait',\n      disabled:\n        'border-muted text-muted-foreground bg-transparent cursor-not-allowed opacity-50',\n      error: 'border-destructive/50 text-destructive bg-transparent',\n      success: 'border-success/50 text-success bg-transparent',\n    },\n    ghost: {\n      idle: 'text-primary hover:bg-primary/10',\n      recording: 'text-red-500 hover:bg-red-500/10',\n      processing: 'text-primary bg-primary/5 cursor-wait',\n      disabled: 'text-muted-foreground cursor-not-allowed opacity-50',\n      error: 'text-destructive',\n      success: 'text-success',\n    },\n    minimal: {\n      idle: 'text-primary hover:text-primary/80',\n      recording: 'text-red-500 hover:text-red-500/80',\n      processing: 'text-primary cursor-wait',\n      disabled: 'text-muted-foreground/40 cursor-not-allowed',\n      error: 'text-destructive',\n      success: 'text-success',\n    },\n  };\n\n  return styles[variant][state];\n}\n\n// ============================================================================\n// Helper Functions\n// ============================================================================\n\nfunction formatDuration(seconds: number): string {\n  const mins = Math.floor(seconds / 60);\n  const secs = Math.floor(seconds % 60);\n  return `${mins}:${secs.toString().padStart(2, '0')}`;\n}\n\n// ============================================================================\n// Main Component\n// ============================================================================\n\n/**\n * A voice recording button with 6 states and 4 visual variants.\n * Supports pulse animations, waveform visualization, and transcription integration.\n *\n * ## Controlled vs Uncontrolled Mode\n *\n * **Uncontrolled mode** (default): The component manages its own recording state.\n * Use `onRecordingComplete`, `onRecordingStart`, and `onRecordingError` callbacks.\n *\n * **Controlled mode**: When the `state` prop is provided, the component becomes\n * controlled and you must manage state changes externally. Note: In controlled mode,\n * the internal MediaRecorder functionality is disabled - you must implement your own\n * recording logic.\n *\n * ## State Precedence\n *\n * When multiple state-controlling props are provided, they follow this precedence:\n * 1. `disabled` prop (highest priority)\n * 2. `transcriptionState` prop\n * 3. `state` prop\n * 4. Internal state (uncontrolled)\n *\n * @example\n * ```tsx\n * // Uncontrolled with recording callbacks\n * <RecordButton\n *   onRecordingComplete={(blob, duration) => console.log('Recorded:', blob)}\n *   onRecordingError={(error) => console.error('Recording failed:', error)}\n * />\n *\n * // Controlled state (requires external recording implementation)\n * <RecordButton state=\"idle\" onClick={handleClick} />\n *\n * // Different variants\n * <RecordButton variant=\"outline\" size=\"lg\" />\n *\n * // With waveform animation\n * <RecordButton state=\"recording\" showWaveform showPulse />\n * ```\n */\nconst RecordButton = React.forwardRef<HTMLButtonElement, RecordButtonProps>(\n  (\n    {\n      className,\n      variant = 'default',\n      size = 'md',\n      state: controlledState,\n      showWaveform = false,\n      showPulse = true,\n      disabled,\n      showDuration = false,\n      idleIcon,\n      recordingIcon,\n      transcriptionState,\n      showTranscriptionState = false,\n      onRecordingComplete,\n      onRecordingStart,\n      onRecordingError,\n      maxDuration = 0,\n      mimeType = 'audio/webm',\n      onClick,\n      ...props\n    },\n    ref\n  ) => {\n    // Internal state for uncontrolled usage\n    const [internalState, setInternalState] =\n      React.useState<RecordButtonState>('idle');\n    const [duration, setDuration] = React.useState(0);\n\n    const mediaRecorderRef = React.useRef<MediaRecorder | null>(null);\n    const streamRef = React.useRef<MediaStream | null>(null);\n    const chunksRef = React.useRef<Blob[]>([]);\n    const timerRef = React.useRef<number | undefined>(undefined);\n    const startTimeRef = React.useRef<number>(0);\n    const timeoutsRef = React.useRef<NodeJS.Timeout[]>([]);\n\n    // Helper to track and manage timeouts\n    const addTimeout = (callback: () => void, delay: number) => {\n      const id = setTimeout(() => {\n        callback();\n        // Remove from tracking after execution\n        timeoutsRef.current = timeoutsRef.current.filter((t) => t !== id);\n      }, delay);\n      timeoutsRef.current.push(id);\n      return id;\n    };\n\n    const clearAllTimeouts = () => {\n      timeoutsRef.current.forEach(clearTimeout);\n      timeoutsRef.current = [];\n    };\n\n    // Use controlled state if provided, otherwise internal state\n    const isControlled = controlledState !== undefined;\n    const currentState = isControlled ? controlledState : internalState;\n\n    // Map transcription state to button state if provided\n    // Precedence: disabled prop → transcriptionState → state prop → internal state\n    const effectiveState: RecordButtonState = disabled\n      ? 'disabled'\n      : transcriptionState === 'error'\n        ? 'error'\n        : transcriptionState === 'transcribing' ||\n            transcriptionState === 'streaming'\n          ? 'processing'\n          : transcriptionState === 'complete'\n            ? 'success'\n            : currentState;\n\n    // Dev mode warnings for conflicting states\n    React.useEffect(() => {\n      // Only warn in development\n      if (typeof window === 'undefined') return;\n\n      // Warn when disabled is true but other state props suggest a different visual state\n      if (\n        disabled &&\n        ((controlledState && controlledState !== 'disabled') ||\n          transcriptionState)\n      ) {\n        console.warn(\n          '[RecordButton]: `disabled` prop takes precedence over both `state` and `transcriptionState`. ' +\n            'When `disabled` is true, the button will always appear disabled.'\n        );\n      }\n\n      // Warn when both controlled state and transcriptionState are provided and conflict\n      if (controlledState !== undefined && transcriptionState !== undefined) {\n        const mappedTranscriptionState: RecordButtonState | undefined =\n          transcriptionState === 'error'\n            ? 'error'\n            : transcriptionState === 'transcribing' ||\n                transcriptionState === 'streaming'\n              ? 'processing'\n              : transcriptionState === 'complete'\n                ? 'success'\n                : undefined;\n\n        if (\n          mappedTranscriptionState !== undefined &&\n          mappedTranscriptionState !== controlledState\n        ) {\n          console.warn(\n            '[RecordButton]: `transcriptionState` takes precedence over `state`. ' +\n              `Received state=\"${controlledState}\" and transcriptionState=\"${transcriptionState}\". ` +\n              'This may lead to unexpected visual states.'\n          );\n        }\n      }\n    }, [disabled, controlledState, transcriptionState]);\n\n    const iconSize = iconSizes[size];\n    const iconPx = iconPxSizes[size];\n    const isRecording = effectiveState === 'recording';\n    const isDisabled =\n      effectiveState === 'disabled' || effectiveState === 'processing';\n\n    // Cleanup on unmount\n    React.useEffect(() => {\n      return () => {\n        if (timerRef.current) {\n          clearInterval(timerRef.current);\n        }\n        clearAllTimeouts();\n        if (streamRef.current) {\n          streamRef.current.getTracks().forEach((track) => track.stop());\n        }\n      };\n    }, []);\n\n    const stopRecording = React.useCallback(() => {\n      if (timerRef.current) {\n        clearInterval(timerRef.current);\n      }\n\n      if (\n        mediaRecorderRef.current &&\n        mediaRecorderRef.current.state !== 'inactive'\n      ) {\n        mediaRecorderRef.current.stop();\n      }\n\n      if (streamRef.current) {\n        streamRef.current.getTracks().forEach((track) => track.stop());\n      }\n    }, []);\n\n    const startRecording = React.useCallback(async () => {\n      // Guard: don't start if disabled, already recording, or processing\n      if (\n        disabled ||\n        effectiveState === 'recording' ||\n        effectiveState === 'processing'\n      )\n        return;\n\n      try {\n        const stream = await navigator.mediaDevices.getUserMedia({\n          audio: true,\n        });\n        streamRef.current = stream;\n\n        const options = { mimeType };\n        if (!MediaRecorder.isTypeSupported(mimeType)) {\n          mediaRecorderRef.current = new MediaRecorder(stream);\n        } else {\n          mediaRecorderRef.current = new MediaRecorder(stream, options);\n        }\n\n        chunksRef.current = [];\n\n        mediaRecorderRef.current.ondataavailable = (e) => {\n          if (e.data.size > 0) {\n            chunksRef.current.push(e.data);\n          }\n        };\n\n        mediaRecorderRef.current.onstop = () => {\n          if (!isControlled) {\n            setInternalState('processing');\n          }\n\n          const blob = new Blob(chunksRef.current, { type: mimeType });\n          const finalDuration = duration;\n\n          // Small delay to show processing state\n          addTimeout(() => {\n            onRecordingComplete?.(blob, finalDuration);\n            if (!isControlled) {\n              setInternalState('success');\n              // Reset to idle after showing success\n              addTimeout(() => {\n                setInternalState('idle');\n              }, 1500);\n            }\n            setDuration(0);\n          }, 200);\n        };\n\n        mediaRecorderRef.current.start(100);\n        startTimeRef.current = Date.now();\n\n        if (!isControlled) {\n          setInternalState('recording');\n        }\n        onRecordingStart?.();\n\n        timerRef.current = window.setInterval(() => {\n          const elapsed = (Date.now() - startTimeRef.current) / 1000;\n          setDuration(elapsed);\n\n          if (maxDuration > 0 && elapsed >= maxDuration) {\n            stopRecording();\n          }\n        }, 100);\n      } catch (error) {\n        onRecordingError?.(error as Error);\n        if (!isControlled) {\n          setInternalState('error');\n          // Reset to idle after showing error\n          addTimeout(() => {\n            setInternalState('idle');\n          }, 2000);\n        }\n      }\n    }, [\n      disabled,\n      effectiveState,\n      isControlled,\n      mimeType,\n      maxDuration,\n      duration,\n      onRecordingComplete,\n      onRecordingStart,\n      onRecordingError,\n      stopRecording,\n    ]);\n\n    const handleClick = React.useCallback(\n      (e: React.MouseEvent<HTMLButtonElement>) => {\n        // Call external onClick if provided\n        onClick?.(e);\n\n        // Handle internal recording logic only if not fully controlled\n        if (!isControlled) {\n          if (effectiveState === 'recording') {\n            stopRecording();\n          } else if (effectiveState === 'idle') {\n            startRecording();\n          }\n        }\n      },\n      [onClick, isControlled, effectiveState, startRecording, stopRecording]\n    );\n\n    // Determine which icon to show\n    const renderIcon = () => {\n      switch (effectiveState) {\n        case 'recording':\n          if (showWaveform) {\n            return <WaveformBars size={size} />;\n          }\n          return (\n            recordingIcon || <StopIcon className={iconSize} size={iconPx} />\n          );\n        case 'processing':\n          return <LoadingSpinner className={iconSize} size={iconPx} />;\n        case 'disabled':\n        case 'error':\n          return <MicOffIcon className={iconSize} size={iconPx} />;\n        case 'success':\n          return <CheckIcon className={iconSize} size={iconPx} />;\n        default:\n          return idleIcon || <MicIcon className={iconSize} size={iconPx} />;\n      }\n    };\n\n    const getAriaLabel = () => {\n      switch (effectiveState) {\n        case 'recording':\n          return 'Stop recording';\n        case 'processing':\n          return 'Processing recording';\n        case 'disabled':\n          return 'Recording unavailable';\n        case 'error':\n          return 'Recording failed';\n        case 'success':\n          return 'Recording complete';\n        default:\n          return 'Start recording';\n      }\n    };\n\n    const getTranscriptionLabel = () => {\n      if (transcriptionState === 'streaming') return 'Listening...';\n      if (transcriptionState === 'transcribing') return 'Transcribing...';\n      return null;\n    };\n\n    return (\n      <div\n        data-slot=\"record-button\"\n        className=\"relative inline-flex items-center gap-2\"\n      >\n        <button\n          ref={ref}\n          type=\"button\"\n          disabled={isDisabled}\n          onClick={handleClick}\n          {...props}\n          data-slot=\"record-button-trigger\"\n          className={cn(\n            recordButtonVariants({ variant, size }),\n            getStateStyles(effectiveState, variant),\n            className\n          )}\n          aria-label={getAriaLabel()}\n          aria-pressed={effectiveState === 'recording' ? true : undefined}\n          aria-busy={effectiveState === 'processing' ? true : undefined}\n        >\n          {/* Pulse animation for recording state */}\n          {effectiveState === 'recording' && showPulse && (\n            <PulseRings variant={variant} />\n          )}\n\n          {/* Icon */}\n          <span data-slot=\"record-button-icon\" className=\"relative z-10\">\n            {renderIcon()}\n          </span>\n        </button>\n\n        {/* Duration display */}\n        {showDuration && isRecording && (\n          <span\n            data-slot=\"record-button-duration\"\n            className=\"text-destructive font-mono text-xs tabular-nums\"\n          >\n            {formatDuration(duration)}\n          </span>\n        )}\n\n        {/* Transcription state label */}\n        {showTranscriptionState && getTranscriptionLabel() && (\n          <span\n            data-slot=\"record-button-transcription\"\n            className=\"text-primary text-xs font-medium\"\n          >\n            {getTranscriptionLabel()}\n          </span>\n        )}\n      </div>\n    );\n  }\n);\n\nRecordButton.displayName = 'RecordButton';\n\n// ============================================================================\n// Exports\n// ============================================================================\n\nexport { RecordButton, recordButtonVariants, formatDuration };\n"]}

package/dist/chunk-UFYXU7KV.js

@@ -0,0 +1,135 @@
+import { FenceBlock } from './chunk-RHYIFIT5.js';
+import { Button } from './chunk-ZVSW2KS6.js';
+import { Code, Eye, Maximize2 } from 'lucide-react';
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+function isFullDocument(html) {
+  return /<!DOCTYPE|<html/i.test(html);
+}
+function wrapFragment(html) {
+  return `<!DOCTYPE html>
+<html>
+<head><meta charset="utf-8"><style>body{margin:0;padding:8px;font-family:system-ui,sans-serif;font-size:14px}</style></head>
+<body>${html}</body>
+</html>`;
+}
+var HtmlPreviewBlock = ({
+  code,
+  id
+}) => {
+  const [showPreview, setShowPreview] = useState(false);
+  const [expanded, setExpanded] = useState(false);
+  const iframeRef = useRef(null);
+  const [iframeHeight, setIframeHeight] = useState(200);
+  const srcdoc = isFullDocument(code) ? code : wrapFragment(code);
+  useEffect(() => {
+    function handleMessage(event) {
+      if (event.origin !== "null" && event.origin !== window.location.origin)
+        return;
+      if (event.source !== iframeRef.current?.contentWindow) return;
+      if (event.data?.type === "HTML_PREVIEW_RESIZE" && event.data?.id === id) {
+        setIframeHeight(Math.min(Math.max(event.data.height, 200), 4e3));
+      }
+    }
+    window.addEventListener("message", handleMessage);
+    return () => window.removeEventListener("message", handleMessage);
+  }, [id]);
+  useEffect(() => {
+    if (!expanded) return;
+    function handleKey(e) {
+      if (e.key === "Escape") setExpanded(false);
+    }
+    document.addEventListener("keydown", handleKey);
+    return () => document.removeEventListener("keydown", handleKey);
+  }, [expanded]);
+  const togglePreview = useCallback(() => setShowPreview((v) => !v), []);
+  const headerActions = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant: "ghost",
+        size: "sm",
+        onClick: togglePreview,
+        className: "h-7 gap-1 px-2 text-xs",
+        children: [
+          showPreview ? /* @__PURE__ */ jsx(Code, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(Eye, { className: "h-3 w-3" }),
+          showPreview ? "Code" : "Preview"
+        ]
+      }
+    ),
+    showPreview && /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        size: "sm",
+        onClick: () => setExpanded(true),
+        className: "h-7 w-7 p-0",
+        "aria-label": "Expand preview",
+        children: /* @__PURE__ */ jsx(Maximize2, { className: "h-3 w-3" })
+      }
+    )
+  ] });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(FenceBlock, { code, language: "html", headerActions, children: /* @__PURE__ */ jsx("div", { className: "relative", children: showPreview ? /* @__PURE__ */ jsx(
+      "iframe",
+      {
+        ref: iframeRef,
+        srcDoc: srcdoc,
+        sandbox: "allow-scripts allow-forms",
+        referrerPolicy: "no-referrer",
+        className: "w-full border-0",
+        style: { height: iframeHeight },
+        title: "HTML Preview"
+      }
+    ) : /* @__PURE__ */ jsx("pre", { className: "overflow-x-auto p-3 text-sm", children: /* @__PURE__ */ jsx("code", { children: code }) }) }) }),
+    expanded && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50",
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": "HTML Preview",
+        children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Close preview",
+              className: "absolute inset-0 h-full w-full cursor-default border-0 bg-transparent p-0",
+              onClick: () => setExpanded(false)
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "relative h-[90vh] w-[90vw] overflow-hidden rounded-lg bg-white shadow-xl dark:bg-neutral-900", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b border-neutral-200 px-4 py-2 dark:border-neutral-700", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: "HTML Preview" }),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: () => setExpanded(false),
+                  children: "Close"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx(
+              "iframe",
+              {
+                srcDoc: srcdoc,
+                sandbox: "allow-scripts allow-forms",
+                referrerPolicy: "no-referrer",
+                className: "h-full w-full border-0",
+                title: "HTML Preview (expanded)"
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+};
+
+export { HtmlPreviewBlock };
+//# sourceMappingURL=chunk-UFYXU7KV.js.map
+//# sourceMappingURL=chunk-UFYXU7KV.js.map

package/dist/chunk-UFYXU7KV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Markdown/HtmlPreviewBlock.tsx"],"names":[],"mappings":"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","file":"chunk-UFYXU7KV.js","sourcesContent":["/** Sandboxed iframe preview for HTML code blocks. */\nimport { Code, Eye, Maximize2 } from 'lucide-react';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../Button';\nimport { FenceBlock } from './FenceBlock';\n\ninterface HtmlPreviewBlockProps {\n  code: string;\n  id: string;\n}\n\nfunction isFullDocument(html: string): boolean {\n  return /<!DOCTYPE|<html/i.test(html);\n}\n\nfunction wrapFragment(html: string): string {\n  return `<!DOCTYPE html>\n<html>\n<head><meta charset=\"utf-8\"><style>body{margin:0;padding:8px;font-family:system-ui,sans-serif;font-size:14px}</style></head>\n<body>${html}</body>\n</html>`;\n}\n\nexport const HtmlPreviewBlock: React.FC<HtmlPreviewBlockProps> = ({\n  code,\n  id,\n}) => {\n  const [showPreview, setShowPreview] = useState(false);\n  const [expanded, setExpanded] = useState(false);\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const [iframeHeight, setIframeHeight] = useState(200);\n\n  const srcdoc = isFullDocument(code) ? code : wrapFragment(code);\n\n  useEffect(() => {\n    function handleMessage(event: globalThis.MessageEvent) {\n      // Sandboxed srcDoc iframes report origin \"null\"; validate source to prevent spoofing.\n      if (event.origin !== 'null' && event.origin !== window.location.origin)\n        return;\n      if (event.source !== iframeRef.current?.contentWindow) return;\n      if (event.data?.type === 'HTML_PREVIEW_RESIZE' && event.data?.id === id) {\n        setIframeHeight(Math.min(Math.max(event.data.height, 200), 4000));\n      }\n    }\n    window.addEventListener('message', handleMessage);\n    return () => window.removeEventListener('message', handleMessage);\n  }, [id]);\n\n  useEffect(() => {\n    if (!expanded) return;\n    function handleKey(e: KeyboardEvent) {\n      if (e.key === 'Escape') setExpanded(false);\n    }\n    document.addEventListener('keydown', handleKey);\n    return () => document.removeEventListener('keydown', handleKey);\n  }, [expanded]);\n\n  const togglePreview = useCallback(() => setShowPreview((v) => !v), []);\n\n  const headerActions = (\n    <>\n      <Button\n        variant=\"ghost\"\n        size=\"sm\"\n        onClick={togglePreview}\n        className=\"h-7 gap-1 px-2 text-xs\"\n      >\n        {showPreview ? (\n          <Code className=\"h-3 w-3\" />\n        ) : (\n          <Eye className=\"h-3 w-3\" />\n        )}\n        {showPreview ? 'Code' : 'Preview'}\n      </Button>\n      {showPreview && (\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          onClick={() => setExpanded(true)}\n          className=\"h-7 w-7 p-0\"\n          aria-label=\"Expand preview\"\n        >\n          <Maximize2 className=\"h-3 w-3\" />\n        </Button>\n      )}\n    </>\n  );\n\n  return (\n    <>\n      <FenceBlock code={code} language=\"html\" headerActions={headerActions}>\n        <div className=\"relative\">\n          {showPreview ? (\n            <iframe\n              ref={iframeRef}\n              srcDoc={srcdoc}\n              // `allow-scripts` lets previewed HTML run its own JS (charts, demos,\n              // and the optional resize-postMessage handshake). It is intentionally\n              // NOT paired with `allow-same-origin`, so the content runs in an\n              // opaque (null) origin with no access to this page, cookies, or storage.\n              sandbox=\"allow-scripts allow-forms\"\n              referrerPolicy=\"no-referrer\"\n              className=\"w-full border-0\"\n              style={{ height: iframeHeight }}\n              title=\"HTML Preview\"\n            />\n          ) : (\n            <pre className=\"overflow-x-auto p-3 text-sm\">\n              <code>{code}</code>\n            </pre>\n          )}\n        </div>\n      </FenceBlock>\n\n      {expanded && (\n        <div\n          className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-label=\"HTML Preview\"\n        >\n          <button\n            type=\"button\"\n            aria-label=\"Close preview\"\n            className=\"absolute inset-0 h-full w-full cursor-default border-0 bg-transparent p-0\"\n            onClick={() => setExpanded(false)}\n          />\n          <div className=\"relative h-[90vh] w-[90vw] overflow-hidden rounded-lg bg-white shadow-xl dark:bg-neutral-900\">\n            <div className=\"flex items-center justify-between border-b border-neutral-200 px-4 py-2 dark:border-neutral-700\">\n              <span className=\"text-sm font-medium\">HTML Preview</span>\n              <Button\n                variant=\"ghost\"\n                size=\"sm\"\n                onClick={() => setExpanded(false)}\n              >\n                Close\n              </Button>\n            </div>\n            <iframe\n              srcDoc={srcdoc}\n              sandbox=\"allow-scripts allow-forms\"\n              referrerPolicy=\"no-referrer\"\n              className=\"h-full w-full border-0\"\n              title=\"HTML Preview (expanded)\"\n            />\n          </div>\n        </div>\n      )}\n    </>\n  );\n};\n"]}