@atlaskit/media-card 75.0.0 → 76.0.0

package/dist/cjs/card/cardImageView/cardOverlay/index.js

@@ -1,183 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CardOverlay = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("@emotion/react");
-var _react2 = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _check = _interopRequireDefault(require("@atlaskit/icon/glyph/check"));
-var _mediaUi = require("@atlaskit/media-ui");
-var _fileIcon = require("../../../utils/fileIcon");
-var _errorIcon = require("../../../utils/errorIcon");
-var _cardActions = _interopRequireDefault(require("../../../utils/cardActions"));
-var _styles = require("./styles");
-var _cardOverlayComponents = require("./cardOverlayComponents");
-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 _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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; } } /**@jsx jsx */ // We dont require things directly from "utils" to avoid circular dependencies
-var resolveTitleText = function resolveTitleText(cardStatus, mediaName, error, selected) {
-  // don't show title if error
-  // also when card is uploading + selected, title is already showing outside of the overlay
-  if (error || !mediaName || cardStatus === 'uploading' && !selected) {
-    return '';
-  }
-  return mediaName;
-};
-var CardOverlay = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(CardOverlay, _Component);
-  var _super = _createSuper(CardOverlay);
-  function CardOverlay(props) {
-    var _this;
-    (0, _classCallCheck2.default)(this, CardOverlay);
-    _this = _super.call(this, props);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMenuToggle", function (attrs) {
-      _this.setState({
-        isMenuExpanded: attrs.isOpen
-      });
-    });
-    _this.state = {
-      isMenuExpanded: false
-    };
-    return _this;
-  }
-  (0, _createClass2.default)(CardOverlay, [{
-    key: "wrapperClassNames",
-    get: function get() {
-      var _this$props = this.props,
-        error = _this$props.error,
-        noHover = _this$props.noHover,
-        selectable = _this$props.selectable,
-        selected = _this$props.selected,
-        mediaType = _this$props.mediaType,
-        persistent = _this$props.persistent;
-      var isMenuExpanded = this.state.isMenuExpanded;
-      return error ? (0, _classnames.default)('overlay', {
-        error: error,
-        active: isMenuExpanded
-      }) : (0, _classnames.default)('overlay', mediaType, {
-        active: isMenuExpanded,
-        selectable: selectable,
-        selected: selected,
-        // Yes, you right. We put "persistent" class when it is NOT persistent. 🤦
-        persistent: !persistent,
-        noHover: noHover
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props2 = this.props,
-        cardStatus = _this$props2.cardStatus,
-        error = _this$props2.error,
-        noHover = _this$props2.noHover,
-        mediaName = _this$props2.mediaName,
-        persistent = _this$props2.persistent,
-        selected = _this$props2.selected,
-        actions = _this$props2.actions;
-      var titleText = resolveTitleText(cardStatus, mediaName, error, selected);
-      var menuTriggerColor = !persistent ? "var(--ds-icon-inverse, white)" : undefined;
-      return (0, _react.jsx)(_cardOverlayComponents.Overlay, {
-        hasError: !!error,
-        noHover: noHover,
-        className: this.wrapperClassNames
-      }, (0, _react.jsx)("div", {
-        css: _styles.topRowStyles,
-        className: 'top-row'
-      }, this.errorLine(), (0, _react.jsx)(_cardOverlayComponents.TitleWrapper, null, titleText ? (0, _react.jsx)(_mediaUi.Ellipsify, {
-        testId: "media-card-file-name",
-        text: titleText,
-        lines: 2
-      }) : null), this.tickBox()), (0, _react.jsx)("div", {
-        css: _styles.bottomRowStyles,
-        className: 'bottom-row'
-      }, (0, _react.jsx)("div", {
-        css: _styles.leftColumnStyles
-      }, this.bottomLeftColumn()), (0, _react.jsx)("div", {
-        css: _styles.rightColumnStyles
-      }, actions ? (0, _react.jsx)(_cardActions.default, {
-        actions: actions,
-        onToggle: this.onMenuToggle,
-        triggerColor: menuTriggerColor
-      }) : null)));
-    }
-  }, {
-    key: "errorLine",
-    value: function errorLine() {
-      var _this$props3 = this.props,
-        error = _this$props3.error,
-        alt = _this$props3.alt;
-      return error && (0, _react.jsx)(_react2.default.Fragment, null, (0, _react.jsx)("div", {
-        css: _styles.errorLineStyles
-      }, (0, _react.jsx)(_errorIcon.ErrorIcon, null), (0, _react.jsx)(_cardOverlayComponents.ErrorMessage, null, error)), alt && (0, _react.jsx)("div", {
-        css: _styles.errorLineStyles
-      }, (0, _react.jsx)(_cardOverlayComponents.AltWrapper, null, alt)));
-    }
-  }, {
-    key: "tickBox",
-    value: function tickBox() {
-      var _this$props4 = this.props,
-        selected = _this$props4.selected,
-        selectable = _this$props4.selectable;
-      var tick = (0, _react.jsx)(_check.default, {
-        label: "tick"
-      });
-      var className = (0, _classnames.default)('tickbox', {
-        selected: selected
-      });
-      return selectable && (0, _react.jsx)("div", {
-        css: _styles.tickBoxStyles,
-        className: className
-      }, tick);
-    }
-  }, {
-    key: "bottomLeftColumn",
-    value: function bottomLeftColumn() {
-      var error = this.props.error;
-      if (!error) {
-        var _this$props5 = this.props,
-          mediaType = _this$props5.mediaType,
-          subtitle = _this$props5.subtitle,
-          icon = _this$props5.icon;
-        var classNames = (0, _classnames.default)('metadata');
-        var fileIcon = mediaType || icon ? (0, _react.jsx)(_fileIcon.FileIcon, {
-          mediaType: mediaType,
-          iconUrl: icon
-        }) : null;
-        var subtitleEl = subtitle ? (0, _react.jsx)("div", {
-          css: _styles.subtitleStyles,
-          className: "file-size"
-        }, subtitle) : null;
-        return (0, _react.jsx)("div", null, (0, _react.jsx)(_cardOverlayComponents.Metadata, {
-          className: classNames
-        }, fileIcon, subtitleEl));
-      }
-    }
-  }, {
-    key: "removeBtnClick",
-    value: function removeBtnClick(handler) {
-      return function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-        handler();
-      };
-    }
-  }]);
-  return CardOverlay;
-}(_react2.Component);
-exports.CardOverlay = CardOverlay;
-(0, _defineProperty2.default)(CardOverlay, "defaultProps", {
-  actions: [],
-  mediaName: ''
-});

