@ni/ok-components 0.0.2 → 0.0.4

package/dist/all-components-bundle.js

@@ -358,9 +358,12 @@
        * If the value is true, the attribute is added; otherwise it is removed.
        */
       setBooleanAttribute(element, attributeName, value) {
-          value
-              ? element.setAttribute(attributeName, "")
-              : element.removeAttribute(attributeName);
+          if (value) {
+              element.setAttribute(attributeName, "");
+          }
+          else {
+              element.removeAttribute(attributeName);
+          }
       },
       /**
        * Removes all the child nodes of the provided parent node.
@@ -1809,7 +1812,7 @@
               }
           };
       }
-      catch (e) {
+      catch (_a) {
           // Do nothing if an error is thrown, the default
           // case handles FrozenArray.
       }
@@ -2395,9 +2398,14 @@
               const behavior = behaviors[i];
               if (targetBehaviors.has(behavior)) {
                   const count = targetBehaviors.get(behavior) - 1;
-                  count === 0 || force
-                      ? targetBehaviors.delete(behavior) && behaviorsToUnbind.push(behavior)
-                      : targetBehaviors.set(behavior, count);
+                  if (count === 0 || force) {
+                      if (targetBehaviors.delete(behavior)) {
+                          behaviorsToUnbind.push(behavior);
+                      }
+                  }
+                  else {
+                      targetBehaviors.set(behavior, count);
+                  }
               }
           }
           if (this._isConnected) {
@@ -5311,7 +5319,7 @@
           styleElement.sheet.insertRule("foo:focus-visible {color:inherit}", 0);
           _canUseFocusVisible = true;
       }
-      catch (e) {
+      catch (_a) {
           _canUseFocusVisible = false;
       }
       finally {
@@ -6781,20 +6789,6 @@
   ], BreadcrumbItem$1.prototype, "separator", void 0);
   applyMixins(BreadcrumbItem$1, StartEnd, DelegatesARIALink);
 
-  /**
-   * The template for the {@link @ni/fast-foundation#Breadcrumb} component.
-   * @public
-   */
-  const breadcrumbTemplate = (context, definition) => html `
-    <template role="navigation">
-        <div role="list" class="list" part="list">
-            <slot
-                ${slotted({ property: "slottedBreadcrumbItems", filter: elements() })}
-            ></slot>
-        </div>
-    </template>
-`;
-
   /**
    * A Breadcrumb Custom HTML Element.
    * @slot - The default slot for the breadcrumb items
@@ -6847,14 +6841,20 @@
           if (childNodeWithHref === null &&
               item.hasAttribute("href") &&
               item instanceof BreadcrumbItem$1) {
-              isLastNode
-                  ? item.setAttribute("aria-current", "page")
-                  : item.removeAttribute("aria-current");
+              if (isLastNode) {
+                  item.setAttribute("aria-current", "page");
+              }
+              else {
+                  item.removeAttribute("aria-current");
+              }
           }
           else if (childNodeWithHref !== null) {
-              isLastNode
-                  ? childNodeWithHref.setAttribute("aria-current", "page")
-                  : childNodeWithHref.removeAttribute("aria-current");
+              if (isLastNode) {
+                  childNodeWithHref.setAttribute("aria-current", "page");
+              }
+              else {
+                  childNodeWithHref.removeAttribute("aria-current");
+              }
           }
       }
   };
@@ -7427,9 +7427,12 @@
               }
               // Browser support for requestSubmit is not comprehensive
               // so click the proxy if it isn't supported
-              typeof this.form.requestSubmit === "function"
-                  ? this.form.requestSubmit(this.proxy)
-                  : this.proxy.click();
+              if (typeof this.form.requestSubmit === "function") {
+                  this.form.requestSubmit(this.proxy);
+              }
+              else {
+                  this.proxy.click();
+              }
               if (!attached) {
                   this.detachProxy();
               }
@@ -7487,10 +7490,14 @@
           if (this.proxy instanceof HTMLInputElement) {
               this.proxy.type = this.type;
           }
-          next === "submit" && this.addEventListener("click", this.handleSubmission);
-          previous === "submit" && this.removeEventListener("click", this.handleSubmission);
-          next === "reset" && this.addEventListener("click", this.handleFormReset);
-          previous === "reset" && this.removeEventListener("click", this.handleFormReset);
+          if (next === "submit")
+              this.addEventListener("click", this.handleSubmission);
+          if (previous === "submit")
+              this.removeEventListener("click", this.handleSubmission);
+          if (next === "reset")
+              this.addEventListener("click", this.handleFormReset);
+          if (previous === "reset")
+              this.removeEventListener("click", this.handleFormReset);
       }
       /** {@inheritDoc (FormAssociated:interface).validate} */
       validate() {
@@ -12763,9 +12770,12 @@
           if (this.proxy instanceof HTMLInputElement) {
               this.proxy.readOnly = this.readOnly;
           }
-          this.readOnly
-              ? this.classList.add("readonly")
-              : this.classList.remove("readonly");
+          if (this.readOnly) {
+              this.classList.add("readonly");
+          }
+          else {
+              this.classList.remove("readonly");
+          }
       }
       constructor() {
           super();
@@ -12808,7 +12818,12 @@
           /**
            * @deprecated - this behavior already exists in the template and should not exist in the class.
            */
-          this.checked ? this.classList.add("checked") : this.classList.remove("checked");
+          if (this.checked) {
+              this.classList.add("checked");
+          }
+          else {
+              this.classList.remove("checked");
+          }
       }
   };
   __decorate([
@@ -12952,9 +12967,12 @@
                   tab.style[gridHorizontalProperty] = "";
                   tab.style[gridVerticalProperty] = "";
                   tab.style[gridProperty] = `${index + 1}`;
-                  !this.isHorizontal()
-                      ? tab.classList.add("vertical")
-                      : tab.classList.remove("vertical");
+                  if (!this.isHorizontal()) {
+                      tab.classList.add("vertical");
+                  }
+                  else {
+                      tab.classList.remove("vertical");
+                  }
               });
           };
           this.setTabPanels = () => {
@@ -12963,9 +12981,12 @@
                   const tabpanelId = this.tabpanelIds[index];
                   tabpanel.setAttribute("id", tabpanelId);
                   tabpanel.setAttribute("aria-labelledby", tabId);
-                  this.activeTabIndex !== index
-                      ? tabpanel.setAttribute("hidden", "")
-                      : tabpanel.removeAttribute("hidden");
+                  if (this.activeTabIndex !== index) {
+                      tabpanel.setAttribute("hidden", "");
+                  }
+                  else {
+                      tabpanel.removeAttribute("hidden");
+                  }
               });
           };
           this.handleTabClick = (event) => {
@@ -16371,25 +16392,25 @@
   createFontTokens(tokenNames.headlineFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Headline1Family, Headline1Weight, Headline1Size, Headline1LineHeight);
   createFontTokens(tokenNames.headlinePlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Headline2Family, Headline2Weight, Headline2Size, Headline2LineHeight);
   createFontTokens(tokenNames.titlePlus2Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Title3Family, Title3Weight, Title3Size, Title3LineHeight);
-  const [titlePlus1Font, titlePlus1FontColor, titlePlus1DisabledFontColor, titlePlus1FontFamily, titlePlus1FontWeight, titlePlus1FontSize, titlePlus1FontLineHeight] = createFontTokens(tokenNames.titlePlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Title2Family, Title2Weight, Title2Size, Title2LineHeight);
+  const [titlePlus1Font, titlePlus1FontColor] = createFontTokens(tokenNames.titlePlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Title2Family, Title2Weight, Title2Size, Title2LineHeight);
   createFontTokens(tokenNames.titleFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Title1Family, Title1Weight, Title1Size, Title1LineHeight);
-  const [subtitlePlus1Font, subtitlePlus1FontColor, subtitlePlus1DisabledFontColor, subtitlePlus1FontFamily, subtitlePlus1FontWeight, subtitlePlus1FontSize, subtitlePlus1FontLineHeight] = createFontTokens(tokenNames.subtitlePlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Subtitle2Family, Subtitle2Weight, Subtitle2Size, Subtitle2LineHeight);
-  const [subtitleFont, subtitleFontColor, subtitleDisabledFontColor, subtitleFontFamily, subtitleFontWeight, subtitleFontSize, subtitleFontLineHeight] = createFontTokens(tokenNames.subtitleFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Subtitle1Family, Subtitle1Weight, Subtitle1Size, Subtitle1LineHeight);
-  const [linkFont, linkFontColor, linkDisabledFontColor, linkFontFamily, linkFontWeight, linkFontSize, linkFontLineHeight] = createFontTokens(tokenNames.linkFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight);
-  const [linkActiveFont, linkActiveFontColor, linkActiveDisabledFontColor, linkActiveFontFamily, linkActiveFontWeight, linkActiveFontSize, linkActiveFontLineHeight] = createFontTokens(tokenNames.linkActiveFont, (element) => getColorForTheme(element, DigitalGreenLight, DigitalGreenLight, hexToRgbaCssColor(White, 0.75)), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight);
-  const [linkProminentFont, linkProminentFontColor, linkProminentDisabledFontColor, linkProminentFontFamily, linkProminentFontWeight, linkProminentFontSize, linkProminentFontLineHeight] = createFontTokens(tokenNames.linkProminentFont, (element) => getColorForTheme(element, DigitalGreenDark105, PowerGreen, White), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight);
-  const [linkActiveProminentFont, linkActiveProminentFontColor, linkActiveProminentDisabledFontColor, linkActiveProminentFontFamily, linkActiveProminentFontWeight, linkActiveProminentFontSize, linkActiveProminentFontLineHeight] = createFontTokens(tokenNames.linkActiveProminentFont, (element) => getColorForTheme(element, DigitalGreenLight, DigitalGreenLight, hexToRgbaCssColor(White, 0.75)), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight);
-  const [placeholderFont, placeholderFontColor, placeholderDisabledFontColor, placeholderFontFamily, placeholderFontWeight, placeholderFontSize, placeholderFontLineHeight] = createFontTokens(tokenNames.placeholderFont, (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.6), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), PlaceholderFamily, PlaceholderWeight, PlaceholderSize, PlaceholderLineHeight);
+  const [subtitlePlus1Font] = createFontTokens(tokenNames.subtitlePlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Subtitle2Family, Subtitle2Weight, Subtitle2Size, Subtitle2LineHeight);
+  const [subtitleFont, subtitleFontColor] = createFontTokens(tokenNames.subtitleFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Subtitle1Family, Subtitle1Weight, Subtitle1Size, Subtitle1LineHeight);
+  const [linkFont, linkFontColor, linkDisabledFontColor] = createFontTokens(tokenNames.linkFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight);
+  const [linkActiveFont, linkActiveFontColor] = createFontTokens(tokenNames.linkActiveFont, (element) => getColorForTheme(element, DigitalGreenLight, DigitalGreenLight, hexToRgbaCssColor(White, 0.75)), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight);
+  const [linkProminentFont, linkProminentFontColor] = createFontTokens(tokenNames.linkProminentFont, (element) => getColorForTheme(element, DigitalGreenDark105, PowerGreen, White), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight);
+  const [linkActiveProminentFont, linkActiveProminentFontColor] = createFontTokens(tokenNames.linkActiveProminentFont, (element) => getColorForTheme(element, DigitalGreenLight, DigitalGreenLight, hexToRgbaCssColor(White, 0.75)), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight);
+  const [placeholderFont, placeholderFontColor] = createFontTokens(tokenNames.placeholderFont, (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.6), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), PlaceholderFamily, PlaceholderWeight, PlaceholderSize, PlaceholderLineHeight);
   const [bodyFont, bodyFontColor, bodyDisabledFontColor, bodyFontFamily, bodyFontWeight, bodyFontSize, bodyFontLineHeight] = createFontTokens(tokenNames.bodyFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyFamily, BodyWeight, BodySize, BodyLineHeight);
