fulldev-ui 0.7.0 → 0.9.0

package/public/r/reviews-1.json

@@ -1,21 +1,19 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "reviews-1",
-  "type": "registry:block",
   "registryDependencies": [
     "@fulldev/avatar",
-    "@fulldev/button",
-    "@fulldev/icon",
-    "@fulldev/item",
+    "@fulldev/card",
     "@fulldev/rating",
     "@fulldev/section",
-    "@fulldev/tile"
+    "@fulldev/icon"
   ],
   "files": [
     {
       "path": "src/components/blocks/reviews-1.astro",
-      "content": "---\nimport { Avatar, AvatarImage } from \"@/components/ui/avatar\"\nimport { Button } from \"@/components/ui/button\"\nimport { Icon } from \"@/components/ui/icon\"\nimport {\n  Item,\n  ItemContent,\n  ItemDescription,\n  ItemMedia,\n  ItemTitle,\n} from \"@/components/ui/item\"\nimport { Rating } from \"@/components/ui/rating\"\nimport {\n  Section,\n  SectionActions,\n  SectionContent,\n  SectionMasonry,\n  SectionProse,\n} from \"@/components/ui/section\"\nimport {\n  Tile,\n  TileContent,\n  TileDescription,\n  TileTitle,\n} from \"@/components/ui/tile\"\n\ninterface Props {\n  class?: string\n  id?: string\n  links?: {\n    icon?: string\n    text?: string\n    href?: string\n    target?: string\n  }[]\n  items?: {\n    title?: string\n    description?: string\n    rating?: number\n    image?: {\n      src: string\n      alt: string\n    }\n    item?: {\n      title?: string\n      description?: string\n      image?: {\n        src: string\n        alt: string\n      }\n    }\n  }[]\n}\n\nconst { class: className, id, links, items } = Astro.props\n---\n\n<Section class={className} id={id}>\n  <SectionContent>\n    <SectionProse>\n      <slot />\n    </SectionProse>\n    <SectionActions>\n      {\n        links?.map(({ icon, text, ...link }, i) => (\n          <Button variant={i === 0 ? \"default\" : \"outline\"} {...link}>\n            {icon && <Icon name={icon} />}\n            {text}\n          </Button>\n        ))\n      }\n    </SectionActions>\n  </SectionContent>\n  <SectionMasonry>\n    {\n      items?.map(({ title, description, rating, item }) => (\n        <Tile class=\"shadow-none\" variant=\"floating\">\n          <Item class=\"p-0\">\n            <ItemMedia>\n              <Avatar class=\"size-10\">\n                <AvatarImage {...item?.image} />\n              </Avatar>\n            </ItemMedia>\n            <ItemContent>\n              <ItemTitle>{item?.title}</ItemTitle>\n              <ItemDescription>{item?.description}</ItemDescription>\n            </ItemContent>\n          </Item>\n          <Rating rating={rating} />\n          <TileContent>\n            <TileTitle>{title}</TileTitle>\n            <TileDescription>{description}</TileDescription>\n          </TileContent>\n        </Tile>\n      ))\n    }\n  </SectionMasonry>\n</Section>\n",
+      "content": "---\nimport type { ImageMetadata } from \"astro\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport { Card, CardContent } from \"@/components/ui/card\"\nimport { Icon } from \"@/components/ui/icon\"\nimport { Rating } from \"@/components/ui/rating\"\nimport { Section, SectionContainer } from \"@/components/ui/section\"\n\ntype Props = {\n  class?: string\n  title?: string\n  description?: string\n  reviews: {\n    rating: number\n    quote: string\n    image?: ImageMetadata\n    initials: string\n    name: string\n    role: string\n  }[]\n}\n\nconst { class: className, title, description, reviews } = Astro.props\n---\n\n<Section class={cn(\"\", className)}>\n  {\n    (title || description) && (\n      <SectionContainer class=\"items-center gap-4 text-center\">\n        {title && (\n          <h2 class=\"text-foreground text-3xl font-semibold tracking-tight text-balance sm:text-4xl\">\n            {title}\n          </h2>\n        )}\n        {description && (\n          <p class=\"text-muted-foreground max-w-2xl text-lg leading-relaxed text-balance\">\n            {description}\n          </p>\n        )}\n      </SectionContainer>\n    )\n  }\n  <SectionContainer>\n    <div class=\"grid gap-6 md:grid-cols-3\">\n      {\n        reviews.map((item) => (\n          <Card>\n            <CardContent class=\"flex flex-col gap-4\">\n              <div class=\"flex items-center justify-between\">\n                <Rating value={item.rating} />\n                <Icon name=\"quote\" class=\"text-muted-foreground/20 size-6\" />\n              </div>\n              <p class=\"text-muted-foreground text-sm leading-relaxed\">\n                {item.quote}\n              </p>\n              <div class=\"flex items-center gap-3 pt-2\">\n                <Avatar size=\"lg\">\n                  <AvatarImage src={item.image} alt={item.name} />\n                  <AvatarFallback>{item.initials}</AvatarFallback>\n                </Avatar>\n                <div>\n                  <p class=\"text-foreground text-sm font-medium\">{item.name}</p>\n                  <p class=\"text-muted-foreground text-xs\">{item.role}</p>\n                </div>\n              </div>\n            </CardContent>\n          </Card>\n        ))\n      }\n    </div>\n  </SectionContainer>\n</Section>\n",
       "type": "registry:block"
     }
-  ]
-}
+  ],
+  "type": "registry:block"
+}

package/public/r/reviews-2.json

@@ -1,21 +1,19 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "reviews-2",
-  "type": "registry:block",
   "registryDependencies": [
     "@fulldev/avatar",
-    "@fulldev/button",
-    "@fulldev/icon",
-    "@fulldev/item",
     "@fulldev/rating",
     "@fulldev/section",
-    "@fulldev/tile"
+    "@fulldev/separator",
+    "@fulldev/icon"
   ],
   "files": [
     {
       "path": "src/components/blocks/reviews-2.astro",
-      "content": "---\nimport { Avatar, AvatarImage } from \"@/components/ui/avatar\"\nimport { Button } from \"@/components/ui/button\"\nimport { Icon } from \"@/components/ui/icon\"\nimport {\n  Item,\n  ItemContent,\n  ItemDescription,\n  ItemMedia,\n  ItemTitle,\n} from \"@/components/ui/item\"\nimport { Rating } from \"@/components/ui/rating\"\nimport {\n  Section,\n  SectionActions,\n  SectionContent,\n  SectionGrid,\n  SectionProse,\n  SectionSplit,\n} from \"@/components/ui/section\"\nimport {\n  Tile,\n  TileContent,\n  TileDescription,\n  TileTitle,\n} from \"@/components/ui/tile\"\n\ninterface Props {\n  class?: string\n  id?: string\n  links?: {\n    icon?: string\n    text?: string\n    href?: string\n    target?: string\n  }[]\n  items?: {\n    title?: string\n    description?: string\n    rating?: number\n    image?: {\n      src: string\n      alt: string\n    }\n    item?: {\n      title?: string\n      description?: string\n      image?: {\n        src: string\n        alt: string\n      }\n    }\n  }[]\n}\n\nconst { class: className, id, links, items } = Astro.props\n---\n\n<Section class={className} id={id}>\n  <SectionSplit>\n    <SectionContent>\n      <SectionProse>\n        <slot />\n      </SectionProse>\n      <SectionActions>\n        {\n          links?.map(({ icon, text, ...link }, i) => (\n            <Button variant={i === 0 ? \"default\" : \"outline\"} {...link}>\n              {icon && <Icon name={icon} />}\n              {text}\n            </Button>\n          ))\n        }\n      </SectionActions>\n    </SectionContent>\n    <SectionGrid class=\"grid-cols-1\">\n      {\n        items?.map(({ title, description, rating, item }) => (\n          <Tile class=\"shadow-none\" variant=\"floating\">\n            <Item class=\"p-0\">\n              <ItemMedia>\n                <Avatar class=\"size-10\">\n                  <AvatarImage {...item?.image} />\n                </Avatar>\n              </ItemMedia>\n              <ItemContent>\n                <ItemTitle>{item?.title}</ItemTitle>\n                <ItemDescription>{item?.description}</ItemDescription>\n              </ItemContent>\n            </Item>\n            <Rating rating={rating} />\n            <TileContent>\n              <TileTitle>{title}</TileTitle>\n              <TileDescription>{description}</TileDescription>\n            </TileContent>\n          </Tile>\n        ))\n      }\n    </SectionGrid>\n  </SectionSplit>\n</Section>\n",
+      "content": "---\nimport type { ImageMetadata } from \"astro\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport { Icon } from \"@/components/ui/icon\"\nimport { Rating } from \"@/components/ui/rating\"\nimport { Section, SectionContainer } from \"@/components/ui/section\"\nimport { Separator } from \"@/components/ui/separator\"\n\ntype Props = {\n  class?: string\n  featured: {\n    quote: string\n    image?: ImageMetadata\n    initials: string\n    name: string\n    role: string\n  }\n  reviews: {\n    rating: number\n    quote: string\n    image?: ImageMetadata\n    initials: string\n    name: string\n    role: string\n  }[]\n}\n\nconst { class: className, featured, reviews } = Astro.props\n---\n\n<Section class={cn(\"\", className)}>\n  <SectionContainer\n    class=\"grid gap-10 lg:grid-cols-[minmax(0,1.3fr)_minmax(0,1fr)] lg:items-start\"\n  >\n    <article class=\"flex flex-col gap-6 rounded-xl border p-8\">\n      <Icon name=\"quote\" class=\"text-primary size-8\" />\n      <blockquote\n        class=\"text-foreground text-2xl leading-snug font-semibold text-balance sm:text-3xl\"\n      >\n        {featured.quote}\n      </blockquote>\n      <div class=\"flex items-center gap-3 pt-2\">\n        <Avatar size=\"lg\">\n          <AvatarImage src={featured.image} alt={featured.name} />\n          <AvatarFallback>{featured.initials}</AvatarFallback>\n        </Avatar>\n        <div>\n          <p class=\"text-foreground text-sm font-medium\">{featured.name}</p>\n          <p class=\"text-muted-foreground text-xs\">{featured.role}</p>\n        </div>\n      </div>\n    </article>\n    <div class=\"grid gap-6\">\n      {\n        reviews.map((item) => (\n          <article class=\"flex flex-col\">\n            <Separator />\n            <div class=\"flex flex-col gap-3 pt-6\">\n              <Rating value={item.rating} />\n              <p class=\"text-muted-foreground text-sm leading-relaxed\">\n                {item.quote}\n              </p>\n              <div class=\"flex items-center gap-3 pt-1\">\n                <Avatar>\n                  <AvatarImage src={item.image} alt={item.name} />\n                  <AvatarFallback>{item.initials}</AvatarFallback>\n                </Avatar>\n                <div>\n                  <p class=\"text-foreground text-sm font-medium\">{item.name}</p>\n                  <p class=\"text-muted-foreground text-xs\">{item.role}</p>\n                </div>\n              </div>\n            </div>\n          </article>\n        ))\n      }\n    </div>\n  </SectionContainer>\n</Section>\n",
       "type": "registry:block"
     }
-  ]
-}
+  ],
+  "type": "registry:block"
+}

