@multicomma/arkcn 0.1.2 → 0.1.3

package/registry/items/chart.json

@@ -10,6 +10,1769 @@
     "ChartLegendContent",
     "ChartStyle"
   ],
+  "parts": [
+    {
+      "name": "ChartContainer",
+      "props": [
+        {
+          "name": "config",
+          "type": "ChartConfig",
+          "required": true,
+          "description": "Series config: label, icon, and color (or theme colors) per data key; exposed as `--color-<key>`.",
+          "from": "arkcn"
+        },
+        {
+          "name": "initialDimension",
+          "type": "{ width: number; height: number; }",
+          "required": false,
+          "default": "INITIAL_DIMENSION",
+          "description": "Width and height used before the container measures itself.",
+          "from": "arkcn"
+        },
+        {
+          "name": "children",
+          "type": "ReactNode",
+          "required": true,
+          "description": "Content rendered inside the part.",
+          "from": "@types/react"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "required": false,
+          "description": "Extra classes merged into the part's own classes with `cn`.",
+          "from": "@types/react"
+        },
+        {
+          "name": "style",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "Inline styles applied to the rendered element.",
+          "from": "@types/react"
+        }
+      ]
+    },
+    {
+      "name": "ChartTooltip",
+      "props": [
+        {
+          "name": "active",
+          "type": "boolean",
+          "required": false,
+          "description": "If true, then Tooltip is always displayed, once an activeIndex is set by mouse over, or programmatically.\nIf false, then Tooltip is never displayed.\nIf undefined, Recharts will control when the Tooltip displays. This includes mouse and keyboard controls.",
+          "from": "recharts"
+        },
+        {
+          "name": "allowEscapeViewBox",
+          "type": "AllowInDimension",
+          "required": false,
+          "description": "This option allows the tooltip to extend beyond the viewBox of the chart itself.",
+          "from": "recharts"
+        },
+        {
+          "name": "animationDuration",
+          "type": "number",
+          "required": false,
+          "description": "Specifies the duration of animation, the unit of this option is ms.",
+          "from": "recharts"
+        },
+        {
+          "name": "animationEasing",
+          "type": "EasingInput",
+          "required": false,
+          "description": "The type of easing function.",
+          "from": "recharts"
+        },
+        {
+          "name": "axisId",
+          "type": "AxisId",
+          "required": false,
+          "description": "Tooltip always attaches itself to the \"Tooltip\" axis. Which axis is it? Depends on the layout:\n- horizontal layout -> X axis\n- vertical layout -> Y axis\n- radial layout -> radial axis\n- centric layout -> angle axis\n\nTooltip will use the default axis for the layout, unless you specify an axisId.",
+          "from": "recharts"
+        },
+        {
+          "name": "content",
+          "type": "ContentType<ValueType, NameType>",
+          "required": false,
+          "description": "Renders the content of the tooltip.\n\nThis should return HTML elements, not SVG elements.\n\n- If not set, the {@link DefaultTooltipContent } component is used.\n- If set to a React element, this element will be cloned and extra props will be passed in.\n- If set to a function, the function will be called and should return HTML elements.",
+          "from": "recharts"
+        },
+        {
+          "name": "contentStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "CSS styles to be applied to the wrapper `div` element.",
+          "from": "recharts"
+        },
+        {
+          "name": "cursor",
+          "type": "CursorDefinition",
+          "required": false,
+          "description": "If set false, no cursor will be drawn when tooltip is active.\nIf set a object, the option is the configuration of cursor.\nIf set a React element, the option is the custom react element of drawing cursor.",
+          "from": "recharts"
+        },
+        {
+          "name": "defaultIndex",
+          "type": "number | TooltipIndex",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "filterNull",
+          "type": "boolean",
+          "required": false,
+          "description": "When an item of the payload has value null or undefined, this item won't be displayed.",
+          "from": "recharts"
+        },
+        {
+          "name": "formatter",
+          "type": "(Formatter<ValueType, NameType> & ((value: ValueType, name: NameType, item: TooltipPayloadEntry, index: number, payload: TooltipPayload) => ReactNode | [Reac…",
+          "required": false,
+          "description": "Function to customize the value in the tooltip.\nIf you return an array, the first entry will be the formatted \"value\", and the second entry will be the formatted \"name\"",
+          "from": "recharts"
+        },
+        {
+          "name": "includeHidden",
+          "type": "boolean",
+          "required": false,
+          "description": "If true, the tooltip will display information about hidden series.\nDefaults to false.\nInteracting with the hide property of Area, Bar, Line, Scatter.",
+          "from": "recharts"
+        },
+        {
+          "name": "isAnimationActive",
+          "type": "boolean | \"auto\"",
+          "required": false,
+          "description": "If set false, animation of tooltip will be disabled.\nIf set \"auto\", the animation will be disabled in SSR and will respect the user's prefers-reduced-motion system preference for accessibility.",
+          "from": "recharts"
+        },
+        {
+          "name": "itemSorter",
+          "type": "(TooltipItemSorter<ValueType, NameType> & TooltipItemSorter)",
+          "required": false,
+          "description": "Sorts tooltip items.\nDefaults to 'name' which means it sorts alphabetically by graphical item `name` property.",
+          "from": "recharts"
+        },
+        {
+          "name": "itemStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "Style of individual items inside the tooltip, a `<li>` element.\nThese show the data label (name, or dataKey) and value.\n\nIf a chart has multiple graphical items then the Tooltip renders multiple item\nand each of them gets this itemStyle applied.",
+          "from": "recharts"
+        },
+        {
+          "name": "labelClassName",
+          "type": "string",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "labelFormatter",
+          "type": "(((label: ReactNode, payload: readonly Payload<ValueType, NameType>[]) => ReactNode) & ((label: ReactNode, payload: TooltipPayload) => ReactNode))",
+          "required": false,
+          "description": "The formatter function of label in tooltip.",
+          "from": "recharts"
+        },
+        {
+          "name": "labelStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "\"Label\" is the tooltip title.\nRenders once on the top of tooltip and shows categorical axis value.\n\nEven if there are multiple graphical items in the chart, only one label gets rendered.\n\nNote that \"Label\" in tooltip is the header, which is different from {@link Legend }\nwhere \"labelStyle\" are the individual items.",
+          "from": "recharts"
+        },
+        {
+          "name": "offset",
+          "type": "number | Coordinate",
+          "required": false,
+          "description": "The offset size between the position of tooltip and the mouse cursor position.\nWhen a number is provided, the same offset is applied to both x and y axes.\n\nWhen a Coordinate object is provided, you can specify different offsets for each axis (x and y as numbers)",
+          "from": "recharts"
+        },
+        {
+          "name": "payloadUniqBy",
+          "type": "UniqueOption<TooltipPayloadEntry>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "portal",
+          "type": "HTMLElement | null",
+          "required": false,
+          "description": "If portal is defined, then Tooltip will use this element as a target\nfor rendering using React Portal: https://react.dev/reference/react-dom/createPortal\n\nIf this is undefined then Tooltip renders inside the recharts-wrapper element.",
+          "from": "recharts"
+        },
+        {
+          "name": "position",
+          "type": "Partial<Coordinate>",
+          "required": false,
+          "description": "If this field is set, the tooltip will be displayed at the specified position\nregardless of the mouse position.\n\nYou can set a single field (x or y) and let the other field be calculated automatically based\non the mouse position.",
+          "from": "recharts"
+        },
+        {
+          "name": "reverseDirection",
+          "type": "AllowInDimension",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "separator",
+          "type": "string",
+          "required": false,
+          "description": "The separator between name and value.",
+          "from": "recharts"
+        },
+        {
+          "name": "shared",
+          "type": "boolean",
+          "required": false,
+          "description": "Defines whether the tooltip is reacting to the current data point,\nor to all data points at the current axis coordinate.\n\n- `true`: tooltip will appear on top of all bars on an axis tick.\n- `false`: tooltip will appear on individual bars.\n\nDifferent chart types allow different modes, and have different defaults.",
+          "from": "recharts"
+        },
+        {
+          "name": "trigger",
+          "type": "TooltipTrigger",
+          "required": false,
+          "description": "If `hover` then the Tooltip shows on mouse enter and hides on mouse leave.\n\nIf `click` then the Tooltip shows after clicking and stays active.",
+          "from": "recharts"
+        },
+        {
+          "name": "useTranslate3d",
+          "type": "boolean",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "wrapperClassName",
+          "type": "string",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "wrapperStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "CSS styles to be applied to the wrapper `div` element.",
+          "from": "recharts"
+        }
+      ]
+    },
+    {
+      "name": "ChartTooltipContent",
+      "props": [
+        {
+          "name": "hideIndicator",
+          "type": "boolean",
+          "required": false,
+          "default": "false",
+          "description": "Hide the color indicator in each row.",
+          "from": "arkcn"
+        },
+        {
+          "name": "hideLabel",
+          "type": "boolean",
+          "required": false,
+          "default": "false",
+          "description": "Hide the tooltip label.",
+          "from": "arkcn"
+        },
+        {
+          "name": "indicator",
+          "type": "\"line\" | \"dot\" | \"dashed\"",
+          "required": false,
+          "default": "\"dot\"",
+          "description": "Indicator style: `dot`, `line`, or `dashed`.",
+          "from": "arkcn"
+        },
+        {
+          "name": "labelKey",
+          "type": "string",
+          "required": false,
+          "description": "Data key used for the tooltip label.",
+          "from": "arkcn"
+        },
+        {
+          "name": "nameKey",
+          "type": "string",
+          "required": false,
+          "description": "Data key used for the series name.",
+          "from": "arkcn"
+        },
+        {
+          "name": "active",
+          "type": "boolean",
+          "required": false,
+          "description": "If true, then Tooltip is always displayed, once an activeIndex is set by mouse over, or programmatically.\nIf false, then Tooltip is never displayed.\nIf undefined, Recharts will control when the Tooltip displays. This includes mouse and keyboard controls.",
+          "from": "recharts"
+        },
+        {
+          "name": "allowEscapeViewBox",
+          "type": "AllowInDimension",
+          "required": false,
+          "description": "This option allows the tooltip to extend beyond the viewBox of the chart itself.",
+          "from": "recharts"
+        },
+        {
+          "name": "animationDuration",
+          "type": "number",
+          "required": false,
+          "description": "Specifies the duration of animation, the unit of this option is ms.",
+          "from": "recharts"
+        },
+        {
+          "name": "animationEasing",
+          "type": "EasingInput",
+          "required": false,
+          "description": "The type of easing function.",
+          "from": "recharts"
+        },
+        {
+          "name": "axisId",
+          "type": "AxisId",
+          "required": false,
+          "description": "Tooltip always attaches itself to the \"Tooltip\" axis. Which axis is it? Depends on the layout:\n- horizontal layout -> X axis\n- vertical layout -> Y axis\n- radial layout -> radial axis\n- centric layout -> angle axis\n\nTooltip will use the default axis for the layout, unless you specify an axisId.",
+          "from": "recharts"
+        },
+        {
+          "name": "children",
+          "type": "ReactNode",
+          "required": false,
+          "description": "Content rendered inside the part.",
+          "from": "@types/react"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "required": false,
+          "description": "Extra classes merged into the part's own classes with `cn`.",
+          "from": "@types/react"
+        },
+        {
+          "name": "content",
+          "type": "(ContentType<ValueType, NameType> & string)",
+          "required": false,
+          "description": "Renders the content of the tooltip.\n\nThis should return HTML elements, not SVG elements.\n\n- If not set, the {@link DefaultTooltipContent } component is used.\n- If set to a React element, this element will be cloned and extra props will be passed in.\n- If set to a function, the function will be called and should return HTML elements.",
+          "from": "recharts"
+        },
+        {
+          "name": "contentStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "CSS styles to be applied to the wrapper `div` element.",
+          "from": "recharts"
+        },
+        {
+          "name": "cursor",
+          "type": "CursorDefinition",
+          "required": false,
+          "description": "If set false, no cursor will be drawn when tooltip is active.\nIf set a object, the option is the configuration of cursor.\nIf set a React element, the option is the custom react element of drawing cursor.",
+          "from": "recharts"
+        },
+        {
+          "name": "defaultIndex",
+          "type": "number | TooltipIndex",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "filterNull",
+          "type": "boolean",
+          "required": false,
+          "description": "When an item of the payload has value null or undefined, this item won't be displayed.",
+          "from": "recharts"
+        },
+        {
+          "name": "formatter",
+          "type": "(Formatter<ValueType, NameType> & ((value: ValueType, name: NameType, item: TooltipPayloadEntry, index: number, payload: TooltipPayload) => ReactNode | [Reac…",
+          "required": false,
+          "description": "Function to customize the value in the tooltip.\nIf you return an array, the first entry will be the formatted \"value\", and the second entry will be the formatted \"name\"",
+          "from": "recharts"
+        },
+        {
+          "name": "includeHidden",
+          "type": "boolean",
+          "required": false,
+          "description": "If true, the tooltip will display information about hidden series.\nDefaults to false.\nInteracting with the hide property of Area, Bar, Line, Scatter.",
+          "from": "recharts"
+        },
+        {
+          "name": "isAnimationActive",
+          "type": "boolean | \"auto\"",
+          "required": false,
+          "description": "If set false, animation of tooltip will be disabled.\nIf set \"auto\", the animation will be disabled in SSR and will respect the user's prefers-reduced-motion system preference for accessibility.",
+          "from": "recharts"
+        },
+        {
+          "name": "itemSorter",
+          "type": "(TooltipItemSorter<ValueType, NameType> & (TooltipItemSorter & TooltipItemSorter<ValueType, TooltipNameType>))",
+          "required": false,
+          "description": "Sorts tooltip items.\nDefaults to 'name' which means it sorts alphabetically by graphical item `name` property.",
+          "from": "recharts"
+        },
+        {
+          "name": "itemStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "Style of individual items inside the tooltip, a `<li>` element.\nThese show the data label (name, or dataKey) and value.\n\nIf a chart has multiple graphical items then the Tooltip renders multiple item\nand each of them gets this itemStyle applied.",
+          "from": "recharts"
+        },
+        {
+          "name": "label",
+          "type": "ReactNode",
+          "required": false,
+          "description": "Accessible label.",
+          "from": "recharts"
+        },
+        {
+          "name": "labelClassName",
+          "type": "string",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "labelFormatter",
+          "type": "(((label: ReactNode, payload: readonly Payload<ValueType, NameType>[]) => ReactNode) & ((label: ReactNode, payload: TooltipPayload) => ReactNode) & ((label: …",
+          "required": false,
+          "description": "The formatter function of label in tooltip.",
+          "from": "recharts"
+        },
+        {
+          "name": "labelStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "\"Label\" is the tooltip title.\nRenders once on the top of tooltip and shows categorical axis value.\n\nEven if there are multiple graphical items in the chart, only one label gets rendered.\n\nNote that \"Label\" in tooltip is the header, which is different from {@link Legend }\nwhere \"labelStyle\" are the individual items.",
+          "from": "recharts"
+        },
+        {
+          "name": "offset",
+          "type": "number | Coordinate",
+          "required": false,
+          "description": "The offset size between the position of tooltip and the mouse cursor position.\nWhen a number is provided, the same offset is applied to both x and y axes.\n\nWhen a Coordinate object is provided, you can specify different offsets for each axis (x and y as numbers)",
+          "from": "recharts"
+        },
+        {
+          "name": "payload",
+          "type": "readonly Payload<ValueType, TooltipNameType>[]",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "payloadUniqBy",
+          "type": "UniqueOption<TooltipPayloadEntry>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "portal",
+          "type": "HTMLElement | null",
+          "required": false,
+          "description": "If portal is defined, then Tooltip will use this element as a target\nfor rendering using React Portal: https://react.dev/reference/react-dom/createPortal\n\nIf this is undefined then Tooltip renders inside the recharts-wrapper element.",
+          "from": "recharts"
+        },
+        {
+          "name": "position",
+          "type": "Partial<Coordinate>",
+          "required": false,
+          "description": "If this field is set, the tooltip will be displayed at the specified position\nregardless of the mouse position.\n\nYou can set a single field (x or y) and let the other field be calculated automatically based\non the mouse position.",
+          "from": "recharts"
+        },
+        {
+          "name": "reverseDirection",
+          "type": "AllowInDimension",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "separator",
+          "type": "string",
+          "required": false,
+          "description": "The separator between name and value.",
+          "from": "recharts"
+        },
+        {
+          "name": "shared",
+          "type": "boolean",
+          "required": false,
+          "description": "Defines whether the tooltip is reacting to the current data point,\nor to all data points at the current axis coordinate.\n\n- `true`: tooltip will appear on top of all bars on an axis tick.\n- `false`: tooltip will appear on individual bars.\n\nDifferent chart types allow different modes, and have different defaults.",
+          "from": "recharts"
+        },
+        {
+          "name": "style",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "Inline styles applied to the rendered element.",
+          "from": "@types/react"
+        },
+        {
+          "name": "trigger",
+          "type": "TooltipTrigger",
+          "required": false,
+          "description": "If `hover` then the Tooltip shows on mouse enter and hides on mouse leave.\n\nIf `click` then the Tooltip shows after clicking and stays active.",
+          "from": "recharts"
+        },
+        {
+          "name": "useTranslate3d",
+          "type": "boolean",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "wrapperClassName",
+          "type": "string",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "wrapperStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "CSS styles to be applied to the wrapper `div` element.",
+          "from": "recharts"
+        }
+      ]
+    },
+    {
+      "name": "ChartLegend",
+      "props": [
+        {
+          "name": "align",
+          "type": "HorizontalAlignmentType",
+          "required": false,
+          "description": "Alignment along the side.",
+          "from": "recharts"
+        },
+        {
+          "name": "children",
+          "type": "ReactNode",
+          "required": false,
+          "description": "Content rendered inside the part.",
+          "from": "recharts"
+        },
+        {
+          "name": "content",
+          "type": "ContentType",
+          "required": false,
+          "description": "Renders the content of the legend.\n\nThis should return HTML elements, not SVG elements.\n\n- If not set, the {@link DefaultLegendContent } component is used.\n- If set to a React element, this element will be cloned and extra props will be passed in.\n- If set to a function, the function will be called and should return HTML elements.",
+          "from": "recharts"
+        },
+        {
+          "name": "dangerouslySetInnerHTML",
+          "type": "{ __html: string; }",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "formatter",
+          "type": "Formatter",
+          "required": false,
+          "description": "Function to customize how content is serialized before rendering.\n\nThis should return HTML elements, or strings.",
+          "from": "recharts"
+        },
+        {
+          "name": "height",
+          "type": "string | number",
+          "required": false,
+          "description": "Height of the legend.\nAccept CSS style string values like `100%` or `fit-content`, or number values like `400`.",
+          "from": "recharts"
+        },
+        {
+          "name": "iconSize",
+          "type": "number",
+          "required": false,
+          "description": "The size of icon in each legend item.",
+          "from": "recharts"
+        },
+        {
+          "name": "iconType",
+          "type": "LegendType",
+          "required": false,
+          "description": "The type of icon in each legend item.",
+          "from": "recharts"
+        },
+        {
+          "name": "inactiveColor",
+          "type": "string",
+          "required": false,
+          "description": "The color of the icon when the item is inactive.",
+          "from": "recharts"
+        },
+        {
+          "name": "itemSorter",
+          "type": "LegendItemSorter | null",
+          "required": false,
+          "description": "Sorts Legend items. Defaults to `value` which means it will sort alphabetically\nby the label.\n\nIf `null` is provided then the payload is not sorted. Be aware that without sort,\nthe order of items may change between renders!",
+          "from": "recharts"
+        },
+        {
+          "name": "labelStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "Style of individual items inside the Legend, a `<span>` element.\nThese show the data label (name, or dataKey) and value.\n\nIf a chart has multiple graphical items then the Legend renders multiple item\nand each of them gets this itemStyle applied.\n\nPie charts render multiple labels from a single data series.\n\nNote that this is different from {@link Tooltip }:\n- in Tooltip: \"labelStyle\" styles the title / header\n- in Tooltip: \"itemStyle\" styles the individual data points\n- in Legend: \"labelStyle\" styles the individual data points\n\nBeware of the naming inconsistency!",
+          "from": "recharts"
+        },
+        {
+          "name": "layout",
+          "type": "\"auto\" | CartesianLayout",
+          "required": false,
+          "description": "The layout of legend items inside the legend container.\n\nWhen `auto` then the layout is decided based on the `position` prop:\n- in `left`|`right` positions, the layout is vertical\n- otherwise horizontal\n- if position is undefined, also horizontal\n\n`auto` value is new since 3.10",
+          "from": "recharts"
+        },
+        {
+          "name": "offset",
+          "type": "number",
+          "required": false,
+          "description": "The offset to the specified `position`. Direction of the offset depends on the position.",
+          "from": "recharts"
+        },
+        {
+          "name": "onAbort",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAbortCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAnimationEnd",
+          "type": "AdaptChildAnimationEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAnimationEndCapture",
+          "type": "AdaptChildAnimationEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAnimationIteration",
+          "type": "AdaptChildAnimationEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAnimationIterationCapture",
+          "type": "AdaptChildAnimationEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAnimationStart",
+          "type": "AdaptChildAnimationEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAnimationStartCapture",
+          "type": "AdaptChildAnimationEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAuxClick",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onAuxClickCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onBBoxUpdate",
+          "type": "((box: ElementOffset | null) => void)",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onBeforeInput",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onBeforeInputCapture",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onBlur",
+          "type": "AdaptChildFocusEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "description": "Blur handler.",
+          "from": "recharts"
+        },
+        {
+          "name": "onBlurCapture",
+          "type": "AdaptChildFocusEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCanPlay",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCanPlayCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCanPlayThrough",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCanPlayThroughCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onChange",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "description": "Change handler.",
+          "from": "recharts"
+        },
+        {
+          "name": "onChangeCapture",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onClick",
+          "type": "((data: LegendPayload, index: number, event: MouseEvent<HTMLElement, MouseEvent>) => void)",
+          "required": false,
+          "description": "The customized event handler of click on the items in this group",
+          "from": "recharts"
+        },
+        {
+          "name": "onClickCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCompositionEnd",
+          "type": "AdaptChildCompositionEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCompositionEndCapture",
+          "type": "AdaptChildCompositionEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCompositionStart",
+          "type": "AdaptChildCompositionEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCompositionStartCapture",
+          "type": "AdaptChildCompositionEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCompositionUpdate",
+          "type": "AdaptChildCompositionEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCompositionUpdateCapture",
+          "type": "AdaptChildCompositionEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onContextMenu",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onContextMenuCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCopy",
+          "type": "AdaptChildClipboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCopyCapture",
+          "type": "AdaptChildClipboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCut",
+          "type": "AdaptChildClipboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onCutCapture",
+          "type": "AdaptChildClipboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDoubleClick",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDoubleClickCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDrag",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragCapture",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragEnd",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragEndCapture",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragEnter",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragEnterCapture",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragExit",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragExitCapture",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragLeave",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragLeaveCapture",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragOver",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragOverCapture",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragStart",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDragStartCapture",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDrop",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDropCapture",
+          "type": "AdaptChildDragEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDurationChange",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onDurationChangeCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onEmptied",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onEmptiedCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onEncrypted",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onEncryptedCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onEnded",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onEndedCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onError",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onErrorCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onFocus",
+          "type": "AdaptChildFocusEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "description": "Focus handler.",
+          "from": "recharts"
+        },
+        {
+          "name": "onFocusCapture",
+          "type": "AdaptChildFocusEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onGotPointerCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onGotPointerCaptureCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onInput",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onInputCapture",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onInvalid",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onInvalidCapture",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onKeyDown",
+          "type": "AdaptChildKeyboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "description": "Key handler, called before the part's own key handling.",
+          "from": "recharts"
+        },
+        {
+          "name": "onKeyDownCapture",
+          "type": "AdaptChildKeyboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onKeyPress",
+          "type": "AdaptChildKeyboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onKeyPressCapture",
+          "type": "AdaptChildKeyboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onKeyUp",
+          "type": "AdaptChildKeyboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onKeyUpCapture",
+          "type": "AdaptChildKeyboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLoad",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLoadCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLoadedData",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLoadedDataCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLoadedMetadata",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLoadedMetadataCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLoadStart",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLoadStartCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLostPointerCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onLostPointerCaptureCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseDown",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseDownCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseEnter",
+          "type": "((data: LegendPayload, index: number, event: MouseEvent<HTMLElement, MouseEvent>) => void)",
+          "required": false,
+          "description": "The customized event handler of mouseenter on the items in this group",
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseLeave",
+          "type": "((data: LegendPayload, index: number, event: MouseEvent<HTMLElement, MouseEvent>) => void)",
+          "required": false,
+          "description": "The customized event handler of mouseleave on the items in this group",
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseMove",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseMoveCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseOut",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseOutCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseOver",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseOverCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseUp",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onMouseUpCapture",
+          "type": "AdaptChildMouseEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPaste",
+          "type": "AdaptChildClipboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPasteCapture",
+          "type": "AdaptChildClipboardEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPause",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPauseCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPlay",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPlayCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPlaying",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPlayingCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerCancel",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerCancelCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerDown",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerDownCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerEnter",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerEnterCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerLeave",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerLeaveCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerMove",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerMoveCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerOut",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerOutCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerOver",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerOverCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerUp",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerUpCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onProgress",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onProgressCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onRateChange",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onRateChangeCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onReset",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onResetCapture",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onScroll",
+          "type": "AdaptChildUIEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onScrollCapture",
+          "type": "AdaptChildUIEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSeeked",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSeekedCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSeeking",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSeekingCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSelect",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "description": "Called when an item is selected.",
+          "from": "recharts"
+        },
+        {
+          "name": "onSelectCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onStalled",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onStalledCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSubmit",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSubmitCapture",
+          "type": "AdaptChildFormEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSuspend",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onSuspendCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTimeUpdate",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTimeUpdateCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTouchCancel",
+          "type": "AdaptChildTouchEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTouchCancelCapture",
+          "type": "AdaptChildTouchEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTouchEnd",
+          "type": "AdaptChildTouchEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTouchEndCapture",
+          "type": "AdaptChildTouchEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTouchMove",
+          "type": "AdaptChildTouchEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTouchMoveCapture",
+          "type": "AdaptChildTouchEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTouchStart",
+          "type": "AdaptChildTouchEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTouchStartCapture",
+          "type": "AdaptChildTouchEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTransitionEnd",
+          "type": "AdaptChildTransitionEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onTransitionEndCapture",
+          "type": "AdaptChildTransitionEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onVolumeChange",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onVolumeChangeCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onWaiting",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onWaitingCapture",
+          "type": "AdaptChildReactEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onWheel",
+          "type": "AdaptChildWheelEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onWheelCapture",
+          "type": "AdaptChildWheelEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "payloadUniqBy",
+          "type": "UniqueOption<LegendPayload>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "portal",
+          "type": "HTMLElement | null",
+          "required": false,
+          "description": "If portal is defined, then Legend will use this element as a target\nfor rendering using React Portal.\n\nIf this is undefined then Legend renders inside the recharts-wrapper element.",
+          "from": "recharts"
+        },
+        {
+          "name": "position",
+          "type": "CartesianPosition",
+          "required": false,
+          "description": "The position of the legend relative to the chart.\nIf this is defined, it overrides `align` and `verticalAlign`.",
+          "from": "recharts"
+        },
+        {
+          "name": "verticalAlign",
+          "type": "VerticalAlignmentType",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "width",
+          "type": "string | number",
+          "required": false,
+          "description": "Width of the legend.\nAccept CSS style string values like `100%` or `fit-content`, or number values like `400`.",
+          "from": "recharts"
+        },
+        {
+          "name": "wrapperStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "CSS styles to be applied to the wrapper `div` element.",
+          "from": "recharts"
+        }
+      ]
+    },
+    {
+      "name": "ChartLegendContent",
+      "props": [
+        {
+          "name": "hideIcon",
+          "type": "boolean",
+          "required": false,
+          "default": "false",
+          "description": "Hide the series icon.",
+          "from": "arkcn"
+        },
+        {
+          "name": "nameKey",
+          "type": "string",
+          "required": false,
+          "description": "Data key used for the series name.",
+          "from": "arkcn"
+        },
+        {
+          "name": "align",
+          "type": "HorizontalAlignmentType",
+          "required": false,
+          "description": "Alignment along the side.",
+          "from": "recharts"
+        },
+        {
+          "name": "children",
+          "type": "ReactNode",
+          "required": false,
+          "description": "Content rendered inside the part.",
+          "from": "@types/react"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "required": false,
+          "description": "Extra classes merged into the part's own classes with `cn`.",
+          "from": "@types/react"
+        },
+        {
+          "name": "formatter",
+          "type": "Formatter",
+          "required": false,
+          "description": "Function to customize how content is serialized before rendering.\n\nThis should return HTML elements, or strings.",
+          "from": "recharts"
+        },
+        {
+          "name": "iconSize",
+          "type": "number",
+          "required": false,
+          "description": "The size of icon in each legend item.",
+          "from": "recharts"
+        },
+        {
+          "name": "iconType",
+          "type": "LegendType",
+          "required": false,
+          "description": "The type of icon in each legend item.",
+          "from": "recharts"
+        },
+        {
+          "name": "inactiveColor",
+          "type": "string",
+          "required": false,
+          "description": "The color of the icon when the item is inactive.",
+          "from": "recharts"
+        },
+        {
+          "name": "labelStyle",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "Style of individual items inside the Legend, a `<span>` element.\nThese show the data label (name, or dataKey) and value.\n\nIf a chart has multiple graphical items then the Legend renders multiple item\nand each of them gets this itemStyle applied.\n\nPie charts render multiple labels from a single data series.\n\nNote that this is different from {@link Tooltip }:\n- in Tooltip: \"labelStyle\" styles the title / header\n- in Tooltip: \"itemStyle\" styles the individual data points\n- in Legend: \"labelStyle\" styles the individual data points\n\nBeware of the naming inconsistency!",
+          "from": "recharts"
+        },
+        {
+          "name": "layout",
+          "type": "CartesianLayout",
+          "required": false,
+          "description": "The layout of legend items inside the legend container.",
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerEnterCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "onPointerLeaveCapture",
+          "type": "AdaptChildPointerEventHandler<LegendPayload, ReactElement<unknown, string | JSXElementConstructor<any>>>",
+          "required": false,
+          "from": "recharts"
+        },
+        {
+          "name": "payload",
+          "type": "readonly LegendPayload[]",
+          "required": false,
+          "description": "DefaultLegendContent.payload is omitted from Legend props.\nA custom payload can be passed here if desired, or it can be passed from the Legend \"content\" callback.",
+          "from": "recharts"
+        },
+        {
+          "name": "style",
+          "type": "CSSProperties",
+          "required": false,
+          "description": "Inline styles applied to the rendered element.",
+          "from": "@types/react"
+        },
+        {
+          "name": "verticalAlign",
+          "type": "VerticalAlignmentType",
+          "required": false,
+          "default": "\"bottom\"",
+          "from": "recharts"
+        }
+      ]
+    },
+    {
+      "name": "ChartStyle",
+      "props": [
+        {
+          "name": "config",
+          "type": "ChartConfig",
+          "required": true,
+          "description": "Series config: label, icon, and color (or theme colors) per data key; exposed as `--color-<key>`.",
+          "from": "arkcn"
+        },
+        {
+          "name": "id",
+          "type": "string",
+          "required": true,
+          "description": "Unique id for the generated style element.",
+          "from": "arkcn"
+        }
+      ]
+    }
+  ],
   "dependencies": {
     "recharts": "^3.8.0"
   },
@@ -19,7 +1782,7 @@
   "files": [
     {
       "path": "components/ui/chart.tsx",
-      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport * as RechartsPrimitive from \"recharts\"\nimport type { TooltipValueType } from \"recharts\"\n\n// Format: { THEME_NAME: CSS_SELECTOR }\nconst THEMES = { light: \"\", dark: \".dark\" } as const\n\nconst INITIAL_DIMENSION = { width: 320, height: 200 } as const\ntype TooltipNameType = number | string\n\nexport type ChartConfig = Record<\n  string,\n  {\n    label?: React.ReactNode\n    icon?: React.ComponentType\n  } & ({ color?: string; theme?: never } | { color?: never; theme: Record<keyof typeof THEMES, string> })\n>\n\ntype ChartContextProps = {\n  config: ChartConfig\n}\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null)\n\nfunction useChart() {\n  const context = React.useContext(ChartContext)\n\n  if (!context) {\n    throw new Error(\"useChart must be used within a <ChartContainer />\")\n  }\n\n  return context\n}\n\nfunction ChartContainer({\n  id,\n  className,\n  children,\n  config,\n  initialDimension = INITIAL_DIMENSION,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  config: ChartConfig\n  children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>[\"children\"]\n  initialDimension?: {\n    width: number\n    height: number\n  }\n}) {\n  const uniqueId = React.useId()\n  const chartId = `chart-${id ?? uniqueId.replace(/:/g, \"\")}`\n\n  return (\n    <ChartContext.Provider value={{ config }}>\n      <div\n        data-slot=\"chart\"\n        data-chart={chartId}\n        className={cn(\n          \"flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden\",\n          className\n        )}\n        {...props}\n      >\n        <ChartStyle id={chartId} config={config} />\n        <RechartsPrimitive.ResponsiveContainer initialDimension={initialDimension}>\n          {children}\n        </RechartsPrimitive.ResponsiveContainer>\n      </div>\n    </ChartContext.Provider>\n  )\n}\n\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\n  const colorConfig = Object.entries(config).filter(([, config]) => config.theme ?? config.color)\n\n  if (!colorConfig.length) {\n    return null\n  }\n\n  return (\n    <style\n      dangerouslySetInnerHTML={{\n        __html: Object.entries(THEMES)\n          .map(\n            ([theme, prefix]) => `\n${prefix} [data-chart=${id}] {\n${colorConfig\n  .map(([key, itemConfig]) => {\n    const color = itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ?? itemConfig.color\n    return color ? `  --color-${key}: ${color};` : null\n  })\n  .join(\"\\n\")}\n}\n`\n          )\n          .join(\"\\n\"),\n      }}\n    />\n  )\n}\n\nconst ChartTooltip = RechartsPrimitive.Tooltip\n\nfunction ChartTooltipContent({\n  active,\n  payload,\n  className,\n  indicator = \"dot\",\n  hideLabel = false,\n  hideIndicator = false,\n  label,\n  labelFormatter,\n  labelClassName,\n  formatter,\n  color,\n  nameKey,\n  labelKey,\n}: React.ComponentProps<typeof RechartsPrimitive.Tooltip> &\n  React.ComponentProps<\"div\"> & {\n    hideLabel?: boolean\n    hideIndicator?: boolean\n    indicator?: \"line\" | \"dot\" | \"dashed\"\n    nameKey?: string\n    labelKey?: string\n  } & Omit<RechartsPrimitive.DefaultTooltipContentProps<TooltipValueType, TooltipNameType>, \"accessibilityLayer\">) {\n  const { config } = useChart()\n\n  const tooltipLabel = React.useMemo(() => {\n    if (hideLabel || !payload?.length) {\n      return null\n    }\n\n    const [item] = payload\n    const key = `${labelKey ?? item?.dataKey ?? item?.name ?? \"value\"}`\n    const itemConfig = getPayloadConfigFromPayload(config, item, key)\n    const value = !labelKey && typeof label === \"string\" ? (config[label]?.label ?? label) : itemConfig?.label\n\n    if (labelFormatter) {\n      return <div className={cn(\"font-medium\", labelClassName)}>{labelFormatter(value, payload)}</div>\n    }\n\n    if (!value) {\n      return null\n    }\n\n    return <div className={cn(\"font-medium\", labelClassName)}>{value}</div>\n  }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey])\n\n  if (!active || !payload?.length) {\n    return null\n  }\n\n  const nestLabel = payload.length === 1 && indicator !== \"dot\"\n\n  return (\n    <div\n      className={cn(\n        \"grid min-w-32 items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl\",\n        className\n      )}\n    >\n      {!nestLabel ? tooltipLabel : null}\n      <div className=\"grid gap-1.5\">\n        {payload\n          .filter((item) => item.type !== \"none\")\n          .map((item, index) => {\n            const key = `${nameKey ?? item.name ?? item.dataKey ?? \"value\"}`\n            const itemConfig = getPayloadConfigFromPayload(config, item, key)\n            const indicatorColor = color ?? item.payload?.fill ?? item.color\n\n            return (\n              <div\n                key={index}\n                className={cn(\n                  \"flex w-full flex-wrap items-stretch gap-2 [&>svg]:size-2.5 [&>svg]:text-muted-foreground\",\n                  indicator === \"dot\" && \"items-center\"\n                )}\n              >\n                {formatter && item?.value !== undefined && item.name ? (\n                  formatter(item.value, item.name, item, index, item.payload)\n                ) : (\n                  <>\n                    {itemConfig?.icon ? (\n                      <itemConfig.icon />\n                    ) : (\n                      !hideIndicator && (\n                        <div\n                          className={cn(\"shrink-0 rounded-xs border-border bg-(--color-bg)\", {\n                            \"size-2.5\": indicator === \"dot\",\n                            \"w-1\": indicator === \"line\",\n                            \"w-0 border-[1.5px] border-dashed bg-transparent\": indicator === \"dashed\",\n                            \"my-0.5\": nestLabel && indicator === \"dashed\",\n                          })}\n                          style={\n                            {\n                              \"--color-bg\": indicatorColor,\n                              \"--color-border\": indicatorColor,\n                            } as React.CSSProperties\n                          }\n                        />\n                      )\n                    )}\n                    <div\n                      className={cn(\n                        \"flex flex-1 justify-between leading-none\",\n                        nestLabel ? \"items-end\" : \"items-center\"\n                      )}\n                    >\n                      <div className=\"grid gap-1.5\">\n                        {nestLabel ? tooltipLabel : null}\n                        <span className=\"text-muted-foreground\">{itemConfig?.label ?? item.name}</span>\n                      </div>\n                      {item.value != null && (\n                        <span className=\"font-mono font-medium text-foreground tabular-nums\">\n                          {typeof item.value === \"number\" ? item.value.toLocaleString() : String(item.value)}\n                        </span>\n                      )}\n                    </div>\n                  </>\n                )}\n              </div>\n            )\n          })}\n      </div>\n    </div>\n  )\n}\n\nconst ChartLegend = RechartsPrimitive.Legend\n\nfunction ChartLegendContent({\n  className,\n  hideIcon = false,\n  payload,\n  verticalAlign = \"bottom\",\n  nameKey,\n}: React.ComponentProps<\"div\"> & {\n  hideIcon?: boolean\n  nameKey?: string\n} & RechartsPrimitive.DefaultLegendContentProps) {\n  const { config } = useChart()\n\n  if (!payload?.length) {\n    return null\n  }\n\n  return (\n    <div className={cn(\"flex items-center justify-center gap-4\", verticalAlign === \"top\" ? \"pb-3\" : \"pt-3\", className)}>\n      {payload\n        .filter((item) => item.type !== \"none\")\n        .map((item, index) => {\n          const key = `${nameKey ?? item.dataKey ?? \"value\"}`\n          const itemConfig = getPayloadConfigFromPayload(config, item, key)\n\n          return (\n            <div key={index} className={cn(\"flex items-center gap-1.5 [&>svg]:size-3 [&>svg]:text-muted-foreground\")}>\n              {itemConfig?.icon && !hideIcon ? (\n                <itemConfig.icon />\n              ) : (\n                <div\n                  className=\"size-2 shrink-0 rounded-xs\"\n                  style={{\n                    backgroundColor: item.color,\n                  }}\n                />\n              )}\n              {itemConfig?.label}\n            </div>\n          )\n        })}\n    </div>\n  )\n}\n\nfunction getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string) {\n  if (typeof payload !== \"object\" || payload === null) {\n    return undefined\n  }\n\n  const payloadPayload =\n    \"payload\" in payload && typeof payload.payload === \"object\" && payload.payload !== null\n      ? payload.payload\n      : undefined\n\n  let configLabelKey: string = key\n\n  if (key in payload && typeof payload[key as keyof typeof payload] === \"string\") {\n    configLabelKey = payload[key as keyof typeof payload] as string\n  } else if (\n    payloadPayload &&\n    key in payloadPayload &&\n    typeof payloadPayload[key as keyof typeof payloadPayload] === \"string\"\n  ) {\n    configLabelKey = payloadPayload[key as keyof typeof payloadPayload] as string\n  }\n\n  return configLabelKey in config ? config[configLabelKey] : config[key]\n}\n\nexport { ChartContainer, ChartTooltip, ChartTooltipContent, ChartLegend, ChartLegendContent, ChartStyle }\n"
+      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport * as RechartsPrimitive from \"recharts\"\nimport type { TooltipValueType } from \"recharts\"\n\n// Format: { THEME_NAME: CSS_SELECTOR }\nconst THEMES = { light: \"\", dark: \".dark\" } as const\n\nconst INITIAL_DIMENSION = { width: 320, height: 200 } as const\ntype TooltipNameType = number | string\n\nexport type ChartConfig = Record<\n  string,\n  {\n    label?: React.ReactNode\n    icon?: React.ComponentType\n  } & ({ color?: string; theme?: never } | { color?: never; theme: Record<keyof typeof THEMES, string> })\n>\n\ntype ChartContextProps = {\n  /** Series config: label, icon, and color (or theme colors) per data key; exposed as `--color-<key>`. */\n  config: ChartConfig\n}\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null)\n\nfunction useChart() {\n  const context = React.useContext(ChartContext)\n\n  if (!context) {\n    throw new Error(\"useChart must be used within a <ChartContainer />\")\n  }\n\n  return context\n}\n\nfunction ChartContainer({\n  id,\n  className,\n  children,\n  config,\n  initialDimension = INITIAL_DIMENSION,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  /** Series config: label, icon, and color (or theme colors) per data key; exposed as `--color-<key>`. */\n  config: ChartConfig\n  children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>[\"children\"]\n  /** Width and height used before the container measures itself. */\n  initialDimension?: {\n    width: number\n    height: number\n  }\n}) {\n  const uniqueId = React.useId()\n  const chartId = `chart-${id ?? uniqueId.replace(/:/g, \"\")}`\n\n  return (\n    <ChartContext.Provider value={{ config }}>\n      <div\n        data-slot=\"chart\"\n        data-chart={chartId}\n        className={cn(\n          \"flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden\",\n          className\n        )}\n        {...props}\n      >\n        <ChartStyle id={chartId} config={config} />\n        <RechartsPrimitive.ResponsiveContainer initialDimension={initialDimension}>\n          {children}\n        </RechartsPrimitive.ResponsiveContainer>\n      </div>\n    </ChartContext.Provider>\n  )\n}\n\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\n  const colorConfig = Object.entries(config).filter(([, config]) => config.theme ?? config.color)\n\n  if (!colorConfig.length) {\n    return null\n  }\n\n  return (\n    <style\n      dangerouslySetInnerHTML={{\n        __html: Object.entries(THEMES)\n          .map(\n            ([theme, prefix]) => `\n${prefix} [data-chart=${id}] {\n${colorConfig\n  .map(([key, itemConfig]) => {\n    const color = itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ?? itemConfig.color\n    return color ? `  --color-${key}: ${color};` : null\n  })\n  .join(\"\\n\")}\n}\n`\n          )\n          .join(\"\\n\"),\n      }}\n    />\n  )\n}\n\nconst ChartTooltip = RechartsPrimitive.Tooltip\n\nfunction ChartTooltipContent({\n  active,\n  payload,\n  className,\n  indicator = \"dot\",\n  hideLabel = false,\n  hideIndicator = false,\n  label,\n  labelFormatter,\n  labelClassName,\n  formatter,\n  color,\n  nameKey,\n  labelKey,\n}: React.ComponentProps<typeof RechartsPrimitive.Tooltip> &\n  React.ComponentProps<\"div\"> & {\n    /** Hide the tooltip label. */\n    hideLabel?: boolean\n    /** Hide the color indicator in each row. */\n    hideIndicator?: boolean\n    /** Indicator style: `dot`, `line`, or `dashed`. */\n    indicator?: \"line\" | \"dot\" | \"dashed\"\n    /** Data key used for the series name. */\n    nameKey?: string\n    /** Data key used for the tooltip label. */\n    labelKey?: string\n  } & Omit<RechartsPrimitive.DefaultTooltipContentProps<TooltipValueType, TooltipNameType>, \"accessibilityLayer\">) {\n  const { config } = useChart()\n\n  const tooltipLabel = React.useMemo(() => {\n    if (hideLabel || !payload?.length) {\n      return null\n    }\n\n    const [item] = payload\n    const key = `${labelKey ?? item?.dataKey ?? item?.name ?? \"value\"}`\n    const itemConfig = getPayloadConfigFromPayload(config, item, key)\n    const value = !labelKey && typeof label === \"string\" ? (config[label]?.label ?? label) : itemConfig?.label\n\n    if (labelFormatter) {\n      return <div className={cn(\"font-medium\", labelClassName)}>{labelFormatter(value, payload)}</div>\n    }\n\n    if (!value) {\n      return null\n    }\n\n    return <div className={cn(\"font-medium\", labelClassName)}>{value}</div>\n  }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey])\n\n  if (!active || !payload?.length) {\n    return null\n  }\n\n  const nestLabel = payload.length === 1 && indicator !== \"dot\"\n\n  return (\n    <div\n      className={cn(\n        \"grid min-w-32 items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl\",\n        className\n      )}\n    >\n      {!nestLabel ? tooltipLabel : null}\n      <div className=\"grid gap-1.5\">\n        {payload\n          .filter((item) => item.type !== \"none\")\n          .map((item, index) => {\n            const key = `${nameKey ?? item.name ?? item.dataKey ?? \"value\"}`\n            const itemConfig = getPayloadConfigFromPayload(config, item, key)\n            const indicatorColor = color ?? item.payload?.fill ?? item.color\n\n            return (\n              <div\n                key={index}\n                className={cn(\n                  \"flex w-full flex-wrap items-stretch gap-2 [&>svg]:size-2.5 [&>svg]:text-muted-foreground\",\n                  indicator === \"dot\" && \"items-center\"\n                )}\n              >\n                {formatter && item?.value !== undefined && item.name ? (\n                  formatter(item.value, item.name, item, index, item.payload)\n                ) : (\n                  <>\n                    {itemConfig?.icon ? (\n                      <itemConfig.icon />\n                    ) : (\n                      !hideIndicator && (\n                        <div\n                          className={cn(\"shrink-0 rounded-xs border-border bg-(--color-bg)\", {\n                            \"size-2.5\": indicator === \"dot\",\n                            \"w-1\": indicator === \"line\",\n                            \"w-0 border-[1.5px] border-dashed bg-transparent\": indicator === \"dashed\",\n                            \"my-0.5\": nestLabel && indicator === \"dashed\",\n                          })}\n                          style={\n                            {\n                              \"--color-bg\": indicatorColor,\n                              \"--color-border\": indicatorColor,\n                            } as React.CSSProperties\n                          }\n                        />\n                      )\n                    )}\n                    <div\n                      className={cn(\n                        \"flex flex-1 justify-between leading-none\",\n                        nestLabel ? \"items-end\" : \"items-center\"\n                      )}\n                    >\n                      <div className=\"grid gap-1.5\">\n                        {nestLabel ? tooltipLabel : null}\n                        <span className=\"text-muted-foreground\">{itemConfig?.label ?? item.name}</span>\n                      </div>\n                      {item.value != null && (\n                        <span className=\"font-mono font-medium text-foreground tabular-nums\">\n                          {typeof item.value === \"number\" ? item.value.toLocaleString() : String(item.value)}\n                        </span>\n                      )}\n                    </div>\n                  </>\n                )}\n              </div>\n            )\n          })}\n      </div>\n    </div>\n  )\n}\n\nconst ChartLegend = RechartsPrimitive.Legend\n\nfunction ChartLegendContent({\n  className,\n  hideIcon = false,\n  payload,\n  verticalAlign = \"bottom\",\n  nameKey,\n}: React.ComponentProps<\"div\"> & {\n  /** Hide the series icon. */\n  hideIcon?: boolean\n  /** Data key used for the series name. */\n  nameKey?: string\n} & RechartsPrimitive.DefaultLegendContentProps) {\n  const { config } = useChart()\n\n  if (!payload?.length) {\n    return null\n  }\n\n  return (\n    <div className={cn(\"flex items-center justify-center gap-4\", verticalAlign === \"top\" ? \"pb-3\" : \"pt-3\", className)}>\n      {payload\n        .filter((item) => item.type !== \"none\")\n        .map((item, index) => {\n          const key = `${nameKey ?? item.dataKey ?? \"value\"}`\n          const itemConfig = getPayloadConfigFromPayload(config, item, key)\n\n          return (\n            <div key={index} className={cn(\"flex items-center gap-1.5 [&>svg]:size-3 [&>svg]:text-muted-foreground\")}>\n              {itemConfig?.icon && !hideIcon ? (\n                <itemConfig.icon />\n              ) : (\n                <div\n                  className=\"size-2 shrink-0 rounded-xs\"\n                  style={{\n                    backgroundColor: item.color,\n                  }}\n                />\n              )}\n              {itemConfig?.label}\n            </div>\n          )\n        })}\n    </div>\n  )\n}\n\nfunction getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string) {\n  if (typeof payload !== \"object\" || payload === null) {\n    return undefined\n  }\n\n  const payloadPayload =\n    \"payload\" in payload && typeof payload.payload === \"object\" && payload.payload !== null\n      ? payload.payload\n      : undefined\n\n  let configLabelKey: string = key\n\n  if (key in payload && typeof payload[key as keyof typeof payload] === \"string\") {\n    configLabelKey = payload[key as keyof typeof payload] as string\n  } else if (\n    payloadPayload &&\n    key in payloadPayload &&\n    typeof payloadPayload[key as keyof typeof payloadPayload] === \"string\"\n  ) {\n    configLabelKey = payloadPayload[key as keyof typeof payloadPayload] as string\n  }\n\n  return configLabelKey in config ? config[configLabelKey] : config[key]\n}\n\nexport { ChartContainer, ChartTooltip, ChartTooltipContent, ChartLegend, ChartLegendContent, ChartStyle }\n"
     }
   ]
 }