@ni/nimble-components 26.0.0 → 27.0.0

package/dist/all-components-bundle.js

@@ -16333,7 +16333,7 @@
 
   /**
    * Do not edit directly
-   * Generated on Mon, 22 Apr 2024 14:57:19 GMT
+   * Generated on Wed, 24 Apr 2024 16:04:06 GMT
    */
 
   const Information100DarkUi = "#a46eff";
@@ -16531,7 +16531,6 @@
       headlinePlus1FontSize: 'headline-plus-1-font-size',
       headlinePlus1FontWeight: 'headline-plus-1-font-weight',
       headlinePlus1FontLineHeight: 'headline-plus-1-font-line-height',
-      headlinePlus1FallbackFontFamily: 'headline-plus-1-fallback-font-family',
       headlineFont: 'headline-font',
       headlineFontColor: 'headline-font-color',
       headlineDisabledFontColor: 'headline-disabled-font-color',
@@ -16539,7 +16538,6 @@
       headlineFontSize: 'headline-font-size',
       headlineFontWeight: 'headline-font-weight',
       headlineFontLineHeight: 'headline-font-line-height',
-      headlineFallbackFontFamily: 'headline-fallback-font-family',
       tableHeaderFont: 'table-header-font',
       tableHeaderFontColor: 'table-header-font-color',
       tableHeaderDisabledFontColor: 'table-header-disabled-font-color',
@@ -16547,7 +16545,6 @@
       tableHeaderFontSize: 'table-header-font-size',
       tableHeaderFontWeight: 'table-header-font-weight',
       tableHeaderFontLineHeight: 'table-header-font-line-height',
-      tableHeaderFallbackFontFamily: 'table-header-fallback-font-family',
       titlePlus2Font: 'title-plus-2-font',
       titlePlus2FontColor: 'title-plus-2-font-color',
       titlePlus2DisabledFontColor: 'title-plus-2-disabled-font-color',
@@ -16555,7 +16552,6 @@
       titlePlus2FontSize: 'title-plus-2-font-size',
       titlePlus2FontWeight: 'title-plus-2-font-weight',
       titlePlus2FontLineHeight: 'title-plus-2-font-line-height',
-      titlePlus2FallbackFontFamily: 'title-plus-2-fallback-font-family',
       titlePlus1Font: 'title-plus-1-font',
       titlePlus1FontColor: 'title-plus-1-font-color',
       titlePlus1DisabledFontColor: 'title-plus-1-disabled-font-color',
@@ -16563,7 +16559,6 @@
       titlePlus1FontSize: 'title-plus-1-font-size',
       titlePlus1FontWeight: 'title-plus-1-font-weight',
       titlePlus1FontLineHeight: 'title-plus-1-font-line-height',
-      titlePlus1FallbackFontFamily: 'title-plus-1-fallback-font-family',
       titleFont: 'title-font',
       titleFontColor: 'title-font-color',
       titleDisabledFontColor: 'title-disabled-font-color',
@@ -16571,7 +16566,6 @@
       titleFontSize: 'title-font-size',
       titleFontWeight: 'title-font-weight',
       titleFontLineHeight: 'title-font-line-height',
-      titleFallbackFontFamily: 'title-fallback-font-family',
       subtitlePlus1Font: 'subtitle-plus-1-font',
       subtitlePlus1FontColor: 'subtitle-plus-1-font-color',
       subtitlePlus1DisabledFontColor: 'subtitle-plus-1-disabled-font-color',
@@ -16579,7 +16573,6 @@
       subtitlePlus1FontSize: 'subtitle-plus-1-font-size',
       subtitlePlus1FontWeight: 'subtitle-plus-1-font-weight',
       subtitlePlus1FontLineHeight: 'subtitle-plus-1-font-line-height',
-      subtitlePlus1FallbackFontFamily: 'subtitle-plus-1-fallback-font-family',
       subtitleFont: 'subtitle-font',
       subtitleFontColor: 'subtitle-font-color',
       subtitleDisabledFontColor: 'subtitle-disabled-font-color',
