@bitrix24/b24ui-nuxt 0.5.11 → 0.6.1

package/cli/templates.mjs

@@ -39,13 +39,10 @@ const component = ({ name, primitive, pro, prose, content }) => {
       ? replaceBrackets(`
 [[script lang="ts"]]
 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 '../utils/tv'
-
-const appConfig${camelName} = _appConfig as AppConfig & { ${key}: { ${prose ? 'prose: { ' : ''}${camelName}: Partial<typeof theme> } }${prose ? ' }' : ''}
+import type { ComponentConfig } from '../types/utils'
 
-const ${camelName} = tv({ extend: tv(theme), ...(appConfig${camelName}.${key}?.${prose ? 'prose?.' : ''}${camelName} || {}) })
+type ${upperName} = ComponentConfig<typeof theme, AppConfig, ${upperName}>
 
 export interface ${upperName}Props {
   /**
@@ -54,7 +51,7 @@ export interface ${upperName}Props {
    */
   as?: any
   class?: any
-  b24ui?: Partial<typeof ${camelName}.slots>
+  b24ui?: ${upperName}['slots']
 }
 
 export interface ${upperName}Slots {
@@ -63,12 +60,17 @@ export interface ${upperName}Slots {
 [[/script]]
 
 [[script setup lang="ts"]]
+import { computed } from 'vue'
 import { Primitive } from 'reka-ui'
+import { useAppConfig } from '#imports'
+import { tv } from '../utils/tv'
 
 const props = defineProps<${upperName}Props>()
 defineSlots<${upperName}Slots>()
 
-const b24ui = ${camelName}()
+const appConfig = useAppConfig() as ${upperName}['AppConfig']
+
+const b24ui = computed(() => tv({ extend: tv(theme), ...(appConfig.b24ui?.${camelName} || {}) })())
 [[/script]]
 
 [[template]]
@@ -79,22 +81,18 @@ const b24ui = ${camelName}()
 `)
       : replaceBrackets(`
 [[script lang="ts"]]
-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 '../utils/tv'
+import type { ComponentConfig } from '../types/utils'
 
 const appConfig${camelName} = _appConfig as AppConfig & { ${key}: { ${prose ? 'prose: { ' : ''}${camelName}: Partial[[typeof theme]] } }${prose ? ' }' : ''}
 
-const ${camelName} = tv({ extend: tv(theme), ...(appConfig${camelName}.${key}?.${prose ? 'prose?.' : ''}${camelName} || {}) })
-
-type ${upperName}Variants = VariantProps[[typeof ${camelName}]]
+type ${upperName} = ComponentConfig<typeof theme, AppConfig, ${upperName}>
 
 export interface ${upperName}Props extends Pick[[${upperName}RootProps]] {
   class?: any
-  b24ui?: Partial[[typeof ${camelName}.slots]]
+  b24ui?: ${upperName}['slots']
 }
 
 export interface ${upperName}Emits extends ${upperName}RootEmits {}
@@ -103,16 +101,22 @@ export interface ${upperName}Slots {}
 [[/script]]
 
 [[script setup lang="ts"]]
+
+
 import { ${upperName}Root, useForwardPropsEmits } from 'reka-ui'
 import { reactivePick } from '@vueuse/core'
+import { useAppConfig } from '#imports'
+import { tv } from '../utils/tv'
 
 const props = defineProps<${upperName}Props>()
 const emits = defineEmits<${upperName}Emits>()
 const slots = defineSlots<${upperName}Slots>()
 
+const appConfig = useAppConfig() as ${upperName}['AppConfig']
+
 const rootProps = useForwardPropsEmits(reactivePick(props), emits)
 
-const b24ui = ${camelName}()
+const b24ui = computed(() => tv({ extend: tv(theme), ...(appConfig.b24ui?.${camelName} || {}) })())
 [[/script]]
 
 [[template]]