npm - @ni/spright-components - Versions diffs - 6.4.25 → 6.4.27 - Mend

@ni/spright-components 6.4.25 → 6.4.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/all-components-bundle.js +697 -571
package/dist/all-components-bundle.js.map +1 -1
package/dist/all-components-bundle.min.js +3830 -3808
package/dist/all-components-bundle.min.js.map +1 -1
package/package.json +12 -12

package/dist/all-components-bundle.js CHANGED Viewed

@@ -10117,15 +10117,12 @@
   /* eslint-enable @typescript-eslint/no-non-null-assertion */
   /*!
-  * tabbable 6.3.0
+  * tabbable 6.4.0
   * @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE
   */
   // NOTE: separate `:not()` selectors has broader browser support than the newer
   //  `:not([inert], [inert] *)` (Feb 2023)
-  // CAREFUL: JSDom does not support `:not([inert] *)` as a selector; using it causes
-  //  the entire query to fail, resulting in no nodes found, which will break a lot
-  //  of things... so we have to rely on JS to identify nodes inside an inert container
-  var candidateSelectors = ['input:not([inert])', 'select:not([inert])', 'textarea:not([inert])', 'a[href]:not([inert])', 'button:not([inert])', '[tabindex]:not(slot):not([inert])', 'audio[controls]:not([inert])', 'video[controls]:not([inert])', '[contenteditable]:not([contenteditable="false"]):not([inert])', 'details>summary:first-of-type:not([inert])', 'details:not([inert])'];
+  var candidateSelectors = ['input:not([inert]):not([inert] *)', 'select:not([inert]):not([inert] *)', 'textarea:not([inert]):not([inert] *)', 'a[href]:not([inert]):not([inert] *)', 'button:not([inert]):not([inert] *)', '[tabindex]:not(slot):not([inert]):not([inert] *)', 'audio[controls]:not([inert]):not([inert] *)', 'video[controls]:not([inert]):not([inert] *)', '[contenteditable]:not([contenteditable="false"]):not([inert]):not([inert] *)', 'details>summary:first-of-type:not([inert]):not([inert] *)', 'details:not([inert]):not([inert] *)'];
   var NoElement = typeof Element === 'undefined';
   var matches$1 = NoElement ? function () {} : Element.prototype.matches || Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector;
   var getRootNode = !NoElement && Element.prototype.getRootNode ? function (element) {
@@ -10134,35 +10131,6 @@
   } : function (element) {
     return element === null || element === void 0 ? void 0 : element.ownerDocument;
   };
-  /**
-   * Determines if a node is inert or in an inert ancestor.
-   * @param {Element} [node]
-   * @param {boolean} [lookUp] If true and `node` is not inert, looks up at ancestors to
-   *  see if any of them are inert. If false, only `node` itself is considered.
-   * @returns {boolean} True if inert itself or by way of being in an inert ancestor.
-   *  False if `node` is falsy.
-   */
-  var _isInert = function isInert(node, lookUp) {
-    var _node$getAttribute;
-    if (lookUp === void 0) {
-      lookUp = true;
-    }
-    // CAREFUL: JSDom does not support inert at all, so we can't use the `HTMLElement.inert`
-    //  JS API property; we have to check the attribute, which can either be empty or 'true';
-    //  if it's `null` (not specified) or 'false', it's an active element
-    var inertAtt = node === null || node === void 0 ? void 0 : (_node$getAttribute = node.getAttribute) === null || _node$getAttribute === void 0 ? void 0 : _node$getAttribute.call(node, 'inert');
-    var inert = inertAtt === '' || inertAtt === 'true';
-    // NOTE: this could also be handled with `node.matches('[inert], :is([inert] *)')`
-    //  if it weren't for `matches()` not being a function on shadow roots; the following
-    //  code works for any kind of node
-    // CAREFUL: JSDom does not appear to support certain selectors like `:not([inert] *)`
-    //  so it likely would not support `:is([inert] *)` either...
-    var result = inert || lookUp && node && _isInert(node.parentNode); // recursive
-    return result;
-  };
   var isInput = function isInput(node) {
     return node.tagName === 'INPUT';
   };
