@koumoul/vjsf 3.0.0-beta.8 → 3.0.0

package/src/options.js

@@ -0,0 +1,67 @@
+/** @type {import('./types.js').VjsfIcons} */
+export const defaultIcons = {
+  // as much as possible with use standard vuetify aliases
+  add: '$plus',
+  calendar: '$calendar',
+  close: '$close',
+  edit: '$edit',
+  sortDown: '$sortDesc',
+  sortUp: '$sortAsc',
+  // codes are copied from here https://raw.githubusercontent.com/Templarian/MaterialDesign-JS/refs/heads/master/mdi.js
+  alert: 'svg:M13 14H11V9H13M13 18H11V16H13M1 21H23L12 2L1 21Z',
+  clock: 'svg:M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M16.2,16.2L11,13V7H12.5V12.2L17,14.9L16.2,16.2Z',
+  delete: 'svg:M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z',
+  duplicate: 'svg:M11,17H4A2,2 0 0,1 2,15V3A2,2 0 0,1 4,1H16V3H4V15H11V13L15,16L11,19V17M19,21V7H8V13H6V7A2,2 0 0,1 8,5H19A2,2 0 0,1 21,7V21A2,2 0 0,1 19,23H8A2,2 0 0,1 6,21V19H8V21H19Z',
+  infoSymbol: 'svg:M11 9H13V7H11V9M11 17H13V11H11V17Z',
+  menu: 'svg:M12,16A2,2 0 0,1 14,18A2,2 0 0,1 12,20A2,2 0 0,1 10,18A2,2 0 0,1 12,16M12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12A2,2 0 0,1 12,10M12,4A2,2 0 0,1 14,6A2,2 0 0,1 12,8A2,2 0 0,1 10,6A2,2 0 0,1 12,4Z',
+  sort: 'svg:M17.45,17.55L12,23L6.55,17.55L7.96,16.14L11,19.17V4.83L7.96,7.86L6.55,6.45L12,1L17.45,6.45L16.04,7.86L13,4.83V19.17L16.04,16.14L17.45,17.55Z'
+}
+
+export const defaultOptions = {
+  nodeComponents: {},
+  plugins: [],
+  pluginsOptions: {}
+}
+
+/**
+ *
+ * @param {Partial<import("./types.js").VjsfOptions> | null} options
+ * @param {any} form
+ * @param {number} width
+ * @param {Record<string, unknown> | undefined} globalDefaults
+ * @param {import("vue").Slots} slots
+ * @param {Record<string, import('vue').Component>} defaultNodeComponents
+ * @param {(data: any) => void} onData
+ * @param {(statefulLayout: import('@json-layout/core').StatefulLayout) => void} onUpdate
+ * @param {(key: string) => void} onAutofocus
+ * @returns
+ */
+export const getFullOptions = (options, form, width, globalDefaults, slots, defaultNodeComponents, onData, onUpdate, onAutofocus) => {
+  const components = { ...options?.components }
+  const nodeComponents = { ...defaultNodeComponents, ...options?.nodeComponents }
+  if (options?.plugins) {
+    for (const plugin of options.plugins) {
+      components[plugin.info.name] = plugin.info
+      nodeComponents[plugin.info.name] = plugin.nodeComponent
+    }
+  }
+  const icons = { ...options?.icons, ...defaultIcons }
+
+  /** @type {import('./types.js').VjsfOptions} */
+  const fullOptions = {
+    ...defaultOptions,
+    readOnly: !!(form && (form.isDisabled.value || form.isReadonly.value)),
+    density: /** @type {import("./types.js").VjsfOptions['density']} */(globalDefaults?.density),
+    ...options,
+    onData,
+    onUpdate,
+    onAutofocus,
+    context: options?.context ? JSON.parse(JSON.stringify(options.context)) : {},
+    width: Math.round(width ?? 0),
+    vjsfSlots: { ...slots },
+    components,
+    nodeComponents,
+    icons
+  }
+  return fullOptions
+}

package/src/types.ts

