@misoto22/design 0.8.0 → 0.10.0

package/dist/agent/Accordion.md

@@ -4,7 +4,7 @@ Disclosure rows that open in place.
 
 - Group: Navigation
 - Import: `import { Accordion } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/accordion/
 - Related: tabs
 

package/dist/agent/Alert.md

@@ -4,7 +4,7 @@ A message about the page, in place.
 
 - Group: Feedback
 - Import: `import { Alert } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/alert/
 - Related: toast, error-state
 

package/dist/agent/AppShell.md

@@ -4,7 +4,7 @@ Two columns on a desktop, a drawer on a phone.
 
 - Group: Surfaces
 - Import: `import { AppShell } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/app-shell/
 - Related: nav-item
 

package/dist/agent/ArchitectureFigure.md

@@ -4,7 +4,7 @@ A component map: services, datastores, trust boundaries, and what talks to what.
 
 - Group: Diagrams
 - Import: `import { ArchitectureFigure } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/architecture-figure/
 - Related: dataflow-figure, diagram, diagram-canvas
 

package/dist/agent/AreaChart.md

@@ -4,7 +4,7 @@ A filled series over a continuous axis, where the area means something.
 
 - Group: Charts
 - Import: `import { AreaChart } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/area-chart/
 - Related: line-chart, bar-chart, composed-chart
 

package/dist/agent/Article.md

@@ -4,7 +4,7 @@ The long-form reading surface — everything a Markdown pipeline emits, in this
 
 - Group: Surfaces
 - Import: `import { Article } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/article/
 - Related: diagram, card
 

package/dist/agent/AspectRatio.md

@@ -4,7 +4,7 @@ A box that keeps its shape whatever is inside it.
 
 - Group: Surfaces
 - Import: `import { AspectRatio } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/aspect-ratio/
 - Related: skeleton, card
 

package/dist/agent/Avatar.md

@@ -4,7 +4,7 @@ A person, as a circle, with initials until the image lands.
 
 - Group: Display
 - Import: `import { Avatar } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/avatar/
 
 ## Anatomy

package/dist/agent/Badge.md

@@ -4,7 +4,7 @@ A count or a state, set in mono so it reads as metadata.
 
 - Group: Display
 - Import: `import { Badge } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/badge/
 - Related: tag, status-pill
 

package/dist/agent/BarChart.md

@@ -4,7 +4,7 @@ Discrete categories compared by length.
 
 - Group: Charts
 - Import: `import { BarChart } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/bar-chart/
 - Related: area-chart, composed-chart, radial-chart
 

package/dist/agent/BarList.md

@@ -4,7 +4,7 @@ A ranked list, with the bar behind the name rather than beside it.
 
 - Group: Data
 - Import: `import { BarList } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/bar-list/
 - Related: bar-chart, table
 

package/dist/agent/BigNumber.md

@@ -4,7 +4,7 @@ One number, at the size of a headline.
 
 - Group: Data
 - Import: `import { BigNumber } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/big-number/
 - Related: sparkline, figure-band
 

package/dist/agent/BoxPlot.md

@@ -4,7 +4,7 @@ The spread of a measurement, per category.
 
 - Group: Charts
 - Import: `import { BoxPlot } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/box-plot/
 - Related: histogram, scatter-chart
 

package/dist/agent/Breadcrumb.md

@@ -4,7 +4,7 @@ Where you are, as a path.
 
 - Group: Navigation
 - Import: `import { Breadcrumb } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/breadcrumb/
 - Related: pagination
 

package/dist/agent/BulletChart.md

@@ -4,7 +4,7 @@ A measure, its target, and the bands that say whether it is any good.
 
 - Group: Data
 - Import: `import { BulletChart } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/bullet-chart/
 - Related: bar-list, big-number
 

package/dist/agent/Button.md

@@ -4,7 +4,7 @@ The system’s action, on the same corner as the field beside it.
 
 - Group: Actions
 - Import: `import { Button } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/button/
 - Related: floating-icon-button, spinner
 

package/dist/agent/Calendar.md

