docs: add widget part docs

Author: kisvegabor

docs/built_in_widgets/lv_arc.mdx

@@ -25,6 +25,16 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/ar
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | The background arc: `arc_color`, `arc_width`, `arc_opa`, `arc_rounded` and `arc_image_src`. Background properties draw a box behind it. |
+| `indicator` | The value arc drawn over the background: the arc_* properties. Its padding is relative to the background arc. |
+| `knob` | The handle at the end of the indicator: background, border, shadow and padding properties (padding enlarges it). |
+
 Properties below are the widget's XML [`<api>`](../syntax/api); see [API](../syntax/api) for how properties, parameters and elements work.
 
 | Property | Type | Description |

docs/built_in_widgets/lv_bar.mdx

@@ -33,12 +33,21 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/ba
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | The bar's background track: background properties. padding shrinks the indicator in the respective direction. |
+| `indicator` | The filled portion that shows the value: background properties. |
+
 Properties below are the widget's XML [`<api>`](../syntax/api); see [API](../syntax/api) for how properties, parameters and elements work.
 
 | Property | Type | Description |
 | --- | --- | --- |
-| `min_value` | `int` | Set the minimum value of the bar |
-| `max_value` | `int` | Set the maximum value of the bar |
+| `min_value` | `int` | Set the minimum value of the bar. . If `min_value` > `max_value` fills from the right. |
+| `max_value` | `int` | Set the maximum value of the bar. If `min_value` > `max_value` fills from the right |
 | `value` | `int` | Set the current value of the bar |
 | `value-animated` | `bool` | Animate the bar when changing its value. Reference as `value-animated` (default: `false`) |
 | `start_value` | `int` | Set the start value in range mode |

docs/built_in_widgets/lv_button.mdx

@@ -15,4 +15,12 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/bu
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | Style the whole button: background, border, outline, shadow and padding. Combine with state selectors (pressed, checked, disabled, focused) for feedback. |
+
 This widget adds no XML properties of its own — it inherits the full API of the [Base Widget (`lv_obj`)](./lv_obj). See [API](../syntax/api) for how the `<api>` works.

docs/built_in_widgets/lv_buttonmatrix.mdx

@@ -50,6 +50,15 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/bu
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | The background behind the buttons: background properties. `pad_row` and `pad_column` set the gaps between buttons. |
+| `items` | The buttons: text and background properties (transforms are not applied). Combine with the 'checked', 'pressed', 'focused' and 'disabled' states, e.g. items\|checked. |
+
 Properties below are the widget's XML [`<api>`](../syntax/api); see [API](../syntax/api) for how properties, parameters and elements work.
 
 | Property | Type | Description |

docs/built_in_widgets/lv_calendar.mdx

@@ -15,6 +15,15 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/ca
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | The calendar background: background and padding properties. |
+| `items` | The day cells and weekday names (built on a button matrix): background and text properties. Weekday names and days outside the shown month (disabled) are drawn without background/border. Today's thicker border and the highlighted days' fill/border are forced to the theme's primary color in code, so they are not set via style properties. |
+
 Properties below are the widget's XML [`<api>`](../syntax/api); see [API](../syntax/api) for how properties, parameters and elements work.
 
 | Property | Type | Description |

docs/built_in_widgets/lv_canvas.mdx

@@ -14,4 +14,12 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/ca
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | Style the area behind/around the drawn buffer: background, border and padding. The pixels are drawn by the user-set buffer. |
+
 This widget adds no XML properties of its own — it inherits the full API of the [Base Widget (`lv_obj`)](./lv_obj). See [API](../syntax/api) for how the `<api>` works.

docs/built_in_widgets/lv_chart.mdx

@@ -43,6 +43,18 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/ch
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | The background and the division lines: background properties, plus the line properties (`line_color`/width/dash) for the division lines. `pad_column` sets the space between `BAR` column groups. |
+| `items` | The data series body. For LINE charts the connecting lines use the line properties (`line_color`, `line_width`, line_dash, `line_rounded`). For BAR charts the bars use the background properties (`bg_color`, `radius`, border). `pad_column` sets the gap between bars on the same X. |
+| `indicator` | The point markers drawn at each value on LINE and SCATTER charts: `width`/`height` set the marker size, `bg_color` its fill and `radius` its roundness; border, outline, and shadow properties also apply. |
+| `cursor` | The cursors: the line properties draw the crosshair lines and the marker at the cursor point uses `width` together with `bg_color`/`radius`. |
+| `scrollbar` | The scrollbar shown when the chart is zoomed/scrolled: `width` (thickness), background properties and padding. |
+
 Properties below are the widget's XML [`<api>`](../syntax/api); see [API](../syntax/api) for how properties, parameters and elements work.
 
 | Property | Type | Description |

docs/built_in_widgets/lv_checkbox.mdx

@@ -15,6 +15,15 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/ch
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | The label and its area: text properties; `pad_column` sets the gap between the tick box and the text. |
+| `indicator` | The tick box: background, border, shadow and padding properties. `bg_image_src` sets the check icon. Use the 'checked' state (e.g. indicator\|checked) for the checked look. |
+
 Properties below are the widget's XML [`<api>`](../syntax/api); see [API](../syntax/api) for how properties, parameters and elements work.
 
 | Property | Type | Description |

docs/built_in_widgets/lv_dropdown.mdx

@@ -15,6 +15,15 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/dr
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | The closed button: background and text properties. Gets the 'checked' state while the list is open. |
+| `indicator` | The symbol shown next to the text (set via `symbol`): `image_recolor` and `image_recolor_opa`. |
+
 Properties below are the widget's XML [`<api>`](../syntax/api); see [API](../syntax/api) for how properties, parameters and elements work.
 
 | Property | Type | Description |
@@ -32,4 +41,12 @@ The dropdown list object for styling or customization
 
 _access `get` · returns `lv_obj`_
 
+**Parts**
+
+| Part | Description |
+| --- | --- |
+| `main` | The open list background: background, border and padding. `max_height` caps the open list size. |
+| `scrollbar` | The list's scrollbar: `width` (thickness), background properties and padding on the respective side. |
+| `selected` | The highlighted option: background and text properties. The 'checked' state styles the currently selected option and 'pressed' the one being pressed/keyed. |
+
 _No attributes — created as an empty child._

docs/built_in_widgets/lv_gif.mdx

@@ -14,6 +14,14 @@ Learn more in the [LVGL Open documentation](https://lvgl.io/docs/open/widgets/gi
 
 ## Properties
 
+### Parts
+
+Style parts of the widget with local style (e.g. `style_bg_color-knob="0xff0000"`) or with style sheets (e.g. `<style name="style_knob" selector="knob">`). See [Styles](../syntax/styles) to learn more.
+
+| Part | Description |
+| --- | --- |
+| `main` | Style the GIF: `image_recolor`, `image_recolor_opa` and `image_opa`. Background, border, etc can be added too. |
+
 Properties below are the widget's XML [`<api>`](../syntax/api); see [API](../syntax/api) for how properties, parameters and elements work.
 
 | Property | Type | Description |