# `PhiaUi.Components.Data.ChartActiveShape`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/data/chart_active_shape.ex#L1)

Hover-expanding shape component for chart elements.

Inspired by Recharts' `activeShape` — provides hover state transitions
for dots, bars, and sectors using pure CSS `:hover` on SVG `<g>`.

## Examples

    <.chart_active_shape type={:dot} cx={100} cy={50} r={4} active_r={8} color="blue" />

    <.chart_active_shape type={:bar} x={10} y={20} width={30} height={60} color="red" />

    <.chart_active_shape type={:sector} path={normal_path} active_path={expanded_path} color="green" />

# `chart_active_shape`

## Attributes

* `type` (`:atom`) - Shape type. Defaults to `:dot`. Must be one of `:dot`, `:bar`, or `:sector`.
* `cx` (`:any`) - Circle center X. Defaults to `0`.
* `cy` (`:any`) - Circle center Y. Defaults to `0`.
* `r` (`:any`) - Normal radius. Defaults to `4`.
* `active_r` (`:any`) - Hover radius. Defaults to `8`.
* `x` (`:any`) - Bar X position. Defaults to `0`.
* `y` (`:any`) - Bar Y position. Defaults to `0`.
* `width` (`:any`) - Bar width. Defaults to `0`.
* `height` (`:any`) - Bar height. Defaults to `0`.
* `path` (`:string`) - Normal sector SVG path. Defaults to `nil`.
* `active_path` (`:string`) - Expanded sector SVG path for hover. Defaults to `nil`.
* `color` (`:string`) - Fill color. Defaults to `"currentColor"`.
* `active_color` (`:string`) - Hover fill color override. Defaults to `nil`.
* `opacity` (`:any`) - Normal opacity. Defaults to `1`.
* `active_opacity` (`:any`) - Hover opacity. Defaults to `1`.
* `class` (`:string`) - Defaults to `nil`.
* Global attributes are accepted.

---

*Consult [api-reference.md](api-reference.md) for complete listing*