{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toggle",
  "title": "Toggle",
  "description": "A button that stays pressed, filling while on.",
  "dependencies": [
    "@base-ui/react",
    "@stylexjs/stylex"
  ],
  "registryDependencies": [
    "https://constella.aayush.cv/r/base.json",
    "https://constella.aayush.cv/r/button.json"
  ],
  "files": [
    {
      "path": "src/components/primitives/toggle.tsx",
      "content": "\"use client\";\n\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\";\nimport * as stylex from \"@stylexjs/stylex\";\n\nimport { buttonStyles } from \"@/components/primitives/button\";\nimport type { Sx } from \"@/lib/constella/styles\";\nimport { stateStyles } from \"@/lib/constella/styles\";\n\nconst toggleVariants = [\"default\", \"outline\"] as const;\nconst toggleSizes = [\n  \"sm\",\n  \"default\",\n  \"lg\",\n  \"icon-sm\",\n  \"icon\",\n  \"icon-lg\",\n] as const;\n\ntype ToggleVariant = (typeof toggleVariants)[number];\ntype ToggleSize = (typeof toggleSizes)[number];\n\ntype ToggleProps = Omit<TogglePrimitive.Props, \"className\" | \"style\"> & {\n  size?: ToggleSize;\n  sx?: Sx;\n  variant?: ToggleVariant;\n};\n\nconst variantStyles = {\n  default: stateStyles.selectedFill,\n  outline: stateStyles.selectedFillLifted,\n} satisfies Record<ToggleVariant, stylex.StyleXStyles>;\n\n/** A toggle's styles: a ghost or outline button that fills while pressed. */\nfunction toggleStyles({\n  size = \"default\",\n  variant = \"default\",\n}: { size?: ToggleSize; variant?: ToggleVariant } = {}) {\n  return [\n    buttonStyles({\n      size,\n      variant: variant === \"outline\" ? \"outline\" : \"ghost\",\n    }),\n    variantStyles[variant],\n  ];\n}\n\nfunction Toggle({\n  size = \"default\",\n  sx,\n  variant = \"default\",\n  ...props\n}: ToggleProps) {\n  return (\n    <TogglePrimitive\n      data-size={size}\n      data-slot=\"toggle\"\n      data-variant={variant}\n      {...props}\n      {...stylex.props(toggleStyles({ size, variant }), sx)}\n    />\n  );\n}\n\nexport { Toggle, toggleSizes, toggleStyles, toggleVariants };\nexport type { ToggleProps, ToggleSize, ToggleVariant };\n",
      "type": "registry:component"
    }
  ],
  "docs": "Usage: https://constella.aayush.cv/docs/components/toggle/index.md",
  "type": "registry:ui"
}