Docs

Cinder UI

Advanced.command

Server-rendered

Command palette layout.

This renders the shell of a command palette (input + list + items).

Command palette

General
Profile
Billing
Workspace
Settings
  <.command placeholder="Search commands...">
  <:group heading="General">
    <.item value="profile">Profile</.item>
    <.item value="billing">Billing</.item>
  </:group>

  <:group heading="Workspace">
    <.item value="settings">Settings</.item>
  </:group>
</.command>

Project switcher

Projects
Docs site
Demo app
Teams
Platform team
  <.command placeholder="Jump to project...">
  <:group heading="Projects">
    <.item value="docs">Docs site</.item>
    <.item value="demo">Demo app</.item>
  </:group>

  <:group heading="Teams">
    <.item value="platform">Platform team</.item>
  </:group>
</.command>

Attributes

Name Type Default Values Global Includes
class :string
placeholder :string "Type a command..."
rest :global

Slots

Slot Slot Attributes
group
heading (:string)