From 0f8c3986736f2a818c2d713ca3124455182c74f9 Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Thu, 5 Dec 2024 16:43:12 +0100
Subject: [PATCH] docs: handle `@nuxt/ui-pro` components display

---
 docs/app/components/content/ComponentProps.vue | 4 +++-
 docs/app/components/content/ComponentTheme.vue | 9 +++++++--
 docs/nuxt.config.ts                            | 1 -
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/docs/app/components/content/ComponentProps.vue b/docs/app/components/content/ComponentProps.vue
index d6ba353d14..5248d85a9a 100644
--- a/docs/app/components/content/ComponentProps.vue
+++ b/docs/app/components/content/ComponentProps.vue
@@ -2,9 +2,11 @@
 import { upperFirst, camelCase } from 'scule'
 import type { ComponentMeta } from 'vue-component-meta'
 import * as theme from '#build/ui'
+import * as themePro from '#build/ui-pro'
 
 const props = withDefaults(defineProps<{
   ignore?: string[]
+  pro?: boolean
 }>(), {
   ignore: () => [
     'activeClass',
@@ -32,7 +34,7 @@ const route = useRoute()
 const camelName = camelCase(route.params.slug?.[route.params.slug.length - 1] ?? '')
 const name = `U${upperFirst(camelName)}`
 
-const componentTheme = (theme as any)[camelName]
+const componentTheme = ((props.pro ? themePro : theme) as any)[camelName]
 const meta = await fetchComponentMeta(name as any)
 
 const metaProps: ComputedRef<ComponentMeta['props']> = computed(() => {
diff --git a/docs/app/components/content/ComponentTheme.vue b/docs/app/components/content/ComponentTheme.vue
index 31771d6b25..a614a9c3b7 100644
--- a/docs/app/components/content/ComponentTheme.vue
+++ b/docs/app/components/content/ComponentTheme.vue
@@ -2,6 +2,11 @@
 import json5 from 'json5'
 import { camelCase } from 'scule'
 import * as theme from '#build/ui'
+import * as themePro from '#build/ui-pro'
+
+const props = defineProps<{
+  pro?: boolean
+}>()
 
 const route = useRoute()
 const { framework } = useSharedData()
@@ -12,7 +17,7 @@ const strippedCompoundVariants = ref(false)
 
 const strippedTheme = computed(() => {
   const strippedTheme = {
-    ...(theme as any)[name]
+    ...((props.pro ? themePro : theme) as any)[name]
   }
 
   if (strippedTheme?.compoundVariants) {
@@ -50,7 +55,7 @@ const strippedTheme = computed(() => {
 
 const component = computed(() => {
   return {
-    ui: {
+    [props.pro ? 'uiPro' : 'ui']: {
       [name]: strippedTheme.value
     }
   }
diff --git a/docs/nuxt.config.ts b/docs/nuxt.config.ts
index 110e41a6ea..98f5f47a3c 100644
--- a/docs/nuxt.config.ts
+++ b/docs/nuxt.config.ts
@@ -119,7 +119,6 @@ export default defineNuxtConfig({
       '@nuxt/content',
       '@nuxt/icon',
       '@nuxt/image',
-      '@nuxt/ui-pro',
       '@nuxtjs/color-mode',
       '@nuxtjs/mdc',
       '@nuxtjs/plausible',