@@ -1,4 +1,6 @@
-import { Component } from 'vue'
+import type { Component, Slots } from 'vue'
+
+import type { ComponentInfo } from '@json-layout/vocabulary'
 
 import {
   StatefulLayout,
@@ -15,6 +17,9 @@ import {
   OneOfSelectNode,
   SectionNode,
   SelectNode,
+  RadioGroupNode,
+  CheckboxGroupNode,
+  SwitchGroupNode,
   SliderNode,
   SwitchNode,
   TextFieldNode,
@@ -22,51 +27,77 @@ import {
   VerticalTabsNode,
   StepperNode,
   ComboboxNode,
-  MarkdownNode,
   FileInputNode,
+  CardNode,
   CompileOptions
 } from '@json-layout/core'
 
 export type Density = 'default' | 'comfortable' | 'compact'
 
+export type Plugin = {
+  info: ComponentInfo,
+  nodeComponent: Component
+}
+
+export type VjsfIcons = {
+  add: string
+  alert: string
+  calendar: string
+  clock: string
+  close: string
+  delete: string
+  duplicate: string
+  edit: string
+  infoSymbol: string
+  menu: string
+  sort: string
+  sortUp: string
+  sortDown: string
+}
+
 // these options used to contain many possibilities to override props in various components
 // this was unmaintainable and has been removed, customization of components should be done via slots
-// and vuetify defaults providers
-export type VjsfStatefulLayoutOptions = StatefulLayoutOptions & {
-  vjsfSlots: Record<string, () => unknown>,
+// and defaults providers
+export type VjsfStatefulLayoutOptions = Partial<StatefulLayoutOptions> & {
+  vjsfSlots: Slots,
   nodeComponents: Record<string, Component>,
-  plugins: Record<string, unknown>
+  plugins: Plugin[],
+  pluginsOptions: Record<string, unknown>,
+  icons: VjsfIcons
 }
 
-export type VjsfCompileOptions = CompileOptions & {
-  nodeComponentImports: Record<string, string>
+export type VjsfCompileOptions = Partial<CompileOptions> & {
+  pluginsImports: string[]
 }
+export type PartialVjsfCompileOptions = Partial<VjsfCompileOptions>
 
-export type VjsfOptions = VjsfCompileOptions & VjsfStatefulLayoutOptions
+export type VjsfOptions = PartialVjsfCompileOptions & VjsfStatefulLayoutOptions
+export type PartialVjsfOptions = Partial<Omit<VjsfOptions, 'width' | 'vjsfSlots' | 'onData' | 'onUpdate' | 'onAutofocus'>>
+export type FullVjsfNodeOptions = Required<VjsfOptions>
 
 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}
-export type VjsfTabsNode = Omit<TabsNode, 'options'> & {options: VjsfOptions}
-export type VjsfCheckboxNode = Omit<CheckboxNode, 'options'> & {options: VjsfOptions}
-export type VjsfColorPickerNode = Omit<ColorPickerNode, 'options'> & {options: VjsfOptions}
-export type VjsfDatePickerNode = Omit<DatePickerNode, 'options'> & {options: VjsfOptions}
-export type VjsfDateTimePickerNode = Omit<DateTimePickerNode, 'options'> & {options: VjsfOptions}
-export type VjsfExpansionPanelsNode = Omit<ExpansionPanelsNode, 'options'> & {options: VjsfOptions}
-export type VjsfListNode = Omit<ListNode, 'options'> & {options: VjsfOptions}
-export type VjsfNumberFieldNode = Omit<NumberFieldNode, 'options'> & {options: VjsfOptions}
-export type VjsfOneOfSelectNode = Omit<OneOfSelectNode, 'options'> & {options: VjsfOptions}
-export type VjsfSectionNode = Omit<SectionNode, 'options'> & {options: VjsfOptions}
-export type VjsfSelectNode = Omit<SelectNode, 'options'> & {options: VjsfOptions}
-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}
+export type VjsfNode = Omit<StateNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfTabsNode = Omit<TabsNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfCheckboxNode = Omit<CheckboxNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfColorPickerNode = Omit<ColorPickerNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfDatePickerNode = Omit<DatePickerNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfDateTimePickerNode = Omit<DateTimePickerNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfExpansionPanelsNode = Omit<ExpansionPanelsNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfListNode = Omit<ListNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfNumberFieldNode = Omit<NumberFieldNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfOneOfSelectNode = Omit<OneOfSelectNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfSectionNode = Omit<SectionNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfSelectNode = Omit<SelectNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfRadioGroupNode = Omit<RadioGroupNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfCheckboxGroupNode = Omit<CheckboxGroupNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfSwitchGroupNode = Omit<SwitchGroupNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfSliderNode = Omit<SliderNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfSwitchNode = Omit<SwitchNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfTextFieldNode = Omit<TextFieldNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfTextareaNode = Omit<TextareaNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfVerticalTabsNode = Omit<VerticalTabsNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfStepperNode = Omit<StepperNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfComboboxNode = Omit<ComboboxNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfFileInputNode = Omit<FileInputNode, 'options'> & {options: FullVjsfNodeOptions}
+export type VjsfCardNode = Omit<CardNode, 'options'> & {options: FullVjsfNodeOptions}

package/src/utils/arrays.js

@@ -1,15 +1,46 @@
 /**
- * @template T
- * @param {T[]} array
+ * @param {any[] | Record<string, any>} data
  * @param {number} fromIndex
  * @param {number} toIndex
- * @return {T[]}
+ * @return {any[] | Record<string, any>}
  */
-export function moveArrayItem (array, fromIndex, toIndex) {
-  if (fromIndex === toIndex || fromIndex === -1 || toIndex === -1) return array
-  const newArray = [...array]
+export function moveDataItem (data, fromIndex, toIndex) {
+  if (fromIndex === toIndex || fromIndex === -1 || toIndex === -1) return data
+  if (!Array.isArray(data) && typeof data === 'object') return moveObjectItem(data, fromIndex, toIndex)
+  return moveArrayItem(data, fromIndex, toIndex)
+}
+
+/**
+ * @param {any[]} data
+ * @param {number} fromIndex
+ * @param {number} toIndex
+ * @return {any[]}
+ */
+export function moveArrayItem (data, fromIndex, toIndex) {
+  if (fromIndex === toIndex || fromIndex === -1 || toIndex === -1) return data
+  // @ts-ignore
+  if (!Array.isArray(data) && typeof data === 'object') return moveObjectItem(data, fromIndex, toIndex)
+  const newArray = [...data]
   const element = newArray[fromIndex]
   newArray.splice(fromIndex, 1)
   newArray.splice(toIndex, 0, element)
   return newArray
 }
+
+/**
+ * @param {Record<string, any>} data
+ * @param {number} fromIndex
+ * @param {number} toIndex
+ * @return {Record<string, any>}
+ */
+export function moveObjectItem (data, fromIndex, toIndex) {
+  if (fromIndex === toIndex || fromIndex === -1 || toIndex === -1) return data
+  const newKeys = /** @type {string[] } */(moveArrayItem(Object.keys(data), fromIndex, toIndex))
+  /** @type {Record<string, any>} */
+  const newData = {}
+  for (const key of newKeys) {
+    newData[key] = data[key]
+  }
+  console.log(newData)
+  return newData
+}

package/types/compat/v2.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"v2.d.ts","sourceRoot":"","sources":["../../src/compat/v2.js"],"names":[],"mappings":"AAoGA;;;;;;GAMG;AACH,kCALW,MAAM,+CAEN,MAAM,0BAkBhB;sBA1HqB,KAAK"}
+{"version":3,"file":"v2.d.ts","sourceRoot":"","sources":["../../src/compat/v2.js"],"names":[],"mappings":"AAqMA;;;;;;GAMG;AACH,kCALW,MAAM,+CAEN,MAAM,0BAoBhB;sBA7NqB,KAAK"}

package/types/compile/index.d.ts

@@ -2,7 +2,7 @@
  * @param {object} schema
  * @param {import('../types.js').PartialVjsfCompileOptions} [options]
  * @param {string} [baseImport]
- * @returns {string}
+ * @returns {Promise<string>}
  */
-export function compile(schema: object, options?: Partial<Omit<import("../types.js").VjsfCompileOptions, "width">> | undefined, baseImport?: string | undefined): string;
+export function compile(schema: object, options?: Partial<import("../types.js").VjsfCompileOptions> | undefined, baseImport?: string | undefined): Promise<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":"AAmCA;;;;;GAKG;AACH,gCALW,MAAM,4HAGJ,MAAM,CAyBlB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/compile/index.js"],"names":[],"mappings":"AAmCA;;;;;GAKG;AACH,gCALW,MAAM,6GAGJ,QAAQ,MAAM,CAAC,CAwC3B"}

package/types/compile/options.d.ts

@@ -1,4 +1,5 @@
-/** @type import("../types.js").PartialVjsfCompileOptions */
-export const defaultOptions: import("../types.js").PartialVjsfCompileOptions;
+export namespace defaultOptions {
+    let pluginsImports: string[];
+}
 export function getFullOptions(options: import("../types.js").PartialVjsfCompileOptions): import("../types.js").VjsfCompileOptions;
 //# sourceMappingURL=options.d.ts.map

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

@@ -1 +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"}
+{"version":3,"file":"options.d.ts","sourceRoot":"","sources":["../../src/compile/options.js"],"names":[],"mappings":";;;AASO,wCAHI,OAAO,aAAa,EAAE,yBAAyB,4CAOzD"}

package/types/components/fragments/child-subtitle.vue.d.ts

@@ -0,0 +1,8 @@
+declare const _default: import("vue").DefineComponent<any, {
+    modelValue: import("../../../../node_modules/@json-layout/core/types/state/types.js").StateNode;
+    $props: {
+        modelValue?: import("../../../../node_modules/@json-layout/core/types/state/types.js").StateNode | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;
+//# sourceMappingURL=child-subtitle.vue.d.ts.map

package/types/components/fragments/child-subtitle.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"child-subtitle.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fragments/child-subtitle.vue.js"],"names":[],"mappings":""}

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

@@ -1,8 +1,8 @@
-declare const _default: import("vue").DefineComponent<{}, {
+declare const _default: import("vue").DefineComponent<any, {
     node: import("../../types.js").VjsfNode;
     $props: {
         readonly node?: import("../../types.js").VjsfNode | undefined;
     };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=help-message.vue.d.ts.map

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

@@ -1,47 +1,5 @@
-declare const _default: import("vue").DefineComponent<{
-    layoutSlot: {
-        /** @type import('vue').PropType<import('@json-layout/vocabulary').Slot> */
-        type: import('vue').PropType<import('@json-layout/vocabulary').Slot>;
-        required: true;
-    };
-    node: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfNode> */
-        type: import('vue').PropType<import('../../types.js').VjsfNode>;
-        required: true;
-    };
-    statefulLayout: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
-        type: import('vue').PropType<import('../../types.js').VjsfStatefulLayout>;
-        required: true;
-    };
-    tag: {
-        /** @type import('vue').PropType<string> */
-        type: import('vue').PropType<string>;
-        default: null;
-    };
-}, any, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    layoutSlot: {
-        /** @type import('vue').PropType<import('@json-layout/vocabulary').Slot> */
-        type: import('vue').PropType<import('@json-layout/vocabulary').Slot>;
-        required: true;
-    };
-    node: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfNode> */
-        type: import('vue').PropType<import('../../types.js').VjsfNode>;
-        required: true;
-    };
-    statefulLayout: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
-        type: import('vue').PropType<import('../../types.js').VjsfStatefulLayout>;
-        required: true;
-    };
-    tag: {
-        /** @type import('vue').PropType<string> */
-        type: import('vue').PropType<string>;
-        default: null;
-    };
-}>>, {
+declare const _default: import("vue").DefineComponent<any, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {
     tag: string;
-}, {}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=node-slot.vue.d.ts.map

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,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"}
+{"version":3,"file":"node-slot.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fragments/node-slot.vue.js"],"names":[],"mappings":""}

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