@@ -16587,7 +16580,6 @@
       subtitleFontSize: 'subtitle-font-size',
       subtitleFontWeight: 'subtitle-font-weight',
       subtitleFontLineHeight: 'subtitle-font-line-height',
-      subtitleFallbackFontFamily: 'subtitle-fallback-font-family',
       linkFont: 'link-font',
       linkFontColor: 'link-font-color',
       linkDisabledFontColor: 'link-disabled-font-color',
@@ -16595,7 +16587,6 @@
       linkFontSize: 'link-font-size',
       linkFontWeight: 'link-font-weight',
       linkFontLineHeight: 'link-font-line-height',
-      linkFallbackFontFamily: 'link-fallback-font-family',
       linkActiveFont: 'link-active-font',
       linkActiveFontColor: 'link-active-font-color',
       linkActiveDisabledFontColor: 'link-active-disabled-font-color',
@@ -16603,7 +16594,6 @@
       linkActiveFontSize: 'link-active-font-size',
       linkActiveFontWeight: 'link-active-font-weight',
       linkActiveFontLineHeight: 'link-active-font-line-height',
-      linkActiveFallbackFontFamily: 'link-active-fallback-font-family',
       linkProminentFont: 'link-prominent-font',
       linkProminentFontColor: 'link-prominent-font-color',
       linkProminentDisabledFontColor: 'link-prominent-disabled-font-color',
@@ -16611,7 +16601,6 @@
       linkProminentFontSize: 'link-prominent-font-size',
       linkProminentFontWeight: 'link-prominent-font-weight',
       linkProminentFontLineHeight: 'link-prominent-font-line-height',
-      linkProminentFallbackFontFamily: 'link-prominent-fallback-font-family',
       linkActiveProminentFont: 'link-active-prominent-font',
       linkActiveProminentFontColor: 'link-active-prominent-font-color',
       linkActiveProminentDisabledFontColor: 'link-active-prominent-disabled-font-color',
@@ -16619,7 +16608,6 @@
       linkActiveProminentFontSize: 'link-active-prominent-font-size',
       linkActiveProminentFontWeight: 'link-active-prominent-font-weight',
       linkActiveProminentFontLineHeight: 'link-active-prominent-font-line-height',
-      linkActiveProminentFallbackFontFamily: 'link-active-prominent-fallback-font-family',
       placeholderFont: 'placeholder-font',
       placeholderFontColor: 'placeholder-font-color',
       placeholderDisabledFontColor: 'placeholder-disabled-font-color',
@@ -16627,7 +16615,6 @@
       placeholderFontSize: 'placeholder-font-size',
       placeholderFontWeight: 'placeholder-font-weight',
       placeholderFontLineHeight: 'placeholder-font-line-height',
-      placeholderFallbackFontFamily: 'placeholder-fallback-font-family',
       bodyFont: 'body-font',
       bodyFontColor: 'body-font-color',
       bodyDisabledFontColor: 'body-disabled-font-color',
@@ -16635,7 +16622,6 @@
       bodyFontSize: 'body-font-size',
       bodyFontWeight: 'body-font-weight',
       bodyFontLineHeight: 'body-font-line-height',
-      bodyFallbackFontFamily: 'body-fallback-font-family',
       bodyEmphasizedFont: 'body-emphasized-font',
       bodyEmphasizedFontColor: 'body-emphasized-font-color',
       bodyEmphasizedDisabledFontColor: 'body-emphasized-disabled-font-color',
@@ -16643,7 +16629,6 @@
       bodyEmphasizedFontSize: 'body-emphasized-font-size',
       bodyEmphasizedFontWeight: 'body-emphasized-font-weight',
       bodyEmphasizedFontLineHeight: 'body-emphasized-font-line-height',
