@vegastack/design 0.7.25 → 0.7.27

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vegastack/design",
-  "version": "0.7.25",
+  "version": "0.7.27",
   "description": "VegaStack design system — cn utility, icon runtime, Tailwind v4 preset, and the vegastack-design CLI (tokens ship separately as @vegastack/design-tokens)",
   "license": "MIT",
   "repository": {

package/skills/vegastack-design-system/SKILL.md

@@ -134,7 +134,7 @@ A component's name undersells it. Before composing something by hand, check this
 | `PageHeader`                                           | Title, description, `breadcrumb`, a back link (`backHref`) and `actions`.                                                                                                                                                                                                                                                                                                                        |
 | `MultiStepForm` · `Stepper` · `Questionnaire` · `Tabs` | A form in steps · progress display (`navigable` on request) · one question at a time · peer regions.                                                                                                                                                                                                                                                                                             |
 | `NativeSelect`                                         | The platform `<select>`, so a touch device opens its own picker.                                                                                                                                                                                                                                                                                                                                 |
-| `Board`                                                | A column's `lockedReason` explains why it cannot take a card; `itemLinkRender` is a template, the card's `href` wins.                                                                                                                                                                                                                                                                            |
+| `Board`                                                | `height` (`fill` · `auto` · a length), `onAdd` + `addLabel`, `collapsedColumns` + `onCollapsedChange`, `getColumnActions`, `readOnly`, `moveErrorToast`; a column's `lockedReason` explains why it cannot take a card; `itemLinkRender` is a template, the card's `href` wins.                                                                                                                   |
 | `AudioPlayer`                                          | `mediaRef` to drive playback, a transcript button and a waveform; `docked` pins it to the bottom of a scroll column, `variant="floating"` is the centred pill, `onOpenChange` adds its close button, `actionsRef` seeks it, and `onSourceExpired` renews an expired signed URL once. `AudioPlayerProvider` + `GlobalAudioPlayer` + `useGlobalPlayer()` keep one recording playing across routes. |
 | `Tabs`                                                 | `TabsList variant="line"` and `Tabs orientation="vertical"`; route tabs draw a `nav` from `tabsListVariants` and `tabsTriggerVariants`, which need no `data-orientation`. `useTabsSwipe` adds a touch swipe between controlled tabs.                                                                                                                                                             |
 | `MessageScroller`                                      | `defaultScrollPosition` (`start` · `end` · `last-anchor`), `scrollToMessage` from `useMessageScroller()`, and `useMessageScrollerVisibility()`.                                                                                                                                                                                                                                                  |
@@ -176,7 +176,17 @@ A component's name undersells it. Before composing something by hand, check this
   lanes with `onMove` and a per-section `loading` / `loadMore` / `emptyState`. Record images are a
   column `thumbnail` + `thumbnailFallback` (the app mark) — never a hand-rolled card grid, card or
   `<img>`. A count needing attention is `<Badge variant="warning"><TriangleAlert />n</Badge>`, and
-  groups in a ⋯ menu are split by `{ type: "separator" }` entries.
+  groups in a ⋯ menu are split by `{ type: "separator" }` entries; an action with `items` is a
+  submenu ("Change status ›", "Assign ›").
+- **A task or pipeline board** → `DataList view="board"` (or `Board` directly) with `BoardCard`
+  content: `boardCard={(row) => ({ title, context, due, priority, assignee, done, onDoneChange,
+source })}` — never a hand-rolled card. The board fills the viewport below the toolbar
+  (`boardHeight="fill"`, cards scroll inside lanes, no page scroll); `onAddToSection` adds "+ Add
+  {item}" per lane with the lane's status pre-filled; lanes collapse from their header ⋯
+  (`collapsedSections` to remember it). `onMove` is optimistic — return a promise and a rejection
+  snaps back with a toast, so never re-sort lanes yourself while it is pending. Drag, touch
+  long-press, keyboard (Space · arrows · Space · Esc), the Move menu and the phone's one-lane view
+  are built in; card actions go in `rowActions`/`getItemActions`, not on the `BoardCard`.
 - **A task's status or priority** → `StatusIcon` (todo, progress — static unless `animated`,
   blocked, done, cancelled) and `PriorityIcon` (urgent, high, medium, low, none flags). To change
   them, use the Status menu / Priority menu recipes on their docs pages — a ghost icon-button
@@ -193,9 +203,11 @@ closest one rather than composing the page from nothing:
 
 - **`app-shell-01`** — the shell: landmarks, skip link, a rail with search, inbox count and a user
   menu.
