@react95/core 5.4.1 → 5.7.0

package/cjs/Video/Video.js

@@ -21,19 +21,25 @@ var _Button = _interopRequireDefault(require("../Button"));
 
 var _Range = _interopRequireDefault(require("../Range"));
 
+var _TitleBar = _interopRequireDefault(require("../TitleBar"));
+
 var _buttons = require("./buttons");
 
 var _ListDivider = _interopRequireDefault(require("../List/ListDivider"));
 
+var _excluded = ["name", "src", "videoProps", "style"];
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+
 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; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 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 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; }
 
@@ -47,7 +53,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
@@ -55,99 +61,9 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-function _templateObject9() {
-  var data = _taggedTemplateLiteral(["\n  &::-webkit-slider-thumb {\n    height: 18px;\n    margin-top: -7px;\n    width: 10px;\n  }\n\n  &[value='0']::-webkit-slider-thumb {\n    margin-left: -2px;\n  }\n"]);
-
-  _templateObject9 = function _templateObject9() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject8() {
-  var data = _taggedTemplateLiteral(["\n  background-color: transparent;\n  box-shadow: none;\n"]);
-
-  _templateObject8 = function _templateObject8() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject7() {
-  var data = _taggedTemplateLiteral(["\n  font-family: 'React95Video-Numbers';\n  text-transform: uppercase;\n"]);
-
-  _templateObject7 = function _templateObject7() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject6() {
-  var data = _taggedTemplateLiteral(["\n  display: flex;\n  padding: 6;\n  margin-bottom: 4;\n\n  box-shadow: in;\n  background-color: canvas;\n  height: 50px;\n\n  color: canvasText;\n"]);
-
-  _templateObject6 = function _templateObject6() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject5() {
-  var data = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  padding: 2 0;\n"]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  var data = _taggedTemplateLiteral(["\n  height: 18px;\n  margin-bottom: 2;\n\n  color: ", ";\n  padding: 0 2;\n\n  display: flex;\n  align-items: center;\n  background: ", ";\n"]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteral(["\n        padding: 4;\n        svg {\n          fill: ", ";\n          border-bottom: 1px solid;\n          border-bottom-color: borderLightest;\n          border-right: 1px solid;\n          border-right-color: borderLightest;\n        }\n      "]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteral(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n\n  svg {\n    fill: ", ";\n  }\n\n  &&,\n  &:active,\n  &:focus {\n    width: 20px;\n    height: 20px;\n    padding: 7;\n\n    ", "\n  }\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  width: 100%;\n  padding: 2;\n\n  display: ", ";\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
-var VideoTag = _styledComponents["default"].video(_templateObject(), function (_ref) {
+var VideoTag = _styledComponents["default"].video(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  padding: 2;\n\n  display: ", ";\n"])), function (_ref) {
   var visible = _ref.visible;
   return visible ? 'block' : 'none';
 });
@@ -160,21 +76,19 @@ var Source = function Source(_ref2) {
   });
 };
 
-var ControlBtn = (0, _styledComponents["default"])(_Button["default"])(_templateObject2(), (0, _system.th)('colors.materialText'), function (_ref3) {
+var ControlBtn = (0, _styledComponents["default"])(_Button["default"])(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n\n  svg {\n    fill: ", ";\n  }\n\n  &&,\n  &:active,\n  &:focus {\n    width: 20px;\n    height: 20px;\n    padding: 7;\n\n    ", "\n  }\n"])), (0, _system.th)('colors.materialText'), function (_ref3) {
   var disabled = _ref3.disabled;
-  return disabled && (0, _styledComponents.css)(_templateObject3(), (0, _system.th)('colors.borderDark'));
+  return disabled && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        padding: 4;\n        svg {\n          fill: ", ";\n          border-bottom: 1px solid;\n          border-bottom-color: borderLightest;\n          border-right: 1px solid;\n          border-right-color: borderLightest;\n        }\n      "])), (0, _system.th)('colors.borderDark'));
 });
 
-var TitleBar = _styledComponents["default"].div(_templateObject4(), (0, _system.th)('colors.materialTextInvert'), (0, _system.th)('colors.headerBackground'));
+var Controls = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  padding: 2 0;\n"])));
 
-var Controls = _styledComponents["default"].div(_templateObject5());
+var CountDownContainer = (0, _styledComponents["default"])(_Frame["default"])(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  padding: 6;\n  margin-bottom: 4;\n\n  box-shadow: in;\n  background-color: canvas;\n  height: 50px;\n\n  color: canvasText;\n"])));
 
-var CountDownContainer = (0, _styledComponents["default"])(_Frame["default"])(_templateObject6());
+var VideoFont = _styledComponents["default"].span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  font-family: 'React95Video-Numbers';\n  text-transform: uppercase;\n"])));
 
-var VideoFont = _styledComponents["default"].span(_templateObject7());
-
-var ResetFrame = (0, _styledComponents["default"])(_Frame["default"])(_templateObject8());
-var VideoRange = (0, _styledComponents["default"])(_Range["default"])(_templateObject9());
+var ResetFrame = (0, _styledComponents["default"])(_Frame["default"])(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  background-color: transparent;\n  box-shadow: none;\n"])));
+var VideoRange = (0, _styledComponents["default"])(_Range["default"])(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  &::-webkit-slider-thumb {\n    height: 18px;\n    margin-top: -7px;\n    width: 10px;\n  }\n\n  &[value='0']::-webkit-slider-thumb {\n    margin-left: -2px;\n  }\n"])));
 
 var PlayOrPause = function PlayOrPause(_ref4) {
   var playing = _ref4.playing;
@@ -211,7 +125,7 @@ var VideoRenderer = function VideoRenderer(_ref5, ref) {
       src = _ref5.src,
       videoProps = _ref5.videoProps,
       style = _ref5.style,
-      props = _objectWithoutProperties(_ref5, ["name", "src", "videoProps", "style"]);
+      props = _objectWithoutProperties(_ref5, _excluded);
 
   var _React$useState = React.useState(false),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -233,11 +147,14 @@ var VideoRenderer = function VideoRenderer(_ref5, ref) {
   var wrapperRef = React.useRef(null);
   var playPauseRef = React.useRef(null);
   var stopRef = React.useRef(null);
+  var fullScreenRef = React.useRef(null);
   var paths = arrayFy(src);
 
   var _paths = _slicedToArray(paths, 1),
       pathname = _paths[0];
 
+  var normalizedName = name || pathname.replace(/^.*[\\/]/, '');
+  var title = "".concat(normalizedName).concat(!loadeddata ? ' (Opening)' : '');
   React.useImperativeHandle(ref, function () {
     return {
       get video() {
@@ -258,6 +175,10 @@ var VideoRenderer = function VideoRenderer(_ref5, ref) {
 
       get stop() {
         return stopRef;
+      },
+
+      get fullScreen() {
+        return fullScreenRef;
       }
 
     };
@@ -288,14 +209,12 @@ var VideoRenderer = function VideoRenderer(_ref5, ref) {
       width: !loadeddata ? 260 : undefined
     }, style),
     ref: wrapperRef
-  }), /*#__PURE__*/React.createElement(TitleBar, null, /*#__PURE__*/React.createElement(_icons.Mplayer113, {
-    variant: "16x16_4",
-    style: {
-      marginRight: 4,
-      width: 16,
-      height: 16
-    }
-  }), name || pathname.replace(/^.*[\\/]/, ''), !loadeddata && ' (Opening)'), /*#__PURE__*/React.createElement(VideoTag, _extends({}, videoProps, {
+  }), /*#__PURE__*/React.createElement(_TitleBar["default"], {
+    icon: /*#__PURE__*/React.createElement(_icons.Mplayer113, {
+      variant: "16x16_4"
+    }),
+    title: title
+  }), /*#__PURE__*/React.createElement(VideoTag, _extends({}, videoProps, {
     visible: loadeddata,
     ref: player
   }), paths.map(function (s) {
@@ -369,7 +288,15 @@ var VideoRenderer = function VideoRenderer(_ref5, ref) {
       setPlaying(false);
     },
     ref: stopRef
-  }, /*#__PURE__*/React.createElement(_buttons.Stop, null)), /*#__PURE__*/React.createElement(VideoRange, {
+  }, /*#__PURE__*/React.createElement(_buttons.Stop, null)), /*#__PURE__*/React.createElement(ControlBtn, {
+    disabled: !loadeddata,
+    onClick: function onClick() {
+      var _player$current7;
+
+      player === null || player === void 0 ? void 0 : (_player$current7 = player.current) === null || _player$current7 === void 0 ? void 0 : _player$current7.requestFullscreen();
+    },
+    ref: fullScreenRef
+  }, /*#__PURE__*/React.createElement(_buttons.Fullscreen, null)), /*#__PURE__*/React.createElement(VideoRange, {
     ref: progressRef,
     min: "0",
     max: "100",

package/cjs/Video/buttons/Fullscreen.js

@@ -0,0 +1,34 @@
+"use strict";
+
+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); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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); }
+
+var Fullscreen = function Fullscreen(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "6",
+    viewBox: "0 0 24 24",
+    height: "6",
+    "aria-label": "fullscreen"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M24 9h-2v-5h-7v-2h9v7zm-9 13v-2h7v-5h2v7h-9zm-15-7h2v5h7v2h-9v-7zm9-13v2h-7v5h-2v-7h9zm11 4h-16v12h16v-12z",
+    style: {
+      width: 1000
+    }
+  }));
+};
+
+var _default = Fullscreen;
+exports["default"] = _default;

package/cjs/Video/buttons/Pause.js

@@ -9,9 +9,9 @@ exports["default"] = void 0;
 
 var React = _interopRequireWildcard(require("react"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 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); }
 

package/cjs/Video/buttons/Play.js

@@ -9,9 +9,9 @@ exports["default"] = void 0;
 
 var React = _interopRequireWildcard(require("react"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 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); }
 

package/cjs/Video/buttons/Stop.js

@@ -9,9 +9,9 @@ exports["default"] = void 0;
 
 var React = _interopRequireWildcard(require("react"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 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); }
 

package/cjs/Video/buttons/index.js

@@ -21,6 +21,12 @@ Object.defineProperty(exports, "Stop", {
     return _Stop["default"];
   }
 });
+Object.defineProperty(exports, "Fullscreen", {
+  enumerable: true,
+  get: function get() {
+    return _Fullscreen["default"];
+  }
+});
 
 var _Play = _interopRequireDefault(require("./Play"));
 
@@ -28,4 +34,6 @@ var _Pause = _interopRequireDefault(require("./Pause"));
 
 var _Stop = _interopRequireDefault(require("./Stop"));
 
+var _Fullscreen = _interopRequireDefault(require("./Fullscreen"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

package/cjs/index.js

@@ -33,6 +33,12 @@ Object.defineProperty(exports, "Alert", {
     return _Alert["default"];
   }
 });
+Object.defineProperty(exports, "Avatar", {
+  enumerable: true,
+  get: function get() {
+    return _Avatar["default"];
+  }
+});
 Object.defineProperty(exports, "Button", {
   enumerable: true,
   get: function get() {
@@ -129,6 +135,12 @@ Object.defineProperty(exports, "Tooltip", {
     return _Tooltip["default"];
   }
 });
+Object.defineProperty(exports, "TitleBar", {
+  enumerable: true,
+  get: function get() {
+    return _TitleBar["default"];
+  }
+});
 Object.defineProperty(exports, "ThemeProvider", {
   enumerable: true,
   get: function get() {
@@ -148,6 +160,8 @@ var _Tabs = require("./Tabs");
 
 var _Alert = _interopRequireDefault(require("./Alert"));
 
+var _Avatar = _interopRequireDefault(require("./Avatar"));
+
 var _Button = _interopRequireDefault(require("./Button"));
 
 var _Checkbox = _interopRequireDefault(require("./Checkbox"));
@@ -180,6 +194,8 @@ var _Tree = _interopRequireDefault(require("./Tree"));
 
 var _Tooltip = _interopRequireDefault(require("./Tooltip"));
 
+var _TitleBar = _interopRequireDefault(require("./TitleBar"));
+
 var _ThemeProvider = _interopRequireDefault(require("./ThemeProvider"));
 
 var _Video = _interopRequireDefault(require("./Video"));

package/esm/Alert/Alert.js

@@ -1,39 +1,13 @@
+var _excluded = ["type", "message", "closeAlert", "hasSound"];
+
+var _templateObject, _templateObject2, _templateObject3;
+
 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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-function _templateObject3() {
-  var data = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n"]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteral(["\n  padding: 7 15 7 7;\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
 import React, { useEffect, forwardRef } from 'react';
@@ -71,16 +45,16 @@ var RenderImage = function RenderImage(_ref) {
   }
 };
 
-var Message = styled.div(_templateObject());
-var IconWrapper = styled.div(_templateObject2());
-var Dialog = styled.div(_templateObject3());
+var Message = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])));
+var IconWrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: 7 15 7 7;\n"])));
+var Dialog = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n"])));
 var Alert = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   var _ref2$type = _ref2.type,
       type = _ref2$type === void 0 ? 'error' : _ref2$type,
       message = _ref2.message,
       closeAlert = _ref2.closeAlert,
       hasSound = _ref2.hasSound,
-      rest = _objectWithoutProperties(_ref2, ["type", "message", "closeAlert", "hasSound"]);
+      rest = _objectWithoutProperties(_ref2, _excluded);
 
   if (hasSound) {
     useEffect(function () {

package/esm/Avatar/Avatar.js

@@ -0,0 +1,43 @@
+var _excluded = ["src", "srcSet", "alt", "circle", "children"];
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+import * as React from 'react';
+import styled, { css } from '@xstyled/styled-components';
+import Frame from '../Frame/Frame';
+var Image = styled.img(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  max-width: 100%;\n"])));
+var StyledAvatar = styled(Frame)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  font-weight: bold;\n  overflow: hidden;\n  margin-right: 1;\n  margin-bottom: 1;\n\n  box-shadow: unset;\n\n  ", "\n\n  ", "\n"])), function (_ref) {
+  var circle = _ref.circle,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 48 : _ref$size;
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    border-radius: ", ";\n\n    width: ", ";\n    height: ", ";\n  "])), circle ? '50%' : 0, size, size);
+}, function (_ref2) {
+  var circle = _ref2.circle;
+  return circle ? css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n          border-style: solid;\n          border-width: 1;\n          border-top-color: borderDark;\n          border-right-color: borderLightest;\n          border-bottom-color: borderLightest;\n          border-left-color: borderDark;\n        "]))) : css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n          box-shadow: in;\n          padding-left: 1;\n        "])));
+});
+var Avatar = /*#__PURE__*/React.forwardRef(function (_ref3, ref) {
+  var src = _ref3.src,
+      srcSet = _ref3.srcSet,
+      alt = _ref3.alt,
+      circle = _ref3.circle,
+      children = _ref3.children,
+      otherProps = _objectWithoutProperties(_ref3, _excluded);
+
+  return /*#__PURE__*/React.createElement(StyledAvatar, _extends({
+    circle: circle,
+    ref: ref
+  }, otherProps), src || srcSet ? /*#__PURE__*/React.createElement(Image, {
+    src: src,
+    srcSet: srcSet,
+    alt: alt
+  }) : children);
+});
+export default Avatar;

package/esm/Avatar/index.js

@@ -0,0 +1,2 @@
+import Avatar from "./Avatar";
+export default Avatar;

package/esm/Button/Button.js

@@ -1,18 +1,10 @@
-function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  background-color: material;\n  padding: 7 20 5;\n  border: none;\n  color: materialText;\n\n  font-size: 12px;\n\n  box-shadow: inset 1px 1px 0px 1px ", ",\n    inset 0 0 0 1px ", ",\n    1px 1px 0 0px ", ";\n\n  &:disabled {\n    color: materialTextDisabled;\n  }\n\n  &:focus {\n    outline: ", "px dotted ", ";\n    outline-offset: -", "px;\n\n    box-shadow: inset 1px 1px 0px 1px ", ",\n      inset -0.5px -0.5px 0px 1px ", ",\n      1px 1px 0 1px ", ";\n  }\n\n  &:active {\n    padding: 8 20 4;\n\n    outline: ", "px dotted ", ";\n    outline-offset: -", "px;\n\n    box-shadow: inset 0 0 0 1px ", ",\n      0 0 0 1px ", ";\n  }\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject;
 
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
 import styled from '@xstyled/styled-components';
 import { th } from '@xstyled/system';
-var Button = styled.button(_templateObject(), th('colors.borderLightest'), th('colors.borderDark'), th('colors.borderDarkest'), th('space.1'), th('colors.materialText'), th('space.5'), th('colors.borderLightest'), th('colors.borderDark'), th('colors.borderDarkest'), th('space.1'), th('colors.borderDarkest'), th('space.5'), th('colors.borderDark'), th('colors.borderDarkest'));
+var Button = styled.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background-color: material;\n  padding: 7 20 5;\n  border: none;\n  color: materialText;\n\n  font-size: 12px;\n\n  box-shadow: inset 1px 1px 0px 1px ", ",\n    inset 0 0 0 1px ", ",\n    1px 1px 0 0px ", ";\n\n  &:disabled {\n    color: materialTextDisabled;\n  }\n\n  &:focus {\n    outline: ", "px dotted ", ";\n    outline-offset: -", "px;\n\n    box-shadow: inset 1px 1px 0px 1px ", ",\n      inset -0.5px -0.5px 0px 1px ", ",\n      1px 1px 0 1px ", ";\n  }\n\n  &:active {\n    padding: 8 20 4;\n\n    outline: ", "px dotted ", ";\n    outline-offset: -", "px;\n\n    box-shadow: inset 0 0 0 1px ", ",\n      0 0 0 1px ", ";\n  }\n"])), th('colors.borderLightest'), th('colors.borderDark'), th('colors.borderDarkest'), th('space.1'), th('colors.materialText'), th('space.5'), th('colors.borderLightest'), th('colors.borderDark'), th('colors.borderDarkest'), th('space.1'), th('colors.borderDarkest'), th('space.5'), th('colors.borderDark'), th('colors.borderDarkest'));
 Button.defaultProps = {
   children: 'Ok'
 };

package/esm/Checkbox/Checkbox.js

@@ -1,59 +1,13 @@
+var _excluded = ["children", "style", "checked", "label", "disabled"];
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
 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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-function _templateObject5() {
-  var data = _taggedTemplateLiteral(["\n      color: borderDark;\n      text-shadow: 0.5px 0.5px ", ";\n    "]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  var data = _taggedTemplateLiteral(["\n  display: inline-block;\n  height: 15px;\n\n  line-height: 1.5;\n\n  position: relative;\n\n  margin: 4 0;\n  padding-left: 20;\n\n  ", "\n"]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n\n  margin: 0;\n\n  position: absolute;\n  top: 0;\n  left: 0;\n\n  opacity: 0;\n\n  &:focus ~ ", ", &:active ~ ", " {\n    border-width: 1;\n    border-style: dotted;\n    padding: 0;\n  }\n\n  &:checked + ", " {\n    background-image: url('", "');\n  }\n\n  &:checked &:disabled + ", " {\n    background-image: url('", "');\n    background-size: 7px 7px, 1.9px 1.9px;\n  }\n\n  &:disabled + ", " {\n    background-color: inputBackgroundDisabled;\n  }\n"]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteral(["\n  padding: 1;\n  user-select: none;\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n\n  content: '';\n  display: inline-block;\n\n  position: absolute;\n  left: 0;\n\n  border-left: 1;\n  border-left-color: borderDark;\n  border-top: 1;\n  border-top-color: borderDark;\n\n  box-shadow: inset -1px -1px 0 0 ", ",\n    inset 1px 1px 0 0 ", ",\n    0.5px 0.5px 0 0.5px ", ";\n\n  background-color: inputBackground;\n\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: 7px 7px;\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
 import React, { forwardRef } from 'react';
@@ -61,15 +15,15 @@ import styled, { css } from '@xstyled/styled-components';
 import { th } from '@xstyled/system';
 import check from './imgs/check.svg';
 import checkDisabled from './imgs/check-disabled.svg';
-var Icon = styled.span(_templateObject(), th('colors.material'), th('colors.borderDarkest'), th('colors.borderLightest'));
-var Text = styled.span(_templateObject2());
+var Icon = styled.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n\n  content: '';\n  display: inline-block;\n\n  position: absolute;\n  left: 0;\n\n  border-left: 1;\n  border-left-color: borderDark;\n  border-top: 1;\n  border-top-color: borderDark;\n\n  box-shadow: inset -1px -1px 0 0 ", ",\n    inset 1px 1px 0 0 ", ",\n    0.5px 0.5px 0 0.5px ", ";\n\n  background-color: inputBackground;\n\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: 7px 7px;\n"])), th('colors.material'), th('colors.borderDarkest'), th('colors.borderLightest'));
+var Text = styled.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: 1;\n  user-select: none;\n"])));
 var Field = styled.input.attrs({
   type: 'checkbox'
-})(_templateObject3(), Text, Text, Icon, check, Icon, checkDisabled, Icon);
+})(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n\n  margin: 0;\n\n  position: absolute;\n  top: 0;\n  left: 0;\n\n  opacity: 0;\n\n  &:focus ~ ", ", &:active ~ ", " {\n    border-width: 1;\n    border-style: dotted;\n    padding: 0;\n  }\n\n  &:checked + ", " {\n    background-image: url('", "');\n  }\n\n  &:checked &:disabled + ", " {\n    background-image: url('", "');\n    background-size: 7px 7px, 1.9px 1.9px;\n  }\n\n  &:disabled + ", " {\n    background-color: inputBackgroundDisabled;\n  }\n"])), Text, Text, Icon, check, Icon, checkDisabled, Icon);
 Field.displayName = 'Field';
-var Label = styled.label(_templateObject4(), function (_ref) {
+var Label = styled.label(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: inline-block;\n  height: 15px;\n\n  line-height: 1.5;\n\n  position: relative;\n\n  margin: 4 0;\n  padding-left: 20;\n\n  ", "\n"])), function (_ref) {
   var disabled = _ref.disabled;
-  return disabled && css(_templateObject5(), th('colors.borderLight'));
+  return disabled && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      color: borderDark;\n      text-shadow: 0.5px 0.5px ", ";\n    "])), th('colors.borderLight'));
 });
 var Checkbox = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   var children = _ref2.children,
@@ -78,7 +32,7 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_ref2, ref) {
       label = _ref2.label,
       _ref2$disabled = _ref2.disabled,
       disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
-      rest = _objectWithoutProperties(_ref2, ["children", "style", "checked", "label", "disabled"]);
+      rest = _objectWithoutProperties(_ref2, _excluded);
 
   return /*#__PURE__*/React.createElement(Label, {
     style: style,