@antv/infographic 0.2.11 → 0.2.13

package/lib/editor/utils/event.js

@@ -36,6 +36,7 @@ function getSelectableTarget(element) {
     return null;
 }
 const getRoughEventTarget = (element) => {
+    var _a;
     const is = (ele) => {
         if (!ele)
             return false;
@@ -45,7 +46,7 @@ const getRoughEventTarget = (element) => {
         return element.parentElement;
     }
     if (is(element.parentElement)) {
-        return element.parentElement?.parentElement;
+        return (_a = element.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement;
     }
     return null;
 };

package/lib/editor/utils/extension.js

@@ -6,7 +6,7 @@ class Extension {
         this.extensions = new Map();
     }
     register(name, extension, options) {
-        if (!options?.override && this.extensions.has(name)) {
+        if (!(options === null || options === void 0 ? void 0 : options.override) && this.extensions.has(name)) {
             throw new Error(`Extension "${name}" already registered`);
         }
         this.extensions.set(name, extension);

package/lib/editor/utils/hotkey.js

@@ -38,10 +38,11 @@ const normalizeCombo = (combo) => {
     return comboObj;
 };
 const matchCombo = (event, combo) => {
+    var _a;
     const key = event.key.toLowerCase();
     if (key !== combo.key)
         return false;
-    const wantsMod = combo.mod ?? false;
+    const wantsMod = (_a = combo.mod) !== null && _a !== void 0 ? _a : false;
     const hasMeta = event.metaKey;
     const hasCtrl = event.ctrlKey;
     const hasMod = hasMeta || hasCtrl;

package/lib/exporter/font.js

@@ -1,4 +1,13 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -8,51 +17,53 @@ exports.getActualLoadedFontFace = getActualLoadedFontFace;
 const postcss_1 = __importDefault(require("postcss"));
 const renderer_1 = require("../renderer");
 const utils_1 = require("../utils");
-async function embedFonts(svg, embedResources = true) {
-    // 1. 收集使用到的 font-family
-    const usedFonts = collectUsedFonts(svg);
-    if (usedFonts.size === 0)
-        return;
-    const parsedFontsFaces = [];
-    // 2. 对每个使用到的字体，解析 CSS + 结合 document.fonts 的实际加载子集
-    await Promise.all(Array.from(usedFonts).map(async (fontFamily) => {
-        const loadedFonts = getActualLoadedFontFace(fontFamily);
-        if (!loadedFonts.length)
-            return;
-        const cssFontFaces = await parseFontFamily(fontFamily);
-        if (!cssFontFaces.length)
+function embedFonts(svg_1) {
+    return __awaiter(this, arguments, void 0, function* (svg, embedResources = true) {
+        // 1. 收集使用到的 font-family
+        const usedFonts = collectUsedFonts(svg);
+        if (usedFonts.size === 0)
             return;
-        const processed = await Promise.all(cssFontFaces.map(async (rawFace) => {
-            const fontFace = normalizeFontFace(rawFace);
-            const unicodeRange = fontFace['unicode-range'].replace(/\s/g, '');
-            const subset = loadedFonts.find((font) => font.unicodeRange &&
-                font.unicodeRange.replace(/\s/g, '') === unicodeRange);
-            // 如果找不到对应子集，就不处理这个 font-face
-            if (!subset)
-                return null;
-            const baseURL = (0, renderer_1.getWoff2BaseURL)(fontFace['font-family'], (0, utils_1.normalizeFontWeightName)(fontFace['font-weight']));
-            if (!baseURL)
-                return null;
-            // 更宽松地从 src 中提取 .woff2 URL 片段
-            const urlMatch = fontFace.src.match(/url\(["']?(.*?\.woff2)[^"']*["']?\)/);
-            if (!urlMatch?.[1])
-                return null;
-            const woff2URL = (0, utils_1.join)(baseURL, urlMatch[1]);
-            if (embedResources) {
-                const woff2DataUrl = await loadWoff2(woff2URL);
-                fontFace.src = `url(${woff2DataUrl}) format('woff2')`;
-            }
-            else {
-                fontFace.src = `url(${woff2URL}) format('woff2')`;
-            }
-            return fontFace;
-        }));
-        parsedFontsFaces.push(...(processed.filter(Boolean) || []));
-    }));
-    // 3. 创建 <style>@font-face...</style> 并插入 SVG
-    if (parsedFontsFaces.length > 0) {
-        insertFontStyle(svg, parsedFontsFaces);
-    }
+        const parsedFontsFaces = [];
+        // 2. 对每个使用到的字体，解析 CSS + 结合 document.fonts 的实际加载子集
+        yield Promise.all(Array.from(usedFonts).map((fontFamily) => __awaiter(this, void 0, void 0, function* () {
+            const loadedFonts = getActualLoadedFontFace(fontFamily);
+            if (!loadedFonts.length)
+                return;
+            const cssFontFaces = yield parseFontFamily(fontFamily);
+            if (!cssFontFaces.length)
+                return;
+            const processed = yield Promise.all(cssFontFaces.map((rawFace) => __awaiter(this, void 0, void 0, function* () {
+                const fontFace = normalizeFontFace(rawFace);
+                const unicodeRange = fontFace['unicode-range'].replace(/\s/g, '');
+                const subset = loadedFonts.find((font) => font.unicodeRange &&
+                    font.unicodeRange.replace(/\s/g, '') === unicodeRange);
+                // 如果找不到对应子集，就不处理这个 font-face
+                if (!subset)
+                    return null;
+                const baseURL = (0, renderer_1.getWoff2BaseURL)(fontFace['font-family'], (0, utils_1.normalizeFontWeightName)(fontFace['font-weight']));
+                if (!baseURL)
+                    return null;
+                // 更宽松地从 src 中提取 .woff2 URL 片段
+                const urlMatch = fontFace.src.match(/url\(["']?(.*?\.woff2)[^"']*["']?\)/);
+                if (!(urlMatch === null || urlMatch === void 0 ? void 0 : urlMatch[1]))
+                    return null;
+                const woff2URL = (0, utils_1.join)(baseURL, urlMatch[1]);
+                if (embedResources) {
+                    const woff2DataUrl = yield loadWoff2(woff2URL);
+                    fontFace.src = `url(${woff2DataUrl}) format('woff2')`;
+                }
+                else {
+                    fontFace.src = `url(${woff2URL}) format('woff2')`;
+                }
+                return fontFace;
+            })));
+            parsedFontsFaces.push(...(processed.filter(Boolean) || []));
+        })));
+        // 3. 创建 <style>@font-face...</style> 并插入 SVG
+        if (parsedFontsFaces.length > 0) {
+            insertFontStyle(svg, parsedFontsFaces);
+        }
+    });
 }
 /**
  * 收集 SVG 中用到的 font-family
@@ -78,33 +89,35 @@ function collectUsedFonts(svg) {
 /**
  * 解析给定 font-family 对应的 CSS @font-face
  */
-async function parseFontFamily(fontFamily) {
-    const urls = (0, renderer_1.getFontURLs)(fontFamily);
-    const fontFaces = [];
-    await Promise.allSettled(urls.map(async (url) => {
-        const cssText = await (0, utils_1.fetchWithCache)(url)
-            .then((res) => res.text())
-            .catch(() => {
-            console.error(`Failed to fetch font CSS: ${url}`);
-            return null;
-        });
-        if (!cssText)
-            return;
-        try {
-            const root = postcss_1.default.parse(cssText);
-            root.walkAtRules('font-face', (rule) => {
-                const fontFace = {};
-                rule.walkDecls((decl) => {
-                    fontFace[decl.prop] = decl.value;
-                });
-                fontFaces.push(fontFace);
+function parseFontFamily(fontFamily) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const urls = (0, renderer_1.getFontURLs)(fontFamily);
+        const fontFaces = [];
+        yield Promise.allSettled(urls.map((url) => __awaiter(this, void 0, void 0, function* () {
+            const cssText = yield (0, utils_1.fetchWithCache)(url)
+                .then((res) => res.text())
+                .catch(() => {
+                console.error(`Failed to fetch font CSS: ${url}`);
+                return null;
             });
-        }
-        catch (error) {
-            console.error(`Failed to parse CSS: ${url}`, error);
-        }
-    }));
-    return fontFaces;
+            if (!cssText)
+                return;
+            try {
+                const root = postcss_1.default.parse(cssText);
+                root.walkAtRules('font-face', (rule) => {
+                    const fontFace = {};
+                    rule.walkDecls((decl) => {
+                        fontFace[decl.prop] = decl.value;
+                    });
+                    fontFaces.push(fontFace);
+                });
+            }
+            catch (error) {
+                console.error(`Failed to parse CSS: ${url}`, error);
+            }
+        })));
+        return fontFaces;
+    });
 }
 /**
  * 从 document.fonts 中获取给定 family 且已加载的 FontFace
@@ -124,13 +137,14 @@ function getActualLoadedFontFace(fontFamily) {
  * 将不完整的 FontFaceAttributes 补全为完整结构，给后续逻辑使用
  */
 function normalizeFontFace(face) {
+    var _a, _b, _c, _d, _e, _f;
     return {
-        'font-family': face['font-family'] ?? '',
-        src: face.src ?? '',
-        'font-style': face['font-style'] ?? 'normal',
-        'font-display': face['font-display'] ?? 'swap',
-        'font-weight': face['font-weight'] ?? '400',
-        'unicode-range': face['unicode-range'] ?? 'U+0-FFFF',
+        'font-family': (_a = face['font-family']) !== null && _a !== void 0 ? _a : '',
+        src: (_b = face.src) !== null && _b !== void 0 ? _b : '',
+        'font-style': (_c = face['font-style']) !== null && _c !== void 0 ? _c : 'normal',
+        'font-display': (_d = face['font-display']) !== null && _d !== void 0 ? _d : 'swap',
+        'font-weight': (_e = face['font-weight']) !== null && _e !== void 0 ? _e : '400',
+        'unicode-range': (_f = face['unicode-range']) !== null && _f !== void 0 ? _f : 'U+0-FFFF',
     };
 }
 /**
@@ -180,19 +194,21 @@ function insertFontStyle(svg, fontFaces) {
 /**
  * 加载 woff2 并转为 DataURL
  */
-async function loadWoff2(url) {
-    const response = await (0, utils_1.fetchWithCache)(url);
-    if (!response.ok) {
-        throw new Error(`Failed to load font: ${url}`);
-    }
-    const blob = await response.blob();
-    const dataUrl = await new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.onloadend = () => {
-            resolve(reader.result);
-        };
-        reader.onerror = reject;
-        reader.readAsDataURL(blob);
+function loadWoff2(url) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const response = yield (0, utils_1.fetchWithCache)(url);
+        if (!response.ok) {
+            throw new Error(`Failed to load font: ${url}`);
+        }
+        const blob = yield response.blob();
+        const dataUrl = yield new Promise((resolve, reject) => {
+            const reader = new FileReader();
+            reader.onloadend = () => {
+                resolve(reader.result);
+            };
+            reader.onerror = reject;
+            reader.readAsDataURL(blob);
+        });
+        return dataUrl;
     });
-    return dataUrl;
 }

package/lib/exporter/png.js

@@ -1,45 +1,57 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.exportToPNGString = exportToPNGString;
 const utils_1 = require("../utils");
 const svg_1 = require("./svg");
-async function exportToPNGString(svg, options = {}) {
-    const { dpr = globalThis.devicePixelRatio ?? 2 } = options;
-    const node = await (0, svg_1.exportToSVG)(svg);
-    const { width, height } = (0, utils_1.getViewBox)(node);
-    return new Promise((resolve, reject) => {
-        try {
-            const canvas = document.createElement('canvas');
-            canvas.width = width * dpr;
-            canvas.height = height * dpr;
-            const ctx = canvas.getContext('2d');
-            if (!ctx) {
-                reject(new Error('Failed to get canvas context'));
-                return;
+function exportToPNGString(svg_2) {
+    return __awaiter(this, arguments, void 0, function* (svg, options = {}) {
+        var _a;
+        const { dpr = (_a = globalThis.devicePixelRatio) !== null && _a !== void 0 ? _a : 2 } = options;
+        const node = yield (0, svg_1.exportToSVG)(svg);
+        const { width, height } = (0, utils_1.getViewBox)(node);
+        return new Promise((resolve, reject) => {
+            try {
+                const canvas = document.createElement('canvas');
+                canvas.width = width * dpr;
+                canvas.height = height * dpr;
+                const ctx = canvas.getContext('2d');
+                if (!ctx) {
+                    reject(new Error('Failed to get canvas context'));
+                    return;
+                }
+                // 应用 DPR 缩放
+                ctx.scale(dpr, dpr);
+                ctx.imageSmoothingEnabled = true;
+                ctx.imageSmoothingQuality = 'high';
+                node.setAttribute('width', String(width));
+                node.setAttribute('height', String(height));
+                const updatedSvgData = new XMLSerializer().serializeToString(node);
+                const svgURL = 'data:image/svg+xml;charset=utf-8,' +
+                    encodeURIComponent(updatedSvgData);
+                const img = new Image();
+                img.onload = function () {
+                    ctx.clearRect(0, 0, width, height);
+                    ctx.drawImage(img, 0, 0, width, height);
+                    const pngURL = canvas.toDataURL('image/png');
+                    resolve(pngURL);
+                };
+                img.onerror = function (error) {
+                    reject(new Error('Image load failed: ' + error));
+                };
+                img.src = svgURL;
+            }
+            catch (error) {
+                reject(error);
             }
-            // 应用 DPR 缩放
-            ctx.scale(dpr, dpr);
-            ctx.imageSmoothingEnabled = true;
-            ctx.imageSmoothingQuality = 'high';
-            node.setAttribute('width', String(width));
-            node.setAttribute('height', String(height));
-            const updatedSvgData = new XMLSerializer().serializeToString(node);
-            const svgURL = 'data:image/svg+xml;charset=utf-8,' +
-                encodeURIComponent(updatedSvgData);
-            const img = new Image();
-            img.onload = function () {
-                ctx.clearRect(0, 0, width, height);
-                ctx.drawImage(img, 0, 0, width, height);
-                const pngURL = canvas.toDataURL('image/png');
-                resolve(pngURL);
-            };
-            img.onerror = function (error) {
-                reject(new Error('Image load failed: ' + error));
-            };
-            img.src = svgURL;
-        }
-        catch (error) {
-            reject(error);
-        }
+        });
     });
 }

package/lib/exporter/svg.js

@@ -1,43 +1,58 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.exportToSVGString = exportToSVGString;
 exports.exportToSVG = exportToSVG;
 const utils_1 = require("../utils");
 const font_1 = require("./font");
-async function exportToSVGString(svg, options = {}) {
-    const node = await exportToSVG(svg, options);
-    const str = new XMLSerializer().serializeToString(node);
-    return 'data:image/svg+xml;charset=utf-8,' + encodeURIComponent(str);
-}
-async function exportToSVG(svg, options = {}) {
-    const { embedResources = true, removeIds = false } = options;
-    const clonedSVG = svg.cloneNode(true);
-    const { width, height } = (0, utils_1.getViewBox)(svg);
-    (0, utils_1.setAttributes)(clonedSVG, { width, height });
-    if (removeIds) {
-        inlineUseElements(clonedSVG);
-        inlineDefsReferences(clonedSVG);
-    }
-    else {
-        await embedIcons(clonedSVG);
-    }
-    await (0, font_1.embedFonts)(clonedSVG, embedResources);
-    cleanSVG(clonedSVG);
-    return clonedSVG;
+function exportToSVGString(svg_1) {
+    return __awaiter(this, arguments, void 0, function* (svg, options = {}) {
+        const node = yield exportToSVG(svg, options);
+        const str = new XMLSerializer().serializeToString(node);
+        return 'data:image/svg+xml;charset=utf-8,' + encodeURIComponent(str);
+    });
 }
-async function embedIcons(svg) {
-    const icons = svg.querySelectorAll('use');
-    const defs = getDefs(svg);
-    icons.forEach((icon) => {
-        const href = icon.getAttribute('href');
-        if (!href)
-            return;
-        const existsSymbol = svg.querySelector(href);
-        if (!existsSymbol) {
-            const symbolElement = document.querySelector(href);
-            if (symbolElement)
-                defs.appendChild(symbolElement.cloneNode(true));
+function exportToSVG(svg_1) {
+    return __awaiter(this, arguments, void 0, function* (svg, options = {}) {
+        const { embedResources = true, removeIds = false } = options;
+        const clonedSVG = svg.cloneNode(true);
+        const { width, height } = (0, utils_1.getViewBox)(svg);
+        (0, utils_1.setAttributes)(clonedSVG, { width, height });
+        if (removeIds) {
+            inlineUseElements(clonedSVG);
+            inlineDefsReferences(clonedSVG);
         }
+        else {
+            yield embedIcons(clonedSVG);
+        }
+        yield (0, font_1.embedFonts)(clonedSVG, embedResources);
+        cleanSVG(clonedSVG);
+        return clonedSVG;
+    });
+}
+function embedIcons(svg) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const icons = svg.querySelectorAll('use');
+        const defs = getDefs(svg);
+        icons.forEach((icon) => {
+            const href = icon.getAttribute('href');
+            if (!href)
+                return;
+            const existsSymbol = svg.querySelector(href);
+            if (!existsSymbol) {
+                const symbolElement = document.querySelector(href);
+                if (symbolElement)
+                    defs.appendChild(symbolElement.cloneNode(true));
+            }
+        });
     });
 }
 const iconRole = 'icon-defs';
@@ -68,7 +83,8 @@ function inlineUseElements(svg) {
     });
 }
 function getUseHref(use) {
-    return use.getAttribute('href') ?? use.getAttribute('xlink:href');
+    var _a;
+    return (_a = use.getAttribute('href')) !== null && _a !== void 0 ? _a : use.getAttribute('xlink:href');
 }
 function resolveUseTarget(svg, href) {
     const localTarget = svg.querySelector(href);
@@ -116,10 +132,11 @@ function materializeElement(use, source) {
     return wrapper;
 }
 function buildUseTransform(use) {
+    var _a;
     const x = use.getAttribute('x');
     const y = use.getAttribute('y');
-    const translate = x || y ? `translate(${x ?? 0} ${y ?? 0})` : '';
-    const transform = use.getAttribute('transform') ?? '';
+    const translate = x || y ? `translate(${x !== null && x !== void 0 ? x : 0} ${y !== null && y !== void 0 ? y : 0})` : '';
+    const transform = (_a = use.getAttribute('transform')) !== null && _a !== void 0 ? _a : '';
     if (translate && transform)
         return `${translate} ${transform}`;
     return translate || transform || null;
@@ -273,13 +290,13 @@ function cleanSVG(svg) {
 }
 function removeBtnGroup(svg) {
     const btnGroup = (0, utils_1.getElementByRole)(svg, "btns-group" /* ElementTypeEnum.BtnsGroup */);
-    btnGroup?.remove();
+    btnGroup === null || btnGroup === void 0 ? void 0 : btnGroup.remove();
     const btnIconDefs = (0, utils_1.getElementByRole)(svg, 'btn-icon-defs');
-    btnIconDefs?.remove();
+    btnIconDefs === null || btnIconDefs === void 0 ? void 0 : btnIconDefs.remove();
 }
 function removeTransientContainer(svg) {
     const transientContainer = svg.querySelector('[data-element-type=transient-container]');
-    transientContainer?.remove();
+    transientContainer === null || transientContainer === void 0 ? void 0 : transientContainer.remove();
 }
 function removeUselessAttrs(svg) {
     const groups = svg.querySelectorAll('g');

package/lib/jsx/components/Ellipse.js

@@ -2,11 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Ellipse = Ellipse;
 function Ellipse(props) {
+    var _a, _b, _c, _d;
     const { x = 0, y = 0, width = 0, height = 0 } = props;
-    props.cx ?? (props.cx = x + width / 2);
-    props.cy ?? (props.cy = y + height / 2);
-    props.rx ?? (props.rx = width / 2);
-    props.ry ?? (props.ry = height / 2);
+    (_a = props.cx) !== null && _a !== void 0 ? _a : (props.cx = x + width / 2);
+    (_b = props.cy) !== null && _b !== void 0 ? _b : (props.cy = y + height / 2);
+    (_c = props.rx) !== null && _c !== void 0 ? _c : (props.rx = width / 2);
+    (_d = props.ry) !== null && _d !== void 0 ? _d : (props.ry = height / 2);
     const node = {
         type: 'ellipse',
         props,

package/lib/jsx/components/Path.js

@@ -3,11 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Path = Path;
 function Path(props) {
     const { x, y } = props;
-    const finalProps = {
-        ...props,
-    };
+    const finalProps = Object.assign({}, props);
     if (x !== undefined || y !== undefined) {
-        finalProps.transform = `translate(${x ?? 0}, ${y ?? 0})`;
+        finalProps.transform = `translate(${x !== null && x !== void 0 ? x : 0}, ${y !== null && y !== void 0 ? y : 0})`;
     }
     const node = {
         type: 'path',

package/lib/jsx/components/Polygon.js

@@ -1,16 +1,25 @@
 "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 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Polygon = Polygon;
-function Polygon({ points = [], ...props }) {
+function Polygon(_a) {
+    var { points = [] } = _a, props = __rest(_a, ["points"]);
     const { x, y } = props;
     const pointsStr = points.map(({ x, y }) => `${x},${y}`).join(' ');
-    const finalProps = {
-        ...props,
-        points: pointsStr,
-    };
+    const finalProps = Object.assign(Object.assign({}, props), { points: pointsStr });
     if (x !== undefined || y !== undefined) {
         finalProps.transform =
-            `translate(${x ?? 0}, ${y ?? 0})` + (finalProps.transform || '');
+            `translate(${x !== null && x !== void 0 ? x : 0}, ${y !== null && y !== void 0 ? y : 0})` + (finalProps.transform || '');
     }
     const node = {
         type: 'polygon',