render()

in src/button/button.tsx [95:174]


  render() {
    const {
      // Modifiers
      active,
      danger,
      delayed,
      loader,
      primary,
      success,
      error,
      secondary,
      ghost,
      short,
      text,
      dropdown,
      height,

      // Props
      icon,
      iconRight,
      iconSize,
      iconClassName,
      iconRightClassName,
      iconSuppressSizeWarning,
      className,
      children,
      inline,
      disabled,
      ...props
    } = this.props;
    const isInline = inline ?? text ?? !!icon;

    if (text) {
      warnText();
    }

    const classes = getButtonClasses({
      ...this.props,
      inline: isInline,
      height: height ?? (typeof this.context === 'function' ? this.context() : this.context),
    });

    const content = (
      <>
        {icon && (
          <Icon
            className={classNames(styles.icon, iconClassName)}
            glyph={icon}
            size={iconSize}
            suppressSizeWarning={iconSuppressSizeWarning}
          />
        )}
        {children}
        {iconRight && <Icon className={classNames(styles.iconRight, iconRightClassName)} glyph={iconRight} />}
        {dropdown && <Icon glyph={isInline ? chevron12pxDown : chevronDown} className={styles.dropdownIcon} />}
      </>
    );
    const isDisabled = disabled || loader || undefined;
    const commonProps = {
      ...(props.href !== undefined && isDisabled ? removeLinkProps(props as ButtonLinkProps) : props),
      className: classes,
      children: (
        <>
          {loader && !isInline && <div className={styles.loaderBackground} />}
          {content}
        </>
      ),
    };

    return 'href' in commonProps && commonProps.href !== undefined ? (
      <ClickableLink {...(commonProps as ClickableLinkProps)} />
    ) : (
      <button
        ref={this.buttonRef}
        type='button'
        disabled={isDisabled}
        {...(commonProps as ButtonHTMLAttributes<HTMLButtonElement>)}
      />
    );
  }