{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toggle-group",
  "type": "registry:ui",
  "title": "Toggle Group",
  "description": "Single/multiple toggle group.",
  "registryDependencies": [
    "https://raw.githubusercontent.com/truongnat/rnui/main/registry/dist/nativewind/utils.json",
    "https://raw.githubusercontent.com/truongnat/rnui/main/registry/dist/nativewind/toggle.json",
    "https://raw.githubusercontent.com/truongnat/rnui/main/registry/dist/nativewind/theme.json"
  ],
  "files": [
    {
      "path": "registry/shared/ui/toggle-group.tsx",
      "type": "registry:ui",
      "target": "components/ui/toggle-group.tsx",
      "content": "import { createContext, useContext, useState } from 'react';\nimport { View, type ViewProps } from 'react-native';\nimport { Toggle, type ToggleProps } from '@/components/ui/toggle';\nimport { cn } from '@/lib/utils';\n\ninterface GroupContextValue {\n  value: string[];\n  toggle: (v: string) => void;\n  variant?: ToggleProps['variant'];\n  size?: ToggleProps['size'];\n  disabled?: boolean;\n}\nconst GroupContext = createContext<GroupContextValue>({\n  value: [],\n  toggle: () => {},\n});\n\nexport interface ToggleGroupProps extends ViewProps {\n  type?: 'single' | 'multiple';\n  value?: string | string[];\n  /** Initial selection for uncontrolled usage. */\n  defaultValue?: string | string[];\n  onValueChange?: (value: string | string[]) => void;\n  variant?: ToggleProps['variant'];\n  size?: ToggleProps['size'];\n  /** Disables every item in the group. */\n  disabled?: boolean;\n  orientation?: 'horizontal' | 'vertical';\n  className?: string;\n}\n\nexport function ToggleGroup({\n  type = 'single',\n  value: controlled,\n  defaultValue,\n  onValueChange,\n  variant,\n  size,\n  disabled = false,\n  orientation = 'horizontal',\n  className,\n  ...props\n}: ToggleGroupProps) {\n  const toArr = (v?: string | string[]) =>\n    Array.isArray(v) ? v : v ? [v] : [];\n  const [uncontrolled, setUncontrolled] = useState<string[]>(\n    toArr(controlled ?? defaultValue)\n  );\n  const value = controlled !== undefined ? toArr(controlled) : uncontrolled;\n\n  const toggle = (v: string) => {\n    const next =\n      type === 'single'\n        ? value.includes(v)\n          ? []\n          : [v]\n        : value.includes(v)\n          ? value.filter((x) => x !== v)\n          : [...value, v];\n    if (controlled === undefined) setUncontrolled(next);\n    onValueChange?.(type === 'single' ? (next[0] ?? '') : next);\n  };\n\n  return (\n    <GroupContext.Provider value={{ value, toggle, variant, size, disabled }}>\n      <View\n        className={cn(\n          'items-center gap-1',\n          orientation === 'horizontal' ? 'flex-row' : 'flex-col items-stretch',\n          className\n        )}\n        {...props}\n      />\n    </GroupContext.Provider>\n  );\n}\n\nexport interface ToggleGroupItemProps extends Omit<ToggleProps, 'pressed'> {\n  value: string;\n}\n\nexport function ToggleGroupItem({\n  value,\n  variant,\n  size,\n  disabled,\n  ...props\n}: ToggleGroupItemProps) {\n  const group = useContext(GroupContext);\n  return (\n    <Toggle\n      pressed={group.value.includes(value)}\n      onPressedChange={() => group.toggle(value)}\n      variant={variant ?? group.variant}\n      size={size ?? group.size}\n      disabled={disabled ?? group.disabled}\n      {...props}\n    />\n  );\n}\n"
    }
  ]
}