Beamline UI

Working · 4.1 s

io.beamline/beamlinev2.0.2 Domain verified

React UI parts your agent copies into your repo as code you own: 200+ components, 50+ screens.

Developer Tools

Website Registry entry

Maintain this server? Claim it

Try it

Call this server's tools from your browser. Nothing to install.

https://mcp.beamline.io/mcp

Requests go through mcptry because browsers can't call most MCP servers directly. Header values are sent to the server for that request only and are never stored or logged.

Tool list from our last check. Connect live to refresh it.

beamline_capabilities Read-only

The complete Beamline library and how to choose from it: a selection guide (screens and kits, data → control, screen craft, looks and install), then every screen and component with what it is for and what to use instead. Call it before designing and read every part in order; each answer names the next. Choose by the person's workflow and data: a block when its job, data and actions fit, otherwise the parts it is composed from; the most specific element for every item.

partnumber

Which part (1 = the guide, default). Each answer names the next.

Tools (4)

beamline_capabilities

read-only

Argument	Type	Description
part	number	Which part (1 = the guide, default). Each answer names the next.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "properties": {
    "part": {
      "type": "number",
      "description": "Which part (1 = the guide, default). Each answer names the next."
    }
  }
}

beamline_component

Exact details of Beamline elements: the import, required and typed props, states, keyboard, motion, the parts to style and working examples to copy. Call it for every element you chose, blocks included, before writing code with it; never guess props. Many ids come back in parts: call again with the same ids and the next part. A block's compose: lines list the parts it is built from, your kit when it fits only partly. Examples use gallery data; pass your own records in the documented types. A 🔒 element returns its description and uses, without code or props. Not for choosing elements: that is beamline_capabilities.

read-only

Argument	Type	Description
ids*	any	Element ids from beamline_capabilities, e.g. ["data-grid", "number-field"].
part	number	Which part, when many elements come back in parts (each part names the next).

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "ids"
  ],
  "properties": {
    "ids": {
      "anyOf": [
        {
          "type": "array",
          "items": {
            "type": "string"
          }
        },
        {
          "type": "string"
        }
      ],
      "description": "Element ids from beamline_capabilities, e.g. [\"data-grid\", \"number-field\"]."
    },
    "part": {
      "type": "number",
      "description": "Which part, when many elements come back in parts (each part names the next)."
    }
  }
}

beamline_install

One command that adds the chosen Beamline elements and a look (default prism) to the app: only those packages, one stylesheet and the look. Pass every element the screens need in one call; call it again to add more later. Run the command in the app folder, import the stylesheet once and pass the installed look to UIRoot. In an app that already has Beamline, pass installed (its release): the answer says when a newer one is out. Elements outside the person's packs are refused, naming the pack that has them.

read-only

Argument	Type	Description
ids*	any	Every element the screens need, by id from beamline_capabilities.
look	string	prism, soft, blueprint, glass, metal, glow, pop, mono or ink (default prism: black, neutral glass, white main action).
source	boolean	True for every Beamline file as editable source in the app, including runtime, foundation, selected looks and fonts; no @beamline dependencies. Needs Tailwind v4. Default false: compiled packages.
installed	string	The Beamline release the app already uses, if any: acceptedRelease.version in .beamline/package-selection.json (beamline-ui.lock.json for editable source). The answer then says when a newer one is out.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "ids"
  ],
  "properties": {
    "ids": {
      "anyOf": [
        {
          "type": "array",
          "items": {
            "type": "string"
          }
        },
        {
          "type": "string"
        }
      ],
      "description": "Every element the screens need, by id from beamline_capabilities."
    },
    "look": {
      "enum": [
        "prism",
        "soft",
        "blueprint",
        "glass",
        "metal",
        "glow",
        "pop",
        "mono",
        "ink"
      ],
      "type": "string",
      "description": "prism, soft, blueprint, glass, metal, glow, pop, mono or ink (default prism: black, neutral glass, white main action)."
    },
    "source": {
      "type": "boolean",
      "description": "True for every Beamline file as editable source in the app, including runtime, foundation, selected looks and fonts; no @beamline dependencies. Needs Tailwind v4. Default false: compiled packages."
    },
    "installed": {
      "type": "string",
      "description": "The Beamline release the app already uses, if any: acceptedRelease.version in .beamline/package-selection.json (beamline-ui.lock.json for editable source). The answer then says when a newer one is out."
    }
  }
}

beamline_picture

Inspect a candidate's layout and states, compare plausible choices, or show the person how a part looks. Returns one labelled states sheet in dark or light Prism and a public URL. Pictures of 🔒 elements are available too; their code still needs access. Choose pictures that resolve a design question rather than requesting the whole catalogue. This previews a library part, not the app you compose from it.

read-only

Argument	Type	Description
id*	string	One element id from beamline_capabilities.
theme	string	Sheet theme; default dark. Both use the default Prism look.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "id"
  ],
  "properties": {
    "id": {
      "type": "string",
      "description": "One element id from beamline_capabilities."
    },
    "theme": {
      "enum": [
        "dark",
        "light"
      ],
      "type": "string",
      "default": "dark",
      "description": "Sheet theme; default dark. Both use the default Prism look."
    }
  }
}