@ndla/video-search 2.0.4 → 2.0.5

package/es/PreviewVideo.js

@@ -1,4 +1,11 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 /**
  * Copyright (c) 2017-present, NDLA.
@@ -12,7 +19,6 @@ import PropTypes from 'prop-types';
 import BEMHelper from 'react-bem-helper';
 import Button from '@ndla/button';
 import { Cross } from '@ndla/icons/action';
-import { jsx as ___EmotionJSX } from "@emotion/react";
 var classes = new BEMHelper({
   name: 'video-preview',
   prefix: 'c-'
@@ -20,12 +26,15 @@ var classes = new BEMHelper({
 export default function PreviewVideo(_ref) {
   var onVideoPreview = _ref.onVideoPreview,
       children = _ref.children;
-  return ___EmotionJSX("div", classes(), ___EmotionJSX(Button, _extends({}, classes('close'), {
-    stripped: true,
-    onClick: function onClick() {
-      return onVideoPreview(undefined);
-    }
-  }), ___EmotionJSX(Cross, null)), children);
+  return _jsxs("div", _objectSpread(_objectSpread({}, classes()), {}, {
+    children: [_jsx(Button, _objectSpread(_objectSpread({}, classes('close')), {}, {
+      stripped: true,
+      onClick: function onClick() {
+        return onVideoPreview(undefined);
+      },
+      children: _jsx(Cross, {})
+    })), children]
+  }));
 }
 PreviewVideo.propTypes = {
   children: PropTypes.node,

package/es/VideoLoadMoreButton.js

@@ -1,3 +1,11 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 /**
  * Copyright (c) 2017-present, NDLA.
  *
@@ -10,7 +18,6 @@ import PropTypes from 'prop-types';
 import BEMHelper from 'react-bem-helper';
 import Button from '@ndla/button';
 import { BrightcoveShape, YouTubeShape } from './shapes';
-import { jsx as ___EmotionJSX } from "@emotion/react";
 var classes = new BEMHelper({
   name: 'video-search',
   prefix: 'c-'
@@ -27,10 +34,13 @@ var VideoLoadMoreButton = function VideoLoadMoreButton(props) {
     return null;
   }
 
-  return ___EmotionJSX("div", classes('load-videos'), ___EmotionJSX(Button, {
-    disabled: searching,
-    onClick: loadMoreVideos
-  }, searching ? ___EmotionJSX("div", classes('spinner')) : translations.loadMoreVideos));
+  return _jsx("div", _objectSpread(_objectSpread({}, classes('load-videos')), {}, {
+    children: _jsx(Button, {
+      disabled: searching,
+      onClick: loadMoreVideos,
+      children: searching ? _jsx("div", _objectSpread({}, classes('spinner'))) : translations.loadMoreVideos
+    })
+  }));
 };
 
 VideoLoadMoreButton.propTypes = {

package/es/VideoSearch.js

@@ -1,3 +1,6 @@
+import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
@@ -42,7 +45,6 @@ import VideoSearchList from './VideoSearchList';
 import VideoLoadMoreButton from './VideoLoadMoreButton';
 import VideoTabs from './VideoTabs';
 import { getLastPage } from './videoHelpers';
-import { jsx as ___EmotionJSX } from "@emotion/react";
 var classes = new BEMHelper({
   name: 'video-search',
   prefix: 'c-'
@@ -248,7 +250,7 @@ var VideoSearch = /*#__PURE__*/function (_Component) {
 
       var paginationItem = function paginationItem() {
         if (selectedType === 'brightcove') {
-          return ___EmotionJSX(VideoLoadMoreButton, {
+          return _jsx(VideoLoadMoreButton, {
             searching: searching,
             videos: videos,
             loadMoreVideos: _this4.loadMoreVideos,
@@ -257,7 +259,7 @@ var VideoSearch = /*#__PURE__*/function (_Component) {
           });
         }
 
-        return ___EmotionJSX(Pager, {
+        return _jsx(Pager, {
           page: page || 1,
           lastPage: lastPage,
           onClick: _this4.changeQueryPage
@@ -267,28 +269,32 @@ var VideoSearch = /*#__PURE__*/function (_Component) {
       var searchListTabs = enabledSources.map(function (source) {
         return {
           title: source,
-          content: ___EmotionJSX("div", classes('list'), selectedType === source.toLowerCase() && ___EmotionJSX(VideoSearchList, {
-            translations: translations,
-            selectedType: source.toLowerCase(),
-            selectedVideo: selectedVideo,
-            videos: videos,
-            locale: locale,
-            onVideoPreview: _this4.onVideoPreview,
-            searching: searching,
-            onSelectVideo: _this4.onSelectVideo
+          content: _jsx("div", _objectSpread(_objectSpread({}, classes('list')), {}, {
+            children: selectedType === source.toLowerCase() && _jsx(VideoSearchList, {
+              translations: translations,
+              selectedType: source.toLowerCase(),
+              selectedVideo: selectedVideo,
+              videos: videos,
+              locale: locale,
+              onVideoPreview: _this4.onVideoPreview,
+              searching: searching,
+              onSelectVideo: _this4.onSelectVideo
+            })
           }))
         };
       });
-      return ___EmotionJSX("div", classes(), ___EmotionJSX(VideoSearchForm, {
-        onSearchQuerySubmit: this.submitVideoSearchQuery,
-        query: query,
-        searching: searching,
-        translations: translations
-      }), ___EmotionJSX(VideoTabs, {
-        searchTypes: selectedType,
-        tabs: searchListTabs,
-        onSearchTypeChange: this.onSearchTypeChange
-      }), paginationItem());
+      return _jsxs("div", _objectSpread(_objectSpread({}, classes()), {}, {
+        children: [_jsx(VideoSearchForm, {
+          onSearchQuerySubmit: this.submitVideoSearchQuery,
+          query: query,
+          searching: searching,
+          translations: translations
+        }), _jsx(VideoTabs, {
+          searchTypes: selectedType,
+          tabs: searchListTabs,
+          onSearchTypeChange: this.onSearchTypeChange
+        }), paginationItem()]
+      }));
     }
   }]);
 

package/es/VideoSearchForm.js

@@ -1,6 +1,13 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
@@ -33,7 +40,6 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import Button from '@ndla/button';
 import BEMHelper from 'react-bem-helper';
-import { jsx as ___EmotionJSX } from "@emotion/react";
 var classes = new BEMHelper({
   name: 'video-search',
   prefix: 'c-'
@@ -85,16 +91,19 @@ var SearchForm = /*#__PURE__*/function (_Component) {
       var _this$props = this.props,
           searching = _this$props.searching,
           translations = _this$props.translations;
-      return ___EmotionJSX("div", classes('form'), ___EmotionJSX("input", _extends({}, classes('form-query'), {
-        type: "text",
-        onChange: this.handleQueryChange,
-        onKeyPress: this.onKeyPress,
-        value: this.state.query,
-        placeholder: translations.searchPlaceholder
-      })), ___EmotionJSX(Button, _extends({}, classes('form-button'), {
-        onClick: this.handleSubmit,
-        loading: searching
-      }), translations.searchButtonTitle));
+      return _jsxs("div", _objectSpread(_objectSpread({}, classes('form')), {}, {
+        children: [_jsx("input", _objectSpread(_objectSpread({}, classes('form-query')), {}, {
+          type: "text",
+          onChange: this.handleQueryChange,
+          onKeyPress: this.onKeyPress,
+          value: this.state.query,
+          placeholder: translations.searchPlaceholder
+        })), _jsx(Button, _objectSpread(_objectSpread({}, classes('form-button')), {}, {
+          onClick: this.handleSubmit,
+          loading: searching,
+          children: translations.searchButtonTitle
+        }))]
+      }));
     }
   }]);
 

package/es/VideoSearchList.js

@@ -1,3 +1,11 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 /**
  * Copyright (c) 2017-present, NDLA.
  *
@@ -11,7 +19,6 @@ import BEMHelper from 'react-bem-helper';
 import { BrightcoveShape, YouTubeShape } from './shapes';
 import VideoSearchResultBrightcove from './VideoSearchResultBrightcove';
 import VideoSearchResultYouTube from './VideoSearchResultYouTube';
-import { jsx as ___EmotionJSX } from "@emotion/react";
 var classes = new BEMHelper({
   name: 'video-search',
   prefix: 'c-'
@@ -28,42 +35,44 @@ var VideoSearchList = function VideoSearchList(props) {
       searching = props.searching;
 
   if ((!videos || videos.length === 0) && !searching) {
-    return ___EmotionJSX("p", null, translations.noResults);
+    return _jsx("p", {
+      children: translations.noResults
+    });
   }
 
   if (searching && !(videos.length > 0)) {
-    return ___EmotionJSX("div", classes('result-spinner'));
+    return _jsx("div", _objectSpread({}, classes('result-spinner')));
   }
 
   var videoresults = function videoresults() {
     if (selectedType === 'youtube') {
       return videos.map(function (video) {
-        return ___EmotionJSX(VideoSearchResultYouTube, {
-          key: video.cacheId,
+        return _jsx(VideoSearchResultYouTube, {
           video: video,
           onVideoPreview: onVideoPreview,
           selectedVideo: selectedVideo,
           onSelectVideo: onSelectVideo,
           translations: translations,
           locale: locale
-        });
+        }, video.cacheId);
       });
     }
 
     return videos.map(function (video) {
-      return ___EmotionJSX(VideoSearchResultBrightcove, {
-        key: video.id,
+      return _jsx(VideoSearchResultBrightcove, {
         video: video,
         onVideoPreview: onVideoPreview,
         selectedVideo: selectedVideo,
         onSelectVideo: onSelectVideo,
         locale: locale,
         translations: translations
-      });
+      }, video.id);
     });
   };
 
-  return ___EmotionJSX("div", classes('list-inner'), videoresults());
+  return _jsx("div", _objectSpread(_objectSpread({}, classes('list-inner')), {}, {
+    children: videoresults()
+  }));
 };
 
 VideoSearchList.propTypes = {

package/es/VideoSearchResultBrightcove.js

@@ -1,4 +1,11 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 /**
  * Copyright (c) 2017-present, NDLA.
@@ -15,7 +22,6 @@ import { PanoramaPhotosphere } from '@ndla/icons/common';
 import BEMHelper from 'react-bem-helper';
 import PreviewVideo from './PreviewVideo';
 import { LicenseShape, BrightcoveShape } from './shapes';
-import { jsx as ___EmotionJSX } from "@emotion/react";
 var classes = new BEMHelper({
   name: 'video-search',
   prefix: 'c-'
@@ -31,35 +37,48 @@ export default function VideoSearchResultBrightcove(_ref) {
   var license = video.custom_fields && video.custom_fields.license ? getLicenseByNBTitle(video.custom_fields.license, locale) : '';
   var thumbnailSource = video.images && video.images.thumbnail ? video.images.thumbnail.src : '';
   var is360video = video.projection === 'equirectangular';
-  return ___EmotionJSX("div", _extends({
-    key: video.id
-  }, classes('list-item', active)), ___EmotionJSX("div", classes('list-item-inner'), ___EmotionJSX("img", {
-    role: "presentation",
-    alt: "presentation",
-    src: thumbnailSource
-  }), ___EmotionJSX("div", classes('information'), ___EmotionJSX("h2", classes('header'), video.name || '', is360video && ___EmotionJSX(PanoramaPhotosphere, null)), ___EmotionJSX("div", classes('copyright-author'), video.custom_fields && video.custom_fields.licenseinfo ? video.custom_fields.licenseinfo : ''), ___EmotionJSX("div", classes('license'), license.rights ? ___EmotionJSX(LicenseByline, {
-    licenseRights: license.rights,
-    locale: locale
-  }) : license), ___EmotionJSX(Button, _extends({}, classes('button'), {
-    outline: true,
-    onClick: function onClick() {
-      return onVideoPreview(video);
-    }
-  }), translations.previewVideo), ___EmotionJSX(Button, _extends({
-    "data-cy": "use-video"
-  }, classes('button'), {
-    onClick: function onClick() {
-      return onSelectVideo(video);
-    }
-  }), translations.addVideo))), selectedVideo && selectedVideo.id === video.id ? ___EmotionJSX(PreviewVideo, {
-    onVideoPreview: onVideoPreview,
-    selectedType: "brightcove"
-  }, ___EmotionJSX("iframe", {
-    className: "c-video-preview__video",
-    title: selectedVideo.name,
-    src: "//players.brightcove.net/".concat(selectedVideo.account_id, "/BkLm8fT_default/index.html?videoId=").concat(selectedVideo.id),
-    allowFullScreen: true
-  })) : '');
+  return _jsxs("div", _objectSpread(_objectSpread({}, classes('list-item', active)), {}, {
+    children: [_jsxs("div", _objectSpread(_objectSpread({}, classes('list-item-inner')), {}, {
+      children: [_jsx("img", {
+        role: "presentation",
+        alt: "presentation",
+        src: thumbnailSource
+      }), _jsxs("div", _objectSpread(_objectSpread({}, classes('information')), {}, {
+        children: [_jsxs("h2", _objectSpread(_objectSpread({}, classes('header')), {}, {
+          children: [video.name || '', is360video && _jsx(PanoramaPhotosphere, {})]
+        })), _jsx("div", _objectSpread(_objectSpread({}, classes('copyright-author')), {}, {
+          children: video.custom_fields && video.custom_fields.licenseinfo ? video.custom_fields.licenseinfo : ''
+        })), _jsx("div", _objectSpread(_objectSpread({}, classes('license')), {}, {
+          children: license.rights ? _jsx(LicenseByline, {
+            licenseRights: license.rights,
+            locale: locale
+          }) : license
+        })), _jsx(Button, _objectSpread(_objectSpread({}, classes('button')), {}, {
+          outline: true,
+          onClick: function onClick() {
+            return onVideoPreview(video);
+          },
+          children: translations.previewVideo
+        })), _jsx(Button, _objectSpread(_objectSpread({
+          "data-cy": "use-video"
+        }, classes('button')), {}, {
+          onClick: function onClick() {
+            return onSelectVideo(video);
+          },
+          children: translations.addVideo
+        }))]
+      }))]
+    })), selectedVideo && selectedVideo.id === video.id ? _jsx(PreviewVideo, {
+      onVideoPreview: onVideoPreview,
+      selectedType: "brightcove",
+      children: _jsx("iframe", {
+        className: "c-video-preview__video",
+        title: selectedVideo.name,
+        src: "//players.brightcove.net/".concat(selectedVideo.account_id, "/BkLm8fT_default/index.html?videoId=").concat(selectedVideo.id),
+        allowFullScreen: true
+      })
+    }) : '']
+  }), video.id);
 }
 VideoSearchResultBrightcove.propTypes = {
   license: LicenseShape,

package/es/VideoSearchResultYouTube.js

@@ -1,4 +1,11 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 /**
  * Copyright (c) 2017-present, NDLA.
@@ -14,7 +21,6 @@ import BEMHelper from 'react-bem-helper';
 import PreviewVideo from './PreviewVideo';
 import { YouTubeShape } from './shapes';
 import { setLocaleDate, setYouTubeDuration } from './videoHelpers';
-import { jsx as ___EmotionJSX } from "@emotion/react";
 var classes = new BEMHelper({
   name: 'video-search',
   prefix: 'c-'
@@ -32,32 +38,51 @@ export default function VideoSearchResultYouTube(_ref) {
   var activeVideo = (selectedVideo === null || selectedVideo === void 0 ? void 0 : (_selectedVideo$pagema = selectedVideo.pagemap) === null || _selectedVideo$pagema === void 0 ? void 0 : (_selectedVideo$pagema2 = _selectedVideo$pagema.videoobject) === null || _selectedVideo$pagema2 === void 0 ? void 0 : (_selectedVideo$pagema3 = _selectedVideo$pagema2[0]) === null || _selectedVideo$pagema3 === void 0 ? void 0 : _selectedVideo$pagema3.videoid) === (videoData === null || videoData === void 0 ? void 0 : videoData.videoid);
 
   if (videoData) {
-    return ___EmotionJSX("div", classes('list-item', activeVideo ? 'active' : ''), ___EmotionJSX("div", classes('list-item-inner'), ___EmotionJSX("img", {
-      role: "presentation",
-      alt: "presentation",
-      src: videoData.thumbnailurl
-    }), ___EmotionJSX("div", classes('information'), ___EmotionJSX("h2", null, videoData.name), ___EmotionJSX("div", null, "".concat(translations.publishedDate, ": ").concat(setLocaleDate(videoData.datepublished, locale))), ___EmotionJSX("div", null, "".concat(translations.duration, ": ").concat(setYouTubeDuration(videoData.duration))), ___EmotionJSX("div", null, "".concat(translations.interactioncount, ": ").concat(videoData.interactioncount)), ___EmotionJSX("div", null, videoData.description), ___EmotionJSX(Button, _extends({}, classes('button'), {
-      outline: true,
-      onClick: function onClick() {
-        return onVideoPreview(video);
-      }
-    }), translations.previewVideo), ___EmotionJSX(Button, _extends({
-      "data-cy": "use-video"
-    }, classes('button'), {
-      onClick: function onClick() {
-        return onSelectVideo(video);
-      }
-    }), translations.addVideo))), activeVideo ? ___EmotionJSX(PreviewVideo, {
-      onVideoPreview: onVideoPreview,
-      selectedType: "youtube"
-    }, ___EmotionJSX("iframe", {
-      className: "c-video-preview__video",
-      title: selectedVideo.title,
-      src: selectedVideo.pagemap.videoobject[0].embedurl,
-      allowFullScreen: true
-    })) : '');
+    return _jsxs("div", _objectSpread(_objectSpread({}, classes('list-item', activeVideo ? 'active' : '')), {}, {
+      children: [_jsxs("div", _objectSpread(_objectSpread({}, classes('list-item-inner')), {}, {
+        children: [_jsx("img", {
+          role: "presentation",
+          alt: "presentation",
+          src: videoData.thumbnailurl
+        }), _jsxs("div", _objectSpread(_objectSpread({}, classes('information')), {}, {
+          children: [_jsx("h2", {
+            children: videoData.name
+          }), _jsx("div", {
+            children: "".concat(translations.publishedDate, ": ").concat(setLocaleDate(videoData.datepublished, locale))
+          }), _jsx("div", {
+            children: "".concat(translations.duration, ": ").concat(setYouTubeDuration(videoData.duration))
+          }), _jsx("div", {
+            children: "".concat(translations.interactioncount, ": ").concat(videoData.interactioncount)
+          }), _jsx("div", {
+            children: videoData.description
+          }), _jsx(Button, _objectSpread(_objectSpread({}, classes('button')), {}, {
+            outline: true,
+            onClick: function onClick() {
+              return onVideoPreview(video);
+            },
+            children: translations.previewVideo
+          })), _jsx(Button, _objectSpread(_objectSpread({
+            "data-cy": "use-video"
+          }, classes('button')), {}, {
+            onClick: function onClick() {
+              return onSelectVideo(video);
+            },
+            children: translations.addVideo
+          }))]
+        }))]
+      })), activeVideo ? _jsx(PreviewVideo, {
+        onVideoPreview: onVideoPreview,
+        selectedType: "youtube",
+        children: _jsx("iframe", {
+          className: "c-video-preview__video",
+          title: selectedVideo.title,
+          src: selectedVideo.pagemap.videoobject[0].embedurl,
+          allowFullScreen: true
+        })
+      }) : '']
+    }));
   } else {
-    return ___EmotionJSX("div", null);
+    return _jsx("div", {});
   }
 }
 VideoSearchResultYouTube.propTypes = {

package/es/VideoTabs.js

@@ -1,3 +1,5 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -30,7 +32,6 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import Tabs from '@ndla/tabs';
-import { jsx as ___EmotionJSX } from "@emotion/react";
 
 var VideoTabs = /*#__PURE__*/function (_Component) {
   _inherits(VideoTabs, _Component);
@@ -62,7 +63,7 @@ var VideoTabs = /*#__PURE__*/function (_Component) {
     key: "render",
     value: function render() {
       var tabs = this.props.tabs;
-      return ___EmotionJSX(Tabs, {
+      return _jsx(Tabs, {
         onSelect: this.handleOnSelect,
         tabs: tabs
       });

package/lib/PreviewVideo.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = PreviewVideo;
 
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -15,11 +17,13 @@ var _button = _interopRequireDefault(require("@ndla/button"));
 
 var _action = require("@ndla/icons/action");
 
-var _react2 = require("@emotion/react");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var classes = new _reactBemHelper["default"]({
   name: 'video-preview',
@@ -29,12 +33,15 @@ var classes = new _reactBemHelper["default"]({
 function PreviewVideo(_ref) {
   var onVideoPreview = _ref.onVideoPreview,
       children = _ref.children;
-  return (0, _react2.jsx)("div", classes(), (0, _react2.jsx)(_button["default"], _extends({}, classes('close'), {
-    stripped: true,
-    onClick: function onClick() {
-      return onVideoPreview(undefined);
-    }
-  }), (0, _react2.jsx)(_action.Cross, null)), children);
+  return (0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes()), {}, {
+    children: [(0, _jsxRuntime.jsx)(_button["default"], _objectSpread(_objectSpread({}, classes('close')), {}, {
+      stripped: true,
+      onClick: function onClick() {
+        return onVideoPreview(undefined);
+      },
+      children: (0, _jsxRuntime.jsx)(_action.Cross, {})
+    })), children]
+  }));
 }
 
 PreviewVideo.propTypes = {

package/lib/VideoLoadMoreButton.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -15,17 +17,14 @@ var _button = _interopRequireDefault(require("@ndla/button"));
 
 var _shapes = require("./shapes");
 
-var _react2 = require("@emotion/react");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-/**
- * Copyright (c) 2017-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 var classes = new _reactBemHelper["default"]({
   name: 'video-search',
   prefix: 'c-'
@@ -42,10 +41,13 @@ var VideoLoadMoreButton = function VideoLoadMoreButton(props) {
     return null;
   }
 
-  return (0, _react2.jsx)("div", classes('load-videos'), (0, _react2.jsx)(_button["default"], {
-    disabled: searching,
-    onClick: loadMoreVideos
-  }, searching ? (0, _react2.jsx)("div", classes('spinner')) : translations.loadMoreVideos));
+  return (0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, classes('load-videos')), {}, {
+    children: (0, _jsxRuntime.jsx)(_button["default"], {
+      disabled: searching,
+      onClick: loadMoreVideos,
+      children: searching ? (0, _jsxRuntime.jsx)("div", _objectSpread({}, classes('spinner'))) : translations.loadMoreVideos
+    })
+  }));
 };
 
 VideoLoadMoreButton.propTypes = {

package/lib/VideoSearch.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -23,8 +25,6 @@ var _VideoTabs = _interopRequireDefault(require("./VideoTabs"));
 
 var _videoHelpers = require("./videoHelpers");
 
-var _react2 = require("@emotion/react");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
@@ -264,7 +264,7 @@ var VideoSearch = /*#__PURE__*/function (_Component) {
 
       var paginationItem = function paginationItem() {
         if (selectedType === 'brightcove') {
-          return (0, _react2.jsx)(_VideoLoadMoreButton["default"], {
+          return (0, _jsxRuntime.jsx)(_VideoLoadMoreButton["default"], {
             searching: searching,
             videos: videos,
             loadMoreVideos: _this4.loadMoreVideos,
@@ -273,7 +273,7 @@ var VideoSearch = /*#__PURE__*/function (_Component) {
           });
         }
 
-        return (0, _react2.jsx)(_pager["default"], {
+        return (0, _jsxRuntime.jsx)(_pager["default"], {
           page: page || 1,
           lastPage: lastPage,
           onClick: _this4.changeQueryPage
@@ -283,28 +283,32 @@ var VideoSearch = /*#__PURE__*/function (_Component) {
       var searchListTabs = enabledSources.map(function (source) {
         return {
           title: source,
-          content: (0, _react2.jsx)("div", classes('list'), selectedType === source.toLowerCase() && (0, _react2.jsx)(_VideoSearchList["default"], {
-            translations: translations,
-            selectedType: source.toLowerCase(),
-            selectedVideo: selectedVideo,
-            videos: videos,
-            locale: locale,
-            onVideoPreview: _this4.onVideoPreview,
-            searching: searching,
-            onSelectVideo: _this4.onSelectVideo
+          content: (0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, classes('list')), {}, {
+            children: selectedType === source.toLowerCase() && (0, _jsxRuntime.jsx)(_VideoSearchList["default"], {
+              translations: translations,
+              selectedType: source.toLowerCase(),
+              selectedVideo: selectedVideo,
+              videos: videos,
+              locale: locale,
+              onVideoPreview: _this4.onVideoPreview,
+              searching: searching,
+              onSelectVideo: _this4.onSelectVideo
+            })
           }))
         };
       });
-      return (0, _react2.jsx)("div", classes(), (0, _react2.jsx)(_VideoSearchForm["default"], {
-        onSearchQuerySubmit: this.submitVideoSearchQuery,
-        query: query,
-        searching: searching,
-        translations: translations
-      }), (0, _react2.jsx)(_VideoTabs["default"], {
-        searchTypes: selectedType,
-        tabs: searchListTabs,
-        onSearchTypeChange: this.onSearchTypeChange
-      }), paginationItem());
+      return (0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes()), {}, {
+        children: [(0, _jsxRuntime.jsx)(_VideoSearchForm["default"], {
+          onSearchQuerySubmit: this.submitVideoSearchQuery,
+          query: query,
+          searching: searching,
+          translations: translations
+        }), (0, _jsxRuntime.jsx)(_VideoTabs["default"], {
+          searchTypes: selectedType,
+          tabs: searchListTabs,
+          onSearchTypeChange: this.onSearchTypeChange
+        }), paginationItem()]
+      }));
     }
   }]);
 

package/lib/VideoSearchForm.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -13,8 +15,6 @@ var _button = _interopRequireDefault(require("@ndla/button"));
 
 var _reactBemHelper = _interopRequireDefault(require("react-bem-helper"));
 
-var _react2 = require("@emotion/react");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
@@ -23,7 +23,11 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
 
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
@@ -96,16 +100,19 @@ var SearchForm = /*#__PURE__*/function (_Component) {
       var _this$props = this.props,
           searching = _this$props.searching,
           translations = _this$props.translations;
-      return (0, _react2.jsx)("div", classes('form'), (0, _react2.jsx)("input", _extends({}, classes('form-query'), {
-        type: "text",
-        onChange: this.handleQueryChange,
-        onKeyPress: this.onKeyPress,
-        value: this.state.query,
-        placeholder: translations.searchPlaceholder
-      })), (0, _react2.jsx)(_button["default"], _extends({}, classes('form-button'), {
-        onClick: this.handleSubmit,
-        loading: searching
-      }), translations.searchButtonTitle));
+      return (0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes('form')), {}, {
+        children: [(0, _jsxRuntime.jsx)("input", _objectSpread(_objectSpread({}, classes('form-query')), {}, {
+          type: "text",
+          onChange: this.handleQueryChange,
+          onKeyPress: this.onKeyPress,
+          value: this.state.query,
+          placeholder: translations.searchPlaceholder
+        })), (0, _jsxRuntime.jsx)(_button["default"], _objectSpread(_objectSpread({}, classes('form-button')), {}, {
+          onClick: this.handleSubmit,
+          loading: searching,
+          children: translations.searchButtonTitle
+        }))]
+      }));
     }
   }]);
 

package/lib/VideoSearchList.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -17,17 +19,14 @@ var _VideoSearchResultBrightcove = _interopRequireDefault(require("./VideoSearch
 
 var _VideoSearchResultYouTube = _interopRequireDefault(require("./VideoSearchResultYouTube"));
 
-var _react2 = require("@emotion/react");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-/**
- * Copyright (c) 2017-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 var classes = new _reactBemHelper["default"]({
   name: 'video-search',
   prefix: 'c-'
@@ -44,42 +43,44 @@ var VideoSearchList = function VideoSearchList(props) {
       searching = props.searching;
 
   if ((!videos || videos.length === 0) && !searching) {
-    return (0, _react2.jsx)("p", null, translations.noResults);
+    return (0, _jsxRuntime.jsx)("p", {
+      children: translations.noResults
+    });
   }
 
   if (searching && !(videos.length > 0)) {
-    return (0, _react2.jsx)("div", classes('result-spinner'));
+    return (0, _jsxRuntime.jsx)("div", _objectSpread({}, classes('result-spinner')));
   }
 
   var videoresults = function videoresults() {
     if (selectedType === 'youtube') {
       return videos.map(function (video) {
-        return (0, _react2.jsx)(_VideoSearchResultYouTube["default"], {
-          key: video.cacheId,
+        return (0, _jsxRuntime.jsx)(_VideoSearchResultYouTube["default"], {
           video: video,
           onVideoPreview: onVideoPreview,
           selectedVideo: selectedVideo,
           onSelectVideo: onSelectVideo,
           translations: translations,
           locale: locale
-        });
+        }, video.cacheId);
       });
     }
 
     return videos.map(function (video) {
-      return (0, _react2.jsx)(_VideoSearchResultBrightcove["default"], {
-        key: video.id,
+      return (0, _jsxRuntime.jsx)(_VideoSearchResultBrightcove["default"], {
         video: video,
         onVideoPreview: onVideoPreview,
         selectedVideo: selectedVideo,
         onSelectVideo: onSelectVideo,
         locale: locale,
         translations: translations
-      });
+      }, video.id);
     });
   };
 
-  return (0, _react2.jsx)("div", classes('list-inner'), videoresults());
+  return (0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, classes('list-inner')), {}, {
+    children: videoresults()
+  }));
 };
 
 VideoSearchList.propTypes = {

package/lib/VideoSearchResultBrightcove.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = VideoSearchResultBrightcove;
 
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -21,11 +23,13 @@ var _PreviewVideo = _interopRequireDefault(require("./PreviewVideo"));
 
 var _shapes = require("./shapes");
 
-var _react2 = require("@emotion/react");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var classes = new _reactBemHelper["default"]({
   name: 'video-search',
@@ -43,35 +47,48 @@ function VideoSearchResultBrightcove(_ref) {
   var license = video.custom_fields && video.custom_fields.license ? (0, _licenses.getLicenseByNBTitle)(video.custom_fields.license, locale) : '';
   var thumbnailSource = video.images && video.images.thumbnail ? video.images.thumbnail.src : '';
   var is360video = video.projection === 'equirectangular';
-  return (0, _react2.jsx)("div", _extends({
-    key: video.id
-  }, classes('list-item', active)), (0, _react2.jsx)("div", classes('list-item-inner'), (0, _react2.jsx)("img", {
-    role: "presentation",
-    alt: "presentation",
-    src: thumbnailSource
-  }), (0, _react2.jsx)("div", classes('information'), (0, _react2.jsx)("h2", classes('header'), video.name || '', is360video && (0, _react2.jsx)(_common.PanoramaPhotosphere, null)), (0, _react2.jsx)("div", classes('copyright-author'), video.custom_fields && video.custom_fields.licenseinfo ? video.custom_fields.licenseinfo : ''), (0, _react2.jsx)("div", classes('license'), license.rights ? (0, _react2.jsx)(_licenses.LicenseByline, {
-    licenseRights: license.rights,
-    locale: locale
-  }) : license), (0, _react2.jsx)(_button["default"], _extends({}, classes('button'), {
-    outline: true,
-    onClick: function onClick() {
-      return onVideoPreview(video);
-    }
-  }), translations.previewVideo), (0, _react2.jsx)(_button["default"], _extends({
-    "data-cy": "use-video"
-  }, classes('button'), {
-    onClick: function onClick() {
-      return onSelectVideo(video);
-    }
-  }), translations.addVideo))), selectedVideo && selectedVideo.id === video.id ? (0, _react2.jsx)(_PreviewVideo["default"], {
-    onVideoPreview: onVideoPreview,
-    selectedType: "brightcove"
-  }, (0, _react2.jsx)("iframe", {
-    className: "c-video-preview__video",
-    title: selectedVideo.name,
-    src: "//players.brightcove.net/".concat(selectedVideo.account_id, "/BkLm8fT_default/index.html?videoId=").concat(selectedVideo.id),
-    allowFullScreen: true
-  })) : '');
+  return (0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes('list-item', active)), {}, {
+    children: [(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes('list-item-inner')), {}, {
+      children: [(0, _jsxRuntime.jsx)("img", {
+        role: "presentation",
+        alt: "presentation",
+        src: thumbnailSource
+      }), (0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes('information')), {}, {
+        children: [(0, _jsxRuntime.jsxs)("h2", _objectSpread(_objectSpread({}, classes('header')), {}, {
+          children: [video.name || '', is360video && (0, _jsxRuntime.jsx)(_common.PanoramaPhotosphere, {})]
+        })), (0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, classes('copyright-author')), {}, {
+          children: video.custom_fields && video.custom_fields.licenseinfo ? video.custom_fields.licenseinfo : ''
+        })), (0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, classes('license')), {}, {
+          children: license.rights ? (0, _jsxRuntime.jsx)(_licenses.LicenseByline, {
+            licenseRights: license.rights,
+            locale: locale
+          }) : license
+        })), (0, _jsxRuntime.jsx)(_button["default"], _objectSpread(_objectSpread({}, classes('button')), {}, {
+          outline: true,
+          onClick: function onClick() {
+            return onVideoPreview(video);
+          },
+          children: translations.previewVideo
+        })), (0, _jsxRuntime.jsx)(_button["default"], _objectSpread(_objectSpread({
+          "data-cy": "use-video"
+        }, classes('button')), {}, {
+          onClick: function onClick() {
+            return onSelectVideo(video);
+          },
+          children: translations.addVideo
+        }))]
+      }))]
+    })), selectedVideo && selectedVideo.id === video.id ? (0, _jsxRuntime.jsx)(_PreviewVideo["default"], {
+      onVideoPreview: onVideoPreview,
+      selectedType: "brightcove",
+      children: (0, _jsxRuntime.jsx)("iframe", {
+        className: "c-video-preview__video",
+        title: selectedVideo.name,
+        src: "//players.brightcove.net/".concat(selectedVideo.account_id, "/BkLm8fT_default/index.html?videoId=").concat(selectedVideo.id),
+        allowFullScreen: true
+      })
+    }) : '']
+  }), video.id);
 }
 
 VideoSearchResultBrightcove.propTypes = {

package/lib/VideoSearchResultYouTube.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = VideoSearchResultYouTube;
 
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -19,11 +21,13 @@ var _shapes = require("./shapes");
 
 var _videoHelpers = require("./videoHelpers");
 
-var _react2 = require("@emotion/react");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var classes = new _reactBemHelper["default"]({
   name: 'video-search',
@@ -43,32 +47,51 @@ function VideoSearchResultYouTube(_ref) {
   var activeVideo = (selectedVideo === null || selectedVideo === void 0 ? void 0 : (_selectedVideo$pagema = selectedVideo.pagemap) === null || _selectedVideo$pagema === void 0 ? void 0 : (_selectedVideo$pagema2 = _selectedVideo$pagema.videoobject) === null || _selectedVideo$pagema2 === void 0 ? void 0 : (_selectedVideo$pagema3 = _selectedVideo$pagema2[0]) === null || _selectedVideo$pagema3 === void 0 ? void 0 : _selectedVideo$pagema3.videoid) === (videoData === null || videoData === void 0 ? void 0 : videoData.videoid);
 
   if (videoData) {
-    return (0, _react2.jsx)("div", classes('list-item', activeVideo ? 'active' : ''), (0, _react2.jsx)("div", classes('list-item-inner'), (0, _react2.jsx)("img", {
-      role: "presentation",
-      alt: "presentation",
-      src: videoData.thumbnailurl
-    }), (0, _react2.jsx)("div", classes('information'), (0, _react2.jsx)("h2", null, videoData.name), (0, _react2.jsx)("div", null, "".concat(translations.publishedDate, ": ").concat((0, _videoHelpers.setLocaleDate)(videoData.datepublished, locale))), (0, _react2.jsx)("div", null, "".concat(translations.duration, ": ").concat((0, _videoHelpers.setYouTubeDuration)(videoData.duration))), (0, _react2.jsx)("div", null, "".concat(translations.interactioncount, ": ").concat(videoData.interactioncount)), (0, _react2.jsx)("div", null, videoData.description), (0, _react2.jsx)(_button["default"], _extends({}, classes('button'), {
-      outline: true,
-      onClick: function onClick() {
-        return onVideoPreview(video);
-      }
-    }), translations.previewVideo), (0, _react2.jsx)(_button["default"], _extends({
-      "data-cy": "use-video"
-    }, classes('button'), {
-      onClick: function onClick() {
-        return onSelectVideo(video);
-      }
-    }), translations.addVideo))), activeVideo ? (0, _react2.jsx)(_PreviewVideo["default"], {
-      onVideoPreview: onVideoPreview,
-      selectedType: "youtube"
-    }, (0, _react2.jsx)("iframe", {
-      className: "c-video-preview__video",
-      title: selectedVideo.title,
-      src: selectedVideo.pagemap.videoobject[0].embedurl,
-      allowFullScreen: true
-    })) : '');
+    return (0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes('list-item', activeVideo ? 'active' : '')), {}, {
+      children: [(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes('list-item-inner')), {}, {
+        children: [(0, _jsxRuntime.jsx)("img", {
+          role: "presentation",
+          alt: "presentation",
+          src: videoData.thumbnailurl
+        }), (0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, classes('information')), {}, {
+          children: [(0, _jsxRuntime.jsx)("h2", {
+            children: videoData.name
+          }), (0, _jsxRuntime.jsx)("div", {
+            children: "".concat(translations.publishedDate, ": ").concat((0, _videoHelpers.setLocaleDate)(videoData.datepublished, locale))
+          }), (0, _jsxRuntime.jsx)("div", {
+            children: "".concat(translations.duration, ": ").concat((0, _videoHelpers.setYouTubeDuration)(videoData.duration))
+          }), (0, _jsxRuntime.jsx)("div", {
+            children: "".concat(translations.interactioncount, ": ").concat(videoData.interactioncount)
+          }), (0, _jsxRuntime.jsx)("div", {
+            children: videoData.description
+          }), (0, _jsxRuntime.jsx)(_button["default"], _objectSpread(_objectSpread({}, classes('button')), {}, {
+            outline: true,
+            onClick: function onClick() {
+              return onVideoPreview(video);
+            },
+            children: translations.previewVideo
+          })), (0, _jsxRuntime.jsx)(_button["default"], _objectSpread(_objectSpread({
+            "data-cy": "use-video"
+          }, classes('button')), {}, {
+            onClick: function onClick() {
+              return onSelectVideo(video);
+            },
+            children: translations.addVideo
+          }))]
+        }))]
+      })), activeVideo ? (0, _jsxRuntime.jsx)(_PreviewVideo["default"], {
+        onVideoPreview: onVideoPreview,
+        selectedType: "youtube",
+        children: (0, _jsxRuntime.jsx)("iframe", {
+          className: "c-video-preview__video",
+          title: selectedVideo.title,
+          src: selectedVideo.pagemap.videoobject[0].embedurl,
+          allowFullScreen: true
+        })
+      }) : '']
+    }));
   } else {
-    return (0, _react2.jsx)("div", null);
+    return (0, _jsxRuntime.jsx)("div", {});
   }
 }
 

package/lib/VideoTabs.js

@@ -5,14 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _tabs = _interopRequireDefault(require("@ndla/tabs"));
 
-var _react2 = require("@emotion/react");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
@@ -71,7 +71,7 @@ var VideoTabs = /*#__PURE__*/function (_Component) {
     key: "render",
     value: function render() {
       var tabs = this.props.tabs;
-      return (0, _react2.jsx)(_tabs["default"], {
+      return (0, _jsxRuntime.jsx)(_tabs["default"], {
         onSelect: this.handleOnSelect,
         tabs: tabs
       });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/video-search",
-  "version": "2.0.4",
+  "version": "2.0.5",
   "description": "A simple library for searching NDLA videos",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -20,19 +20,20 @@
     "es"
   ],
   "peerDependencies": {
+    "@emotion/react": "^11.10.4",
     "react": "^15.6.0 || ^16.0.0 || ^17.0.0",
     "react-bem-helper": "^1.4.1"
   },
   "dependencies": {
-    "@ndla/button": "^4.0.4",
-    "@ndla/icons": "^2.0.4",
-    "@ndla/licenses": "^6.0.4",
-    "@ndla/pager": "^2.0.4",
-    "@ndla/tabs": "^2.0.4",
+    "@ndla/button": "^4.0.5",
+    "@ndla/icons": "^2.0.5",
+    "@ndla/licenses": "^6.0.5",
+    "@ndla/pager": "^2.0.5",
+    "@ndla/tabs": "^2.0.5",
     "react-bem-helper": "^1.4.1"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "153f67893ba72297587e17144b71c92150b6eeeb"
+  "gitHead": "e62f69c71e7b72b1e346508e8ad483afd36eeffd"
 }