arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-14 12:14:41 +01:00
Code Issues Packages Projects Releases Wiki Activity

cli: handle --prose && --content options for pro

Browse Source
This commit is contained in:
Benjamin Canac
2024-06-05 17:04:26 +02:00
parent f70b63970a
commit ecc2240df0
2 changed files with 51 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
cli/commands/init.mjs
View File

@@ -24,12 +24,29 @@ export default defineCommand({
pro: {
type: 'boolean',
description: 'Create a pro component.'
},
prose: {
type: 'boolean',
description: 'Create a prose component (with --pro).'
},
content: {
type: 'boolean',
description: 'Create a content component (with --pro).'
}
},
async setup({ args }) {
const name = args.name
if (!name) {
consola.error('name argument is missing!')
consola.error('`name` argument is missing!')
process.exit(1)
}
if (args.prose && !args.pro) {
consola.error('`--prose` flag can only be used with `--pro` flag!')
process.exit(1)
}
if (args.content && !args.pro) {
consola.error('`--content` flag can only be used with `--pro` flag!')
process.exit(1)
}
@@ -53,12 +70,14 @@ export default defineCommand({
consola.success(`🪄 Generated ${filePath}!`)
}
const themePath = resolve(path, 'src/theme/index.ts')
const themePath = resolve(path, `src/theme/${args.prose ? 'prose/' : ''}${args.content ? 'content/' : ''}index.ts`)
await appendFile(themePath, `export { default as ${camelCase(name)} } from './${kebabCase(name)}'`)
await sortFile(themePath)
const typesPath = resolve(path, 'src/runtime/types/index.d.ts')
await appendFile(typesPath, `export * from '../components/${splitByCase(name).map(p => upperFirst(p)).join('')}.vue'`)
await sortFile(typesPath)
if (!args.prose) {
const typesPath = resolve(path, 'src/runtime/types/index.d.ts')
await appendFile(typesPath, `export * from '../components/${args.content && 'content/'}${splitByCase(name).map(p => upperFirst(p)).join('')}.vue'`)
await sortFile(typesPath)
}
}
})

46
cli/templates.mjs
View File

@@ -14,11 +14,11 @@ const playground = ({ name, pro }) => {
<U${upperName} />
</div>
</template>
`
`
}
}
const component = ({ name, primitive, pro }) => {
const component = ({ name, primitive, pro, prose, content }) => {
const upperName = splitByCase(name).map(p => upperFirst(p)).join('')
const camelName = camelCase(name)
const kebabName = kebabCase(name)
@@ -26,7 +26,7 @@ const component = ({ name, primitive, pro }) => {
const path = pro ? 'ui-pro' : 'ui'
return {
filename: `src/runtime/components/${upperName}.vue`,
filename: `src/runtime/components/${prose ? 'prose/' : ''}${content ? 'content/' : ''}${upperName}.vue`,
contents: primitive
? `
<script lang="ts">
@@ -34,11 +34,11 @@ import { tv } from 'tailwind-variants'
import type { PrimitiveProps } from 'radix-vue'
import type { AppConfig } from '@nuxt/schema'
import _appConfig from '#build/app.config'
import theme from '#build/${path}/${kebabName}'
import theme from '#build/${path}/${prose ? 'prose/' : ''}${content ? 'content/' : ''}${kebabName}'
const appConfig = _appConfig as AppConfig & { ${key}: { ${camelName}: Partial<typeof theme> } }
const appConfig = _appConfig as AppConfig & { ${key}: { ${prose ? 'prose: { ' : ''}${camelName}: Partial<typeof theme> } }${prose ? ' }' : ''}
const ${camelName} = tv({ extend: tv(theme), ...(appConfig.${key}?.${camelName} || {}) })
const ${camelName} = tv({ extend: tv(theme), ...(appConfig.${key}?.${prose ? 'prose?.' : ''}${camelName} || {}) })
export interface ${upperName}Props extends Omit<PrimitiveProps, 'asChild'> {
class?: any
@@ -72,11 +72,11 @@ import { tv, type VariantProps } from 'tailwind-variants'
import type { ${upperName}RootProps, ${upperName}RootEmits } from 'radix-vue'
import type { AppConfig } from '@nuxt/schema'
import _appConfig from '#build/app.config'
import theme from '#build/${path}/${kebabName}'
import theme from '#build/${path}/${prose ? 'prose/' : ''}${content ? 'content/' : ''}${kebabName}'
const appConfig = _appConfig as AppConfig & { ${key}: { ${camelName}: Partial<typeof theme> } }
const appConfig = _appConfig as AppConfig & { ${key}: { ${prose ? 'prose: { ' : ''}${camelName}: Partial<typeof theme> } }${prose ? ' }' : ''}
const ${camelName} = tv({ extend: tv(theme), ...(appConfig.${key}?.${camelName} || {}) })
const ${camelName} = tv({ extend: tv(theme), ...(appConfig.${key}?.${prose ? 'prose?.' : ''}${camelName} || {}) })
type ${upperName}Variants = VariantProps<typeof ${camelName}>
@@ -111,30 +111,38 @@ const ui = computed(() => tv({ extend: ${camelName}, slots: props.ui })())
}
}
const theme = ({ name }) => {
const theme = ({ name, prose, content }) => {
const kebabName = kebabCase(name)
return {
filename: `src/theme/${kebabName}.ts`,
contents: `
filename: `src/theme/${prose ? 'prose/' : ''}${content ? 'content/' : ''}${kebabName}.ts`,
contents: prose
? `
export default {
base: ''
}
`
: `
export default {
slots: {
root: ''
}
}
`
`
}
}
const test = ({ name }) => {
const test = ({ name, prose, content }) => {
const upperName = splitByCase(name).map(p => upperFirst(p)).join('')
return {
filename: `test/components/${upperName}.spec.ts`,
contents: `
filename: `test/components/${content ? 'content/' : ''}${upperName}.spec.ts`,
contents: prose
? undefined
: `
import { describe, it, expect } from 'vitest'
import ${upperName}, { type ${upperName}Props, type ${upperName}Slots } from '../../src/runtime/components/${upperName}.vue'
import ComponentRender from '../component-render'
import ${upperName}, { type ${upperName}Props, type ${upperName}Slots } from '../../${content ? '../' : ''}src/runtime/components/${content ? 'content/' : ''}${upperName}.vue'
import ComponentRender from '../${content ? '../' : ''}component-render'
describe('${upperName}', () => {
it.each([
@@ -149,7 +157,7 @@ describe('${upperName}', () => {
expect(html).toMatchSnapshot()
})
})
`
`
}
}