@koumoul/vjsf 2.22.1 → 3.0.0-alpha.0

package/src/components/options.js

@@ -0,0 +1,25 @@
+/** @type Partial<import("./types.js").VjsfOptions> */
+export const defaultOptions = {
+  // matches the density prop found in many vuetify components
+  density: 'default',
+  titleDepth: 2,
+  fieldProps: {},
+  fieldPropsCompact: {
+    density: 'compact',
+    hideDetails: 'auto'
+  },
+  fieldPropsComfortable: {
+    density: 'comfortable'
+  },
+  fieldPropsReadOnly: { hideDetails: 'auto', variant: 'plain' },
+  textfieldProps: {},
+  textfieldPropsReadOnly: {},
+  textareaProps: {},
+  textareaPropsReadOnly: {},
+  // it is not very common to show an error below checkboxes and switches and without hide-details=auto they take a lot of space
+  checkboxProps: { hideDetails: 'auto' },
+  checkboxPropsReadOnly: {},
+  switchProps: { hideDetails: 'auto' },
+  switchPropsReadOnly: {},
+  errorAlertProps: { type: 'error', variant: 'tonal' }
+}

package/src/components/tree.vue

@@ -0,0 +1,25 @@
+<script setup>
+import Node from './node.vue'
+
+defineProps({
+  modelValue: {
+    /** @type import('vue').PropType<import('@json-layout/core').StateTree> */
+    type: Object,
+    required: true
+  },
+  statefulLayout: {
+    /** @type import('vue').PropType<import('@json-layout/core').StatefulLayout> */
+    type: Object,
+    required: true
+  }
+})
+</script>
+
+<template>
+  <v-row>
+    <node
+      :stateful-layout="statefulLayout"
+      :model-value="/** @type import('./types.js').VjsfNode */(modelValue.root)"
+    />
+  </v-row>
+</template>

package/src/components/types.ts

@@ -0,0 +1,59 @@
+import {
+  StatefulLayoutOptions,
+  StateNode,
+  CheckboxNode,
+  ColorPickerNode,
+  DatePickerNode,
+  DateTimePickerNode,
+  TabsNode,
+  ExpansionPanelsNode,
+  ListNode,
+  NumberFieldNode,
+  OneOfSelectNode,
+  SectionNode,
+  SelectNode,
+  SliderNode,
+  SwitchNode,
+  TextFieldNode,
+  TextareaNode,
+  VerticalTabsNode,
+  CompileOptions
+} from '@json-layout/core'
+
+export type Density = 'default' | 'comfortable' | 'compact'
+
+export type VjsfOptions = StatefulLayoutOptions & CompileOptions & {
+  density: Density,
+  fieldProps: Record<string, unknown>,
+  fieldPropsCompact: Record<string, unknown>,
+  fieldPropsComfortable: Record<string, unknown>,
+  fieldPropsReadOnly: Record<string, unknown>,
+  textfieldProps: Record<string, unknown>,
+  textfieldPropsReadOnly: Record<string, unknown>,
+  textareaProps: Record<string, unknown>,
+  textareaPropsReadOnly: Record<string, unknown>,
+  checkboxProps: Record<string, unknown>,
+  checkboxPropsReadOnly: Record<string, unknown>,
+  switchProps: Record<string, unknown>,
+  switchPropsReadOnly: Record<string, unknown>,
+  errorAlertProps: Record<string, unknown>,
+  vjsfSlots: Record<string, () => unknown>,
+}
+
+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 VjsfVerticalTabsNode = Omit<VerticalTabsNode, 'options'> & {options: VjsfOptions}

package/src/components/vjsf.vue