@@ -4,7 +4,7 @@ A month, as a grid of days.
 
 - Group: Surfaces
 - Import: `import { Calendar } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/calendar/
 - Related: date-picker
 

package/dist/agent/Card.md

@@ -4,7 +4,7 @@ A bounded surface, with no shadow under it.
 
 - Group: Surfaces
 - Import: `import { Card } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/card/
 - Related: table, figure-band
 

package/dist/agent/Checkbox.md

@@ -4,7 +4,7 @@ A choice that takes effect when the form is submitted.
 
 - Group: Forms
 - Import: `import { Checkbox } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/checkbox/
 - Related: switch, radio-group
 

package/dist/agent/Code.md

@@ -4,7 +4,7 @@ A function name or a flag, inside a sentence.
 
 - Group: Display
 - Import: `import { Code } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/code/
 - Related: code-block, kbd
 

package/dist/agent/CodeBlock.md

@@ -4,7 +4,7 @@ A multi-line snippet, on a plate, with a way to take it away.
 
 - Group: Display
 - Import: `import { CodeBlock } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/code-block/
 - Related: code, markdown, article
 

package/dist/agent/Collapsible.md

@@ -4,7 +4,7 @@ One thing that opens, on its own.
 
 - Group: Navigation
 - Import: `import { Collapsible } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/collapsible/
 - Related: accordion
 

package/dist/agent/ColorPicker.md

