Don't Remove Break Tags Unexpectedly

A bug was causing <br> tags to be removed when strings were being deleted. This release fixes that.

Fix Bug Caused by Empty Strings Being Passed

This release fixes a bug caused by how TypeIt handled empty strings passed to the strings option. When something like ["", "foo", "bar"] was passed, the animation would halt on the empty string. See issue #199 for more details.

Movable Cursors, Slimmer Bundle, & More!

TypeIt v7 is here!

Highlights

• Over 25% slimmer than v6.
• Introduces a .move() method to move the cursor wherever you want during animation.
• Allows you to set a delay to fire after each instance method.

Breaking Changes

• You can target only one element per TypeIt instance, rather than several at once. If a selector is passed that applies to multiple elements, the first will be used.
• Callback method args now provide only the queue item that was just fired, and the instance itself.

See Example

This example uses some of the new features of v7, including movable cursors and instance method delays:

https://codepen.io/alexmacarthur/pen/rNVMXaV

Bug Fixes, Async Callbacks

This release fixes a two bugs:

• #179 - incorrect handling of emojis/surrogate pairs.
• #171 - inability to delete input strings correctly

In addition, all callback methods are now asynchronous, so you can effectively put them on hold until some asynchronous action has completed. Example:

new TypeIt({
   strings: "My string is here",
   afterStep: async () => {
    // Won't move onto the next step until timeout completes: 
    await new Promise((resolve, reject) => {
      setTimeout(() => {
        return resolve();
      }, 2000);
    });
   })
}).go();

Ignore this version.

You can ignore this version.

Fix Bug .empty() Bug

When no cursor existed, the empty() method was throwing an error, since it was assuming one would always exist. This release addresses that bug and puts tests around it for added confidence.

Webpack --> Rollup

This release switches the build system from Webpack to Rollup, saving about 10% in bundle size along the way. In addition to this, an ES module version of TypeIt is available for use. The "modern" bundle that was previous generated was also removed.

Fix Cursor Bug

When users typed strings that contained span elements, the contents of those elements were being inserted in to the cursor node, rather than correctly appended onto the content supposed to be typed. This release fixes that bug.

Smaller, More Modern Bundle & Other Optimizations

This release places a heavy focus on reducing the amount of code in the final bundle, taking advantage of more modern browser features, and fixing a bug. Specifically:

• rather than using classes, moves to a pseudoclassical approach.
• removes in-library polyfills mainly intended to support IE, which are now required to be loaded separately
• uses the IntersectionObserver API rather than scroll events to detect when an element is in view (#160)
• fixes a bug preventing .empty() from working correctly (#168)

In all, the complied bundle is now ~21% smaller.

Support for Nested HTML, Cleaner Markup, Other Optimizations

This release includes the following changes:

• Support for nested HTML has been added, meaning you can define strings that look like this: This text is <strong>bold, but also <em>italicized</em>.</strong>. (#145)
• Two bundles are now generated -- one for browsers reaching back to IE11 (a Promise polyfill is still required), and a lighter "modern" bundle for those that can parse ES2015. (#157)
• The boilerplate HTML generated by TypeIt for each instance has been significantly lessened, making for a cleaner DOM.
• Fix bugs related to the provided callback methods, and the startDelete option. (#159, #161)
• Default/"legacy" bundle size has been reduced by .1kb!