) } `,__src__:"registry/default/example/skeleton-demo.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Skeleton "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/skeleton"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" SkeletonDemo"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"flex items-center space-x-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-12 w-12 rounded-full"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"space-y-2"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-[250px]"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-[200px]"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Skeleton } from "@/components/ui/skeleton" export function SkeletonDemo() { return (

) } `,__src__:"registry/new-york/example/skeleton-demo.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Skeleton "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/skeleton"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" SkeletonDemo"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"flex items-center space-x-4"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-12 w-12 rounded-full"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"space-y-2"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-[250px]"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-[200px]"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),` `,(0,l.jsxs)(e.h2,{id:"\u30A4\u30F3\u30B9\u30C8\u30FC\u30EB",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u30A4\u30F3\u30B9\u30C8\u30FC\u30EB",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u30A4\u30F3\u30B9\u30C8\u30FC\u30EB"]}),` `,(0,l.jsxs)(r,{defaultValue:"cli",children:[(0,l.jsxs)(c,{children:[(0,l.jsx)(F,{value:"cli",children:"CLI"}),(0,l.jsx)(F,{value:"manual",children:"\u624B\u52D5"})]}),(0,l.jsx)(t,{value:"cli",children:(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"bash","data-theme":"default",__rawString__:`npx shadcn-ui@latest add skeleton `,__npmCommand__:`npx shadcn-ui@latest add skeleton `,__yarnCommand__:`npx shadcn-ui@latest add skeleton `,__pnpmCommand__:`pnpm dlx shadcn-ui@latest add skeleton `,__bunCommand__:`bunx --bun shadcn-ui@latest add skeleton `,children:(0,l.jsx)(e.code,{"data-language":"bash","data-theme":"default",children:(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"npx"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" shadcn-ui@latest"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" add"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" skeleton"})]})})})})}),(0,l.jsx)(t,{value:"manual",children:(0,l.jsxs)(d,{children:[(0,l.jsx)(i,{children:"\u6B21\u306E\u30B3\u30FC\u30C9\u3092\u30D7\u30ED\u30B8\u30A7\u30AF\u30C8\u306B\u30B3\u30D4\u30FC\u3057\u3066\u8CBC\u308A\u4ED8\u3051\u307E\u3059\u3002"}),(0,l.jsxs)(p,{name:"skeleton",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { cn } from "@/lib/utils" function Skeleton({ className, ...props }: React.HTMLAttributes) { return (

) } export { Skeleton } `,__src__:"registry/default/ui/skeleton.tsx",__style__:"default",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" cn "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/lib/utils"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Skeleton"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"({"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ..."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"props"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}:"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" React"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"HTMLAttributes"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"HTMLDivElement"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">)"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"animate-pulse rounded-md bg-muted"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:")}"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Skeleton "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { cn } from "@/lib/utils" function Skeleton({ className, ...props }: React.HTMLAttributes) { return (

) } export { Skeleton } `,__src__:"registry/new-york/ui/skeleton.tsx",__style__:"new-york",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" cn "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/lib/utils"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Skeleton"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"({"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ..."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"props"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}:"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" React"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"."}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"HTMLAttributes"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:"HTMLDivElement"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">)"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"={"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"cn"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"("}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"animate-pulse rounded-md bg-primary/10"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:","}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:")}"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {..."}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"props"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Skeleton "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})]})]})})})]}),(0,l.jsx)(i,{children:"\u30A4\u30F3\u30DD\u30FC\u30C8\u30D1\u30B9\u3092\u30D7\u30ED\u30B8\u30A7\u30AF\u30C8\u306E\u30BB\u30C3\u30C8\u30A2\u30C3\u30D7\u306B\u5408\u308F\u305B\u3066\u66F4\u65B0\u3057\u3066\u304F\u3060\u3055\u3044\u3002"})]})})]}),` `,(0,l.jsxs)(e.h2,{id:"\u4F7F\u7528",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u4F7F\u7528",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u4F7F\u7528"]}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Skeleton } from "@/components/ui/skeleton" `,children:(0,l.jsx)(e.code,{"data-language":"tsx","data-theme":"default",children:(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Skeleton "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/skeleton"'})]})})})}),` `,(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:` `,children:(0,l.jsx)(e.code,{"data-language":"tsx","data-theme":"default",children:(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"<"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"w-[100px] h-[20px] rounded-full"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]})})})}),` `,(0,l.jsxs)(e.h2,{id:"\u4F8B",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u4F8B",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u4F8B"]}),` `,(0,l.jsxs)(e.h3,{id:"\u30AB\u30FC\u30C9",children:[(0,l.jsx)(e.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#\u30AB\u30FC\u30C9",children:(0,l.jsx)(e.span,{className:"icon icon-link"})}),"\u30AB\u30FC\u30C9"]}),` `,(0,l.jsxs)(s,{name:"skeleton-card",description:"\u8AAD\u307F\u8FBC\u307F\u72B6\u614B\u3092\u793A\u3059\u30B9\u30AF\u30EA\u30D7\u30C6\u30A3\u30F3\u30B0\u306E\u3042\u308B\u30AB\u30FC\u30C9\u3002",children:[(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Skeleton } from "@/components/ui/skeleton" export function SkeletonCard() { return (

) } `,__src__:"registry/default/example/skeleton-card.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Skeleton "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/skeleton"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" SkeletonCard"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"flex flex-col space-y-3"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-[125px] w-[250px] rounded-xl"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"space-y-2"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-[250px]"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-[200px]"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})}),(0,l.jsx)(e.div,{"data-rehype-pretty-code-fragment":"",children:(0,l.jsx)(e.pre,{"data-language":"tsx","data-theme":"default",__rawString__:`import { Skeleton } from "@/components/ui/skeleton" export function SkeletonCard() { return (

) } `,__src__:"registry/new-york/example/skeleton-card.tsx",children:(0,l.jsxs)(e.code,{"data-language":"tsx","data-theme":"default",children:[(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"import"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:" Skeleton "}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" from"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:' "@/components/ui/skeleton"'})]}),` `,(0,l.jsx)(e.span,{className:"line",children:" "}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"export"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" function"}),(0,l.jsx)(e.span,{style:{color:"#FFF",fontWeight:"bold"},children:" SkeletonCard"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"()"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" {"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" return"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" ("})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"flex flex-col space-y-3"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-[125px] w-[250px] rounded-xl"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"div className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"space-y-2"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:">"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-[250px]"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" <"}),(0,l.jsx)(e.span,{style:{color:"#FFF"},children:"Skeleton className"}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"="}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:'"h-4 w-[200px]"'}),(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" />"})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsxs)(e.span,{className:"line",children:[(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" "})]}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:" )"})}),` `,(0,l.jsx)(e.span,{className:"line",children:(0,l.jsx)(e.span,{style:{color:"#FFF8"},children:"}"})})]})})})]})]})}function T(n={}){let{wrapper:e}=n.components||{};return e?(0,l.jsx)(e,Object.assign({},n,{children:(0,l.jsx)(u,n)})):u(n)}var C=T;function a(n,e){throw new Error("Expected "+(e?"component":"object")+" `"+n+"` to be defined: you likely forgot to import, pass, or provide it.")}return b(L);})(); ;return Component;

スクリプティング

インストール

使用

例

カード