@scalemule/nextjs 0.1.19 → 0.1.21

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ApiError, RealtimeService, StorageService, PhotoService, VideoService, AudioService, TtsService, TtsJobStatus, FileStatus } from '@scalemule/sdk';
+import { ApiError, RealtimeService, StorageService, PhotoService, VideoService, AudioService, TtsService, TtsJobStatus, FileStatus, TtsAudioInfo } from '@scalemule/sdk';
 import * as React from 'react';
 import { ReactNode, ReactElement } from 'react';
 import { MoneyClient } from '@scalemule/money';
@@ -888,6 +888,21 @@ interface FeedbackWidgetProps {
  */
 declare function FeedbackWidget(props: FeedbackWidgetProps): ReactElement | null;
 
+type NarrationPlayerAudio = TtsAudioInfo & {
+    waveform_peaks?: number[] | null;
+    ai_generated?: boolean;
+};
+interface NarrationPlayerProps {
+    audio: NarrationPlayerAudio;
+    className?: string;
+    providerLabel?: string;
+    narrationLabel?: string;
+    refreshing?: boolean;
+    onRefresh?: () => void;
+    onPlaybackError?: () => void;
+}
+declare function NarrationPlayer({ audio, className, providerLabel, narrationLabel, refreshing, onRefresh, onPlaybackError, }: NarrationPlayerProps): react_jsx_runtime.JSX.Element | null;
+
 /**
  * Client-side validation helpers
  *
@@ -1046,4 +1061,4 @@ declare function createSafeLogger(prefix: string): {
     error: (message: string, data?: unknown) => void;
 };
 
-export { ApiError$1 as ApiError, type AudioFile, type AudioUploadResult, type ConversationKind, type FeatureFlagEvaluation, type FeatureFlagEvaluation as FeatureFlagResult, type FeedbackItem, type FeedbackItemInput, type FeedbackPriority, type FeedbackStatus, type FeedbackType, FeedbackWidget, type FeedbackWidgetConfig, type FeedbackWidgetProps, ListFilesParams, LoginResponse, type MediaPolicy, type MediaUploadResult, type PasswordValidationResult, type PhoneCountry, type PhoneValidationResult, type RealtimeEvent, type RealtimeMessage, type RealtimeStatus, ScaleMuleClient, ScaleMuleConfig, ScaleMuleMedia, type ScaleMuleMediaProps, ScaleMuleProvider, type ScaleMuleProviderProps, UseAnalyticsOptions, UseAnalyticsReturn, type UseAudioReturn, type UseAudioUploadOptions, UseAuthReturn, UseBillingReturn, UseContentReturn, type UseFeatureFlagsOptions, type UseFeatureFlagsReturn, type UseFeedbackOptions, type UseFeedbackResult, type UseFileStatusOptions, type UseFileStatusReturn, type UseFeatureFlagsOptions as UseFlagsOptions, type UseFeatureFlagsReturn as UseFlagsReturn, type UseMediaReturn, type UseMediaUploadOptions, type UsePushNotificationsOptions, type UsePushNotificationsReturn, type UseRealtimeOptions, type UseRealtimeReturn, type UseShareOptions, type UseShareReturn, type UseTtsJobOptions, type UseTtsJobReturn, UseUserReturn, User, type UsernameValidationResult, composePhone, createSafeLogger, normalizePhone, phoneCountries, sanitizeForLog, useAnalytics, useAudio, useAuth, useBilling, useContent, useFeatureFlags, useFeedback, useFileStatus, useMedia, useMoney, useMoneyClient, usePushNotifications, useRealtime, useScaleMule, useScaleMuleClient, useShare, useTtsJob, useUser, validateForm, validators };
+export { ApiError$1 as ApiError, type AudioFile, type AudioUploadResult, type ConversationKind, type FeatureFlagEvaluation, type FeatureFlagEvaluation as FeatureFlagResult, type FeedbackItem, type FeedbackItemInput, type FeedbackPriority, type FeedbackStatus, type FeedbackType, FeedbackWidget, type FeedbackWidgetConfig, type FeedbackWidgetProps, ListFilesParams, LoginResponse, type MediaPolicy, type MediaUploadResult, NarrationPlayer, type NarrationPlayerAudio, type NarrationPlayerProps, type PasswordValidationResult, type PhoneCountry, type PhoneValidationResult, type RealtimeEvent, type RealtimeMessage, type RealtimeStatus, ScaleMuleClient, ScaleMuleConfig, ScaleMuleMedia, type ScaleMuleMediaProps, ScaleMuleProvider, type ScaleMuleProviderProps, UseAnalyticsOptions, UseAnalyticsReturn, type UseAudioReturn, type UseAudioUploadOptions, UseAuthReturn, UseBillingReturn, UseContentReturn, type UseFeatureFlagsOptions, type UseFeatureFlagsReturn, type UseFeedbackOptions, type UseFeedbackResult, type UseFileStatusOptions, type UseFileStatusReturn, type UseFeatureFlagsOptions as UseFlagsOptions, type UseFeatureFlagsReturn as UseFlagsReturn, type UseMediaReturn, type UseMediaUploadOptions, type UsePushNotificationsOptions, type UsePushNotificationsReturn, type UseRealtimeOptions, type UseRealtimeReturn, type UseShareOptions, type UseShareReturn, type UseTtsJobOptions, type UseTtsJobReturn, UseUserReturn, User, type UsernameValidationResult, composePhone, createSafeLogger, normalizePhone, phoneCountries, sanitizeForLog, useAnalytics, useAudio, useAuth, useBilling, useContent, useFeatureFlags, useFeedback, useFileStatus, useMedia, useMoney, useMoneyClient, usePushNotifications, useRealtime, useScaleMule, useScaleMuleClient, useShare, useTtsJob, useUser, validateForm, validators };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ApiError, RealtimeService, StorageService, PhotoService, VideoService, AudioService, TtsService, TtsJobStatus, FileStatus } from '@scalemule/sdk';
+import { ApiError, RealtimeService, StorageService, PhotoService, VideoService, AudioService, TtsService, TtsJobStatus, FileStatus, TtsAudioInfo } from '@scalemule/sdk';
 import * as React from 'react';
 import { ReactNode, ReactElement } from 'react';
 import { MoneyClient } from '@scalemule/money';
@@ -888,6 +888,21 @@ interface FeedbackWidgetProps {
  */
 declare function FeedbackWidget(props: FeedbackWidgetProps): ReactElement | null;
 
+type NarrationPlayerAudio = TtsAudioInfo & {
+    waveform_peaks?: number[] | null;
+    ai_generated?: boolean;
+};
+interface NarrationPlayerProps {
+    audio: NarrationPlayerAudio;
+    className?: string;
+    providerLabel?: string;
+    narrationLabel?: string;
+    refreshing?: boolean;
+    onRefresh?: () => void;
+    onPlaybackError?: () => void;
+}
+declare function NarrationPlayer({ audio, className, providerLabel, narrationLabel, refreshing, onRefresh, onPlaybackError, }: NarrationPlayerProps): react_jsx_runtime.JSX.Element | null;
+
 /**
  * Client-side validation helpers
  *
@@ -1046,4 +1061,4 @@ declare function createSafeLogger(prefix: string): {
     error: (message: string, data?: unknown) => void;
 };
 
-export { ApiError$1 as ApiError, type AudioFile, type AudioUploadResult, type ConversationKind, type FeatureFlagEvaluation, type FeatureFlagEvaluation as FeatureFlagResult, type FeedbackItem, type FeedbackItemInput, type FeedbackPriority, type FeedbackStatus, type FeedbackType, FeedbackWidget, type FeedbackWidgetConfig, type FeedbackWidgetProps, ListFilesParams, LoginResponse, type MediaPolicy, type MediaUploadResult, type PasswordValidationResult, type PhoneCountry, type PhoneValidationResult, type RealtimeEvent, type RealtimeMessage, type RealtimeStatus, ScaleMuleClient, ScaleMuleConfig, ScaleMuleMedia, type ScaleMuleMediaProps, ScaleMuleProvider, type ScaleMuleProviderProps, UseAnalyticsOptions, UseAnalyticsReturn, type UseAudioReturn, type UseAudioUploadOptions, UseAuthReturn, UseBillingReturn, UseContentReturn, type UseFeatureFlagsOptions, type UseFeatureFlagsReturn, type UseFeedbackOptions, type UseFeedbackResult, type UseFileStatusOptions, type UseFileStatusReturn, type UseFeatureFlagsOptions as UseFlagsOptions, type UseFeatureFlagsReturn as UseFlagsReturn, type UseMediaReturn, type UseMediaUploadOptions, type UsePushNotificationsOptions, type UsePushNotificationsReturn, type UseRealtimeOptions, type UseRealtimeReturn, type UseShareOptions, type UseShareReturn, type UseTtsJobOptions, type UseTtsJobReturn, UseUserReturn, User, type UsernameValidationResult, composePhone, createSafeLogger, normalizePhone, phoneCountries, sanitizeForLog, useAnalytics, useAudio, useAuth, useBilling, useContent, useFeatureFlags, useFeedback, useFileStatus, useMedia, useMoney, useMoneyClient, usePushNotifications, useRealtime, useScaleMule, useScaleMuleClient, useShare, useTtsJob, useUser, validateForm, validators };
+export { ApiError$1 as ApiError, type AudioFile, type AudioUploadResult, type ConversationKind, type FeatureFlagEvaluation, type FeatureFlagEvaluation as FeatureFlagResult, type FeedbackItem, type FeedbackItemInput, type FeedbackPriority, type FeedbackStatus, type FeedbackType, FeedbackWidget, type FeedbackWidgetConfig, type FeedbackWidgetProps, ListFilesParams, LoginResponse, type MediaPolicy, type MediaUploadResult, NarrationPlayer, type NarrationPlayerAudio, type NarrationPlayerProps, type PasswordValidationResult, type PhoneCountry, type PhoneValidationResult, type RealtimeEvent, type RealtimeMessage, type RealtimeStatus, ScaleMuleClient, ScaleMuleConfig, ScaleMuleMedia, type ScaleMuleMediaProps, ScaleMuleProvider, type ScaleMuleProviderProps, UseAnalyticsOptions, UseAnalyticsReturn, type UseAudioReturn, type UseAudioUploadOptions, UseAuthReturn, UseBillingReturn, UseContentReturn, type UseFeatureFlagsOptions, type UseFeatureFlagsReturn, type UseFeedbackOptions, type UseFeedbackResult, type UseFileStatusOptions, type UseFileStatusReturn, type UseFeatureFlagsOptions as UseFlagsOptions, type UseFeatureFlagsReturn as UseFlagsReturn, type UseMediaReturn, type UseMediaUploadOptions, type UsePushNotificationsOptions, type UsePushNotificationsReturn, type UseRealtimeOptions, type UseRealtimeReturn, type UseShareOptions, type UseShareReturn, type UseTtsJobOptions, type UseTtsJobReturn, UseUserReturn, User, type UsernameValidationResult, composePhone, createSafeLogger, normalizePhone, phoneCountries, sanitizeForLog, useAnalytics, useAudio, useAuth, useBilling, useContent, useFeatureFlags, useFeedback, useFileStatus, useMedia, useMoney, useMoneyClient, usePushNotifications, useRealtime, useScaleMule, useScaleMuleClient, useShare, useTtsJob, useUser, validateForm, validators };

package/dist/index.js

@@ -11288,6 +11288,230 @@ function FeedbackWidget(props) {
     ) })
   ] });
 }
+var SPEEDS = [1, 1.25, 1.5, 2];
+function formatTime(seconds) {
+  if (!Number.isFinite(seconds) || seconds <= 0) {
+    return "0:00";
+  }
+  const wholeSeconds = Math.floor(seconds);
+  const minutes = Math.floor(wholeSeconds / 60);
+  const remainder = wholeSeconds % 60;
+  return `${minutes}:${remainder.toString().padStart(2, "0")}`;
+}
+function getNextSpeed(currentSpeed) {
+  const currentIndex = SPEEDS.findIndex((speed) => speed === currentSpeed);
+  if (currentIndex === -1) {
+    return SPEEDS[0];
+  }
+  return SPEEDS[(currentIndex + 1) % SPEEDS.length];
+}
+function NarrationPlayer({
+  audio,
+  className,
+  providerLabel = "ScaleMule",
+  narrationLabel = "AI-Narrated",
+  refreshing = false,
+  onRefresh,
+  onPlaybackError
+}) {
+  const audioRef = React.useRef(null);
+  const scrubRef = React.useRef(null);
+  const [playing, setPlaying] = React.useState(false);
+  const [currentTime, setCurrentTime] = React.useState(0);
+  const [duration, setDuration] = React.useState(audio.duration_ms ? audio.duration_ms / 1e3 : 0);
+  const [speed, setSpeed] = React.useState(1.5);
+  const peaks = React.useMemo(() => {
+    if (!Array.isArray(audio.waveform_peaks)) {
+      return [];
+    }
+    const sampled = audio.waveform_peaks.filter((_, index) => index % 3 === 0).slice(0, 220);
+    return sampled.length > 0 ? sampled : audio.waveform_peaks.slice(0, 220);
+  }, [audio.waveform_peaks]);
+  React.useEffect(() => {
+    const element = audioRef.current;
+    if (!element) return;
+    setCurrentTime(0);
+    setPlaying(false);
+    element.pause();
+    element.currentTime = 0;
+  }, [audio.url]);
+  React.useEffect(() => {
+    const element = audioRef.current;
+    if (!element) return;
+    element.playbackRate = speed;
+    element.preservesPitch = true;
+  }, [speed]);
+  function togglePlayback() {
+    const element = audioRef.current;
+    if (!element) return;
+    if (element.paused) {
+      element.play().catch(() => {
+        setPlaying(false);
+        onPlaybackError?.();
+      });
+      return;
+    }
+    element.pause();
+  }
+  function seekTo(clientX) {
+    const element = audioRef.current;
+    const scrubber = scrubRef.current;
+    if (!element || !scrubber || !duration) return;
+    const bounds = scrubber.getBoundingClientRect();
+    const ratio = Math.max(0, Math.min(1, (clientX - bounds.left) / bounds.width));
+    const nextTime = ratio * duration;
+    element.currentTime = nextTime;
+    setCurrentTime(nextTime);
+  }
+  const progress = duration > 0 ? Math.min(1, currentTime / duration) : 0;
+  const expiresLabel = audio.expires_at ? new Date(audio.expires_at).toLocaleTimeString([], {
+    hour: "numeric",
+    minute: "2-digit"
+  }) : null;
+  if (!audio.url) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: "rounded-[1.75rem] border border-slate-200/80 bg-[linear-gradient(180deg,#f8fbff_0%,#edf4ff_100%)] p-4 text-slate-900 shadow-[0_22px_70px_rgba(4,12,24,0.28)] " + (className ?? ""),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "audio",
+          {
+            ref: audioRef,
+            src: audio.url ?? void 0,
+            preload: "metadata",
+            onLoadedMetadata: (event) => {
+              setDuration(event.currentTarget.duration || 0);
+            },
+            onTimeUpdate: (event) => {
+              setCurrentTime(event.currentTarget.currentTime);
+            },
+            onPlay: () => setPlaying(true),
+            onPause: () => setPlaying(false),
+            onEnded: () => setPlaying(false),
+            onError: () => onPlaybackError?.()
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 md:flex-row md:items-center", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              onClick: togglePlayback,
+              "aria-label": playing ? "Pause narration" : "Play narration",
+              className: "flex h-[4.5rem] w-[4.5rem] shrink-0 items-center justify-center rounded-full bg-slate-950 text-white shadow-[0_10px_28px_rgba(15,23,42,0.25)] transition hover:bg-slate-800",
+              children: playing ? /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", className: "h-7 w-7 fill-current", "aria-hidden": "true", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "6", y: "5", width: "4", height: "14", rx: "1.2" }),
+                /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "14", y: "5", width: "4", height: "14", rx: "1.2" })
+              ] }) : /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", className: "ml-1 h-7 w-7 fill-current", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7 5.2c0-1.02 1.12-1.65 2-.98l10.2 7.78a1.24 1.24 0 0 1 0 1.98L9 21.76c-.88.67-2-.04-2-1.08V5.2Z" }) })
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-3 text-[0.8rem] font-medium text-slate-500", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatTime(currentTime / speed) }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rounded-full bg-blue-100 px-3 py-1 text-[0.65rem] font-semibold uppercase tracking-[0.24em] text-blue-700", children: narrationLabel }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatTime(duration / speed) })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                ref: scrubRef,
+                role: "slider",
+                "aria-label": "Narration progress",
+                "aria-valuemin": 0,
+                "aria-valuemax": Math.max(1, Math.floor(duration)),
+                "aria-valuenow": Math.floor(currentTime),
+                tabIndex: 0,
+                onClick: (event) => {
+                  seekTo(event.clientX);
+                },
+                className: "relative mt-4 h-12 cursor-pointer overflow-hidden rounded-[1rem] bg-slate-200/90 px-1",
+                children: peaks.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+                  "svg",
+                  {
+                    viewBox: `0 0 ${peaks.length} 40`,
+                    preserveAspectRatio: "none",
+                    className: "pointer-events-none absolute inset-0 h-full w-full",
+                    children: peaks.map((peak, index) => {
+                      const height = Math.max(2, Math.round(Math.abs(peak) * 34));
+                      const y = (40 - height) / 2;
+                      const filled = index / peaks.length < progress;
+                      return /* @__PURE__ */ jsxRuntime.jsx(
+                        "rect",
+                        {
+                          x: index,
+                          y,
+                          width: 0.82,
+                          height,
+                          rx: 0.4,
+                          className: filled ? "fill-blue-600" : "fill-blue-300"
+                        },
+                        `${audio.id}-${index}`
+                      );
+                    })
+                  }
+                ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-slate-200/90" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      className: "absolute inset-y-0 left-0 bg-blue-600",
+                      style: { width: `${progress * 100}%` }
+                    }
+                  )
+                ] })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 flex flex-wrap items-center gap-2 text-[0.72rem] font-medium text-slate-500", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "rounded-full border border-slate-200 bg-white/85 px-3 py-1 text-slate-700", children: [
+                "Provider: ",
+                providerLabel
+              ] }),
+              duration > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "rounded-full border border-slate-200 bg-white/65 px-3 py-1", children: [
+                "Length ",
+                formatTime(duration / speed)
+              ] }),
+              expiresLabel && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "rounded-full border border-slate-200 bg-white/65 px-3 py-1", children: [
+                "Expires ",
+                expiresLabel
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-2 self-start md:self-center", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  setSpeed((currentSpeed) => getNextSpeed(currentSpeed));
+                },
+                className: "rounded-full border border-slate-300 bg-white/90 px-4 py-2 text-base font-semibold text-slate-700 shadow-sm hover:bg-white",
+                children: [
+                  speed,
+                  "\xD7"
+                ]
+              }
+            ),
+            onRefresh && /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onRefresh,
+                disabled: refreshing,
+                className: "rounded-full border border-slate-300 bg-white/75 px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-white disabled:cursor-not-allowed disabled:opacity-60",
+                children: refreshing ? "Refreshing\u2026" : "Refresh"
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
 
 // src/validation.ts
 var phoneCountries = [
@@ -11589,6 +11813,7 @@ Object.defineProperty(exports, "createMoneyClient", {
   get: function () { return money.createMoneyClient; }
 });
 exports.FeedbackWidget = FeedbackWidget;
+exports.NarrationPlayer = NarrationPlayer;
 exports.ScaleMuleApiError = ScaleMuleApiError;
 exports.ScaleMuleClient = ScaleMuleClient2;
 exports.ScaleMuleMedia = ScaleMuleMedia;

package/dist/index.mjs

@@ -11268,6 +11268,230 @@ function FeedbackWidget(props) {
     ) })
   ] });
 }
