| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122 |
- 'use strict';
- const icon_defaults = require('../icon/defaults.cjs');
- const customisations_defaults = require('../customisations/defaults.cjs');
- const svg_size = require('./size.cjs');
- const svg_defs = require('./defs.cjs');
- const isUnsetKeyword = (value) => value === "unset" || value === "undefined" || value === "none";
- function iconToSVG(icon, customisations) {
- const fullIcon = {
- ...icon_defaults.defaultIconProps,
- ...icon
- };
- const fullCustomisations = {
- ...customisations_defaults.defaultIconCustomisations,
- ...customisations
- };
- const box = {
- left: fullIcon.left,
- top: fullIcon.top,
- width: fullIcon.width,
- height: fullIcon.height
- };
- let body = fullIcon.body;
- [fullIcon, fullCustomisations].forEach((props) => {
- const transformations = [];
- const hFlip = props.hFlip;
- const vFlip = props.vFlip;
- let rotation = props.rotate;
- if (hFlip) {
- if (vFlip) {
- rotation += 2;
- } else {
- transformations.push(
- "translate(" + (box.width + box.left).toString() + " " + (0 - box.top).toString() + ")"
- );
- transformations.push("scale(-1 1)");
- box.top = box.left = 0;
- }
- } else if (vFlip) {
- transformations.push(
- "translate(" + (0 - box.left).toString() + " " + (box.height + box.top).toString() + ")"
- );
- transformations.push("scale(1 -1)");
- box.top = box.left = 0;
- }
- let tempValue;
- if (rotation < 0) {
- rotation -= Math.floor(rotation / 4) * 4;
- }
- rotation = rotation % 4;
- switch (rotation) {
- case 1:
- tempValue = box.height / 2 + box.top;
- transformations.unshift(
- "rotate(90 " + tempValue.toString() + " " + tempValue.toString() + ")"
- );
- break;
- case 2:
- transformations.unshift(
- "rotate(180 " + (box.width / 2 + box.left).toString() + " " + (box.height / 2 + box.top).toString() + ")"
- );
- break;
- case 3:
- tempValue = box.width / 2 + box.left;
- transformations.unshift(
- "rotate(-90 " + tempValue.toString() + " " + tempValue.toString() + ")"
- );
- break;
- }
- if (rotation % 2 === 1) {
- if (box.left !== box.top) {
- tempValue = box.left;
- box.left = box.top;
- box.top = tempValue;
- }
- if (box.width !== box.height) {
- tempValue = box.width;
- box.width = box.height;
- box.height = tempValue;
- }
- }
- if (transformations.length) {
- body = svg_defs.wrapSVGContent(
- body,
- '<g transform="' + transformations.join(" ") + '">',
- "</g>"
- );
- }
- });
- const customisationsWidth = fullCustomisations.width;
- const customisationsHeight = fullCustomisations.height;
- const boxWidth = box.width;
- const boxHeight = box.height;
- let width;
- let height;
- if (customisationsWidth === null) {
- height = customisationsHeight === null ? "1em" : customisationsHeight === "auto" ? boxHeight : customisationsHeight;
- width = svg_size.calculateSize(height, boxWidth / boxHeight);
- } else {
- width = customisationsWidth === "auto" ? boxWidth : customisationsWidth;
- height = customisationsHeight === null ? svg_size.calculateSize(width, boxHeight / boxWidth) : customisationsHeight === "auto" ? boxHeight : customisationsHeight;
- }
- const attributes = {};
- const setAttr = (prop, value) => {
- if (!isUnsetKeyword(value)) {
- attributes[prop] = value.toString();
- }
- };
- setAttr("width", width);
- setAttr("height", height);
- const viewBox = [box.left, box.top, boxWidth, boxHeight];
- attributes.viewBox = viewBox.join(" ");
- return {
- attributes,
- viewBox,
- body
- };
- }
- exports.iconToSVG = iconToSVG;
- exports.isUnsetKeyword = isUnsetKeyword;
|