package/public/r/reviews-3.json

@@ -1,21 +1,19 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "reviews-3",
-  "type": "registry:block",
   "registryDependencies": [
-    "@fulldev/button",
-    "@fulldev/icon",
-    "@fulldev/item",
-    "@fulldev/native-carousel",
+    "@fulldev/avatar",
+    "@fulldev/carousel",
     "@fulldev/rating",
     "@fulldev/section",
-    "@fulldev/tile"
+    "@fulldev/icon"
   ],
   "files": [
     {
       "path": "src/components/blocks/reviews-3.astro",
-      "content": "---\nimport { cn } from \"@/lib/utils\"\nimport { Button } from \"@/components/ui/button\"\nimport { Icon } from \"@/components/ui/icon\"\nimport {\n  Item,\n  ItemContent,\n  ItemDescription,\n  ItemTitle,\n} from \"@/components/ui/item\"\nimport {\n  NativeCarousel,\n  NativeCarouselContent,\n  NativeCarouselItem,\n  NativeCarouselNext,\n  NativeCarouselPrevious,\n} from \"@/components/ui/native-carousel\"\nimport { Rating } from \"@/components/ui/rating\"\nimport {\n  Section,\n  SectionActions,\n  SectionContent,\n  SectionProse,\n} from \"@/components/ui/section\"\nimport { Tile, TileDescription } from \"@/components/ui/tile\"\n\ninterface Props {\n  class?: string\n  id?: string\n  links?: {\n    icon?: string\n    text?: string\n    href?: string\n    target?: string\n  }[]\n  items?: {\n    title?: string\n    description?: string\n    rating?: number\n    image?: {\n      src: string\n      alt: string\n    }\n    item?: {\n      title?: string\n      description?: string\n      image?: {\n        src: string\n        alt: string\n      }\n    }\n  }[]\n}\n\nconst { class: className, id, links, items } = Astro.props\n---\n\n<Section\n  class={cn(\"items-center\", className)}\n  id={id}\n  style={{ \"--section-width\": \"var(--breakpoint-sm)\" }}\n>\n  <SectionContent class=\"items-center text-center\">\n    <SectionProse>\n      <slot />\n    </SectionProse>\n    <SectionActions>\n      {\n        links?.map(({ icon, text, ...link }, i) => (\n          <Button variant={i === 0 ? \"default\" : \"outline\"} {...link}>\n            {icon && <Icon name={icon} />}\n            {text}\n          </Button>\n        ))\n      }\n    </SectionActions>\n  </SectionContent>\n  <NativeCarousel>\n    <NativeCarouselContent>\n      {\n        items?.map(({ description, rating, item }) => (\n          <NativeCarouselItem>\n            <Tile class=\"items-center bg-transparent! ring-transparent!\">\n              <Rating rating={rating} />\n              <TileDescription class=\"text-center\">\n                {description}\n              </TileDescription>\n              <Item class=\"p-0\">\n                <ItemContent class=\"items-center text-center\">\n                  <ItemTitle>{item?.title}</ItemTitle>\n                  <ItemDescription>{item?.description}</ItemDescription>\n                </ItemContent>\n              </Item>\n            </Tile>\n          </NativeCarouselItem>\n        ))\n      }\n    </NativeCarouselContent>\n    <NativeCarouselPrevious class=\"top-auto -bottom-2 left-6\" />\n    <NativeCarouselNext class=\"top-auto right-6 -bottom-2\" />\n  </NativeCarousel>\n</Section>\n",
+      "content": "---\nimport type { ImageMetadata } from \"astro\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport {\n  Carousel,\n  CarouselContent,\n  CarouselItem,\n  CarouselNext,\n  CarouselPrevious,\n} from \"@/components/ui/carousel\"\nimport { Icon } from \"@/components/ui/icon\"\nimport { Rating } from \"@/components/ui/rating\"\nimport { Section, SectionContainer } from \"@/components/ui/section\"\n\ntype Props = {\n  class?: string\n  title?: string\n  description?: string\n  reviews: {\n    rating: number\n    quote: string\n    image?: ImageMetadata\n    initials: string\n    name: string\n    role: string\n  }[]\n}\n\nconst { class: className, title, description, reviews } = Astro.props\n---\n\n<Section class={cn(\"\", className)}>\n  {\n    (title || description) && (\n      <SectionContainer class=\"items-center gap-4 text-center\">\n        {title && (\n          <h2 class=\"text-foreground text-3xl font-semibold tracking-tight text-balance sm:text-4xl\">\n            {title}\n          </h2>\n        )}\n        {description && (\n          <p class=\"text-muted-foreground max-w-2xl text-lg leading-relaxed text-balance\">\n            {description}\n          </p>\n        )}\n      </SectionContainer>\n    )\n  }\n  <SectionContainer>\n    <Carousel opts={{ loop: true, align: \"center\" }} class=\"mx-auto max-w-3xl\">\n      <CarouselContent>\n        {\n          reviews.map((item) => (\n            <CarouselItem>\n              <div class=\"flex flex-col items-center gap-6 px-4 py-8 text-center\">\n                <Icon name=\"quote\" class=\"text-primary size-10\" />\n                <Rating value={item.rating} />\n                <blockquote class=\"text-foreground text-xl leading-relaxed font-medium text-balance sm:text-2xl\">\n                  {item.quote}\n                </blockquote>\n                <div class=\"flex items-center gap-3 pt-2\">\n                  <Avatar size=\"lg\">\n                    <AvatarImage src={item.image} alt={item.name} />\n                    <AvatarFallback>{item.initials}</AvatarFallback>\n                  </Avatar>\n                  <div class=\"text-left\">\n                    <p class=\"text-foreground text-sm font-medium\">\n                      {item.name}\n                    </p>\n                    <p class=\"text-muted-foreground text-xs\">{item.role}</p>\n                  </div>\n                </div>\n              </div>\n            </CarouselItem>\n          ))\n        }\n      </CarouselContent>\n      <CarouselPrevious />\n      <CarouselNext />\n    </Carousel>\n  </SectionContainer>\n</Section>\n",
       "type": "registry:block"
     }
-  ]
-}
+  ],
+  "type": "registry:block"
+}

package/public/r/reviews-4.json

