Power your agent
คำสั่งของผู้เผยแพร่เอง ไม่ใช่เอนด์พอยต์ของ PlugMCP
Host a copy with our keys and logs.
npx -y @golemui/[email protected]Claude Code ไม่มีลิงก์ติดตั้งสำหรับคำสั่งแบบโลคัล ให้คัดลอกคำสั่งด้านล่างแล้วรันในเทอร์มินัล
claude mcp add golemui-gui-mcp -- npx -y @golemui/gui-mcp@2.2.0รันในเทอร์มินัล
{ "mcpServers": { "golemui-gui-mcp": { "command": "npx", "args": [ "-y", "@golemui/[email protected]" ] } }}claude_desktop_config.json
URL แบบรีโมตหรือคำสั่งบนเครื่องของคุณ? การติดตั้งสองแบบต่างกันอย่างไร
รันบน PlugMCP
A new server you create. It is not this listing's official endpoint. Use the publisher install when you want their URL and their credentials.
เปิดจากผู้เผยแพร่
Define forms with the typed gui builder API, or as schema-validated JSON. Both produce the same serializable definition.
MCP server for GolemUI dynamic forms: gives AI coding assistants schema validation and form generation for GolemUI form definitions. Open source (MIT).
Install the four @golemui/* packages for your framework. The versions are published together; use matching versions.
# React
npm i @golemui/core @golemui/react @golemui/gui-react @golemui/gui-shared
# Angular
npm i @golemui/core @golemui/angular @golemui/gui-angular @golemui/gui-shared
# Lit
npm i @golemui/core @golemui/lit @golemui/gui-lit @golemui/gui-shared
# Vue
npm i @golemui/core @golemui/vue @golemui/gui-vue @golemui/gui-shared
# Vanilla JS (web component)
npm i @golemui/core @golemui/lit @golemui/gui-lit @golemui/gui-shared
Import the two stylesheets once, in this order, anywhere in your app entry:
@import '@golemui/gui-components/index.css';
@import '@golemui/gui-shared/forms.css';
Full walkthrough at golemui.com/getting-started/installation.
Define a form as an array of gui builders and pass it to the framework component (React shown):
import '@golemui/gui-components/index.css';
import '@golemui/gui-shared/forms.css';
import type { FormSubmitEvent } from '@golemui/core';
import { GuiForm } from '@golemui/gui-react';
import { gui } from '@golemui/gui-shared';
const formDef = [
gui.inputs.textInput('email', {
label: 'Email',
validator: { type: 'string', required: true, format: 'email' },
}),
gui.inputs.password('password', {
label: 'Password',
validator: { type: 'string', required: true, minLength: 8 },
}),
gui.inputs.checkbox('newsletter', {
label: 'Subscribe to the newsletter',
include: { when: '!!$form.email' },
}),
gui.actions.button({
label: 'Sign up',
actionType: 'submit',
disabled: { when: '$formIsInvalid' },
}),
];
function handleSubmit(event: FormSubmitEvent) {
console.log(event.data);
}
export function App() {
return <GuiForm config={{ formDef }} formSubmit={handleSubmit} />;
}
The submit button stays disabled while the form is invalid ($formIsInvalid is a built-in validity flag); on submit, formSubmit receives the collected data.
The same formDef value renders in every supported framework. See Integrations for per-framework setup, and the starter templates under templates/ for runnable examples.
Form definition. A form is an array of nodes (or a single node). Each node is either a gui builder result or a render function. The output is serializable JSON, so a definition can be stored, transferred, and rendered later.
The gui builder. Exported from @golemui/gui-shared, grouped into namespaces:
Conditional fields. Widgets accept include / exclude with a reactive expression over form data:
gui.inputs.radiogroup('city', { label: 'City', include: { when: '!!$form.country' } });
gui.actions.button({ label: 'Reset', include: { when: '$form.debug === true' } });
$form.<path> reads the current form data; the expression is evaluated at runtime.
Rendering per framework. Every adapter takes the definition through a config prop and emits a form submit event:
For vanilla JS, import @golemui/gui-lit to register the <gui-form> custom element, then set el.config = config and listen for the formSubmit event (e.detail is the FormSubmitEvent).
@standard-schema/spec compliant. Built-in string, number, boolean, array, and custom validators with rules such as required, minLength, format, minimum/maximum, and const. Error messages are localizable, and timing is configurable via validateOn (change, blur, submit, eager). DocsI18nTranslator adapter (i18next, Lingui, or your own) through localization. Labels, hints, and validator messages are translatable, with live language switching and automatic RTL. Docsaria-describedby for hints, aria-invalid and aria-errormessage on errors, plus keyboard navigation on interactive widgets.customWidgetLoaders. Docs@golemui/gui-mcp ships a golemui-mcp Model Context Protocol server with tools to validate form definitions, generate them from JSON Schema or OpenAPI, and type-check gui.* code.npx skills add golemui/golemui (works with Claude Code, Cursor, and other skills.sh-compatible agents). Its API reference is generated from the same compile-verified registry the MCP serves, so the two never disagree.Import only from a package's public entry points. The @golemui/*/internals paths are internal and unstable.
golemui.com for full docs, API reference, per-framework guides, examples, and migration paths.
Upgrading from 1.x? See MIGRATION-v2.md.
See CONTRIBUTING.md. The repository is an Nx monorepo; tests run on Vitest, and pull requests follow Conventional Commits.
MCP server for GolemUI dynamic forms: gives AI coding assistants schema validation and form generation for GolemUI form definitions. Open source (MIT).
{ "mcpServers": { "golemui-gui-mcp": { "command": "npx", "args": [ "-y", "@golemui/[email protected]" ] } }}เครื่องมือ
ยังไม่มีรายการเครื่องมือ เซิร์ฟเวอร์แบบรีโมตจะได้รายการหลังการตรวจสอบสถานะครั้งแรก
FAQ
คัดลอกคอนฟิก stdio สำหรับ Cursor, Claude Desktop, Claude Code หรือ VS Code ได้ในหน้านี้ คอนฟิกนี้ใช้การติดตั้งของผู้เผยแพร่ ไม่ใช่พร็อกซีของ PlugMCP
ระเบียนนี้ไม่ได้ระบุตัวแปรสภาพแวดล้อมที่จำเป็น
@golemui/gui ทำงานแบบโลคัลผ่าน stdio
ตรวจสอบล่าสุดเมื่อ 2026-11-14 MCP server for GolemUI dynamic forms: gives AI coding assistants schema validation and form generation for GolemUI form definitions. Open source (MIT).