# legendToggle

> Position-keyed visibility rules pairing a chart root with a later legend: hides each `[data-color]` slot once the legend's same-position `<label>` holds no checked input.

```ts
import { legendToggle } from "@sdxc/ui/styles";
```

Composes the categorical legend-toggle visibility rules as a `css()`
mixin covering every CHART_COLOR_SLOT_COUNT color slot. The
general sibling combinator requires the legend to follow the chart root.

## Signature

```ts
legendToggle<Node extends Element = Element>(): MixinDescriptor<
	Node,
	[styles: CSSStyles],
	ElementProps
>
```

Returns: A `css()` mixin ready for a host element's `mix` prop.

## Examples

```tsx
<svg
	mix={[
		legendToggle(),
		css({ display: "block", inlineSize: "100%", blockSize: "auto" }),
	]}
>
	{content}
</svg>;
```