@@ -0,0 +1,168 @@
+<script setup>
+import { ref, shallowRef, computed, getCurrentInstance, watch, useSlots, inject } from 'vue'
+import { useElementSize } from '@vueuse/core'
+import { StatefulLayout, compile } from '@json-layout/core'
+import Tree from './tree.vue'
+
+import NodeSection from './nodes/section.vue'
+import NodeTextField from './nodes/text-field.vue'
+import NodeTextarea from './nodes/textarea.vue'
+import NodeCheckbox from './nodes/checkbox.vue'
+import NodeSwitch from './nodes/switch.vue'
+import NodeNumberField from './nodes/number-field.vue'
+import NodeSlider from './nodes/slider.vue'
+import NodeDatePicker from './nodes/date-picker.vue'
+import NodeDateTimePicker from './nodes/date-time-picker.vue'
+import NodeColorPicker from './nodes/color-picker.vue'
+import NodeSelect from './nodes/select.vue'
+import NodeOneOfSelect from './nodes/one-of-select.vue'
+import NodeTabs from './nodes/tabs.vue'
+import NodeVerticalTabs from './nodes/vertical-tabs.vue'
+import NodeExpansionPanels from './nodes/expansion-panels.vue'
+import NodeList from './nodes/list.vue'
+import { defaultOptions } from './options.js'
+
+const comps = {
+  section: NodeSection,
+  'text-field': NodeTextField,
+  textarea: NodeTextarea,
+  checkbox: NodeCheckbox,
+  switch: NodeSwitch,
+  'number-field': NodeNumberField,
+  slider: NodeSlider,
+  'date-picker': NodeDatePicker,
+  'date-time-picker': NodeDateTimePicker,
+  'color-picker': NodeColorPicker,
+  select: NodeSelect,
+  'one-of-select': NodeOneOfSelect,
+  tabs: NodeTabs,
+  'vertical-tabs': NodeVerticalTabs,
+  'expansion-panels': NodeExpansionPanels,
+  list: NodeList
+}
+
+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)
+  }
+}
+
+const props = defineProps({
+  schema: {
+    type: Object,
+    required: true
+  },
+  modelValue: {
+    type: [Object, String, Number, Boolean],
+    default: null
+  },
+  options: {
+    /** @type import('vue').PropType<Partial<Omit<import('./types.js').VjsfOptions, 'width'>>> */
+    type: Object,
+    required: true
+  }
+})
+
+const emit = defineEmits(['update:modelValue', 'update:state'])
+
+/** @type import('vue').ShallowRef<StatefulLayout | null> */
+const statefulLayout = shallowRef(null)
+/** @type import('vue').ShallowRef<import('@json-layout/core').StateTree | null> */
+const stateTree = shallowRef(null)
+
+// cf https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/composables/form.ts
+const form = inject(Symbol.for('vuetify:form'))
+if (form) {
+  form.register({
+    id: 'vjsf', // TODO: a unique random id ?
+    validate: () => statefulLayout.value?.validate(),
+    reset: () => statefulLayout.value?.resetValidation(), // TODO: also empty the data ?
+    resetValidation: () => statefulLayout.value?.resetValidation()
+  })
+}
+
+const el = ref(null)
+const { width } = useElementSize(el)
+
+const slots = useSlots()
+
+/** @type import('vue').ComputedRef<import('./types.js').VjsfOptions> */
+const fullOptions = computed(() => {
+  const options = {
+    ...defaultOptions,
+    readOnly: form.isDisabled || form.isReadOnly,
+    ...props.options,
+    context: props.options.context ? JSON.parse(JSON.stringify(props.options.context)) : {},
+    width: Math.round(width.value ?? 0),
+    vjsfSlots: { ...slots }
+  }
+  return /** @type import('./types.js').VjsfOptions */ (options)
+})
+
+const compiledLayout = computed(() => compile(props.schema, fullOptions.value))
+
+const onStatefulLayoutUpdate = () => {
+  if (!statefulLayout.value) return
+  stateTree.value = statefulLayout.value.stateTree
+  emit('update:modelValue', statefulLayout.value.data)
+  emit('update:state', statefulLayout.value)
+  if (form) {
+    // cf https://vuetifyjs.com/en/components/forms/#validation-state
+    if (statefulLayout.value.valid) form.update('vjsf', true, [])
+    else if (statefulLayout.value.hasHiddenError) form.update('vjsf', null, [])
+    else form.update('vjsf', false, [])
+  }
+}
+
+const initStatefulLayout = () => {
+  if (!width.value) return
+  const _statefulLayout = new StatefulLayout(compiledLayout.value, compiledLayout.value.skeletonTree, fullOptions.value, props.modelValue)
+  statefulLayout.value = _statefulLayout
+  onStatefulLayoutUpdate()
+  _statefulLayout.events.on('update', () => {
+    onStatefulLayoutUpdate()
+  })
+  emit('update:state', _statefulLayout)
+}
+
+watch(fullOptions, (newOptions) => {
+  if (statefulLayout.value) {
+    statefulLayout.value.options = newOptions
+  } else {
+    initStatefulLayout()
+  }
+})
+
+// case where data is updated from outside
+watch(() => props.modelValue, (newData) => {
+  if (statefulLayout.value && statefulLayout.value.data !== newData) statefulLayout.value.data = newData
+})
+
+// case where schema is updated from outside
+watch(compiledLayout, (newCompiledLayout) => initStatefulLayout())
+
+</script>
+
+<template>
+  <div ref="el">
+    <tree
+      v-if="statefulLayout && stateTree"
+      :model-value="stateTree"
+      :stateful-layout="statefulLayout"
+    />
+  </div>
+</template>
+
+<style lang="css">
+/* override vuetify styles to manage readOnly fields more usable than the default disabled fields */
+.vjsf-input--readonly.v-input--disabled.v-text-field  .v-field--disabled input {
+  pointer-events: auto;
+}
+.vjsf-input--readonly.v-input--disabled .v-field--disabled,
+.vjsf-input--readonly.v-input--disabled .v-input__details,
+.vjsf-input--readonly.v-input--disabled .v-input__append,
+.vjsf-input--readonly.v-input--disabled .v-input__prepend {
+  opacity: inherit;
+}
+</style>