@@ -1,22 +1,19 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "reviews-4",
-  "type": "registry:block",
   "registryDependencies": [
     "@fulldev/avatar",
-    "@fulldev/button",
-    "@fulldev/icon",
-    "@fulldev/item",
+    "@fulldev/card",
     "@fulldev/marquee",
     "@fulldev/rating",
-    "@fulldev/section",
-    "@fulldev/tile"
+    "@fulldev/section"
   ],
   "files": [
     {
       "path": "src/components/blocks/reviews-4.astro",
-      "content": "---\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarImage } from \"@/components/ui/avatar\"\nimport { Button } from \"@/components/ui/button\"\nimport { Icon } from \"@/components/ui/icon\"\nimport {\n  Item,\n  ItemContent,\n  ItemDescription,\n  ItemMedia,\n  ItemTitle,\n} from \"@/components/ui/item\"\nimport { Marquee, MarqueeContent } from \"@/components/ui/marquee\"\nimport { Rating } from \"@/components/ui/rating\"\nimport {\n  Section,\n  SectionActions,\n  SectionContent,\n  SectionProse,\n} from \"@/components/ui/section\"\nimport {\n  Tile,\n  TileContent,\n  TileDescription,\n  TileTitle,\n} from \"@/components/ui/tile\"\n\ninterface Props {\n  class?: string\n  id?: string\n  links?: {\n    icon?: string\n    text?: string\n    href?: string\n    target?: string\n  }[]\n  items?: {\n    title?: string\n    description?: string\n    rating?: number\n    image?: {\n      src: string\n      alt: string\n    }\n    item?: {\n      title?: string\n      description?: string\n      image?: {\n        src: string\n        alt: string\n      }\n    }\n  }[]\n}\n\nconst { class: className, id, links, items = [] } = Astro.props\n---\n\n<Section class={cn(\"gap-6\", className)} id={id}>\n  <SectionContent class=\"mb-10\">\n    <SectionProse>\n      <slot />\n    </SectionProse>\n    <SectionActions>\n      {\n        links?.map(({ icon, text, ...link }, i) => (\n          <Button variant={i === 0 ? \"default\" : \"outline\"} {...link}>\n            {icon && <Icon name={icon} />}\n            {text}\n          </Button>\n        ))\n      }\n    </SectionActions>\n  </SectionContent>\n  {\n    ([\"left\", \"right\"] as const).map((direction) => (\n      <Marquee class=\"-mx-(--section-px)\">\n        <MarqueeContent direction={direction} pauseOnHover>\n          {[...items, ...items]?.map(({ title, description, rating, item }) => (\n            <Tile class=\"shadow-none\" variant=\"floating\">\n              <Item class=\"p-0\">\n                <ItemMedia>\n                  <Avatar class=\"size-10\">\n                    <AvatarImage {...item?.image} />\n                  </Avatar>\n                </ItemMedia>\n                <ItemContent>\n                  <ItemTitle>{item?.title}</ItemTitle>\n                  <ItemDescription>{item?.description}</ItemDescription>\n                </ItemContent>\n              </Item>\n              <Rating rating={rating} />\n              <TileContent>\n                <TileTitle>{title}</TileTitle>\n                <TileDescription>{description}</TileDescription>\n              </TileContent>\n            </Tile>\n          ))}\n        </MarqueeContent>\n      </Marquee>\n    ))\n  }\n</Section>\n",
+      "content": "---\nimport type { ImageMetadata } from \"astro\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport { Card, CardContent } from \"@/components/ui/card\"\nimport { Marquee } from \"@/components/ui/marquee\"\nimport { Rating } from \"@/components/ui/rating\"\nimport { Section, SectionContainer } from \"@/components/ui/section\"\n\ntype Props = {\n  class?: string\n  title?: string\n  description?: string\n  reviews: {\n    rating: number\n    quote: string\n    image?: ImageMetadata\n    initials: string\n    name: string\n    role: string\n  }[]\n}\n\nconst { class: className, title, description, reviews } = Astro.props\n\nconst half = Math.ceil(reviews.length / 2)\nconst topRow = reviews.slice(0, half)\nconst bottomRow = reviews.slice(half)\n---\n\n<Section class={cn(\"\", className)}>\n  {\n    (title || description) && (\n      <SectionContainer class=\"items-center gap-4 text-center\">\n        {title && (\n          <h2 class=\"text-foreground text-3xl font-semibold tracking-tight text-balance sm:text-4xl\">\n            {title}\n          </h2>\n        )}\n        {description && (\n          <p class=\"text-muted-foreground max-w-2xl text-lg leading-relaxed text-balance\">\n            {description}\n          </p>\n        )}\n      </SectionContainer>\n    )\n  }\n  <div class=\"flex flex-col gap-6 overflow-x-hidden py-1\">\n    <Marquee\n      direction=\"left\"\n      pauseOnHover\n      infinite\n      gap=\"1rem\"\n      class=\"py-1 [&>div]:items-stretch\"\n    >\n      {\n        topRow.map((item) => (\n          <Card class=\"flex w-[22rem] shrink-0 self-stretch\">\n            <CardContent class=\"flex min-w-0 flex-1 flex-col gap-3\">\n              <Rating value={item.rating} />\n              <p class=\"text-muted-foreground min-w-0 text-sm leading-relaxed\">\n                {item.quote}\n              </p>\n              <div class=\"mt-auto flex items-center gap-3 pt-1\">\n                <Avatar>\n                  <AvatarImage src={item.image} alt={item.name} />\n                  <AvatarFallback>{item.initials}</AvatarFallback>\n                </Avatar>\n                <div>\n                  <p class=\"text-foreground text-sm font-medium\">{item.name}</p>\n                  <p class=\"text-muted-foreground text-xs\">{item.role}</p>\n                </div>\n              </div>\n            </CardContent>\n          </Card>\n        ))\n      }\n    </Marquee>\n    <Marquee\n      direction=\"right\"\n      pauseOnHover\n      infinite\n      gap=\"1rem\"\n      class=\"py-1 [&>div]:items-stretch\"\n    >\n      {\n        bottomRow.map((item) => (\n          <Card class=\"flex w-[22rem] shrink-0 self-stretch\">\n            <CardContent class=\"flex min-w-0 flex-1 flex-col gap-3\">\n              <Rating value={item.rating} />\n              <p class=\"text-muted-foreground min-w-0 text-sm leading-relaxed\">\n                {item.quote}\n              </p>\n              <div class=\"mt-auto flex items-center gap-3 pt-1\">\n                <Avatar>\n                  <AvatarImage src={item.image} alt={item.name} />\n                  <AvatarFallback>{item.initials}</AvatarFallback>\n                </Avatar>\n                <div>\n                  <p class=\"text-foreground text-sm font-medium\">{item.name}</p>\n                  <p class=\"text-muted-foreground text-xs\">{item.role}</p>\n                </div>\n              </div>\n            </CardContent>\n          </Card>\n        ))\n      }\n    </Marquee>\n  </div>\n</Section>\n",
       "type": "registry:block"
     }
-  ]
-}
+  ],
+  "type": "registry:block"
+}

package/public/r/reviews-5.json

