box-content-preview 3.124.0 → 3.126.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.
- package/README.md +7 -7
- package/dist/lib/index.css +5 -2
- package/dist/lib/index.js +314 -35
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
[](https://mergify.io)
|
|
3
3
|
[](https://github.com/prettier/prettier)
|
|
4
4
|
[](https://travis-ci.org/box/box-content-preview)
|
|
5
|
-
[](https://github.com/box/box-content-preview)
|
|
6
6
|
[](https://www.npmjs.com/package/box-ui-elements)
|
|
7
7
|
|
|
8
8
|
# [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
|
|
|
22
22
|
|
|
23
23
|
## Current Version
|
|
24
24
|
|
|
25
|
-
- Version: v3.
|
|
25
|
+
- Version: v3.126.0
|
|
26
26
|
- Locale: en-US
|
|
27
27
|
|
|
28
|
-
https://cdn01.boxcdn.net/platform/preview/3.
|
|
29
|
-
https://cdn01.boxcdn.net/platform/preview/3.
|
|
28
|
+
https://cdn01.boxcdn.net/platform/preview/3.126.0/en-US/preview.js
|
|
29
|
+
https://cdn01.boxcdn.net/platform/preview/3.126.0/en-US/preview.css
|
|
30
30
|
|
|
31
31
|
## Supported Locales
|
|
32
32
|
|
|
@@ -52,10 +52,10 @@ You can self-host the Box Content Preview library or reference the versions avai
|
|
|
52
52
|
<title>Box Content Preview Demo</title>
|
|
53
53
|
|
|
54
54
|
<!-- Latest version of Preview SDK for your locale -->
|
|
55
|
-
<script src="https://cdn01.boxcdn.net/platform/preview/3.
|
|
55
|
+
<script src="https://cdn01.boxcdn.net/platform/preview/3.126.0/en-US/preview.js"></script>
|
|
56
56
|
<link
|
|
57
57
|
rel="stylesheet"
|
|
58
|
-
href="https://cdn01.boxcdn.net/platform/preview/3.
|
|
58
|
+
href="https://cdn01.boxcdn.net/platform/preview/3.126.0/en-US/preview.css"
|
|
59
59
|
/>
|
|
60
60
|
</head>
|
|
61
61
|
<body>
|
|
@@ -76,7 +76,7 @@ To self-host the Box Content Preview library, follow these steps:
|
|
|
76
76
|
|
|
77
77
|
1. Either fork the repo and check out the version you want to host or download the specific version as a zip:
|
|
78
78
|
|
|
79
|
-
- Check out a specific version with `git checkout v3.
|
|
79
|
+
- Check out a specific version with `git checkout v3.126.0`
|
|
80
80
|
- Download a specific version as a zip from https://github.com/box/box-content-preview/releases
|
|
81
81
|
|
|
82
82
|
2. Install dependencies and build the library with `yarn install && yarn build:i18n && yarn build:prod`
|
package/dist/lib/index.css
CHANGED
|
@@ -40,16 +40,19 @@
|
|
|
40
40
|
.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}
|
|
41
41
|
.bp-AnnotationsControls-exitBtn{display:none}
|
|
42
42
|
.bp-ToggleTooltipV2{display:flex}
|
|
43
|
+
.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)}
|
|
43
44
|
.bp-AnnotationsPaletteV2{position:absolute;right:0;bottom:100%;width:max-content;padding-bottom:var(--bp-space-020)}
|
|
44
45
|
.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)}
|
|
45
46
|
.bp-ControlsOverflowMenuV2{--blueprint-web-dropdown-content-min-width: 184px}
|
|
46
47
|
.bp-ResponsiveControlsBarV2-item{display:flex;flex:none;gap:inherit;align-items:center}
|
|
47
48
|
.bp-ControlsMenuItemV2.bp-ControlsMenuItemV2{gap:var(--bp-space-020)}.bp-ControlsMenuItemV2.bp-ControlsMenuItemV2>:nth-child(3){margin-inline-start:var(--bp-space-020)}
|
|
49
|
+
.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}
|
|
50
|
+
.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%)}
|
|
48
51
|
.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}
|
|
49
52
|
.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}
|
|
50
53
|
.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}}
|
|
51
54
|
.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}}
|
|
52
|
-
.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}
|
|
55
|
+
.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}
|
|
53
56
|
.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}
|
|
54
57
|
@media(max-width: 510px){.bp-box3d .bp-pullup{right:0}}@media(max-height: 550px){.bp-box3d .bp-pullup{overflow:scroll;height:250px}}
|
|
55
58
|
.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 @@
|
|
|
71
74
|
.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}
|
|
72
75
|
.bp-MediaSettingsV2{min-width:240px}.bp-MediaSettingsV2-value{display:flex;gap:4px;align-items:center}
|
|
73
76
|
.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}
|
|
74
|
-
.bp-TabularDigit{display:inline-block;width:1ch;text-align:center}
|
|
75
77
|
.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)}
|
|
76
78
|
.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}
|
|
77
79
|
.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 @@
|
|
|
91
93
|
.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}
|
|
92
94
|
.bp-MP3ControlsRoot{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}
|
|
93
95
|
.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}
|
|
96
|
+
.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%)}
|
|
94
97
|
.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)}
|
|
95
98
|
.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)}
|
|
96
99
|
.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
CHANGED
|
@@ -423,7 +423,7 @@ __webpack_require__.d(__webpack_exports__, {
|
|
|
423
423
|
k7: () => (/* binding */ renderTabularDigits)
|
|
424
424
|
});
|
|
425
425
|
|
|
426
|
-
// UNUSED EXPORTS: TABULAR_DIGIT_CLASS
|
|
426
|
+
// UNUSED EXPORTS: TABULAR_DIGITS_BOXES_CLASS, TABULAR_DIGITS_TEXT_CLASS, TABULAR_DIGIT_CLASS
|
|
427
427
|
|
|
428
428
|
// EXTERNAL MODULE: external "react"
|
|
429
429
|
var external_react_ = __webpack_require__(1649);
|
|
@@ -438,20 +438,51 @@ var external_react_ = __webpack_require__(1649);
|
|
|
438
438
|
// has no effect. Wrapping each digit in a 1ch box keeps changing numbers, and whatever follows them,
|
|
439
439
|
// from shifting as they update.
|
|
440
440
|
const TABULAR_DIGIT_CLASS = 'bp-TabularDigit';
|
|
441
|
+
const TABULAR_DIGITS_BOXES_CLASS = 'bp-TabularDigits-boxes';
|
|
442
|
+
const TABULAR_DIGITS_TEXT_CLASS = 'bp-TabularDigits-text';
|
|
441
443
|
const isDigit = char => char >= '0' && char <= '9';
|
|
442
444
|
const isDigitNode = node => node.nodeType === Node.ELEMENT_NODE;
|
|
443
445
|
|
|
446
|
+
// Screen readers would read the boxed digits one by one, so the boxes are hidden from them and a visually
|
|
447
|
+
// hidden copy gives them the whole text
|
|
448
|
+
const getParts = el => {
|
|
449
|
+
const boxesEl = el.firstElementChild;
|
|
450
|
+
const textEl = el.lastElementChild;
|
|
451
|
+
if (el.childNodes.length === 2 && boxesEl?.classList.contains(TABULAR_DIGITS_BOXES_CLASS) && textEl?.classList.contains(TABULAR_DIGITS_TEXT_CLASS)) {
|
|
452
|
+
return {
|
|
453
|
+
boxesEl,
|
|
454
|
+
textEl
|
|
455
|
+
};
|
|
456
|
+
}
|
|
457
|
+
const newBoxesEl = document.createElement('span');
|
|
458
|
+
newBoxesEl.className = TABULAR_DIGITS_BOXES_CLASS;
|
|
459
|
+
newBoxesEl.setAttribute('aria-hidden', 'true');
|
|
460
|
+
const newTextEl = document.createElement('span');
|
|
461
|
+
newTextEl.className = TABULAR_DIGITS_TEXT_CLASS;
|
|
462
|
+
el.replaceChildren(newBoxesEl, newTextEl);
|
|
463
|
+
return {
|
|
464
|
+
boxesEl: newBoxesEl,
|
|
465
|
+
textEl: newTextEl
|
|
466
|
+
};
|
|
467
|
+
};
|
|
468
|
+
|
|
444
469
|
/**
|
|
445
|
-
* Writes `text` into `el` with each digit in a fixed-width box
|
|
446
|
-
* e.g. on animation frames.
|
|
447
|
-
*
|
|
470
|
+
* Writes `text` into `el` with each digit in a fixed-width box, plus a visually hidden copy of `text` for
|
|
471
|
+
* screen readers. For labels updated outside React, e.g. on animation frames. This replaces the children
|
|
472
|
+
* of `el`, so `el` must not hold other content. Unchanged characters are left in place, so a ticking clock
|
|
473
|
+
* only touches the digits that changed.
|
|
448
474
|
*/
|
|
449
475
|
function renderTabularDigits(el, text) {
|
|
450
|
-
|
|
476
|
+
const {
|
|
477
|
+
boxesEl,
|
|
478
|
+
textEl
|
|
479
|
+
} = getParts(el);
|
|
480
|
+
if (textEl.textContent === text) {
|
|
451
481
|
return;
|
|
452
482
|
}
|
|
483
|
+
textEl.textContent = text;
|
|
453
484
|
const chars = Array.from(text);
|
|
454
|
-
const nodes =
|
|
485
|
+
const nodes = boxesEl.childNodes;
|
|
455
486
|
const canPatch = nodes.length === chars.length && chars.every((char, index) => isDigit(char) === isDigitNode(nodes[index]));
|
|
456
487
|
if (canPatch) {
|
|
457
488
|
chars.forEach((char, index) => {
|
|
@@ -472,7 +503,7 @@ function renderTabularDigits(el, text) {
|
|
|
472
503
|
fragment.appendChild(document.createTextNode(char));
|
|
473
504
|
}
|
|
474
505
|
});
|
|
475
|
-
|
|
506
|
+
boxesEl.replaceChildren(fragment);
|
|
476
507
|
}
|
|
477
508
|
/**
|
|
478
509
|
* 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 =
|
|
|
1297
1328
|
const CLIENT_NAME = "box-content-preview"; // eslint-disable-line no-undef
|
|
1298
1329
|
const CLIENT_NAME_KEY = 'box_client_name';
|
|
1299
1330
|
const CLIENT_VERSION_KEY = 'box_client_version';
|
|
1300
|
-
const CLIENT_VERSION = "3.
|
|
1331
|
+
const CLIENT_VERSION = "3.126.0"; // eslint-disable-line no-undef
|
|
1301
1332
|
const HEADER_CLIENT_NAME = 'X-Box-Client-Name';
|
|
1302
1333
|
const HEADER_CLIENT_VERSION = 'X-Box-Client-Version';
|
|
1303
1334
|
const PROMISE_MAP = {};
|
|
@@ -37273,7 +37304,7 @@ var isNpmBuild = __webpack_require__(8080);
|
|
|
37273
37304
|
;// ./src/lib/Logger.js
|
|
37274
37305
|
/* eslint-disable no-undef */
|
|
37275
37306
|
const CLIENT_NAME = "box-content-preview";
|
|
37276
|
-
const CLIENT_VERSION = "3.
|
|
37307
|
+
const CLIENT_VERSION = "3.126.0";
|
|
37277
37308
|
/* eslint-enable no-undef */
|
|
37278
37309
|
|
|
37279
37310
|
class Logger {
|
|
@@ -39919,6 +39950,7 @@ var BlueprintProviders = __webpack_require__(2758);
|
|
|
39919
39950
|
|
|
39920
39951
|
|
|
39921
39952
|
/* harmony default export */ const ControlsLayerContext = (/*#__PURE__*/external_react_["default"].createContext({
|
|
39953
|
+
setIsEditing: (noop_default()),
|
|
39922
39954
|
setIsForced: (noop_default())
|
|
39923
39955
|
}));
|
|
39924
39956
|
;// ./src/lib/viewers/controls/controls-layer/ControlsLayer.scss
|
|
@@ -39941,7 +39973,9 @@ function ControlsLayer({
|
|
|
39941
39973
|
const [isShown, setIsShown] = external_react_["default"].useState(false);
|
|
39942
39974
|
const hasFocusRef = external_react_["default"].useRef(false);
|
|
39943
39975
|
const hasCursorRef = external_react_["default"].useRef(false);
|
|
39976
|
+
const isEditingRef = external_react_["default"].useRef(false);
|
|
39944
39977
|
const hideTimeoutRef = external_react_["default"].useRef();
|
|
39978
|
+
const layerElRef = external_react_["default"].useRef(null);
|
|
39945
39979
|
|
|
39946
39980
|
// Visibility helpers
|
|
39947
39981
|
const helpersRef = external_react_["default"].useRef({
|
|
@@ -39985,7 +40019,7 @@ function ControlsLayer({
|
|
|
39985
40019
|
const handleMouseLeave = event => {
|
|
39986
40020
|
hasCursorRef.current = false;
|
|
39987
40021
|
const layerEl = event.currentTarget;
|
|
39988
|
-
if (document.activeElement && layerEl.contains(document.activeElement)) {
|
|
40022
|
+
if (!isEditingRef.current && document.activeElement && layerEl.contains(document.activeElement)) {
|
|
39989
40023
|
document.activeElement.blur();
|
|
39990
40024
|
}
|
|
39991
40025
|
helpersRef.current.hide();
|
|
@@ -40007,12 +40041,26 @@ function ControlsLayer({
|
|
|
40007
40041
|
helpersRef.current.reset();
|
|
40008
40042
|
setIsForced(value);
|
|
40009
40043
|
}, []);
|
|
40044
|
+
const setIsEditing = external_react_["default"].useCallback(value => {
|
|
40045
|
+
const wasEditing = isEditingRef.current;
|
|
40046
|
+
isEditingRef.current = value;
|
|
40047
|
+
|
|
40048
|
+
// Ending an edit can remove the focused field without a blur, so check where focus is now and hide
|
|
40049
|
+
// once neither focus nor the cursor is on the layer. The layer is already gone if the edit ended
|
|
40050
|
+
// because the controls unmounted.
|
|
40051
|
+
if (wasEditing && !value && layerElRef.current) {
|
|
40052
|
+
hasFocusRef.current = !!layerElRef.current?.contains(document.activeElement);
|
|
40053
|
+
helpersRef.current.hide();
|
|
40054
|
+
}
|
|
40055
|
+
}, []);
|
|
40010
40056
|
const contextValue = external_react_["default"].useMemo(() => ({
|
|
40057
|
+
setIsEditing,
|
|
40011
40058
|
setIsForced: setIsForcedWithReset
|
|
40012
|
-
}), [setIsForcedWithReset]);
|
|
40059
|
+
}), [setIsEditing, setIsForcedWithReset]);
|
|
40013
40060
|
return /*#__PURE__*/external_react_["default"].createElement(ControlsLayerContext.Provider, {
|
|
40014
40061
|
value: contextValue
|
|
40015
40062
|
}, /*#__PURE__*/external_react_["default"].createElement("div", {
|
|
40063
|
+
ref: layerElRef,
|
|
40016
40064
|
className: `bp-ControlsLayer ${isShown || isForced ? SHOW_CLASSNAME : ''}`,
|
|
40017
40065
|
"data-testid": "bp-ControlsLayer",
|
|
40018
40066
|
onBlur: handleFocusOut,
|
|
@@ -41614,16 +41662,24 @@ const ANNOTATION_MODE_ICONS = {
|
|
|
41614
41662
|
[AnnotationMode.REGION]: __WEBPACK_EXTERNAL_MODULE__box_blueprint_web_assets_icons_Medium_SquarePlus_c11758f1_default__
|
|
41615
41663
|
};
|
|
41616
41664
|
/* harmony default export */ const annotationModeIcons = (ANNOTATION_MODE_ICONS);
|
|
41665
|
+
// EXTERNAL MODULE: ./src/lib/viewers/controls/media/utils.ts
|
|
41666
|
+
var utils = __webpack_require__(5346);
|
|
41667
|
+
;// ./src/lib/viewers/controls/controls-bar/ControlsBarV2.scss
|
|
41668
|
+
// extracted by mini-css-extract-plugin
|
|
41669
|
+
|
|
41617
41670
|
;// ./src/lib/viewers/controls/controls-bar/ControlsBarV2.tsx
|
|
41618
|
-
const ControlsBarV2_excluded = ["children"];
|
|
41671
|
+
const ControlsBarV2_excluded = ["children", "size"];
|
|
41619
41672
|
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); }
|
|
41620
41673
|
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; }
|
|
41621
41674
|
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; }
|
|
41622
41675
|
|
|
41623
41676
|
|
|
41677
|
+
|
|
41678
|
+
|
|
41624
41679
|
function ControlsBarV2(_ref, ref) {
|
|
41625
41680
|
let {
|
|
41626
|
-
children
|
|
41681
|
+
children,
|
|
41682
|
+
size = 'large'
|
|
41627
41683
|
} = _ref,
|
|
41628
41684
|
rest = ControlsBarV2_objectWithoutProperties(_ref, ControlsBarV2_excluded);
|
|
41629
41685
|
if (!children) {
|
|
@@ -41631,9 +41687,12 @@ function ControlsBarV2(_ref, ref) {
|
|
|
41631
41687
|
}
|
|
41632
41688
|
return /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Root, ControlsBarV2_extends({
|
|
41633
41689
|
ref: ref,
|
|
41690
|
+
className: `bp-ControlsBarV2 bp-ControlsBarV2--${size}`,
|
|
41634
41691
|
colorScheme: "dark",
|
|
41635
41692
|
"data-testid": "bp-ControlsBar"
|
|
41636
|
-
}, rest
|
|
41693
|
+
}, rest, {
|
|
41694
|
+
onKeyDown: utils/* stopToolbarKeyPropagation */.B9
|
|
41695
|
+
}), children);
|
|
41637
41696
|
}
|
|
41638
41697
|
/* harmony default export */ const controls_bar_ControlsBarV2 = (/*#__PURE__*/external_react_["default"].forwardRef(ControlsBarV2));
|
|
41639
41698
|
;// ./src/lib/viewers/controls/annotations/AnnotationsPaletteV2.scss
|
|
@@ -41656,7 +41715,9 @@ function AnnotationsPaletteV2({
|
|
|
41656
41715
|
return /*#__PURE__*/external_react_["default"].createElement("div", {
|
|
41657
41716
|
className: "bp-AnnotationsPaletteV2",
|
|
41658
41717
|
"data-testid": "bp-AnnotationsPaletteV2"
|
|
41659
|
-
}, /*#__PURE__*/external_react_["default"].createElement(controls_bar_ControlsBarV2,
|
|
41718
|
+
}, /*#__PURE__*/external_react_["default"].createElement(controls_bar_ControlsBarV2, {
|
|
41719
|
+
size: "small"
|
|
41720
|
+
}, children));
|
|
41660
41721
|
}
|
|
41661
41722
|
function Modes({
|
|
41662
41723
|
annotationMode,
|
|
@@ -42257,6 +42318,24 @@ function RotateMenuItemV2({
|
|
|
42257
42318
|
|
|
42258
42319
|
;// external "@box/blueprint-web-assets/icons/Medium/Plus"
|
|
42259
42320
|
|
|
42321
|
+
;// ./src/lib/viewers/controls/controls-bar/ControlsPillV2.scss
|
|
42322
|
+
// extracted by mini-css-extract-plugin
|
|
42323
|
+
|
|
42324
|
+
;// ./src/lib/viewers/controls/controls-bar/ControlsPillV2.tsx
|
|
42325
|
+
|
|
42326
|
+
|
|
42327
|
+
// Groups the parts of one control, like page or zoom, on a shared background. Buttons inside take the
|
|
42328
|
+
// bp-ControlsPillV2-button class, and a text button takes bp-ControlsPillV2-label.
|
|
42329
|
+
function ControlsPillV2({
|
|
42330
|
+
children
|
|
42331
|
+
}) {
|
|
42332
|
+
return /*#__PURE__*/external_react_["default"].createElement("div", {
|
|
42333
|
+
className: "bp-ControlsPillV2",
|
|
42334
|
+
"data-testid": "bp-ControlsPill"
|
|
42335
|
+
}, children);
|
|
42336
|
+
}
|
|
42337
|
+
// EXTERNAL MODULE: ./src/lib/TabularDigits.tsx + 1 modules
|
|
42338
|
+
var TabularDigits = __webpack_require__(2459);
|
|
42260
42339
|
;// ./src/lib/viewers/controls/zoom/ZoomControlsV2.tsx
|
|
42261
42340
|
/* provided dependency */ var ZoomControlsV2_ = __webpack_require__(441)["Tl"];
|
|
42262
42341
|
|
|
@@ -42265,6 +42344,8 @@ function RotateMenuItemV2({
|
|
|
42265
42344
|
|
|
42266
42345
|
|
|
42267
42346
|
|
|
42347
|
+
|
|
42348
|
+
|
|
42268
42349
|
function getZoomState({
|
|
42269
42350
|
maxScale = MAX_SCALE,
|
|
42270
42351
|
minScale = MIN_SCALE,
|
|
@@ -42297,9 +42378,10 @@ function ZoomControlsV2({
|
|
|
42297
42378
|
minScale,
|
|
42298
42379
|
scale
|
|
42299
42380
|
});
|
|
42300
|
-
return /*#__PURE__*/external_react_["default"].createElement(
|
|
42381
|
+
return /*#__PURE__*/external_react_["default"].createElement(ControlsPillV2, null, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
|
|
42301
42382
|
content: ZoomControlsV2_('zoom_out')
|
|
42302
42383
|
}, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
|
|
42384
|
+
className: "bp-ControlsPillV2-button",
|
|
42303
42385
|
"aria-label": ZoomControlsV2_('zoom_out'),
|
|
42304
42386
|
"data-resin-target": resinTargetZoomOut,
|
|
42305
42387
|
"data-testid": "bp-ZoomControls-out",
|
|
@@ -42309,13 +42391,15 @@ function ZoomControlsV2({
|
|
|
42309
42391
|
icon: __WEBPACK_EXTERNAL_MODULE__box_blueprint_web_assets_icons_Medium_Minus_cc9df143_default__
|
|
42310
42392
|
}))), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Text, {
|
|
42311
42393
|
as: "span",
|
|
42394
|
+
className: "bp-ControlsPillV2-text",
|
|
42312
42395
|
color: "textOnDarkDefault",
|
|
42313
42396
|
"data-testid": "bp-ZoomControls-current",
|
|
42314
42397
|
title: ZoomControlsV2_('zoom_current_scale'),
|
|
42315
|
-
variant: "
|
|
42316
|
-
}, `${Math.round(currentScale * 100)}%`), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
|
|
42398
|
+
variant: "bodyDefault"
|
|
42399
|
+
}, /*#__PURE__*/external_react_["default"].createElement(TabularDigits/* default */.Ay, null, `${Math.round(currentScale * 100)}%`)), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
|
|
42317
42400
|
content: ZoomControlsV2_('zoom_in')
|
|
42318
42401
|
}, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
|
|
42402
|
+
className: "bp-ControlsPillV2-button",
|
|
42319
42403
|
"aria-label": ZoomControlsV2_('zoom_in'),
|
|
42320
42404
|
"data-resin-target": resinTargetZoomIn,
|
|
42321
42405
|
"data-testid": "bp-ZoomControls-in",
|
|
@@ -43293,14 +43377,21 @@ function MultiImageControls({
|
|
|
43293
43377
|
|
|
43294
43378
|
|
|
43295
43379
|
|
|
43380
|
+
|
|
43381
|
+
|
|
43296
43382
|
function PageControlsFormV2({
|
|
43297
43383
|
onPageSubmit,
|
|
43298
43384
|
pageNumber,
|
|
43299
43385
|
pageCount
|
|
43300
43386
|
}) {
|
|
43387
|
+
const {
|
|
43388
|
+
setIsEditing
|
|
43389
|
+
} = external_react_["default"].useContext(ControlsLayerContext);
|
|
43301
43390
|
const [isInputShown, setIsInputShown] = external_react_["default"].useState(false);
|
|
43302
43391
|
// A string because Toolbar.Input only supports text types, so a parsed number would show "NaN" once cleared
|
|
43303
43392
|
const [inputValue, setInputValue] = external_react_["default"].useState(pageNumber.toString());
|
|
43393
|
+
// The input takes the button's size, so the bar keeps its width and height while the page number is edited
|
|
43394
|
+
const [inputSize, setInputSize] = external_react_["default"].useState();
|
|
43304
43395
|
const buttonElRef = external_react_["default"].useRef(null);
|
|
43305
43396
|
const inputElRef = external_react_["default"].useRef(null);
|
|
43306
43397
|
const isRetryRef = external_react_["default"].useRef(false);
|
|
@@ -43317,6 +43408,14 @@ function PageControlsFormV2({
|
|
|
43317
43408
|
}
|
|
43318
43409
|
setIsInputShown(false);
|
|
43319
43410
|
};
|
|
43411
|
+
const handleButtonClick = () => {
|
|
43412
|
+
const rect = buttonElRef.current?.getBoundingClientRect();
|
|
43413
|
+
setInputSize(rect?.width ? {
|
|
43414
|
+
height: rect.height,
|
|
43415
|
+
width: rect.width
|
|
43416
|
+
} : undefined);
|
|
43417
|
+
setIsInputShown(true);
|
|
43418
|
+
};
|
|
43320
43419
|
const handleNumInputChange = event => {
|
|
43321
43420
|
setInputValue(event.target.value);
|
|
43322
43421
|
};
|
|
@@ -43345,6 +43444,12 @@ function PageControlsFormV2({
|
|
|
43345
43444
|
external_react_["default"].useEffect(() => {
|
|
43346
43445
|
setInputValue(pageNumber.toString()); // Keep internal state in sync with prop as it changes
|
|
43347
43446
|
}, [pageNumber]);
|
|
43447
|
+
|
|
43448
|
+
// Keeps the bar and the input up while typing, even once the cursor leaves the bar
|
|
43449
|
+
external_react_["default"].useEffect(() => {
|
|
43450
|
+
setIsEditing(isInputShown);
|
|
43451
|
+
return () => setIsEditing(false);
|
|
43452
|
+
}, [isInputShown, setIsEditing]);
|
|
43348
43453
|
external_react_["default"].useLayoutEffect(() => {
|
|
43349
43454
|
if (inputElRef.current && isInputShown) {
|
|
43350
43455
|
inputElRef.current.select();
|
|
@@ -43360,7 +43465,8 @@ function PageControlsFormV2({
|
|
|
43360
43465
|
className: "bp-PageControlsFormV2",
|
|
43361
43466
|
"data-testid": "bp-PageControlsForm"
|
|
43362
43467
|
}, isInputShown ? /*#__PURE__*/external_react_["default"].createElement("div", {
|
|
43363
|
-
className: "bp-PageControlsFormV2-input"
|
|
43468
|
+
className: "bp-PageControlsFormV2-input",
|
|
43469
|
+
style: inputSize
|
|
43364
43470
|
}, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Input, {
|
|
43365
43471
|
ref: inputElRef,
|
|
43366
43472
|
"aria-label": PageControlsFormV2_('enter_page_num'),
|
|
@@ -43377,17 +43483,20 @@ function PageControlsFormV2({
|
|
|
43377
43483
|
content: PageControlsFormV2_('enter_page_num')
|
|
43378
43484
|
}, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
|
|
43379
43485
|
ref: buttonElRef,
|
|
43486
|
+
className: "bp-ControlsPillV2-label",
|
|
43380
43487
|
"data-resin-target": "pageNumberOpen",
|
|
43381
43488
|
"data-testid": "bp-PageControlsForm-button",
|
|
43382
43489
|
disabled: pageCount <= 1,
|
|
43383
|
-
onClick:
|
|
43490
|
+
onClick: handleButtonClick
|
|
43384
43491
|
}, /*#__PURE__*/external_react_["default"].createElement("span", {
|
|
43385
43492
|
className: "bp-PageControlsFormV2-button-label",
|
|
43386
43493
|
"data-testid": "bp-PageControlsForm-button-label"
|
|
43387
43494
|
}, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Text, {
|
|
43388
43495
|
as: "span",
|
|
43389
|
-
|
|
43390
|
-
|
|
43496
|
+
className: "bp-ControlsPillV2-text",
|
|
43497
|
+
color: "textOnDarkDefault",
|
|
43498
|
+
variant: "bodyDefaultSemibold"
|
|
43499
|
+
}, /*#__PURE__*/external_react_["default"].createElement(TabularDigits/* default */.Ay, null, `${pageNumber} / ${pageCount}`))))));
|
|
43391
43500
|
}
|
|
43392
43501
|
;// ./src/lib/viewers/controls/page/PageControlsV2.tsx
|
|
43393
43502
|
/* provided dependency */ var PageControlsV2_ = __webpack_require__(441)["Tl"];
|
|
@@ -43396,6 +43505,7 @@ function PageControlsFormV2({
|
|
|
43396
43505
|
|
|
43397
43506
|
|
|
43398
43507
|
|
|
43508
|
+
|
|
43399
43509
|
function PageControlsV2({
|
|
43400
43510
|
onPageChange,
|
|
43401
43511
|
onPageSubmit,
|
|
@@ -43405,9 +43515,10 @@ function PageControlsV2({
|
|
|
43405
43515
|
if (pageCount <= 1) {
|
|
43406
43516
|
return null;
|
|
43407
43517
|
}
|
|
43408
|
-
return /*#__PURE__*/external_react_["default"].createElement(
|
|
43518
|
+
return /*#__PURE__*/external_react_["default"].createElement(ControlsPillV2, null, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
|
|
43409
43519
|
content: PageControlsV2_('previous_page')
|
|
43410
43520
|
}, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
|
|
43521
|
+
className: "bp-ControlsPillV2-button",
|
|
43411
43522
|
"aria-label": PageControlsV2_('previous_page'),
|
|
43412
43523
|
"data-resin-target": "pagePrevious",
|
|
43413
43524
|
"data-testid": "bp-PageControls-previous",
|
|
@@ -43422,6 +43533,7 @@ function PageControlsV2({
|
|
|
43422
43533
|
}), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
|
|
43423
43534
|
content: PageControlsV2_('next_page')
|
|
43424
43535
|
}, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Toolbar.Button, {
|
|
43536
|
+
className: "bp-ControlsPillV2-button",
|
|
43425
43537
|
"aria-label": PageControlsV2_('next_page'),
|
|
43426
43538
|
"data-resin-target": "pageNext",
|
|
43427
43539
|
"data-testid": "bp-PageControls-next",
|
|
@@ -45743,8 +45855,6 @@ function Image360Controls({
|
|
|
45743
45855
|
}
|
|
45744
45856
|
;// external "@box/blueprint-web-assets/icons/Medium/VrGoggles"
|
|
45745
45857
|
|
|
45746
|
-
// EXTERNAL MODULE: ./src/lib/viewers/controls/media/utils.ts
|
|
45747
|
-
var utils = __webpack_require__(5346);
|
|
45748
45858
|
;// ./src/lib/viewers/controls/box3d/VrToggleControlV2.tsx
|
|
45749
45859
|
/* provided dependency */ var VrToggleControlV2_ = __webpack_require__(441)["Tl"];
|
|
45750
45860
|
const VrToggleControlV2_excluded = ["buttonType", "isVrShown", "onVrToggle"];
|
|
@@ -47351,6 +47461,68 @@ class PrintModalRoot {
|
|
|
47351
47461
|
}
|
|
47352
47462
|
;// ./src/lib/icons/print_checkmark.svg
|
|
47353
47463
|
const print_checkmark_namespaceObject = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" focusable=\"false\">\n <path d=\"M4.187 6.48L3.067 7.6l3.6 3.6 8-8-1.12-1.12-6.88 6.88-2.48-2.48zM14.4 8c0 3.52-2.88 6.4-6.4 6.4-3.52 0-6.4-2.88-6.4-6.4 0-3.52 2.88-6.4 6.4-6.4.64 0 1.2.08 1.76.24L11.04.56C10.08.24 9.04 0 8 0 3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8h-1.6z\" fill=\"#22A7F0\" fill-rule=\"evenodd\"/>\n</svg>\n";
|
|
47464
|
+
;// ./src/lib/viewers/text/printStyles.ts
|
|
47465
|
+
// The PlainText.scss and Markdown.scss rules that can match inside the print iframe, which holds only
|
|
47466
|
+
// the text element. Keep them in sync with those files; printStyles-test.ts fails when they drift.
|
|
47467
|
+
const PLAIN_TEXT_PRINT_STYLES = `
|
|
47468
|
+
.bp-text-plain {
|
|
47469
|
+
position: absolute;
|
|
47470
|
+
inset: 0;
|
|
47471
|
+
overflow: auto;
|
|
47472
|
+
margin: 0;
|
|
47473
|
+
line-height: 1.5;
|
|
47474
|
+
text-align: left;
|
|
47475
|
+
word-wrap: break-word;
|
|
47476
|
+
white-space: pre-wrap;
|
|
47477
|
+
background-color: #fff;
|
|
47478
|
+
}
|
|
47479
|
+
|
|
47480
|
+
.bp-text-plain ul {
|
|
47481
|
+
list-style: disc;
|
|
47482
|
+
}
|
|
47483
|
+
|
|
47484
|
+
.bp-text-plain ol {
|
|
47485
|
+
list-style: decimal;
|
|
47486
|
+
}
|
|
47487
|
+
|
|
47488
|
+
.bp-text-plain ol ul,
|
|
47489
|
+
.bp-text-plain ul ul {
|
|
47490
|
+
list-style: circle;
|
|
47491
|
+
}
|
|
47492
|
+
|
|
47493
|
+
.bp-text-truncated {
|
|
47494
|
+
padding-bottom: 75px;
|
|
47495
|
+
font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
47496
|
+
text-align: center;
|
|
47497
|
+
}
|
|
47498
|
+
|
|
47499
|
+
.bp-text-truncated p {
|
|
47500
|
+
margin: 10px 0;
|
|
47501
|
+
}
|
|
47502
|
+
|
|
47503
|
+
@media print {
|
|
47504
|
+
.bp-text-plain {
|
|
47505
|
+
position: static;
|
|
47506
|
+
overflow: visible;
|
|
47507
|
+
margin: 0;
|
|
47508
|
+
padding: 0;
|
|
47509
|
+
word-wrap: break-word;
|
|
47510
|
+
}
|
|
47511
|
+
|
|
47512
|
+
.bp-text-truncated .bp-btn-download {
|
|
47513
|
+
display: none;
|
|
47514
|
+
}
|
|
47515
|
+
}
|
|
47516
|
+
`;
|
|
47517
|
+
const MARKDOWN_PRINT_STYLES = `${PLAIN_TEXT_PRINT_STYLES}
|
|
47518
|
+
.markdown-body {
|
|
47519
|
+
white-space: normal;
|
|
47520
|
+
}
|
|
47521
|
+
|
|
47522
|
+
.markdown-body ul li {
|
|
47523
|
+
list-style: disc;
|
|
47524
|
+
}
|
|
47525
|
+
`;
|
|
47354
47526
|
;// ./src/lib/viewers/text/PlainText.scss
|
|
47355
47527
|
// extracted by mini-css-extract-plugin
|
|
47356
47528
|
|
|
@@ -47371,6 +47543,8 @@ function PlainTextViewer_toPrimitive(t, r) { if ("object" != typeof t || !t) ret
|
|
|
47371
47543
|
|
|
47372
47544
|
|
|
47373
47545
|
|
|
47546
|
+
|
|
47547
|
+
|
|
47374
47548
|
// Inline web worker JS
|
|
47375
47549
|
const HIGHLIGHT_WORKER_JS = 'onmessage=function(e){importScripts(e.data.highlightSrc);postMessage(self.hljs.highlightAuto(e.data.text).value)};';
|
|
47376
47550
|
|
|
@@ -47499,7 +47673,7 @@ class PlainTextViewer extends text_TextBaseViewer {
|
|
|
47499
47673
|
*/
|
|
47500
47674
|
print() {
|
|
47501
47675
|
if (!this.printReady) {
|
|
47502
|
-
this.preparePrint(this.getCSS()
|
|
47676
|
+
this.preparePrint(this.getCSS());
|
|
47503
47677
|
this.printPopup.show(PlainTextViewer_('print_loading'), PlainTextViewer_('print'), () => {
|
|
47504
47678
|
this.printPopup.hide();
|
|
47505
47679
|
this.printIframe();
|
|
@@ -47556,6 +47730,15 @@ class PlainTextViewer extends text_TextBaseViewer {
|
|
|
47556
47730
|
return src_CSS;
|
|
47557
47731
|
}
|
|
47558
47732
|
|
|
47733
|
+
/**
|
|
47734
|
+
* Returns the viewer styles that npm builds inject into the print iframe
|
|
47735
|
+
*
|
|
47736
|
+
* @return {string} CSS text
|
|
47737
|
+
*/
|
|
47738
|
+
getPrintStyles() {
|
|
47739
|
+
return PLAIN_TEXT_PRINT_STYLES;
|
|
47740
|
+
}
|
|
47741
|
+
|
|
47559
47742
|
/**
|
|
47560
47743
|
* Finishes loading after text is highlighted.
|
|
47561
47744
|
*
|
|
@@ -47644,19 +47827,30 @@ class PlainTextViewer extends text_TextBaseViewer {
|
|
|
47644
47827
|
}
|
|
47645
47828
|
|
|
47646
47829
|
/**
|
|
47647
|
-
*
|
|
47648
|
-
* styles into an iframe that can be printed.
|
|
47830
|
+
* Writes the text element into a printable iframe and attaches its print styles.
|
|
47649
47831
|
*
|
|
47650
47832
|
* @private
|
|
47651
|
-
* @param {string[]} stylesheets -
|
|
47833
|
+
* @param {string[]} stylesheets - Third-party stylesheets needed for print, before the viewer's own styles
|
|
47652
47834
|
* @return {void}
|
|
47653
47835
|
*/
|
|
47654
47836
|
preparePrint(stylesheets) {
|
|
47655
47837
|
const assetUrlCreator = (0,util/* createAssetUrlCreator */.my)(this.options.location);
|
|
47656
47838
|
this.printframe = (0,util/* openContentInsideIframe */.G9)(this.textEl.outerHTML);
|
|
47839
|
+
const {
|
|
47840
|
+
head
|
|
47841
|
+
} = this.printframe.contentDocument;
|
|
47657
47842
|
stylesheets.forEach(stylesheet => {
|
|
47658
|
-
|
|
47843
|
+
head.appendChild((0,util/* createStylesheet */.fX)(assetUrlCreator(stylesheet)));
|
|
47659
47844
|
});
|
|
47845
|
+
|
|
47846
|
+
// npm consumers bundle the viewer CSS themselves and host no preview.css to link to.
|
|
47847
|
+
if ((0,isNpmBuild/* isNpmBuild */.w)()) {
|
|
47848
|
+
const printStyleEl = document.createElement('style');
|
|
47849
|
+
printStyleEl.textContent = this.getPrintStyles();
|
|
47850
|
+
head.appendChild(printStyleEl);
|
|
47851
|
+
} else {
|
|
47852
|
+
head.appendChild((0,util/* createStylesheet */.fX)(assetUrlCreator('preview.css')));
|
|
47853
|
+
}
|
|
47660
47854
|
setTimeout(() => {
|
|
47661
47855
|
if (this.printPopup instanceof PrintModalRoot) {
|
|
47662
47856
|
this.printPopup.showReady(PlainTextViewer_('print_ready'));
|
|
@@ -47751,6 +47945,7 @@ function MarkdownControlsV2({
|
|
|
47751
47945
|
|
|
47752
47946
|
|
|
47753
47947
|
|
|
47948
|
+
|
|
47754
47949
|
const MarkdownViewer_STATIC_URI = `third-party/text/${constants/* TEXT_STATIC_ASSETS_VERSION */.cR}/`;
|
|
47755
47950
|
class MarkdownViewer extends text_PlainTextViewer {
|
|
47756
47951
|
/**
|
|
@@ -47789,6 +47984,13 @@ class MarkdownViewer extends text_PlainTextViewer {
|
|
|
47789
47984
|
return super.getCSS().concat(`${MarkdownViewer_STATIC_URI}github-markdown.min.css`);
|
|
47790
47985
|
}
|
|
47791
47986
|
|
|
47987
|
+
/**
|
|
47988
|
+
* @inheritdoc
|
|
47989
|
+
*/
|
|
47990
|
+
getPrintStyles() {
|
|
47991
|
+
return MARKDOWN_PRINT_STYLES;
|
|
47992
|
+
}
|
|
47993
|
+
|
|
47792
47994
|
/**
|
|
47793
47995
|
* Prints text using an an iframe. Adds Github Markdown CSS to print styles.
|
|
47794
47996
|
*
|
|
@@ -47797,7 +47999,7 @@ class MarkdownViewer extends text_PlainTextViewer {
|
|
|
47797
47999
|
*/
|
|
47798
48000
|
print() {
|
|
47799
48001
|
if (!this.printReady) {
|
|
47800
|
-
this.preparePrint(this.getCSS()
|
|
48002
|
+
this.preparePrint(this.getCSS());
|
|
47801
48003
|
this.printPopup.show(MarkdownViewer_('print_loading'), MarkdownViewer_('print'), () => {
|
|
47802
48004
|
this.printPopup.hide();
|
|
47803
48005
|
this.printIframe();
|
|
@@ -53165,6 +53367,45 @@ const arrow_curved_forward_24px_namespaceObject = "<svg width=\"24\" height=\"24
|
|
|
53165
53367
|
var MediaLoadingIndicator = __webpack_require__(4301);
|
|
53166
53368
|
// EXTERNAL MODULE: ./src/lib/viewers/controls/media/PlayOverlayIcon.tsx
|
|
53167
53369
|
var PlayOverlayIcon = __webpack_require__(2048);
|
|
53370
|
+
// EXTERNAL MODULE: ./src/lib/viewers/controls/media/SkipButton.tsx + 2 modules
|
|
53371
|
+
var SkipButton = __webpack_require__(2659);
|
|
53372
|
+
;// ./src/lib/viewers/controls/media/VideoPlaySeekOverlay.scss
|
|
53373
|
+
// extracted by mini-css-extract-plugin
|
|
53374
|
+
|
|
53375
|
+
;// ./src/lib/viewers/controls/media/VideoPlaySeekOverlay.tsx
|
|
53376
|
+
/* provided dependency */ var VideoPlaySeekOverlay_ = __webpack_require__(441)["Tl"];
|
|
53377
|
+
|
|
53378
|
+
|
|
53379
|
+
|
|
53380
|
+
|
|
53381
|
+
|
|
53382
|
+
|
|
53383
|
+
function VideoPlaySeekOverlay({
|
|
53384
|
+
movePlayback,
|
|
53385
|
+
onPlay
|
|
53386
|
+
}) {
|
|
53387
|
+
return /*#__PURE__*/external_react_["default"].createElement(external_react_["default"].Fragment, null, /*#__PURE__*/external_react_["default"].createElement(SkipButton/* default */.A, {
|
|
53388
|
+
direction: "backward",
|
|
53389
|
+
isBlueprintEnabled: true,
|
|
53390
|
+
movePlayback: movePlayback
|
|
53391
|
+
}), /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.Tooltip, {
|
|
53392
|
+
content: VideoPlaySeekOverlay_('media_play')
|
|
53393
|
+
}, /*#__PURE__*/external_react_["default"].createElement(blueprint_web_.IconButton, {
|
|
53394
|
+
"aria-label": VideoPlaySeekOverlay_('media_play'),
|
|
53395
|
+
className: "bp-VideoPlaySeekOverlay-play",
|
|
53396
|
+
"data-resin-target": "playOverlay",
|
|
53397
|
+
"data-target-id": "VideoPlaySeekOverlay-play",
|
|
53398
|
+
icon: PlayOverlayIcon/* default */.A,
|
|
53399
|
+
onClick: onPlay,
|
|
53400
|
+
onKeyDown: utils/* stopActivationKeyPropagation */.My,
|
|
53401
|
+
size: "large",
|
|
53402
|
+
variant: "on-dark"
|
|
53403
|
+
})), /*#__PURE__*/external_react_["default"].createElement(SkipButton/* default */.A, {
|
|
53404
|
+
direction: "forward",
|
|
53405
|
+
isBlueprintEnabled: true,
|
|
53406
|
+
movePlayback: movePlayback
|
|
53407
|
+
}));
|
|
53408
|
+
}
|
|
53168
53409
|
;// ./src/lib/viewers/media/fitFrameToViewport.js
|
|
53169
53410
|
/**
|
|
53170
53411
|
* Contain-fits a frame into the viewport (same model as object-fit: contain).
|
|
@@ -53781,11 +54022,14 @@ function VideoBaseViewer_toPrimitive(t, r) { if ("object" != typeof t || !t) ret
|
|
|
53781
54022
|
|
|
53782
54023
|
|
|
53783
54024
|
|
|
54025
|
+
|
|
54026
|
+
|
|
53784
54027
|
const MOUSE_MOVE_TIMEOUT_IN_MILLIS = 1000;
|
|
53785
54028
|
const CLASS_PLAY_BUTTON = 'bp-media-play-button';
|
|
53786
54029
|
const CLASS_PLAY_CONTAINER = 'bp-media-overlay-play-container';
|
|
53787
54030
|
const CLASS_PLAY_CONTAINER_PLAY_BUTTON = 'bp-media-overlay-play-button';
|
|
53788
54031
|
const CLASS_SEEK_BUTTON = 'bp-media-overlay-seek-button';
|
|
54032
|
+
const CLASS_PLAY_SEEK_OVERLAY = 'bp-VideoPlaySeekOverlay';
|
|
53789
54033
|
const SMALL_VIDEO_WIDTH_THRESHOLD = 580;
|
|
53790
54034
|
const SPINNER_HALF_SIZE = 40; // Half of the 80px spinner height (_mediaBase.scss and MediaLoadingIndicator.scss)
|
|
53791
54035
|
const VIDEO_ANNOTATIONS_ENABLED = 'videoAnnotations.enabled';
|
|
@@ -54103,6 +54347,10 @@ class VideoBaseViewer extends media_MediaBaseViewer {
|
|
|
54103
54347
|
});
|
|
54104
54348
|
}
|
|
54105
54349
|
buildPlayButtonWithSeekButtons() {
|
|
54350
|
+
if (this.isBlueprintMediaControlsEnabled()) {
|
|
54351
|
+
this.buildBlueprintPlaySeekOverlay();
|
|
54352
|
+
return;
|
|
54353
|
+
}
|
|
54106
54354
|
this.playContainerEl = this.mediaContainerEl.appendChild(document.createElement('div'));
|
|
54107
54355
|
this.playContainerEl.classList.add(CLASS_PLAY_CONTAINER);
|
|
54108
54356
|
this.playContainerEl.classList.add(constants/* CLASS_HIDDEN */.zX);
|
|
@@ -54129,7 +54377,38 @@ class VideoBaseViewer extends media_MediaBaseViewer {
|
|
|
54129
54377
|
this.seekBackwardButtonEl.addEventListener('click', () => this.movePlayback(false, 5));
|
|
54130
54378
|
}
|
|
54131
54379
|
}
|
|
54380
|
+
|
|
54381
|
+
/**
|
|
54382
|
+
* Renders the narrow-video play/seek cluster with Blueprint buttons. The container stays on
|
|
54383
|
+
* playContainerEl so the shared show/hide and narrow-width logic treats both versions the same.
|
|
54384
|
+
*
|
|
54385
|
+
* @private
|
|
54386
|
+
* @return {void}
|
|
54387
|
+
*/
|
|
54388
|
+
buildBlueprintPlaySeekOverlay() {
|
|
54389
|
+
this.playContainerEl = this.mediaContainerEl.appendChild(document.createElement('div'));
|
|
54390
|
+
this.playContainerEl.classList.add(CLASS_PLAY_SEEK_OVERLAY);
|
|
54391
|
+
this.playContainerEl.classList.add(constants/* CLASS_HIDDEN */.zX);
|
|
54392
|
+
const handlePlay = () => {
|
|
54393
|
+
// The cluster hides once playback starts; keep focus in the player so Space still reaches it.
|
|
54394
|
+
if (this.playContainerEl?.contains(document.activeElement)) {
|
|
54395
|
+
this.mediaContainerEl.focus();
|
|
54396
|
+
}
|
|
54397
|
+
this.handlePlayRequest();
|
|
54398
|
+
};
|
|
54399
|
+
this.playSeekOverlayRoot = (0,client_.createRoot)(this.playContainerEl);
|
|
54400
|
+
this.playSeekOverlayRoot.render(/*#__PURE__*/external_react_["default"].createElement(BlueprintProviders/* default */.A, {
|
|
54401
|
+
container: this.containerEl
|
|
54402
|
+
}, /*#__PURE__*/external_react_["default"].createElement(VideoPlaySeekOverlay, {
|
|
54403
|
+
movePlayback: this.movePlayback,
|
|
54404
|
+
onPlay: handlePlay
|
|
54405
|
+
})));
|
|
54406
|
+
}
|
|
54132
54407
|
removePlayButtonWithSeekButtons() {
|
|
54408
|
+
if (this.playSeekOverlayRoot) {
|
|
54409
|
+
this.playSeekOverlayRoot.unmount();
|
|
54410
|
+
this.playSeekOverlayRoot = undefined;
|
|
54411
|
+
}
|
|
54133
54412
|
if (this.playContainerEl) {
|
|
54134
54413
|
if (this.seekForwardButtonEl) {
|
|
54135
54414
|
this.seekForwardButtonEl.removeEventListener('click', () => this.movePlayback(true, 5));
|
|
@@ -54181,6 +54460,10 @@ class VideoBaseViewer extends media_MediaBaseViewer {
|
|
|
54181
54460
|
if (this.seekBackwardButtonEl) {
|
|
54182
54461
|
this.seekBackwardButtonEl.removeEventListener('click', () => this.movePlayback(false, 5));
|
|
54183
54462
|
}
|
|
54463
|
+
if (this.playSeekOverlayRoot) {
|
|
54464
|
+
this.playSeekOverlayRoot.unmount();
|
|
54465
|
+
this.playSeekOverlayRoot = undefined;
|
|
54466
|
+
}
|
|
54184
54467
|
if (this.bufferingSpinnerRoot) {
|
|
54185
54468
|
this.bufferingSpinnerRoot.unmount();
|
|
54186
54469
|
this.bufferingSpinnerRoot = undefined;
|
|
@@ -54934,8 +55217,6 @@ function VideoControls({
|
|
|
54934
55217
|
var MediaSettingsV2 = __webpack_require__(4027);
|
|
54935
55218
|
// EXTERNAL MODULE: ./src/lib/viewers/controls/media/PlayPauseButton.tsx + 2 modules
|
|
54936
55219
|
var PlayPauseButton = __webpack_require__(5760);
|
|
54937
|
-
// EXTERNAL MODULE: ./src/lib/viewers/controls/media/SkipButton.tsx + 2 modules
|
|
54938
|
-
var SkipButton = __webpack_require__(2659);
|
|
54939
55220
|
// EXTERNAL MODULE: ./src/lib/viewers/controls/media/TimestampControl.tsx + 1 modules
|
|
54940
55221
|
var TimestampControl = __webpack_require__(3904);
|
|
54941
55222
|
// EXTERNAL MODULE: ./src/lib/viewers/media/formatTimecode.ts
|
|
@@ -59080,8 +59361,6 @@ class DocFindBar extends (events_default()) {
|
|
|
59080
59361
|
/* harmony default export */ const doc_DocFindBar = (DocFindBar);
|
|
59081
59362
|
;// external "@box/blueprint-web-assets/icons/Fill"
|
|
59082
59363
|
|
|
59083
|
-
// EXTERNAL MODULE: ./src/lib/TabularDigits.tsx + 1 modules
|
|
59084
|
-
var TabularDigits = __webpack_require__(2459);
|
|
59085
59364
|
;// ./src/lib/viewers/doc/DocFindBarV2.scss
|
|
59086
59365
|
// extracted by mini-css-extract-plugin
|
|
59087
59366
|
|