4c: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/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"RegistryDependencies"] 4d: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/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"FilesView"] 4e:T242a,import { forwardRef, createContext, useContext, useState, useCallback, useRef, useId, type HTMLAttributes, type ButtonHTMLAttributes, type ReactNode, type KeyboardEvent, } from 'react' import { cn } from '@/lib/utils' import { useReducedMotion } from '@/hooks/use-reduced-motion' // --- Contexts --- interface AccordionContextValue { openValues: string[] toggle: (value: string) => void type: 'single' | 'multiple' collapsible: boolean baseId: string registerTrigger: (value: string, element: HTMLButtonElement | null) => void getTriggerElements: () => Map } interface AccordionItemContextValue { value: string disabled: boolean isOpen: boolean } const AccordionContext = createContext(null) const AccordionItemContext = createContext(null) function useAccordionContext() { const context = useContext(AccordionContext) if (!context) { throw new Error('Accordion compound components must be used within an parent') } return context } function useAccordionItemContext() { const context = useContext(AccordionItemContext) if (!context) { throw new Error('AccordionTrigger/AccordionContent must be used within an parent') } return context } // --- Accordion Root --- export interface AccordionProps extends Omit, 'onChange'> { /** Whether only one or multiple items can be open */ type?: 'single' | 'multiple' /** Controlled open values */ value?: string[] /** Default open values for uncontrolled mode */ defaultValue?: string[] /** Callback when open values change */ onChange?: (value: string[]) => void /** In single mode, allows closing the open item */ collapsible?: boolean children: ReactNode } export const Accordion = forwardRef( ( { type = 'single', value, defaultValue = [], onChange, collapsible = false, children, className, ...props }, ref ) => { const [internalValue, setInternalValue] = useState(defaultValue) const triggerElementsRef = useRef>(new Map()) const baseId = useId() const openValues = value !== undefined ? value : internalValue const toggle = useCallback( (itemValue: string) => { let next: string[] if (type === 'single') { if (openValues.includes(itemValue)) { next = collapsible ? [] : openValues } else { next = [itemValue] } } else { if (openValues.includes(itemValue)) { next = openValues.filter((v) => v !== itemValue) } else { next = [...openValues, itemValue] } } if (value === undefined) { setInternalValue(next) } onChange?.(next) }, [type, openValues, collapsible, value, onChange] ) const registerTrigger = useCallback((triggerValue: string, element: HTMLButtonElement | null) => { if (element) { triggerElementsRef.current.set(triggerValue, element) } else { triggerElementsRef.current.delete(triggerValue) } }, []) const getTriggerElements = useCallback(() => triggerElementsRef.current, []) return (

{children}

) } ) Accordion.displayName = 'Accordion' // --- AccordionItem --- export interface AccordionItemProps extends HTMLAttributes { /** Unique identifier for this item */ value: string /** Whether this item is disabled */ disabled?: boolean children: ReactNode } export const AccordionItem = forwardRef( ({ value, disabled = false, children, className, ...props }, ref) => { const { openValues } = useAccordionContext() const isOpen = openValues.includes(value) return (

{children}

) } ) AccordionItem.displayName = 'AccordionItem' // --- AccordionTrigger --- export interface AccordionTriggerProps extends ButtonHTMLAttributes { children: ReactNode } export const AccordionTrigger = forwardRef( ({ children, className, onKeyDown, ...props }, ref) => { const { toggle, baseId, registerTrigger, getTriggerElements } = useAccordionContext() const { value, disabled, isOpen } = useAccordionItemContext() const internalRef = useRef(null) const prefersReducedMotion = useReducedMotion() const triggerId = `${baseId}-trigger-${value}` const contentId = `${baseId}-content-${value}` const mergedRef = useCallback( (node: HTMLButtonElement | null) => { internalRef.current = node registerTrigger(value, node) if (typeof ref === 'function') ref(node) else if (ref) (ref as React.MutableRefObject).current = node }, [ref, registerTrigger, value] ) const handleKeyDown = useCallback( (e: KeyboardEvent) => { onKeyDown?.(e) if (e.defaultPrevented) return const triggers = getTriggerElements() const triggerValues = Array.from(triggers.keys()) const currentIndex = triggerValues.indexOf(value) let targetIndex: number switch (e.key) { case 'ArrowDown': targetIndex = (currentIndex + 1) % triggerValues.length break case 'ArrowUp': targetIndex = (currentIndex - 1 + triggerValues.length) % triggerValues.length break case 'Home': targetIndex = 0 break case 'End': targetIndex = triggerValues.length - 1 break default: return } e.preventDefault() const targetValue = triggerValues[targetIndex] const targetElement = triggers.get(targetValue) if (targetElement) { targetElement.focus() } }, [onKeyDown, getTriggerElements, value] ) return ( ) } ) AccordionTrigger.displayName = 'AccordionTrigger' // --- AccordionContent --- export interface AccordionContentProps extends HTMLAttributes { children: ReactNode } export const AccordionContent = forwardRef( ({ children, className, ...props }, ref) => { const { baseId } = useAccordionContext() const { value, isOpen } = useAccordionItemContext() const prefersReducedMotion = useReducedMotion() const triggerId = `${baseId}-trigger-${value}` const contentId = `${baseId}-content-${value}` return (

{children}

) } ) AccordionContent.displayName = 'AccordionContent' 4b:["$","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":[null,["$","$L4c",null,{"namespace":"@n3wth","registryDependencies":["cn","use-reduced-motion"]}]]}],null]}],["$","$L4d",null,{"files":[{"path":"registry/new-york/accordion/accordion.tsx","content":"$4e","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]