@@ -0,0 +1,75 @@
+# ColorPicker
+
+A colour, chosen or typed.
+
+- Group: Forms
+- Import: `import { ColorPicker } from '@misoto22/design'`
+- Version: 0.10.0
+- Docs: https://ui.misoto22.com/components/color-picker/
+- Related: field, input, popover
+
+## When to reach for it
+
+A person is choosing the colour. A colour that is merely being SHOWN is a swatch, and a set of fixed brand colours is a RadioGroup — a picker offers sixteen million answers to a question with six.
+
+## Anatomy
+
+- **Trigger** (required) — The closed control: a swatch, then the value as text, in the same box as Input and Select. Named by its label AND by its own value, so a reader hears “Brand colour, #a78bfa” rather than either half.
+- **Swatch** — The colour over a checkerboard, so a half-transparent value reads as transparent rather than as a paler colour.
+- **Notation strip** — Hex, OKLCH and Display P3, as a single-value ToggleGroup. It changes what onValueChange emits, not what the colour is — and hex and P3 are bounded, so switching to one of them fits the colour to that gamut on the way out.
+- **Field** (required) — The plane: chroma across, lightness up. Each ROW is normalised to the most chroma that exists at that lightness and hue, so the whole surface is reachable instead of a lens of colour inside bands of clipped duplicates. Underneath it are two real sliders rather than key handlers on a canvas, which is what gives it arrows, Home, End and an announced position.
+- **Hue track** — A ramp taken at the lightness and chroma already chosen, not a generic rainbow — so the strip shows the hues of THIS colour rather than of some other one.
+- **Opacity track** — Transparent to the current colour, over the same checkerboard as the swatch.
+- **CSS box** — The value as text. Accepts hex, rgb(), hsl(), oklch() and color(display-p3 …) in both syntaxes, and paints itself invalid on anything else.
+
+## Best practices
+
+### Do
+
+- Wrap it in a Field. The trigger is a button, which a label binds to and clicks through — one of the few composites where that works without help.
+- Pass the notation you want back. The panel emits in whatever notation the value arrived in until somebody changes it in the strip, so a defaultValue of "#a78bfa" keeps a consumer in hex.
+- Reach for this over <input type="color"> when the colours are being TUNED. The native picker works in HSV, where a row of constant lightness visibly darkens as it saturates — so a reader building a palette is fighting the instrument. OKLCH is the space where two colours at the same height genuinely match.
+
+### Don’t
+
+- Do not pass a named colour. Hex, rgb(), hsl(), oklch() and color(display-p3 …) parse; "rebeccapurple" does not, and the box will show it as invalid. Resolving names needs a table of every CSS keyword or a live DOM, and a picker that takes some names and not others is worse than one that takes none.
+- Do not read the emitted string as a fixed notation. It is whatever the strip is set to, so a consumer that slices a "#" off the front breaks the first time a reader picks OKLCH.
+- Do not use it to pick text or background colour and call the result accessible. Nothing here measures contrast; a picker that lets a reader choose #eeeeee for body copy is doing exactly what it was asked.
+
+## Accessibility
+
+- label is required. The trigger shows a value, and a value is not a name.
+- The plane is a group of two real sliders — Chroma and Lightness — each announced with a percentage, so the 2D surface is operable and reported rather than merely clickable.
+- The focus ring is drawn on the plane, because the sliders that take the focus are visually hidden and the browser’s own ring is clipped away with them.
+- Alpha is doubled by a checkerboard everywhere it is shown, so transparency is not carried by lightness alone.
+
+## Keyboard
+
+- Enter / Space — Opens the panel.
+- ← / → — Moves the focused axis or track by one step.
+- Home / End — Jumps that axis or track to its ends.
+- Escape — Closes the panel; focus returns to the trigger.
+
+## ColorPicker
+
+A colour, chosen or typed. The panel works in OKLCH, and that is the reason to reach for this rather than `<input type="color">`. In HSV — which is what the native picker and most libraries use — dragging along a row of constant "lightness" walks through colours the eye reads as getting darker, so a reader tuning a palette is fighting the instrument. OKLCH's lightness is the one a person sees, so two colours at the same height on the plane genuinely match, and the hue strip stays at the lightness already chosen instead of showing a rainbow that belongs to some other colour. The plane is normalised to the gamut ROW BY ROW: its right edge is the most chroma that exists at that lightness and hue, so the whole surface is reachable rather than a lens of colour inside a field of clipped duplicates. **What it accepts.** Hex, `rgb()`, `hsl()`, `oklch()` and `color(display-p3 …)`, in both syntaxes. Named colours are not accepted: resolving them needs a table of every CSS name or a live DOM, and a box that takes "rebeccapurple" but not "papayawhip" is worse than one that takes neither. **Keyboard.** The plane is a group of two real sliders — chroma across, lightness up — so the arrows move it and a screen reader announces where it is. That is the part a 2D canvas usually leaves out, and leaving it out makes the control unusable rather than merely awkward.
+
+### Props
+
+- `label` (required) — `string`. Names the control. Required — the trigger shows a colour, and a colour is not a name. Announced together with the value, the way `Select`'s is: a reader hears "Brand colour, #a78bfa". Inside a `Field` with a label, that label is used and this one is not repeated.
+- `value` — `string`. The colour, as any absolute CSS colour string.
+- `defaultValue` — `string` default `'#000000'`.
+- `onValueChange` — `(value: string) => void`. Fires with a CSS colour string in whichever notation the panel is set to — so the notation a caller passes in is the notation they get back until somebody changes it in the panel.
+- `disabled` — `boolean`.
+- `invalid` — `boolean`. Paints the resting border with `--danger` and reflects `aria-invalid`.
+- `className` — `string`.
+- `id` — `string`. The TRIGGER's id — the element a label points at. A `Field` sets it.
+- `aria-describedby` — `string`. Ids of the copy describing the control. A `Field` sets it from hint, error and description.
+- `aria-invalid` — `boolean | 'true' | 'false'`. The spelling a form library sets; read together with `invalid`.
+- `aria-required` — `boolean`. Announced on the trigger. A `Field` sets it from `required`.
+
+## Examples
+
+```tsx
+<Field label="Brand colour"><ColorPicker label="Brand colour" defaultValue="#a78bfa" /></Field>
+```

package/dist/agent/Combobox.md

@@ -4,7 +4,7 @@ A select you can type into.
 
 - Group: Forms
 - Import: `import { Combobox } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/combobox/
 - Related: select, command
 

package/dist/agent/Command.md

@@ -4,7 +4,7 @@ A filterable list of actions — the ⌘K surface.
 
 - Group: Overlays
 - Import: `import { Command } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/command/
 - Related: combobox, dialog
 

package/dist/agent/ComposedChart.md

@@ -4,7 +4,7 @@ Bars and lines over one axis — the volume, and the rate it moved at.
 
 - Group: Charts
 - Import: `import { ComposedChart } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/composed-chart/
 - Related: bar-chart, line-chart
 

package/dist/agent/ContextMenu.md

@@ -4,7 +4,7 @@ The menu a right-click opens.
 
 - Group: Overlays
 - Import: `import { ContextMenu } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/context-menu/
 - Related: dropdown-menu
 

