react-form-dto 0.0.7 → 0.0.8

package/README.md

@@ -214,143 +214,6 @@ const profileForm: FormDTO = {
 
 ---
 
-## 🌍 Internationalization (I18n)
-
-React Form DTO has built-in support for multi-language forms through `I18nText` and `I18nOption` types.
-
-### Using I18nText
-
-Any text property (`label`, `placeholder`, `title`, `description`, validation messages) can be either a plain string or a locale map:
-
-```tsx
-// Simple string (single language)
-{
-  label: "First Name"
-}
-
-// Multi-language support
-{
-  label: {
-    en: "First Name",
-    fr: "Prénom",
-    es: "Nombre",
-    de: "Vorname"
-  }
-}
-```
-
-### Using I18nOption for Selections
-
-For select, autocomplete, and multi-autocomplete fields, you can use `I18nOption` objects to provide translatable labels while maintaining stable values:
-
-```tsx
-{
-  id: "country",
-  type: "select",
-  label: { en: "Country", fr: "Pays" },
-  options: [
-    {
-      value: "us",
-      label: { en: "United States", fr: "États-Unis" }
-    },
-    {
-      value: "fr",
-      label: { en: "France", fr: "France" }
-    },
-    {
-      value: "de",
-      label: { en: "Germany", fr: "Allemagne" }
-    }
-  ]
-}
-```
-
-**Backward Compatibility:** Simple string arrays still work:
-
-```tsx
-options: ["USA", "France", "Germany"] // Still supported
-```
-
-### I18n Validation Messages
-
-Validation messages also support I18n:
-
-```tsx
-validations: {
-  required: {
-    en: "This field is required",
-    fr: "Ce champ est obligatoire",
-    es: "Este campo es obligatorio"
-  },
-  validate: (value) => value.length < 2 
-    ? { 
-        en: "Minimum 2 characters",
-        fr: "Minimum 2 caractères" 
-      }
-    : null
-}
-```
-
-### Complete I18n Example
-
-```tsx
-const multilingualForm: FormDTO = {
-  title: {
-    en: "User Registration",
-    fr: "Inscription de l'utilisateur",
-    es: "Registro de Usuario"
-  },
-  description: {
-    en: "Please fill in your details",
-    fr: "Veuillez remplir vos coordonnées",
-    es: "Por favor complete sus datos"
-  },
-  sections: [
-    {
-      id: "personal",
-      heading: {
-        en: "Personal Information",
-        fr: "Informations personnelles",
-        es: "Información Personal"
-      },
-      fields: [
-        {
-          id: "title",
-          type: "select",
-          label: { en: "Title", fr: "Titre", es: "Título" },
-          options: [
-            { value: "mr", label: { en: "Mr", fr: "M.", es: "Sr." } },
-            { value: "ms", label: { en: "Ms", fr: "Mme", es: "Sra." } },
-            { value: "dr", label: { en: "Dr", fr: "Dr", es: "Dr." } }
-          ]
-        },
-        {
-          id: "firstName",
-          type: "text",
-          label: { en: "First Name", fr: "Prénom", es: "Nombre" },
-          placeholder: { 
-            en: "Enter your first name",
-            fr: "Entrez votre prénom",
-            es: "Ingrese su nombre"
-          },
-          validations: {
-            required: {
-              en: "First name is required",
-              fr: "Le prénom est obligatoire",
-              es: "El nombre es obligatorio"
-            }
-          }
-        }
-      ]
-    }
-  ]
-};
-```
-
-> **Note:** The library provides the I18n structure. You'll need to implement locale selection and text resolution in your application layer.
-
----
-
 ## Custom Field Renderers
 
 Override any default renderer by supplying your own component:

package/dist/types/dto.d.ts

@@ -5,18 +5,13 @@ export type LayoutDTO = {
     align?: "start" | "center" | "end" | "stretch";
     justify?: "start" | "center" | "end" | "space-between";
 };
-export type I18nText = string | Record<string, string>;
-export type I18nOption = {
-    value: string;
-    label: I18nText;
-};
 export type InputType = "text" | "email" | "password" | "textarea" | "number" | "select" | "checkbox" | "date" | "autocomplete" | "multi-autocomplete" | "radio";
 export type FieldDTO = {
     id: string;
     type: InputType;
-    label: I18nText;
-    placeholder?: I18nText;
-    options?: Array<I18nOption | I18nText>;
+    label: string;
+    placeholder?: string;
+    options?: string[];
     rows?: number;
     disabled?: boolean;
     defaultValue?: any;
@@ -25,27 +20,27 @@ export type FieldDTO = {
 };
 export type SectionDTO = {
     id: string;
-    heading?: I18nText;
+    heading?: string;
     headingFontSize?: number;
-    description?: I18nText;
+    description?: string;
     descriptionFontSize?: number;
     layout?: LayoutDTO;
     fields: FieldDTO[];
 };
 export type FormDTO = {
-    title?: I18nText;
+    title?: string;
     titleFontSize?: number;
-    description?: I18nText;
+    description?: string;
     descriptionFontSize?: number;
     layout?: LayoutDTO;
     sections: SectionDTO[];
 };
 export type Validations = {
-    required?: boolean | I18nText;
+    required?: boolean | string;
     min?: number;
     max?: number;
     minLength?: number;
     maxLength?: number;
     pattern?: RegExp;
-    validate?: (value: any) => I18nText | null;
+    validate?: (value: any) => string | null;
 };

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "react-form-dto",
     "description": "A React library for building forms using DTOs with MUI and TypeScript.",
-    "version": "0.0.7",
+    "version": "0.0.8",
     "main": "dist/react-form-dto.umd.js",
     "module": "dist/react-form-dto.es.js",
     "types": "dist/index.d.ts",

package/dist/examples/profileForm.i18n.d.ts

@@ -1,2 +0,0 @@
-import { FormDTO } from '../types';
-export declare const profileFormI18n: FormDTO;