UNPKG

@wix/design-system

Version:

@wix/design-system

28 lines 1.68 kB
import React from 'react'; import PropTypes from 'prop-types'; import { st, classes } from './SkeletonCircle.st.css.js'; import { DEFAULT_DIAMETER } from './SkeletonCircle.constants'; import { DEFAULT_SKIN } from '../SkeletonGroup/SkeletonGroup.constants'; import Box from '../Box'; import { SkeletonGroupContext } from '../SkeletonGroup'; /** SkeletonCircle */ function SkeletonCircle({ dataHook, className, diameter = DEFAULT_DIAMETER, margin, marginLeft, marginRight, marginTop, marginBottom, }) { return (React.createElement(SkeletonGroupContext.Consumer, null, context => { const skin = context?.skin || DEFAULT_SKIN; return (React.createElement("div", { "data-hook": dataHook, className: className, "data-diameter": diameter, "data-skin": skin }, React.createElement(Box, { width: diameter, height: diameter, margin: margin, marginLeft: marginLeft, marginRight: marginRight, marginTop: marginTop, marginBottom: marginBottom, className: st(classes.root, { skin }) }))); })); } SkeletonCircle.displayName = 'SkeletonCircle'; SkeletonCircle.propTypes = { dataHook: PropTypes.string, className: PropTypes.string, diameter: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), margin: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), marginTop: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), marginRight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), marginBottom: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), marginLeft: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), }; export default SkeletonCircle; //# sourceMappingURL=SkeletonCircle.js.map