json-render-nuxt-ui 0.0.1 → 0.0.3

package/LICENSE

@@ -0,0 +1,7 @@
+Copyright 2026 Brainchimps GmbH
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -1,18 +1,178 @@
 # json-render-nuxt-ui
 
-Nuxt UI adapter package for Vercel `json-render`.
+Pre-built [Nuxt UI](https://ui.nuxt.com/) components for [json-render](https://json-render.dev/). Drop-in catalog definitions and Vue implementations to render JSON specs with Nuxt UI.
 
-## Install
+## Compatibility
+
+This package aims for compatibility with the official json-render shadcn package and tracks progress against its UI component set in [`SHADCN_UI_COMPONENTS_CHECKLIST.md`](./SHADCN_UI_COMPONENTS_CHECKLIST.md).
+
+## Installation
 
 ```bash
-pnpm add json-render-nuxt-ui
+npm install json-render-nuxt-ui @json-render/core @json-render/vue @nuxt/ui zod
 ```
 
-## Usage
+## Nuxt Plugin (required)
+
+> **Unlike @json-render/shadcn**, Nuxt UI components are auto-imported via compile-time template transforms — they are **not** registered globally at runtime. This package deliberately uses Vue's `resolveComponent()` instead of importing `@nuxt/ui` internals directly, so consumers keep full control over tree-shaking and bundled component set. The trade-off is that you must register the components yourself in a Nuxt plugin. `registerNuxtUiGlobals()` makes this easy.
 
-```ts
-import { helloWord } from "json-render-nuxt-ui";
+Create a plugin file (e.g. `plugins/register-json-render-nuxt-ui.ts`):
 
-console.log(helloWord());
-// Hello json-render!
+```typescript
+import {
+  registerNuxtUiGlobals,
+  nuxtUiComponentDefinitions,
+} from "json-render-nuxt-ui";
+import {
+  UCard,
+  UButton,
+  UInput,
+  USelect,
+  UCheckbox,
+  UTextarea,
+  USwitch,
+  UModal,
+} from "#components";
+
+export default defineNuxtPlugin((nuxtApp) => {
+  registerNuxtUiGlobals(
+    nuxtApp,
+    { UCard, UButton, UInput, USelect, UCheckbox, UTextarea, USwitch, UModal },
+    nuxtUiComponentDefinitions,
+  );
+});
 ```
+
+**How it works:**
+
+- The second argument is a record of Nuxt UI components imported from `#components` (Nuxt's virtual module). Only these are tree-shakeable — never use `import("#components")` dynamically.
+- The third argument determines which globals to register based on catalog component names. Pass `nuxtUiComponentDefinitions` to register all built-in components, or a subset like `{ Card: ..., Button: ... }` to register only what you use.
+- If you forget a component, you'll see a clear warning in the console telling you exactly which import to add.
+
+## Quick Start
+
+### 1. Create a Catalog
+
+Import standard definitions from `json-render-nuxt-ui/catalog` and pass them to `defineCatalog`:
+
+```typescript
+import { defineCatalog } from "@json-render/core";
+import { schema } from "@json-render/vue/schema";
+import { nuxtUiComponentDefinitions } from "json-render-nuxt-ui/catalog";
+
+const catalog = defineCatalog(schema, {
+  components: {
+    Card: nuxtUiComponentDefinitions.Card,
+    Header: nuxtUiComponentDefinitions.Header,
+    Button: nuxtUiComponentDefinitions.Button,
+    Input: nuxtUiComponentDefinitions.Input,
+  },
+  actions: {},
+});
+```
+
+> **Note:** State actions (`setState`, `pushState`, `removeState`, `validateForm`) are built into the Vue schema and handled automatically by `ActionProvider`.
+
+### 2. Create a Registry
+
+Import implementations from `json-render-nuxt-ui` and pass them to `defineRegistry`:
+
+```typescript
+import { defineRegistry } from "@json-render/vue";
+import { nuxtUiComponents } from "json-render-nuxt-ui";
+
+const { registry } = defineRegistry(catalog, {
+  components: {
+    Card: nuxtUiComponents.Card,
+    Header: nuxtUiComponents.Header,
+    Button: nuxtUiComponents.Button,
+    Input: nuxtUiComponents.Input,
+  },
+});
+```
+
+### 3. Render
+
+```vue
+<script setup lang="ts">
+import { JSONUIProvider, Renderer } from "@json-render/vue";
+</script>
+
+<template>
+  <JSONUIProvider :registry="registry" :initial-state="{}">
+    <Renderer :spec="spec" :registry="registry" />
+  </JSONUIProvider>
+</template>
+```
+
+## Extending with Custom Components
+
+Start from the built-ins and add your own:
+
+```typescript
+import { z } from "zod";
+
+const catalog = defineCatalog(schema, {
+  components: {
+    Card: nuxtUiComponentDefinitions.Card,
+    Header: nuxtUiComponentDefinitions.Header,
+    Button: nuxtUiComponentDefinitions.Button,
+    Input: nuxtUiComponentDefinitions.Input,
+
+    Metric: {
+      props: z.object({
+        label: z.string(),
+        value: z.string(),
+      }),
+      description: "Simple metric item",
+    },
+  },
+  actions: {},
+});
+```
+
+## Standard Components
+
+### Layout
+
+| Component | Description |
+|-----------|-------------|
+| `Card` | Container card with optional title and description |
+| `Header` | Section heading with optional description |
+
+### Input
+
+| Component | Description |
+|-----------|-------------|
+| `Button` | Clickable button (emits `press`) |
+| `Input` | Text input with optional two-way state binding on `value` |
+| `Select` | Select input with optional two-way state binding on `value` |
+| `Checkbox` | Checkbox with optional two-way state binding on `checked` |
+| `Textarea` | Multiline input with optional two-way state binding on `value` |
+| `Switch` | Toggle switch with optional two-way state binding on `checked` |
+
+### Overlay
+
+| Component | Description |
+|-----------|-------------|
+| `Dialog` | Modal dialog with open binding and `confirm` / `cancel` events |
+
+## Built-in Actions
+
+State actions (`setState`, `pushState`, `removeState`, `validateForm`) are built into `@json-render/vue` schema and handled by `ActionProvider`.
+
+| Action | Description |
+|--------|-------------|
+| `setState` | Set a value at a state path |
+| `pushState` | Push a value onto an array in state |
+| `removeState` | Remove an item from an array in state |
+| `validateForm` | Validate all fields and write result to state |
+
+## Exports
+
+| Entry Point | Exports |
+|-------------|---------|
+| `json-render-nuxt-ui` | `nuxtUiComponents`, `nuxtUiComponentDefinitions`, `registerNuxtUiGlobals` |
+| `json-render-nuxt-ui/catalog` | `nuxtUiComponentDefinitions` |
+
+The `/catalog` entry point contains only Zod schemas and can be used in server-side prompt generation. The main entry re-exports `nuxtUiComponentDefinitions` for convenience so you only need one import in your plugin.

package/dist/catalog.d.mts

@@ -0,0 +1,254 @@
+import { z } from 'zod';
+
+/**
+ * Type for a component definition.
+ */
+type ComponentDefinition = {
+    props: z.ZodType;
+    slots?: string[];
+    events?: string[];
+    description: string;
+    example?: Record<string, unknown>;
+};
+declare const nuxtUiComponentDefinitions: {
+    Stack: {
+        props: z.ZodObject<{
+            gap: z.ZodOptional<z.ZodEnum<{
+                none: "none";
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+    };
+    Row: {
+        props: z.ZodObject<{
+            gap: z.ZodOptional<z.ZodEnum<{
+                none: "none";
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+            align: z.ZodOptional<z.ZodEnum<{
+                start: "start";
+                center: "center";
+                end: "end";
+                stretch: "stretch";
+            }>>;
+            justify: z.ZodOptional<z.ZodEnum<{
+                start: "start";
+                center: "center";
+                end: "end";
+                between: "between";
+                around: "around";
+            }>>;
+            wrap: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+    };
+    Divider: {
+        props: z.ZodObject<{
+            label: z.ZodOptional<z.ZodString>;
+        }, z.core.$strip>;
+        description: string;
+    };
+    Text: {
+        props: z.ZodObject<{
+            content: z.ZodString;
+            size: z.ZodOptional<z.ZodEnum<{
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+            }>>;
+            color: z.ZodOptional<z.ZodEnum<{
+                default: "default";
+                muted: "muted";
+                dimmed: "dimmed";
+            }>>;
+        }, z.core.$strip>;
+        description: string;
+    };
+    Card: {
+        props: z.ZodObject<{
+            title: z.ZodOptional<z.ZodString>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+    };
+    Header: {
+        props: z.ZodObject<{
+            text: z.ZodString;
+            level: z.ZodOptional<z.ZodEnum<{
+                h1: "h1";
+                h2: "h2";
+                h3: "h3";
+                h4: "h4";
+                h5: "h5";
+                h6: "h6";
+            }>>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        }, z.core.$strip>;
+        description: string;
+    };
+    Button: {
+        props: z.ZodObject<{
+            label: z.ZodString;
+            color: z.ZodOptional<z.ZodEnum<{
+                success: "success";
+                error: "error";
+                primary: "primary";
+                secondary: "secondary";
+                info: "info";
+                warning: "warning";
+                neutral: "neutral";
+            }>>;
+            variant: z.ZodOptional<z.ZodEnum<{
+                link: "link";
+                solid: "solid";
+                outline: "outline";
+                soft: "soft";
+                subtle: "subtle";
+                ghost: "ghost";
+            }>>;
+            size: z.ZodOptional<z.ZodEnum<{
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+            icon: z.ZodOptional<z.ZodString>;
+            loading: z.ZodOptional<z.ZodBoolean>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Input: {
+        props: z.ZodObject<{
+            value: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            placeholder: z.ZodOptional<z.ZodString>;
+            type: z.ZodOptional<z.ZodEnum<{
+                number: "number";
+                search: "search";
+                text: "text";
+                email: "email";
+                password: "password";
+                tel: "tel";
+                url: "url";
+            }>>;
+            size: z.ZodOptional<z.ZodEnum<{
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+            autofocus: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Select: {
+        props: z.ZodObject<{
+            value: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodBoolean]>>>;
+            items: z.ZodOptional<z.ZodArray<z.ZodUnion<readonly [z.ZodString, z.ZodObject<{
+                label: z.ZodString;
+                value: z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodBoolean]>;
+                disabled: z.ZodOptional<z.ZodBoolean>;
+            }, z.core.$strip>]>>>;
+            placeholder: z.ZodOptional<z.ZodString>;
+            size: z.ZodOptional<z.ZodEnum<{
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Checkbox: {
+        props: z.ZodObject<{
+            checked: z.ZodOptional<z.ZodNullable<z.ZodBoolean>>;
+            label: z.ZodOptional<z.ZodString>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Textarea: {
+        props: z.ZodObject<{
+            value: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            placeholder: z.ZodOptional<z.ZodString>;
+            rows: z.ZodOptional<z.ZodNumber>;
+            autoresize: z.ZodOptional<z.ZodBoolean>;
+            maxrows: z.ZodOptional<z.ZodNumber>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Switch: {
+        props: z.ZodObject<{
+            checked: z.ZodOptional<z.ZodNullable<z.ZodBoolean>>;
+            label: z.ZodOptional<z.ZodString>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Dialog: {
+        props: z.ZodObject<{
+            open: z.ZodOptional<z.ZodBoolean>;
+            title: z.ZodOptional<z.ZodString>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            confirmLabel: z.ZodOptional<z.ZodString>;
+            cancelLabel: z.ZodOptional<z.ZodString>;
+            confirmColor: z.ZodOptional<z.ZodEnum<{
+                success: "success";
+                error: "error";
+                primary: "primary";
+                secondary: "secondary";
+                info: "info";
+                warning: "warning";
+                neutral: "neutral";
+            }>>;
+            confirmVariant: z.ZodOptional<z.ZodEnum<{
+                link: "link";
+                solid: "solid";
+                outline: "outline";
+                soft: "soft";
+                subtle: "subtle";
+                ghost: "ghost";
+            }>>;
+            closeOnConfirm: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+        events: string[];
+    };
+};
+/**
+ * Infer the props type for a Nuxt UI component by name.
+ * Derives the TypeScript type directly from the Zod schema,
+ * so component implementations stay in sync with catalog definitions.
+ */
+type NuxtUiComponentName = keyof typeof nuxtUiComponentDefinitions;
+type NuxtUiProps<K extends NuxtUiComponentName> = z.output<(typeof nuxtUiComponentDefinitions)[K]["props"]>;
+
+export { type ComponentDefinition, type NuxtUiComponentName, type NuxtUiProps, nuxtUiComponentDefinitions };

package/dist/catalog.d.ts

@@ -0,0 +1,254 @@
+import { z } from 'zod';
+
+/**
+ * Type for a component definition.
+ */
+type ComponentDefinition = {
+    props: z.ZodType;
+    slots?: string[];
+    events?: string[];
+    description: string;
+    example?: Record<string, unknown>;
+};
+declare const nuxtUiComponentDefinitions: {
+    Stack: {
+        props: z.ZodObject<{
+            gap: z.ZodOptional<z.ZodEnum<{
+                none: "none";
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+    };
+    Row: {
+        props: z.ZodObject<{
+            gap: z.ZodOptional<z.ZodEnum<{
+                none: "none";
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+            align: z.ZodOptional<z.ZodEnum<{
+                start: "start";
+                center: "center";
+                end: "end";
+                stretch: "stretch";
+            }>>;
+            justify: z.ZodOptional<z.ZodEnum<{
+                start: "start";
+                center: "center";
+                end: "end";
+                between: "between";
+                around: "around";
+            }>>;
+            wrap: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+    };
+    Divider: {
+        props: z.ZodObject<{
+            label: z.ZodOptional<z.ZodString>;
+        }, z.core.$strip>;
+        description: string;
+    };
+    Text: {
+        props: z.ZodObject<{
+            content: z.ZodString;
+            size: z.ZodOptional<z.ZodEnum<{
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+            }>>;
+            color: z.ZodOptional<z.ZodEnum<{
+                default: "default";
+                muted: "muted";
+                dimmed: "dimmed";
+            }>>;
+        }, z.core.$strip>;
+        description: string;
+    };
+    Card: {
+        props: z.ZodObject<{
+            title: z.ZodOptional<z.ZodString>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+    };
+    Header: {
+        props: z.ZodObject<{
+            text: z.ZodString;
+            level: z.ZodOptional<z.ZodEnum<{
+                h1: "h1";
+                h2: "h2";
+                h3: "h3";
+                h4: "h4";
+                h5: "h5";
+                h6: "h6";
+            }>>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        }, z.core.$strip>;
+        description: string;
+    };
+    Button: {
+        props: z.ZodObject<{
+            label: z.ZodString;
+            color: z.ZodOptional<z.ZodEnum<{
+                success: "success";
+                error: "error";
+                primary: "primary";
+                secondary: "secondary";
+                info: "info";
+                warning: "warning";
+                neutral: "neutral";
+            }>>;
+            variant: z.ZodOptional<z.ZodEnum<{
+                link: "link";
+                solid: "solid";
+                outline: "outline";
+                soft: "soft";
+                subtle: "subtle";
+                ghost: "ghost";
+            }>>;
+            size: z.ZodOptional<z.ZodEnum<{
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+            icon: z.ZodOptional<z.ZodString>;
+            loading: z.ZodOptional<z.ZodBoolean>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Input: {
+        props: z.ZodObject<{
+            value: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            placeholder: z.ZodOptional<z.ZodString>;
+            type: z.ZodOptional<z.ZodEnum<{
+                number: "number";
+                search: "search";
+                text: "text";
+                email: "email";
+                password: "password";
+                tel: "tel";
+                url: "url";
+            }>>;
+            size: z.ZodOptional<z.ZodEnum<{
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+            autofocus: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Select: {
+        props: z.ZodObject<{
+            value: z.ZodOptional<z.ZodNullable<z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodBoolean]>>>;
+            items: z.ZodOptional<z.ZodArray<z.ZodUnion<readonly [z.ZodString, z.ZodObject<{
+                label: z.ZodString;
+                value: z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodBoolean]>;
+                disabled: z.ZodOptional<z.ZodBoolean>;
+            }, z.core.$strip>]>>>;
+            placeholder: z.ZodOptional<z.ZodString>;
+            size: z.ZodOptional<z.ZodEnum<{
+                xs: "xs";
+                sm: "sm";
+                md: "md";
+                lg: "lg";
+                xl: "xl";
+            }>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Checkbox: {
+        props: z.ZodObject<{
+            checked: z.ZodOptional<z.ZodNullable<z.ZodBoolean>>;
+            label: z.ZodOptional<z.ZodString>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Textarea: {
+        props: z.ZodObject<{
+            value: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            placeholder: z.ZodOptional<z.ZodString>;
+            rows: z.ZodOptional<z.ZodNumber>;
+            autoresize: z.ZodOptional<z.ZodBoolean>;
+            maxrows: z.ZodOptional<z.ZodNumber>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Switch: {
+        props: z.ZodObject<{
+            checked: z.ZodOptional<z.ZodNullable<z.ZodBoolean>>;
+            label: z.ZodOptional<z.ZodString>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            disabled: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        description: string;
+        events: string[];
+    };
+    Dialog: {
+        props: z.ZodObject<{
+            open: z.ZodOptional<z.ZodBoolean>;
+            title: z.ZodOptional<z.ZodString>;
+            description: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            confirmLabel: z.ZodOptional<z.ZodString>;
+            cancelLabel: z.ZodOptional<z.ZodString>;
+            confirmColor: z.ZodOptional<z.ZodEnum<{
+                success: "success";
+                error: "error";
+                primary: "primary";
+                secondary: "secondary";
+                info: "info";
+                warning: "warning";
+                neutral: "neutral";
+            }>>;
+            confirmVariant: z.ZodOptional<z.ZodEnum<{
+                link: "link";
+                solid: "solid";
+                outline: "outline";
+                soft: "soft";
+                subtle: "subtle";
+                ghost: "ghost";
+            }>>;
+            closeOnConfirm: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strip>;
+        slots: string[];
+        description: string;
+        events: string[];
+    };
+};
+/**
+ * Infer the props type for a Nuxt UI component by name.
+ * Derives the TypeScript type directly from the Zod schema,
+ * so component implementations stay in sync with catalog definitions.
+ */
+type NuxtUiComponentName = keyof typeof nuxtUiComponentDefinitions;
+type NuxtUiProps<K extends NuxtUiComponentName> = z.output<(typeof nuxtUiComponentDefinitions)[K]["props"]>;
+
+export { type ComponentDefinition, type NuxtUiComponentName, type NuxtUiProps, nuxtUiComponentDefinitions };