dynamic-mui 1.1.5 → 2.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Dinakaran S
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,33 +1,68 @@
-Build dynamic forms using Material UI
+# dynamic-mui
 
-## Installation
+A powerful, dynamic form builder and generator for React using Material UI.
+
+## Features (v2.0.0)
 
-`npm install @mui/material @emotion/react @emotion/styled`
-`npm install dynamic-mui --save`
+- **Dynamic Form Generation**: Render complex forms from JSON schema.
+- **Visual Form Builder**: Drag-and-drop interface to build forms visually.
+- **New Documentation Mode**: Integrated documentation sidebar with component details.
+- **Advanced Validation**: Mandatory field validation with visual indicators (`*` and red error states).
+- **Rich Component Library**: Includes TextField, Select, Date/Time Pickers, Checkbox, Radio, Switch, Signature, and more.
+- **JSON Editing**: Edit form schema directly or use the visual builder.
+- **Data Preview**: View current form data in real-time.
+
+## Installation
 
-##Usage 
+```bash
+npm install @mui/material @emotion/react @emotion/styled
+npm install dynamic-mui --save
 ```
-`import { FormGenerator } from 'dynamic-mui/dist-modules/components/FormGenerator'`;
+
+## Usage
+
+```tsx
+import { FormGenerator } from 'dynamic-mui';
+
+const formSchema = [
+  {
+    type: 'textfield',
+    props: {
+        id: 'name',
+        label: 'Full Name',
+        MuiAttributes: { fullWidth: true, variant: 'outlined' },
+        rules: {
+            validation: [{ rule: 'mandatory', message: 'Name is required' }]
+        }
+    },
+    layout: { row: 1, xs: 12, md: 6 }
+  }
+];
 
 export default function DynamicForm() {
+  const handleSubmit = (data) => {
+    console.log('Form Data:', data);
+  };
+
   return (
     <FormGenerator
-      data={[
-        {
-          type: 'textfield',
-          props: {
-            MuiAttributes: { placeholder: 'Standard', fullWidth: true, variant: 'standard' },
-          },
-          layout: {
-            row: 1,
-            xs: 4,
-            sm: 4,
-          },
-        },
-      ]}
-      guid="Testing"
-      library={MUI}
+      data={formSchema}
+      onSubmit={handleSubmit}
     />
   );
-}     
+}
 ```
