ui-sdk

Installation
SKILL.md

Build with ui-sdk

ui-sdk is a library of UI behaviors: keyboard navigation, focus, selection, dismissal, popups, drag and drop and the ARIA they need. Its components are built from those behaviors and render no styles of their own, in React, Vue, Svelte, Solid and web components. @ui-sdk/core/web.css gives them an optional default look. When a component is missing, you build it from the same behaviors in @ui-sdk/core, and it gets the same keyboard, focus, server rendering and right to left support.

Read first

The docs for the installed version ship in each package, as Markdown:

  • node_modules/@ui-sdk/<framework>/docs/llms.txt is the index. Read it first. <framework> is react, vue, svelte, solid or web.
  • Then read only the pages your task needs, like docs/components/select.md. Don't read the whole docs/ folder; it's large.
  • An interface built from our components doesn't need docs/core.md. Only path 2 below does, and even then you search it by heading: it's over 300 KB. docs/rendering.md sits next to it in the same docs/ folder.
  • Don't read compiled JavaScript in dist/*.js, even to debug. The docs and the .d.ts types are the API; when they don't answer, write a small test that tries it.

The same docs are online at https://ui-sdk.dev/docs. Prefer the installed copy: it matches the version in the project.

A page with no build step, like an Artifact, installs nothing: it loads https://ui-sdk.dev/web.js and web.css with two tags. Read https://ui-sdk.dev/web.md instead of llms.txt. It's the web components docs in one file, for that page, and references/web-components.md has the rest.

Otherwise, if no @ui-sdk package is installed yet, install @ui-sdk/core and the framework's package with the project's package manager.

Installs
1.2K
Repository
vercel-labs/ui
GitHub Stars
3.5K
First Seen
2 days ago