all files / dist/ Swatch.js

100% Statements 10/10
100% Branches 0/0
100% Functions 2/2
100% Lines 7/7
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43                                                            32× 32×            
"use strict";
var React = require("react");
var assign = require("object-assign");
var style = {
    swatches: {
        textAlign: "center",
        padding: "0",
        border: "1px solid rgba(0,0,0,0.1)",
        borderRadius: "4px",
        cursor: "pointer",
        display: "inline-block",
        width: "175px",
        verticalAlign: "top",
        wordWrap: "break-word",
    },
    swatch: {
        height: "80px",
        borderRadius: "4px 4px 0 0",
        transition: "opacity 0.25s ease-in-out",
        borderBottom: "1px solid rgba(0,0,0,0.1)",
    },
    listStyle: { listStyle: "none" },
    pushBottom: { marginBottom: "10px" },
    pushLeft: { marginLeft: "10px" },
    soft: { paddingLeft: "10px", paddingRight: "10px" },
    hard: { padding: "0" },
    flush: { margin: "0" },
    font: {
        fontFamily: "-apple-system, '.SFNSText-Regular', 'San Francisco', Roboto, 'Segoe UI', 'Helvetica Neue', 'Lucida Grande', sans-serif",
        fontSize: "14px",
        wordBreak: "break-word",
    },
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = function (_a) {
    var name = _a.name, value = _a.value, setBackground = _a.setBackground;
    return (React.createElement("div", {style: assign({}, style.swatches, style.listStyle, style.hard), onClick: function () { return setBackground(value); }}, React.createElement("div", {style: assign({}, style.swatch, {
        background: value,
        "backgroundSize": "cover",
        "backgroundPosition": "center",
    })}), React.createElement("div", {style: assign({}, style.listStyle, style.soft)}, React.createElement("h4", {style: assign({ float: "left", fontWeight: "bold" }, style.font)}, name, ":"), React.createElement("h4", {style: assign({ float: "right", fontWeight: "normal" }, style.font)}, React.createElement("em", null, value)))));
};
//# sourceMappingURL=Swatch.js.map