@xue160709/omni-ui-shadcn

Optional shadcn registry source for OmniUI.

Use @xue160709/omni-ui-react directly when you are adding multimodal behavior to an existing React app. Use this registry when you want editable shadcn-style wrappers and starter recipes installed into your project.

The registry installs source files into components/multimodal/*. It does not replace or overwrite your existing components/ui/*.

Install Registry Items

Install one or more published registry items with the shadcn CLI:

npx shadcn@latest add https://xue160709.github.io/omni-ui/r/multimodal-provider.json
npx shadcn@latest add https://xue160709.github.io/omni-ui/r/multimodal-button.json
npx shadcn@latest add https://xue160709.github.io/omni-ui/r/multimodal-assistant-panel.json

During local development of this monorepo, start the demo-todo app first:

npm run dev

Then install one or more registry items with the shadcn CLI:

npx shadcn@latest add http://127.0.0.1:5173/r/multimodal-provider.json
npx shadcn@latest add http://127.0.0.1:5173/r/multimodal-button.json
npx shadcn@latest add http://127.0.0.1:5173/r/multimodal-assistant-panel.json

What It Installs

Low-level wrappers:

| Category | Registry items | | --- | --- | | Buttons and toggles | button, button-group, toggle, toggle-group | | Text inputs | input, textarea, input-otp, input-group | | Choice controls | checkbox, radio-group, switch, select, native-select, combobox | | Navigation | tabs, breadcrumb, navigation-menu, menubar, pagination, sidebar | | Overlays | dialog, alert-dialog, sheet, drawer, popover, tooltip, hover-card, context-menu, dropdown-menu | | Data and layout | table, list-item, card, item, scroll-area, resizable, progress | | Feedback and content | alert, empty, toast, sonner, calendar, date-picker, carousel | | Command surfaces | command |

Starter recipes:

• multimodal-assistant-panel: chat/command panel with local actions before optional model fallback.
• multimodal-form: semantic form, section, and action groups.
• multimodal-data-table: data view with visible-order row semantics and row action buttons.

Styling

Installed files are local source code. You can edit class names, markup, behavior, and theme usage directly.

The registry intentionally relies on the consumer app's shadcn components, Tailwind setup, and CSS variables instead of shipping a separate design system.

Registry source recipes import OmniUI base styles with:

import "@xue160709/omni-ui-react/styles.css"

Maintainer Commands

Generate local registry JSON for preview:

npm run registry:build

The generated files are written to apps/demo-todo/public/r and public/r.

Run registry tests and rebuild the registry output:

npm run verify:registry