Command Item — cinder playground

Overview

Individual selectable row within a command palette or dropdown command list.

<script lang="ts">
  import CommandItem from '@lostgradient/cinder/command-item';
</script>

<CommandItem />

Use when

Declaring an individual command, action, or result row inside a command-palette or command-menu.
Composing a custom palette layout via children rather than the items prop.

Avoid when

Used outside a command-palette or command-menu ancestor — the component throws at construction.
Rendering a generic dropdown choice — use dropdown-item instead.

Props for command-item
Name	Type	Default	Required	Description
`value`	`text`		req	Submitted value; surfaced through the registration record.
`onSelect`	`unknown`		req
`selectionMode`	`unknown`	`'item'`
`disabled`	`boolean`	`false`		When true, the item is skipped by arrow keys and cannot be activated.
`description`	`text`			Optional secondary text shown below the main label.
`accessibleLabel`	`string \| undefined`			Accessible name for the option when the rendered row contains secondary text or rich content.
`keyboardShortcut`	`string \| undefined`			Keyboard shortcut exposed through `aria-keyshortcuts`, e.g. `Meta+N`.
`leading`	`snippet`			Leading content (icon, avatar). Rendered with aria-hidden.
`trailing`	`snippet`			Trailing content (kbd hint, badge). Rendered with aria-hidden.
`children`	`snippet`		req	Main label content.