feat(CartesianChart): add Bar and a layout prop for horizontal bars

[BenniEngel]

What & why

Adds a bar chart — as a <Bar> inside CartesianChart, not as a separate
BarChart — plus a layout prop so bars can run vertically or horizontally.

CartesianChart already hosts a recharts ComposedChart, which renders <Bar>
natively. So axes, grid, legend, tooltip, emptyView and syncId are reused
unchanged, and bar/line combinations come for free. A separate component would
have duplicated all of it.

Bar mirrors Area: dataKey prop or dataKey function with
dataKeyLabel, categorical or custom color, stackId, barSize /
maxBarSize / minPointSize, unit. It is @flr-generate all, so it ships as
flr-bar and as a TypedBar entry in typedCartesianChart.

Grouped is the default — stacking is opt-in via stackId. That deviates
from Area, which always stacks, because side-by-side is what bars are usually
reached for.

Corner radius comes from the new bar.corner-radius token
({corner-radius.s}) and lands on the growing end of the bar: top in a
horizontal layout, right in a vertical one. Stacked segments stay square —
recharts cannot round only the last segment of a stack.

layout on CartesianChart is "horizontal" (default) or "vertical".
Vertical moves the category axis to the y-axis and needs
<XAxis type="number" /> plus <YAxis type="category" dataKey="…" />; both are
documented on the prop and in the docs page. A small context carries the layout
down to Bar so it can pick the rounded corners. The provider sits outside
ComposedChart, so recharts' children detection is untouched.

Purely additive: no change to existing @flr-generate props, no migration
needed.

Also covered: stories (grouped, stacked, horizontal, bars+line), docs page
sections "Darstellungstypen" and "Ausrichtung" with three live examples, type
tests for Bar, three visual tests across both layouts (Local and Remote),
and both orientations on the remote-dom-demo chart page.

Open for UX: should the top of a stack be rounded? Right now the whole
stack is square, which is at least predictable.

Base branch & title

• Title: feat(CartesianChart): add Bar and a layout prop for horizontal bars
• Base: main — next does not exist before the 1.0.0 cut, so the routing
  guard is dormant and feat: targets main.

Checklist

• PR title is a Conventional Commit and matches the base branch above
• pnpm lint is clean and pnpm affected:test passes (browser tests if
  behavior changed)
• Generated code is committed (git diff is empty after the relevant
  build:* targets)
• User-facing strings added to both de-DE and en-US locale files —
  n/a, this change adds no UI text
• Docs updated if a public API changed; intentional visual changes get
  updated snapshots / the update-screenshots label

pnpm test (unit + compile, 8 projects) and pnpm build (no generated diff)
are green. pnpm affected:test:browser is green except three failures that
predate this branch and are unrelated — Initials (Local + Remote) and
MarkdownEditor states (Local); both reproduce with this branch's changes
stashed.

The three new visual tests only have -darwin baselines locally, so this PR
needs the update-screenshots label for CI to write the -webkit-linux
ones.

[github-actions]

Coverage Report for ./packages/components/

Status	Category	Percentage	Covered / Total
🔵	Lines	76%	627 / 825
🔵	Statements	75.91%	643 / 847
🔵	Functions	77.95%	145 / 186
🔵	Branches	66.66%	298 / 447

File Coverage

No changed files found.

Generated in workflow #6412 for commit d8be1bd by the Vitest Coverage Report Action

[github-actions]

🚀 Preview Deployment

Preview environments are ready:

Type	URL
docs	pr-2880.docs.review.flow-components.de
storybook	pr-2880.storybook.review.flow-components.de

Images:

• docs: ghcr.io/mittwald/flow/docs:pr-2880
• storybook: ghcr.io/mittwald/flow/storybook:pr-2880

[Jan-Eimertenbrink]

Die Ausrichtung muss meiner Meinung nach ein unter Überschrift von Bar werden. Weil nur bei Bar macht es sinn das Chart zu drehen, Line und Area wird und sollte man auch nicht vertikal darstellen.

[Lisa18289]

das sollte nicht mit rein, hat ja auch nix mit der Änderung am Chart zu tun

[Lisa18289]

Die Charts zeigen nichts an

[Lisa18289]

ich guck mir das grad mal an, das scheint nicht an den Bars zu liegen, tritt auch mit anderen Charts auf

[Lisa18289]

Ich mach für das Problem ein eigenes Issue auf, du kannst das hier aber so bauen, dann funktioniert es trotzdem:

const createBarData = () => [
  { project: "Alpha", Shields: 68, Hull: 24 },
  { project: "Beta", Shields: 42, Hull: 13 },
  { project: "Gamma", Shields: 21, Hull: 39 },
];

const barData = {
  horizontal: createBarData(),
  vertical: createBarData(),
};

<CartesianChart data={barData[layout]} height="300px" layout={layout}>

[Lisa18289]

wenn das immer gesetzt werden muss könnte man es evtl über den Context automatisch setzen?