polotno 2.4.26 → 2.4.27
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/package.json +1 -1
- package/polotno.bundle.js +2 -2
- package/side-panel/text-panel.js +1 -1
- package/utils/fonts.js +1 -1
package/package.json
CHANGED
package/polotno.bundle.js
CHANGED
|
@@ -26,7 +26,7 @@ For more info see: https://github.com/konvajs/react-konva/issues/256
|
|
|
26
26
|
`,nJ=`ReactKonva: You are using "zIndex" attribute for a Konva node.
|
|
27
27
|
react-konva may get confused with ordering. Just define correct order of elements in your render function of a component.
|
|
28
28
|
For more info see: https://github.com/konvajs/react-konva/issues/194
|
|
29
|
-
`,n0={};function n1(e,t,n=n0){if(!nY&&"zIndex"in t&&(console.warn(nJ),nY=!0),!nX&&t.draggable){var r=void 0!==t.x||void 0!==t.y,i=t.onDragEnd||t.onDragMove;r&&!i&&(console.warn(nQ),nX=!0)}for(var o in n)if(!nK[o]){var a="on"===o.slice(0,2),l=n[o]!==t[o];if(a&&l){var s=o.substr(2).toLowerCase();"content"===s.substr(0,7)&&(s="content"+s.substr(7,1).toUpperCase()+s.substr(8)),e.off(s,n[o])}t.hasOwnProperty(o)||e.setAttr(o,void 0)}var u=t._useStrictMode,c={},d=!1;let h={};for(var o in t)if(!nK[o]){var a="on"===o.slice(0,2),f=n[o]!==t[o];if(a&&f){var s=o.substr(2).toLowerCase();"content"===s.substr(0,7)&&(s="content"+s.substr(7,1).toUpperCase()+s.substr(8)),t[o]&&(h[s]=t[o])}!a&&(t[o]!==n[o]||u&&t[o]!==e.getAttr(o))&&(d=!0,c[o]=t[o])}for(var s in d&&(e.setAttrs(c),n2(e)),h)e.on(s+nZ,h[s])}function n2(e){if(!L.Konva.autoDrawEnabled){var t=e.getLayer()||e.getStage();t&&t.batchDraw()}}f("clk2u");let n3={},n5={};function n6(e,t){if("string"==typeof t){console.error(`Do not use plain text as child of Konva.Node. You are using text: ${t}`);return}e.add(t),n2(e)}function n4(e,t,n){let r=s(nq)[e];r||(console.error(`Konva has no node with the type ${e}. Group will be used instead. If you use minimal version of react-konva, just import required nodes into Konva: "import "konva/lib/shapes/${e}" If you want to render DOM elements as part of canvas tree take a look into this demo: https://konvajs.github.io/docs/react/DOM_Portal.html`),r=s(nq).Group);let i={},o={};for(var a in t)"on"===a.slice(0,2)?o[a]=t[a]:i[a]=t[a];let l=new r(i);return n1(l,o),l}function n8(e,t,n){console.error(`Text components are not supported for now in ReactKonva. Your text is: "${e}"`)}function n9(e,t,n){return!1}function n7(e){return e}function re(){return null}function rt(){return null}function rn(e,t,n,r){return n5}function rr(){}function ri(e){}function ro(e,t){return!1}function ra(){return n3}function rl(){return n3}s(nq).Node.prototype._applyProps=n1;let rs=setTimeout,ru=clearTimeout,rc=-1;function rd(e,t){return!1}let rh=!1,rf=!0,rp=!0;function rg(e,t){t.parent===e?t.moveToTop():e.add(t),n2(e)}function rm(e,t){t.parent===e?t.moveToTop():e.add(t),n2(e)}function rv(e,t,n){t._remove(),e.add(t),t.setZIndex(n.getZIndex()),n2(e)}function ry(e,t,n){rv(e,t,n)}function rb(e,t){t.destroy(),t.off(nZ),n2(e)}function rw(e,t){t.destroy(),t.off(nZ),n2(e)}function rx(e,t,n){console.error(`Text components are not yet supported in ReactKonva. You text is: "${n}"`)}function r_(e,t,n){}function rE(e,t,n,r,i){n1(e,i,r)}function rS(e){e.hide(),n2(e)}function rC(e){}function rO(e,t){(null==t.visible||t.visible)&&e.show()}function rk(e,t){}function rP(e){}function rT(){}let rA=()=>nW.DefaultEventPriority;var y=f("8NFma"),rN=Object.defineProperty,rj=Object.defineProperties,rR=Object.getOwnPropertyDescriptors,rL=Object.getOwnPropertySymbols,rI=Object.prototype.hasOwnProperty,rM=Object.prototype.propertyIsEnumerable,rD=(e,t,n)=>t in e?rN(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,rF=(e,t)=>{for(var n in t||(t={}))rI.call(t,n)&&rD(e,n,t[n]);if(rL)for(var n of rL(t))rM.call(t,n)&&rD(e,n,t[n]);return e},rz=(e,t)=>rj(e,rR(t));function rB(e){try{return Object.defineProperties(e,{_currentRenderer:{get:()=>null,set(){}},_currentRenderer2:{get:()=>null,set(){}}})}catch(t){return e}}let rU=rB(y.createContext(null));class rH extends y.Component{render(){return y.createElement(rU.Provider,{value:this._reactInternals},this.props.children)}}let{ReactCurrentOwner:rV,ReactCurrentDispatcher:rq}=y.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function rG(){let e=function(){var e,t;let n=function(){let e=y.useContext(rU);if(null===e)throw Error("its-fine: useFiber must be called within a <FiberProvider />!");let t=y.useId();return y.useMemo(()=>{for(let n of[null==rV?void 0:rV.current,e,null==e?void 0:e.alternate]){if(!n)continue;let e=function e(t,n,r){if(!t)return;if(!0===r(t))return t;let i=n?t.return:t.child;for(;i;){let t=e(i,n,r);if(t)return t;i=n?null:i.sibling}}(n,!1,e=>{let n=e.memoizedState;for(;n;){if(n.memoizedState===t)return!0;n=n.next}});if(e)return e}},[e,t])}(),[r]=y.useState(()=>new Map);r.clear();let i=n;for(;i;){let n=null==(e=i.type)?void 0:e._context;n&&n!==rU&&!r.has(n)&&r.set(n,null==(t=null==rq?void 0:rq.current)?void 0:t.readContext(rB(n))),i=i.return}return r}();return y.useMemo(()=>Array.from(e.keys()).reduce((t,n)=>r=>y.createElement(t,null,y.createElement(n.Provider,rz(rF({},r),{value:e.get(n)}))),e=>y.createElement(rH,rF({},e))),[e])}let rW=e=>{let t=s(y).useRef(),n=s(y).useRef(),r=s(y).useRef(),i=function(e){let t=s(y).useRef({});return s(y).useLayoutEffect(()=>{t.current=e}),s(y).useLayoutEffect(()=>()=>{t.current={}},[]),t.current}(e),o=rG(),a=t=>{let{forwardedRef:n}=e;n&&("function"==typeof n?n(t):n.current=t)};return s(y).useLayoutEffect(()=>(n.current=new(s(nq)).Stage({width:e.width,height:e.height,container:t.current}),a(n.current),r.current=r1.createContainer(n.current,nW.LegacyRoot,!1,null),r1.updateContainer(s(y).createElement(o,{},e.children),r.current),()=>{s(nq).isBrowser&&(a(null),r1.updateContainer(null,r.current,null),n.current.destroy())}),[]),s(y).useLayoutEffect(()=>{a(n.current),n1(n.current,e,i),r1.updateContainer(s(y).createElement(o,{},e.children),r.current,null)}),s(y).createElement("div",{ref:t,id:e.id,accessKey:e.accessKey,className:e.className,role:e.role,style:e.style,tabIndex:e.tabIndex,title:e.title})},r$="Group",rK="Label",rY="Rect",rX="Line",rZ="Image",rQ="Text",rJ="Path",r0="Transformer",r1=s(nG)(n$);r1.injectIntoDevTools({findHostInstanceByFiber:()=>null,bundleType:0,version:s(y).version,rendererPackageName:"react-konva"});let r2=s(y).forwardRef((e,t)=>s(y).createElement(rH,{},s(y).createElement(rW,{...e,forwardedRef:t})));var r3={},y=f("8NFma");r3=function(e,t,n){let r=y.useRef("loading"),i=y.useRef(),[o,a]=y.useState(0),l=y.useRef(),s=y.useRef(),u=y.useRef();return(l.current!==e||s.current!==t||u.current!==n)&&(r.current="loading",i.current=void 0,l.current=e,s.current=t,u.current=n),y.useLayoutEffect(function(){if(e){var o=document.createElement("img");return o.addEventListener("load",l),o.addEventListener("error",s),t&&(o.crossOrigin=t),n&&(o.referrerPolicy=n),o.src=e,function(){o.removeEventListener("load",l),o.removeEventListener("error",s)}}function l(){r.current="loaded",i.current=o,a(Math.random())}function s(){r.current="failed",i.current=void 0,a(Math.random())}},[e,t,n]),[i.current,r.current]};var y=(f("8NFma"),f("8NFma"),f("8NFma")),r5=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&0>t.indexOf(r)&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols)for(var i=0,r=Object.getOwnPropertySymbols(e);i<r.length;i++)0>t.indexOf(r[i])&&Object.prototype.propertyIsEnumerable.call(e,r[i])&&(n[r[i]]=e[r[i]]);return n};let r6=e=>{let t=window.getComputedStyle(e).position;return!("absolute"===t||"relative"===t)},r4=({children:e,groupProps:t,divProps:n,transform:r,transformFunc:i})=>{let o=rG(),a=s(y).useRef(null);s(y).useRef();let[l]=s(y).useState(()=>document.createElement("div")),u=s(y).useMemo(()=>s(m).createRoot(l),[l]),c=null==r||r,d=function(e=()=>{}){let t=s(y).useRef(e);return t.current=e,s(y).useCallback((...e)=>t.current.apply(null,e),[])}(()=>{if(c&&a.current){let e=a.current.getAbsoluteTransform().decompose();i&&(e=i(e)),l.style.position="absolute",l.style.zIndex="10",l.style.top="0px",l.style.left="0px",l.style.transform=`translate(${e.x}px, ${e.y}px) rotate(${e.rotation}deg) scaleX(${e.scaleX}) scaleY(${e.scaleY})`,l.style.transformOrigin="top left"}else l.style.position="",l.style.zIndex="",l.style.top="",l.style.left="",l.style.transform="",l.style.transformOrigin="";let e=n||{},{style:t}=e,r=r5(e,["style"]);Object.assign(l.style,t),Object.assign(l,r)});return s(y).useLayoutEffect(()=>{var e;let t=a.current;if(!t)return;let n=null===(e=t.getStage())||void 0===e?void 0:e.container();if(n)return n.appendChild(l),c&&r6(n)&&(n.style.position="relative"),t.on("absoluteTransformChange",d),d(),()=>{var e;t.off("absoluteTransformChange",d),null===(e=l.parentNode)||void 0===e||e.removeChild(l)}},[c]),s(y).useLayoutEffect(()=>{d()},[n,i]),s(y).useLayoutEffect(()=>{u.render(s(y).createElement(o,null,e))}),s(y).useLayoutEffect(()=>()=>{setTimeout(()=>{u.unmount()})},[]),s(y).createElement(r$,Object.assign({ref:a},t))};var y=f("8NFma");let r8=({selector:e,enabled:t,children:n})=>{let r=s(y).useRef(null),i=s(y).useRef(null),o=s(y).useRef(),a=null==t||t;return s(y).useLayoutEffect(()=>{if(!r.current||!i.current)return;o.current=i.current;let t=r.current.getStage().findOne(e);a&&t?i.current.moveTo(t):i.current.moveTo(r.current);let n=r.current.getLayer();if(n&&(n.batchDraw(),t)){let e=t.getLayer();if(!e)return;e.batchDraw()}},[e,a]),s(y).useEffect(()=>()=>{var e;null===(e=o.current)||void 0===e||e.destroy()},[]),s(y).createElement(r$,{name:"_outer_portal",ref:r},s(y).createElement(r$,{name:"_inner_portal",ref:i},n))};var b=f("2SBKn");function r9(e,t,n){let r=n[t-1]||{values:{x:0,y:0}};if(e.marker===e.marker.toLowerCase())switch(e.marker=e.marker.toUpperCase(),e.marker){case"M":case"L":case"A":case"T":e.values.x+=r.values.x,e.values.y+=r.values.y;break;case"H":e.marker="L",e.values.x+=r.values.x,e.values.y=r.values.y;break;case"V":e.marker="L",e.values.x=r.values.x,e.values.y+=r.values.y;break;case"C":e.values.x+=r.values.x,e.values.y+=r.values.y,e.values.x1+=r.values.x,e.values.y1+=r.values.y,e.values.x2+=r.values.x,e.values.y2+=r.values.y;break;case"S":e.values.x+=r.values.x,e.values.y+=r.values.y,e.values.x2+=r.values.x,e.values.y2+=r.values.y;break;case"Q":e.values.x+=r.values.x,e.values.y+=r.values.y,e.values.x1+=r.values.x,e.values.y1+=r.values.y}else if(e.marker===e.marker.toUpperCase())switch(e.marker){case"H":e.marker="L",e.values.y=r.values.y;break;case"V":e.marker="L",e.values.x=r.values.x}if("Z"===e.marker){let r=function e(t,n){return"M"===t[n].marker?t[n]:e(t,n-1)}(n,t);e.values.x=r.values.x,e.values.y=r.values.y}return e}function r7(e,t,n){if(0!==t&&"L"===e.marker){let r=n[t-1];["x","y"].every(t=>0===Math.round(Math.abs(r.values[t]-e.values[t])))&&(e.overlap=!0)}return e}function ie(e,t){return Math.atan2(t.x-e.x,t.y-e.y)}function it(e,t){return Math.sqrt(Math.pow(e.x-t.x,2)+Math.pow(e.y-t.y,2))}function ir(e,t){let n=t/Math.tan(e);return n===1/0||n===-1/0||isNaN(n)?t:n}var y=f("8NFma"),ii={};o(ii,"parse",()=>P_,e=>P_=e),o(ii,"stringify",()=>PE,e=>PE=e);var io=io||{};io.stringify=(k3={"visit_linear-gradient":function(e){return k3.visit_gradient(e)},"visit_repeating-linear-gradient":function(e){return k3.visit_gradient(e)},"visit_radial-gradient":function(e){return k3.visit_gradient(e)},"visit_repeating-radial-gradient":function(e){return k3.visit_gradient(e)},visit_gradient:function(e){var t=k3.visit(e.orientation);return t&&(t+=", "),e.type+"("+t+k3.visit(e.colorStops)+")"},visit_shape:function(e){var t=e.value,n=k3.visit(e.at),r=k3.visit(e.style);return r&&(t+=" "+r),n&&(t+=" at "+n),t},"visit_default-radial":function(e){var t="",n=k3.visit(e.at);return n&&(t+=n),t},"visit_extent-keyword":function(e){var t=e.value,n=k3.visit(e.at);return n&&(t+=" at "+n),t},"visit_position-keyword":function(e){return e.value},visit_position:function(e){return k3.visit(e.value.x)+" "+k3.visit(e.value.y)},"visit_%":function(e){return e.value+"%"},visit_em:function(e){return e.value+"em"},visit_px:function(e){return e.value+"px"},visit_literal:function(e){return k3.visit_color(e.value,e)},visit_hex:function(e){return k3.visit_color("#"+e.value,e)},visit_rgb:function(e){return k3.visit_color("rgb("+e.value.join(", ")+")",e)},visit_rgba:function(e){return k3.visit_color("rgba("+e.value.join(", ")+")",e)},visit_color:function(e,t){var n=e,r=k3.visit(t.length);return r&&(n+=" "+r),n},visit_angular:function(e){return e.value+"deg"},visit_directional:function(e){return"to "+e.value},visit_array:function(e){var t="",n=e.length;return e.forEach(function(e,r){t+=k3.visit(e),r<n-1&&(t+=", ")}),t},visit:function(e){if(!e)return"";if(e instanceof Array)return k3.visit_array(e,"");if(e.type){var t=k3["visit_"+e.type];if(t)return t(e);throw Error("Missing visitor visit_"+e.type)}throw Error("Invalid node.")}},function(e){return k3.visit(e)});var io=io||{};io.parse=function(){var e={linearGradient:/^(\-(webkit|o|ms|moz)\-)?(linear\-gradient)/i,repeatingLinearGradient:/^(\-(webkit|o|ms|moz)\-)?(repeating\-linear\-gradient)/i,radialGradient:/^(\-(webkit|o|ms|moz)\-)?(radial\-gradient)/i,repeatingRadialGradient:/^(\-(webkit|o|ms|moz)\-)?(repeating\-radial\-gradient)/i,sideOrCorner:/^to (left (top|bottom)|right (top|bottom)|left|right|top|bottom)/i,extentKeywords:/^(closest\-side|closest\-corner|farthest\-side|farthest\-corner|contain|cover)/,positionKeywords:/^(left|center|right|top|bottom)/i,pixelValue:/^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))px/,percentageValue:/^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))\%/,emValue:/^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))em/,angleValue:/^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))deg/,startCall:/^\(/,endCall:/^\)/,comma:/^,/,hexColor:/^\#([0-9a-fA-F]+)/,literalColor:/^([a-zA-Z]+)/,rgbColor:/^rgb/i,rgbaColor:/^rgba/i,number:/^(([0-9]*\.[0-9]+)|([0-9]+\.?))/},t="";function n(e){var n=Error(t+": "+e);throw n.source=t,n}function r(){return i("linear-gradient",e.linearGradient,a)||i("repeating-linear-gradient",e.repeatingLinearGradient,a)||i("radial-gradient",e.radialGradient,l)||i("repeating-radial-gradient",e.repeatingRadialGradient,l)}function i(t,r,i){return o(r,function(r){var o=i();return o&&!y(e.comma)&&n("Missing comma before color stops"),{type:t,orientation:o,colorStops:h(f)}})}function o(t,r){var i=y(t);if(i){y(e.startCall)||n("Missing (");var o=r(i);return y(e.endCall)||n("Missing )"),o}}function a(){return v("directional",e.sideOrCorner,1)||v("angular",e.angleValue,1)}function l(){var n,r,i=s();return i&&((n=[]).push(i),r=t,y(e.comma)&&((i=s())?n.push(i):t=r)),n}function s(){var e,t,n=((e=v("shape",/^(circle)/i,0))&&(e.style=m()||u()),e||((t=v("shape",/^(ellipse)/i,0))&&(t.style=g()||u()),t));if(n)n.at=c();else{var r=u();if(r){n=r;var i=c();i&&(n.at=i)}else{var o=d();o&&(n={type:"default-radial",at:o})}}return n}function u(){return v("extent-keyword",e.extentKeywords,1)}function c(){if(v("position",/^at/,0)){var e=d();return e||n("Missing positioning value"),e}}function d(){var e={x:g(),y:g()};if(e.x||e.y)return{type:"position",value:e}}function h(t){var r=t(),i=[];if(r)for(i.push(r);y(e.comma);)(r=t())?i.push(r):n("One extra comma");return i}function f(){var t=v("hex",e.hexColor,1)||o(e.rgbaColor,function(){return{type:"rgba",value:h(p)}})||o(e.rgbColor,function(){return{type:"rgb",value:h(p)}})||v("literal",e.literalColor,0);return t||n("Expected color definition"),t.length=g(),t}function p(){return y(e.number)[1]}function g(){return v("%",e.percentageValue,1)||v("position-keyword",e.positionKeywords,1)||m()}function m(){return v("px",e.pixelValue,1)||v("em",e.emValue,1)}function v(e,t,n){var r=y(t);if(r)return{type:e,value:r[n]}}function y(e){var n,r;return(r=/^[\n\r\t\s]+/.exec(t))&&b(r[0].length),(n=e.exec(t))&&b(n[0].length),n}function b(e){t=t.substr(e)}return function(e){var i;return t=e.toString(),i=h(r),t.length>0&&n("Invalid input not EOF"),i}}(),P_=io.parse,PE=io.stringify;let ia=e=>e.indexOf("linear-gradient")>=0,il=e=>"hex"===e.type?"#"+e.value:"literal"===e.type?e.value:`${e.type}(${e.value.join(",")})`,is=e=>{if(!ia(e))return{rotation:0,stops:[{offset:0,color:e},{offset:1,color:e}]};let t=s(ii).parse(e)[0];return{rotation:parseFloat(t.orientation.value),stops:t.colorStops.map((e,n)=>({color:il(e),offset:e.length?parseFloat(e.length.value)/100:n/(t.colorStops.length-1)}))}},iu=(e,t=e.fill,n="fill")=>s(y).useMemo(()=>{if(!ia(t))return{[n]:t};let{stops:r,rotation:i}=is(t),o={x:e.a.width/2,y:e.a.height/2},a=Math.sqrt(Math.pow(o.x,2)+Math.pow(o.y,2)),l=s(N).Util.degToRad(i)-Math.PI/2,u=[];return(r.forEach(({offset:e,color:t})=>{u.push(e,t)}),"fill"===n)?{fillLinearGradientStartPointX:o.x-a*Math.cos(l),fillLinearGradientStartPointY:o.y-a*Math.sin(l),fillLinearGradientColorStops:u,fillLinearGradientEndPointX:o.x+a*Math.cos(l),fillLinearGradientEndPointY:o.y+a*Math.sin(l),fill:r[1].color,fillPriority:"linear-gradient"}:{strokeLinearGradientStartPointX:o.x-a*Math.cos(l),strokeLinearGradientStartPointY:o.y-a*Math.sin(l),strokeLinearGradientColorStops:u,strokeLinearGradientEndPointX:o.x+a*Math.cos(l),strokeLinearGradientEndPointY:o.y+a*Math.sin(l)}},[t,e.width,e.height]);var y=f("8NFma");let ic=()=>!1;function id(e,t){let n=s(y).useRef();s(y).useLayoutEffect(()=>{n.current&&n.current.destroy()},[t]),s(y).useLayoutEffect(()=>{},[])}let ih=0,ip=[],ig=()=>3e4;function im(e){ih+=1;let t=!1,n=setTimeout(()=>{t||(ib(`Timeout loading image ${e}`),console.error("Timeout triggered for loader. Some assets may not have loaded.",e),t=!0,iv())},3e4);return()=>{t||(clearTimeout(n),iv())}}function iv(){0==(ih-=1)&&(ip.forEach(e=>e()),ip=[])}let iy=[];function ib(e){iy.forEach(t=>t(e))}var b=f("2SBKn");let iw=b.observable(["Roboto","Amatic SC","Press Start 2P","Marck Script","Rubik Mono One"]),ix=b.observable({value:!1});function i_(){return ix.value}let iE=b.observable([]);var iS=document.createElement("canvas");function iC(e,t="Arial"){var n=iS.getContext("2d");return n.font=`normal 40px '${e}', ${t}`,n.measureText("Some test text;?#D-ПРИВЕТ!1230o9u8i7y6t5r4e3w2q1").width}let iO={Arial:!0},ik=e=>!!iO[e];async function iP(e){if(iO[e])return;let t=!!document.fonts?.load,n=iC("Arial");if(t)try{await document.fonts.load(`16px '${e}'`);let t=iC(e);if(n!==t){iO[e]=!0;return}}catch{}let r=iC("Times","Times"),i=iC(e),o=ig()/60;for(let t=0;t<o;t++){let t=iC(e,"Arial"),o=iC(e,"Times");if(t!==i||t!==n||o!==r){iO[e]=!0;return}await new Promise(e=>setTimeout(e,60))}console.warn(`Timeout for loading font "${e}". Looks like polotno can't load it. Is it a correct font family?`),ib(`Timeout for loading font "${e}"`)}let iT={},iA={};var b=f("2SBKn");let iN=b.observable({imageDownScalingEnabled:!0,removeBackgroundEnabled:!0,htmlRenderEnabled:!1,forceTextFitEnabled:!1,textVerticalResizeEnabled:!1,textOverflow:"resize",animationsEnabled:!1});b.action(e=>{iN.textVerticalResizeEnabled=e});let ij=b.action(e=>{iN.removeBackgroundEnabled=e});b.action(e=>{iN.htmlRenderEnabled=e});let iR=b.action(e=>{iN.imageDownScalingEnabled=e});function iL(e=""){return(e=e.replace(/<\/p>/gi,"\n")).replace(/(<([^>]+)>)/gi,"")}function iI(e,t){let n={filters:[]};t.brightnessEnabled&&(n.filters.push(s(N).Filters.Brighten),n.brightness=t.brightness),t.blurEnabled&&(n.filters.push(s(N).Filters.Blur),n.blurRadius=t.blurRadius),t.sepiaEnabled&&n.filters.push(s(N).Filters.Sepia),t.grayscaleEnabled&&n.filters.push(s(N).Filters.Grayscale),e.setAttrs(n),n.filters.length?e.cache({pixelRatio:t.store._elementsPixelRatio}):e.clearCache(),e.getLayer()?.batchDraw()}b.action(e=>{console.warn("useDownScaling is deprecated. Use setDownScalingEnabled instead."),iR(e)}),b.action(e=>{console.warn("setForceTextFit is deprecated. Use setTextOverflow instead."),iN.textOverflow="change-font-size"}),b.action(e=>{iN.textOverflow=e}),b.action(e=>{iN.animationsEnabled=e}),f("8NFma");let iM={stroke:"rgb(0, 161, 255)",strokeWidth:2},iD=T(({element:e})=>(0,g.jsx)(rY,{name:"highlighter",x:e.a.x,y:e.a.y,rotation:e.a.rotation,width:e.a.width,height:e.a.height,listening:!1,strokeScaleEnabled:!1,...iM}));var y=f("8NFma");let iF=()=>window.innerWidth<=500,iz=e=>`
|
|
29
|
+
`,n0={};function n1(e,t,n=n0){if(!nY&&"zIndex"in t&&(console.warn(nJ),nY=!0),!nX&&t.draggable){var r=void 0!==t.x||void 0!==t.y,i=t.onDragEnd||t.onDragMove;r&&!i&&(console.warn(nQ),nX=!0)}for(var o in n)if(!nK[o]){var a="on"===o.slice(0,2),l=n[o]!==t[o];if(a&&l){var s=o.substr(2).toLowerCase();"content"===s.substr(0,7)&&(s="content"+s.substr(7,1).toUpperCase()+s.substr(8)),e.off(s,n[o])}t.hasOwnProperty(o)||e.setAttr(o,void 0)}var u=t._useStrictMode,c={},d=!1;let h={};for(var o in t)if(!nK[o]){var a="on"===o.slice(0,2),f=n[o]!==t[o];if(a&&f){var s=o.substr(2).toLowerCase();"content"===s.substr(0,7)&&(s="content"+s.substr(7,1).toUpperCase()+s.substr(8)),t[o]&&(h[s]=t[o])}!a&&(t[o]!==n[o]||u&&t[o]!==e.getAttr(o))&&(d=!0,c[o]=t[o])}for(var s in d&&(e.setAttrs(c),n2(e)),h)e.on(s+nZ,h[s])}function n2(e){if(!L.Konva.autoDrawEnabled){var t=e.getLayer()||e.getStage();t&&t.batchDraw()}}f("clk2u");let n3={},n5={};function n6(e,t){if("string"==typeof t){console.error(`Do not use plain text as child of Konva.Node. You are using text: ${t}`);return}e.add(t),n2(e)}function n4(e,t,n){let r=s(nq)[e];r||(console.error(`Konva has no node with the type ${e}. Group will be used instead. If you use minimal version of react-konva, just import required nodes into Konva: "import "konva/lib/shapes/${e}" If you want to render DOM elements as part of canvas tree take a look into this demo: https://konvajs.github.io/docs/react/DOM_Portal.html`),r=s(nq).Group);let i={},o={};for(var a in t)"on"===a.slice(0,2)?o[a]=t[a]:i[a]=t[a];let l=new r(i);return n1(l,o),l}function n8(e,t,n){console.error(`Text components are not supported for now in ReactKonva. Your text is: "${e}"`)}function n9(e,t,n){return!1}function n7(e){return e}function re(){return null}function rt(){return null}function rn(e,t,n,r){return n5}function rr(){}function ri(e){}function ro(e,t){return!1}function ra(){return n3}function rl(){return n3}s(nq).Node.prototype._applyProps=n1;let rs=setTimeout,ru=clearTimeout,rc=-1;function rd(e,t){return!1}let rh=!1,rf=!0,rp=!0;function rg(e,t){t.parent===e?t.moveToTop():e.add(t),n2(e)}function rm(e,t){t.parent===e?t.moveToTop():e.add(t),n2(e)}function rv(e,t,n){t._remove(),e.add(t),t.setZIndex(n.getZIndex()),n2(e)}function ry(e,t,n){rv(e,t,n)}function rb(e,t){t.destroy(),t.off(nZ),n2(e)}function rw(e,t){t.destroy(),t.off(nZ),n2(e)}function rx(e,t,n){console.error(`Text components are not yet supported in ReactKonva. You text is: "${n}"`)}function r_(e,t,n){}function rE(e,t,n,r,i){n1(e,i,r)}function rS(e){e.hide(),n2(e)}function rC(e){}function rO(e,t){(null==t.visible||t.visible)&&e.show()}function rk(e,t){}function rP(e){}function rT(){}let rA=()=>nW.DefaultEventPriority;var y=f("8NFma"),rN=Object.defineProperty,rj=Object.defineProperties,rR=Object.getOwnPropertyDescriptors,rL=Object.getOwnPropertySymbols,rI=Object.prototype.hasOwnProperty,rM=Object.prototype.propertyIsEnumerable,rD=(e,t,n)=>t in e?rN(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,rF=(e,t)=>{for(var n in t||(t={}))rI.call(t,n)&&rD(e,n,t[n]);if(rL)for(var n of rL(t))rM.call(t,n)&&rD(e,n,t[n]);return e},rz=(e,t)=>rj(e,rR(t));function rB(e){try{return Object.defineProperties(e,{_currentRenderer:{get:()=>null,set(){}},_currentRenderer2:{get:()=>null,set(){}}})}catch(t){return e}}let rU=rB(y.createContext(null));class rH extends y.Component{render(){return y.createElement(rU.Provider,{value:this._reactInternals},this.props.children)}}let{ReactCurrentOwner:rV,ReactCurrentDispatcher:rq}=y.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function rG(){let e=function(){var e,t;let n=function(){let e=y.useContext(rU);if(null===e)throw Error("its-fine: useFiber must be called within a <FiberProvider />!");let t=y.useId();return y.useMemo(()=>{for(let n of[null==rV?void 0:rV.current,e,null==e?void 0:e.alternate]){if(!n)continue;let e=function e(t,n,r){if(!t)return;if(!0===r(t))return t;let i=n?t.return:t.child;for(;i;){let t=e(i,n,r);if(t)return t;i=n?null:i.sibling}}(n,!1,e=>{let n=e.memoizedState;for(;n;){if(n.memoizedState===t)return!0;n=n.next}});if(e)return e}},[e,t])}(),[r]=y.useState(()=>new Map);r.clear();let i=n;for(;i;){let n=null==(e=i.type)?void 0:e._context;n&&n!==rU&&!r.has(n)&&r.set(n,null==(t=null==rq?void 0:rq.current)?void 0:t.readContext(rB(n))),i=i.return}return r}();return y.useMemo(()=>Array.from(e.keys()).reduce((t,n)=>r=>y.createElement(t,null,y.createElement(n.Provider,rz(rF({},r),{value:e.get(n)}))),e=>y.createElement(rH,rF({},e))),[e])}let rW=e=>{let t=s(y).useRef(),n=s(y).useRef(),r=s(y).useRef(),i=function(e){let t=s(y).useRef({});return s(y).useLayoutEffect(()=>{t.current=e}),s(y).useLayoutEffect(()=>()=>{t.current={}},[]),t.current}(e),o=rG(),a=t=>{let{forwardedRef:n}=e;n&&("function"==typeof n?n(t):n.current=t)};return s(y).useLayoutEffect(()=>(n.current=new(s(nq)).Stage({width:e.width,height:e.height,container:t.current}),a(n.current),r.current=r1.createContainer(n.current,nW.LegacyRoot,!1,null),r1.updateContainer(s(y).createElement(o,{},e.children),r.current),()=>{s(nq).isBrowser&&(a(null),r1.updateContainer(null,r.current,null),n.current.destroy())}),[]),s(y).useLayoutEffect(()=>{a(n.current),n1(n.current,e,i),r1.updateContainer(s(y).createElement(o,{},e.children),r.current,null)}),s(y).createElement("div",{ref:t,id:e.id,accessKey:e.accessKey,className:e.className,role:e.role,style:e.style,tabIndex:e.tabIndex,title:e.title})},r$="Group",rK="Label",rY="Rect",rX="Line",rZ="Image",rQ="Text",rJ="Path",r0="Transformer",r1=s(nG)(n$);r1.injectIntoDevTools({findHostInstanceByFiber:()=>null,bundleType:0,version:s(y).version,rendererPackageName:"react-konva"});let r2=s(y).forwardRef((e,t)=>s(y).createElement(rH,{},s(y).createElement(rW,{...e,forwardedRef:t})));var r3={},y=f("8NFma");r3=function(e,t,n){let r=y.useRef("loading"),i=y.useRef(),[o,a]=y.useState(0),l=y.useRef(),s=y.useRef(),u=y.useRef();return(l.current!==e||s.current!==t||u.current!==n)&&(r.current="loading",i.current=void 0,l.current=e,s.current=t,u.current=n),y.useLayoutEffect(function(){if(e){var o=document.createElement("img");return o.addEventListener("load",l),o.addEventListener("error",s),t&&(o.crossOrigin=t),n&&(o.referrerPolicy=n),o.src=e,function(){o.removeEventListener("load",l),o.removeEventListener("error",s)}}function l(){r.current="loaded",i.current=o,a(Math.random())}function s(){r.current="failed",i.current=void 0,a(Math.random())}},[e,t,n]),[i.current,r.current]};var y=(f("8NFma"),f("8NFma"),f("8NFma")),r5=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&0>t.indexOf(r)&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols)for(var i=0,r=Object.getOwnPropertySymbols(e);i<r.length;i++)0>t.indexOf(r[i])&&Object.prototype.propertyIsEnumerable.call(e,r[i])&&(n[r[i]]=e[r[i]]);return n};let r6=e=>{let t=window.getComputedStyle(e).position;return!("absolute"===t||"relative"===t)},r4=({children:e,groupProps:t,divProps:n,transform:r,transformFunc:i})=>{let o=rG(),a=s(y).useRef(null);s(y).useRef();let[l]=s(y).useState(()=>document.createElement("div")),u=s(y).useMemo(()=>s(m).createRoot(l),[l]),c=null==r||r,d=function(e=()=>{}){let t=s(y).useRef(e);return t.current=e,s(y).useCallback((...e)=>t.current.apply(null,e),[])}(()=>{if(c&&a.current){let e=a.current.getAbsoluteTransform().decompose();i&&(e=i(e)),l.style.position="absolute",l.style.zIndex="10",l.style.top="0px",l.style.left="0px",l.style.transform=`translate(${e.x}px, ${e.y}px) rotate(${e.rotation}deg) scaleX(${e.scaleX}) scaleY(${e.scaleY})`,l.style.transformOrigin="top left"}else l.style.position="",l.style.zIndex="",l.style.top="",l.style.left="",l.style.transform="",l.style.transformOrigin="";let e=n||{},{style:t}=e,r=r5(e,["style"]);Object.assign(l.style,t),Object.assign(l,r)});return s(y).useLayoutEffect(()=>{var e;let t=a.current;if(!t)return;let n=null===(e=t.getStage())||void 0===e?void 0:e.container();if(n)return n.appendChild(l),c&&r6(n)&&(n.style.position="relative"),t.on("absoluteTransformChange",d),d(),()=>{var e;t.off("absoluteTransformChange",d),null===(e=l.parentNode)||void 0===e||e.removeChild(l)}},[c]),s(y).useLayoutEffect(()=>{d()},[n,i]),s(y).useLayoutEffect(()=>{u.render(s(y).createElement(o,null,e))}),s(y).useLayoutEffect(()=>()=>{setTimeout(()=>{u.unmount()})},[]),s(y).createElement(r$,Object.assign({ref:a},t))};var y=f("8NFma");let r8=({selector:e,enabled:t,children:n})=>{let r=s(y).useRef(null),i=s(y).useRef(null),o=s(y).useRef(),a=null==t||t;return s(y).useLayoutEffect(()=>{if(!r.current||!i.current)return;o.current=i.current;let t=r.current.getStage().findOne(e);a&&t?i.current.moveTo(t):i.current.moveTo(r.current);let n=r.current.getLayer();if(n&&(n.batchDraw(),t)){let e=t.getLayer();if(!e)return;e.batchDraw()}},[e,a]),s(y).useEffect(()=>()=>{var e;null===(e=o.current)||void 0===e||e.destroy()},[]),s(y).createElement(r$,{name:"_outer_portal",ref:r},s(y).createElement(r$,{name:"_inner_portal",ref:i},n))};var b=f("2SBKn");function r9(e,t,n){let r=n[t-1]||{values:{x:0,y:0}};if(e.marker===e.marker.toLowerCase())switch(e.marker=e.marker.toUpperCase(),e.marker){case"M":case"L":case"A":case"T":e.values.x+=r.values.x,e.values.y+=r.values.y;break;case"H":e.marker="L",e.values.x+=r.values.x,e.values.y=r.values.y;break;case"V":e.marker="L",e.values.x=r.values.x,e.values.y+=r.values.y;break;case"C":e.values.x+=r.values.x,e.values.y+=r.values.y,e.values.x1+=r.values.x,e.values.y1+=r.values.y,e.values.x2+=r.values.x,e.values.y2+=r.values.y;break;case"S":e.values.x+=r.values.x,e.values.y+=r.values.y,e.values.x2+=r.values.x,e.values.y2+=r.values.y;break;case"Q":e.values.x+=r.values.x,e.values.y+=r.values.y,e.values.x1+=r.values.x,e.values.y1+=r.values.y}else if(e.marker===e.marker.toUpperCase())switch(e.marker){case"H":e.marker="L",e.values.y=r.values.y;break;case"V":e.marker="L",e.values.x=r.values.x}if("Z"===e.marker){let r=function e(t,n){return"M"===t[n].marker?t[n]:e(t,n-1)}(n,t);e.values.x=r.values.x,e.values.y=r.values.y}return e}function r7(e,t,n){if(0!==t&&"L"===e.marker){let r=n[t-1];["x","y"].every(t=>0===Math.round(Math.abs(r.values[t]-e.values[t])))&&(e.overlap=!0)}return e}function ie(e,t){return Math.atan2(t.x-e.x,t.y-e.y)}function it(e,t){return Math.sqrt(Math.pow(e.x-t.x,2)+Math.pow(e.y-t.y,2))}function ir(e,t){let n=t/Math.tan(e);return n===1/0||n===-1/0||isNaN(n)?t:n}var y=f("8NFma"),ii={};o(ii,"parse",()=>P_,e=>P_=e),o(ii,"stringify",()=>PE,e=>PE=e);var io=io||{};io.stringify=(k3={"visit_linear-gradient":function(e){return k3.visit_gradient(e)},"visit_repeating-linear-gradient":function(e){return k3.visit_gradient(e)},"visit_radial-gradient":function(e){return k3.visit_gradient(e)},"visit_repeating-radial-gradient":function(e){return k3.visit_gradient(e)},visit_gradient:function(e){var t=k3.visit(e.orientation);return t&&(t+=", "),e.type+"("+t+k3.visit(e.colorStops)+")"},visit_shape:function(e){var t=e.value,n=k3.visit(e.at),r=k3.visit(e.style);return r&&(t+=" "+r),n&&(t+=" at "+n),t},"visit_default-radial":function(e){var t="",n=k3.visit(e.at);return n&&(t+=n),t},"visit_extent-keyword":function(e){var t=e.value,n=k3.visit(e.at);return n&&(t+=" at "+n),t},"visit_position-keyword":function(e){return e.value},visit_position:function(e){return k3.visit(e.value.x)+" "+k3.visit(e.value.y)},"visit_%":function(e){return e.value+"%"},visit_em:function(e){return e.value+"em"},visit_px:function(e){return e.value+"px"},visit_literal:function(e){return k3.visit_color(e.value,e)},visit_hex:function(e){return k3.visit_color("#"+e.value,e)},visit_rgb:function(e){return k3.visit_color("rgb("+e.value.join(", ")+")",e)},visit_rgba:function(e){return k3.visit_color("rgba("+e.value.join(", ")+")",e)},visit_color:function(e,t){var n=e,r=k3.visit(t.length);return r&&(n+=" "+r),n},visit_angular:function(e){return e.value+"deg"},visit_directional:function(e){return"to "+e.value},visit_array:function(e){var t="",n=e.length;return e.forEach(function(e,r){t+=k3.visit(e),r<n-1&&(t+=", ")}),t},visit:function(e){if(!e)return"";if(e instanceof Array)return k3.visit_array(e,"");if(e.type){var t=k3["visit_"+e.type];if(t)return t(e);throw Error("Missing visitor visit_"+e.type)}throw Error("Invalid node.")}},function(e){return k3.visit(e)});var io=io||{};io.parse=function(){var e={linearGradient:/^(\-(webkit|o|ms|moz)\-)?(linear\-gradient)/i,repeatingLinearGradient:/^(\-(webkit|o|ms|moz)\-)?(repeating\-linear\-gradient)/i,radialGradient:/^(\-(webkit|o|ms|moz)\-)?(radial\-gradient)/i,repeatingRadialGradient:/^(\-(webkit|o|ms|moz)\-)?(repeating\-radial\-gradient)/i,sideOrCorner:/^to (left (top|bottom)|right (top|bottom)|left|right|top|bottom)/i,extentKeywords:/^(closest\-side|closest\-corner|farthest\-side|farthest\-corner|contain|cover)/,positionKeywords:/^(left|center|right|top|bottom)/i,pixelValue:/^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))px/,percentageValue:/^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))\%/,emValue:/^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))em/,angleValue:/^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))deg/,startCall:/^\(/,endCall:/^\)/,comma:/^,/,hexColor:/^\#([0-9a-fA-F]+)/,literalColor:/^([a-zA-Z]+)/,rgbColor:/^rgb/i,rgbaColor:/^rgba/i,number:/^(([0-9]*\.[0-9]+)|([0-9]+\.?))/},t="";function n(e){var n=Error(t+": "+e);throw n.source=t,n}function r(){return i("linear-gradient",e.linearGradient,a)||i("repeating-linear-gradient",e.repeatingLinearGradient,a)||i("radial-gradient",e.radialGradient,l)||i("repeating-radial-gradient",e.repeatingRadialGradient,l)}function i(t,r,i){return o(r,function(r){var o=i();return o&&!y(e.comma)&&n("Missing comma before color stops"),{type:t,orientation:o,colorStops:h(f)}})}function o(t,r){var i=y(t);if(i){y(e.startCall)||n("Missing (");var o=r(i);return y(e.endCall)||n("Missing )"),o}}function a(){return v("directional",e.sideOrCorner,1)||v("angular",e.angleValue,1)}function l(){var n,r,i=s();return i&&((n=[]).push(i),r=t,y(e.comma)&&((i=s())?n.push(i):t=r)),n}function s(){var e,t,n=((e=v("shape",/^(circle)/i,0))&&(e.style=m()||u()),e||((t=v("shape",/^(ellipse)/i,0))&&(t.style=g()||u()),t));if(n)n.at=c();else{var r=u();if(r){n=r;var i=c();i&&(n.at=i)}else{var o=d();o&&(n={type:"default-radial",at:o})}}return n}function u(){return v("extent-keyword",e.extentKeywords,1)}function c(){if(v("position",/^at/,0)){var e=d();return e||n("Missing positioning value"),e}}function d(){var e={x:g(),y:g()};if(e.x||e.y)return{type:"position",value:e}}function h(t){var r=t(),i=[];if(r)for(i.push(r);y(e.comma);)(r=t())?i.push(r):n("One extra comma");return i}function f(){var t=v("hex",e.hexColor,1)||o(e.rgbaColor,function(){return{type:"rgba",value:h(p)}})||o(e.rgbColor,function(){return{type:"rgb",value:h(p)}})||v("literal",e.literalColor,0);return t||n("Expected color definition"),t.length=g(),t}function p(){return y(e.number)[1]}function g(){return v("%",e.percentageValue,1)||v("position-keyword",e.positionKeywords,1)||m()}function m(){return v("px",e.pixelValue,1)||v("em",e.emValue,1)}function v(e,t,n){var r=y(t);if(r)return{type:e,value:r[n]}}function y(e){var n,r;return(r=/^[\n\r\t\s]+/.exec(t))&&b(r[0].length),(n=e.exec(t))&&b(n[0].length),n}function b(e){t=t.substr(e)}return function(e){var i;return t=e.toString(),i=h(r),t.length>0&&n("Invalid input not EOF"),i}}(),P_=io.parse,PE=io.stringify;let ia=e=>e.indexOf("linear-gradient")>=0,il=e=>"hex"===e.type?"#"+e.value:"literal"===e.type?e.value:`${e.type}(${e.value.join(",")})`,is=e=>{if(!ia(e))return{rotation:0,stops:[{offset:0,color:e},{offset:1,color:e}]};let t=s(ii).parse(e)[0];return{rotation:parseFloat(t.orientation.value),stops:t.colorStops.map((e,n)=>({color:il(e),offset:e.length?parseFloat(e.length.value)/100:n/(t.colorStops.length-1)}))}},iu=(e,t=e.fill,n="fill")=>s(y).useMemo(()=>{if(!ia(t))return{[n]:t};let{stops:r,rotation:i}=is(t),o={x:e.a.width/2,y:e.a.height/2},a=Math.sqrt(Math.pow(o.x,2)+Math.pow(o.y,2)),l=s(N).Util.degToRad(i)-Math.PI/2,u=[];return(r.forEach(({offset:e,color:t})=>{u.push(e,t)}),"fill"===n)?{fillLinearGradientStartPointX:o.x-a*Math.cos(l),fillLinearGradientStartPointY:o.y-a*Math.sin(l),fillLinearGradientColorStops:u,fillLinearGradientEndPointX:o.x+a*Math.cos(l),fillLinearGradientEndPointY:o.y+a*Math.sin(l),fill:r[1].color,fillPriority:"linear-gradient"}:{strokeLinearGradientStartPointX:o.x-a*Math.cos(l),strokeLinearGradientStartPointY:o.y-a*Math.sin(l),strokeLinearGradientColorStops:u,strokeLinearGradientEndPointX:o.x+a*Math.cos(l),strokeLinearGradientEndPointY:o.y+a*Math.sin(l)}},[t,e.width,e.height]);var y=f("8NFma");let ic=()=>!1;function id(e,t){let n=s(y).useRef();s(y).useLayoutEffect(()=>{n.current&&n.current.destroy()},[t]),s(y).useLayoutEffect(()=>{},[])}let ih=0,ip=[],ig=()=>3e4;function im(e){ih+=1;let t=!1,n=setTimeout(()=>{t||(ib(`Timeout loading image ${e}`),console.error("Timeout triggered for loader. Some assets may not have loaded.",e),t=!0,iv())},3e4);return()=>{t||(clearTimeout(n),iv())}}function iv(){0==(ih-=1)&&(ip.forEach(e=>e()),ip=[])}let iy=[];function ib(e){iy.forEach(t=>t(e))}var b=f("2SBKn");let iw=b.observable(["Roboto","Amatic SC","Press Start 2P","Marck Script","Rubik Mono One"]),ix=b.observable({value:!1});function i_(){return ix.value}let iE=b.observable([]);var iS=document.createElement("canvas");function iC(e,t="Arial"){var n=iS.getContext("2d");return n.font=`normal 40px '${e}', ${t}`,n.measureText("Some test text;?#D-ПРИВЕТ!1230o9u8i7y6t5r4e3w2q1").width}let iO={Arial:!0},ik=e=>!!iO[e];async function iP(e){if(iO[e])return;let t=!!document.fonts?.load,n=iC("Arial");if(t)try{await document.fonts.load(`16px '${e}'`);let t=iC(e);if(n!==t){iO[e]=!0;return}}catch{}let r=iC("Times","Times"),i=iC(e),o=Math.min(6e3,ig())/60;for(let t=0;t<o;t++){let t=iC(e,"Arial"),o=iC(e,"Times");if(t!==i||t!==n||o!==r){iO[e]=!0;return}await new Promise(e=>setTimeout(e,60))}console.warn(`Timeout for loading font "${e}". Looks like polotno can't load it. Is it a correct font family?`),ib(`Timeout for loading font "${e}"`)}let iT={},iA={};var b=f("2SBKn");let iN=b.observable({imageDownScalingEnabled:!0,removeBackgroundEnabled:!0,htmlRenderEnabled:!1,forceTextFitEnabled:!1,textVerticalResizeEnabled:!1,textOverflow:"resize",animationsEnabled:!1});b.action(e=>{iN.textVerticalResizeEnabled=e});let ij=b.action(e=>{iN.removeBackgroundEnabled=e});b.action(e=>{iN.htmlRenderEnabled=e});let iR=b.action(e=>{iN.imageDownScalingEnabled=e});function iL(e=""){return(e=e.replace(/<\/p>/gi,"\n")).replace(/(<([^>]+)>)/gi,"")}function iI(e,t){let n={filters:[]};t.brightnessEnabled&&(n.filters.push(s(N).Filters.Brighten),n.brightness=t.brightness),t.blurEnabled&&(n.filters.push(s(N).Filters.Blur),n.blurRadius=t.blurRadius),t.sepiaEnabled&&n.filters.push(s(N).Filters.Sepia),t.grayscaleEnabled&&n.filters.push(s(N).Filters.Grayscale),e.setAttrs(n),n.filters.length?e.cache({pixelRatio:t.store._elementsPixelRatio}):e.clearCache(),e.getLayer()?.batchDraw()}b.action(e=>{console.warn("useDownScaling is deprecated. Use setDownScalingEnabled instead."),iR(e)}),b.action(e=>{console.warn("setForceTextFit is deprecated. Use setTextOverflow instead."),iN.textOverflow="change-font-size"}),b.action(e=>{iN.textOverflow=e}),b.action(e=>{iN.animationsEnabled=e}),f("8NFma");let iM={stroke:"rgb(0, 161, 255)",strokeWidth:2},iD=T(({element:e})=>(0,g.jsx)(rY,{name:"highlighter",x:e.a.x,y:e.a.y,rotation:e.a.rotation,width:e.a.width,height:e.a.height,listening:!1,strokeScaleEnabled:!1,...iM}));var y=f("8NFma");let iF=()=>window.innerWidth<=500,iz=e=>`
|
|
30
30
|
@media (max-width: 500px) {
|
|
31
31
|
${e}
|
|
32
32
|
}
|
|
@@ -261,7 +261,7 @@ For simpler debugging here is the log of the parent element:`,lY=(e,t,n,r,i,o)=>
|
|
|
261
261
|
text-align: center;
|
|
262
262
|
color: white;
|
|
263
263
|
margin-bottom: 10px;
|
|
264
|
-
`,Ow=e=>new Promise((t,n)=>{let r=new FileReader;r.readAsDataURL(e),r.onload=()=>t(r.result),r.onerror=e=>n(e)}),Ox=T(({onSelect:e,onRemove:t,font:n})=>(0,g.jsxs)(Ob,{style:{fontFamily:n.fontFamily},className:"polotno-font-item",onClick:e,children:[n.fontFamily," text",(0,g.jsx)(pa,{style:{position:"absolute",right:0,bottom:0},minimal:!0,icon:"trash",onClick:e=>{e.stopPropagation(),t()}})]})),O_=({onSelect:e,...t})=>(0,g.jsx)(pa,{...t,draggable:!0,className:"polotno-close-panel",onClick:()=>e(),onDragStart:()=>{aG(({x:t,y:n})=>{e({x:t,y:n})})},onDragEnd:e=>{aG(null)}}),OE=T(({store:e})=>{s(y).useEffect(()=>{e.loadFont("Roboto")},[]);let t=t=>{let n=t.width||e.width/2,r=(t?.x||e.width/2)-n/2,i=(t?.y||e.height/2)-t.fontSize/2,o=e.width+e.height,a=e.activePage?.addElement({type:"text",fontFamily:"Roboto",...t,x:r,y:i,width:n,fontSize:t.fontSize*(o/2160)});iF()||a?.toggleEditMode(!0)},n=async t=>{let{target:n}=t;for(let t of n.files){let n=await Ow(t),r=t.name.split(".")[0].replace(/,/g,"");e.addFont({fontFamily:r,url:n})}n.value=null};s(y).useEffect(()=>{e.fonts.forEach(t=>e.loadFont(t.fontFamily))},[e.fonts]);let{data:r,error:i}=yl(ag(),yp),[o,a]=s(y).useState("text");return(0,g.jsxs)("div",{style:{height:"100%",display:"flex",flexDirection:"column"},children:[(0,g.jsxs)(yC,{large:!0,onChange:e=>a(e),children:[(0,g.jsx)(ym,{id:"text",children:lW("sidePanel.text")}),(0,g.jsx)(ym,{id:"font",children:lW("sidePanel.myFonts")})]}),"text"===o&&(0,g.jsxs)(Oy,{children:[(0,g.jsx)(O_,{style:{marginBottom:"5px",width:"100%",fontSize:"25px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t({...e,fontSize:76,text:lW("sidePanel.headerText"),fontFamily:"Roboto"})},children:lW("sidePanel.createHeader")}),(0,g.jsx)(O_,{style:{marginBottom:"5px",width:"100%",fontSize:"18px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t({...e,fontSize:44,text:lW("sidePanel.subHeaderText"),fontFamily:"Roboto"})},children:lW("sidePanel.createSubHeader")}),(0,g.jsx)(O_,{style:{marginBottom:"5px",width:"100%",fontSize:"14px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t({...e,fontSize:30,text:lW("sidePanel.bodyText"),fontFamily:"Roboto"})},children:lW("sidePanel.createBody")}),(0,g.jsx)(Ov,{shadowEnabled:!1,images:r?.items,getPreview:e=>e.preview,getImageClassName:e=>e.json.indexOf("plain")>=0?"polotno-text-preview-plain":"",isLoading:!r,error:i,onSelect:async(t,n)=>{let r=await fetch(t.json),i=await r.json();if(!e.activePage)return;let o=(e.width+e.height)/2160,a=n?n.x-i.width/2*o:e.width/2-i.width/2*o,l=n?n.y-i.height/2*o:e.height/2-i.height/2*o;e.history.transaction(()=>{let t=i.pages[0].children,n=[];t.forEach(t=>{delete t.id;let{id:r}=e.activePage?.addElement({...t,fontSize:t.fontSize*o,x:t.x*o+a,y:t.y*o+l,width:t.width*o,height:t.height*o});n.push(r)}),e.selectElements(n)})}})]}),"font"===o&&(0,g.jsxs)("div",{style:{display:"flex",flexDirection:"column",height:"calc(100% - 50px)"},children:[(0,g.jsxs)("label",{htmlFor:"polotno-font-upload",children:[(0,g.jsx)(pa,{icon:"upload",style:{width:"100%"},onClick:()=>{document.querySelector("#polotno-font-upload")?.click()},children:lW("sidePanel.uploadFont")}),(0,g.jsx)("input",{type:"file",accept:".ttf, .otf, .woff, .woff2, .eot",id:"polotno-font-upload",style:{display:"none"},onChange:n})]}),(0,g.jsx)("div",{style:{paddingTop:"20px",overflow:"auto",height:"100%"},children:e.fonts.map((n,r)=>(0,g.jsx)(Ox,{font:n,onSelect:()=>{t({fontSize:80,text:"Cool text",fontFamily:n.fontFamily})},onRemove:()=>{e.removeFont(n.fontFamily)}},r))})]})]})});var y=f("8NFma"),OS={};OS=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-32 736H663.9V602.2h104l15.6-120.7H663.9v-77.1c0-35 9.7-58.8 59.8-58.8h63.9v-108c-11.1-1.5-49-4.8-93.2-4.8-92.2 0-155.3 56.3-155.3 159.6v89H434.9v120.7h104.3V848H176V176h672v672z"}}],content:"\n"})(e)};var OC={};OC=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M512 306.9c-113.5 0-205.1 91.6-205.1 205.1S398.5 717.1 512 717.1 717.1 625.5 717.1 512 625.5 306.9 512 306.9zm0 338.4c-73.4 0-133.3-59.9-133.3-133.3S438.6 378.7 512 378.7 645.3 438.6 645.3 512 585.4 645.3 512 645.3zm213.5-394.6c-26.5 0-47.9 21.4-47.9 47.9s21.4 47.9 47.9 47.9 47.9-21.3 47.9-47.9a47.84 47.84 0 0 0-47.9-47.9zM911.8 512c0-55.2.5-109.9-2.6-165-3.1-64-17.7-120.8-64.5-167.6-46.9-46.9-103.6-61.4-167.6-64.5-55.2-3.1-109.9-2.6-165-2.6-55.2 0-109.9-.5-165 2.6-64 3.1-120.8 17.7-167.6 64.5C132.6 226.3 118.1 283 115 347c-3.1 55.2-2.6 109.9-2.6 165s-.5 109.9 2.6 165c3.1 64 17.7 120.8 64.5 167.6 46.9 46.9 103.6 61.4 167.6 64.5 55.2 3.1 109.9 2.6 165 2.6 55.2 0 109.9.5 165-2.6 64-3.1 120.8-17.7 167.6-64.5 46.9-46.9 61.4-103.6 64.5-167.6 3.2-55.1 2.6-109.8 2.6-165zm-88 235.8c-7.3 18.2-16.1 31.8-30.2 45.8-14.1 14.1-27.6 22.9-45.8 30.2C695.2 844.7 570.3 840 512 840c-58.3 0-183.3 4.7-235.9-16.1-18.2-7.3-31.8-16.1-45.8-30.2-14.1-14.1-22.9-27.6-30.2-45.8C179.3 695.2 184 570.3 184 512c0-58.3-4.7-183.3 16.1-235.9 7.3-18.2 16.1-31.8 30.2-45.8s27.6-22.9 45.8-30.2C328.7 179.3 453.7 184 512 184s183.3-4.7 235.9 16.1c18.2 7.3 31.8 16.1 45.8 30.2 14.1 14.1 22.9 27.6 30.2 45.8C844.7 328.7 840 453.7 840 512c0 58.3 4.7 183.2-16.2 235.8z"}}],content:"\n"})(e)};var OO={};OO=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M960 509.2c0-2.2 0-4.7-.1-7.6-.1-8.1-.3-17.2-.5-26.9-.8-27.9-2.2-55.7-4.4-81.9-3-36.1-7.4-66.2-13.4-88.8a139.52 139.52 0 0 0-98.3-98.5c-28.3-7.6-83.7-12.3-161.7-15.2-37.1-1.4-76.8-2.3-116.5-2.8-13.9-.2-26.8-.3-38.4-.4h-29.4c-11.6.1-24.5.2-38.4.4-39.7.5-79.4 1.4-116.5 2.8-78 3-133.5 7.7-161.7 15.2A139.35 139.35 0 0 0 82.4 304C76.3 326.6 72 356.7 69 392.8c-2.2 26.2-3.6 54-4.4 81.9-.3 9.7-.4 18.8-.5 26.9 0 2.9-.1 5.4-.1 7.6v5.6c0 2.2 0 4.7.1 7.6.1 8.1.3 17.2.5 26.9.8 27.9 2.2 55.7 4.4 81.9 3 36.1 7.4 66.2 13.4 88.8 12.8 47.9 50.4 85.7 98.3 98.5 28.2 7.6 83.7 12.3 161.7 15.2 37.1 1.4 76.8 2.3 116.5 2.8 13.9.2 26.8.3 38.4.4h29.4c11.6-.1 24.5-.2 38.4-.4 39.7-.5 79.4-1.4 116.5-2.8 78-3 133.5-7.7 161.7-15.2 47.9-12.8 85.5-50.5 98.3-98.5 6.1-22.6 10.4-52.7 13.4-88.8 2.2-26.2 3.6-54 4.4-81.9.3-9.7.4-18.8.5-26.9 0-2.9.1-5.4.1-7.6v-5.6zm-72 5.2c0 2.1 0 4.4-.1 7.1-.1 7.8-.3 16.4-.5 25.7-.7 26.6-2.1 53.2-4.2 77.9-2.7 32.2-6.5 58.6-11.2 76.3-6.2 23.1-24.4 41.4-47.4 47.5-21 5.6-73.9 10.1-145.8 12.8-36.4 1.4-75.6 2.3-114.7 2.8-13.7.2-26.4.3-37.8.3h-28.6l-37.8-.3c-39.1-.5-78.2-1.4-114.7-2.8-71.9-2.8-124.9-7.2-145.8-12.8-23-6.2-41.2-24.4-47.4-47.5-4.7-17.7-8.5-44.1-11.2-76.3-2.1-24.7-3.4-51.3-4.2-77.9-.3-9.3-.4-18-.5-25.7 0-2.7-.1-5.1-.1-7.1v-4.8c0-2.1 0-4.4.1-7.1.1-7.8.3-16.4.5-25.7.7-26.6 2.1-53.2 4.2-77.9 2.7-32.2 6.5-58.6 11.2-76.3 6.2-23.1 24.4-41.4 47.4-47.5 21-5.6 73.9-10.1 145.8-12.8 36.4-1.4 75.6-2.3 114.7-2.8 13.7-.2 26.4-.3 37.8-.3h28.6l37.8.3c39.1.5 78.2 1.4 114.7 2.8 71.9 2.8 124.9 7.2 145.8 12.8 23 6.2 41.2 24.4 47.4 47.5 4.7 17.7 8.5 44.1 11.2 76.3 2.1 24.7 3.4 51.3 4.2 77.9.3 9.3.4 18 .5 25.7 0 2.7.1 5.1.1 7.1v4.8zM423 646l232-135-232-133z"}}],content:"\n"})(e)};var Ok={};Ok=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M912 302.3L784 376V224c0-35.3-28.7-64-64-64H128c-35.3 0-64 28.7-64 64v576c0 35.3 28.7 64 64 64h592c35.3 0 64-28.7 64-64V648l128 73.7c21.3 12.3 48-3.1 48-27.6V330c0-24.6-26.7-40-48-27.7zM712 792H136V232h576v560zm176-167l-104-59.8V458.9L888 399v226zM208 360h112c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H208c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z"}}],content:"\n"})(e)};var OP={};OP=function(e){return _R({tag:"svg",attr:{viewBox:"0 0 20 20",fill:"currentColor"},child:[{tag:"path",attr:{d:"M4 18h12V6h-4V2H4v16zm-2 1V0h12l4 4v16H2v-1z"}}]})(e)};var OT={};OT=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M928 160H96c-17.7 0-32 14.3-32 32v640c0 17.7 14.3 32 32 32h832c17.7 0 32-14.3 32-32V192c0-17.7-14.3-32-32-32zm-40 632H136V232h752v560zM610.3 476h123.4c1.3 0 2.3-3.6 2.3-8v-48c0-4.4-1-8-2.3-8H610.3c-1.3 0-2.3 3.6-2.3 8v48c0 4.4 1 8 2.3 8zm4.8 144h185.7c3.9 0 7.1-3.6 7.1-8v-48c0-4.4-3.2-8-7.1-8H615.1c-3.9 0-7.1 3.6-7.1 8v48c0 4.4 3.2 8 7.1 8zM224 673h43.9c4.2 0 7.6-3.3 7.9-7.5 3.8-50.5 46-90.5 97.2-90.5s93.4 40 97.2 90.5c.3 4.2 3.7 7.5 7.9 7.5H522a8 8 0 0 0 8-8.4c-2.8-53.3-32-99.7-74.6-126.1a111.8 111.8 0 0 0 29.1-75.5c0-61.9-49.9-112-111.4-112s-111.4 50.1-111.4 112c0 29.1 11 55.5 29.1 75.5a158.09 158.09 0 0 0-74.6 126.1c-.4 4.6 3.2 8.4 7.8 8.4zm149-262c28.5 0 51.7 23.3 51.7 52s-23.2 52-51.7 52-51.7-23.3-51.7-52 23.2-52 51.7-52z"}}],content:"\n"})(e)};let OA=[["Instagram Post",1080,1080,"px",(0,g.jsx)(s(OC),{})],["Instagram Story",1080,1920,"px",(0,g.jsx)(s(OC),{})],["Instagram Ad",1080,1080,"px",(0,g.jsx)(s(OC),{})],["Facebook Post",940,788,"px",(0,g.jsx)(s(OS),{})],["Facebook Cover",851,315,"px",(0,g.jsx)(s(OS),{})],["Facebook Ad",1200,628,"px",(0,g.jsx)(s(OS),{})],["Youtube Thumbnail",1280,720,"px",(0,g.jsx)(s(OO),{})],["Youtube Channel",2560,1440,"px",(0,g.jsx)(s(OO),{})],["Full HD",1920,1080,"px",(0,g.jsx)(s(Ok),{})],["Invitation",14,14,"cm",(0,g.jsx)(s(OP),{})],["A4",21,29.7,"cm",(0,g.jsx)(s(OP),{})],["Business card",3.5,2,"in",(0,g.jsx)(s(OT),{})]],ON=({value:e,onChange:t,...n})=>{let[r,i]=s(y).useState(e),o=s(y).useRef(e);o.current=r;let a=()=>{t(Math.max(10,o.current))};return s(y).useEffect(()=>{i(e)},[e]),(0,g.jsx)(m5,{...n,value:r,onValueChange:e=>{Number.isNaN(e)||i(e)},onBlur:a,onKeyDown:e=>{"Enter"===e.key&&a()}})},Oj=T(({store:e})=>{let[t,n]=s(y).useState(!0),[r,i]=s(y).useState(e.width),[o,a]=s(y).useState(e.height),l=e.activePage?.computedWidth||e.width;s(y).useEffect(()=>{i(aT({px:l,unit:e.unit,dpi:e.dpi}))},[l,e.unit,e.dpi]);let u=e.activePage?.computedHeight||e.height;return s(y).useEffect(()=>{a(aT({px:u,unit:e.unit,dpi:e.dpi}))},[u,e.unit,e.dpi]),(0,g.jsxs)("div",{style:{height:"100%",overflow:"auto",paddingRight:"3px"},children:[(0,g.jsxs)("div",{style:{paddingBottom:"15px"},children:[(0,g.jsxs)(SC,{checked:t,onChange:e=>{n(e.target.checked)},alignIndicator:l3.RIGHT,style:{marginTop:"8px",marginBottom:"25px"},children:[lW("sidePanel.useMagicResize")," ",(0,g.jsx)(mg,{content:lW("sidePanel.magicResizeDescription"),position:l6.BOTTOM,children:(0,g.jsx)(pe,{icon:"help"})})]}),(0,g.jsxs)("div",{style:{width:"50%",display:"inline-block"},children:[lW("sidePanel.width")," (",e.unit,")"]}),(0,g.jsx)("div",{style:{width:"50%",display:"inline-block"},children:(0,g.jsx)(ON,{fill:!0,value:r,onChange:e=>{e||(e=10),i(e)},min:10,max:1e4,selectAllOnFocus:!0,minorStepSize:.01})})]}),(0,g.jsxs)("div",{style:{paddingBottom:"15px"},children:[(0,g.jsxs)("div",{style:{width:"50%",display:"inline-block"},children:[lW("sidePanel.height")," (",e.unit,")"]}),(0,g.jsx)("div",{style:{width:"50%",display:"inline-block"},children:(0,g.jsx)(ON,{fill:!0,value:o,onChange:e=>{e||(e=10),a(e)},min:10,max:1e4,selectAllOnFocus:!0,minorStepSize:.01})})]}),(0,g.jsx)("div",{style:{paddingBottom:"15px"},children:(0,g.jsx)(pa,{fill:!0,intent:"primary",onClick:()=>{let n=aA({unitVal:r,dpi:e.dpi,unit:e.unit}),i=aA({unitVal:o,dpi:e.dpi,unit:e.unit});e.setSize(n,i,t),e.activePage?.width!=="auto"&&e.activePage?.set({width:n}),e.activePage?.height!=="auto"&&e.activePage?.set({height:i})},children:lW("sidePanel.resize")})}),OA.map(([n,r,i,o,a])=>(0,g.jsxs)(pa,{style:{width:"100%",paddingTop:"10px",paddingBottom:"10px",fontSize:"16px"},minimal:!0,onClick:()=>{let n=aA({unitVal:r,dpi:e.dpi,unit:o}),a=aA({unitVal:i,dpi:e.dpi,unit:o});e.setUnit({unit:o,dpi:e.dpi}),e.setSize(n,a,t),e.activePage?.width!=="auto"&&e.activePage?.set({width:n}),e.activePage?.height!=="auto"&&e.activePage?.set({height:a})},icon:a,alignText:"left",children:[n,(0,g.jsxs)("span",{style:{fontSize:"0.7rem",paddingLeft:"20px",float:"right",lineHeight:"1.1rem"},children:[r," x ",i," ",o]})]},n))]})});var y=f("8NFma");async function OR(e){return new Promise((t,n)=>{let r=new FileReader;r.readAsDataURL(e),r.onload=()=>t(r.result),r.onerror=e=>n(e)})}let OL=async e=>OR(e),OI=[],OM=({store:e})=>{let[t,n]=s(y).useState(OI),[r,i]=s(y).useState(!1),o=s(y).useRef(null),a=async e=>{let{target:t}=e;for(let e of(i(!0),t.files)){let t=await OL(e),r=function(e){let{type:t}=e;return t.indexOf("svg")>=0?"svg":t.indexOf("image")>=0?"image":t.indexOf("video")>=0?"video":"image"}(e),i=t;"video"===r&&(i=await Cq(t)),n(e=>e.concat([{url:t,type:r,preview:i}]))}i(!1),t.value=""};return s(y).useEffect(()=>{OI=t},[t]),(0,g.jsxs)("div",{style:{height:"100%",display:"flex",flexDirection:"column"},children:[(0,g.jsx)("div",{style:{height:"45px",paddingTop:"5px"},children:lW("sidePanel.uploadTip")}),(0,g.jsx)("div",{style:{marginBottom:"20px"},children:(0,g.jsxs)("label",{htmlFor:"input-file",children:[(0,g.jsx)(pa,{icon:"upload",style:{width:"100%"},onClick:()=>{o.current?.click()},children:lW("sidePanel.uploadImage")}),(0,g.jsx)("input",{type:"file",ref:o,style:{display:"none"},onChange:a,multiple:!0})]})}),(0,g.jsx)(Ov,{images:t,isLoading:r,getPreview:e=>e.preview,onSelect:async(t,n,r)=>{let i=t.url,o=t.type,{width:a,height:l}=await ("video"===o?CH:a2)(i);if(r&&"svg"===r.type&&r.contentEditable&&"image"===o){r.set({maskSrc:i});return}if(r&&"image"===r.type&&r.contentEditable&&"image"==o){let e=a6(r,{width:a,height:l});r.set({src:i,...e});return}let s=Math.min(e.width/a,e.height/l,1);a*=s,l*=s;let u=(n?.x||e.width/2)-a/2,c=(n?.y||e.height/2)-l/2;e.activePage?.addElement({type:o,src:i,x:u,y:c,width:a,height:l})}})]})};f("8NFma");let OD=({store:e})=>{let{setQuery:t,loadMore:n,isReachingEnd:r,data:i,isLoading:o,error:a}=yg({defaultQuery:"",getAPI:({page:e,query:t})=>am({page:e,query:t})});return(0,g.jsxs)("div",{style:{height:"100%",display:"flex",flexDirection:"column"},children:[(0,g.jsx)(mK,{leftIcon:"search",placeholder:lW("sidePanel.searchPlaceholder"),onChange:e=>{t(e.target.value)},type:"search",style:{marginBottom:"20px"}}),(0,g.jsxs)("p",{style:{textAlign:"center"},children:["Photos by"," ",(0,g.jsx)("a",{href:"https://unsplash.com/",target:"_blank",children:"Unsplash"})]}),(0,g.jsx)(Ov,{images:i?.map(e=>e.results).flat().filter(Boolean),getPreview:e=>e.urls.small,onSelect:async(t,n,r)=>{if(fetch(av(t.id)),r&&"svg"===r.type&&r.contentEditable){r.set({maskSrc:t.urls.regular});return}let{width:i,height:o}=await a2(t.urls.small);if(r&&"image"===r.type&&r.contentEditable){let e=a6(r,{width:i,height:o});r.set({src:t.urls.regular,...e});return}let a=(n?.x||e.width/2)-i/2,l=(n?.y||e.height/2)-o/2;e.activePage?.addElement({type:"image",src:t.urls.regular,width:i,height:o,x:a,y:l})},isLoading:o,error:a,loadMore:!r&&n,getCredit:e=>(0,g.jsxs)("span",{children:["Photo by"," ",(0,g.jsx)("a",{href:`https://unsplash.com/@${e.user.username}?utm_source=polotno&utm_medium=referral`,target:"_blank",children:e.user.name})," ","on"," ",(0,g.jsx)("a",{href:"https://unsplash.com/?utm_source=polotno&utm_medium=referral",target:"_blank",children:"Unsplash"})]})})]})};f("8NFma");var OF={};OF=function(e){return _R({tag:"svg",attr:{viewBox:"0 0 512 512",fill:"currentColor"},child:[{tag:"path",attr:{d:"M430.1 347.9c-6.6-6.1-16.3-7.6-24.6-9-11.5-1.9-15.9-4-22.6-10-14.3-12.7-14.3-31.1 0-43.8l30.3-26.9c46.4-41 46.4-108.2 0-149.2-34.2-30.1-80.1-45-127.8-45-55.7 0-113.9 20.3-158.8 60.1-83.5 73.8-83.5 194.7 0 268.5 41.5 36.7 97.5 55 152.9 55.4h1.7c55.4 0 110-17.9 148.8-52.4 14.4-12.7 12-36.6.1-47.7zM120 216c0-17.7 14.3-32 32-32s32 14.3 32 32-14.3 32-32 32-32-14.3-32-32zm40 126c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32zm64-161c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32zm72 219c-26.5 0-48-21.5-48-48s21.5-48 48-48 48 21.5 48 48-21.5 48-48 48zm24-208c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32z"}}]})(e)};let Oz=["white","rgb(82, 113, 255)","rgb(255, 145, 77)","rgb(126, 217, 87)","rgb(255, 222, 89)","rgb(203, 108, 230)","rgb(0, 0, 0, 0)"],OB=oA("div")`
|
|
264
|
+
`,Ow=e=>new Promise((t,n)=>{let r=new FileReader;r.readAsDataURL(e),r.onload=()=>t(r.result),r.onerror=e=>n(e)}),Ox=T(({onSelect:e,onRemove:t,font:n})=>(0,g.jsxs)(Ob,{style:{fontFamily:n.fontFamily},className:"polotno-font-item",onClick:e,children:[n.fontFamily," text",(0,g.jsx)(pa,{style:{position:"absolute",right:0,bottom:0},minimal:!0,icon:"trash",onClick:e=>{e.stopPropagation(),t()}})]})),O_=({onSelect:e,...t})=>(0,g.jsx)(pa,{...t,draggable:!0,className:"polotno-close-panel",onClick:()=>e(),onDragStart:()=>{aG(({x:t,y:n})=>{e({x:t,y:n})})},onDragEnd:e=>{aG(null)}}),OE=T(({store:e})=>{s(y).useEffect(()=>{e.loadFont("Roboto")},[]);let t=t=>{let n=t.width||e.width/2,r=(t?.x||e.width/2)-n/2,i=(t?.y||e.height/2)-t.fontSize/2,o=e.width+e.height,a=e.activePage?.addElement({type:"text",fontFamily:"Roboto",...t,x:r,y:i,width:n,fontSize:t.fontSize*(o/2160)});iF()||a?.toggleEditMode(!0)},n=async t=>{let{target:n}=t;for(let t of n.files){let n=await Ow(t),r=t.name.split(".")[0].replace(/,/g,"");e.addFont({fontFamily:r,url:n})}n.value=null};s(y).useEffect(()=>{e.fonts.forEach(t=>e.loadFont(t.fontFamily))},[e.fonts]);let{data:r,error:i}=yl(ag(),yp),[o,a]=s(y).useState("text");return(0,g.jsxs)("div",{style:{height:"100%",display:"flex",flexDirection:"column"},children:[(0,g.jsxs)(yC,{large:!0,onChange:e=>a(e),children:[(0,g.jsx)(ym,{id:"text",children:lW("sidePanel.text")}),(0,g.jsx)(ym,{id:"font",children:lW("sidePanel.myFonts")})]}),"text"===o&&(0,g.jsxs)(Oy,{children:[(0,g.jsx)(O_,{style:{marginBottom:"5px",width:"100%",fontSize:"25px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t({...e,fontSize:76,text:lW("sidePanel.headerText"),fontFamily:"Roboto"})},children:lW("sidePanel.createHeader")}),(0,g.jsx)(O_,{style:{marginBottom:"5px",width:"100%",fontSize:"18px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t({...e,fontSize:44,text:lW("sidePanel.subHeaderText"),fontFamily:"Roboto"})},children:lW("sidePanel.createSubHeader")}),(0,g.jsx)(O_,{style:{marginBottom:"5px",width:"100%",fontSize:"14px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t({...e,fontSize:30,text:lW("sidePanel.bodyText"),fontFamily:"Roboto"})},children:lW("sidePanel.createBody")}),(0,g.jsx)(Ov,{shadowEnabled:!1,images:r?.items,getPreview:e=>e.preview,getImageClassName:e=>e.json.indexOf("plain")>=0?"polotno-text-preview-plain":"",isLoading:!r,error:i,onSelect:async(t,n)=>{let r=await fetch(t.json),i=await r.json();if(!e.activePage)return;let o=(e.width+e.height)/2160,a=n?n.x-i.width/2*o:e.width/2-i.width/2*o,l=n?n.y-i.height/2*o:e.height/2-i.height/2*o;e.history.transaction(()=>{let t=i.pages[0].children,n=[];t.forEach(t=>{delete t.id;let{id:r}=e.activePage?.addElement({...t,fontSize:t.fontSize*o,x:t.x*o+a,y:t.y*o+l,width:t.width*o,height:t.height*o});n.push(r)}),e.selectElements(n)})}})]}),"font"===o&&(0,g.jsxs)("div",{style:{display:"flex",flexDirection:"column",height:"calc(100% - 50px)"},children:[(0,g.jsxs)("label",{htmlFor:"polotno-font-upload",children:[(0,g.jsx)(pa,{icon:"upload",style:{width:"100%"},onClick:()=>{document.querySelector("#polotno-font-upload")?.click()},children:lW("sidePanel.uploadFont")}),(0,g.jsx)("input",{type:"file",accept:".ttf, .otf, .woff, .woff2, .eot",id:"polotno-font-upload",style:{display:"none"},onChange:n})]}),(0,g.jsx)("div",{style:{paddingTop:"20px",overflow:"auto",height:"100%"},children:e.fonts.map((n,r)=>(0,g.jsx)(Ox,{font:n,onSelect:()=>{t({fontSize:80,text:"Cool text",fontFamily:n.fontFamily})},onRemove:()=>{e.find(e=>{"text"===e.type&&e.fontFamily===n.fontFamily&&e.set({fontFamily:"Roboto"})}),e.removeFont(n.fontFamily)}},r))})]})]})});var y=f("8NFma"),OS={};OS=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-32 736H663.9V602.2h104l15.6-120.7H663.9v-77.1c0-35 9.7-58.8 59.8-58.8h63.9v-108c-11.1-1.5-49-4.8-93.2-4.8-92.2 0-155.3 56.3-155.3 159.6v89H434.9v120.7h104.3V848H176V176h672v672z"}}],content:"\n"})(e)};var OC={};OC=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M512 306.9c-113.5 0-205.1 91.6-205.1 205.1S398.5 717.1 512 717.1 717.1 625.5 717.1 512 625.5 306.9 512 306.9zm0 338.4c-73.4 0-133.3-59.9-133.3-133.3S438.6 378.7 512 378.7 645.3 438.6 645.3 512 585.4 645.3 512 645.3zm213.5-394.6c-26.5 0-47.9 21.4-47.9 47.9s21.4 47.9 47.9 47.9 47.9-21.3 47.9-47.9a47.84 47.84 0 0 0-47.9-47.9zM911.8 512c0-55.2.5-109.9-2.6-165-3.1-64-17.7-120.8-64.5-167.6-46.9-46.9-103.6-61.4-167.6-64.5-55.2-3.1-109.9-2.6-165-2.6-55.2 0-109.9-.5-165 2.6-64 3.1-120.8 17.7-167.6 64.5C132.6 226.3 118.1 283 115 347c-3.1 55.2-2.6 109.9-2.6 165s-.5 109.9 2.6 165c3.1 64 17.7 120.8 64.5 167.6 46.9 46.9 103.6 61.4 167.6 64.5 55.2 3.1 109.9 2.6 165 2.6 55.2 0 109.9.5 165-2.6 64-3.1 120.8-17.7 167.6-64.5 46.9-46.9 61.4-103.6 64.5-167.6 3.2-55.1 2.6-109.8 2.6-165zm-88 235.8c-7.3 18.2-16.1 31.8-30.2 45.8-14.1 14.1-27.6 22.9-45.8 30.2C695.2 844.7 570.3 840 512 840c-58.3 0-183.3 4.7-235.9-16.1-18.2-7.3-31.8-16.1-45.8-30.2-14.1-14.1-22.9-27.6-30.2-45.8C179.3 695.2 184 570.3 184 512c0-58.3-4.7-183.3 16.1-235.9 7.3-18.2 16.1-31.8 30.2-45.8s27.6-22.9 45.8-30.2C328.7 179.3 453.7 184 512 184s183.3-4.7 235.9 16.1c18.2 7.3 31.8 16.1 45.8 30.2 14.1 14.1 22.9 27.6 30.2 45.8C844.7 328.7 840 453.7 840 512c0 58.3 4.7 183.2-16.2 235.8z"}}],content:"\n"})(e)};var OO={};OO=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M960 509.2c0-2.2 0-4.7-.1-7.6-.1-8.1-.3-17.2-.5-26.9-.8-27.9-2.2-55.7-4.4-81.9-3-36.1-7.4-66.2-13.4-88.8a139.52 139.52 0 0 0-98.3-98.5c-28.3-7.6-83.7-12.3-161.7-15.2-37.1-1.4-76.8-2.3-116.5-2.8-13.9-.2-26.8-.3-38.4-.4h-29.4c-11.6.1-24.5.2-38.4.4-39.7.5-79.4 1.4-116.5 2.8-78 3-133.5 7.7-161.7 15.2A139.35 139.35 0 0 0 82.4 304C76.3 326.6 72 356.7 69 392.8c-2.2 26.2-3.6 54-4.4 81.9-.3 9.7-.4 18.8-.5 26.9 0 2.9-.1 5.4-.1 7.6v5.6c0 2.2 0 4.7.1 7.6.1 8.1.3 17.2.5 26.9.8 27.9 2.2 55.7 4.4 81.9 3 36.1 7.4 66.2 13.4 88.8 12.8 47.9 50.4 85.7 98.3 98.5 28.2 7.6 83.7 12.3 161.7 15.2 37.1 1.4 76.8 2.3 116.5 2.8 13.9.2 26.8.3 38.4.4h29.4c11.6-.1 24.5-.2 38.4-.4 39.7-.5 79.4-1.4 116.5-2.8 78-3 133.5-7.7 161.7-15.2 47.9-12.8 85.5-50.5 98.3-98.5 6.1-22.6 10.4-52.7 13.4-88.8 2.2-26.2 3.6-54 4.4-81.9.3-9.7.4-18.8.5-26.9 0-2.9.1-5.4.1-7.6v-5.6zm-72 5.2c0 2.1 0 4.4-.1 7.1-.1 7.8-.3 16.4-.5 25.7-.7 26.6-2.1 53.2-4.2 77.9-2.7 32.2-6.5 58.6-11.2 76.3-6.2 23.1-24.4 41.4-47.4 47.5-21 5.6-73.9 10.1-145.8 12.8-36.4 1.4-75.6 2.3-114.7 2.8-13.7.2-26.4.3-37.8.3h-28.6l-37.8-.3c-39.1-.5-78.2-1.4-114.7-2.8-71.9-2.8-124.9-7.2-145.8-12.8-23-6.2-41.2-24.4-47.4-47.5-4.7-17.7-8.5-44.1-11.2-76.3-2.1-24.7-3.4-51.3-4.2-77.9-.3-9.3-.4-18-.5-25.7 0-2.7-.1-5.1-.1-7.1v-4.8c0-2.1 0-4.4.1-7.1.1-7.8.3-16.4.5-25.7.7-26.6 2.1-53.2 4.2-77.9 2.7-32.2 6.5-58.6 11.2-76.3 6.2-23.1 24.4-41.4 47.4-47.5 21-5.6 73.9-10.1 145.8-12.8 36.4-1.4 75.6-2.3 114.7-2.8 13.7-.2 26.4-.3 37.8-.3h28.6l37.8.3c39.1.5 78.2 1.4 114.7 2.8 71.9 2.8 124.9 7.2 145.8 12.8 23 6.2 41.2 24.4 47.4 47.5 4.7 17.7 8.5 44.1 11.2 76.3 2.1 24.7 3.4 51.3 4.2 77.9.3 9.3.4 18 .5 25.7 0 2.7.1 5.1.1 7.1v4.8zM423 646l232-135-232-133z"}}],content:"\n"})(e)};var Ok={};Ok=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M912 302.3L784 376V224c0-35.3-28.7-64-64-64H128c-35.3 0-64 28.7-64 64v576c0 35.3 28.7 64 64 64h592c35.3 0 64-28.7 64-64V648l128 73.7c21.3 12.3 48-3.1 48-27.6V330c0-24.6-26.7-40-48-27.7zM712 792H136V232h576v560zm176-167l-104-59.8V458.9L888 399v226zM208 360h112c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H208c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z"}}],content:"\n"})(e)};var OP={};OP=function(e){return _R({tag:"svg",attr:{viewBox:"0 0 20 20",fill:"currentColor"},child:[{tag:"path",attr:{d:"M4 18h12V6h-4V2H4v16zm-2 1V0h12l4 4v16H2v-1z"}}]})(e)};var OT={};OT=function(e){return _R({tag:"svg",attr:{className:"icon",viewBox:"0 0 1024 1024",fill:"currentColor"},child:[{tag:"path",attr:{d:"M928 160H96c-17.7 0-32 14.3-32 32v640c0 17.7 14.3 32 32 32h832c17.7 0 32-14.3 32-32V192c0-17.7-14.3-32-32-32zm-40 632H136V232h752v560zM610.3 476h123.4c1.3 0 2.3-3.6 2.3-8v-48c0-4.4-1-8-2.3-8H610.3c-1.3 0-2.3 3.6-2.3 8v48c0 4.4 1 8 2.3 8zm4.8 144h185.7c3.9 0 7.1-3.6 7.1-8v-48c0-4.4-3.2-8-7.1-8H615.1c-3.9 0-7.1 3.6-7.1 8v48c0 4.4 3.2 8 7.1 8zM224 673h43.9c4.2 0 7.6-3.3 7.9-7.5 3.8-50.5 46-90.5 97.2-90.5s93.4 40 97.2 90.5c.3 4.2 3.7 7.5 7.9 7.5H522a8 8 0 0 0 8-8.4c-2.8-53.3-32-99.7-74.6-126.1a111.8 111.8 0 0 0 29.1-75.5c0-61.9-49.9-112-111.4-112s-111.4 50.1-111.4 112c0 29.1 11 55.5 29.1 75.5a158.09 158.09 0 0 0-74.6 126.1c-.4 4.6 3.2 8.4 7.8 8.4zm149-262c28.5 0 51.7 23.3 51.7 52s-23.2 52-51.7 52-51.7-23.3-51.7-52 23.2-52 51.7-52z"}}],content:"\n"})(e)};let OA=[["Instagram Post",1080,1080,"px",(0,g.jsx)(s(OC),{})],["Instagram Story",1080,1920,"px",(0,g.jsx)(s(OC),{})],["Instagram Ad",1080,1080,"px",(0,g.jsx)(s(OC),{})],["Facebook Post",940,788,"px",(0,g.jsx)(s(OS),{})],["Facebook Cover",851,315,"px",(0,g.jsx)(s(OS),{})],["Facebook Ad",1200,628,"px",(0,g.jsx)(s(OS),{})],["Youtube Thumbnail",1280,720,"px",(0,g.jsx)(s(OO),{})],["Youtube Channel",2560,1440,"px",(0,g.jsx)(s(OO),{})],["Full HD",1920,1080,"px",(0,g.jsx)(s(Ok),{})],["Invitation",14,14,"cm",(0,g.jsx)(s(OP),{})],["A4",21,29.7,"cm",(0,g.jsx)(s(OP),{})],["Business card",3.5,2,"in",(0,g.jsx)(s(OT),{})]],ON=({value:e,onChange:t,...n})=>{let[r,i]=s(y).useState(e),o=s(y).useRef(e);o.current=r;let a=()=>{t(Math.max(10,o.current))};return s(y).useEffect(()=>{i(e)},[e]),(0,g.jsx)(m5,{...n,value:r,onValueChange:e=>{Number.isNaN(e)||i(e)},onBlur:a,onKeyDown:e=>{"Enter"===e.key&&a()}})},Oj=T(({store:e})=>{let[t,n]=s(y).useState(!0),[r,i]=s(y).useState(e.width),[o,a]=s(y).useState(e.height),l=e.activePage?.computedWidth||e.width;s(y).useEffect(()=>{i(aT({px:l,unit:e.unit,dpi:e.dpi}))},[l,e.unit,e.dpi]);let u=e.activePage?.computedHeight||e.height;return s(y).useEffect(()=>{a(aT({px:u,unit:e.unit,dpi:e.dpi}))},[u,e.unit,e.dpi]),(0,g.jsxs)("div",{style:{height:"100%",overflow:"auto",paddingRight:"3px"},children:[(0,g.jsxs)("div",{style:{paddingBottom:"15px"},children:[(0,g.jsxs)(SC,{checked:t,onChange:e=>{n(e.target.checked)},alignIndicator:l3.RIGHT,style:{marginTop:"8px",marginBottom:"25px"},children:[lW("sidePanel.useMagicResize")," ",(0,g.jsx)(mg,{content:lW("sidePanel.magicResizeDescription"),position:l6.BOTTOM,children:(0,g.jsx)(pe,{icon:"help"})})]}),(0,g.jsxs)("div",{style:{width:"50%",display:"inline-block"},children:[lW("sidePanel.width")," (",e.unit,")"]}),(0,g.jsx)("div",{style:{width:"50%",display:"inline-block"},children:(0,g.jsx)(ON,{fill:!0,value:r,onChange:e=>{e||(e=10),i(e)},min:10,max:1e4,selectAllOnFocus:!0,minorStepSize:.01})})]}),(0,g.jsxs)("div",{style:{paddingBottom:"15px"},children:[(0,g.jsxs)("div",{style:{width:"50%",display:"inline-block"},children:[lW("sidePanel.height")," (",e.unit,")"]}),(0,g.jsx)("div",{style:{width:"50%",display:"inline-block"},children:(0,g.jsx)(ON,{fill:!0,value:o,onChange:e=>{e||(e=10),a(e)},min:10,max:1e4,selectAllOnFocus:!0,minorStepSize:.01})})]}),(0,g.jsx)("div",{style:{paddingBottom:"15px"},children:(0,g.jsx)(pa,{fill:!0,intent:"primary",onClick:()=>{let n=aA({unitVal:r,dpi:e.dpi,unit:e.unit}),i=aA({unitVal:o,dpi:e.dpi,unit:e.unit});e.setSize(n,i,t),e.activePage?.width!=="auto"&&e.activePage?.set({width:n}),e.activePage?.height!=="auto"&&e.activePage?.set({height:i})},children:lW("sidePanel.resize")})}),OA.map(([n,r,i,o,a])=>(0,g.jsxs)(pa,{style:{width:"100%",paddingTop:"10px",paddingBottom:"10px",fontSize:"16px"},minimal:!0,onClick:()=>{let n=aA({unitVal:r,dpi:e.dpi,unit:o}),a=aA({unitVal:i,dpi:e.dpi,unit:o});e.setUnit({unit:o,dpi:e.dpi}),e.setSize(n,a,t),e.activePage?.width!=="auto"&&e.activePage?.set({width:n}),e.activePage?.height!=="auto"&&e.activePage?.set({height:a})},icon:a,alignText:"left",children:[n,(0,g.jsxs)("span",{style:{fontSize:"0.7rem",paddingLeft:"20px",float:"right",lineHeight:"1.1rem"},children:[r," x ",i," ",o]})]},n))]})});var y=f("8NFma");async function OR(e){return new Promise((t,n)=>{let r=new FileReader;r.readAsDataURL(e),r.onload=()=>t(r.result),r.onerror=e=>n(e)})}let OL=async e=>OR(e),OI=[],OM=({store:e})=>{let[t,n]=s(y).useState(OI),[r,i]=s(y).useState(!1),o=s(y).useRef(null),a=async e=>{let{target:t}=e;for(let e of(i(!0),t.files)){let t=await OL(e),r=function(e){let{type:t}=e;return t.indexOf("svg")>=0?"svg":t.indexOf("image")>=0?"image":t.indexOf("video")>=0?"video":"image"}(e),i=t;"video"===r&&(i=await Cq(t)),n(e=>e.concat([{url:t,type:r,preview:i}]))}i(!1),t.value=""};return s(y).useEffect(()=>{OI=t},[t]),(0,g.jsxs)("div",{style:{height:"100%",display:"flex",flexDirection:"column"},children:[(0,g.jsx)("div",{style:{height:"45px",paddingTop:"5px"},children:lW("sidePanel.uploadTip")}),(0,g.jsx)("div",{style:{marginBottom:"20px"},children:(0,g.jsxs)("label",{htmlFor:"input-file",children:[(0,g.jsx)(pa,{icon:"upload",style:{width:"100%"},onClick:()=>{o.current?.click()},children:lW("sidePanel.uploadImage")}),(0,g.jsx)("input",{type:"file",ref:o,style:{display:"none"},onChange:a,multiple:!0})]})}),(0,g.jsx)(Ov,{images:t,isLoading:r,getPreview:e=>e.preview,onSelect:async(t,n,r)=>{let i=t.url,o=t.type,{width:a,height:l}=await ("video"===o?CH:a2)(i);if(r&&"svg"===r.type&&r.contentEditable&&"image"===o){r.set({maskSrc:i});return}if(r&&"image"===r.type&&r.contentEditable&&"image"==o){let e=a6(r,{width:a,height:l});r.set({src:i,...e});return}let s=Math.min(e.width/a,e.height/l,1);a*=s,l*=s;let u=(n?.x||e.width/2)-a/2,c=(n?.y||e.height/2)-l/2;e.activePage?.addElement({type:o,src:i,x:u,y:c,width:a,height:l})}})]})};f("8NFma");let OD=({store:e})=>{let{setQuery:t,loadMore:n,isReachingEnd:r,data:i,isLoading:o,error:a}=yg({defaultQuery:"",getAPI:({page:e,query:t})=>am({page:e,query:t})});return(0,g.jsxs)("div",{style:{height:"100%",display:"flex",flexDirection:"column"},children:[(0,g.jsx)(mK,{leftIcon:"search",placeholder:lW("sidePanel.searchPlaceholder"),onChange:e=>{t(e.target.value)},type:"search",style:{marginBottom:"20px"}}),(0,g.jsxs)("p",{style:{textAlign:"center"},children:["Photos by"," ",(0,g.jsx)("a",{href:"https://unsplash.com/",target:"_blank",children:"Unsplash"})]}),(0,g.jsx)(Ov,{images:i?.map(e=>e.results).flat().filter(Boolean),getPreview:e=>e.urls.small,onSelect:async(t,n,r)=>{if(fetch(av(t.id)),r&&"svg"===r.type&&r.contentEditable){r.set({maskSrc:t.urls.regular});return}let{width:i,height:o}=await a2(t.urls.small);if(r&&"image"===r.type&&r.contentEditable){let e=a6(r,{width:i,height:o});r.set({src:t.urls.regular,...e});return}let a=(n?.x||e.width/2)-i/2,l=(n?.y||e.height/2)-o/2;e.activePage?.addElement({type:"image",src:t.urls.regular,width:i,height:o,x:a,y:l})},isLoading:o,error:a,loadMore:!r&&n,getCredit:e=>(0,g.jsxs)("span",{children:["Photo by"," ",(0,g.jsx)("a",{href:`https://unsplash.com/@${e.user.username}?utm_source=polotno&utm_medium=referral`,target:"_blank",children:e.user.name})," ","on"," ",(0,g.jsx)("a",{href:"https://unsplash.com/?utm_source=polotno&utm_medium=referral",target:"_blank",children:"Unsplash"})]})})]})};f("8NFma");var OF={};OF=function(e){return _R({tag:"svg",attr:{viewBox:"0 0 512 512",fill:"currentColor"},child:[{tag:"path",attr:{d:"M430.1 347.9c-6.6-6.1-16.3-7.6-24.6-9-11.5-1.9-15.9-4-22.6-10-14.3-12.7-14.3-31.1 0-43.8l30.3-26.9c46.4-41 46.4-108.2 0-149.2-34.2-30.1-80.1-45-127.8-45-55.7 0-113.9 20.3-158.8 60.1-83.5 73.8-83.5 194.7 0 268.5 41.5 36.7 97.5 55 152.9 55.4h1.7c55.4 0 110-17.9 148.8-52.4 14.4-12.7 12-36.6.1-47.7zM120 216c0-17.7 14.3-32 32-32s32 14.3 32 32-14.3 32-32 32-32-14.3-32-32zm40 126c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32zm64-161c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32zm72 219c-26.5 0-48-21.5-48-48s21.5-48 48-48 48 21.5 48 48-21.5 48-48 48zm24-208c-17.7 0-32-14.3-32-32s14.3-32 32-32 32 14.3 32 32-14.3 32-32 32z"}}]})(e)};let Oz=["white","rgb(82, 113, 255)","rgb(255, 145, 77)","rgb(126, 217, 87)","rgb(255, 222, 89)","rgb(203, 108, 230)","rgb(0, 0, 0, 0)"],OB=oA("div")`
|
|
265
265
|
display: inline-block;
|
|
266
266
|
width: 30px;
|
|
267
267
|
height: 30px;
|
package/side-panel/text-panel.js
CHANGED
|
@@ -21,4 +21,4 @@
|
|
|
21
21
|
text-align: center;
|
|
22
22
|
color: white;
|
|
23
23
|
margin-bottom: 10px;
|
|
24
|
-
`,toBase64=e=>new Promise(((t,o)=>{const a=new FileReader;a.readAsDataURL(e),a.onload=()=>t(a.result),a.onerror=e=>o(e)})),FontItem=(0,mobx_react_lite_1.observer)((({onSelect:e,onRemove:t,font:o})=>react_1.default.createElement(FontContainer,{style:{fontFamily:o.fontFamily},className:"polotno-font-item",onClick:e},o.fontFamily," text",react_1.default.createElement(core_1.Button,{style:{position:"absolute",right:0,bottom:0},minimal:!0,icon:"trash",onClick:e=>{e.stopPropagation(),t()}})))),DragButton=e=>{var{onSelect:t}=e,o=__rest(e,["onSelect"]);return react_1.default.createElement(core_1.Button,Object.assign({},o,{draggable:!0,className:"polotno-close-panel",onClick:()=>t(),onDragStart:()=>{(0,page_1.registerNextDomDrop)((({x:e,y:o})=>{t({x:e,y:o})}))},onDragEnd:e=>{(0,page_1.registerNextDomDrop)(null)}}))};exports.TextPanel=(0,mobx_react_lite_1.observer)((({store:e})=>{react_1.default.useEffect((()=>{e.loadFont("Roboto")}),[]);const t=t=>{var o;const a=t.width||e.width/2,n=((null==t?void 0:t.x)||e.width/2)-a/2,i=((null==t?void 0:t.y)||e.height/2)-t.fontSize/2,l=(e.width+e.height)/2160,r=null===(o=e.activePage)||void 0===o?void 0:o.addElement(Object.assign(Object.assign({type:"text",fontFamily:"Roboto"},t),{x:n,y:i,width:a,fontSize:t.fontSize*l}));(0,screen_1.isMobile)()||null==r||r.toggleEditMode(!0)};react_1.default.useEffect((()=>{e.fonts.forEach((t=>e.loadFont(t.fontFamily)))}),[e.fonts]);const{data:o,error:a}=(0,swr_1.default)((0,api_1.textTemplateList)(),use_api_1.fetcher),[n,i]=react_1.default.useState("text");return react_1.default.createElement("div",{style:{height:"100%",display:"flex",flexDirection:"column"}},react_1.default.createElement(core_1.Tabs,{large:!0,onChange:e=>i(e)},react_1.default.createElement(core_1.Tab,{id:"text"},(0,l10n_1.t)("sidePanel.text")),react_1.default.createElement(core_1.Tab,{id:"font"},(0,l10n_1.t)("sidePanel.myFonts"))),"text"===n&&react_1.default.createElement(Container,null,react_1.default.createElement(DragButton,{style:{marginBottom:"5px",width:"100%",fontSize:"25px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t(Object.assign(Object.assign({},e),{fontSize:76,text:(0,l10n_1.t)("sidePanel.headerText"),fontFamily:"Roboto"}))}},(0,l10n_1.t)("sidePanel.createHeader")),react_1.default.createElement(DragButton,{style:{marginBottom:"5px",width:"100%",fontSize:"18px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t(Object.assign(Object.assign({},e),{fontSize:44,text:(0,l10n_1.t)("sidePanel.subHeaderText"),fontFamily:"Roboto"}))}},(0,l10n_1.t)("sidePanel.createSubHeader")),react_1.default.createElement(DragButton,{style:{marginBottom:"5px",width:"100%",fontSize:"14px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t(Object.assign(Object.assign({},e),{fontSize:30,text:(0,l10n_1.t)("sidePanel.bodyText"),fontFamily:"Roboto"}))}},(0,l10n_1.t)("sidePanel.createBody")),react_1.default.createElement(images_grid_1.ImagesGrid,{shadowEnabled:!1,images:null==o?void 0:o.items,getPreview:e=>e.preview,getImageClassName:e=>e.json.indexOf("plain")>=0?"polotno-text-preview-plain":"",isLoading:!o,error:a,onSelect:async(t,o)=>{const a=await fetch(t.json),n=await a.json();if(!e.activePage)return;const i=(e.width+e.height)/2160,l=o?o.x-n.width/2*i:e.width/2-n.width/2*i,r=o?o.y-n.height/2*i:e.height/2-n.height/2*i;e.history.transaction((()=>{const t=n.pages[0].children,o=[];t.forEach((t=>{var a;delete t.id;const{id:n}=null===(a=e.activePage)||void 0===a?void 0:a.addElement(Object.assign(Object.assign({},t),{fontSize:t.fontSize*i,x:t.x*i+l,y:t.y*i+r,width:t.width*i,height:t.height*i}));o.push(n)})),e.selectElements(o)}))}})),"font"===n&&react_1.default.createElement("div",{style:{display:"flex",flexDirection:"column",height:"calc(100% - 50px)"}},react_1.default.createElement("label",{htmlFor:"polotno-font-upload"},react_1.default.createElement(core_1.Button,{icon:"upload",style:{width:"100%"},onClick:()=>{var e;null===(e=document.querySelector("#polotno-font-upload"))||void 0===e||e.click()}},(0,l10n_1.t)("sidePanel.uploadFont")),react_1.default.createElement("input",{type:"file",accept:".ttf, .otf, .woff, .woff2, .eot",id:"polotno-font-upload",style:{display:"none"},onChange:async t=>{const{target:o}=t;for(const t of o.files){const o=await toBase64(t),a=t.name.split(".")[0].replace(/,/g,"");e.addFont({fontFamily:a,url:o})}o.value=null}})),react_1.default.createElement("div",{style:{paddingTop:"20px",overflow:"auto",height:"100%"}},e.fonts.map(((o,a)=>react_1.default.createElement(FontItem,{font:o,key:a,onSelect:()=>{t({fontSize:80,text:"Cool text",fontFamily:o.fontFamily})},onRemove:()=>{e.removeFont(o.fontFamily)}}))))))}));
|
|
24
|
+
`,toBase64=e=>new Promise(((t,o)=>{const a=new FileReader;a.readAsDataURL(e),a.onload=()=>t(a.result),a.onerror=e=>o(e)})),FontItem=(0,mobx_react_lite_1.observer)((({onSelect:e,onRemove:t,font:o})=>react_1.default.createElement(FontContainer,{style:{fontFamily:o.fontFamily},className:"polotno-font-item",onClick:e},o.fontFamily," text",react_1.default.createElement(core_1.Button,{style:{position:"absolute",right:0,bottom:0},minimal:!0,icon:"trash",onClick:e=>{e.stopPropagation(),t()}})))),DragButton=e=>{var{onSelect:t}=e,o=__rest(e,["onSelect"]);return react_1.default.createElement(core_1.Button,Object.assign({},o,{draggable:!0,className:"polotno-close-panel",onClick:()=>t(),onDragStart:()=>{(0,page_1.registerNextDomDrop)((({x:e,y:o})=>{t({x:e,y:o})}))},onDragEnd:e=>{(0,page_1.registerNextDomDrop)(null)}}))};exports.TextPanel=(0,mobx_react_lite_1.observer)((({store:e})=>{react_1.default.useEffect((()=>{e.loadFont("Roboto")}),[]);const t=t=>{var o;const a=t.width||e.width/2,n=((null==t?void 0:t.x)||e.width/2)-a/2,i=((null==t?void 0:t.y)||e.height/2)-t.fontSize/2,l=(e.width+e.height)/2160,r=null===(o=e.activePage)||void 0===o?void 0:o.addElement(Object.assign(Object.assign({type:"text",fontFamily:"Roboto"},t),{x:n,y:i,width:a,fontSize:t.fontSize*l}));(0,screen_1.isMobile)()||null==r||r.toggleEditMode(!0)};react_1.default.useEffect((()=>{e.fonts.forEach((t=>e.loadFont(t.fontFamily)))}),[e.fonts]);const{data:o,error:a}=(0,swr_1.default)((0,api_1.textTemplateList)(),use_api_1.fetcher),[n,i]=react_1.default.useState("text");return react_1.default.createElement("div",{style:{height:"100%",display:"flex",flexDirection:"column"}},react_1.default.createElement(core_1.Tabs,{large:!0,onChange:e=>i(e)},react_1.default.createElement(core_1.Tab,{id:"text"},(0,l10n_1.t)("sidePanel.text")),react_1.default.createElement(core_1.Tab,{id:"font"},(0,l10n_1.t)("sidePanel.myFonts"))),"text"===n&&react_1.default.createElement(Container,null,react_1.default.createElement(DragButton,{style:{marginBottom:"5px",width:"100%",fontSize:"25px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t(Object.assign(Object.assign({},e),{fontSize:76,text:(0,l10n_1.t)("sidePanel.headerText"),fontFamily:"Roboto"}))}},(0,l10n_1.t)("sidePanel.createHeader")),react_1.default.createElement(DragButton,{style:{marginBottom:"5px",width:"100%",fontSize:"18px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t(Object.assign(Object.assign({},e),{fontSize:44,text:(0,l10n_1.t)("sidePanel.subHeaderText"),fontFamily:"Roboto"}))}},(0,l10n_1.t)("sidePanel.createSubHeader")),react_1.default.createElement(DragButton,{style:{marginBottom:"5px",width:"100%",fontSize:"14px",fontFamily:"Roboto"},minimal:!0,onSelect:e=>{t(Object.assign(Object.assign({},e),{fontSize:30,text:(0,l10n_1.t)("sidePanel.bodyText"),fontFamily:"Roboto"}))}},(0,l10n_1.t)("sidePanel.createBody")),react_1.default.createElement(images_grid_1.ImagesGrid,{shadowEnabled:!1,images:null==o?void 0:o.items,getPreview:e=>e.preview,getImageClassName:e=>e.json.indexOf("plain")>=0?"polotno-text-preview-plain":"",isLoading:!o,error:a,onSelect:async(t,o)=>{const a=await fetch(t.json),n=await a.json();if(!e.activePage)return;const i=(e.width+e.height)/2160,l=o?o.x-n.width/2*i:e.width/2-n.width/2*i,r=o?o.y-n.height/2*i:e.height/2-n.height/2*i;e.history.transaction((()=>{const t=n.pages[0].children,o=[];t.forEach((t=>{var a;delete t.id;const{id:n}=null===(a=e.activePage)||void 0===a?void 0:a.addElement(Object.assign(Object.assign({},t),{fontSize:t.fontSize*i,x:t.x*i+l,y:t.y*i+r,width:t.width*i,height:t.height*i}));o.push(n)})),e.selectElements(o)}))}})),"font"===n&&react_1.default.createElement("div",{style:{display:"flex",flexDirection:"column",height:"calc(100% - 50px)"}},react_1.default.createElement("label",{htmlFor:"polotno-font-upload"},react_1.default.createElement(core_1.Button,{icon:"upload",style:{width:"100%"},onClick:()=>{var e;null===(e=document.querySelector("#polotno-font-upload"))||void 0===e||e.click()}},(0,l10n_1.t)("sidePanel.uploadFont")),react_1.default.createElement("input",{type:"file",accept:".ttf, .otf, .woff, .woff2, .eot",id:"polotno-font-upload",style:{display:"none"},onChange:async t=>{const{target:o}=t;for(const t of o.files){const o=await toBase64(t),a=t.name.split(".")[0].replace(/,/g,"");e.addFont({fontFamily:a,url:o})}o.value=null}})),react_1.default.createElement("div",{style:{paddingTop:"20px",overflow:"auto",height:"100%"}},e.fonts.map(((o,a)=>react_1.default.createElement(FontItem,{font:o,key:a,onSelect:()=>{t({fontSize:80,text:"Cool text",fontFamily:o.fontFamily})},onRemove:()=>{e.find((e=>{"text"===e.type&&e.fontFamily===o.fontFamily&&e.set({fontFamily:"Roboto"})})),e.removeFont(o.fontFamily)}}))))))}));
|
package/utils/fonts.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,t,o,n){void 0===n&&(n=o);var s=Object.getOwnPropertyDescriptor(t,o);s&&!("get"in s?!t.__esModule:s.writable||s.configurable)||(s={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(e,n,s)}:function(e,t,o,n){void 0===n&&(n=o),e[n]=t[o]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var o in e)"default"!==o&&Object.prototype.hasOwnProperty.call(e,o)&&__createBinding(t,e,o);return __setModuleDefault(t,e),t};Object.defineProperty(exports,"__esModule",{value:!0}),exports.injectCustomFont=exports.injectGoogleFont=exports.setGoogleFontsVariants=exports.loadFont=exports.isFontLoaded=exports.replaceGlobalFonts=exports.removeGlobalFont=exports.addGlobalFont=exports.globalFonts=exports.getFontsList=exports.setGoogleFonts=exports.isGoogleFontChanged=void 0;const mobx=__importStar(require("mobx")),loader_1=require("./loader");let GOOGLE_FONTS=mobx.observable(["Roboto","Amatic SC","Press Start 2P","Marck Script","Rubik Mono One"]),googleFontsChanged=mobx.observable({value:!1});function isGoogleFontChanged(){return googleFontsChanged.value}function setGoogleFonts(e){"default"!==e?(googleFontsChanged.value=!0,GOOGLE_FONTS.splice(0,GOOGLE_FONTS.length),GOOGLE_FONTS.push(...e)):googleFontsChanged.value=!1}function getFontsList(){return GOOGLE_FONTS}function addGlobalFont(e){exports.globalFonts.push(e)}function removeGlobalFont(e){const t=exports.globalFonts.findIndex((t=>t.fontFamily===e));-1!==t&&exports.globalFonts.splice(t,1)}function replaceGlobalFonts(e){exports.globalFonts.replace(e)}exports.isGoogleFontChanged=isGoogleFontChanged,exports.setGoogleFonts=setGoogleFonts,exports.getFontsList=getFontsList,exports.globalFonts=mobx.observable([]),exports.addGlobalFont=addGlobalFont,exports.removeGlobalFont=removeGlobalFont,exports.replaceGlobalFonts=replaceGlobalFonts;var TEXT_TEXT="Some test text;?#D-ПРИВЕТ!1230o9u8i7y6t5r4e3w2q1",canvas=document.createElement("canvas");function measureArial(){return measureFont("Arial")}function measureTimes(){return measureFont("Times","Times")}function measureFont(e,t="Arial"){var o=canvas.getContext("2d");return o.font=`normal 40px '${e}', ${t}`,o.measureText(TEXT_TEXT).width}const MAX_ATTEMPTS=100,loadedFonts={Arial:!0},isFontLoaded=e=>!!loadedFonts[e];async function loadFont(e){var t;if(loadedFonts[e])return;const o=!!(null===(t=document.fonts)||void 0===t?void 0:t.load),n=measureArial();if(o)try{await document.fonts.load(`16px '${e}'`);const t=measureFont(e);if(n!==t)return void(loadedFonts[e]=!0)}catch(e){}const s=measureTimes(),r=measureFont(e),a=(0,loader_1.getAssetLoadTimeout)()/60;for(let t=0;t<a;t++){const t=measureFont(e,"Arial"),o=measureFont(e,"Times");if(t!==r||t!==n||o!==s)return void(loadedFonts[e]=!0);await new Promise((e=>setTimeout(e,60)))}console.warn(`Timeout for loading font "${e}". Looks like polotno can't load it. Is it a correct font family?`),(0,loader_1.triggerLoadError)(`Timeout for loading font "${e}"`)}exports.isFontLoaded=isFontLoaded,exports.loadFont=loadFont;const registeredGoogleFonts={};let googleFontsVariants="400,400italic,700,700italic";function setGoogleFontsVariants(e){googleFontsVariants=e}function injectGoogleFont(e){if(registeredGoogleFonts[e])return;const t=`https://fonts.googleapis.com/css?family=${e.replace(/ /g,"+")}:${googleFontsVariants}`,o=document.createElement("link");o.type="text/css",o.href=t,o.rel="stylesheet",document.getElementsByTagName("head")[0].appendChild(o),registeredGoogleFonts[e]=!0}exports.setGoogleFontsVariants=setGoogleFontsVariants,exports.injectGoogleFont=injectGoogleFont;const registeredCustomFonts={};function injectCustomFont(e){const t=e.fontFamily;if(registeredCustomFonts[t])return;if(!e.url&&!e.styles)return;const o=document.createElement("style");o.type="text/css";const n=e.styles||(e.url?[{src:`url("${e.url}")`}]:[]);let s="";n.forEach((e=>{s+=`\n @font-face {\n font-family: '${t}';\n src: ${e.src};\n font-style: ${e.fontStyle||"normal"};\n font-weight: ${e.fontWeight||"normal"};\n }\n `})),o.innerHTML=s,document.getElementsByTagName("head")[0].appendChild(o),registeredCustomFonts[e.fontFamily]=!0}exports.injectCustomFont=injectCustomFont;
|
|
1
|
+
"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,t,o,n){void 0===n&&(n=o);var s=Object.getOwnPropertyDescriptor(t,o);s&&!("get"in s?!t.__esModule:s.writable||s.configurable)||(s={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(e,n,s)}:function(e,t,o,n){void 0===n&&(n=o),e[n]=t[o]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var o in e)"default"!==o&&Object.prototype.hasOwnProperty.call(e,o)&&__createBinding(t,e,o);return __setModuleDefault(t,e),t};Object.defineProperty(exports,"__esModule",{value:!0}),exports.injectCustomFont=exports.injectGoogleFont=exports.setGoogleFontsVariants=exports.loadFont=exports.isFontLoaded=exports.replaceGlobalFonts=exports.removeGlobalFont=exports.addGlobalFont=exports.globalFonts=exports.getFontsList=exports.setGoogleFonts=exports.isGoogleFontChanged=void 0;const mobx=__importStar(require("mobx")),loader_1=require("./loader");let GOOGLE_FONTS=mobx.observable(["Roboto","Amatic SC","Press Start 2P","Marck Script","Rubik Mono One"]),googleFontsChanged=mobx.observable({value:!1});function isGoogleFontChanged(){return googleFontsChanged.value}function setGoogleFonts(e){"default"!==e?(googleFontsChanged.value=!0,GOOGLE_FONTS.splice(0,GOOGLE_FONTS.length),GOOGLE_FONTS.push(...e)):googleFontsChanged.value=!1}function getFontsList(){return GOOGLE_FONTS}function addGlobalFont(e){exports.globalFonts.push(e)}function removeGlobalFont(e){const t=exports.globalFonts.findIndex((t=>t.fontFamily===e));-1!==t&&exports.globalFonts.splice(t,1)}function replaceGlobalFonts(e){exports.globalFonts.replace(e)}exports.isGoogleFontChanged=isGoogleFontChanged,exports.setGoogleFonts=setGoogleFonts,exports.getFontsList=getFontsList,exports.globalFonts=mobx.observable([]),exports.addGlobalFont=addGlobalFont,exports.removeGlobalFont=removeGlobalFont,exports.replaceGlobalFonts=replaceGlobalFonts;var TEXT_TEXT="Some test text;?#D-ПРИВЕТ!1230o9u8i7y6t5r4e3w2q1",canvas=document.createElement("canvas");function measureArial(){return measureFont("Arial")}function measureTimes(){return measureFont("Times","Times")}function measureFont(e,t="Arial"){var o=canvas.getContext("2d");return o.font=`normal 40px '${e}', ${t}`,o.measureText(TEXT_TEXT).width}const MAX_ATTEMPTS=100,loadedFonts={Arial:!0},isFontLoaded=e=>!!loadedFonts[e];async function loadFont(e){var t;if(loadedFonts[e])return;const o=!!(null===(t=document.fonts)||void 0===t?void 0:t.load),n=measureArial();if(o)try{await document.fonts.load(`16px '${e}'`);const t=measureFont(e);if(n!==t)return void(loadedFonts[e]=!0)}catch(e){}const s=measureTimes(),r=measureFont(e),a=Math.min(6e3,(0,loader_1.getAssetLoadTimeout)())/60;for(let t=0;t<a;t++){const t=measureFont(e,"Arial"),o=measureFont(e,"Times");if(t!==r||t!==n||o!==s)return void(loadedFonts[e]=!0);await new Promise((e=>setTimeout(e,60)))}console.warn(`Timeout for loading font "${e}". Looks like polotno can't load it. Is it a correct font family?`),(0,loader_1.triggerLoadError)(`Timeout for loading font "${e}"`)}exports.isFontLoaded=isFontLoaded,exports.loadFont=loadFont;const registeredGoogleFonts={};let googleFontsVariants="400,400italic,700,700italic";function setGoogleFontsVariants(e){googleFontsVariants=e}function injectGoogleFont(e){if(registeredGoogleFonts[e])return;const t=`https://fonts.googleapis.com/css?family=${e.replace(/ /g,"+")}:${googleFontsVariants}`,o=document.createElement("link");o.type="text/css",o.href=t,o.rel="stylesheet",document.getElementsByTagName("head")[0].appendChild(o),registeredGoogleFonts[e]=!0}exports.setGoogleFontsVariants=setGoogleFontsVariants,exports.injectGoogleFont=injectGoogleFont;const registeredCustomFonts={};function injectCustomFont(e){const t=e.fontFamily;if(registeredCustomFonts[t])return;if(!e.url&&!e.styles)return;const o=document.createElement("style");o.type="text/css";const n=e.styles||(e.url?[{src:`url("${e.url}")`}]:[]);let s="";n.forEach((e=>{s+=`\n @font-face {\n font-family: '${t}';\n src: ${e.src};\n font-style: ${e.fontStyle||"normal"};\n font-weight: ${e.fontWeight||"normal"};\n }\n `})),o.innerHTML=s,document.getElementsByTagName("head")[0].appendChild(o),registeredCustomFonts[e.fontFamily]=!0}exports.injectCustomFont=injectCustomFont;
|