package/dist/cjs/card/cardImageView/cardOverlay/styles.js

@@ -1,63 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.topRowStyles = exports.titleWrapperStyles = exports.tickBoxStyles = exports.subtitleStyles = exports.rightColumnStyles = exports.overlayStyles = exports.metadataStyles = exports.leftColumnStyles = exports.errorMessageStyles = exports.errorLineStyles = exports.bottomRowStyles = exports.altWrapperStyles = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = require("@emotion/react");
-var _mediaUi = require("@atlaskit/media-ui");
-var _components = require("@atlaskit/theme/components");
-var colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
-var _styles = require("../../styles");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
-/**
- * Everything about this file change is just wrong.
- * Mostly because we do bad things with classes.
- * This is all wrong and hopefully will be removed from existence with card v3,
- * so please don’t be too sad about all this!
- */
-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; }
-var tickBoxStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n  background-color: ", ";\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  border-radius: 20px;\n  color: ", "; /* CLEANUP - TODO FIL-3884: Align color with new design */\n  display: flex;\n  opacity: 0;\n\n  &.selected {\n    opacity: 1;\n    color: ", ";\n    background-color: ", "; /* CLEANUP - TODO FIL-3884: Align with tickbox icons */\n  }\n\n  /* Enforce dimensions of \"tick\" icon */\n  svg {\n    position: absolute;\n    width: 14px;\n  }\n"])), (0, _mediaUi.size)(14), (0, _styles.transition)(), "var(--ds-surface-overlay, ".concat((0, _styles.rgba)('#ffffff', 0.5), ")"), "var(--ds-icon-subtle, #798599)", "var(--ds-icon-inverse, white)", "var(--ds-icon-selected, #0052cc)");
-exports.tickBoxStyles = tickBoxStyles;
-var getOverlayStyles = function getOverlayStyles(_ref) {
-  var hasError = _ref.hasError,
-    noHover = _ref.noHover;
-  if (hasError || noHover) {
-    return "\n        cursor: default;\n\n        &:hover {\n          background: transparent;\n        }\n      ";
-  }
-};
-var overlayStyles = function overlayStyles(props) {
-  return (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n  ", " display: flex;\n  justify-content: space-between;\n  flex-direction: column;\n  background: transparent;\n  transition: 0.3s background ", ", 0.3s border-color;\n  padding: 16px;\n\n  ", "\n  &:not(.persistent):hover, &.active {\n    .top-row {\n      .title {\n        color: ", ";\n      }\n    }\n  }\n\n  &.noHover:hover {\n    .top-row {\n      .title {\n        color: ", ";\n      }\n    }\n  }\n\n  .file-type-icon {\n    display: block;\n  }\n\n  &:not(.persistent) {\n    &:not(.error, .noHover):hover {\n      background-color: ", ";\n    }\n\n    &.selectable {\n      &.selected {\n        background-color: ", ";\n\n        &:hover {\n          /* CLEANUP - TODO FIL-3884 add new overlay with rgba(colors.N900, 0.16) */\n          background-color: ", ";\n        }\n\n        .title,\n        .bottom-row,\n        .file-size {\n          color: ", ";\n        }\n      }\n    }\n  }\n\n  &.persistent {\n    &:not(.active) {\n      overflow: hidden;\n    }\n\n    .top-row {\n      .title {\n        transition: opacity 0.3s;\n        opacity: 0;\n        color: ", ";\n        visibility: hidden;\n      }\n    }\n\n    .bottom-row {\n      opacity: 0;\n      transition: transform 0.2s, opacity 0.5s;\n      /* This is the height of the overlay footer, needs to be present now since the parent uses flex and 100% doesn't look right anymore */\n      transform: translateY(35px);\n\n      .file-type-icon {\n        display: none;\n      }\n\n      .file-size {\n        color: ", ";\n        display: none;\n      }\n    }\n\n    &:hover,\n    &.active {\n      background-color: ", ";\n\n      .title {\n        opacity: 1;\n        visibility: visible;\n      }\n\n      .file-type-icon,\n      .file-size {\n        display: block;\n      }\n\n      .bottom-row {\n        opacity: 1;\n        transform: translateY(0);\n      }\n    }\n\n    /* Selectable */\n    &.selectable {\n      &:hover {\n        .tickbox {\n          opacity: 1;\n        }\n      }\n\n      &.selected {\n        .tickbox {\n          background-color: ", " !important;\n          color: ", ";\n        }\n      }\n    }\n  }\n\n  &.error {\n    .top-row {\n      overflow: visible;\n    }\n    &:hover,\n    &.active {\n      .top-row {\n        .title {\n          color: ", ";\n        }\n      }\n    }\n  }\n"])), (0, _mediaUi.size)(), (0, _mediaUi.absolute)(), _mediaUi.borderRadius, _styles.easeOutCubic, getOverlayStyles(props), "var(--ds-text-information, ".concat(colors.B400, ")"), "var(--ds-text, ".concat(colors.N800, ")"), "var(--ds-background-neutral-hovered, ".concat((0, _styles.rgba)(colors.N900, 0.06), ")"), "var(--ds-background-selected, ".concat(colors.B200, ")"), "var(--ds-background-selected-hovered, ".concat((0, _styles.rgba)(colors.N900, 0.16), ")"), "var(--ds-text, ".concat(colors.N900, ")"), "var(--ds-text, white)", "var(--ds-text, white)", "var(--ds-interaction-hovered, ".concat((0, _styles.rgba)(colors.N900, 0.5), ")"), "var(--ds-background-selected-bold, ".concat(colors.B200, ")"), "var(--ds-icon-inverse, white)", "var(--ds-text, ".concat(colors.N800, ")"));
-};
-exports.overlayStyles = overlayStyles;
-var errorLineStyles = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  height: 24px;\n  display: flex;\n  align-items: center;\n"])));
-exports.errorLineStyles = errorLineStyles;
-var leftColumnStyles = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  position: relative;\n  box-sizing: border-box;\n  vertical-align: middle;\n"])));
-exports.leftColumnStyles = leftColumnStyles;
-var topRowStyles = (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)([""])));
-exports.topRowStyles = topRowStyles;
-var bottomRowStyles = (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  height: 16px;\n"])));
-exports.bottomRowStyles = bottomRowStyles;
-var rightColumnStyles = (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)([""])));
-exports.rightColumnStyles = rightColumnStyles;
-var errorMessageStyles = (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  ", " display: inline-block;\n  vertical-align: middle;\n  font-weight: bold;\n  color: ", ";\n  font-size: 12px;\n  line-height: 15px;\n  overflow: hidden;\n  max-width: 'calc(100% - 24px)';\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  margin: auto 3px;\n"])), _styles.antialiased, "var(--ds-text-subtlest, ".concat(colors.N70, ")"));
-exports.errorMessageStyles = errorMessageStyles;
-var altWrapperStyles = (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  font-weight: normal;\n"])), errorMessageStyles);
-exports.altWrapperStyles = altWrapperStyles;
-var titleWrapperStyles = function titleWrapperStyles(theme) {
-  return (0, _react.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  box-sizing: border-box;\n  word-wrap: break-word;\n  color: ", ";\n  font-size: 12px;\n  line-height: 18px;\n"])), (0, _components.themed)({
-    light: "var(--ds-text, ".concat(colors.N800, ")"),
-    dark: "var(--ds-text, ".concat(colors.DN900, ")")
-  })({
-    theme: theme
-  }));
-};
-exports.titleWrapperStyles = titleWrapperStyles;
-var subtitleStyles = (0, _react.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  ", " font-size: 12px;\n  color: ", ";\n"])), (0, _mediaUi.ellipsis)('100px'), "var(--ds-text-subtlest, #5e6c84)");
-exports.subtitleStyles = subtitleStyles;
-var metadataStyles = (0, _react.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n"])));
-exports.metadataStyles = metadataStyles;

package/dist/cjs/card/cardImageView/cardViewWrapper.js

@@ -1,32 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Wrapper = void 0;
-var _react = require("@emotion/react");
-var _styles = require("../styles/styles");
-/**@jsx jsx */
-
-var Wrapper = function Wrapper(props) {
-  var testId = props.testId,
-    shouldUsePointerCursor = props.shouldUsePointerCursor,
-    breakpointSize = props.breakpointSize,
-    dimensions = props.dimensions,
-    onClick = props.onClick,
-    onMouseEnter = props.onMouseEnter,
-    innerRef = props.innerRef;
-  return (0, _react.jsx)("div", {
-    id: "cardViewWrapper",
-    "data-testid": testId,
-    css: (0, _styles.wrapperStyles)({
-      shouldUsePointerCursor: shouldUsePointerCursor,
-      breakpointSize: breakpointSize,
-      dimensions: dimensions
-    }),
-    onClick: onClick,
-    onMouseEnter: onMouseEnter,
-    ref: innerRef
-  }, props.children);
-};
-exports.Wrapper = Wrapper;

package/dist/cjs/card/cardImageView/fileCardImageView.js

@@ -1,310 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FileCardImageView = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("@emotion/react");
-var _react2 = _interopRequireWildcard(require("react"));
-var _mediaUi = require("@atlaskit/media-ui");
-var _vidPlay = _interopRequireDefault(require("@atlaskit/icon/glyph/vid-play"));
-var _cardOverlay = require("./cardOverlay");
-var _styles = require("./styles");
-var _cardLoading = require("../../utils/lightCards/cardLoading");
-var _shouldDisplayImageThumbnail = require("../../utils/shouldDisplayImageThumbnail");
-var _progressBar = require("../../utils/progressBar");
-var _cardActions = _interopRequireDefault(require("../../utils/cardActions"));
-var _cardImageViewWrapper = require("./cardImageViewWrapper");
-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 _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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; } } /**@jsx jsx */
-var FileCardImageView = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(FileCardImageView, _Component);
-  var _super = _createSuper(FileCardImageView);
-  function FileCardImageView() {
-    var _this;
-    (0, _classCallCheck2.default)(this, FileCardImageView);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "wasThumbnailDisplayed", false);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderCardContents", function () {
-      var _this$props = _this.props,
-        status = _this$props.status,
-        mediaType = _this$props.mediaType,
-        fileSize = _this$props.fileSize;
-      if (status === 'error') {
-        return _this.renderErrorContents();
-      } else if (status === 'failed-processing') {
-        return _this.renderFailedContents();
-      }
-
-      // If a video has no errors/failed processing, we want to be able to play it
-      // immediately, even if there's no image preview
-      var isZeroSize = fileSize === '' && ['processing', 'loading-preview'].includes(status);
-      if (mediaType !== 'video' && !_this.isFileCardImageReadyForDisplay && !isZeroSize) {
-        return _this.renderLoadingContents();
-      }
-      return _this.renderSuccessCardContents();
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderLoadingContents", function () {
-      return (0, _react.jsx)("div", {
-        className: "wrapper"
-      }, (0, _react.jsx)("div", {
-        className: "img-wrapper"
-      }, (0, _react.jsx)(_cardLoading.CardLoading, null)));
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderErrorContents", function () {
-      var _this$props2 = _this.props,
-        status = _this$props2.status,
-        error = _this$props2.error,
-        alt = _this$props2.alt,
-        mediaName = _this$props2.mediaName,
-        mediaType = _this$props2.mediaType,
-        actions = _this$props2.actions,
-        fileSize = _this$props2.fileSize;
-      return (0, _react.jsx)(_react2.default.Fragment, null, (0, _react.jsx)("div", {
-        className: "wrapper"
-      }), (0, _react.jsx)(_cardOverlay.CardOverlay, {
-        cardStatus: status,
-        error: error,
-        persistent: true,
-        mediaName: mediaName,
-        mediaType: mediaType,
-        alt: alt,
-        subtitle: fileSize,
-        actions: actions
-      }));
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderFailedContents", function () {
-      var _this$props3 = _this.props,
-        status = _this$props3.status,
-        mediaName = _this$props3.mediaName,
-        mediaType = _this$props3.mediaType,
-        actions = _this$props3.actions,
-        fileSize = _this$props3.fileSize;
-      return (0, _react.jsx)(_react2.default.Fragment, null, (0, _react.jsx)("div", {
-        className: "wrapper"
-      }), (0, _react.jsx)(_cardOverlay.CardOverlay, {
-        cardStatus: status,
-        noHover: true,
-        persistent: true,
-        mediaName: mediaName,
-        mediaType: mediaType,
-        subtitle: fileSize,
-        actions: actions
-      }));
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderUploadingCardOverlay", function () {
-      var _this$props4 = _this.props,
-        status = _this$props4.status,
-        mediaName = _this$props4.mediaName,
-        mediaType = _this$props4.mediaType,
-        dataURI = _this$props4.dataURI,
-        selectable = _this$props4.selectable,
-        selected = _this$props4.selected;
-      var isPersistent = mediaType === 'doc' || !dataURI;
-      return (0, _react.jsx)(_cardOverlay.CardOverlay, {
-        cardStatus: status,
-        persistent: isPersistent,
-        mediaName: mediaName,
-        selectable: selectable,
-        selected: selected
-      });
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderPlayButton", function () {
-      var _this$props5 = _this.props,
-        status = _this$props5.status,
-        mediaItemType = _this$props5.mediaItemType,
-        mediaType = _this$props5.mediaType,
-        mimeType = _this$props5.mimeType,
-        selectable = _this$props5.selectable,
-        dataURI = _this$props5.dataURI;
-      if (mediaType !== 'video') {
-        return null;
-      }
-      if (selectable && !(0, _shouldDisplayImageThumbnail.shouldDisplayImageThumbnail)(status, mediaItemType, dataURI, mediaType, mimeType)) {
-        return null;
-      }
-      return (0, _react.jsx)(_cardImageViewWrapper.PlayIconWrapper, null, (0, _react.jsx)("div", {
-        css: _styles.playIconBackgroundStyles
-      }, (0, _react.jsx)(_vidPlay.default, {
-        testId: "media-card-play-button",
-        label: "play",
-        size: "large"
-      })));
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onImageLoad", function () {
-      var _this$props6 = _this.props,
-        onImageLoad = _this$props6.onImageLoad,
-        cardPreview = _this$props6.cardPreview;
-      onImageLoad && onImageLoad(cardPreview);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onImageError", function () {
-      var _this$props7 = _this.props,
-        onImageError = _this$props7.onImageError,
-        cardPreview = _this$props7.cardPreview;
-      onImageError && onImageError(cardPreview);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderMediaImage", function () {
-      var _this$props8 = _this.props,
-        status = _this$props8.status,
-        mediaItemType = _this$props8.mediaItemType,
-        dataURI = _this$props8.dataURI,
-        mediaType = _this$props8.mediaType,
-        mimeType = _this$props8.mimeType,
-        previewOrientation = _this$props8.previewOrientation,
-        onDisplayImage = _this$props8.onDisplayImage,
-        alt = _this$props8.alt;
-      if (!(0, _shouldDisplayImageThumbnail.shouldDisplayImageThumbnail)(status, mediaItemType, dataURI, mediaType, mimeType)) {
-        return null;
-      }
-      if (!_this.wasThumbnailDisplayed && onDisplayImage && mediaType === 'image') {
-        onDisplayImage();
-        _this.wasThumbnailDisplayed = true;
-      }
-      return (0, _react.jsx)(_mediaUi.MediaImage, {
-        dataURI: dataURI,
-        alt: alt,
-        crop: _this.isCropped,
-        stretch: _this.isStretched,
-        previewOrientation: previewOrientation,
-        onImageLoad: _this.onImageLoad,
-        onImageError: _this.onImageError
-      });
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderProgressBar", function () {
-      var _this$props9 = _this.props,
-        mediaName = _this$props9.mediaName,
-        progress = _this$props9.progress,
-        actions = _this$props9.actions,
-        status = _this$props9.status;
-      if (status !== 'uploading') {
-        return null;
-      }
-      return (0, _react.jsx)(_cardImageViewWrapper.ProgressBarWrapper, null, (0, _react.jsx)("div", {
-        css: _styles.overlayStyles
-      }, (0, _react.jsx)("div", {
-        css: _styles.titleStyles
-      }, (0, _react.jsx)(_mediaUi.Ellipsify, {
-        testId: "media-card-file-name",
-        text: mediaName || '',
-        lines: 2
-      })), (0, _react.jsx)("div", {
-        css: _styles.bodyStyles
-      }, (0, _react.jsx)("div", {
-        css: _styles.progressWrapperStyles
-      }, (0, _react.jsx)(_progressBar.ProgressBar, {
-        progress: progress
-      })), (0, _react.jsx)("div", {
-        css: _styles.cardActionsWrapperStyles
-      }, actions ? (0, _react.jsx)(_cardActions.default, {
-        actions: actions,
-        triggerColor: "var(--ds-icon-inverse, white)"
-      }) : null))));
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderSuccessCardContents", function () {
-      var _this$props10 = _this.props,
-        disableOverlay = _this$props10.disableOverlay,
-        selectable = _this$props10.selectable,
-        status = _this$props10.status;
-      var overlay = null;
-      if (!disableOverlay) {
-        if (status === 'uploading') {
-          if (selectable) {
-            overlay = _this.renderUploadingCardOverlay();
-          }
-        } else {
-          overlay = _this.renderSuccessCardOverlay();
-        }
-      }
-      return (0, _react.jsx)("div", {
-        className: "wrapper"
-      }, (0, _react.jsx)("div", {
-        className: "img-wrapper"
-      }, _this.renderMediaImage(), _this.renderProgressBar(), _this.renderPlayButton()), overlay);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderSuccessCardOverlay", function () {
-      var _this$props11 = _this.props,
-        status = _this$props11.status,
-        mediaName = _this$props11.mediaName,
-        mediaType = _this$props11.mediaType,
-        fileSize = _this$props11.fileSize,
-        dataURI = _this$props11.dataURI,
-        selectable = _this$props11.selectable,
-        selected = _this$props11.selected,
-        actions = _this$props11.actions;
-      var isPersistent = mediaType === 'doc' || !dataURI;
-      return (0, _react.jsx)(_cardOverlay.CardOverlay, {
-        cardStatus: status,
-        persistent: isPersistent,
-        mediaName: mediaName,
-        mediaType: mediaType,
-        selectable: selectable,
-        selected: selected,
-        subtitle: fileSize,
-        actions: actions
-      });
-    });
-    return _this;
-  }
-  (0, _createClass2.default)(FileCardImageView, [{
-    key: "render",
-    value: function render() {
-      var _this$props12 = this.props,
-        disableOverlay = _this$props12.disableOverlay,
-        selectable = _this$props12.selectable,
-        selected = _this$props12.selected,
-        mediaType = _this$props12.mediaType,
-        progress = _this$props12.progress,
-        status = _this$props12.status,
-        mediaName = _this$props12.mediaName;
-      return (0, _react.jsx)(_cardImageViewWrapper.CardImageViewWrapper, {
-        mediaName: mediaName,
-        status: status,
-        progress: progress,
-        disableOverlay: disableOverlay,
-        selectable: selectable,
-        selected: selected,
-        mediaType: mediaType
-      }, this.renderCardContents());
-    }
-  }, {
-    key: "isFileCardImageReadyForDisplay",
-    get: function get() {
-      var _this$props13 = this.props,
-        dataURI = _this$props13.dataURI,
-        status = _this$props13.status;
-      return !!dataURI || !['loading', 'processing', 'loading-preview'].includes(status);
-    }
-  }, {
-    key: "isCropped",
-    get: function get() {
-      var resizeMode = this.props.resizeMode;
-      return resizeMode === 'crop';
-    }
-  }, {
-    key: "isStretched",
-    get: function get() {
-      var resizeMode = this.props.resizeMode;
-      return resizeMode === 'stretchy-fit';
-    }
-  }]);
-  return FileCardImageView;
-}(_react2.Component);
-exports.FileCardImageView = FileCardImageView;
-(0, _defineProperty2.default)(FileCardImageView, "defaultProps", {
-  resizeMode: 'crop',
-  disableOverlay: false
-});

package/dist/cjs/card/cardImageView/index.js

@@ -1,12 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "FileCardImageView", {
-  enumerable: true,
-  get: function get() {
-    return _fileCardImageView.FileCardImageView;
-  }
-});
-var _fileCardImageView = require("./fileCardImageView");