-- **`list-page-01`** — one kind of record: search, a facet, Mine | Team, table or tile grid, Load
-  more and three empty tiers.
-- **`board-01`** — lanes of cards under a `FilterBar`, with a paged backlog.
+- **`list-page-01`** — one kind of record: a `DataList` with a `FilterBar` toolbar (search, facets,
+  Mine | Team scope, the list's own Grid | List toggle), grouped by industry, Load more and three
+  empty tiers.
+- **`board-01`** — a `DataList` board of `BoardCard`s under a `FilterBar`: a backlog that pages as it
+  scrolls, "+ Add task" per lane, a locked lane and a submenu in each card's ⋯.
 - **`settings-01`** — one settings page: grouped `SettingsRow` sections and a save bar.
 - **`settings-02`** — the settings hub: grids of linked tiles, grouped by area.
 - **`review-split-01`** — a record reviewed beside a sticky transcript and a docked player; tabs

package/skills/vegastack-design-system/references/components.md

@@ -3,7 +3,7 @@
 <!-- GENERATED — do not hand-edit. Regenerated from the design system's component contract,
      which is the authority for membership and counts. -->
 
-**123 components**, plus 467 animated-icon items, 13 hooks (`use-animation-replay`, `use-announcer`, `use-async-search`, `use-drag-reorder`, `use-file-drop`, `use-inline-edit`, `use-list-nav`, `use-media-query`, `use-mobile`, `use-modal-inert`, `use-overflow`, `use-platform`, `use-tabs-swipe`), 10 starter blocks (`app-shell-01`, `board-01`, `command-search-01`, `list-page-01`, `login-01`, `notifications-01`, `review-split-01`, `settings-01`, `settings-02`, `status-pages-01`), 68 chart blocks across 7 families, and 3 data libs (`date-time`, `geo-data`, `drag-item`) — 684 registry items in total.
+**124 components**, plus 467 animated-icon items, 13 hooks (`use-animation-replay`, `use-announcer`, `use-async-search`, `use-drag-reorder`, `use-file-drop`, `use-inline-edit`, `use-list-nav`, `use-media-query`, `use-mobile`, `use-modal-inert`, `use-overflow`, `use-platform`, `use-tabs-swipe`), 10 starter blocks (`app-shell-01`, `board-01`, `command-search-01`, `list-page-01`, `login-01`, `notifications-01`, `review-split-01`, `settings-01`, `settings-02`, `status-pages-01`), 68 chart blocks across 7 families, and 3 data libs (`date-time`, `geo-data`, `drag-item`) — 685 registry items in total.
 
 Install any of them with `shadcn add @vegastack/<name>`. Animated icons install as
 `@vegastack/icon-<name>`; the bare name is reserved for components, so a component whose name
@@ -79,6 +79,7 @@ starts with `icon-` is a component and never an icon.
 
 ## Data
 
+- **`board-card`** — A work item as a board card — a round completion tick, a two-line title, a muted context line, and a bottom row with the due chip (destructive when overdue, warning when due today), the priority chip, a source icon and the assignee's avatar.
 - **`data-grid`** — The full-parity grid — TanStack-sorted multi-key sort, column picker with responsive revelation, collapsible grouping, keyboard-continuous load-more, opt-in virtualization, and an APG grid keyboard layer with inline cell editing.
 - **`data-list`** — A generic, typed data table — configurable columns, row selection, sortable columns (indicator, custom compare and first direction, client or manual), a standard rowActions ⋯ column always last, untinted-link rows (no underline), loading, and Empty-based emptyState and noResults states.
 - **`data-list-pager`** — A controlled paging footer for DataList — a tabular-numeral range summary, a rows-per-page Select, and a windowed Pagination that hides on a single page.
@@ -134,7 +135,7 @@ starts with `icon-` is a component and never an icon.
 
 - **`app-shell`** — The shared dashboard layout — a skip-linked sidebar + header + scrollable main region, composing Sidebar/SidebarTrigger into one reusable, hash-tracked shell.
 - **`aspect-ratio`** — Constrains its children to a given width-to-height ratio.
-- **`board`** — Kanban columns over use-drag-reorder — content/chrome split (host renders card content only), pointer drag, keyboard move mode + roving focus, lossless per-card Move menu with lock reasons, server-refusable moves, named lanes with a muted total count, loading and custom empty lanes, collapsed lanes, cards as real links, Empty-bordered drop targets.
+- **`board`** — Kanban lanes — full-height lanes that scroll their cards inside, sticky headers with a collapse menu, + Add at each lane's foot, Nothing here / Drop here empty zones, per-lane skeletons and load-on-scroll paging; live pointer and touch drag (lift, make room, settle, edge auto-scroll), a keyboard pick-up/move/drop model, a lossless per-card Move menu, optimistic moves with rollback and a toast, and one lane at a time on a phone.
 - **`direction`** — Base UI's DirectionProvider and useDirection — the text-direction context components read.
 - **`record-layout`** — A record page's main column beside a sticky right rail of cards, with an ⓘ Details sheet in its place on small screens.
 - **`resizable`** — Accessible resizable panel groups and layouts with keyboard support — horizontal or vertical, nestable, with an optional visible grip.