-  const [bodyEmphasizedFont, bodyEmphasizedFontColor, bodyEmphasizedDisabledFontColor, bodyEmphasizedFontFamily, bodyEmphasizedFontWeight, bodyEmphasizedFontSize, bodyEmphasizedFontLineHeight] = createFontTokens(tokenNames.bodyEmphasizedFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyEmphasizedFamily, BodyEmphasizedWeight, BodyEmphasizedSize, BodyEmphasizedLineHeight);
+  const [bodyEmphasizedFont, bodyEmphasizedFontColor, bodyEmphasizedDisabledFontColor, bodyEmphasizedFontFamily, bodyEmphasizedFontWeight] = createFontTokens(tokenNames.bodyEmphasizedFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyEmphasizedFamily, BodyEmphasizedWeight, BodyEmphasizedSize, BodyEmphasizedLineHeight);
   createFontTokens(tokenNames.bodyPlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Body2Family, Body2Weight, Body2Size, Body2LineHeight);
   createFontTokens(tokenNames.bodyPlus1EmphasizedFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyEmphasized2Family, BodyEmphasized2Weight, BodyEmphasized2Size, BodyEmphasized2LineHeight);
-  const [groupHeaderFont, groupHeaderFontColor, groupHeaderDisabledFontColor, groupHeaderFontFamily, groupHeaderFontWeight, groupHeaderFontSize, groupHeaderFontLineHeight] = createFontTokens(tokenNames.groupHeaderFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), GroupLabel1Family, GroupLabel1Weight, GroupLabel1Size, GroupLabel1LineHeight);
+  const [groupHeaderFont, groupHeaderFontColor] = createFontTokens(tokenNames.groupHeaderFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), GroupLabel1Family, GroupLabel1Weight, GroupLabel1Size, GroupLabel1LineHeight);
   const [controlLabelFont, controlLabelFontColor, controlLabelDisabledFontColor, controlLabelFontFamily, controlLabelFontWeight, controlLabelFontSize, controlLabelFontLineHeight] = createFontTokens(tokenNames.controlLabelFont, (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.6), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), ControlLabel1Family, ControlLabel1Weight, ControlLabel1Size, ControlLabel1LineHeight);
-  const [buttonLabelFont, buttonLabelFontColor, buttonLabelDisabledFontColor, buttonLabelFontFamily, buttonLabelFontWeight, buttonLabelFontSize, buttonLabelFontLineHeight] = createFontTokens(tokenNames.buttonLabelFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), ButtonLabel1Family, ButtonLabel1Weight, ButtonLabel1Size, ButtonLabel1LineHeight);
-  const [tooltipCaptionFont, tooltipCaptionFontColor, tooltipCaptionDisabledFontColor, tooltipCaptionFontFamily, tooltipCaptionFontWeight, tooltipCaptionFontSize, tooltipCaptionFontLineHeight] = createFontTokens(tokenNames.tooltipCaptionFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), TooltipCaptionFamily, TooltipCaptionWeight, TooltipCaptionSize, TooltipCaptionLineHeight);
+  const [buttonLabelFont, buttonLabelFontColor, buttonLabelDisabledFontColor] = createFontTokens(tokenNames.buttonLabelFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), ButtonLabel1Family, ButtonLabel1Weight, ButtonLabel1Size, ButtonLabel1LineHeight);
+  const [tooltipCaptionFont, tooltipCaptionFontColor] = createFontTokens(tokenNames.tooltipCaptionFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), TooltipCaptionFamily, TooltipCaptionWeight, TooltipCaptionSize, TooltipCaptionLineHeight);
   const [errorTextFont, errorTextFontColor, errorTextDisabledFontColor, errorTextFontFamily, errorTextFontWeight, errorTextFontSize, errorTextFontLineHeight] = createFontTokens(tokenNames.errorTextFont, (element) => getFailColorForTheme(element), (element) => hexToRgbaCssColor(getFailColorForTheme(element), 0.3), ErrorLightUiFamily, ErrorLightUiWeight, ErrorLightUiSize, TooltipCaptionLineHeight);
