Skeleton

1import type { ValidComponent } from "solid-js"
2import { splitProps } from "solid-js"
3 
4import type { PolymorphicProps } from "@kobalte/core/polymorphic"
5import * as SkeletonPrimitive from "@kobalte/core/skeleton"
6 
7import { cn } from "~/lib/utils"
8 
9type SkeletonRootProps<T extends ValidComponent = "div"> =
10  SkeletonPrimitive.SkeletonRootProps<T> & { class?: string | undefined }
11 
12const Skeleton = <T extends ValidComponent = "div">(
13  props: PolymorphicProps<T, SkeletonRootProps<T>>
14) => {
15  const [local, others] = splitProps(props as SkeletonRootProps, ["class"])
16  return (
17    <SkeletonPrimitive.Root
18      class={cn("bg-primary/10 data-[animate='true']:animate-pulse", local.class)}
19      {...others}
20    />
21  )
22}
23 
24export { Skeleton }