@coreui/react-pro/dist/esm/components/placeholder/CPlaceholder.js

UI Components Library for React.js

import { __rest } from '../../node_modules/tslib/tslib.es6.js';
import React, { forwardRef } from 'react';
import PropTypes from 'prop-types';
import classNames from '../../_virtual/index.js';
import { colorPropType } from '../../props.js';

const BREAKPOINTS = [
    'xxl',
    'xl',
    'lg',
    'md',
    'sm',
    'xs',
];
const CPlaceholder = forwardRef((_a, ref) => {
    var { children, animation, as: Component = 'span', className, color, size } = _a, rest = __rest(_a, ["children", "animation", "as", "className", "color", "size"]);
    const repsonsiveClassNames = [];
    BREAKPOINTS.forEach((bp) => {
        const breakpoint = rest[bp];
        delete rest[bp];
        const infix = bp === 'xs' ? '' : `-${bp}`;
        if (typeof breakpoint === 'number') {
            repsonsiveClassNames.push(`col${infix}-${breakpoint}`);
        }
        if (typeof breakpoint === 'boolean') {
            repsonsiveClassNames.push(`col${infix}`);
        }
    });
    return (React.createElement(Component, Object.assign({ className: classNames(animation ? `placeholder-${animation}` : 'placeholder', {
            [`bg-${color}`]: color,
            [`placeholder-${size}`]: size,
        }, repsonsiveClassNames, className) }, rest, { ref: ref }), children));
});
CPlaceholder.propTypes = {
    animation: PropTypes.oneOf(['glow', 'wave']),
    as: PropTypes.elementType,
    children: PropTypes.node,
    className: PropTypes.string,
    color: colorPropType,
    size: PropTypes.oneOf(['xs', 'sm', 'lg']),
};
CPlaceholder.displayName = 'CPlaceholder';

export { CPlaceholder };
//# sourceMappingURL=CPlaceholder.js.map