-      bodyEmphasizedFallbackFontFamily: 'body-emphasized-fallback-font-family',
       bodyPlus1Font: 'body-plus-1-font',
       bodyPlus1FontColor: 'body-plus-1-font-color',
       bodyPlus1DisabledFontColor: 'body-plus-1-disabled-font-color',
@@ -16651,7 +16636,6 @@
       bodyPlus1FontSize: 'body-plus-1-font-size',
       bodyPlus1FontWeight: 'body-plus-1-font-weight',
       bodyPlus1FontLineHeight: 'body-plus-1-font-line-height',
-      bodyPlus1FallbackFontFamily: 'body-plus-1-fallback-font-family',
       bodyPlus1EmphasizedFont: 'body-plus-1-emphasized-font',
       bodyPlus1EmphasizedFontColor: 'body-plus-1-emphasized-font-color',
       bodyPlus1EmphasizedDisabledFontColor: 'body-plus-1-emphasized-disabled-font-color',
@@ -16659,7 +16643,6 @@
       bodyPlus1EmphasizedFontSize: 'body-plus-1-emphasized-font-size',
       bodyPlus1EmphasizedFontWeight: 'body-plus-1-emphasized-font-weight',
       bodyPlus1EmphasizedFontLineHeight: 'body-plus-1-emphasized-font-line-height',
-      bodyPlus1EmphasizedFallbackFontFamily: 'body-plus-1-emphasized-fallback-font-family',
       groupHeaderFont: 'group-header-font',
       groupHeaderFontColor: 'group-header-font-color',
       groupHeaderDisabledFontColor: 'group-header-disabled-font-color',
@@ -16667,7 +16650,6 @@
       groupHeaderFontSize: 'group-header-font-size',
       groupHeaderFontWeight: 'group-header-font-weight',
       groupHeaderFontLineHeight: 'group-header-font-line-height',
-      groupHeaderFallbackFontFamily: 'group-header-fallback-font-family',
       controlLabelFont: 'control-label-font',
       controlLabelFontColor: 'control-label-font-color',
       controlLabelDisabledFontColor: 'control-label-disabled-font-color',
@@ -16675,7 +16657,6 @@
       controlLabelFontSize: 'control-label-font-size',
       controlLabelFontWeight: 'control-label-font-weight',
       controlLabelFontLineHeight: 'control-label-font-line-height',
-      controlLabelFallbackFontFamily: 'control-label-fallback-font-family',
       buttonLabelFont: 'button-label-font',
       buttonLabelFontColor: 'button-label-font-color',
       buttonLabelDisabledFontColor: 'button-label-disabled-font-color',
@@ -16683,7 +16664,6 @@
       buttonLabelFontSize: 'button-label-font-size',
       buttonLabelFontWeight: 'button-label-font-weight',
       buttonLabelFontLineHeight: 'button-label-font-line-height',
-      buttonLabelFallbackFontFamily: 'button-label-fallback-font-family',
       tooltipCaptionFont: 'tooltip-caption-font',
       tooltipCaptionFontColor: 'tooltip-caption-font-color',
       tooltipCaptionDisabledFontColor: 'tooltip-caption-disabled-font-color',
@@ -16691,7 +16671,6 @@
       tooltipCaptionFontSize: 'tooltip-caption-font-size',
       tooltipCaptionFontWeight: 'tooltip-caption-font-weight',
       tooltipCaptionFontLineHeight: 'tooltip-caption-font-line-height',
-      tooltipCaptionFallbackFontFamily: 'tooltip-caption-fallback-font-family',
       tooltipBackgroundColor: 'tooltip-background-color',
       errorTextFont: 'error-text-font',
       errorTextFontColor: 'error-text-font-color',
@@ -16700,7 +16679,6 @@
       errorTextFontSize: 'error-text-font-size',
       errorTextFontWeight: 'error-text-font-weight',
       errorTextFontLineHeight: 'error-text-font-line-height',
