form-page-builder 1.0.0 → 2.1.0

package/dist/index.d.cts

@@ -345,6 +345,8 @@ interface LanguageOption {
     label: string;
 }
 
+type ContentBlockType = "paragraph" | "image" | "button";
+type InputFieldType = "input" | "textarea" | "select" | "radio" | "checkboxGroup" | "checkbox" | "toggle";
 interface LocalizedString {
     en: string;
     [lang: string]: string | undefined;
@@ -563,17 +565,54 @@ interface FormBuilderHandle {
     /** Convenience for `JSON.stringify(getDocument())`. */
     exportJson(): string;
 }
+interface FormBuilderFeatures {
+    /** Editable form title input in the Toolbar. Default true. */
+    naming?: boolean;
+    /** Templates library (browse/open/delete) + "Save" button. Default true. */
+    templates?: boolean;
+    /** "New Form" reset button. Default true. */
+    newForm?: boolean;
+    /** Autosave the draft to `storage`. The initial draft load always happens; this only gates the write path. Default true. */
+    autosave?: boolean;
+    /** "View JSON" button + modal. Default true. */
+    jsonView?: boolean;
+    /** Build/Preview mode tabs. When false, the builder stays in Build mode and the tabs are hidden. Default true. */
+    previewMode?: boolean;
+    /** Language switcher in the Toolbar. Default true. */
+    languageSwitcher?: boolean;
+    /** Global "Design" tab (colors/spacing) in the sidebar. Replaces the old `themeEditable` prop. Default false. */
+    design?: boolean;
+    /** Per-field styling controls: paragraph heading/font/color, button color. Independent of `design`. Default true. */
+    blockStyling?: boolean;
+    /** Which content blocks (paragraph/image/button) can be added from the palette. `true` = all, `false` = none, or an allowlist array. Default true. */
+    contentBlocks?: boolean | ContentBlockType[];
+    /** Which form field types can be added from the palette. `true` = all, `false` = none, or an allowlist array. Default true. */
+    fieldTypes?: boolean | InputFieldType[];
+    /** Add/duplicate/move/delete section controls + section background picker. Default true. */
+    sections?: boolean;
+    /** Drag-to-reorder fields within a section. Default true. */
+    dragReorder?: boolean;
+    /** Laptop/Tablet/Mobile width switcher above the Preview canvas. Default true. */
+    deviceToggle?: boolean;
+    /** Caps the number of input-type fields (not content blocks) addable across the whole document. Default undefined (unlimited). */
+    maxFields?: number;
+}
 interface FormBuilderProps {
     theme?: Partial<Theme>;
     language?: string;
     languages?: LanguageOption[];
     strings?: Record<string, Partial<StringsShape>>;
     chrome?: Record<string, Partial<ChromeShape>>;
-    themeEditable?: boolean;
+    /** Independently toggle UI surfaces on/off — full-featured by default. See `FormBuilderFeatures`. */
+    features?: FormBuilderFeatures;
     storage?: StorageAdapter;
     onSubmit?: (payload: SubmitPayload) => void;
     /** Seeds the builder with this document on mount instead of the autosaved draft — e.g. a template fetched from your own backend. */
     initialDocument?: FormDocument;
+    /** Which mode the widget mounts into. Default "build". Pair with `features.previewMode: false` to lock a consumer to just one mode with no tabs. */
+    initialMode?: "build" | "preview";
+    /** Fires on mount and on every Build/Preview toggle — lets a host mirror the current mode without its own tab UI. */
+    onModeChange?: (mode: "build" | "preview") => void;
 }
 
 declare const FormBuilder: react.ForwardRefExoticComponent<FormBuilderProps & react.RefAttributes<FormBuilderHandle>>;
@@ -592,4 +631,9 @@ declare const FormBuilder: react.ForwardRefExoticComponent<FormBuilderProps & re
  */
 declare const localStorageAdapter: StorageAdapter;
 
-export { type CheckboxField, type CheckboxGroupField, type ChromeShape, type DocumentFields, type FieldPatch, type FieldType, FormBuilder, type FormBuilderHandle, type FormBuilderProps, type FormDocument, type FormField, type ImageField, type InputField, type LanguageOption, type LocalizedString, type Option, type ParagraphField, type RadioField, type SavedFormMeta, type Section, type SelectField, type StorageAdapter, type StringsShape, type SubmitPayload, type SubmitStyle, type TextareaField, type Theme, type ThemeLayout, type ThemeOverrides, type ToggleField, FormBuilder as default, localStorageAdapter };
+declare const DEFAULT_THEME: Theme;
+
+/** A ready-made dark palette — pass as the `theme` prop for a dark-mode `<FormBuilder />`. */
+declare const DARK_THEME: Theme;
+
+export { type CheckboxField, type CheckboxGroupField, type ChromeShape, type ContentBlockType, DARK_THEME, DEFAULT_THEME, type DocumentFields, type FieldPatch, type FieldType, FormBuilder, type FormBuilderFeatures, type FormBuilderHandle, type FormBuilderProps, type FormDocument, type FormField, type ImageField, type InputField, type InputFieldType, type LanguageOption, type LocalizedString, type Option, type ParagraphField, type RadioField, type SavedFormMeta, type Section, type SelectField, type StorageAdapter, type StringsShape, type SubmitPayload, type SubmitStyle, type TextareaField, type Theme, type ThemeLayout, type ThemeOverrides, type ToggleField, FormBuilder as default, localStorageAdapter };

package/dist/index.d.ts

@@ -345,6 +345,8 @@ interface LanguageOption {
     label: string;
 }
 
+type ContentBlockType = "paragraph" | "image" | "button";
+type InputFieldType = "input" | "textarea" | "select" | "radio" | "checkboxGroup" | "checkbox" | "toggle";
 interface LocalizedString {
     en: string;
     [lang: string]: string | undefined;
@@ -563,17 +565,54 @@ interface FormBuilderHandle {
     /** Convenience for `JSON.stringify(getDocument())`. */
     exportJson(): string;
 }
+interface FormBuilderFeatures {
+    /** Editable form title input in the Toolbar. Default true. */
+    naming?: boolean;
+    /** Templates library (browse/open/delete) + "Save" button. Default true. */
+    templates?: boolean;
+    /** "New Form" reset button. Default true. */
+    newForm?: boolean;
+    /** Autosave the draft to `storage`. The initial draft load always happens; this only gates the write path. Default true. */
+    autosave?: boolean;
+    /** "View JSON" button + modal. Default true. */
+    jsonView?: boolean;
+    /** Build/Preview mode tabs. When false, the builder stays in Build mode and the tabs are hidden. Default true. */
+    previewMode?: boolean;
+    /** Language switcher in the Toolbar. Default true. */
+    languageSwitcher?: boolean;
+    /** Global "Design" tab (colors/spacing) in the sidebar. Replaces the old `themeEditable` prop. Default false. */
+    design?: boolean;
+    /** Per-field styling controls: paragraph heading/font/color, button color. Independent of `design`. Default true. */
+    blockStyling?: boolean;
+    /** Which content blocks (paragraph/image/button) can be added from the palette. `true` = all, `false` = none, or an allowlist array. Default true. */
+    contentBlocks?: boolean | ContentBlockType[];
+    /** Which form field types can be added from the palette. `true` = all, `false` = none, or an allowlist array. Default true. */
+    fieldTypes?: boolean | InputFieldType[];
+    /** Add/duplicate/move/delete section controls + section background picker. Default true. */
+    sections?: boolean;
+    /** Drag-to-reorder fields within a section. Default true. */
+    dragReorder?: boolean;
+    /** Laptop/Tablet/Mobile width switcher above the Preview canvas. Default true. */
+    deviceToggle?: boolean;
+    /** Caps the number of input-type fields (not content blocks) addable across the whole document. Default undefined (unlimited). */
+    maxFields?: number;
+}
 interface FormBuilderProps {
     theme?: Partial<Theme>;
     language?: string;
     languages?: LanguageOption[];
     strings?: Record<string, Partial<StringsShape>>;
     chrome?: Record<string, Partial<ChromeShape>>;
-    themeEditable?: boolean;
+    /** Independently toggle UI surfaces on/off — full-featured by default. See `FormBuilderFeatures`. */
+    features?: FormBuilderFeatures;
     storage?: StorageAdapter;
     onSubmit?: (payload: SubmitPayload) => void;
     /** Seeds the builder with this document on mount instead of the autosaved draft — e.g. a template fetched from your own backend. */
     initialDocument?: FormDocument;
+    /** Which mode the widget mounts into. Default "build". Pair with `features.previewMode: false` to lock a consumer to just one mode with no tabs. */
+    initialMode?: "build" | "preview";
+    /** Fires on mount and on every Build/Preview toggle — lets a host mirror the current mode without its own tab UI. */
+    onModeChange?: (mode: "build" | "preview") => void;
 }
 
 declare const FormBuilder: react.ForwardRefExoticComponent<FormBuilderProps & react.RefAttributes<FormBuilderHandle>>;
@@ -592,4 +631,9 @@ declare const FormBuilder: react.ForwardRefExoticComponent<FormBuilderProps & re
  */
 declare const localStorageAdapter: StorageAdapter;
 
-export { type CheckboxField, type CheckboxGroupField, type ChromeShape, type DocumentFields, type FieldPatch, type FieldType, FormBuilder, type FormBuilderHandle, type FormBuilderProps, type FormDocument, type FormField, type ImageField, type InputField, type LanguageOption, type LocalizedString, type Option, type ParagraphField, type RadioField, type SavedFormMeta, type Section, type SelectField, type StorageAdapter, type StringsShape, type SubmitPayload, type SubmitStyle, type TextareaField, type Theme, type ThemeLayout, type ThemeOverrides, type ToggleField, FormBuilder as default, localStorageAdapter };
+declare const DEFAULT_THEME: Theme;
+
+/** A ready-made dark palette — pass as the `theme` prop for a dark-mode `<FormBuilder />`. */
+declare const DARK_THEME: Theme;
+
+export { type CheckboxField, type CheckboxGroupField, type ChromeShape, type ContentBlockType, DARK_THEME, DEFAULT_THEME, type DocumentFields, type FieldPatch, type FieldType, FormBuilder, type FormBuilderFeatures, type FormBuilderHandle, type FormBuilderProps, type FormDocument, type FormField, type ImageField, type InputField, type InputFieldType, type LanguageOption, type LocalizedString, type Option, type ParagraphField, type RadioField, type SavedFormMeta, type Section, type SelectField, type StorageAdapter, type StringsShape, type SubmitPayload, type SubmitStyle, type TextareaField, type Theme, type ThemeLayout, type ThemeOverrides, type ToggleField, FormBuilder as default, localStorageAdapter };