@atlaskit/media-ui 16.5.0 → 17.2.0

package/dist/esm/MediaInlineCard/Frame/styled.js

@@ -0,0 +1,39 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject;
+
+import styled from 'styled-components';
+import { B300, N30A, N40A, text } from '@atlaskit/theme/colors';
+import { borderRadius as akBorderRadius } from '@atlaskit/theme/constants';
+import { themed } from '@atlaskit/theme/components';
+var FONT_COLOR = text; // TODO: Dark mode background color to be added in the future.
+
+var BACKGROUND_COLOR_LIGHT = N30A;
+var selected = "\n  cursor: pointer;\n  box-shadow: 0 0 0 1px ".concat(B300, ";\n  outline: none;\n  user-select: none;\n  border-color: transparent;\n  &, :hover, :focus, :active {\n    text-decoration: none;\n  }\n");
+
+var isSelected = function isSelected(_ref) {
+  var isSelected = _ref.isSelected;
+
+  if (isSelected) {
+    return selected;
+  } else {
+    return 'user-select: text';
+  }
+};
+/*
+  Media Inline cards should have the following layout:
+  -----------------
+  | icon | title |
+  -----------------
+  The aim is to ensure (1) all children are
+  in line with each other, (2) are vertically
+  centered.
+*/
+// NB: `padding` consistent with @mentions.
+// NB: `display: inline` required for `box-decoration-break` to work.
+// NB: `box-decoration-break` required for retaining properties (border-radius) on wrap.
+
+
+export var Wrapper = styled.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  line-height: 16px;\n  padding: 0px 0.3em 2px 0.23em;\n  box-decoration-break: clone;\n  display: inline;\n  border-radius: ", "px;\n  color: ", ";\n  background-color: ", ";\n  ", ";\n  transition: 0.1s all ease-in-out;\n  -moz-user-select: none;\n  cursor: pointer;\n\n  &:hover {\n    background-color: ", ";\n  }\n"])), akBorderRadius(), FONT_COLOR, themed({
+  light: BACKGROUND_COLOR_LIGHT
+}), isSelected, N40A);

package/dist/esm/MediaInlineCard/Icon.js

