@evanschleret/formforgeclient 1.2.4 → 2.0.0

package/dist/runtime/renderers/default/FormForgeRenderer.vue.d.ts

@@ -4,7 +4,6 @@ interface FormForgeValidationError {
     message: string;
 }
 type FormForgeValidationHandler = (state: FormForgeSubmissionPayload) => FormForgeValidationError[] | Promise<FormForgeValidationError[]>;
-type FormForgeProgressVariant = 'stepper' | 'progress';
 type FormForgeValidateEvent = 'input' | 'change' | 'blur';
 interface FormForgeExposedError {
     id?: string;
@@ -34,10 +33,10 @@ interface Props {
     uploadMode?: FormForgeUploadMode;
     clearAfterSubmit?: boolean;
     showProgress?: boolean;
-    progressVariant?: FormForgeProgressVariant;
     showAlertOnError?: boolean;
     validateOn?: FormForgeValidateEvent[];
     validateOnBlur?: boolean;
+    previewPageKey?: string | null;
 }
 type FormForgeValidateOptions = {
     name?: string | string[];
@@ -73,10 +72,10 @@ declare const __VLS_export: import("vue").DefineComponent<Props, {
     datetimeMode: FormForgeDatetimeMode;
     endpoint: string;
     clientConfig: FormForgeClientConfig;
-    formKey: string;
     modelValue: FormForgeSubmissionPayload | {
         value: FormForgeSubmissionPayload;
     };
+    formKey: string;
     zodSchema: object | {
         value: object | undefined;
     };
@@ -87,10 +86,10 @@ declare const __VLS_export: import("vue").DefineComponent<Props, {
     simulation: boolean;
     clearAfterSubmit: boolean;
     showProgress: boolean;
-    progressVariant: FormForgeProgressVariant;
     showAlertOnError: boolean;
     validateOn: FormForgeValidateEvent[];
     validateOnBlur: boolean;
+    previewPageKey: string | null;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/renderers/default/FormForgeRendererField.d.vue.ts

@@ -0,0 +1,22 @@
+import type { DateValue, Time } from '@internationalized/date';
+import type { FormForgeAddressFieldSchema, FormForgeFieldSchema } from '../../types/index.js';
+type FormForgeDynamicValue = string | number | boolean | null | undefined | DateValue | Time | File | File[] | Record<string, unknown> | Array<unknown>;
+interface Props {
+    field: FormForgeFieldSchema;
+    modelValue: unknown;
+    componentProps: Record<string, unknown>;
+    fieldUi: Record<string, unknown>;
+    addressFields: FormForgeAddressFieldSchema[];
+    required: boolean;
+    disabled: boolean;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: FormForgeDynamicValue) => any;
+    blur: () => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: FormForgeDynamicValue) => any) | undefined;
+    onBlur?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=FormForgeRendererField.vue.d.ts.map

package/dist/runtime/renderers/default/FormForgeRendererField.vue

@@ -0,0 +1,237 @@
+<script setup>
+import { computed } from "#imports";
+import { sanitizeFormForgeInlineRichText, sanitizeFormForgeRichText } from "../../utils/rich-text";
+import { resolveTemporalMode } from "../../utils/temporal";
+const props = defineProps({
+  field: { type: Object, required: true },
+  modelValue: { type: null, required: true },
+  componentProps: { type: Object, required: true },
+  fieldUi: { type: Object, required: true },
+  addressFields: { type: Array, required: true },
+  required: { type: Boolean, required: true },
+  disabled: { type: Boolean, required: true }
+});
+const emit = defineEmits(["update:modelValue", "blur"]);
+const temporalMode = computed(() => resolveTemporalMode(props.field));
+const temporalHourCycle = computed(() => props.field.hour_cycle === 12 ? 12 : 24);
+const temporalInputProps = computed(() => {
+  const { placeholder, ...rest } = props.componentProps;
+  void placeholder;
+  return rest;
+});
+function fullWidthUi(ui) {
+  if (ui === null || typeof ui !== "object" || Array.isArray(ui)) {
+    return {
+      base: "w-full",
+      root: "w-full"
+    };
+  }
+  return {
+    ...ui,
+    base: "w-full"
+  };
+}
+function choiceDisplayValue() {
+  if (props.field.display === "list" || props.field.display === "menu") {
+    return props.field.display;
+  }
+  if (props.field.type === "radio" || props.field.type === "checkbox_group") {
+    return "list";
+  }
+  return "menu";
+}
+function addressFieldValue(key) {
+  if (typeof props.modelValue !== "object" || props.modelValue === null || Array.isArray(props.modelValue)) {
+    return "";
+  }
+  const candidate = props.modelValue[key];
+  return typeof candidate === "string" ? candidate : "";
+}
+function updateAddressFieldValue(key, value) {
+  const currentValue = typeof props.modelValue === "object" && props.modelValue !== null && !Array.isArray(props.modelValue) ? { ...props.modelValue } : {};
+  currentValue[key] = value;
+  emit("update:modelValue", currentValue);
+}
+function isTemporalDateInput() {
+  return props.field.type === "temporal" ? temporalMode.value === "date" : props.field.type === "date";
+}
+function isTemporalTimeInput() {
+  return props.field.type === "temporal" ? temporalMode.value === "time" : props.field.type === "time";
+}
+function labelHtml() {
+  if (typeof props.field.label !== "string" || props.field.label.trim() === "") {
+    return "";
+  }
+  return sanitizeFormForgeInlineRichText(props.field.label);
+}
+function helpTextHtml() {
+  if (typeof props.field.help_text !== "string" || props.field.help_text.trim() === "") {
+    return "";
+  }
+  return sanitizeFormForgeRichText(props.field.help_text);
+}
+</script>
+
+<template>
+  <div @focusout="emit('blur')">
+    <UFormField
+      :name="field.name"
+      :label="field.label"
+      :required="field.type === 'address' ? false : required"
+      :ui="fieldUi"
+    >
+      <template #label>
+        <span v-html="labelHtml()" />
+      </template>
+
+      <UInput
+        v-if="field.type === 'text' || field.type === 'email'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <UTextarea
+        v-else-if="field.type === 'textarea'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <UInputNumber
+        v-else-if="field.type === 'number'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <USelect
+        v-else-if="field.type === 'select' && choiceDisplayValue() === 'menu'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <URadioGroup
+        v-else-if="field.type === 'select' && choiceDisplayValue() === 'list'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <USelectMenu
+        v-else-if="field.type === 'select_menu'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <URadioGroup
+        v-else-if="field.type === 'radio' && choiceDisplayValue() === 'list'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <USelect
+        v-else-if="field.type === 'radio' && choiceDisplayValue() === 'menu'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <UCheckbox
+        v-else-if="field.type === 'checkbox' || field.type === 'consent'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <UCheckboxGroup
+        v-else-if="field.type === 'checkbox_group' && choiceDisplayValue() === 'list'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <USelectMenu
+        v-else-if="field.type === 'checkbox_group' && choiceDisplayValue() === 'menu'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <div
+        v-else-if="field.type === 'address'"
+        class="grid gap-4 w-full"
+      >
+        <div class="grid gap-3">
+          <UFormField
+            v-for="addressField in addressFields"
+            v-show="addressField.visible"
+            :key="addressField.key"
+            :label="addressField.label"
+            :required="addressField.required"
+          >
+            <UInput
+              :model-value="addressFieldValue(addressField.key)"
+              :disabled="disabled"
+              :placeholder="addressField.label"
+              :ui="fullWidthUi(componentProps.ui)"
+              @update:model-value="(nextValue) => updateAddressFieldValue(addressField.key, typeof nextValue === 'string' ? nextValue : '')"
+            />
+          </UFormField>
+        </div>
+      </div>
+
+      <USwitch
+        v-else-if="field.type === 'switch'"
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <UInputDate
+        v-else-if="isTemporalDateInput()"
+        :model-value="modelValue"
+        v-bind="temporalInputProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <UInputTime
+        v-else-if="isTemporalTimeInput()"
+        :model-value="modelValue"
+        :hour-cycle="temporalHourCycle"
+        v-bind="temporalInputProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <UFileUpload
+        v-else
+        :model-value="modelValue"
+        v-bind="componentProps"
+        :ui="fullWidthUi(componentProps.ui)"
+        @update:model-value="(nextValue) => emit('update:modelValue', nextValue)"
+      />
+
+      <div
+        v-if="typeof field.help_text === 'string' && field.help_text.trim() !== ''"
+        class="formforge-rich-text mt-2 text-sm text-muted"
+        v-html="helpTextHtml()"
+      />
+    </UFormField>
+  </div>
+</template>

package/dist/runtime/renderers/default/FormForgeRendererField.vue.d.ts

@@ -0,0 +1,22 @@
+import type { DateValue, Time } from '@internationalized/date';
+import type { FormForgeAddressFieldSchema, FormForgeFieldSchema } from '../../types/index.js';
+type FormForgeDynamicValue = string | number | boolean | null | undefined | DateValue | Time | File | File[] | Record<string, unknown> | Array<unknown>;
+interface Props {
+    field: FormForgeFieldSchema;
+    modelValue: unknown;
+    componentProps: Record<string, unknown>;
+    fieldUi: Record<string, unknown>;
+    addressFields: FormForgeAddressFieldSchema[];
+    required: boolean;
+    disabled: boolean;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: FormForgeDynamicValue) => any;
+    blur: () => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: FormForgeDynamicValue) => any) | undefined;
+    onBlur?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=FormForgeRendererField.vue.d.ts.map

