@atlaskit/spotlight/dist/cjs/utils/use-preload-media/index.js

A spotlight introduces users to points of interest, from focused messages to multi-step tours.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.usePreloadMedia = void 0;
var _react = require("react");
var _browserApis = require("@atlaskit/browser-apis");
var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
// eslint-disable-next-line @repo/internal/react/consistent-types-definitions

/**
 * Preloads media (video/image) files to be cached by the browser.
 * Once loaded, the browser cache will be used when rendering the actual media element.
 *
 * @param src - The media source URL to preload
 * @param options - Configuration options including the MIME type
 */
var usePreloadMedia = exports.usePreloadMedia = function usePreloadMedia(src, options) {
  (0, _react.useEffect)(function () {
    var handler = mimeTypeHandlers[options.mimetype];
    return handler(src);
  }, [src, options.mimetype]);
};
var preloadVideo = function preloadVideo(src) {
  var doc = (0, _browserApis.getDocument)();
  if (!doc) {
    return _noop.default;
  }
  var video = doc.createElement('video');
  video.src = src;
  video.preload = 'auto';
  video.load();
  return function () {
    video.src = '';
    video.load();
  };
};
var preloadImage = function preloadImage(src) {
  var doc = (0, _browserApis.getDocument)();
  if (!doc) {
    return _noop.default;
  }
  var img = new Image();
  img.src = src;
  return function () {
    img.src = '';
  };
};
var mimeTypeHandlers = {
  'video/mp4': preloadVideo,
  'video/webm': preloadVideo,
  'video/ogg': preloadVideo,
  'video/mpeg': preloadVideo,
  'video/x-matroska': preloadVideo,
  'image/jpeg': preloadImage,
  'image/png': preloadImage,
  'image/gif': preloadImage,
  'image/webp': preloadImage,
  'image/svg+xml': preloadImage
};