{"$schema":"https:\/\/ui.particle.academy\/schema\/registry-item.json","name":"accordion-panel","type":"registry:ui","title":"AccordionPanel","description":"AccordionPanel from react-fancy","package":"react-fancy","dependencies":[],"registryDependencies":[],"files":[{"path":"components\/fancy\/accordion-panel\/AccordionPanel.Content.tsx","content":"import type { ReactNode } from \"react\";\r\nimport { cn } from \"..\/..\/utils\/cn\";\r\nimport { useAccordionSection } from \".\/AccordionPanel.context\";\r\n\r\nexport interface AccordionPanelContentProps {\r\n  children: ReactNode;\r\n  className?: string;\r\n  \/**\r\n   * Skip the default flex-row\/flex-col + items-center + gap classes so the\r\n   * consumer can lay out the open-state content however they want (e.g. a\r\n   * full-height chat panel with header\/scroll\/input rows). The\r\n   * `data-react-fancy-accordion-content` attribute and conditional render\r\n   * (only when the section is open) are kept.\r\n   *\/\r\n  unstyled?: boolean;\r\n}\r\n\r\n\/**\r\n * Wrapper for the open-state content of a Section. Renders its children\r\n * only when the parent Section is open; returns `null` otherwise.\r\n *\r\n * Use this so siblings of `<AccordionPanel.Trigger>` inside a section can\r\n * cleanly toggle in\/out of the DOM.\r\n *\r\n * The default styling assumes an inline cluster \u2014 flex row (horizontal\r\n * orientation) or column (vertical), centered, with a small gap. For panel\r\n * use cases where the content needs full-bleed layout (chat panes, canvas\r\n * surfaces, etc.), pass `unstyled` and supply your own className.\r\n *\/\r\nexport function AccordionPanelContent({\r\n  children,\r\n  className,\r\n  unstyled,\r\n}: AccordionPanelContentProps) {\r\n  const { open, orientation } = useAccordionSection();\r\n  if (!open) return null;\r\n\r\n  return (\r\n    <div\r\n      data-react-fancy-accordion-content=\"\"\r\n      data-orientation={orientation}\r\n      className={cn(\r\n        !unstyled && \"flex items-center gap-1\",\r\n        !unstyled && (orientation === \"horizontal\" ? \"flex-row\" : \"flex-col\"),\r\n        className,\r\n      )}\r\n    >\r\n      {children}\r\n    <\/div>\r\n  );\r\n}\r\n\r\nAccordionPanelContent.displayName = \"AccordionPanelContent\";\r\n","type":"registry:ui","target":"components\/fancy\/accordion-panel\/AccordionPanel.Content.tsx"},{"path":"components\/fancy\/accordion-panel\/AccordionPanel.Section.tsx","content":"import { useEffect, useMemo } from \"react\";\r\nimport { cn } from \"..\/..\/utils\/cn\";\r\nimport {\r\n  AccordionSectionContext,\r\n  useAccordionPanel,\r\n} from \".\/AccordionPanel.context\";\r\nimport type { AccordionPanelSectionProps } from \".\/AccordionPanel.types\";\r\n\r\n\/**\r\n * One collapsible section inside an AccordionPanel.\r\n *\r\n * Compose with `<AccordionPanel.Trigger>` and `<AccordionPanel.Content>`\r\n * children \u2014 Content renders only when open, Trigger always renders and\r\n * adapts its look by state. Children that are not Trigger\/Content are\r\n * rendered as-is, regardless of state, so static decorations stay put.\r\n *\r\n * Pinned sections never collapse and don't need a Trigger.\r\n *\/\r\nexport function AccordionPanelSection({\r\n  id,\r\n  pinned = false,\r\n  className,\r\n  openClassName,\r\n  closedClassName,\r\n  unstyled,\r\n  children,\r\n}: AccordionPanelSectionProps) {\r\n  const panel = useAccordionPanel();\r\n  const { orientation, isOpen, toggle, registerSection } = panel;\r\n\r\n  useEffect(() => registerSection(id), [id, registerSection]);\r\n\r\n  const open = pinned || isOpen(id);\r\n\r\n  const sectionCtx = useMemo(\r\n    () => ({\r\n      id,\r\n      open,\r\n      pinned,\r\n      orientation,\r\n      toggle: () => toggle(id),\r\n    }),\r\n    [id, open, pinned, orientation, toggle],\r\n  );\r\n\r\n  return (\r\n    <AccordionSectionContext.Provider value={sectionCtx}>\r\n      <div\r\n        data-react-fancy-accordion-section=\"\"\r\n        data-state={open ? \"open\" : \"closed\"}\r\n        data-pinned={pinned ? \"\" : undefined}\r\n        data-orientation={orientation}\r\n        className={cn(\r\n          \"flex shrink-0\",\r\n          !unstyled && \"items-center gap-1\",\r\n          orientation === \"horizontal\" ? \"flex-row\" : \"flex-col\",\r\n          className,\r\n          open ? openClassName : closedClassName,\r\n        )}\r\n      >\r\n        {children}\r\n      <\/div>\r\n    <\/AccordionSectionContext.Provider>\r\n  );\r\n}\r\n\r\nAccordionPanelSection.displayName = \"AccordionPanelSection\";\r\n","type":"registry:ui","target":"components\/fancy\/accordion-panel\/AccordionPanel.Section.tsx"},{"path":"components\/fancy\/accordion-panel\/AccordionPanel.Trigger.tsx","content":"import { cn } from \"..\/..\/utils\/cn\";\r\nimport { useAccordionSection } from \".\/AccordionPanel.context\";\r\nimport type {\r\n  AccordionPanelTriggerProps,\r\n  SectionRenderable,\r\n  SectionRenderState,\r\n} from \".\/AccordionPanel.types\";\r\n\r\nfunction renderSlot(slot: SectionRenderable, state: SectionRenderState) {\r\n  return typeof slot === \"function\" ? slot(state) : slot;\r\n}\r\n\r\n\/**\r\n * Trigger for an AccordionPanel.Section.\r\n *\r\n * Has two visual roles, picked automatically from section state:\r\n *\r\n *   - When the section is OPEN: renders as a thin divider on the section's\r\n *     trailing edge. Hovering reveals an inset chevron pointing toward the\r\n *     section so the user knows clicking will collapse it.\r\n *\r\n *   - When the section is CLOSED: renders as a standalone chevron button\r\n *     in place of the section content. Clicking re-expands the section.\r\n *\r\n * Supply `children` (node or render-prop) to fully replace the default\r\n * rendering. The render-prop receives `{ open, toggle, orientation, id }`.\r\n *\/\r\nexport function AccordionPanelTrigger({\r\n  children,\r\n  className,\r\n  \"aria-label\": ariaLabel,\r\n}: AccordionPanelTriggerProps) {\r\n  const { id, open, orientation, toggle } = useAccordionSection();\r\n  const state: SectionRenderState = { id, open, orientation, toggle };\r\n\r\n  \/\/ Custom render path \u2014 caller is in charge of look & feel.\r\n  if (children !== undefined) {\r\n    return (\r\n      <div\r\n        data-react-fancy-accordion-trigger=\"\"\r\n        data-state={open ? \"open\" : \"closed\"}\r\n        data-orientation={orientation}\r\n        className={className}\r\n      >\r\n        {renderSlot(children, state)}\r\n      <\/div>\r\n    );\r\n  }\r\n\r\n  \/\/ Default rendering ----------------------------------------------------\r\n\r\n  if (open) {\r\n    \/\/ Trailing-edge divider. The visible line is 1px (rendered via the\r\n    \/\/ ::before pseudo-element so it stays narrow); the button's actual\r\n    \/\/ hitbox is much wider (w-3 \/ h-3 = 12px) so users don't have to land\r\n    \/\/ pixel-perfect on the line. Hovering the hitbox highlights the line\r\n    \/\/ and reveals an inset chevron signalling \"click to collapse\".\r\n    return (\r\n      <button\r\n        type=\"button\"\r\n        onClick={toggle}\r\n        aria-label={ariaLabel ?? \"Collapse section\"}\r\n        data-react-fancy-accordion-trigger=\"\"\r\n        data-state=\"open\"\r\n        data-orientation={orientation}\r\n        className={cn(\r\n          \"group relative flex shrink-0 items-center justify-center cursor-pointer\",\r\n          \"text-zinc-500 dark:text-zinc-500\",\r\n          \"hover:text-zinc-900 dark:hover:text-zinc-100\",\r\n          \/\/ Wide hitbox + thin visible line (drawn via ::before).\r\n          orientation === \"horizontal\"\r\n            ? \"w-3 self-stretch\"\r\n            : \"h-3 self-stretch\",\r\n          \"before:absolute before:bg-zinc-200 dark:before:bg-zinc-700\",\r\n          \"before:transition-colors group-hover:before:bg-zinc-400 dark:group-hover:before:bg-zinc-500\",\r\n          orientation === \"horizontal\"\r\n            ? \"before:top-0 before:bottom-0 before:w-px before:left-1\/2 before:-translate-x-1\/2\"\r\n            : \"before:left-0 before:right-0 before:h-px before:top-1\/2 before:-translate-y-1\/2\",\r\n          \"transition-colors\",\r\n          className,\r\n        )}\r\n      >\r\n        <ChevronIcon\r\n          orientation={orientation}\r\n          purpose=\"collapse\"\r\n          className=\"relative opacity-0 group-hover:opacity-100 transition-opacity\"\r\n        \/>\r\n      <\/button>\r\n    );\r\n  }\r\n\r\n  \/\/ Closed: standalone chevron button. Click to re-expand.\r\n  return (\r\n    <button\r\n      type=\"button\"\r\n      onClick={toggle}\r\n      aria-label={ariaLabel ?? \"Expand section\"}\r\n      data-react-fancy-accordion-trigger=\"\"\r\n      data-state=\"closed\"\r\n      data-orientation={orientation}\r\n      className={cn(\r\n        \"flex shrink-0 items-center justify-center rounded-md\",\r\n        \"text-zinc-400 dark:text-zinc-500\",\r\n        \"hover:text-zinc-900 dark:hover:text-zinc-100\",\r\n        \"hover:bg-zinc-100 dark:hover:bg-zinc-800\",\r\n        \"transition-colors cursor-pointer\",\r\n        orientation === \"horizontal\" ? \"h-8 w-6 mx-0.5\" : \"w-8 h-6 my-0.5\",\r\n        className,\r\n      )}\r\n    >\r\n      <ChevronIcon orientation={orientation} purpose=\"expand\" \/>\r\n    <\/button>\r\n  );\r\n}\r\n\r\nAccordionPanelTrigger.displayName = \"AccordionPanelTrigger\";\r\n\r\n\/\/ \u2500\u2500 Internal chevron \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nfunction ChevronIcon({\r\n  orientation,\r\n  purpose,\r\n  className,\r\n}: {\r\n  orientation: \"horizontal\" | \"vertical\";\r\n  \/** \"expand\" \u2192 closed section, click to open. \"collapse\" \u2192 open section, click to close. *\/\r\n  purpose: \"expand\" | \"collapse\";\r\n  className?: string;\r\n}) {\r\n  \/\/ For horizontal: both states use a left-pointing chevron (matches the\r\n  \/\/ screenshot convention \u2014 closed sections show \u276e, open dividers reveal\r\n  \/\/ a \u276e on hover indicating the section will collapse leftward).\r\n  \/\/\r\n  \/\/ For vertical: closed shows down \u2304 (click to expand below); open\r\n  \/\/ divider on hover shows up \u2303 (click to collapse upward).\r\n  const transform =\r\n    orientation === \"horizontal\"\r\n      ? \"rotate(180deg)\"\r\n      : purpose === \"expand\"\r\n        ? \"rotate(90deg)\"\r\n        : \"rotate(270deg)\";\r\n\r\n  return (\r\n    <svg\r\n      viewBox=\"0 0 16 16\"\r\n      width=\"12\"\r\n      height=\"12\"\r\n      fill=\"none\"\r\n      stroke=\"currentColor\"\r\n      strokeWidth=\"2\"\r\n      strokeLinecap=\"round\"\r\n      strokeLinejoin=\"round\"\r\n      style={{ transform }}\r\n      className={className}\r\n      aria-hidden=\"true\"\r\n    >\r\n      <polyline points=\"6 4 10 8 6 12\" \/>\r\n    <\/svg>\r\n  );\r\n}\r\n","type":"registry:ui","target":"components\/fancy\/accordion-panel\/AccordionPanel.Trigger.tsx"},{"path":"components\/fancy\/accordion-panel\/AccordionPanel.context.ts","content":"import { createContext, useContext } from \"react\";\r\nimport type { AccordionOrientation } from \".\/AccordionPanel.types\";\r\n\r\n\/\/ \u2500\u2500 Panel-level context \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nexport interface AccordionPanelContextValue {\r\n  orientation: AccordionOrientation;\r\n  isOpen: (id: string) => boolean;\r\n  toggle: (id: string) => void;\r\n  open: (id: string) => void;\r\n  close: (id: string) => void;\r\n  \/** Ordered list of all section ids registered in this panel *\/\r\n  sectionIds: string[];\r\n  registerSection: (id: string) => () => void;\r\n}\r\n\r\nexport const AccordionPanelContext =\r\n  createContext<AccordionPanelContextValue | null>(null);\r\n\r\nexport function useAccordionPanel(): AccordionPanelContextValue {\r\n  const ctx = useContext(AccordionPanelContext);\r\n  if (!ctx) {\r\n    throw new Error(\r\n      \"AccordionPanel components must be used inside <AccordionPanel>\",\r\n    );\r\n  }\r\n  return ctx;\r\n}\r\n\r\n\/\/ \u2500\u2500 Section-level context \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\nexport interface AccordionSectionContextValue {\r\n  id: string;\r\n  open: boolean;\r\n  pinned: boolean;\r\n  orientation: AccordionOrientation;\r\n  toggle: () => void;\r\n}\r\n\r\nexport const AccordionSectionContext =\r\n  createContext<AccordionSectionContextValue | null>(null);\r\n\r\nexport function useAccordionSection(): AccordionSectionContextValue {\r\n  const ctx = useContext(AccordionSectionContext);\r\n  if (!ctx) {\r\n    throw new Error(\r\n      \"<AccordionPanel.Trigger> must be rendered inside <AccordionPanel.Section>\",\r\n    );\r\n  }\r\n  return ctx;\r\n}\r\n","type":"registry:ui","target":"components\/fancy\/accordion-panel\/AccordionPanel.context.ts"},{"path":"components\/fancy\/accordion-panel\/AccordionPanel.tsx","content":"import { useCallback, useMemo, useRef, useState } from \"react\";\r\nimport { cn } from \"..\/..\/utils\/cn\";\r\nimport { useControllableState } from \"..\/..\/hooks\/use-controllable-state\";\r\nimport { AccordionPanelContext } from \".\/AccordionPanel.context\";\r\nimport { AccordionPanelSection } from \".\/AccordionPanel.Section\";\r\nimport { AccordionPanelTrigger } from \".\/AccordionPanel.Trigger\";\r\nimport { AccordionPanelContent } from \".\/AccordionPanel.Content\";\r\nimport type { AccordionPanelProps } from \".\/AccordionPanel.types\";\r\n\r\n\/**\r\n * Horizontal or vertical accordion of collapsible sections.\r\n *\r\n * Use the compound parts:\r\n *   <AccordionPanel orientation=\"horizontal\" defaultValue={[\"wishlist\"]}>\r\n *     <AccordionPanel.Section id=\"home\" pinned>\r\n *       <Button icon=\"home\" \/>\r\n *     <\/AccordionPanel.Section>\r\n *     <AccordionPanel.Section id=\"wishlist\">\r\n *       <Button icon=\"list\">Wishlist<\/Button>\r\n *     <\/AccordionPanel.Section>\r\n *   <\/AccordionPanel>\r\n *\r\n * Each non-pinned section renders a trigger (default chevron-divider) that\r\n * collapses\/expands. Pass a custom `trigger` prop on a Section, or use the\r\n * exported `AccordionPanel.Trigger` directly to compose your own.\r\n *\/\r\nfunction AccordionPanelRoot({\r\n  orientation = \"horizontal\",\r\n  value: controlledValue,\r\n  defaultValue,\r\n  onValueChange,\r\n  className,\r\n  children,\r\n}: AccordionPanelProps) {\r\n  const [openIds, setOpenIds] = useControllableState<string[]>(\r\n    controlledValue,\r\n    defaultValue ?? [],\r\n    onValueChange,\r\n  );\r\n\r\n  const openSet = useMemo(() => new Set(openIds), [openIds]);\r\n\r\n  const isOpen = useCallback((id: string) => openSet.has(id), [openSet]);\r\n\r\n  const open = useCallback(\r\n    (id: string) => {\r\n      setOpenIds(openSet.has(id) ? (openIds ?? []) : [...(openIds ?? []), id]);\r\n    },\r\n    [openSet, openIds, setOpenIds],\r\n  );\r\n\r\n  const close = useCallback(\r\n    (id: string) => {\r\n      setOpenIds((openIds ?? []).filter((x) => x !== id));\r\n    },\r\n    [openIds, setOpenIds],\r\n  );\r\n\r\n  const toggle = useCallback(\r\n    (id: string) => {\r\n      setOpenIds(\r\n        openSet.has(id)\r\n          ? (openIds ?? []).filter((x) => x !== id)\r\n          : [...(openIds ?? []), id],\r\n      );\r\n    },\r\n    [openSet, openIds, setOpenIds],\r\n  );\r\n\r\n  \/\/ Track section order for downstream consumers (e.g. trigger direction\r\n  \/\/ heuristics that need to know neighbors).\r\n  const [sectionIds, setSectionIds] = useState<string[]>([]);\r\n  const orderRef = useRef<string[]>([]);\r\n\r\n  const registerSection = useCallback((id: string) => {\r\n    if (!orderRef.current.includes(id)) {\r\n      orderRef.current = [...orderRef.current, id];\r\n      setSectionIds(orderRef.current);\r\n    }\r\n    return () => {\r\n      orderRef.current = orderRef.current.filter((x) => x !== id);\r\n      setSectionIds(orderRef.current);\r\n    };\r\n  }, []);\r\n\r\n  const ctx = useMemo(\r\n    () => ({\r\n      orientation,\r\n      isOpen,\r\n      toggle,\r\n      open,\r\n      close,\r\n      sectionIds,\r\n      registerSection,\r\n    }),\r\n    [orientation, isOpen, toggle, open, close, sectionIds, registerSection],\r\n  );\r\n\r\n  return (\r\n    <AccordionPanelContext.Provider value={ctx}>\r\n      <div\r\n        data-react-fancy-accordion-panel=\"\"\r\n        data-orientation={orientation}\r\n        className={cn(\r\n          \"inline-flex items-stretch\",\r\n          orientation === \"horizontal\" ? \"flex-row\" : \"flex-col\",\r\n          className,\r\n        )}\r\n      >\r\n        {children}\r\n      <\/div>\r\n    <\/AccordionPanelContext.Provider>\r\n  );\r\n}\r\n\r\nAccordionPanelRoot.displayName = \"AccordionPanel\";\r\n\r\n\/\/ \u2500\u2500 Compound exports \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n\r\ntype AccordionPanelType = typeof AccordionPanelRoot & {\r\n  Section: typeof AccordionPanelSection;\r\n  Trigger: typeof AccordionPanelTrigger;\r\n  Content: typeof AccordionPanelContent;\r\n};\r\n\r\nexport const AccordionPanel = AccordionPanelRoot as AccordionPanelType;\r\nAccordionPanel.Section = AccordionPanelSection;\r\nAccordionPanel.Trigger = AccordionPanelTrigger;\r\nAccordionPanel.Content = AccordionPanelContent;\r\n","type":"registry:ui","target":"components\/fancy\/accordion-panel\/AccordionPanel.tsx"},{"path":"components\/fancy\/accordion-panel\/AccordionPanel.types.ts","content":"import type { ReactNode } from \"react\";\r\n\r\nexport type AccordionOrientation = \"horizontal\" | \"vertical\";\r\n\r\n\/**\r\n * Render-prop or static node accepted by Trigger.children \u2014 lets the\r\n * caller branch rendering on the section state.\r\n *\/\r\nexport type SectionRenderable =\r\n  | ReactNode\r\n  | ((state: SectionRenderState) => ReactNode);\r\n\r\nexport interface SectionRenderState {\r\n  \/** Section's id *\/\r\n  id: string;\r\n  \/** True when the section is currently open *\/\r\n  open: boolean;\r\n  \/** Direction the panel is laid out in *\/\r\n  orientation: AccordionOrientation;\r\n  \/** Toggle this section open\/closed *\/\r\n  toggle: () => void;\r\n}\r\n\r\nexport interface AccordionPanelProps {\r\n  \/** Layout direction. Horizontal for menus\/toolbars, vertical for sidebars\/panels. *\/\r\n  orientation?: AccordionOrientation;\r\n  \/** Controlled list of open section ids *\/\r\n  value?: string[];\r\n  \/** Default open section ids (uncontrolled) *\/\r\n  defaultValue?: string[];\r\n  \/** Fires whenever the open set changes *\/\r\n  onValueChange?: (open: string[]) => void;\r\n  \/** Optional class on the root container *\/\r\n  className?: string;\r\n  children: ReactNode;\r\n}\r\n\r\nexport interface AccordionPanelSectionProps {\r\n  \/** Stable id used for open-state tracking *\/\r\n  id: string;\r\n  \/**\r\n   * Pinned sections never collapse. Useful for an \"anchor\" item like a\r\n   * Home button at the start of a menu.\r\n   *\/\r\n  pinned?: boolean;\r\n  \/** Class on the section's outer container *\/\r\n  className?: string;\r\n  \/** Class applied only when the section is open *\/\r\n  openClassName?: string;\r\n  \/** Class applied only when the section is collapsed *\/\r\n  closedClassName?: string;\r\n  \/**\r\n   * Skip the default flex layout (items-center + gap-1 + flex-row\/col).\r\n   * Use this for full-bleed panel sections that need their children\r\n   * to stretch (e.g. a chat sidebar where the trigger should fill\r\n   * full panel height). The data attributes, section context, and\r\n   * conditional render of children stay in place.\r\n   *\/\r\n  unstyled?: boolean;\r\n  \/**\r\n   * Children. Compose with `<AccordionPanel.Trigger>` and\r\n   * `<AccordionPanel.Content>` \u2014 Trigger always renders, Content only\r\n   * renders when the section is open.\r\n   *\/\r\n  children: ReactNode;\r\n}\r\n\r\nexport interface AccordionPanelTriggerProps {\r\n  \/**\r\n   * Custom render. Receives section state \u2014 `{ open, toggle, ... }`. If\r\n   * omitted, the default chevron-divider is rendered.\r\n   *\/\r\n  children?: SectionRenderable;\r\n  \/** Class on the trigger element *\/\r\n  className?: string;\r\n  \/** Aria label override (default: \"Toggle section\") *\/\r\n  \"aria-label\"?: string;\r\n}\r\n","type":"registry:ui","target":"components\/fancy\/accordion-panel\/AccordionPanel.types.ts"},{"path":"components\/fancy\/accordion-panel\/index.ts","content":"export { AccordionPanel } from \".\/AccordionPanel\";\r\nexport { AccordionPanelSection } from \".\/AccordionPanel.Section\";\r\nexport { AccordionPanelTrigger } from \".\/AccordionPanel.Trigger\";\r\nexport { AccordionPanelContent } from \".\/AccordionPanel.Content\";\r\nexport {\r\n  useAccordionPanel,\r\n  useAccordionSection,\r\n} from \".\/AccordionPanel.context\";\r\nexport type {\r\n  AccordionPanelProps,\r\n  AccordionPanelSectionProps,\r\n  AccordionPanelTriggerProps,\r\n  AccordionOrientation,\r\n  SectionRenderable,\r\n  SectionRenderState,\r\n} from \".\/AccordionPanel.types\";\r\nexport type { AccordionPanelContentProps } from \".\/AccordionPanel.Content\";\r\n","type":"registry:ui","target":"components\/fancy\/accordion-panel\/index.ts"}]}