backpack-ui/dist/components/bookmark/index.js

Lonely Planet's Components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _react = require("react");

var _react2 = _interopRequireDefault(_react);

var _radium = require("radium");

var _radium2 = _interopRequireDefault(_radium);

var _settings = require("../../../settings.json");

var _icon = require("../icon");

var _icon2 = _interopRequireDefault(_icon);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var styles = {
  base: {
    color: _settings.color.detailHeaderSmall,
    backgroundColor: "transparent",
    display: "block"
  },

  size: {
    small: {
      fontSize: "17px",
      height: "1em"
    },

    large: {
      fontSize: "24px",
      height: "1em"
    }
  },

  center: {
    horizontal: {
      left: 0,
      marginLeft: "auto",
      marginRight: "auto",
      position: "absolute",
      right: 0
    },
    vertical: {
      bottom: 0,
      marginBottom: "auto",
      marginTop: "auto",
      position: "absolute",
      top: 0
    }
  },

  align: {
    bottom: {
      bottom: 0
    },
    left: {
      left: 0
    },
    right: {
      right: 0
    },
    top: {
      top: 0
    }
  }
};

function Bookmark(_ref) {
  var onClick = _ref.onClick;
  var size = _ref.size;
  var center = _ref.center;
  var align = _ref.align;
  var marked = _ref.marked;

  var style = [styles.base];

  if (size) {
    style.push(styles.size[size]);
  }

  if (center) {
    style.push(styles.center[center]);
  }

  if (align) {
    style.push(styles.align[align]);
  }

  var BookmarkIcon = marked ? _react2.default.createElement(_icon2.default.Bookmark, { label: "Bookmark" }) : _react2.default.createElement(_icon2.default.BookmarkOutline, { label: "Bookmark" });

  return _react2.default.createElement(
    "button",
    {
      className: "Bookmark",
      style: style,
      onClick: onClick
    },
    BookmarkIcon
  );
}

Bookmark.propTypes = {
  onClick: _react2.default.PropTypes.func,

  size: _react2.default.PropTypes.oneOf(["small", "large"]),

  center: _react2.default.PropTypes.oneOf(["", "horizontal", "vertical"]),

  align: _react2.default.PropTypes.oneOf(["", "bottom", "left", "right", "top"]),

  marked: _react2.default.PropTypes.bool
};

Bookmark.defaultProps = {
  onClick: null,

  size: "small",

  center: "",

  align: "",

  marked: false
};

Bookmark.styles = styles;

exports.default = (0, _radium2.default)(Bookmark);