package/dist/agent/DataflowFigure.md

@@ -4,7 +4,7 @@ A pipeline: where data comes from, what happens to it, and who ends up with it.
 
 - Group: Diagrams
 - Import: `import { DataflowFigure } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/dataflow-figure/
 - Related: architecture-figure, lifecycle-figure
 

package/dist/agent/DatePicker.md

@@ -4,7 +4,7 @@ A date — or a span of them — chosen from a calendar.
 
 - Group: Forms
 - Import: `import { DatePicker } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/date-picker/
 - Related: calendar, field
 

package/dist/agent/DescriptionList.md

@@ -4,7 +4,7 @@ One record’s fields, as a real <dl> rather than a grid of divs.
 
 - Group: Surfaces
 - Import: `import { DescriptionList } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/description-list/
 - Related: table, card, timestamp
 

package/dist/agent/Diagram.md

@@ -4,7 +4,7 @@ A flow or architecture figure, drawn out of the system’s own parts.
 
 - Group: Display
 - Import: `import { Diagram } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/diagram/
 - Related: card, figure-band
 

package/dist/agent/DiagramCanvas.md

@@ -4,7 +4,7 @@ A frame that a picture larger than it can be panned and zoomed inside.
 
 - Group: Diagrams
 - Import: `import { DiagramCanvas } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/diagram-canvas/
 - Related: diagram-minimap, architecture-figure, scroll-area
 

package/dist/agent/DiagramExportMenu.md

@@ -4,7 +4,7 @@ Taking the figure off the page: PNG, JPEG, WebP, SVG and a 1200×630 share card.
 
 - Group: Diagrams
 - Import: `import { DiagramExportMenu } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/diagram-export-menu/
 - Related: dropdown-menu, diagram-toolbar
 

package/dist/agent/DiagramInspector.md

@@ -4,7 +4,7 @@ What the reader just picked, written out beside the picture.
 
 - Group: Diagrams
 - Import: `import { DiagramInspector } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/diagram-inspector/
 - Related: card, diagram-canvas
 

package/dist/agent/DiagramLegend.md

@@ -4,7 +4,7 @@ The key: which drawn form means which kind of thing.
 
 - Group: Diagrams
 - Import: `import { DiagramLegend } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/diagram-legend/
 - Related: architecture-figure, lifecycle-figure
 

package/dist/agent/DiagramMinimap.md

@@ -4,7 +4,7 @@ Where you are in something bigger than the window.
 
 - Group: Diagrams
 - Import: `import { DiagramMinimap } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/diagram-minimap/
 - Related: diagram-canvas
 

package/dist/agent/DiagramToolbar.md

@@ -4,7 +4,7 @@ A bar of actions belonging to the surface underneath them.
 
 - Group: Diagrams
 - Import: `import { DiagramToolbar } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/diagram-toolbar/
 - Related: floating-icon-button, diagram-export-menu
 

package/dist/agent/Dialog.md

@@ -4,7 +4,7 @@ A modal surface: portal, scrim, centred panel.
 
 - Group: Overlays
 - Import: `import { Dialog } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/dialog/
 - Related: dropdown-menu, tooltip
 

package/dist/agent/DropdownMenu.md

@@ -4,7 +4,7 @@ A menu of actions.
 
 - Group: Overlays
 - Import: `import { DropdownMenu } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/dropdown-menu/
 - Related: dialog, select
 

package/dist/agent/EmptyState.md

@@ -4,7 +4,7 @@ A collection with nothing in it — yet.
 
 - Group: Feedback
 - Import: `import { EmptyState } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/empty-state/
 - Related: error-state, skeleton
 

package/dist/agent/ErrorState.md

@@ -4,7 +4,7 @@ A page that could not be shown.
 
 - Group: Feedback
 - Import: `import { ErrorState } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/error-state/
 - Related: empty-state, alert
 

package/dist/agent/Facet.md