package/src/index.js

@@ -0,0 +1,2 @@
+import Vjsf from './components/vjsf.vue'
+export { Vjsf }

package/src/utils/clone.js

@@ -0,0 +1,3 @@
+import rfdc from 'rfdc'
+
+export default rfdc()

package/src/utils/dates.js

@@ -0,0 +1,52 @@
+// TODO: parts of this can probably be replaced by https://vuetifyjs.com/en/features/dates/
+
+// 1 => 01, 12 => 12
+export const padTimeComponent = (/** @type number */val) => {
+  const s = '' + val
+  return s.length === 1 ? '0' + s : s
+}
+
+// storing ISO times with the user's timezone offset is more dense in information that always storing the base ISO date
+// this way the application can either use the localized time or the ISO time by chosing to interpret or not the offset part
+// cf https://usefulangle.com/post/30/javascript-get-date-time-with-offset-hours-minutes
+// 2020-04-03T19:07:43.152Z => 2020-04-03T21:07:43+02:00
+export const getDateTimeWithOffset = (/** @type Date */date) => {
+  const offsetMinutes = date.getTimezoneOffset()
+  const offsetAbs = `${padTimeComponent(Math.abs(offsetMinutes / 60))}:${padTimeComponent(Math.abs(offsetMinutes % 60))}`
+  let offset
+  if (offsetMinutes < 0) offset = `+${offsetAbs}`
+  else if (offsetMinutes > 0) offset = `-${offsetAbs}`
+  else offset = 'Z'
+  return `${date.getFullYear()}-${padTimeComponent(date.getMonth() + 1)}-${padTimeComponent(date.getDate())}T${padTimeComponent(date.getHours())}:${padTimeComponent(date.getMinutes())}:${padTimeComponent(date.getSeconds())}${offset}`
+}
+
+// get the the date and short time components expected by date-time picker from a full date
+// 2020-04-03T21:07:43+02:00 => ['2020-04-03', '19:07']
+export const getDateTimeParts = (/** @type Date */date) => {
+  return [`${date.getFullYear()}-${padTimeComponent(date.getMonth() + 1)}-${padTimeComponent(date.getDate())}`, `${padTimeComponent(date.getHours())}:${padTimeComponent(date.getMinutes())}`]
+}
+
+// get a full date-time from the date and time parts edited by date-time picker
+// ['2020-04-03', '19:07'] => 2020-04-03T21:07:43+02:00
+export const getDateTime = (/** @type [string, string] */parts) => {
+  const date = new Date()
+  const dateParts = parts[0].split('-')
+  date.setFullYear(Number(dateParts[0]))
+  date.setMonth(Number(dateParts[1]) - 1)
+  date.setDate(Number(dateParts[2]))
+  const timeParts = parts[1].split(':')
+  date.setHours(Number(timeParts[0] || '00'))
+  date.setMinutes(Number(timeParts[1] || '00'))
+  date.setSeconds(0)
+  return getDateTimeWithOffset(date)
+}
+
+// get the short time representation expected by vuetify from a longer ISO time
+export const getShortTime = (/** @type string | undefined */time) => {
+  if (!time) return ''
+  return time.slice(0, 5)
+}
+
+export const getLongTime = (/** @type string */time) => {
+  return time + ':00Z'
+}

