Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

types(dia.ElementView): fix return types (window.Element vs dia.Element #2814

Merged
merged 2 commits into from
Dec 2, 2024
Merged

types(dia.ElementView): fix return types (window.Element vs dia.Element #2814

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
6736fa7
types(dia.ElementView): fix return types (window.Element vs dia.Element
kumilingus Dec 1, 2024
ecc997b
update
kumilingus Dec 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 18 additions & 1 deletion packages/joint-core/test/ts/index.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ const paper = new joint.dia.Paper({

paper.fitToContent({ padding: { top: 10 }, allowNewOrigin: false });

const cellView = graph.getCells[0].findView(paper);
const cellView = graph.getCells()[0].findView(paper);
cellView.vel.addClass('test-class');

let isHTMLView: AssertExtends<typeof paper.vel, null> = true;
Expand Down Expand Up @@ -201,6 +201,10 @@ new joint.shapes.standard.Rectangle({

class MyElement extends joint.dia.Element {

test() {
return true;
}

static attributes = {
'empty-attribute': {},
'set1-attribute': {
Expand All @@ -222,3 +226,16 @@ class MyElement extends joint.dia.Element {
},
};
}

class CustomElementView extends joint.dia.ElementView<MyElement> {

}

const myElement = new MyElement();
graph.addCell(myElement);
const myElementView = myElement.findView(paper) as CustomElementView;
myElementView.model.test();

// TODO: Fix 'MyElement' is assignable to the constraint of type 'E', but 'E'
// could be instantiated with a different subtype of constraint 'Element<Attributes, ModelSetOptions>'.
// const ElementView1: typeof joint.dia.ElementView = CustomElementView;
61 changes: 32 additions & 29 deletions packages/joint-core/types/joint.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,9 @@ type _DeepPartial<T> = {

type DeepPartial<T> = _DeepPartial<_DeepRequired<T>>;

// We use `DOMElement` later in the code, to avoid conflicts with the `dia.Element` type.
type DOMElement = Element;

export namespace dia {

type Event = mvc.TriggeredEvent;
Expand Down Expand Up @@ -395,7 +398,7 @@ export namespace dia {

type UnsetCallback<V> = (
this: V,
node: Element,
node: DOMElement,
nodeAttributes: { [name: string]: any },
cellView: V
) => string | Array<string> | null | void;
Expand All @@ -404,7 +407,7 @@ export namespace dia {
this: V,
attributeValue: any,
refBBox: g.Rect,
node: Element,
node: DOMElement,
nodeAttributes: { [name: string]: any },
cellView: V
) => { [key: string]: any } | string | number | void;
Expand All @@ -413,7 +416,7 @@ export namespace dia {
this: V,
attributeValue: any,
refBBox: g.Rect,
node: Element,
node: DOMElement,
nodeAttributes: { [name: string]: any },
cellView: V
) => dia.Point | null | void;
Expand All @@ -422,7 +425,7 @@ export namespace dia {
this: V,
attributeValue: any,
nodeBBox: g.Rect,
node: Element,
node: DOMElement,
nodeAttributes: { [name: string]: any },
cellView: V
) => dia.Point | null | void;
Expand Down Expand Up @@ -923,7 +926,7 @@ export namespace dia {

isNodeConnection(node: SVGElement): boolean;

getEventTarget(evt: dia.Event, opt?: { fromPoint?: boolean }): Element;
getEventTarget(evt: dia.Event, opt?: { fromPoint?: boolean }): DOMElement;

checkMouseleave(evt: dia.Event): void;

Expand Down Expand Up @@ -1044,7 +1047,7 @@ export namespace dia {

class ElementView<E extends Element = Element> extends CellViewGeneric<E> {

update(element?: E, renderingOnlyAttrs?: { [key: string]: any }): void;
update(element?: DOMElement, renderingOnlyAttrs?: { [key: string]: any }): void;

setInteractivity(value: boolean | ElementView.InteractivityOptions): void;

Expand All @@ -1053,9 +1056,9 @@ export namespace dia {
getTargetParentView(evt: dia.Event): CellView | null;

findPortNode(portId: string | number): SVGElement | null;
findPortNode(portId: string | number, selector: string): E | null;
findPortNode(portId: string | number, selector: string): DOMElement | null;

findPortNodes(portId: string | number, groupSelector: string): E[];
findPortNodes(portId: string | number, groupSelector: string): DOMElement[];

protected renderMarkup(): void;

Expand Down Expand Up @@ -1204,9 +1207,9 @@ export namespace dia {
getEndMagnet(endType: dia.LinkEnd): SVGElement | null;

findLabelNode(labelIndex: string | number): SVGElement | null;
findLabelNode(labelIndex: string | number, selector: string): Element | null;
findLabelNode(labelIndex: string | number, selector: string): DOMElement | null;

findLabelNodes(labelIndex: string | number, groupSelector: string): Element[];
findLabelNodes(labelIndex: string | number, groupSelector: string): DOMElement[];

removeRedundantLinearVertices(opt?: dia.ModelSetOptions): number;

Expand Down Expand Up @@ -2645,27 +2648,27 @@ export namespace util {

export function imageToDataUri(url: string, callback: (err: Error | null, dataUri: string) => void): void;

export function getElementBBox(el: Element): dia.BBox;
export function getElementBBox(el: DOMElement): dia.BBox;

export function sortElements(
elements: mvc.$Element,
comparator: (a: Element, b: Element) => number
): Element[];
comparator: (a: DOMElement, b: DOMElement) => number
): DOMElement[];

export function setAttributesBySelector(el: Element, attrs: { [selector: string]: { [attribute: string]: any }}): void;
export function setAttributesBySelector(el: DOMElement, attrs: { [selector: string]: { [attribute: string]: any }}): void;

export function normalizeSides(sides: dia.Sides): dia.PaddingJSON;

export function template(html: string): (data: any) => string;

export function toggleFullScreen(el?: Element): void;
export function toggleFullScreen(el?: DOMElement): void;

export function objectDifference(object: object, base: object, opt?: { maxDepth?: number }): object;

interface DOMJSONDocument {
fragment: DocumentFragment;
selectors: { [key: string]: Element };
groupSelectors: { [key: string]: Element[] };
selectors: { [key: string]: DOMElement };
groupSelectors: { [key: string]: DOMElement[] };
}

export function parseDOMJSON(json: dia.MarkupJSON): DOMJSONDocument;
Expand Down Expand Up @@ -2996,15 +2999,15 @@ export namespace mvc {
type Dom = unknown;
// The following types represent the DOM elements that can be passed to the
// $() function.
type $Element<T extends Element = Element> = string | T | T[] | Dom;
type $Element<T extends DOMElement = DOMElement> = string | T | T[] | Dom;
type $HTMLElement = $Element<HTMLElement>;
type $SVGElement = $Element<SVGElement>;

interface $AnimationOptions {
duration?: number;
delay?: number;
easing?: string;
complete?: (this: Element) => void;
complete?: (this: DOMElement) => void;
}

interface Event {
Expand All @@ -3027,7 +3030,7 @@ export namespace mvc {
screenX: number | undefined;
screenY: number | undefined;
/** @deprecated */
toElement: Element | undefined;
toElement: DOMElement | undefined;
// PointerEvent
pointerId: number | undefined;
pointerType: string | undefined;
Expand Down Expand Up @@ -3392,7 +3395,7 @@ export namespace mvc {

}

interface ViewBaseOptions<TModel extends (Model | undefined) = Model, TElement extends Element = HTMLElement> {
interface ViewBaseOptions<TModel extends (Model | undefined) = Model, TElement extends DOMElement = HTMLElement> {
model?: TModel | undefined;
// TODO: quickfix, this can't be fixed easy. The collection does not need to have the same model as the parent view.
collection?: Collection<any> | undefined; // was: Collection<TModel>;
Expand All @@ -3406,7 +3409,7 @@ export namespace mvc {

type ViewBaseEventListener = (event: mvc.Event) => void;

class ViewBase<TModel extends (Model | undefined) = Model, TElement extends Element = HTMLElement> extends EventsMixin implements Events {
class ViewBase<TModel extends (Model | undefined) = Model, TElement extends DOMElement = HTMLElement> extends EventsMixin implements Events {
/**
* Do not use, prefer TypeScript's extend functionality.
*/
Expand Down Expand Up @@ -3458,7 +3461,7 @@ export namespace mvc {
protected _setAttributes(attributes: Record<string, any>): void;
}

interface ViewOptions<T extends (mvc.Model | undefined), E extends Element = HTMLElement> extends mvc.ViewBaseOptions<T, E> {
interface ViewOptions<T extends (mvc.Model | undefined), E extends DOMElement = HTMLElement> extends mvc.ViewBaseOptions<T, E> {
theme?: string;
[key: string]: any;
}
Expand All @@ -3467,7 +3470,7 @@ export namespace mvc {
[key: string]: any;
}

class View<T extends (mvc.Model | undefined), E extends Element = HTMLElement> extends mvc.ViewBase<T, E> {
class View<T extends (mvc.Model | undefined), E extends DOMElement = HTMLElement> extends mvc.ViewBase<T, E> {

constructor(opt?: ViewOptions<T, E>);

Expand Down Expand Up @@ -3495,7 +3498,7 @@ export namespace mvc {

children?: dia.MarkupJSON;

childNodes?: { [key: string]: Element } | null;
childNodes?: { [key: string]: DOMElement } | null;

style?: { [key: string]: any };

Expand All @@ -3507,9 +3510,9 @@ export namespace mvc {

undelegateDocumentEvents(): this;

delegateElementEvents(element: Element, events?: mvc.EventsHash, data?: viewEventData): this;
delegateElementEvents(element: DOMElement, events?: mvc.EventsHash, data?: viewEventData): this;

undelegateElementEvents(element: Element): this;
undelegateElementEvents(element: DOMElement): this;

eventData(evt: dia.Event): viewEventData;
eventData(evt: dia.Event, data: viewEventData): this;
Expand All @@ -3519,15 +3522,15 @@ export namespace mvc {

renderChildren(children?: dia.MarkupJSON): this;

findAttribute(attributeName: string, node: Element): string | null;
findAttribute(attributeName: string, node: DOMElement): string | null;

confirmUpdate(flag: number, opt: { [key: string]: any }): number;

unmount(): void;

isMounted(): boolean;

protected findAttributeNode(attributeName: string, node: Element): Element | null;
protected findAttributeNode(attributeName: string, node: DOMElement): DOMElement | null;

protected init(): void;

Expand Down
Loading