+var SPEEDS = [1, 1.25, 1.5, 2];
+function formatTime(seconds) {
+  if (!Number.isFinite(seconds) || seconds <= 0) {
+    return "0:00";
+  }
+  const wholeSeconds = Math.floor(seconds);
+  const minutes = Math.floor(wholeSeconds / 60);
+  const remainder = wholeSeconds % 60;
+  return `${minutes}:${remainder.toString().padStart(2, "0")}`;
+}
+function getNextSpeed(currentSpeed) {
+  const currentIndex = SPEEDS.findIndex((speed) => speed === currentSpeed);
+  if (currentIndex === -1) {
+    return SPEEDS[0];
+  }
+  return SPEEDS[(currentIndex + 1) % SPEEDS.length];
+}
+function NarrationPlayer({
+  audio,
+  className,
+  providerLabel = "ScaleMule",
+  narrationLabel = "AI-Narrated",
+  refreshing = false,
+  onRefresh,
+  onPlaybackError
+}) {
+  const audioRef = useRef(null);
+  const scrubRef = useRef(null);
+  const [playing, setPlaying] = useState(false);
+  const [currentTime, setCurrentTime] = useState(0);
+  const [duration, setDuration] = useState(audio.duration_ms ? audio.duration_ms / 1e3 : 0);
+  const [speed, setSpeed] = useState(1.5);
+  const peaks = useMemo(() => {
+    if (!Array.isArray(audio.waveform_peaks)) {
+      return [];
+    }
+    const sampled = audio.waveform_peaks.filter((_, index) => index % 3 === 0).slice(0, 220);
+    return sampled.length > 0 ? sampled : audio.waveform_peaks.slice(0, 220);
+  }, [audio.waveform_peaks]);
+  useEffect(() => {
+    const element = audioRef.current;
+    if (!element) return;
+    setCurrentTime(0);
+    setPlaying(false);
+    element.pause();
+    element.currentTime = 0;
+  }, [audio.url]);
+  useEffect(() => {
+    const element = audioRef.current;
+    if (!element) return;
+    element.playbackRate = speed;
+    element.preservesPitch = true;
+  }, [speed]);
+  function togglePlayback() {
+    const element = audioRef.current;
+    if (!element) return;
+    if (element.paused) {
+      element.play().catch(() => {
+        setPlaying(false);
+        onPlaybackError?.();
+      });
+      return;
+    }
+    element.pause();
+  }
+  function seekTo(clientX) {
+    const element = audioRef.current;
+    const scrubber = scrubRef.current;
+    if (!element || !scrubber || !duration) return;
+    const bounds = scrubber.getBoundingClientRect();
+    const ratio = Math.max(0, Math.min(1, (clientX - bounds.left) / bounds.width));
+    const nextTime = ratio * duration;
+    element.currentTime = nextTime;
+    setCurrentTime(nextTime);
+  }
+  const progress = duration > 0 ? Math.min(1, currentTime / duration) : 0;
+  const expiresLabel = audio.expires_at ? new Date(audio.expires_at).toLocaleTimeString([], {
+    hour: "numeric",
+    minute: "2-digit"
+  }) : null;
+  if (!audio.url) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "rounded-[1.75rem] border border-slate-200/80 bg-[linear-gradient(180deg,#f8fbff_0%,#edf4ff_100%)] p-4 text-slate-900 shadow-[0_22px_70px_rgba(4,12,24,0.28)] " + (className ?? ""),
+      children: [
+        /* @__PURE__ */ jsx(
+          "audio",
+          {
+            ref: audioRef,
+            src: audio.url ?? void 0,
+            preload: "metadata",
+            onLoadedMetadata: (event) => {
+              setDuration(event.currentTarget.duration || 0);
+            },
+            onTimeUpdate: (event) => {
+              setCurrentTime(event.currentTarget.currentTime);
+            },
+            onPlay: () => setPlaying(true),
+            onPause: () => setPlaying(false),
+            onEnded: () => setPlaying(false),
+            onError: () => onPlaybackError?.()
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 md:flex-row md:items-center", children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: togglePlayback,
+              "aria-label": playing ? "Pause narration" : "Play narration",
+              className: "flex h-[4.5rem] w-[4.5rem] shrink-0 items-center justify-center rounded-full bg-slate-950 text-white shadow-[0_10px_28px_rgba(15,23,42,0.25)] transition hover:bg-slate-800",
+              children: playing ? /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", className: "h-7 w-7 fill-current", "aria-hidden": "true", children: [
+                /* @__PURE__ */ jsx("rect", { x: "6", y: "5", width: "4", height: "14", rx: "1.2" }),
+                /* @__PURE__ */ jsx("rect", { x: "14", y: "5", width: "4", height: "14", rx: "1.2" })
+              ] }) : /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "ml-1 h-7 w-7 fill-current", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M7 5.2c0-1.02 1.12-1.65 2-.98l10.2 7.78a1.24 1.24 0 0 1 0 1.98L9 21.76c-.88.67-2-.04-2-1.08V5.2Z" }) })
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 text-[0.8rem] font-medium text-slate-500", children: [
+              /* @__PURE__ */ jsx("span", { children: formatTime(currentTime / speed) }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ jsx("span", { className: "rounded-full bg-blue-100 px-3 py-1 text-[0.65rem] font-semibold uppercase tracking-[0.24em] text-blue-700", children: narrationLabel }),
+                /* @__PURE__ */ jsx("span", { children: formatTime(duration / speed) })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: scrubRef,
+                role: "slider",
+                "aria-label": "Narration progress",
+                "aria-valuemin": 0,
+                "aria-valuemax": Math.max(1, Math.floor(duration)),
+                "aria-valuenow": Math.floor(currentTime),
+                tabIndex: 0,
+                onClick: (event) => {
+                  seekTo(event.clientX);
+                },
+                className: "relative mt-4 h-12 cursor-pointer overflow-hidden rounded-[1rem] bg-slate-200/90 px-1",
+                children: peaks.length > 0 ? /* @__PURE__ */ jsx(
+                  "svg",
+                  {
+                    viewBox: `0 0 ${peaks.length} 40`,
+                    preserveAspectRatio: "none",
+                    className: "pointer-events-none absolute inset-0 h-full w-full",
+                    children: peaks.map((peak, index) => {
+                      const height = Math.max(2, Math.round(Math.abs(peak) * 34));
+                      const y = (40 - height) / 2;
+                      const filled = index / peaks.length < progress;
+                      return /* @__PURE__ */ jsx(
+                        "rect",
+                        {
+                          x: index,
+                          y,
+                          width: 0.82,
+                          height,
+                          rx: 0.4,
+                          className: filled ? "fill-blue-600" : "fill-blue-300"
+                        },
+                        `${audio.id}-${index}`
+                      );
+                    })
+                  }
+                ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-slate-200/90" }),
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: "absolute inset-y-0 left-0 bg-blue-600",
+                      style: { width: `${progress * 100}%` }
+                    }
+                  )
+                ] })
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "mt-4 flex flex-wrap items-center gap-2 text-[0.72rem] font-medium text-slate-500", children: [
+              /* @__PURE__ */ jsxs("span", { className: "rounded-full border border-slate-200 bg-white/85 px-3 py-1 text-slate-700", children: [
+                "Provider: ",
+                providerLabel
+              ] }),
+              duration > 0 && /* @__PURE__ */ jsxs("span", { className: "rounded-full border border-slate-200 bg-white/65 px-3 py-1", children: [
+                "Length ",
+                formatTime(duration / speed)
+              ] }),
+              expiresLabel && /* @__PURE__ */ jsxs("span", { className: "rounded-full border border-slate-200 bg-white/65 px-3 py-1", children: [
+                "Expires ",
+                expiresLabel
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2 self-start md:self-center", children: [
+            /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  setSpeed((currentSpeed) => getNextSpeed(currentSpeed));
+                },
+                className: "rounded-full border border-slate-300 bg-white/90 px-4 py-2 text-base font-semibold text-slate-700 shadow-sm hover:bg-white",
+                children: [
+                  speed,
+                  "\xD7"
+                ]
+              }
+            ),
+            onRefresh && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onRefresh,
+                disabled: refreshing,
+                className: "rounded-full border border-slate-300 bg-white/75 px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-white disabled:cursor-not-allowed disabled:opacity-60",
+                children: refreshing ? "Refreshing\u2026" : "Refresh"
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
 
 // src/validation.ts
 var phoneCountries = [
@@ -11560,4 +11784,4 @@ function createSafeLogger(prefix) {
   };
 }
 
-export { FeedbackWidget, ScaleMuleApiError, ScaleMuleClient2 as ScaleMuleClient, ScaleMuleMedia, ScaleMuleProvider, composePhone, createClient, createSafeLogger, normalizePhone, phoneCountries, sanitizeForLog, useAnalytics, useAudio, useAuth, useBilling, useContent, useFeatureFlags, useFeedback, useFileStatus, useMedia, useMoney, useMoneyClient, usePushNotifications, useRealtime, useScaleMule, useScaleMuleClient, useShare, useTtsJob, useUser, validateForm, validators };
+export { FeedbackWidget, NarrationPlayer, ScaleMuleApiError, ScaleMuleClient2 as ScaleMuleClient, ScaleMuleMedia, ScaleMuleProvider, composePhone, createClient, createSafeLogger, normalizePhone, phoneCountries, sanitizeForLog, useAnalytics, useAudio, useAuth, useBilling, useContent, useFeatureFlags, useFeedback, useFileStatus, useMedia, useMoney, useMoneyClient, usePushNotifications, useRealtime, useScaleMule, useScaleMuleClient, useShare, useTtsJob, useUser, validateForm, validators };

package/dist/ledvery-CxPzZpxP.d.mts

@@ -0,0 +1,44 @@
+declare const SM_LEDVERY_STATE_COOKIE = "sm_ledvery_state";
+declare const SM_LEDVERY_PKCE_VERIFIER_COOKIE = "sm_ledvery_pkce_verifier";
+declare const SM_LEDVERY_NONCE_COOKIE = "sm_ledvery_nonce";
+declare const SM_LEDVERY_ID_TOKEN_COOKIE = "sm_ledvery_id_token";
+declare const SM_LEDVERY_ACCESS_TOKEN_COOKIE = "sm_ledvery_access_token";
+interface SessionCookieOverrides {
+    maxAge?: number;
+    domain?: string;
+    path?: string;
+    sameSite?: 'strict' | 'lax' | 'none';
+    secure?: boolean;
+}
+interface LedverySessionData {
+    idToken: string;
+    accessToken?: string;
+    claims: Record<string, unknown>;
+    expiresAt: string;
+}
+declare function getLedverySession(request: Request): LedverySessionData | null;
+
+interface LedveryRoutesConfig {
+    issuer: string;
+    clientId: string;
+    clientSecret?: string;
+    redirectUri: string;
+    defaultScope?: string;
+    postLoginRedirect?: string;
+    postLogoutRedirect?: string;
+    cookies?: SessionCookieOverrides;
+    storeAccessToken?: boolean;
+    fetch?: typeof fetch;
+    gatewayUrl?: string;
+}
+type RouteHandler = (request: Request, context: {
+    params: Promise<{
+        action?: string[];
+    }>;
+}) => Promise<Response>;
+declare function createLedveryRoutes(config: LedveryRoutesConfig): {
+    GET: RouteHandler;
+    POST: RouteHandler;
+};
+
+export { type LedveryRoutesConfig as L, SM_LEDVERY_ACCESS_TOKEN_COOKIE as S, type LedverySessionData as a, SM_LEDVERY_ID_TOKEN_COOKIE as b, SM_LEDVERY_NONCE_COOKIE as c, SM_LEDVERY_PKCE_VERIFIER_COOKIE as d, SM_LEDVERY_STATE_COOKIE as e, createLedveryRoutes as f, getLedverySession as g };

package/dist/ledvery-CxPzZpxP.d.ts

@@ -0,0 +1,44 @@
+declare const SM_LEDVERY_STATE_COOKIE = "sm_ledvery_state";
+declare const SM_LEDVERY_PKCE_VERIFIER_COOKIE = "sm_ledvery_pkce_verifier";
+declare const SM_LEDVERY_NONCE_COOKIE = "sm_ledvery_nonce";
+declare const SM_LEDVERY_ID_TOKEN_COOKIE = "sm_ledvery_id_token";
+declare const SM_LEDVERY_ACCESS_TOKEN_COOKIE = "sm_ledvery_access_token";
+interface SessionCookieOverrides {
+    maxAge?: number;
+    domain?: string;
+    path?: string;
+    sameSite?: 'strict' | 'lax' | 'none';
+    secure?: boolean;
+}
+interface LedverySessionData {
+    idToken: string;
+    accessToken?: string;
+    claims: Record<string, unknown>;
+    expiresAt: string;
+}
+declare function getLedverySession(request: Request): LedverySessionData | null;
+
+interface LedveryRoutesConfig {
+    issuer: string;
+    clientId: string;
+    clientSecret?: string;
+    redirectUri: string;
+    defaultScope?: string;
+    postLoginRedirect?: string;
+    postLogoutRedirect?: string;
+    cookies?: SessionCookieOverrides;
+    storeAccessToken?: boolean;
+    fetch?: typeof fetch;
+    gatewayUrl?: string;
+}
+type RouteHandler = (request: Request, context: {
+    params: Promise<{
+        action?: string[];
+    }>;
+}) => Promise<Response>;
+declare function createLedveryRoutes(config: LedveryRoutesConfig): {
+    GET: RouteHandler;
+    POST: RouteHandler;
+};
+
+export { type LedveryRoutesConfig as L, SM_LEDVERY_ACCESS_TOKEN_COOKIE as S, type LedverySessionData as a, SM_LEDVERY_ID_TOKEN_COOKIE as b, SM_LEDVERY_NONCE_COOKIE as c, SM_LEDVERY_PKCE_VERIFIER_COOKIE as d, SM_LEDVERY_STATE_COOKIE as e, createLedveryRoutes as f, getLedverySession as g };