SelectionProps

Props for Selection.

Surfaces the subset of ui.Selection.Options that is meaningful from React. Runtime-only fields (paper, graph, model) are managed internally; mvc / view internals (attributes, cid, className, el, events, id, tagName, theme) are reachable through the options escape hatch.

Per-gesture region behavior (type, options, selectLinks, filter, strict, live) is not configured here: pass it per call to SelectionApi.startSelectionRegion.

Type Parameters

Type Parameter	Default type	Description
Model extends dia.Cell	dia.Cell	The selected cell model the frames callbacks are typed against, inferred from the frames prop. Defaults to dia.Cell.

Properties

allowTranslate?

readonly optional allowTranslate?: boolean;

Allow dragging a selected cell to move the whole selection.

Default

true

---

frames?

readonly optional frames?: 
  | boolean
  | SelectionFramesOptions<Model>
| SelectionFrameList<any>;

Frame list rendered around each selected cell. By default the jj-is-selected CSS class is toggled on selected cells even when no boxes are drawn (opt out via the options form's cellClassName: ''): style via CSS to react to selection.

• undefined / false: class only, no HTML boxes.
• true: class + HTML overlay box on every selected cell (shouldRender: () => true).
• Options object: forwarded to SelectionFrameList's constructor; default shouldRender: () => true. Override shouldRender to gate boxes per cell, pass style for per-cell inline styling, etc.

ui.SelectionFrameList instance passthrough is also accepted as an escape hatch for fully custom frame lists.

---

options?

readonly optional options?: Partial<Options>;

Raw ui.Selection.Options passthrough for fields not exposed as dedicated props (attributes, cid, className, el, events, id, tagName, theme, and any future additions).

Avoid overriding joint-react-plus-controlled options (paper, graph, model, collection).

---

translateConnectedLinks?

readonly optional translateConnectedLinks?: ConnectedLinksTranslation;

Which links also move when the selected elements are dragged: 'none', 'subgraph' (only links between selected elements), or 'all'.

Default

'all'

---

wrapper?

readonly optional wrapper?: 
  | boolean
  | SelectionWrapperOptions
| SelectionWrapper<Element>;

Selection wrapper: the HTML overlay rectangle that hosts handles and a bbox outline around the selected cells.

• undefined / true: default SelectionWrapper.
• false: no wrapper. Hides the bbox AND drops all handles (handles render inside the wrapper).
• Options object: forwarded to SelectionWrapper's constructor (margin, visibility, usePaperScale, …). Also accepts handles / groups here, since they live on the wrapper.

ui.SelectionWrapper instance passthrough is also accepted as an escape hatch.