@ebay/ui-core-react 3.12.1 → 3.12.3

package/ebay-listbox-button/listbox-button.js

@@ -221,7 +221,7 @@ var ListboxButton = function (_a) {
                 react_1.default.createElement(ebay_icon_1.EbayIcon, { name: "dropdown" }))),
         (expanded || optionsOpened) &&
             react_1.default.createElement("div", { className: "listbox-button__listbox", ref: optionsParentContainerRef, style: { maxHeight: maxHeight } },
-                react_1.default.createElement("div", { className: "listbox-button__options", role: "listbox", tabIndex: 0, ref: optionsContainerRef, onKeyDown: function (e) { return onOptionContainerKeydown(e); }, 
+                react_1.default.createElement("div", { className: "listbox-button__options", role: "listbox", tabIndex: expanded ? 0 : -1, ref: optionsContainerRef, onKeyDown: function (e) { return onOptionContainerKeydown(e); }, 
                     // adding onMouseDown preventDefault b/c on IE the onClick event is not being fired on each
                     // option https://stackoverflow.com/questions/17769005/onclick-and-onblur-ordering-issue
                     onMouseDown: function (e) { return e.preventDefault(); }, onBlur: function () {

package/ebay-video/README.md

@@ -9,6 +9,7 @@ yarn add @ebay/ui-core-react shaka-player
 ```jsx
 import { EbayVideo } from '@ebay/ui-core-react/ebay-video'
 import '@ebay/skin/video'
+import 'shaka-player/dist/controls.css'
 
 <EbayVideo
     width="600"

package/ebay-video/const.d.ts

@@ -4,6 +4,5 @@ export declare const defaultVideoConfig: {
     addBigPlayButton: boolean;
     addSeekBar: boolean;
     controlPanelElements: string[];
-    overflowMenuButtons: string[];
 };
 //# sourceMappingURL=const.d.ts.map

package/ebay-video/const.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../src/ebay-video/const.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,OAAO,CAAA;AACtC,eAAO,MAAM,eAAe,KAAK,CAAA;AACjC,eAAO,MAAM,kBAAkB;;;;;CAa9B,CAAA"}
+{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../src/ebay-video/const.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,kBAAkB,OAAO,CAAA;AACtC,eAAO,MAAM,eAAe,KAAK,CAAA;AACjC,eAAO,MAAM,kBAAkB;;;;CAa9B,CAAA"}

package/ebay-video/const.js

@@ -1,8 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.defaultVideoConfig = exports.ERROR_NO_PLAYER = exports.ERROR_ANOTHER_LOAD = void 0;
-// const MAX_RETRIES = 3
-// const DEFAULT_SPINNER_TIMEOUT = 2000
 exports.ERROR_ANOTHER_LOAD = 7000;
 exports.ERROR_NO_PLAYER = 11;
 exports.defaultVideoConfig = {
@@ -14,8 +12,8 @@ exports.defaultVideoConfig = {
         'spacer',
         'mute',
         'report',
-        'fullscreen',
-        'overflow_menu'
-    ],
-    overflowMenuButtons: ['captions']
+        'captions',
+        // 'quality', // uncomment this to show a gear icon for video quality control
+        'fullscreen'
+    ]
 };

package/ebay-video/controls.d.ts

@@ -1,5 +1,4 @@
 export declare function customControls(onReport?: () => void): {
     Report: any;
-    TextSelection: any;
 };
 //# sourceMappingURL=controls.d.ts.map

package/ebay-video/controls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"controls.d.ts","sourceRoot":"","sources":["../../src/ebay-video/controls.tsx"],"names":[],"mappings":"AAKA,wBAAgB,cAAc,CAAC,QAAQ,aAAW,GAAG;IAAE,MAAM,MAAC;IAAC,aAAa,MAAA;CAAE,CAiC7E"}
+{"version":3,"file":"controls.d.ts","sourceRoot":"","sources":["../../src/ebay-video/controls.tsx"],"names":[],"mappings":"AAKA,wBAAgB,cAAc,CAAC,QAAQ,aAAW,GAAG;IAAE,MAAM,MAAA;CAAE,CAuB9D"}

package/ebay-video/controls.js

@@ -28,7 +28,7 @@ function customControls(onReport) {
         __extends(class_1, _super);
         function class_1(parent, controls, text) {
             var _this = _super.call(this, parent, controls) || this;
-            appendChild(_this.parent, react_1.default.createElement(reportButton_1.ReportButton, { onReport: onReport }, text));
+            appendChild(parent, react_1.default.createElement(reportButton_1.ReportButton, { onReport: onReport }, text));
             return _this;
         }
         return class_1;
@@ -42,18 +42,7 @@ function customControls(onReport) {
         };
         return class_2;
     }());
-    var TextSelection = shaka_player_ui_1.ui.TextSelection;
-    TextSelection.Factory = /** @class */ (function () {
-        function Factory() {
-        }
-        /** @override */
-        // eslint-disable-next-line class-methods-use-this
-        Factory.prototype.create = function (rootElement, controls) {
-            return new shaka_player_ui_1.ui.TextSelection(rootElement, controls);
-        };
-        return Factory;
-    }());
-    return { Report: Report, TextSelection: TextSelection };
+    return { Report: Report };
 }
 exports.customControls = customControls;
 function appendChild(container, reactElement) {

package/ebay-video/video.d.ts

@@ -1,5 +1,4 @@
 import { ComponentProps, FC, SyntheticEvent } from 'react';
-import 'shaka-player/dist/controls.css';
 import { VideoAction, VideoPlayView } from './types';
 export declare type EbayVideoProps = ComponentProps<'video'> & {
     width?: number;
@@ -9,6 +8,7 @@ export declare type EbayVideoProps = ComponentProps<'video'> & {
     volume?: number;
     muted?: boolean;
     volumeSlider?: boolean;
+    hideReportButton?: boolean;
     playView?: VideoPlayView;
     cdnUrl?: string;
     cssUrl?: string;
@@ -16,9 +16,9 @@ export declare type EbayVideoProps = ComponentProps<'video'> & {
     a11yLoadText: string;
     a11yPlayText: string;
     errorText: string;
-    reportText: string;
-    onLoadError?: (err: any) => void;
-    onPlay?: (e: SyntheticEvent, { player: any }: {
+    reportText?: string;
+    onLoadError?: (err: Error) => void;
+    onPlay?: (e: SyntheticEvent, { player: Player }: {
         player: any;
     }) => void;
     onVolumeChange?: (e: SyntheticEvent, { volume: number, muted: boolean }: {

package/ebay-video/video.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"video.d.ts","sourceRoot":"","sources":["../../src/ebay-video/video.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAE,cAAc,EAA+B,MAAM,OAAO,CAAA;AAG9F,OAAO,gCAAgC,CAAA;AAIvC,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAKpD,oBAAY,cAAc,GAAG,cAAc,CAAC,OAAO,CAAC,GAAG;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IACjC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,cAAc,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE;;KAAA,KAAK,IAAI,CAAC;IACtD,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,cAAc,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE;;;KAAA,KAAK,IAAI,CAAC;IACjF,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA2NjC,CAAA;AAgBD,eAAe,SAAS,CAAA"}
+{"version":3,"file":"video.d.ts","sourceRoot":"","sources":["../../src/ebay-video/video.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,EAAE,EAAE,cAAc,EAA+B,MAAM,OAAO,CAAA;AAM9F,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAKpD,oBAAY,cAAc,GAAG,cAAc,CAAC,OAAO,CAAC,GAAG;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,aAAa,CAAC;IAEzB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,cAAc,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE;;KAAA,KAAK,IAAI,CAAC;IACzD,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,cAAc,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE;;;KAAA,KAAK,IAAI,CAAC;IACjF,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAkOjC,CAAA;AAgBD,eAAe,SAAS,CAAA"}

package/ebay-video/video.js

@@ -54,18 +54,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importStar(require("react"));
 var classnames_1 = __importDefault(require("classnames"));
 var shaka_player_ui_1 = __importDefault(require("shaka-player/dist/shaka-player.ui"));
-require("shaka-player/dist/controls.css");
 var component_utils_1 = require("../common/component-utils");
 var index_1 = require("../index");
 var source_1 = __importDefault(require("./source"));
 var const_1 = require("./const");
 var controls_1 = require("./controls");
 var EbayVideo = function (_a) {
-    var width = _a.width, height = _a.height, thumbnail = _a.thumbnail, action = _a.action, muted = _a.muted, _b = _a.playView, playView = _b === void 0 ? 'inline' : _b, a11yLoadText = _a.a11yLoadText, a11yPlayText = _a.a11yPlayText, reportText = _a.reportText, volumeSlider = _a.volumeSlider, _c = _a.volume, volume = _c === void 0 ? 1 : _c, errorText = _a.errorText, _d = _a.onVolumeChange, onVolumeChange = _d === void 0 ? function () {
+    var width = _a.width, height = _a.height, thumbnail = _a.thumbnail, action = _a.action, muted = _a.muted, _b = _a.playView, playView = _b === void 0 ? 'inline' : _b, a11yLoadText = _a.a11yLoadText, a11yPlayText = _a.a11yPlayText, reportText = _a.reportText, volumeSlider = _a.volumeSlider, _c = _a.volume, volume = _c === void 0 ? 1 : _c, hideReportButton = _a.hideReportButton, errorText = _a.errorText, _d = _a.onVolumeChange, onVolumeChange = _d === void 0 ? function () {
     } : _d, _e = _a.onLoadError, onLoadError = _e === void 0 ? function () {
     } : _e, _f = _a.onPlay, onPlay = _f === void 0 ? function () {
     } : _f, _g = _a.onReport, onReport = _g === void 0 ? function () {
-    } : _g, children = _a.children, rest = __rest(_a, ["width", "height", "thumbnail", "action", "muted", "playView", "a11yLoadText", "a11yPlayText", "reportText", "volumeSlider", "volume", "errorText", "onVolumeChange", "onLoadError", "onPlay", "onReport", "children"]);
+    } : _g, children = _a.children, rest = __rest(_a, ["width", "height", "thumbnail", "action", "muted", "playView", "a11yLoadText", "a11yPlayText", "reportText", "volumeSlider", "volume", "hideReportButton", "errorText", "onVolumeChange", "onLoadError", "onPlay", "onReport", "children"]);
     var _h = react_1.useState(), loaded = _h[0], setLoaded = _h[1];
     var _j = react_1.useState(), buffering = _j[0], setBuffering = _j[1];
     var _k = react_1.useState(), playing = _k[0], setPlaying = _k[1];
@@ -137,9 +136,10 @@ var EbayVideo = function (_a) {
             controlPanelElements: [],
             addSeekBar: false
         });
-        var _a = controls_1.customControls(onReport), Report = _a.Report, TextSelection = _a.TextSelection;
-        shaka_player_ui_1.default.ui.Controls.registerElement('report', new Report.Factory(reportText));
-        shaka_player_ui_1.default.ui.Controls.registerElement('captions', new TextSelection.Factory());
+        if (!hideReportButton) {
+            var Report = controls_1.customControls(onReport).Report;
+            shaka_player_ui_1.default.ui.Controls.registerElement('report', new Report.Factory(reportText));
+        }
         loadSource();
         hideSpinner(container);
         // return () => {
@@ -188,14 +188,18 @@ var EbayVideo = function (_a) {
         // This forces the controls to always hide
         videoRef.current.controls = false;
     };
-    return (react_1.default.createElement("div", { style: { width: width + "px", height: height + "px" }, className: classnames_1.default('video-player', { 'video-player--poster': !playing }) },
+    var style = {
+        width: width ? width + "px" : undefined,
+        height: height ? height + "px" : undefined
+    };
+    return (react_1.default.createElement("div", { style: style, className: classnames_1.default('video-player', { 'video-player--poster': !playing }) },
         !playing && loaded && !failed && !buffering &&
             react_1.default.createElement("div", { className: "shaka-play-button-container" },
                 react_1.default.createElement("button", { onClick: handleOnPlayClick, className: "shaka-play-button", style: { opacity: 1, zIndex: 999 }, "aria-label": a11yPlayText },
                     react_1.default.createElement(index_1.EbayIcon, { name: "videoPlay" }))),
         react_1.default.createElement("div", { className: "video-player__container", ref: containerRef },
-            react_1.default.createElement("video", __assign({ ref: videoRef, style: { width: width + "px", height: height + "px" }, poster: thumbnail, muted: muted || false, onPlaying: handlePlaying, onPause: handleOnPause, onVolumeChange: handleVolumeChange }, rest), sources.map(function (source) {
-                react_1.default.createElement("source", __assign({}, source));
+            react_1.default.createElement("video", __assign({ ref: videoRef, style: style, poster: thumbnail, muted: muted || false, onPlaying: handlePlaying, onPause: handleOnPause, onVolumeChange: handleVolumeChange }, rest), sources.map(function (source, i) {
+                react_1.default.createElement("source", __assign({ key: i }, source));
             }))),
         react_1.default.createElement("div", { className: classnames_1.default('video-player__overlay', { 'video-player__overlay--hidden': !failed }) },
             react_1.default.createElement(index_1.EbayIcon, { name: "attention" }),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ebay/ui-core-react",
-  "version": "3.12.1",
+  "version": "3.12.3",
   "description": "Skin components build off React",
   "main": "index.js",
   "types": "index.d.ts",