@wix/design-system/dist/esm/Skeleton/Skeleton.js

@wix/design-system

import React from 'react';
import { st, classes } from './Skeleton.st.css.js';
import { DATA_HOOKS } from './Skeleton.constants';
/**
 * Skeleton is a “placeholder” component.
 * Used for filling up screen usually for when some async operation is ongoing.
 */
function Skeleton({ dataHook, content = [{ type: 'line', size: 'small' }], alignment = 'start', spacing = 'medium', className, }) {
    return (React.createElement("div", { "data-hook": dataHook, "data-alignment": alignment, "data-spacing": spacing, className: st(classes.root, { alignment, spacing }, className) }, content.map(({ type, size }, key) => (React.createElement("div", { key: key, "data-hook": DATA_HOOKS.line, className: st(classes.line, { alignment, spacing }) },
        React.createElement("div", { "data-hook": DATA_HOOKS.chunk, "data-type": type, "data-size": size, className: st(classes.chunk, { size }) }))))));
}
Skeleton.displayName = 'Skeleton';
export { Skeleton };
//# sourceMappingURL=Skeleton.js.map