@koumoul/vjsf 3.0.0-alpha.4 → 3.0.0-alpha.6

package/src/components/nodes/section.vue

@@ -5,12 +5,12 @@ import SectionHeader from '../fragments/section-header.vue'
 
 defineProps({
   modelValue: {
-    /** @type import('vue').PropType<import('../types.js').VjsfSectionNode> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfSectionNode> */
     type: Object,
     required: true
   },
   statefulLayout: {
-    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
     type: Object,
     required: true
   }
@@ -24,7 +24,7 @@ defineProps({
     <node
       v-for="child of modelValue.children"
       :key="child.fullKey"
-      :model-value="/** @type import('../types.js').VjsfNode */(child)"
+      :model-value="/** @type import('../../types.js').VjsfNode */(child)"
       :stateful-layout="statefulLayout"
     />
   </v-row>

package/src/components/nodes/select.vue

@@ -1,20 +1,19 @@
 <script>
 import { VSelect } from 'vuetify/components'
 import { defineComponent, h, computed, ref, shallowRef } from 'vue'
-import { getInputProps } from '../../utils/props.js'
-import { getCompSlots } from '../../utils/slots.js'
+import { getInputProps, getCompSlots } from '../../utils/index.js'
 import SelectItem from '../fragments/select-item.vue'
 import SelectSelection from '../fragments/select-selection.vue'
 
 export default defineComponent({
   props: {
     modelValue: {
-    /** @type import('vue').PropType<import('../types.js').VjsfSelectNode> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfSelectNode> */
       type: Object,
       required: true
     },
     statefulLayout: {
-    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
       type: Object,
       required: true
     }

package/src/components/nodes/slider.vue

@@ -1,16 +1,16 @@
 <script setup>
 import { VSlider } from 'vuetify/components'
 import { computed } from 'vue'
-import { getInputProps } from '../../utils/props.js'
+import { getInputProps } from '../../utils/index.js'
 
 const props = defineProps({
   modelValue: {
-    /** @type import('vue').PropType<import('../types.js').VjsfSliderNode> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfSliderNode> */
     type: Object,
     required: true
   },
   statefulLayout: {
-    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
     type: Object,
     required: true
   }

package/src/components/nodes/stepper.vue

@@ -7,12 +7,12 @@ import SectionHeader from '../fragments/section-header.vue'
 
 const props = defineProps({
   modelValue: {
-    /** @type import('vue').PropType<import('../types.js').VjsfStepperNode> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfStepperNode> */
     type: Object,
     required: true
   },
   statefulLayout: {
-    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
     type: Object,
     required: true
   }
@@ -26,10 +26,8 @@ const firstErrorIndex = computed(() => {
 })
 
 const goNext = () => {
-  console.log(props.statefulLayout.validationState)
   const child = props.modelValue.children[step.value]
   props.statefulLayout.validateNodeRecurse(child)
-  console.log(props.statefulLayout.validationState)
   if (!(child.error || child.childError)) step.value++
 }
 </script>
@@ -65,7 +63,7 @@ const goNext = () => {
             <node
               v-for="grandChild of isSection(child) ? child.children : [child]"
               :key="grandChild.fullKey"
-              :model-value="/** @type import('../types.js').VjsfNode */(grandChild)"
+              :model-value="/** @type import('../../types.js').VjsfNode */(grandChild)"
               :stateful-layout="statefulLayout"
             />
           </v-row>

package/src/components/nodes/switch.vue

@@ -1,16 +1,16 @@
 <script setup>
 import { VSwitch } from 'vuetify/components'
 import { computed } from 'vue'
-import { getInputProps } from '../../utils/props.js'
+import { getInputProps } from '../../utils/index.js'
 
 const props = defineProps({
   modelValue: {
-    /** @type import('vue').PropType<import('../types.js').VjsfSwitchNode> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfSwitchNode> */
     type: Object,
     required: true
   },
   statefulLayout: {
-    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
     type: Object,
     required: true
   }

package/src/components/nodes/tabs.vue

@@ -7,12 +7,12 @@ import SectionHeader from '../fragments/section-header.vue'
 
 defineProps({
   modelValue: {
-    /** @type import('vue').PropType<import('../types.js').VjsfTabsNode> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfTabsNode> */
     type: Object,
     required: true
   },
   statefulLayout: {
-    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
     type: Object,
     required: true
   }
@@ -52,7 +52,7 @@ const tab = ref(0)
             <node
               v-for="grandChild of isSection(child) ? child.children : [child]"
               :key="grandChild.fullKey"
-              :model-value="/** @type import('../types.js').VjsfNode */(grandChild)"
+              :model-value="/** @type import('../../types.js').VjsfNode */(grandChild)"
               :stateful-layout="statefulLayout"
             />
           </v-row>

package/src/components/nodes/text-field.vue

@@ -1,18 +1,17 @@
 <script>
 import { defineComponent, h, computed } from 'vue'
 import { VTextField } from 'vuetify/components'
-import { getInputProps } from '../../utils/props.js'
-import { getCompSlots } from '../../utils/slots.js'
+import { getInputProps, getCompSlots } from '../../utils/index.js'
 
 export default defineComponent({
   props: {
     modelValue: {
-      /** @type import('vue').PropType<import('../types.js').VjsfTextFieldNode> */
+      /** @type import('vue').PropType<import('../../types.js').VjsfTextFieldNode> */
       type: Object,
       required: true
     },
     statefulLayout: {
-      /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+      /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
       type: Object,
       required: true
     }

package/src/components/nodes/textarea.vue

@@ -1,18 +1,17 @@
 <script>
 import { defineComponent, h, computed, ref, watch } from 'vue'
 import { VTextarea } from 'vuetify/components'
-import { getInputProps } from '../../utils/props.js'
-import { getCompSlots } from '../../utils/slots.js'
+import { getInputProps, getCompSlots } from '../../utils/index.js'
 
 export default defineComponent({
   props: {
     modelValue: {
-      /** @type import('vue').PropType<import('../types.js').VjsfTextareaNode> */
+      /** @type import('vue').PropType<import('../../types.js').VjsfTextareaNode> */
       type: Object,
       required: true
     },
     statefulLayout: {
-      /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+      /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
       type: Object,
       required: true
     }

package/src/components/nodes/vertical-tabs.vue

@@ -7,12 +7,12 @@ import SectionHeader from '../fragments/section-header.vue'
 
 defineProps({
   modelValue: {
-    /** @type import('vue').PropType<import('../types.js').VjsfVerticalTabsNode> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfVerticalTabsNode> */
     type: Object,
     required: true
   },
   statefulLayout: {
-    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
     type: Object,
     required: true
   }
@@ -58,7 +58,7 @@ const tab = ref(0)
               <node
                 v-for="grandChild of isSection(child) ? child.children : [child]"
                 :key="grandChild.fullKey"
-                :model-value="/** @type import('../types.js').VjsfNode */(grandChild)"
+                :model-value="/** @type import('../../types.js').VjsfNode */(grandChild)"
                 :stateful-layout="statefulLayout"
               />
             </v-row>

package/src/components/options.js

@@ -1,4 +1,4 @@
-/** @type import("./types.js").PartialVjsfOptions */
+/** @type import("../types.js").PartialVjsfOptions */
 export const defaultOptions = {
   // matches the density prop found in many vuetify components
   density: 'default',
@@ -22,25 +22,28 @@ export const defaultOptions = {
   switchProps: { hideDetails: 'auto' },
   switchPropsReadOnly: {},
   errorAlertProps: { type: 'error', variant: 'tonal' },
-  easyMDEOptions: {}
+  easyMDEOptions: {},
+  nodeComponents: {}
 }
 
 /**
  *
- * @param {Partial<import("./types.js").VjsfOptions>} options
+ * @param {Partial<import("../types.js").VjsfOptions>} options
  * @param {any} form
  * @param {number} width
  * @param {import("vue").Slots} slots
+ * @param {Record<string, import('vue').Component>} nodeComponents
  * @returns
  */
-export const getFullOptions = (options, form, width, slots) => {
+export const getFullOptions = (options, form, width, slots, nodeComponents) => {
   const fullOptions = {
     ...defaultOptions,
     readOnly: !!(form && (form.isDisabled.value || form.isReadonly.value)),
     ...options,
     context: options.context ? JSON.parse(JSON.stringify(options.context)) : {},
     width: Math.round(width ?? 0),
-    vjsfSlots: { ...slots }
+    vjsfSlots: { ...slots },
+    nodeComponents: { ...nodeComponents, ...options.nodeComponents }
   }
-  return /** @type import('./types.js').VjsfOptions */ (fullOptions)
+  return /** @type import('../types.js').VjsfOptions */ (fullOptions)
 }

package/src/components/tree.vue

@@ -9,7 +9,7 @@ defineProps({
     required: true
   },
   statefulLayout: {
-    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    /** @type import('vue').PropType<import('../types.js').VjsfStatefulLayout> */
     type: Object,
     required: true
   }
@@ -20,7 +20,7 @@ defineProps({
   <v-row class="vjsf-tree">
     <node
       :stateful-layout="statefulLayout"
-      :model-value="/** @type import('./types.js').VjsfNode */(modelValue.root)"
+      :model-value="/** @type import('../types.js').VjsfNode */(modelValue.root)"
     />
   </v-row>
 </template>

package/src/components/vjsf.vue

@@ -1,10 +1,11 @@
 <script setup>
-import { computed, getCurrentInstance } from 'vue'
+import { computed } from 'vue'
 
 import { compile } from '@json-layout/core'
 import Tree from './tree.vue'
 import { useVjsf, emits } from '../composables/use-vjsf.js'
 import '../styles/vjsf.css'
+import { registeredNodeComponents } from '../utils/index.js'
 
 import NodeSection from './nodes/section.vue'
 import NodeTextField from './nodes/text-field.vue'
@@ -26,9 +27,10 @@ import NodeNumberCombobox from './nodes/number-combobox.vue'
 import NodeExpansionPanels from './nodes/expansion-panels.vue'
 import NodeStepper from './nodes/stepper.vue'
 import NodeList from './nodes/list.vue'
-import NodeMarkdown from './nodes/markdown.vue'
+import NodeFileInput from './nodes/file-input.vue'
 
-const comps = {
+/** @type {Record<string, import('vue').Component>} */
+const nodeComponents = {
   section: NodeSection,
   'text-field': NodeTextField,
   textarea: NodeTextarea,
@@ -49,14 +51,8 @@ const comps = {
   list: NodeList,
   combobox: NodeCombobox,
   'number-combobox': NodeNumberCombobox,
-  markdown: NodeMarkdown
-}
-
-const instance = getCurrentInstance()
-for (const [name, comp] of Object.entries(comps)) {
-  if (!instance?.appContext.app.component(`vjsf-node-${name}`)) {
-    instance?.appContext.app.component(`vjsf-node-${name}`, comp)
-  }
+  'file-input': NodeFileInput,
+  ...registeredNodeComponents
 }
 
 const props = defineProps({
@@ -74,7 +70,7 @@ const props = defineProps({
     default: null
   },
   options: {
-    /** @type import('vue').PropType<import('./types.js').PartialVjsfOptions> */
+    /** @type import('vue').PropType<import('../types.js').PartialVjsfOptions> */
     type: Object,
     required: true
   }
@@ -86,6 +82,7 @@ const { el, statefulLayout, stateTree } = useVjsf(
   computed(() => props.schema),
   computed(() => props.modelValue),
   computed(() => props.options),
+  nodeComponents,
   emit,
   compile,
   computed(() => props.precompiledLayout)
@@ -100,7 +97,6 @@ const { el, statefulLayout, stateTree } = useVjsf(
   >
     <tree
       v-if="statefulLayout && stateTree"
-      ref="tree"
       :model-value="stateTree"
       :stateful-layout="statefulLayout"
     />

package/src/composables/use-dnd.js

@@ -1,5 +1,5 @@
 import { shallowRef, ref, computed } from 'vue'
-import { moveArrayItem } from '../utils/arrays.js'
+import { moveArrayItem } from '../utils/index.js'
 
 /**
  * @template T

package/src/composables/use-vjsf.js

@@ -9,7 +9,7 @@ export const emits = {
   */
   'update:modelValue': (data) => true,
   /**
-   * @arg {StatefulLayout} state
+   * @arg {import('../types.js').VjsfStatefulLayout} state
   */
   'update:state': (state) => true
 }
@@ -17,16 +17,17 @@ export const emits = {
 /**
  * @param {import('vue').Ref<Object>} schema
  * @param {import('vue').Ref<any>} modelValue
- * @param {import('vue').Ref<import("../components/types.js").PartialVjsfOptions>} options
+ * @param {import('vue').Ref<import("../types.js").PartialVjsfOptions>} options
+ * @param {Record<string, import('vue').Component>} nodeComponents
  * @param {any} emit
  * @param {typeof import('@json-layout/core').compile} [compile]
  * @param {import('vue').Ref<import('@json-layout/core').CompiledLayout>} [precompiledLayout]
  */
-export const useVjsf = (schema, modelValue, options, emit, compile, precompiledLayout) => {
+export const useVjsf = (schema, modelValue, options, nodeComponents, emit, compile, precompiledLayout) => {
   const el = ref(null)
   const { width } = useElementSize(el)
 
-  /** @type import('vue').ShallowRef<StatefulLayout | null> */
+  /** @type import('vue').ShallowRef<import('../types.js').VjsfStatefulLayout | null> */
   const statefulLayout = shallowRef(null)
   /** @type import('vue').ShallowRef<import('@json-layout/core').StateTree | null> */
   const stateTree = shallowRef(null)
@@ -47,7 +48,7 @@ export const useVjsf = (schema, modelValue, options, emit, compile, precompiledL
 
   const slots = useSlots()
 
-  const fullOptions = computed(() => getFullOptions(options.value, form, width.value, slots))
+  const fullOptions = computed(() => getFullOptions(options.value, form, width.value, slots, nodeComponents))
 
   const compiledLayout = computed(() => {
     if (precompiledLayout?.value) return precompiledLayout?.value
@@ -71,12 +72,13 @@ export const useVjsf = (schema, modelValue, options, emit, compile, precompiledL
 
   const initStatefulLayout = () => {
     if (!width.value) return
-    const _statefulLayout = new StatefulLayout(
+    // @ts-ignore
+    const _statefulLayout = /** @type {import('../types.js').VjsfStatefulLayout} */(new StatefulLayout(
       toRaw(compiledLayout.value),
       toRaw(compiledLayout.value.skeletonTree),
       toRaw(fullOptions.value),
       toRaw(modelValue.value)
-    )
+    ))
     statefulLayout.value = _statefulLayout
     onStatefulLayoutUpdate()
     _statefulLayout.events.on('update', () => {
@@ -84,7 +86,6 @@ export const useVjsf = (schema, modelValue, options, emit, compile, precompiledL
     })
     emit('update:state', _statefulLayout)
     _statefulLayout.events.on('autofocus', () => {
-      console.log('autofocus ?')
       if (!el.value) return
       // @ts-ignore
       const autofocusNodeElement = el.value.querySelector('.vjsf-input--autofocus')

package/src/index.js

@@ -1,3 +1,4 @@
 import Vjsf from './components/vjsf.vue'
 import { defaultOptions } from './components/options.js'
 export { Vjsf, defaultOptions }
+export default Vjsf

package/src/{components/types.ts → types.ts}

@@ -1,4 +1,7 @@
+import { Component } from 'vue'
+
 import {
+  StatefulLayout,
   StatefulLayoutOptions,
   StateNode,
   CheckboxNode,
@@ -19,12 +22,14 @@ import {
   VerticalTabsNode,
   StepperNode,
   ComboboxNode,
+  MarkdownNode,
+  FileInputNode,
   CompileOptions
 } from '@json-layout/core'
 
 export type Density = 'default' | 'comfortable' | 'compact'
 
-export type VjsfOptions = StatefulLayoutOptions & CompileOptions & {
+export type VjsfStatefulLayoutOptions = StatefulLayoutOptions & {
   density: Density,
   fieldProps: Record<string, unknown>,
   fieldPropsCompact: Record<string, unknown>,
@@ -41,8 +46,18 @@ export type VjsfOptions = StatefulLayoutOptions & CompileOptions & {
   errorAlertProps: Record<string, unknown>,
   vjsfSlots: Record<string, () => unknown>,
   easyMDEOptions: Record<string, unknown>,
+  nodeComponents: Record<string, Component>,
+}
+
+export type VjsfCompileOptions = CompileOptions & {
+  nodeComponentImports: Record<string, string>
 }
 
+export type VjsfOptions = VjsfCompileOptions & VjsfStatefulLayoutOptions
+
+export type VjsfStatefulLayout = Omit<StatefulLayout, 'options'> & {options: VjsfStatefulLayoutOptions}
+
+export type PartialVjsfCompileOptions = Partial<Omit<VjsfCompileOptions, 'width'>>
 export type PartialVjsfOptions = Partial<Omit<VjsfOptions, 'width'>>
 
 export type VjsfNode = Omit<StateNode, 'options'> & {options: VjsfOptions}
@@ -61,7 +76,8 @@ export type VjsfSliderNode = Omit<SliderNode, 'options'> & {options: VjsfOptions
 export type VjsfSwitchNode = Omit<SwitchNode, 'options'> & {options: VjsfOptions}
 export type VjsfTextFieldNode = Omit<TextFieldNode, 'options'> & {options: VjsfOptions}
 export type VjsfTextareaNode = Omit<TextareaNode, 'options'> & {options: VjsfOptions}
+export type VjsfMarkdownNode = Omit<MarkdownNode, 'options'> & {options: VjsfOptions}
 export type VjsfVerticalTabsNode = Omit<VerticalTabsNode, 'options'> & {options: VjsfOptions}
 export type VjsfStepperNode = Omit<StepperNode, 'options'> & {options: VjsfOptions}
-
 export type VjsfComboboxNode = Omit<ComboboxNode, 'options'> & {options: VjsfOptions}
+export type VjsfFileInputNode = Omit<FileInputNode, 'options'> & {options: VjsfOptions}

package/src/utils/global-register.js

@@ -0,0 +1,10 @@
+/** @type {Record<string, import('vue').Component>} */
+export const registeredNodeComponents = {}
+
+/**
+ * @param {string} name
+ * @param {import('vue').Component} component
+ */
+export function registerNodeComponent (name, component) {
+  registeredNodeComponents[name] = component
+}

package/src/utils/index.js

@@ -0,0 +1,5 @@
+export * from './arrays.js'
+export * from './dates.js'
+export * from './props.js'
+export * from './slots.js'
+export * from './global-register.js'

package/src/utils/props.js

@@ -29,14 +29,14 @@ export function mergePropsLevels (propsLevels) {
 // calculate the props of a field/input type component (text fields, etc)
 // isMainComp is used to determine if this input component is also the main rendered component or if is mostly a wrapper (date picker, etc.)
 /**
- * @param {import('@json-layout/core').StateNode} node
- * @param {import('@json-layout/core').StatefulLayout} statefulLayout
+ * @param {import('../types.js').VjsfNode} node
+ * @param {import('../types.js').VjsfStatefulLayout} statefulLayout
  * @param {(string | [string, string])[]} [layoutPropsMap]
  * @param {boolean} isMainComp
  * @returns {Record<string, any>}
  */
 export function getInputProps (node, statefulLayout, layoutPropsMap, isMainComp = true) {
-  const options = /** @type import('../components/types.js').VjsfOptions */(node.options)
+  const options = node.options
   /** @type {(Record<string, any> | undefined)[]} */
   const propsLevels = [options.fieldProps]
   if (options.density === 'comfortable') propsLevels.push(options.fieldPropsComfortable)
@@ -86,7 +86,7 @@ export function getInputProps (node, statefulLayout, layoutPropsMap, isMainComp
  * @returns {Record<string, any>}
  */
 export function getCompProps (node, comp, isMainComp = true) {
-  const options = /** @type import('../components/types.js').VjsfOptions */(node.options)
+  const options = /** @type import('../types.js').VjsfOptions */(node.options)
   /** @type {(Record<string, any> | undefined)[]} */
   const propsLevels = [{ density: options.density }]
   propsLevels.push(/** @type Record<string, any> | undefined */(options[`${comp}Props`]))

package/src/utils/slots.js

@@ -3,13 +3,12 @@ import NodeSlot from '../components/fragments/node-slot.vue'
 
 // calculate the slots of components
 /**
- * @param {import('@json-layout/core').StateNode} node
- * @param {import('@json-layout/core').StatefulLayout} statefulLayout
+ * @param {import('../types.js').VjsfNode} node
+ * @param {import('../types.js').VjsfStatefulLayout} statefulLayout
  * @returns {Record<string, any>}
  */
 export function getCompSlots (node, statefulLayout) {
   if (!node.layout.slots) return {}
-  // const options = /** @type import('../components/types.js').VjsfOptions */(node.options)
   /** @type {Record<string, any>} */
   const slots = {}
   for (const [key, layoutSlot] of Object.entries(node.layout.slots)) {

package/types/compile/index.d.ts

@@ -1,7 +1,8 @@
 /**
  * @param {object} schema
- * @param {string} baseImport
+ * @param {import('../types.js').PartialVjsfCompileOptions} [options]
+ * @param {string} [baseImport]
  * @returns {string}
  */
-export function compile(schema: object, baseImport?: string): string;
+export function compile(schema: object, options?: Partial<Omit<import("../types.js").VjsfCompileOptions, "width">> | undefined, baseImport?: string | undefined): string;
 //# sourceMappingURL=index.d.ts.map

package/types/compile/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/compile/index.js"],"names":[],"mappings":"AAkCA;;;;GAIG;AACH,gCAJW,MAAM,eACN,MAAM,GACJ,MAAM,CAalB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/compile/index.js"],"names":[],"mappings":"AAmCA;;;;;GAKG;AACH,gCALW,MAAM,4HAGJ,MAAM,CAyBlB"}

package/types/compile/options.d.ts

@@ -0,0 +1,4 @@
+/** @type import("../types.js").PartialVjsfCompileOptions */
+export const defaultOptions: import("../types.js").PartialVjsfCompileOptions;
+export function getFullOptions(options: import("../types.js").PartialVjsfCompileOptions): import("../types.js").VjsfCompileOptions;
+//# sourceMappingURL=options.d.ts.map

package/types/compile/options.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"options.d.ts","sourceRoot":"","sources":["../../src/compile/options.js"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,6BADU,OAAO,aAAa,EAAE,yBAAyB,CAKxD;AAOM,wCAHI,OAAO,aAAa,EAAE,yBAAyB,4CASzD"}

package/types/components/fragments/help-message.vue.d.ts

@@ -1,7 +1,7 @@
 declare const _default: import("vue").DefineComponent<{}, {
-    node: import("../types.js").VjsfNode;
+    node: import("../../types.js").VjsfNode;
     $props: {
-        readonly node?: import("../types.js").VjsfNode | undefined;
+        readonly node?: import("../../types.js").VjsfNode | undefined;
     };
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
 export default _default;

package/types/components/fragments/node-slot.vue.d.ts

@@ -5,13 +5,13 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     node: {
-        /** @type import('vue').PropType<import('../types.js').VjsfNode> */
-        type: import('vue').PropType<import('../types.js').VjsfNode>;
+        /** @type import('vue').PropType<import('../../types.js').VjsfNode> */
+        type: import('vue').PropType<import('../../types.js').VjsfNode>;
         required: true;
     };
     statefulLayout: {
-        /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
-        type: import('vue').PropType<import('@json-layout/core').StatefulLayout>;
+        /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
+        type: import('vue').PropType<import('../../types.js').VjsfStatefulLayout>;
         required: true;
     };
     tag: {
@@ -26,13 +26,13 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
     node: {
-        /** @type import('vue').PropType<import('../types.js').VjsfNode> */
-        type: import('vue').PropType<import('../types.js').VjsfNode>;
+        /** @type import('vue').PropType<import('../../types.js').VjsfNode> */
+        type: import('vue').PropType<import('../../types.js').VjsfNode>;
         required: true;
     };
     statefulLayout: {
-        /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
-        type: import('vue').PropType<import('@json-layout/core').StatefulLayout>;
+        /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
+        type: import('vue').PropType<import('../../types.js').VjsfStatefulLayout>;
         required: true;
     };
     tag: {

package/types/components/fragments/node-slot.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"node-slot.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fragments/node-slot.vue.js"],"names":[],"mappings":";;QAUM,2EAA2E;cAAjE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,yBAAyB,EAAE,IAAI,CAAC;;;;QAKxE,mEAAmE;cAAzD,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,aAAa,EAAE,QAAQ,CAAC;;;;QAKhE,+EAA+E;cAArE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,mBAAmB,EAAE,cAAc,CAAC;;;;QAK5E,2CAA2C;cAAjC,OAAO,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC;;;;;QAfxC,2EAA2E;cAAjE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,yBAAyB,EAAE,IAAI,CAAC;;;;QAKxE,mEAAmE;cAAzD,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,aAAa,EAAE,QAAQ,CAAC;;;;QAKhE,+EAA+E;cAArE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,mBAAmB,EAAE,cAAc,CAAC;;;;QAK5E,2CAA2C;cAAjC,OAAO,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC"}
+{"version":3,"file":"node-slot.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fragments/node-slot.vue.js"],"names":[],"mappings":";;QAUM,2EAA2E;cAAjE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,yBAAyB,EAAE,IAAI,CAAC;;;;QAKxE,sEAAsE;cAA5D,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,QAAQ,CAAC;;;;QAKnE,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;;QAK7E,2CAA2C;cAAjC,OAAO,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC;;;;;QAfxC,2EAA2E;cAAjE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,yBAAyB,EAAE,IAAI,CAAC;;;;QAKxE,sEAAsE;cAA5D,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,QAAQ,CAAC;;;;QAKnE,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;;QAK7E,2CAA2C;cAAjC,OAAO,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC"}

package/types/components/fragments/section-header.vue.d.ts

@@ -1,7 +1,7 @@
 declare const _default: import("vue").DefineComponent<{}, {
-    node: import("../types.js").VjsfNode;
+    node: import("../../types.js").VjsfNode;
     $props: {
-        readonly node?: import("../types.js").VjsfNode | undefined;
+        readonly node?: import("../../types.js").VjsfNode | undefined;
     };
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
 export default _default;