wix-style-react/dist/es/src/TableToolbar/Toolbar.js

wix-style-react

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React from 'react';
import { any, oneOf } from 'prop-types';
import classNames from 'classnames';
import s from './Toolbar.scss';
import OriginaLabel from '../Label';

export var Toolbar = function Toolbar(props) {
  return React.createElement(
    'div',
    { className: s.toolbar },
    props.children
  );
};
Toolbar.displayName = 'Toolbar';
Toolbar.propTypes = {
  children: any // TODO: validate children are of type <ItemGroup>
};

export var ItemGroup = function ItemGroup(props) {
  var classes = classNames([s.itemGroup, {
    positionStart: props.position === 'start',
    positionEnd: props.position === 'end'
  }]);

  return React.createElement(
    'div',
    { className: classes },
    props.children
  );
};
ItemGroup.displayName = 'Toolbar.ItemGroup';
ItemGroup.propTypes = {
  children: any, // TODO: validate children are either <Item> od <Divider>
  position: oneOf(['start', 'end'])
};
ItemGroup.defaultProps = {
  position: 'start'
};

export var Item = function Item(props) {
  var classes = classNames([s.item, _defineProperty({}, s.layoutButton, props.layout === 'button')]);

  return React.createElement(
    'span',
    { className: classes },
    props.children
  );
};
Item.displayName = 'Toolbar.Item';
Item.propTypes = {
  children: any,
  layout: oneOf(['button'])
};

/**
 * Similar to the original WSR Label, but the label is displayed on the same line as the target element (and not above it).
 * TODO:; we might want to simply add this ability to the existing Label.
 */
export var Label = function Label(props) {
  return React.createElement(
    OriginaLabel,
    _extends({}, props, { className: s.itemLabel }),
    React.Children.toArray(props.children).map(function (c, index) {
      return typeof c === 'string' ? React.createElement(
        'span',
        { key: index },
        c
      ) : c;
    })
  );
};
Label.displayName = 'Toolbar.Label';
Label.propTypes = {
  children: any
};

export var Divider = function Divider() {
  return React.createElement('span', { className: s.divider });
};
Divider.displayName = 'Toolbar.Divider';

// Aliases for convenience
Toolbar.ItemGroup = ItemGroup;
Toolbar.Item = Item;
Toolbar.Label = Label;
Toolbar.Divider = Divider;