package/dist/runtime/renderers/default/FormForgeRendererPage.d.vue.ts

@@ -0,0 +1,18 @@
+import type { FormForgePageSchema } from '../../types/index.js';
+interface Props {
+    page: FormForgePageSchema;
+}
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=FormForgeRendererPage.vue.d.ts.map

package/dist/runtime/renderers/default/FormForgeRendererPage.vue

@@ -0,0 +1,31 @@
+<script setup>
+import { sanitizeFormForgeRichText } from "../../utils/rich-text";
+defineProps({
+  page: { type: Object, required: true }
+});
+</script>
+
+<template>
+  <div class="space-y-4">
+    <div
+      v-if="page.title !== '' || typeof page.description === 'string' && page.description !== ''"
+      class="space-y-1"
+    >
+      <h3
+        v-if="page.title !== ''"
+        class="text-base font-semibold text-default"
+      >
+        {{ page.title }}
+      </h3>
+      <div
+        v-if="typeof page.description === 'string' && page.description !== ''"
+        class="formforge-rich-text text-sm text-muted"
+        v-html="sanitizeFormForgeRichText(page.description)"
+      />
+    </div>
+
+    <div class="space-y-4">
+      <slot />
+    </div>
+  </div>
+</template>

package/dist/runtime/renderers/default/FormForgeRendererPage.vue.d.ts