package/src/utils/props.js

@@ -0,0 +1,79 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { camelize } from 'vue'
+
+/**
+ * @param {(Record<string, any> | undefined)[]} propsLevels
+ * @returns Record<string, any>
+ */
+export function mergePropsLevels (propsLevels) {
+  /** @type Record<string, any> */
+  const fullProps = {}
+  for (const propsLevel of propsLevels) {
+    if (propsLevel) {
+      for (const key of Object.keys(propsLevel)) {
+        fullProps[camelize(key)] = propsLevel[key]
+      }
+    }
+  }
+  return fullProps
+}
+
+// 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 {boolean} isMainComp
+ * @returns {Record<string, any>}
+ */
+export function getInputProps (node, statefulLayout, isMainComp = true) {
+  const options = /** @type import('../components/types.js').VjsfOptions */(node.options)
+  /** @type {(Record<string, any> | undefined)[]} */
+  const propsLevels = [options.fieldProps]
+  if (options.density === 'comfortable') propsLevels.push(options.fieldPropsComfortable)
+  if (options.density === 'compact') propsLevels.push(options.fieldPropsCompact)
+  if (node.options.readOnly) propsLevels.push(options.fieldPropsReadOnly)
+  if (isMainComp) {
+    propsLevels.push(/** @type Record<string, any> | undefined */(options[`${node.layout.comp}Props`]))
+    if (node.options.readOnly) propsLevels.push(/** @type Record<string, any> | undefined */(options[`${node.layout.comp}PropsReadOnly`]))
+    propsLevels.push(node.layout.props)
+  }
+
+  const fullProps = mergePropsLevels(propsLevels)
+
+  fullProps.label = node.layout.label
+  if (node.error && node.validated) {
+    fullProps.errorMessages = node.error
+  }
+  fullProps.modelValue = node.data
+  if (node.options.readOnly) {
+    fullProps.disabled = true
+    fullProps.class = 'vjsf-input--readonly'
+  }
+
+  if (isMainComp) {
+    fullProps['onUpdate:modelValue'] = (/** @type string */value) => statefulLayout.input(node, value)
+    fullProps.onBlur = () => statefulLayout.blur(node)
+  }
+
+  return fullProps
+}
+
+// calculate the props of components that are not of the field category
+/**
+ * @param {import('@json-layout/core').StateNode} node
+ * @param {string} comp
+ * @param {boolean} isMainComp
+ * @returns {Record<string, any>}
+ */
+export function getCompProps (node, comp, isMainComp = true) {
+  const options = /** @type import('../components/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`]))
+  if (node.options.readOnly) propsLevels.push(/** @type Record<string, any> | undefined */(options[`${comp}PropsReadOnly`]))
+  if (isMainComp) propsLevels.push(node.layout.props)
+  const fullProps = mergePropsLevels(propsLevels)
+  if (isMainComp) fullProps.modelValue = node.data
+  return fullProps
+}

package/src/utils/slots.js

@@ -0,0 +1,19 @@
+import { h } from 'vue'
+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
+ * @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)) {
+    slots[key] = () => h(NodeSlot, { layoutSlot, node, statefulLayout })
+  }
+  return slots
+}

package/types/compat/v2.d.ts

@@ -0,0 +1,10 @@
+/**
+ *
+ * @param {object} _schema
+ * @param {import("ajv").default} [_ajv]
+ * @param {string} lang
+ * @returns
+ */
+export function v2compat(_schema: object, _ajv?: ajvModule.default | undefined, lang?: string): ajvModule.SchemaObject;
+import ajvModule from 'ajv';
+//# sourceMappingURL=v2.d.ts.map

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

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

package/types/compile/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @param {object} schema
+ * @param {string} baseImport
+ * @returns {string}
+ */
+export function compile(schema: object, baseImport?: string): string;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/compile/index.js"],"names":[],"mappings":"AAYA;;;;GAIG;AACH,gCAJW,MAAM,eACN,MAAM,GACJ,MAAM,CAgBlB"}

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

