Update docs

Update flex.mdx

Update image.mdx

Update icon.mdx

Update image.mdx

Update text.mdx

Update migration.md

Update pressable-box.mdx

website/pages/docs/overview/migration.md

@@ -24,6 +24,13 @@ To enhance readability, short aliases and shorthand property/method names are re
 
 Decorators' order was previously determined by their addition sequence. Now, we enforce specific ordering but also allow customizable orders. This might cause behavior changes in rare cases. For details, refer to the [decorators guide](https://fluttermix.com/docs/guides/decorators).
 
+### StyledWidgets updates
+
+#### The new PressableBox
+
+To provide a more consistent way to use the gesture APIs, we developed a new widget that merges the functionalities of Box and `Pressable`. Thus, the new `PressableBox` can receive a style like a Box and also accept interactions and its variants, similar to a `Pressable`. For more information, see the [PressableBox guide](https://www.fluttermix.com/docs/widgets/pressable-box).
+Keep in mind that the ideia is to reserve the old `Pressable` to more advanced cases.
+
 ### Behavior changes
 
 #### Decorators

website/pages/docs/widgets/flex.mdx

@@ -164,16 +164,4 @@ Set the space (gap) between each child in the flex container.
 ```dart
 // Set a gap of 8 logical pixels between children.
 flex.gap(8);
-```
-
-### **Aliases**
-
-Shortcuts for creating `FlexSpecAttribute`s with `Row` or `Column` configurations.
-
-```dart
-// Shortcut for setting up a Row attribute.
-var myRow = flex.row();
-
-// Shortcut for setting up a Column attribute.
-var myColumn = flex.column();
-```
+```

website/pages/docs/widgets/icon.mdx

@@ -30,7 +30,7 @@ Box(
 );
 ```
 
-In the above example, the `StyledIcon` widget will inherit the icon size and color style from the `Box` widget.
+In the above example, the `StyledIcon` widget will inherit the icon size and color style from the `Box` widget. However, remember that decorators attributes cannot be inherited.
 
 ## AnimatedStyledIcon
 

website/pages/docs/widgets/image.mdx

@@ -1,3 +1,5 @@
 ## Image
 
-Coming soon.
+<Callout type="info">
+  The StyledImage is in progress, if you would like to keep up to date with the progress, please follow the <a href="https://github.com/conceptadev/mix/issues/166"> StyledImage issue</a>. 
+</Callout>

website/pages/docs/widgets/pressable-box.mdx

@@ -36,9 +36,9 @@ In the example above, the `PressableBox` will apply a blue background color to t
 
 `PressableBox` integrates with various context variant utilities that apply styles based on different widget states and gestures. Here are a few of the interaction states and their corresponding styling hooks:
 
-- `onPress`: Styles applied when the widget is being pressed.
-- `onLongPress`: Styles applied when the widget is being long-pressed.
+- `onPressed`: Styles applied when the widget is being pressed.
+- `onLongPressed`: Styles applied when the widget is being long-pressed.
 - `onDisabled`: Styles applied when the widget is disabled and therefore non-interactive.
 - `onEnabled`: Styles applied when the widget is enabled and interactive.
-- `onFocus`: Styles applied when the widget gains focus.
+- `onFocused`: Styles applied when the widget gains focus.
 - `onHover`: Styles applied when a pointer has hovered over a widget.

website/pages/docs/widgets/text.mdx

@@ -16,7 +16,7 @@ StyledText(
 
 ## Inheritance
 
-The **StyledText** widget has the **inherit** flag true by default. That means that the style attributes will be inherited from the parent widget.
+The **StyledText** widget has the **inherit** flag true by default. That means that the style attributes will be inherited from the parent widget. However, remember that decorators attributes cannot be inherited.
 
 ```dart
 Box(
@@ -78,6 +78,61 @@ Limit the number of lines for the text block:
 text.maxLines(2);
 ```
 
+
+#### **textWidthBasis**
+
+Determine how text width is measured:
+
+```dart
+// Measure text width based on the longest line
+text.textWidthBasis.longestLine();
+
+// Measure text width based on the parent container
+text.textWidthBasis.parent();
+```
+
+#### **textHeightBehavior**
+
+Define how text height adjustments are made:
+
+```dart
+// Set a specified text height behavior
+text.textHeightBehavior(...); // TextHeightBehavior instance
+```
+
+#### **textDirection**
+
+Set the reading directionality of the text:
+
+```dart
+// Left-to-right text direction
+text.textDirection.ltr();
+
+// Right-to-left text direction
+text.textDirection.rtl();
+```
+
+#### **softWrap**
+
+Choose whether the text should soft-wrap:
+
+```dart
+// Enable soft wrapping
+text.softWrap(true);
+
+// Disable soft wrapping
+text.softWrap(false);
+```
+
+#### **textScaleFactor**
+
+Adjust the text scale factor for sizing:
+
+```dart
+// Increase text size by a factor of 1.5
+text.textScaleFactor(1.5);
+```
+
 #### **`style`**
 
 Allows to style `TextStyle` attributes efficiently, creating a cohesive and maintainable text styling semantics.
@@ -211,60 +266,6 @@ Set the locale for the text, affecting how it's displayed:
 text.style.locale(Locale('en')); // English locale
 ```
 
-#### **textWidthBasis**
-
-Determine how text width is measured:
-
-```dart
-// Measure text width based on the longest line
-text.textWidthBasis.longestLine();
-
-// Measure text width based on the parent container
-text.textWidthBasis.parent();
-```
-
-#### **textHeightBehavior**
-
-Define how text height adjustments are made:
-
-```dart
-// Set a specified text height behavior
-text.textHeightBehavior(...); // TextHeightBehavior instance
-```
-
-#### **textDirection**
-
-Set the reading directionality of the text:
-
-```dart
-// Left-to-right text direction
-text.textDirection.ltr();
-
-// Right-to-left text direction
-text.textDirection.rtl();
-```
-
-#### **softWrap**
-
-Choose whether the text should soft-wrap:
-
-```dart
-// Enable soft wrapping
-text.softWrap(true);
-
-// Disable soft wrapping
-text.softWrap(false);
-```
-
-#### **textScaleFactor**
-
-Adjust the text scale factor for sizing:
-
-```dart
-// Increase text size by a factor of 1.5
-text.textScaleFactor(1.5);
-```
-
 ### **Directives**
 
 Transform text data through various case operations: