shadcn default charts

This is shadcn/ui's chart gallery rebuilt on Nooxit. Each chart is a single file built on Chart, Card and Recharts. Open View code under a chart and copy the file into a project that has nooxit-design-system installed. Only Area and Pie need anything more: they use Select, which is also in the package.

ColorCopy Anchor Link

Colors follow the chart palette. They are set through ChartConfig and read back as var(--color-<key>), so they switch with the theme on their own; never add a dark: color class to a chart.

What changed from shadcnCopy Anchor Link

The data, layout and Recharts setup are unchanged. The ports differ from shadcn's files as follows:

• Imports point at nooxit-design-system/components/* instead of shadcn's internal registry paths.
• Single-series charts use var(--primary) instead of var(--chart-1). Three line charts declared a mobile series they never drew; it was removed.
• Card titles use size="md" (18px medium). The Nooxit default is 24px, which is too large for a gallery card.
• Centered headers on pie, radar and radial charts use <CardHeader align="center">. shadcn's items-center does not center the text of a grid header.
• Selects drop shadcn's rounded-lg and rounded-xl overrides and use size="sm", so they keep the system's 6px radius and 36px height.
• The toggle headers on the interactive bar and line charts use bg-muted-50 instead of bg-muted/50. Their numbers are medium instead of bold, and the buttons show the standard focus ring.
• The two gradient area charts keep their fills, as the Dashboard block does. Their SVG gradient ids are renamed so the two charts on one page do not share them.
• Pie, radar and radial charts give their CardContent the block class. Nooxit's CardContent is a flex column, and inside it shadcn's mx-auto aspect-square container shrinks to zero width, so the chart disappears.
• Radar - Custom Label gives its tick text fill-foreground, because unstyled SVG text is black and disappears in dark mode. It also stops passing Recharts' verticalAnchor prop to the DOM.
• Custom Dots used hsl(var(--background)), which produces an invalid color because the Nooxit tokens are not HSL values. It now uses var(--background).