@@ -0,0 +1,15 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2;
+
+import styled from 'styled-components';
+// TODO: Figure out a more scalable/responsive solution
+// for vertical alignment.
+// Current rationale: vertically positioned at the top of
+// the smart card container (when set to 0). Offset this
+// to position it with appropriate whitespace from the top.
+export var Icon = styled.img(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 14px;\n  width: 14px;\n  margin-right: 4px;\n  border-radius: 2px;\n  user-select: none;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n"]))); // Used for 'untrue' icons which claim to be 16x16 but
+// are less than that in height/width.
+// TODO: Replace this override with proper AtlasKit solution.
+
+export var AKIconWrapper = styled.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin-right: -2px;\n"])));

package/dist/esm/MediaInlineCard/IconAndTitleLayout/index.js

@@ -0,0 +1,113 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+import React from 'react';
+import ImageLoader from 'react-render-image';
+import { Icon } from '../Icon';
+import { IconEmptyWrapper, IconPositionWrapper, IconTitleWrapper, IconWrapper, TitleWrapper, EmojiWrapper } from './styled';
+import LinkIcon from '@atlaskit/icon/glyph/link';
+export var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
+  _inherits(IconAndTitleLayout, _React$Component);
+
+  var _super = _createSuper(IconAndTitleLayout);
+
+  function IconAndTitleLayout() {
+    _classCallCheck(this, IconAndTitleLayout);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(IconAndTitleLayout, [{
+    key: "renderAtlaskitIcon",
+    value: function renderAtlaskitIcon() {
+      var _this$props = this.props,
+          icon = _this$props.icon,
+          emoji = _this$props.emoji;
+
+      if (emoji) {
+        return /*#__PURE__*/React.createElement(EmojiWrapper, null, emoji);
+      }
+
+      if (!icon || typeof icon === 'string') {
+        return null;
+      }
+
+      return /*#__PURE__*/React.createElement(IconWrapper, null, icon);
+    }
+  }, {
+    key: "renderImageIcon",
+    value: function renderImageIcon(errored, testId) {
+      var url = this.props.icon;
+
+      if (!url || typeof url !== 'string') {
+        return null;
+      }
+
+      return /*#__PURE__*/React.createElement(ImageLoader, {
+        src: url,
+        loaded: /*#__PURE__*/React.createElement(Icon, {
+          className: "smart-link-icon",
+          src: url,
+          "data-testid": "".concat(testId, "-image")
+        }),
+        errored: errored
+      });
+    }
+  }, {
+    key: "renderIconPlaceholder",
+    value: function renderIconPlaceholder(testId) {
+      var defaultIcon = this.props.defaultIcon;
+
+      if (defaultIcon) {
+        return /*#__PURE__*/React.createElement(IconWrapper, null, defaultIcon);
+      }
+
+      return /*#__PURE__*/React.createElement(IconWrapper, null, /*#__PURE__*/React.createElement(LinkIcon, {
+        label: "link",
+        size: "small",
+        testId: "".concat(testId, "-default")
+      }));
+    }
+  }, {
+    key: "renderIcon",
+    value: function renderIcon(testId) {
+      // We render two kinds of icons here:
+      // - Image: acquired from either DAC or Teamwork Platform Apps;
+      // - Atlaskit Icon: an Atlaskit SVG;
+      // Each of these are scaled down to 12x12.
+      var icon = this.renderAtlaskitIcon();
+
+      if (icon) {
+        return icon;
+      }
+
+      var placeholder = this.renderIconPlaceholder(testId);
+      var image = this.renderImageIcon(placeholder, testId);
+      return image || placeholder;
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+          children = _this$props2.children,
+          title = _this$props2.title,
+          titleColor = _this$props2.titleColor,
+          _this$props2$testId = _this$props2.testId,
+          testId = _this$props2$testId === void 0 ? 'media-inline-card-icon-and-title' : _this$props2$testId;
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconTitleWrapper, {
+        style: {
+          color: titleColor
+        }
+      }, /*#__PURE__*/React.createElement(IconPositionWrapper, null, children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconEmptyWrapper, null), this.renderIcon(testId))), /*#__PURE__*/React.createElement(TitleWrapper, null, title)));
+    }
+  }]);
+
+  return IconAndTitleLayout;
+}(React.Component);

package/dist/esm/MediaInlineCard/IconAndTitleLayout/styled.js

