box-content-preview 3.124.0 → 3.125.0

package/README.md

@@ -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.124.0-blue.svg?style=flat-square)](https://github.com/box/box-content-preview)
+[![version](https://img.shields.io/badge/version-v3.125.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.124.0
+- Version: v3.125.0
 - Locale: en-US
 
-https://cdn01.boxcdn.net/platform/preview/3.124.0/en-US/preview.js
-https://cdn01.boxcdn.net/platform/preview/3.124.0/en-US/preview.css
+https://cdn01.boxcdn.net/platform/preview/3.125.0/en-US/preview.js
+https://cdn01.boxcdn.net/platform/preview/3.125.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.124.0/en-US/preview.js"></script>
+    <script src="https://cdn01.boxcdn.net/platform/preview/3.125.0/en-US/preview.js"></script>
     <link
       rel="stylesheet"
-      href="https://cdn01.boxcdn.net/platform/preview/3.124.0/en-US/preview.css"
+      href="https://cdn01.boxcdn.net/platform/preview/3.125.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.124.0`
+- Check out a specific version with `git checkout v3.125.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

@@ -40,16 +40,19 @@
 .bp-ZoomControls{display:flex;align-items:center;padding:0 6px;border-radius:46px}.bp-ZoomControls-button{will-change:opacity;opacity:.9;transition:opacity 150ms,background-color 150ms;outline:0;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;user-select:none;zoom:1;display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;border-radius:25px;color:#fff;background:rgba(0,0,0,0);margin-top:-6px;margin-bottom:-6px}.bp-ZoomControls-button:focus:not(:disabled),.bp-ZoomControls-button:hover:not(:disabled){opacity:1;background-color:rgba(255,255,255,.08)}.bp-ZoomControls-button:focus:not(:disabled) svg,.bp-ZoomControls-button:hover:not(:disabled) svg,.bp-ZoomControls-button.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-ZoomControls-button.bp-is-active,.bp-ZoomControls-button:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-ZoomControls-button.bp-is-active:focus:not(:disabled),.bp-ZoomControls-button.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-ZoomControls-button:focus:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-ZoomControls-button:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-ZoomControls-button:focus:not(:focus-visible){box-shadow:none}.bp-ZoomControls-button:disabled{pointer-events:none;cursor:default;opacity:.2}.bp-ZoomControls-button svg{width:32px;height:32px;padding:5px}.bp-ZoomControls-button svg{width:24px;height:24px}.bp-ZoomControls-current{-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;min-width:44px;padding-right:3px;padding-left:3px;font-size:13px;line-height:1;color:#fff;white-space:nowrap;opacity:.9}
 .bp-AnnotationsControls-exitBtn{display:none}
 .bp-ToggleTooltipV2{display:flex}
+.bp-ControlsBarV2--large[data-color-scheme]{--toolbar-root-padding: calc(var(--bp-space-020) - var(--bp-border-01));--toolbar-root-border-radius: var(--bp-radius-12)}.bp-ControlsBarV2--large[data-color-scheme] [role=separator]{margin-inline:var(--bp-space-010)}
 .bp-AnnotationsPaletteV2{position:absolute;right:0;bottom:100%;width:max-content;padding-bottom:var(--bp-space-020)}
 .bp-ColorPickerControlV2{display:flex}.bp-ColorPickerControlV2 .bp-ColorPickerControlV2-swatch{--select-menu-grid-option-circle-background-color: transparent;--select-menu-grid-option-circle-background-color-hover: var(--bp-surface-cta-surface-icon-on-dark-hover);--select-menu-grid-option-circle-border: var(--bp-border-01) solid transparent;--select-menu-grid-option-circle-box-shadow-focus-active: 0 0 0 var(--bp-border-01) var(--bp-gray-100), 0 0 0 var(--bp-border-03) var(--bp-border-input-border-focus)}
 .bp-ControlsOverflowMenuV2{--blueprint-web-dropdown-content-min-width: 184px}
 .bp-ResponsiveControlsBarV2-item{display:flex;flex:none;gap:inherit;align-items:center}
 .bp-ControlsMenuItemV2.bp-ControlsMenuItemV2{gap:var(--bp-space-020)}.bp-ControlsMenuItemV2.bp-ControlsMenuItemV2>:nth-child(3){margin-inline-start:var(--bp-space-020)}
+.bp-ControlsPillV2{--controls-pill-text-spacing: calc(var(--bp-space-010) + var(--bp-space-005));display:flex;flex:none;align-items:center;padding:var(--bp-space-010);border-radius:var(--bp-radius-10);background:var(--bp-white-opacity-04)}.bp-ControlsPillV2 .bp-ControlsPillV2-button,.bp-ControlsPillV2 .bp-ControlsPillV2-label{--toolbar-item-min-height: var(--bp-size-060);--toolbar-item-border-radius: var(--bp-radius-06)}.bp-ControlsPillV2 .bp-ControlsPillV2-button{--toolbar-item-min-width: var(--bp-size-060);--toolbar-icon-width: var(--bp-size-040);--toolbar-icon-height: var(--bp-size-040)}.bp-ControlsPillV2 .bp-ControlsPillV2-button svg{width:100%;height:100%}.bp-ControlsPillV2 .bp-ControlsPillV2-label{--toolbar-item-min-width: 0;--toolbar-item-padding-inline: calc(var(--controls-pill-text-spacing) - var(--bp-border-01));--toolbar-item-text-indent: 0}.bp-ControlsPillV2 .bp-ControlsPillV2-text{--text-color-on-dark-default: var(--bp-icon-cta-icon-on-dark);padding-inline:var(--controls-pill-text-spacing);white-space:nowrap}.bp-ControlsPillV2 .bp-ControlsPillV2-label .bp-ControlsPillV2-text{padding-inline:0;color:inherit}
+.bp-TabularDigit{display:inline-block;width:1ch;text-align:center}.bp-TabularDigits-text{-webkit-user-select:none;user-select:none;position:absolute;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;clip-path:inset(50%)}
 .bp-ZoomMenuItemsV2-scale{padding-block:calc(var(--dropdown-menu-item-padding) - var(--dropdown-menu-item-border-width));padding-inline:calc(var(--dropdown-menu-item-padding) - var(--dropdown-menu-item-border-width));text-align:start}
 .bp-image{position:absolute;inset:0;overflow:auto;width:100%;height:100%;margin:0;padding:0;border:0 none;text-align:center;white-space:nowrap}.bp-image::before{content:"";display:inline-block;height:100%;vertical-align:middle}.bp-image img{position:absolute;vertical-align:middle}.bp-image .pannable,.bp-image .panning{cursor:move}.bp-image .zoomable{cursor:pointer;cursor:zoom-in}.bp-images-wrapper{cursor:pointer;cursor:zoom-in;margin:0 auto;padding:0;border:0 none}.bp-images img{display:block;width:100%}.bp-content.bp-annotations-create--region.bp-annotations-ftux-image-cursor-seen .ba-PopupCursor{display:none}.bp-prefetched-image{position:absolute;width:1px;height:1px;visibility:hidden}
 .bp-PageControlsForm input[type=number].bp-PageControlsForm-input{width:44px;height:32px;padding:6px;border:1px solid var(--bp-gray-100);border-radius:0;font-size:13px;-webkit-font-smoothing:antialiased;color:var(--bp-gray-100);text-align:center;-moz-appearance:textfield;transition:border-color linear .15s}.bp-PageControlsForm input[type=number].bp-PageControlsForm-input::-webkit-outer-spin-button,.bp-PageControlsForm input[type=number].bp-PageControlsForm-input::-webkit-inner-spin-button{-webkit-appearance:none}.bp-PageControlsForm input[type=number].bp-PageControlsForm-input:focus{border:1px solid var(--bp-box-blue-100);outline:0;box-shadow:none}.bp-PageControlsForm-button{will-change:opacity;opacity:.9;transition:opacity 150ms,background-color 150ms;outline:0;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;user-select:none;zoom:1;display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;border-radius:25px;color:#fff;background:rgba(0,0,0,0);margin-top:-6px;margin-bottom:-6px}.bp-PageControlsForm-button:focus:not(:disabled),.bp-PageControlsForm-button:hover:not(:disabled){opacity:1;background-color:rgba(255,255,255,.08)}.bp-PageControlsForm-button:focus:not(:disabled) svg,.bp-PageControlsForm-button:hover:not(:disabled) svg,.bp-PageControlsForm-button.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-PageControlsForm-button.bp-is-active,.bp-PageControlsForm-button:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-PageControlsForm-button.bp-is-active:focus:not(:disabled),.bp-PageControlsForm-button.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-PageControlsForm-button:focus:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-PageControlsForm-button:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-PageControlsForm-button:focus:not(:focus-visible){box-shadow:none}.bp-PageControlsForm-button:disabled{pointer-events:none;cursor:default;opacity:.2}.bp-PageControlsForm-button svg{width:32px;height:32px;padding:5px}.bp-PageControlsForm-button-label{-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;min-width:44px;padding-right:3px;padding-left:3px;font-size:13px;line-height:1;color:#fff;white-space:nowrap;opacity:.9}@media(max-width: 767px){.bp-PageControlsForm-input,.bp-PageControlsForm-button-label{min-width:56px}}
 .bp-PageControls{display:flex;align-items:center;padding:0 6px}.bp-PageControls svg{width:24px;height:24px}.bp-PageControls-button{will-change:opacity;opacity:.9;transition:opacity 150ms,background-color 150ms;outline:0;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;user-select:none;zoom:1;display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;border-radius:25px;color:#fff;background:rgba(0,0,0,0);margin-top:-6px;margin-bottom:-6px}.bp-PageControls-button:focus:not(:disabled),.bp-PageControls-button:hover:not(:disabled){opacity:1;background-color:rgba(255,255,255,.08)}.bp-PageControls-button:focus:not(:disabled) svg,.bp-PageControls-button:hover:not(:disabled) svg,.bp-PageControls-button.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-PageControls-button.bp-is-active,.bp-PageControls-button:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-PageControls-button.bp-is-active:focus:not(:disabled),.bp-PageControls-button.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-PageControls-button:focus:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-PageControls-button:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-PageControls-button:focus:not(:focus-visible){box-shadow:none}.bp-PageControls-button:disabled{pointer-events:none;cursor:default;opacity:.2}.bp-PageControls-button svg{width:32px;height:32px;padding:5px}.bp-PageControls-button svg{width:24px;height:24px}@media(max-width: 767px){.bp-PageControls-button{display:none}}
-.bp-PageControlsFormV2{display:flex;flex:none;align-items:center}.bp-PageControlsFormV2-input{display:flex;width:var(--bp-size-140)}.bp-PageControlsFormV2-button-label{white-space:nowrap}
+.bp-PageControlsFormV2{display:flex;flex:none;align-items:center}.bp-PageControlsFormV2-input{display:flex;flex:none;width:var(--bp-size-140)}.bp-PageControlsFormV2 .bp-PageControlsFormV2-input>*{--toolbar-input-height: 100%;--toolbar-input-padding-block: 0;--toolbar-input-padding-inline: var(--bp-space-010)}.bp-PageControlsFormV2 .bp-PageControlsFormV2-input input[type=text]{color:var(--toolbar-input-color);text-align:center;background-color:var(--toolbar-input-background)}.bp-PageControlsFormV2-button-label{white-space:nowrap}
 .bp-images-wrapper{cursor:default;position:absolute;inset:0;overflow:auto;width:100%;height:100%;margin:0 auto;padding:0;border:0 none;text-align:center;white-space:nowrap}.bp-images.pannable{cursor:move;cursor:grab}.bp-images.panning{cursor:move;cursor:grabbing}.bp-images.zoomable{cursor:pointer;cursor:zoom-in}.bp-images{margin:0 auto;padding:0;border:0 none}.bp-images img{display:block;width:100%;margin-bottom:10px}
 @media(max-width: 510px){.bp-box3d .bp-pullup{right:0}}@media(max-height: 550px){.bp-box3d .bp-pullup{overflow:scroll;height:250px}}
 .bp-is-mobile .bp-box3d .bp-controls{z-index:1;opacity:1 !important}.bp-box3d{-webkit-user-select:none;user-select:none;position:absolute;top:0;left:0;display:flex;width:100%;height:100%;margin:0;padding:0;border:0 none;-webkit-touch-callout:none}.bp-box3d.vr-enabled .bp-ControlsRoot,.bp-box3d.vr-enabled .bp-controls{opacity:0 !important}.bp-box3d canvas{cursor:move;cursor:grab;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.bp-box3d.bp-invisible{visibility:hidden}.bp-box3d canvas:active{cursor:grabbing}.bp-box3d .bp-overlay-panel{position:absolute;z-index:2;margin:auto;border:1px solid #caccd0;font-size:13px;font-weight:normal;color:#484848;background:#fff;outline:0}.bp-box3d .bp-overlay-panel span{position:relative;top:5px;display:inline-block;opacity:.7}.bp-box3d .bp-toggle-overlay .bp-menu{min-width:196px}.bp-box3d li,.bp-box3d ul{margin:0;padding:0;list-style:none}.bp-box3d input[type=checkbox]{opacity:1}
@@ -71,7 +74,6 @@
 .bp-SettingsToggleV2{position:relative;display:inline-flex}.bp-SettingsToggleV2-badge{pointer-events:none;position:absolute;top:50%;left:50%;transform:translateY(-100%);display:flex;align-items:center}
 .bp-MediaSettingsV2{min-width:240px}.bp-MediaSettingsV2-value{display:flex;gap:4px;align-items:center}
 .bp-PlayPauseToggle{will-change:opacity;opacity:.9;transition:opacity 150ms,background-color 150ms;outline:0;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;user-select:none;zoom:1;display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;border-radius:25px;color:#fff;background:rgba(0,0,0,0)}.bp-PlayPauseToggle:focus:not(:disabled),.bp-PlayPauseToggle:hover:not(:disabled){opacity:1;background-color:rgba(255,255,255,.08)}.bp-PlayPauseToggle:focus:not(:disabled) svg,.bp-PlayPauseToggle:hover:not(:disabled) svg,.bp-PlayPauseToggle.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-PlayPauseToggle.bp-is-active,.bp-PlayPauseToggle:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-PlayPauseToggle.bp-is-active:focus:not(:disabled),.bp-PlayPauseToggle.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-PlayPauseToggle:focus:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-PlayPauseToggle:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-PlayPauseToggle:focus:not(:focus-visible){box-shadow:none}.bp-PlayPauseToggle:disabled{pointer-events:none;cursor:default;opacity:.2}.bp-PlayPauseToggle svg{width:32px;height:32px;padding:5px}
-.bp-TabularDigit{display:inline-block;width:1ch;text-align:center}
 .bp-DurationLabels{display:flex;align-items:center;justify-content:space-between;margin-right:5px;margin-left:5px}.bp-DurationLabels .bp-DurationLabels-label{font-family:Lato,Arial,sans-serif;font-size:14px;font-weight:normal;font-style:normal;line-height:20px;color:rgba(255,255,255,.8);letter-spacing:.3px}.bp-DurationLabels-label{will-change:opacity;opacity:.9;transition:opacity 150ms,background-color 150ms;cursor:default;padding-right:4px;padding-left:4px;font-size:12px;line-height:12px;color:#fff}.bp-DurationLabels-label:focus:not(:disabled),.bp-DurationLabels-label:hover:not(:disabled){opacity:1;background-color:rgba(255,255,255,.08)}.bp-DurationLabels-label:focus:not(:disabled) svg,.bp-DurationLabels-label:hover:not(:disabled) svg,.bp-DurationLabels-label.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-DurationLabels-label.bp-is-active,.bp-DurationLabels-label:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-DurationLabels-label.bp-is-active:focus:not(:disabled),.bp-DurationLabels-label.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}
 .bp-TimestampControl{position:relative;display:flex;align-items:center}.bp-TimestampControl-button,.bp-TimestampControl-static{-webkit-user-select:none;user-select:none;display:flex;gap:4px;align-items:center;padding:6px 12px;font-family:Lato,Arial,sans-serif;font-size:14px;font-weight:normal;font-variant-numeric:tabular-nums;line-height:20px;color:#fff;letter-spacing:.3px;white-space:nowrap}.bp-TimestampControl-button{will-change:opacity;opacity:.9;transition:opacity 150ms,background-color 150ms;outline:0;cursor:pointer;margin:0;border:0;border-radius:25px;background:rgba(0,0,0,0)}.bp-TimestampControl-button:focus:not(:disabled),.bp-TimestampControl-button:hover:not(:disabled){opacity:1;background-color:rgba(255,255,255,.08)}.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 color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-TimestampControl-button:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),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:rgba(0,0,0,0)}.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;z-index:1;bottom:calc(100% + 12px);left:50%;transform:translateX(-50%);min-width:250px;padding:12px 8px;border-radius:16px;background:#fff;box-shadow:0 4px 12px 0 rgba(0,0,0,.15)}.bp-TimestampControl-header{-webkit-user-select:none;user-select:none;padding:6px 14px;font-family:Lato,Arial,sans-serif;font-size:14px;font-weight:bold;line-height:20px;color:#767676;letter-spacing:.3px}.bp-TimestampControl-listitem{cursor:pointer;display:flex;gap:16px;align-items:center;justify-content:space-between;padding:6px 14px;border-radius:8px;font-family:Lato,Arial,sans-serif;font-size:16px;line-height:24px;color:#000;white-space:nowrap;outline:none}.bp-TimestampControl-listitem:hover,.bp-TimestampControl-listitem:focus{background:var(--bp-gray-05)}.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;overflow:hidden;display:none;flex:0 0 auto;max-width:0;height:40px;transition:max-width 200ms ease-in-out}.bp-VolumeControls-flyout.bp-is-open{overflow:visible;display:block}.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{will-change:opacity;opacity:.9;transition:opacity 150ms,background-color 150ms;outline:0;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;user-select:none;zoom:1;display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;border-radius:25px;color:#fff;background:rgba(0,0,0,0)}.bp-VolumeControls-toggle:focus:not(:disabled),.bp-VolumeControls-toggle:hover:not(:disabled){opacity:1;background-color:rgba(255,255,255,.08)}.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 color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-VolumeControls-toggle:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-VolumeControls-toggle:focus:not(:focus-visible){box-shadow:none}.bp-VolumeControls-toggle:disabled{pointer-events:none;cursor:default;opacity:.2}.bp-VolumeControls-toggle svg{width:32px;height:32px;padding:5px}.bp-VolumeControls--blueprint .bp-VolumeControls-flyout{right:0;left:0;max-width:none}.bp-VolumeControls--blueprint .bp-VolumeControls-slider{margin-right:auto;margin-left:auto}
@@ -91,6 +93,7 @@
 .bp-MP3Controls{display:flex;flex-direction:column;width:360px;background-color:#000}.bp-MP3Controls-bar{display:flex;justify-content:space-between;padding:0 10px 5px}.bp-MP3Controls-group{display:flex;align-items:center}.bp-MP3Controls-settings{position:relative}.bp-MP3Controls-settings .bp-SettingsFlyout{right:15px}.bp-MP3Controls-settings .bp-SettingsToggle-button{width:36px;height:40px}
 .bp-MP3ControlsRoot{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}
 .bp-media-scrubber-container{position:relative;width:100%;height:16px}.bp-media-scrubber-wrapper{position:absolute;top:0;left:50%;width:100%;height:100%}.bp-media-scrubber{position:absolute;top:7px;left:-50%;width:100%;height:3px}.bp-media-scrubber-converted,.bp-media-scrubber-buffered,.bp-media-scrubber-played,.bp-media-scrubber-underlay{position:absolute;height:3px;transition:transform .1s ease-in-out}.bp-media-scrubber-converted{cursor:pointer;background-color:rgba(255,255,255,.5)}.bp-media-scrubber-buffered{position:absolute;height:3px;background-color:#fff}.bp-media-scrubber-played{cursor:pointer;background-color:#0061d5}.bp-media-scrubber-underlay{cursor:not-allowed;width:100%}.bp-media-scrubber-handle{cursor:pointer;position:absolute;top:-4.25px;transform:scale(0);width:12px;height:12px;margin-left:-6px;border-radius:6px;background-color:#0061d5;transition:transform .05s ease-in-out}.bp-media-scrubber-container:hover .bp-media-scrubber-handle,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-handle{transform:scale(1)}.bp-media-scrubber-container:hover .bp-media-scrubber-converted,.bp-media-scrubber-container:hover .bp-media-scrubber-buffered,.bp-media-scrubber-container:hover .bp-media-scrubber-played,.bp-media-scrubber-container:hover .bp-media-scrubber-underlay,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-converted,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-buffered,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-played,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-underlay{transform:scaleY(2)}.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-handle{transform:scale(1)}.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-converted,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-buffered,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-played,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-underlay{transform:scaleY(2)}.bp-media-settings{position:absolute;right:16px;bottom:60px;overflow:hidden auto;display:inline-block;max-width:400px;max-height:210px;padding:8px;border:1px solid #bdc3c7;border-radius:2px;font-size:10px;line-height:0;color:#444;visibility:hidden;background-color:#fff;transition:width .2s,height .2s;-ms-overflow-style:-ms-autohiding-scrollbar}.bp-media-settings-is-open .bp-media-settings{visibility:visible}.bp-media-mp3 .bp-media-settings{right:0;bottom:65px}.bp-media-settings-in-transition{overflow:hidden}.bp-media-settings-menu{display:table}.bp-media-settings-menu-autoplay,.bp-media-settings-menu-quality,.bp-media-settings-menu-speed,.bp-media-settings-menu-subtitles,.bp-media-settings-menu-audiotracks,.bp-media-settings-show-autoplay .bp-media-settings-menu-main,.bp-media-settings-show-speed .bp-media-settings-menu-main,.bp-media-settings-show-quality .bp-media-settings-menu-main,.bp-media-settings-show-subtitles .bp-media-settings-menu-main,.bp-media-settings-show-audiotracks .bp-media-settings-menu-main{display:none}.bp-media-settings-show-autoplay .bp-media-settings-menu-autoplay,.bp-media-settings-show-speed .bp-media-settings-menu-speed,.bp-media-settings-show-quality .bp-media-settings-menu-quality,.bp-media-settings-show-subtitles .bp-media-settings-menu-subtitles,.bp-media-settings-show-audiotracks .bp-media-settings-menu-audiotracks{display:table}.bp-media-mp4 .bp-media-settings-item-quality,.bp-media-mp4 .bp-media-settings-item-subtitles,.bp-media-mp4 .bp-media-settings-item-audiotracks,.bp-media-mp3 .bp-media-settings-item-quality,.bp-media-mp3 .bp-media-settings-item-subtitles,.bp-media-mp3 .bp-media-settings-item-audiotracks{display:none}.bp-media-settings-item,.bp-media-settings-sub-item{cursor:pointer;overflow:hidden;display:table-row;height:26px;padding:4px;white-space:nowrap;outline:0 none}.bp-media-settings-item:hover,.bp-media-settings-sub-item:hover{background-color:#f6fafd}.bp-media-settings-item:hover .bp-media-settings-icon svg,.bp-media-settings-sub-item:hover .bp-media-settings-icon svg{fill:#2c3e50}.bp-media-settings-item:hover .bp-media-settings-label,.bp-media-settings-sub-item:hover .bp-media-settings-label{color:#aabed1}.bp-media-settings-item:hover .bp-media-settings-value,.bp-media-settings-sub-item:hover .bp-media-settings-value{color:#2c3e50}.bp-has-keyboard-focus .bp-media-settings-item:focus,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus{background-color:#0061d5}.bp-has-keyboard-focus .bp-media-settings-item:focus .bp-media-settings-label,.bp-has-keyboard-focus .bp-media-settings-item:focus .bp-media-settings-value,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus .bp-media-settings-label,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus .bp-media-settings-value{color:#fff}.bp-has-keyboard-focus .bp-media-settings-item:focus svg,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus svg{fill:#fff}.bp-media-settings-subtitles-unavailable .bp-media-settings-item-subtitles,.bp-media-settings-subtitles-unavailable .bp-media-settings-menu-subtitles{display:none}.bp-media-settings-autoplay-unavailable .bp-media-settings-item-autoplay,.bp-media-settings-autoplay-unavailable .bp-media-settings-menu-autoplay{display:none}.bp-media-settings-audiotracks-unavailable .bp-media-settings-item-audiotracks,.bp-media-settings-audiotracks-unavailable .bp-media-settings-menu-audiotracks{display:none}.bp-media-settings-hd-unavailable .bp-media-settings-menu-quality{display:none}.bp-media-settings-hd-unavailable .bp-media-settings-item-quality{pointer-events:none}.bp-media-settings-hd-unavailable .bp-media-settings-item-quality .bp-media-settings-arrow{display:none}.bp-media-settings-label,.bp-media-settings-value{display:table-cell;padding:4px;vertical-align:middle}.bp-media-settings-label{font-size:11px;font-weight:normal;color:#999ea4;text-transform:uppercase}.bp-media-settings-item .bp-media-settings-label{text-align:left}.bp-media-settings-sub-item .bp-media-settings-label{text-align:center}.bp-media-settings-value{padding-left:10px;font-size:12px;color:#464a4f;text-align:left}.bp-media-settings-selected .bp-media-settings-value{color:#0061d5}.bp-media-settings-arrow{display:table-cell;vertical-align:middle}.bp-media-settings-arrow svg{width:18px;height:18px}.bp-media-settings-icon{display:table-cell;text-align:center;vertical-align:middle}.bp-media-settings-icon svg{width:16px;height:16px;visibility:hidden}.bp-media-settings-selected .bp-media-settings-icon svg{visibility:visible}.bp-media-controls-is-visible .bp-media-controls-wrapper,.bp-media-controls-wrapper:active,.bp-media-controls-wrapper:focus{visibility:visible;opacity:1}.bp-media-controls-wrapper{position:absolute;right:0;bottom:0;left:0;overflow:hidden;width:100%;height:60px;margin:auto;visibility:hidden;opacity:0;background-image:linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);transition:visibility .3s,opacity .3s}.bp-media-time-scrubber-container{outline:0 none}.bp-media-volume-scrubber-container-wrapper{overflow:hidden;display:inline-block;width:0;height:40px;transition:width .2s ease-in-out}.bp-media-controls-volume-scrubber-expand{width:96px}.bp-media-volume-scrubber-container{position:relative;display:inline-block;width:96px;height:40px;padding:10px 8px 0;outline:0 none}.bp-media-volume-scrubber-container .bp-media-scrubber-handle{transform:scale(1)}.bp-media-volume-scrubber-container .bp-media-scrubber-converted,.bp-media-volume-scrubber-container .bp-media-scrubber-buffered,.bp-media-volume-scrubber-container .bp-media-scrubber-played,.bp-media-volume-scrubber-container .bp-media-scrubber-underlay{transform:scaleY(1) !important}.bp-media-controls-container{height:40px;margin:0;padding:0 10px;text-align:left}.bp-media-controls-label,.bp-media-controls-btn{cursor:pointer;display:inline-block;width:45px;height:40px;margin:0;padding:0;border:none;font-size:12px;font-weight:normal;color:#fff;text-align:center;vertical-align:top;opacity:.7;background-color:rgba(0,0,0,0);outline:0 none}.bp-media-controls-label:hover,.bp-media-controls-btn:hover{opacity:1}.bp-media-volume-icon{position:relative;display:inline-block;width:36px;height:40px;vertical-align:top}.bp-is-mobile .bp-media-volume-icon{display:none}.bp-media-controls-label{cursor:default;display:inline-block;width:auto;margin:0 4px;line-height:40px;vertical-align:top}.bp-media-controls-timecode{margin-left:13px}.bp-media-controls-volume-control{display:inline-block;width:45px;height:40px;vertical-align:top}.bp-is-mobile .bp-media-controls-volume-control{display:none}.bp-is-fullscreen .bp-media-fullscreen-icon .bp-exit-fullscreen-icon{display:inline-block}.bp-media-fullscreen-icon{position:absolute;right:10px}.bp-media-gear-icon{position:absolute;right:55px}.bp-media-gear-icon svg path{transform-origin:50%;transition:all .3s}.bp-media-settings-is-open .bp-media-gear-icon svg path{transform:rotateZ(60deg)}.bp-media-cc-icon{position:absolute;right:100px;visibility:visible}.bp-media-settings-subtitles-unavailable .bp-media-cc-icon{visibility:hidden}.bp-media-controls-cc-icon-text{display:inline-block;width:24px;height:24px;padding:0 0 0 1px;border-radius:4px;font-size:12px;font-weight:bold;line-height:24px;color:#fff;letter-spacing:.1em;background-color:rgba(0,0,0,.3)}.bp-media-settings-subtitles-on .bp-media-controls-cc-icon-text{color:#fff;background-color:#0061d5}.bp-media-controls-hd{position:absolute;left:22px;display:none;padding:2px 2px 2px 3px;border-radius:3px;font-size:8px;font-weight:bold;line-height:8px;letter-spacing:.1em;background-color:#0061d5}.bp-media-controls-is-hd .bp-media-controls-hd{display:inline}.bp-media-play-icon{display:inline}.bp-media-is-playing .bp-media-play-icon{display:none}.bp-media-pause-icon{display:none}.bp-media-is-playing .bp-media-pause-icon{display:inline}.bp-media-volume-icon-mute,.bp-media-volume-icon-low,.bp-media-volume-icon-medium,.bp-media-volume-icon-high{position:absolute;left:6px;display:none}.bp-media-volume-icon-is-mute .bp-media-volume-icon-mute,.bp-media-volume-icon-is-low .bp-media-volume-icon-low,.bp-media-volume-icon-is-medium .bp-media-volume-icon-medium,.bp-media-volume-icon-is-high .bp-media-volume-icon-high{display:inline}.bp-media{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;margin:0;padding:0;border:0 none;visibility:hidden}.bp-media.bp-is-visible{visibility:visible}.bp-media-container{-webkit-user-select:none;user-select:none;position:relative;display:flex;flex:1 1 0;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:360px;min-height:0;outline:0 none}.bp-media-play-button{cursor:pointer;padding:0;border:none;font:inherit;color:inherit;background:none;cursor:pointer;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:80px;height:80px;border:4px solid #fff;border-radius:40px;font-size:40px;color:#fff;text-align:center;background:rgba(0,0,0,.5);transition:all .2s}.bp-media-play-button:hover{background:#000}.bp-media-overlay-play-container{cursor:pointer;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;gap:28px;align-items:center;justify-content:center;font-size:40px;color:#fff;text-align:center;transition:all .2s}.bp-media-overlay-play-container button{cursor:pointer;padding:0;border:none;font:inherit;color:inherit;background:none;cursor:pointer;width:40px;height:40px;border-radius:40px;font-size:40px;text-align:center;background:#000;transition:all .2s}.bp-media-overlay-play-container .bp-media-overlay-play-button{width:60px;height:60px}.bp-has-keyboard-focus .bp-media-time-scrubber-container:focus,.bp-has-keyboard-focus .bp-media-volume-scrubber-container:focus,.bp-has-keyboard-focus .bp-media-controls-btn:focus{box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.1)}.bp-dark .bp-error{color:#fff}.bp-dark .bp-icon{opacity:.9}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper{display:flex}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper .bp-crawler-wrapper{display:block}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper .bp-icon{display:none}@keyframes bp-spinner-rotate{to{transform:rotate(360deg)}}.bp-media-buffering-spinner{position:absolute;top:50%;left:50%;width:80px;height:80px;margin:-40px 0 0 -40px;border:4px solid rgba(0,97,213,.3);border-top-color:#0061d5;border-radius:40px;animation:bp-spinner-rotate .8s linear infinite}.bp-is-mobile *::-webkit-media-controls-start-playback-button{display:none}.bp-VideoControlsRoot{position:relative;z-index:1;right:auto;bottom:auto;left:auto;align-self:stretch;width:100%}.bp-media--v2{background:radial-gradient(ellipse at center, #2a2a2a 0%, #000 100%)}.bp-media-container--v2{padding:48px}.bp-media-container--v2 video{border:1px solid rgba(255,255,255,.12)}.bp-media-container--v2 .bp-video-preload-wrapper{inset:48px auto 48px 50%;transform:translateX(-50%)}.bp-media-container--v2 .bp-video-preload-wrapper .bp-preload{transform:none}.bp-media-container--v2 .bp-video-preload-wrapper .bp-preload-content{border:1px solid rgba(255,255,255,.12)}.bp-media-stage--v2{display:flex;flex:1 1 0;align-items:center;justify-content:center;box-sizing:border-box;width:100%;min-height:0;padding:48px}.bp-is-fullscreen .bp-media-stage--v2{padding:0}.bp-media-stage--v2 .bp-media-container--v2{flex:0 0 auto;width:auto;min-width:0;height:auto;padding:0}.bp-media-stage--v2 .bp-media-container--v2 video{width:100%;max-width:none;height:100%;max-height:none;border:1px solid rgba(255,255,255,.12);object-fit:contain}.bp-media-stage--v2 .bp-media-container--v2 .bp-video-preload-wrapper{inset:0;transform:none}.bp-media-stage--v2 .bp-media-container--v2 .bp-video-preload-wrapper .bp-preload{transform:none}.bp-media-stage--v2 .bp-media-container--v2 .bp-video-preload-wrapper .bp-preload-content{border:1px solid rgba(255,255,255,.12);object-fit:contain}.bp-video-360 .bp-VideoControlsRoot{position:absolute;right:0;bottom:-1px;left:0;width:100%}.bp-video-preload-wrapper{position:absolute;inset:0;overflow:hidden;display:flex;align-items:center;justify-content:center;margin:0;opacity:1;background-color:rgba(0,0,0,0);transition:opacity .5s}.bp-video-preload-wrapper.bp-is-invisible{visibility:hidden}.bp-video-preload-wrapper.bp-is-transparent{opacity:0}.bp-video-preload-wrapper .bp-preload{position:absolute;inset:0;transform:translateY(-60px);width:100%;height:100%}.bp-video-preload-wrapper .bp-preload-content{width:100%;height:100%;object-fit:contain}.bp-video-preload-wrapper .bp-preload-placeholder{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.bp-video-preload-wrapper .bp-video-preload-play-overlay{pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;background:rgba(0,0,0,.5)}.bp-video-preload-wrapper .bp-video-preload-play-overlay svg{width:48px;height:48px;fill:#fff}.bp-video-preload-wrapper .bp-video-preload-play-overlay--blueprint{pointer-events:auto;width:auto;height:auto;background:none}.bp-video-preload-wrapper .bp-video-preload-play-overlay--blueprint svg{fill:revert}.bp-video-preload-wrapper .bp-video-preload-play-overlay .bp-video-preload-play-button{--icon-button-radius: 50%;--icon-button-size-large: 80px;--icon-button-surface-on-dark: rgb(0 0 0 / 50%)}.bp-is-fullscreen .bp-navigate,.bp-is-gallery-open .bp-navigate{display:none}.bp-navigate{pointer-events:all;cursor:pointer;position:absolute;top:50%;transform:translateY(-50%);overflow:hidden;display:block;width:50px;height:64px;margin:0;border:0 none;text-decoration:none;white-space:nowrap;opacity:0;background-repeat:no-repeat;transition:opacity .5s ease}.bp-navigate:hover,.bp-navigate:focus{opacity:1}.bp-navigate:focus{height:64px;outline:1px solid #999ea4;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.1)}.bp-navigate:active{outline:none;box-shadow:none}.bp-is-navigation-visible .bp-navigate{opacity:.8}.bp-is-navigation-visible .bp-navigate:hover{opacity:1}.bp-navigate-left{left:20px;border-radius:0 2px 2px 0}.bp-navigate-right{right:20px;border-radius:2px 0 0 2px}.bp-has-navigation .bp-media-mp3 .bp-media-container{width:calc(100% - 100px)}.bp-media-mp3 .bp-media-container{overflow:visible;width:100%;max-width:360px;height:60px;outline:0 none}.bp-media-mp3 .bp-media-fullscreen-icon{display:none}.bp-media-mp3 .bp-media-gear-icon{position:absolute;right:10px}.bp-media-mp3.bp-media--v2 .bp-media-container,.bp-media-mp3.bp-media--v2 .bp-media-container--v2{width:100%;max-width:none;height:100%;min-height:0;padding:0}.bp-media-mp3.bp-media--v2 audio{display:none}.bp-media-mp3 .bp-media-controls-wrapper{visibility:visible;opacity:1;background:#000}.bp-media-mp3 .bp-media-settings-item-quality,.bp-media-mp3 .bp-image-switch-360-icon{display:none}
+.bp-VideoPlaySeekOverlay{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;gap:28px;align-items:center;justify-content:center}.bp-VideoPlaySeekOverlay button{--icon-button-radius: 50%;--icon-button-surface-on-dark: rgb(0 0 0 / 50%)}.bp-VideoPlaySeekOverlay .bp-VideoPlaySeekOverlay-play{--icon-button-radius: 50%;--icon-button-size-large: 80px;--icon-button-surface-on-dark: rgb(0 0 0 / 50%)}
 .bp-HDBadge{padding:2px 2px 2px 3px;border-radius:3px;font-size:8px;font-weight:bold;color:#fff;letter-spacing:.1em;background-color:var(--bp-box-blue-100)}
 .bp-SubtitlesToggle{will-change:opacity;opacity:.9;transition:opacity 150ms,background-color 150ms;outline:0;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;user-select:none;zoom:1;display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;border-radius:25px;color:#fff;background:rgba(0,0,0,0)}.bp-SubtitlesToggle:focus:not(:disabled),.bp-SubtitlesToggle:hover:not(:disabled){opacity:1;background-color:rgba(255,255,255,.08)}.bp-SubtitlesToggle:focus:not(:disabled) svg,.bp-SubtitlesToggle:hover:not(:disabled) svg,.bp-SubtitlesToggle.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-SubtitlesToggle.bp-is-active,.bp-SubtitlesToggle:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-SubtitlesToggle.bp-is-active:focus:not(:disabled),.bp-SubtitlesToggle.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-SubtitlesToggle:focus:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-SubtitlesToggle:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bp-gray-20) 50%, transparent),0 1px 2px rgba(0,0,0,.1)}.bp-SubtitlesToggle:focus:not(:focus-visible){box-shadow:none}.bp-SubtitlesToggle:disabled{pointer-events:none;cursor:default;opacity:.2}.bp-SubtitlesToggle svg{width:32px;height:32px;padding:5px}.bp-SubtitlesToggle[aria-pressed=true] .bp-SubtitlesToggle-text{color:#fff;background-color:#0061d5}.bp-SubtitlesToggle-text{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px;font-size:12px;font-weight:bold;color:#fff;letter-spacing:.1em;background-color:rgba(0,0,0,.3)}.bp-SubtitlesToggleV2[aria-pressed]{--icon-toggle-button-off-color: var(--bp-text-text-on-dark);--icon-toggle-button-off-background: var(--bp-surface-cta-surface-icon-on-dark);--icon-toggle-button-off-background-hover: var(--bp-surface-cta-surface-icon-on-dark-hover);--icon-toggle-button-off-background-pressed: var(--bp-surface-cta-surface-icon-on-dark-pressed);--icon-toggle-button-off-icon-color: var(--bp-icon-cta-icon-on-dark);--icon-toggle-button-on-background: var(--bp-light-blue-opacity-12);--icon-toggle-button-on-background-hover: var(--bp-light-blue-opacity-16);--icon-toggle-button-on-background-pressed: var(--bp-light-blue-opacity-20);--icon-toggle-button-on-border: var(--bp-border-01) solid var(--bp-light-blue-opacity-20);--icon-toggle-button-on-border-focus: var(--bp-border-01) solid var(--bp-light-blue-opacity-30);--icon-toggle-button-on-icon-color: var(--bp-light-blue-100);--icon-toggle-button-focus-outline: var(--bp-border-02) solid var(--bp-outline-focus-on-dark)}
 .bp-VideoControls{display:flex;flex-direction:column;width:100%;background-image:linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);padding:40px 20px 8px}.bp-VideoControls .bp-FullscreenToggle{width:36px;height:40px}.bp-VideoControls-bar{display:flex;padding:0 10px 5px;display:grid;align-items:center}.bp-VideoControls-bar.bp-VideoControls-bar--two-groups{justify-content:flex-end}.bp-VideoControls-bar.bp-VideoControls-bar--two-groups .bp-VideoControls-group--play-pause{position:absolute;left:50%;transform:translateX(-50%)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups{grid-template-columns:repeat(3, 1fr)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups.bp-VideoControls-bar--narrow-video{grid-template-columns:repeat(2, 1fr)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--annotations{justify-self:flex-start}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--play-pause{justify-self:center}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--media-controls{justify-self:flex-end}.bp-VideoControls-group{display:flex;align-items:center}.bp-VideoControls-settings{position:relative}.bp-VideoControls-settings .bp-SettingsFlyout{right:15px}.bp-VideoControls-settings .bp-SettingsToggle-button{width:36px;height:40px}

package/dist/lib/index.js

@@ -423,7 +423,7 @@ __webpack_require__.d(__webpack_exports__, {
   k7: () => (/* binding */ renderTabularDigits)
 });
 
-// UNUSED EXPORTS: TABULAR_DIGIT_CLASS
+// UNUSED EXPORTS: TABULAR_DIGITS_BOXES_CLASS, TABULAR_DIGITS_TEXT_CLASS, TABULAR_DIGIT_CLASS
 
 // EXTERNAL MODULE: external "react"
 var external_react_ = __webpack_require__(1649);
@@ -438,20 +438,51 @@ var external_react_ = __webpack_require__(1649);
 // has no effect. Wrapping each digit in a 1ch box keeps changing numbers, and whatever follows them,
 // from shifting as they update.
 const TABULAR_DIGIT_CLASS = 'bp-TabularDigit';
+const TABULAR_DIGITS_BOXES_CLASS = 'bp-TabularDigits-boxes';
+const TABULAR_DIGITS_TEXT_CLASS = 'bp-TabularDigits-text';
 const isDigit = char => char >= '0' && char <= '9';
 const isDigitNode = node => node.nodeType === Node.ELEMENT_NODE;
 
+// Screen readers would read the boxed digits one by one, so the boxes are hidden from them and a visually
+// hidden copy gives them the whole text
+const getParts = el => {
+  const boxesEl = el.firstElementChild;
+  const textEl = el.lastElementChild;
+  if (el.childNodes.length === 2 && boxesEl?.classList.contains(TABULAR_DIGITS_BOXES_CLASS) && textEl?.classList.contains(TABULAR_DIGITS_TEXT_CLASS)) {
+    return {
+      boxesEl,
+      textEl
+    };
+  }
+  const newBoxesEl = document.createElement('span');
+  newBoxesEl.className = TABULAR_DIGITS_BOXES_CLASS;
+  newBoxesEl.setAttribute('aria-hidden', 'true');
+  const newTextEl = document.createElement('span');
+  newTextEl.className = TABULAR_DIGITS_TEXT_CLASS;
+  el.replaceChildren(newBoxesEl, newTextEl);
+  return {
+    boxesEl: newBoxesEl,
+    textEl: newTextEl
+  };
+};
+
 /**
- * Writes `text` into `el` with each digit in a fixed-width box. For labels updated outside React,
- * e.g. on animation frames. Unchanged characters are left in place, so a ticking clock only touches
- * the digits that changed.
+ * Writes `text` into `el` with each digit in a fixed-width box, plus a visually hidden copy of `text` for
+ * screen readers. For labels updated outside React, e.g. on animation frames. This replaces the children
+ * of `el`, so `el` must not hold other content. Unchanged characters are left in place, so a ticking clock
+ * only touches the digits that changed.
  */
 function renderTabularDigits(el, text) {
-  if (el.textContent === text) {
+  const {
+    boxesEl,
+    textEl
+  } = getParts(el);
+  if (textEl.textContent === text) {
     return;
   }
+  textEl.textContent = text;
   const chars = Array.from(text);
-  const nodes = el.childNodes;
+  const nodes = boxesEl.childNodes;
   const canPatch = nodes.length === chars.length && chars.every((char, index) => isDigit(char) === isDigitNode(nodes[index]));
   if (canPatch) {
     chars.forEach((char, index) => {
@@ -472,7 +503,7 @@ function renderTabularDigits(el, text) {
       fragment.appendChild(document.createTextNode(char));
     }
   });
-  el.replaceChildren(fragment);
+  boxesEl.replaceChildren(fragment);
 }
 /**
  * Renders `children` with each digit in a fixed-width box. Place it inside the element that
@@ -1297,7 +1328,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.124.0"; // eslint-disable-line no-undef
+const CLIENT_VERSION = "3.125.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 = {};
@@ -37273,7 +37304,7 @@ var isNpmBuild = __webpack_require__(8080);
 ;// ./src/lib/Logger.js
 /* eslint-disable no-undef */
 const CLIENT_NAME = "box-content-preview";
-const CLIENT_VERSION = "3.124.0";
+const CLIENT_VERSION = "3.125.0";
 /* eslint-enable no-undef */
 
 class Logger {
@@ -39919,6 +39950,7 @@ var BlueprintProviders = __webpack_require__(2758);
 
 
 /* harmony default export */ const ControlsLayerContext = (/*#__PURE__*/external_react_["default"].createContext({
+  setIsEditing: (noop_default()),
   setIsForced: (noop_default())
 }));
 ;// ./src/lib/viewers/controls/controls-layer/ControlsLayer.scss
@@ -39941,7 +39973,9 @@ function ControlsLayer({
   const [isShown, setIsShown] = external_react_["default"].useState(false);
   const hasFocusRef = external_react_["default"].useRef(false);
   const hasCursorRef = external_react_["default"].useRef(false);
+  const isEditingRef = external_react_["default"].useRef(false);
   const hideTimeoutRef = external_react_["default"].useRef();
+  const layerElRef = external_react_["default"].useRef(null);
 
   // Visibility helpers
   const helpersRef = external_react_["default"].useRef({
@@ -39985,7 +40019,7 @@ function ControlsLayer({
   const handleMouseLeave = event => {
     hasCursorRef.current = false;
     const layerEl = event.currentTarget;
-    if (document.activeElement && layerEl.contains(document.activeElement)) {
+    if (!isEditingRef.current && document.activeElement && layerEl.contains(document.activeElement)) {
       document.activeElement.blur();
     }
     helpersRef.current.hide();
@@ -40007,12 +40041,26 @@ function ControlsLayer({
     helpersRef.current.reset();
     setIsForced(value);
   }, []);
+  const setIsEditing = external_react_["default"].useCallback(value => {
+    const wasEditing = isEditingRef.current;
+    isEditingRef.current = value;
+
+    // Ending an edit can remove the focused field without a blur, so check where focus is now and hide
+    // once neither focus nor the cursor is on the layer. The layer is already gone if the edit ended
+    // because the controls unmounted.
+    if (wasEditing && !value && layerElRef.current) {
+      hasFocusRef.current = !!layerElRef.current?.contains(document.activeElement);
+      helpersRef.current.hide();
+    }
+  }, []);
   const contextValue = external_react_["default"].useMemo(() => ({
+    setIsEditing,
     setIsForced: setIsForcedWithReset
-  }), [setIsForcedWithReset]);
+  }), [setIsEditing, setIsForcedWithReset]);
   return /*#__PURE__*/external_react_["default"].createElement(ControlsLayerContext.Provider, {
     value: contextValue
   }, /*#__PURE__*/external_react_["default"].createElement("div", {
+    ref: layerElRef,
     className: `bp-ControlsLayer ${isShown || isForced ? SHOW_CLASSNAME : ''}`,
     "data-testid": "bp-ControlsLayer",
     onBlur: handleFocusOut,
@@ -41614,16 +41662,21 @@ const ANNOTATION_MODE_ICONS = {
   [AnnotationMode.REGION]: __WEBPACK_EXTERNAL_MODULE__box_blueprint_web_assets_icons_Medium_SquarePlus_c11758f1_default__
 };
 /* harmony default export */ const annotationModeIcons = (ANNOTATION_MODE_ICONS);
+;// ./src/lib/viewers/controls/controls-bar/ControlsBarV2.scss
+// extracted by mini-css-extract-plugin
+
 ;// ./src/lib/viewers/controls/controls-bar/ControlsBarV2.tsx
-const ControlsBarV2_excluded = ["children"];
+const ControlsBarV2_excluded = ["children", "size"];
 function ControlsBarV2_extends() { return ControlsBarV2_extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, ControlsBarV2_extends.apply(null, arguments); }
 function ControlsBarV2_objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = ControlsBarV2_objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function ControlsBarV2_objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 
 
+
 function ControlsBarV2(_ref, ref) {
   let {
-      children
+      children,
+      size = 'large'
     } = _ref,
     rest = ControlsBarV2_objectWithoutProperties(_ref, ControlsBarV2_excluded);
   if (!children) {
@@ -41631,6 +41684,7 @@ function ControlsBarV2(_ref, ref) {
   }
   return /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Root, ControlsBarV2_extends({
     ref: ref,
+    className: `bp-ControlsBarV2 bp-ControlsBarV2--${size}`,
     colorScheme: "dark",
     "data-testid": "bp-ControlsBar"
   }, rest), children);
@@ -41656,7 +41710,9 @@ function AnnotationsPaletteV2({
   return /*#__PURE__*/external_react_["default"].createElement("div", {
     className: "bp-AnnotationsPaletteV2",
     "data-testid": "bp-AnnotationsPaletteV2"
-  }, /*#__PURE__*/external_react_["default"].createElement(controls_bar_ControlsBarV2, null, children));
+  }, /*#__PURE__*/external_react_["default"].createElement(controls_bar_ControlsBarV2, {
+    size: "small"
+  }, children));
 }
 function Modes({
   annotationMode,
@@ -42257,6 +42313,24 @@ function RotateMenuItemV2({
 
 ;// external "@box/blueprint-web-assets/icons/Medium/Plus"
 
+;// ./src/lib/viewers/controls/controls-bar/ControlsPillV2.scss
+// extracted by mini-css-extract-plugin
+
+;// ./src/lib/viewers/controls/controls-bar/ControlsPillV2.tsx
+
+
+// Groups the parts of one control, like page or zoom, on a shared background. Buttons inside take the
+// bp-ControlsPillV2-button class, and a text button takes bp-ControlsPillV2-label.
+function ControlsPillV2({
+  children
+}) {
+  return /*#__PURE__*/external_react_["default"].createElement("div", {
+    className: "bp-ControlsPillV2",
+    "data-testid": "bp-ControlsPill"
+  }, children);
+}
+// EXTERNAL MODULE: ./src/lib/TabularDigits.tsx + 1 modules
+var TabularDigits = __webpack_require__(2459);
 ;// ./src/lib/viewers/controls/zoom/ZoomControlsV2.tsx
 /* provided dependency */ var ZoomControlsV2_ = __webpack_require__(441)["Tl"];
 
@@ -42265,6 +42339,8 @@ function RotateMenuItemV2({
 
 
 
+
+
 function getZoomState({
   maxScale = MAX_SCALE,
   minScale = MIN_SCALE,
@@ -42297,9 +42373,10 @@ function ZoomControlsV2({
     minScale,
     scale
   });
-  return /*#__PURE__*/external_react_["default"].createElement(external_react_["default"].Fragment, null, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
+  return /*#__PURE__*/external_react_["default"].createElement(ControlsPillV2, null, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
     content: ZoomControlsV2_('zoom_out')
   }, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
+    className: "bp-ControlsPillV2-button",
     "aria-label": ZoomControlsV2_('zoom_out'),
     "data-resin-target": resinTargetZoomOut,
     "data-testid": "bp-ZoomControls-out",
@@ -42309,13 +42386,15 @@ function ZoomControlsV2({
     icon: __WEBPACK_EXTERNAL_MODULE__box_blueprint_web_assets_icons_Medium_Minus_cc9df143_default__
   }))), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Text, {
     as: "span",
+    className: "bp-ControlsPillV2-text",
     color: "textOnDarkDefault",
     "data-testid": "bp-ZoomControls-current",
     title: ZoomControlsV2_('zoom_current_scale'),
-    variant: "bodyDefaultSemibold"
-  }, `${Math.round(currentScale * 100)}%`), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
+    variant: "bodyDefault"
+  }, /*#__PURE__*/external_react_["default"].createElement(TabularDigits/* default */.Ay, null, `${Math.round(currentScale * 100)}%`)), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
     content: ZoomControlsV2_('zoom_in')
   }, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
+    className: "bp-ControlsPillV2-button",
     "aria-label": ZoomControlsV2_('zoom_in'),
     "data-resin-target": resinTargetZoomIn,
     "data-testid": "bp-ZoomControls-in",
@@ -43293,14 +43372,21 @@ function MultiImageControls({
 
 
 
+
+
 function PageControlsFormV2({
   onPageSubmit,
   pageNumber,
   pageCount
 }) {
+  const {
+    setIsEditing
+  } = external_react_["default"].useContext(ControlsLayerContext);
   const [isInputShown, setIsInputShown] = external_react_["default"].useState(false);
   // A string because Toolbar.Input only supports text types, so a parsed number would show "NaN" once cleared
   const [inputValue, setInputValue] = external_react_["default"].useState(pageNumber.toString());
+  // The input takes the button's size, so the bar keeps its width and height while the page number is edited
+  const [inputSize, setInputSize] = external_react_["default"].useState();
   const buttonElRef = external_react_["default"].useRef(null);
   const inputElRef = external_react_["default"].useRef(null);
   const isRetryRef = external_react_["default"].useRef(false);
@@ -43317,6 +43403,14 @@ function PageControlsFormV2({
     }
     setIsInputShown(false);
   };
+  const handleButtonClick = () => {
+    const rect = buttonElRef.current?.getBoundingClientRect();
+    setInputSize(rect?.width ? {
+      height: rect.height,
+      width: rect.width
+    } : undefined);
+    setIsInputShown(true);
+  };
   const handleNumInputChange = event => {
     setInputValue(event.target.value);
   };
@@ -43345,6 +43439,12 @@ function PageControlsFormV2({
   external_react_["default"].useEffect(() => {
     setInputValue(pageNumber.toString()); // Keep internal state in sync with prop as it changes
   }, [pageNumber]);
+
+  // Keeps the bar and the input up while typing, even once the cursor leaves the bar
+  external_react_["default"].useEffect(() => {
+    setIsEditing(isInputShown);
+    return () => setIsEditing(false);
+  }, [isInputShown, setIsEditing]);
   external_react_["default"].useLayoutEffect(() => {
     if (inputElRef.current && isInputShown) {
       inputElRef.current.select();
@@ -43360,7 +43460,8 @@ function PageControlsFormV2({
     className: "bp-PageControlsFormV2",
     "data-testid": "bp-PageControlsForm"
   }, isInputShown ? /*#__PURE__*/external_react_["default"].createElement("div", {
-    className: "bp-PageControlsFormV2-input"
+    className: "bp-PageControlsFormV2-input",
+    style: inputSize
   }, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Input, {
     ref: inputElRef,
     "aria-label": PageControlsFormV2_('enter_page_num'),
@@ -43377,17 +43478,20 @@ function PageControlsFormV2({
     content: PageControlsFormV2_('enter_page_num')
   }, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
     ref: buttonElRef,
+    className: "bp-ControlsPillV2-label",
     "data-resin-target": "pageNumberOpen",
     "data-testid": "bp-PageControlsForm-button",
     disabled: pageCount <= 1,
-    onClick: () => setIsInputShown(true)
+    onClick: handleButtonClick
   }, /*#__PURE__*/external_react_["default"].createElement("span", {
     className: "bp-PageControlsFormV2-button-label",
     "data-testid": "bp-PageControlsForm-button-label"
   }, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Text, {
     as: "span",
-    color: "textOnDarkDefault"
-  }, `${pageNumber} / ${pageCount}`)))));
+    className: "bp-ControlsPillV2-text",
+    color: "textOnDarkDefault",
+    variant: "bodyDefaultSemibold"
+  }, /*#__PURE__*/external_react_["default"].createElement(TabularDigits/* default */.Ay, null, `${pageNumber} / ${pageCount}`))))));
 }
 ;// ./src/lib/viewers/controls/page/PageControlsV2.tsx
 /* provided dependency */ var PageControlsV2_ = __webpack_require__(441)["Tl"];
@@ -43396,6 +43500,7 @@ function PageControlsFormV2({
 
 
 
+
 function PageControlsV2({
   onPageChange,
   onPageSubmit,
@@ -43405,9 +43510,10 @@ function PageControlsV2({
   if (pageCount <= 1) {
     return null;
   }
-  return /*#__PURE__*/external_react_["default"].createElement(external_react_["default"].Fragment, null, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
+  return /*#__PURE__*/external_react_["default"].createElement(ControlsPillV2, null, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
     content: PageControlsV2_('previous_page')
   }, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
+    className: "bp-ControlsPillV2-button",
     "aria-label": PageControlsV2_('previous_page'),
     "data-resin-target": "pagePrevious",
     "data-testid": "bp-PageControls-previous",
@@ -43422,6 +43528,7 @@ function PageControlsV2({
   }), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
     content: PageControlsV2_('next_page')
   }, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
+    className: "bp-ControlsPillV2-button",
     "aria-label": PageControlsV2_('next_page'),
     "data-resin-target": "pageNext",
     "data-testid": "bp-PageControls-next",
@@ -53165,6 +53272,45 @@ const arrow_curved_forward_24px_namespaceObject = "<svg width=\"24\" height=\"24
 var MediaLoadingIndicator = __webpack_require__(4301);
 // EXTERNAL MODULE: ./src/lib/viewers/controls/media/PlayOverlayIcon.tsx
 var PlayOverlayIcon = __webpack_require__(2048);
+// EXTERNAL MODULE: ./src/lib/viewers/controls/media/SkipButton.tsx + 2 modules
+var SkipButton = __webpack_require__(2659);
+;// ./src/lib/viewers/controls/media/VideoPlaySeekOverlay.scss
+// extracted by mini-css-extract-plugin
+
+;// ./src/lib/viewers/controls/media/VideoPlaySeekOverlay.tsx
+/* provided dependency */ var VideoPlaySeekOverlay_ = __webpack_require__(441)["Tl"];
+
+
+
+
+
+
+function VideoPlaySeekOverlay({
+  movePlayback,
+  onPlay
+}) {
+  return /*#__PURE__*/external_react_["default"].createElement(external_react_["default"].Fragment, null, /*#__PURE__*/external_react_["default"].createElement(SkipButton/* default */.A, {
+    direction: "backward",
+    isBlueprintEnabled: true,
+    movePlayback: movePlayback
+  }), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
+    content: VideoPlaySeekOverlay_('media_play')
+  }, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.IconButton, {
+    "aria-label": VideoPlaySeekOverlay_('media_play'),
+    className: "bp-VideoPlaySeekOverlay-play",
+    "data-resin-target": "playOverlay",
+    "data-target-id": "VideoPlaySeekOverlay-play",
+    icon: PlayOverlayIcon/* default */.A,
+    onClick: onPlay,
+    onKeyDown: utils/* stopActivationKeyPropagation */.My,
+    size: "large",
+    variant: "on-dark"
+  })), /*#__PURE__*/external_react_["default"].createElement(SkipButton/* default */.A, {
+    direction: "forward",
+    isBlueprintEnabled: true,
+    movePlayback: movePlayback
+  }));
+}
 ;// ./src/lib/viewers/media/fitFrameToViewport.js
 /**
  * Contain-fits a frame into the viewport (same model as object-fit: contain).
@@ -53781,11 +53927,14 @@ function VideoBaseViewer_toPrimitive(t, r) { if ("object" != typeof t || !t) ret
 
 
 
+
+
 const MOUSE_MOVE_TIMEOUT_IN_MILLIS = 1000;
 const CLASS_PLAY_BUTTON = 'bp-media-play-button';
 const CLASS_PLAY_CONTAINER = 'bp-media-overlay-play-container';
 const CLASS_PLAY_CONTAINER_PLAY_BUTTON = 'bp-media-overlay-play-button';
 const CLASS_SEEK_BUTTON = 'bp-media-overlay-seek-button';
+const CLASS_PLAY_SEEK_OVERLAY = 'bp-VideoPlaySeekOverlay';
 const SMALL_VIDEO_WIDTH_THRESHOLD = 580;
 const SPINNER_HALF_SIZE = 40; // Half of the 80px spinner height (_mediaBase.scss and MediaLoadingIndicator.scss)
 const VIDEO_ANNOTATIONS_ENABLED = 'videoAnnotations.enabled';
@@ -54103,6 +54252,10 @@ class VideoBaseViewer extends media_MediaBaseViewer {
     });
   }
   buildPlayButtonWithSeekButtons() {
+    if (this.isBlueprintMediaControlsEnabled()) {
+      this.buildBlueprintPlaySeekOverlay();
+      return;
+    }
     this.playContainerEl = this.mediaContainerEl.appendChild(document.createElement('div'));
     this.playContainerEl.classList.add(CLASS_PLAY_CONTAINER);
     this.playContainerEl.classList.add(constants/* CLASS_HIDDEN */.zX);
@@ -54129,7 +54282,38 @@ class VideoBaseViewer extends media_MediaBaseViewer {
       this.seekBackwardButtonEl.addEventListener('click', () => this.movePlayback(false, 5));
     }
   }
+
+  /**
+   * Renders the narrow-video play/seek cluster with Blueprint buttons. The container stays on
+   * playContainerEl so the shared show/hide and narrow-width logic treats both versions the same.
+   *
+   * @private
+   * @return {void}
+   */
+  buildBlueprintPlaySeekOverlay() {
+    this.playContainerEl = this.mediaContainerEl.appendChild(document.createElement('div'));
+    this.playContainerEl.classList.add(CLASS_PLAY_SEEK_OVERLAY);
+    this.playContainerEl.classList.add(constants/* CLASS_HIDDEN */.zX);
+    const handlePlay = () => {
+      // The cluster hides once playback starts; keep focus in the player so Space still reaches it.
+      if (this.playContainerEl?.contains(document.activeElement)) {
+        this.mediaContainerEl.focus();
+      }
+      this.handlePlayRequest();
+    };
+    this.playSeekOverlayRoot = (0,client_.createRoot)(this.playContainerEl);
+    this.playSeekOverlayRoot.render(/*#__PURE__*/external_react_["default"].createElement(BlueprintProviders/* default */.A, {
+      container: this.containerEl
+    }, /*#__PURE__*/external_react_["default"].createElement(VideoPlaySeekOverlay, {
+      movePlayback: this.movePlayback,
+      onPlay: handlePlay
+    })));
+  }
   removePlayButtonWithSeekButtons() {
+    if (this.playSeekOverlayRoot) {
+      this.playSeekOverlayRoot.unmount();
+      this.playSeekOverlayRoot = undefined;
+    }
     if (this.playContainerEl) {
       if (this.seekForwardButtonEl) {
         this.seekForwardButtonEl.removeEventListener('click', () => this.movePlayback(true, 5));
@@ -54181,6 +54365,10 @@ class VideoBaseViewer extends media_MediaBaseViewer {
     if (this.seekBackwardButtonEl) {
       this.seekBackwardButtonEl.removeEventListener('click', () => this.movePlayback(false, 5));
     }
+    if (this.playSeekOverlayRoot) {
+      this.playSeekOverlayRoot.unmount();
+      this.playSeekOverlayRoot = undefined;
+    }
     if (this.bufferingSpinnerRoot) {
       this.bufferingSpinnerRoot.unmount();
       this.bufferingSpinnerRoot = undefined;
@@ -54934,8 +55122,6 @@ function VideoControls({
 var MediaSettingsV2 = __webpack_require__(4027);
 // EXTERNAL MODULE: ./src/lib/viewers/controls/media/PlayPauseButton.tsx + 2 modules
 var PlayPauseButton = __webpack_require__(5760);
-// EXTERNAL MODULE: ./src/lib/viewers/controls/media/SkipButton.tsx + 2 modules
-var SkipButton = __webpack_require__(2659);
 // EXTERNAL MODULE: ./src/lib/viewers/controls/media/TimestampControl.tsx + 1 modules
 var TimestampControl = __webpack_require__(3904);
 // EXTERNAL MODULE: ./src/lib/viewers/media/formatTimecode.ts
@@ -59080,8 +59266,6 @@ class DocFindBar extends (events_default()) {
 /* harmony default export */ const doc_DocFindBar = (DocFindBar);
 ;// external "@box/blueprint-web-assets/icons/Fill"
 
-// EXTERNAL MODULE: ./src/lib/TabularDigits.tsx + 1 modules
-var TabularDigits = __webpack_require__(2459);
 ;// ./src/lib/viewers/doc/DocFindBarV2.scss
 // extracted by mini-css-extract-plugin
 

package/package.json

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