-  const [tableHeaderFont, tableHeaderFontColor, tableHeaderDisabledFontColor, tableHeaderFontFamily, tableHeaderFontWeight, tableHeaderFontSize, tableHeaderFontLineHeight] = createFontTokens(tokenNames.tableHeaderFont, (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.6), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), GridHeaderFamily, GridHeaderWeight, GridHeaderSize, TooltipCaptionLineHeight);
+  const [tableHeaderFont, tableHeaderFontColor] = createFontTokens(tokenNames.tableHeaderFont, (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.6), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), GridHeaderFamily, GridHeaderWeight, GridHeaderSize, TooltipCaptionLineHeight);
   createFontTokens(tokenNames.mentionFont, (element) => getColorForTheme(element, DigitalGreenDark, PowerGreen, PowerGreen), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyFamily, BodyEmphasizedWeight, BodySize, BodyLineHeight);
   // Font Transform Tokens
   const groupHeaderTextTransform = DesignToken.create(styleNameFromTokenName(tokenNames.groupHeaderTextTransform)).withDefault('uppercase');
@@ -16563,7 +16584,6 @@
     }
 `;
 
-  // prettier-ignore
   const template$S = (_context, definition) => html `${
 /* top-container div is necessary because setting contenteditable directly on the native anchor instead
    leaves it focusable, unlike the behavior you get when the anchor is _within_ a contenteditable element.
@@ -18768,7 +18788,6 @@
       cssCustomPropertyName: null
   }).withDefault(coreLabelDefaults.scrollForwardLabel);
 
-  // prettier-ignore
   const template$M = (context, definition) => html `
     <div
         class="tab-bar"
@@ -19625,7 +19644,6 @@
       information: 'information'
   };
 
-  // prettier-ignore
   const template$K = html `
     <${themeProviderTag} theme="${Theme.color}">
         <div class="container"
@@ -19749,12 +19767,70 @@
   });
   DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleBanner());
 
+  /**
+   * The template for the {@link @ni/fast-foundation#Breadcrumb} component.
+   * @public
+   */
+  const breadcrumbTemplate = (_context, _definition) => html `
+    <template role="navigation">
+        ${when(x => x.showScrollButtons, html `
+            <${buttonTag} 
+                content-hidden
+                class="scroll-button left"
+                appearance="${ButtonAppearance.ghost}"
+                @click="${x => x.onScrollLeftClick()}"
+                ${ref('leftScrollButton')}
+            >
+                ${x => scrollForwardLabel.getValueFor(x)}
+                <${iconArrowExpanderLeftTag} slot="start"></${iconArrowExpanderLeftTag}>
+            </${buttonTag}>
+        `)}
+        <div ${ref('list')} role="list" class="list" part="list" tabindex="-1">
+            <slot
+                ${slotted({ property: 'slottedBreadcrumbItems', filter: elements() })}
+            ></slot>
+        </div>
+        ${when(x => x.showScrollButtons, html `
+            <${buttonTag}
+                content-hidden
+                class="scroll-button right"
+                appearance="${ButtonAppearance.ghost}"
+                @click="${x => x.onScrollRightClick()}"
+            >
+                ${x => scrollBackwardLabel.getValueFor(x)}
+                <${iconArrowExpanderRightTag} slot="start"></${iconArrowExpanderRightTag}>
+            </${buttonTag}>
+        `)}
+    </template>
+`;
+
   const styles$W = css `
-    ${display$2('inline-block')}
+    ${display$2('inline-flex')}
+
+    :host {
+        flex-direction: row;
+    }
+
+    .scroll-button.left {
+        margin-right: ${smallPadding};
+    }
 
     .list {
-        display: flex;
-        flex-wrap: wrap;
+        display: inline-flex;
+        max-width: 100%;
+        width: max-content;
+        align-self: end;
+        overflow-x: scroll;
+        scrollbar-width: none;
+    }
+
+    .scroll-button.right {
+        margin-left: ${smallPadding};
+    }
+
+    ::slotted(*) {
+        flex-shrink: 0;
+        white-space: nowrap;
     }
 
     ::slotted(:last-child) {
@@ -19771,10 +19847,63 @@
    * A nimble-styled breadcrumb
    */
   class Breadcrumb extends Breadcrumb$1 {
+      constructor() {
+          super();
+          /**
+           * @internal
+           */
+          this.showScrollButtons = false;
+          this.listResizeObserver = new ResizeObserver(entries => {
+              let listVisibleWidth = entries[0]?.contentRect.width;
+              if (listVisibleWidth !== undefined) {
+                  const buttonWidth = this.leftScrollButton?.clientWidth ?? 0;
+                  listVisibleWidth = Math.ceil(listVisibleWidth);
+                  if (this.showScrollButtons) {
+                      listVisibleWidth += buttonWidth * 2;
+                  }
+                  this.showScrollButtons = listVisibleWidth < this.list.scrollWidth;
+              }
+          });
+      }
+      /**
+       * @internal
+       */
+      onScrollLeftClick() {
+          this.list.scrollBy({
+              left: -this.list.clientWidth,
+              behavior: 'smooth'
+          });
+      }
+      /**
+       * @internal
+       */
+      onScrollRightClick() {
+          this.list.scrollBy({
+              left: this.list.clientWidth,
+              behavior: 'smooth'
+          });
+      }
+      /**
+       * @internal
+       */
+      connectedCallback() {
+          super.connectedCallback();
+          this.listResizeObserver.observe(this.list);
+      }
+      /**
+       * @internal
+       */
+      disconnectedCallback() {
+          super.disconnectedCallback();
+          this.listResizeObserver.disconnect();
+      }
   }
   __decorate([
       attr
   ], Breadcrumb.prototype, "appearance", void 0);
+  __decorate([
+      observable
+  ], Breadcrumb.prototype, "showScrollButtons", void 0);
   const nimbleBreadcrumb = Breadcrumb.compose({
       baseName: 'breadcrumb',
       baseClass: Breadcrumb$1,
@@ -20467,8 +20596,6 @@ so this becomes the fallback color for the slot */ ''}
             }
         `));
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$H = (context, definition) => html `
     <div
         role="button"
@@ -20521,7 +20648,6 @@ so this becomes the fallback color for the slot */ ''}
         ${endSlotTemplate(context, definition)}
     </div>
 `;
-  /* eslint-enable @typescript-eslint/indent */
 
   /**
    * A nimble-styled toggle button control.
@@ -21022,7 +21148,6 @@ so this becomes the fallback color for the slot */ ''}
    *
    * This function is intended to be used with components leveraging `mixinRequiredVisiblePattern`.
    */
-  /* eslint-disable @typescript-eslint/indent */
   function createRequiredVisibleLabelTemplate(labelTemplate) {
       return html `
         <div class="annotated-label">
@@ -21039,8 +21164,6 @@ so this becomes the fallback color for the slot */ ''}
         <slot></slot>
     </label>
 `);
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$G = (context, definition) => html `
     <template
         aria-disabled="${x => x.ariaDisabled}"
@@ -25426,7 +25549,6 @@ so this becomes the fallback color for the slot */ ''}
    * The template for the {@link @ni/fast-foundation#(ListboxOption:class)} component.
    * @public
    */
-  // prettier-ignore
   const template$D = (context, definition) => html `
     <template
         aria-checked="${x => x.ariaChecked}"
@@ -25608,7 +25730,6 @@ so this becomes the fallback color for the slot */ ''}
   const isListOption$1 = (n) => {
       return n instanceof ListOption;
   };
-  // prettier-ignore
   const template$C = html `
 <template
     role="group"
@@ -26200,8 +26321,6 @@ so this becomes the fallback color for the slot */ ''}
       observable
   ], Menu$1.prototype, "itemIcons", void 0);
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$A = () => html `
     <template
         slot="${x => {
@@ -26218,7 +26337,6 @@ so this becomes the fallback color for the slot */ ''}
         <slot ${slotted('items')}></slot>
     </template>
 `;
-  /* eslint-enable @typescript-eslint/indent */
 
   const styles$G = css `
     ${display$2('grid')}
@@ -26325,7 +26443,6 @@ so this becomes the fallback color for the slot */ ''}
     }
 `;
 
-  // prettier-ignore
   const template$z = html `
     <template
         ?open="${x => x.open}"
