( children: ReactNode, style: CSSProperties | undefined )
| 98 | ); // add to a separate layer so it overrides default style macro styles |
| 99 | |
| 100 | export function useSkeletonText( |
| 101 | children: ReactNode, |
| 102 | style: CSSProperties | undefined |
| 103 | ): [ReactNode, CSSProperties | undefined] { |
| 104 | let isSkeleton = useContext(SkeletonContext); |
| 105 | if (isSkeleton) { |
| 106 | children = <SkeletonText>{children}</SkeletonText>; |
| 107 | style = { |
| 108 | ...style, |
| 109 | // This ensures the ellipsis on truncated text is also hidden. |
| 110 | // -webkit-text-fill-color overrides any `color` property that is also set. |
| 111 | WebkitTextFillColor: 'transparent' |
| 112 | }; |
| 113 | } |
| 114 | return [children, style]; |
| 115 | } |
| 116 | |
| 117 | // Rendered inside <Text> to create skeleton line boxes via box-decoration-break. |
| 118 | export function SkeletonText({children}: {children: ReactNode}): ReactNode { |
no outgoing calls
no test coverage detected