@@ -0,0 +1,18 @@
+import type { FormForgePageSchema } from '../../types/index.js';
+interface Props {
+    page: FormForgePageSchema;
+}
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=FormForgeRendererPage.vue.d.ts.map

package/dist/runtime/renderers/default/FormForgeResponse.vue

@@ -3,6 +3,7 @@ import { computed, ref, useRoute, watch } from "#imports";
 import { useFormForgeGetForm } from "../../composables/useFormForgeGetForm";
 import { useFormForgeI18n } from "../../composables/useFormForgeI18n";
 import { useFormForgeResponses } from "../../composables/useFormForgeResponses";
+import { sanitizeFormForgeInlineRichText } from "../../utils/rich-text";
 const props = defineProps({
   responseUuid: { type: String, required: true },
   formKey: { type: String, required: false, default: void 0 },
@@ -351,7 +352,7 @@ function createPagesFromSchema(schemaValue) {
     description: page.description,
     items: page.fields.map((field, fieldIndex) => ({
       id: field.fieldKey,
-      question: typeof field.label === "string" && field.label.trim() !== "" ? field.label : t("response.question.fallback", { index: fieldIndex + 1 }),
+      question: typeof field.label === "string" && field.label.trim() !== "" ? sanitizeFormForgeInlineRichText(field.label) : t("response.question.fallback", { index: fieldIndex + 1 }),
       answer: makeAnswer(
         mapFieldAnswerValue(field, payload.value[field.name]),
         field.type === "file"
@@ -526,7 +527,7 @@ watch(
               class="grid grid-cols-1 gap-2 md:grid-cols-[minmax(0,1fr)_minmax(0,2fr)] md:gap-6"
             >
               <p class="whitespace-pre-wrap text-sm font-medium text-default">
-                {{ item.question }}
+                <span v-html="item.question" />
               </p>
 
               <div
@@ -623,7 +624,7 @@ watch(
               class="space-y-1"
             >
               <p class="whitespace-pre-wrap text-sm font-medium text-default">
-                {{ item.question }}
+                <span v-html="item.question" />
               </p>
 
               <p

package/dist/runtime/renderers/default/builder/FormForgeBuilderAddressFieldsCard.d.vue.ts

@@ -0,0 +1,11 @@
+import type { FormForgeFieldSchema } from '../../../types/index.js';
+interface Props {
+    field: FormForgeFieldSchema;
+    readonly?: boolean;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    readonly: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=FormForgeBuilderAddressFieldsCard.vue.d.ts.map

package/dist/runtime/renderers/default/builder/FormForgeBuilderAddressFieldsCard.vue

@@ -0,0 +1,118 @@
+<script setup>
+import { toRef } from "#imports";
+import { useFormForgeI18n } from "../../../composables/useFormForgeI18n";
+import { defaultAddressFields } from "./builderFieldHelpers";
+const props = defineProps({
+  field: { type: Object, required: true },
+  readonly: { type: Boolean, required: false, default: false }
+});
+const field = toRef(props, "field");
+const { t, locale } = useFormForgeI18n();
+const addressFieldsGridStyle = {
+  gridTemplateColumns: "minmax(0, 1.1fr) 4rem 4rem minmax(0, 1.6fr)"
+};
+function addressFieldLabelKey(key) {
+  return `builder.address.${key}`;
+}
+function ensureAddressFields() {
+  if (!Array.isArray(field.value.address_fields) || field.value.address_fields.length === 0) {
+    field.value.address_fields = defaultAddressFields(locale.value);
+  }
+  return field.value.address_fields;
+}
+function addressFields() {
+  if (!Array.isArray(field.value.address_fields) || field.value.address_fields.length === 0) {
+    return defaultAddressFields(locale.value);
+  }
+  return field.value.address_fields;
+}
+function setAddressFieldVisible(index, visible) {
+  const addressFields2 = ensureAddressFields();
+  const candidate = addressFields2[index];
+  if (candidate === void 0) {
+    return;
+  }
+  addressFields2[index] = {
+    ...candidate,
+    visible
+  };
+}
+function setAddressFieldRequired(index, required) {
+  const addressFields2 = ensureAddressFields();
+  const candidate = addressFields2[index];
+  if (candidate === void 0) {
+    return;
+  }
+  addressFields2[index] = {
+    ...candidate,
+    required
+  };
+}
+function setAddressFieldLabel(index, label) {
+  const addressFields2 = ensureAddressFields();
+  const candidate = addressFields2[index];
+  if (candidate === void 0) {
+    return;
+  }
+  addressFields2[index] = {
+    ...candidate,
+    label
+  };
+}
+</script>
+
+<template>
+  <UCard :ui="{ body: 'grid gap-4' }">
+    <div class="grid gap-4">
+      <div
+        class="hidden lg:grid lg:items-center lg:gap-x-6"
+        :style="addressFieldsGridStyle"
+      >
+        <span class="min-w-0 text-sm font-medium text-default">{{ t("builder.addressFields") }}</span>
+        <span class="text-sm font-medium text-default">
+          {{ t("builder.address.show") }}
+        </span>
+        <span class="text-sm font-medium text-default">
+          {{ t("builder.address.required") }}
+        </span>
+        <span class="min-w-0 text-sm font-medium text-default">
+          {{ t("builder.address.label") }}
+        </span>
+      </div>
+
+      <div class="grid gap-3">
+        <div
+          v-for="(addressField, addressIndex) in addressFields()"
+          :key="addressField.key"
+          class="grid gap-2 lg:items-center lg:gap-x-6"
+          :style="addressFieldsGridStyle"
+        >
+          <span class="min-w-0 text-sm text-default">
+            {{ t(addressFieldLabelKey(addressField.key)) }}
+          </span>
+          <USwitch
+            :model-value="addressField.visible"
+            :disabled="readonly"
+            class="justify-self-start"
+            @update:model-value="(value) => setAddressFieldVisible(addressIndex, value)"
+          />
+          <USwitch
+            :model-value="addressField.required"
+            :disabled="readonly || !addressField.visible"
+            class="justify-self-start"
+            @update:model-value="(value) => setAddressFieldRequired(addressIndex, value)"
+          />
+          <div class="min-w-0">
+            <UInput
+              :model-value="addressField.label"
+              :disabled="readonly"
+              :placeholder="t(addressFieldLabelKey(addressField.key))"
+              class="w-full"
+              @update:model-value="(value) => setAddressFieldLabel(addressIndex, value)"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </UCard>
+</template>

package/dist/runtime/renderers/default/builder/FormForgeBuilderAddressFieldsCard.vue.d.ts

@@ -0,0 +1,11 @@
+import type { FormForgeFieldSchema } from '../../../types/index.js';
+interface Props {
+    field: FormForgeFieldSchema;
+    readonly?: boolean;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    readonly: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=FormForgeBuilderAddressFieldsCard.vue.d.ts.map

package/dist/runtime/renderers/default/builder/FormForgeBuilderBlockCard.d.vue.ts

@@ -0,0 +1,46 @@
+import type { FormForgeFieldType, FormForgePageSchema } from '../../../types/index.js';
+interface QuestionTypeItem {
+    label: string;
+    value: FormForgeFieldType;
+    icon?: string;
+}
+interface Props {
+    page: FormForgePageSchema;
+    pages: FormForgePageSchema[];
+    pageIndex: number;
+    totalPages: number;
+    selectedFieldKey?: string | null;
+    readonly?: boolean;
+    fieldTypeItems: QuestionTypeItem[];
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "select-field": (pageKey: string, fieldKey: string) => any;
+    "move-page": (pageKey: string, direction: 1 | -1) => any;
+    "duplicate-page": (pageKey: string) => any;
+    "remove-page": (pageKey: string) => any;
+    "add-question": (pageKey: string, type: FormForgeFieldType) => any;
+    "move-field": (pageKey: string, fieldKey: string, direction: 1 | -1) => any;
+    "duplicate-field": (pageKey: string, fieldKey: string) => any;
+    "remove-field": (pageKey: string, fieldKey: string) => any;
+    "change-field-type": (pageKey: string, fieldKey: string, type: FormForgeFieldType) => any;
+    "add-field-below": (pageKey: string, fieldKey: string, type: FormForgeFieldType) => any;
+    "move-field-to-block": (pageKey: string, fieldKey: string, targetPageKey: string) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onSelect-field"?: ((pageKey: string, fieldKey: string) => any) | undefined;
+    "onMove-page"?: ((pageKey: string, direction: 1 | -1) => any) | undefined;
+    "onDuplicate-page"?: ((pageKey: string) => any) | undefined;
+    "onRemove-page"?: ((pageKey: string) => any) | undefined;
+    "onAdd-question"?: ((pageKey: string, type: FormForgeFieldType) => any) | undefined;
+    "onMove-field"?: ((pageKey: string, fieldKey: string, direction: 1 | -1) => any) | undefined;
+    "onDuplicate-field"?: ((pageKey: string, fieldKey: string) => any) | undefined;
+    "onRemove-field"?: ((pageKey: string, fieldKey: string) => any) | undefined;
+    "onChange-field-type"?: ((pageKey: string, fieldKey: string, type: FormForgeFieldType) => any) | undefined;
+    "onAdd-field-below"?: ((pageKey: string, fieldKey: string, type: FormForgeFieldType) => any) | undefined;
+    "onMove-field-to-block"?: ((pageKey: string, fieldKey: string, targetPageKey: string) => any) | undefined;
+}>, {
+    readonly: boolean;
+    selectedFieldKey: string | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=FormForgeBuilderBlockCard.vue.d.ts.map