@@ -27268,7 +27385,6 @@ so this becomes the fallback color for the slot */ ''}
 `;
 
   const labelTemplate$3 = createRequiredVisibleLabelTemplate(html `<slot name="label"></slot>`);
-  /* eslint-disable @typescript-eslint/indent */
   const template$x = html `
     <template
         role="radiogroup"
@@ -34467,7 +34583,7 @@ so this becomes the fallback color for the slot */ ''}
           if (desc.dom.nodeType == 1 && (desc.node.isBlock && desc.parent || !desc.contentDOM) &&
               // Ignore elements with zero-size bounding rectangles
               ((rect = desc.dom.getBoundingClientRect()).width || rect.height)) {
-              if (desc.node.isBlock && desc.parent) {
+              if (desc.node.isBlock && desc.parent && !/^T(R|BODY|HEAD|FOOT)$/.test(desc.dom.nodeName)) {
                   // Only apply the horizontal test to the innermost block. Vertical for any parent.
                   if (!sawBlock && rect.left > coords.left || rect.top > coords.top)
                       outsideBlock = desc.posBefore;
@@ -35125,7 +35241,7 @@ so this becomes the fallback color for the slot */ ''}
           // (one where the focus is before the anchor), but not all
           // browsers support it yet.
           let domSelExtended = false;
-          if ((domSel.extend || anchor == head) && !brKludge) {
+          if ((domSel.extend || anchor == head) && !(brKludge && gecko)) {
               domSel.collapse(anchorDOM.node, anchorDOM.offset);
               try {
                   if (anchor != head)
@@ -35537,17 +35653,18 @@ so this becomes the fallback color for the slot */ ''}
       }
       // Mark this node as being the selected node.
       selectNode() {
-          if (this.nodeDOM.nodeType == 1)
+          if (this.nodeDOM.nodeType == 1) {
               this.nodeDOM.classList.add("ProseMirror-selectednode");
-          if (this.contentDOM || !this.node.type.spec.draggable)
-              this.dom.draggable = true;
+              if (this.contentDOM || !this.node.type.spec.draggable)
+                  this.nodeDOM.draggable = true;
+          }
       }
       // Remove selected node marking from this node.
       deselectNode() {
           if (this.nodeDOM.nodeType == 1) {
               this.nodeDOM.classList.remove("ProseMirror-selectednode");
               if (this.contentDOM || !this.node.type.spec.draggable)
-                  this.dom.removeAttribute("draggable");
+                  this.nodeDOM.removeAttribute("draggable");
           }
       }
       get domAtom() { return this.node.isAtom; }
@@ -36386,17 +36503,14 @@ so this becomes the fallback color for the slot */ ''}
       });
   }
   function selectCursorWrapper(view) {
-      let domSel = view.domSelection(), range = document.createRange();
+      let domSel = view.domSelection();
       if (!domSel)
           return;
       let node = view.cursorWrapper.dom, img = node.nodeName == "IMG";
       if (img)
-          range.setStart(node.parentNode, domIndex(node) + 1);
+          domSel.collapse(node.parentNode, domIndex(node) + 1);
       else
-          range.setStart(node, 0);
-      range.collapse(true);
-      domSel.removeAllRanges();
-      domSel.addRange(range);
+          domSel.collapse(node, 0);
       // Kludge to kill 'control selection' in IE11 when selecting an
       // invisible cursor wrapper, since that would result in those weird
       // resize handles and a selection that considers the absolutely
@@ -36874,11 +36988,14 @@ so this becomes the fallback color for the slot */ ''}
       let dom, slice;
       if (!html && !text)
           return null;
-      let asText = text && (plainText || inCode || !html);
+      let asText = !!text && (plainText || inCode || !html);
       if (asText) {
           view.someProp("transformPastedText", f => { text = f(text, inCode || plainText, view); });
-          if (inCode)
-              return text ? new Slice(Fragment.from(view.state.schema.text(text.replace(/\r\n?/g, "\n"))), 0, 0) : Slice.empty;
+          if (inCode) {
+              slice = new Slice(Fragment.from(view.state.schema.text(text.replace(/\r\n?/g, "\n"))), 0, 0);
+              view.someProp("transformPasted", f => { slice = f(slice, view, true); });
+              return slice;
+          }
           let parsed = view.someProp("clipboardTextParser", f => f(text, $context, plainText, view));
           if (parsed) {
               slice = parsed;
@@ -36936,7 +37053,7 @@ so this becomes the fallback color for the slot */ ''}
               slice = closeSlice(slice, openStart, openEnd);
           }
       }
-      view.someProp("transformPasted", f => { slice = f(slice, view); });
+      view.someProp("transformPasted", f => { slice = f(slice, view, asText); });
       return slice;
   }
   const inlineParents = /^(a|abbr|acronym|b|cite|code|del|em|i|ins|kbd|label|output|q|ruby|s|samp|span|strong|sub|sup|time|u|tt|var)$/i;
@@ -37398,7 +37515,7 @@ so this becomes the fallback color for the slot */ ''}
           }
           const target = flushed ? null : event.target;
           const targetDesc = target ? view.docView.nearestDesc(target, true) : null;
-          this.target = targetDesc && targetDesc.dom.nodeType == 1 ? targetDesc.dom : null;
+          this.target = targetDesc && targetDesc.nodeDOM.nodeType == 1 ? targetDesc.nodeDOM : null;
           let { selection } = view.state;
           if (event.button == 0 &&
               targetNode.type.spec.draggable && targetNode.type.spec.selectable !== false ||
@@ -37795,7 +37912,7 @@ so this becomes the fallback color for the slot */ ''}
       let $mouse = view.state.doc.resolve(eventPos.pos);
       let slice = dragging && dragging.slice;
       if (slice) {
-          view.someProp("transformPasted", f => { slice = f(slice, view); });
+          view.someProp("transformPasted", f => { slice = f(slice, view, false); });
       }
       else {
           slice = parseFromClipboard(view, getText$1(event.dataTransfer), brokenClipboardAPI ? null : event.dataTransfer.getData("text/html"), false, $mouse);
@@ -38981,7 +39098,7 @@ so this becomes the fallback color for the slot */ ''}
       }
       return null;
   }
-  const isInline = /^(a|abbr|acronym|b|bd[io]|big|br|button|cite|code|data(list)?|del|dfn|em|i|ins|kbd|label|map|mark|meter|output|q|ruby|s|samp|small|span|strong|su[bp]|time|u|tt|var)$/i;
+  const isInline = /^(a|abbr|acronym|b|bd[io]|big|br|button|cite|code|data(list)?|del|dfn|em|i|img|ins|kbd|label|map|mark|meter|output|q|ruby|s|samp|small|span|strong|su[bp]|time|u|tt|var)$/i;
   function readDOMChange(view, from, to, typeOver, addedNodes) {
       let compositionID = view.input.compositionPendingChanges || (view.composing ? view.input.compositionID : 0);
       view.input.compositionPendingChanges = 0;
@@ -39080,16 +39197,13 @@ so this becomes the fallback color for the slot */ ''}
       let $to = parse.doc.resolveNoCache(change.endB - parse.from);
       let $fromA = doc.resolve(change.start);
       let inlineChange = $from.sameParent($to) && $from.parent.inlineContent && $fromA.end() >= change.endA;