@@ -1,22 +1,19 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "reviews-5",
-  "type": "registry:block",
   "registryDependencies": [
     "@fulldev/avatar",
-    "@fulldev/button",
-    "@fulldev/icon",
-    "@fulldev/item",
     "@fulldev/marquee",
     "@fulldev/rating",
     "@fulldev/section",
-    "@fulldev/tile"
+    "@fulldev/icon"
   ],
   "files": [
     {
       "path": "src/components/blocks/reviews-5.astro",
-      "content": "---\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarImage } from \"@/components/ui/avatar\"\nimport { Button } from \"@/components/ui/button\"\nimport { Icon } from \"@/components/ui/icon\"\nimport {\n  Item,\n  ItemContent,\n  ItemDescription,\n  ItemMedia,\n  ItemTitle,\n} from \"@/components/ui/item\"\nimport { Marquee, MarqueeContent } from \"@/components/ui/marquee\"\nimport { Rating } from \"@/components/ui/rating\"\nimport {\n  Section,\n  SectionActions,\n  SectionContent,\n  SectionProse,\n} from \"@/components/ui/section\"\nimport {\n  Tile,\n  TileContent,\n  TileDescription,\n  TileTitle,\n} from \"@/components/ui/tile\"\n\ninterface Props {\n  class?: string\n  id?: string\n  links?: {\n    icon?: string\n    text?: string\n    href?: string\n    target?: string\n  }[]\n  items?: {\n    title?: string\n    description?: string\n    rating?: number\n    image?: {\n      src: string\n      alt: string\n    }\n    item?: {\n      title?: string\n      description?: string\n      image?: {\n        src: string\n        alt: string\n      }\n    }\n  }[]\n}\n\nconst { class: className, id, links, items = [] } = Astro.props\n---\n\n<Section class={cn(\"gap-6\", className)} id={id}>\n  <SectionContent class=\"mb-10 items-center text-center\">\n    <SectionProse>\n      <slot />\n    </SectionProse>\n    <SectionActions>\n      {\n        links?.map(({ icon, text, ...link }, i) => (\n          <Button variant={i === 0 ? \"default\" : \"outline\"} {...link}>\n            {icon && <Icon name={icon} />}\n            {text}\n          </Button>\n        ))\n      }\n    </SectionActions>\n  </SectionContent>\n  {\n    ([\"left\", \"right\"] as const).map((direction) => (\n      <Marquee class=\"mask-x-from-95%\">\n        <MarqueeContent direction={direction} pauseOnHover>\n          {[...items, ...items]?.map(({ title, description, rating, item }) => (\n            <Tile class=\"shadow-none\" variant=\"floating\">\n              <Item class=\"p-0\">\n                <ItemMedia>\n                  <Avatar class=\"size-10\">\n                    <AvatarImage {...item?.image} />\n                  </Avatar>\n                </ItemMedia>\n                <ItemContent>\n                  <ItemTitle>{item?.title}</ItemTitle>\n                  <ItemDescription>{item?.description}</ItemDescription>\n                </ItemContent>\n              </Item>\n              <Rating rating={rating} />\n              <TileContent>\n                <TileTitle>{title}</TileTitle>\n                <TileDescription>{description}</TileDescription>\n              </TileContent>\n            </Tile>\n          ))}\n        </MarqueeContent>\n      </Marquee>\n    ))\n  }\n</Section>\n",
+      "content": "---\nimport type { ImageMetadata } from \"astro\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport { Icon } from \"@/components/ui/icon\"\nimport { Marquee } from \"@/components/ui/marquee\"\nimport { Rating } from \"@/components/ui/rating\"\nimport { Section, SectionContainer } from \"@/components/ui/section\"\n\ntype Props = {\n  class?: string\n  title?: string\n  description?: string\n  reviews: {\n    quote: string\n    image?: ImageMetadata\n    initials: string\n    name: string\n    role: string\n    rating: number\n  }[]\n}\n\nconst { class: className, title, description, reviews } = Astro.props\n\nconst third = Math.ceil(reviews.length / 3)\nconst row1 = reviews.slice(0, third)\nconst row2 = reviews.slice(third, third * 2)\nconst row3 = reviews.slice(third * 2)\n---\n\n<Section class={cn(\"\", className)}>\n  {\n    (title || description) && (\n      <SectionContainer class=\"items-center gap-4 text-center\">\n        {title && (\n          <h2 class=\"text-foreground text-3xl font-semibold tracking-tight text-balance sm:text-4xl\">\n            {title}\n          </h2>\n        )}\n        {description && (\n          <p class=\"text-muted-foreground max-w-2xl text-lg leading-relaxed text-balance\">\n            {description}\n          </p>\n        )}\n      </SectionContainer>\n    )\n  }\n  <div class=\"flex flex-col gap-5\">\n    <Marquee\n      direction=\"left\"\n      pauseOnHover\n      infinite\n      gap=\"1.25rem\"\n      class=\"[&>div]:items-stretch\"\n    >\n      {\n        row1.map((item) => (\n          <div class=\"bg-muted/50 flex w-104 shrink-0 rounded-2xl p-6\">\n            <div class=\"flex min-w-0 flex-1 flex-col gap-4\">\n              <div class=\"flex items-center justify-between\">\n                <div class=\"flex items-center gap-3\">\n                  <Avatar size=\"lg\">\n                    <AvatarImage src={item.image} alt={item.name} />\n                    <AvatarFallback>{item.initials}</AvatarFallback>\n                  </Avatar>\n                  <div>\n                    <p class=\"text-foreground text-sm font-semibold\">\n                      {item.name}\n                    </p>\n                    <p class=\"text-muted-foreground text-xs\">{item.role}</p>\n                  </div>\n                </div>\n                <Rating value={item.rating} />\n              </div>\n              <div class=\"flex min-w-0 gap-2.5\">\n                <Icon\n                  name=\"quote\"\n                  class=\"text-primary/30 mt-0.5 size-5 shrink-0\"\n                />\n                <p class=\"text-foreground/80 min-w-0 text-sm leading-relaxed\">\n                  {item.quote}\n                </p>\n              </div>\n            </div>\n          </div>\n        ))\n      }\n    </Marquee>\n    <Marquee\n      direction=\"right\"\n      pauseOnHover\n      infinite\n      gap=\"1.25rem\"\n      class=\"[&>div]:items-stretch\"\n    >\n      {\n        row2.map((item) => (\n          <div class=\"bg-muted/50 flex w-104 shrink-0 rounded-2xl p-6\">\n            <div class=\"flex min-w-0 flex-1 flex-col gap-4\">\n              <div class=\"flex items-center justify-between\">\n                <div class=\"flex items-center gap-3\">\n                  <Avatar size=\"lg\">\n                    <AvatarImage src={item.image} alt={item.name} />\n                    <AvatarFallback>{item.initials}</AvatarFallback>\n                  </Avatar>\n                  <div>\n                    <p class=\"text-foreground text-sm font-semibold\">\n                      {item.name}\n                    </p>\n                    <p class=\"text-muted-foreground text-xs\">{item.role}</p>\n                  </div>\n                </div>\n                <Rating value={item.rating} />\n              </div>\n              <div class=\"flex min-w-0 gap-2.5\">\n                <Icon\n                  name=\"quote\"\n                  class=\"text-primary/30 mt-0.5 size-5 shrink-0\"\n                />\n                <p class=\"text-foreground/80 min-w-0 text-sm leading-relaxed\">\n                  {item.quote}\n                </p>\n              </div>\n            </div>\n          </div>\n        ))\n      }\n    </Marquee>\n    <Marquee\n      direction=\"left\"\n      pauseOnHover\n      infinite\n      gap=\"1.25rem\"\n      class=\"[&>div]:items-stretch\"\n    >\n      {\n        row3.map((item) => (\n          <div class=\"bg-muted/50 flex w-104 shrink-0 rounded-2xl p-6\">\n            <div class=\"flex min-w-0 flex-1 flex-col gap-4\">\n              <div class=\"flex items-center justify-between\">\n                <div class=\"flex items-center gap-3\">\n                  <Avatar size=\"lg\">\n                    <AvatarImage src={item.image} alt={item.name} />\n                    <AvatarFallback>{item.initials}</AvatarFallback>\n                  </Avatar>\n                  <div>\n                    <p class=\"text-foreground text-sm font-semibold\">\n                      {item.name}\n                    </p>\n                    <p class=\"text-muted-foreground text-xs\">{item.role}</p>\n                  </div>\n                </div>\n                <Rating value={item.rating} />\n              </div>\n              <div class=\"flex min-w-0 gap-2.5\">\n                <Icon\n                  name=\"quote\"\n                  class=\"text-primary/30 mt-0.5 size-5 shrink-0\"\n                />\n                <p class=\"text-foreground/80 min-w-0 text-sm leading-relaxed\">\n                  {item.quote}\n                </p>\n              </div>\n            </div>\n          </div>\n        ))\n      }\n    </Marquee>\n  </div>\n</Section>\n",
       "type": "registry:block"
     }
-  ]
-}
+  ],
+  "type": "registry:block"
+}

package/public/r/section.json

