Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions .changeset/pre.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@
},
"changesets": [
"autocomplete-hover-takes-focus",
"avatar-v1",
"blue-camels-cough",
"breadcrumbs-v1",
"bright-apples-wheel",
"bright-toggles-press",
"brown-countries-applaud",
Expand Down Expand Up @@ -38,15 +40,20 @@
"numberfield-v1",
"olive-tips-promise",
"orange-otters-jump",
"outside-press-focus",
"polite-hotels-knock",
"popover-layer-stack",
"progress-v1",
"quiet-toggle-groups-arrive",
"radio-group-v1",
"rare-candles-care",
"select-v1",
"separator-v1",
"sharp-tigers-smell",
"short-bottles-smile",
"silent-geese-teach",
"six-pens-think",
"slider-v1",
"smart-walls-care",
"smooth-seals-drive",
"solid-input-basics",
Expand All @@ -64,6 +71,7 @@
"timepicker-input-name-doc",
"toggle-group-item",
"toggle-group-owns-its-value",
"tooltip-v1",
"transfer-list-filter-reorder-form",
"transfer-list",
"tree-v1"
Expand Down
58 changes: 57 additions & 1 deletion docs/src/lib/docs/releases-data.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,63 @@
[
{
"version": "1.0.0-beta.8",
"date": "2026-09-20T14:55:55.147Z",
"sections": [
{
"type": "Minor",
"entries": [
{
"pr": 101,
"prUrl": "https://github.com/human-kit/ui/pull/101",
"html": "<p>Add the Avatar primitive with <code>Root</code>, <code>Image</code> and <code>Fallback</code>. The image loads off the screen first, and the <code>&lt;img&gt;</code> renders once it is there, thus a broken image icon never shows. The fallback shows while the image is not on the screen, at once for a failure or a missing <code>src</code>, and after <code>delay</code> milliseconds while a slow image loads. The root has <code>data-status</code> and <code>onStatusChange</code> for <code>loading</code>, <code>loaded</code> and <code>error</code>. The fallback takes the name of the image as a <code>role=&quot;img&quot;</code>, and <code>loading=&quot;lazy&quot;</code> starts the load when the avatar comes into view. <code>Avatar.Group</code> is a named <code>role=&quot;group&quot;</code> with a <code>max</code>, and <code>Avatar.Count</code> says how many avatars are past it, as <code>+N</code> on the screen and &quot;N more&quot; for the screen reader.</p>"
},
{
"pr": 101,
"prUrl": "https://github.com/human-kit/ui/pull/101",
"html": "<p>Add the Breadcrumbs primitive with <code>Root</code>, <code>List</code>, <code>Item</code>, <code>Link</code> and <code>Separator</code>. The root is a <code>&lt;nav&gt;</code> landmark named &quot;Breadcrumb&quot; in the locale of <code>LocaleProvider</code>, the list is an <code>&lt;ol&gt;</code> of <code>&lt;li&gt;</code>, and <code>current</code> gives the last link <code>aria-current=&quot;page&quot;</code>. A link without an <code>href</code>, or with <code>disabled</code>, is a <code>&lt;span&gt;</code> out of the tab order. The separator is <code>aria-hidden</code>, in the item after the link, thus the list holds pages only. <code>maxItems</code> folds the middle of a long trail behind <code>Breadcrumbs.Ellipsis</code>, a button named &quot;Show N more pages&quot; that unfolds it and moves the focus to the first page that comes into view.</p>"
},
{
"pr": 98,
"prUrl": "https://github.com/human-kit/ui/pull/98",
"html": "<p>Add the Progress primitive with <code>Root</code>, <code>Label</code>, <code>Track</code>, <code>Indicator</code> and <code>Value</code>. The root is the <code>role=&quot;progressbar&quot;</code> element with <code>aria-valuemin</code>, <code>aria-valuemax</code>, <code>aria-valuenow</code> and <code>aria-valuetext</code>; <code>value={null}</code> makes it indeterminate, with no number for the screen reader. The label names the bar through <code>aria-labelledby</code>, the value is <code>aria-hidden</code> because the bar already gives it, and the text follows the locale of <code>LocaleProvider</code> as a percentage of the range or in a unit through <code>format</code>. The indicator fills from the start edge of the text direction, or from the bottom of a vertical track, and <code>bind:context</code> gives <code>percent</code> and <code>status</code> for a shape of your own.</p>"
},
{
"pr": 95,
"prUrl": "https://github.com/human-kit/ui/pull/95",
"html": "<p>Add the Select primitive with <code>Root</code>, <code>Label</code>, <code>Trigger</code>, <code>Value</code>, <code>Popover</code>, <code>List</code>, <code>Item</code> and <code>ItemIndicator</code>: a form field with one value from a list of options, or more than one with <code>selectionMode=&quot;multiple&quot;</code>. The trigger is a <code>role=&quot;combobox&quot;</code> button named by the label and the value together, the list is a <code>ListBox</code> in a popover that takes the focus on the selected option, and a hidden native <code>&lt;select&gt;</code> sends the value with the form. It has the keyboard of the WAI-ARIA select-only combobox: the arrows, <code>Home</code>, <code>End</code>, <code>PageUp</code>, <code>PageDown</code> and typed characters open the list and move through it, <code>Enter</code>, <code>Space</code> and <code>Alt+ArrowUp</code> select, and <code>Escape</code> and <code>Tab</code> close. Includes documentation and demo coverage.</p>\n<p>The keyboard-navigation primitive gains a <code>typeahead(char)</code> method, for a widget that opens on a character typed outside the list.</p>"
},
{
"pr": 101,
"prUrl": "https://github.com/human-kit/ui/pull/101",
"html": "<p>Add the Separator primitive: a <code>role=&quot;separator&quot;</code> line with <code>aria-orientation=&quot;vertical&quot;</code> for a vertical one, and <code>role=&quot;none&quot;</code> with <code>decorative</code> for a line the content already makes. With a <code>value</code>, it is a window splitter: a tab stop with <code>aria-valuenow</code>, which the arrow keys, <code>Home</code>, <code>End</code>, <code>Enter</code> and a pointer drag move.</p>"
},
{
"pr": 96,
"prUrl": "https://github.com/human-kit/ui/pull/96",
"html": "<p>Add the <code>Slider</code> component: a number, or a range of numbers, on a track. Each thumb holds a native range input for the form and for screen readers, the keyboard follows the text direction, and the text of the value comes from <code>Intl.NumberFormat</code> in the locale.</p>"
},
{
"pr": 97,
"prUrl": "https://github.com/human-kit/ui/pull/97",
"html": "<p>Add the <code>Tooltip</code> component: a short description of a control on hover or on keyboard focus, with <code>role=&quot;tooltip&quot;</code> and <code>aria-describedby</code> on the trigger, a delay that the next tooltip in a row skips, content the pointer can cross to and rest on, a long press for touch that <code>openOnLongPress={false}</code> turns off, a panel that follows the pointer with <code>followPointer</code>, and an arrow. The <code>floating</code> primitive learned to position an arrow.</p>"
}
]
},
{
"type": "Patch",
"entries": [
{
"pr": 95,
"prUrl": "https://github.com/human-kit/ui/pull/95",
"html": "<p>After an outside press on nothing focusable, Popover, Menu, Dialog, Drawer, DatePicker and Select return the focus to the trigger, with no focus ring. Dialog and Drawer restored it too early: the press moved the focus to the body right after. The focus fell to the body before, and a keyboard user had nowhere to continue from. A press on a focusable element keeps the focus there, and the trigger no longer shows a <code>data-focused</code> it does not have.</p>"
}
]
}
]
},
{
"version": "1.0.0-beta.7",
"date": "2026-09-08T00:51:56.519Z",
"date": "2026-09-07T21:57:34-03:00",
"sections": [
{
"type": "Minor",
Expand Down
24 changes: 24 additions & 0 deletions packages/ui/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,29 @@
# @human-kit/ui

## 1.0.0-beta.8

### Minor Changes

- [#101](https://github.com/human-kit/ui/pull/101) [`d9ab263`](https://github.com/human-kit/ui/commit/d9ab26362be045437a3fb46ae968a7d39000ac5d) Thanks [@Agustin-Delgado](https://github.com/Agustin-Delgado)! - Add the Avatar primitive with `Root`, `Image` and `Fallback`. The image loads off the screen first, and the `<img>` renders once it is there, thus a broken image icon never shows. The fallback shows while the image is not on the screen, at once for a failure or a missing `src`, and after `delay` milliseconds while a slow image loads. The root has `data-status` and `onStatusChange` for `loading`, `loaded` and `error`. The fallback takes the name of the image as a `role="img"`, and `loading="lazy"` starts the load when the avatar comes into view. `Avatar.Group` is a named `role="group"` with a `max`, and `Avatar.Count` says how many avatars are past it, as `+N` on the screen and "N more" for the screen reader.

- [#101](https://github.com/human-kit/ui/pull/101) [`d9ab263`](https://github.com/human-kit/ui/commit/d9ab26362be045437a3fb46ae968a7d39000ac5d) Thanks [@Agustin-Delgado](https://github.com/Agustin-Delgado)! - Add the Breadcrumbs primitive with `Root`, `List`, `Item`, `Link` and `Separator`. The root is a `<nav>` landmark named "Breadcrumb" in the locale of `LocaleProvider`, the list is an `<ol>` of `<li>`, and `current` gives the last link `aria-current="page"`. A link without an `href`, or with `disabled`, is a `<span>` out of the tab order. The separator is `aria-hidden`, in the item after the link, thus the list holds pages only. `maxItems` folds the middle of a long trail behind `Breadcrumbs.Ellipsis`, a button named "Show N more pages" that unfolds it and moves the focus to the first page that comes into view.

- [#98](https://github.com/human-kit/ui/pull/98) [`04d92e8`](https://github.com/human-kit/ui/commit/04d92e8f47978b9bbdd2d907c84107bef5a53d16) Thanks [@Agustin-Delgado](https://github.com/Agustin-Delgado)! - Add the Progress primitive with `Root`, `Label`, `Track`, `Indicator` and `Value`. The root is the `role="progressbar"` element with `aria-valuemin`, `aria-valuemax`, `aria-valuenow` and `aria-valuetext`; `value={null}` makes it indeterminate, with no number for the screen reader. The label names the bar through `aria-labelledby`, the value is `aria-hidden` because the bar already gives it, and the text follows the locale of `LocaleProvider` as a percentage of the range or in a unit through `format`. The indicator fills from the start edge of the text direction, or from the bottom of a vertical track, and `bind:context` gives `percent` and `status` for a shape of your own.

- [#95](https://github.com/human-kit/ui/pull/95) [`ffac2c1`](https://github.com/human-kit/ui/commit/ffac2c17344084e189bcc1ddfc26e225e0bce4e2) Thanks [@Agustin-Delgado](https://github.com/Agustin-Delgado)! - Add the Select primitive with `Root`, `Label`, `Trigger`, `Value`, `Popover`, `List`, `Item` and `ItemIndicator`: a form field with one value from a list of options, or more than one with `selectionMode="multiple"`. The trigger is a `role="combobox"` button named by the label and the value together, the list is a `ListBox` in a popover that takes the focus on the selected option, and a hidden native `<select>` sends the value with the form. It has the keyboard of the WAI-ARIA select-only combobox: the arrows, `Home`, `End`, `PageUp`, `PageDown` and typed characters open the list and move through it, `Enter`, `Space` and `Alt+ArrowUp` select, and `Escape` and `Tab` close. Includes documentation and demo coverage.

The keyboard-navigation primitive gains a `typeahead(char)` method, for a widget that opens on a character typed outside the list.

- [#101](https://github.com/human-kit/ui/pull/101) [`d9ab263`](https://github.com/human-kit/ui/commit/d9ab26362be045437a3fb46ae968a7d39000ac5d) Thanks [@Agustin-Delgado](https://github.com/Agustin-Delgado)! - Add the Separator primitive: a `role="separator"` line with `aria-orientation="vertical"` for a vertical one, and `role="none"` with `decorative` for a line the content already makes. With a `value`, it is a window splitter: a tab stop with `aria-valuenow`, which the arrow keys, `Home`, `End`, `Enter` and a pointer drag move.

- [#96](https://github.com/human-kit/ui/pull/96) [`4bea04d`](https://github.com/human-kit/ui/commit/4bea04d89373f81c373f186bd9aeda028e87f403) Thanks [@Agustin-Delgado](https://github.com/Agustin-Delgado)! - Add the `Slider` component: a number, or a range of numbers, on a track. Each thumb holds a native range input for the form and for screen readers, the keyboard follows the text direction, and the text of the value comes from `Intl.NumberFormat` in the locale.

- [#97](https://github.com/human-kit/ui/pull/97) [`fb50754`](https://github.com/human-kit/ui/commit/fb50754d30488910e026e28d4cfda3c40c0c1408) Thanks [@Agustin-Delgado](https://github.com/Agustin-Delgado)! - Add the `Tooltip` component: a short description of a control on hover or on keyboard focus, with `role="tooltip"` and `aria-describedby` on the trigger, a delay that the next tooltip in a row skips, content the pointer can cross to and rest on, a long press for touch that `openOnLongPress={false}` turns off, a panel that follows the pointer with `followPointer`, and an arrow. The `floating` primitive learned to position an arrow.

### Patch Changes

- [#95](https://github.com/human-kit/ui/pull/95) [`ffac2c1`](https://github.com/human-kit/ui/commit/ffac2c17344084e189bcc1ddfc26e225e0bce4e2) Thanks [@Agustin-Delgado](https://github.com/Agustin-Delgado)! - After an outside press on nothing focusable, Popover, Menu, Dialog, Drawer, DatePicker and Select return the focus to the trigger, with no focus ring. Dialog and Drawer restored it too early: the press moved the focus to the body right after. The focus fell to the body before, and a keyboard user had nowhere to continue from. A press on a focusable element keeps the focus there, and the trigger no longer shows a `data-focused` it does not have.

## 1.0.0-beta.7

### Minor Changes
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@human-kit/ui",
"version": "1.0.0-beta.7",
"version": "1.0.0-beta.8",
"description": "Accessible, typed UI components for Svelte 5 — shipped as native ESM with per-component subpath exports so bundlers only include what you import.",
"license": "MIT",
"author": "Agustin Delgado <agustindariodelgado@gmail.com>",
Expand Down
Loading