-      let nextSel;
       // If this looks like the effect of pressing Enter (or was recorded
       // as being an iOS enter press), just dispatch an Enter key instead.
       if (((ios && view.input.lastIOSEnter > Date.now() - 225 &&
           (!inlineChange || addedNodes.some(n => n.nodeName == "DIV" || n.nodeName == "P"))) ||
           (!inlineChange && $from.pos < parse.doc.content.size &&
               (!$from.sameParent($to) || !$from.parent.inlineContent) &&
-              !/\S/.test(parse.doc.textBetween($from.pos, $to.pos, "", "")) &&
-              (nextSel = Selection$2.findFrom(parse.doc.resolve($from.pos + 1), 1, true)) &&
-              nextSel.head > $from.pos)) &&
+              $from.pos < $to.pos && !/\S/.test(parse.doc.textBetween($from.pos, $to.pos, "", "")))) &&
           view.someProp("handleKeyDown", f => f(view, keyEvent(13, "Enter")))) {
           view.input.lastIOSEnter = 0;
           return;
@@ -45837,8 +45951,6 @@ img.ProseMirror-separator {
     }
 `;
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$w = html `
     <template>
         <${anchoredRegionTag}
@@ -46135,7 +46247,6 @@ img.ProseMirror-separator {
       .register(nimbleRichTextMentionListbox());
   const richTextMentionListboxTag = 'nimble-rich-text-mention-listbox';
 
-  // prettier-ignore
   const template$v = html `
     <template
         ${children$1({ property: 'childItems', filter: elements() })}
@@ -47625,7 +47736,7 @@ img.ProseMirror-separator {
 
   // Merge objects
   //
-  function assign$2 (obj /* from1, from2, from3, ... */) {
+  function assign$1 (obj /* from1, from2, from3, ... */) {
     const sources = Array.prototype.slice.call(arguments, 1);
 
     sources.forEach(function (source) {
@@ -47895,7 +48006,7 @@ img.ProseMirror-separator {
   var utils = /*#__PURE__*/Object.freeze({
     __proto__: null,
     arrayReplaceAt: arrayReplaceAt,
-    assign: assign$2,
+    assign: assign$1,
     escapeHtml: escapeHtml,
     escapeRE: escapeRE$1,
     fromCodePoint: fromCodePoint,
@@ -48255,7 +48366,7 @@ img.ProseMirror-separator {
      * See [source code](https://github.com/markdown-it/markdown-it/blob/master/lib/renderer.mjs)
      * for more details and examples.
      **/
-    this.rules = assign$2({}, default_rules);
+    this.rules = assign$1({}, default_rules);
   }
 
   /**
@@ -53037,7 +53148,7 @@ img.ProseMirror-separator {
 
   // Merge objects
   //
-  function assign$1 (obj /* from1, from2, from3, ... */) {
+  function assign (obj /* from1, from2, from3, ... */) {
     const sources = Array.prototype.slice.call(arguments, 1);
 
     sources.forEach(function (source) {
@@ -53398,7 +53509,7 @@ img.ProseMirror-separator {
       }
     }
 
-    this.__opts__ = assign$1({}, defaultOptions, options);
+    this.__opts__ = assign({}, defaultOptions, options);
 
     // Cache last tested result. Used to skip repeating steps on next `match` call.
     this.__index__ = -1;
@@ -53406,7 +53517,7 @@ img.ProseMirror-separator {
     this.__schema__ = '';
     this.__text_cache__ = '';
 
-    this.__schemas__ = assign$1({}, defaultSchemas, schemas);
+    this.__schemas__ = assign({}, defaultSchemas, schemas);
     this.__compiled__ = {};
 
     this.__tlds__ = tlds_default;
@@ -53437,7 +53548,7 @@ img.ProseMirror-separator {
    * Set recognition options for links without schema.
    **/
   LinkifyIt.prototype.set = function set (options) {
-    this.__opts__ = assign$1(this.__opts__, options);
+    this.__opts__ = assign(this.__opts__, options);
     return this
   };
 
@@ -54640,7 +54751,7 @@ img.ProseMirror-separator {
      * Link components parser functions, useful to write plugins. See details
      * [here](https://github.com/markdown-it/markdown-it/blob/master/lib/helpers).
      **/
-    this.helpers = assign$2({}, helpers);
+    this.helpers = assign$1({}, helpers);
 
     this.options = {};
     this.configure(presetName);
@@ -54668,7 +54779,7 @@ img.ProseMirror-separator {
    * config.
    **/
   MarkdownIt.prototype.set = function (options) {
-    assign$2(this.options, options);
+    assign$1(this.options, options);
     return this
   };
 
@@ -57301,24 +57412,10 @@ img.ProseMirror-separator {
   // THIS FILE IS AUTOMATICALLY GENERATED DO NOT EDIT DIRECTLY
   // See update-tlds.js for encoding/decoding format
   // https://data.iana.org/TLD/tlds-alpha-by-domain.txt
-  const encodedTlds = 'aaa1rp3bb0ott3vie4c1le2ogado5udhabi7c0ademy5centure6ountant0s9o1tor4d0s1ult4e0g1ro2tna4f0l1rica5g0akhan5ency5i0g1rbus3force5tel5kdn3l0ibaba4pay4lfinanz6state5y2sace3tom5m0azon4ericanexpress7family11x2fam3ica3sterdam8nalytics7droid5quan4z2o0l2partments8p0le4q0uarelle8r0ab1mco4chi3my2pa2t0e3s0da2ia2sociates9t0hleta5torney7u0ction5di0ble3o3spost5thor3o0s4w0s2x0a2z0ure5ba0by2idu3namex4d1k2r0celona5laycard4s5efoot5gains6seball5ketball8uhaus5yern5b0c1t1va3cg1n2d1e0ats2uty4er2rlin4st0buy5t2f1g1h0arti5i0ble3d1ke2ng0o3o1z2j1lack0friday9ockbuster8g1omberg7ue3m0s1w2n0pparibas9o0ats3ehringer8fa2m1nd2o0k0ing5sch2tik2on4t1utique6x2r0adesco6idgestone9oadway5ker3ther5ussels7s1t1uild0ers6siness6y1zz3v1w1y1z0h3ca0b1fe2l0l1vinklein9m0era3p2non3petown5ital0one8r0avan4ds2e0er0s4s2sa1e1h1ino4t0ering5holic7ba1n1re3c1d1enter4o1rn3f0a1d2g1h0anel2nel4rity4se2t2eap3intai5ristmas6ome4urch5i0priani6rcle4sco3tadel4i0c2y3k1l0aims4eaning6ick2nic1que6othing5ud3ub0med6m1n1o0ach3des3ffee4llege4ogne5m0mbank4unity6pany2re3uter5sec4ndos3struction8ulting7tact3ractors9oking4l1p2rsica5untry4pon0s4rses6pa2r0edit0card4union9icket5own3s1uise0s6u0isinella9v1w1x1y0mru3ou3z2dad1nce3ta1e1ing3sun4y2clk3ds2e0al0er2s3gree4livery5l1oitte5ta3mocrat6ntal2ist5si0gn4v2hl2iamonds6et2gital5rect0ory7scount3ver5h2y2j1k1m1np2o0cs1tor4g1mains5t1wnload7rive4tv2ubai3nlop4pont4rban5vag2r2z2earth3t2c0o2deka3u0cation8e1g1mail3erck5nergy4gineer0ing9terprises10pson4quipment8r0icsson6ni3s0q1tate5t1u0rovision8s2vents5xchange6pert3osed4ress5traspace10fage2il1rwinds6th3mily4n0s2rm0ers5shion4t3edex3edback6rrari3ero6i0delity5o2lm2nal1nce1ial7re0stone6mdale6sh0ing5t0ness6j1k1lickr3ghts4r2orist4wers5y2m1o0o0d1tball6rd1ex2sale4um3undation8x2r0ee1senius7l1ogans4ntier7tr2ujitsu5n0d2rniture7tbol5yi3ga0l0lery3o1up4me0s3p1rden4y2b0iz3d0n2e0a1nt0ing5orge5f1g0ee3h1i0ft0s3ves2ing5l0ass3e1obal2o4m0ail3bh2o1x2n1odaddy5ld0point6f2o0dyear5g0le4p1t1v2p1q1r0ainger5phics5tis4een3ipe3ocery4up4s1t1u0cci3ge2ide2tars5ru3w1y2hair2mburg5ngout5us3bo2dfc0bank7ealth0care8lp1sinki6re1mes5iphop4samitsu7tachi5v2k0t2m1n1ockey4ldings5iday5medepot5goods5s0ense7nda3rse3spital5t0ing5t0els3mail5use3w2r1sbc3t1u0ghes5yatt3undai7ibm2cbc2e1u2d1e0ee3fm2kano4l1m0amat4db2mo0bilien9n0c1dustries8finiti5o2g1k1stitute6urance4e4t0ernational10uit4vestments10o1piranga7q1r0ish4s0maili5t0anbul7t0au2v3jaguar4va3cb2e0ep2tzt3welry6io2ll2m0p2nj2o0bs1urg4t1y2p0morgan6rs3uegos4niper7kaufen5ddi3e0rryhotels6properties14fh2g1h1i0a1ds2m1ndle4tchen5wi3m1n1oeln3matsu5sher5p0mg2n2r0d1ed3uokgroup8w1y0oto4z2la0caixa5mborghini8er3nd0rover6xess5salle5t0ino3robe5w0yer5b1c1ds2ease3clerc5frak4gal2o2xus4gbt3i0dl2fe0insurance9style7ghting6ke2lly3mited4o2ncoln4k2ve1ing5k1lc1p2oan0s3cker3us3l1ndon4tte1o3ve3pl0financial11r1s1t0d0a3u0ndbeck6xe1ury5v1y2ma0drid4if1son4keup4n0agement7go3p1rket0ing3s4riott5shalls7ttel5ba2c0kinsey7d1e0d0ia3et2lbourne7me1orial6n0u2rckmsd7g1h1iami3crosoft7l1ni1t2t0subishi9k1l0b1s2m0a2n1o0bi0le4da2e1i1m1nash3ey2ster5rmon3tgage6scow4to0rcycles9v0ie4p1q1r1s0d2t0n1r2u0seum3ic4v1w1x1y1z2na0b1goya4me2vy3ba2c1e0c1t0bank4flix4work5ustar5w0s2xt0direct7us4f0l2g0o2hk2i0co2ke1on3nja3ssan1y5l1o0kia3rton4w0ruz3tv4p1r0a1w2tt2u1yc2z2obi1server7ffice5kinawa6layan0group9lo3m0ega4ne1g1l0ine5oo2pen3racle3nge4g0anic5igins6saka4tsuka4t2vh3pa0ge2nasonic7ris2s1tners4s1y3y2ccw3e0t2f0izer5g1h0armacy6d1ilips5one2to0graphy6s4ysio5ics1tet2ures6d1n0g1k2oneer5zza4k1l0ace2y0station9umbing5s3m1n0c2ohl2ker3litie5rn2st3r0america6xi3ess3ime3o0d0uctions8f1gressive8mo2perties3y5tection8u0dential9s1t1ub2w0c2y2qa1pon3uebec3st5racing4dio4e0ad1lestate6tor2y4cipes5d0stone5umbrella9hab3ise0n3t2liance6n0t0als5pair3ort3ublican8st0aurant8view0s5xroth6ich0ardli6oh3l1o1p2o0cks3deo3gers4om3s0vp3u0gby3hr2n2w0e2yukyu6sa0arland6fe0ty4kura4le1on3msclub4ung5ndvik0coromant12ofi4p1rl2s1ve2xo3b0i1s2c0b1haeffler7midt4olarships8ol3ule3warz5ience5ot3d1e0arch3t2cure1ity6ek2lect4ner3rvices6ven3w1x0y3fr2g1h0angrila6rp3ell3ia1ksha5oes2p0ping5uji3w3i0lk2na1gles5te3j1k0i0n2y0pe4l0ing4m0art3ile4n0cf3o0ccer3ial4ftbank4ware6hu2lar2utions7ng1y2y2pa0ce3ort2t3r0l2s1t0ada2ples4r1tebank4farm7c0group6ockholm6rage3e3ream4udio2y3yle4u0cks3pplies3y2ort5rf1gery5zuki5v1watch4iss4x1y0dney4stems6z2tab1ipei4lk2obao4rget4tamotors6r2too4x0i3c0i2d0k2eam2ch0nology8l1masek5nnis4va3f1g1h0d1eater2re6iaa2ckets5enda4ps2res2ol4j0maxx4x2k0maxx5l1m0all4n1o0day3kyo3ols3p1ray3shiba5tal3urs3wn2yota3s3r0ade1ing4ining5vel0ers0insurance16ust3v2t1ube2i1nes3shu4v0s2w1z2ua1bank3s2g1k1nicom3versity8o2ol2ps2s1y1z2va0cations7na1guard7c1e0gas3ntures6risign5mögensberater2ung14sicherung10t2g1i0ajes4deo3g1king4llas4n1p1rgin4sa1ion4va1o3laanderen9n1odka3lvo3te1ing3o2yage5u2wales2mart4ter4ng0gou5tch0es6eather0channel12bcam3er2site5d0ding5ibo2r3f1hoswho6ien2ki2lliamhill9n0dows4e1ners6me2olterskluwer11odside6rk0s2ld3w2s1tc1f3xbox3erox4ihuan4n2xx2yz3yachts4hoo3maxun5ndex5e1odobashi7ga2kohama6u0tube6t1un3za0ppos4ra3ero3ip2m1one3uerich6w2';
+  const encodedTlds = 'aaa1rp3bb0ott3vie4c1le2ogado5udhabi7c0ademy5centure6ountant0s9o1tor4d0s1ult4e0g1ro2tna4f0l1rica5g0akhan5ency5i0g1rbus3force5tel5kdn3l0ibaba4pay4lfinanz6state5y2sace3tom5m0azon4ericanexpress7family11x2fam3ica3sterdam8nalytics7droid5quan4z2o0l2partments8p0le4q0uarelle8r0ab1mco4chi3my2pa2t0e3s0da2ia2sociates9t0hleta5torney7u0ction5di0ble3o3spost5thor3o0s4w0s2x0a2z0ure5ba0by2idu3namex4d1k2r0celona5laycard4s5efoot5gains6seball5ketball8uhaus5yern5b0c1t1va3cg1n2d1e0ats2uty4er2rlin4st0buy5t2f1g1h0arti5i0ble3d1ke2ng0o3o1z2j1lack0friday9ockbuster8g1omberg7ue3m0s1w2n0pparibas9o0ats3ehringer8fa2m1nd2o0k0ing5sch2tik2on4t1utique6x2r0adesco6idgestone9oadway5ker3ther5ussels7s1t1uild0ers6siness6y1zz3v1w1y1z0h3ca0b1fe2l0l1vinklein9m0era3p2non3petown5ital0one8r0avan4ds2e0er0s4s2sa1e1h1ino4t0ering5holic7ba1n1re3c1d1enter4o1rn3f0a1d2g1h0anel2nel4rity4se2t2eap3intai5ristmas6ome4urch5i0priani6rcle4sco3tadel4i0c2y3k1l0aims4eaning6ick2nic1que6othing5ud3ub0med6m1n1o0ach3des3ffee4llege4ogne5m0mbank4unity6pany2re3uter5sec4ndos3struction8ulting7tact3ractors9oking4l1p2rsica5untry4pon0s4rses6pa2r0edit0card4union9icket5own3s1uise0s6u0isinella9v1w1x1y0mru3ou3z2dad1nce3ta1e1ing3sun4y2clk3ds2e0al0er2s3gree4livery5l1oitte5ta3mocrat6ntal2ist5si0gn4v2hl2iamonds6et2gital5rect0ory7scount3ver5h2y2j1k1m1np2o0cs1tor4g1mains5t1wnload7rive4tv2ubai3nlop4pont4rban5vag2r2z2earth3t2c0o2deka3u0cation8e1g1mail3erck5nergy4gineer0ing9terprises10pson4quipment8r0icsson6ni3s0q1tate5t1u0rovision8s2vents5xchange6pert3osed4ress5traspace10fage2il1rwinds6th3mily4n0s2rm0ers5shion4t3edex3edback6rrari3ero6i0delity5o2lm2nal1nce1ial7re0stone6mdale6sh0ing5t0ness6j1k1lickr3ghts4r2orist4wers5y2m1o0o0d1tball6rd1ex2sale4um3undation8x2r0ee1senius7l1ogans4ntier7tr2ujitsu5n0d2rniture7tbol5yi3ga0l0lery3o1up4me0s3p1rden4y2b0iz3d0n2e0a1nt0ing5orge5f1g0ee3h1i0ft0s3ves2ing5l0ass3e1obal2o4m0ail3bh2o1x2n1odaddy5ld0point6f2o0dyear5g0le4p1t1v2p1q1r0ainger5phics5tis4een3ipe3ocery4up4s1t1u0cci3ge2ide2tars5ru3w1y2hair2mburg5ngout5us3bo2dfc0bank7ealth0care8lp1sinki6re1mes5iphop4samitsu7tachi5v2k0t2m1n1ockey4ldings5iday5medepot5goods5s0ense7nda3rse3spital5t0ing5t0els3mail5use3w2r1sbc3t1u0ghes5yatt3undai7ibm2cbc2e1u2d1e0ee3fm2kano4l1m0amat4db2mo0bilien9n0c1dustries8finiti5o2g1k1stitute6urance4e4t0ernational10uit4vestments10o1piranga7q1r0ish4s0maili5t0anbul7t0au2v3jaguar4va3cb2e0ep2tzt3welry6io2ll2m0p2nj2o0bs1urg4t1y2p0morgan6rs3uegos4niper7kaufen5ddi3e0rryhotels6properties14fh2g1h1i0a1ds2m1ndle4tchen5wi3m1n1oeln3matsu5sher5p0mg2n2r0d1ed3uokgroup8w1y0oto4z2la0caixa5mborghini8er3nd0rover6xess5salle5t0ino3robe5w0yer5b1c1ds2ease3clerc5frak4gal2o2xus4gbt3i0dl2fe0insurance9style7ghting6ke2lly3mited4o2ncoln4k2ve1ing5k1lc1p2oan0s3cker3us3l1ndon4tte1o3ve3pl0financial11r1s1t0d0a3u0ndbeck6xe1ury5v1y2ma0drid4if1son4keup4n0agement7go3p1rket0ing3s4riott5shalls7ttel5ba2c0kinsey7d1e0d0ia3et2lbourne7me1orial6n0u2rckmsd7g1h1iami3crosoft7l1ni1t2t0subishi9k1l0b1s2m0a2n1o0bi0le4da2e1i1m1nash3ey2ster5rmon3tgage6scow4to0rcycles9v0ie4p1q1r1s0d2t0n1r2u0seum3ic4v1w1x1y1z2na0b1goya4me2vy3ba2c1e0c1t0bank4flix4work5ustar5w0s2xt0direct7us4f0l2g0o2hk2i0co2ke1on3nja3ssan1y5l1o0kia3rton4w0ruz3tv4p1r0a1w2tt2u1yc2z2obi1server7ffice5kinawa6layan0group9lo3m0ega4ne1g1l0ine5oo2pen3racle3nge4g0anic5igins6saka4tsuka4t2vh3pa0ge2nasonic7ris2s1tners4s1y3y2ccw3e0t2f0izer5g1h0armacy6d1ilips5one2to0graphy6s4ysio5ics1tet2ures6d1n0g1k2oneer5zza4k1l0ace2y0station9umbing5s3m1n0c2ohl2ker3litie5rn2st3r0axi3ess3ime3o0d0uctions8f1gressive8mo2perties3y5tection8u0dential9s1t1ub2w0c2y2qa1pon3uebec3st5racing4dio4e0ad1lestate6tor2y4cipes5d0stone5umbrella9hab3ise0n3t2liance6n0t0als5pair3ort3ublican8st0aurant8view0s5xroth6ich0ardli6oh3l1o1p2o0cks3deo3gers4om3s0vp3u0gby3hr2n2w0e2yukyu6sa0arland6fe0ty4kura4le1on3msclub4ung5ndvik0coromant12ofi4p1rl2s1ve2xo3b0i1s2c0b1haeffler7midt4olarships8ol3ule3warz5ience5ot3d1e0arch3t2cure1ity6ek2lect4ner3rvices6ven3w1x0y3fr2g1h0angrila6rp3ell3ia1ksha5oes2p0ping5uji3w3i0lk2na1gles5te3j1k0i0n2y0pe4l0ing4m0art3ile4n0cf3o0ccer3ial4ftbank4ware6hu2lar2utions7ng1y2y2pa0ce3ort2t3r0l2s1t0ada2ples4r1tebank4farm7c0group6ockholm6rage3e3ream4udio2y3yle4u0cks3pplies3y2ort5rf1gery5zuki5v1watch4iss4x1y0dney4stems6z2tab1ipei4lk2obao4rget4tamotors6r2too4x0i3c0i2d0k2eam2ch0nology8l1masek5nnis4va3f1g1h0d1eater2re6iaa2ckets5enda4ps2res2ol4j0maxx4x2k0maxx5l1m0all4n1o0day3kyo3ols3p1ray3shiba5tal3urs3wn2yota3s3r0ade1ing4ining5vel0ers0insurance16ust3v2t1ube2i1nes3shu4v0s2w1z2ua1bank3s2g1k1nicom3versity8o2ol2ps2s1y1z2va0cations7na1guard7c1e0gas3ntures6risign5mögensberater2ung14sicherung10t2g1i0ajes4deo3g1king4llas4n1p1rgin4sa1ion4va1o3laanderen9n1odka3lvo3te1ing3o2yage5u2wales2mart4ter4ng0gou5tch0es6eather0channel12bcam3er2site5d0ding5ibo2r3f1hoswho6ien2ki2lliamhill9n0dows4e1ners6me2olterskluwer11odside6rk0s2ld3w2s1tc1f3xbox3erox4ihuan4n2xx2yz3yachts4hoo3maxun5ndex5e1odobashi7ga2kohama6u0tube6t1un3za0ppos4ra3ero3ip2m1one3uerich6w2';
   // Internationalized domain names containing non-ASCII
   const encodedUtlds = 'ελ1υ2бг1ел3дети4ею2католик6ом3мкд2он1сква6онлайн5рг3рус2ф2сайт3рб3укр3қаз3հայ3ישראל5קום3ابوظبي5رامكو5لاردن4بحرين5جزائر5سعودية6عليان5مغرب5مارات5یران5بارت2زار4يتك3ھارت5تونس4سودان3رية5شبكة4عراق2ب2مان4فلسطين6قطر3كاثوليك6وم3مصر2ليسيا5وريتانيا7قع4همراه5پاکستان7ڀارت4कॉम3नेट3भारत0म्3ोत5संगठन5বাংলা5ভারত2ৰত4ਭਾਰਤ4ભારત4ଭାରତ4இந்தியா6லங்கை6சிங்கப்பூர்11భారత్5ಭಾರತ4ഭാരതം5ලංකා4คอม3ไทย3ລາວ3გე2みんな3アマゾン4クラウド4グーグル4コム2ストア3セール3ファッション6ポイント4世界2中信1国1國1文网3亚马逊3企业2佛山2信息2健康2八卦2公司1益2台湾1灣2商城1店1标2嘉里0大酒店5在线2大拿2天主教3娱乐2家電2广东2微博2慈善2我爱你3手机2招聘2政务1府2新加坡2闻2时尚2書籍2机构2淡马锡3游戏2澳門2点看2移动2组织机构4网址1店1站1络2联通2谷歌2购物2通販2集团2電訊盈科4飞利浦3食品2餐厅2香格里拉3港2닷넷1컴2삼성2한국2';
 
-  /**
-   * @template A
-   * @template B
-   * @param {A} target
-   * @param {B} properties
-   * @return {A & B}
-   */
-  const assign = (target, properties) => {
-    for (const key in properties) {
-      target[key] = properties[key];
-    }
-    return target;
-  };
-
   /**
    * Finite State Machine generation utilities
    */
@@ -57581,7 +57678,7 @@ img.ProseMirror-separator {
         templateState = state.go(input);
       if (templateState) {
         nextState = new State();
-        assign(nextState.j, templateState.j);
+        Object.assign(nextState.j, templateState.j);
         nextState.jr.push.apply(nextState.jr, templateState.jr);
         nextState.jd = templateState.jd;
         nextState.t = templateState.t;
@@ -57592,7 +57689,7 @@ img.ProseMirror-separator {
         // Ensure newly token is in the same groups as the old token
         if (groups) {
           if (nextState.t && typeof nextState.t === 'string') {
-            const allFlags = assign(flagsForToken(nextState.t, groups), flags);
+            const allFlags = Object.assign(flagsForToken(nextState.t, groups), flags);
             addToGroups(t, allFlags, groups);
           } else if (flags) {
             addToGroups(t, flags, groups);
@@ -58031,7 +58128,7 @@ img.ProseMirror-separator {
     Start.jd = new State(SYM);
     return {
       start: Start,
-      tokens: assign({
+      tokens: Object.assign({
         groups
       }, tk)
     };
@@ -58300,9 +58397,9 @@ img.ProseMirror-separator {
    *   Similar to render option
    */
   function Options(opts, defaultRender = null) {
-    let o = assign({}, defaults);
+    let o = Object.assign({}, defaults);
     if (opts) {
-      o = assign(o, opts instanceof Options ? opts.o : opts);
+      o = Object.assign(o, opts instanceof Options ? opts.o : opts);
     }
 
     // Ensure all ignored tags are uppercase
@@ -58547,7 +58644,7 @@ img.ProseMirror-separator {
         attributes.rel = rel;
       }
       if (attrs) {
-        assign(attributes, attrs);
+        Object.assign(attributes, attrs);
       }
       return {
         tagName,
@@ -61493,8 +61590,6 @@ img.ProseMirror-separator {
             }
         `));
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$t = html `
     <template role="progressbar">
         ${''
@@ -61512,7 +61607,6 @@ img.ProseMirror-separator {
         </div>
     </template>
 `;
