@workday/canvas-kit-react/dist/es6/skeleton/lib/parts/SkeletonText.js

The parent module that contains all Workday Canvas Kit React components

import { jsx as _jsx } from "react/jsx-runtime";
import { createComponent } from '@workday/canvas-kit-react/common';
import { createStencil, handleCsProp } from '@workday/canvas-kit-styling';
import { system } from '@workday/canvas-tokens-web';
import { skeletonSurfaceFillStencil } from './SkeletonShape';
export const skeletonTextLineStencil = createStencil({
    extends: skeletonSurfaceFillStencil,
    vars: {
        backgroundColor: '',
    },
    base: { name: "4abpf4", styles: "box-sizing:border-box;height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));margin-block-end:var(--cnvs-sys-padding-sm, var(--cnvs-sys-space-x3, 0.75rem));border-radius:var(--cnvs-sys-shape-xxxl, 2rem);width:100%;display:block;" }
}, "skeleton-text-line-318cd1");
export const skeletonTextStencil = createStencil({
    base: { name: "1aobwo", styles: "box-sizing:border-box;margin-block-end:var(--cnvs-sys-size-xs, var(--cnvs-sys-space-x6, 1.5rem));& [data-part=\"skeleton-text-lines\"]:last-child{width:60%;}" }
}, "skeleton-text-175643");
export const SkeletonText = createComponent('div')({
    displayName: 'Skeleton.Text',
    Component: ({ backgroundColor, lineCount = 2, ...elemProps }, ref, Element) => {
        const lines = new Array(lineCount).fill(null);
        return lineCount > 0 ? (_jsx(Element, { ref: ref, ...handleCsProp(elemProps, skeletonTextStencil()), children: lines.map((_value, index) => (_jsx("div", { "data-part": "skeleton-text-lines", ...handleCsProp({}, skeletonTextLineStencil({ backgroundColor })) }, index))) })) : null;
    },
});