'use strict';

var componentsTheming = require('@wise/components-theming');
var clsx = require('clsx');
var React = require('react');
var jsxRuntime = require('react/jsx-runtime');
var size = require('../common/propsValues/size.js');

const Loader = ({
  small = false,
  size: size$1 = size.Size.MEDIUM,
  displayInstantly = false,
  classNames = {},
  ...restProps
}) => {
  const {
    theme
  } = componentsTheming.useTheme();
  const [hasDebounced, setHasDebounced] = React.useState(displayInstantly);
  React.useEffect(() => {
    let cancelled;
    let timeout;
    if (!displayInstantly) {
      timeout = setTimeout(() => {
        if (!cancelled) {
          setHasDebounced(true);
        }
      }, 1000);
    }
    return () => {
      cancelled = true;
      clearTimeout(timeout);
    };
  }, []);
  const style = className => classNames[className] || className;
  const legacySize = small ? size.Size.SMALL : size$1;
  const supportedSize = getSupportedSize(legacySize);
  if (theme === 'forest-green') {
    // eslint-disable-next-line no-console
    console.warn('Loader is forbidden to use with Forest Green theme. Check the https://wise.design/components/screen-loader for more info.');
    return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {});
  }
  return /*#__PURE__*/jsxRuntime.jsx("div", {
    className: clsx.clsx(style('tw-loader'), style(`tw-loader--${supportedSize}`), {
      'tw-loader--visible': hasDebounced
    }),
    "data-testid": restProps['data-testid']
  });
};
const getSupportedSize = size$1 => {
  switch (size$1) {
    case size.Size.SMALL:
    case size.Size.EXTRA_SMALL:
      return size.Size.SMALL;
    case size.Size.EXTRA_LARGE:
    case size.Size.LARGE:
    case size.Size.MEDIUM:
    default:
      return size.Size.MEDIUM;
  }
};

module.exports = Loader;
//# sourceMappingURL=Loader.js.map