@@ -10379,18 +10347,14 @@
     return false;
   };
   var isNodeMatchingSelectorFocusable = function isNodeMatchingSelectorFocusable(options, node) {
-    if (node.disabled ||
-    // we must do an inert look up to filter out any elements inside an inert ancestor
-    //  because we're limited in the type of selectors we can use in JSDom (see related
-    //  note related to `candidateSelectors`)
-    _isInert(node) || isHiddenInput(node) || isHidden(node, options) ||
+    if (node.disabled || isHiddenInput(node) || isHidden(node, options) ||
     // For a details element with a summary, the summary element gets the focus
     isDetailsWithSummary(node) || isDisabledFromFieldset(node)) {
       return false;
     }
     return true;
   };
-  var focusableCandidateSelector = /* #__PURE__ */candidateSelectors.concat('iframe').join(',');
+  var focusableCandidateSelector = /* #__PURE__ */candidateSelectors.concat('iframe:not([inert]):not([inert] *)').join(',');
   var isFocusable = function isFocusable(node, options) {
     options = options || {};
     if (!node) {
@@ -18839,18 +18803,28 @@
 `;
   /**
-   * The base class for icon components
+   * The base class for icon components. Implementors:
+   * - Should not increase the API surface area, consumers of icons would not expect additional attributes to configure
+   * - Should not add interactive components to the template, expect to be visual only
+   * - Should respond well to sizing of the element
+   * - Should respond to configuration of the severity attribute and other tokens such as theme
    */
   class Icon extends FoundationElement {
+  }
+  __decorate([
+      attr
+  ], Icon.prototype, "severity", void 0);
+  /**
+   * Icon base class for the standard nimble icon set
+   */
+  class IconSvg extends Icon {
       constructor(/** @internal */ icon) {
           super();
           this.icon = icon;
       }
   }
-  __decorate([
-      attr
-  ], Icon.prototype, "severity", void 0);
-  const registerIcon = (baseName, iconClass) => {
+  const registerIconSvg = (baseName, iconClass) => {
       const composedIcon = iconClass.compose({
           baseName,
           template: template$M,
@@ -18864,12 +18838,12 @@
   /**
    * The icon component for the 'arrowExpanderLeft' icon
    */
-  class IconArrowExpanderLeft extends Icon {
+  class IconArrowExpanderLeft extends IconSvg {
       constructor() {
           super(arrowExpanderLeft16X16);
       }
   }
-  registerIcon('icon-arrow-expander-left', IconArrowExpanderLeft);
+  registerIconSvg('icon-arrow-expander-left', IconArrowExpanderLeft);
   const iconArrowExpanderLeftTag = 'nimble-icon-arrow-expander-left';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -18877,12 +18851,12 @@
   /**
    * The icon component for the 'arrowExpanderRight' icon
    */
-  class IconArrowExpanderRight extends Icon {
+  class IconArrowExpanderRight extends IconSvg {
       constructor() {
           super(arrowExpanderRight16X16);
       }
   }
-  registerIcon('icon-arrow-expander-right', IconArrowExpanderRight);
+  registerIconSvg('icon-arrow-expander-right', IconArrowExpanderRight);
   const iconArrowExpanderRightTag = 'nimble-icon-arrow-expander-right';
   const coreLabelDefaults = {
@@ -19747,12 +19721,12 @@
   /**
    * The icon component for the 'exclamationMark' icon
    */
-  class IconExclamationMark extends Icon {
+  class IconExclamationMark extends IconSvg {
       constructor() {
           super(exclamationMark16X16);
       }
   }
-  registerIcon('icon-exclamation-mark', IconExclamationMark);
+  registerIconSvg('icon-exclamation-mark', IconExclamationMark);
   const iconExclamationMarkTag = 'nimble-icon-exclamation-mark';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -19760,12 +19734,12 @@
   /**
    * The icon component for the 'info' icon
    */
-  class IconInfo extends Icon {
+  class IconInfo extends IconSvg {
       constructor() {
           super(info16X16);
       }
   }
-  registerIcon('icon-info', IconInfo);
+  registerIconSvg('icon-info', IconInfo);
   const iconInfoTag = 'nimble-icon-info';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -19773,12 +19747,12 @@
   /**
    * The icon component for the 'triangleFilled' icon
    */
-  class IconTriangleFilled extends Icon {
+  class IconTriangleFilled extends IconSvg {
       constructor() {
           super(triangleFilled16X16);
       }
   }
-  registerIcon('icon-triangle-filled', IconTriangleFilled);
+  registerIconSvg('icon-triangle-filled', IconTriangleFilled);
   const iconTriangleFilledTag = 'nimble-icon-triangle-filled';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -19786,12 +19760,12 @@
   /**
    * The icon component for the 'times' icon
    */
-  class IconTimes extends Icon {
+  class IconTimes extends IconSvg {
       constructor() {
           super(times16X16);
       }
   }
-  registerIcon('icon-times', IconTimes);
+  registerIconSvg('icon-times', IconTimes);
   const iconTimesTag = 'nimble-icon-times';
   /**
@@ -20866,12 +20840,12 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'arrowExpanderDown' icon
    */
-  class IconArrowExpanderDown extends Icon {
+  class IconArrowExpanderDown extends IconSvg {
       constructor() {
           super(arrowExpanderDown16X16);
       }
   }
-  registerIcon('icon-arrow-expander-down', IconArrowExpanderDown);
+  registerIconSvg('icon-arrow-expander-down', IconArrowExpanderDown);
   const iconArrowExpanderDownTag = 'nimble-icon-arrow-expander-down';
   const DropdownPosition = {
@@ -21294,12 +21268,12 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'asterisk' icon
    */
-  class IconAsterisk extends Icon {
+  class IconAsterisk extends IconSvg {
       constructor() {
           super(asterisk5X5);
       }
   }
-  registerIcon('icon-asterisk', IconAsterisk);
+  registerIconSvg('icon-asterisk', IconAsterisk);
   const iconAsteriskTag = 'nimble-icon-asterisk';
   /**
@@ -22686,12 +22660,12 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'add' icon
    */
-  class IconAdd extends Icon {
+  class IconAdd extends IconSvg {
       constructor() {
           super(add16X16);
       }
   }
-  registerIcon('icon-add', IconAdd);
+  registerIconSvg('icon-add', IconAdd);
   const iconAddTag = 'nimble-icon-add';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -22699,12 +22673,12 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'arrowDown' icon
    */
-  class IconArrowDown extends Icon {
+  class IconArrowDown extends IconSvg {
       constructor() {
           super(arrowDown16X16);
       }
   }
-  registerIcon('icon-arrow-down', IconArrowDown);
+  registerIconSvg('icon-arrow-down', IconArrowDown);
   const iconArrowDownTag = 'nimble-icon-arrow-down';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -22712,216 +22686,216 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'arrowDownLeftAndArrowUpRight' icon
    */
-  class IconArrowDownLeftAndArrowUpRight extends Icon {
+  class IconArrowDownLeftAndArrowUpRight extends IconSvg {
       constructor() {
           super(arrowDownLeftAndArrowUpRight16X16);
       }
   }
-  registerIcon('icon-arrow-down-left-and-arrow-up-right', IconArrowDownLeftAndArrowUpRight);
+  registerIconSvg('icon-arrow-down-left-and-arrow-up-right', IconArrowDownLeftAndArrowUpRight);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowDownRectangle' icon
    */
-  class IconArrowDownRectangle extends Icon {
+  class IconArrowDownRectangle extends IconSvg {
       constructor() {
           super(arrowDownRectangle16X16);
       }
   }
-  registerIcon('icon-arrow-down-rectangle', IconArrowDownRectangle);
+  registerIconSvg('icon-arrow-down-rectangle', IconArrowDownRectangle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowDownRightAndArrowUpLeft' icon
    */
-  class IconArrowDownRightAndArrowUpLeft extends Icon {
+  class IconArrowDownRightAndArrowUpLeft extends IconSvg {
       constructor() {
           super(arrowDownRightAndArrowUpLeft16X16);
       }
   }
-  registerIcon('icon-arrow-down-right-and-arrow-up-left', IconArrowDownRightAndArrowUpLeft);
+  registerIconSvg('icon-arrow-down-right-and-arrow-up-left', IconArrowDownRightAndArrowUpLeft);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowDownTwoRectangles' icon
    */
-  class IconArrowDownTwoRectangles extends Icon {
+  class IconArrowDownTwoRectangles extends IconSvg {
       constructor() {
           super(arrowDownTwoRectangles);
       }
   }
-  registerIcon('icon-arrow-down-two-rectangles', IconArrowDownTwoRectangles);
+  registerIconSvg('icon-arrow-down-two-rectangles', IconArrowDownTwoRectangles);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowExpanderUp' icon
    */
-  class IconArrowExpanderUp extends Icon {
+  class IconArrowExpanderUp extends IconSvg {
       constructor() {
           super(arrowExpanderUp16X16);
       }
   }
-  registerIcon('icon-arrow-expander-up', IconArrowExpanderUp);
+  registerIconSvg('icon-arrow-expander-up', IconArrowExpanderUp);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowInCircle' icon
    */
-  class IconArrowInCircle extends Icon {
+  class IconArrowInCircle extends IconSvg {
       constructor() {
           super(arrowInCircle16X16);
       }
   }
-  registerIcon('icon-arrow-in-circle', IconArrowInCircle);
+  registerIconSvg('icon-arrow-in-circle', IconArrowInCircle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowLeftFromLine' icon
    */
-  class IconArrowLeftFromLine extends Icon {
+  class IconArrowLeftFromLine extends IconSvg {
       constructor() {
           super(arrowLeftFromLine16X16);
       }
   }
-  registerIcon('icon-arrow-left-from-line', IconArrowLeftFromLine);
+  registerIconSvg('icon-arrow-left-from-line', IconArrowLeftFromLine);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowLeftTwoRectangles' icon
    */
-  class IconArrowLeftTwoRectangles extends Icon {
+  class IconArrowLeftTwoRectangles extends IconSvg {
       constructor() {
           super(arrowLeftTwoRectangles);
       }
   }
-  registerIcon('icon-arrow-left-two-rectangles', IconArrowLeftTwoRectangles);
+  registerIconSvg('icon-arrow-left-two-rectangles', IconArrowLeftTwoRectangles);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowOutCircle' icon
    */
-  class IconArrowOutCircle extends Icon {
+  class IconArrowOutCircle extends IconSvg {
       constructor() {
           super(arrowOutCircle16X16);
       }
   }
-  registerIcon('icon-arrow-out-circle', IconArrowOutCircle);
+  registerIconSvg('icon-arrow-out-circle', IconArrowOutCircle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowPartialRotateLeft' icon
    */
-  class IconArrowPartialRotateLeft extends Icon {
+  class IconArrowPartialRotateLeft extends IconSvg {
       constructor() {
           super(arrowPartialRotateLeft16X16);
       }
   }
-  registerIcon('icon-arrow-partial-rotate-left', IconArrowPartialRotateLeft);
+  registerIconSvg('icon-arrow-partial-rotate-left', IconArrowPartialRotateLeft);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowRightThin' icon
    */
-  class IconArrowRightThin extends Icon {
+  class IconArrowRightThin extends IconSvg {
       constructor() {
           super(arrowRightThin16X16);
       }
   }
-  registerIcon('icon-arrow-right-thin', IconArrowRightThin);
+  registerIconSvg('icon-arrow-right-thin', IconArrowRightThin);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowRightToLine' icon
    */
-  class IconArrowRightToLine extends Icon {
+  class IconArrowRightToLine extends IconSvg {
       constructor() {
           super(arrowRightToLine16X16);
       }
   }
-  registerIcon('icon-arrow-right-to-line', IconArrowRightToLine);
+  registerIconSvg('icon-arrow-right-to-line', IconArrowRightToLine);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowRightTwoRectangles' icon
    */
-  class IconArrowRightTwoRectangles extends Icon {
+  class IconArrowRightTwoRectangles extends IconSvg {
       constructor() {
           super(arrowRightTwoRectangles);
       }
   }
-  registerIcon('icon-arrow-right-two-rectangles', IconArrowRightTwoRectangles);
+  registerIconSvg('icon-arrow-right-two-rectangles', IconArrowRightTwoRectangles);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowRotateRight' icon
    */
-  class IconArrowRotateRight extends Icon {
+  class IconArrowRotateRight extends IconSvg {
       constructor() {
           super(arrowRotateRight16X16);
       }
   }
-  registerIcon('icon-arrow-rotate-right', IconArrowRotateRight);
+  registerIconSvg('icon-arrow-rotate-right', IconArrowRotateRight);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowULeft' icon
    */
-  class IconArrowULeft extends Icon {
+  class IconArrowULeft extends IconSvg {
       constructor() {
           super(arrowULeft16X16);
       }
   }
-  registerIcon('icon-arrow-u-left', IconArrowULeft);
+  registerIconSvg('icon-arrow-u-left', IconArrowULeft);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowURight' icon
    */
-  class IconArrowURight extends Icon {
+  class IconArrowURight extends IconSvg {
       constructor() {
           super(arrowURight16X16);
       }
   }
-  registerIcon('icon-arrow-u-right', IconArrowURight);
+  registerIconSvg('icon-arrow-u-right', IconArrowURight);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowUUp' icon
    */
-  class IconArrowUUp extends Icon {
+  class IconArrowUUp extends IconSvg {
       constructor() {
           super(arrowUUp16X16);
       }
   }
-  registerIcon('icon-arrow-u-up', IconArrowUUp);
+  registerIconSvg('icon-arrow-u-up', IconArrowUUp);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowUp' icon
    */
-  class IconArrowUp extends Icon {
+  class IconArrowUp extends IconSvg {
       constructor() {
           super(arrowUp16X16);
       }
   }
-  registerIcon('icon-arrow-up', IconArrowUp);
+  registerIconSvg('icon-arrow-up', IconArrowUp);
   const iconArrowUpTag = 'nimble-icon-arrow-up';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -22929,228 +22903,228 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'arrowUpLeftAndArrowDownRight' icon
    */
-  class IconArrowUpLeftAndArrowDownRight extends Icon {
+  class IconArrowUpLeftAndArrowDownRight extends IconSvg {
       constructor() {
           super(arrowUpLeftAndArrowDownRight16X16);
       }
   }
-  registerIcon('icon-arrow-up-left-and-arrow-down-right', IconArrowUpLeftAndArrowDownRight);
+  registerIconSvg('icon-arrow-up-left-and-arrow-down-right', IconArrowUpLeftAndArrowDownRight);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowUpRectangle' icon
    */
-  class IconArrowUpRectangle extends Icon {
+  class IconArrowUpRectangle extends IconSvg {
       constructor() {
           super(arrowUpRectangle16X16);
       }
   }
-  registerIcon('icon-arrow-up-rectangle', IconArrowUpRectangle);
+  registerIconSvg('icon-arrow-up-rectangle', IconArrowUpRectangle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowUpRightAndArrowDownLeft' icon
    */
-  class IconArrowUpRightAndArrowDownLeft extends Icon {
+  class IconArrowUpRightAndArrowDownLeft extends IconSvg {
       constructor() {
           super(arrowUpRightAndArrowDownLeft16X16);
       }
   }
-  registerIcon('icon-arrow-up-right-and-arrow-down-left', IconArrowUpRightAndArrowDownLeft);
+  registerIconSvg('icon-arrow-up-right-and-arrow-down-left', IconArrowUpRightAndArrowDownLeft);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowUpRightFromSquare' icon
    */
-  class IconArrowUpRightFromSquare extends Icon {
+  class IconArrowUpRightFromSquare extends IconSvg {
       constructor() {
           super(arrowUpRightFromSquare16X16);
       }
   }
-  registerIcon('icon-arrow-up-right-from-square', IconArrowUpRightFromSquare);
+  registerIconSvg('icon-arrow-up-right-from-square', IconArrowUpRightFromSquare);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowUpTwoRectangles' icon
    */
-  class IconArrowUpTwoRectangles extends Icon {
+  class IconArrowUpTwoRectangles extends IconSvg {
       constructor() {
           super(arrowUpTwoRectangles);
       }
   }
-  registerIcon('icon-arrow-up-two-rectangles', IconArrowUpTwoRectangles);
+  registerIconSvg('icon-arrow-up-two-rectangles', IconArrowUpTwoRectangles);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowsMaximize' icon
    */
-  class IconArrowsMaximize extends Icon {
+  class IconArrowsMaximize extends IconSvg {
       constructor() {
           super(arrowsMaximize16X16);
       }
   }
-  registerIcon('icon-arrows-maximize', IconArrowsMaximize);
+  registerIconSvg('icon-arrows-maximize', IconArrowsMaximize);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowsRepeat' icon
    */
-  class IconArrowsRepeat extends Icon {
+  class IconArrowsRepeat extends IconSvg {
       constructor() {
           super(arrowsRepeat16X16);
       }
   }
-  registerIcon('icon-arrows-repeat', IconArrowsRepeat);
+  registerIconSvg('icon-arrows-repeat', IconArrowsRepeat);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'arrowsRotateReverseDot' icon
    */
-  class IconArrowsRotateReverseDot extends Icon {
+  class IconArrowsRotateReverseDot extends IconSvg {
       constructor() {
           super(arrowsRotateReverseDot16X16);
       }
   }
-  registerIcon('icon-arrows-rotate-reverse-dot', IconArrowsRotateReverseDot);
+  registerIconSvg('icon-arrows-rotate-reverse-dot', IconArrowsRotateReverseDot);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'at' icon
    */
-  class IconAt extends Icon {
+  class IconAt extends IconSvg {
       constructor() {
           super(at16X16);
       }
   }
-  registerIcon('icon-at', IconAt);
+  registerIconSvg('icon-at', IconAt);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'bars' icon
    */
-  class IconBars extends Icon {
+  class IconBars extends IconSvg {
       constructor() {
           super(bars16X16);
       }
   }
-  registerIcon('icon-bars', IconBars);
+  registerIconSvg('icon-bars', IconBars);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'bell' icon
    */
-  class IconBell extends Icon {
+  class IconBell extends IconSvg {
       constructor() {
           super(bell16X16);
       }
   }
-  registerIcon('icon-bell', IconBell);
+  registerIconSvg('icon-bell', IconBell);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'bellAndComment' icon
    */
-  class IconBellAndComment extends Icon {
+  class IconBellAndComment extends IconSvg {
       constructor() {
           super(bellAndComment16X16);
       }
   }
-  registerIcon('icon-bell-and-comment', IconBellAndComment);
+  registerIconSvg('icon-bell-and-comment', IconBellAndComment);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'bellAndMessage' icon
    */
-  class IconBellAndMessage extends Icon {
+  class IconBellAndMessage extends IconSvg {
       constructor() {
           super(bellAndMessage16X16);
       }
   }
-  registerIcon('icon-bell-and-message', IconBellAndMessage);
+  registerIconSvg('icon-bell-and-message', IconBellAndMessage);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'bellCheck' icon
    */
-  class IconBellCheck extends Icon {
+  class IconBellCheck extends IconSvg {
       constructor() {
           super(bellCheck16X16);
       }
   }
-  registerIcon('icon-bell-check', IconBellCheck);
+  registerIconSvg('icon-bell-check', IconBellCheck);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'bellCircle' icon
    */
-  class IconBellCircle extends Icon {
+  class IconBellCircle extends IconSvg {
       constructor() {
           super(bellCircle16X16);
       }
   }
-  registerIcon('icon-bell-circle', IconBellCircle);
+  registerIconSvg('icon-bell-circle', IconBellCircle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'bellOn' icon
    */
-  class IconBellOn extends Icon {
+  class IconBellOn extends IconSvg {
       constructor() {
           super(bellOn16X16);
       }
   }
-  registerIcon('icon-bell-on', IconBellOn);
+  registerIconSvg('icon-bell-on', IconBellOn);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'bellSolidCircle' icon
    */
-  class IconBellSolidCircle extends Icon {
+  class IconBellSolidCircle extends IconSvg {
       constructor() {
           super(bellSolidCircle16X16);
       }
   }
-  registerIcon('icon-bell-solid-circle', IconBellSolidCircle);
+  registerIconSvg('icon-bell-solid-circle', IconBellSolidCircle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'blockWithRibbon' icon
    */
-  class IconBlockWithRibbon extends Icon {
+  class IconBlockWithRibbon extends IconSvg {
       constructor() {
           super(blockWithRibbon16X16);
       }
   }
-  registerIcon('icon-block-with-ribbon', IconBlockWithRibbon);
+  registerIconSvg('icon-block-with-ribbon', IconBlockWithRibbon);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'boldB' icon
    */
-  class IconBoldB extends Icon {
+  class IconBoldB extends IconSvg {
       constructor() {
           super(boldB16X16);
       }
   }
-  registerIcon('icon-bold-b', IconBoldB);
+  registerIconSvg('icon-bold-b', IconBoldB);
   const iconBoldBTag = 'nimble-icon-bold-b';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -23158,1092 +23132,1092 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'bookMagnifyingGlass' icon
    */
-  class IconBookMagnifyingGlass extends Icon {
+  class IconBookMagnifyingGlass extends IconSvg {
       constructor() {
           super(bookMagnifyingGlass16X16);
       }
   }
-  registerIcon('icon-book-magnifying-glass', IconBookMagnifyingGlass);
+  registerIconSvg('icon-book-magnifying-glass', IconBookMagnifyingGlass);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarArrowsRotateReverseDot' icon
    */
-  class IconCalendarArrowsRotateReverseDot extends Icon {
+  class IconCalendarArrowsRotateReverseDot extends IconSvg {
       constructor() {
           super(calendarArrowsRotateReverseDot16X16);
       }
   }
-  registerIcon('icon-calendar-arrows-rotate-reverse-dot', IconCalendarArrowsRotateReverseDot);
+  registerIconSvg('icon-calendar-arrows-rotate-reverse-dot', IconCalendarArrowsRotateReverseDot);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarCheckLines' icon
    */
-  class IconCalendarCheckLines extends Icon {
+  class IconCalendarCheckLines extends IconSvg {
       constructor() {
           super(calendarCheckLines16X16);
       }
   }
-  registerIcon('icon-calendar-check-lines', IconCalendarCheckLines);
+  registerIconSvg('icon-calendar-check-lines', IconCalendarCheckLines);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarCircleExclamation' icon
    */
-  class IconCalendarCircleExclamation extends Icon {
+  class IconCalendarCircleExclamation extends IconSvg {
       constructor() {
           super(calendarCircleExclamation16X16);
       }
   }
-  registerIcon('icon-calendar-circle-exclamation', IconCalendarCircleExclamation);
+  registerIconSvg('icon-calendar-circle-exclamation', IconCalendarCircleExclamation);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarClock' icon
    */
-  class IconCalendarClock extends Icon {
+  class IconCalendarClock extends IconSvg {
       constructor() {
           super(calendarClock16X16);
       }
   }
-  registerIcon('icon-calendar-clock', IconCalendarClock);
+  registerIconSvg('icon-calendar-clock', IconCalendarClock);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarDay' icon
    */
-  class IconCalendarDay extends Icon {
+  class IconCalendarDay extends IconSvg {
       constructor() {
           super(calendarDay16X16);
       }
   }
-  registerIcon('icon-calendar-day', IconCalendarDay);
+  registerIconSvg('icon-calendar-day', IconCalendarDay);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarDayOutline' icon
    */
-  class IconCalendarDayOutline extends Icon {
+  class IconCalendarDayOutline extends IconSvg {
       constructor() {
           super(calendarDayOutline16X16);
       }
   }
-  registerIcon('icon-calendar-day-outline', IconCalendarDayOutline);
+  registerIconSvg('icon-calendar-day-outline', IconCalendarDayOutline);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarDays' icon
    */
-  class IconCalendarDays extends Icon {
+  class IconCalendarDays extends IconSvg {
       constructor() {
           super(calendarDays16X16);
       }
   }
-  registerIcon('icon-calendar-days', IconCalendarDays);
+  registerIconSvg('icon-calendar-days', IconCalendarDays);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarLines' icon
    */
-  class IconCalendarLines extends Icon {
+  class IconCalendarLines extends IconSvg {
       constructor() {
           super(calendarLines16X16);
       }
   }
-  registerIcon('icon-calendar-lines', IconCalendarLines);
+  registerIconSvg('icon-calendar-lines', IconCalendarLines);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarRectangle' icon
    */
-  class IconCalendarRectangle extends Icon {
+  class IconCalendarRectangle extends IconSvg {
       constructor() {
           super(calendarRectangle16X16);
       }
   }
-  registerIcon('icon-calendar-rectangle', IconCalendarRectangle);
+  registerIconSvg('icon-calendar-rectangle', IconCalendarRectangle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calendarWeek' icon
    */
-  class IconCalendarWeek extends Icon {
+  class IconCalendarWeek extends IconSvg {
       constructor() {
           super(calendarWeek16X16);
       }
   }
-  registerIcon('icon-calendar-week', IconCalendarWeek);
+  registerIconSvg('icon-calendar-week', IconCalendarWeek);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'calipers' icon
    */
-  class IconCalipers extends Icon {
+  class IconCalipers extends IconSvg {
       constructor() {
           super(calipers16X16);
       }
   }
-  registerIcon('icon-calipers', IconCalipers);
+  registerIconSvg('icon-calipers', IconCalipers);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'camera' icon
    */
-  class IconCamera extends Icon {
+  class IconCamera extends IconSvg {
       constructor() {
           super(camera16X16);
       }
   }
-  registerIcon('icon-camera', IconCamera);
+  registerIconSvg('icon-camera', IconCamera);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'chartDiagram' icon
    */
-  class IconChartDiagram extends Icon {
+  class IconChartDiagram extends IconSvg {
       constructor() {
           super(chartDiagram16X16);
       }
   }
-  registerIcon('icon-chart-diagram', IconChartDiagram);
+  registerIconSvg('icon-chart-diagram', IconChartDiagram);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'chartDiagramChildFocus' icon
    */
-  class IconChartDiagramChildFocus extends Icon {
+  class IconChartDiagramChildFocus extends IconSvg {
       constructor() {
           super(chartDiagramChildFocus16X16);
       }
   }
-  registerIcon('icon-chart-diagram-child-focus', IconChartDiagramChildFocus);
+  registerIconSvg('icon-chart-diagram-child-focus', IconChartDiagramChildFocus);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'chartDiagramParentFocus' icon
    */
-  class IconChartDiagramParentFocus extends Icon {
+  class IconChartDiagramParentFocus extends IconSvg {
       constructor() {
           super(chartDiagramParentFocus16X16);
       }
   }
-  registerIcon('icon-chart-diagram-parent-focus', IconChartDiagramParentFocus);
+  registerIconSvg('icon-chart-diagram-parent-focus', IconChartDiagramParentFocus);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'chartDiagramParentFocusTwoChild' icon
    */
-  class IconChartDiagramParentFocusTwoChild extends Icon {
+  class IconChartDiagramParentFocusTwoChild extends IconSvg {
       constructor() {
           super(chartDiagramParentFocusTwoChild16X16);
       }
   }
-  registerIcon('icon-chart-diagram-parent-focus-two-child', IconChartDiagramParentFocusTwoChild);
+  registerIconSvg('icon-chart-diagram-parent-focus-two-child', IconChartDiagramParentFocusTwoChild);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'check' icon
    */
-  class IconCheck extends Icon {
+  class IconCheck extends IconSvg {
       constructor() {
           super(check16X16);
       }
   }
-  registerIcon('icon-check', IconCheck);
+  registerIconSvg('icon-check', IconCheck);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'checkDot' icon
    */
-  class IconCheckDot extends Icon {
+  class IconCheckDot extends IconSvg {
       constructor() {
           super(checkDot16X16);
       }
   }
-  registerIcon('icon-check-dot', IconCheckDot);
+  registerIconSvg('icon-check-dot', IconCheckDot);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'circle' icon
    */
-  class IconCircle extends Icon {
+  class IconCircle extends IconSvg {
       constructor() {
           super(circle16X16);
       }
   }
-  registerIcon('icon-circle', IconCircle);
+  registerIconSvg('icon-circle', IconCircle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'circleBroken' icon
    */
-  class IconCircleBroken extends Icon {
+  class IconCircleBroken extends IconSvg {
       constructor() {
           super(circleBroken16X16);
       }
   }
-  registerIcon('icon-circle-broken', IconCircleBroken);
+  registerIconSvg('icon-circle-broken', IconCircleBroken);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'circleCheck' icon
    */
-  class IconCircleCheck extends Icon {
+  class IconCircleCheck extends IconSvg {
       constructor() {
           super(circleCheck16X16);
       }
   }
-  registerIcon('icon-circle-check', IconCircleCheck);
+  registerIconSvg('icon-circle-check', IconCircleCheck);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'circleFilled' icon
    */
-  class IconCircleFilled extends Icon {
+  class IconCircleFilled extends IconSvg {
       constructor() {
           super(circleFilled16X16);
       }
   }
-  registerIcon('icon-circle-filled', IconCircleFilled);
+  registerIconSvg('icon-circle-filled', IconCircleFilled);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'circleMinus' icon
    */
-  class IconCircleMinus extends Icon {
+  class IconCircleMinus extends IconSvg {
       constructor() {
           super(circleMinus16X16);
       }
   }
-  registerIcon('icon-circle-minus', IconCircleMinus);
+  registerIconSvg('icon-circle-minus', IconCircleMinus);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'circlePartialBroken' icon
    */
-  class IconCirclePartialBroken extends Icon {
+  class IconCirclePartialBroken extends IconSvg {
       constructor() {
           super(circlePartialBroken16X16);
       }
   }
-  registerIcon('icon-circle-partial-broken', IconCirclePartialBroken);
+  registerIconSvg('icon-circle-partial-broken', IconCirclePartialBroken);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'circleSlash' icon
    */
-  class IconCircleSlash extends Icon {
+  class IconCircleSlash extends IconSvg {
       constructor() {
           super(circleSlash16X16);
       }
   }
-  registerIcon('icon-circle-slash', IconCircleSlash);
+  registerIconSvg('icon-circle-slash', IconCircleSlash);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'circleX' icon
    */
-  class IconCircleX extends Icon {
+  class IconCircleX extends IconSvg {
       constructor() {
           super(circleX16X16);
       }
   }
-  registerIcon('icon-circle-x', IconCircleX);
+  registerIconSvg('icon-circle-x', IconCircleX);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'clipboard' icon
    */
-  class IconClipboard extends Icon {
+  class IconClipboard extends IconSvg {
       constructor() {
           super(clipboard16X16);
       }
   }
-  registerIcon('icon-clipboard', IconClipboard);
+  registerIconSvg('icon-clipboard', IconClipboard);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'clock' icon
    */
-  class IconClock extends Icon {
+  class IconClock extends IconSvg {
       constructor() {
           super(clock16X16);
       }
   }
-  registerIcon('icon-clock', IconClock);
+  registerIconSvg('icon-clock', IconClock);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'clockCog' icon
    */
-  class IconClockCog extends Icon {
+  class IconClockCog extends IconSvg {
       constructor() {
           super(clockCog16X16);
       }
   }
-  registerIcon('icon-clock-cog', IconClockCog);
+  registerIconSvg('icon-clock-cog', IconClockCog);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'clockExclamation' icon
    */
-  class IconClockExclamation extends Icon {
+  class IconClockExclamation extends IconSvg {
       constructor() {
           super(clockExclamation16X16);
       }
   }
-  registerIcon('icon-clock-exclamation', IconClockExclamation);
+  registerIconSvg('icon-clock-exclamation', IconClockExclamation);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'clockTriangle' icon
    */
-  class IconClockTriangle extends Icon {
+  class IconClockTriangle extends IconSvg {
       constructor() {
           super(clockTriangle16X16);
       }
   }
-  registerIcon('icon-clock-triangle', IconClockTriangle);
+  registerIconSvg('icon-clock-triangle', IconClockTriangle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'clone' icon
    */
-  class IconClone extends Icon {
+  class IconClone extends IconSvg {
       constructor() {
           super(clone16X16);
       }
   }
-  registerIcon('icon-clone', IconClone);
+  registerIconSvg('icon-clone', IconClone);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'cloud' icon
    */
-  class IconCloud extends Icon {
+  class IconCloud extends IconSvg {
       constructor() {
           super(cloud16X16);
       }
   }
-  registerIcon('icon-cloud', IconCloud);
+  registerIconSvg('icon-cloud', IconCloud);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'cloudUpload' icon
    */
-  class IconCloudUpload extends Icon {
+  class IconCloudUpload extends IconSvg {
       constructor() {
           super(cloudUpload16X16);
       }
   }
-  registerIcon('icon-cloud-upload', IconCloudUpload);
+  registerIconSvg('icon-cloud-upload', IconCloudUpload);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'cloudWithArrow' icon
    */
-  class IconCloudWithArrow extends Icon {
+  class IconCloudWithArrow extends IconSvg {
       constructor() {
           super(cloudWithArrow16X16);
       }
   }
-  registerIcon('icon-cloud-with-arrow', IconCloudWithArrow);
+  registerIconSvg('icon-cloud-with-arrow', IconCloudWithArrow);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'cog' icon
    */
-  class IconCog extends Icon {
+  class IconCog extends IconSvg {
       constructor() {
           super(cog16X16);
       }
   }
-  registerIcon('icon-cog', IconCog);
+  registerIconSvg('icon-cog', IconCog);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'cogDatabase' icon
    */
-  class IconCogDatabase extends Icon {
+  class IconCogDatabase extends IconSvg {
       constructor() {
           super(cogDatabase16X16);
       }
   }
-  registerIcon('icon-cog-database', IconCogDatabase);
+  registerIconSvg('icon-cog-database', IconCogDatabase);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'cogDatabaseInset' icon
    */
-  class IconCogDatabaseInset extends Icon {
+  class IconCogDatabaseInset extends IconSvg {
       constructor() {
           super(cogDatabaseInset16X16);
       }
   }
-  registerIcon('icon-cog-database-inset', IconCogDatabaseInset);
+  registerIconSvg('icon-cog-database-inset', IconCogDatabaseInset);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'cogSmallCog' icon
    */
-  class IconCogSmallCog extends Icon {
+  class IconCogSmallCog extends IconSvg {
       constructor() {
           super(cogSmallCog16X16);
       }
   }
-  registerIcon('icon-cog-small-cog', IconCogSmallCog);
+  registerIconSvg('icon-cog-small-cog', IconCogSmallCog);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'cogZoomed' icon
    */
-  class IconCogZoomed extends Icon {
+  class IconCogZoomed extends IconSvg {
       constructor() {
           super(cogZoomed16X16);
       }
   }
-  registerIcon('icon-cog-zoomed', IconCogZoomed);
+  registerIconSvg('icon-cog-zoomed', IconCogZoomed);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'comment' icon
    */
-  class IconComment extends Icon {
+  class IconComment extends IconSvg {
       constructor() {
           super(comment16X16);
       }
   }
-  registerIcon('icon-comment', IconComment);
+  registerIconSvg('icon-comment', IconComment);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'computerAndMonitor' icon
    */
-  class IconComputerAndMonitor extends Icon {
+  class IconComputerAndMonitor extends IconSvg {
       constructor() {
           super(computerAndMonitor16X16);
       }
   }
-  registerIcon('icon-computer-and-monitor', IconComputerAndMonitor);
+  registerIconSvg('icon-computer-and-monitor', IconComputerAndMonitor);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'copy' icon
    */
-  class IconCopy extends Icon {
+  class IconCopy extends IconSvg {
       constructor() {
           super(copy16X16);
       }
   }
-  registerIcon('icon-copy', IconCopy);
+  registerIconSvg('icon-copy', IconCopy);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'copyText' icon
    */
-  class IconCopyText extends Icon {
+  class IconCopyText extends IconSvg {
       constructor() {
           super(copyText16X16);
       }
   }
-  registerIcon('icon-copy-text', IconCopyText);
+  registerIconSvg('icon-copy-text', IconCopyText);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'dashboardBuilder' icon
    */
-  class IconDashboardBuilder extends Icon {
+  class IconDashboardBuilder extends IconSvg {
       constructor() {
           super(dashboardBuilder16X16);
       }
   }
-  registerIcon('icon-dashboard-builder', IconDashboardBuilder);
+  registerIconSvg('icon-dashboard-builder', IconDashboardBuilder);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'dashboardBuilderLegend' icon
    */
-  class IconDashboardBuilderLegend extends Icon {
+  class IconDashboardBuilderLegend extends IconSvg {
       constructor() {
           super(dashboardBuilderLegend16X16);
       }
   }
-  registerIcon('icon-dashboard-builder-legend', IconDashboardBuilderLegend);
+  registerIconSvg('icon-dashboard-builder-legend', IconDashboardBuilderLegend);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'dashboardBuilderTemplates' icon
    */
-  class IconDashboardBuilderTemplates extends Icon {
+  class IconDashboardBuilderTemplates extends IconSvg {
       constructor() {
           super(dashboardBuilderTemplates16X16);
       }
   }
-  registerIcon('icon-dashboard-builder-templates', IconDashboardBuilderTemplates);
+  registerIconSvg('icon-dashboard-builder-templates', IconDashboardBuilderTemplates);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'dashboardBuilderTile' icon
    */
-  class IconDashboardBuilderTile extends Icon {
+  class IconDashboardBuilderTile extends IconSvg {
       constructor() {
           super(dashboardBuilderTile16X16);
       }
   }
-  registerIcon('icon-dashboard-builder-tile', IconDashboardBuilderTile);
+  registerIconSvg('icon-dashboard-builder-tile', IconDashboardBuilderTile);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'database' icon
    */
-  class IconDatabase extends Icon {
+  class IconDatabase extends IconSvg {
       constructor() {
           super(database16X16);
       }
   }
-  registerIcon('icon-database', IconDatabase);
+  registerIconSvg('icon-database', IconDatabase);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'databaseCheck' icon
    */
-  class IconDatabaseCheck extends Icon {
+  class IconDatabaseCheck extends IconSvg {
       constructor() {
           super(databaseCheck16X16);
       }
   }
-  registerIcon('icon-database-check', IconDatabaseCheck);
+  registerIconSvg('icon-database-check', IconDatabaseCheck);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'debug' icon
    */
-  class IconDebug extends Icon {
+  class IconDebug extends IconSvg {
       constructor() {
           super(debug16X16);
       }
   }
-  registerIcon('icon-debug', IconDebug);
+  registerIconSvg('icon-debug', IconDebug);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'desktop' icon
    */
-  class IconDesktop extends Icon {
+  class IconDesktop extends IconSvg {
       constructor() {
           super(desktop16X16);
       }
   }
-  registerIcon('icon-desktop', IconDesktop);
+  registerIconSvg('icon-desktop', IconDesktop);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'diadem' icon
    */
-  class IconDiadem extends Icon {
+  class IconDiadem extends IconSvg {
       constructor() {
           super(diadem16X16);
       }
   }
-  registerIcon('icon-diadem', IconDiadem);
+  registerIconSvg('icon-diadem', IconDiadem);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'donutChart' icon
    */
-  class IconDonutChart extends Icon {
+  class IconDonutChart extends IconSvg {
       constructor() {
           super(donutChart16X16);
       }
   }
-  registerIcon('icon-donut-chart', IconDonutChart);
+  registerIconSvg('icon-donut-chart', IconDonutChart);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'dotSolidDotStroke' icon
    */
-  class IconDotSolidDotStroke extends Icon {
+  class IconDotSolidDotStroke extends IconSvg {
       constructor() {
           super(dotSolidDotStroke16X16);
       }
   }
-  registerIcon('icon-dot-solid-dot-stroke', IconDotSolidDotStroke);
+  registerIconSvg('icon-dot-solid-dot-stroke', IconDotSolidDotStroke);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'dotSolidDotStrokeMeasurement' icon
    */
-  class IconDotSolidDotStrokeMeasurement extends Icon {
+  class IconDotSolidDotStrokeMeasurement extends IconSvg {
       constructor() {
           super(dotSolidDotStrokeMeasurement16X16);
       }
   }
-  registerIcon('icon-dot-solid-dot-stroke-measurement', IconDotSolidDotStrokeMeasurement);
+  registerIconSvg('icon-dot-solid-dot-stroke-measurement', IconDotSolidDotStrokeMeasurement);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'downRightFromSquare' icon
    */
-  class IconDownRightFromSquare extends Icon {
+  class IconDownRightFromSquare extends IconSvg {
       constructor() {
           super(downRightFromSquare16X16);
       }
   }
-  registerIcon('icon-down-right-from-square', IconDownRightFromSquare);
+  registerIconSvg('icon-down-right-from-square', IconDownRightFromSquare);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'download' icon
    */
-  class IconDownload extends Icon {
+  class IconDownload extends IconSvg {
       constructor() {
           super(download16X16);
       }
   }
-  registerIcon('icon-download', IconDownload);
+  registerIconSvg('icon-download', IconDownload);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'electronicChipZoomed' icon
    */
-  class IconElectronicChipZoomed extends Icon {
+  class IconElectronicChipZoomed extends IconSvg {
       constructor() {
           super(electronicChipZoomed16X16);
       }
   }
-  registerIcon('icon-electronic-chip-zoomed', IconElectronicChipZoomed);
+  registerIconSvg('icon-electronic-chip-zoomed', IconElectronicChipZoomed);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'eye' icon
    */
-  class IconEye extends Icon {
+  class IconEye extends IconSvg {
       constructor() {
           super(eye16X16);
       }
   }
-  registerIcon('icon-eye', IconEye);
+  registerIconSvg('icon-eye', IconEye);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'eyeDash' icon
    */
-  class IconEyeDash extends Icon {
+  class IconEyeDash extends IconSvg {
       constructor() {
           super(eyeDash16X16);
       }
   }
-  registerIcon('icon-eye-dash', IconEyeDash);
+  registerIconSvg('icon-eye-dash', IconEyeDash);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'fancyA' icon
    */
-  class IconFancyA extends Icon {
+  class IconFancyA extends IconSvg {
       constructor() {
           super(fancyA16X16);
       }
   }
-  registerIcon('icon-fancy-a', IconFancyA);
+  registerIconSvg('icon-fancy-a', IconFancyA);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'file' icon
    */
-  class IconFile extends Icon {
+  class IconFile extends IconSvg {
       constructor() {
           super(file16X16);
       }
   }
-  registerIcon('icon-file', IconFile);
+  registerIconSvg('icon-file', IconFile);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'fileArrowCurvedRight' icon
    */
-  class IconFileArrowCurvedRight extends Icon {
+  class IconFileArrowCurvedRight extends IconSvg {
       constructor() {
           super(fileArrowCurvedRight16X16);
       }
   }
-  registerIcon('icon-file-arrow-curved-right', IconFileArrowCurvedRight);
+  registerIconSvg('icon-file-arrow-curved-right', IconFileArrowCurvedRight);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'fileDrawer' icon
    */
-  class IconFileDrawer extends Icon {
+  class IconFileDrawer extends IconSvg {
       constructor() {
           super(fileDrawer16X16);
       }
   }
-  registerIcon('icon-file-drawer', IconFileDrawer);
+  registerIconSvg('icon-file-drawer', IconFileDrawer);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'fileSearch' icon
    */
-  class IconFileSearch extends Icon {
+  class IconFileSearch extends IconSvg {
       constructor() {
           super(fileSearch16X16);
       }
   }
-  registerIcon('icon-file-search', IconFileSearch);
+  registerIconSvg('icon-file-search', IconFileSearch);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'filter' icon
    */
-  class IconFilter extends Icon {
+  class IconFilter extends IconSvg {
       constructor() {
           super(filter16X16);
       }
   }
-  registerIcon('icon-filter', IconFilter);
+  registerIconSvg('icon-filter', IconFilter);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'floppyDisk' icon
    */
-  class IconFloppyDisk extends Icon {
+  class IconFloppyDisk extends IconSvg {
       constructor() {
           super(floppyDisk16X16);
       }
   }
-  registerIcon('icon-floppy-disk', IconFloppyDisk);
+  registerIconSvg('icon-floppy-disk', IconFloppyDisk);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'floppyDiskCheckmark' icon
    */
-  class IconFloppyDiskCheckmark extends Icon {
+  class IconFloppyDiskCheckmark extends IconSvg {
       constructor() {
           super(floppyDiskCheckmark16X16);
       }
   }
-  registerIcon('icon-floppy-disk-checkmark', IconFloppyDiskCheckmark);
+  registerIconSvg('icon-floppy-disk-checkmark', IconFloppyDiskCheckmark);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'floppyDiskPen' icon
    */
-  class IconFloppyDiskPen extends Icon {
+  class IconFloppyDiskPen extends IconSvg {
       constructor() {
           super(floppyDiskPen16X16);
       }
   }
-  registerIcon('icon-floppy-disk-pen', IconFloppyDiskPen);
+  registerIconSvg('icon-floppy-disk-pen', IconFloppyDiskPen);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'floppyDiskStarArrowRight' icon
    */
-  class IconFloppyDiskStarArrowRight extends Icon {
+  class IconFloppyDiskStarArrowRight extends IconSvg {
       constructor() {
           super(floppyDiskStarArrowRight16X16);
       }
   }
-  registerIcon('icon-floppy-disk-star-arrow-right', IconFloppyDiskStarArrowRight);
+  registerIconSvg('icon-floppy-disk-star-arrow-right', IconFloppyDiskStarArrowRight);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'floppyDiskThreeDots' icon
    */
-  class IconFloppyDiskThreeDots extends Icon {
+  class IconFloppyDiskThreeDots extends IconSvg {
       constructor() {
           super(floppyDiskThreeDots16X16);
       }
   }
-  registerIcon('icon-floppy-disk-three-dots', IconFloppyDiskThreeDots);
+  registerIconSvg('icon-floppy-disk-three-dots', IconFloppyDiskThreeDots);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'folder' icon
    */
-  class IconFolder extends Icon {
+  class IconFolder extends IconSvg {
       constructor() {
           super(folder16X16);
       }
   }
-  registerIcon('icon-folder', IconFolder);
+  registerIconSvg('icon-folder', IconFolder);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'folderOpen' icon
    */
-  class IconFolderOpen extends Icon {
+  class IconFolderOpen extends IconSvg {
       constructor() {
           super(folderOpen16X16);
       }
   }
-  registerIcon('icon-folder-open', IconFolderOpen);
+  registerIconSvg('icon-folder-open', IconFolderOpen);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'forwardSlash' icon
    */
-  class IconForwardSlash extends Icon {
+  class IconForwardSlash extends IconSvg {
       constructor() {
           super(forwardSlash16X16);
       }
   }
-  registerIcon('icon-forward-slash', IconForwardSlash);
+  registerIconSvg('icon-forward-slash', IconForwardSlash);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'fourDotsSquare' icon
    */
-  class IconFourDotsSquare extends Icon {
+  class IconFourDotsSquare extends IconSvg {
       constructor() {
           super(fourDotsSquare16X16);
       }
   }
-  registerIcon('icon-four-dots-square', IconFourDotsSquare);
+  registerIconSvg('icon-four-dots-square', IconFourDotsSquare);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'function' icon
    */
-  class IconFunction extends Icon {
+  class IconFunction extends IconSvg {
       constructor() {
           super(function16X16);
       }
   }
-  registerIcon('icon-function', IconFunction);
+  registerIconSvg('icon-function', IconFunction);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'gaugeSimple' icon
    */
-  class IconGaugeSimple extends Icon {
+  class IconGaugeSimple extends IconSvg {
       constructor() {
           super(gaugeSimple16X16);
       }
   }
-  registerIcon('icon-gauge-simple', IconGaugeSimple);
+  registerIconSvg('icon-gauge-simple', IconGaugeSimple);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'gridThreeByThree' icon
    */
-  class IconGridThreeByThree extends Icon {
+  class IconGridThreeByThree extends IconSvg {
       constructor() {
           super(gridThreeByThree16X16);
       }
   }
-  registerIcon('icon-grid-three-by-three', IconGridThreeByThree);
+  registerIconSvg('icon-grid-three-by-three', IconGridThreeByThree);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'gridTwoByTwo' icon
    */
-  class IconGridTwoByTwo extends Icon {
+  class IconGridTwoByTwo extends IconSvg {
       constructor() {
           super(gridTwoByTwo16X16);
       }
   }
-  registerIcon('icon-grid-two-by-two', IconGridTwoByTwo);
+  registerIconSvg('icon-grid-two-by-two', IconGridTwoByTwo);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'hammer' icon
    */
-  class IconHammer extends Icon {
+  class IconHammer extends IconSvg {
       constructor() {
           super(hammer16X16);
       }
   }
-  registerIcon('icon-hammer', IconHammer);
+  registerIconSvg('icon-hammer', IconHammer);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'hashtag' icon
    */
-  class IconHashtag extends Icon {
+  class IconHashtag extends IconSvg {
       constructor() {
           super(hashtag16X16);
       }
   }
-  registerIcon('icon-hashtag', IconHashtag);
+  registerIconSvg('icon-hashtag', IconHashtag);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'home' icon
    */
-  class IconHome extends Icon {
+  class IconHome extends IconSvg {
       constructor() {
           super(home16X16);
       }
   }
-  registerIcon('icon-home', IconHome);
+  registerIconSvg('icon-home', IconHome);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'horizontalTriangleOutline' icon
    */
-  class IconHorizontalTriangleOutline extends Icon {
+  class IconHorizontalTriangleOutline extends IconSvg {
       constructor() {
           super(horizontalTriangleOutline16X16);
       }
   }
-  registerIcon('icon-horizontal-triangle-outline', IconHorizontalTriangleOutline);
+  registerIconSvg('icon-horizontal-triangle-outline', IconHorizontalTriangleOutline);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'hourglass' icon
    */
-  class IconHourglass extends Icon {
+  class IconHourglass extends IconSvg {
       constructor() {
           super(hourglass16X16);
       }
   }
-  registerIcon('icon-hourglass', IconHourglass);
+  registerIconSvg('icon-hourglass', IconHourglass);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'indent' icon
    */
-  class IconIndent extends Icon {
+  class IconIndent extends IconSvg {
       constructor() {
           super(indent16X16);
       }
   }
-  registerIcon('icon-indent', IconIndent);
+  registerIconSvg('icon-indent', IconIndent);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'indeterminantCheckbox' icon
    */
-  class IconIndeterminantCheckbox extends Icon {
+  class IconIndeterminantCheckbox extends IconSvg {
       constructor() {
           super(indeterminantCheckbox16X16);
       }
   }
-  registerIcon('icon-indeterminant-checkbox', IconIndeterminantCheckbox);
+  registerIconSvg('icon-indeterminant-checkbox', IconIndeterminantCheckbox);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'infoCircle' icon
    */
-  class IconInfoCircle extends Icon {
+  class IconInfoCircle extends IconSvg {
       constructor() {
           super(infoCircle16X16);
       }
   }
-  registerIcon('icon-info-circle', IconInfoCircle);
+  registerIconSvg('icon-info-circle', IconInfoCircle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'inwardSquaresThree' icon
    */
-  class IconInwardSquaresThree extends Icon {
+  class IconInwardSquaresThree extends IconSvg {
       constructor() {
           super(inwardSquaresThree16X16);
       }
   }
-  registerIcon('icon-inward-squares-three', IconInwardSquaresThree);
+  registerIconSvg('icon-inward-squares-three', IconInwardSquaresThree);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'italicI' icon
    */
-  class IconItalicI extends Icon {
+  class IconItalicI extends IconSvg {
       constructor() {
           super(italicI16X16);
       }
   }
-  registerIcon('icon-italic-i', IconItalicI);
+  registerIconSvg('icon-italic-i', IconItalicI);
   const iconItalicITag = 'nimble-icon-italic-i';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -24251,96 +24225,96 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'key' icon
    */
-  class IconKey extends Icon {
+  class IconKey extends IconSvg {
       constructor() {
           super(key16X16);
       }
   }
-  registerIcon('icon-key', IconKey);
+  registerIconSvg('icon-key', IconKey);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'laptop' icon
    */
-  class IconLaptop extends Icon {
+  class IconLaptop extends IconSvg {
       constructor() {
           super(laptop16X16);
       }
   }
-  registerIcon('icon-laptop', IconLaptop);
+  registerIconSvg('icon-laptop', IconLaptop);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'layerGroup' icon
    */
-  class IconLayerGroup extends Icon {
+  class IconLayerGroup extends IconSvg {
       constructor() {
           super(layerGroup16X16);
       }
   }
-  registerIcon('icon-layer-group', IconLayerGroup);
+  registerIconSvg('icon-layer-group', IconLayerGroup);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'lightbulb' icon
    */
-  class IconLightbulb extends Icon {
+  class IconLightbulb extends IconSvg {
       constructor() {
           super(lightbulb16X16);
       }
   }
-  registerIcon('icon-lightbulb', IconLightbulb);
+  registerIconSvg('icon-lightbulb', IconLightbulb);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'lightningBolt' icon
    */
-  class IconLightningBolt extends Icon {
+  class IconLightningBolt extends IconSvg {
       constructor() {
           super(lightningBolt16X16);
       }
   }
-  registerIcon('icon-lightning-bolt', IconLightningBolt);
+  registerIconSvg('icon-lightning-bolt', IconLightningBolt);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'link' icon
    */
-  class IconLink extends Icon {
+  class IconLink extends IconSvg {
       constructor() {
           super(link16X16);
       }
   }
-  registerIcon('icon-link', IconLink);
+  registerIconSvg('icon-link', IconLink);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'linkCancel' icon
    */
-  class IconLinkCancel extends Icon {
+  class IconLinkCancel extends IconSvg {
       constructor() {
           super(linkCancel16X16);
       }
   }
-  registerIcon('icon-link-cancel', IconLinkCancel);
+  registerIconSvg('icon-link-cancel', IconLinkCancel);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'list' icon
    */
-  class IconList extends Icon {
+  class IconList extends IconSvg {
       constructor() {
           super(list16X16);
       }
   }
-  registerIcon('icon-list', IconList);
+  registerIconSvg('icon-list', IconList);
   const iconListTag = 'nimble-icon-list';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -24348,48 +24322,48 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'listTree' icon
    */
-  class IconListTree extends Icon {
+  class IconListTree extends IconSvg {
       constructor() {
           super(listTree16X16);
       }
   }
-  registerIcon('icon-list-tree', IconListTree);
+  registerIconSvg('icon-list-tree', IconListTree);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'listTreeDatabase' icon
    */
-  class IconListTreeDatabase extends Icon {
+  class IconListTreeDatabase extends IconSvg {
       constructor() {
           super(listTreeDatabase16X16);
       }
   }
-  registerIcon('icon-list-tree-database', IconListTreeDatabase);
+  registerIconSvg('icon-list-tree-database', IconListTreeDatabase);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'lock' icon
    */
-  class IconLock extends Icon {
+  class IconLock extends IconSvg {
       constructor() {
           super(lock16X16);
       }
   }
-  registerIcon('icon-lock', IconLock);
+  registerIconSvg('icon-lock', IconLock);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'magnifyingGlass' icon
    */
-  class IconMagnifyingGlass extends Icon {
+  class IconMagnifyingGlass extends IconSvg {
       constructor() {
           super(magnifyingGlass16X16);
       }
   }
-  registerIcon('icon-magnifying-glass', IconMagnifyingGlass);
+  registerIconSvg('icon-magnifying-glass', IconMagnifyingGlass);
   const iconMagnifyingGlassTag = 'nimble-icon-magnifying-glass';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -24397,84 +24371,84 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'markdown' icon
    */
-  class IconMarkdown extends Icon {
+  class IconMarkdown extends IconSvg {
       constructor() {
           super(markdown16X16);
       }
   }
-  registerIcon('icon-markdown', IconMarkdown);
+  registerIconSvg('icon-markdown', IconMarkdown);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'message' icon
    */
-  class IconMessage extends Icon {
+  class IconMessage extends IconSvg {
       constructor() {
           super(message16X16);
       }
   }
-  registerIcon('icon-message', IconMessage);
+  registerIconSvg('icon-message', IconMessage);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'messageBot' icon
    */
-  class IconMessageBot extends Icon {
+  class IconMessageBot extends IconSvg {
       constructor() {
           super(messageBot16X16);
       }
   }
-  registerIcon('icon-message-bot', IconMessageBot);
+  registerIconSvg('icon-message-bot', IconMessageBot);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'messagesSparkle' icon
    */
-  class IconMessagesSparkle extends Icon {
+  class IconMessagesSparkle extends IconSvg {
       constructor() {
           super(messagesSparkle16X16);
       }
   }
-  registerIcon('icon-messages-sparkle', IconMessagesSparkle);
+  registerIconSvg('icon-messages-sparkle', IconMessagesSparkle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'microphone' icon
    */
-  class IconMicrophone extends Icon {
+  class IconMicrophone extends IconSvg {
       constructor() {
           super(microphone16X16);
       }
   }
-  registerIcon('icon-microphone', IconMicrophone);
+  registerIconSvg('icon-microphone', IconMicrophone);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'minus' icon
    */
-  class IconMinus extends Icon {
+  class IconMinus extends IconSvg {
       constructor() {
           super(minus16X16);
       }
   }
-  registerIcon('icon-minus', IconMinus);
+  registerIconSvg('icon-minus', IconMinus);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'minusWide' icon
    */
-  class IconMinusWide extends Icon {
+  class IconMinusWide extends IconSvg {
       constructor() {
           super(minusWide16X16);
       }
   }
-  registerIcon('icon-minus-wide', IconMinusWide);
+  registerIconSvg('icon-minus-wide', IconMinusWide);
   const iconMinusWideTag = 'nimble-icon-minus-wide';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -24482,60 +24456,60 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'mobile' icon
    */
-  class IconMobile extends Icon {
+  class IconMobile extends IconSvg {
       constructor() {
           super(mobile16X16);
       }
   }
-  registerIcon('icon-mobile', IconMobile);
+  registerIconSvg('icon-mobile', IconMobile);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'mountainSun' icon
    */
-  class IconMountainSun extends Icon {
+  class IconMountainSun extends IconSvg {
       constructor() {
           super(mountainSun16X16);
       }
   }
-  registerIcon('icon-mountain-sun', IconMountainSun);
+  registerIconSvg('icon-mountain-sun', IconMountainSun);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'ni' icon
    */
-  class IconNi extends Icon {
+  class IconNi extends IconSvg {
       constructor() {
           super(ni16X16);
       }
   }
-  registerIcon('icon-ni', IconNi);
+  registerIconSvg('icon-ni', IconNi);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'notebook' icon
    */
-  class IconNotebook extends Icon {
+  class IconNotebook extends IconSvg {
       constructor() {
           super(notebook16X16);
       }
   }
-  registerIcon('icon-notebook', IconNotebook);
+  registerIconSvg('icon-notebook', IconNotebook);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'numberList' icon
    */
-  class IconNumberList extends Icon {
+  class IconNumberList extends IconSvg {
       constructor() {
           super(numberList16X16);
       }
   }
-  registerIcon('icon-number-list', IconNumberList);
+  registerIconSvg('icon-number-list', IconNumberList);
   const iconNumberListTag = 'nimble-icon-number-list';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -24543,36 +24517,36 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'outdent' icon
    */
-  class IconOutdent extends Icon {
+  class IconOutdent extends IconSvg {
       constructor() {
           super(outdent16X16);
       }
   }
-  registerIcon('icon-outdent', IconOutdent);
+  registerIconSvg('icon-outdent', IconOutdent);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'outwardSquaresThree' icon
    */
-  class IconOutwardSquaresThree extends Icon {
+  class IconOutwardSquaresThree extends IconSvg {
       constructor() {
           super(outwardSquaresThree16X16);
       }
   }
-  registerIcon('icon-outward-squares-three', IconOutwardSquaresThree);
+  registerIconSvg('icon-outward-squares-three', IconOutwardSquaresThree);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'paperPlane' icon
    */
-  class IconPaperPlane extends Icon {
+  class IconPaperPlane extends IconSvg {
       constructor() {
           super(paperPlane16X16);
       }
   }
-  registerIcon('icon-paper-plane', IconPaperPlane);
+  registerIconSvg('icon-paper-plane', IconPaperPlane);
   const iconPaperPlaneTag = 'nimble-icon-paper-plane';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -24580,492 +24554,492 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'paperclip' icon
    */
-  class IconPaperclip extends Icon {
+  class IconPaperclip extends IconSvg {
       constructor() {
           super(paperclip16X16);
       }
   }
-  registerIcon('icon-paperclip', IconPaperclip);
+  registerIconSvg('icon-paperclip', IconPaperclip);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'paste' icon
    */
-  class IconPaste extends Icon {
+  class IconPaste extends IconSvg {
       constructor() {
           super(paste16X16);
       }
   }
-  registerIcon('icon-paste', IconPaste);
+  registerIconSvg('icon-paste', IconPaste);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'pause' icon
    */
-  class IconPause extends Icon {
+  class IconPause extends IconSvg {
       constructor() {
           super(pause16X16);
       }
   }
-  registerIcon('icon-pause', IconPause);
+  registerIconSvg('icon-pause', IconPause);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'pencil' icon
    */
-  class IconPencil extends Icon {
+  class IconPencil extends IconSvg {
       constructor() {
           super(pencil16X16);
       }
   }
-  registerIcon('icon-pencil', IconPencil);
+  registerIconSvg('icon-pencil', IconPencil);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'pencilToRectangle' icon
    */
-  class IconPencilToRectangle extends Icon {
+  class IconPencilToRectangle extends IconSvg {
       constructor() {
           super(pencilToRectangle);
       }
   }
-  registerIcon('icon-pencil-to-rectangle', IconPencilToRectangle);
+  registerIconSvg('icon-pencil-to-rectangle', IconPencilToRectangle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'play' icon
    */
-  class IconPlay extends Icon {
+  class IconPlay extends IconSvg {
       constructor() {
           super(play);
       }
   }
-  registerIcon('icon-play', IconPlay);
+  registerIconSvg('icon-play', IconPlay);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'potWithLid' icon
    */
-  class IconPotWithLid extends Icon {
+  class IconPotWithLid extends IconSvg {
       constructor() {
           super(potWithLid16X16);
       }
   }
-  registerIcon('icon-pot-with-lid', IconPotWithLid);
+  registerIconSvg('icon-pot-with-lid', IconPotWithLid);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'print' icon
    */
-  class IconPrint extends Icon {
+  class IconPrint extends IconSvg {
       constructor() {
           super(print);
       }
   }
-  registerIcon('icon-print', IconPrint);
+  registerIconSvg('icon-print', IconPrint);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'qrcodeRead' icon
    */
-  class IconQrcodeRead extends Icon {
+  class IconQrcodeRead extends IconSvg {
       constructor() {
           super(qrcodeRead);
       }
   }
-  registerIcon('icon-qrcode-read', IconQrcodeRead);
+  registerIconSvg('icon-qrcode-read', IconQrcodeRead);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'question' icon
    */
-  class IconQuestion extends Icon {
+  class IconQuestion extends IconSvg {
       constructor() {
           super(question16X16);
       }
   }
-  registerIcon('icon-question', IconQuestion);
+  registerIconSvg('icon-question', IconQuestion);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'rectangleCheckLines' icon
    */
-  class IconRectangleCheckLines extends Icon {
+  class IconRectangleCheckLines extends IconSvg {
       constructor() {
           super(rectangleCheckLines16X16);
       }
   }
-  registerIcon('icon-rectangle-check-lines', IconRectangleCheckLines);
+  registerIconSvg('icon-rectangle-check-lines', IconRectangleCheckLines);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'rectangleLines' icon
    */
-  class IconRectangleLines extends Icon {
+  class IconRectangleLines extends IconSvg {
       constructor() {
           super(rectangleLines16X16);
       }
   }
-  registerIcon('icon-rectangle-lines', IconRectangleLines);
+  registerIconSvg('icon-rectangle-lines', IconRectangleLines);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'runningArrow' icon
    */
-  class IconRunningArrow extends Icon {
+  class IconRunningArrow extends IconSvg {
       constructor() {
           super(runningArrow16X16);
       }
   }
-  registerIcon('icon-running-arrow', IconRunningArrow);
+  registerIconSvg('icon-running-arrow', IconRunningArrow);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'scannerGun' icon
    */
-  class IconScannerGun extends Icon {
+  class IconScannerGun extends IconSvg {
       constructor() {
           super(scannerGun16X16);
       }
   }
-  registerIcon('icon-scanner-gun', IconScannerGun);
+  registerIconSvg('icon-scanner-gun', IconScannerGun);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'screenCheckLines' icon
    */
-  class IconScreenCheckLines extends Icon {
+  class IconScreenCheckLines extends IconSvg {
       constructor() {
           super(screenCheckLines16X16);
       }
   }
-  registerIcon('icon-screen-check-lines', IconScreenCheckLines);
+  registerIconSvg('icon-screen-check-lines', IconScreenCheckLines);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'screenCheckLinesCalendar' icon
    */
-  class IconScreenCheckLinesCalendar extends Icon {
+  class IconScreenCheckLinesCalendar extends IconSvg {
       constructor() {
           super(screenCheckLinesCalendar16X16);
       }
   }
-  registerIcon('icon-screen-check-lines-calendar', IconScreenCheckLinesCalendar);
+  registerIconSvg('icon-screen-check-lines-calendar', IconScreenCheckLinesCalendar);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'server' icon
    */
-  class IconServer extends Icon {
+  class IconServer extends IconSvg {
       constructor() {
           super(server16X16);
       }
   }
-  registerIcon('icon-server', IconServer);
+  registerIconSvg('icon-server', IconServer);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'shareNodes' icon
    */
-  class IconShareNodes extends Icon {
+  class IconShareNodes extends IconSvg {
       constructor() {
           super(shareNodes16X16);
       }
   }
-  registerIcon('icon-share-nodes', IconShareNodes);
+  registerIconSvg('icon-share-nodes', IconShareNodes);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'shieldCheck' icon
    */
-  class IconShieldCheck extends Icon {
+  class IconShieldCheck extends IconSvg {
       constructor() {
           super(shieldCheck16X16);
       }
   }
-  registerIcon('icon-shield-check', IconShieldCheck);
+  registerIconSvg('icon-shield-check', IconShieldCheck);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'shieldXmark' icon
    */
-  class IconShieldXmark extends Icon {
+  class IconShieldXmark extends IconSvg {
       constructor() {
           super(shieldXmark16X16);
       }
   }
-  registerIcon('icon-shield-xmark', IconShieldXmark);
+  registerIconSvg('icon-shield-xmark', IconShieldXmark);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'signalBars' icon
    */
-  class IconSignalBars extends Icon {
+  class IconSignalBars extends IconSvg {
       constructor() {
           super(signalBars16X16);
       }
   }
-  registerIcon('icon-signal-bars', IconSignalBars);
+  registerIconSvg('icon-signal-bars', IconSignalBars);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'sineGraph' icon
    */
-  class IconSineGraph extends Icon {
+  class IconSineGraph extends IconSvg {
       constructor() {
           super(sineGraph16X16);
       }
   }
-  registerIcon('icon-sine-graph', IconSineGraph);
+  registerIconSvg('icon-sine-graph', IconSineGraph);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'skipArrow' icon
    */
-  class IconSkipArrow extends Icon {
+  class IconSkipArrow extends IconSvg {
       constructor() {
           super(skipArrow16X16);
       }
   }
-  registerIcon('icon-skip-arrow', IconSkipArrow);
+  registerIconSvg('icon-skip-arrow', IconSkipArrow);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'sparkleSwirls' icon
    */
-  class IconSparkleSwirls extends Icon {
+  class IconSparkleSwirls extends IconSvg {
       constructor() {
           super(sparkleSwirls16X16);
       }
   }
-  registerIcon('icon-sparkle-swirls', IconSparkleSwirls);
+  registerIconSvg('icon-sparkle-swirls', IconSparkleSwirls);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'sparkles' icon
    */
-  class IconSparkles extends Icon {
+  class IconSparkles extends IconSvg {
       constructor() {
           super(sparkles16X16);
       }
   }
-  registerIcon('icon-sparkles', IconSparkles);
+  registerIconSvg('icon-sparkles', IconSparkles);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'spinner' icon
    */
-  class IconSpinner extends Icon {
+  class IconSpinner extends IconSvg {
       constructor() {
           super(spinner);
       }
   }
-  registerIcon('icon-spinner', IconSpinner);
+  registerIconSvg('icon-spinner', IconSpinner);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'squareCheck' icon
    */
-  class IconSquareCheck extends Icon {
+  class IconSquareCheck extends IconSvg {
       constructor() {
           super(squareCheck16X16);
       }
   }
-  registerIcon('icon-square-check', IconSquareCheck);
+  registerIconSvg('icon-square-check', IconSquareCheck);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'squareListCog' icon
    */
-  class IconSquareListCog extends Icon {
+  class IconSquareListCog extends IconSvg {
       constructor() {
           super(squareListCog16X16);
       }
   }
-  registerIcon('icon-square-list-cog', IconSquareListCog);
+  registerIconSvg('icon-square-list-cog', IconSquareListCog);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'squareT' icon
    */
-  class IconSquareT extends Icon {
+  class IconSquareT extends IconSvg {
       constructor() {
           super(squareT16X16);
       }
   }
-  registerIcon('icon-square-t', IconSquareT);
+  registerIconSvg('icon-square-t', IconSquareT);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'squareX' icon
    */
-  class IconSquareX extends Icon {
+  class IconSquareX extends IconSvg {
       constructor() {
           super(squareX16X16);
       }
   }
-  registerIcon('icon-square-x', IconSquareX);
+  registerIconSvg('icon-square-x', IconSquareX);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'star8Point' icon
    */
-  class IconStar8Point extends Icon {
+  class IconStar8Point extends IconSvg {
       constructor() {
           super(star8Point16X16);
       }
   }
-  registerIcon('icon-star-8-point', IconStar8Point);
+  registerIconSvg('icon-star-8-point', IconStar8Point);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'stopSquare' icon
    */
-  class IconStopSquare extends Icon {
+  class IconStopSquare extends IconSvg {
       constructor() {
           super(stopSquare16X16);
       }
   }
-  registerIcon('icon-stop-square', IconStopSquare);
+  registerIconSvg('icon-stop-square', IconStopSquare);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'systemlink' icon
    */
-  class IconSystemlink extends Icon {
+  class IconSystemlink extends IconSvg {
       constructor() {
           super(systemlink16X16);
       }
   }
-  registerIcon('icon-systemlink', IconSystemlink);
+  registerIconSvg('icon-systemlink', IconSystemlink);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 't' icon
    */
-  class IconT extends Icon {
+  class IconT extends IconSvg {
       constructor() {
           super(t16X16);
       }
   }
-  registerIcon('icon-t', IconT);
+  registerIconSvg('icon-t', IconT);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'tablet' icon
    */
-  class IconTablet extends Icon {
+  class IconTablet extends IconSvg {
       constructor() {
           super(tablet16X16);
       }
   }
-  registerIcon('icon-tablet', IconTablet);
+  registerIconSvg('icon-tablet', IconTablet);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'tag' icon
    */
-  class IconTag extends Icon {
+  class IconTag extends IconSvg {
       constructor() {
           super(tag16X16);
       }
   }
-  registerIcon('icon-tag', IconTag);
+  registerIconSvg('icon-tag', IconTag);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'tags' icon
    */
-  class IconTags extends Icon {
+  class IconTags extends IconSvg {
       constructor() {
           super(tags16X16);
       }
   }
-  registerIcon('icon-tags', IconTags);
+  registerIconSvg('icon-tags', IconTags);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'targetCrosshairs' icon
    */
-  class IconTargetCrosshairs extends Icon {
+  class IconTargetCrosshairs extends IconSvg {
       constructor() {
           super(targetCrosshairs16X16);
       }
   }
-  registerIcon('icon-target-crosshairs', IconTargetCrosshairs);
+  registerIconSvg('icon-target-crosshairs', IconTargetCrosshairs);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'targetCrosshairsProgress' icon
    */
-  class IconTargetCrosshairsProgress extends Icon {
+  class IconTargetCrosshairsProgress extends IconSvg {
       constructor() {
           super(targetCrosshairsProgress16X16);
       }
   }
-  registerIcon('icon-target-crosshairs-progress', IconTargetCrosshairsProgress);
+  registerIconSvg('icon-target-crosshairs-progress', IconTargetCrosshairsProgress);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'threeCirclesAscendingContainer' icon
    */
-  class IconThreeCirclesAscendingContainer extends Icon {
+  class IconThreeCirclesAscendingContainer extends IconSvg {
       constructor() {
           super(threeCirclesAscendingContainer16X16);
       }
   }
-  registerIcon('icon-three-circles-ascending-container', IconThreeCirclesAscendingContainer);
+  registerIconSvg('icon-three-circles-ascending-container', IconThreeCirclesAscendingContainer);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'threeDotsLine' icon
    */
-  class IconThreeDotsLine extends Icon {
+  class IconThreeDotsLine extends IconSvg {
       constructor() {
           super(threeDotsLine16X16);
       }
   }
-  registerIcon('icon-three-dots-line', IconThreeDotsLine);
+  registerIconSvg('icon-three-dots-line', IconThreeDotsLine);
   const iconThreeDotsLineTag = 'nimble-icon-three-dots-line';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -25073,96 +25047,96 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'threeVerticalLines' icon
    */
-  class IconThreeVerticalLines extends Icon {
+  class IconThreeVerticalLines extends IconSvg {
       constructor() {
           super(threeVerticalLines16X16);
       }
   }
-  registerIcon('icon-three-vertical-lines', IconThreeVerticalLines);
+  registerIconSvg('icon-three-vertical-lines', IconThreeVerticalLines);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'thumbDown' icon
    */
-  class IconThumbDown extends Icon {
+  class IconThumbDown extends IconSvg {
       constructor() {
           super(thumbDown16X16);
       }
   }
-  registerIcon('icon-thumb-down', IconThumbDown);
+  registerIconSvg('icon-thumb-down', IconThumbDown);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'thumbUp' icon
    */
-  class IconThumbUp extends Icon {
+  class IconThumbUp extends IconSvg {
       constructor() {
           super(thumbUp16X16);
       }
   }
-  registerIcon('icon-thumb-up', IconThumbUp);
+  registerIconSvg('icon-thumb-up', IconThumbUp);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'thumbtack' icon
    */
-  class IconThumbtack extends Icon {
+  class IconThumbtack extends IconSvg {
       constructor() {
           super(thumbtack16X16);
       }
   }
-  registerIcon('icon-thumbtack', IconThumbtack);
+  registerIconSvg('icon-thumbtack', IconThumbtack);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'tileSize' icon
    */
-  class IconTileSize extends Icon {
+  class IconTileSize extends IconSvg {
       constructor() {
           super(tileSize16X16);
       }
   }
-  registerIcon('icon-tile-size', IconTileSize);
+  registerIconSvg('icon-tile-size', IconTileSize);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'trash' icon
    */
-  class IconTrash extends Icon {
+  class IconTrash extends IconSvg {
       constructor() {
           super(trash16X16);
       }
   }
-  registerIcon('icon-trash', IconTrash);
+  registerIconSvg('icon-trash', IconTrash);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'triangle' icon
    */
-  class IconTriangle extends Icon {
+  class IconTriangle extends IconSvg {
       constructor() {
           super(triangle16X16);
       }
   }
-  registerIcon('icon-triangle', IconTriangle);
+  registerIconSvg('icon-triangle', IconTriangle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'triangleTwoLinesHorizontal' icon
    */
-  class IconTriangleTwoLinesHorizontal extends Icon {
+  class IconTriangleTwoLinesHorizontal extends IconSvg {
       constructor() {
           super(triangleTwoLinesHorizontal);
       }
   }
-  registerIcon('icon-triangle-two-lines-horizontal', IconTriangleTwoLinesHorizontal);
+  registerIconSvg('icon-triangle-two-lines-horizontal', IconTriangleTwoLinesHorizontal);
   const iconTriangleTwoLinesHorizontalTag = 'nimble-icon-triangle-two-lines-horizontal';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -25170,24 +25144,24 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'trueFalseRectangle' icon
    */
-  class IconTrueFalseRectangle extends Icon {
+  class IconTrueFalseRectangle extends IconSvg {
       constructor() {
           super(trueFalseRectangle16X16);
       }
   }
-  registerIcon('icon-true-false-rectangle', IconTrueFalseRectangle);
+  registerIconSvg('icon-true-false-rectangle', IconTrueFalseRectangle);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'twoSquaresInBrackets' icon
    */
-  class IconTwoSquaresInBrackets extends Icon {
+  class IconTwoSquaresInBrackets extends IconSvg {
       constructor() {
           super(twoSquaresInBrackets);
       }
   }
-  registerIcon('icon-two-squares-in-brackets', IconTwoSquaresInBrackets);
+  registerIconSvg('icon-two-squares-in-brackets', IconTwoSquaresInBrackets);
   const iconTwoSquaresInBracketsTag = 'nimble-icon-two-squares-in-brackets';
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
@@ -25195,204 +25169,204 @@ so this becomes the fallback color for the slot */ ''}
   /**
    * The icon component for the 'twoTrianglesBetweenLines' icon
    */
-  class IconTwoTrianglesBetweenLines extends Icon {
+  class IconTwoTrianglesBetweenLines extends IconSvg {
       constructor() {
           super(twoTrianglesBetweenLines);
       }
   }
-  registerIcon('icon-two-triangles-between-lines', IconTwoTrianglesBetweenLines);
+  registerIconSvg('icon-two-triangles-between-lines', IconTwoTrianglesBetweenLines);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'unlink' icon
    */
-  class IconUnlink extends Icon {
+  class IconUnlink extends IconSvg {
       constructor() {
           super(unlink16X16);
       }
   }
-  registerIcon('icon-unlink', IconUnlink);
+  registerIconSvg('icon-unlink', IconUnlink);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'unlock' icon
    */
-  class IconUnlock extends Icon {
+  class IconUnlock extends IconSvg {
       constructor() {
           super(unlock16X16);
       }
   }
-  registerIcon('icon-unlock', IconUnlock);
+  registerIconSvg('icon-unlock', IconUnlock);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'upRightFromSquare' icon
    */
-  class IconUpRightFromSquare extends Icon {
+  class IconUpRightFromSquare extends IconSvg {
       constructor() {
           super(upRightFromSquare16X16);
       }
   }
-  registerIcon('icon-up-right-from-square', IconUpRightFromSquare);
+  registerIconSvg('icon-up-right-from-square', IconUpRightFromSquare);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'upload' icon
    */
-  class IconUpload extends Icon {
+  class IconUpload extends IconSvg {
       constructor() {
           super(upload16X16);
       }
   }
-  registerIcon('icon-upload', IconUpload);
+  registerIconSvg('icon-upload', IconUpload);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'user' icon
    */
-  class IconUser extends Icon {
+  class IconUser extends IconSvg {
       constructor() {
           super(user16X16);
       }
   }
-  registerIcon('icon-user', IconUser);
+  registerIconSvg('icon-user', IconUser);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'watch' icon
    */
-  class IconWatch extends Icon {
+  class IconWatch extends IconSvg {
       constructor() {
           super(watch16X16);
       }
   }
-  registerIcon('icon-watch', IconWatch);
+  registerIconSvg('icon-watch', IconWatch);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'waveform' icon
    */
-  class IconWaveform extends Icon {
+  class IconWaveform extends IconSvg {
       constructor() {
           super(waveform16X16);
       }
   }
-  registerIcon('icon-waveform', IconWaveform);
+  registerIconSvg('icon-waveform', IconWaveform);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'webviCustom' icon
    */
-  class IconWebviCustom extends Icon {
+  class IconWebviCustom extends IconSvg {
       constructor() {
           super(webviCustom16X16);
       }
   }
-  registerIcon('icon-webvi-custom', IconWebviCustom);
+  registerIconSvg('icon-webvi-custom', IconWebviCustom);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'webviHost' icon
    */
-  class IconWebviHost extends Icon {
+  class IconWebviHost extends IconSvg {
       constructor() {
           super(webviHost16X16);
       }
   }
-  registerIcon('icon-webvi-host', IconWebviHost);
+  registerIconSvg('icon-webvi-host', IconWebviHost);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'windowCode' icon
    */
-  class IconWindowCode extends Icon {
+  class IconWindowCode extends IconSvg {
       constructor() {
           super(windowCode16X16);
       }
   }
-  registerIcon('icon-window-code', IconWindowCode);
+  registerIconSvg('icon-window-code', IconWindowCode);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'windowDock' icon
    */
-  class IconWindowDock extends Icon {
+  class IconWindowDock extends IconSvg {
       constructor() {
           super(windowDock16X16);
       }
   }
-  registerIcon('icon-window-dock', IconWindowDock);
+  registerIconSvg('icon-window-dock', IconWindowDock);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'windowRestore' icon
    */
-  class IconWindowRestore extends Icon {
+  class IconWindowRestore extends IconSvg {
       constructor() {
           super(windowRestore16X16);
       }
   }
-  registerIcon('icon-window-restore', IconWindowRestore);
+  registerIconSvg('icon-window-restore', IconWindowRestore);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'windowText' icon
    */
-  class IconWindowText extends Icon {
+  class IconWindowText extends IconSvg {
       constructor() {
           super(windowText16X16);
       }
   }
-  registerIcon('icon-window-text', IconWindowText);
+  registerIconSvg('icon-window-text', IconWindowText);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'wrenchHammer' icon
    */
-  class IconWrenchHammer extends Icon {
+  class IconWrenchHammer extends IconSvg {
       constructor() {
           super(wrenchHammer16X16);
       }
   }
-  registerIcon('icon-wrench-hammer', IconWrenchHammer);
+  registerIconSvg('icon-wrench-hammer', IconWrenchHammer);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'xmark' icon
    */
-  class IconXmark extends Icon {
+  class IconXmark extends IconSvg {
       constructor() {
           super(xmark16X16);
       }
   }
-  registerIcon('icon-xmark', IconXmark);
+  registerIconSvg('icon-xmark', IconXmark);
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
    * The icon component for the 'xmarkCheck' icon
    */
-  class IconXmarkCheck extends Icon {
+  class IconXmarkCheck extends IconSvg {
       constructor() {
           super(xmarkCheck16X16);
       }
   }
-  registerIcon('icon-xmark-check', IconXmarkCheck);
+  registerIconSvg('icon-xmark-check', IconXmarkCheck);
   /**
    * Base class for label providers
@@ -36582,15 +36556,15 @@ so this becomes the fallback color for the slot */ ''}
           let updater = new ViewTreeUpdater(this, localComposition && localComposition.node, view);
           iterDeco(this.node, this.innerDeco, (widget, i, insideNode) => {
               if (widget.spec.marks)
-                  updater.syncToMarks(widget.spec.marks, inline, view);
+                  updater.syncToMarks(widget.spec.marks, inline, view, i);
               else if (widget.type.side >= 0 && !insideNode)
-                  updater.syncToMarks(i == this.node.childCount ? Mark$1.none : this.node.child(i).marks, inline, view);
+                  updater.syncToMarks(i == this.node.childCount ? Mark$1.none : this.node.child(i).marks, inline, view, i);
               // If the next node is a desc matching this widget, reuse it,
               // otherwise insert the widget as a new view desc.
               updater.placeWidget(widget, view, off);
           }, (child, outerDeco, innerDeco, i) => {
               // Make sure the wrapping mark descs match the node's marks.
-              updater.syncToMarks(child.marks, inline, view);
+              updater.syncToMarks(child.marks, inline, view, i);
               // Try several strategies for drawing this node
               let compIndex;
               if (updater.findNodeMatch(child, outerDeco, innerDeco, i)) ;
@@ -36606,7 +36580,7 @@ so this becomes the fallback color for the slot */ ''}
               off += child.nodeSize;
           });
           // Drop all remaining descs after the current position.
-          updater.syncToMarks([], inline, view);
+          updater.syncToMarks([], inline, view, 0);
           if (this.node.isTextblock)
               updater.addTextblockHacks();
           updater.destroyRest();
@@ -36996,7 +36970,7 @@ so this becomes the fallback color for the slot */ ''}
       }
       // Sync the current stack of mark descs with the given array of
       // marks, reusing existing mark descs when possible.
-      syncToMarks(marks, inline, view) {
+      syncToMarks(marks, inline, view, parentIndex) {
           let keep = 0, depth = this.stack.length >> 1;
           let maxKeep = Math.min(depth, marks.length);
           while (keep < maxKeep &&
@@ -37012,8 +36986,10 @@ so this becomes the fallback color for the slot */ ''}
           }
           while (depth < marks.length) {
               this.stack.push(this.top, this.index + 1);
-              let found = -1;
-              for (let i = this.index; i < Math.min(this.index + 3, this.top.children.length); i++) {
+              let found = -1, scanTo = this.top.children.length;
+              if (parentIndex < this.preMatch.index)
+                  scanTo = Math.min(this.index + 3, scanTo);
+              for (let i = this.index; i < scanTo; i++) {
                   let next = this.top.children[i];
                   if (next.matchesMark(marks[depth]) && !this.isLocked(next.dom)) {
                       found = i;
@@ -37209,9 +37185,7 @@ so this becomes the fallback color for the slot */ ''}
   }
   // Iterate from the end of the fragment and array of descs to find
   // directly matching ones, in order to avoid overeagerly reusing those
-  // for other nodes. Returns the fragment index of the first node that
-  // is part of the sequence of matched nodes at the end of the
-  // fragment.
+  // for other nodes.
   function preMatch(frag, parentDesc) {
       let curDesc = parentDesc, descI = curDesc.children.length;
       let fI = frag.childCount, matched = new Map, matches = [];
@@ -37234,7 +37208,6 @@ so this becomes the fallback color for the slot */ ''}
                   break outer;
               }
               else {
-                  // FIXME
                   descI = curDesc.parent.children.indexOf(curDesc);
                   curDesc = curDesc.parent;
               }
@@ -38281,6 +38254,7 @@ so this becomes the fallback color for the slot */ ''}
           this.compositionNodes = [];
           this.compositionEndedAt = -2e8;
           this.compositionID = 1;
+          this.badSafariComposition = false;
           // Set to a composition ID when there are pending changes at compositionend
           this.compositionPendingChanges = 0;
           this.domChangeCount = 0;
@@ -38727,7 +38701,9 @@ so this becomes the fallback color for the slot */ ''}
           view.input.compositionEndedAt = event.timeStamp;
           view.input.compositionPendingChanges = view.domObserver.pendingRecords().length ? view.input.compositionID : 0;
           view.input.compositionNode = null;
-          if (view.input.compositionPendingChanges)
+          if (view.input.badSafariComposition)
+              view.domObserver.forceFlush();
+          else if (view.input.compositionPendingChanges)
               Promise.resolve().then(() => view.domObserver.flush());
           view.input.compositionID++;
           scheduleComposeEnd(view, 20);
@@ -39790,15 +39766,24 @@ so this becomes the fallback color for the slot */ ''}
               new window.MutationObserver(mutations => {
                   for (let i = 0; i < mutations.length; i++)
                       this.queue.push(mutations[i]);
-                  // IE11 will sometimes (on backspacing out a single character
-                  // text node after a BR node) call the observer callback
-                  // before actually updating the DOM, which will cause
-                  // ProseMirror to miss the change (see #930)
                   if (ie$1 && ie_version <= 11 && mutations.some(m => m.type == "childList" && m.removedNodes.length ||
-                      m.type == "characterData" && m.oldValue.length > m.target.nodeValue.length))
+                      m.type == "characterData" && m.oldValue.length > m.target.nodeValue.length)) {
+                      // IE11 will sometimes (on backspacing out a single character
+                      // text node after a BR node) call the observer callback
+                      // before actually updating the DOM, which will cause
+                      // ProseMirror to miss the change (see #930)
                       this.flushSoon();
-                  else
+                  }
+                  else if (safari && view.composing && mutations.some(m => m.type == "childList" && m.target.nodeName == "TR")) {
+                      // Safari does weird stuff when finishing a composition in a
+                      // table cell, which tends to involve inserting inappropriate
+                      // nodes in the table row.
+                      view.input.badSafariComposition = true;
+                      this.flushSoon();
+                  }
+                  else {
                       this.flush();
+                  }
               });
           if (useCharData) {
               this.onCharData = e => {
@@ -39965,6 +39950,10 @@ so this becomes the fallback color for the slot */ ''}
                   view.docView.markDirty(from, to);
                   checkCSS(view);
               }
+              if (view.input.badSafariComposition) {
+                  view.input.badSafariComposition = false;
+                  fixUpBadSafariComposition(view, added);
+              }
               this.handleDOMChange(from, to, typeOver, added);
               if (view.docView && view.docView.dirty)
                   view.updateState(view.state);
@@ -40088,6 +40077,37 @@ so this becomes the fallback color for the slot */ ''}
       }
       return null;
   }
+  // Kludge for a Safari bug where, on ending a composition in an
+  // otherwise empty table cell, it randomly moves the composed text
+  // into the table row around that cell, greatly confusing everything
+  // (#188).
+  function fixUpBadSafariComposition(view, addedNodes) {
+      var _a;
+      let { focusNode, focusOffset } = view.domSelectionRange();
+      for (let node of addedNodes) {
+          if (((_a = node.parentNode) === null || _a === void 0 ? void 0 : _a.nodeName) == "TR") {
+              let nextCell = node.nextSibling;
+              while (nextCell && (nextCell.nodeName != "TD" && nextCell.nodeName != "TH"))
+                  nextCell = nextCell.nextSibling;
+              if (nextCell) {
+                  let parent = nextCell;
+                  for (;;) {
+                      let first = parent.firstChild;
+                      if (!first || first.nodeType != 1 || first.contentEditable == "false" ||
+                          /^(BR|IMG)$/.test(first.nodeName))
+                          break;
+                      parent = first;
+                  }
+                  parent.insertBefore(node, parent.firstChild);
+                  if (focusNode == node)
+                      view.domSelection().collapse(node, focusOffset);
+              }
+              else {
+                  node.parentNode.removeChild(node);
+              }
+          }
+      }
+  }
   // Note that all referencing and parsing is done with the
   // start-of-operation selection and document, since that's the one
@@ -40651,7 +40671,7 @@ so this becomes the fallback color for the slot */ ''}
                       this.docView.destroy();
                       this.docView = docViewDesc(state.doc, outerDeco, innerDeco, this.dom, this);
                   }
-                  if (chromeKludge && !this.trackWrites)
+                  if (chromeKludge && (!this.trackWrites || !this.dom.contains(this.trackWrites)))
                       forceSelUpdate = true;
               }
               // Work around for an issue where an update arriving right between
@@ -41778,6 +41798,11 @@ so this becomes the fallback color for the slot */ ''}
     navigator.userAgent.includes("Mac") && "ontouchend" in document;
   }
+  // src/utilities/isSafari.ts
+  function isSafari() {
+    return typeof navigator !== "undefined" ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent) : false;
+  }
   // src/commands/focus.ts
   var focus = (position = null, options = {}) => ({ editor, view, tr, dispatch }) => {
     options = {
@@ -41788,6 +41813,9 @@ so this becomes the fallback color for the slot */ ''}
       if (isiOS() || isAndroid()) {
         view.dom.focus();
       }
+      if (isSafari() && !isiOS() && !isAndroid()) {
+        view.dom.focus({ preventScroll: true });
+      }
       requestAnimationFrame(() => {
         if (!editor.isDestroyed) {
           view.focus();
@@ -44599,6 +44627,35 @@ so this becomes the fallback color for the slot */ ''}
         })
       );
     }
+    /**
+     * Get the composed dispatchTransaction function from all extensions.
+     * @param baseDispatch The base dispatch function (e.g. from the editor or user props)
+     * @returns A composed dispatch function
+     */
+    dispatchTransaction(baseDispatch) {
+      const { editor } = this;
+      const extensions = sortExtensions([...this.extensions].reverse());
+      return extensions.reduceRight((next, extension) => {
+        const context = {
+          name: extension.name,
+          options: extension.options,
+          storage: this.editor.extensionStorage[extension.name],
+          editor,
+          type: getSchemaTypeByName(extension.name, this.schema)
+        };
+        const dispatchTransaction = getExtensionField(
+          extension,
+          "dispatchTransaction",
+          context
+        );
+        if (!dispatchTransaction) {
+          return next;
+        }
+        return (transaction) => {
+          dispatchTransaction.call(context, { transaction, next });
+        };
+      }, baseDispatch);
+    }
     get markViews() {
       const { editor } = this;
       const { markExtensions } = splitExtensions(this.extensions);
@@ -45433,7 +45490,8 @@ img.ProseMirror-separator {
         },
         onPaste: () => null,
         onDrop: () => null,
-        onDelete: () => null
+        onDelete: () => null,
+        enableExtensionDispatchTransaction: true
       };
       this.isCapturingTransaction = false;
       this.capturedTransaction = null;
@@ -45757,15 +45815,17 @@ img.ProseMirror-separator {
      * Creates a ProseMirror view.
      */
     createView(element) {
-      var _a;
+      const { editorProps, enableExtensionDispatchTransaction } = this.options;
+      const baseDispatch = editorProps.dispatchTransaction || this.dispatchTransaction.bind(this);
+      const dispatch = enableExtensionDispatchTransaction ? this.extensionManager.dispatchTransaction(baseDispatch) : baseDispatch;
       this.editorView = new EditorView(element, {
-        ...this.options.editorProps,
+        ...editorProps,
         attributes: {
           // add `role="textbox"` to the editor element
           role: "textbox",
-          ...(_a = this.options.editorProps) == null ? void 0 : _a.attributes
+          ...editorProps == null ? void 0 : editorProps.attributes
         },
-        dispatchTransaction: this.dispatchTransaction.bind(this),
+        dispatchTransaction: dispatch,
         state: this.editorState,
         markViews: this.extensionManager.markViews,
         nodeViews: this.extensionManager.nodeViews
@@ -59407,7 +59467,7 @@ ${renderedContent}
           const link = find$1(textContent, { defaultProtocol: options.defaultProtocol }).find(
             (item) => item.isLink && item.value === textContent
           );
-          if (!textContent || !link || shouldAutoLink !== void 0 && !shouldAutoLink(link.href)) {
+          if (!textContent || !link || shouldAutoLink !== void 0 && !shouldAutoLink(link.value)) {
             return false;
           }
           return options.editor.commands.setMark(options.type, {
@@ -59474,7 +59534,22 @@ ${renderedContent}
         },
         isAllowedUri: (url, ctx) => !!isAllowedUri(url, ctx.protocols),
         validate: (url) => !!url,
-        shouldAutoLink: (url) => !!url
+        shouldAutoLink: (url) => {
+          const hasProtocol = /^[a-z][a-z0-9+.-]*:\/\//i.test(url);
+          const hasMaybeProtocol = /^[a-z][a-z0-9+.-]*:/i.test(url);
+          if (hasProtocol || hasMaybeProtocol && !url.includes("@")) {
+            return true;
+          }
+          const urlWithoutUserinfo = url.includes("@") ? url.split("@").pop() : url;
+          const hostname = urlWithoutUserinfo.split(/[/?#:]/)[0];
+          if (/^\d{1,3}(\.\d{1,3}){3}$/.test(hostname)) {
+            return false;
+          }
+          if (!/\./.test(hostname)) {
+            return false;
+          }
+          return true;
+        }
       };
     },
     addAttributes() {
@@ -60487,6 +60562,7 @@ ${nextLine.slice(indentLevel + 2)}`;
         Object.entries(HTMLAttributes).forEach(([key, value]) => {
           listItem.setAttribute(key, value);
         });
+        let prevRenderedAttributeKeys = new Set(Object.keys(HTMLAttributes));
         return {
           dom: listItem,
           contentDOM: content,
@@ -60497,6 +60573,31 @@ ${nextLine.slice(indentLevel + 2)}`;
             listItem.dataset.checked = updatedNode.attrs.checked;
             checkbox.checked = updatedNode.attrs.checked;
             updateA11Y(updatedNode);
+            const extensionAttributes = editor.extensionManager.attributes;
+            const newHTMLAttributes = getRenderedAttributes(updatedNode, extensionAttributes);
+            const newKeys = new Set(Object.keys(newHTMLAttributes));
+            const staticAttrs = this.options.HTMLAttributes;
+            prevRenderedAttributeKeys.forEach((key) => {
+              if (!newKeys.has(key)) {
+                if (key in staticAttrs) {
+                  listItem.setAttribute(key, staticAttrs[key]);
+                } else {
+                  listItem.removeAttribute(key);
+                }
+              }
+            });
+            Object.entries(newHTMLAttributes).forEach(([key, value]) => {
+              if (value === null || value === void 0) {
+                if (key in staticAttrs) {
+                  listItem.setAttribute(key, staticAttrs[key]);
+                } else {
+                  listItem.removeAttribute(key);
+                }
+              } else {
+                listItem.setAttribute(key, value);
+              }
+            });
+            prevRenderedAttributeKeys = newKeys;
             return true;
           }
         };
@@ -60730,7 +60831,8 @@ ${nextLine.slice(indentLevel + 2)}`;
     items = () => [],
     render = () => ({}),
     allow = () => true,
-    findSuggestionMatch: findSuggestionMatch2 = findSuggestionMatch
+    findSuggestionMatch: findSuggestionMatch2 = findSuggestionMatch,
+    shouldShow
   }) {
     let props;
     const renderer = render == null ? void 0 : render();
@@ -60896,7 +60998,13 @@ ${nextLine.slice(indentLevel + 2)}`;
               state,
               range: match.range,
               isActive: prev.active
-            })) {
+            }) && (!shouldShow || shouldShow({
+              editor,
+              range: match.range,
+              query: match.query,
+              text: match.text,
+              transaction
+            }))) {
               next.active = true;
               next.decorationId = prev.decorationId ? prev.decorationId : decorationId;
               next.range = match.range;
@@ -70972,7 +71080,6 @@ focus outline in that case.
     };
     const handler = createHandler(true);
     const endHandler = createHandler(false);
-    endHandler();
     element.addEventListener("scroll", handler, addEventListenerOptions);
     const registerScrollendEvent = instance.options.useScrollendEvent && supportsScrollend;
     if (registerScrollendEvent) {
@@ -71014,6 +71121,7 @@ focus outline in that case.
       this.scrollElement = null;
       this.targetWindow = null;
       this.isScrolling = false;
+      this.currentScrollToIndex = null;
       this.measurementsCache = [];
       this.itemSizeCache = /* @__PURE__ */ new Map();
       this.laneAssignments = /* @__PURE__ */ new Map();
@@ -71149,10 +71257,6 @@ focus outline in that case.
           this.elementsCache.forEach((cached) => {
             this.observer.observe(cached);
           });
-          this._scrollToOffset(this.getScrollOffset(), {
-            adjustments: void 0,
-            behavior: void 0
-          });
           this.unsubs.push(
             this.options.observeElementRect(this, (rect) => {
               this.scrollRect = rect;
@@ -71168,6 +71272,10 @@ focus outline in that case.
               this.maybeNotify();
             })
           );
+          this._scrollToOffset(this.getScrollOffset(), {
+            adjustments: void 0,
+            behavior: void 0
+          });
         }
       };
       this.getSize = () => {
@@ -71239,11 +71347,7 @@ focus outline in that case.
           };
         },
         {
-          key: false,
-          skipInitialOnChange: true,
-          onChange: () => {
-            this.notify(this.isScrolling);
-          }
+          key: false
         }
       );
       this.getMeasurements = memo(
@@ -71270,7 +71374,7 @@ focus outline in that case.
             this.laneAssignments.clear();
             this.pendingMeasuredCacheIndexes = [];
           }
-          if (this.measurementsCache.length === 0) {
+          if (this.measurementsCache.length === 0 && !this.lanesSettling) {
             this.measurementsCache = this.options.initialMeasurementsCache;
             this.measurementsCache.forEach((item) => {
               this.itemSizeCache.set(item.key, item.size);
@@ -71475,7 +71579,17 @@ focus outline in that case.
           )]
         );
       };
+      this.getMaxScrollOffset = () => {
+        if (!this.scrollElement) return 0;
+        if ("scrollHeight" in this.scrollElement) {
+          return this.options.horizontal ? this.scrollElement.scrollWidth - this.scrollElement.clientWidth : this.scrollElement.scrollHeight - this.scrollElement.clientHeight;
+        } else {
+          const doc = this.scrollElement.document.documentElement;
+          return this.options.horizontal ? doc.scrollWidth - this.scrollElement.innerWidth : doc.scrollHeight - this.scrollElement.innerHeight;
+        }
+      };
       this.getOffsetForAlignment = (toOffset, align, itemSize = 0) => {
+        if (!this.scrollElement) return 0;
         const size = this.getSize();
         const scrollOffset = this.getScrollOffset();
         if (align === "auto") {
@@ -71486,7 +71600,7 @@ focus outline in that case.
         } else if (align === "end") {
           toOffset -= size;
         }
-        const maxOffset = this.getTotalSize() + this.options.scrollMargin - size;
+        const maxOffset = this.getMaxScrollOffset();
         return Math.max(Math.min(maxOffset, toOffset), 0);
       };
       this.getOffsetForIndex = (index, align = "auto") => {
@@ -71506,6 +71620,9 @@ focus outline in that case.
             return [scrollOffset, align];
           }
         }
+        if (align === "end" && index === this.options.count - 1) {
+          return [this.getMaxScrollOffset(), align];
+        }
         const toOffset = align === "end" ? item.end + this.options.scrollPaddingEnd : item.start - this.options.scrollPaddingStart;
         return [
           this.getOffsetForAlignment(toOffset, align, item.size),
@@ -71531,6 +71648,7 @@ focus outline in that case.
           );
         }
         index = Math.max(0, Math.min(index, this.options.count - 1));
+        this.currentScrollToIndex = index;
         let attempts = 0;
         const maxAttempts = 10;
         const tryScroll = (currentAlign) => {
@@ -71543,19 +71661,28 @@ focus outline in that case.
           const [offset, align] = offsetInfo;
           this._scrollToOffset(offset, { adjustments: void 0, behavior });
           this.targetWindow.requestAnimationFrame(() => {
-            const currentOffset = this.getScrollOffset();
-            const afterInfo = this.getOffsetForIndex(index, align);
-            if (!afterInfo) {
-              console.warn("Failed to get offset for index:", index);
-              return;
-            }
-            if (!approxEqual(afterInfo[0], currentOffset)) {
-              scheduleRetry(align);
+            const verify = () => {
+              if (this.currentScrollToIndex !== index) return;
+              const currentOffset = this.getScrollOffset();
+              const afterInfo = this.getOffsetForIndex(index, align);
+              if (!afterInfo) {
+                console.warn("Failed to get offset for index:", index);
+                return;
+              }
+              if (!approxEqual(afterInfo[0], currentOffset)) {
+                scheduleRetry(align);
+              }
+            };
+            if (this.isDynamicMode()) {
+              this.targetWindow.requestAnimationFrame(verify);
+            } else {
+              verify();
             }
           });
         };
         const scheduleRetry = (align) => {
           if (!this.targetWindow) return;
+          if (this.currentScrollToIndex !== index) return;
           attempts++;
           if (attempts < maxAttempts) {
             if (this.options.debug) {
@@ -77138,7 +77265,7 @@ focus outline in that case.
           });
       }
       resolveOptions(options) {
-          if (!options || options.numberTextFormat === NumberTextFormat.default) {
+          if (options?.numberTextFormat === NumberTextFormat.default) {
               return {
                   numberTextFormat: NumberTextFormat.default,
                   decimalDigits: undefined,
@@ -94031,8 +94158,8 @@ focus outline in that case.
   // significant digits p, where x is positive and p is in [1, 21] or undefined.
   // For example, formatDecimalParts(1.23) returns ["123", 0].
   function formatDecimalParts(x, p) {
-    if ((i = (x = p ? x.toExponential(p - 1) : x.toExponential()).indexOf("e")) < 0) return null; // NaN, ±Infinity
-    var i, coefficient = x.slice(0, i);
+    if (!isFinite(x) || x === 0) return null; // NaN, ±Infinity, ±0
+    var i = (x = p ? x.toExponential(p - 1) : x.toExponential()).indexOf("e"), coefficient = x.slice(0, i);
     // The string returned by toExponential either has the form \d\.\d+e[-+]\d+
     // (e.g., 1.2e+3) or the form \de[-+]\d+ (e.g., 1e+3).
@@ -94137,7 +94264,7 @@ focus outline in that case.
   function formatPrefixAuto(x, p) {
     var d = formatDecimalParts(x, p);
-    if (!d) return x + "";
+    if (!d) return prefixExponent = undefined, x.toPrecision(p);
     var coefficient = d[0],
         exponent = d[1],
         i = exponent - (prefixExponent = Math.max(-8, Math.min(8, Math.floor(exponent / 3))) * 3) + 1,
@@ -94191,7 +94318,7 @@ focus outline in that case.
         minus = locale.minus === undefined ? "−" : locale.minus + "",
         nan = locale.nan === undefined ? "NaN" : locale.nan + "";
-    function newFormat(specifier) {
+    function newFormat(specifier, options) {
       specifier = formatSpecifier(specifier);
       var fill = specifier.fill,
@@ -94216,8 +94343,8 @@ focus outline in that case.
       // Compute the prefix and suffix.
       // For SI-prefix, the suffix is lazily computed.
-      var prefix = symbol === "$" ? currencyPrefix : symbol === "#" && /[boxX]/.test(type) ? "0" + type.toLowerCase() : "",
-          suffix = symbol === "$" ? currencySuffix : /[%p]/.test(type) ? percent : "";
+      var prefix = (options && options.prefix !== undefined ? options.prefix : "") + (symbol === "$" ? currencyPrefix : symbol === "#" && /[boxX]/.test(type) ? "0" + type.toLowerCase() : ""),
+          suffix = (symbol === "$" ? currencySuffix : /[%p]/.test(type) ? percent : "") + (options && options.suffix !== undefined ? options.suffix : "");
       // What format function should we use?
       // Is this an integer type?
@@ -94258,7 +94385,7 @@ focus outline in that case.
           // Compute the prefix and suffix.
           valuePrefix = (valueNegative ? (sign === "(" ? sign : minus) : sign === "-" || sign === "(" ? "" : sign) + valuePrefix;
-          valueSuffix = (type === "s" ? prefixes[8 + prefixExponent / 3] : "") + valueSuffix + (valueNegative && sign === "(" ? ")" : "");
+          valueSuffix = (type === "s" && !isNaN(value) && prefixExponent !== undefined ? prefixes[8 + prefixExponent / 3] : "") + valueSuffix + (valueNegative && sign === "(" ? ")" : "");
           // Break the formatted value into the integer “value” part that can be
           // grouped, and fractional or exponential “suffix” part that is not.
@@ -94303,12 +94430,11 @@ focus outline in that case.
     }
     function formatPrefix(specifier, value) {
-      var f = newFormat((specifier = formatSpecifier(specifier), specifier.type = "f", specifier)),
-          e = Math.max(-8, Math.min(8, Math.floor(exponent(value) / 3))) * 3,
+      var e = Math.max(-8, Math.min(8, Math.floor(exponent(value) / 3))) * 3,
           k = Math.pow(10, -e),
-          prefix = prefixes[8 + e / 3];
+          f = newFormat((specifier = formatSpecifier(specifier), specifier.type = "f", specifier), {suffix: prefixes[8 + e / 3]});
       return function(value) {
-        return f(k * value) + prefix;
+        return f(k * value);
       };
     }