@keyfunc/keybricks-ds 2.6.0 → 2.8.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/DEPLOY.md +3 -3
- package/DESIGN.md +21 -5
- package/INTEGRATION.md +35 -4
- package/_adherence.oxlintrc.json +56 -11
- package/_ds_bundle.js +2153 -216
- package/_scripts/build-index.mjs +1 -1
- package/_src/icon-index.js +1 -1
- package/{components/feedback → _vue-services}/MESSAGE_SERVICES.md +2 -2
- package/_vue-services/_internal/MessageBoxView.vue +150 -0
- package/{components/feedback → _vue-services}/_internal/service-utils.js +0 -12
- package/_vue-services/message.js +87 -0
- package/assets/icons/icon-index.json +1 -1
- package/changelog.js +21 -2
- package/components/_cards/accordion.card.html +1 -1
- package/components/_cards/action-chip.card.html +1 -1
- package/components/_cards/activity.card.html +1 -1
- package/components/_cards/alert.card.html +1 -1
- package/components/_cards/app-chrome.card.html +1 -1
- package/components/_cards/banner.card.html +1 -1
- package/components/_cards/breadcrumb.card.html +1 -1
- package/components/_cards/button-1-base.card.html +5 -2
- package/components/_cards/button-2-states.card.html +5 -5
- package/components/_cards/button-3-sizes-icons.card.html +2 -2
- package/components/_cards/button-4-group.card.html +2 -2
- package/components/_cards/button-5-ai.card.html +34 -0
- package/components/_cards/canvas-zoom-controls.card.html +1 -1
- package/components/_cards/cards-indicators.card.html +1 -1
- package/components/_cards/charts-1-sparkline.card.html +1 -1
- package/components/_cards/charts-10-gauge.card.html +1 -1
- package/components/_cards/charts-11-funnel.card.html +1 -1
- package/components/_cards/charts-12-treemap.card.html +1 -1
- package/components/_cards/charts-14-radar.card.html +1 -1
- package/components/_cards/charts-15-distribution.card.html +1 -1
- package/components/_cards/charts-16-pareto.card.html +1 -1
- package/components/_cards/charts-17-candlestick.card.html +1 -1
- package/components/_cards/charts-18-sankey.card.html +1 -1
- package/components/_cards/charts-19-chord.card.html +1 -1
- package/components/_cards/charts-2-line.card.html +1 -1
- package/components/_cards/charts-20-sunburst.card.html +1 -1
- package/components/_cards/charts-21-worldmap.card.html +1 -1
- package/components/_cards/charts-22-gantt.card.html +1 -1
- package/components/_cards/charts-23-bar3d.card.html +1 -1
- package/components/_cards/charts-24-pie3d.card.html +1 -1
- package/components/_cards/charts-25-surface3d.card.html +1 -1
- package/components/_cards/charts-26-scatter3d.card.html +1 -1
- package/components/_cards/charts-27-ribbon3d.card.html +1 -1
- package/components/_cards/charts-3-bar.card.html +1 -1
- package/components/_cards/charts-4-barlist.card.html +1 -1
- package/components/_cards/charts-5-donut.card.html +1 -1
- package/components/_cards/charts-6-scatter.card.html +1 -1
- package/components/_cards/charts-7-heatmap.card.html +1 -1
- package/components/_cards/charts-8-waterfall.card.html +1 -1
- package/components/_cards/charts-9-bullet.card.html +1 -1
- package/components/_cards/charts-99-fullpage.card.html +1 -1
- package/components/_cards/checkbox.card.html +1 -1
- package/components/_cards/codeblock.card.html +1 -1
- package/components/_cards/combobox.card.html +1 -1
- package/components/_cards/context-menu.card.html +1 -1
- package/components/_cards/date-picker.card.html +1 -1
- package/components/_cards/diffvalue.card.html +1 -1
- package/components/_cards/divider.card.html +1 -1
- package/components/_cards/drawer.card.html +1 -1
- package/components/_cards/dropdown-menu.card.html +1 -1
- package/components/_cards/dropzone.card.html +1 -1
- package/components/_cards/empty-state.card.html +1 -1
- package/components/_cards/filter-bar.card.html +1 -1
- package/components/_cards/icon-button.card.html +1 -1
- package/components/_cards/icons-0-usage.card.html +2 -2
- package/components/_cards/icons-1-core.card.html +1 -1
- package/components/_cards/icons-2-feather.card.html +1 -1
- package/components/_cards/icons-2b-lucide.card.html +1 -1
- package/components/_cards/icons-3-unicons.card.html +1 -1
- package/components/_cards/icons-4-datasource.card.html +1 -1
- package/components/_cards/input.card.html +1 -1
- package/components/_cards/kbd.card.html +5 -7
- package/components/_cards/keyvalue.card.html +1 -1
- package/components/_cards/listrow.card.html +1 -1
- package/components/_cards/loading.card.html +1 -1
- package/components/_cards/log-viewer.card.html +1 -1
- package/components/_cards/modal.card.html +8 -2
- package/components/_cards/multi-select.card.html +1 -1
- package/components/_cards/number-stepper.card.html +1 -1
- package/components/_cards/pagination.card.html +1 -1
- package/components/_cards/people.card.html +1 -1
- package/components/_cards/pipeline-node.card.html +1 -1
- package/components/_cards/pipeline-palette.card.html +1 -1
- package/components/_cards/radio.card.html +1 -1
- package/components/_cards/relative-time-picker.card.html +1 -1
- package/components/_cards/search-global.card.html +72 -0
- package/components/_cards/search.card.html +1 -1
- package/components/_cards/segmented-control.card.html +1 -1
- package/components/_cards/select.card.html +1 -1
- package/components/_cards/slider.card.html +1 -1
- package/components/_cards/smart-table.card.html +1 -1
- package/components/_cards/spreadsheet.card.html +1 -1
- package/components/_cards/stepper.card.html +1 -1
- package/components/_cards/table.card.html +10 -1
- package/components/_cards/tabs.card.html +1 -1
- package/components/_cards/tag.card.html +1 -1
- package/components/_cards/textarea.card.html +1 -1
- package/components/_cards/timeline.card.html +1 -1
- package/components/_cards/toast.card.html +11 -1
- package/components/_cards/toggles.card.html +1 -1
- package/components/_cards/tooltip.card.html +1 -1
- package/components/_cards/tree.card.html +22 -1
- package/components/_vue/index.mjs +2 -0
- package/components/buttons/Button.d.ts +14 -5
- package/components/buttons/Button.jsx +45 -8
- package/components/buttons/Button.vue +40 -38
- package/components/buttons/Button.vue.d.ts +4 -1
- package/components/buttons/ai-button.js +54 -0
- package/components/buttons/buttons.prompt.md +7 -2
- package/components/data/Table.d.ts +5 -0
- package/components/data/Table.jsx +10 -5
- package/components/data/Table.vue +9 -3
- package/components/data/data.prompt.md +2 -0
- package/components/data/row-open.js +13 -0
- package/components/display/Kbd.d.ts +3 -1
- package/components/display/Kbd.jsx +8 -3
- package/components/display/Kbd.vue +7 -3
- package/components/display/display.prompt.md +3 -1
- package/components/feedback/Modal.d.ts +65 -7
- package/components/feedback/Modal.jsx +52 -22
- package/components/feedback/Modal.vue +24 -6
- package/components/feedback/Toast.vue +7 -7
- package/components/feedback/ToastStack.vue +37 -4
- package/components/feedback/feedback.prompt.md +6 -0
- package/components/feedback/modal-behavior.js +50 -0
- package/components/forms/GlobalSearch.d.ts +83 -0
- package/components/forms/GlobalSearch.jsx +172 -0
- package/components/forms/GlobalSearch.vue +161 -0
- package/components/forms/forms.prompt.md +7 -0
- package/components/forms/global-search.js +161 -0
- package/components/icons/Icon.d.ts +2 -0
- package/components/icons/Icon.jsx +14 -6
- package/components/icons/Icon.vue +11 -4
- package/components/icons/icon-paths.js +4 -2
- package/components/index.d.ts +1 -0
- package/components/index.js +1 -0
- package/components/navigation/TopBar.d.ts +9 -3
- package/components/navigation/TopBar.jsx +5 -7
- package/components/navigation/TopBar.vue +5 -6
- package/components/navigation/Tree.d.ts +5 -1
- package/components/navigation/Tree.jsx +9 -7
- package/components/navigation/Tree.vue +7 -6
- package/components/navigation/navigation.prompt.md +2 -0
- package/covers.js +4 -2
- package/gallery.html +1 -1
- package/guidelines/brand-logo.html +1 -1
- package/guidelines/colors-schemes.html +1 -1
- package/guidelines/colors-transparency.html +1 -1
- package/guidelines/foundations-borders.html +1 -1
- package/guidelines/foundations-chrome.html +1 -1
- package/guidelines/foundations-motion.html +1 -1
- package/guidelines/foundations-size-tiers.html +1 -1
- package/guidelines/foundations-spacing.html +1 -1
- package/guidelines/interaction-states.html +1 -1
- package/guidelines/type-extended.html +1 -1
- package/guidelines/type-mono.html +1 -1
- package/guidelines/type-scale.html +1 -1
- package/guidelines/type-weights.html +1 -1
- package/index.html +10 -10
- package/package.json +7 -6
- package/readme.md +4 -4
- package/readme.zh-CN.md +4 -4
- package/site-nav.js +1 -1
- package/styles.css +1 -0
- package/tokens/ai.css +17 -0
- package/tokens/colors.css +1 -1
- package/tokens/tokens.d.ts +28 -0
- package/tokens/tokens.js +47 -5
- package/tokens/tokens.json +123 -5
- package/components/feedback/_internal/MessageBoxView.vue +0 -237
- package/components/feedback/_internal/MessageView.vue +0 -73
- package/components/feedback/message.js +0 -68
- /package/{components/feedback → _vue-services}/message-box.d.ts +0 -0
- /package/{components/feedback → _vue-services}/message-box.js +0 -0
- /package/{components/feedback → _vue-services}/message.d.ts +0 -0
package/DEPLOY.md
CHANGED
|
@@ -55,11 +55,11 @@ deploys the documentation site. Watch it under *Build → Pipelines*.
|
|
|
55
55
|
**5. Cut the first release.**
|
|
56
56
|
|
|
57
57
|
```bash
|
|
58
|
-
git tag v2.
|
|
58
|
+
git tag v2.8.0 && git push --tags
|
|
59
59
|
```
|
|
60
60
|
|
|
61
61
|
That tag runs `generated:check` → `version:check` → `npm publish`. Confirm under *Deploy →
|
|
62
|
-
Package Registry*: `@keyfunc/keybricks-ds` 2.
|
|
62
|
+
Package Registry*: `@keyfunc/keybricks-ds` 2.8.0.
|
|
63
63
|
|
|
64
64
|
**6. Hand developers two things:** the Pages URL, and the `.npmrc` snippet in §4 below.
|
|
65
65
|
|
|
@@ -187,7 +187,7 @@ GitLab injects `CI_JOB_TOKEN` — use that instead and no secret is stored anywh
|
|
|
187
187
|
**Install — straight from git** (no registry, no publish; works today)
|
|
188
188
|
|
|
189
189
|
```json
|
|
190
|
-
"@keyfunc/keybricks-ds": "git+ssh://git@gitlab.epm2demo.cn/Felix/keybricks-ds.git#v2.
|
|
190
|
+
"@keyfunc/keybricks-ds": "git+ssh://git@gitlab.epm2demo.cn/Felix/keybricks-ds.git#v2.8.0"
|
|
191
191
|
```
|
|
192
192
|
|
|
193
193
|
Because the package has no build step, a git dependency needs no `prepare` script — npm
|
package/DESIGN.md
CHANGED
|
@@ -68,7 +68,7 @@ order (`app` → `surface` → `raised`) and depth reads correctly in both theme
|
|
|
68
68
|
| `--action-primary-hover` | `#1447e6` | Hover |
|
|
69
69
|
| `--action-primary-active` | `#1039c4` | Press |
|
|
70
70
|
| `--soft-bg` | `#eff6ff` | Tinted button surface |
|
|
71
|
-
| `--action-dark` | `#171717` | Dark pill (
|
|
71
|
+
| `--action-dark` | `#171717` | Dark pill (brand-level actions) — Prophet AI entries use `Button variant="ai"` |
|
|
72
72
|
|
|
73
73
|
### Feedback — always a trio (solid / tint / text-on-tint)
|
|
74
74
|
| Meaning | Solid | Tint bg | Text on tint |
|
|
@@ -160,10 +160,24 @@ collapsed), with a 56px brand head without a rule, a 2px-gap list of 36px items
|
|
|
160
160
|
it at 240px, in the **same tone**. Tones: `recessed` (default — grey rail, the active item is a white tile
|
|
161
161
|
with a hairline ring), `flush` (white rail), `contrast` (rail scoped to the dark theme) and `custom`
|
|
162
162
|
(dark scope on one of ten `SIDEBAR_COLORS`). Pick one tone per product and pass it to both
|
|
163
|
-
`Sidebar` and `SidePanel`. The top bar holds
|
|
164
|
-
AI
|
|
163
|
+
`Sidebar` and `SidePanel`. The top bar holds `GlobalSearch` on the left (⌘K / Ctrl K opens a 720px card over the bar; its AI rows and
|
|
164
|
+
`Button variant="ai"` hand the question to the Prophet AI panel) and, on the right, notifications, help and the user trigger, which opens `UserMenu` (identity,
|
|
165
165
|
appearance switch, rows).
|
|
166
166
|
|
|
167
|
+
### One component per job — team rule
|
|
168
|
+
|
|
169
|
+
Notices are `Toast` / `ToastStack`; dialogs are `Modal`. Vue code that opens them from a function call uses `Message` / `MessageBox`
|
|
170
|
+
(`_vue-services/`), which render with those same components — never a copy of their styles. Before building a new component,
|
|
171
|
+
check the component list; build one only when nothing fits, and please check with Felix first. Placement: `ToastStack` defaults to
|
|
172
|
+
bottom-right inside a page; app-wide messages from `Message` sit top-center.
|
|
173
|
+
|
|
174
|
+
### Global Search field — a sanctioned exception
|
|
175
|
+
|
|
176
|
+
The collapsed `GlobalSearch` field uses `SearchInput`'s box at rest (`--bg-surface`, 1px `--border-control`, `--radius-md`, muted
|
|
177
|
+
search glyph, standard `Kbd`), with two differences that apply to `GlobalSearch` only: the placeholder is `--text-secondary`
|
|
178
|
+
(not `--text-muted`), because it is the whole platform's entry prompt and must read at 4.5:1; and hover fills `--bg-inset` as
|
|
179
|
+
well as darkening the border to `--border-strong`. A plain `SearchInput` keeps its muted placeholder and border-only hover.
|
|
180
|
+
|
|
167
181
|
### Menus: action vs single choice
|
|
168
182
|
|
|
169
183
|
`ContextMenu` and `Menu` serve two kinds of list, and the row spacing says which one it is.
|
|
@@ -365,7 +379,7 @@ section title and 32px ghost buttons share it comfortably.
|
|
|
365
379
|
|
|
366
380
|
**Chrome** (fixed, not tiered): `--sidebar-w` 240 · `--rail-w` 64 · `--topbar-h` 56 ·
|
|
367
381
|
`--panel-w` 400 · `--drawer-h` 250 · `--h-nav-item` 36 · `--h-subnav-item` 32 ·
|
|
368
|
-
`--h-tree-item` 32.
|
|
382
|
+
`--h-tree-item` 32 (DocTree; `Tree` follows the size tier — `--control-h`, sm 28 · md 32 · lg 40).
|
|
369
383
|
|
|
370
384
|
**Page rhythm**: `--page-pad-y` 24px · `--page-pad-x` 32px · `--section-gap` 24px ·
|
|
371
385
|
`--card-pad` 21px (`--card-pad-sm` 17px for dense cards). Gaps inside a bar come from the tier:
|
|
@@ -395,6 +409,8 @@ transition: var(--t-hover); /* background, border-color, color */
|
|
|
395
409
|
Nothing bounces. Nothing slides more than a few pixels. Keyframes available:
|
|
396
410
|
`kb-fade-in`, `kb-rise`, `kb-toast-in`, `kb-spin`, `kb-pulse`, `kb-slide-in`.
|
|
397
411
|
|
|
412
|
+
`kb-ai-spin` is reserved for Prophet AI entry points: the second continuous animation after `kb-spin`, and the only one that changes speed (5s per turn at rest, 1.2s on hover, eased through `playbackRate` so the angle never jumps). Use it only through `Button variant="ai"`.
|
|
413
|
+
|
|
398
414
|
---
|
|
399
415
|
|
|
400
416
|
## Interaction states — you get these for free
|
|
@@ -457,7 +473,7 @@ The list that prevents the most rework. These are absolute.
|
|
|
457
473
|
`lineHeight`, where a bare number is a multiplier.)
|
|
458
474
|
- **Do not reference a palette step** (`--neutral-500`, `--blue-600`) in component code.
|
|
459
475
|
- **Do not use any font other than Inter and Menlo.** No Roboto, no Arial, no system-ui stack.
|
|
460
|
-
- **Do not use gradients.**
|
|
476
|
+
- **Do not use gradients.** Two exceptions only: the chart area fill, and Prophet AI (方知) entry points — `Button variant="ai"` and AI suggestion tiles, through the `--ai-*` tokens. Never build an AI gradient by hand.
|
|
461
477
|
- **Do not add drop shadows to content cards.** Cards use a 1px `--border-card` hairline.
|
|
462
478
|
- **Do not round the odd numbers.** `--card-pad` 21px and `--card-pad-sm` 17px are from the source
|
|
463
479
|
file; the 11px of `--text-2xs` is deliberate.
|
package/INTEGRATION.md
CHANGED
|
@@ -31,7 +31,7 @@ Not using a registry yet? A git dependency works with no publishing at all — t
|
|
|
31
31
|
has no build step, so npm can use the checkout as-is:
|
|
32
32
|
|
|
33
33
|
```json
|
|
34
|
-
"@keyfunc/keybricks-ds": "git+ssh://git@gitlab.epm2demo.cn/Felix/keybricks-ds.git#v2.
|
|
34
|
+
"@keyfunc/keybricks-ds": "git+ssh://git@gitlab.epm2demo.cn/Felix/keybricks-ds.git#v2.8.0"
|
|
35
35
|
```
|
|
36
36
|
|
|
37
37
|
**Source-only package.** `.jsx` and `.vue` files are published as authored, so your
|
|
@@ -163,7 +163,7 @@ Text, weight and tracking follow the tier through `--control-text` / `--control-
|
|
|
163
163
|
weight becomes 600 and all tracking is 0 — nothing to configure. `DESIGN.md` has the full token
|
|
164
164
|
table and the rules behind it.
|
|
165
165
|
|
|
166
|
-
## Component index (
|
|
166
|
+
## Component index (122 components)
|
|
167
167
|
Import path is `@keyfunc/keybricks-ds/components/<group>/<Name>.jsx` (React) or `.vue` (Vue 3).
|
|
168
168
|
Every component has a sibling `.d.ts` with its full props contract, and each group has a
|
|
169
169
|
`.prompt.md` with usage notes.
|
|
@@ -214,6 +214,7 @@ import Textarea from '@keyfunc/keybricks-ds/components/forms/Textarea.vue'
|
|
|
214
214
|
| `Combobox` | Type-to-filter single select, with keyboard nav and a no-results row. |
|
|
215
215
|
| `MultiSelect` | Checkbox dropdown; picks render as removable tags with `+n` overflow. |
|
|
216
216
|
| `SearchInput` | Search field with a leading glyph and a clear button. |
|
|
217
|
+
| `GlobalSearch` | The TopBar search: a quiet field with a ⌘K / Ctrl K hint that opens a 720px card — scopes, grouped results, Deep Search, and pinned rows that hand the question to the Prophet AI panel (`onAsk`). `GLOBAL_SEARCH_LABELS.en` / `.zh` hold the copy. |
|
|
217
218
|
| `Checkbox` | A 14 / 16 / 16px box by tier, plus an indeterminate state for parent rows. |
|
|
218
219
|
| `Radio` / `RadioGroup` | Single choice from 2–5 visible options (past five, use `Select`). `description` adds a muted second line; `row` lays out horizontally; `variant="cards"` renders bordered selectable cards for choices a user must weigh. Arrow keys move the selection. Vue: `v-model`. |
|
|
219
220
|
| `Switch` | Immediate on/off setting (no Save button). Track 28×16 at sm, 32×18 at md and lg — a switch has two sizes. A knob glyph (`knobIcon` / `knobText`, one character) needs md; the sm knob is too small. `insideOn`/`insideOff` for text in the pill, `labelOn`/`labelOff` for captions beside it (or `label` for a single settings caption). `tone="semantic"` is danger-off → success-on — reserve it for states with real consequence. `beforeChange(next)` returns a promise; the knob spins until it settles. Vue: `v-model:checked`. |
|
|
@@ -522,14 +523,44 @@ Pin a minor range and update deliberately:
|
|
|
522
523
|
- **Tokens outside CSS.** `tokens.json` / `tokens.js` / `tokens.d.ts` gained the tier tokens
|
|
523
524
|
(`--control-*`, `--bar-h`, `--group-gap`, …) — 352 light tokens in all (2.0.2 adds `--danger-soft-hover`).
|
|
524
525
|
|
|
525
|
-
### 2.
|
|
526
|
+
### 2.8.0
|
|
527
|
+
|
|
528
|
+
No API removed.
|
|
529
|
+
|
|
530
|
+
> **Team rule — read before adding UI.** Notices and dialogs use `Toast` / `ToastStack` and `Modal`; in Vue, call them through `Message` / `MessageBox`, which render with exactly those components. Before building any new component, look for one in the component list (this file's index and the documentation site). Build a new one only when nothing there fits — please check with Felix first. Copying a component's look into a new file is not allowed: every look lives in one component.
|
|
531
|
+
|
|
532
|
+
- **`Modal`** — always: focus moves in (`[data-autofocus]` first), Tab stays inside, Esc closes the topmost dialog, the page behind stops scrolling, focus returns on close. New optional props: `closeOnEsc`, `closeOnScrim`, `showClose`, `lockScroll`, `scrim`, `autoFocus` (all default `true`), `alert` (`role="alertdialog"`), `zIndex`, `closeLabel`. `onClose(reason)` / Vue `@close(reason)` gets `"close" | "esc" | "scrim"`. React `title` takes any node; Vue adds a `#title` slot.
|
|
533
|
+
- **`ToastStack`** — `placement` (`"bottom-right"` default · `"top-center"` · `"top-right"` · `"bottom-center"`), `offset`, `duration` (auto-dismiss, paused on hover / focus; per-item override), `zIndex`. Items gain `content`, `icon`, `count` (`× n`, restarts the timer), `dismissible`, `closeLabel`, `className` / `class`, `style`. `onDismiss(id, "close" | "timeout")`.
|
|
534
|
+
- **`Toast`** — `count` prop; `role="status"` (danger / warning: `role="alert"`).
|
|
535
|
+
- **Vue `Message` / `MessageBox`** now render with `ToastStack placement="top-center"` + `Toast`, and `Modal` + `Button` + `Input` / `Textarea`. Their own dialog styles and `MessageView.vue` are gone. Message stacks 8px apart (was 16).
|
|
536
|
+
|
|
537
|
+
- **`Table rowOpen`** — `"title"` (default, as before) | `"row"`. With `"row"` and `onRowOpen` (Vue `@row-open`), a click anywhere on a body row calls `onRowOpen(row, index, event)` and the row shows the hand cursor. Not on buttons (⋯, tree arrow), checkboxes, inputs, links, menus, the header, resize handles, or a click that ends a text selection. The twoLine tile and title open once, never twice. Tree folders: decide in `onRowOpen` whether to expand or enter.
|
|
538
|
+
- **`Tree` follows the size tier** of its region: row `--control-h` (sm 28 · md 32 · lg 40), text `--control-text` / `--control-leading` / `--control-tracking`, glyph `--control-icon` − 1px. md is pixel-identical to before; `--h-tree-item` is no longer read by Tree.
|
|
539
|
+
- **Vue `Message` / `MessageBox` source moved** from `components/feedback/` to `_vue-services/` (Vue-only services kept apart from the React + Vue components). Imports are unchanged: `@keyfunc/keybricks-ds/vue/message` and `/vue/message-box`. If you imported the files by path, update it.
|
|
540
|
+
- **`Tree` node `icon: false`** — no glyph and no gap on that row, even with `showIcon` on (e.g. a "Documents" root).
|
|
541
|
+
|
|
542
|
+
### 2.7.0
|
|
543
|
+
|
|
544
|
+
No API removed. Vue merges the 2.6.0 Button / Toast work above; React gets the same props.
|
|
545
|
+
|
|
546
|
+
- **`Button variant="ai"`** — for Prophet AI (方知) entry points only: 1px animated gradient ring, gradient tint and glow on hover; icon defaults to the new `prophet-sparkle` glyph. Tokens in `tokens/ai.css` (`--ai-gradient-*`, `--ai-tint*`, `--ai-spin-*`). `variant="dark"` stays for non-AI emphasis.
|
|
547
|
+
- **`GlobalSearch`** (new, forms/) — the TopBar search: a field with a ⌘K / Ctrl K hint that opens a 720px card (scopes, grouped results, Deep Search, pinned Ask Prophet AI row). It never shows AI answers; AI entries call `onAsk(question)`. Copy in `GLOBAL_SEARCH_LABELS.en` / `.zh`. Its collapsed field is a documented exception to `SearchInput` (`--text-secondary` placeholder, hover fill).
|
|
548
|
+
- **`TopBar`** renders `GlobalSearch` and no longer shows the black "AI Assistant" pill. `onAi` now receives the question; new `search` prop passes props to `GlobalSearch`. Old props keep working.
|
|
549
|
+
- **`Kbd`** — `"mod"`, `"alt"`, `"shift"`, `"enter"` follow the user's OS: ⌘ ⌥ ⇧ ↵ on macOS, Ctrl Alt Shift Enter elsewhere.
|
|
550
|
+
- **`Toast`** — tinted by tone (tone wash, solid tone border, tone-coloured text) so it reads against any page. React `Toast` gains `icon`, `children` and `closeLabel` (the Vue slots / prop from 2.6.0).
|
|
551
|
+
- **React `Button`** gains the 2.6.0 Vue props: `trailingIcon`, `nativeType`, `text`, element icons, `aria-busy`; `onClick` receives the event.
|
|
552
|
+
- **Icons:** new `prophet-sparkle`; the AI sparkle glyphs are redrawn.
|
|
553
|
+
- Docs site: every example card is sized to its content, so the page no longer jumps while cards load.
|
|
554
|
+
|
|
555
|
+
### 2.6.0
|
|
526
556
|
|
|
527
557
|
- Vue Button 支持原生点击事件、组件 / VNode 图标、图标及加载插槽、独立尾部图标、后备文本和原生按钮类型;旧 actnplanBtn 的适配方式见 [按钮适配说明](components/buttons/BUTTON_MIGRATION.md)。Vue 专用声明位于 `Button.vue.d.ts`,React 接口保持原样。
|
|
528
558
|
- Vue 新增 `@keyfunc/keybricks-ds/vue/message` 和 `@keyfunc/keybricks-ds/vue/message-box` 命令式服务入口;提供消息堆叠与分组,以及 alert / confirm / prompt、输入校验、关闭拦截、应用上下文和可配置默认文案。
|
|
529
559
|
- 复用现有 DS 控件,补充 Toast 默认内容、图标插槽及可配置关闭按钮标签。
|
|
530
|
-
- 与 Element Plus 的 API 对照、接入示例和兼容边界见 [消息服务迁移说明](
|
|
560
|
+
- 与 Element Plus 的 API 对照、接入示例和兼容边界见 [消息服务迁移说明](_vue-services/MESSAGE_SERVICES.md)。不承诺所有 Element Plus 功能及样式完全兼容。
|
|
531
561
|
- 本次仅修改源码及发布元数据;未执行测试、类型检查、构建、生成脚本或浏览器验证,发布前需同步生成产物中的版本元数据。
|
|
532
562
|
|
|
563
|
+
|
|
533
564
|
### 2.5.1
|
|
534
565
|
|
|
535
566
|
Fixes only — no API removed.
|
package/_adherence.oxlintrc.json
CHANGED
|
@@ -125,12 +125,12 @@
|
|
|
125
125
|
"message": "<BulletRow> doesn't accept that prop. Declared props: label, value, target, max, ranges."
|
|
126
126
|
},
|
|
127
127
|
{
|
|
128
|
-
"selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute > JSXIdentifier[name!=/^(?:variant|size|icon|iconSize|iconPosition|medium|disabled|loading|fullWidth|iconOnly|label|pressed|focused|onClick|children|style|key|ref|className|style|children)$/]",
|
|
129
|
-
"message": "<Button> doesn't accept that prop. Declared props: variant, size, icon, iconSize, iconPosition, medium, disabled, loading, fullWidth, iconOnly, label, pressed, focused, onClick, children, style."
|
|
128
|
+
"selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute > JSXIdentifier[name!=/^(?:variant|size|icon|trailingIcon|iconSize|iconPosition|medium|disabled|loading|fullWidth|iconOnly|label|text|nativeType|hovered|pressed|focused|onClick|children|style|key|ref|className|style|children)$/]",
|
|
129
|
+
"message": "<Button> doesn't accept that prop. Declared props: variant, size, icon, trailingIcon, iconSize, iconPosition, medium, disabled, loading, fullWidth, iconOnly, label, text, nativeType, hovered, pressed, focused, onClick, children, style."
|
|
130
130
|
},
|
|
131
131
|
{
|
|
132
|
-
"selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute[name.name='variant'] > Literal[value!=/^(?:primary|dark|outline|ghost|primary-soft|danger|danger-soft|text)$/]",
|
|
133
|
-
"message": "<Button> variant must be one of 'primary' | 'dark' | 'outline' | 'ghost' | 'primary-soft' | 'danger' | 'danger-soft' | 'text'."
|
|
132
|
+
"selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute[name.name='variant'] > Literal[value!=/^(?:primary|dark|outline|ghost|primary-soft|danger|danger-soft|text|ai)$/]",
|
|
133
|
+
"message": "<Button> variant must be one of 'primary' | 'dark' | 'outline' | 'ghost' | 'primary-soft' | 'danger' | 'danger-soft' | 'text' | 'ai'."
|
|
134
134
|
},
|
|
135
135
|
{
|
|
136
136
|
"selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute[name.name='size'] > Literal[value!=/^(?:sm|md|lg)$/]",
|
|
@@ -140,6 +140,10 @@
|
|
|
140
140
|
"selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute[name.name='iconPosition'] > Literal[value!=/^(?:left|right)$/]",
|
|
141
141
|
"message": "<Button> iconPosition must be one of 'left' | 'right'."
|
|
142
142
|
},
|
|
143
|
+
{
|
|
144
|
+
"selector": "JSXOpeningElement[name.name='Button'] > JSXAttribute[name.name='nativeType'] > Literal[value!=/^(?:button|submit|reset)$/]",
|
|
145
|
+
"message": "<Button> nativeType must be one of 'button' | 'submit' | 'reset'."
|
|
146
|
+
},
|
|
143
147
|
{
|
|
144
148
|
"selector": "JSXOpeningElement[name.name='Candle'] > JSXAttribute > JSXIdentifier[name!=/^(?:t|o|h|l|c|v|key|ref|className|style|children)$/]",
|
|
145
149
|
"message": "<Candle> doesn't accept that prop. Declared props: t, o, h, l, c, v."
|
|
@@ -276,6 +280,18 @@
|
|
|
276
280
|
"selector": "JSXOpeningElement[name.name='GaugeBand'] > JSXAttribute > JSXIdentifier[name!=/^(?:upTo|color|key|ref|className|style|children)$/]",
|
|
277
281
|
"message": "<GaugeBand> doesn't accept that prop. Declared props: upTo, color."
|
|
278
282
|
},
|
|
283
|
+
{
|
|
284
|
+
"selector": "JSXOpeningElement[name.name='GlobalSearchItem'] > JSXAttribute > JSXIdentifier[name!=/^(?:kind|title|sub|meta|icon|tone|keywords|onSelect|key|ref|className|style|children)$/]",
|
|
285
|
+
"message": "<GlobalSearchItem> doesn't accept that prop. Declared props: kind, title, sub, meta, icon, tone, keywords, onSelect."
|
|
286
|
+
},
|
|
287
|
+
{
|
|
288
|
+
"selector": "JSXOpeningElement[name.name='GlobalSearchItem'] > JSXAttribute[name.name='kind'] > Literal[value!=/^(?:feature|document|member|action)$/]",
|
|
289
|
+
"message": "<GlobalSearchItem> kind must be one of 'feature' | 'document' | 'member' | 'action'."
|
|
290
|
+
},
|
|
291
|
+
{
|
|
292
|
+
"selector": "JSXOpeningElement[name.name='GlobalSearchItem'] > JSXAttribute[name.name='tone'] > Literal[value!=/^(?:source|join|transform|merge|output)$/]",
|
|
293
|
+
"message": "<GlobalSearchItem> tone must be one of 'source' | 'join' | 'transform' | 'merge' | 'output'."
|
|
294
|
+
},
|
|
279
295
|
{
|
|
280
296
|
"selector": "JSXOpeningElement[name.name='HeatmapChart'] > JSXAttribute > JSXIdentifier[name!=/^(?:xLabels|yLabels|values|width|cellHeight|gap|scale|showValues|valueFormat|interactive|style|key|ref|className|style|children)$/]",
|
|
281
297
|
"message": "<HeatmapChart> doesn't accept that prop. Declared props: xLabels, yLabels, values, width, cellHeight, gap, scale, showValues, valueFormat, interactive, style."
|
|
@@ -289,8 +305,8 @@
|
|
|
289
305
|
"message": "<HistogramBucket> doesn't accept that prop. Declared props: from, to, n."
|
|
290
306
|
},
|
|
291
307
|
{
|
|
292
|
-
"selector": "JSXOpeningElement[name.name='Icon'] > JSXAttribute > JSXIdentifier[name!=/^(?:name|size|strokeWidth|color|style|className|key|ref|className|style|children)$/]",
|
|
293
|
-
"message": "<Icon> doesn't accept that prop. Declared props: name, size, strokeWidth, color, style, className."
|
|
308
|
+
"selector": "JSXOpeningElement[name.name='Icon'] > JSXAttribute > JSXIdentifier[name!=/^(?:name|size|strokeWidth|color|gradient|style|className|key|ref|className|style|children)$/]",
|
|
309
|
+
"message": "<Icon> doesn't accept that prop. Declared props: name, size, strokeWidth, color, gradient, style, className."
|
|
294
310
|
},
|
|
295
311
|
{
|
|
296
312
|
"selector": "JSXOpeningElement[name.name='IconButton'] > JSXAttribute > JSXIdentifier[name!=/^(?:icon|size|active|muted|danger|disabled|loading|label|pressed|focused|onClick|style|key|ref|className|style|children)$/]",
|
|
@@ -309,8 +325,12 @@
|
|
|
309
325
|
"message": "<Input> size must be one of 'sm' | 'md' | 'lg'."
|
|
310
326
|
},
|
|
311
327
|
{
|
|
312
|
-
"selector": "JSXOpeningElement[name.name='Kbd'] > JSXAttribute > JSXIdentifier[name!=/^(?:keys|style|key|ref|className|style|children)$/]",
|
|
313
|
-
"message": "<Kbd> doesn't accept that prop. Declared props: keys, style."
|
|
328
|
+
"selector": "JSXOpeningElement[name.name='Kbd'] > JSXAttribute > JSXIdentifier[name!=/^(?:keys|platform|style|key|ref|className|style|children)$/]",
|
|
329
|
+
"message": "<Kbd> doesn't accept that prop. Declared props: keys, platform, style."
|
|
330
|
+
},
|
|
331
|
+
{
|
|
332
|
+
"selector": "JSXOpeningElement[name.name='Kbd'] > JSXAttribute[name.name='platform'] > Literal[value!=/^(?:auto|mac|win)$/]",
|
|
333
|
+
"message": "<Kbd> platform must be one of 'auto' | 'mac' | 'win'."
|
|
314
334
|
},
|
|
315
335
|
{
|
|
316
336
|
"selector": "JSXOpeningElement[name.name='KeyValue'] > JSXAttribute > JSXIdentifier[name!=/^(?:label|value|mono|style|key|ref|className|style|children)$/]",
|
|
@@ -565,8 +585,8 @@
|
|
|
565
585
|
"message": "<TimelineItem> tone must be one of 'success' | 'danger' | 'warning' | 'info' | 'neutral'."
|
|
566
586
|
},
|
|
567
587
|
{
|
|
568
|
-
"selector": "JSXOpeningElement[name.name='TopBar'] > JSXAttribute > JSXIdentifier[name!=/^(?:placeholder|onSearch|actions|aiLabel|onAi|onNotifications|onHelp|notificationsLabel|helpLabel|user|userMenu|style|key|ref|className|style|children)$/]",
|
|
569
|
-
"message": "<TopBar> doesn't accept that prop. Declared props: placeholder, onSearch, actions, aiLabel, onAi, onNotifications, onHelp, notificationsLabel, helpLabel, user, userMenu, style."
|
|
588
|
+
"selector": "JSXOpeningElement[name.name='TopBar'] > JSXAttribute > JSXIdentifier[name!=/^(?:placeholder|onSearch|search|actions|aiLabel|onAi|onNotifications|onHelp|notificationsLabel|helpLabel|user|userMenu|style|key|ref|className|style|children)$/]",
|
|
589
|
+
"message": "<TopBar> doesn't accept that prop. Declared props: placeholder, onSearch, search, actions, aiLabel, onAi, onNotifications, onHelp, notificationsLabel, helpLabel, user, userMenu, style."
|
|
570
590
|
},
|
|
571
591
|
{
|
|
572
592
|
"selector": "JSXOpeningElement[name.name='TreeItem'] > JSXAttribute > JSXIdentifier[name!=/^(?:key|title|label|icon|hue|count|tag|children|disabled|disableCheckbox|selectable|checkable|isLeaf|key|ref|className|style|children)$/]",
|
|
@@ -734,6 +754,9 @@
|
|
|
734
754
|
"GaugeBand": {
|
|
735
755
|
"replaces": []
|
|
736
756
|
},
|
|
757
|
+
"GlobalSearchItem": {
|
|
758
|
+
"replaces": []
|
|
759
|
+
},
|
|
737
760
|
"HeatmapChart": {
|
|
738
761
|
"replaces": []
|
|
739
762
|
},
|
|
@@ -902,6 +925,17 @@
|
|
|
902
925
|
"--action-primary",
|
|
903
926
|
"--action-primary-active",
|
|
904
927
|
"--action-primary-hover",
|
|
928
|
+
"--ai-glow-blur",
|
|
929
|
+
"--ai-glow-opacity",
|
|
930
|
+
"--ai-gradient-end",
|
|
931
|
+
"--ai-gradient-start",
|
|
932
|
+
"--ai-gradient-stops",
|
|
933
|
+
"--ai-ring-rest-track",
|
|
934
|
+
"--ai-ring-width",
|
|
935
|
+
"--ai-spin-hover",
|
|
936
|
+
"--ai-spin-rest",
|
|
937
|
+
"--ai-tint",
|
|
938
|
+
"--ai-tint-press",
|
|
905
939
|
"--amber-100",
|
|
906
940
|
"--amber-200",
|
|
907
941
|
"--amber-300",
|
|
@@ -1630,7 +1664,18 @@
|
|
|
1630
1664
|
"--chart-heat-5": "color",
|
|
1631
1665
|
"--chart-heat-ink": "color",
|
|
1632
1666
|
"--press-filter": "other",
|
|
1633
|
-
"--press-filter-strong": "other"
|
|
1667
|
+
"--press-filter-strong": "other",
|
|
1668
|
+
"--ai-gradient-start": "color",
|
|
1669
|
+
"--ai-gradient-end": "color",
|
|
1670
|
+
"--ai-gradient-stops": "color",
|
|
1671
|
+
"--ai-ring-rest-track": "color",
|
|
1672
|
+
"--ai-ring-width": "spacing",
|
|
1673
|
+
"--ai-tint": "other",
|
|
1674
|
+
"--ai-tint-press": "other",
|
|
1675
|
+
"--ai-glow-blur": "spacing",
|
|
1676
|
+
"--ai-glow-opacity": "other",
|
|
1677
|
+
"--ai-spin-rest": "other",
|
|
1678
|
+
"--ai-spin-hover": "other"
|
|
1634
1679
|
},
|
|
1635
1680
|
"fontFamilies": [
|
|
1636
1681
|
"Inter"
|