@@ -0,0 +1,33 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+
+import styled from 'styled-components'; // TODO: remove this override behaviour for @atlaskit/icon-object
+
+export var IconObjectOverrides = "\n  & > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    line-height: 14px;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n"; // TODO: remove this override behaviour for @atlaskit/icon
+
+export var IconOverrides = "\n  & > * > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n"; // Wraps all icons represented in Inline Links. Icons have three sources/types:
+// - JSON-LD: from the generator.icon property coming back from ORS.
+// - @atlaskit/icon: for lock icons, unauthorized, etc.
+// - @atlaskit/icon-object: for object icons, e.g. repository, branch, etc.
+// NB: the first set of overrides style icons imported from @atlaskit/icon-object correctly.
+// NB: the second set of overrides style icons imported from @atlaskit/icon correctly.
+
+export var IconWrapper = styled.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  user-select: none;\n  ", "\n  ", "\n"])), IconOverrides, IconObjectOverrides); // Wraps all emoji in Inline Links similar to icon
+
+export var EmojiWrapper = styled.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: inline-block;\n  margin-right: 2px;\n  user-select: none;\n  ", "\n  ", "\n"])), IconOverrides, IconObjectOverrides); // The main 'wrapping' element, title of the content.
+// NB: `white-space` adds little whitespace before wrapping.
+// NB: `hyphens` enables hyphenation on word break.
+
+export var IconTitleWrapper = styled.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  hyphens: auto;\n  white-space: pre-wrap;\n  overflow-wrap: break-word;\n  word-break: break-word;\n"]))); // TODO: Replace overrides with proper AtlasKit solution.
+
+export var LozengeWrapper = styled.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: inline-block;\n  vertical-align: 1px;\n  & > span {\n    margin-left: 4px;\n    padding: 2px 0 2px 0;\n  }\n"]))); // TODO: Replace overrides with proper AtlasKit solution.
+
+export var LozengeBlockWrapper = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  & > span {\n    margin-left: 4px;\n    padding: 2px 0 2px 0;\n  }\n"])));
+export var RightIconPositionWrapper = styled.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  margin-left: 2px;\n  margin-right: 4px;\n  position: relative;\n  display: inline-block;\n"]))); // The following components are used to absolutely position icons in the vertical center.
+// - IconPositionWrapper: the `relative` parent which has no height in itself.
+// - IconEmptyWrapper: the child which forces `IconPositionWrapper` to have a height.
+
+export var IconPositionWrapper = styled.span(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-right: 4px;\n  position: relative;\n  display: inline-block;\n"])));
+export var IconEmptyWrapper = styled.span(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  width: 14px;\n  height: 100%;\n  display: inline-block;\n  opacity: 0;\n"])));
+export var TitleWrapper = styled.span(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  ::selection {\n    background: none;\n  }\n"])));

package/dist/esm/MediaInlineCard/LoadedView/index.js

@@ -0,0 +1,50 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+import React from 'react';
+import { Frame } from '../Frame';
+import { IconAndTitleLayout } from '../IconAndTitleLayout';
+export var MediaInlineCardLoadedView = /*#__PURE__*/function (_React$Component) {
+  _inherits(MediaInlineCardLoadedView, _React$Component);
+
+  var _super = _createSuper(MediaInlineCardLoadedView);
+
+  function MediaInlineCardLoadedView() {
+    _classCallCheck(this, MediaInlineCardLoadedView);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(MediaInlineCardLoadedView, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          _this$props$title = _this$props.title,
+          title = _this$props$title === void 0 ? '' : _this$props$title,
+          isSelected = _this$props.isSelected,
+          onClick = _this$props.onClick,
+          icon = _this$props.icon,
+          _this$props$testId = _this$props.testId,
+          testId = _this$props$testId === void 0 ? 'media-inline-card-loaded-view' : _this$props$testId,
+          titlePrefix = _this$props.titlePrefix;
+      return /*#__PURE__*/React.createElement(Frame, {
+        testId: testId,
+        isSelected: isSelected,
+        onClick: onClick
+      }, /*#__PURE__*/React.createElement(IconAndTitleLayout, {
+        emoji: titlePrefix,
+        icon: icon,
+        title: title
+      }));
+    }
+  }]);
+
+  return MediaInlineCardLoadedView;
+}(React.Component);

package/dist/esm/MediaInlineCard/LoadingView/index.js

@@ -0,0 +1,66 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+import React from 'react';
+import { Frame } from '../Frame';
+import Spinner from '@atlaskit/spinner';
+import { IconAndTitleLayout } from '../IconAndTitleLayout';
+import { SpinnerWrapper } from './styled';
+import { IconTitleWrapper, RightIconPositionWrapper } from '../IconAndTitleLayout/styled';
+export var MediaInlineCardLoadingView = /*#__PURE__*/function (_React$Component) {
+  _inherits(MediaInlineCardLoadingView, _React$Component);
+
+  var _super = _createSuper(MediaInlineCardLoadingView);
+
+  function MediaInlineCardLoadingView() {
+    _classCallCheck(this, MediaInlineCardLoadingView);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(MediaInlineCardLoadingView, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          message = _this$props.message,
+          onClick = _this$props.onClick,
+          isSelected = _this$props.isSelected,
+          inlinePreloaderStyle = _this$props.inlinePreloaderStyle,
+          _this$props$testId = _this$props.testId,
+          testId = _this$props$testId === void 0 ? 'media-inline-card-loading-view' : _this$props$testId;
+
+      if (inlinePreloaderStyle === 'on-right-without-skeleton') {
+        return /*#__PURE__*/React.createElement(Frame, {
+          testId: testId,
+          onClick: onClick,
+          isSelected: isSelected
+        }, /*#__PURE__*/React.createElement(IconTitleWrapper, null, message, /*#__PURE__*/React.createElement(RightIconPositionWrapper, null, /*#__PURE__*/React.createElement(SpinnerWrapper, {
+          className: "inline-loading-spinner"
+        }, /*#__PURE__*/React.createElement(Spinner, {
+          size: 14
+        })))));
+      } else {
+        return /*#__PURE__*/React.createElement(Frame, {
+          testId: testId,
+          onClick: onClick,
+          isSelected: isSelected
+        }, /*#__PURE__*/React.createElement(IconAndTitleLayout, {
+          title: message
+        }, /*#__PURE__*/React.createElement(SpinnerWrapper, {
+          className: "inline-loading-spinner"
+        }, /*#__PURE__*/React.createElement(Spinner, {
+          size: 14
+        }))));
+      }
+    }
+  }]);
+
+  return MediaInlineCardLoadingView;
+}(React.Component);

