{"size": 990, "ext": "js", "max_stars_repo_path": "src/components/renderer/BaseStyler.js", "max_stars_repo_name": "PepsRyuu/sketch-viewer", "max_stars_repo_stars_event_min_datetime": "2018-04-08T12:00:55.000Z", "max_stars_repo_stars_event_max_datetime": "2021-12-26T08:08:22.000Z", "max_issues_repo_path": "src/components/renderer/BaseStyler.js", "max_issues_repo_name": "PepsRyuu/sketch-viewer", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/renderer/BaseStyler.js", "max_forks_repo_name": "PepsRyuu/sketch-viewer", "max_forks_repo_forks_event_min_datetime": "2019-07-10T01:36:28.000Z", "max_forks_repo_forks_event_max_datetime": "2021-11-15T20:29:21.000Z"}
{"max_stars_count": 18, "max_issues_count": null, "max_forks_count": 2, "avg_line_length": 30.9375, "max_line_length": 84, "alphanum_fraction": 0.6090909091}
export default function BaseStyler (node, el) {
    let attrs = node.attributes;

    if (!el.attributes.style) {
        el.attributes.style = {};
    }

    // artboard needs to be relative for zooming to work
    if (!el.attributes.style.position) {
        el.attributes.style.position = 'absolute';
    }

    el.attributes.style.top = attrs.y + 'px';
    el.attributes.style.left = attrs.x + 'px';
    el.attributes.style.width = attrs.width === 'auto'? 'auto' : attrs.width + 'px';
    el.attributes.style.height = attrs.height + 'px';
    el.attributes.style.opacity = attrs.opacity;

    el.attributes.style.transform = `
        scale(${attrs.scaleX}, ${attrs.scaleY}) 
        rotate(${attrs.rotation}deg) 
        translate(${attrs.offsetX || 0}, ${attrs.offsetY || 0})
    `;
    
    if (!attrs.visible) {
        el.attributes.style.display = 'none';
    }

    if (attrs['background-color']) {
        el.attributes.style.backgroundColor = attrs['background-color'];
    }
}