Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
29 changes: 0 additions & 29 deletions .agents/skills/fulldev/SKILL.md

This file was deleted.

4 changes: 0 additions & 4 deletions .agents/skills/fulldev/agents/openai.yaml

This file was deleted.

32 changes: 0 additions & 32 deletions .agents/skills/fulldev/cli.md

This file was deleted.

26 changes: 0 additions & 26 deletions .agents/skills/fulldev/rules/blocks.md

This file was deleted.

19 changes: 0 additions & 19 deletions .agents/skills/fulldev/rules/components.md

This file was deleted.

19 changes: 0 additions & 19 deletions .agents/skills/fulldev/rules/layouts.md

This file was deleted.

21 changes: 0 additions & 21 deletions .agents/skills/fulldev/rules/source-ownership.md

This file was deleted.

25 changes: 10 additions & 15 deletions .agents/skills/ui-upstream-sync/SKILL.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
---
name: ui-upstream-sync
description: Audit and update the existing Fulldev Astro UI registry against current data-slot and shadcn/ui Base UI Vega. Use for periodic whole-library upstream parity passes, not ordinary single-component edits.
metadata:
internal: true
---

# Fulldev UI upstream sync
Expand All @@ -14,7 +16,7 @@ Use this skill only in the Fulldev UI registry source. The goal is a deliberate
- Treat Base UI with the Vega style as the shadcn comparison baseline. Do not accept the current CLI default if it differs.
- Preserve Astro APIs, data-slot behavior, forwarded props, state attributes, keyboard behavior, and accessibility.
- Port useful HTML, classes, variants, and public defaults. Do not port React-only state, refs, hooks, or composition that conflicts with data-slot.
- Do not copy theme-dependent classes unless this repo defines the required token. For example, `font-heading` is a no-op without a heading-font mapping.
- Do not copy theme-dependent classes unless this repo defines the required token.
- Treat `registry.json` as source and `public/r` as generated output. Never hand-edit generated registry files.

## Prepare the audit
Expand All @@ -39,18 +41,12 @@ Use this skill only in the Fulldev UI registry source. The goal is a deliberate

## Pass 2: shadcn/ui

1. Create a throwaway project outside the repo with `mktemp -d`.
2. Inspect current CLI help, then create a Vite project using Base UI and the Vega preset. The last known form is:

```bash
pnpm dlx shadcn@latest create --template vite --base base --preset vega
pnpm dlx shadcn@latest add --all
```

3. Use `pnpm dlx shadcn@latest docs <component>` for current official component docs.
1. In a throwaway directory outside the repo (`mktemp -d`), scaffold a Vite project with Base UI and the Vega style and install every component, as the shadcn skill describes.
2. Copy the current shadcn style files into `registry/styles/shadcn/` as `registry/styles/README.md` describes.
3. Use `shadcn docs <component>` for current official component docs.
4. Intersect the scratch project's components with this repo's existing families. Do not expand the audit to missing components.
5. Compare each matching family sequentially. Check markup order, class names, variants, sizes, default props, data attributes, focus and validation states, icon treatment, RTL behavior, and accessibility.
6. Adapt relevant differences to Astro and data-slot. Record intentional differences instead of forcing literal parity.
6. Adapt relevant differences to Astro and data-slot. Make visual changes through the placeholders and style files in `registry/styles/README.md`; never paste rendered Vega classes into component source. Record intentional differences instead of forcing literal parity.

## Registry and generated output

Expand All @@ -65,8 +61,7 @@ Use this skill only in the Fulldev UI registry source. The goal is a deliberate
## Validation and handoff

1. Format settled source and manifest changes.
2. Follow the release validation order in `AGENTS.md`.
2. Run `pnpm check`.
3. Run the dev server and inspect every changed component page in a real browser. Exercise relevant keyboard, pointer, open and close, selection, disabled, and RTL behavior. Check the browser console and server logs.
4. Use the Otis sharing instruction in `AGENTS.md` when the user needs tailnet access.
5. Give a concise per-family report. For each changed family, name the source change, whether it came from data-slot, shadcn, registry metadata, or more than one, and include its preview URL.
6. Also list reviewed unchanged families, validation results, intentional differences, generated-only drift, and release blockers.
4. Give a concise per-family report. For each changed family, name the source change, whether it came from data-slot, shadcn, registry metadata, or more than one, and include its preview URL.
5. Also list reviewed unchanged families, validation results, intentional differences, generated-only drift, and release blockers.
2 changes: 1 addition & 1 deletion AGENTS.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Fulldev UI

This repository is the Fulldev UI registry source, docs site and reference implementation. For conventions in client projects, use the `fulldev` skill in `.agents/skills`.
This repository is the Fulldev UI registry source, docs site and reference implementation. `skills/fulldev-ui` is the public skill for projects that use Fulldev UI; keep it in line with the docs when behavior changes.

## Components

Expand Down
7 changes: 7 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,13 @@ npx shadcn@latest add @fulldev/button

Visit [ui.full.dev][docs] for complete documentation, component examples, and usage guides.

For coding agents, install the shadcn skill and the Fulldev UI skill:

```bash
npx skills add shadcn/ui
npx skills add fulldotdev/ui --skill fulldev-ui
```

