@gorpacrate/core-graphics/lib/renderer/grid-defs.js

A core library for creating shape-based graphic editors

"use strict";
exports.__esModule = true;
var React = require("react");
var math_1 = require("../utils/math");
exports.GRID_DEFS_ID = 'grid-defs';
exports["default"] = (function (props) {
    var size = props.size, vx = props.vx, vy = props.vy;
    var base = size * 5;
    var dx = Math.round(math_1.modulus(vx, base)) || 0;
    var dy = Math.round(math_1.modulus(vy, base)) || 0;
    return (React.createElement("defs", { key: vx + "_" + vy + "_" + size, dangerouslySetInnerHTML: {
            __html: "\n      <pattern id=\"smallGrid\"\n               width=\"" + size + "\"\n               height=\"" + size + "\"\n               patternUnits=\"userSpaceOnUse\"\n      >\n        <path d=\"M " + size + " 0 L 0 0 0 " + size + "\" fill=\"none\" stroke=\"#eee\" stroke-width=\"0.5\"/>\n      </pattern>\n      <pattern\n        id=\"" + exports.GRID_DEFS_ID + "\" width=\"" + base + "\" height=\"" + base + "\"\n        patternUnits=\"userSpaceOnUse\" patternTransform=\"translate(" + dx + " " + dy + ")\"\n      >\n        <rect\n          width=\"" + size * 5 + "\"\n          height=\"" + size * 5 + "\"\n          fill=\"url(#smallGrid)\"\n        />\n        <path d=\"M " + size * 5 + " 0 L 0 0 0 " + size * 5 + "\" fill=\"none\" stroke=\"#ddd\" stroke-width=\"1\"/>\n      </pattern>\n    "
        } }));
});
//# sourceMappingURL=grid-defs.js.map