{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "gradients",
  "type": "registry:component",
  "title": "Chart Gradients",
  "description": "LinearGradient, RadialGradient and gradient presets for chart fills (SVG defs).",
  "files": [
    {
      "path": "src/charts/gradients.tsx",
      "content": "import type { ReactNode, SVGProps } from \"react\";\n\n/**\n * SVG gradient defs with the API and markup of `@visx/gradient` 4.0.0:\n * `<defs><linearGradient|radialGradient …><stop/><stop/></…></defs>`.\n *\n * - Two stops (`from` at `fromOffset`, `to` at `toOffset`, opacities default\n *   1) unless `children` replace them.\n * - `rotate` wins over `transform` for `gradientTransform`.\n * - `LinearGradient` is vertical (`x1=0 y1=0 x2=0 y2=1`) by default, only\n *   when no coordinate is truthy; `vertical={false}` leaves them unset\n *   (left → right).\n * - Rest props go on the gradient element after the visx-owned attributes.\n */\n\ninterface LinearGradientOwnProps {\n  /** Unique id for the gradient. Should be unique across all page elements. */\n  id: string;\n  /** Start color of gradient. */\n  from?: string;\n  /** End color of gradient. */\n  to?: string;\n  /** The x coordinate of the starting point along which the linear gradient is drawn. */\n  x1?: string | number;\n  /** The x coordinate of the ending point along which the linear gradient is drawn. */\n  x2?: string | number;\n  /** The y coordinate of the starting point along which the linear gradient is drawn. */\n  y1?: string | number;\n  /** The y coordinate of the ending point along which the linear gradient is drawn. */\n  y2?: string | number;\n  /** Number or percent defining where the 'from' starting color is placed along the gradient. Default: \"0%\" */\n  fromOffset?: string | number;\n  /** Opacity of the 'from' starting color. Default: 1 */\n  fromOpacity?: string | number;\n  /** Number or percent defining where the 'to' ending color is placed along the gradient. Default: \"100%\" */\n  toOffset?: string | number;\n  /** Opacity of the 'to' ending color. Default: 1 */\n  toOpacity?: string | number;\n  /** Rotation to apply to gradient. */\n  rotate?: string | number;\n  /** Transform to apply to the gradient; `rotate` overrides it. */\n  transform?: string;\n  /** Override of the gradient's stops. */\n  children?: ReactNode;\n  /** (When no x or y values are passed), orient the gradient vertically instead of horizontally. Default: true */\n  vertical?: boolean;\n}\n\nexport type LinearGradientProps = LinearGradientOwnProps &\n  Omit<SVGProps<SVGLinearGradientElement>, keyof LinearGradientOwnProps>;\n\nexport type RadialGradientProps = Pick<\n  LinearGradientProps,\n  | \"id\"\n  | \"from\"\n  | \"to\"\n  | \"fromOffset\"\n  | \"fromOpacity\"\n  | \"toOffset\"\n  | \"toOpacity\"\n  | \"rotate\"\n  | \"transform\"\n  | \"children\"\n> &\n  SVGProps<SVGRadialGradientElement>;\n\nexport function LinearGradient({\n  children,\n  id,\n  from,\n  to,\n  x1: x1Prop,\n  y1: y1Prop,\n  x2: x2Prop,\n  y2: y2Prop,\n  fromOffset = \"0%\",\n  fromOpacity = 1,\n  toOffset = \"100%\",\n  toOpacity = 1,\n  rotate,\n  transform,\n  vertical = true,\n  ...restProps\n}: LinearGradientProps) {\n  let x1 = x1Prop;\n  let x2 = x2Prop;\n  let y1 = y1Prop;\n  let y2 = y2Prop;\n  if (vertical && !x1 && !x2 && !y1 && !y2) {\n    x1 = \"0\";\n    x2 = \"0\";\n    y1 = \"0\";\n    y2 = \"1\";\n  }\n  // An object, not JSX attributes, so the formatter keeps visx's order.\n  const props: SVGProps<SVGLinearGradientElement> = {\n    id,\n    x1,\n    y1,\n    x2,\n    y2,\n    gradientTransform: rotate ? `rotate(${rotate})` : transform,\n    ...restProps,\n  };\n  return (\n    <defs>\n      <linearGradient {...props}>\n        {!!children && children}\n        {!children && (\n          <stop\n            offset={fromOffset}\n            stopColor={from}\n            stopOpacity={fromOpacity}\n          />\n        )}\n        {!children && (\n          <stop offset={toOffset} stopColor={to} stopOpacity={toOpacity} />\n        )}\n      </linearGradient>\n    </defs>\n  );\n}\n\nexport function RadialGradient({\n  children,\n  id,\n  from,\n  to,\n  fromOffset = \"0%\",\n  fromOpacity = 1,\n  toOffset = \"100%\",\n  toOpacity = 1,\n  rotate,\n  transform,\n  ...restProps\n}: RadialGradientProps) {\n  const props: SVGProps<SVGRadialGradientElement> = {\n    id,\n    gradientTransform: rotate ? `rotate(${rotate})` : transform,\n    ...restProps,\n  };\n  return (\n    <defs>\n      <radialGradient {...props}>\n        {!!children && children}\n        {!children && (\n          <stop\n            offset={fromOffset}\n            stopColor={from}\n            stopOpacity={fromOpacity}\n          />\n        )}\n        {!children && (\n          <stop offset={toOffset} stopColor={to} stopOpacity={toOpacity} />\n        )}\n      </radialGradient>\n    </defs>\n  );\n}\n\n// Preset colour pairs (visx defaults). All props pass through to\n// `<LinearGradient {...props} />`.\n\nexport function GradientDarkgreenGreen({\n  from = \"#184E86\",\n  to = \"#57CA85\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n\nexport function GradientLightgreenGreen({\n  from = \"#42E695\",\n  to = \"#3BB2B8\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n\nexport function GradientOrangeRed({\n  from = \"#FCE38A\",\n  to = \"#F38181\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n\nexport function GradientPinkBlue({\n  from = \"#F02FC2\",\n  to = \"#6094EA\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n\nexport function GradientPinkRed({\n  from = \"#F54EA2\",\n  to = \"#FF7676\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n\nexport function GradientPurpleOrange({\n  from = \"#7117EA\",\n  to = \"#EA6060\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n\nexport function GradientPurpleTeal({\n  from = \"#5B247A\",\n  to = \"#1BCEDF\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n\nexport function GradientSteelPurple({\n  from = \"#65799B\",\n  to = \"#5E2563\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n\nexport function GradientTealBlue({\n  from = \"#17EAD9\",\n  to = \"#6078EA\",\n  ...restProps\n}: LinearGradientProps) {\n  return <LinearGradient from={from} to={to} {...restProps} />;\n}\n",
      "type": "registry:component",
      "target": "components/charts/gradients.tsx"
    }
  ]
}