@@ -1,8 +1,10 @@
-declare const _default: import("vue").DefineComponent<{}, {
+declare const _default: import("vue").DefineComponent<any, {
     node: import("../../types.js").VjsfNode;
+    hideTitle: boolean;
     $props: {
         readonly node?: import("../../types.js").VjsfNode | undefined;
+        readonly hideTitle?: boolean | undefined;
     };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=section-header.vue.d.ts.map

package/types/components/fragments/select-item-icon.vue.d.ts

@@ -1,15 +1,5 @@
-declare const _default: import("vue").DefineComponent<{
-    icon: {
-        type: StringConstructor;
-        required: true;
-    };
-}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+declare const _default: import("vue").DefineComponent<any, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
-}>, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    icon: {
-        type: StringConstructor;
-        required: true;
-    };
-}>>, {}, {}>;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=select-item-icon.vue.d.ts.map

package/types/components/fragments/select-item.vue.d.ts

@@ -1,4 +1,4 @@
-declare const _default: import("vue").DefineComponent<{}, {
+declare const _default: import("vue").DefineComponent<any, {
     multiple: boolean;
     item: import("../../../../node_modules/@json-layout/vocabulary/types/normalized-layout/types.js").SelectItem;
     itemProps: Record<string, any>;
@@ -7,6 +7,6 @@ declare const _default: import("vue").DefineComponent<{}, {
         readonly item?: import("../../../../node_modules/@json-layout/vocabulary/types/normalized-layout/types.js").SelectItem | undefined;
         readonly itemProps?: Record<string, any> | undefined;
     };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=select-item.vue.d.ts.map

package/types/components/fragments/select-selection.vue.d.ts

@@ -1,4 +1,4 @@
-declare const _default: import("vue").DefineComponent<{}, {
+declare const _default: import("vue").DefineComponent<any, {
     multiple: boolean;
     item: import("../../../../node_modules/@json-layout/vocabulary/types/normalized-layout/types.js").SelectItem;
     last: boolean;
@@ -7,6 +7,6 @@ declare const _default: import("vue").DefineComponent<{}, {
         readonly item?: import("../../../../node_modules/@json-layout/vocabulary/types/normalized-layout/types.js").SelectItem | undefined;
         readonly last?: boolean | undefined;
     };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=select-selection.vue.d.ts.map

package/types/components/fragments/selection-group.vue.d.ts

@@ -0,0 +1,5 @@
+declare const _default: import("vue").DefineComponent<any, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;
+//# sourceMappingURL=selection-group.vue.d.ts.map

package/types/components/fragments/selection-group.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selection-group.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fragments/selection-group.vue.js"],"names":[],"mappings":""}

package/types/components/fragments/text-field-menu.vue.d.ts

@@ -1,4 +1,4 @@
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<any, {
     modelValue: import("../../types.js").VjsfNode;
     statefulLayout: import("../../types.js").VjsfStatefulLayout;
     formattedValue: string | null;
@@ -7,7 +7,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}
         readonly statefulLayout?: import("../../types.js").VjsfStatefulLayout | undefined;
         readonly formattedValue?: string | null | undefined;
     };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>, {
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
     "prepend-inner"?(_: {}): any;
     default?(_: {
         close: () => boolean;

package/types/components/fragments/text-field-menu.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-field-menu.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fragments/text-field-menu.vue.js"],"names":[],"mappings":";;;;;;;;;;6BAkIsC,GAAG;;;QACX,GAAG"}
+{"version":3,"file":"text-field-menu.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fragments/text-field-menu.vue.js"],"names":[],"mappings":";;;;;;;;;;6BA8IsC,GAAG;;;QACX,GAAG"}

package/types/components/node.vue.d.ts

@@ -1,10 +1,10 @@
-declare const _default: import("vue").DefineComponent<{}, {
+declare const _default: import("vue").DefineComponent<any, {
     modelValue: import("../types.js").VjsfNode;
     statefulLayout: import("../types.js").VjsfStatefulLayout;
     $props: {
         readonly modelValue?: import("../types.js").VjsfNode | undefined;
         readonly statefulLayout?: import("../types.js").VjsfStatefulLayout | undefined;
     };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=node.vue.d.ts.map

package/types/components/nodes/autocomplete.vue.d.ts

@@ -1,27 +1,5 @@
-declare const _default: import("vue").DefineComponent<{
-    modelValue: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfSelectNode> */
-        type: import('vue').PropType<import('../../types.js').VjsfSelectNode>;
-        required: true;
-    };
-    statefulLayout: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
-        type: import('vue').PropType<import('../../types.js').VjsfStatefulLayout>;
-        required: true;
-    };
-}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+declare const _default: import("vue").DefineComponent<any, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
-}>, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    modelValue: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfSelectNode> */
-        type: import('vue').PropType<import('../../types.js').VjsfSelectNode>;
-        required: true;
-    };
-    statefulLayout: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
-        type: import('vue').PropType<import('../../types.js').VjsfStatefulLayout>;
-        required: true;
-    };
-}>>, {}, {}>;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=autocomplete.vue.d.ts.map

package/types/components/nodes/autocomplete.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"autocomplete.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/autocomplete.vue.js"],"names":[],"mappings":";;QAWI,4EAA4E;cAAlE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,cAAc,CAAC;;;;QAKzE,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;;;;;QAL7E,4EAA4E;cAAlE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,cAAc,CAAC;;;;QAKzE,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC"}
+{"version":3,"file":"autocomplete.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/autocomplete.vue.js"],"names":[],"mappings":""}