@@ -1,62 +1,22 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "section",
-  "type": "registry:ui",
   "files": [
     {
       "path": "src/components/ui/section/section.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props\n  extends HTMLAttributes<\"section\">,\n    VariantProps<typeof variants> {\n  size?: \"sm\" | \"default\" | \"lg\"\n}\n\nconst variants = cva(\n  \"relative mx-auto flex scroll-m-(--section-py) flex-col gap-16 px-(--section-px) py-(--section-py)\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-background w-full\",\n        floating: [\n          \"bg-background rounded-lg border shadow-md\",\n          \"w-[calc(100%-2*var(--gutter,24px))] max-w-(--section-width)\",\n          \"my-(--section-py) overflow-hidden rounded-xl\",\n        ],\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nconst { class: className, variant, size, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <section\n      class={cn(variants({ variant }), className)}\n      data-slot=\"section\"\n      data-variant={variant}\n      data-size={size}\n      {...props}\n    >\n      <Fragment set:html={slot} />\n    </section>\n  )\n}\n\n<style is:global>\n  [data-slot=\"section\"] {\n    --section-width: var(--container, var(--breakpoint-xl));\n    --section-py: calc(var(--spacing) * 12);\n    --section-px: max(\n      var(--gutter, 24px),\n      calc((100cqw - var(--section-width)) / 2)\n    );\n  }\n\n  [data-slot=\"section\"][data-variant=\"floating\"] {\n    --section-px: calc(var(--spacing) * 6);\n  }\n\n  [data-slot=\"section\"][data-size=\"sm\"] {\n    --section-py: calc(var(--spacing) * 8);\n  }\n\n  [data-slot=\"section\"][data-size=\"lg\"] {\n    --section-py: calc(var(--spacing) * 24);\n  }\n\n  @media (min-width: 1024px) {\n    [data-slot=\"section\"] {\n      --section-py: calc(var(--spacing) * 16);\n    }\n\n    [data-slot=\"section\"][data-variant=\"floating\"] {\n      --section-px: calc(var(--spacing) * 16);\n    }\n\n    [data-slot=\"section\"][data-size=\"sm\"] {\n      --section-py: calc(var(--spacing) * 12);\n    }\n\n    [data-slot=\"section\"][data-size=\"lg\"] {\n      --section-py: calc(var(--spacing) * 32);\n    }\n  }\n</style>\n",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"section\"> & VariantProps<typeof variants>\n\nconst variants = cva(\"relative flex scroll-mt-12 flex-col gap-16 py-16\", {\n  variants: {\n    variant: {\n      default: \"bg-background w-full\",\n      floating:\n        \"bg-background mx-auto my-16 w-[calc(100%-2rem)] max-w-[calc(var(--container,1280px)-2rem)] overflow-hidden rounded-xl border shadow-md\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n})\n\nconst { class: className, variant, ...props } = Astro.props\n---\n\n<section\n  class={cn(variants({ variant }), className)}\n  data-slot=\"section\"\n  data-variant={variant}\n  {...props}\n>\n  <slot />\n</section>\n",
       "type": "registry:ui"
     },
     {
-      "path": "src/components/ui/section/section-actions.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"div\"> {}\n\nconst { class: className, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <div class={cn(\"relative z-10 flex flex-wrap gap-2\", className)} {...props}>\n      <Fragment set:html={slot} />\n    </div>\n  )\n}\n",
-      "type": "registry:ui"
-    },
-    {
-      "path": "src/components/ui/section/section-content.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"div\"> {}\n\nconst { class: className, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <div\n      class={cn(\"relative z-10 flex flex-col gap-y-8\", className)}\n      {...props}\n    >\n      <Fragment set:html={slot} />\n    </div>\n  )\n}\n",
-      "type": "registry:ui"
-    },
-    {
-      "path": "src/components/ui/section/section-grid.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"div\">, VariantProps<typeof variants> {}\n\nconst variants = cva(\"grid w-full gap-6\", {\n  variants: {\n    frame: {\n      default: \"\",\n    },\n    size: {\n      sm: \"grid-cols-[repeat(auto-fit,minmax(200px,1fr))]\",\n      default: \"grid-cols-1 sm:grid-cols-[repeat(auto-fit,minmax(260px,1fr))]\",\n      lg: \"grid-cols-1 sm:grid-cols-[repeat(auto-fit,minmax(400px,1fr))]\",\n    },\n  },\n  defaultVariants: {\n    size: \"default\",\n    frame: \"default\",\n  },\n})\n\nconst { class: className, size, frame, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <div class={cn(variants({ size, frame }), className)} {...props}>\n      <Fragment set:html={slot} />\n    </div>\n  )\n}\n",
-      "type": "registry:ui"
-    },
-    {
-      "path": "src/components/ui/section/section-masonry.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"div\">, VariantProps<typeof variants> {}\n\nconst variants = cva(\"w-full gap-6 space-y-6 *:break-inside-avoid\", {\n  variants: {\n    size: {\n      sm: \"columns-3xs\",\n      default: \"columns-2xs\",\n      lg: \"columns-xs\",\n    },\n  },\n  defaultVariants: {\n    size: \"default\",\n  },\n})\n\nconst { class: className, size, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <div class={cn(variants({ size }), className)} {...props}>\n      <Fragment set:html={slot} />\n    </div>\n  )\n}\n",
-      "type": "registry:ui"
-    },
-    {
-      "path": "src/components/ui/section/section-media.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"div\"> {}\n\nconst { class: className, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <div\n      data-slot=\"section-media\"\n      class={cn(\n        \"relative flex items-center justify-center overflow-hidden rounded-lg *:size-full *:object-cover\",\n        className\n      )}\n      {...props}\n    >\n      <Fragment set:html={slot} />\n    </div>\n  )\n}\n",
-      "type": "registry:ui"
-    },
-    {
-      "path": "src/components/ui/section/section-prose.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst variants = cva(\n  [\n    \"text-foreground w-full space-y-4 text-pretty\",\n    \"[&_p]:leading-[1.8] [&_p]:not-first:mt-4\",\n    \"[&_ul]:ml-5 [&_ul]:list-disc [&_ul]:space-y-2 [&_ul]:not-first:mt-4\",\n    \"[&_ol]:ml-5 [&_ol]:list-decimal [&_ol]:space-y-2 [&_ol]:not-first:mt-4\",\n    \"[&_li_p]:inline\",\n    \"[&_a]:text-primary [&_a]:hover:underline\",\n    \"@max-sm:[&_:is(h1,h2,h3,h4,h5,h6)]:break-words @max-sm:[&_:is(h1,h2,h3,h4,h5,h6)]:wrap-break-word @max-sm:[&_:is(h1,h2,h3,h4,h5,h6)]:hyphens-auto\",\n    \"[&_:is(h1,h2,h3,h4,h5,h6)]:scroll-mt-20 [&_:is(h1,h2,h3,h4,h5,h6)]:leading-[1.1] [&_:is(h1,h2,h3,h4,h5,h6)]:font-semibold [&_:is(h1,h2,h3,h4,h5,h6)]:not-first:mt-12\",\n    \"[&_img]:rounded-lg [&_img]:not-first:mt-12\",\n    \"[&_p:first-child:has(~:is(h1,h2,h3,h4,h5,h6))]:text-accent-foreground [&_p:first-child+:is(h1,h2,h3,h4,h5,h6)]:mt-4 [&_p:first-child:has(~:is(h1,h2,h3,h4,h5,h6))]:text-sm [&_p:first-child:has(~:is(h1,h2,h3,h4,h5,h6))]:font-medium\",\n    \"[&_pre]:bg-muted [&_pre]:mt-6 [&_pre]:rounded-lg [&_pre]:rounded-md [&_pre]:border [&_pre]:p-4 [&_pre]:text-sm\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"max-w-2xl text-sm [&_h1]:text-3xl [&_h2]:text-2xl [&_h3]:text-xl [&_h4]:text-lg [&_h5]:text-base [&_h6]:text-sm\",\n        default:\n          \"max-w-3xl text-base [&_h1]:text-4xl [&_h2]:text-3xl [&_h3]:text-2xl [&_h4]:text-xl [&_h5]:text-lg [&_h6]:text-base\",\n        lg: \"max-w-4xl text-lg [&_h1]:text-4xl @5xl:[&_h1]:text-5xl [&_h2]:text-4xl [&_h3]:text-3xl [&_h4]:text-2xl [&_h5]:text-xl [&_h6]:text-lg\",\n      },\n    },\n    defaultVariants: {\n      size: \"default\",\n    },\n  }\n)\n\ninterface Props extends HTMLAttributes<\"div\">, VariantProps<typeof variants> {}\n\nconst { class: className, size, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <div class={cn(variants({ size }), className)} {...props}>\n      <Fragment set:html={slot} />\n    </div>\n  )\n}\n",
-      "type": "registry:ui"
-    },
-    {
-      "path": "src/components/ui/section/section-provider.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"main\"> {}\n\nconst { class: className, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <main\n      role=\"list\"\n      data-slot=\"section-provider\"\n      class={cn(\n        \"group/section-provider @container/section-provider flex flex-col\",\n        className\n      )}\n      {...props}\n    >\n      <Fragment set:html={slot} />\n    </main>\n  )\n}\n",
-      "type": "registry:ui"
-    },
-    {
-      "path": "src/components/ui/section/section-split.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"div\"> {}\n\nconst { class: className, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <div\n      class={cn(\n        \"grid size-full grid-cols-1 gap-16 @5xl:grid-cols-2\",\n        className\n      )}\n      data-slot=\"section-split\"\n      {...props}\n    >\n      <Fragment set:html={slot} />\n    </div>\n  )\n}\n",
-      "type": "registry:ui"
-    },
-    {
-      "path": "src/components/ui/section/section-spread.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"div\"> {}\n\nconst { class: className, ...props } = Astro.props\n\nconst slot = await Astro.slots.render(\"default\")\n---\n\n{\n  slot?.trim().length > 0 && (\n    <div\n      class={cn(\n        \"flex w-full flex-col items-start gap-8 @5xl:flex-row @5xl:justify-between\",\n        className\n      )}\n      {...props}\n    >\n      <Fragment set:html={slot} />\n    </div>\n  )\n}\n",
+      "path": "src/components/ui/section/section-container.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"div\">\n\nconst { class: className, ...props } = Astro.props\n---\n\n<div\n  class={cn(\n    \"relative mx-auto flex w-full max-w-7xl flex-col gap-8 px-4\",\n    className\n  )}\n  {...props}\n>\n  <slot />\n</div>\n",
       "type": "registry:ui"
     },
     {
       "path": "src/components/ui/section/index.ts",
-      "content": "export { default as Section } from \"./section.astro\"\nexport { default as SectionActions } from \"./section-actions.astro\"\nexport { default as SectionContent } from \"./section-content.astro\"\nexport { default as SectionGrid } from \"./section-grid.astro\"\nexport { default as SectionMasonry } from \"./section-masonry.astro\"\nexport { default as SectionMedia } from \"./section-media.astro\"\nexport { default as SectionProse } from \"./section-prose.astro\"\nexport { default as SectionProvider } from \"./section-provider.astro\"\nexport { default as SectionSplit } from \"./section-split.astro\"\nexport { default as SectionSpread } from \"./section-spread.astro\"\n",
+      "content": "export { default as Section } from \"./section.astro\"\nexport { default as SectionContainer } from \"./section-container.astro\"\n",
       "type": "registry:ui"
     }
-  ]
+  ],
+  "type": "registry:ui"
 }

package/public/r/select.json