-  /* eslint-enable @typescript-eslint/indent */
 
   /**
    * Types of spinner appearance.
@@ -61560,8 +61654,6 @@ img.ProseMirror-separator {
         <slot ${ref('labelSlot')}></slot>
     </label>
 `);
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$s = (context, definition) => html `
     <template
         class="${x => [
@@ -61692,7 +61784,6 @@ img.ProseMirror-separator {
         </${anchoredRegionTag}>
     </template>
 `;
-  /* eslint-enable @typescript-eslint/indent */
 
   // Based on: https://github.com/microsoft/fast/blob/%40microsoft/fast-foundation_v2.49.5/packages/web-components/fast-foundation/src/select/select.form-associated.ts
   /* eslint-disable max-classes-per-file */
@@ -62955,7 +63046,6 @@ img.ProseMirror-separator {
             }
         `));
 
-  // prettier-ignore
   const template$r = html `
     <template
         role="switch"
@@ -66534,7 +66624,6 @@ img.ProseMirror-separator {
           throw new Error(`Cell view tag name (${cellViewTag}) must evaluate to an element extending TableCellView`);
       }
   };
-  // prettier-ignore
   const createCellViewTemplate = (cellViewTag) => {
       validateCellViewTemplate(cellViewTag);
       return html `
@@ -67119,7 +67208,6 @@ focus outline in that case.
     }
 `;
 
-  // prettier-ignore
   const template$q = html `
     <template role="columnheader"
         class="${x => (x.alignment === TableColumnAlignment.right ? 'right-align' : '')}"
@@ -67454,7 +67542,6 @@ focus outline in that case.
     }
 `;
 
-  // prettier-ignore
   const template$p = html `
     <template role="cell" style="--ni-private-table-cell-nesting-level: ${x => x.nestingLevel}"
         @focusin="${x => x.onCellFocusIn()}"
@@ -67558,7 +67645,6 @@ focus outline in that case.
   DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableCell());
   const tableCellTag = 'nimble-table-cell';
 
-  // prettier-ignore
   const template$o = html `
     <template 
         role="row"
@@ -68049,8 +68135,6 @@ focus outline in that case.
             }
         `));
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$n = html `
     <template
         role="row"
