# Input Field

## Input Field

## MUIPrimaryInputField

A basic input text field widget provided by Modular UI.

### Properties

* **`widthFactor`**: *double* - A double value which gets multiplied with the current screen width to determine the width of the text field.
* **`borderRadius`**: *double* - Border radius for the text field.
* **`filledColor`**: *Color* - Filled color for the text field.
* **`hintText`**: *String* - Hint text for the text field.
* **`textStyle`**: *TextStyle* - Text style for the text field.
* **`hintStyle`**: *TextStyle* - Hint style for the text field.
* **`isObscure`**: *bool* - Is the text field obscured?
* **`enabledBorderColor`**: *Color* - Border color when the text field is selected.
* **`disabledBorderColor`**: *Color* - Border color when the text field is not selected.
* **`borderWidth`**: *double* - Border width for the text field.
* **`controller`**: *TextEditingController* - Text editing controller for the text field.
* **`cursorColor`**: *Color* - Cursor color for the text field.
* **`suffixIcon`**: *Icon?* - Icon for the suffix icon in the text field.
* **`suffixIconOnPressed`**: *VoidCallback?* - Function for the suffix icon.
* **`prefixIcon`**: *Icon?* - Icon for the prefix icon in the text field.
* **`prefixIconOnPressed`**: *VoidCallback?* - Function for the prefix icon.

### Example Usage

{% embed url="<https://verdant-lokum-9bd5c2.netlify.app/#/primaryinputfield>" %}
Input Field
{% endembed %}

```dart
MUIPrimaryInputField(
          suffixIcon: const Icon(Icons.turn_slight_left, color: Colors.black,),
          hintText: 'Enter your name',
          controller: TextEditingController(),
          filledColor: Colors.white,
        ),
```

### **Notes**

* Provides a basic input text field with customizable properties.
* Supports features like suffix icons, prefix icons, and custom styling.
* Utilizes the TextFormField widget for text input handling.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://yashs-organization-7.gitbook.io/modular-ui-documentation/input-field.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.