feat(Board)!: items are a title and a description, padded by the board

[lablup-octodog]

Resolves #71
Refs lablup/backend.ai-webui#10365

Summary

• BoardItem takes title and description, each a string or a node. A string title renders as a level-5 heading, a string description as text; a node renders as is, so a BoardItemTitle with a help tooltip and end-of-row actions is the title node to pass. Without a title there is no header row: the description takes the whole item.
• The board pads both: itemPadding takes a number (px) or a CSS length ("1rem", "var(--spacing-3)") for every side, or one per side ({ top, right, bottom, left }), default --spacing-5 top and bottom and --spacing-8 left and right. It is written on each item as the --board-item-padding-top / -right / -bottom / -left custom properties: style alone could not reach the padded elements inside the item, which is why the prop exists, and the properties stay settable from a stylesheet.
• The drag handle is absolute at the item's top-left corner, in the left padding on the title row's first line: its top offset is the top padding, so the two share a line by construction, and it keeps its spot when a title wraps or a node title grows. The handle is not padded; the left padding is what clears it.
• renderItem is removed, with BoardItemActions, removeItem, removedItem, liveAnnouncementItemRemoved and the uic.Board.itemRemoved catalog key (all 20 locales). An item is its title and description; removing one is the consumer's, by passing items without it (the TitleWithActions story does).
• BoardItemTitle is now a title node the board pads and places: no own padding-block, no position: sticky, no --board-item-title-z. The integration docs, README row and CHANGELOG follow.

item input	rendered	drag handle
title + description	header row + body, drawn and padded by the board	absolute, top-left corner, on the header row's first line
description only	the body takes the whole item	the same spot

This replaces the branch's first version, which moved the handle's absolute offset from --spacing-2 to --spacing-5 to match BoardItemTitle's padding and so held only for one consumer layout; the design in #71 makes the board own the title row and the padding instead.

Test plan

• src/components/Board/Board.test.tsx → "Board item title and description" (5 tests: string title as a heading in a header row followed by the body, the handle on the item outside the header, a node title as is, no header row without a title, the four padding custom properties from itemPadding as a number, a CSS length and per side, and the unset case). The rest of the suite now renders items through title.
• Storybook Components/Board: Default and Editable (title + description), TitleWithActions (a BoardItemTitle node with a tooltip and a Remove button), LongTitle (a wrapping string title and a node title that expands), NoTitle (the description takes the item), Padding (itemPadding={{ top: 12, right: 16, bottom: 12, left: 16 }}); every story's items carry only title and description (data: null). Measured with Playwright at 1100px: in Default, Editable and TitleWithActions the header is 68px tall, the handle's and the title's vertical centers coincide (35px from the item's top), title and body both start 33px from the item's edge; in NoTitle the handle sits at the same spot and the body starts 33px in; in Padding the header is 52px tall and the handle and title centers coincide at 27px, with title and body 17px from the edge; in LongTitle the handle's center meets the wrapped title's first-line center while the header grows, and opening the expandable title grows the header with the handle's top unchanged.

TitleWithActions sets parameters.docs.source.type = "code": Storybook's JSX snippet walks a rendered element's props, and Astryx elements created inside a render function hang it (bisected across nine throwaway stories; the same nodes passed through args, or rendered without the board, are fine). docs/storybook.md notes the rule.

Follow-up in backend.ai-webui

BAIBoard passes title / description (and itemPadding) through; the dashboard panels split into a title node (BAIBoardItemTitle with the refresh button and edit controls) and a body, and drop their own inline inset; Start page tiles pass description only. lablup/backend.ai-webui#10365 stays open until webui adopts a release with this change.

Verification

pnpm run verify (typecheck, lint, format:check, check:boundary, theme:check, test, build, check:pack, check:integration):

 Test Files  84 passed (84)
      Tests  1552 passed | 8 skipped (1560)
✓ built in 8.06s
Packed artifact clean: @lablup/ui-common 988 file(s), 166 export path(s) resolve; @lablup/ui-common-cli 35 file(s), bin and imports resolve.
[ok] No integration issues found.
988 packed files; 70/70 required files present.

[github-actions]

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR

GitHub Pages may take up to a minute to hydrate after the deploy.

🧩 Changed Components

Component	Changed	Stories	Open
Board	source + stories	7	Storybook ↗
BoardItemTitle	source	4	Storybook ↗

21 other changed file(s) in src/

• src/i18n/locales/de-DE.json
• src/i18n/locales/el-GR.json
• src/i18n/locales/es-ES.json
• src/i18n/locales/fi-FI.json
• src/i18n/locales/fr-FR.json
• src/i18n/locales/id-ID.json
• src/i18n/locales/it-IT.json
• src/i18n/locales/ja-JP.json
• src/i18n/locales/ko-KR.json
• src/i18n/locales/mn-MN.json
• …and 11 more

📦 Bundle Size

Group	Gzip	Δ Gzip vs base
assets	15.0 kB	+0.1 kB
components/Board	11.8 kB	+0.2 kB

Total gzip (JS + CSS): 168.8 kB (+0.3 kB vs origin/main)

---

_{Generated by the PR Preview workflow for 7358900 · Storybook · CI run}

[lablup-octodog]

Ready-gate agent review (Opus) — blocking issues only

NO BLOCKING ISSUES — the diff against main was read at 661a337; src/components/Board/Board.test.tsx passes (28/28).

No fixes were made after this review.

[ironAiken2]

The fix direction changed: see the Proposal in #71. The board should own the title row (BoardItem.title / description) and render the drag handle in the same header row as the title, instead of moving the absolute offset to match BoardItemTitle's padding. This PR is superseded as is.

[ironAiken2]

Rewritten in place with the #71 design (force-pushed as f31515e): BoardItem.title / description, the drag handle in the header row. The comment above about this PR being superseded refers to the earlier commit.

[ironAiken2]

LGTM