"use strict";
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
            t[p[i]] = s[p[i]];
    return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const Vector_1 = __importDefault(require("atoms/Vector"));
const styled_1 = require("./styled");
const deps_1 = require("../deps");
class ImagePlaceholder extends react_1.default.PureComponent {
    render() {
        let _a = this.props, { fill, width, height, viewBox, isDynamicViewBox } = _a, remainingProps = __rest(_a, ["fill", "width", "height", "viewBox", "isDynamicViewBox"]);
        const imageSpecs = deps_1.getSVGSpecs(width, height);
        /**
         * viewBox cant be changed as it needs to support for resizing
         * we will be resizing it by using css properties
         * Issue Scenario:
         * When we try to change the viewBox value as dynamic then the image path
         * should not be resized based on that size
         * So, we might need to keep the same size of the viewBox which we got
         * on exporting SVG
         */
        viewBox = '0 0 60 46';
        isDynamicViewBox = false;
        /**
         * assigning the validated values
         * @todo need to update the logic when the user tries to send the value as "auto"
         * change that required in deps.ts (getSVGSpecs)
         */
        width = imageSpecs.width;
        height = imageSpecs.height;
        const attributes = Object.assign({ width,
            height,
            viewBox }, remainingProps);
        return (react_1.default.createElement(styled_1.ImagePlaceholderWrapper, { width: width, height: height },
            react_1.default.createElement(Vector_1.default, Object.assign({}, attributes),
                react_1.default.createElement("g", { fill: "none", fillRule: "evenodd" },
                    react_1.default.createElement("path", { d: "M13.569 17.138a5.575 5.575 0 0 0 5.569-5.568A5.575 5.575 0 0 0 13.569 6 5.575 5.575 0 0 0 8 11.569a5.575 5.575 0 0 0 5.569 5.569zm0-9.138a3.574 3.574 0 0 1 3.569 3.569 3.574 3.574 0 0 1-3.569 3.569A3.573 3.573 0 0 1 10 11.57 3.574 3.574 0 0 1 13.569 8z", fill: "#fff", fillRule: "nonzero" }),
                    react_1.default.createElement("path", { stroke: "#fff", strokeWidth: "2.5", d: "M2 39.25l21.652-19.14 6.874 6.91 7.249 7.285" }),
                    react_1.default.createElement("path", { stroke: "#fff", strokeWidth: "2.5", d: "M30.677 27.805L42.542 15l15.26 13.865" }),
                    react_1.default.createElement("path", { stroke: "#fff", strokeWidth: "2", d: "M2 1h56v44H2z" })))));
    }
}
ImagePlaceholder.defaultProps = {
    fill: '#D8D8D8',
    viewBox: '0 0 60 46',
    width: '250',
    height: '250',
    isDynamicViewBox: false,
};
exports.ImagePlaceholder = ImagePlaceholder;
exports.default = ImagePlaceholder;
//# sourceMappingURL=ImagePlaceholder.js.map