All files / ts/components/banners banner.tsx

100% Statements 17/17
100% Branches 8/8
100% Functions 2/2
100% Lines 15/15

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 4532x 32x 32x                                     32x 32x 12x 12x 12x 24x 24x 24x 12x     12x                 32x   32x  
import * as classNames from 'classnames';
import * as React from 'react';
import { HTMLProps, PureComponent } from 'react';
import { ComponentProps } from '../../types';
 
export interface BannerProps extends ComponentProps, HTMLProps<HTMLElement> {
  /**
   * If set, displays the component, otherwise it is hidden
   * @default true
   */
  open?: boolean;
  /**
   * Positions the element at the 'top' or 'bottom' of the screen
   * @default 'bottom'
   */
  position?: 'top' | 'bottom';
}
 
/**
 * A Banner component that displays fixed to the top or bottom of the screen.
 */
export class Banner extends PureComponent<BannerProps, {}> {
  public render() {
    const {
      className,
      children,
      open = true,
      position = 'bottom',
      component: Component = 'div',
      ...remainingProps
    } = this.props;
 
    return (
      <Component
        {...remainingProps}
        className={classNames('banner', open && 'open', position, className)}
      >
        {children}
      </Component>
    );
  }
}
 
export default Banner;