4f:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 50:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 51:T1bff,import type { Accessor, ComponentProps, JSX, ValidComponent } from "solid-js" import { createContext, createEffect, createSignal, mergeProps, onCleanup, splitProps, useContext } from "solid-js" import type { PolymorphicProps } from "@kobalte/core/polymorphic" import type { EmblaCarouselType, EmblaOptionsType, EmblaPluginType } from "embla-carousel" import createEmblaCarousel from "embla-carousel-solid" import { ChevronLeft, ChevronRight } from "lucide-solid" import { cn } from "@/lib/utils" import { Button, type ButtonProps } from "@/components/ui/button" type CarouselApi = EmblaCarouselType | undefined type CarouselOptions = EmblaOptionsType type CarouselPlugin = EmblaPluginType type CarouselProps = { opts?: CarouselOptions plugins?: CarouselPlugin[] orientation?: "horizontal" | "vertical" setApi?: (api: CarouselApi) => void } type CarouselContextProps = { carouselRef: ReturnType[0] api: ReturnType[1] scrollPrev: () => void scrollNext: () => void canScrollPrev: Accessor canScrollNext: Accessor } & CarouselProps const CarouselContext = createContext(null) function useCarousel() { const context = useContext(CarouselContext) if (!context) { throw new Error("useCarousel must be used within a ") } return context } type CarouselRootProps = ComponentProps & CarouselProps & { class?: string | undefined children?: JSX.Element } const Carousel = ( rawProps: PolymorphicProps> ) => { const props = mergeProps({ orientation: "horizontal" as const }, rawProps) const [local, others] = splitProps(props as CarouselRootProps, [ "class", "children", "opts", "plugins", "orientation", "setApi" ]) const [carouselRef, api] = createEmblaCarousel( () => ({ ...local.opts, axis: local.orientation === "horizontal" ? "x" : "y" }), () => local.plugins ?? [] ) const [canScrollPrev, setCanScrollPrev] = createSignal(false) const [canScrollNext, setCanScrollNext] = createSignal(false) const onSelect = (emblaApi: EmblaCarouselType) => { setCanScrollPrev(emblaApi.canScrollPrev()) setCanScrollNext(emblaApi.canScrollNext()) } const scrollPrev = () => { api()?.scrollPrev() } const scrollNext = () => { api()?.scrollNext() } const handleKeyDown = (event: KeyboardEvent) => { if (event.key === "ArrowLeft") { event.preventDefault() scrollPrev() } else if (event.key === "ArrowRight") { event.preventDefault() scrollNext() } } createEffect(() => { const emblaApi = api() if (!emblaApi || !local.setApi) return local.setApi(emblaApi) }) createEffect(() => { const emblaApi = api() if (!emblaApi) return onSelect(emblaApi) emblaApi.on("reInit", onSelect) emblaApi.on("select", onSelect) onCleanup(() => { emblaApi.off("select", onSelect) }) }) return (

{local.children}

) } type CarouselContentProps = ComponentProps & { class?: string | undefined } const CarouselContent = ( props: PolymorphicProps> ) => { const [local, others] = splitProps(props as CarouselContentProps, ["class"]) const { carouselRef, orientation } = useCarousel() return (

) } type CarouselItemProps = ComponentProps & { class?: string | undefined } const CarouselItem = ( props: PolymorphicProps> ) => { const [local, others] = splitProps(props as CarouselItemProps, ["class"]) const { orientation } = useCarousel() return (

) } type CarouselPreviousProps = ButtonProps & { class?: string | undefined } const CarouselPrevious = ( rawProps: PolymorphicProps> ) => { const props = mergeProps({ variant: "outline" as const, size: "icon-sm" as const }, rawProps) const [local, others] = splitProps(props as CarouselPreviousProps, ["class", "variant", "size"]) const { orientation, scrollPrev, canScrollPrev } = useCarousel() return ( ) } type CarouselNextProps = ButtonProps & { class?: string | undefined } const CarouselNext = ( rawProps: PolymorphicProps> ) => { const props = mergeProps({ variant: "outline" as const, size: "icon-sm" as const }, rawProps) const [local, others] = splitProps(props as CarouselNextProps, ["class", "variant", "size"]) const { orientation, scrollNext, canScrollNext } = useCarousel() return ( ) } export { type CarouselApi, Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, useCarousel } 4e:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","embla-carousel",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/embla-carousel","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"embla-carousel"}]]}]}],["$","li","embla-carousel-solid",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/embla-carousel-solid","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"embla-carousel-solid"}]]}]}],["$","li","lucide-solid",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-solid","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-solid"}]]}]}]]}],["$","$L4f",null,{"namespace":"@gc-solid","registryDependencies":["@gc-solid/button"]}]]}],null]}],["$","$L50",null,{"files":[{"path":"ui/carousel.tsx","content":"$51","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]