Merge branch 'v3' into zh_hant

build.config.ts

@@ -8,6 +8,9 @@ export default defineBuildConfig({
     './src/unplugin',
     './src/vite'
   ],
+  rollup: {
+    emitCJS: true
+  },
   replace: {
     'process.env.DEV': 'false',
     'process.env.NUXT_UI_DEVTOOLS_LOCAL': 'false'

cli/templates.mjs

@@ -30,10 +30,10 @@ const component = ({ name, primitive, pro, prose, content }) => {
     contents: primitive
       ? `
 <script lang="ts">
-import { tv } from 'tailwind-variants'
 import type { AppConfig } from '@nuxt/schema'
 import _appConfig from '#build/app.config'
 import theme from '#build/${path}/${prose ? 'prose/' : ''}${content ? 'content/' : ''}${kebabName}'
+import { tv } from ${pro ? '#ui/utils/tv' : '../utils/tv'}
 
 const appConfig = _appConfig as AppConfig & { ${key}: { ${prose ? 'prose: { ' : ''}${camelName}: Partial<typeof theme> } }${prose ? ' }' : ''}
 
@@ -71,11 +71,12 @@ const ui = ${camelName}()
 `
       : `
 <script lang="ts">
-import { tv, type VariantProps } from 'tailwind-variants'
+import type { VariantProps } from 'tailwind-variants'
 import type { ${upperName}RootProps, ${upperName}RootEmits } from 'reka-ui'
 import type { AppConfig } from '@nuxt/schema'
 import _appConfig from '#build/app.config'
 import theme from '#build/${path}/${prose ? 'prose/' : ''}${content ? 'content/' : ''}${kebabName}'
+import { tv } from ${pro ? '#ui/utils/tv' : '../utils/tv'}
 
 const appConfig = _appConfig as AppConfig & { ${key}: { ${prose ? 'prose: { ' : ''}${camelName}: Partial<typeof theme> } }${prose ? ' }' : ''}
 

docs/app/app.vue

@@ -151,4 +151,6 @@ html[data-module="ui-pro"] .ui-only,
 html[data-module="ui"] .ui-pro-only {
   display: none;
 }
+
+/* Safelist (do not remove): [&>div]:*:my-0 [&>div]:*:w-full */
 </style>

docs/app/components/content/ComponentCode.vue

@@ -42,6 +42,7 @@ const castMap: Record<string, Cast> = {
 
 const props = defineProps<{
   pro?: boolean
+  prose?: boolean
   prefix?: string
   /** Override the slug taken from the route */
   slug?: string
@@ -84,13 +85,17 @@ const route = useRoute()
 const { $prettier } = useNuxtApp()
 
 const camelName = camelCase(props.slug ?? route.params.slug?.[route.params.slug.length - 1] ?? '')
-const name = `U${upperFirst(camelName)}`
+const name = `${props.prose ? 'Prose' : 'U'}${upperFirst(camelName)}`
 const component = defineAsyncComponent(() => {
   if (props.pro) {
     if (props.prefix) {
       return import(`#ui-pro/components/${props.prefix}/${upperFirst(camelName)}.vue`)
     }
 
+    if (props.prose) {
+      return import(`#ui-pro/components/prose/${upperFirst(camelName)}.vue`)
+    }
+
     return import(`#ui-pro/components/${upperFirst(camelName)}.vue`)
   }
 
@@ -121,7 +126,7 @@ function setComponentProp(name: string, value: any) {
   set(componentProps, name, value)
 }
 
-const componentTheme = ((props.pro ? themePro : theme) as any)[camelName]
+const componentTheme = ((props.pro ? props.prose ? themePro.prose : themePro : theme) as any)[camelName]
 const meta = await fetchComponentMeta(name as any)
 
 function mapKeys(obj: object, parentKey = ''): any {
@@ -169,6 +174,30 @@ const options = computed(() => {
 const code = computed(() => {
   let code = ''
 
+  if (props.prose) {
+    code += `\`\`\`mdc
+::${camelName}`
+
+    const proseProps = Object.entries(componentProps).map(([key, value]) => {
+      if (value === undefined || value === null || value === '' || props.hide?.includes(key)) {
+        return
+      }
+
+      return `${key}="${value}"`
+    }).filter(Boolean).join(' ')
+
+    if (proseProps.length) {
+      code += `{${proseProps}}`
+    }
+
+    code += `
+${props.slots?.default}
+::
+\`\`\``
+
+    return code
+  }
+
   if (props.collapse) {
     code += `::code-collapse
 `

docs/app/components/content/ComponentEmits.vue

@@ -1,10 +1,14 @@
 <script setup lang="ts">
 import { upperFirst, camelCase } from 'scule'
 
+const props = defineProps<{
+  prose?: boolean
+}>()
+
 const route = useRoute()
 
 const camelName = camelCase(route.params.slug?.[route.params.slug.length - 1] ?? '')
-const name = `U${upperFirst(camelName)}`
+const name = props.prose ? `Prose${upperFirst(camelName)}` : `U${upperFirst(camelName)}`
 
 const meta = await fetchComponentMeta(name as any)
 </script>

docs/app/components/content/ComponentProps.vue

@@ -8,6 +8,7 @@ const props = withDefaults(defineProps<{
   name?: string
   ignore?: string[]
   pro?: boolean
+  prose?: boolean
 }>(), {
   ignore: () => [
     'activeClass',
@@ -34,9 +35,9 @@ const props = withDefaults(defineProps<{
 const route = useRoute()
 
 const camelName = camelCase(props.name ?? route.params.slug?.[route.params.slug.length - 1] ?? '')
-const componentName = `U${upperFirst(camelName)}`
+const componentName = props.prose ? `Prose${upperFirst(camelName)}` : `U${upperFirst(camelName)}`
 
-const componentTheme = ((props.pro ? themePro : theme) as any)[camelName]
+const componentTheme = ((props.pro ? props.prose ? themePro.prose : themePro : theme) as any)[camelName]
 const meta = await fetchComponentMeta(componentName as any)
 
 const metaProps: ComputedRef<ComponentMeta['props']> = computed(() => {

docs/app/components/content/ComponentSlots.vue

@@ -1,10 +1,14 @@
 <script setup lang="ts">
 import { upperFirst, camelCase } from 'scule'
 
+const props = defineProps<{
+  prose?: boolean
+}>()
+
 const route = useRoute()
 
 const camelName = camelCase(route.params.slug?.[route.params.slug.length - 1] ?? '')
-const name = `U${upperFirst(camelName)}`
+const name = props.prose ? `Prose${upperFirst(camelName)}` : `U${upperFirst(camelName)}`
 
 const meta = await fetchComponentMeta(name as any)
 </script>

docs/app/components/content/ComponentTheme.vue

@@ -6,18 +6,23 @@ import * as themePro from '#build/ui-pro'
 
 const props = defineProps<{
   pro?: boolean
+  prose?: boolean
+  slug?: string
+  extra?: string[]
 }>()
 
 const route = useRoute()
 const { framework } = useSharedData()
 
-const name = camelCase(route.params.slug?.[route.params.slug.length - 1] ?? '')
+const name = camelCase(props.slug ?? route.params.slug?.[route.params.slug.length - 1] ?? '')
 
 const strippedCompoundVariants = ref(false)
 
+const computedTheme = computed(() => props.pro ? props.prose ? themePro.prose : themePro : theme)
+
 const strippedTheme = computed(() => {
   const strippedTheme = {
-    ...((props.pro ? themePro : theme) as any)[name]
+    ...(computedTheme.value as any)[name]
   }
 
   if (strippedTheme?.compoundVariants) {
@@ -54,10 +59,21 @@ const strippedTheme = computed(() => {
 })
 
 const component = computed(() => {
+  const baseKey = props.pro ? 'uiPro' : 'ui'
+
+  const content = props.prose
+    ? { prose: { [name]: strippedTheme.value } }
+    : { [name]: strippedTheme.value }
+
+  if (props.extra?.length) {
+    props.extra.forEach((extra) => {
+      const target = props.prose ? content.prose! : content
+      target[extra as keyof typeof target] = computedTheme.value[extra as keyof typeof computedTheme.value]
+    })
+  }
+
   return {
-    [props.pro ? 'uiPro' : 'ui']: {
-      [name]: strippedTheme.value
-    }
+    [baseKey]: content
   }
 })
 

docs/content/1.getting-started/7.i18n/.navigation.yml

@@ -1,2 +1 @@
-badge: New
 shadow: true

docs/content/3.components/input-number.md

@@ -8,7 +8,6 @@ links:
   - label: GitHub
     icon: i-simple-icons-github
     to: https://github.com/nuxt/ui/tree/v3/src/runtime/components/InputNumber.vue
-navigation.badge: New
 ---
 
 ::note

docs/content/3.components/pin-input.md

@@ -5,7 +5,6 @@ links:
   - label: GitHub
     icon: i-simple-icons-github
     to: https://github.com/nuxt/ui/tree/v3/src/runtime/components/PinInput.vue
-navigation.badge: New
 ---
 
 ## Usage

docs/package.json

@@ -10,7 +10,7 @@
     "@nuxt/content": "https://pkg.pr.new/@nuxt/content@f124c95",
     "@nuxt/image": "^1.8.1",
     "@nuxt/ui": "latest",
-    "@nuxt/ui-pro": "https://pkg.pr.new/@nuxt/ui-pro@364cc97",
+    "@nuxt/ui-pro": "https://pkg.pr.new/@nuxt/ui-pro@aeb9362",
     "@nuxthub/core": "^0.8.10",
     "@nuxtjs/plausible": "^1.2.0",
     "@octokit/rest": "^21.0.2",

package.json

@@ -12,20 +12,23 @@
   "license": "MIT",
   "exports": {
     ".": {
+      "types": "./dist/module.d.ts",
       "style": "./dist/runtime/index.css",
-      "types": "./dist/module.d.mts",
-      "import": "./dist/module.mjs"
+      "import": "./dist/module.mjs",
+      "require": "./dist/module.cjs"
     },
     "./unplugin": {
-      "types": "./dist/unplugin.d.mts",
-      "import": "./dist/unplugin.mjs"
+      "types": "./dist/unplugin.d.ts",
+      "import": "./dist/unplugin.mjs",
+      "require": "./dist/unplugin.cjs"
     },
     "./vite": {
-      "types": "./dist/vite.d.mts",
-      "import": "./dist/vite.mjs"
+      "types": "./dist/vite.d.ts",
+      "import": "./dist/vite.mjs",
+      "require": "./dist/vite.cjs"
     },
     "./vue-plugin": {
-      "types": "./vue-plugin.d.mts"
+      "types": "./vue-plugin.d.ts"
     },
     "./runtime/*": "./dist/runtime/*",
     "./locale": {
@@ -39,11 +42,14 @@
   "bin": {
     "nuxt-ui": "./cli/index.mjs"
   },
+  "style": "./dist/runtime/index.css",
+  "main": "./dist/module.cjs",
+  "types": "./dist/types.d.ts",
   "files": [
     ".nuxt/ui",
     "dist",
     "cli",
-    "vue-plugin.d.mts"
+    "vue-plugin.d.ts"
   ],
   "scripts": {
     "build": "nuxt-module-build build && pnpm devtools:build",
@@ -113,9 +119,9 @@
   },
   "devDependencies": {
     "@nuxt/eslint-config": "^0.7.4",
-    "@nuxt/module-builder": "1.0.0-alpha.1",
+    "@nuxt/module-builder": "^0.8.4",
     "@nuxt/test-utils": "^3.15.1",
-    "@release-it/conventional-changelog": "^9.0.4",
+    "@release-it/conventional-changelog": "^10.0.0",
     "@standard-schema/spec": "1.0.0-beta.4",
     "@vue/test-utils": "^2.4.6",
     "embla-carousel": "^8.5.1",
@@ -135,15 +141,15 @@
     "zod": "^3.24.1"
   },
   "peerDependencies": {
-    "typescript": "^5.7.2"
+    "typescript": "^5.6.3"
   },
   "resolutions": {
     "@nuxt/ui": "workspace:*",
     "chokidar": "3.6.0",
     "debug": "4.3.7",
     "happy-dom": "14.12.3",
     "rollup": "^4.24.0",
-    "typescript": "5.7.2",
+    "typescript": "5.6.3",
     "unimport": "3.14.5",
     "unplugin": "^2.1.2",
     "vite": "^6.0.7",