# `Plushie.Canvas.Shape.Group`
[🔗](https://github.com/plushie-ui/plushie-elixir/blob/v0.6.0/lib/plushie/canvas/shape/group.ex#L1)

Canvas group -- the only container and interactive unit in the canvas.

A group with an `id` is an interactive element (referred to as an
"element" in event names). Groups without an `id` are purely
structural containers for transforms, clips, and visual grouping.

## Transforms and clips

Groups carry an ordered `transforms` list and an optional `clip` rect.
These replace the old standalone push_transform/pop_transform and
push_clip/pop_clip shape commands.

## Interactivity

All interactive fields (`on_click`, `hover_style`, `a11y`, etc.) live
directly on the group struct -- there is no nested `Interactive`
sub-struct.

# `t`

```elixir
@type t() :: %Plushie.Canvas.Shape.Group{
  a11y: map() | nil,
  children: [term()],
  clip: Plushie.Canvas.Shape.Clip.t() | nil,
  cursor: String.t() | nil,
  drag_axis: String.t() | nil,
  drag_bounds: Plushie.Canvas.Shape.DragBounds.t() | nil,
  draggable: boolean() | nil,
  focus_ring_radius: number() | nil,
  focus_style: Plushie.Canvas.Shape.ShapeStyle.t() | nil,
  focusable: boolean() | nil,
  hit_rect: Plushie.Canvas.Shape.HitRect.t() | nil,
  hover_style: Plushie.Canvas.Shape.ShapeStyle.t() | nil,
  id: String.t() | nil,
  on_click: boolean() | nil,
  on_hover: boolean() | nil,
  pressed_style: Plushie.Canvas.Shape.ShapeStyle.t() | nil,
  show_focus_ring: boolean() | nil,
  tooltip: String.t() | nil,
  transforms:
    [
      Plushie.Canvas.Shape.Translate.t()
      | Plushie.Canvas.Shape.Rotate.t()
      | Plushie.Canvas.Shape.Scale.t()
    ]
    | nil
}
```

---

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