diff --git a/.changeset/view-lookup-typings.md b/.changeset/view-lookup-typings.md
new file mode 100644
index 0000000000..aafb9508c3
--- /dev/null
+++ b/.changeset/view-lookup-typings.md
@@ -0,0 +1,5 @@
+---
+"@joint/core": patch
+---
+
+types - view lookups (`cell.findView()`, `paper.findViewByModel()`, `paper.getCellView()`) now infer the view type from the model and include the absent-view case in the return type
diff --git a/packages/joint-core/types/dia.d.ts b/packages/joint-core/types/dia.d.ts
index 356555820a..e5d9a52752 100644
--- a/packages/joint-core/types/dia.d.ts
+++ b/packages/joint-core/types/dia.d.ts
@@ -752,7 +752,7 @@ export class Cell, opt?: Element.ConstructorOptions);
+ findView(paper: Paper): ElementView | undefined;
+
translate(tx: number, ty?: number, opt?: Element.TranslateOptions): this;
position(opt?: Element.PositionOptions): g.Point;
@@ -1053,6 +1055,8 @@ export class Link {
findView(element: mvc.$SVGElement): T;
- findViewByModel(model: Graph.CellRef): T;
+ findViewByModel(model: Element): ElementView | undefined;
+ findViewByModel(model: Link): LinkView | undefined;
+ findViewByModel(model: Cell | Cell.ID): CellView | undefined;
+ /** @deprecated Pass the model and let the view type be inferred. */
+ findViewByModel(model: Graph.CellRef): T | undefined;
+ getCellView(model: Element): ElementView | null;
+ getCellView(model: Link): LinkView | null;
+ getCellView(model: Cell | Cell.ID): CellView | null;
+ /** @deprecated Pass the model and let the view type be inferred. */
getCellView(model: Graph.CellRef): T | null;
/**
diff --git a/packages/joint-react/src/store/clear-view.ts b/packages/joint-react/src/store/clear-view.ts
index 2fc483eebe..0119e63547 100644
--- a/packages/joint-react/src/store/clear-view.ts
+++ b/packages/joint-react/src/store/clear-view.ts
@@ -99,7 +99,6 @@ export function clearConnectedLinkViews(
linkView._sourceMagnet = null;
// @ts-expect-error we use private jointjs api method
linkView._targetMagnet = null;
- // @ts-expect-error we use private jointjs api method
linkView.requestConnectionUpdate({ async: true });
changes.set(String(link.id), { type: 'change', data: link });
}
diff --git a/packages/joint-react/stories/examples/dynamic-status-icons/code.tsx b/packages/joint-react/stories/examples/dynamic-status-icons/code.tsx
index 57ed9103e1..904bdb5ad8 100644
--- a/packages/joint-react/stories/examples/dynamic-status-icons/code.tsx
+++ b/packages/joint-react/stories/examples/dynamic-status-icons/code.tsx
@@ -228,7 +228,9 @@ function Main() {
useOnElementsMeasured(({ isInitial, paper }) => {
if (!isInitial) return;
for (const element of graph.getElements()) {
- StatusList.add(element.findView(paper), 'root', 'status', {
+ const elementView = element.findView(paper);
+ if (!elementView) continue;
+ StatusList.add(elementView, 'root', 'status', {
attribute: 'status',
position: 'top-right',
margin: { right: 5, top: 5 },
diff --git a/packages/joint-react/stories/examples/element-controls/code.tsx b/packages/joint-react/stories/examples/element-controls/code.tsx
index 8a04c02055..020be5f59c 100644
--- a/packages/joint-react/stories/examples/element-controls/code.tsx
+++ b/packages/joint-react/stories/examples/element-controls/code.tsx
@@ -740,7 +740,7 @@ function addElementControls(paper: dia.Paper) {
const factory = controlMap[type];
if (!factory) continue;
const toolsView = new dia.ToolsView({ tools: [factory()] });
- element.findView(paper).addTools(toolsView);
+ element.findView(paper)?.addTools(toolsView);
}
}
diff --git a/packages/joint-react/stories/examples/portal-selectors/code.tsx b/packages/joint-react/stories/examples/portal-selectors/code.tsx
index 77ca80a98e..7f77241986 100644
--- a/packages/joint-react/stories/examples/portal-selectors/code.tsx
+++ b/packages/joint-react/stories/examples/portal-selectors/code.tsx
@@ -219,6 +219,7 @@ function Selection({ selectedId }: { selectedId: CellId | null }) {
if (!cell) return;
const view = paper.findViewByModel(cell);
+ if (!view) return;
highlighters.mask.add(view, 'root', 'selection', {
padding: 8,
layer: dia.Paper.Layers.FRONT,