@@ -4,7 +4,7 @@ The same chart once per group, on one shared scale.
 
 - Group: Charts
 - Import: `import { Facet } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/facet/
 - Related: line-chart, sparkline
 

package/dist/agent/Field.md

@@ -4,7 +4,7 @@ A labelled form row: label, control, and the one message below it — and, in ro
 
 - Group: Forms
 - Import: `import { Field } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/field/
 - Related: input, select, switch
 

package/dist/agent/FigureBand.md

@@ -4,7 +4,7 @@ A row of counted facts, divided by hairlines and nothing else.
 
 - Group: Display
 - Import: `import { FigureBand } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/figure-band/
 - Related: table
 

package/dist/agent/FloatingIconButton.md

@@ -4,7 +4,7 @@ A round action pinned to a screen corner.
 
 - Group: Actions
 - Import: `import { FloatingIconButton } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/floating-icon-button/
 - Related: button
 

package/dist/agent/FunnelChart.md

@@ -4,7 +4,7 @@ Stages that only ever narrow.
 
 - Group: Charts
 - Import: `import { FunnelChart } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/funnel-chart/
 - Related: sankey-chart, bar-chart
 

package/dist/agent/Heading.md

@@ -4,7 +4,7 @@ A heading whose element and whose size are two decisions.
 
 - Group: Display
 - Import: `import { Heading } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/heading/
 - Related: text, article, markdown
 

package/dist/agent/Heatmap.md

@@ -4,7 +4,7 @@ A grid of values read by weight.
 
 - Group: Data
 - Import: `import { Heatmap } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/heatmap/
 - Related: table, scatter-chart
 

package/dist/agent/Histogram.md

@@ -4,7 +4,7 @@ The shape of one distribution.
 
 - Group: Charts
 - Import: `import { Histogram } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/histogram/
 - Related: box-plot, bar-chart
 

package/dist/agent/Input.md

@@ -4,7 +4,7 @@ A single line of text entry.
 
 - Group: Forms
 - Import: `import { Input } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/input/
 - Related: field, textarea
 

package/dist/agent/Kbd.md

@@ -4,7 +4,7 @@ A key on a keyboard, set as one.
 
 - Group: Display
 - Import: `import { Kbd } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/kbd/
 - Related: badge
 
@@ -32,7 +32,7 @@ A key on a keyboard, set as one.
 
 ## Kbd
 
-A key on a keyboard, set as one. Renders a `<kbd>`, which is the element that means this — a `<span>` styled to look like a key tells a screen reader nothing. Sized in `em` so it tracks whatever type it sits beside rather than fixing itself at one px value, which is how the same shortcut ended up three different sizes across a page.
+A key on a keyboard, set as one. Renders a `<kbd>`, which is the element that means this — a `<span>` styled to look like a key tells a screen reader nothing. Sized in `em` so it tracks whatever type it sits beside rather than fixing itself at one px value, which is how the same shortcut ended up three different sizes across a page. Every dimension here tracked its context except the leading, which was a literal `1.6` — the body's READING leading, on a chip that is never a paragraph. Inside a control it therefore stood proud of the label beside it and pushed the whole box past its own height token: the masthead's search field measured 39px against a 36px `sm`, and it was this keycap doing it. `--control-lh` is the leading a one-line box gets, and this is one.
 
 ### Props
 

package/dist/agent/LifecycleFigure.md

@@ -4,7 +4,7 @@ A state machine: what something can be, and what moves it between states.
 
 - Group: Diagrams
 - Import: `import { LifecycleFigure } from '@misoto22/design/diagrams'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/lifecycle-figure/
 - Related: workflow-figure, steps
 

package/dist/agent/LineChart.md

@@ -4,7 +4,7 @@ Several series compared over a continuous axis.
 
 - Group: Charts
 - Import: `import { LineChart } from '@misoto22/design/charts'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/line-chart/
 - Related: area-chart, composed-chart
 

package/dist/agent/LinkArrow.md

@@ -4,7 +4,7 @@ The mark on a link that leaves the page.
 
 - Group: Display
 - Import: `import { LinkArrow } from '@misoto22/design'`
-- Version: 0.8.0
+- Version: 0.10.0
 - Docs: https://ui.misoto22.com/components/link-arrow/
 
 ## Anatomy