Installation

This registry follows the shadcn/ui registry schema and is meant to be consumed with the shadcn CLI (shadcn@latest). Use a direct URL to a published registry-item JSON, or register a namespace in components.json and add by name.

Prerequisites

Your project should already use shadcn/ui (Tailwind, components.json, @/components/ui aliases). If you are starting fresh:

pnpm dlx shadcn@latest init

npx shadcn@latest init

yarn dlx shadcn@latest init

bun x shadcn@latest init

Add a Component from This Registry

Point add at the item JSON served under /r (built from src/registry.json).

Example — Date picker (date-picker item → date-picker.json; range picker is date-range-picker.json):

pnpm dlx shadcn@latest add https://ui.isaacfei.com/r/date-picker.json

npx shadcn@latest add https://ui.isaacfei.com/r/date-picker.json

yarn dlx shadcn@latest add https://ui.isaacfei.com/r/date-picker.json

bun x shadcn@latest add https://ui.isaacfei.com/r/date-picker.json

The CLI resolves dependencies and registryDependencies (e.g. button, popover from the default registry) and writes files under the paths declared in the item.

Namespace (Optional)

To install with a short name instead of a long URL, add a registries entry in your components.json:

{
  "registries": {
    "@f-ui": "https://ui.isaacfei.com/r/{name}.json"
  }
}

Then:

pnpm dlx shadcn@latest add @f-ui/date

npx shadcn@latest add @f-ui/date

yarn dlx shadcn@latest add @f-ui/date

bun x shadcn@latest add @f-ui/date

Here {name} is the registry item name (e.g. date-picker → date-picker.json).

Registry Index

The full published manifest is available at /r/registry.json. It lists all items for tooling or manual inspection.

Next

• Date Picker and Date Range Picker — usage, props, and examples for the date-picker and date-range-picker registry items (shared date-internals lib).
• Text Inputs — email-input, url-input, and phone-input registry items.
• Empty Value Placeholder — empty-value-placeholder registry item.
• Currency Input — currency-input and currency-format registry items.
• Language Selector — language-selector registry item.
• Theme Controls — theme-mode-selector and theme-mode-toggle registry items.
• Code Block — @f-ui-private/code-block (Bearer token; Shiki, line numbers, copy).
• Mermaid Renderer — @f-ui-private/mermaid-renderer.
• Markdown Renderer — @f-ui-private/markdown-renderer.
• Data Table — @f-ui-private/data-table.