ost-ui/dist/npm/OstList/index.js

ost ui for react

import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import arrowRightSvg from './arrowRight.svg';
import arrowBottomSvg from './arrowBottom.svg';
import arrowTopSvg from './arrowTop.svg';
import tipsIconSvg from './tipsIcon.svg';

var Item = function (_Component) {
  _inherits(Item, _Component);

  function Item() {
    _classCallCheck(this, Item);

    return _possibleConstructorReturn(this, _Component.apply(this, arguments));
  }

  Item.prototype.render = function render() {
    var _props = this.props,
        text = _props.text,
        style = _props.style,
        _onClick = _props.onClick,
        arrowTo = _props.arrowTo,
        placeholder = _props.placeholder,
        disabled = _props.disabled;


    return React.createElement(
      'div',
      { className: 'ost-card-item', style: style, onClick: function onClick() {
          return !disabled && _onClick();
        } },
      React.createElement(
        'span',
        {
          className: classnames("ost-card-item-text", {
            "ost-card-item-text-placeholder": !text,
            "ost-card-item-text-disabled": disabled
          }) },
        text ? text : placeholder
      ),
      React.createElement(
        'span',
        { className: 'ost-card-item-icon' },
        arrowTo && React.createElement('img', { src: arrowTo === 'right' ? arrowRightSvg : arrowTo === 'top' ? arrowTopSvg : arrowTo === 'bottom' ? arrowBottomSvg : null })
      )
    );
  };

  return Item;
}(Component);

var Card = function (_Component2) {
  _inherits(Card, _Component2);

  function Card() {
    _classCallCheck(this, Card);

    return _possibleConstructorReturn(this, _Component2.apply(this, arguments));
  }

  Card.prototype.render = function render() {
    var _props2 = this.props,
        children = _props2.children,
        style = _props2.style,
        title = _props2.title,
        titleStyle = _props2.titleStyle;


    return React.createElement(
      'div',
      { className: 'ost-card', style: style },
      title && React.createElement(
        'span',
        { className: 'ost-card-title', style: titleStyle },
        title
      ),
      children
    );
  };

  return Card;
}(Component);

var OstList = function (_Component3) {
  _inherits(OstList, _Component3);

  function OstList() {
    _classCallCheck(this, OstList);

    return _possibleConstructorReturn(this, _Component3.apply(this, arguments));
  }

  OstList.prototype.render = function render() {
    var _props3 = this.props,
        title = _props3.title,
        desc = _props3.desc,
        children = _props3.children,
        style = _props3.style,
        tips = _props3.tips;


    return React.createElement(
      'div',
      { className: 'ost-card-list', style: style },
      React.createElement(
        'div',
        { className: 'ost-card-list-title', style: { width: desc ? '100%' : null } },
        React.createElement(
          'div',
          { className: 'ost-card-list-title-box' },
          React.createElement(
            'span',
            { className: 'ost-card-list-title-box-text' },
            title,
            tips && React.createElement('img', {
              src: tipsIconSvg,
              onClick: function onClick() {
                tips && tips();
              },
              className: 'ost-card-list-title-box-tips' })
          ),
          desc && React.createElement(
            'p',
            { className: 'ost-card-list-title-desc' },
            ' ',
            desc,
            ' '
          )
        )
      ),
      React.createElement(
        'div',
        { className: 'ost-card-list-children', style: { width: desc ? 'auto' : null } },
        children
      )
    );
  };

  return OstList;
}(Component);

OstList.item = Item;
OstList.card = Card;
export default OstList;


OstList.propTypes = {
  style: PropTypes.object
};