@@ -0,0 +1,58 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "select",
+  "dependencies": [
+    "@data-slot/select"
+  ],
+  "registryDependencies": [
+    "@fulldev/icon"
+  ],
+  "files": [
+    {
+      "path": "src/components/ui/select/select.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\nimport type { Align, Position, Side } from \"@data-slot/select\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"div\"> & {\n  defaultValue?: string\n  placeholder?: string\n  disabled?: boolean\n  required?: boolean\n  name?: string\n  position?: Position\n  side?: Side\n  align?: Align\n  sideOffset?: number\n  alignOffset?: number\n  avoidCollisions?: boolean\n  collisionPadding?: number\n  highlightItemOnHover?: boolean\n}\n\nconst {\n  class: className,\n  defaultValue,\n  placeholder,\n  disabled,\n  required,\n  name,\n  position,\n  side,\n  align,\n  sideOffset,\n  alignOffset,\n  avoidCollisions,\n  collisionPadding,\n  highlightItemOnHover,\n  ...props\n} = Astro.props\n---\n\n<div\n  data-slot=\"select\"\n  data-default-value={defaultValue}\n  data-placeholder={placeholder}\n  data-disabled={disabled}\n  data-required={required}\n  data-name={name}\n  data-position={position}\n  data-side={side}\n  data-align={align}\n  data-side-offset={sideOffset}\n  data-align-offset={alignOffset}\n  data-avoid-collisions={avoidCollisions}\n  data-collision-padding={collisionPadding}\n  data-highlight-item-on-hover={highlightItemOnHover}\n  class={cn(\n    \"group/select relative inline-flex w-fit flex-col gap-1.5\",\n    className\n  )}\n  {...props}\n>\n  <slot />\n</div>\n\n<script>\n  import { create } from \"@data-slot/select\"\n\n  const initSelect = () => {\n    create()\n  }\n\n  initSelect()\n\n  document.addEventListener(\"astro:page-load\", initSelect)\n</script>\n",
+      "type": "registry:ui"
+    },
+    {
+      "path": "src/components/ui/select/select-trigger.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Icon } from \"@/components/ui/icon\"\n\ntype Props = HTMLAttributes<\"button\"> & {\n  size?: \"sm\" | \"default\"\n  showIcon?: boolean\n}\n\nconst {\n  class: className,\n  type = \"button\",\n  size = \"default\",\n  showIcon = true,\n  ...props\n} = Astro.props\n---\n\n<button\n  data-slot=\"select-trigger\"\n  data-size={size}\n  type={type}\n  class={cn(\n    \"border-input dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 data-placeholder:text-muted-foreground flex w-full items-center justify-between gap-1.5 rounded-md border bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n    className\n  )}\n  {...props}\n>\n  <slot />\n  {\n    showIcon && (\n      <Icon\n        name=\"chevron-down\"\n        class=\"text-muted-foreground pointer-events-none size-4\"\n      />\n    )\n  }\n</button>\n",
+      "type": "registry:ui"
+    },
+    {
+      "path": "src/components/ui/select/select-value.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"span\">\n\nconst { class: className, ...props } = Astro.props\n---\n\n<span\n  data-slot=\"select-value\"\n  class={cn(\"flex flex-1 text-left\", className)}\n  {...props}\n>\n  <slot />\n</span>\n",
+      "type": "registry:ui"
+    },
+    {
+      "path": "src/components/ui/select/select-content.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\nimport type { Align, Position, Side } from \"@data-slot/select\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"div\"> & {\n  position?: Position\n  side?: Side\n  align?: Align\n  sideOffset?: number\n  alignOffset?: number\n  avoidCollisions?: boolean\n  collisionPadding?: number\n}\n\nconst {\n  class: className,\n  hidden = true,\n  position,\n  side,\n  align,\n  sideOffset,\n  alignOffset,\n  avoidCollisions,\n  collisionPadding,\n  ...props\n} = Astro.props\n---\n\n<div data-slot=\"select-portal\">\n  <div\n    data-slot=\"select-positioner\"\n    data-position={position}\n    data-side={side}\n    data-align={align}\n    data-side-offset={sideOffset}\n    data-align-offset={alignOffset}\n    data-avoid-collisions={avoidCollisions}\n    data-collision-padding={collisionPadding}\n    class=\"isolate z-50\"\n  >\n    <div\n      data-slot=\"select-content\"\n      data-position={position}\n      data-align-trigger={position === \"item-aligned\" ? \"true\" : undefined}\n      data-side={side}\n      data-align={align}\n      data-side-offset={sideOffset}\n      data-align-offset={alignOffset}\n      data-avoid-collisions={avoidCollisions}\n      data-collision-padding={collisionPadding}\n      hidden={hidden}\n      class={cn(\n        \"bg-popover text-popover-foreground ring-foreground/10 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md shadow-md ring-1 duration-100 outline-none data-[align-trigger=true]:animate-none\",\n        className\n      )}\n      {...props}\n    >\n      <div\n        data-slot=\"select-viewport\"\n        data-position={position}\n        class=\"p-1 data-[position=item-aligned]:w-full data-[position=popper]:min-w-36\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</div>\n",
+      "type": "registry:ui"
+    },
+    {
+      "path": "src/components/ui/select/select-group.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"div\">\n\nconst { class: className, ...props } = Astro.props\n---\n\n<div\n  data-slot=\"select-group\"\n  class={cn(\"scroll-my-1 p-1\", className)}\n  {...props}\n>\n  <slot />\n</div>\n",
+      "type": "registry:ui"
+    },
+    {
+      "path": "src/components/ui/select/select-label.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"div\">\n\nconst { class: className, ...props } = Astro.props\n---\n\n<div\n  data-slot=\"select-label\"\n  class={cn(\"text-muted-foreground px-2 py-1.5 text-xs\", className)}\n  {...props}\n>\n  <slot />\n</div>\n",
+      "type": "registry:ui"
+    },
+    {
+      "path": "src/components/ui/select/select-item.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Icon } from \"@/components/ui/icon\"\n\ntype Props = HTMLAttributes<\"div\"> & {\n  value?: string\n  disabled?: boolean\n  label?: string\n}\n\nconst { class: className, value, disabled, label, ...props } = Astro.props\n---\n\n<div\n  data-slot=\"select-item\"\n  data-value={value}\n  data-disabled={disabled ? \"true\" : undefined}\n  data-label={label}\n  class={cn(\n    \"group/select-item data-highlighted:bg-accent data-highlighted:text-accent-foreground data-highlighted:**:[svg]:text-accent-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-none select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 *:data-[slot=select-item-text]:flex *:data-[slot=select-item-text]:shrink-0 *:data-[slot=select-item-text]:items-center *:data-[slot=select-item-text]:gap-2 *:data-[slot=select-item-text]:whitespace-nowrap [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n    className\n  )}\n  {...props}\n>\n  <span\n    data-slot=\"select-item-text\"\n    class=\"flex flex-1 shrink-0 items-center gap-2 whitespace-nowrap\"\n  >\n    <slot />\n  </span>\n  <span\n    aria-hidden=\"true\"\n    class=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center opacity-0 group-data-selected/select-item:opacity-100\"\n  >\n    <Icon name=\"check\" />\n  </span>\n</div>\n",
+      "type": "registry:ui"
+    },
+    {
+      "path": "src/components/ui/select/select-separator.astro",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"div\">\n\nconst { class: className, ...props } = Astro.props\n---\n\n<div\n  data-slot=\"select-separator\"\n  class={cn(\"bg-border pointer-events-none -mx-1 my-1 h-px\", className)}\n  {...props}\n>\n</div>\n",
+      "type": "registry:ui"
+    },
+    {
+      "path": "src/components/ui/select/index.ts",
+      "content": "export { default as Select } from \"./select.astro\"\nexport { default as SelectContent } from \"./select-content.astro\"\nexport { default as SelectGroup } from \"./select-group.astro\"\nexport { default as SelectItem } from \"./select-item.astro\"\nexport { default as SelectLabel } from \"./select-label.astro\"\nexport { default as SelectSeparator } from \"./select-separator.astro\"\nexport { default as SelectTrigger } from \"./select-trigger.astro\"\nexport { default as SelectValue } from \"./select-value.astro\"\n",
+      "type": "registry:ui"
+    }
+  ],
+  "type": "registry:ui"
+}

package/public/r/separator.json

@@ -1,11 +1,10 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "separator",
-  "type": "registry:ui",
   "files": [
     {
       "path": "src/components/ui/separator/separator.astro",
-      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends HTMLAttributes<\"div\">, VariantProps<typeof variants> {\n  orientation?: \"horizontal\" | \"vertical\"\n}\n\nconst variants = cva(\"bg-border block shrink-0\", {\n  variants: {\n    orientation: {\n      horizontal: \"h-px w-full\",\n      vertical: \"h-full w-px\",\n    },\n  },\n  defaultVariants: {\n    orientation: \"horizontal\",\n  },\n})\n\nconst { class: className, orientation = \"horizontal\", ...props } = Astro.props\n---\n\n<div\n  data-slot=\"separator\"\n  class={cn(variants({ orientation }), className)}\n  {...props}\n>\n</div>\n",
+      "content": "---\nimport type { HTMLAttributes } from \"astro/types\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Props = HTMLAttributes<\"div\"> & {\n  orientation?: \"horizontal\" | \"vertical\"\n  decorative?: boolean\n}\n\nconst {\n  class: className,\n  orientation = \"horizontal\",\n  decorative = true,\n  ...props\n} = Astro.props\n---\n\n<div\n  data-slot=\"separator\"\n  data-orientation={orientation}\n  data-horizontal={orientation === \"horizontal\" ? \"\" : undefined}\n  data-vertical={orientation === \"vertical\" ? \"\" : undefined}\n  role={decorative ? \"none\" : \"separator\"}\n  aria-orientation={decorative ? undefined : orientation}\n  class={cn(\n    \"bg-border shrink-0 data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch\",\n    className\n  )}\n  {...props}\n>\n</div>\n",
       "type": "registry:ui"
     },
     {
@@ -13,5 +12,6 @@
       "content": "export { default as Separator } from \"./separator.astro\"\n",
       "type": "registry:ui"
     }
-  ]
+  ],
+  "type": "registry:ui"
 }