+
+## Local Development (Playground)
+
+To run the local playground and test changes:
+
+1. `npm install`
+2. `npm run dev`
+3. Open `http://localhost:5173` (or the port shown in terminal).
+
+The playground allows you to build forms visually, view the generated JSON, and test validation.
+
+## License
+
+MIT © [Dinakaran S](https://github.com/DinakaranS)

package/dist/components/DynamicComponent.d.ts

@@ -0,0 +1,12 @@
+import { ControlProps } from '../types';
+interface DynamicComponentProps extends ControlProps {
+    map?: string;
+    option?: string;
+    control?: any;
+    currentStep?: number;
+    patch?: any;
+    onStepUpdate?: any;
+    [key: string]: any;
+}
+export default function DynamicComponent(props: DynamicComponentProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/FormGenerator.d.ts

@@ -0,0 +1,37 @@
+import { default as React } from 'react';
+import { GridProps } from '@mui/material';
+import { FormField } from '../util/helper';
+export declare const FormData: (id?: string) => any;
+export declare const ClearFormData: (id?: string) => void;
+export interface FormGeneratorProps {
+    /** Component unique identifier */
+    guid: string;
+    /** Component json data */
+    data: FormField[];
+    /** Json data to assign value */
+    patch?: Record<string, any>;
+    /** Component Ref */
+    formRef?: React.Ref<HTMLButtonElement>;
+    /** Component Submit Function */
+    onSubmit?: (response: any, errors: any[], data: FormField[], guid: string) => void;
+    /** Component On Change Function */
+    onChange?: (args: {
+        id: string;
+        value: any;
+        option?: any;
+    }) => void;
+    /** Component On Step Change Function */
+    onStepChange?: (currentStep: number, isScreenChange: boolean, isLastStep: boolean) => void;
+    /** Grid Container Attributes */
+    MuiGridAttributes?: GridProps;
+    /** Stepper Active Step */
+    /** Stepper Active Step */
+    activeStep?: number;
+    /** On Field Click (Internal/Builder) */
+    onFieldClick?: (field: FormField) => void;
+    /** On Field Double Click (Internal/Builder) */
+    onFieldDoubleClick?: (field: FormField) => void;
+    /** On Field Context Menu (Internal/Builder) */
+    onFieldContextMenu?: (event: React.MouseEvent, field: FormField) => void;
+}
+export declare function FormGenerator({ data, patch, guid, formRef, onSubmit, onChange, onStepChange, MuiGridAttributes, activeStep, onFieldClick, onFieldDoubleClick, onFieldContextMenu, }: FormGeneratorProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/charts/Bar/bar.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Bar({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/charts/Line/line.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Line({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/charts/Mixchart/mixChart.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function MixChart({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/charts/Pie/pie.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Pie({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Accordion/accordion.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Accordion({ attributes, patch, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Autocomplete/autocomplete.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function AutoComplete({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/CheckBox/checkbox.d.ts

@@ -0,0 +1,3 @@
+import { ControlProps } from '../../../types';
+/** Playground Component */
+export default function CheckBox({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Chip/chip.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Chip({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/DataTable/datatable.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function DataTable({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/DateTime/datetime.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function DateTime({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/DateTimePicker/datetimepicker.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function DateTimePicker({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Divider/divider.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Divider({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Group/group.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Group({ attributes, patch, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Hyperlink/hyperlink.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Hyperlink({ attributes, rules }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/ImageList/imagelist.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function ImgList({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/List/list.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function List({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/MultiTextbox/multitextbox.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function MultiTextbox({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/NumberField/numberfield.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function NumberField({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Radio/radio.d.ts

@@ -0,0 +1,3 @@
+import { ControlProps } from '../../../types';
+/** Radio Component */
+export default function Radio({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Select/select.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Select({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Signature/signature.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Signature({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Stepper/stepper.d.ts

@@ -0,0 +1,8 @@
+import { ControlProps } from '../../../types';
+interface StepperProps extends ControlProps {
+    onStepUpdate?: (newStep: number, isScreenChange: boolean, isLastStep: boolean) => void;
+    currentStep?: number;
+    patch?: Record<string, any>;
+}
+export default function Stepper({ attributes, onChange, onStepUpdate, currentStep, patch }: StepperProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/controls/Switch/switch.d.ts

@@ -0,0 +1,3 @@
+import { ControlProps } from '../../../types';
+/** Switch Component */
+export default function Switch({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Tabs/tabs.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function Tabs({ attributes, patch, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/TextField/textfield.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function TextField({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/TimePicker/timepicker.d.ts

@@ -0,0 +1,2 @@
+import { ControlProps } from '../../../types';
+export default function TimePicker({ attributes, rules, onChange }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/Typography/typography.d.ts

@@ -0,0 +1,3 @@
+import { ControlProps } from '../../../types';
+/** Typography Component */
+export default function Typography({ attributes }: ControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/controls/index.d.ts

@@ -0,0 +1,57 @@
+import { default as Typography } from './Typography/typography';
+import { default as TextField } from './TextField/textfield';
+import { default as Table } from './DataTable/datatable';
+import { default as DateTime } from './DateTime/datetime';
+import { default as DateTimePicker } from './DateTimePicker/datetimepicker';
+import { default as TimePicker } from './TimePicker/timepicker';
+import { default as Select } from './Select/select';
+import { default as CheckBox } from './CheckBox/checkbox';
+import { default as Switch } from './Switch/switch';
+import { default as Radio } from './Radio/radio';
+import { default as Stepper } from './Stepper/stepper';
+import { default as Bar } from '../charts/Bar/bar';
+import { default as Line } from '../charts/Line/line';
+import { default as Pie } from '../charts/Pie/pie';
+import { default as MixChart } from '../charts/Mixchart/mixChart';
+import { default as Divider } from './Divider/divider';
+import { default as Chip } from './Chip/chip';
+import { default as List } from './List/list';
+import { default as NumberField } from './NumberField/numberfield';
+import { default as MultiTextbox } from './MultiTextbox/multitextbox';
+import { default as Signature } from './Signature/signature';
+import { default as Group } from './Group/group';
+import { default as Accordion } from './Accordion/accordion';
+import { default as Tabs } from './Tabs/tabs';
+import { default as AutoComplete } from './Autocomplete/autocomplete';
+import { default as ImgList } from './ImageList/imagelist';
+import { default as Hyperlink } from './Hyperlink/hyperlink';
+declare const Controls: {
+    Typography: typeof Typography;
+    TextField: typeof TextField;
+    Table: typeof Table;
+    DateTime: typeof DateTime;
+    DateTimePicker: typeof DateTimePicker;
+    TimePicker: typeof TimePicker;
+    Select: typeof Select;
+    CheckBox: typeof CheckBox;
+    Switch: typeof Switch;
+    Radio: typeof Radio;
+    Stepper: typeof Stepper;
+    Bar: typeof Bar;
+    Line: typeof Line;
+    Pie: typeof Pie;
+    MixChart: typeof MixChart;
+    Divider: typeof Divider;
+    Chip: typeof Chip;
+    List: typeof List;
+    NumberField: typeof NumberField;
+    MultiTextbox: typeof MultiTextbox;
+    Signature: typeof Signature;
+    Group: typeof Group;
+    Accordion: typeof Accordion;
+    Tabs: typeof Tabs;
+    AutoComplete: typeof AutoComplete;
+    ImgList: typeof ImgList;
+    Hyperlink: typeof Hyperlink;
+};
+export default Controls;

package/dist/config/mui.d.ts

@@ -0,0 +1,8 @@
+export interface ComponentConfig {
+    type: string;
+    map: string;
+    options?: Record<string, any>;
+}
+export type MuiConfigMap = Record<string, ComponentConfig>;
+declare const mui: MuiConfigMap;
+export default mui;

package/dist/dynamic-mui.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./index-BFycuK80.js");exports.ClearFormData=o.ClearFormData;exports.Controls=o.Controls;exports.DynamicComponent=o.DynamicComponent;exports.FormData=o.FormData;exports.FormGenerator=o.FormGenerator;exports.MuiConfig=o.mui;

package/dist/dynamic-mui.es.js

@@ -0,0 +1,9 @@
+import { af as r, ag as s, ah as m, ai as n, aj as t, ak as e } from "./index-DvtivzW0.mjs";
+export {
+  r as ClearFormData,
+  s as Controls,
+  m as DynamicComponent,
+  n as FormData,
+  t as FormGenerator,
+  e as MuiConfig
+};