# MUIPrimary Button

A customizable primary button by ModularUI with optional icons.

### Properties

* `text`: The Text to display inside the button.
* `onPressed`: On Pressed Function.
* `bgColor`: Background Color of The Primary Button, default: black.
* `textColor`: Text Color of the Primary Button, default: white.
* `borderRadius`: Border Radius for Primary Button, default: 10.
* `animationDuration`: Animation Duration in Milliseconds, default: 250 ms.
* `hapticsEnabled`: Enables Light Haptic Feedback.
* `widthFactorUnpressed`: A double value multiplied by the current screen width when the button is not pressed.
* `widthFactorPressed`: A double value multiplied by the current screen width when the button is pressed.
* `heightFactorPressed`: A double value multiplied by the current screen height when the button is pressed.
* `heightFactorUnPressed`: A double value multiplied by the current screen height when the button is not pressed.
* `maxHorizontalPadding`: A double value determining maximum horizontal padding a button can accumulate.
* `leadingIcon`: Optional leading icon for the button.
* `actionIcon`: Optional action icon for the button.
* `iconColor`: Icon color for both leading and action icons, default: white.
* `boxShadows`: Box shadows for the button.

MUIPrimary Button

{% embed url="https://sunny-cassata-dfe2d4.netlify.app/#/primarybutton" %}
Primary Button
{% endembed %}

```dart
MUIPrimaryButton(
text: 'Primary Button',
 onPressed: (){},
),
```



### **Notes**

* This component uses a **`GestureDetector`** to handle tap events and provides customizable visual feedback.
* The button adjusts its size and appearance based on the screen width and height factors, providing responsiveness.
* Icons can be added to the leading and action positions with customizable colors and sizes.
* Haptic feedback can be enabled for a subtle tactile response.
* Box shadows can be customized to add depth and elevation to the button.
