polotno 2.36.8 → 2.36.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "polotno",
-  "version": "2.36.8",
+  "version": "2.36.9",
   "description": "Design Editor Framework",
   "author": "Anton Lavrenov",
   "keywords": [

package/pages-timeline/pages-timeline.js

@@ -1,4 +1,4 @@
-import e from"react";import{observer as t}from"mobx-react-lite";import{Button as n,Navbar as i}from"@blueprintjs/core";import{Plus as r,Play as o}from"@blueprintjs/icons";import a from"../utils/styled.js";import{flags as l}from"../utils/flags.js";import{t as s}from"../utils/l10n.js";import{Pages as m}from"./pages.js";import{CurrentTime as c}from"./current-time.js";import{Audios as d}from"./audios.js";import{ElementsTimeline as u}from"./elements.js";import{PlayButton as p}from"./play-button.js";import{TimeRuler as v}from"./time-ruler.js";const f=a("div")`
+import e from"react";import{observer as t}from"mobx-react-lite";import{Button as n,Navbar as i}from"@blueprintjs/core";import{Plus as r,Play as o}from"@blueprintjs/icons";import a from"../utils/styled.js";import{flags as l}from"../utils/flags.js";import{t as s}from"../utils/l10n.js";import{Pages as m}from"./pages.js";import{CurrentTime as d}from"./current-time.js";import{Audios as c}from"./audios.js";import{ElementsTimeline as u}from"./elements.js";import{PlayButton as p}from"./play-button.js";import{TimeRuler as v}from"./time-ruler.js";const f=a("div")`
   position: relative;
   height: 0px;
 `,h=a("div")`
@@ -35,4 +35,4 @@ import e from"react";import{observer as t}from"mobx-react-lite";import{Button as
   &.active::before {
     background: var(--polotno-accent-color, #137cbd);
   }
-`;export const PagesTimeline=t(({store:t,defaultOpened:a=!1})=>{const g=e.useRef(null),[b,x]=e.useState(a),[w,y]=e.useState(.02),[j,k]=e.useState(()=>(e=>{if(!l.animationsEnabled){return 65}const t=e.pages.reduce((e,t)=>e+t.children.length,0),n=25*e.audios.length+20*t+140;return Math.min(Math.max(n,140),420)})(t)),[L,C]=e.useState(!1),M=e.useRef(0),R=e.useRef(j),S=e.useRef(!1),P=t.duration*w,z=e.useCallback(e=>{if(!S.current){return}const t=e.clientY-M.current,n=R.current-t,i=Math.min(420,Math.max(140,n));k(i)},[]),D=e.useCallback(()=>{S.current&&(S.current=!1,C(!1),window.removeEventListener("mousemove",z),window.removeEventListener("mouseup",D))},[z]);return e.useEffect(()=>()=>{window.removeEventListener("mousemove",z),window.removeEventListener("mouseup",D)},[z,D]),e.createElement(e.Fragment,null,e.createElement(f,null,e.createElement(h,null,e.createElement(i,{style:{height:"35px",padding:"0 5px"}},e.createElement(i.Group,{style:{height:"35px"}},e.createElement(n,{minimal:!0,onClick:()=>{x(!b)},icon:l.animationsEnabled&&!b?e.createElement(o,null):null},s("pagesTimeline.pages")))))),e.createElement(i,{style:{padding:"5px",height:"auto",zIndex:1,position:"relative",overflow:"visible",display:b?"block":"none"},className:"polotno-pages-timeline"},l.animationsEnabled&&e.createElement(E,{onMouseDown:e=>{e.preventDefault(),M.current=e.clientY,R.current=j,S.current=!0,C(!0),window.addEventListener("mousemove",z),window.addEventListener("mouseup",D)},className:L?"active":void 0,title:"Drag to adjust timeline height"}),l.animationsEnabled&&e.createElement("div",{style:{display:"flex",justifyContent:"center"}},e.createElement(p,{store:t,scale:w,onScaleChange:y})),e.createElement("div",{style:{width:"100%",position:"relative",height:j}},e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,overflowX:"auto",padding:"0 24px"},ref:g},e.createElement("div",{style:{position:"relative",minWidth:l.animationsEnabled?P+"px":void 0}},l.animationsEnabled&&e.createElement(v,{store:t,scale:w,minWidth:P}),e.createElement("div",{style:{position:"relative",display:"flex"}},e.createElement("div",{style:{position:"relative",minWidth:l.animationsEnabled?P+"px":void 0,height:"60px"}},e.createElement(m,{store:t,scale:w})),e.createElement(n,{icon:e.createElement(r,null),style:{width:"60px",marginLeft:"12px"},onClick:()=>{var e;t.addPage({bleed:(null===(e=t.activePage)||void 0===e?void 0:e.bleed)||0})},minimal:!0})),l.animationsEnabled&&e.createElement(e.Fragment,null,e.createElement(u,{store:t,scale:w,width:P}),e.createElement(d,{store:t,scale:w,width:P})),l.animationsEnabled&&e.createElement(c,{store:t,scale:w,dragAreaRef:g,variant:"timeline"}))))))});
+`;export const PagesTimeline=t(({store:t,defaultOpened:a=!1})=>{const g=e.useRef(null),[b,x]=e.useState(a),[w,y]=e.useState(.02),[j,k]=e.useState(()=>(e=>{if(!l.animationsEnabled){return 65}const t=e.pages.reduce((e,t)=>e+t.children.length,0),n=25*e.audios.length+20*t+140;return Math.min(Math.max(n,140),420)})(t)),[L,C]=e.useState(!1),M=e.useRef(0),R=e.useRef(j),S=e.useRef(!1),P=t.duration*w,z=e.useCallback(e=>{if(!S.current){return}const t=e.clientY-M.current,n=R.current-t,i=Math.min(420,Math.max(140,n));k(i)},[]),D=e.useCallback(()=>{S.current&&(S.current=!1,C(!1),window.removeEventListener("mousemove",z),window.removeEventListener("mouseup",D))},[z]);return e.useEffect(()=>()=>{window.removeEventListener("mousemove",z),window.removeEventListener("mouseup",D)},[z,D]),e.createElement(e.Fragment,null,e.createElement(f,null,e.createElement(h,null,e.createElement(i,{style:{height:"35px",padding:"0 5px"}},e.createElement(i.Group,{style:{height:"35px"}},e.createElement(n,{minimal:!0,onClick:()=>{x(!b)},icon:l.animationsEnabled&&!b?e.createElement(o,null):null},s("pagesTimeline.pages")))))),e.createElement(i,{style:{padding:"5px",height:"auto",zIndex:1,position:"relative",overflow:"visible",display:b?"block":"none"},className:"polotno-pages-timeline"},l.animationsEnabled&&e.createElement(E,{onMouseDown:e=>{e.preventDefault(),M.current=e.clientY,R.current=j,S.current=!0,C(!0),window.addEventListener("mousemove",z),window.addEventListener("mouseup",D)},className:L?"active":void 0,title:"Drag to adjust timeline height"}),l.animationsEnabled&&e.createElement("div",{style:{display:"flex",justifyContent:"center"}},e.createElement(p,{store:t,scale:w,onScaleChange:y})),e.createElement("div",{dir:"ltr",style:{width:"100%",position:"relative",height:j}},e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,overflowX:"auto",padding:"0 24px"},ref:g},e.createElement("div",{style:{position:"relative",minWidth:l.animationsEnabled?P+"px":void 0}},l.animationsEnabled&&e.createElement(v,{store:t,scale:w,minWidth:P}),e.createElement("div",{style:{position:"relative",display:"flex"}},e.createElement("div",{style:{position:"relative",minWidth:l.animationsEnabled?P+"px":void 0,height:"60px"}},e.createElement(m,{store:t,scale:w})),e.createElement(n,{icon:e.createElement(r,null),style:{width:"60px",marginLeft:"12px"},onClick:()=>{var e;t.addPage({bleed:(null===(e=t.activePage)||void 0===e?void 0:e.bleed)||0})},minimal:!0})),l.animationsEnabled&&e.createElement(e.Fragment,null,e.createElement(u,{store:t,scale:w,width:P}),e.createElement(c,{store:t,scale:w,width:P})),l.animationsEnabled&&e.createElement(d,{store:t,scale:w,dragAreaRef:g,variant:"timeline"}))))))});