package/public/r/services-1.json

@@ -1,19 +1,18 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "services-1",
-  "type": "registry:block",
   "registryDependencies": [
+    "@fulldev/badge",
     "@fulldev/button",
-    "@fulldev/icon",
-    "@fulldev/image",
     "@fulldev/section",
-    "@fulldev/tile"
+    "@fulldev/icon"
   ],
   "files": [
     {
       "path": "src/components/blocks/services-1.astro",
-      "content": "---\nimport { Button } from \"@/components/ui/button\"\nimport { Icon } from \"@/components/ui/icon\"\nimport { Image } from \"@/components/ui/image\"\nimport {\n  Section,\n  SectionActions,\n  SectionContent,\n  SectionGrid,\n  SectionProse,\n  SectionSpread,\n} from \"@/components/ui/section\"\nimport {\n  Tile,\n  TileContent,\n  TileDescription,\n  TileMedia,\n  TileSpread,\n  TileTitle,\n} from \"@/components/ui/tile\"\n\ninterface Props {\n  class?: string\n  id?: string\n  links?: {\n    text?: string\n    href?: string\n  }[]\n  items?: {\n    href?: string\n    tagline?: string\n    title?: string\n    description?: string\n    image?: {\n      src: string\n      alt: string\n    }\n    links?: {\n      icon?: string\n      text?: string\n      href?: string\n      target?: string\n    }[]\n  }[]\n}\n\nconst { class: className, id, links, items } = Astro.props\n---\n\n<Section class={className} id={id}>\n  <SectionSpread class=\"@5xl:items-end\">\n    <SectionContent>\n      <SectionProse>\n        <slot />\n      </SectionProse>\n    </SectionContent>\n    <SectionActions>\n      {\n        links?.map(({ text, ...link }, i) => (\n          <Button variant={i === 0 ? \"default\" : \"outline\"} {...link}>\n            {text}\n          </Button>\n        ))\n      }\n    </SectionActions>\n  </SectionSpread>\n  <SectionGrid>\n    {\n      items?.map(({ title, tagline, description, href, image }) => (\n        <Tile href={href}>\n          <TileMedia>\n            <Image sizes=\"600px\" {...image} />\n          </TileMedia>\n          <TileSpread>\n            <TileContent>\n              <TileDescription class=\"text-primary text-xs font-medium\">\n                {tagline}\n              </TileDescription>\n              <TileTitle>{title}</TileTitle>\n              <TileDescription>{description}</TileDescription>\n            </TileContent>\n            {href && (\n              <Icon\n                name=\"arrow-right\"\n                class=\"mr-2 size-5 shrink-0 transition-transform group-hover/tile:translate-x-2\"\n              />\n            )}\n          </TileSpread>\n        </Tile>\n      ))\n    }\n  </SectionGrid>\n</Section>\n",
+      "content": "---\nimport type { ImageMetadata } from \"astro\"\nimport { Image } from \"astro:assets\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport { Icon } from \"@/components/ui/icon\"\nimport { Section, SectionContainer } from \"@/components/ui/section\"\n\ntype Props = {\n  class?: string\n  badge?: string\n  title: string\n  buttons?: {\n    label: string\n    href: string\n    variant?: \"default\" | \"outline\" | \"secondary\" | \"ghost\"\n  }[]\n  services: {\n    image: {\n      src: ImageMetadata\n      alt: string\n    }\n    label?: string\n    title: string\n    description: string\n    href?: string\n  }[]\n}\n\nconst { class: className, badge, title, buttons, services } = Astro.props\n---\n\n<Section class={cn(\"\", className)}>\n  <SectionContainer class=\"gap-8\">\n    <div\n      class=\"flex flex-col gap-4 md:flex-row md:items-end md:justify-between\"\n    >\n      <div class=\"max-w-2xl\">\n        {badge && <Badge variant=\"secondary\">{badge}</Badge>}\n        <h2\n          class=\"mt-4 text-3xl font-semibold tracking-tight text-balance sm:text-4xl\"\n        >\n          {title}\n        </h2>\n      </div>\n      {\n        buttons?.length && (\n          <div class=\"flex flex-wrap gap-3\">\n            {buttons.map(({ href, label, ...button }) => (\n              <Button as=\"a\" href={href} variant={button.variant}>\n                {label}\n              </Button>\n            ))}\n          </div>\n        )\n      }\n    </div>\n    <div class=\"grid gap-6 sm:grid-cols-2 lg:grid-cols-4\">\n      {\n        services.map((service) => {\n          const Wrapper = service.href ? \"a\" : \"div\"\n          return (\n            <Wrapper\n              href={service.href}\n              class={cn(\n                \"group/service flex flex-col gap-4 overflow-hidden rounded-xl border shadow-xs transition-shadow\",\n                service.href && \"hover:shadow-md\"\n              )}\n            >\n              <Image\n                src={service.image.src}\n                alt={service.image.alt}\n                class=\"aspect-4/3 w-full object-cover\"\n                widths={[320, 480, 640]}\n                sizes=\"(min-width: 1024px) 25vw, (min-width: 640px) 50vw, 100vw\"\n              />\n              <div class=\"flex flex-1 flex-col gap-2 px-5 pb-5\">\n                {service.label && (\n                  <span class=\"text-primary text-xs font-medium\">\n                    {service.label}\n                  </span>\n                )}\n                <h3 class=\"text-base font-medium\">{service.title}</h3>\n                <p class=\"text-muted-foreground text-sm leading-relaxed\">\n                  {service.description}\n                </p>\n                {service.href && (\n                  <span class=\"mt-auto pt-2\">\n                    <Icon\n                      name=\"arrow-right\"\n                      class=\"text-muted-foreground size-4 transition-transform group-hover/service:translate-x-1\"\n                    />\n                  </span>\n                )}\n              </div>\n            </Wrapper>\n          )\n        })\n      }\n    </div>\n  </SectionContainer>\n</Section>\n",
       "type": "registry:block"
     }
-  ]
-}
+  ],
+  "type": "registry:block"
+}

package/public/r/services-2.json

