# XWUINodeChip

A workflow node type chip: a monospaced type id preceded by a square dot that
names the node group.

## Style dependencies

The stylesheet declares no value of its own. It reads, and needs a host that
declares:

- base: `styles/core/reset.css`, `styles/core/typography.css`
- style: `styles/style/modern/spacing.css` for `--spacing-xs` and `--spacing-sm`
- theme colours: `--bg-elevated`, `--border-color`, `--text-primary`,
  `--text-secondary`, `--accent-primary`, and `--status-running` for the
  `xwbase` group. A theme that does not declare `--status-running` falls back to
  `--text-secondary`, so that group takes the neutral dot rather than no dot.
- theme roundness: `--radius-md`
- theme lines: `--border-width-thin`
- theme typography: `--font-family-mono`, `--font-size-xs`,
  `--font-weight-normal`, `--line-height-normal`, `--letter-spacing-normal`

## Basic usage

```ts
new XWUINodeChip(container, { typeId: 'manual.trigger', group: 'trigger' });
new XWUINodeChip(container, { typeId: 'xwbase.doc.get', group: 'xwbase', selected: true });
```

## Data

| Key | Type | Default | Meaning |
|---|---|---|---|
| `typeId` | string | `''` | Node type id as the engine registers it. Rendered left-to-right in every writing direction. |
| `group` | string | `''` | Node group. Colours the dot and reaches assistive technology as text. |

## Configuration

| Key | Type | Default | Meaning |
|---|---|---|---|
| `selected` | boolean | `false` | Accent border and primary label. |
| `frameless` | boolean | `false` | Drop the border, the padding and the fill, and take the surrounding colour. |
| `className` | string | none | Extra class on the chip element. |

### frameless

For a table cell or a running line of text, where a bordered object beside other
plain cells reads as a control rather than as a value. The dot and the gap stay,
so the group is still named by colour and the id still reads as an id.

`frameless` and `selected` are orthogonal and the source order in the stylesheet
says so: `--frameless` comes first, so a chip that is both keeps the brighter
label `--selected` asks for and still has no frame.

`frameless` also pins the id to the monospaced family, which the framed chip does
not do, and the difference is not cosmetic: the base typography sheet carries
`* { font-family: ... }`, a rule that matches the id element itself and therefore
beats the mono family the chip sets on its root and passes down by inheritance.
The framed chip has the same problem and is deliberately left alone here, because
changing it would repaint every chip already on a page. It is written up as a
defect rather than fixed in passing.

## Group dot

`trigger` takes `--accent-primary`, `xwbase` takes `--status-running`, every
other group takes `--text-secondary`. The dot is `aria-hidden`, so the group
reaches a screen reader as clipped text after the id instead.

## Accessibility

The chip is not interactive: no role, no tab stop, no pointer handler. It is a
label, so the 44px minimum target does not apply to it. A host that makes the
chip actionable must wrap it in a control that meets that target itself.