ldx-widgets/dist/components/circle_x_button.js

widgets

(function() {
  var CircleX, ENTER, React, SPACE, createClass, path, ref, ref1, svg;

  React = require('react');

  createClass = require('create-react-class');

  ref = require('../constants/keyboard'), ENTER = ref.ENTER, SPACE = ref.SPACE;

  ref1 = require('react-dom-factories'), svg = ref1.svg, path = ref1.path;

  CircleX = createClass({
    displayName: 'CircleX',
    getDefaultProps: function() {
      return {
        onClick: function() {},
        positionClass: null,
        rotateOnClick: false,
        collapsed: false
      };
    },
    render: function() {
      var className, collapsed, onClick, positionClass, ref2, rotateOnClick, tabIndex;
      ref2 = this.props, positionClass = ref2.positionClass, onClick = ref2.onClick, collapsed = ref2.collapsed, rotateOnClick = ref2.rotateOnClick, tabIndex = ref2.tabIndex;
      className = 'fs-circle-x';
      if (positionClass != null) {
        className += " " + positionClass;
      }
      if (collapsed && rotateOnClick) {
        className += ' is-collapsed';
      }
      return svg({
        className: className,
        onClick: this.handleClick,
        onKeyDown: this.handleKeyDown,
        tabIndex: tabIndex,
        cursor: 'pointer',
        width: "14",
        height: "14",
        viewBox: "0 0 14 14"
      }, path({
        fill: "#D2D2D2",
        d: "M7 0C3.1 0 0 3.1 0 7s3.1 7 7 7 7-3.1 7-7-3.1-7-7-7zm3.8 9.6c.3.3.3.9 0 1.2-.2.2-.4.2-.6.2-.2 0-.4-.1-.6-.2L7 8.2l-2.6 2.6c-.1.1-.3.2-.6.2-.2 0-.4-.1-.6-.2-.3-.3-.3-.9 0-1.2L5.8 7 3.2 4.4c-.3-.3-.3-.9 0-1.2.3-.3.9-.3 1.2 0L7 5.8l2.6-2.6c.3-.3.9-.3 1.2 0 .3.3.3.9 0 1.2L8.2 7l2.6 2.6z"
      }));
    },
    handleClick: function(e) {
      e.stopPropagation();
      return this.props.onClick();
    },
    handleKeyDown: function(e) {
      var ref2;
      if ((ref2 = e.keyCode) === ENTER || ref2 === SPACE) {
        e.stopPropagation();
        return this.props.onClick();
      }
    }
  });

  module.exports = CircleX;

}).call(this);