npm - box-content-preview - Versions diffs - 3.82.0 → 3.83.0 - Mend

box-content-preview 3.82.0 → 3.83.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/README.md CHANGED Viewed

@@ -2,7 +2,7 @@
 [![Mergify Status](https://img.shields.io/endpoint.svg?url=https://gh.mergify.io/badges/box/box-content-preview&style=flat)](https://mergify.io)
 [![Styled With Prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
 [![build status](https://img.shields.io/travis/box/box-content-preview/master.svg?style=flat-square)](https://travis-ci.org/box/box-content-preview)
-[![version](https://img.shields.io/badge/version-v3.82.0-blue.svg?style=flat-square)](https://github.com/box/box-content-preview)
+[![version](https://img.shields.io/badge/version-v3.83.0-blue.svg?style=flat-square)](https://github.com/box/box-content-preview)
 [![npm version](https://img.shields.io/npm/v/box-ui-elements.svg?style=flat-square)](https://www.npmjs.com/package/box-ui-elements)
 # [Box Content Preview](https://developer.box.com/docs/box-content-preview)
@@ -22,11 +22,11 @@ We encourage all users to update their applications to utilize modern browsers f
 ## Current Version
-- Version: v3.82.0
+- Version: v3.83.0
 - Locale: en-US
-https://cdn01.boxcdn.net/platform/preview/3.82.0/en-US/preview.js
-https://cdn01.boxcdn.net/platform/preview/3.82.0/en-US/preview.css
+https://cdn01.boxcdn.net/platform/preview/3.83.0/en-US/preview.js
+https://cdn01.boxcdn.net/platform/preview/3.83.0/en-US/preview.css
 ## Supported Locales
@@ -52,10 +52,10 @@ You can self-host the Box Content Preview library or reference the versions avai
     <title>Box Content Preview Demo</title>
     <!-- Latest version of Preview SDK for your locale -->
-    <script src="https://cdn01.boxcdn.net/platform/preview/3.82.0/en-US/preview.js"></script>
+    <script src="https://cdn01.boxcdn.net/platform/preview/3.83.0/en-US/preview.js"></script>
     <link
       rel="stylesheet"
-      href="https://cdn01.boxcdn.net/platform/preview/3.82.0/en-US/preview.css"
+      href="https://cdn01.boxcdn.net/platform/preview/3.83.0/en-US/preview.css"
     />
   </head>
   <body>
@@ -76,7 +76,7 @@ To self-host the Box Content Preview library, follow these steps:
 1. Either fork the repo and check out the version you want to host or download the specific version as a zip:
-- Check out a specific version with `git checkout v3.82.0`
+- Check out a specific version with `git checkout v3.83.0`
 - Download a specific version as a zip from https://github.com/box/box-content-preview/releases
 2. Install dependencies and build the library with `yarn install && yarn build:i18n && yarn build:prod`

package/dist/lib/index.css CHANGED Viewed

@@ -57,8 +57,8 @@
 .bp-TimestampControl{position:relative;display:flex;align-items:center}.bp-TimestampControl-button,.bp-TimestampControl-static{display:flex;gap:4px;align-items:center;padding:6px 12px;color:#fff;font-weight:normal;font-size:14px;font-family:Lato,Arial,sans-serif;line-height:20px;letter-spacing:.3px;white-space:nowrap;-webkit-user-select:none;user-select:none}.bp-TimestampControl-button{opacity:.9;transition:opacity 150ms,background-color 150ms;will-change:opacity;outline:0;margin:0;background:transparent;border:0;border-radius:25px;cursor:pointer}.bp-TimestampControl-button:focus:not(:disabled),.bp-TimestampControl-button:hover:not(:disabled){background-color:rgba(255,255,255,.08);opacity:1}.bp-TimestampControl-button:focus:not(:disabled) svg,.bp-TimestampControl-button:hover:not(:disabled) svg,.bp-TimestampControl-button.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-TimestampControl-button.bp-is-active,.bp-TimestampControl-button:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-TimestampControl-button.bp-is-active:focus:not(:disabled),.bp-TimestampControl-button.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-TimestampControl-button:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-TimestampControl-button:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-TimestampControl-button:focus:not(:focus-visible){box-shadow:none}.bp-TimestampControl-button:focus:not(:disabled),.bp-TimestampControl-button.bp-is-open{background:transparent}.bp-TimestampControl-button:hover:not(:disabled){background:rgba(255,255,255,.08)}.bp-TimestampControl-separator,.bp-TimestampControl-duration{color:rgba(255,255,255,.8)}.bp-TimestampControl-chevron{width:16px;height:16px;margin-left:2px;fill:rgba(255,255,255,.8)}.bp-TimestampControl-flyout{position:absolute;bottom:calc(100% + 12px);left:50%;z-index:1;min-width:250px;padding:12px 8px;background:#fff;border-radius:16px;box-shadow:0 4px 12px 0 rgba(0,0,0,.15);transform:translateX(-50%)}.bp-TimestampControl-header{padding:6px 14px;color:#767676;font-weight:bold;font-size:14px;font-family:Lato,Arial,sans-serif;line-height:20px;letter-spacing:.3px;-webkit-user-select:none;user-select:none}.bp-TimestampControl-listitem{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:6px 14px;color:#000;font-size:16px;font-family:Lato,Arial,sans-serif;line-height:24px;white-space:nowrap;border-radius:8px;outline:none;cursor:pointer}.bp-TimestampControl-listitem:hover,.bp-TimestampControl-listitem:focus{background:#f4f4f4}.bp-TimestampControl-check{flex:none;fill:#000}
 .bp-VolumeControls{position:relative;display:flex;align-items:center}.bp-VolumeControls-flyout{position:absolute;top:-40px;left:-5px;display:none;flex:0 0 auto;max-width:0;height:40px;overflow:hidden;transition:max-width 200ms ease-in-out}.bp-VolumeControls-flyout.bp-is-open{display:block;overflow:visible}.bp-media--v2 .bp-VolumeControls-flyout{z-index:10}.bp-VolumeControls-slider{width:15px;height:100%;margin-right:6px;margin-left:6px}.bp-VolumeControls-toggle{opacity:.9;transition:opacity 150ms,background-color 150ms;will-change:opacity;outline:0;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:#fff;background:transparent;border:0;border-radius:25px;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;zoom:1}.bp-VolumeControls-toggle:focus:not(:disabled),.bp-VolumeControls-toggle:hover:not(:disabled){background-color:rgba(255,255,255,.08);opacity:1}.bp-VolumeControls-toggle:focus:not(:disabled) svg,.bp-VolumeControls-toggle:hover:not(:disabled) svg,.bp-VolumeControls-toggle.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-VolumeControls-toggle.bp-is-active,.bp-VolumeControls-toggle:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-VolumeControls-toggle.bp-is-active:focus:not(:disabled),.bp-VolumeControls-toggle.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-VolumeControls-toggle:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VolumeControls-toggle:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VolumeControls-toggle:focus:not(:focus-visible){box-shadow:none}.bp-VolumeControls-toggle:disabled{cursor:default;opacity:.2;pointer-events:none}.bp-VolumeControls-toggle svg{width:32px;height:32px;padding:5px}
 .bp-VolumeSliderControl{outline:0;position:relative;cursor:pointer}.bp-VolumeSliderControl:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VolumeSliderControl:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VolumeSliderControl:focus:not(:focus-visible){box-shadow:none}.bp-VolumeVerticalSliderControl{outline:0;position:absolute;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;height:140px;margin:auto;padding:16px;background:rgba(34,34,34,.9);border:1px solid rgba(255,255,255,.13);border-radius:16px;box-shadow:0 2px 5px 0 rgba(0,0,0,.25);cursor:pointer}.bp-VolumeVerticalSliderControl:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VolumeVerticalSliderControl:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VolumeVerticalSliderControl:focus:not(:focus-visible){box-shadow:none}.bp-VolumeSliderControl-thumb{position:absolute;top:calc(50% - 6px);width:10px;height:12px;margin-left:-6px;background:#0061d5;border:0;border-radius:12px;cursor:pointer}.bp-VolumeSliderControl-track{position:absolute;inset:0;height:3px;margin:auto 3px;background:transparent linear-gradient(#fff, #fff) no-repeat center border-box}.bp-VolumeVerticalSliderControl-track-container{position:relative;width:8px;height:108px}.bp-VolumeVerticalSliderControl-track-background{position:relative;left:0;width:8px;height:108px;background-color:#55554f;border-radius:20px}.bp-VolumeVerticalSliderControl-track{position:absolute;bottom:0;left:0;width:8px;background:#fff;border-radius:20px}
-.bp-WaveformView{box-sizing:border-box;width:100%;height:206px;min-height:206px;padding:0 40px;overflow:visible;background:none}.bp-WaveformView-track{position:relative;display:flex;align-items:center;width:100%;height:100%;cursor:pointer}.bp-WaveformView-canvas{z-index:0;width:100%;height:140px}.bp-WaveformView-playhead{position:absolute;top:50%;left:0;z-index:1;width:2px;height:150px;pointer-events:none;background:linear-gradient(#2487ff, #006bed);box-shadow:0 0 0 1px #222,0 0 10px 0 rgba(36,135,255,.3);transform:translate(-50%, -50%)}.bp-WaveformView-hover{position:absolute;top:100%;z-index:2;margin-top:4px;pointer-events:none;transform:translateX(-50%)}.bp-WaveformView-hoverTime{padding:4px 10px;color:#fff;font-weight:normal;font-size:14px;font-family:Lato,Arial,sans-serif;line-height:20px;letter-spacing:.3px;white-space:nowrap;background:rgba(34,34,34,.92);border:1px solid rgba(255,255,255,.18);border-radius:8px}.bp-WaveformView--inert{pointer-events:none}.bp-WaveformView--inert .bp-WaveformView-track{cursor:default}
-.bp-MP3ControlsRoot:has(.bp-MP3ControlsV2){position:absolute;inset:0;width:100%;height:100%;transform:none;pointer-events:none}.bp-MP3ControlsV2{position:relative;width:100%;max-width:none;height:100%;background:transparent;pointer-events:none}.bp-MP3ControlsV2-stage{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-height:0;pointer-events:none}.bp-MP3ControlsV2-stage .bp-WaveformView{pointer-events:auto}.bp-MP3ControlsV2-playOverlay{position:absolute;top:50%;left:50%;z-index:2;display:flex;align-items:center;justify-content:center;width:80px;height:80px;padding:0;background:rgba(0,0,0,.5);border:0;border-radius:50%;transform:translate(-50%, -50%);cursor:pointer;pointer-events:auto}.bp-MP3ControlsV2-playOverlay svg{width:48px;height:48px;fill:#fff}.bp-MP3ControlsV2-stage .bp-media-buffering-spinner{z-index:2;pointer-events:none}.bp-MP3ControlsV2-bar{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;justify-content:space-between;min-height:32px;padding:30px 48px 20px;background:linear-gradient(to top, black, rgba(0, 0, 0, 0));pointer-events:auto}.bp-MP3ControlsV2-group{display:flex;gap:12px;align-items:center}.bp-MP3ControlsV2-divider{width:1px;height:24px;background-color:rgba(255,255,255,.1);border-radius:1px}.bp-MP3ControlsV2 .bp-MP3Controls-settings{position:relative}.bp-MP3ControlsV2 .bp-MP3Controls-settings .bp-SettingsFlyout{right:15px}.bp-MP3ControlsV2 .bp-MP3Controls-settings .bp-SettingsToggle-button{width:36px;height:40px}
+.bp-WaveformView{box-sizing:border-box;width:100%;height:206px;min-height:206px;padding:0 60px;overflow:visible;background:none}.bp-WaveformView-track{position:relative;display:flex;align-items:center;width:100%;height:100%;cursor:pointer}.bp-WaveformView-canvas{z-index:0;width:100%;height:140px}.bp-WaveformView-playhead{position:absolute;top:50%;left:0;z-index:1;width:2px;height:150px;pointer-events:none;background:linear-gradient(#2487ff, #006bed);border-radius:1px;box-shadow:0 0 0 1px #222,0 0 10px 0 rgba(36,135,255,.3);transform:translate(-50%, -50%)}.bp-WaveformView-hover{position:absolute;top:100%;z-index:2;margin-top:4px;pointer-events:none;transform:translateX(-50%)}.bp-WaveformView-hoverTime{padding:4px 10px;color:#fff;font-weight:normal;font-size:14px;font-family:Lato,Arial,sans-serif;line-height:20px;letter-spacing:.3px;white-space:nowrap;background:rgba(34,34,34,.92);border:1px solid rgba(255,255,255,.18);border-radius:8px}.bp-WaveformView--inert{pointer-events:none}.bp-WaveformView--inert .bp-WaveformView-track{cursor:default}
+.bp-MP3ControlsRoot:has(.bp-MP3ControlsV2){position:absolute;inset:0;width:100%;height:100%;transform:none;pointer-events:none}.bp-MP3ControlsV2{position:relative;width:100%;max-width:none;height:100%;background:transparent;pointer-events:none}.bp-MP3ControlsV2-stage{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-height:0;pointer-events:none}.bp-MP3ControlsV2-stage .bp-WaveformView{pointer-events:auto}.bp-MP3ControlsV2-playOverlay{position:absolute;top:50%;left:50%;z-index:2;display:flex;align-items:center;justify-content:center;width:80px;height:80px;padding:0;background:rgba(0,0,0,.5);border:0;border-radius:50%;transform:translate(-50%, -50%);cursor:pointer;pointer-events:auto}.bp-MP3ControlsV2-playOverlay svg{width:48px;height:48px;fill:#fff}.bp-MP3ControlsV2-stage .bp-media-buffering-spinner{z-index:2;pointer-events:none}.bp-MP3ControlsV2-bar{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;justify-content:space-between;min-height:32px;padding:30px 58px 25px;background:linear-gradient(to top, black, rgba(0, 0, 0, 0));pointer-events:auto}.bp-MP3ControlsV2-group{display:flex;gap:12px;align-items:center}.bp-MP3ControlsV2-divider{width:1px;height:24px;background-color:rgba(255,255,255,.1);border-radius:1px}.bp-MP3ControlsV2 .bp-MP3Controls-settings{position:relative}.bp-MP3ControlsV2 .bp-MP3Controls-settings .bp-SettingsFlyout{right:15px}.bp-MP3ControlsV2 .bp-MP3Controls-settings .bp-SettingsToggle-button{width:36px;height:40px}
 .bp-Filmstrip{position:absolute;bottom:100%;overflow:hidden;background:transparent;box-shadow:0 0 1px #464a4f;visibility:hidden}.bp-Filmstrip.bp-is-shown{visibility:visible}.bp-Filmstrip-frame{display:flex;align-items:center;justify-content:center}.bp-Filmstrip-time{height:20px;color:#fff;font-size:13px;line-height:20px;text-align:center;background-color:#222}
 .bp-SliderControl{outline:0;position:relative;cursor:pointer}.bp-SliderControl:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-SliderControl:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-SliderControl:focus:not(:focus-visible){box-shadow:none}.bp-SliderControl-thumb{position:absolute;top:calc(50% - 6px);width:12px;height:12px;margin-left:-6px;background:#0061d5;border:0;border-radius:12px;cursor:pointer}.bp-SliderControl-track{position:absolute;inset:0;height:3px;margin:auto 3px;background:transparent linear-gradient(#fff, #fff) no-repeat center border-box}
 .bp-TimeControls{position:relative;margin-right:10px;margin-left:10px}.bp-TimeControls-slider{height:18px}.bp-TimeControls-slider .bp-SliderControl-thumb{transform:scale(0);transition:transform 100ms ease;will-change:transform}.bp-TimeControls-slider .bp-SliderControl-track{backface-visibility:hidden;transition:transform 100ms ease;will-change:transform}.bp-TimeControls-slider.bp-is-scrubbing .bp-SliderControl-thumb,.bp-TimeControls-slider:focus .bp-SliderControl-thumb,.bp-TimeControls-slider:hover .bp-SliderControl-thumb{transform:scale(1)}.bp-TimeControls-slider.bp-is-scrubbing .bp-SliderControl-track,.bp-TimeControls-slider:focus .bp-SliderControl-track,.bp-TimeControls-slider:hover .bp-SliderControl-track{transform:scaleY(2)}

package/dist/lib/index.js CHANGED Viewed

@@ -1009,7 +1009,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 const CLIENT_NAME = "box-content-preview"; // eslint-disable-line no-undef
 const CLIENT_NAME_KEY = 'box_client_name';
 const CLIENT_VERSION_KEY = 'box_client_version';
-const CLIENT_VERSION = "3.82.0"; // eslint-disable-line no-undef
+const CLIENT_VERSION = "3.83.0"; // eslint-disable-line no-undef
 const HEADER_CLIENT_NAME = 'X-Box-Client-Name';
 const HEADER_CLIENT_VERSION = 'X-Box-Client-Version';
 const PROMISE_MAP = {};
@@ -4667,6 +4667,731 @@ function isFpsAvailable(player) {
 /***/ },
+/***/ 9514
+(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  decodeToPeaks: () => (/* binding */ decodeToPeaks),
+  extractPeaks: () => (/* binding */ extractPeaks),
+  getDecodeDecision: () => (/* binding */ getDecodeDecision),
+  loadPeaks: () => (/* binding */ loadPeaks),
+  runClientDecode: () => (/* binding */ runClientDecode)
+});
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+;// ./src/lib/viewers/media/waveform/constants.ts
+/** Current waveform payload schema version. Bump only with a migration path. */
+const WAVEFORM_PAYLOAD_VERSION = 1;
+/** Maximum peaks in a single tier (overview or detail). */
+const MAX_PEAK_COUNT = 16384;
+/** Hard limit on serialized JSON body size for a waveform payload (bytes). */
+const MAX_PAYLOAD_BYTES = 512 * 1024;
+/** Allowed delta between payload duration and caller-supplied media duration (seconds). */
+const DURATION_MISMATCH_TOLERANCE_SEC = 1;
+/** Peak values must live in this closed interval when peakScale is "unit". */
+const PEAK_UNIT_MIN = 0;
+const PEAK_UNIT_MAX = 1;
+/** Skip client decode when the compressed file is larger than this. */
+const CLIENT_DECODE_MAX_COMPRESSED_BYTES = 6 * 1024 * 1024;
+/** Skip client decode when media duration is longer than this. */
+const CLIENT_DECODE_MAX_DURATION_SEC = 5 * 60;
+/** Default overview resolution for client-generated peaks. */
+const CLIENT_DECODE_PEAK_COUNT = 16384;
+;// ./src/lib/viewers/media/waveform/types.ts
+/**
+ * Box V1 is the in-viewer form: unsigned mono peaks in [0, 1] (peak envelope, mono_max).
+ * Wire JSON only requires version, durationSec, and peaks. Policy fields default.
+ * Conversion or wavesurfer payloads should be adapted at the edge, not stored as-is.
+ */
+/** Who produced peaks */
+/**
+ * Viewer-normalized waveform JSON (version 1).
+ * Required: version, durationSec, peaks. Everything else is optional and defaulted.
+ */
+/** Validated, runtime-friendly peak data passed to renderers. */
+const WAVEFORM_ERROR_CODES = ['INVALID_PAYLOAD', 'UNSUPPORTED_VERSION', 'INVALID_DURATION', 'DURATION_MISMATCH', 'PEAK_COUNT_EXCEEDED', 'PAYLOAD_TOO_LARGE', 'NON_FINITE_PEAK', 'PEAK_OUT_OF_RANGE', 'EMPTY_PEAKS', 'CAP_EXCEEDED', 'LOAD_FAILED', 'DECODE_FAILED', 'CANCELLED', 'UNAVAILABLE'];
+const WAVEFORM_ERROR_CODE_SET = new Set(WAVEFORM_ERROR_CODES);
+function isWaveformErrorCode(value) {
+  return WAVEFORM_ERROR_CODE_SET.has(value);
+}
+/**
+ * Async boundary for waveform data. Implementations may fetch fixtures, decode client-side,
+ * or load Conversion reps — callers only observe WaveformLoadState.
+ */
+;// ./src/lib/viewers/media/waveform/createWaveformLoader.ts
+/* unused harmony import specifier */ var isRetryableWaveformError;
+/* unused harmony import specifier */ var validateWaveformPayload;
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/** Typed throw from fetchPayload (e.g. client decode). `error.name` fallback still works. */
+class WaveformLoadError extends Error {
+  constructor(code, message) {
+    super(message);
+    _defineProperty(this, "code", void 0);
+    this.name = code;
+    this.code = code;
+  }
+}
+function isAbortError(error) {
+  return typeof DOMException !== 'undefined' && error instanceof DOMException && error.name === 'AbortError' || error instanceof Error && error.name === 'AbortError';
+}
+function errorFromUnknown(error, fallbackCode = 'LOAD_FAILED') {
+  if (error instanceof WaveformLoadError) {
+    return {
+      code: error.code,
+      message: error.message
+    };
+  }
+  if (error instanceof SyntaxError) {
+    return {
+      code: 'INVALID_PAYLOAD',
+      message: error.message
+    };
+  }
+  if (error instanceof Error && isWaveformErrorCode(error.name)) {
+    return {
+      code: error.name,
+      message: error.message
+    };
+  }
+  const message = error instanceof Error ? error.message : 'Waveform load failed';
+  return {
+    code: fallbackCode,
+    message
+  };
+}
+function failedLoadState(error) {
+  return {
+    status: 'failed',
+    error,
+    retryable: isRetryableWaveformError(error.code)
+  };
+}
+function readyLoadState(payload) {
+  return {
+    status: 'ready',
+    payload
+  };
+}
+/**
+ * Wraps an async payload fetch with abort + stale-result suppression.
+ * Playback must not depend on this completing — callers treat unavailable/failed as degrade paths.
+ * abort() cancels an in-flight load only; a successful ready state is left intact.
+ */
+function createWaveformLoader(fetchPayload, options = {}) {
+  let state = {
+    status: 'unavailable'
+  };
+  let generation = 0;
+  let abortController = null;
+  const setState = next => {
+    state = next;
+  };
+  const settle = next => {
+    setState(next);
+    return next;
+  };
+  const startLoad = () => {
+    if (abortController) {
+      abortController.abort();
+    }
+    generation += 1;
+    abortController = new AbortController();
+    setState({
+      status: 'pending'
+    });
+    return {
+      id: generation,
+      signal: abortController.signal
+    };
+  };
+  const cancelledIfStale = request => {
+    if (!request.signal.aborted && generation === request.id) {
+      return null;
+    }
+    if (generation === request.id) {
+      setState({
+        status: 'cancelled'
+      });
+    }
+    return {
+      status: 'cancelled'
+    };
+  };
+  const settleValidation = validation => {
+    if (!validation.ok) {
+      return settle(failedLoadState(validation.error));
+    }
+    return settle(readyLoadState(validation.payload));
+  };
+  const settleFetchError = (error, request) => {
+    if (request.signal.aborted || generation !== request.id || isAbortError(error)) {
+      if (generation === request.id) {
+        return settle({
+          status: 'cancelled'
+        });
+      }
+      return {
+        status: 'cancelled'
+      };
+    }
+    return settle(failedLoadState(errorFromUnknown(error)));
+  };
+  const load = async () => {
+    const request = startLoad();
+    try {
+      const raw = await fetchPayload(request.signal);
+      const staleAfterFetch = cancelledIfStale(request);
+      if (staleAfterFetch) {
+        return staleAfterFetch;
+      }
+      const validation = validateWaveformPayload(raw, options);
+      const staleAfterValidate = cancelledIfStale(request);
+      if (staleAfterValidate) {
+        return staleAfterValidate;
+      }
+      return settleValidation(validation);
+    } catch (error) {
+      return settleFetchError(error, request);
+    } finally {
+      if (generation === request.id) {
+        abortController = null;
+      }
+    }
+  };
+  const abort = () => {
+    if (!abortController) {
+      return;
+    }
+    generation += 1;
+    abortController.abort();
+    abortController = null;
+    setState({
+      status: 'cancelled'
+    });
+  };
+  return {
+    load,
+    abort,
+    getState: () => state
+  };
+}
+/** Returns capped state when media exceeds client decode size or duration limits. */
+function createCappedWaveformState(message) {
+  return {
+    status: 'capped',
+    error: {
+      code: 'CAP_EXCEEDED',
+      message
+    }
+  };
+}
+;// ./src/lib/viewers/media/waveform/validateWaveformPayload.ts
+const DEFAULT_PEAK_SCALE = 'unit';
+const DEFAULT_CHANNEL_POLICY = 'mono_max';
+const DEFAULT_ENVELOPE = 'peak';
+function fail(code, message, retryable = false) {
+  return {
+    ok: false,
+    error: {
+      code,
+      message
+    },
+    retryable
+  };
+}
+function isPlainObject(value) {
+  return typeof value === 'object' && value !== null && !Array.isArray(value);
+}
+function payloadByteLength(raw) {
+  try {
+    const serialized = JSON.stringify(raw);
+    if (typeof Buffer !== 'undefined') {
+      return Buffer.byteLength(serialized, 'utf8');
+    }
+    if (typeof TextEncoder !== 'undefined') {
+      return new TextEncoder().encode(serialized).length;
+    }
+    return serialized.length;
+  } catch {
+    return Number.MAX_SAFE_INTEGER;
+  }
+}
+function readOptionalPolicy(raw, key, allowed) {
+  if (!(key in raw) || raw[key] === undefined) {
+    return undefined;
+  }
+  return raw[key] === allowed ? allowed : null;
+}
+function asWaveformPayloadV1(raw) {
+  const {
+    version,
+    durationSec,
+    peaks
+  } = raw;
+  if (version !== WAVEFORM_PAYLOAD_VERSION || typeof durationSec !== 'number' || !Array.isArray(peaks)) {
+    return null;
+  }
+  const peakScale = readOptionalPolicy(raw, 'peakScale', DEFAULT_PEAK_SCALE);
+  const channelPolicy = readOptionalPolicy(raw, 'channelPolicy', DEFAULT_CHANNEL_POLICY);
+  const envelope = readOptionalPolicy(raw, 'envelope', DEFAULT_ENVELOPE);
+  if (peakScale === null || channelPolicy === null || envelope === null) {
+    return null;
+  }
+  if ('channels' in raw && raw.channels !== undefined && raw.channels !== 1) {
+    return null;
+  }
+  return {
+    version: WAVEFORM_PAYLOAD_VERSION,
+    durationSec,
+    peaks: peaks,
+    peakScale: peakScale ?? DEFAULT_PEAK_SCALE,
+    channelPolicy: channelPolicy ?? DEFAULT_CHANNEL_POLICY,
+    envelope: envelope ?? DEFAULT_ENVELOPE,
+    channels: 1
+  };
+}
+function readPayloadObject(raw, maxPayloadBytes, isPayloadByteCheckSkipped = false) {
+  if (raw === null || raw === undefined) {
+    return fail('INVALID_PAYLOAD', 'Payload is null or undefined');
+  }
+  if (!isPayloadByteCheckSkipped) {
+    const byteLength = payloadByteLength(raw);
+    if (byteLength > maxPayloadBytes) {
+      return fail('PAYLOAD_TOO_LARGE', `Payload size ${byteLength} exceeds limit ${maxPayloadBytes}`);
+    }
+  }
+  if (!isPlainObject(raw)) {
+    return fail('INVALID_PAYLOAD', 'Payload must be an object');
+  }
+  return {
+    ok: true,
+    value: raw
+  };
+}
+function checkVersion(raw) {
+  if (raw.version === WAVEFORM_PAYLOAD_VERSION) {
+    return null;
+  }
+  const {
+    version
+  } = raw;
+  if (typeof version === 'number' && version > WAVEFORM_PAYLOAD_VERSION) {
+    return fail('UNSUPPORTED_VERSION', `Unsupported waveform version ${version}; max supported is ${WAVEFORM_PAYLOAD_VERSION}`);
+  }
+  return fail('INVALID_PAYLOAD', 'Missing or invalid version field');
+}
+function checkDuration(payload, expectedDurationSec) {
+  if (!Number.isFinite(payload.durationSec) || payload.durationSec <= 0) {
+    return fail('INVALID_DURATION', 'durationSec must be a positive finite number');
+  }
+  if (expectedDurationSec !== undefined && Number.isFinite(expectedDurationSec) && Math.abs(payload.durationSec - expectedDurationSec) > DURATION_MISMATCH_TOLERANCE_SEC) {
+    return fail('DURATION_MISMATCH', `Payload duration ${payload.durationSec}s differs from media duration ${expectedDurationSec}s`, true);
+  }
+  return null;
+}
+function normalizePeaks(peaks, maxPeakCount) {
+  if (peaks.length === 0) {
+    return fail('EMPTY_PEAKS', 'peaks array must not be empty');
+  }
+  if (peaks.length > maxPeakCount) {
+    return fail('PEAK_COUNT_EXCEEDED', `peaks length ${peaks.length} exceeds max ${maxPeakCount}`);
+  }
+  const normalized = new Float32Array(peaks.length);
+  for (let i = 0; i < peaks.length; i += 1) {
+    const value = peaks[i];
+    if (!Number.isFinite(value)) {
+      return fail('NON_FINITE_PEAK', `Peak at index ${i} is not finite`);
+    }
+    if (value < PEAK_UNIT_MIN || value > PEAK_UNIT_MAX) {
+      return fail('PEAK_OUT_OF_RANGE', `Peak at index ${i} is outside [${PEAK_UNIT_MIN}, ${PEAK_UNIT_MAX}]`);
+    }
+    normalized[i] = value;
+  }
+  return {
+    ok: true,
+    peaks: normalized
+  };
+}
+/**
+ * Validates a version-1 waveform payload and returns normalized peaks for rendering.
+ * Wire JSON requires version, durationSec, and peaks. sampleCount and source are ignored.
+ */
+function validateWaveformPayload_validateWaveformPayload(raw, options = {}) {
+  const maxPeakCount = options.maxPeakCount ?? MAX_PEAK_COUNT;
+  const maxPayloadBytes = options.maxPayloadBytes ?? MAX_PAYLOAD_BYTES;
+  const objectResult = readPayloadObject(raw, maxPayloadBytes, options.isPayloadByteCheckSkipped === true);
+  if (!objectResult.ok) {
+    return objectResult;
+  }
+  const versionFailure = checkVersion(objectResult.value);
+  if (versionFailure) {
+    return versionFailure;
+  }
+  const payload = asWaveformPayloadV1(objectResult.value);
+  if (!payload) {
+    return fail('INVALID_PAYLOAD', 'Payload failed structural validation');
+  }
+  const durationFailure = checkDuration(payload, options.expectedDurationSec);
+  if (durationFailure) {
+    return durationFailure;
+  }
+  const peaksResult = normalizePeaks(payload.peaks, maxPeakCount);
+  if (!peaksResult.ok) {
+    return peaksResult;
+  }
+  return {
+    ok: true,
+    payload: {
+      version: WAVEFORM_PAYLOAD_VERSION,
+      durationSec: payload.durationSec,
+      peaks: peaksResult.peaks,
+      peakScale: payload.peakScale ?? DEFAULT_PEAK_SCALE,
+      channelPolicy: payload.channelPolicy ?? DEFAULT_CHANNEL_POLICY,
+      envelope: payload.envelope ?? DEFAULT_ENVELOPE
+    }
+  };
+}
+/** Maps validation / load failures to retry policy for loaders. */
+function validateWaveformPayload_isRetryableWaveformError(code) {
+  return code === 'DURATION_MISMATCH' || code === 'DECODE_FAILED' || code === 'LOAD_FAILED';
+}
+;// ./src/lib/viewers/media/waveform/decode.ts
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { decode_defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function decode_defineProperty(e, r, t) { return (r = decode_toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function decode_toPropertyKey(t) { var i = decode_toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function decode_toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const EMPTY_TIMINGS = {
+  attemptMs: null,
+  extractMs: null
+};
+function getCurrentTimeMs() {
+  return typeof performance !== 'undefined' ? performance.now() : Date.now();
+}
+function createAbortError() {
+  return new DOMException('Aborted', 'AbortError');
+}
+function isPositiveFinite(value) {
+  return typeof value === 'number' && Number.isFinite(value) && value > 0;
+}
+function getAudioContextConstructor() {
+  if (typeof window === 'undefined') {
+    return undefined;
+  }
+  const {
+    AudioContext,
+    webkitAudioContext
+  } = window;
+  return AudioContext || webkitAudioContext;
+}
+function getDecodeSkipMessage(reason) {
+  if (reason === 'compressed_size') {
+    return 'Compressed size exceeds client decode limit';
+  }
+  if (reason === 'duration') {
+    return 'Duration exceeds client decode limit';
+  }
+  return 'Compressed size or duration is missing; skipping client decode';
+}
+function createSkippedDecodeResult(reason) {
+  if (reason === 'missing_metadata') {
+    return {
+      status: 'unavailable',
+      error: {
+        code: 'UNAVAILABLE',
+        message: getDecodeSkipMessage(reason)
+      },
+      isDecodeSkipped: true,
+      timings: EMPTY_TIMINGS,
+      reason
+    };
+  }
+  return _objectSpread(_objectSpread({}, createCappedWaveformState(getDecodeSkipMessage(reason))), {}, {
+    isDecodeSkipped: true,
+    timings: EMPTY_TIMINGS,
+    reason
+  });
+}
+function decodeWithContext(context, buffer, signal) {
+  return new Promise((resolve, reject) => {
+    let isSettled = false;
+    let onAbort = () => undefined;
+    const onSuccess = decoded => {
+      if (isSettled) {
+        return;
+      }
+      isSettled = true;
+      signal?.removeEventListener('abort', onAbort);
+      resolve(decoded);
+    };
+    const onFailure = error => {
+      if (isSettled) {
+        return;
+      }
+      isSettled = true;
+      signal?.removeEventListener('abort', onAbort);
+      if (isAbortError(error)) {
+        reject(error instanceof DOMException ? error : createAbortError());
+        return;
+      }
+      reject(error instanceof WaveformLoadError ? error : new WaveformLoadError('DECODE_FAILED', 'decodeAudioData failed'));
+    };
+    onAbort = () => onFailure(createAbortError());
+    if (signal?.aborted) {
+      onFailure(createAbortError());
+      return;
+    }
+    signal?.addEventListener('abort', onAbort, {
+      once: true
+    });
+    try {
+      const maybePromise = context.decodeAudioData(buffer, onSuccess, onFailure);
+      if (maybePromise && typeof maybePromise.then === 'function') {
+        maybePromise.then(onSuccess, onFailure);
+      }
+    } catch (error) {
+      onFailure(error);
+    }
+  });
+}
+/**
+ * Decide whether to run decodeAudioData. Either cap failing, or unknown size/duration,
+ * skips decode so playback is never blocked by expanding the full audio buffer.
+ */
+function getDecodeDecision(media, caps = {}) {
+  const maxCompressedBytes = caps.maxCompressedBytes ?? CLIENT_DECODE_MAX_COMPRESSED_BYTES;
+  const maxDurationSec = caps.maxDurationSec ?? CLIENT_DECODE_MAX_DURATION_SEC;
+  const {
+    compressedBytes,
+    durationSec
+  } = media;
+  if (!isPositiveFinite(compressedBytes) || !isPositiveFinite(durationSec)) {
+    return {
+      isAllowed: false,
+      reason: 'missing_metadata'
+    };
+  }
+  if (compressedBytes > maxCompressedBytes) {
+    return {
+      isAllowed: false,
+      reason: 'compressed_size'
+    };
+  }
+  if (durationSec > maxDurationSec) {
+    return {
+      isAllowed: false,
+      reason: 'duration'
+    };
+  }
+  return {
+    isAllowed: true
+  };
+}
+/**
+ * Collapse audio channels to one unsigned peak per time bucket (max abs, then clamp to unit).
+ * Accepts an AudioBuffer so callers can extract before closing the AudioContext.
+ */
+function extractPeaks(audio, peakCount = CLIENT_DECODE_PEAK_COUNT) {
+  const channels = Array.isArray(audio) ? audio : Array.from({
+    length: audio.numberOfChannels
+  }, (_, channelIndex) => audio.getChannelData(channelIndex));
+  if (peakCount <= 0 || channels.length === 0) {
+    return [];
+  }
+  const sampleCount = channels[0].length;
+  if (sampleCount === 0) {
+    return [];
+  }
+  const peaks = new Array(peakCount);
+  const bucketWidth = sampleCount / peakCount;
+  for (let i = 0; i < peakCount; i += 1) {
+    const start = Math.floor(i * bucketWidth);
+    const end = Math.max(start + 1, Math.floor((i + 1) * bucketWidth));
+    let maxAbs = 0;
+    for (let sampleIndex = start; sampleIndex < end && sampleIndex < sampleCount; sampleIndex += 1) {
+      for (let channelIndex = 0; channelIndex < channels.length; channelIndex += 1) {
+        const value = Math.abs(channels[channelIndex][sampleIndex]);
+        if (value > maxAbs) {
+          maxAbs = value;
+        }
+      }
+    }
+    peaks[i] = Math.min(PEAK_UNIT_MAX, Math.max(PEAK_UNIT_MIN, maxAbs));
+  }
+  return peaks;
+}
+/**
+ * Decode compressed audio and extract unit peaks while the AudioBuffer is live.
+ * Does not attach a media element or fetch a URL. Does not copy channel data.
+ */
+async function decodeToPeaks(arrayBuffer, signal, peakCount = CLIENT_DECODE_PEAK_COUNT) {
+  if (signal?.aborted) {
+    throw createAbortError();
+  }
+  const AudioContextConstructor = getAudioContextConstructor();
+  if (!AudioContextConstructor) {
+    throw new WaveformLoadError('DECODE_FAILED', 'AudioContext is not available');
+  }
+  const context = new AudioContextConstructor();
+  try {
+    const audioBuffer = await decodeWithContext(context, arrayBuffer.slice(0), signal);
+    if (signal?.aborted) {
+      throw createAbortError();
+    }
+    const extractStarted = getCurrentTimeMs();
+    const peaks = extractPeaks(audioBuffer, peakCount);
+    return {
+      durationSec: audioBuffer.duration,
+      peaks,
+      extractMs: getCurrentTimeMs() - extractStarted
+    };
+  } catch (error) {
+    if (signal?.aborted || isAbortError(error)) {
+      throw createAbortError();
+    }
+    throw error;
+  } finally {
+    try {
+      await context.close();
+    } catch {
+      // Context may already be closed.
+    }
+  }
+}
+/**
+ * Run a client-decode attempt against the V1 waveform contract.
+ * Decode is not invoked when size or duration is over the cap (or unknown).
+ */
+async function runClientDecode(options) {
+  const decision = getDecodeDecision({
+    compressedBytes: options.compressedBytes,
+    durationSec: options.durationSec
+  }, options.caps);
+  if (!decision.isAllowed) {
+    return createSkippedDecodeResult(decision.reason);
+  }
+  if (options.signal?.aborted) {
+    return {
+      status: 'cancelled',
+      isDecodeSkipped: true,
+      timings: EMPTY_TIMINGS
+    };
+  }
+  const signal = options.signal ?? new AbortController().signal;
+  const decodeStarted = getCurrentTimeMs();
+  let decodeOutput;
+  try {
+    decodeOutput = await options.decode(signal);
+  } catch (error) {
+    if (signal.aborted || isAbortError(error)) {
+      return {
+        status: 'cancelled',
+        isDecodeSkipped: false,
+        timings: EMPTY_TIMINGS
+      };
+    }
+    const waveformError = errorFromUnknown(error, 'DECODE_FAILED');
+    return {
+      status: 'failed',
+      error: waveformError,
+      retryable: validateWaveformPayload_isRetryableWaveformError(waveformError.code),
+      isDecodeSkipped: false,
+      timings: {
+        attemptMs: getCurrentTimeMs() - decodeStarted,
+        extractMs: null
+      }
+    };
+  }
+  const attemptMs = getCurrentTimeMs() - decodeStarted;
+  if (signal.aborted) {
+    return {
+      status: 'cancelled',
+      isDecodeSkipped: false,
+      timings: {
+        attemptMs,
+        extractMs: null
+      }
+    };
+  }
+  const validation = validateWaveformPayload_validateWaveformPayload({
+    version: WAVEFORM_PAYLOAD_VERSION,
+    durationSec: options.durationSec ?? decodeOutput.durationSec,
+    peaks: decodeOutput.peaks
+  }, {
+    isPayloadByteCheckSkipped: true
+  });
+  if (!validation.ok) {
+    return {
+      status: 'failed',
+      error: validation.error,
+      retryable: validateWaveformPayload_isRetryableWaveformError(validation.error.code),
+      isDecodeSkipped: false,
+      timings: {
+        attemptMs,
+        extractMs: decodeOutput.extractMs
+      }
+    };
+  }
+  return {
+    status: 'ready',
+    payload: validation.payload,
+    isDecodeSkipped: false,
+    timings: {
+      attemptMs,
+      extractMs: decodeOutput.extractMs
+    }
+  };
+}
+/**
+ * Gate, fetch, decode, and extract in-viewer peaks. Skips decode when over cap.
+ * Playback must not await this.
+ */
+function loadPeaks(request) {
+  return runClientDecode({
+    compressedBytes: request.compressedBytes,
+    durationSec: request.durationSec,
+    signal: request.signal,
+    decode: async signal => {
+      const arrayBuffer = await request.fetchArrayBuffer(signal);
+      return decodeToPeaks(arrayBuffer, signal);
+    }
+  });
+}
+/***/ },
 /***/ 2485
 (module, exports) {
@@ -20330,7 +21055,7 @@ class Browser {
 ;// ./src/lib/Logger.js
 /* eslint-disable no-undef */
 const CLIENT_NAME = "box-content-preview";
-const CLIENT_VERSION = "3.82.0";
+const CLIENT_VERSION = "3.83.0";
 /* eslint-enable no-undef */
 class Logger {
@@ -33172,6 +33897,11 @@ function MP3Viewer_toPrimitive(t, r) { if ("object" != typeof t || !t) return t;
 const CSS_CLASS_MP3 = 'bp-media-mp3';
+function createLoadFailedError(message) {
+  const error = new Error(message);
+  error.name = 'LOAD_FAILED';
+  return error;
+}
 class MP3Viewer extends media_MediaBaseViewer {
   constructor(...args) {
     super(...args);
@@ -33181,6 +33911,11 @@ class MP3Viewer extends media_MediaBaseViewer {
     MP3Viewer_defineProperty(this, "handlePlayRequest", () => {
       this.userRequestedPlay = true;
       this.togglePlay();
+      if (this.isWaveformDecodeRetryPending && !this.hasUsedWaveformDecodePlayRetry) {
+        this.hasUsedWaveformDecodePlayRetry = true;
+        this.isWaveformDecodeRetryPending = false;
+        this.startClientWaveformDecode();
+      }
     });
     /**
      * Auto-play was prevented, pause the audio
@@ -33210,6 +33945,7 @@ class MP3Viewer extends media_MediaBaseViewer {
       this.wrapperEl.classList.add('bp-media--v2');
       this.mediaContainerEl.classList.add('bp-media-container--v2');
       this.ensureV2Controls();
+      this.importWaveformDecode();
     }
     // Audio element
@@ -33271,6 +34007,29 @@ class MP3Viewer extends media_MediaBaseViewer {
     return Promise.resolve(/* import() */).then(__webpack_require__.bind(__webpack_require__, 7893));
   }
+  /**
+   * @return {Promise<{ loadPeaks: Function }>} client-decode helpers
+   */
+  async importWaveformDecode() {
+    if (!this.waveformDecodeImport) {
+      this.waveformDecodeImport = Promise.resolve(/* import() */).then(__webpack_require__.bind(__webpack_require__, 9514));
+    }
+    try {
+      return await this.waveformDecodeImport;
+    } catch (error) {
+      this.waveformDecodeImport = null;
+      throw error;
+    }
+  }
+  /**
+   * @inheritdoc
+   */
+  destroy() {
+    this.abortClientWaveformDecode();
+    super.destroy();
+  }
   /**
    * @inheritdoc
    */
@@ -33315,10 +34074,126 @@ class MP3Viewer extends media_MediaBaseViewer {
    */
   loadeddataHandler() {
     super.loadeddataHandler();
-    if (this.isAudioPlayerV2 && this.userRequestedPlay) {
+    if (!this.isAudioPlayerV2) {
+      return;
+    }
+    // Play first so Safari has a user gesture before AudioContext is created.
+    if (this.userRequestedPlay) {
       this.play();
     }
+    this.startClientWaveformDecode();
   }
+  /**
+   * Fetch compressed audio bytes for client decode. Prefers an already-fetched blob URL.
+   *
+   * @param {AbortSignal} signal
+   * @return {Promise<ArrayBuffer>}
+   */
+  async fetchAudioArrayBuffer(signal) {
+    if (this.mediaBlobUrl) {
+      const response = await fetch(this.mediaBlobUrl, {
+        signal
+      });
+      if (!response.ok) {
+        throw createLoadFailedError(`Waveform fetch failed (${response.status})`);
+      }
+      return response.arrayBuffer();
+    }
+    const template = this.options.representation && this.options.representation.content && this.options.representation.content.url_template;
+    if (!template) {
+      throw createLoadFailedError('Waveform fetch URL is missing');
+    }
+    const data = await this.api.get(this.createContentUrlV2(template), {
+      headers: this.appendAuthHeader(),
+      signal,
+      type: 'arraybuffer'
+    });
+    if (data instanceof ArrayBuffer) {
+      return data;
+    }
+    throw createLoadFailedError('Waveform fetch did not return binary data');
+  }
+  abortClientWaveformDecode() {
+    if (!this.waveformDecodeController) {
+      return;
+    }
+    this.waveformDecodeController.abort();
+    this.waveformDecodeController = null;
+  }
+  /**
+   * Decode peaks in the background when the file is under size and duration caps.
+   * Does not block playback. Capped or failed decode keeps the placeholder waveform.
+   *
+   * @return {Promise<void>}
+   */
+  async startClientWaveformDecode() {
+    if (!this.isAudioPlayerV2 || this.destroyed) {
+      return;
+    }
+    this.abortClientWaveformDecode();
+    const controller = new AbortController();
+    this.waveformDecodeController = controller;
+    const {
+      signal
+    } = controller;
+    try {
+      const decodeModule = await this.importWaveformDecode();
+      if (this.destroyed || signal.aborted || this.waveformDecodeController !== controller) {
+        return;
+      }
+      const result = await decodeModule.loadPeaks({
+        compressedBytes: this.options.file && this.options.file.size,
+        durationSec: this.mediaEl && this.mediaEl.duration,
+        fetchArrayBuffer: fetchSignal => this.fetchAudioArrayBuffer(fetchSignal),
+        signal
+      });
+      this.handleClientWaveformDecodeResult(result, controller, signal);
+    } catch (error) {
+      if (error && error.name === 'AbortError') {
+        this.handleClientWaveformDecodeResult({
+          status: 'cancelled'
+        }, controller, signal);
+        return;
+      }
+      this.handleClientWaveformDecodeResult({
+        error: {
+          code: 'LOAD_FAILED',
+          message: error instanceof Error ? error.message : 'Waveform decode failed'
+        },
+        retryable: true,
+        status: 'failed'
+      }, controller, signal);
+    }
+  }
+  /**
+   * Apply peaks, or record a retryable failure for overlay play.
+   *
+   * @param {import('./waveform/types').ClientDecodeResult} result
+   * @param {AbortController} controller in-flight controller for this attempt
+   * @param {AbortSignal} signal
+   * @return {void}
+   */
+  handleClientWaveformDecodeResult(result, controller, signal) {
+    if (!result || this.destroyed || signal.aborted || this.waveformDecodeController !== controller) {
+      return;
+    }
+    if (result.status === 'ready') {
+      this.waveformPeaks = result.payload.peaks;
+      this.isWaveformDecodeRetryPending = false;
+      this.renderUI();
+      return;
+    }
+    if (result.status === 'cancelled') {
+      return;
+    }
+    if (result.status === 'failed' && result.retryable && !this.hasUsedWaveformDecodePlayRetry) {
+      this.isWaveformDecodeRetryPending = true;
+    }
+  }
   /**
    * @inheritdoc
    */

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "box-content-preview",
-    "version": "3.82.0",
+    "version": "3.83.0",
     "description": "Box Content Preview UI Element",
     "author": "Box (https://www.box.com/)",
     "license": "SEE LICENSE IN LICENSE",