## Development

Requires Node 24 (`.node-version`) and pnpm 12. The published package supports Node 22.12+. Installs never run dependency or project lifecycle scripts (`pnpm-workspace.yaml`).
Expand Down
85 changes: 85 additions & 0 deletions skills/fulldev-ui/SKILL.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
---
name: fulldev-ui
description: Use together with the shadcn skill in projects that use Fulldev UI, the @fulldev registry of Astro components and blocks, or its React extension. Covers installing, presets, theming, customizing and writing blocks where Fulldev UI differs from shadcn/ui. Applies when components.json has an @fulldev registry.
---

# Fulldev UI

Fulldev UI is shadcn/ui for Astro: the same tokens, styles, presets and CLI,
plus content components, such as section, banner, header and typography, and
page blocks. Its React extension adds those extras and blocks to an official
shadcn/ui React project.

Use the [shadcn skill](https://github.com/shadcn-ui/ui/tree/main/skills/shadcn)
for the CLI, registries, semantic tokens and design principles. For Astro
component APIs, read the installed source and the docs at
`https://ui.full.dev/components/<name>.md`; `shadcn docs` describes the React
components. Start at [llms.txt](https://ui.full.dev/llms.txt), or
[react/llms.txt](https://ui.full.dev/react/llms.txt) for React. Where this skill
and the shadcn skill differ, this skill wins.

## Astro setup

- Fulldev UI serves only the Base UI styles (`base-vega`, `base-nova` and so
on) with Lucide icons. Move a legacy style, such as `new-york`, or a `radix-`
style to a `base-` style first; see
[Presets](https://ui.full.dev/docs/presets.md).
- The registry is `https://ui.full.dev/r/styles/{style}/{name}.json`. An older
URL without `{style}` always installs Vega.
- Start a project with
`init https://ui.full.dev/r/styles/base-<style>/base.json` in the preset's
style, not `init --preset`, then `apply <preset> --only theme,font`. With an
existing `components.json`, never run `init`, because it replaces the theme
tokens: add the registry, then `add @fulldev/init`.
- A full `apply` adds `@base-ui/react` and `lucide-react`, which Fulldev UI
does not use. Preset menu colors are not supported.
- `@fulldev/components` and `@fulldev/blocks` take the place of `add --all`.
- Components use container-query variants such as `@2xl:`, so page content
needs an `@container` ancestor, such as `LayoutMain` or `body`.

## Astro components

- There is no `asChild` or `render`. Components that can change element, such
as `Button`, `Card` and `Typography`, take `as`, and `Button` renders a link
when it gets `href`.
- Interactive components run on `@data-slot/*` scripts. Keep their `data-slot`
structure and state attributes.
- `class` is merged after the style's classes; other attributes go to the root.
- Content-owned icons are names rendered by `Icon`: Lucide, with Simple Icons
for brands and social links. Import icons fixed in code from
`@lucide/astro/icons/<name>`.

## Astro customization

Use built-in variants and size props first. A `class` on one instance is for
layout, as in shadcn/ui. To change the look, edit the theme tokens in the
stylesheet, then add a rule keyed on `data-slot`, `data-variant` or
`data-size`, and only then edit the installed file.
[Theming](https://ui.full.dev/docs/theming.md) lists what styles do not cover
and how to override important or variant classes.

In the DESIGN.md workflow, the steps for tokens, radius, elevation, type scale
and the focus outline apply. Make variant and focus-ring changes in the order
above instead of editing `cva` variants or component classes. Presets load
fonts from Fontsource; in a project that loads fonts another way, such as
Astro's font config, keep one. The design system page helpers are React-only.

## React extension

Set up the project with the official `shadcn init` and a Base UI style, then
add the registry `https://ui.full.dev/r/react/styles/{style}/{name}.json`.
Standard components, their APIs and customization follow the shadcn skill.
Fulldev extras and blocks use `className` and their documented React props.

## Blocks

A block is a portable section: it takes plain props and imports no project
schemas, content, layouts or routes. Pass images, labels, links, buttons and
content-owned icons as props. Forward `class` in Astro and `className` in
React, merged on the root with `cn()`.

Name props by role: `label` for controls, `title` for headings, `description`
for copy, `icon` for icon names, `href` for destinations and `buttons` for
calls to action. Name collections by their content, such as `features` or
`reviews`, and keep `items` for generic data. Button size belongs to the block,
not to its data.
2 changes: 1 addition & 1 deletion src/lib/llms.ts
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ ${sections.join("\n\n")}

> Open-source Astro components and blocks for content-driven websites, distributed as a shadcn-compatible registry.

Install items with \`npx shadcn@latest add @fulldev/<name>\` after adding the \`@fulldev\` registry (\`${origin}/r/{name}.json\`) to \`components.json\`. Every documentation page has a Markdown version: add \`.md\` to the page URL.
Install items with \`npx shadcn@latest add @fulldev/<name>\` after adding the \`@fulldev\` registry (\`${origin}/r/styles/{style}/{name}.json\`) to \`components.json\`. Every documentation page has a Markdown version: add \`.md\` to the page URL.

- [Agent entry point](${origin}/index.md)
- [Full documentation in one file](${origin}/llms-full.txt)
Expand Down
Loading