@gssfed/vital-ui-kit-react/dist/Track/Track.js

Vital UI Kit for React!

var _templateObject = _taggedTemplateLiteral(['\n  position: relative;\n  margin: 0;\n  padding: 0;\n  top: 50%;\n  left: 0;\n  height: ', ';\n  margin-top: -4px;\n  background-repeat: repeat-x;\n  border-radius: 5px;\n  border-color: ', ';\n  width: 100%;\n  background-color: ', ';\n  ', ';\n'], ['\n  position: relative;\n  margin: 0;\n  padding: 0;\n  top: 50%;\n  left: 0;\n  height: ', ';\n  margin-top: -4px;\n  background-repeat: repeat-x;\n  border-radius: 5px;\n  border-color: ', ';\n  width: 100%;\n  background-color: ', ';\n  ', ';\n']);

function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

/**
 * 
 * Copyright © 2018 Galaxy Software Services https://github.com/GSS-FED/vital-ui-kit-react
 * MIT license
 */

import * as React from 'react';
import styled from 'styled-components';

import Selection from './Selection';
import constants from './constants';

var Root = styled.div(_templateObject, function (props) {
  return constants[props.size].trackHeight;
}, function (_ref) {
  var theme = _ref.theme;
  return theme.track.borderColor;
}, function (_ref2) {
  var theme = _ref2.theme,
      alarm = _ref2.alarm;
  return alarm ? theme.track.alarmbg : theme.track.bg;
}, function (props) {
  return props.onMouseDown && 'cursor: pointer';
});

var Track = function Track(_ref3) {
  var disabled = _ref3.disabled,
      selectionWidth = _ref3.selectionWidth,
      size = _ref3.size,
      onMouseDown = _ref3.onMouseDown,
      onMouseUp = _ref3.onMouseUp,
      onTouchEnd = _ref3.onTouchEnd,
      onTouchStart = _ref3.onTouchStart,
      trackRef = _ref3.trackRef,
      alarm = _ref3.alarm,
      warning = _ref3.warning,
      success = _ref3.success;
  return React.createElement(
    Root,
    {
      alarm: alarm,
      size: size,
      onMouseDown: onMouseDown,
      onMouseUp: onMouseUp,
      onTouchStart: onTouchStart,
      onTouchEnd: onTouchEnd,
      innerRef: trackRef
    },
    React.createElement(Selection, {
      alarm: alarm,
      warning: warning,
      success: success,
      disabled: disabled,
      width: selectionWidth,
      size: size
    })
  );
};

Track.defaultProps = {
  size: 'medium',
  alarm: false,
  warning: false,
  success: false,
  onMouseDown: function onMouseDown() {},
  onMouseUp: function onMouseUp() {},
  onTouchEnd: function onTouchEnd() {},
  onTouchStart: function onTouchStart() {},
  trackRef: function trackRef() {}
};

Track.Selection = Selection;

export default Track;