@@ -68091,7 +68175,6 @@ focus outline in that case.
         </div>
     </template>
 `;
-  /* eslint-enable @typescript-eslint/indent */
 
   /**
    * A styled cell that is used within the nimble-table-row.
@@ -68215,7 +68298,6 @@ focus outline in that case.
   DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleTableGroupRow());
   const tableGroupRowTag = 'nimble-table-group-row';
 
-  // prettier-ignore
   const template$m = html `
     <template
         role="treegrid"
@@ -71195,8 +71277,7 @@ focus outline in that case.
           return { headerActions, columnHeaders };
       }
       canFocusColumnHeaders() {
-          return (this.table.columns.find(c => !c.columnInternals.sortingDisabled)
-              !== undefined);
+          return (this.table.columns.find(c => !c.columnInternals.sortingDisabled) !== undefined);
       }
       getCurrentRow() {
           return this.table.rowElements[this.getCurrentRowVisibleIndex()];
@@ -72351,7 +72432,6 @@ focus outline in that case.
 
   // Avoiding a wrapping <template> and be careful about starting and ending whitspace
   // so the template can be composed into other column header templates
-  // prettier-ignore
   const template$l = html `<span
     ${overflow('hasOverflow')}
     class="header-content"
@@ -72458,8 +72538,6 @@ focus outline in that case.
     }
 `;
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$k = html `
     <template
         @click="${(x, c) => {
@@ -72499,7 +72577,6 @@ focus outline in that case.
             </span>`)}
     </template>
 `;
-  /* eslint-enable @typescript-eslint/indent */
 
   /**
    * A cell view for displaying links
@@ -72978,7 +73055,6 @@ focus outline in that case.
       .register(tableColumnDateTextGroupHeaderView());
   const tableColumnDateTextGroupHeaderViewTag = 'nimble-table-column-date-text-group-header-view';
 
-  // prettier-ignore
   const template$i = html `
     <template
         class="
