@itsjonq/controls/dist/cjs/components/ColorPicker/Swatch.js

A control panel to develop React UI

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Swatch = void 0;

var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));

var _react = _interopRequireDefault(require("react"));

var _styledView = require("styled-view");

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

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }

var Swatch = _react.default.forwardRef(function (props, ref) {
  var value = props.value,
      restProps = _objectWithoutProperties(props, ["value"]);

  return _react.default.createElement(SwatchButton, Object.assign({
    type: "button"
  }, restProps, {
    ref: ref,
    tabIndex: 0
  }), _react.default.createElement(_styledView.View, {
    borderRadius: 2,
    height: 16,
    style: {
      backgroundColor: value
    },
    boxShadow: "0 0 0 1px rgba(0, 0, 0, 0.2) inset"
  }));
});

exports.Swatch = Swatch;
var SwatchButton = (0, _styledBase.default)("button", {
  target: "e1yloobg0",
  label: "SwatchButton"
})(process.env.NODE_ENV === "production" ? {
  name: "1dgttia",
  styles: "appearance:none;border:1px solid black;box-sizing:border-box;cursor:pointer;display:block;max-width:50px;padding:3px;width:100%;"
} : {
  name: "1dgttia",
  styles: "appearance:none;border:1px solid black;box-sizing:border-box;cursor:pointer;display:block;max-width:50px;padding:3px;width:100%;",
  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NvbG9yUGlja2VyL1N3YXRjaC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtQmtDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NvbG9yUGlja2VyL1N3YXRjaC5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBWaWV3IH0gZnJvbSAnc3R5bGVkLXZpZXcnO1xuXG5leHBvcnQgY29uc3QgU3dhdGNoID0gUmVhY3QuZm9yd2FyZFJlZigocHJvcHMsIHJlZikgPT4ge1xuXHRjb25zdCB7IHZhbHVlLCAuLi5yZXN0UHJvcHMgfSA9IHByb3BzO1xuXG5cdHJldHVybiAoXG5cdFx0PFN3YXRjaEJ1dHRvbiB0eXBlPVwiYnV0dG9uXCIgey4uLnJlc3RQcm9wc30gcmVmPXtyZWZ9IHRhYkluZGV4PXswfT5cblx0XHRcdDxWaWV3XG5cdFx0XHRcdGJvcmRlclJhZGl1cz17Mn1cblx0XHRcdFx0aGVpZ2h0PXsxNn1cblx0XHRcdFx0c3R5bGU9e3sgYmFja2dyb3VuZENvbG9yOiB2YWx1ZSB9fVxuXHRcdFx0XHRib3hTaGFkb3c9XCIwIDAgMCAxcHggcmdiYSgwLCAwLCAwLCAwLjIpIGluc2V0XCJcblx0XHRcdC8+XG5cdFx0PC9Td2F0Y2hCdXR0b24+XG5cdCk7XG59KTtcblxuY29uc3QgU3dhdGNoQnV0dG9uID0gc3R5bGVkLmJ1dHRvbmBcblx0YXBwZWFyYW5jZTogbm9uZTtcblx0Ym9yZGVyOiAxcHggc29saWQgYmxhY2s7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGN1cnNvcjogcG9pbnRlcjtcblx0ZGlzcGxheTogYmxvY2s7XG5cdG1heC13aWR0aDogNTBweDtcblx0cGFkZGluZzogM3B4O1xuXHR3aWR0aDogMTAwJTtcbmA7XG4iXX0= */",
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
});