@uni-design-system/uni-core 8.3.1 → 9.0.0
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 +226 -0
- package/dist/cjs/index.cjs +128 -206
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/esm/index.js +129 -202
- package/dist/esm/index.js.map +1 -1
- package/dist/types/concepts/color/color.helper.d.ts +1 -7
- package/dist/types/concepts/color/color.helper.d.ts.map +1 -1
- package/dist/types/concepts/color/color.model.d.ts +0 -6
- package/dist/types/concepts/color/color.model.d.ts.map +1 -1
- package/dist/types/concepts/color/color.utils.d.ts +0 -7
- package/dist/types/concepts/color/color.utils.d.ts.map +1 -1
- package/dist/types/concepts/color/index.d.ts +0 -1
- package/dist/types/concepts/color/index.d.ts.map +1 -1
- package/dist/types/concepts/generation/theme-file.emitter.d.ts.map +1 -1
- package/dist/types/concepts/size/size.types.d.ts +15 -1
- package/dist/types/concepts/size/size.types.d.ts.map +1 -1
- package/dist/types/concepts/theme/spacing.spec.d.ts +2 -0
- package/dist/types/concepts/theme/spacing.spec.d.ts.map +1 -0
- package/dist/types/concepts/theme/theme.model.d.ts +35 -2
- package/dist/types/concepts/theme/theme.model.d.ts.map +1 -1
- package/dist/types/concepts/theme/themes/base.theme.d.ts +15 -2
- package/dist/types/concepts/theme/themes/base.theme.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/types/concepts/color/color.records.d.ts +0 -15
- package/dist/types/concepts/color/color.records.d.ts.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,231 @@
|
|
|
1
1
|
# @uni-design-system/uni-core
|
|
2
2
|
|
|
3
|
+
## 9.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [`8250162`](https://github.com/uni-design-system/uni/commit/8250162c35e418f976080904df4c20783feeb6e2) Thanks [@gaenglish](https://github.com/gaenglish)! - Every deprecated API is removed. The library now carries no `@deprecated`
|
|
8
|
+
symbols at all.
|
|
9
|
+
|
|
10
|
+
**Per-component duration options → the `motion` scale.** Six components carried
|
|
11
|
+
their own duration knob that predated the motion scale and _won over_ it:
|
|
12
|
+
`expand.transitionSpeed`, `callout.transitionMs`, `radio.transitionSpeed`,
|
|
13
|
+
`menuItem.transitionSpeed`, `alert.transitionSpeed` and
|
|
14
|
+
`snackbar.transitionDelay`. All are gone, along with the precedence branch each
|
|
15
|
+
one required — timing now comes from the token, full stop.
|
|
16
|
+
|
|
17
|
+
Retime the token instead; one edit covers every component pointing at it. To
|
|
18
|
+
retime a single component, define a token of your own and point that
|
|
19
|
+
component's `motion` option at it:
|
|
20
|
+
|
|
21
|
+
```ts
|
|
22
|
+
createTheme({
|
|
23
|
+
…,
|
|
24
|
+
motion: { productive: { duration: 110, easing: 'ease' } },
|
|
25
|
+
components: { menuItem: { options: { motion: 'productive' } } },
|
|
26
|
+
});
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
A `duration: 0` token is how a theme opts out of motion — that is what
|
|
30
|
+
`transitionSpeed: 0` used to mean. Both showcase themes are migrated this way
|
|
31
|
+
(Carbon to a 110ms `productive` token, Wellsourced to an `instant` one).
|
|
32
|
+
|
|
33
|
+
**Options that never did anything.** `card.transitionSpeed` and
|
|
34
|
+
`inputBox.transitionSpeed` were read by nothing and never had been. Delete them
|
|
35
|
+
from your theme; nothing replaces them.
|
|
36
|
+
|
|
37
|
+
**Renames and obsolete APIs**
|
|
38
|
+
- `inputBox.typeFace` → `typeface` (the casing every other component uses).
|
|
39
|
+
- `uni-tooltip`'s `appendToBody` input — inert since the tooltip moved to the
|
|
40
|
+
native top layer, which escapes any overflow context by itself.
|
|
41
|
+
- Box's `elevation` input → `shadow`, in both the Angular and React packages.
|
|
42
|
+
It was a second name for the same thing.
|
|
43
|
+
- The Angular `icons` re-export → import `BaseIcons` from
|
|
44
|
+
`@uni-design-system/uni-core`. The default set ships with every theme.
|
|
45
|
+
|
|
46
|
+
**The HSL color legacy is gone from uni-core.** `uniColor`, `randomRangeValue`,
|
|
47
|
+
`CategorySaturation` and `CategoryLightness` are removed, superseded by the
|
|
48
|
+
deterministic OKLCH engine (`generateThemes` / `generatePalette`) — same input,
|
|
49
|
+
same theme, WCAG-checked. `RoleHues` and the `UniColor` type go with them: they
|
|
50
|
+
were reachable only through `uniColor`, and `RoleHues` had gone stale enough to
|
|
51
|
+
hold saturation values in a table of hues.
|
|
52
|
+
|
|
53
|
+
**Deferred output renames.** Three outputs were held back because renaming is
|
|
54
|
+
breaking; this is that release. Each also drops an eslint escape it needed for
|
|
55
|
+
shadowing a native event name or using an `on` prefix.
|
|
56
|
+
|
|
57
|
+
| Component | Before | After |
|
|
58
|
+
| -------------------- | ----------------- | ---------------- |
|
|
59
|
+
| `uni-debounce-input` | `(change)` | `(valueChange)` |
|
|
60
|
+
| `uni-search-input` | `(change)` | `(searchChange)` |
|
|
61
|
+
| `uni-search-input` | `(search)` | `(searchSubmit)` |
|
|
62
|
+
| `dragAndDrop` | `(onFileDropped)` | `(fileDropped)` |
|
|
63
|
+
|
|
64
|
+
**`uni-dropdown`'s `color` input → `containerColor`,** completing the rule the
|
|
65
|
+
layout directives set: every container-pair input in the library is now
|
|
66
|
+
`containerColor`, and plain `color` always means the CSS property.
|
|
67
|
+
|
|
68
|
+
**`ThemeService.getSpacing('none')` now returns `0`, not the string `'none'`.**
|
|
69
|
+
`'none'` is not a valid length, so it was silently dropped wherever it landed —
|
|
70
|
+
`uni-menu` carried a comment working around exactly that, which is now deleted.
|
|
71
|
+
|
|
72
|
+
- [`c0c6056`](https://github.com/uni-design-system/uni/commit/c0c6056c61e994a45af9c379f3c99f55eebcb79a) Thanks [@gaenglish](https://github.com/gaenglish)! - The spacing scale is open, and `createTheme` finally accepts one.
|
|
73
|
+
|
|
74
|
+
The scale was a closed seven-name union on a doubling curve (2/4/8/16/32/64px).
|
|
75
|
+
Real layouts are rarely built exclusively on one — the gaps between 8 and 16,
|
|
76
|
+
and 16 and 32, are where a lot of real spacing lives — and there was no way to
|
|
77
|
+
add a step, because **`ThemeConfig` had no `spacing` field at all**:
|
|
78
|
+
`createTheme` hardcoded the base scale. The Wellsourced showcase theme had to
|
|
79
|
+
bolt its scale on after the fact with a post-hoc spread.
|
|
80
|
+
|
|
81
|
+
Three changes, which only work together:
|
|
82
|
+
- `NullableSize` gains a `(string & {})` arm, so any name the theme defines is a
|
|
83
|
+
valid `padding` / `gap` / `marginInline` value while the seven named steps keep
|
|
84
|
+
their autocomplete. `Size` itself stays closed — it also types _component_
|
|
85
|
+
sizes, where an arbitrary name has nothing to resolve against.
|
|
86
|
+
- `Spacing` is spelled out as named-optional-keys plus an index signature
|
|
87
|
+
(mirroring `Typography`), rather than a `Partial<Record<…>>` that would
|
|
88
|
+
collapse to a plain string record and lose the named steps.
|
|
89
|
+
- `createTheme({ spacing })` merges over the base scale.
|
|
90
|
+
|
|
91
|
+
```ts
|
|
92
|
+
createTheme({ id, name, colors, spacing: { tight: '6px', snug: '10px' } });
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
```html
|
|
96
|
+
<div stack-layout padding="tight" gap="snug">…</div>
|
|
97
|
+
```
|
|
98
|
+
|
|
99
|
+
Because the scale is open, a mistyped token can no longer be a compile error. It
|
|
100
|
+
is dropped — an `undefined` CSS value simply does not render — and
|
|
101
|
+
`ThemeService` now warns once per unknown token in development, naming the
|
|
102
|
+
tokens the active theme does define. Scaffolded `uni-theme.ts` files carry a
|
|
103
|
+
`spacing` block so the static theme file stays the editable source of truth.
|
|
104
|
+
|
|
105
|
+
**Behavior change:** `xxl` was in the `Size` union but defined by no base theme,
|
|
106
|
+
so `padding="xxl"` type-checked and rendered nothing. It is now `128px`,
|
|
107
|
+
completing the doubling — any element relying on the silent drop will start
|
|
108
|
+
showing spacing.
|
|
109
|
+
|
|
110
|
+
## 8.4.0
|
|
111
|
+
|
|
112
|
+
### Minor Changes
|
|
113
|
+
|
|
114
|
+
- [`1aca747`](https://github.com/uni-design-system/uni/commit/1aca747c7bdff6cf72a9fa349e77a6e7985b97c7) Thanks [@gaenglish](https://github.com/gaenglish)! - `uni-callout` and `uni-expand` now read their timing from the theme's `motion`
|
|
115
|
+
scale, so every animated surface in the library is retimed from one place.
|
|
116
|
+
They were the last two carrying their own motion options — in different units,
|
|
117
|
+
under different names (`transitionMs` in milliseconds, `transitionSpeed` in
|
|
118
|
+
seconds).
|
|
119
|
+
|
|
120
|
+
A third token joins `popup` and `panel`:
|
|
121
|
+
|
|
122
|
+
| Token | Default | Used by |
|
|
123
|
+
| -------- | ----------------- | --------------------- |
|
|
124
|
+
| `reveal` | 350ms ease-in-out | expand, expand-toggle |
|
|
125
|
+
|
|
126
|
+
`reveal` is a _base_ speed, not a final duration: `uni-expand` still scales it
|
|
127
|
+
by content height (√-of-height, clamped) so short regions stay snappy and tall
|
|
128
|
+
ones aren't rushed, and its easing now drives the reveal curve, which was
|
|
129
|
+
hardcoded. `uni-expand-toggle` resolves the token the same way, so the chevron
|
|
130
|
+
and the region cannot drift apart. `uni-callout` maps onto `panel`, whose
|
|
131
|
+
250ms matches what it already used.
|
|
132
|
+
|
|
133
|
+
**Not breaking.** `transitionMs` and `transitionSpeed` are deprecated but
|
|
134
|
+
still honoured, and deliberately outrank `motion` — a theme that set either
|
|
135
|
+
keeps precisely its current timing rather than being retimed underneath it.
|
|
136
|
+
They are removed next major. Per-instance inputs, like `uni-expand`'s
|
|
137
|
+
`transitionSpeed`, still outrank everything.
|
|
138
|
+
|
|
139
|
+
Nothing moves differently by default: callout renders 0.25s ease and expand
|
|
140
|
+
0.35s ease-in-out exactly as before, verified against the rendered styles.
|
|
141
|
+
|
|
142
|
+
- [`6f76c1d`](https://github.com/uni-design-system/uni/commit/6f76c1d3cc1ba2ed5e2747b6d2142d16cb4f537b) Thanks [@gaenglish](https://github.com/gaenglish)! - `uni-alert`, `uni-snackbar`, `uni-radio` and `uni-menu-item` now read their
|
|
143
|
+
timing from the theme's `motion` scale, which completes the migration: every
|
|
144
|
+
animated component in the library is retimed from one place.
|
|
145
|
+
|
|
146
|
+
Two tokens join `popup`, `panel` and `reveal`:
|
|
147
|
+
|
|
148
|
+
| Token | Default | Used by |
|
|
149
|
+
| -------------- | ----------------- | ---------------- |
|
|
150
|
+
| `notification` | 350ms ease-in-out | alert, snackbar |
|
|
151
|
+
| `control` | 300ms ease | radio, menu-item |
|
|
152
|
+
|
|
153
|
+
**One thing moves differently:** `menu-item`'s hover transition goes from
|
|
154
|
+
0.35s to 0.3s, joining `radio` on the shared `control` token. The two were
|
|
155
|
+
never deliberately different — `radio`'s own option documented its 0.3 as
|
|
156
|
+
"matching menuItem", which was not true — so this corrects drift rather than
|
|
157
|
+
changing a decision. A theme that wants the old timing can set the deprecated
|
|
158
|
+
`transitionSpeed`, or retime `control`. Everything else is byte-identical,
|
|
159
|
+
verified against the rendered styles.
|
|
160
|
+
|
|
161
|
+
**Deprecated, still honoured, removed next major:**
|
|
162
|
+
`alert.transitionSpeed`, `snackbar.transitionDelay`, `radio.transitionSpeed`
|
|
163
|
+
and `menuItem.transitionSpeed` all still work and still outrank `motion`, so a
|
|
164
|
+
theme that set them keeps its exact timing. `menu-item`'s escape hatch is
|
|
165
|
+
intact too: with neither the option nor a token set it still renders no
|
|
166
|
+
transition at all, and a token with `duration: 0` is the way to ask for
|
|
167
|
+
instant now.
|
|
168
|
+
|
|
169
|
+
`card.transitionSpeed` and `input-box.transitionSpeed` are also deprecated,
|
|
170
|
+
for a different reason: **neither was ever read by its component.** Setting
|
|
171
|
+
them has never had any effect. They are removed next major and nothing needs
|
|
172
|
+
to replace them.
|
|
173
|
+
|
|
174
|
+
`uni-skeleton` is deliberately left out. Its shimmer is a loop rather than a
|
|
175
|
+
transition, and folding a repeating animation into a scale built around
|
|
176
|
+
entering and leaving would make the scale mean two different things.
|
|
177
|
+
|
|
178
|
+
- [`228c17f`](https://github.com/uni-design-system/uni/commit/228c17f9fb7a4e4eb8d6a9cd0a6301d02ddd3dd3) Thanks [@gaenglish](https://github.com/gaenglish)! - `uni-skeleton` picks up the knobs an app theme could not reach. `color`, `highlightColor` and `borderRadius` are now inputs that take a token name and fall back to the theme option, because one screen routinely needs several of each — text bars and a pill chip do not share a corner (`borderRadius="max"`), and a skeleton on a card wants a different tint than one on the page background.
|
|
179
|
+
|
|
180
|
+
The shimmer is now a band swept with `transform` rather than an animated `background-position`: it composites instead of repainting every frame, and its geometry is themeable via two new options, `direction` (`'ltr' | 'rtl'`, default `'ltr'` — the sweep previously ran right-to-left) and `highlightWidth` (band width as a percentage of the block, default `40`). Both ends of the band are the base color, so it dissolves into the block with no alpha and no fringing.
|
|
181
|
+
|
|
182
|
+
A new `label` input announces a standalone skeleton: set it and the host becomes `role="status"` with visually hidden text instead of `aria-hidden="true"`. Unlabelled skeletons stay `aria-hidden`, so container-level `aria-busy` patterns are unchanged.
|
|
183
|
+
|
|
184
|
+
- [`3b51ace`](https://github.com/uni-design-system/uni/commit/3b51acee92659526c1c8c91668b37db8c5933162) Thanks [@gaenglish](https://github.com/gaenglish)! - Overlay timing is now a theme token. `UniTheme` gains a `motion` scale
|
|
185
|
+
alongside `radii`, `shadows` and the rest, and the overlays point at it by
|
|
186
|
+
name instead of carrying their own hardcoded durations.
|
|
187
|
+
|
|
188
|
+
Until now a theme could slow a skeleton shimmer but not a dropdown: `expand`,
|
|
189
|
+
`skeleton` and `callout` each exposed their own motion option while
|
|
190
|
+
`uni-dropdown` hardcoded 100ms and the combobox-style listbox popups copied
|
|
191
|
+
that constant. Retiming the library meant editing components.
|
|
192
|
+
|
|
193
|
+
Two tokens ship, because two things genuinely move differently — a small panel
|
|
194
|
+
attached to a control snaps, a larger free-floating surface settles:
|
|
195
|
+
|
|
196
|
+
| Token | Default | Used by |
|
|
197
|
+
| ------- | ------------------ | --------------------------------------------------------------------------- |
|
|
198
|
+
| `popup` | 100ms linear, ×0.8 | dropdown, menu, multi-select, combobox, search-input, tag-input, time-input |
|
|
199
|
+
| `panel` | 250ms ease | popover |
|
|
200
|
+
|
|
201
|
+
A token carries `duration` (ms), `easing`, and an optional `scale` for panels
|
|
202
|
+
that grow into place — one token rather than separate duration and easing
|
|
203
|
+
scales, because they are one design decision: slowing a panel without
|
|
204
|
+
softening its curve reads as sluggish rather than calm.
|
|
205
|
+
|
|
206
|
+
```ts
|
|
207
|
+
createTheme({
|
|
208
|
+
id: 'Calm',
|
|
209
|
+
name: 'Calm',
|
|
210
|
+
colors,
|
|
211
|
+
motion: { popup: { duration: 240, easing: 'ease-out', scale: 0.95 } },
|
|
212
|
+
});
|
|
213
|
+
```
|
|
214
|
+
|
|
215
|
+
Tokens you don't restate keep their base values, and a component can still
|
|
216
|
+
point at a token of its own through its `motion` option.
|
|
217
|
+
|
|
218
|
+
Nothing moves differently by default — every current duration, easing and
|
|
219
|
+
scale is preserved exactly, verified against the rendered styles. Themes that
|
|
220
|
+
predate the scale keep working: `createTheme` fills it in, the validator does
|
|
221
|
+
not require it, and a theme registered as JSON without it resolves to the base
|
|
222
|
+
timing rather than failing. `motionSafe` remains the floor, so a theme decides
|
|
223
|
+
how overlays move for people who want movement, never whether they move at
|
|
224
|
+
all.
|
|
225
|
+
|
|
226
|
+
`callout`'s existing `transitionMs` option and the `expand`/`skeleton`
|
|
227
|
+
durations are untouched for now; folding them into this scale is a follow-up.
|
|
228
|
+
|
|
3
229
|
## 8.3.1
|
|
4
230
|
|
|
5
231
|
## 8.3.0
|