const rtlTextContainer = {
  getAttributes: (arg) => {},
  createFor: (content, options) => null
}

/////////////////

// Button

class Button extends UIComponent<ReactProps<ButtonProps>, ButtonState> {

  public renderComponent({
    ElementType,
    classes,
    accessibility,
    variables,
    styles,
    unhandledProps,
    rtlAttributes,
  }): React.ReactNode {
    const { children, content, disabled, iconPosition } = this.props
    const hasChildren = childrenExist(children)

    return (
      <ElementType
        className={classes.root}
        disabled={disabled}
        onClick={this.handleClick}
        onFocus={this.handleFocus}
        {...accessibility.attributes.root}
        {...rtlTextContainer.getAttributes({ forChildren: children /* sloppy, but just as an example */  })}  // <---
        {...unhandledProps}
      >
        {hasChildren && children}
        {!hasChildren && iconPosition !== 'after' && this.renderIcon(variables, styles)}
        {Box.create(!hasChildren && content, {
          defaultProps: { as: 'span', styles: styles.content },
        })}
        {!hasChildren && iconPosition === 'after' && this.renderIcon(variables, styles)}
      </ElementType>
    )
  }
  ...
}
export default Button

///////////////////

// Header
class Header extends UIComponent<ReactProps<HeaderProps>, any> {
  renderComponent({ ElementType, classes, variables: v, unhandledProps, rtlAttributes }) {
    const { children, description, content } = this.props

    const hasChildren = childrenExist(children)
    const contentElement = childrenExist(children) ? children : content
    return (

      // here we are consuming attributes
      <ElementType {...rtlTextContainer.getAttributes({ if: !description })} {...unhandledProps} className={classes.root}>
        {rtlTextContainer.createFor(contentElement, { if: description} )}   // <------ here we are creating element
        {!hasChildren &&
          HeaderDescription.create(description, {
            defaultProps: {
              variables: {
                ...(v.descriptionColor && { color: v.descriptionColor }),
              },
            },
          })}
      </ElementType>
    )
  }
}

export default Header