form-page-builder 1.0.0 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +84 -2
- package/dist/index.cjs +344 -178
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +38 -2
- package/dist/index.d.ts +38 -2
- package/dist/index.js +364 -200
- package/dist/index.js.map +1 -1
- package/package.json +9 -2
package/dist/index.d.cts
CHANGED
|
@@ -345,6 +345,8 @@ interface LanguageOption {
|
|
|
345
345
|
label: string;
|
|
346
346
|
}
|
|
347
347
|
|
|
348
|
+
type ContentBlockType = "paragraph" | "image" | "button";
|
|
349
|
+
type InputFieldType = "input" | "textarea" | "select" | "radio" | "checkboxGroup" | "checkbox" | "toggle";
|
|
348
350
|
interface LocalizedString {
|
|
349
351
|
en: string;
|
|
350
352
|
[lang: string]: string | undefined;
|
|
@@ -563,13 +565,42 @@ interface FormBuilderHandle {
|
|
|
563
565
|
/** Convenience for `JSON.stringify(getDocument())`. */
|
|
564
566
|
exportJson(): string;
|
|
565
567
|
}
|
|
568
|
+
interface FormBuilderFeatures {
|
|
569
|
+
/** Editable form title input in the Toolbar. Default true. */
|
|
570
|
+
naming?: boolean;
|
|
571
|
+
/** Templates library (browse/open/delete) + "Save" button. Default true. */
|
|
572
|
+
templates?: boolean;
|
|
573
|
+
/** "New Form" reset button. Default true. */
|
|
574
|
+
newForm?: boolean;
|
|
575
|
+
/** Autosave the draft to `storage`. The initial draft load always happens; this only gates the write path. Default true. */
|
|
576
|
+
autosave?: boolean;
|
|
577
|
+
/** "View JSON" button + modal. Default true. */
|
|
578
|
+
jsonView?: boolean;
|
|
579
|
+
/** Build/Preview mode tabs. When false, the builder stays in Build mode and the tabs are hidden. Default true. */
|
|
580
|
+
previewMode?: boolean;
|
|
581
|
+
/** Language switcher in the Toolbar. Default true. */
|
|
582
|
+
languageSwitcher?: boolean;
|
|
583
|
+
/** Global "Design" tab (colors/spacing) in the sidebar. Replaces the old `themeEditable` prop. Default false. */
|
|
584
|
+
design?: boolean;
|
|
585
|
+
/** Per-field styling controls: paragraph heading/font/color, button color. Independent of `design`. Default true. */
|
|
586
|
+
blockStyling?: boolean;
|
|
587
|
+
/** Which content blocks (paragraph/image/button) can be added from the palette. `true` = all, `false` = none, or an allowlist array. Default true. */
|
|
588
|
+
contentBlocks?: boolean | ContentBlockType[];
|
|
589
|
+
/** Which form field types can be added from the palette. `true` = all, `false` = none, or an allowlist array. Default true. */
|
|
590
|
+
fieldTypes?: boolean | InputFieldType[];
|
|
591
|
+
/** Add/duplicate/move/delete section controls + section background picker. Default true. */
|
|
592
|
+
sections?: boolean;
|
|
593
|
+
/** Drag-to-reorder fields within a section. Default true. */
|
|
594
|
+
dragReorder?: boolean;
|
|
595
|
+
}
|
|
566
596
|
interface FormBuilderProps {
|
|
567
597
|
theme?: Partial<Theme>;
|
|
568
598
|
language?: string;
|
|
569
599
|
languages?: LanguageOption[];
|
|
570
600
|
strings?: Record<string, Partial<StringsShape>>;
|
|
571
601
|
chrome?: Record<string, Partial<ChromeShape>>;
|
|
572
|
-
|
|
602
|
+
/** Independently toggle UI surfaces on/off — full-featured by default. See `FormBuilderFeatures`. */
|
|
603
|
+
features?: FormBuilderFeatures;
|
|
573
604
|
storage?: StorageAdapter;
|
|
574
605
|
onSubmit?: (payload: SubmitPayload) => void;
|
|
575
606
|
/** Seeds the builder with this document on mount instead of the autosaved draft — e.g. a template fetched from your own backend. */
|
|
@@ -592,4 +623,9 @@ declare const FormBuilder: react.ForwardRefExoticComponent<FormBuilderProps & re
|
|
|
592
623
|
*/
|
|
593
624
|
declare const localStorageAdapter: StorageAdapter;
|
|
594
625
|
|
|
595
|
-
|
|
626
|
+
declare const DEFAULT_THEME: Theme;
|
|
627
|
+
|
|
628
|
+
/** A ready-made dark palette — pass as the `theme` prop for a dark-mode `<FormBuilder />`. */
|
|
629
|
+
declare const DARK_THEME: Theme;
|
|
630
|
+
|
|
631
|
+
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
CHANGED
|
@@ -345,6 +345,8 @@ interface LanguageOption {
|
|
|
345
345
|
label: string;
|
|
346
346
|
}
|
|
347
347
|
|
|
348
|
+
type ContentBlockType = "paragraph" | "image" | "button";
|
|
349
|
+
type InputFieldType = "input" | "textarea" | "select" | "radio" | "checkboxGroup" | "checkbox" | "toggle";
|
|
348
350
|
interface LocalizedString {
|
|
349
351
|
en: string;
|
|
350
352
|
[lang: string]: string | undefined;
|
|
@@ -563,13 +565,42 @@ interface FormBuilderHandle {
|
|
|
563
565
|
/** Convenience for `JSON.stringify(getDocument())`. */
|
|
564
566
|
exportJson(): string;
|
|
565
567
|
}
|
|
568
|
+
interface FormBuilderFeatures {
|
|
569
|
+
/** Editable form title input in the Toolbar. Default true. */
|
|
570
|
+
naming?: boolean;
|
|
571
|
+
/** Templates library (browse/open/delete) + "Save" button. Default true. */
|
|
572
|
+
templates?: boolean;
|
|
573
|
+
/** "New Form" reset button. Default true. */
|
|
574
|
+
newForm?: boolean;
|
|
575
|
+
/** Autosave the draft to `storage`. The initial draft load always happens; this only gates the write path. Default true. */
|
|
576
|
+
autosave?: boolean;
|
|
577
|
+
/** "View JSON" button + modal. Default true. */
|
|
578
|
+
jsonView?: boolean;
|
|
579
|
+
/** Build/Preview mode tabs. When false, the builder stays in Build mode and the tabs are hidden. Default true. */
|
|
580
|
+
previewMode?: boolean;
|
|
581
|
+
/** Language switcher in the Toolbar. Default true. */
|
|
582
|
+
languageSwitcher?: boolean;
|
|
583
|
+
/** Global "Design" tab (colors/spacing) in the sidebar. Replaces the old `themeEditable` prop. Default false. */
|
|
584
|
+
design?: boolean;
|
|
585
|
+
/** Per-field styling controls: paragraph heading/font/color, button color. Independent of `design`. Default true. */
|
|
586
|
+
blockStyling?: boolean;
|
|
587
|
+
/** Which content blocks (paragraph/image/button) can be added from the palette. `true` = all, `false` = none, or an allowlist array. Default true. */
|
|
588
|
+
contentBlocks?: boolean | ContentBlockType[];
|
|
589
|
+
/** Which form field types can be added from the palette. `true` = all, `false` = none, or an allowlist array. Default true. */
|
|
590
|
+
fieldTypes?: boolean | InputFieldType[];
|
|
591
|
+
/** Add/duplicate/move/delete section controls + section background picker. Default true. */
|
|
592
|
+
sections?: boolean;
|
|
593
|
+
/** Drag-to-reorder fields within a section. Default true. */
|
|
594
|
+
dragReorder?: boolean;
|
|
595
|
+
}
|
|
566
596
|
interface FormBuilderProps {
|
|
567
597
|
theme?: Partial<Theme>;
|
|
568
598
|
language?: string;
|
|
569
599
|
languages?: LanguageOption[];
|
|
570
600
|
strings?: Record<string, Partial<StringsShape>>;
|
|
571
601
|
chrome?: Record<string, Partial<ChromeShape>>;
|
|
572
|
-
|
|
602
|
+
/** Independently toggle UI surfaces on/off — full-featured by default. See `FormBuilderFeatures`. */
|
|
603
|
+
features?: FormBuilderFeatures;
|
|
573
604
|
storage?: StorageAdapter;
|
|
574
605
|
onSubmit?: (payload: SubmitPayload) => void;
|
|
575
606
|
/** Seeds the builder with this document on mount instead of the autosaved draft — e.g. a template fetched from your own backend. */
|
|
@@ -592,4 +623,9 @@ declare const FormBuilder: react.ForwardRefExoticComponent<FormBuilderProps & re
|
|
|
592
623
|
*/
|
|
593
624
|
declare const localStorageAdapter: StorageAdapter;
|
|
594
625
|
|
|
595
|
-
|
|
626
|
+
declare const DEFAULT_THEME: Theme;
|
|
627
|
+
|
|
628
|
+
/** A ready-made dark palette — pass as the `theme` prop for a dark-mode `<FormBuilder />`. */
|
|
629
|
+
declare const DARK_THEME: Theme;
|
|
630
|
+
|
|
631
|
+
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 };
|