@@ -1,19 +1,17 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "services-2",
-  "type": "registry:block",
   "registryDependencies": [
+    "@fulldev/badge",
     "@fulldev/button",
-    "@fulldev/icon",
-    "@fulldev/image",
-    "@fulldev/section",
-    "@fulldev/tile"
+    "@fulldev/section"
   ],
   "files": [
     {
       "path": "src/components/blocks/services-2.astro",
-      "content": "---\nimport { Button } from \"@/components/ui/button\"\nimport { Icon } from \"@/components/ui/icon\"\nimport { Image } from \"@/components/ui/image\"\nimport {\n  Section,\n  SectionActions,\n  SectionContent,\n  SectionGrid,\n  SectionProse,\n} from \"@/components/ui/section\"\nimport {\n  Tile,\n  TileContent,\n  TileDescription,\n  TileMedia,\n  TileTitle,\n} from \"@/components/ui/tile\"\n\ninterface Props {\n  class?: string\n  id?: string\n  links?: {\n    text?: string\n    href?: string\n    icon?: string\n    target?: string\n  }[]\n  items?: {\n    title?: string\n    description?: string\n    image?: {\n      src: string\n      alt: string\n    }\n    links?: {\n      icon?: string\n      text?: string\n      href?: string\n      target?: string\n    }[]\n  }[]\n}\n\nconst { class: className, id, links, items } = Astro.props\n---\n\n<Section class={className} id={id}>\n  <SectionContent>\n    <SectionProse>\n      <slot />\n    </SectionProse>\n    <SectionActions>\n      {\n        links?.map(({ text, icon, href, target }, i) => (\n          <Button\n            variant={i === 0 ? \"default\" : \"outline\"}\n            href={href}\n            target={target}\n          >\n            {icon && <Icon name={icon} />}\n            {text}\n          </Button>\n        ))\n      }\n    </SectionActions>\n  </SectionContent>\n  <SectionGrid size=\"lg\">\n    {\n      items?.map(({ title, description, image, links }) => (\n        <Tile\n          class=\"dark aspect-4/3 justify-end rounded-md border-0 bg-black\"\n          variant=\"floating\"\n        >\n          <TileMedia class=\"absolute inset-0 size-full mask-b-from-0% mask-b-to-black/50\">\n            <Image sizes=\"620px\" {...image} />\n          </TileMedia>\n          <TileContent class=\"w-full text-white\">\n            <TileTitle class=\"text-foreground text-3xl\">{title}</TileTitle>\n            <TileDescription class=\"text-foreground text-lg\">\n              {description}\n            </TileDescription>\n          </TileContent>\n          <SectionActions>\n            {links?.map(({ text, icon, href, target }, i) => (\n              <Button\n                variant={i === 0 ? \"default\" : \"outline\"}\n                href={href}\n                target={target}\n              >\n                {icon && <Icon name={icon} />}\n                {text}\n              </Button>\n            ))}\n          </SectionActions>\n        </Tile>\n      ))\n    }\n  </SectionGrid>\n</Section>\n",
+      "content": "---\nimport type { ImageMetadata } from \"astro\"\nimport { Image } from \"astro:assets\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport { Section, SectionContainer } from \"@/components/ui/section\"\n\ntype Props = {\n  class?: string\n  badge?: string\n  title: string\n  description?: string\n  buttons?: {\n    label: string\n    href: string\n    variant?: \"default\" | \"outline\" | \"secondary\" | \"ghost\"\n  }[]\n  services: {\n    image: {\n      src: ImageMetadata\n      alt: string\n    }\n    label?: string\n    title: string\n    description: string\n    button?: {\n      label: string\n      href: string\n    }\n  }[]\n}\n\nconst {\n  class: className,\n  badge,\n  title,\n  description,\n  buttons,\n  services,\n} = Astro.props\n---\n\n<Section class={cn(\"\", className)}>\n  <SectionContainer class=\"gap-12\">\n    <div class=\"mx-auto max-w-2xl text-center\">\n      {badge && <Badge variant=\"secondary\">{badge}</Badge>}\n      <h2\n        class=\"mt-4 text-3xl font-semibold tracking-tight text-balance sm:text-4xl\"\n      >\n        {title}\n      </h2>\n      {\n        description && (\n          <p class=\"text-muted-foreground mt-4 text-base leading-relaxed text-balance\">\n            {description}\n          </p>\n        )\n      }\n      {\n        buttons?.length && (\n          <div class=\"mt-6 flex flex-wrap justify-center gap-3\">\n            {buttons.map(({ href, label, ...button }) => (\n              <Button as=\"a\" href={href} variant={button.variant}>\n                {label}\n              </Button>\n            ))}\n          </div>\n        )\n      }\n    </div>\n    <div class=\"grid gap-6 lg:gap-8\">\n      {\n        services.map((service) => (\n          <div class=\"group/service grid items-center gap-6 rounded-xl border p-4 shadow-xs transition-shadow hover:shadow-md md:grid-cols-[16rem_minmax(0,1fr)] md:p-0\">\n            <Image\n              src={service.image.src}\n              alt={service.image.alt}\n              class=\"aspect-4/3 w-full rounded-lg object-cover md:aspect-auto md:h-full md:rounded-l-xl md:rounded-r-none\"\n              widths={[320, 480]}\n              sizes=\"(min-width: 768px) 16rem, 100vw\"\n            />\n            <div class=\"flex flex-col gap-2 py-2 md:py-6 md:pr-6\">\n              {service.label && (\n                <span class=\"text-primary text-xs font-medium tracking-wider uppercase\">\n                  {service.label}\n                </span>\n              )}\n              <h3 class=\"text-lg font-medium\">{service.title}</h3>\n              <p class=\"text-muted-foreground text-sm leading-relaxed\">\n                {service.description}\n              </p>\n              {service.button && (\n                <Button\n                  as=\"a\"\n                  href={service.button.href}\n                  variant=\"secondary\"\n                  class=\"mt-1 w-fit\"\n                >\n                  {service.button.label}\n                </Button>\n              )}\n            </div>\n          </div>\n        ))\n      }\n    </div>\n  </SectionContainer>\n</Section>\n",
       "type": "registry:block"
     }
-  ]
-}
+  ],
+  "type": "registry:block"
+}

package/public/r/services-3.json

@@ -1,18 +1,17 @@
 {
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "services-3",
-  "type": "registry:block",
   "registryDependencies": [
+    "@fulldev/badge",
     "@fulldev/button",
-    "@fulldev/image",
-    "@fulldev/section",
-    "@fulldev/tile"
+    "@fulldev/section"
   ],
   "files": [
     {
       "path": "src/components/blocks/services-3.astro",
-      "content": "---\nimport { Button } from \"@/components/ui/button\"\nimport { Image } from \"@/components/ui/image\"\nimport {\n  Section,\n  SectionActions,\n  SectionContent,\n  SectionGrid,\n  SectionProse,\n  SectionSplit,\n} from \"@/components/ui/section\"\nimport {\n  Tile,\n  TileActions,\n  TileContent,\n  TileDescription,\n  TileMedia,\n  TileSplit,\n  TileTitle,\n} from \"@/components/ui/tile\"\n\ninterface Props {\n  class?: string\n  id?: string\n  links?: {\n    text?: string\n    href?: string\n  }[]\n  items?: {\n    href?: string\n    tagline?: string\n    title?: string\n    description?: string\n    image?: {\n      src: string\n      alt: string\n    }\n    links?: {\n      text?: string\n      href?: string\n    }[]\n  }[]\n}\n\nconst { class: className, id, links, items } = Astro.props\n---\n\n<Section class={className} id={id}>\n  <SectionSplit\n    class=\"items-start @5xl:grid-cols-[2fr_3fr] @5xl:*:sticky @5xl:*:top-[calc(var(--section-py)+var(--header-height,0px))]\"\n  >\n    <SectionContent>\n      <SectionProse>\n        <slot />\n      </SectionProse>\n      <SectionActions>\n        {\n          links?.map(({ text, ...link }, i) => (\n            <Button variant={i === 0 ? \"default\" : \"outline\"} {...link}>\n              {text}\n            </Button>\n          ))\n        }\n      </SectionActions>\n    </SectionContent>\n    <SectionGrid size=\"lg\">\n      {\n        items?.map(({ title, tagline, description, image, links }) => (\n          <Tile>\n            <TileSplit>\n              <TileMedia>\n                <Image sizes=\"400px\" {...image} />\n              </TileMedia>\n              <TileContent>\n                <TileDescription class=\"text-primary text-xs font-medium\">\n                  {tagline}\n                </TileDescription>\n                <TileTitle>{title}</TileTitle>\n                <TileDescription>{description}</TileDescription>\n                <TileActions class=\"mt-2\">\n                  {links?.map(({ text, ...link }, i) => (\n                    <Button\n                      variant={i === 0 ? \"outline\" : \"ghost\"}\n                      size=\"sm\"\n                      {...link}\n                    >\n                      {text}\n                    </Button>\n                  ))}\n                </TileActions>\n              </TileContent>\n            </TileSplit>\n          </Tile>\n        ))\n      }\n    </SectionGrid>\n  </SectionSplit>\n</Section>\n",
+      "content": "---\nimport type { ImageMetadata } from \"astro\"\nimport { Image } from \"astro:assets\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport { Section, SectionContainer } from \"@/components/ui/section\"\n\ntype Props = {\n  class?: string\n  badge?: string\n  title: string\n  description?: string\n  buttons?: {\n    label: string\n    href: string\n    variant?: \"default\" | \"outline\" | \"secondary\" | \"ghost\"\n  }[]\n  services: {\n    image: {\n      src: ImageMetadata\n      alt: string\n    }\n    title: string\n    description: string\n    button?: {\n      label: string\n      href: string\n    }\n  }[]\n}\n\nconst {\n  class: className,\n  badge,\n  title,\n  description,\n  buttons,\n  services,\n} = Astro.props\n---\n\n<Section class={cn(\"\", className)}>\n  <SectionContainer class=\"gap-8\">\n    <div class=\"mx-auto max-w-2xl text-center\">\n      {badge && <Badge variant=\"secondary\">{badge}</Badge>}\n      <h2\n        class=\"mt-4 text-3xl font-semibold tracking-tight text-balance sm:text-4xl\"\n      >\n        {title}\n      </h2>\n      {\n        description && (\n          <p class=\"text-muted-foreground mt-4 text-base leading-relaxed text-balance\">\n            {description}\n          </p>\n        )\n      }\n      {\n        buttons?.length && (\n          <div class=\"mt-6 flex flex-wrap justify-center gap-3\">\n            {buttons.map(({ href, label, ...button }) => (\n              <Button as=\"a\" href={href} variant={button.variant}>\n                {label}\n              </Button>\n            ))}\n          </div>\n        )\n      }\n    </div>\n    <div class=\"grid gap-6 sm:grid-cols-2\">\n      {\n        services.map((service) => (\n          <div class=\"group/service relative isolate flex aspect-4/3 flex-col justify-end overflow-hidden rounded-xl\">\n            <Image\n              src={service.image.src}\n              alt={service.image.alt}\n              class=\"absolute inset-0 -z-10 size-full object-cover transition-transform duration-500 group-hover/service:scale-105\"\n              widths={[480, 640, 960]}\n              sizes=\"(min-width: 640px) 50vw, 100vw\"\n            />\n            <div class=\"absolute inset-0 -z-10 bg-linear-to-t from-black/80 via-black/40 to-transparent\" />\n            <div class=\"flex flex-col gap-2 p-6 text-white\">\n              <h3 class=\"text-xl font-semibold\">{service.title}</h3>\n              <p class=\"text-sm leading-relaxed text-white/80\">\n                {service.description}\n              </p>\n              {service.button && (\n                <Button\n                  as=\"a\"\n                  href={service.button.href}\n                  variant=\"secondary\"\n                  class=\"mt-2 w-fit\"\n                >\n                  {service.button.label}\n                </Button>\n              )}\n            </div>\n          </div>\n        ))\n      }\n    </div>\n  </SectionContainer>\n</Section>\n",
       "type": "registry:block"
     }
-  ]
-}
+  ],
+  "type": "registry:block"
+}