-      errorTextFallbackFontFamily: 'error-text-fallback-font-family',
       tableRowBorderColor: 'table-row-border-color',
       elevation1BoxShadow: 'elevation-1-box-shadow',
       elevation2BoxShadow: 'elevation-2-box-shadow',
@@ -16712,8 +16690,7 @@
       mentionFontFamily: 'mention-font-family',
       mentionFontSize: 'mention-font-size',
       mentionFontWeight: 'mention-font-weight',
-      mentionFontLineHeight: 'mention-font-line-height',
-      mentionFallbackFontFamily: 'mention-fallback-font-family'
+      mentionFontLineHeight: 'mention-font-line-height'
   };
   const prefix = 'ni-nimble';
   const styleNameFromTokenName = (tokenName) => `${prefix}-${tokenName}`;
@@ -16897,27 +16874,6 @@
       .register(nimbleDesignSystemProvider());
   const themeProviderTag = 'nimble-theme-provider';
 
-  /* eslint-disable @typescript-eslint/naming-convention */
-  const Headline1FallbackFontFamily = 'Noto Serif Fallback';
-  const Headline2FallbackFontFamily = 'Noto Serif Fallback';
-  const Title1FallbackFontFamily = 'Source Sans Pro Fallback';
-  const Title2FallbackFontFamily = 'Source Sans Pro Fallback';
-  const Title3FallbackFontFamily = 'Source Sans Pro Fallback';
-  const Subtitle1FallbackFontFamily = 'Source Sans Pro Fallback';
-  const Subtitle2FallbackFontFamily = 'Source Sans Pro Fallback';
-  const LinkFallbackFontFamily = 'Source Sans Pro Fallback';
-  const PlaceholderFallbackFontFamily = 'Source Sans Pro Fallback';
-  const BodyFallbackFontFamily = 'Source Sans Pro Fallback';
-  const Body2FallbackFontFamily = 'Source Sans Pro Fallback';
-  const BodyEmphasizedFallbackFontFamily = 'Source Sans Pro Fallback';
-  const BodyEmphasized2FallbackFontFamily = 'Source Sans Pro Fallback';
-  const GroupLabel1FallbackFontFamily = 'Source Sans Pro Fallback';
-  const ControlLabel1FallbackFontFamily = 'Source Sans Pro Fallback';
-  const ButtonLabel1FallbackFontFamily = 'Source Sans Pro Fallback';
-  const TooltipCaptionFallbackFontFamily = 'Source Sans Pro Fallback';
-  const ErrorLightUiFallbackFontFamily = 'Source Sans Pro Fallback';
-  const GridHeaderFallbackFontFamily = 'Source Sans Pro Fallback';
-  /* eslint-enable @typescript-eslint/naming-convention */
   // Color Tokens
   const actionRgbPartialColor = DesignToken.create(styleNameFromTokenName(tokenNames.actionRgbPartialColor)).withDefault((element) => hexToRgbPartial(getColorForTheme(element, Black91, Black15, White)));
   const applicationBackgroundColor = DesignToken.create(styleNameFromTokenName(tokenNames.applicationBackgroundColor)).withDefault((element) => getColorForTheme(element, White, Black85, ForestGreen));
@@ -16978,29 +16934,29 @@
   const elevation2BoxShadow = DesignToken.create(styleNameFromTokenName(tokenNames.elevation2BoxShadow)).withDefault((element) => `0px 2px 4px ${hexToRgbaCssColor(getColorForTheme(element, Black, Black, Black), 0.16)}`);
   const elevation3BoxShadow = DesignToken.create(styleNameFromTokenName(tokenNames.elevation3BoxShadow)).withDefault((element) => `0px 4px 8px ${hexToRgbaCssColor(getColorForTheme(element, Black, Black, Black), 0.3)}`);
   // Font Tokens