package/utils/clipboard.d.ts

@@ -3,3 +3,4 @@ export declare const copy: (store: StoreType) => void;
 export declare const cut: (store: StoreType) => void;
 export declare const paste: (store: StoreType) => void;
 export declare const isClipboardEmpty: () => boolean;
+export declare const resetClipboard: () => void;

package/utils/clipboard.js

@@ -1 +1 @@
-import{forEveryChild as e}from"../model/group-model.js";import{getTotalClientRect as t}from"./math.js";let a={data:[],pageId:""};const o="polotno_clipboard",l=(e,t)=>{a={data:JSON.parse(JSON.stringify(e)),pageId:t||""};try{localStorage.setItem(o,JSON.stringify(e)),localStorage.setItem(o+"_page",t||"")}catch(l){}},i=()=>{try{const e=localStorage.getItem(o),t=localStorage.getItem(o+"_page");if(e){return{data:JSON.parse(e),pageId:t}}}catch(e){}return a};export const copy=e=>{var t;0!==e.selectedElements.length&&l(e.selectedElements.map(e=>e.toJSON()),null===(t=e.activePage)||void 0===t?void 0:t.id)};export const cut=e=>{var t;l(e.selectedElements.map(e=>e.toJSON()),null===(t=e.activePage)||void 0===t?void 0:t.id);let a=e.selectedElements.filter(e=>e.removable).map(e=>e.id);e.deleteElements(a)};export const paste=a=>{a.history.transaction(()=>{var o,d;let r=0,s=0;const{data:c,pageId:n}=i();if(n===(null===(o=a.activePage)||void 0===o?void 0:o.id)){r=a.width/20,s=a.height/20}else{const o=[];e({children:c},e=>{"group"!==e.type&&o.push(e)});const l=t(o);l.maxX>a.width&&(r=-l.minX),l.maxY>a.height&&(s=-l.minY)}const p=[];e({children:c},e=>{delete e.id,"group"!==e.type&&(e.x+=r,e.y+=s)}),c.forEach(e=>{var t;const o=null===(t=a.activePage)||void 0===t?void 0:t.addElement(e);o&&p.push(o.id)}),l(c,null===(d=a.activePage)||void 0===d?void 0:d.id),a.selectElements(p)})};export const isClipboardEmpty=()=>0===i().data.length;
+import{forEveryChild as e}from"../model/group-model.js";import{getTotalClientRect as t}from"./math.js";let a={data:[],pageId:""};const o="polotno_clipboard",l=(e,t)=>{a={data:JSON.parse(JSON.stringify(e)),pageId:t||""};try{localStorage.setItem(o,JSON.stringify(e)),localStorage.setItem(o+"_page",t||"")}catch(l){}},r=()=>{try{const e=localStorage.getItem(o),t=localStorage.getItem(o+"_page");if(e){return{data:JSON.parse(e),pageId:t}}}catch(e){}return a};export const copy=e=>{var t;0!==e.selectedElements.length&&l(e.selectedElements.map(e=>e.toJSON()),null===(t=e.activePage)||void 0===t?void 0:t.id)};export const cut=e=>{var t;l(e.selectedElements.map(e=>e.toJSON()),null===(t=e.activePage)||void 0===t?void 0:t.id);let a=e.selectedElements.filter(e=>e.removable).map(e=>e.id);e.deleteElements(a)};export const paste=a=>{a.history.transaction(()=>{var o,d;let i=0,c=0;const{data:s,pageId:n}=r();if(n===(null===(o=a.activePage)||void 0===o?void 0:o.id)){i=a.width/20,c=a.height/20}else{const o=[];e({children:s},e=>{"group"!==e.type&&o.push(e)});const l=t(o);l.maxX>a.width&&(i=-l.minX),l.maxY>a.height&&(c=-l.minY)}const p=[];e({children:s},e=>{delete e.id,"group"!==e.type&&(e.x+=i,e.y+=c)}),s.forEach(e=>{var t;const o=null===(t=a.activePage)||void 0===t?void 0:t.addElement(e);o&&p.push(o.id)}),l(s,null===(d=a.activePage)||void 0===d?void 0:d.id),a.selectElements(p)})};export const isClipboardEmpty=()=>0===r().data.length;export const resetClipboard=()=>{a={data:[],pageId:""};try{localStorage.removeItem(o),localStorage.removeItem(o+"_page")}catch(e){}};

package/utils/validate-key.js

@@ -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.36.8"})});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()}
+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.36.9"})});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()}