package/types/components/nodes/card.vue.d.ts

@@ -0,0 +1,10 @@
+declare const _default: import("vue").DefineComponent<any, {
+    modelValue: import("../../types.js").VjsfCardNode;
+    statefulLayout: import("../../types.js").VjsfStatefulLayout;
+    $props: {
+        readonly modelValue?: import("../../types.js").VjsfCardNode | undefined;
+        readonly statefulLayout?: import("../../types.js").VjsfStatefulLayout | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;
+//# sourceMappingURL=card.vue.d.ts.map

package/types/components/nodes/card.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/card.vue.js"],"names":[],"mappings":""}

package/types/components/nodes/checkbox-group.vue.d.ts

@@ -0,0 +1,5 @@
+declare const _default: import("vue").DefineComponent<any, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;
+//# sourceMappingURL=checkbox-group.vue.d.ts.map

package/types/components/nodes/checkbox-group.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox-group.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/checkbox-group.vue.js"],"names":[],"mappings":""}

package/types/components/nodes/checkbox.vue.d.ts

@@ -1,10 +1,5 @@
-declare const _default: import("vue").DefineComponent<{}, {
-    modelValue: import("../../types.js").VjsfCheckboxNode;
-    statefulLayout: import("../../types.js").VjsfStatefulLayout;
-    $props: {
-        readonly modelValue?: import("../../types.js").VjsfCheckboxNode | undefined;
-        readonly statefulLayout?: import("../../types.js").VjsfStatefulLayout | undefined;
-    };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import("vue").DefineComponent<any, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=checkbox.vue.d.ts.map

package/types/components/nodes/color-picker.vue.d.ts

@@ -1,10 +1,10 @@
-declare const _default: import("vue").DefineComponent<{}, {
+declare const _default: import("vue").DefineComponent<any, {
     modelValue: import("../../types.js").VjsfColorPickerNode;
     statefulLayout: import("../../types.js").VjsfStatefulLayout;
     $props: {
         readonly modelValue?: import("../../types.js").VjsfColorPickerNode | undefined;
         readonly statefulLayout?: import("../../types.js").VjsfStatefulLayout | undefined;
     };
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=color-picker.vue.d.ts.map

package/types/components/nodes/combobox.vue.d.ts

@@ -1,27 +1,5 @@
-declare const _default: import("vue").DefineComponent<{
-    modelValue: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfComboboxNode> */
-        type: import('vue').PropType<import('../../types.js').VjsfComboboxNode>;
-        required: true;
-    };
-    statefulLayout: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
-        type: import('vue').PropType<import('../../types.js').VjsfStatefulLayout>;
-        required: true;
-    };
-}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+declare const _default: import("vue").DefineComponent<any, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
-}>, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    modelValue: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfComboboxNode> */
-        type: import('vue').PropType<import('../../types.js').VjsfComboboxNode>;
-        required: true;
-    };
-    statefulLayout: {
-        /** @type import('vue').PropType<import('../../types.js').VjsfStatefulLayout> */
-        type: import('vue').PropType<import('../../types.js').VjsfStatefulLayout>;
-        required: true;
-    };
-}>>, {}, {}>;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<any> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=combobox.vue.d.ts.map

package/types/components/nodes/combobox.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/combobox.vue.js"],"names":[],"mappings":";;QASM,8EAA8E;cAApE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,gBAAgB,CAAC;;;;QAK3E,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC;;;;;;;QAL7E,8EAA8E;cAApE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,gBAAgB,CAAC;;;;QAK3E,gFAAgF;cAAtE,OAAO,KAAK,EAAE,QAAQ,CAAC,OAAO,gBAAgB,EAAE,kBAAkB,CAAC"}
+{"version":3,"file":"combobox.vue.d.ts","sourceRoot":"","sources":["../../../src/components/nodes/combobox.vue.js"],"names":[],"mappings":""}