package/dist/esm/MediaInlineCard/LoadingView/styled.js

@@ -0,0 +1,7 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject;
+
+import styled from 'styled-components';
+import { IconTitleWrapper } from '../IconAndTitleLayout/styled';
+export var SpinnerWrapper = styled(IconTitleWrapper)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  vertical-align: baseline;\n  margin-left: 2px;\n"])));

package/dist/esm/MediaInlineCard/index.js

@@ -0,0 +1,3 @@
+export { MediaInlineCardLoadingView } from './LoadingView';
+export { MediaInlineCardLoadedView } from './LoadedView';
+export { MediaInlineCardErroredView } from './ErroredView';

package/dist/esm/MediaInlineCard/styled.js

@@ -0,0 +1,11 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject;
+
+import styled from 'styled-components';
+import { N200 } from '@atlaskit/theme/colors';
+import { themed } from '@atlaskit/theme/components'; // TODO: Dark mode colors to be added in the future.
+
+export var NoLinkAppearance = styled.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: ", ";\n"])), themed({
+  light: N200
+}));

package/dist/esm/classNames.js

@@ -2,6 +2,11 @@ export var hideControlsClassName = 'mvng-hide-controls';
 export { contentFooterClassName } from './BlockCard/components/ContentFooter';
 export { metadataListClassName } from './BlockCard/components/MetadataList';
 export { blockCardResolvingViewClassName } from './BlockCard/views/ResolvingView';
-export { blockCardResolvedViewClassName } from './BlockCard/views/ResolvedView';
-export { blockCardForbiddenViewClassName } from './BlockCard/views/ForbiddenView';
-export { blockCardIconImageClassName } from './BlockCard/components/Icon';
+export { blockCardResolvedViewClassName, blockCardResolvedViewByClassName } from './BlockCard/views/ResolvedView';
+export { blockCardForbiddenViewClassName, blockCardForbiddenViewLinkClassName } from './BlockCard/views/ForbiddenView';
+export { blockCardIconImageClassName } from './BlockCard/components/Icon';
+export { blockCardContentClassName } from './BlockCard/components/Content';
+export { blockCardContentHeaderClassName } from './BlockCard/components/ContentHeader';
+export { blockCardContentHeaderNameClassName } from './BlockCard/components/Name';
+export { blockCardNotFoundViewClassName } from './BlockCard/views/NotFoundView';
+export { blockCardErroredViewClassName } from './BlockCard/views/ErroredView';

package/dist/esm/codeViewer.js