@@ -73755,7 +73831,6 @@ focus outline in that case.
     }
 `;
 
-  // prettier-ignore
   const template$g = html `
     ${when(x => x.visualizationTemplate, html `
             <span class="reserve-icon-size">
@@ -73932,7 +74007,6 @@ focus outline in that case.
     }
 `;
 
-  // prettier-ignore
   const template$f = html `
     ${when(x => x.visualizationTemplate, html `
             <span class="reserve-icon-size">
@@ -74280,7 +74354,6 @@ focus outline in that case.
 
   // Avoiding a wrapping <template> and be careful about starting and ending whitespace
   // so the template can be composed into other column header templates
-  // prettier-ignore
   const template$c = html `<span
     ${overflow('hasOverflow')}
     class="header-content"
@@ -75063,8 +75136,6 @@ focus outline in that case.
     }
 `;
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$b = (context, definition) => html `
     <template slot="end">
         ${when(x => x.defaultSlottedElements.length > 0, html `
@@ -75936,7 +76007,6 @@ focus outline in that case.
             }
         `));
 
-  // prettier-ignore
   const template$8 = html `
             ${when(x => x.tooltipVisible, html `
             <${anchoredRegionTag}
@@ -76314,7 +76384,6 @@ focus outline in that case.
     }
 `;
 
-  // prettier-ignore
   const template$7 = html `
     <template
         role="tree"
@@ -93811,8 +93880,6 @@ focus outline in that case.
     }
 `;
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$4 = html `
 <div class="messages"><slot></slot></div>
 <div class="input ${x => (x.inputEmpty ? 'input-empty' : '')}">
@@ -93820,7 +93887,6 @@ focus outline in that case.
     </slot>
 </div>
 `;
-  /* eslint-enable @typescript-eslint/indent */
 
   /**
    * Appearances of chat conversation.
@@ -93937,8 +94003,6 @@ focus outline in that case.
     }
 `;
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$3 = html `
 <div class="container">
     <textarea
@@ -93963,7 +94027,6 @@ focus outline in that case.
         <${iconPaperPlaneTag} slot="start"><${iconPaperPlaneTag}/>
     </${buttonTag}>    
 </div>`;
-  /* eslint-enable @typescript-eslint/indent */
 
   /**
    * A Spright component for composing and sending a chat message
@@ -94148,8 +94211,6 @@ focus outline in that case.
     }
 `;
 
-  /* eslint-disable @typescript-eslint/indent */
-  // prettier-ignore
   const template$2 = (context, definition) => html `
     <div class="container">
         ${startSlotTemplate(context, definition)}
@@ -94165,7 +94226,6 @@ focus outline in that case.
         ${endSlotTemplate(context, definition)}
     </div>
 `;
-  /* eslint-enable @typescript-eslint/indent */
 
   /**
    * A Spright component for displaying a chat message