polotno 2.40.0 → 2.40.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/canvas/context-menu/context-menu.js +1 -1
- package/canvas/element.js +1 -1
- package/canvas/figure-element.js +1 -1
- package/canvas/gif-element.js +1 -1
- package/canvas/hotkeys.js +1 -1
- package/canvas/html-element.js +6 -6
- package/canvas/image-element.js +1 -1
- package/canvas/line-element.js +1 -1
- package/canvas/page-controls.js +1 -1
- package/canvas/page.js +1 -1
- package/canvas/table-element.js +1 -1
- package/canvas/text-element.js +1 -1
- package/canvas/video-element.js +1 -1
- package/model/group-model.d.ts +10 -4
- package/model/store.d.ts +4 -0
- package/model/store.js +1 -1
- package/model/table-model.d.ts +17 -4
- package/model/table-model.js +1 -1
- package/package.json +2 -2
- package/pages-timeline/elements.js +1 -1
- package/pages-timeline/page-preview.js +1 -1
- package/polotno.bundle.js +245 -245
- package/side-panel/layers-panel.js +1 -1
- package/toolbar/html-toolbar.js +1 -1
- package/toolbar/table-toolbar.js +1 -1
- package/toolbar/text-toolbar.js +2 -2
- package/toolbar/toolbar.js +5 -5
- package/utils/l10n.d.ts +11 -6
- package/utils/l10n.js +1 -1
- package/utils/text-html.js +1 -1
- package/utils/to-html.js +1 -1
- package/utils/to-svg.js +1 -1
- package/utils/validate-key.js +1 -1
- package/utils/xml.d.ts +1 -0
- package/utils/xml.js +7 -0
package/utils/to-svg.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var t=this&&this.__rest||function(t,e){var i={};for(var o in t){Object.prototype.hasOwnProperty.call(t,o)&&e.indexOf(o)<0&&(i[o]=t[o])}if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(t);n<o.length;n++){e.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(t,o[n])&&(i[o[n]]=t[o[n]])}}return i};import{cropImage as e,getCrop as i,loadImage as o}from"./image.js";import*as n from"./svg.js";import{figureToSvg as r}from"./figure-to-svg.js";import{Effects as l,shapeFilterToCSS as s}from"./filters.js";import{removeTags as a,parseHtmlToSegments as h}from"./text.js";import{segmentsToTspans as c}from"./text-html.js";import{getCurvePath as d}from"../canvas/text-element.js";import*as g from"./gradient.js";import{generateBackgroundShapeFromRects as f,textLinesToRects as p}from"./background-shape.js";export const forEveryNode=(t,e)=>{if(t.children){for(const i of t.children){if(!0===e(i)){break}forEveryNode(i,e)}}if(t.cells){for(const i of t.cells){if(!0===e(i)){break}}}};const u=(t,e,...i)=>({type:t,props:e,children:i||[]});function m(t,e){if(!g.isGradient(t)){return null}const{stops:i,rotation:o}=g.parseColor(t),n=o*Math.PI/180,r=.5-.5*Math.sin(n),l=.5+.5*Math.cos(n),s=.5+.5*Math.sin(n),a=.5-.5*Math.cos(n),h=i.map(({offset:t,color:e})=>u("stop",{offset:100*t+"%","stop-color":e}));return u("linearGradient",{id:e,x1:100*r+"%",y1:100*l+"%",x2:100*s+"%",y2:100*a+"%"},...h)}export function fixRatio(t){var e=(new DOMParser).parseFromString(t,"image/svg+xml");return e.documentElement.setAttribute("preserveAspectRatio","none"),(new XMLSerializer).serializeToString(e)}const y=async t=>{try{const e=await fetch(t);if("undefined"!=typeof Buffer){const t=await e.arrayBuffer(),i=Buffer.from(t).toString("base64");return`data:${e.headers.get("content-type")||"image/png"};base64,${i}`}{const t=await e.blob();return new Promise((e,i)=>{const o=new FileReader;o.onloadend=()=>e(o.result),o.onerror=i,o.readAsDataURL(t)})}}catch(e){return console.error("Error converting URL to data URL:",e),t}},w=async({element:t,page:e,store:i})=>{let{src:r}=t;if("svg"===t.type){const e=await n.urlToString(r);r=n.replaceColors(e,new Map(Object.entries(t.colorsReplace)))}else{r=await y(r)}let l,s,a,h,c="";if(t.flipX||t.flipY){const e=t.flipX?-1:1,i=t.flipY?-1:1,o=t.width/2,n=t.height/2;c=`translate(${o}, ${n}) scale(${e}, ${i}) translate(${-o}, ${-n})`}t.clipSrc&&(l=`clip-img-mask-${t.id}`,s=await y(t.clipSrc)),t.maskSrc&&(a=`mask-img-${t.id}`,h=await y(t.maskSrc));const d=await o(r),f=d.width*t.cropWidth,p=d.height*t.cropHeight,w=t.width/t.height;let x,k;const b=f/p,$="boolean"==typeof t.stretchEnabled&&t.stretchEnabled||"svg"===t.type;$?(x=f,k=p):w>=b?(x=f,k=f/w):(x=p*w,k=p);const v=x/d.width,j=k/d.height,S=x/k>t.width/t.height?t.height/k:t.width/x,O=$?t.width/x:S,H=$?t.height/k:S,W=x*O/v,M=k*H/j;let E=t.cropX*d.width*O,P=t.cropY*d.height*H;t.flipX&&(E=(1-t.cropX-t.cropWidth)*d.width*O),t.flipY&&(P=(1-t.cropY-t.cropHeight)*d.height*H);const R=`clip-${t.id}`,T=t.cornerRadius||0,z=r.replace(/&/g,"&"),C={x:-E,y:-P,width:W,height:M,preserveAspectRatio:"none","clip-path":`url(#${R})`},L=[u("clipPath",{id:R},u("rect",{x:0,y:0,width:t.width,height:t.height,rx:T||void 0,ry:T||void 0}))];l&&s&&L.push(u("mask",{id:l,maskUnits:"userSpaceOnUse","mask-type":"alpha"},u("image",{href:s.replace(/&/g,"&"),x:0,y:0,width:t.width,height:t.height,preserveAspectRatio:"none"}))),a&&L.push(u("mask",{id:a,maskUnits:"userSpaceOnUse","mask-type":"alpha"},u("image",Object.assign({href:z},C))));let F=z;const B={};a&&h&&(F=h.replace(/&/g,"&"),B.mask=`url(#${a})`);const A={};l&&(A.mask=`url(#${l})`);const U=t.borderSize||0,D=U>0&&g.isGradient(t.borderColor),G=D?`border-grad-${t.id}`:null;if(D){const e=m(t.borderColor,G);e&&L.push(e)}const N=U>0?u("rect",{x:U/2,y:U/2,width:Math.max(0,t.width-U),height:Math.max(0,t.height-U),fill:"none",stroke:D?`url(#${G})`:t.borderColor,"stroke-width":U,rx:Math.max(0,T-U)||void 0,ry:Math.max(0,T-U)||void 0}):null,X=u("g",{},u("defs",{},...L),u("image",Object.assign(Object.assign({href:F},C),B)),N);return u("g",A,c?u("g",{transform:c},X):X)},x=({element:t,type:e})=>{const i={"stroke-width":t.height,stroke:t.color,"stroke-linecap":"round","stroke-linejoin":"round"},o=Object.assign(Object.assign({},i),{fill:t.color}),n=Object.assign(Object.assign({},i),{fill:"none"});return"arrow"===e?u("polyline",Object.assign({points:`${3*t.height},${2*-t.height} 0,0 ${3*t.height},${2*t.height}`},n)):"triangle"===e?u("polygon",Object.assign({points:`${3*t.height},${2*-t.height} 0,0 ${3*t.height},${2*t.height}`},o)):"bar"===e?u("polyline",Object.assign({points:`0,${2*-t.height} 0,${2*t.height}`},n)):"circle"===e?u("circle",Object.assign({cx:2*t.height,cy:0,r:2*t.height},o)):"square"===e?u("polygon",Object.assign({points:`0,${2*-t.height} ${4*t.height},${2*-t.height} ${4*t.height},${2*t.height} 0,${2*t.height}`},o)):null},k={image:w,svg:w,text:async({element:t,page:e,store:i})=>{const o=g.isGradient(t.fill),n=g.isGradient(t.stroke);if(t.curveEnabled){const e=d(t.width,t.height,t.curvePower,t.fontSize),i=`curve-path-${t.id}`,r=(a(t.text).replace(/\n/g," "),h(t.text)),l={fontWeight:t.fontWeight||"normal",fontStyle:t.fontStyle||"normal",fill:t.fill||"black"},s=c(r,l),g=c(r,l,{omitColors:!0}),f=t.backgroundPadding*(t.fontSize*t.lineHeight*.5),p=t.backgroundEnabled?u("rect",{x:-f,y:-f,width:t.width+2*f,height:t.height+2*f,fill:t.backgroundColor,opacity:t.backgroundOpacity,rx:t.backgroundCornerRadius*(t.fontSize*t.lineHeight*.5),ry:t.backgroundCornerRadius*(t.fontSize*t.lineHeight*.5)}):null,y=[u("path",{id:i,d:e,fill:"none"})],w=t.strokeWidth&&(n||o&&!n);if(o){const e=`curve-fill-grad-${t.id}`,i=m(t.fill,e);i&&y.push(i)}if(n&&t.strokeWidth){const e=`curve-stroke-grad-${t.id}`,i=m(t.stroke,e);i&&y.push(i)}if(w){const e={"font-size":t.fontSize+"px","text-anchor":"middle","dominant-baseline":"central","font-family":t.fontFamily,"font-style":t.fontStyle,"font-weight":t.fontWeight,"text-decoration":t.textDecoration||void 0,"letter-spacing":t.letterSpacing*t.fontSize+"px"},r=n?`url(#curve-stroke-grad-${t.id})`:t.stroke,l=u("text",Object.assign(Object.assign({},e),{fill:r,"stroke-width":t.strokeWidth,stroke:r}),u("textPath",{href:`#${i}`,startOffset:"50%",innerHTML:g})),a=o?`url(#curve-fill-grad-${t.id})`:t.fill,h=u("text",Object.assign(Object.assign({},e),{fill:a}),u("textPath",{href:`#${i}`,startOffset:"50%",innerHTML:s}));return u("g",{},p,u("defs",{},...y),l,h)}return u("g",{},p,u("defs",{},...y),u("text",{fill:o?`url(#curve-fill-grad-${t.id})`:t.fill,"font-size":t.fontSize+"px","text-anchor":"middle","dominant-baseline":"central","font-family":t.fontFamily,"font-style":t.fontStyle,"font-weight":t.fontWeight,"text-decoration":t.textDecoration||void 0,"letter-spacing":t.letterSpacing*t.fontSize+"px","stroke-width":t.strokeWidth||void 0,stroke:t.strokeWidth?n?`url(#curve-stroke-grad-${t.id})`:t.stroke:void 0,"paint-order":t.strokeWidth?"stroke fill":void 0},u("textPath",{href:`#${i}`,startOffset:"50%",innerHTML:s})))}const r=(t,e,i,o,n,r=0)=>{const l=document.createElement("canvas").getContext("2d");return l.font=`${n} ${o} ${e}px ${i}`,l.measureText(t).width+Math.max(0,(t?t.length:0)-1)*r*e},l=(t,e,i,o,n,l,s=0)=>{const a=[];return t.split("\n").forEach(t=>{const h=t.split(" ");let c="";for(let d=0;d<h.length;d++){const t=c+h[d]+" ";r(t,i,o,n,l,s)>e+.5&&d>0?(a.push(c.trim()),c=h[d]+" "):c=t}a.push(c.trim())}),a};let s=a(t.text);"uppercase"==t.textTransform&&(s=s.toUpperCase());let y=t.fontSize,w=[];for(;;){w=l(s,t.width,y,t.fontFamily,t.fontWeight,t.fontStyle,t.letterSpacing);const e=Math.max(...w.map(e=>r(e,y,t.fontFamily,t.fontWeight,t.fontStyle,t.letterSpacing))),i=w.length*y*t.lineHeight;if(e<=t.width&&i<=t.height){break}if(y-=1,y<4){break}}const x=y*t.lineHeight,k=w.length*x;let b=y;"middle"===t.verticalAlign?b=(t.height-k)/2+y:"bottom"===t.verticalAlign&&(b=t.height-k+y);const $="center"===t.align?"middle":"right"===t.align?"end":"start",v=w.map((e,i)=>u("tspan",{x:"center"===t.align?t.width/2:"right"===t.align?t.width:0,dy:0===i?0:x,innerHTML:""===e?"":e})),j=t.backgroundPadding*(y*t.lineHeight*.5),S=t.backgroundCornerRadius*(y*t.lineHeight*.5);let O=null;if(t.backgroundEnabled){if(t.legacyBackground){O=u("rect",{x:-j,y:-j,width:t.width+2*j,height:t.height+2*j,fill:t.backgroundColor,opacity:t.backgroundOpacity,rx:S,ry:S})}else{const e=p({lines:w.map(e=>({width:""===e?0:r(e,y,t.fontFamily,t.fontWeight,t.fontStyle,t.letterSpacing)})),lineHeight:x,width:t.width,align:"justify"===t.align?"justify":t.align});let i=0;"middle"===t.verticalAlign?i=(t.height-w.length*x)/2:"bottom"===t.verticalAlign&&(i=t.height-w.length*x);const o=f({rects:e,padding:j,cornerRadius:S});o&&(O=u("path",{d:o,fill:t.backgroundColor,opacity:t.backgroundOpacity,transform:i?`translate(0,${i})`:void 0}))}}const H=[],W=t.strokeWidth&&(n||o&&!n);if(o){const e=`text-fill-grad-${t.id}`,i=m(t.fill,e);i&&H.push(i)}if(n&&t.strokeWidth){const e=`text-stroke-grad-${t.id}`,i=m(t.stroke,e);i&&H.push(i)}if(W){const e={y:b,"font-size":y+"px","text-anchor":$,"font-family":t.fontFamily,"font-style":t.fontStyle,"font-weight":t.fontWeight,"text-decoration":t.textDecoration,"line-height":t.lineHeight,"letter-spacing":t.letterSpacing*y+"px"},i=n?`url(#text-stroke-grad-${t.id})`:t.stroke,r=u("text",Object.assign(Object.assign({},e),{fill:i,"stroke-width":t.strokeWidth,stroke:i}),...v.map(t=>u("tspan",t.props,t.props.innerHTML))),l=o?`url(#text-fill-grad-${t.id})`:t.fill,s=u("text",Object.assign(Object.assign({},e),{fill:l}),...v.map(t=>u("tspan",t.props,t.props.innerHTML)));return u("g",{},O,H.length>0?u("defs",{},...H):null,r,s)}return u("g",{},O,H.length>0?u("defs",{},...H):null,u("text",{fill:o?`url(#text-fill-grad-${t.id})`:t.fill,y:b,"font-size":y+"px","text-anchor":$,"font-family":t.fontFamily,"font-style":t.fontStyle,"font-weight":t.fontWeight,"text-decoration":t.textDecoration,"line-height":t.lineHeight,"letter-spacing":t.letterSpacing*y+"px","stroke-width":t.strokeWidth||void 0,stroke:t.strokeWidth?t.stroke:void 0,"paint-order":t.strokeWidth?"stroke fill":void 0},...v))},line:async({element:t,page:e,store:i})=>u("g",{},u("line",{x1:0,y1:t.height/2,x2:t.width,y2:t.height/2,stroke:t.color,"stroke-width":t.height,"stroke-dasharray":t.dash&&t.dash.length?t.dash.map(e=>e*t.height).join(" "):void 0}),u("g",{transform:`translate(0 ${t.height/2})`},x({element:t,type:t.startHead})),u("g",{transform:`translate(${t.width} ${t.height/2}) rotate(180)`},x({element:t,type:t.endHead}))),figure:async({element:t,page:e,store:i,elementHook:o})=>{let n=function(t){let e=t.replace(/<svg[^>]*>/,"");return e=e.replace(/<\/svg>/,""),e}(r(t));const l=[];if(t.strokeWidth&&g.isGradient(t.stroke)){const e=`figure-stroke-grad-${t.id}`,i=m(t.stroke,e);if(i){l.push(i);const o=t.stroke.replace(/[.*+?^${}()|[\]\\]/g,"\\$&");n=n.replace(new RegExp(`stroke="${o}"`,"g"),`stroke="url(#${e})"`)}}if(g.isGradient(t.fill)){const e=`figure-fill-grad-${t.id}`,i=m(t.fill,e);if(i){l.push(i);const o=t.fill.replace(/[.*+?^${}()|[\]\\]/g,"\\$&");n=n.replace(new RegExp(`fill="${o}"`,"g"),`fill="url(#${e})"`)}}if(l.length>0){const e=u("g",{},u("defs",{},...l),u("g",{innerHTML:n}));return o&&o({dom:e,element:t})||e}const s=u("g",{innerHTML:n});return o&&o({dom:s,element:t})||s},group:async({element:t,page:e,store:i,elementHook:o})=>{const n=await Promise.all(t.children.map(t=>b({element:t,page:e,store:i,elementHook:o}))),r=u("g",{style:{"transform-origin":"top left"}},...n);return o&&o({dom:r,element:t})||r},gif:w,table:async({element:t})=>{t.rows;const e=t.cols,i=t.colWidths,o=t.rowHeights,n=["fontSize","fontFamily","fontWeight","fontStyle","textDecoration","textTransform","fill","align","verticalAlign","lineHeight","letterSpacing","strokeWidth","stroke","cellBackground","cellPadding"],r=(t.cells||[]).map((i,o)=>{const r=Object.assign(Object.assign({},i),{row:Math.floor(o/e),col:o%e});for(const e of n){void 0===r[e]&&(r[e]=t[e])}return r}),l=[],s=(e,n,r,l)=>{let s=0;for(let o=0;o<n;o++){s+=i[o]*t.width}let a=0;for(let i=0;i<e;i++){a+=o[i]*t.height}let h=0;for(let o=n;o<n+l;o++){h+=(i[o]||0)*t.width}let c=0;for(let i=e;i<e+r;i++){c+=(o[i]||0)*t.height}return{x:s,y:a,width:h,height:c}};for(const a of r){if(!a.mergedInto&&a.cellBackground&&"transparent"!==a.cellBackground){s(a.row,a.col,a.colSpan||1,a.colSpan||1);const{x:t,y:e,width:i,height:o}=s(a.row,a.col,a.rowSpan||1,a.colSpan||1);l.push(u("rect",{x:t,y:e,width:i,height:o,fill:a.cellBackground}))}}const h=(t,e)=>"dashed"===t?`${4*e},${2*e}`:"dotted"===t?`${e},${e}`:void 0,c=(e,i)=>{var o,n,r,l,s;const a=null===(o=e.borders)||void 0===o?void 0:o[i];return{width:null!==(n=null==a?void 0:a.width)&&void 0!==n?n:t.borderWidth,style:null!==(l=null!==(r=null==a?void 0:a.style)&&void 0!==r?r:t.borderStyle)&&void 0!==l?l:"solid",color:null!==(s=null==a?void 0:a.color)&&void 0!==s?s:t.borderColor}};for(const a of r){if(a.mergedInto){continue}const t=s(a.row,a.col,a.rowSpan||1,a.colSpan||1);if(0===a.row){const e=c(a,"top");"none"!==e.style&&e.width>0&&l.push(u("line",{x1:t.x,y1:t.y+e.width/2,x2:t.x+t.width,y2:t.y+e.width/2,stroke:e.color,"stroke-width":e.width,"stroke-dasharray":h(e.style,e.width)}))}if(0===a.col){const e=c(a,"left");"none"!==e.style&&e.width>0&&l.push(u("line",{x1:t.x+e.width/2,y1:t.y,x2:t.x+e.width/2,y2:t.y+t.height,stroke:e.color,"stroke-width":e.width,"stroke-dasharray":h(e.style,e.width)}))}{const e=c(a,"bottom");"none"!==e.style&&e.width>0&&l.push(u("line",{x1:t.x,y1:t.y+t.height-e.width/2,x2:t.x+t.width,y2:t.y+t.height-e.width/2,stroke:e.color,"stroke-width":e.width,"stroke-dasharray":h(e.style,e.width)}))}{const e=c(a,"right");"none"!==e.style&&e.width>0&&l.push(u("line",{x1:t.x+t.width-e.width/2,y1:t.y,x2:t.x+t.width-e.width/2,y2:t.y+t.height,stroke:e.color,"stroke-width":e.width,"stroke-dasharray":h(e.style,e.width)}))}}for(const d of r){if(d.mergedInto){continue}let e=a(d.text||"");if(!e){continue}"uppercase"===d.textTransform&&(e=e.toUpperCase());const n=d.cellPadding||4;let r=0;for(let o=0;o<d.col;o++){r+=i[o]*t.width}let s=0;for(let i=0;i<d.row;i++){s+=o[i]*t.height}const h=i[d.col]*t.width,c=o[d.row]*t.height,g=d.fontSize||12,f=d.align||"left";let p=r+n,m="start";"center"===f?(p=r+h/2,m="middle"):"right"===f&&(p=r+h-n,m="end");let y=s+n+g;const w=d.verticalAlign||"top";"middle"===w?y=s+c/2+g/3:"bottom"===w&&(y=s+c-n),l.push(u("text",{x:p,y,"font-size":g,"font-family":d.fontFamily||"Roboto","font-weight":d.fontWeight||"normal","font-style":d.fontStyle||"normal",fill:d.fill||"black","text-anchor":m,"text-decoration":d.textDecoration||"none","letter-spacing":d.letterSpacing?d.letterSpacing*g+"px":void 0},e))}return u("g",{},...l)}};async function b({element:t,page:e,store:i,elementHook:o}){var n;let r=await k[t.type];r||(r=()=>u("g",{}),console.error(`SVG export does not support ${t.type} type...`));const a=await r({element:t,page:e,store:i}),h=[],c=[];if(t.blurEnabled&&h.push(`blur(${t.blurRadius/2}px)`),t.brightnessEnabled&&h.push(`brightness(${100*t.brightness+100}%)`),t.sepiaEnabled&&h.push("sepia()"),t.grayscaleEnabled&&h.push("grayscale()"),t.shadowEnabled&&h.push(`drop-shadow(${t.shadowOffsetX}px ${t.shadowOffsetY}px ${t.shadowBlur}px ${t.shadowColor})`),t.filters){for(const[g,f]of Object.entries(t.filters)){const t=s(l[g],f.intensity);if(t&&(h.push(t.filter),t.html)){const e=t.html.replace(/<svg([^>]*)>/,"<g$1>").replace(/<\/svg>/,"</g>");c.push(e)}}}const d=u("g",{className:"element",id:t.id,transform:"group"!==t.type?`translate(${t.x}, ${t.y}) rotate(${t.rotation})`:void 0,display:null===(n=t.visible)||void 0===n||n?void 0:"none",opacity:t.opacity,style:{"transform-origin":"top left",filter:h.join(" ")}},a,...c);return o&&o({dom:d,element:t})||d}async function $(t){try{const e=await fetch(t),i=e.headers.get("content-type")||"font/ttf",o=await e.arrayBuffer();return`data:${i};base64,${"undefined"!=typeof Buffer?Buffer.from(o).toString("base64"):function(t){const e=new Uint8Array(t);let i="";for(let o=0;o<e.length;o+=32768){const t=e.subarray(o,o+32768);i+=String.fromCharCode(...t)}if("undefined"!=typeof btoa){return btoa(i)}if("undefined"!=typeof Buffer){return Buffer.from(e).toString("base64")}throw new Error("No base64 encoder available in this environment")}(o)}`}catch(e){return console.error("Error embedding font:",e),t}}export async function jsonToDOM({json:t,elementHook:n,fontEmbedding:r="inline"}){const l=[];forEveryNode({children:t.pages},t=>{"text"!==t.type&&"tablecell"!==t.type&&"table"!==t.type||!t.fontFamily||-1!==l.indexOf(t.fontFamily)||l.push(t.fontFamily)});const s="inline"===r?await async function(t,e){return await Promise.all(t.map(async t=>{var i,o;if("Arial"===t){return null}const n=e.find(e=>e.fontFamily===t);if(n){const e=await $(n.url);return u("style",{},`@font-face { font-family: ${t}; src: url(${e}); }`)}{const e=`https://fonts.googleapis.com/css?family=${t}:bi,normal,i,b`;try{const n=await fetch(e),r=await n.text(),l=null===(o=null===(i=r.match(/url\((.*?)\)/g))||void 0===i?void 0:i.map(t=>t.replace(/url\((.*?)\)/,"$1")))||void 0===o?void 0:o.filter(t=>t.startsWith("https"));if(!(null==l?void 0:l.length)){throw new Error("No font URLs found")}const s=await Promise.all(l.map(async e=>{const i=await $(e),o=r.match(/font-style:\s*(.*?);/),n=r.match(/font-weight:\s*(.*?);/),l=o?o[1]:"normal",s=n?n[1]:"normal";return`@font-face {\n font-family: ${t};\n font-style: ${l};\n font-weight: ${s};\n src: url(${i});\n }`}));return u("style",{},s.join("\n"))}catch(r){return console.error("Error embedding Google Font:",r),u("defs",{},u("style",{type:"text/css",innerHTML:`@import url('${e}');`.replace(/&/g,"&")}))}}}))}(l,t.fonts):[],a=await Promise.all(t.pages.map(r=>async function({page:t,store:n,elementHook:r}){const l=await Promise.all(t.children.map(e=>b({element:e,page:t,store:n,elementHook:r}))),s=t.background.indexOf("url")>=0||t.background.indexOf("http")>=0||t.background.indexOf(".jpg")>=0||t.background.indexOf(".png")>=0||t.background.indexOf(".jpeg")>=0;let a;if(s){const r=await o(t.background);a=await e(t.background,Object.assign({width:n.width,height:n.height,x:0,y:0},i({width:n.width,height:n.height},{width:r.width,height:r.height})))}return u("g",{className:"page",style:{}},s?u("image",{"xlink:href":a,x:0,y:0,width:n.width,height:n.height,preserveAspectRatio:"none"}):u("rect",{x:0,y:0,width:n.width,height:n.height,fill:s?void 0:t.background}),...l)}({page:r,store:t,elementHook:n})));return u("svg",{xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",viewBox:`0 0 ${t.width} ${t.height}`,width:t.width,height:t.height},...s,...a)}const v=({dom:e,nestLevel:i=0})=>{if("string"==typeof e){return e}if(!e){return""}const o=e.props,{innerHTML:n}=o,r=t(o,["innerHTML"]),l=Object.keys(r).map(t=>((t,e)=>"object"==typeof e?`${t}="${Object.keys(e).map(t=>`${t}:${e[t]};`).join(" ")}"`:null==e||""===e?"":`${t}="${e}"`)(t,r[t])).filter(t=>t&&t.trim().length>0).join(" "),s=" ".repeat(i);return`${s}<${e.type}${l?" "+l:""}>${n||"\n"+e.children.map(t=>v({dom:t,nestLevel:i+1})).join("")}${s}</${e.type}>\n`};export async function jsonToSVG({json:t,elementHook:e,fontEmbedding:i="inline"}){const o=await jsonToDOM({json:t,elementHook:e,fontEmbedding:i});return v({dom:o})}
|
|
1
|
+
var t=this&&this.__rest||function(t,e){var i={};for(var o in t){Object.prototype.hasOwnProperty.call(t,o)&&e.indexOf(o)<0&&(i[o]=t[o])}if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(t);n<o.length;n++){e.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(t,o[n])&&(i[o[n]]=t[o[n]])}}return i};import{cropImage as e,getCrop as i,loadImage as o}from"./image.js";import*as n from"./svg.js";import{figureToSvg as r}from"./figure-to-svg.js";import{Effects as l,shapeFilterToCSS as s}from"./filters.js";import{removeTags as a,parseHtmlToSegments as h}from"./text.js";import{segmentsToTspans as c}from"./text-html.js";import{xmlEscape as d}from"./xml.js";import{getCurvePath as g}from"../canvas/text-element.js";import*as f from"./gradient.js";import{generateBackgroundShapeFromRects as p,textLinesToRects as u}from"./background-shape.js";export const forEveryNode=(t,e)=>{if(t.children){for(const i of t.children){if(!0===e(i)){break}forEveryNode(i,e)}}if(t.cells){for(const i of t.cells){if(!0===e(i)){break}}}};const m=(t,e,...i)=>({type:t,props:e,children:i||[]});function y(t,e){if(!f.isGradient(t)){return null}const{stops:i,rotation:o}=f.parseColor(t),n=o*Math.PI/180,r=.5-.5*Math.sin(n),l=.5+.5*Math.cos(n),s=.5+.5*Math.sin(n),a=.5-.5*Math.cos(n),h=i.map(({offset:t,color:e})=>m("stop",{offset:100*t+"%","stop-color":e}));return m("linearGradient",{id:e,x1:100*r+"%",y1:100*l+"%",x2:100*s+"%",y2:100*a+"%"},...h)}export function fixRatio(t){var e=(new DOMParser).parseFromString(t,"image/svg+xml");return e.documentElement.setAttribute("preserveAspectRatio","none"),(new XMLSerializer).serializeToString(e)}const w=async t=>{try{const e=await fetch(t);if("undefined"!=typeof Buffer){const t=await e.arrayBuffer(),i=Buffer.from(t).toString("base64");return`data:${e.headers.get("content-type")||"image/png"};base64,${i}`}{const t=await e.blob();return new Promise((e,i)=>{const o=new FileReader;o.onloadend=()=>e(o.result),o.onerror=i,o.readAsDataURL(t)})}}catch(e){return console.error("Error converting URL to data URL:",e),t}},x=async({element:t,page:e,store:i})=>{let{src:r}=t;if("svg"===t.type){const e=await n.urlToString(r);r=n.replaceColors(e,new Map(Object.entries(t.colorsReplace)))}else{r=await w(r)}let l,s,a,h,c="";if(t.flipX||t.flipY){const e=t.flipX?-1:1,i=t.flipY?-1:1,o=t.width/2,n=t.height/2;c=`translate(${o}, ${n}) scale(${e}, ${i}) translate(${-o}, ${-n})`}t.clipSrc&&(l=`clip-img-mask-${t.id}`,s=await w(t.clipSrc)),t.maskSrc&&(a=`mask-img-${t.id}`,h=await w(t.maskSrc));const d=await o(r),g=d.width*t.cropWidth,p=d.height*t.cropHeight,u=t.width/t.height;let x,k;const b=g/p,$="boolean"==typeof t.stretchEnabled&&t.stretchEnabled||"svg"===t.type;$?(x=g,k=p):u>=b?(x=g,k=g/u):(x=p*u,k=p);const v=x/d.width,j=k/d.height,S=x/k>t.width/t.height?t.height/k:t.width/x,O=$?t.width/x:S,H=$?t.height/k:S,W=x*O/v,M=k*H/j;let E=t.cropX*d.width*O,P=t.cropY*d.height*H;t.flipX&&(E=(1-t.cropX-t.cropWidth)*d.width*O),t.flipY&&(P=(1-t.cropY-t.cropHeight)*d.height*H);const R=`clip-${t.id}`,T=t.cornerRadius||0,z=r.replace(/&/g,"&"),C={x:-E,y:-P,width:W,height:M,preserveAspectRatio:"none","clip-path":`url(#${R})`},L=[m("clipPath",{id:R},m("rect",{x:0,y:0,width:t.width,height:t.height,rx:T||void 0,ry:T||void 0}))];l&&s&&L.push(m("mask",{id:l,maskUnits:"userSpaceOnUse","mask-type":"alpha"},m("image",{href:s.replace(/&/g,"&"),x:0,y:0,width:t.width,height:t.height,preserveAspectRatio:"none"}))),a&&L.push(m("mask",{id:a,maskUnits:"userSpaceOnUse","mask-type":"alpha"},m("image",Object.assign({href:z},C))));let F=z;const B={};a&&h&&(F=h.replace(/&/g,"&"),B.mask=`url(#${a})`);const A={};l&&(A.mask=`url(#${l})`);const U=t.borderSize||0,D=U>0&&f.isGradient(t.borderColor),G=D?`border-grad-${t.id}`:null;if(D){const e=y(t.borderColor,G);e&&L.push(e)}const N=U>0?m("rect",{x:U/2,y:U/2,width:Math.max(0,t.width-U),height:Math.max(0,t.height-U),fill:"none",stroke:D?`url(#${G})`:t.borderColor,"stroke-width":U,rx:Math.max(0,T-U)||void 0,ry:Math.max(0,T-U)||void 0}):null,X=m("g",{},m("defs",{},...L),m("image",Object.assign(Object.assign({href:F},C),B)),N);return m("g",A,c?m("g",{transform:c},X):X)},k=({element:t,type:e})=>{const i={"stroke-width":t.height,stroke:t.color,"stroke-linecap":"round","stroke-linejoin":"round"},o=Object.assign(Object.assign({},i),{fill:t.color}),n=Object.assign(Object.assign({},i),{fill:"none"});return"arrow"===e?m("polyline",Object.assign({points:`${3*t.height},${2*-t.height} 0,0 ${3*t.height},${2*t.height}`},n)):"triangle"===e?m("polygon",Object.assign({points:`${3*t.height},${2*-t.height} 0,0 ${3*t.height},${2*t.height}`},o)):"bar"===e?m("polyline",Object.assign({points:`0,${2*-t.height} 0,${2*t.height}`},n)):"circle"===e?m("circle",Object.assign({cx:2*t.height,cy:0,r:2*t.height},o)):"square"===e?m("polygon",Object.assign({points:`0,${2*-t.height} ${4*t.height},${2*-t.height} ${4*t.height},${2*t.height} 0,${2*t.height}`},o)):null},b={image:x,svg:x,text:async({element:t,page:e,store:i})=>{const o=f.isGradient(t.fill),n=f.isGradient(t.stroke);if(t.curveEnabled){const e=g(t.width,t.height,t.curvePower,t.fontSize),i=`curve-path-${t.id}`,r=(a(t.text).replace(/\n/g," "),h(t.text)),l={fontWeight:t.fontWeight||"normal",fontStyle:t.fontStyle||"normal",fill:t.fill||"black"},s=c(r,l),d=c(r,l,{omitColors:!0}),f=t.backgroundPadding*(t.fontSize*t.lineHeight*.5),p=t.backgroundEnabled?m("rect",{x:-f,y:-f,width:t.width+2*f,height:t.height+2*f,fill:t.backgroundColor,opacity:t.backgroundOpacity,rx:t.backgroundCornerRadius*(t.fontSize*t.lineHeight*.5),ry:t.backgroundCornerRadius*(t.fontSize*t.lineHeight*.5)}):null,u=[m("path",{id:i,d:e,fill:"none"})],w=t.strokeWidth&&(n||o&&!n);if(o){const e=`curve-fill-grad-${t.id}`,i=y(t.fill,e);i&&u.push(i)}if(n&&t.strokeWidth){const e=`curve-stroke-grad-${t.id}`,i=y(t.stroke,e);i&&u.push(i)}if(w){const e={"font-size":t.fontSize+"px","text-anchor":"middle","dominant-baseline":"central","font-family":t.fontFamily,"font-style":t.fontStyle,"font-weight":t.fontWeight,"text-decoration":t.textDecoration||void 0,"letter-spacing":t.letterSpacing*t.fontSize+"px"},r=n?`url(#curve-stroke-grad-${t.id})`:t.stroke,l=m("text",Object.assign(Object.assign({},e),{fill:r,"stroke-width":t.strokeWidth,stroke:r}),m("textPath",{href:`#${i}`,startOffset:"50%",innerHTML:d})),a=o?`url(#curve-fill-grad-${t.id})`:t.fill,h=m("text",Object.assign(Object.assign({},e),{fill:a}),m("textPath",{href:`#${i}`,startOffset:"50%",innerHTML:s}));return m("g",{},p,m("defs",{},...u),l,h)}return m("g",{},p,m("defs",{},...u),m("text",{fill:o?`url(#curve-fill-grad-${t.id})`:t.fill,"font-size":t.fontSize+"px","text-anchor":"middle","dominant-baseline":"central","font-family":t.fontFamily,"font-style":t.fontStyle,"font-weight":t.fontWeight,"text-decoration":t.textDecoration||void 0,"letter-spacing":t.letterSpacing*t.fontSize+"px","stroke-width":t.strokeWidth||void 0,stroke:t.strokeWidth?n?`url(#curve-stroke-grad-${t.id})`:t.stroke:void 0,"paint-order":t.strokeWidth?"stroke fill":void 0},m("textPath",{href:`#${i}`,startOffset:"50%",innerHTML:s})))}const r=(t,e,i,o,n,r=0)=>{const l=document.createElement("canvas").getContext("2d");return l.font=`${n} ${o} ${e}px ${i}`,l.measureText(t).width+Math.max(0,(t?t.length:0)-1)*r*e},l=(t,e,i,o,n,l,s=0)=>{const a=[];return t.split("\n").forEach(t=>{const h=t.split(" ");let c="";for(let d=0;d<h.length;d++){const t=c+h[d]+" ";r(t,i,o,n,l,s)>e+.5&&d>0?(a.push(c.trim()),c=h[d]+" "):c=t}a.push(c.trim())}),a};let s=a(t.text);"uppercase"==t.textTransform&&(s=s.toUpperCase());let w=t.fontSize,x=[];for(;;){x=l(s,t.width,w,t.fontFamily,t.fontWeight,t.fontStyle,t.letterSpacing);const e=Math.max(...x.map(e=>r(e,w,t.fontFamily,t.fontWeight,t.fontStyle,t.letterSpacing))),i=x.length*w*t.lineHeight;if(e<=t.width&&i<=t.height){break}if(w-=1,w<4){break}}const k=w*t.lineHeight,b=x.length*k;let $=w;"middle"===t.verticalAlign?$=(t.height-b)/2+w:"bottom"===t.verticalAlign&&($=t.height-b+w);const v="center"===t.align?"middle":"right"===t.align?"end":"start",j=x.map((e,i)=>m("tspan",{x:"center"===t.align?t.width/2:"right"===t.align?t.width:0,dy:0===i?0:k,innerHTML:""===e?"":d(e)})),S=t.backgroundPadding*(w*t.lineHeight*.5),O=t.backgroundCornerRadius*(w*t.lineHeight*.5);let H=null;if(t.backgroundEnabled){if(t.legacyBackground){H=m("rect",{x:-S,y:-S,width:t.width+2*S,height:t.height+2*S,fill:t.backgroundColor,opacity:t.backgroundOpacity,rx:O,ry:O})}else{const e=u({lines:x.map(e=>({width:""===e?0:r(e,w,t.fontFamily,t.fontWeight,t.fontStyle,t.letterSpacing)})),lineHeight:k,width:t.width,align:"justify"===t.align?"justify":t.align});let i=0;"middle"===t.verticalAlign?i=(t.height-x.length*k)/2:"bottom"===t.verticalAlign&&(i=t.height-x.length*k);const o=p({rects:e,padding:S,cornerRadius:O});o&&(H=m("path",{d:o,fill:t.backgroundColor,opacity:t.backgroundOpacity,transform:i?`translate(0,${i})`:void 0}))}}const W=[],M=t.strokeWidth&&(n||o&&!n);if(o){const e=`text-fill-grad-${t.id}`,i=y(t.fill,e);i&&W.push(i)}if(n&&t.strokeWidth){const e=`text-stroke-grad-${t.id}`,i=y(t.stroke,e);i&&W.push(i)}if(M){const e={y:$,"font-size":w+"px","text-anchor":v,"font-family":t.fontFamily,"font-style":t.fontStyle,"font-weight":t.fontWeight,"text-decoration":t.textDecoration,"line-height":t.lineHeight,"letter-spacing":t.letterSpacing*w+"px"},i=n?`url(#text-stroke-grad-${t.id})`:t.stroke,r=m("text",Object.assign(Object.assign({},e),{fill:i,"stroke-width":t.strokeWidth,stroke:i}),...j.map(t=>m("tspan",t.props,t.props.innerHTML))),l=o?`url(#text-fill-grad-${t.id})`:t.fill,s=m("text",Object.assign(Object.assign({},e),{fill:l}),...j.map(t=>m("tspan",t.props,t.props.innerHTML)));return m("g",{},H,W.length>0?m("defs",{},...W):null,r,s)}return m("g",{},H,W.length>0?m("defs",{},...W):null,m("text",{fill:o?`url(#text-fill-grad-${t.id})`:t.fill,y:$,"font-size":w+"px","text-anchor":v,"font-family":t.fontFamily,"font-style":t.fontStyle,"font-weight":t.fontWeight,"text-decoration":t.textDecoration,"line-height":t.lineHeight,"letter-spacing":t.letterSpacing*w+"px","stroke-width":t.strokeWidth||void 0,stroke:t.strokeWidth?t.stroke:void 0,"paint-order":t.strokeWidth?"stroke fill":void 0},...j))},line:async({element:t,page:e,store:i})=>m("g",{},m("line",{x1:0,y1:t.height/2,x2:t.width,y2:t.height/2,stroke:t.color,"stroke-width":t.height,"stroke-dasharray":t.dash&&t.dash.length?t.dash.map(e=>e*t.height).join(" "):void 0}),m("g",{transform:`translate(0 ${t.height/2})`},k({element:t,type:t.startHead})),m("g",{transform:`translate(${t.width} ${t.height/2}) rotate(180)`},k({element:t,type:t.endHead}))),figure:async({element:t,page:e,store:i,elementHook:o})=>{let n=function(t){let e=t.replace(/<svg[^>]*>/,"");return e=e.replace(/<\/svg>/,""),e}(r(t));const l=[];if(t.strokeWidth&&f.isGradient(t.stroke)){const e=`figure-stroke-grad-${t.id}`,i=y(t.stroke,e);if(i){l.push(i);const o=t.stroke.replace(/[.*+?^${}()|[\]\\]/g,"\\$&");n=n.replace(new RegExp(`stroke="${o}"`,"g"),`stroke="url(#${e})"`)}}if(f.isGradient(t.fill)){const e=`figure-fill-grad-${t.id}`,i=y(t.fill,e);if(i){l.push(i);const o=t.fill.replace(/[.*+?^${}()|[\]\\]/g,"\\$&");n=n.replace(new RegExp(`fill="${o}"`,"g"),`fill="url(#${e})"`)}}if(l.length>0){const e=m("g",{},m("defs",{},...l),m("g",{innerHTML:n}));return o&&o({dom:e,element:t})||e}const s=m("g",{innerHTML:n});return o&&o({dom:s,element:t})||s},group:async({element:t,page:e,store:i,elementHook:o})=>{const n=await Promise.all(t.children.map(t=>$({element:t,page:e,store:i,elementHook:o}))),r=m("g",{style:{"transform-origin":"top left"}},...n);return o&&o({dom:r,element:t})||r},gif:x,table:async({element:t})=>{t.rows;const e=t.cols,i=t.colWidths,o=t.rowHeights,n=["fontSize","fontFamily","fontWeight","fontStyle","textDecoration","textTransform","fill","align","verticalAlign","lineHeight","letterSpacing","strokeWidth","stroke","cellBackground","cellPadding"],r=(t.cells||[]).map((i,o)=>{const r=Object.assign(Object.assign({},i),{row:Math.floor(o/e),col:o%e});for(const e of n){void 0===r[e]&&(r[e]=t[e])}return r}),l=[],s=(e,n,r,l)=>{let s=0;for(let o=0;o<n;o++){s+=i[o]*t.width}let a=0;for(let i=0;i<e;i++){a+=o[i]*t.height}let h=0;for(let o=n;o<n+l;o++){h+=(i[o]||0)*t.width}let c=0;for(let i=e;i<e+r;i++){c+=(o[i]||0)*t.height}return{x:s,y:a,width:h,height:c}};for(const a of r){if(!a.mergedInto&&a.cellBackground&&"transparent"!==a.cellBackground){s(a.row,a.col,a.colSpan||1,a.colSpan||1);const{x:t,y:e,width:i,height:o}=s(a.row,a.col,a.rowSpan||1,a.colSpan||1);l.push(m("rect",{x:t,y:e,width:i,height:o,fill:a.cellBackground}))}}const h=(t,e)=>"dashed"===t?`${4*e},${2*e}`:"dotted"===t?`${e},${e}`:void 0,c=(e,i)=>{var o,n,r,l,s;const a=null===(o=e.borders)||void 0===o?void 0:o[i];return{width:null!==(n=null==a?void 0:a.width)&&void 0!==n?n:t.borderWidth,style:null!==(l=null!==(r=null==a?void 0:a.style)&&void 0!==r?r:t.borderStyle)&&void 0!==l?l:"solid",color:null!==(s=null==a?void 0:a.color)&&void 0!==s?s:t.borderColor}};for(const a of r){if(a.mergedInto){continue}const t=s(a.row,a.col,a.rowSpan||1,a.colSpan||1);if(0===a.row){const e=c(a,"top");"none"!==e.style&&e.width>0&&l.push(m("line",{x1:t.x,y1:t.y+e.width/2,x2:t.x+t.width,y2:t.y+e.width/2,stroke:e.color,"stroke-width":e.width,"stroke-dasharray":h(e.style,e.width)}))}if(0===a.col){const e=c(a,"left");"none"!==e.style&&e.width>0&&l.push(m("line",{x1:t.x+e.width/2,y1:t.y,x2:t.x+e.width/2,y2:t.y+t.height,stroke:e.color,"stroke-width":e.width,"stroke-dasharray":h(e.style,e.width)}))}{const e=c(a,"bottom");"none"!==e.style&&e.width>0&&l.push(m("line",{x1:t.x,y1:t.y+t.height-e.width/2,x2:t.x+t.width,y2:t.y+t.height-e.width/2,stroke:e.color,"stroke-width":e.width,"stroke-dasharray":h(e.style,e.width)}))}{const e=c(a,"right");"none"!==e.style&&e.width>0&&l.push(m("line",{x1:t.x+t.width-e.width/2,y1:t.y,x2:t.x+t.width-e.width/2,y2:t.y+t.height,stroke:e.color,"stroke-width":e.width,"stroke-dasharray":h(e.style,e.width)}))}}for(const g of r){if(g.mergedInto){continue}let e=a(g.text||"");if(!e){continue}"uppercase"===g.textTransform&&(e=e.toUpperCase());const n=g.cellPadding||4;let r=0;for(let o=0;o<g.col;o++){r+=i[o]*t.width}let s=0;for(let i=0;i<g.row;i++){s+=o[i]*t.height}const h=i[g.col]*t.width,c=o[g.row]*t.height,f=g.fontSize||12,p=g.align||"left";let u=r+n,y="start";"center"===p?(u=r+h/2,y="middle"):"right"===p&&(u=r+h-n,y="end");let w=s+n+f;const x=g.verticalAlign||"top";"middle"===x?w=s+c/2+f/3:"bottom"===x&&(w=s+c-n),l.push(m("text",{x:u,y:w,"font-size":f,"font-family":g.fontFamily||"Roboto","font-weight":g.fontWeight||"normal","font-style":g.fontStyle||"normal",fill:g.fill||"black","text-anchor":y,"text-decoration":g.textDecoration||"none","letter-spacing":g.letterSpacing?g.letterSpacing*f+"px":void 0},d(e)))}return m("g",{},...l)}};async function $({element:t,page:e,store:i,elementHook:o}){var n;let r=await b[t.type];r||(r=()=>m("g",{}),console.error(`SVG export does not support ${t.type} type...`));const a=await r({element:t,page:e,store:i}),h=[],c=[];if(t.blurEnabled&&h.push(`blur(${t.blurRadius/2}px)`),t.brightnessEnabled&&h.push(`brightness(${100*t.brightness+100}%)`),t.sepiaEnabled&&h.push("sepia()"),t.grayscaleEnabled&&h.push("grayscale()"),t.shadowEnabled&&h.push(`drop-shadow(${t.shadowOffsetX}px ${t.shadowOffsetY}px ${t.shadowBlur}px ${t.shadowColor})`),t.filters){for(const[g,f]of Object.entries(t.filters)){const t=s(l[g],f.intensity);if(t&&(h.push(t.filter),t.html)){const e=t.html.replace(/<svg([^>]*)>/,"<g$1>").replace(/<\/svg>/,"</g>");c.push(e)}}}const d=m("g",{className:"element",id:t.id,transform:"group"!==t.type?`translate(${t.x}, ${t.y}) rotate(${t.rotation})`:void 0,display:null===(n=t.visible)||void 0===n||n?void 0:"none",opacity:t.opacity,style:{"transform-origin":"top left",filter:h.join(" ")}},a,...c);return o&&o({dom:d,element:t})||d}async function v(t){try{const e=await fetch(t),i=e.headers.get("content-type")||"font/ttf",o=await e.arrayBuffer();return`data:${i};base64,${"undefined"!=typeof Buffer?Buffer.from(o).toString("base64"):function(t){const e=new Uint8Array(t);let i="";for(let o=0;o<e.length;o+=32768){const t=e.subarray(o,o+32768);i+=String.fromCharCode(...t)}if("undefined"!=typeof btoa){return btoa(i)}if("undefined"!=typeof Buffer){return Buffer.from(e).toString("base64")}throw new Error("No base64 encoder available in this environment")}(o)}`}catch(e){return console.error("Error embedding font:",e),t}}export async function jsonToDOM({json:t,elementHook:n,fontEmbedding:r="inline"}){const l=[];forEveryNode({children:t.pages},t=>{"text"!==t.type&&"tablecell"!==t.type&&"table"!==t.type||!t.fontFamily||-1!==l.indexOf(t.fontFamily)||l.push(t.fontFamily)});const s="inline"===r?await async function(t,e){return await Promise.all(t.map(async t=>{var i,o;if("Arial"===t){return null}const n=e.find(e=>e.fontFamily===t);if(n){const e=await v(n.url);return m("style",{},`@font-face { font-family: ${t}; src: url(${e}); }`)}{const e=`https://fonts.googleapis.com/css?family=${t}:bi,normal,i,b`;try{const n=await fetch(e),r=await n.text(),l=null===(o=null===(i=r.match(/url\((.*?)\)/g))||void 0===i?void 0:i.map(t=>t.replace(/url\((.*?)\)/,"$1")))||void 0===o?void 0:o.filter(t=>t.startsWith("https"));if(!(null==l?void 0:l.length)){throw new Error("No font URLs found")}const s=await Promise.all(l.map(async e=>{const i=await v(e),o=r.match(/font-style:\s*(.*?);/),n=r.match(/font-weight:\s*(.*?);/),l=o?o[1]:"normal",s=n?n[1]:"normal";return`@font-face {\n font-family: ${t};\n font-style: ${l};\n font-weight: ${s};\n src: url(${i});\n }`}));return m("style",{},s.join("\n"))}catch(r){return console.error("Error embedding Google Font:",r),m("defs",{},m("style",{type:"text/css",innerHTML:`@import url('${e}');`.replace(/&/g,"&")}))}}}))}(l,t.fonts):[],a=await Promise.all(t.pages.map(r=>async function({page:t,store:n,elementHook:r}){const l=await Promise.all(t.children.map(e=>$({element:e,page:t,store:n,elementHook:r}))),s=t.background.indexOf("url")>=0||t.background.indexOf("http")>=0||t.background.indexOf(".jpg")>=0||t.background.indexOf(".png")>=0||t.background.indexOf(".jpeg")>=0;let a;if(s){const r=await o(t.background);a=await e(t.background,Object.assign({width:n.width,height:n.height,x:0,y:0},i({width:n.width,height:n.height},{width:r.width,height:r.height})))}return m("g",{className:"page",style:{}},s?m("image",{"xlink:href":a,x:0,y:0,width:n.width,height:n.height,preserveAspectRatio:"none"}):m("rect",{x:0,y:0,width:n.width,height:n.height,fill:s?void 0:t.background}),...l)}({page:r,store:t,elementHook:n})));return m("svg",{xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",viewBox:`0 0 ${t.width} ${t.height}`,width:t.width,height:t.height},...s,...a)}const j=({dom:e,nestLevel:i=0})=>{if("string"==typeof e){return e}if(!e){return""}const o=e.props,{innerHTML:n}=o,r=t(o,["innerHTML"]),l=Object.keys(r).map(t=>((t,e)=>"object"==typeof e?`${t}="${Object.keys(e).map(t=>`${t}:${e[t]};`).join(" ")}"`:null==e||""===e?"":`${t}="${e}"`)(t,r[t])).filter(t=>t&&t.trim().length>0).join(" "),s=" ".repeat(i);return`${s}<${e.type}${l?" "+l:""}>${n||"\n"+e.children.map(t=>j({dom:t,nestLevel:i+1})).join("")}${s}</${e.type}>\n`};export async function jsonToSVG({json:t,elementHook:e,fontEmbedding:i="inline"}){const o=await jsonToDOM({json:t,elementHook:e,fontEmbedding:i});return j({dom:o})}
|
package/utils/validate-key.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"mobx";import{getAPI as o}from"./api.js";import{setRemoveBackgroundEnabled as t}from"./flags.js";const n=e.observable({value:!1}),a=e.observable({value:"v1"});export const ___=()=>a.value;const i=e.observable({value:0});export const ____=()=>i.value;export const isCreditVisible=()=>n.value;const r=e.action(()=>{n.value=!0});let s="";export const getKey=()=>s||"";let l="undefined"!=typeof window?window.location.origin:"";const c="undefined"!=typeof navigator&&navigator.userAgent.indexOf("Headless")>-1,d="undefined"!=typeof navigator&&navigator.userAgent.indexOf("Electron")>-1;"file://"===l&&c&&(l="headless"),"file://"===l&&d&&(l="electron");const p=`%cPolotno error! Current domain is not allowed. It may lead to unexpected behavior and stop working. Please add "${l}" here: https://polotno.com/cabinet`;let u=fetch;export const __=e=>{u=e};export async function isKeyPaid(n){for(let s=0;s<5;s++){try{const r=await u(o()+"/validate-key",{method:"POST",body:JSON.stringify({key:n,site:location.host,skdVersion:"2.40.
|
|
1
|
+
import*as e from"mobx";import{getAPI as o}from"./api.js";import{setRemoveBackgroundEnabled as t}from"./flags.js";const n=e.observable({value:!1}),a=e.observable({value:"v1"});export const ___=()=>a.value;const i=e.observable({value:0});export const ____=()=>i.value;export const isCreditVisible=()=>n.value;const r=e.action(()=>{n.value=!0});let s="";export const getKey=()=>s||"";let l="undefined"!=typeof window?window.location.origin:"";const c="undefined"!=typeof navigator&&navigator.userAgent.indexOf("Headless")>-1,d="undefined"!=typeof navigator&&navigator.userAgent.indexOf("Electron")>-1;"file://"===l&&c&&(l="headless"),"file://"===l&&d&&(l="electron");const p=`%cPolotno error! Current domain is not allowed. It may lead to unexpected behavior and stop working. Please add "${l}" here: https://polotno.com/cabinet`;let u=fetch;export const __=e=>{u=e};export async function isKeyPaid(n){for(let s=0;s<5;s++){try{const r=await u(o()+"/validate-key",{method:"POST",body:JSON.stringify({key:n,site:location.host,skdVersion:"2.40.2"})});if(e.runInAction(()=>{a.value=r.headers.get("x-api-version")||""}),!n){return console.error("Polotno API is initialized without API key. It may lead to unexpected behavior and stop working. Please create API key here: https://polotno.com/cabinet"),e.runInAction(()=>{i.value=1}),!1}if(200!==r.status){await new Promise(e=>setTimeout(e,3e3));continue}const s=await r.json();return s.is_valid||(console.error("Polotno API key is not valid. Please get new API key here: https://polotno.com/cabinet"),e.runInAction(()=>{i.value=1})),s.is_paid||(console.log("%cPolotno Free Version. For development usage only. https://polotno.com/","background: rgb(0, 161, 255); color: white; padding: 5px; margin: 5px;"),e.runInAction(()=>{0===i.value&&(i.value=2)})),s.is_domain_valid||console.log(p,"background: rgba(247, 101, 68, 1); color: white; padding: 5px; margin: 5px;"),t(s.remove_background_enabled),s.is_paid||!1}catch(r){await new Promise(e=>setTimeout(e,3e3))}}return console.error("Can not validate Polotno API key. Please report to anton@polotno.com immediately."),!0}export async function validateKey(e,o){s=e,await isKeyPaid(e)&&!o||r()}
|
package/utils/xml.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function xmlEscape(text: string): string;
|