@@ -107,6 +107,7 @@ export function getLanguageType(name) {
       return 'haxe';
 
     case 'js':
+    case 'jsx':
       return 'javascript';
 
     case 'jl':
@@ -166,9 +167,11 @@ export function getLanguageType(name) {
     case 'msg':
     case 'log':
     case 'csv':
+    case 'md':
       return 'text';
 
     case 'ts':
+    case 'tsx':
       return 'typescript';
 
     case 'v':
@@ -180,6 +183,11 @@ export function getLanguageType(name) {
     case 'xqy':
       return 'xquery';
 
+    case 'lock':
+    case 'yaml':
+    case 'yml':
+      return 'yaml';
+
     default:
       return null;
   }

package/dist/esm/customMediaPlayer/analytics/events/screen/customMediaPlayer.js

@@ -0,0 +1,23 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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; }
+
+import { createPlaybackAttributes } from '../../utils/playbackAttributes';
+export var createCustomMediaPlayerScreenEvent = function createCustomMediaPlayerScreenEvent(type, playbackState, fileId) {
+  return {
+    eventType: 'screen',
+    actionSubject: 'customMediaPlayerScreen',
+    actionSubjectId: fileId,
+    name: 'customMediaPlayerScreen',
+    attributes: _objectSpread({
+      type: type,
+      playbackAttributes: createPlaybackAttributes(playbackState)
+    }, fileId && {
+      fileAttributes: {
+        fileId: fileId
+      }
+    })
+  };
+};

package/dist/esm/customMediaPlayer/analytics/events/track/playCount.js

@@ -0,0 +1,23 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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; }
+
+import { createPlaybackAttributes } from '../../utils/playbackAttributes';
+export var createFirstPlayedTrackEvent = function createFirstPlayedTrackEvent(type, playbackState, fileId) {
+  return {
+    eventType: 'track',
+    action: 'firstPlayed',
+    actionSubject: 'customMediaPlayer',
+    actionSubjectId: fileId,
+    attributes: _objectSpread({
+      type: type,
+      playbackAttributes: createPlaybackAttributes(playbackState)
+    }, fileId && {
+      fileAttributes: {
+        fileId: fileId
+      }
+    })
+  };
+};

package/dist/esm/customMediaPlayer/analytics/events/track/played.js

@@ -0,0 +1,23 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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; }
+
+import { createPlaybackAttributes } from '../../utils/playbackAttributes';
+export var createPlayedTrackEvent = function createPlayedTrackEvent(type, playbackState, fileId) {
+  return {
+    eventType: 'track',
+    action: 'played',
+    actionSubject: 'customMediaPlayer',
+    actionSubjectId: fileId,
+    attributes: _objectSpread({
+      type: type,
+      playbackAttributes: createPlaybackAttributes(playbackState)
+    }, fileId && {
+      fileAttributes: {
+        fileId: fileId
+      }
+    })
+  };
+};

package/dist/esm/customMediaPlayer/analytics/events/ui/mediaButtonClicked.js

@@ -0,0 +1,23 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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; }
+
+import { createPlaybackAttributes } from '../../utils/playbackAttributes';
+export function createMediaButtonClickedEvent(type, playbackState, buttonType, fileId) {
+  return {
+    eventType: 'ui',
+    action: 'clicked',
+    actionSubject: 'button',
+    actionSubjectId: buttonType,
+    attributes: _objectSpread({
+      type: type,
+      playbackAttributes: createPlaybackAttributes(playbackState)
+    }, fileId && {
+      fileAttributes: {
+        fileId: fileId
+      }
+    })
+  };
+}

package/dist/esm/customMediaPlayer/analytics/events/ui/playPauseBlanketClicked.js

@@ -0,0 +1,22 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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; }
+
+import { createPlaybackAttributes } from '../../utils/playbackAttributes';
+export function createPlayPauseBlanketClickedEvent(type, playbackState, fileId) {
+  return {
+    eventType: 'ui',
+    action: 'clicked',
+    actionSubject: 'playPauseBlanket',
+    attributes: _objectSpread({
+      type: type,
+      playbackAttributes: createPlaybackAttributes(playbackState)
+    }, fileId && {
+      fileAttributes: {
+        fileId: fileId
+      }
+    })
+  };
+}