-  createFontTokens(tokenNames.headlineFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Headline1Family, Headline1Weight, Headline1Size, Headline1LineHeight, Headline1FallbackFontFamily);
-  createFontTokens(tokenNames.headlinePlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Headline2Family, Headline2Weight, Headline2Size, Headline2LineHeight, Headline2FallbackFontFamily);
-  createFontTokens(tokenNames.titlePlus2Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Title3Family, Title3Weight, Title3Size, Title3LineHeight, Title3FallbackFontFamily);
-  const [titlePlus1Font, titlePlus1FontColor, titlePlus1DisabledFontColor, titlePlus1FontFamily, titlePlus1FontWeight, titlePlus1FontSize, titlePlus1FontLineHeight, titlePlus1FallbackFontFamily] = createFontTokens(tokenNames.titlePlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Title2Family, Title2Weight, Title2Size, Title2LineHeight, Title2FallbackFontFamily);
-  createFontTokens(tokenNames.titleFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Title1Family, Title1Weight, Title1Size, Title1LineHeight, Title1FallbackFontFamily);
-  const [subtitlePlus1Font, subtitlePlus1FontColor, subtitlePlus1DisabledFontColor, subtitlePlus1FontFamily, subtitlePlus1FontWeight, subtitlePlus1FontSize, subtitlePlus1FontLineHeight, subtitlePlus1FallbackFontFamily] = createFontTokens(tokenNames.subtitlePlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Subtitle2Family, Subtitle2Weight, Subtitle2Size, Subtitle2LineHeight, Subtitle2FallbackFontFamily);
-  const [subtitleFont, subtitleFontColor, subtitleDisabledFontColor, subtitleFontFamily, subtitleFontWeight, subtitleFontSize, subtitleFontLineHeight, subtitleFallbackFontFamily] = createFontTokens(tokenNames.subtitleFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Subtitle1Family, Subtitle1Weight, Subtitle1Size, Subtitle1LineHeight, Subtitle1FallbackFontFamily);
-  const [linkFont, linkFontColor, linkDisabledFontColor, linkFontFamily, linkFontWeight, linkFontSize, linkFontLineHeight, linkFallbackFontFamily] = createFontTokens(tokenNames.linkFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight, LinkFallbackFontFamily);
-  const [linkActiveFont, linkActiveFontColor, linkActiveDisabledFontColor, linkActiveFontFamily, linkActiveFontWeight, linkActiveFontSize, linkActiveFontLineHeight, linkActiveFallbackFontFamily] = createFontTokens(tokenNames.linkActiveFont, (element) => getColorForTheme(element, DigitalGreenLight, DigitalGreenLight, hexToRgbaCssColor(White, 0.6)), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight, LinkFallbackFontFamily);
-  const [linkProminentFont, linkProminentFontColor, linkProminentDisabledFontColor, linkProminentFontFamily, linkProminentFontWeight, linkProminentFontSize, linkProminentFontLineHeight, linkProminentFallbackFontFamily] = createFontTokens(tokenNames.linkProminentFont, (element) => getColorForTheme(element, DigitalGreenDark105, PowerGreen, PowerGreen), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight, LinkFallbackFontFamily);
-  const [linkActiveProminentFont, linkActiveProminentFontColor, linkActiveProminentDisabledFontColor, linkActiveProminentFontFamily, linkActiveProminentFontWeight, linkActiveProminentFontSize, linkActiveProminentFontLineHeight, linkActiveProminentFallbackFontFamily] = createFontTokens(tokenNames.linkActiveProminentFont, (element) => getColorForTheme(element, DigitalGreenLight, DigitalGreenLight, hexToRgbaCssColor(White, 0.6)), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), LinkLightUiFamily, LinkLightUiWeight, LinkLightUiSize, LinkLineHeight, LinkFallbackFontFamily);
-  const [placeholderFont, placeholderFontColor, placeholderDisabledFontColor, placeholderFontFamily, placeholderFontWeight, placeholderFontSize, placeholderFontLineHeight, placeholderFallbackFontFamily] = createFontTokens(tokenNames.placeholderFont, (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.6), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), PlaceholderFamily, PlaceholderWeight, PlaceholderSize, PlaceholderLineHeight, PlaceholderFallbackFontFamily);
-  const [bodyFont, bodyFontColor, bodyDisabledFontColor, bodyFontFamily, bodyFontWeight, bodyFontSize, bodyFontLineHeight, bodyFallbackFontFamily] = createFontTokens(tokenNames.bodyFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyFamily, BodyWeight, BodySize, BodyLineHeight, BodyFallbackFontFamily);
-  const [bodyEmphasizedFont, bodyEmphasizedFontColor, bodyEmphasizedDisabledFontColor, bodyEmphasizedFontFamily, bodyEmphasizedFontWeight, bodyEmphasizedFontSize, bodyEmphasizedFontLineHeight, bodyEmphasizedFallbackFontFamily] = createFontTokens(tokenNames.bodyEmphasizedFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyEmphasizedFamily, BodyEmphasizedWeight, BodyEmphasizedSize, BodyEmphasizedLineHeight, BodyEmphasizedFallbackFontFamily);
-  createFontTokens(tokenNames.bodyPlus1Font, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), Body2Family, Body2Weight, Body2Size, Body2LineHeight, Body2FallbackFontFamily);
-  createFontTokens(tokenNames.bodyPlus1EmphasizedFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyEmphasized2Family, BodyEmphasized2Weight, BodyEmphasized2Size, BodyEmphasized2LineHeight, BodyEmphasized2FallbackFontFamily);
-  const [groupHeaderFont, groupHeaderFontColor, groupHeaderDisabledFontColor, groupHeaderFontFamily, groupHeaderFontWeight, groupHeaderFontSize, groupHeaderFontLineHeight, groupHeaderFallbackFontFamily] = createFontTokens(tokenNames.groupHeaderFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), GroupLabel1Family, GroupLabel1Weight, GroupLabel1Size, GroupLabel1LineHeight, GroupLabel1FallbackFontFamily);
-  const [controlLabelFont, controlLabelFontColor, controlLabelDisabledFontColor, controlLabelFontFamily, controlLabelFontWeight, controlLabelFontSize, controlLabelFontLineHeight, controlLabelFallbackFontFamily] = createFontTokens(tokenNames.controlLabelFont, (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.6), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), ControlLabel1Family, ControlLabel1Weight, ControlLabel1Size, ControlLabel1LineHeight, ControlLabel1FallbackFontFamily);
-  const [buttonLabelFont, buttonLabelFontColor, buttonLabelDisabledFontColor, buttonLabelFontFamily, buttonLabelFontWeight, buttonLabelFontSize, buttonLabelFontLineHeight, buttonLabelFallbackFontFamily] = createFontTokens(tokenNames.buttonLabelFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), ButtonLabel1Family, ButtonLabel1Weight, ButtonLabel1Size, ButtonLabel1LineHeight, ButtonLabel1FallbackFontFamily);
-  const [tooltipCaptionFont, tooltipCaptionFontColor, tooltipCaptionDisabledFontColor, tooltipCaptionFontFamily, tooltipCaptionFontWeight, tooltipCaptionFontSize, tooltipCaptionFontLineHeight, tooltipCaptionFallbackFontFamily] = createFontTokens(tokenNames.tooltipCaptionFont, (element) => getDefaultFontColorForTheme(element), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), TooltipCaptionFamily, TooltipCaptionWeight, TooltipCaptionSize, TooltipCaptionLineHeight, TooltipCaptionFallbackFontFamily);
-  const [errorTextFont, errorTextFontColor, errorTextDisabledFontColor, errorTextFontFamily, errorTextFontWeight, errorTextFontSize, errorTextFontLineHeight, errorTextFallbackFontFamily] = createFontTokens(tokenNames.errorTextFont, (element) => getFailColorForTheme(element), (element) => hexToRgbaCssColor(getFailColorForTheme(element), 0.3), ErrorLightUiFamily, ErrorLightUiWeight, ErrorLightUiSize, TooltipCaptionLineHeight, ErrorLightUiFallbackFontFamily);
-  const [tableHeaderFont, tableHeaderFontColor, tableHeaderDisabledFontColor, tableHeaderFontFamily, tableHeaderFontWeight, tableHeaderFontSize, tableHeaderFontLineHeight, tableHeaderFallbackFontFamily] = createFontTokens(tokenNames.tableHeaderFont, (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.6), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), GridHeaderFamily, GridHeaderWeight, GridHeaderSize, TooltipCaptionLineHeight, GridHeaderFallbackFontFamily);
-  createFontTokens(tokenNames.mentionFont, (element) => getColorForTheme(element, DigitalGreenDark, PowerGreen, PowerGreen), (element) => hexToRgbaCssColor(getDefaultFontColorForTheme(element), 0.3), BodyFamily, BodyEmphasizedWeight, BodySize, BodyLineHeight, BodyFallbackFontFamily);
+  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);
+  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.6)), (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, PowerGreen), (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.6)), (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 [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);
+  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 [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 [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);
+  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');
   // Animation Tokens
@@ -17012,16 +16968,16 @@
       const { r, g, b } = parseColorHexRGB(hexValue);
       return `${r * 255}, ${g * 255}, ${b * 255}`;
   }
-  function createFontTokens(fontTokenName, colorFunction, disabledColorFunction, family, weight, size, lineHeight, fallbackFamily) {
+  function createFontTokens(fontTokenName, colorFunction, disabledColorFunction, family, weight, size, lineHeight) {
       if (fontTokenName === ''
           || family === ''
           || weight === ''
           || size === ''
-          || lineHeight === ''
-          || fallbackFamily === '') {
+          || lineHeight === '') {
           throw new Error('createFontTokens parameter unexpectedly set to empty string');
       }
-      const fontToken = DesignToken.create(styleNameFromTokenName(fontTokenName)).withDefault(`${weight} ${size}/${lineHeight} ${family}, ${fallbackFamily}`);
+      const familyWithFallback = `${family}, ${family} Fallback`;
+      const fontToken = DesignToken.create(styleNameFromTokenName(fontTokenName)).withDefault(`${weight} ${size}/${lineHeight} ${familyWithFallback}`);
       const fontNameParts = fontTokenName.split('-font');
       const tokenPrefixWithoutFont = fontNameParts[0];
       if (tokenPrefixWithoutFont === undefined || fontNameParts[1] !== '') {
@@ -17029,11 +16985,10 @@
       }
       const fontColorToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-color`)).withDefault((element) => colorFunction(element));
       const fontDisabledColorToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-disabled-font-color`)).withDefault((element) => disabledColorFunction(element));
-      const fontFamilyToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-family`)).withDefault(`${family}`);
-      const fontWeightToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-weight`)).withDefault(`${weight}`);
-      const fontSizeToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-size`)).withDefault(`${size}`);
-      const fontLineHeightToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-line-height`)).withDefault(`${lineHeight}`);
-      const fontFallbackFamilyToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-fallback-font-family`)).withDefault(`${fallbackFamily}`);
+      const fontFamilyToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-family`)).withDefault(familyWithFallback);
+      const fontWeightToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-weight`)).withDefault(weight);
+      const fontSizeToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-size`)).withDefault(size);
+      const fontLineHeightToken = DesignToken.create(styleNameFromTokenName(`${tokenPrefixWithoutFont}-font-line-height`)).withDefault(lineHeight);
       return [
           fontToken,
           fontColorToken,
@@ -17041,8 +16996,7 @@
           fontFamilyToken,
           fontWeightToken,
           fontSizeToken,
-          fontLineHeightToken,
-          fontFallbackFamilyToken
+          fontLineHeightToken
       ];
   }
   function getColorForTheme(element, lightThemeColor, darkThemeColor, colorThemeColor) {