@@ -0,0 +1,47 @@
+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('@json-layout/core').StatefulLayout> */
+        type: import('vue').PropType<import('@json-layout/core').StatefulLayout>;
+        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").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, 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('@json-layout/core').StatefulLayout> */
+        type: import('vue').PropType<import('@json-layout/core').StatefulLayout>;
+        required: true;
+    };
+    tag: {
+        /** @type import('vue').PropType<string> */
+        type: import('vue').PropType<string>;
+        default: null;
+    };
+}>>, {
+    tag: string;
+}, {}>;
+export default _default;
+//# sourceMappingURL=node-slot.vue.d.ts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,8 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    node: import("../types.js").VjsfNode;
+    $props: {
+        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;
+//# sourceMappingURL=section-header.vue.d.ts.map

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

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

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

@@ -0,0 +1,20 @@
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {
+    modelValue: import("../types.js").VjsfNode;
+    statefulLayout: import("@json-layout/core").StatefulLayout;
+    formattedValue: string | null;
+    $props: {
+        readonly modelValue?: import("../types.js").VjsfNode | undefined;
+        readonly statefulLayout?: import("@json-layout/core").StatefulLayout | undefined;
+        readonly formattedValue?: string | null | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>, {
+    "prepend-inner"?(_: {}): any;
+    default?(_: {
+        close: () => boolean;
+    }): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & (new () => {
+    $slots: S;
+});
+//# sourceMappingURL=text-field-menu.vue.d.ts.map

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

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

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

@@ -0,0 +1,10 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    modelValue: import("./types.js").VjsfNode;
+    statefulLayout: import("@json-layout/core").StatefulLayout;
+    $props: {
+        readonly modelValue?: import("./types.js").VjsfNode | undefined;
+        readonly statefulLayout?: import("@json-layout/core").StatefulLayout | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;
+//# sourceMappingURL=node.vue.d.ts.map

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

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

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

@@ -0,0 +1,10 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    modelValue: import("../types.js").VjsfCheckboxNode;
+    statefulLayout: import("@json-layout/core").StatefulLayout;
+    $props: {
+        readonly modelValue?: import("../types.js").VjsfCheckboxNode | undefined;
+        readonly statefulLayout?: import("@json-layout/core").StatefulLayout | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;
+//# sourceMappingURL=checkbox.vue.d.ts.map

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

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

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

@@ -0,0 +1,10 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    modelValue: import("../types.js").VjsfColorPickerNode;
+    statefulLayout: import("@json-layout/core").StatefulLayout;
+    $props: {
+        readonly modelValue?: import("../types.js").VjsfColorPickerNode | undefined;
+        readonly statefulLayout?: import("@json-layout/core").StatefulLayout | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;
+//# sourceMappingURL=color-picker.vue.d.ts.map

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

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

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

@@ -0,0 +1,10 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    modelValue: import("../types.js").VjsfDatePickerNode;
+    statefulLayout: import("@json-layout/core").StatefulLayout;
+    $props: {
+        readonly modelValue?: import("../types.js").VjsfDatePickerNode | undefined;
+        readonly statefulLayout?: import("@json-layout/core").StatefulLayout | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;
+//# sourceMappingURL=date-picker.vue.d.ts.map

package/types/components/nodes/date-picker.vue.d.ts.map

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

package/types/components/nodes/date-time-picker.vue.d.ts

@@ -0,0 +1,10 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    modelValue: import("../types.js").VjsfDateTimePickerNode;
+    statefulLayout: import("@json-layout/core").StatefulLayout;
+    $props: {
+        readonly modelValue?: import("../types.js").VjsfDateTimePickerNode | undefined;
+        readonly statefulLayout?: import("@json-layout/core").StatefulLayout | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;
+//# sourceMappingURL=date-time-picker.vue.d.ts.map

package/types/components/nodes/date-time-picker.vue.d.ts.map

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

package/types/components/nodes/expansion-panels.vue.d.ts

@@ -0,0 +1,10 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    modelValue: import("../types.js").VjsfExpansionPanelsNode;
+    statefulLayout: import("@json-layout/core").StatefulLayout;
+    $props: {
+        readonly modelValue?: import("../types.js").VjsfExpansionPanelsNode | undefined;
+        readonly statefulLayout?: import("@json-layout/core").StatefulLayout | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;
+//# sourceMappingURL=expansion-panels.vue.d.ts.map