@imfusion/web-ui 0.9.1-dev.10.g30c6815f → 0.9.1-dev.11.g7c95abf5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +34 -22
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,24 +1,49 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
-
##
|
|
3
|
+
## `0.10.0` 2026.10.15
|
|
4
|
+
|
|
5
|
+
### Highlights
|
|
6
|
+
|
|
7
|
+
#### A type hierarchy that holds at every width
|
|
8
|
+
|
|
9
|
+
Every fluid font size grows across the same viewport range, 360px to 1920px, so a heading never ends up smaller than the one
|
|
10
|
+
below it. `--imf-ui-font-size-fluid-0` to `fluid-2` follow one ratio scale above `--imf-ui-font-size-body`: `fluid-0` runs
|
|
11
|
+
from 19.2px to 25px, `fluid-1` from 23px to 31.25px, and `fluid-2` from 27.6px to 39px.
|
|
12
|
+
|
|
13
|
+
Headings change with it, so check your pages. `Typo.H3` uses `fluid-1` and `Typo.H4` uses `fluid-0`, both at the regular
|
|
14
|
+
weight. `Typo.H2` is medium weight, `Typo.Blockquote` uses `fluid-0`, and `--imf-ui-font-lineheight-title` follows the larger
|
|
15
|
+
H2 range. The Typo page has a Hierarchy story that shows every member at 360px, 768px, 1440px, and 1920px side by side.
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
#### New and updated components
|
|
21
|
+
|
|
22
|
+
- `RichLink` is new. It is a link that fills a row: an optional icon on a tile tinted in the primary color, a label, an
|
|
23
|
+
optional description, and a trailing arrow that `endGlyph` replaces. It renders a plain anchor, so TanStack Router's
|
|
24
|
+
`createLink` can wrap it. `imf-web-ui-ux` picks it for a link that fills its own row, and `ChipLink` for one inside text
|
|
25
|
+
([WEBSDK-272](https://imfusion.atlassian.net/browse/WEBSDK-272)).
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
- `Skeleton.Root` takes `loading` and fades the data in over the bones when it turns false.
|
|
31
|
+
|
|
32
|
+
- The `variant="position"` `Slider` thumb is primary at rest and gray on hover. It is opaque, so a `Slider.Indicator` under
|
|
33
|
+
it stays hidden. Every Slider thumb now draws its focus ring on keyboard focus.
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
4
37
|
|
|
5
38
|
### Added
|
|
6
39
|
|
|
7
|
-
- `RichLink` is a link that fills a row: an optional icon on a tile tinted in the primary color, a label, an optional
|
|
8
|
-
description line, and a trailing arrow for where it leads, which `endGlyph` replaces. It renders a plain anchor, so
|
|
9
|
-
TanStack Router's `createLink` can wrap it
|
|
10
|
-
([WEBSDK-272](https://imfusion.atlassian.net/browse/WEBSDK-272)) — Nikolaus Brunner <brunner@imfusion.com>
|
|
11
40
|
- Agent skills — Nikolaus Brunner <brunner@imfusion.com>
|
|
12
41
|
- `imf-web-ui-conventions` puts a stand-in for a missing Web UI component in `components/web-ui-pending/`, built as
|
|
13
42
|
the library would ship it and deleted once it does.
|
|
14
|
-
- Components — Nikolaus Brunner <brunner@imfusion.com>
|
|
15
|
-
- `Skeleton.Root` takes `loading` and fades the data in over the bones when it turns false.
|
|
16
43
|
|
|
17
44
|
### Changed
|
|
18
45
|
|
|
19
46
|
- Agent skills — Nikolaus Brunner <brunner@imfusion.com>
|
|
20
|
-
- `imf-web-ui-ux` picks `ChipLink` for a link inside text or a row of chips and `RichLink` for a link that fills its own
|
|
21
|
-
row ([WEBSDK-272](https://imfusion.atlassian.net/browse/WEBSDK-272)).
|
|
22
47
|
- The `web-ui-dev-new-component` interview asks where the design comes from: a new Claude Design canvas, a local HTML
|
|
23
48
|
sketch when the session has no Claude Design, an existing design or placeholder, or a sibling to copy. The plan links
|
|
24
49
|
the design source, and verification checks the built stories against it.
|
|
@@ -27,22 +52,9 @@
|
|
|
27
52
|
- Documentation — Nikolaus Brunner <brunner@imfusion.com>
|
|
28
53
|
- `docs/design-system.md` says to start new designs in the Claude app and when an agent session has Claude Design. The
|
|
29
54
|
standalone project's README marks it as legacy.
|
|
30
|
-
- Components — Nikolaus Brunner <brunner@imfusion.com>
|
|
31
|
-
- The `variant="position"` Slider thumb is primary at rest and gray on hover, with an outline ring on keyboard focus. It is
|
|
32
|
-
opaque, so a `Slider.Indicator` under it stays hidden.
|
|
33
|
-
- Typography — Nikolaus Brunner <brunner@imfusion.com>
|
|
34
|
-
- Every fluid font size grows across the same viewport range, 360px to 1920px, so the type hierarchy keeps its order at
|
|
35
|
-
every width. `--imf-ui-font-size-fluid-0` to `fluid-2` follow one ratio scale above `--imf-ui-font-size-body`:
|
|
36
|
-
`fluid-0` runs from 19.2px to 25px, `fluid-1` from 23px to 31.25px, and `fluid-2` from 27.6px to 39px.
|
|
37
|
-
- `Typo.H3` uses `--imf-ui-font-size-fluid-1` and `Typo.H4` uses `--imf-ui-font-size-fluid-0`, both at the regular
|
|
38
|
-
weight. `Typo.H2` uses the medium weight, and `Typo.Blockquote` uses `--imf-ui-font-size-fluid-0`.
|
|
39
|
-
- `--imf-ui-font-lineheight-title` follows the larger H2 range.
|
|
40
|
-
- The Typo page has a Hierarchy story that renders every member at 360px, 768px, 1440px, and 1920px side by side.
|
|
41
55
|
|
|
42
56
|
### Fixed
|
|
43
57
|
|
|
44
|
-
- Components — Nikolaus Brunner <brunner@imfusion.com>
|
|
45
|
-
- Slider thumbs draw their focus ring on keyboard focus.
|
|
46
58
|
- Storybook — Nikolaus Brunner <brunner@imfusion.com>
|
|
47
59
|
- The Slider `All` story renders the position variant without an indicator, as the `Position` story does.
|
|
48
60
|
|
package/package.json
CHANGED