import * as React from 'react' ; import { createComponent } from '@workday/canvas-kit-react/common' ; import { borderRadius , colors } from '@workday/canvas-kit-react/tokens' ; import { SkeletonShape } from './skeletonShape' ; export interface SkeletonHeaderProps { default backgroundColor ? : string ; default height ? : number | string ; default width ? : number | string ; } export const SkeletonHeader = createComponent ( 'div' ) ( { displayName : 'Skeleton.Header' , Component : ( { backgroundColor = colors . soap200 , height = '28px' , width = '100%' , ... elemProps } , ref , Element ) => ( < SkeletonShape ref = { ref } as = { Element } backgroundColor = { backgroundColor } borderRadius = { borderRadius . s } height = { height } width = { width } { ... elemProps } / > ) , } ) ;