Vielzeug

Appearance

Looking Up Components ​

Problem ​

You need to discover which @vielzeug/sigil web components are available and inspect their attributes, events, slots, and CSS properties to generate correct usage code.

Solution ​

Call list-components to enumerate tags, then get-component with the desired tag to retrieve the full CEM declaration.

List available component tags ​

json
{ "name": "list-components", "arguments": {} }

Result excerpt:

json
[
  { "name": "Button", "tagName": "sg-button" },
  { "name": "Input", "tagName": "sg-input" },
  { "name": "Dialog", "tagName": "sg-dialog" }
]

Read one component declaration ​

json
{ "name": "get-component", "arguments": { "tagName": "sg-button" } }

The result is the full CEM declaration including attributes, members, events, slots, cssParts, and cssProperties.

Pitfalls ​

  • Both tools return isError: true when Sigil component metadata is not present in the snapshot. This happens in local monorepo builds when @vielzeug/sigil has not been built yet. Run rush build --to sigil then pnpm run prepare:data in packages/codex.
  • get-component matches on tagName exactly. Passing a class name like "Button" instead of "sg-button" returns an error.
  • Published releases always include Sigil CEM; the missing-metadata error only occurs during local development.