@antv/infographic 0.2.11 → 0.2.12

package/esm/editor/plugins/edit-bar/edit-items/align-elements.js

@@ -28,8 +28,9 @@ const ALIGN_OPTIONS = [
     { icon: ELEMENT_ICONS.distributeV, action: 'V_DISTRIBUTE' },
 ];
 export const ElementAlign = (selection, _attrs, commander, options) => {
+    var _a;
     injectStyleOnce(GRID_STYLE_ID, GRID_STYLES);
-    const enableDistribution = options?.enableDistribution ?? true;
+    const enableDistribution = (_a = options === null || options === void 0 ? void 0 : options.enableDistribution) !== null && _a !== void 0 ? _a : true;
     const content = createAlignContent((action) => alignSelection(selection, action, commander), enableDistribution);
     return Popover({
         target: IconButton({ icon: ELEMENT_ICONS.align }),
@@ -284,6 +285,7 @@ function getAttrInfo(element, bounds) {
     return { x, y, hasX, hasY, hasDataX, hasDataY };
 }
 function getTransformInfo(element) {
+    var _a;
     const transform = element.getAttribute('transform');
     if (transform === null)
         return null;
@@ -299,7 +301,7 @@ function getTransformInfo(element) {
     }
     const x = Number(match[1]) || 0;
     const y = match[2] !== undefined ? Number(match[2]) || 0 : 0;
-    const start = match.index ?? 0;
+    const start = (_a = match.index) !== null && _a !== void 0 ? _a : 0;
     const before = transform.slice(0, start).trim();
     const after = transform.slice(start + match[0].length).trim();
     const rest = { before, after };
@@ -307,6 +309,6 @@ function getTransformInfo(element) {
 }
 function composeTransform(x, y, rest) {
     const translate = `translate(${x}, ${y})`;
-    const parts = [rest?.before, translate, rest?.after].filter((part) => part && part.length);
+    const parts = [rest === null || rest === void 0 ? void 0 : rest.before, translate, rest === null || rest === void 0 ? void 0 : rest.after].filter((part) => part && part.length);
     return parts.join(' ');
 }

package/esm/editor/plugins/edit-bar/edit-items/font-align.js

@@ -67,7 +67,7 @@ function createAlignContent(state, onAlignChange) {
                         return;
                     Object.assign(state, { [stateKey]: align });
                     updateAllButtons();
-                    onAlignChange({ ...state });
+                    onAlignChange(Object.assign({}, state));
                 },
                 activate: align === state[stateKey],
             });

package/esm/editor/plugins/edit-bar/edit-items/font-color.js

@@ -11,9 +11,9 @@ export const FontColor = (selection, attrs, commander) => {
     const button = document.createElement('button');
     button.type = 'button';
     button.classList.add(FONT_COLOR_BUTTON_CLASS);
-    setButtonColor(button, color ?? DEFAULT_COLOR, isMixed);
+    setButtonColor(button, color !== null && color !== void 0 ? color : DEFAULT_COLOR, isMixed);
     const picker = ColorPicker({
-        value: color ?? DEFAULT_COLOR,
+        value: color !== null && color !== void 0 ? color : DEFAULT_COLOR,
         onChange: (nextColor) => {
             setButtonColor(button, nextColor, false);
             commander.executeBatch(selection.map((text) => new UpdateElementCommand(text, {

package/esm/editor/plugins/edit-bar/edit-items/icon-color.js

@@ -11,9 +11,9 @@ export const IconColor = (selection, attrs, commander) => {
     const button = document.createElement('button');
     button.type = 'button';
     button.classList.add(ICON_COLOR_BUTTON_CLASS);
-    setButtonColor(button, color ?? DEFAULT_COLOR, isMixed);
+    setButtonColor(button, color !== null && color !== void 0 ? color : DEFAULT_COLOR, isMixed);
     const picker = ColorPicker({
-        value: color ?? DEFAULT_COLOR,
+        value: color !== null && color !== void 0 ? color : DEFAULT_COLOR,
         onChange: (nextColor) => {
             setButtonColor(button, nextColor, false);
             commander.executeBatch(selection.map((icon) => new UpdateElementCommand(icon, {

package/esm/editor/plugins/resize-element.js

@@ -205,7 +205,8 @@ export class ResizeElement extends Plugin {
         this.handles.forEach((handle) => (handle.style.display = 'none'));
     }
     removeContainer() {
-        this.container?.remove();
+        var _a;
+        (_a = this.container) === null || _a === void 0 ? void 0 : _a.remove();
         this.container = undefined;
         this.outline = undefined;
         this.overlay = undefined;
@@ -224,7 +225,7 @@ export class ResizeElement extends Plugin {
         this.startPointer = point;
         const currentRect = this.getCurrentAttributes(this.target);
         this.startRect = currentRect;
-        this.startAttrs = { ...currentRect };
+        this.startAttrs = Object.assign({}, currentRect);
         this.lastRect = currentRect;
         this.lastViewportRect = this.getViewportRect(this.target);
         window.addEventListener('pointermove', this.handlePointerMove);
@@ -256,8 +257,9 @@ export class ResizeElement extends Plugin {
         return { x, y, width, height };
     }
     clientToElement(element, x, y) {
-        const matrix = element.getScreenCTM()?.inverse() ||
-            this.editor.getDocument().getScreenCTM()?.inverse() ||
+        var _a, _b;
+        const matrix = ((_a = element.getScreenCTM()) === null || _a === void 0 ? void 0 : _a.inverse()) ||
+            ((_b = this.editor.getDocument().getScreenCTM()) === null || _b === void 0 ? void 0 : _b.inverse()) ||
             new DOMMatrix();
         return new DOMPoint(x, y).matrixTransform(matrix);
     }

package/esm/editor/utils/click-handler.js

@@ -1,5 +1,6 @@
 export class ClickHandler {
     constructor(element, options = {}) {
+        var _a;
         this.clickTimer = null;
         this.singleClickCallback = null;
         this.doubleClickCallback = null;
@@ -48,7 +49,7 @@ export class ClickHandler {
         };
         this.element = element;
         this.delay = options.delay || 300;
-        this.dragThreshold = options.dragThreshold ?? 4;
+        this.dragThreshold = (_a = options.dragThreshold) !== null && _a !== void 0 ? _a : 4;
         this.init();
     }
     init() {
@@ -64,17 +65,19 @@ export class ClickHandler {
         if (this.clickTimer)
             clearTimeout(this.clickTimer);
         this.clickTimer = window.setTimeout(() => {
-            this.singleClickCallback?.(e);
+            var _a;
+            (_a = this.singleClickCallback) === null || _a === void 0 ? void 0 : _a.call(this, e);
         }, this.delay);
     }
     handleDoubleClick(e) {
+        var _a;
         if (this.skipClick) {
             this.skipClick = false;
             return;
         }
         if (this.clickTimer)
             clearTimeout(this.clickTimer);
-        this.doubleClickCallback?.(e);
+        (_a = this.doubleClickCallback) === null || _a === void 0 ? void 0 : _a.call(this, e);
     }
     onClick(callback) {
         this.singleClickCallback = callback;

package/esm/editor/utils/coordinate.js

@@ -2,7 +2,8 @@ export function getScreenCTM(svg) {
     return svg.getScreenCTM() || new DOMMatrix();
 }
 export function getInverseScreenCTM(svg) {
-    return svg.getScreenCTM()?.inverse() || new DOMMatrix();
+    var _a;
+    return ((_a = svg.getScreenCTM()) === null || _a === void 0 ? void 0 : _a.inverse()) || new DOMMatrix();
 }
 export function viewportToClient(svg, x, y) {
     const svgPoint = new DOMPoint(x, y).matrixTransform(getScreenCTM(svg));

package/esm/editor/utils/element.js

@@ -1,6 +1,7 @@
 import { getIconEntity, isIconElement } from '../../utils/index.js';
 export function getIndexesFromElement(element) {
-    return (getElementEntity(element)?.dataset.indexes?.split(',').map(Number) || []);
+    var _a, _b;
+    return (((_b = (_a = getElementEntity(element)) === null || _a === void 0 ? void 0 : _a.dataset.indexes) === null || _b === void 0 ? void 0 : _b.split(',').map(Number)) || []);
 }
 function getElementEntity(element) {
     if (isIconElement(element))

package/esm/editor/utils/event.js

@@ -32,6 +32,7 @@ export function getSelectableTarget(element) {
     return null;
 }
 const getRoughEventTarget = (element) => {
+    var _a;
     const is = (ele) => {
         if (!ele)
             return false;
@@ -41,7 +42,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/esm/editor/utils/extension.js

@@ -3,7 +3,7 @@ export 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/esm/editor/utils/hotkey.js

@@ -35,10 +35,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/esm/exporter/font.js

@@ -1,51 +1,62 @@
+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());
+    });
+};
 import postcss from 'postcss';
 import { getFontURLs, getWoff2BaseURL } from '../renderer/index.js';
 import { createElement, decodeFontFamily, fetchWithCache, join, normalizeFontWeightName, splitFontFamily, } from '../utils/index.js';
-export 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)
+export 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 = getWoff2BaseURL(fontFace['font-family'], 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 = 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 = getWoff2BaseURL(fontFace['font-family'], 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 = 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
@@ -71,33 +82,35 @@ function collectUsedFonts(svg) {
 /**
  * 解析给定 font-family 对应的 CSS @font-face
  */
-async function parseFontFamily(fontFamily) {
-    const urls = getFontURLs(fontFamily);
-    const fontFaces = [];
-    await Promise.allSettled(urls.map(async (url) => {
-        const cssText = await fetchWithCache(url)
-            .then((res) => res.text())
-            .catch(() => {
-            console.error(`Failed to fetch font CSS: ${url}`);
-            return null;
-        });
-        if (!cssText)
-            return;
-        try {
-            const root = postcss.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 = getFontURLs(fontFamily);
+        const fontFaces = [];
+        yield Promise.allSettled(urls.map((url) => __awaiter(this, void 0, void 0, function* () {
+            const cssText = yield 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.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
@@ -117,13 +130,14 @@ export 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',
     };
 }
 /**
@@ -173,19 +187,21 @@ function insertFontStyle(svg, fontFaces) {
 /**
  * 加载 woff2 并转为 DataURL
  */
-async function loadWoff2(url) {
-    const response = await 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 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/esm/exporter/png.js

@@ -1,42 +1,54 @@
+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());
+    });
+};
 import { getViewBox } from '../utils/index.js';
 import { exportToSVG } from './svg.js';
-export async function exportToPNGString(svg, options = {}) {
-    const { dpr = globalThis.devicePixelRatio ?? 2 } = options;
-    const node = await exportToSVG(svg);
-    const { width, height } = 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;
+export function exportToPNGString(svg_1) {
+    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 exportToSVG(svg);
+        const { width, height } = 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);
-        }
+        });
     });
 }