📝 mui-dynamic-field

A dynamic and customizable input field component for React, built with Material UI & TypeScript.

🚀 Features

✅ Multiple Input Types – text, password, number, dropdown, date, time, checkbox, etc.
✅ Material UI Integration – Uses MUI components for consistent design.
✅ Customizable Props – Control size, label, placeholder, validation rules, and more.
✅ Validation Support – Includes regex validation, min/max length, required fields, etc.
✅ TypeScript Support – Fully typed for better DX.
✅ Lightweight & Performant – Optimized for reusability and efficiency.

📦 Installation

Install via npm or yarn:

npm install mui-dynamic-field
# or
yarn add mui-dynamic-field

🔧 Usage Example

import { DynamicField } from "mui-dynamic-field";

export default function Example() {
  return (
    <DynamicField
      size="small"
      color="primary"
      item={{
        _key="inputField"
        placeholder="Input field"
        fieldType="text"
      }}
    />
  );
}

🔗 Supported Input Types

| Type | Description | | -------------- | ---------------------------------- | | text | Standard text input field | | password | Input field with visibility toggle | | number | Numeric input field | | dropdown | Select dropdown | | date | Date picker | | time | Time picker | | datetime | Date and time picker | | checkbox | Checkbox input | | autocomplete | Autocomplete dropdown |

📜 License

MIT

🤝 Contributing

Contributions are welcome! Feel free to submit issues and pull requests.

📞 Support

For any issues or feature requests, please open an issue on GitHub.