@maxischmaxi/maxforms-embed 0.0.5

package/dist/types.d.ts

@@ -0,0 +1,214 @@
+import { ReactNode } from 'react';
+import { FieldError, UseFormRegister, UseFormReturn } from 'react-hook-form';
+import { FormField, FormBlock } from '@maxischmaxi/maxforms-api-client';
+import { z } from 'zod';
+/**
+ * Form settings as a plain object.
+ * This is a simplified version that doesn't include Protobuf methods.
+ */
+export interface FormSettingsData {
+    submitButtonText: string;
+    successMessage: string;
+    redirectUrl: string;
+    notifyOnSubmission: boolean;
+    notificationEmail: string;
+}
+export type FormData = Record<string, string>;
+/**
+ * Context passed to custom field render functions.
+ * Provides all necessary data and callbacks for rendering a field.
+ */
+export interface FieldRenderContext {
+    /** The field definition from the form */
+    field: FormField;
+    /** React Hook Form register function */
+    register: UseFormRegister<FormData>;
+    /** Field error if validation failed */
+    error?: FieldError;
+    /** Current field value */
+    value: string;
+    /** Callback to update the field value */
+    onChange: (value: string) => void;
+    /** Callback triggered on blur */
+    onBlur: () => void;
+    /** Field name for form registration */
+    name: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+}
+/**
+ * Extended context for file upload fields.
+ */
+export interface FileFieldRenderContext extends FieldRenderContext {
+    /** Form ID for upload URL generation */
+    formId: string;
+    /** API key for authentication */
+    apiKey: string;
+    /** Base URL for API calls */
+    baseUrl: string;
+}
+/** Render function for text input fields */
+export type RenderInputFn = (ctx: FieldRenderContext) => ReactNode;
+/** Render function for textarea fields */
+export type RenderTextareaFn = (ctx: FieldRenderContext) => ReactNode;
+/** Render function for select/dropdown fields */
+export type RenderSelectFn = (ctx: FieldRenderContext) => ReactNode;
+/** Render function for checkbox group fields */
+export type RenderCheckboxFn = (ctx: FieldRenderContext) => ReactNode;
+/** Render function for radio group fields */
+export type RenderRadioFn = (ctx: FieldRenderContext) => ReactNode;
+/** Render function for email input fields */
+export type RenderEmailFn = (ctx: FieldRenderContext) => ReactNode;
+/** Render function for number input fields */
+export type RenderNumberFn = (ctx: FieldRenderContext) => ReactNode;
+/** Render function for date input fields */
+export type RenderDateFn = (ctx: FieldRenderContext) => ReactNode;
+/** Render function for file upload fields */
+export type RenderFileFn = (ctx: FileFieldRenderContext) => ReactNode;
+/** Render function for heading blocks */
+export type RenderHeadingFn = (block: FormBlock) => ReactNode;
+/** Render function for text/paragraph blocks */
+export type RenderTextBlockFn = (block: FormBlock) => ReactNode;
+/** Render function for divider blocks */
+export type RenderDividerFn = () => ReactNode;
+/** Render function for row/column layout blocks */
+export type RenderRowFn = (block: FormBlock, children: ReactNode[]) => ReactNode;
+/** Props for custom submit button render function */
+export interface SubmitRenderProps {
+    /** Whether the form is currently submitting */
+    isSubmitting: boolean;
+    /** The configured button text */
+    buttonText: string;
+    /** Whether the form has validation errors */
+    hasErrors: boolean;
+}
+/** Render function for submit button */
+export type RenderSubmitFn = (props: SubmitRenderProps) => ReactNode;
+/** Render function for form error display */
+export type RenderFormErrorFn = (error: string) => ReactNode;
+/** Render function for field error display */
+export type RenderFieldErrorFn = (error: FieldError) => ReactNode;
+/** Render function for loading state */
+export type RenderLoadingFn = () => ReactNode;
+/** Render function for success state */
+export type RenderSuccessFn = (message: string) => ReactNode;
+/** Render function for field wrapper/container */
+export type RenderFieldWrapperFn = (field: FormField, children: ReactNode, error?: FieldError) => ReactNode;
+/**
+ * Props for the Form component.
+ */
+export interface FormProps {
+    /** ID of the form to load */
+    formId: string;
+    /** API key for authentication */
+    apiKey: string;
+    /** Base URL for API calls (defaults to window.location.origin) */
+    baseUrl?: string;
+    /** Callback fired on successful submission */
+    onSubmit?: (data: FormData) => void;
+    /** Callback fired on submission error */
+    onError?: (error: Error) => void;
+    /** Additional CSS class for the form */
+    className?: string;
+    /** Custom renderer for text input fields */
+    renderInput?: RenderInputFn;
+    /** Custom renderer for textarea fields */
+    renderTextarea?: RenderTextareaFn;
+    /** Custom renderer for select/dropdown fields */
+    renderSelect?: RenderSelectFn;
+    /** Custom renderer for checkbox group fields */
+    renderCheckbox?: RenderCheckboxFn;
+    /** Custom renderer for radio group fields */
+    renderRadio?: RenderRadioFn;
+    /** Custom renderer for email input fields */
+    renderEmail?: RenderEmailFn;
+    /** Custom renderer for number input fields */
+    renderNumber?: RenderNumberFn;
+    /** Custom renderer for date input fields */
+    renderDate?: RenderDateFn;
+    /** Custom renderer for file upload fields */
+    renderFile?: RenderFileFn;
+    /** Custom renderer for heading blocks */
+    renderHeading?: RenderHeadingFn;
+    /** Custom renderer for text/paragraph blocks */
+    renderTextBlock?: RenderTextBlockFn;
+    /** Custom renderer for divider blocks */
+    renderDivider?: RenderDividerFn;
+    /** Custom renderer for row/column layout blocks */
+    renderRow?: RenderRowFn;
+    /** Custom renderer for submit button */
+    renderSubmit?: RenderSubmitFn;
+    /** Custom renderer for form-level errors */
+    renderFormError?: RenderFormErrorFn;
+    /** Custom renderer for field-level errors */
+    renderFieldError?: RenderFieldErrorFn;
+    /** Custom renderer for loading state */
+    renderLoading?: RenderLoadingFn;
+    /** Custom renderer for success state */
+    renderSuccess?: RenderSuccessFn;
+    /** Custom renderer for field wrapper/container */
+    renderFieldWrapper?: RenderFieldWrapperFn;
+}
+/**
+ * Options for the useMaxForm hook.
+ */
+export interface UseMaxFormOptions {
+    /** ID of the form to load */
+    formId: string;
+    /** API key for authentication */
+    apiKey: string;
+    /** Base URL for API calls (defaults to window.location.origin) */
+    baseUrl?: string;
+    /** When to trigger validation */
+    mode?: "onBlur" | "onChange" | "onSubmit" | "all";
+}
+/**
+ * Return value of the useMaxForm hook.
+ * Provides everything needed for fully custom form rendering.
+ */
+export interface UseMaxFormReturn {
+    /** React Hook Form instance for full control */
+    form: UseFormReturn<FormData>;
+    /** Array of form fields */
+    fields: FormField[];
+    /** Layout blocks for rendering */
+    layout: FormBlock[];
+    /** Form settings (button text, success message, etc.) */
+    settings: FormSettingsData;
+    /** Generated Zod validation schema */
+    schema: z.ZodObject<Record<string, z.ZodType>> | null;
+    /** Whether the form is loading */
+    isLoading: boolean;
+    /** Whether the form is submitting */
+    isSubmitting: boolean;
+    /** Whether submission was successful */
+    isSuccess: boolean;
+    /** Form-level error message */
+    error: string | null;
+    /** Submit the form */
+    submitForm: (data: FormData) => Promise<void>;
+    /** Reset the form to initial state */
+    resetForm: () => void;
+    /** Get error message for a specific field */
+    getFieldError: (fieldName: string) => string | undefined;
+    /** Get field definition by ID */
+    getFieldById: (fieldId: string) => FormField | undefined;
+    /** Get field definition by name */
+    getFieldByName: (fieldName: string) => FormField | undefined;
+    /** API key for file upload authentication */
+    apiKey: string;
+    /** Base URL for API calls */
+    baseUrl: string;
+    /** Form ID */
+    formId: string;
+}
+/**
+ * Internal form state during loading.
+ */
+export interface FormConfig {
+    fields: FormField[];
+    layout: FormBlock[];
+    settings: FormSettingsData;
+    schema: z.ZodObject<Record<string, z.ZodType>>;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,78 @@
+{
+  "name": "@maxischmaxi/maxforms-embed",
+  "version": "0.0.5",
+  "type": "module",
+  "description": "Embeddable form component for MaxForms with Zod validation and React Hook Form",
+  "author": "maxischmaxi",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/maxischmaxi/maxforms.git",
+    "directory": "packages/embed"
+  },
+  "homepage": "https://github.com/maxischmaxi/maxforms#readme",
+  "bugs": {
+    "url": "https://github.com/maxischmaxi/maxforms/issues"
+  },
+  "keywords": [
+    "maxforms",
+    "embed",
+    "forms",
+    "react",
+    "zod",
+    "react-hook-form",
+    "validation"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "main": "./dist/maxforms-embed.umd.cjs",
+  "module": "./dist/maxforms-embed.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/maxforms-embed.js",
+      "require": "./dist/maxforms-embed.umd.cjs"
+    },
+    "./styles.css": "./dist/maxforms-embed.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "vite build --watch",
+    "build": "tsc -b && vite build",
+    "clean": "rm -rf dist",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@hookform/resolvers": "^5.2.2",
+    "@maxischmaxi/maxforms-api-client": "workspace:*",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-hook-form": "^7.54.0",
+    "zod": "^4.3.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@vitejs/plugin-react": "^4.3.0",
+    "typescript": "^5.7.0",
+    "vite": "^6.0.0",
+    "vite-plugin-dts": "^4.3.0"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    }
+  }
+}