Migrating SVG window events

[cyberwombat]

Migrating to 3.x and running into error with:

 SVG.on(window, 'mousemove.drag', (e: any) => {
      this.drag(e)
    })

I see now that the events only exist on SVG elements but not clear how the window object would be used in this case. Not seeing much in the docs regarding this? Would I need to define an outer full page container and make that an SVG element?

[Fuzzyma]

The code should work and should execute on all mousemove events. I cant tell what your problem is from what you wrote. Do you have a minimal example?

[cyberwombat]

Oh interesting. Well let's see if perhaps you can tell from this. I import like this:

import {
  SVG,
  extend as SVGextend,
  Element as SVGElement,
  Text,
  Point,
  PathArray,
} from '@svgdotjs/svg.js'

And TS gives me this:

[cyberwombat]

Oh I see the issue...

import SVG, {
  extend as SVGextend,
  Element as SVGElement,
  Text,
  Point,
  PathArray,
} from '@svgdotjs/svg.js'

duh...

[cyberwombat]

I was premature. Error went away in intellisense but now throws when using esbuild with:

No matching export in "node_modules/@svgdotjs/svg.js/dist/svg.esm.js" for import "default"

    src/file.ts:2:7:
      2 │ import SVG, {
        ╵        ~~~

Will try to create an example. Reopening for now

[Fuzzyma]

SVG.on is the syntax if you import the WHOLE thing.

This is only available if you do import * as SVG from '@svgdotjs/svg.js'. Instead import on directly: import { on } from '@svgdotjs/svg.js'.

[cyberwombat]

Thank you. Works like a charm. I appreciate your work and your quick response!