@kungal/ui-tokens 1.6.0 → 1.6.2
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 +341 -0
- package/package.json +2 -1
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,341 @@
|
|
|
1
|
+
# @kungal/ui-tokens
|
|
2
|
+
|
|
3
|
+
## 1.6.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 05f2bee: chore: ship CHANGELOG.md in the published packages
|
|
8
|
+
|
|
9
|
+
`CHANGELOG.md` is now included in each package's npm tarball (added to `files`),
|
|
10
|
+
so downstream can read the per-version changes straight from the npm package
|
|
11
|
+
page — not only from the GitHub repo. (Releases also now appear on GitHub
|
|
12
|
+
Releases and the docs site's auto-generated /changelog page.)
|
|
13
|
+
|
|
14
|
+
## 1.6.1
|
|
15
|
+
|
|
16
|
+
## 1.6.0
|
|
17
|
+
|
|
18
|
+
## 1.5.0
|
|
19
|
+
|
|
20
|
+
## 1.4.2
|
|
21
|
+
|
|
22
|
+
## 1.4.1
|
|
23
|
+
|
|
24
|
+
## 1.4.0
|
|
25
|
+
|
|
26
|
+
## 1.3.0
|
|
27
|
+
|
|
28
|
+
## 1.2.0
|
|
29
|
+
|
|
30
|
+
## 1.1.1
|
|
31
|
+
|
|
32
|
+
## 1.1.0
|
|
33
|
+
|
|
34
|
+
## 1.0.0
|
|
35
|
+
|
|
36
|
+
### Major Changes
|
|
37
|
+
|
|
38
|
+
- ac0bd4e: 1.0.0 — first stable release.
|
|
39
|
+
|
|
40
|
+
The component set (57 Vue components) and the design-token system are stable and
|
|
41
|
+
documented. Over the 0.14 → 0.22 line every cross-cutting surface was routed
|
|
42
|
+
through a single source of truth: borders (`--color-kun-border` / `border-kun`),
|
|
43
|
+
focus rings (`kunFocusRingClasses`), corner radius (`rounded-kun-*` /
|
|
44
|
+
`--kun-radius-scale`), elevation (`--shadow-kun-*`), motion (`--kun-dur-*` +
|
|
45
|
+
`duration-kun-*` + `ease-kun-*`), and sizing (`kunControlSize` /
|
|
46
|
+
`kunSelectionSize` / `kunChipSize`).
|
|
47
|
+
|
|
48
|
+
Also fixes a registration gap surfaced while completing the docs: `KunAutocomplete`,
|
|
49
|
+
`KunNumberInput`, and `KunPinInput` (added in 0.14.0) were never added to the Nuxt
|
|
50
|
+
layer's auto-import list, so Nuxt consumers hit "Failed to resolve component". They
|
|
51
|
+
now auto-import like every other component (plain-Vue `app.use(KunUI)` already
|
|
52
|
+
registered them). Their docs pages, prop tables, and `llms.txt` entries are added.
|
|
53
|
+
|
|
54
|
+
## 0.22.4
|
|
55
|
+
|
|
56
|
+
## 0.22.3
|
|
57
|
+
|
|
58
|
+
## 0.22.2
|
|
59
|
+
|
|
60
|
+
## 0.22.1
|
|
61
|
+
|
|
62
|
+
## 0.22.0
|
|
63
|
+
|
|
64
|
+
## 0.21.0
|
|
65
|
+
|
|
66
|
+
## 0.20.0
|
|
67
|
+
|
|
68
|
+
### Minor Changes
|
|
69
|
+
|
|
70
|
+
- 40e8abf: feat: unified elevation scale + misc token cleanups
|
|
71
|
+
|
|
72
|
+
**Elevation scale** — floating surfaces were assigned `shadow-md` / `shadow-lg` /
|
|
73
|
+
`shadow-2xl` ad hoc, so same-kind surfaces disagreed (Select & Autocomplete
|
|
74
|
+
option lists were `shadow-lg`, but Dropdown & ContextMenu menus were `shadow-2xl`;
|
|
75
|
+
Modal had no shadow at all). New three-tier scale in `@kungal/ui-tokens` —
|
|
76
|
+
`--shadow-kun-sm` / `-md` / `-lg`, generating `shadow-kun-sm|md|lg` utilities
|
|
77
|
+
(they compose with `ring-*` via `--tw-shadow`, so a ringed toast still gets its
|
|
78
|
+
elevation). Applied by tier:
|
|
79
|
+
|
|
80
|
+
- **sm** — tooltips, slider value bubble
|
|
81
|
+
- **md** — popovers, dropdowns, context menus, select/autocomplete/date lists, toasts
|
|
82
|
+
- **lg** — modals (now actually elevated), drawers
|
|
83
|
+
|
|
84
|
+
**Misc consistency cleanups:**
|
|
85
|
+
|
|
86
|
+
- Raw Tailwind radii routed through the token scale: `KunBrand` / `KunNull`
|
|
87
|
+
`rounded-2xl` → `rounded-kun-lg`; `KunLoading` `rounded-lg` → `rounded-kun-md`
|
|
88
|
+
(so `--kun-radius-scale` now affects them too). The dark `KunLightbox` viewer
|
|
89
|
+
chrome keeps its own radii intentionally.
|
|
90
|
+
- `KunNumberInput` stepper buttons: `disabled:opacity-40` → `disabled:opacity-50`
|
|
91
|
+
to match every other disabled control.
|
|
92
|
+
|
|
93
|
+
- 40e8abf: feat: route component transitions through the motion scale
|
|
94
|
+
|
|
95
|
+
Transitions hardcoded raw `duration-150/200/300` and raw `ease-in/out/in-out`
|
|
96
|
+
that didn't match the designed motion tokens (overlay enters were `200ms` but
|
|
97
|
+
`--kun-dur-base` is `250ms`; some controls used symmetric `ease-in-out` while the
|
|
98
|
+
rest used the asymmetric `ease-kun-*` curves). Now unified:
|
|
99
|
+
|
|
100
|
+
- New `duration-kun-fast | base | slow | exit` utilities bound to `--kun-dur-*`
|
|
101
|
+
(with literal fallbacks). Every component transition routes through them, so a
|
|
102
|
+
global motion retune via the tokens actually propagates.
|
|
103
|
+
- Mapped by role, preserving the asymmetric rhythm (enter decelerates, exit
|
|
104
|
+
accelerates): overlay **enter → base**, **leave → exit**, hover/selection/focus
|
|
105
|
+
**micro → fast**, skeleton/fade/large **→ slow**.
|
|
106
|
+
- Remaining raw `ease-in-out` / `ease-out` Tailwind classes (Avatar, Input,
|
|
107
|
+
Textarea, Progress) switched to `ease-kun-standard` / `ease-kun-out`; scoped-style
|
|
108
|
+
easings (Content, Ripple) now read `var(--ease-kun-*)`. The looping indeterminate
|
|
109
|
+
progress keyframe and the dark Lightbox viewer keep their own timing.
|
|
110
|
+
|
|
111
|
+
Net effect: a single, consistent motion feel across every control. No API changes.
|
|
112
|
+
|
|
113
|
+
## 0.19.1
|
|
114
|
+
|
|
115
|
+
## 0.19.0
|
|
116
|
+
|
|
117
|
+
## 0.18.1
|
|
118
|
+
|
|
119
|
+
## 0.18.0
|
|
120
|
+
|
|
121
|
+
### Minor Changes
|
|
122
|
+
|
|
123
|
+
- 6fa75bb: feat(tokens,vue): unified neutral border token (`--color-kun-border` / `border-kun`)
|
|
124
|
+
|
|
125
|
+
Every structural hairline (inputs, textareas, selects, autocomplete, date picker,
|
|
126
|
+
cards, dividers, tabs, tooltips, popovers, dropdowns, context menus, drawers,
|
|
127
|
+
pagination, slider tooltip, radio cards, tag input) now resolves to ONE semantic
|
|
128
|
+
token instead of a scatter of `border-default-200` / `border-default/20` /
|
|
129
|
+
`dark:border-default-200` + a per-component `darkBorder` toggle.
|
|
130
|
+
|
|
131
|
+
- **New:** `--color-kun-border` (defaults to the `default-200` step, so it flips
|
|
132
|
+
light↔dark automatically) and a `border-kun` utility. Retheme every border at
|
|
133
|
+
once by overriding `--color-kun-border` (set it under `.kun-dark-mode` too for a
|
|
134
|
+
fixed non-flipping value). The global `*` border-color (opinionated base layer)
|
|
135
|
+
now points at this token as well, so a bare `border` matches `border-kun`.
|
|
136
|
+
- **Fixed:** `KunDivider` (and any control that used the translucent
|
|
137
|
+
`border-default/20` without a dark override) was ~half as bright as other
|
|
138
|
+
hairlines in dark mode (L13% vs L26%); it now matches everything else (L26%).
|
|
139
|
+
- **Consistency:** light mode is visually unchanged (the old `default/20`-over-white
|
|
140
|
+
already ≈ `default-200`); dark mode now collapses to a single neutral border value
|
|
141
|
+
across all components.
|
|
142
|
+
- Interactive-control borders intentionally stay one step stronger (checkbox/radio
|
|
143
|
+
boxes `default-300`, slider thumb) per common design-system practice — they are
|
|
144
|
+
not structural hairlines.
|
|
145
|
+
- **Deprecated (no-op):** the `darkBorder` prop on Input/Textarea/NumberInput/
|
|
146
|
+
Select/Autocomplete/DatePicker/Card. Safe to remove from call sites; kept for
|
|
147
|
+
backward compatibility. Note: an un-bordered `KunCard` that relied on
|
|
148
|
+
`darkBorder` to show a dark-only border should now use `bordered`.
|
|
149
|
+
|
|
150
|
+
## 0.17.2
|
|
151
|
+
|
|
152
|
+
### Patch Changes
|
|
153
|
+
|
|
154
|
+
- 9989b7c: fix(tokens): restore Modal / Drawer / Tab-indicator / toast / FadeCard animations
|
|
155
|
+
|
|
156
|
+
The motion duration tokens (`--kun-dur-fast/base/slow/exit`) were declared only
|
|
157
|
+
inside `@theme`. Tailwind v4 only emits an `@theme` variable to `:root` when its
|
|
158
|
+
scanner sees it "used", and these tokens have no utility namespace and are read
|
|
159
|
+
solely via `var(--kun-dur-base)` inside component `<style>` blocks / inline
|
|
160
|
+
styles — which Tailwind never scans. So in a normal downstream build they were
|
|
161
|
+
tree-shaken out of `:root`, every `transition: … var(--kun-dur-…) …` resolved to
|
|
162
|
+
`var(<undefined>)`, the whole shorthand was invalidated, and the enter/leave
|
|
163
|
+
animations on Modal, Drawer, the Tab indicator, toasts and FadeCard silently
|
|
164
|
+
collapsed to instant (regression from the "unified motion system" change).
|
|
165
|
+
|
|
166
|
+
They are now mirrored into a plain `:root` block (never tree-shaken), exactly
|
|
167
|
+
like the z-index fallbacks, so the animations resolve in every consumer build.
|
|
168
|
+
No API change.
|
|
169
|
+
|
|
170
|
+
## 0.17.1
|
|
171
|
+
|
|
172
|
+
## 0.17.0
|
|
173
|
+
|
|
174
|
+
## 0.16.0
|
|
175
|
+
|
|
176
|
+
## 0.15.0
|
|
177
|
+
|
|
178
|
+
## 0.14.0
|
|
179
|
+
|
|
180
|
+
## 0.13.0
|
|
181
|
+
|
|
182
|
+
## 0.12.0
|
|
183
|
+
|
|
184
|
+
## 0.11.0
|
|
185
|
+
|
|
186
|
+
## 0.10.0
|
|
187
|
+
|
|
188
|
+
### Minor Changes
|
|
189
|
+
|
|
190
|
+
- 7f8495d: A unified motion system — smoother, more consistent animation across every
|
|
191
|
+
component.
|
|
192
|
+
|
|
193
|
+
**Motion tokens (@kungal/ui-tokens).** One easing set + duration scale so the
|
|
194
|
+
whole library shares a rhythm instead of each component inventing its own:
|
|
195
|
+
`--ease-kun-standard / -out / -in / -emphasized` (also exposed as Tailwind
|
|
196
|
+
`ease-kun-*` utilities) and `--kun-dur-fast / -base / -slow / -exit`. Curves are
|
|
197
|
+
asymmetric by design — decelerate on enter, accelerate on exit — and exits run
|
|
198
|
+
~30% shorter than enters. The opinionated base layer now also honours
|
|
199
|
+
`prefers-reduced-motion: reduce` (WCAG 2.3.3).
|
|
200
|
+
|
|
201
|
+
**Killed the layout-thrashing animations** (these caused visible stutter):
|
|
202
|
+
|
|
203
|
+
- **KunTab** indicator no longer transitions `height` (it never changes between
|
|
204
|
+
same-row tabs); it slides via `transform` and only its `width` animates.
|
|
205
|
+
- **KunFadeCard** expands via the grid `0fr → 1fr` trick instead of `max-height`
|
|
206
|
+
— no more `max-h-96` clipping of tall content, no per-frame height recalc.
|
|
207
|
+
- **KunMessage** progress bar shrinks via `transform: scaleX` (compositor)
|
|
208
|
+
instead of animating `width`.
|
|
209
|
+
|
|
210
|
+
**Overlays retuned and made origin-aware.** KunModal now fades its backdrop
|
|
211
|
+
(opacity only) while the panel rises + scales independently; KunDrawer’s backdrop
|
|
212
|
+
and panel are timing-matched. KunDropdown / KunSelect / KunPopover / KunDatePicker
|
|
213
|
+
/ KunContextMenu now **grow out of their trigger** — `transform-origin` follows
|
|
214
|
+
the floating-ui placement, so a menu that flips above its trigger correctly grows
|
|
215
|
+
from its bottom edge. Every overlay shares the `ease-kun-*` curves and timing.
|
|
216
|
+
|
|
217
|
+
**Micro-interactions.** KunSlider’s thumb gains a hover/focus ring halo (it had
|
|
218
|
+
no feedback before); KunSwitch gains a keyboard `focus-visible` ring and a
|
|
219
|
+
springier thumb settle; KunCheckBox’s check eases in with the emphasized curve.
|
|
220
|
+
|
|
221
|
+
No component API changed. KunFadeCard now wraps its slot in a grid container (a
|
|
222
|
+
DOM-structure change); if you targeted its immediate child with CSS, retarget the
|
|
223
|
+
inner content.
|
|
224
|
+
|
|
225
|
+
## 0.9.0
|
|
226
|
+
|
|
227
|
+
### Minor Changes
|
|
228
|
+
|
|
229
|
+
- 0a57065: Make the default corner radius rounder, HeroUI-style.
|
|
230
|
+
|
|
231
|
+
The `--radius-kun-*` scale grows so the default control radius lands at HeroUI's
|
|
232
|
+
12px (it was 8px):
|
|
233
|
+
|
|
234
|
+
| bucket | before | after |
|
|
235
|
+
| ------ | ----------- | ----- |
|
|
236
|
+
| sm | 4px | 6px |
|
|
237
|
+
| md | 12 ←default | 12px |
|
|
238
|
+
| lg | 12px | 16px |
|
|
239
|
+
|
|
240
|
+
`md` (every component's default) is now **12px**, `lg` (floating panels — dropdown
|
|
241
|
+
/ context-menu / toast) is **16px**, which keeps their concentric nesting exact
|
|
242
|
+
(panel 16 = item 12 + the 4px `p-1` inset). The `--kun-radius-scale` runtime knob
|
|
243
|
+
still multiplies on top, and `none` / `full` still don't scale.
|
|
244
|
+
|
|
245
|
+
One component needed a fix at the larger radius: **KunCheckBox**. Its small square
|
|
246
|
+
box would look circular at a 12px token radius (12px ≈ half a 16–20px box), so the
|
|
247
|
+
box now uses a proportional `35%` radius — a rounded square at every size, never a
|
|
248
|
+
circle (matching how HeroUI derives its checkbox radius). The radio-look variant
|
|
249
|
+
stays a full circle. No other component needed a size change; pill/circle controls
|
|
250
|
+
(chips, avatars, switch, slider) are unaffected.
|
|
251
|
+
|
|
252
|
+
## 0.8.0
|
|
253
|
+
|
|
254
|
+
## 0.7.0
|
|
255
|
+
|
|
256
|
+
## 0.6.2
|
|
257
|
+
|
|
258
|
+
## 0.6.1
|
|
259
|
+
|
|
260
|
+
## 0.6.0
|
|
261
|
+
|
|
262
|
+
## 0.5.2
|
|
263
|
+
|
|
264
|
+
## 0.5.1
|
|
265
|
+
|
|
266
|
+
### Patch Changes
|
|
267
|
+
|
|
268
|
+
- bef6580: Add a runtime `--kun-radius-scale` knob for corner radius.
|
|
269
|
+
|
|
270
|
+
The scalable radius tokens (`sm` / `md` / `lg`) now multiply their base by
|
|
271
|
+
`var(--kun-radius-scale, 1)`, so a consumer can drive **every** KunUI corner at
|
|
272
|
+
once from a single CSS variable — live, with no re-render and no config change:
|
|
273
|
+
|
|
274
|
+
```css
|
|
275
|
+
:root {
|
|
276
|
+
--kun-radius-scale: 0;
|
|
277
|
+
} /* square corners everywhere */
|
|
278
|
+
:root {
|
|
279
|
+
--kun-radius-scale: 1.5;
|
|
280
|
+
} /* 50% rounder everywhere */
|
|
281
|
+
```
|
|
282
|
+
|
|
283
|
+
The default (`1`) leaves everything unchanged. `none` and `full` deliberately
|
|
284
|
+
don't scale (a square stays square; a pill stays a pill). Because
|
|
285
|
+
`--kun-radius-scale` is a separate, consumer-owned variable that the token
|
|
286
|
+
`calc()` reads, it avoids the cascade-order trap of trying to override
|
|
287
|
+
`--radius-kun-*` directly. (Small controls clamp `border-radius` to ~half their
|
|
288
|
+
height, so a button can't get rounder than a pill — by design.)
|
|
289
|
+
|
|
290
|
+
## 0.5.0
|
|
291
|
+
|
|
292
|
+
## 0.4.1
|
|
293
|
+
|
|
294
|
+
## 0.4.0
|
|
295
|
+
|
|
296
|
+
## 0.3.4
|
|
297
|
+
|
|
298
|
+
## 0.3.3
|
|
299
|
+
|
|
300
|
+
## 0.3.2
|
|
301
|
+
|
|
302
|
+
## 0.3.1
|
|
303
|
+
|
|
304
|
+
### Patch Changes
|
|
305
|
+
|
|
306
|
+
- 24de30a: Fix floating layers (popover / tooltip / modal / dropdown / drawer / select /
|
|
307
|
+
context-menu / alert / message) stacking at `auto` and getting covered by
|
|
308
|
+
positioned elements (carousels, sticky headers) in some consumer builds.
|
|
309
|
+
|
|
310
|
+
The `z-kun-*` z-index utilities deref a `@theme` variable with no fallback
|
|
311
|
+
(`z-index: var(--z-kun-popover)`). Tailwind v4 only emits a `@theme` variable to
|
|
312
|
+
`:root` when its tree-shaker considers it "used", and a custom `@utility`
|
|
313
|
+
referencing the var does not reliably count as usage across consumer
|
|
314
|
+
builds/versions — so `--z-kun-*` can be dropped from `:root`, leaving
|
|
315
|
+
`z-index: var(<undefined>)` → no z-index. Each utility now carries a literal
|
|
316
|
+
fallback (e.g. `var(--z-kun-popover, 9300)`), so the z-index always resolves;
|
|
317
|
+
a consumer's `:root { --z-kun-*: … }` override still wins when present.
|
|
318
|
+
|
|
319
|
+
## 0.3.0
|
|
320
|
+
|
|
321
|
+
## 0.2.5
|
|
322
|
+
|
|
323
|
+
## 0.2.4
|
|
324
|
+
|
|
325
|
+
## 0.2.3
|
|
326
|
+
|
|
327
|
+
## 0.2.2
|
|
328
|
+
|
|
329
|
+
## 0.2.1
|
|
330
|
+
|
|
331
|
+
## 0.2.0
|
|
332
|
+
|
|
333
|
+
### Minor Changes
|
|
334
|
+
|
|
335
|
+
- 35358f2: Settle on the `@kungal/ui-*` package namespace; the four packages are versioned and released together.
|
|
336
|
+
|
|
337
|
+
## 0.1.1
|
|
338
|
+
|
|
339
|
+
### Patch Changes
|
|
340
|
+
|
|
341
|
+
- c532a02: Add npm `keywords` to every package for better discoverability on the npm registry.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kungal/ui-tokens",
|
|
3
|
-
"version": "1.6.
|
|
3
|
+
"version": "1.6.2",
|
|
4
4
|
"description": "KunUI design tokens — framework-agnostic Tailwind v4 theme (semantic colors, radius, z-index, animations).",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"keywords": [
|
|
@@ -27,6 +27,7 @@
|
|
|
27
27
|
"*.css"
|
|
28
28
|
],
|
|
29
29
|
"files": [
|
|
30
|
+
"CHANGELOG.md",
|
|
30
31
|
"src"
|
|
31
32
|
],
|
|
32
33
|
"exports": {
|