package/dist/esm/customMediaPlayer/analytics/events/ui/playbackSpeedChanged.js

@@ -0,0 +1,22 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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; }
+
+import { createPlaybackAttributes } from '../../utils/playbackAttributes';
+export function createPlaybackSpeedChangedEvent(type, playbackState, fileId) {
+  return {
+    eventType: 'ui',
+    action: 'changed',
+    actionSubject: 'playbackSpeed',
+    attributes: _objectSpread({
+      type: type,
+      playbackAttributes: createPlaybackAttributes(playbackState)
+    }, fileId && {
+      fileAttributes: {
+        fileId: fileId
+      }
+    })
+  };
+}

package/dist/esm/customMediaPlayer/analytics/events/ui/shortcutPressed.js

@@ -0,0 +1,23 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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; }
+
+import { createPlaybackAttributes } from '../../utils/playbackAttributes';
+export function createMediaShortcutPressedEvent(type, playbackState, shortcutType, fileId) {
+  return {
+    eventType: 'ui',
+    action: 'pressed',
+    actionSubject: 'shortcut',
+    actionSubjectId: shortcutType,
+    attributes: _objectSpread({
+      type: type,
+      playbackAttributes: createPlaybackAttributes(playbackState)
+    }, fileId && {
+      fileAttributes: {
+        fileId: fileId
+      }
+    })
+  };
+}

package/dist/esm/customMediaPlayer/analytics/events/ui/timeRangeNavigated.js

@@ -0,0 +1,23 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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; }
+
+import { createPlaybackAttributes } from '../../utils/playbackAttributes';
+export function createTimeRangeNavigatedEvent(type, playbackState, actionSubjectId, fileId) {
+  return {
+    eventType: 'ui',
+    action: 'navigated',
+    actionSubject: 'timeRange',
+    actionSubjectId: actionSubjectId,
+    attributes: _objectSpread({
+      type: type,
+      playbackAttributes: createPlaybackAttributes(playbackState)
+    }, fileId && {
+      fileAttributes: {
+        fileId: fileId
+      }
+    })
+  };
+}

package/dist/esm/customMediaPlayer/analytics/index.js

@@ -0,0 +1,9 @@
+export { createCustomMediaPlayerScreenEvent } from './events/screen/customMediaPlayer';
+export { createMediaButtonClickedEvent } from './events/ui/mediaButtonClicked';
+export { createPlaybackSpeedChangedEvent } from './events/ui/playbackSpeedChanged';
+export { createPlayPauseBlanketClickedEvent } from './events/ui/playPauseBlanketClicked';
+export { createMediaShortcutPressedEvent } from './events/ui/shortcutPressed';
+export { createTimeRangeNavigatedEvent } from './events/ui/timeRangeNavigated';
+export { createFirstPlayedTrackEvent } from './events/track/playCount';
+export { createPlayedTrackEvent } from './events/track/played';
+export { createAndFireMediaCustomMediaPlayerEvent, fireAnalyticsEvent, relevantFeatureFlagNames } from './utils/analytics';

package/dist/esm/customMediaPlayer/analytics/utils/analytics.js

@@ -0,0 +1,14 @@
+import { createAndFireEvent } from '@atlaskit/analytics-next';
+import { ANALYTICS_MEDIA_CHANNEL } from '@atlaskit/media-common';
+export var relevantFeatureFlagNames = []; // can be called in a component whose props extend WithAnalyticsEventsProps
+
+export function fireAnalyticsEvent(payload, createAnalyticsEvent) {
+  if (createAnalyticsEvent) {
+    var event = createAnalyticsEvent(payload);
+    event.fire(ANALYTICS_MEDIA_CHANNEL);
+  }
+} // can be used inside withAnalyticsEvents() hook
+
+export var createAndFireMediaCustomMediaPlayerEvent = function createAndFireMediaCustomMediaPlayerEvent(payload) {
+  return createAndFireEvent(ANALYTICS_MEDIA_CHANNEL)(payload);
+};