Typeit Versions Save

• Updates development dependencies in all packages.
• Fixes reference to generated types in typeit-react package (v2.6.1).

Now built on the Web Animations API, you can now customize TypeIt's default cursor animation by passing your own options. For an example, see here:

https://www.typeitjs.com/demos/customize-cursor-animation

Wraps each DOM manipulation orchestrated by TypeIt in requestAnimationFrame(), in order to guarantee that animations aren't affected by missed frames due to the browser's repaint cycle and the event loop being out of sync. Animations that require text to be typed all at once are bundled together in the same requestAnimationFrame() call, so that the typed characters appear (and disappear) on the screen instantaneously.

A bug was introduced when recent changes to how the queue is handled were made. This bug was causing some awkward pausing to occur when the .delete() method was used, as well as when an instance was configured to loop. This release fixes those issues.

This release encompasses several things:

Feature Addition

• Introduces the .flush() method for easily typing one-off, ephemeral animations.

Bug Fixes

• issue with the cursor not blinking while frozen
• issue with HTML comments not being ignored
• issue with non-breaking strings not replacing each other correctly (set via the breakLines option)
• fix a couple of miscellaneous cursor movement issues

Types were not being correctly output in the builds.

As an instance is being reset using .reset(), you can now completely rebuild the queue, replacing it with a totally new set of commands. For example:

const instance = new TypeIt("#element", {
   speed: 75
})
   .type("This is my initial text!")
   .go();

instance.reset(i => {
   i
      .type("But this will be typed the second time... ")
      .break()
      .type("completely replacing the original queue.");
});

instance.go();

Until now, TypeIt relied on a less-than-ideal means of parsing strings into HTML nodes, converting each of those nodes into a representation for typing, and then printing those representations to a page. This version switches to using a TreeWalker to generate the queue TypeIt needs to type, which now just contains HTML nodes themselves, with no messy representation around them.

This makes for:

• more efficient string parsing
• more efficient printing of characters to a page
• generally less complexity throughout the library
• a 5-7% reduction in gzipped bundle size

TypeIt's option types were not correctly being exposed through typeit-react. This release fixes that.

Migrated from Microbundle to Vite for bundling, which led to a ~18% drop in the UMD bundle size. 🎉