How to use the @uifabric/styling.FontWeights.regular function in @uifabric/styling

margin: 0,
      padding: 0,
      borderRight: '1px solid',
      borderColor: palette.neutralLight,
      backgroundColor: palette.neutralLighterAlt,
      color: palette.neutralSecondary,
      boxSizing: 'border-box',
      width: 28,
      height: 28,
      fontWeight: FontWeights.regular,
      fontSize: FontSizes.small
    },
    dayOutsideBounds: disabledStyle,
    dayOutsideNavigatedMonth: lightenDaysOutsideNavigatedMonth && {
      color: palette.neutralSecondary,
      fontWeight: FontWeights.regular
    },
    dayButton: [
      getFocusStyle(theme, { inset: -2 }),
      {
        width: 24,
        height: 24,
        lineHeight: 24,
        fontSize: FontSizes.small,
        fontWeight: 'inherit',
        borderRadius: 2,
        border: 'none',
        padding: 0,
        color: 'inherit',
        backgroundColor: 'transparent',
        cursor: 'pointer',
        overflow: 'visible', // explicitly specify for IE11

return (
      <div>
        {/* summary */}
        
          {/* summary-row-1 */}
          <div>
            <div style="{{">
              <div style="{{">
                {jobInfo.name}
              </div>
              {jobInfo.frameworkName &amp;&amp; (
                <div>
                   (
                        </div></div></div></div>

const {modalTitle, monacoProps} = this.state;
    const {className, jobInfo, jobConfig, reloading, onStopJob, onReload} = this.props;

    return (
      <div>
        {/* summary */}
        
          {/* summary-row-1 */}
          <div>
            <div>
              <div style="{{minWidth:">
                <div style="{{">
                  {jobInfo.name}
                </div>
              </div>
              <div>
                <div>
                  
                </div>
                <div>
                  {printDateTime(DateTime.fromMillis(jobInfo.jobStatus.createdTime))}
                </div>
                <div>
                  </div></div></div></div></div>

padding: 0,
        margin: '0 12px 0 0',
        color: palette.neutralPrimary,
        backgroundColor: 'transparent',
        border: 'none',
        borderRadius: 2,
        overflow: 'visible', // explicitly specify for IE11
        selectors: {
          '&:nth-child(4n + 4)': {
            marginRight: 0
          },
          '&:nth-child(n + 9)': {
            marginBottom: 0
          },
          '& div': {
            fontWeight: FontWeights.regular
          },
          '&:hover': {
            color: palette.neutralDark,
            backgroundColor: palette.neutralLight,
            cursor: 'pointer',
            outline: '1px solid transparent'
          },
          '&:active': {
            backgroundColor: palette.themeLight
          }
        }
      }
    ],
    current: highlightCurrent
      ? {
          color: palette.white,

if (error) {
      setError(error);
      return;
    }
    setProcessing(true);
    onEditProfile({ email }).finally(() => setProcessing(false));
  });

  return (
    <div>
      {/* summary left */}
      <div>
        <div>
          <div style="{{">
            {userInfo.username}
          </div>
          <div>
            
              <div>{userInfo.admin ?  : }</div>
            
          </div>
        </div>
        <div></div></div></div>

root: {
        color: '#333333',
        fontWeight: FontWeights.semibold
      }
    };
    const helpfulTextStyles: ITextStyles = {
      root: {
        color: '#333333',
        fontWeight: FontWeights.regular
      }
    };
    const iconStyles: IIconStyles = {
      root: {
        color: '#0078D4',
        fontSize: 16,
        fontWeight: FontWeights.regular
      }
    };
    const footerCardSectionStyles: ICardSectionStyles = {
      root: {
        borderTop: '1px solid #F3F2F1'
      }
    };
    const backgroundImageCardSectionStyles: ICardSectionStyles = {
      root: {
        backgroundImage: 'url(https://placehold.it/256x144)',
        backgroundPosition: 'center center',
        backgroundSize: 'cover',
        height: 144
      }
    };
    const dateTextStyles: ITextStyles = {

const siteTextStyles: ITextStyles = {
      root: {
        color: '#025F52',
        fontWeight: FontWeights.semibold
      }
    };
    const descriptionTextStyles: ITextStyles = {
      root: {
        color: '#333333',
        fontWeight: FontWeights.regular
      }
    };
    const helpfulTextStyles: ITextStyles = {
      root: {
        color: '#333333',
        fontWeight: FontWeights.regular
      }
    };
    const iconStyles: IIconStyles = {
      root: {
        color: '#0078D4',
        fontSize: 16,
        fontWeight: FontWeights.regular
      }
    };
    const footerCardSectionStyles: ICardSectionStyles = {
      root: {
        alignSelf: 'stretch',
        borderLeft: '1px solid #F3F2F1'
      }
    };

padding: '14px 14px 0 0',
      selectors: {
        '.ms-Dialog-button': {
          color: palette.neutralSecondary
        },
        '.ms-Dialog-button:hover': {
          color: palette.neutralDark,
          borderRadius: effects.roundedCorner2
        }
      }
    },
    inner: {
      padding: '0 24px 24px 24px'
    },
    subText: {
      fontWeight: FontWeights.regular
    }
  };
};

export const navItem = (isActive: boolean, isSubItemActive: boolean) => css`
  width: 100%;
  position: relative;
  font-size: 12px;
  color: #605e5c;
  background: ${isActive && !isSubItemActive ? '#f2f2f2' : 'transparent'};
  font-weight: ${isActive ? FontWeights.semibold : FontWeights.regular};
  &: hover {
    color: #605e5c;
    background: #f2f2f2;
  }
  &:focus {
    outline: none;
    .ms-Fabric--isFocusVisible &::after {
      top: 0px;
      right: 1px;
      bottom: 0px;
      left: 1px;
      content: '';
      position: absolute;
      z-index: 1;
      border: 1px solid ${NeutralColors.white};
      border-image: initial;

const siteTextStyles: ITextStyles = {
      root: {
        color: '#025F52',
        fontWeight: FontWeights.semibold
      }
    };
    const descriptionTextStyles: ITextStyles = {
      root: {
        color: '#333333',
        fontWeight: FontWeights.semibold
      }
    };
    const helpfulTextStyles: ITextStyles = {
      root: {
        color: '#333333',
        fontWeight: FontWeights.regular
      }
    };
    const iconStyles: IIconStyles = {
      root: {
        color: '#0078D4',
        fontSize: 16,
        fontWeight: FontWeights.regular
      }
    };
    const footerCardSectionStyles: ICardSectionStyles = {
      root: {
        borderTop: '1px solid #F3F2F1'
      }
    };
    const backgroundImageCardSectionStyles: ICardSectionStyles = {
      root: {