@s-ui/react-atom-skeleton/lib/index.js

Display the loading state of a component while avoiding layout shift

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
var _excluded = ["count", "variant", "animation", "style", "width", "height"];
import cx from 'classnames';
import PropTypes from 'prop-types';
import { ATOM_SKELETON_ANIMATIONS, ATOM_SKELETON_VARIANTS, BASE_CLASS } from './settings.js';
import { createElement as _createElement } from "react";
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
export default function AtomSkeleton(_ref) {
  var _cx;
  var _ref$count = _ref.count,
    count = _ref$count === void 0 ? 1 : _ref$count,
    _ref$variant = _ref.variant,
    variant = _ref$variant === void 0 ? ATOM_SKELETON_VARIANTS.round : _ref$variant,
    _ref$animation = _ref.animation,
    animation = _ref$animation === void 0 ? ATOM_SKELETON_ANIMATIONS.pulse : _ref$animation,
    style = _ref.style,
    width = _ref.width,
    height = _ref.height,
    others = _objectWithoutPropertiesLoose(_ref, _excluded);
  var className = cx("" + BASE_CLASS, (_cx = {}, _cx[BASE_CLASS + "--pulse"] = animation === ATOM_SKELETON_ANIMATIONS.pulse, _cx[BASE_CLASS + "--wave"] = animation === ATOM_SKELETON_ANIMATIONS.wave, _cx[BASE_CLASS + "--round"] = variant === ATOM_SKELETON_VARIANTS.round, _cx[BASE_CLASS + "--circle"] = variant === ATOM_SKELETON_VARIANTS.circle, _cx));
  return /*#__PURE__*/_jsx(_Fragment, {
    children: Array.from(Array(count).keys()).map(function (index) {
      return /*#__PURE__*/_createElement("span", _extends({}, others, {
        key: index,
        className: className,
        style: _extends({}, style, {
          width: width,
          height: height
        })
      }), "\u200C");
    })
  });
}
AtomSkeleton.displayName = 'AtomSkeleton';
export { ATOM_SKELETON_VARIANTS, ATOM_SKELETON_VARIANTS as atomSkeletonVariants, ATOM_SKELETON_ANIMATIONS, ATOM_SKELETON_ANIMATIONS as atomSkeletonAnimations };