@pie-element/ebsr 9.12.1 → 9.12.2-next.19

package/configure/node_modules/@pie-element/multiple-choice/node_modules/@pie-lib/pie-toolbox/code/editable-html/plugins/image/component.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/code/editable-html/plugins/image/component.jsx"],"names":["log","size","s","Component","percent","multiplier","img","naturalWidth","naturalHeight","width","floored","parseInt","toFixed","props","node","editor","update","data","w","get","set","getPercentFromWidth","equals","change","c","setNodeByKey","key","window","addEventListener","startResizing","stopResizing","maxImageWidth","maxImageHeight","box","style","dimensions","height","updateImageDimensions","setState","e","bounds","target","getBoundingClientRect","clientX","left","clientY","top","hasMinimumWidth","hasDimensionsConstraints","removeEventListener","initialDim","nextDim","keepAspectRatio","resizeType","imageAspectRatio","applySizeData","resizeHandle","resize","initialiseResize","objectFit","classes","attributes","onFocus","active","value","isFocused","selection","hasEdgeIn","src","loaded","deleteStatus","alignment","alt","justifyContent","getSize","className","root","loading","pendingDelete","progressClasses","progress","hideProgress","imageContainer","image","ref","loadImage","React","SlatePropTypes","isRequired","PropTypes","shape","func","object","onBlur","number","styles","theme","portal","position","opacity","transition","floatingButtonRow","backgroundColor","palette","background","paper","borderRadius","display","padding","border","grey","boxShadow","common","white","right","alignItems","primary","main","cursor","marginLeft","marginRight","drawableHeight","minHeight"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,gDAAN,CAAZ;;AAEA,IAAMC,IAAI,GAAG,SAAPA,IAAO,CAACC,CAAD;AAAA,SAAQA,CAAC,aAAMA,CAAN,UAAc,MAAvB;AAAA,CAAb;;IAEaC,S;;;;;;;;;;;;;;;iGAeA,UAACC,OAAD,EAAa;AACtB,UAAMC,UAAU,GAAGD,OAAO,GAAG,GAA7B;AACA,aAAO,MAAKE,GAAL,CAASC,YAAT,GAAwBF,UAA/B;AACD,K;kGAEW,UAACD,OAAD,EAAa;AACvB,UAAMC,UAAU,GAAGD,OAAO,GAAG,GAA7B;AACA,aAAO,MAAKE,GAAL,CAASE,aAAT,GAAyBH,UAAhC;AACD,K;4GAEqB,UAACI,KAAD,EAAW;AAC/B,UAAIC,OAAO,GAAID,KAAK,GAAG,MAAKH,GAAL,CAASC,YAAlB,GAAkC,CAAhD;AACA,aAAOI,QAAQ,CAACD,OAAO,CAACE,OAAR,CAAgB,CAAhB,IAAqB,EAAtB,EAA0B,EAA1B,CAAf;AACD,K;sGAEe,YAAM;AACpB,wBAAyB,MAAKC,KAA9B;AAAA,UAAQC,IAAR,eAAQA,IAAR;AAAA,UAAcC,MAAd,eAAcA,MAAd;AAEA,UAAIC,MAAM,GAAGF,IAAI,CAACG,IAAlB;AAEA,UAAMC,CAAC,GAAGF,MAAM,CAACG,GAAP,CAAW,OAAX,CAAV;;AACA,UAAID,CAAJ,EAAO;AACLF,QAAAA,MAAM,GAAGA,MAAM,CAACI,GAAP,CAAW,eAAX,EAA4B,MAAKC,mBAAL,CAAyBH,CAAzB,CAA5B,CAAT;AACD;;AAEDlB,MAAAA,GAAG,CAAC,0BAAD,EAA6BgB,MAA7B,CAAH;;AAEA,UAAI,CAACA,MAAM,CAACM,MAAP,CAAcR,IAAI,CAACG,IAAnB,CAAL,EAA+B;AAC7BF,QAAAA,MAAM,CAACQ,MAAP,CAAc,UAACC,CAAD;AAAA,iBAAOA,CAAC,CAACC,YAAF,CAAeX,IAAI,CAACY,GAApB,EAAyB;AAAET,YAAAA,IAAI,EAAED;AAAR,WAAzB,CAAP;AAAA,SAAd;AACD;AACF,K;yGAEkB,YAAM;AACvBW,MAAAA,MAAM,CAACC,gBAAP,CAAwB,WAAxB,EAAqC,MAAKC,aAA1C,EAAyD,KAAzD;AACAF,MAAAA,MAAM,CAACC,gBAAP,CAAwB,SAAxB,EAAmC,MAAKE,YAAxC,EAAsD,KAAtD;AACD,K;kGAwBW,YAAM;AAChB,iBAAwC,MAAKjB,KAAL,IAAc,EAAtD;AAAA,UAAMkB,aAAN,QAAMA,aAAN;AAAA,UAAqBC,cAArB,QAAqBA,cAArB;;AACAD,MAAAA,aAAa,GAAGA,aAAa,IAAI,GAAjC;AACAC,MAAAA,cAAc,GAAGA,cAAc,IAAI,GAAnC;AAEA,UAAMC,GAAG,GAAG,MAAK3B,GAAjB,CALgB,CAOhB;;AACA,UAAI,CAAC2B,GAAG,CAACC,KAAJ,CAAUzB,KAAX,IAAoBwB,GAAG,CAACC,KAAJ,CAAUzB,KAAV,KAAoB,MAA5C,EAAoD;AAClD,YAAM0B,UAAU,GAAG;AACjB1B,UAAAA,KAAK,EAAGwB,GAAG,IAAIA,GAAG,CAAC1B,YAAZ,IAA6B,GADnB;AAEjB6B,UAAAA,MAAM,EAAGH,GAAG,IAAIA,GAAG,CAACzB,aAAZ,IAA8B;AAFrB,SAAnB;;AAKA,oCAA0B,MAAK6B,qBAAL,CACxBF,UADwB,EAExB;AACE1B,UAAAA,KAAK,EAAE0B,UAAU,CAAC1B,KAAX,GAAmBsB,aAAnB,GAAmCI,UAAU,CAAC1B,KAA9C,GAAsDsB,aAD/D;AAEEK,UAAAA,MAAM,EAAED,UAAU,CAACC,MAAX,GAAoBJ,cAApB,GAAqCG,UAAU,CAACC,MAAhD,GAAyDJ;AAFnE,SAFwB,EAMxB,IANwB,CAA1B;AAAA,YAAQvB,KAAR,yBAAQA,KAAR;AAAA,YAAe2B,MAAf,yBAAeA,MAAf;;AASAH,QAAAA,GAAG,CAACC,KAAJ,CAAUzB,KAAV,aAAqBA,KAArB;AACAwB,QAAAA,GAAG,CAACC,KAAJ,CAAUE,MAAV,aAAsBA,MAAtB;;AAEA,cAAKE,QAAL,CAAc;AACZH,UAAAA,UAAU,EAAE;AAAEC,YAAAA,MAAM,EAAEA,MAAV;AAAkB3B,YAAAA,KAAK,EAAEA;AAAzB;AADA,SAAd;;AAIA,2BAAyB,MAAKI,KAA9B;AAAA,YAAQC,IAAR,gBAAQA,IAAR;AAAA,YAAcC,MAAd,gBAAcA,MAAd;AAEA,YAAIC,MAAM,GAAGF,IAAI,CAACG,IAAlB;AAEAD,QAAAA,MAAM,GAAGA,MAAM,CAACI,GAAP,CAAW,OAAX,EAAoBX,KAApB,CAAT;AACAO,QAAAA,MAAM,GAAGA,MAAM,CAACI,GAAP,CAAW,QAAX,EAAqBgB,MAArB,CAAT;;AAEA,YAAI,CAACpB,MAAM,CAACM,MAAP,CAAcR,IAAI,CAACG,IAAnB,CAAL,EAA+B;AAC7BF,UAAAA,MAAM,CAACQ,MAAP,CAAc,UAACC,CAAD;AAAA,mBAAOA,CAAC,CAACC,YAAF,CAAeX,IAAI,CAACY,GAApB,EAAyB;AAAET,cAAAA,IAAI,EAAED;AAAR,aAAzB,CAAP;AAAA,WAAd;AACD;AACF;AACF,K;sGAEe,UAACuB,CAAD,EAAO;AACrB,UAAMC,MAAM,GAAGD,CAAC,CAACE,MAAF,CAASC,qBAAT,EAAf;AACA,UAAMT,GAAG,GAAG,MAAK3B,GAAjB;AACA,UAAM6B,UAAU,GAAG;AACjB1B,QAAAA,KAAK,EAAGwB,GAAG,IAAIA,GAAG,CAAC1B,YAAZ,IAA6B,GADnB;AAEjB6B,QAAAA,MAAM,EAAGH,GAAG,IAAIA,GAAG,CAACzB,aAAZ,IAA8B;AAFrB,OAAnB;;AAKA,mCAA0B,MAAK6B,qBAAL,CACxBF,UADwB,EAExB;AACE1B,QAAAA,KAAK,EAAE8B,CAAC,CAACI,OAAF,GAAYH,MAAM,CAACI,IAD5B;AAEER,QAAAA,MAAM,EAAEG,CAAC,CAACM,OAAF,GAAYL,MAAM,CAACM;AAF7B,OAFwB,EAMxB,IANwB,CAA1B;AAAA,UAAQrC,KAAR,0BAAQA,KAAR;AAAA,UAAe2B,MAAf,0BAAeA,MAAf;;AASA,UAAMW,eAAe,GAAGtC,KAAK,GAAG,EAAR,IAAc2B,MAAM,GAAG,EAA/C;AACA,UAAMY,wBAAwB,GAAGvC,KAAK,IAAI,GAAT,IAAgB2B,MAAM,IAAI,GAA3D;;AAEA,UAAIW,eAAe,IAAIC,wBAAnB,IAA+Cf,GAAnD,EAAwD;AACtDA,QAAAA,GAAG,CAACC,KAAJ,CAAUzB,KAAV,aAAqBA,KAArB;AACAwB,QAAAA,GAAG,CAACC,KAAJ,CAAUE,MAAV,aAAsBA,MAAtB;;AAEA,cAAKE,QAAL,CAAc;AACZH,UAAAA,UAAU,EAAE;AAAEC,YAAAA,MAAM,EAAEA,MAAV;AAAkB3B,YAAAA,KAAK,EAAEA;AAAzB;AADA,SAAd;;AAIA,2BAAyB,MAAKI,KAA9B;AAAA,YAAQC,IAAR,gBAAQA,IAAR;AAAA,YAAcC,MAAd,gBAAcA,MAAd;AAEA,YAAIC,MAAM,GAAGF,IAAI,CAACG,IAAlB;AAEAD,QAAAA,MAAM,GAAGA,MAAM,CAACI,GAAP,CAAW,OAAX,EAAoBX,KAApB,CAAT;AACAO,QAAAA,MAAM,GAAGA,MAAM,CAACI,GAAP,CAAW,QAAX,EAAqBgB,MAArB,CAAT;;AAEA,YAAI,CAACpB,MAAM,CAACM,MAAP,CAAcR,IAAI,CAACG,IAAnB,CAAL,EAA+B;AAC7BF,UAAAA,MAAM,CAACQ,MAAP,CAAc,UAACC,CAAD;AAAA,mBAAOA,CAAC,CAACC,YAAF,CAAeX,IAAI,CAACY,GAApB,EAAyB;AAAET,cAAAA,IAAI,EAAED;AAAR,aAAzB,CAAP;AAAA,WAAd;AACD;AACF;AACF,K;qGAEc,YAAM;AACnBW,MAAAA,MAAM,CAACsB,mBAAP,CAA2B,WAA3B,EAAwC,MAAKpB,aAA7C,EAA4D,KAA5D;AACAF,MAAAA,MAAM,CAACsB,mBAAP,CAA2B,SAA3B,EAAsC,MAAKnB,YAA3C,EAAyD,KAAzD;AACD,K;8GAEuB,UAACoB,UAAD,EAAaC,OAAb,EAAsBC,eAAtB,EAAuCC,UAAvC,EAAsD;AAC5E;AACA,UAAID,eAAJ,EAAqB;AACnB,YAAME,gBAAgB,GAAGJ,UAAU,CAACzC,KAAX,GAAmByC,UAAU,CAACd,MAAvD;;AAEA,YAAIiB,UAAU,KAAK,QAAnB,EAA6B;AAC3B;AACA,iBAAO;AACL5C,YAAAA,KAAK,EAAE0C,OAAO,CAACf,MAAR,GAAiBkB,gBADnB;AAELlB,YAAAA,MAAM,EAAEe,OAAO,CAACf;AAFX,WAAP;AAID,SATkB,CAWnB;;;AACA,eAAO;AACL3B,UAAAA,KAAK,EAAE0C,OAAO,CAAC1C,KADV;AAEL2B,UAAAA,MAAM,EAAEe,OAAO,CAAC1C,KAAR,GAAgB6C;AAFnB,SAAP;AAID,OAlB2E,CAoB5E;;;AACA,aAAO;AACL7C,QAAAA,KAAK,EAAE0C,OAAO,CAAC1C,KADV;AAEL2B,QAAAA,MAAM,EAAEe,OAAO,CAACf;AAFX,OAAP;AAID,K;;;;;;WAxID,6BAAoB;AAClB,WAAKmB,aAAL;AAEA,UAAMC,YAAY,GAAG,KAAKC,MAA1B;;AAEA,UAAID,YAAJ,EAAkB;AAChBA,QAAAA,YAAY,CAAC5B,gBAAb,CAA8B,WAA9B,EAA2C,KAAK8B,gBAAhD,EAAkE,KAAlE;AACD;AACF;;;WAED,8BAAqB;AACnB,WAAKH,aAAL;AACD;;;WAED,iBAAQtC,IAAR,EAAc;AACZ,aAAO;AACLR,QAAAA,KAAK,EAAER,IAAI,CAACgB,IAAI,CAACE,GAAL,CAAS,OAAT,CAAD,CADN;AAELiB,QAAAA,MAAM,EAAEnC,IAAI,CAACgB,IAAI,CAACE,GAAL,CAAS,QAAT,CAAD,CAFP;AAGLwC,QAAAA,SAAS,EAAE;AAHN,OAAP;AAKD;;;WAsHD,kBAAS;AAAA;;AACP,yBAAuD,KAAK9C,KAA5D;AAAA,UAAQC,IAAR,gBAAQA,IAAR;AAAA,UAAcC,MAAd,gBAAcA,MAAd;AAAA,UAAsB6C,OAAtB,gBAAsBA,OAAtB;AAAA,UAA+BC,UAA/B,gBAA+BA,UAA/B;AAAA,UAA2CC,OAA3C,gBAA2CA,OAA3C;AACA,UAAMC,MAAM,GAAGhD,MAAM,CAACiD,KAAP,CAAaC,SAAb,IAA0BlD,MAAM,CAACiD,KAAP,CAAaE,SAAb,CAAuBC,SAAvB,CAAiCrD,IAAjC,CAAzC;AACA,UAAMsD,GAAG,GAAGtD,IAAI,CAACG,IAAL,CAAUE,GAAV,CAAc,KAAd,CAAZ;AACA,UAAMkD,MAAM,GAAGvD,IAAI,CAACG,IAAL,CAAUE,GAAV,CAAc,QAAd,MAA4B,KAA3C;AACA,UAAMmD,YAAY,GAAGxD,IAAI,CAACG,IAAL,CAAUE,GAAV,CAAc,cAAd,CAArB;AACA,UAAMoD,SAAS,GAAGzD,IAAI,CAACG,IAAL,CAAUE,GAAV,CAAc,WAAd,CAAlB;AACA,UAAMf,OAAO,GAAGU,IAAI,CAACG,IAAL,CAAUE,GAAV,CAAc,SAAd,CAAhB;AACA,UAAMqD,GAAG,GAAG1D,IAAI,CAACG,IAAL,CAAUE,GAAV,CAAc,KAAd,CAAZ;AACA,UAAIsD,cAAJ;;AAEA,cAAQF,SAAR;AACE,aAAK,MAAL;AACEE,UAAAA,cAAc,GAAG,YAAjB;AACA;;AAEF,aAAK,QAAL;AACEA,UAAAA,cAAc,GAAG,QAAjB;AACA;;AAEF,aAAK,OAAL;AACEA,UAAAA,cAAc,GAAG,UAAjB;AACA;;AAEF;AACEA,UAAAA,cAAc,GAAG,YAAjB;AACA;AAfJ;;AAiBAzE,MAAAA,GAAG,CAAC,qBAAD,EAAwBc,IAAI,CAACG,IAA7B,CAAH;AAEA,UAAMhB,IAAI,GAAG,KAAKyE,OAAL,CAAa5D,IAAI,CAACG,IAAlB,CAAb;AAEAjB,MAAAA,GAAG,CAAC,iBAAD,EAAoBC,IAApB,CAAH;AAEA,UAAM0E,SAAS,GAAG,4BAChBf,OAAO,CAACgB,IADQ,EAEhB,CAACP,MAAD,IAAWT,OAAO,CAACiB,OAFH,EAGhBP,YAAY,KAAK,SAAjB,IAA8BV,OAAO,CAACkB,aAHtB,CAAlB;AAMA,UAAMC,eAAe,GAAG,4BAAWnB,OAAO,CAACoB,QAAnB,EAA6BX,MAAM,IAAIT,OAAO,CAACqB,YAA/C,CAAxB;AAEA,aAAO,cACL;AAAM,QAAA,GAAG,EAAE;AAAX,gBADK,eAEL;AAAK,QAAA,GAAG,EAAE,MAAV;AAAkB,QAAA,OAAO,EAAEnB,OAA3B;AAAoC,QAAA,SAAS,EAAEa,SAA/C;AAA0D,QAAA,KAAK,EAAE;AAAEF,UAAAA,cAAc,EAAdA;AAAF;AAAjE,sBACE,gCAAC,0BAAD;AAAgB,QAAA,IAAI,EAAC,aAArB;AAAmC,QAAA,KAAK,EAAErE,OAAO,GAAG,CAAV,GAAcA,OAAd,GAAwB,CAAlE;AAAqE,QAAA,SAAS,EAAE2E;AAAhF,QADF,eAEE;AAAK,QAAA,SAAS,EAAEnB,OAAO,CAACsB;AAAxB,sBACE,qEACMrB,UADN;AAEE,QAAA,SAAS,EAAE,4BAAWD,OAAO,CAACuB,KAAnB,EAA0BpB,MAAM,IAAIH,OAAO,CAACG,MAA5C,CAFb;AAGE,QAAA,GAAG,EAAE,aAACqB,KAAD,EAAS;AACZ,UAAA,MAAI,CAAC9E,GAAL,GAAW8E,KAAX;AACD,SALH;AAME,QAAA,GAAG,EAAEhB,GANP;AAOE,QAAA,KAAK,EAAEnE,IAPT;AAQE,QAAA,MAAM,EAAE,KAAKoF,SARf;AASE,QAAA,GAAG,EAAEb;AATP,SADF,eAYE;AACE,QAAA,GAAG,EAAE,aAACY,KAAD,EAAS;AACZ,UAAA,MAAI,CAAC3B,MAAL,GAAc2B,KAAd;AACD,SAHH;AAIE,QAAA,SAAS,EAAE,4BAAWxB,OAAO,CAACH,MAAnB,EAA2B,QAA3B;AAJb,QAZF,CAFF,CAFK,eAwBL;AAAM,QAAA,GAAG,EAAE;AAAX,gBAxBK,CAAP;AA0BD;;;EAlQ4B6B,kBAAMnF,S;;;iCAAxBA,S,eACQ;AACjBW,EAAAA,IAAI,EAAEyE,2BAAezE,IAAf,CAAoB0E,UADT;AAEjBzE,EAAAA,MAAM,EAAE0E,sBAAUC,KAAV,CAAgB;AACtBnE,IAAAA,MAAM,EAAEkE,sBAAUE,IAAV,CAAeH,UADD;AAEtBxB,IAAAA,KAAK,EAAEyB,sBAAUG;AAFK,GAAhB,EAGLJ,UALc;AAMjB5B,EAAAA,OAAO,EAAE6B,sBAAUG,MAAV,CAAiBJ,UANT;AAOjB3B,EAAAA,UAAU,EAAE4B,sBAAUG,MAPL;AAQjB9B,EAAAA,OAAO,EAAE2B,sBAAUE,IARF;AASjBE,EAAAA,MAAM,EAAEJ,sBAAUE,IATD;AAUjB5D,EAAAA,aAAa,EAAE0D,sBAAUK,MAVR;AAWjB9D,EAAAA,cAAc,EAAEyD,sBAAUK;AAXT,C;;AAoQrB,IAAMC,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBC,IAAAA,MAAM,EAAE;AACNC,MAAAA,QAAQ,EAAE,UADJ;AAENC,MAAAA,OAAO,EAAE,CAFH;AAGNC,MAAAA,UAAU,EAAE;AAHN,KADiB;AAMzBC,IAAAA,iBAAiB,EAAE;AACjBC,MAAAA,eAAe,EAAEN,KAAK,CAACO,OAAN,CAAcC,UAAd,CAAyBC,KADzB;AAEjBC,MAAAA,YAAY,EAAE,KAFG;AAGjBC,MAAAA,OAAO,EAAE,MAHQ;AAIjBC,MAAAA,OAAO,EAAE,MAJQ;AAKjBC,MAAAA,MAAM,sBAAeb,KAAK,CAACO,OAAN,CAAcO,IAAd,CAAmB,GAAnB,CAAf,CALW;AAMjBC,MAAAA,SAAS,EACP;AAPe,KANM;AAezB/B,IAAAA,QAAQ,EAAE;AACRkB,MAAAA,QAAQ,EAAE,UADF;AAERtD,MAAAA,IAAI,EAAE,GAFE;AAGRnC,MAAAA,KAAK,EAAE,aAHC;AAIRqC,MAAAA,GAAG,EAAE,IAJG;AAKRsD,MAAAA,UAAU,EAAE;AALJ,KAfe;AAsBzBnB,IAAAA,YAAY,EAAE;AACZkB,MAAAA,OAAO,EAAE;AADG,KAtBW;AAyBzBtB,IAAAA,OAAO,EAAE;AACPsB,MAAAA,OAAO,EAAE;AADF,KAzBgB;AA4BzBrB,IAAAA,aAAa,EAAE;AACbqB,MAAAA,OAAO,EAAE;AADI,KA5BU;AA+BzBvB,IAAAA,IAAI,EAAE;AACJsB,MAAAA,QAAQ,EAAE,UADN;AAEJW,MAAAA,MAAM,sBAAeb,KAAK,CAACO,OAAN,CAAcS,MAAd,CAAqBC,KAApC,CAFF;AAGJN,MAAAA,OAAO,EAAE,MAHL;AAIJP,MAAAA,UAAU,EAAE;AAJR,KA/BmB;AAqCzB,cAAQ;AACNF,MAAAA,QAAQ,EAAE,UADJ;AAENgB,MAAAA,KAAK,EAAE;AAFD,KArCiB;AAyCzBhC,IAAAA,cAAc,EAAE;AACdgB,MAAAA,QAAQ,EAAE,UADI;AAEdzF,MAAAA,KAAK,EAAE,aAFO;AAGdkG,MAAAA,OAAO,EAAE,MAHK;AAIdQ,MAAAA,UAAU,EAAE,QAJE;AAMd,4BAAsB;AACpBR,QAAAA,OAAO,EAAE;AADW;AANR,KAzCS;AAmDzB5C,IAAAA,MAAM,EAAE;AACN8C,MAAAA,MAAM,sBAAeb,KAAK,CAACO,OAAN,CAAca,OAAd,CAAsBC,IAArC;AADA,KAnDiB;AAsDzB5D,IAAAA,MAAM,EAAE;AACN6C,MAAAA,eAAe,EAAEN,KAAK,CAACO,OAAN,CAAca,OAAd,CAAsBC,IADjC;AAENC,MAAAA,MAAM,EAAE,YAFF;AAGNlF,MAAAA,MAAM,EAAE,MAHF;AAIN3B,MAAAA,KAAK,EAAE,KAJD;AAKNiG,MAAAA,YAAY,EAAE,CALR;AAMNa,MAAAA,UAAU,EAAE,KANN;AAONC,MAAAA,WAAW,EAAE,MAPP;AAQNb,MAAAA,OAAO,EAAE;AARH,KAtDiB;AAgEzBc,IAAAA,cAAc,EAAE;AACdC,MAAAA,SAAS,EAAE;AADG;AAhES,GAAZ;AAAA,CAAf;;eAqEe,wBAAW3B,MAAX,EAAmB5F,SAAnB,C","sourcesContent":["import LinearProgress from '@material-ui/core/LinearProgress';\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport classNames from 'classnames';\nimport debug from 'debug';\nimport { withStyles } from '@material-ui/core/styles';\nimport SlatePropTypes from 'slate-prop-types';\n\nconst log = debug('@pie-lib:editable-html:plugins:image:component');\n\nconst size = (s) => (s ? `${s}px` : 'auto');\n\nexport class Component extends React.Component {\n  static propTypes = {\n    node: SlatePropTypes.node.isRequired,\n    editor: PropTypes.shape({\n      change: PropTypes.func.isRequired,\n      value: PropTypes.object,\n    }).isRequired,\n    classes: PropTypes.object.isRequired,\n    attributes: PropTypes.object,\n    onFocus: PropTypes.func,\n    onBlur: PropTypes.func,\n    maxImageWidth: PropTypes.number,\n    maxImageHeight: PropTypes.number,\n  };\n\n  getWidth = (percent) => {\n    const multiplier = percent / 100;\n    return this.img.naturalWidth * multiplier;\n  };\n\n  getHeight = (percent) => {\n    const multiplier = percent / 100;\n    return this.img.naturalHeight * multiplier;\n  };\n\n  getPercentFromWidth = (width) => {\n    var floored = (width / this.img.naturalWidth) * 4;\n    return parseInt(floored.toFixed(0) * 25, 10);\n  };\n\n  applySizeData = () => {\n    const { node, editor } = this.props;\n\n    let update = node.data;\n\n    const w = update.get('width');\n    if (w) {\n      update = update.set('resizePercent', this.getPercentFromWidth(w));\n    }\n\n    log('[applySizeData] update: ', update);\n\n    if (!update.equals(node.data)) {\n      editor.change((c) => c.setNodeByKey(node.key, { data: update }));\n    }\n  };\n\n  initialiseResize = () => {\n    window.addEventListener('mousemove', this.startResizing, false);\n    window.addEventListener('mouseup', this.stopResizing, false);\n  };\n\n  componentDidMount() {\n    this.applySizeData();\n\n    const resizeHandle = this.resize;\n\n    if (resizeHandle) {\n      resizeHandle.addEventListener('mousedown', this.initialiseResize, false);\n    }\n  }\n\n  componentDidUpdate() {\n    this.applySizeData();\n  }\n\n  getSize(data) {\n    return {\n      width: size(data.get('width')),\n      height: size(data.get('height')),\n      objectFit: 'contain',\n    };\n  }\n\n  loadImage = () => {\n    let { maxImageWidth, maxImageHeight } = this.props || {};\n    maxImageWidth = maxImageWidth || 700;\n    maxImageHeight = maxImageHeight || 900;\n\n    const box = this.img;\n\n    //on first load\n    if (!box.style.width || box.style.width === 'auto') {\n      const dimensions = {\n        width: (box && box.naturalWidth) || 100,\n        height: (box && box.naturalHeight) || 100,\n      };\n\n      const { width, height } = this.updateImageDimensions(\n        dimensions,\n        {\n          width: dimensions.width < maxImageWidth ? dimensions.width : maxImageWidth,\n          height: dimensions.height < maxImageHeight ? dimensions.height : maxImageHeight,\n        },\n        true,\n      );\n\n      box.style.width = `${width}px`;\n      box.style.height = `${height}px`;\n\n      this.setState({\n        dimensions: { height: height, width: width },\n      });\n\n      const { node, editor } = this.props;\n\n      let update = node.data;\n\n      update = update.set('width', width);\n      update = update.set('height', height);\n\n      if (!update.equals(node.data)) {\n        editor.change((c) => c.setNodeByKey(node.key, { data: update }));\n      }\n    }\n  };\n\n  startResizing = (e) => {\n    const bounds = e.target.getBoundingClientRect();\n    const box = this.img;\n    const dimensions = {\n      width: (box && box.naturalWidth) || 100,\n      height: (box && box.naturalHeight) || 100,\n    };\n\n    const { width, height } = this.updateImageDimensions(\n      dimensions,\n      {\n        width: e.clientX - bounds.left,\n        height: e.clientY - bounds.top,\n      },\n      true,\n    );\n\n    const hasMinimumWidth = width > 50 && height > 50;\n    const hasDimensionsConstraints = width <= 700 && height <= 900;\n\n    if (hasMinimumWidth && hasDimensionsConstraints && box) {\n      box.style.width = `${width}px`;\n      box.style.height = `${height}px`;\n\n      this.setState({\n        dimensions: { height: height, width: width },\n      });\n\n      const { node, editor } = this.props;\n\n      let update = node.data;\n\n      update = update.set('width', width);\n      update = update.set('height', height);\n\n      if (!update.equals(node.data)) {\n        editor.change((c) => c.setNodeByKey(node.key, { data: update }));\n      }\n    }\n  };\n\n  stopResizing = () => {\n    window.removeEventListener('mousemove', this.startResizing, false);\n    window.removeEventListener('mouseup', this.stopResizing, false);\n  };\n\n  updateImageDimensions = (initialDim, nextDim, keepAspectRatio, resizeType) => {\n    // if we want to keep image aspect ratio\n    if (keepAspectRatio) {\n      const imageAspectRatio = initialDim.width / initialDim.height;\n\n      if (resizeType === 'height') {\n        // if we want to change image height => we update the width accordingly\n        return {\n          width: nextDim.height * imageAspectRatio,\n          height: nextDim.height,\n        };\n      }\n\n      // if we want to change image width => we update the height accordingly\n      return {\n        width: nextDim.width,\n        height: nextDim.width / imageAspectRatio,\n      };\n    }\n\n    // if we don't want to keep aspect ratio, we just update both values\n    return {\n      width: nextDim.width,\n      height: nextDim.height,\n    };\n  };\n\n  render() {\n    const { node, editor, classes, attributes, onFocus } = this.props;\n    const active = editor.value.isFocused && editor.value.selection.hasEdgeIn(node);\n    const src = node.data.get('src');\n    const loaded = node.data.get('loaded') !== false;\n    const deleteStatus = node.data.get('deleteStatus');\n    const alignment = node.data.get('alignment');\n    const percent = node.data.get('percent');\n    const alt = node.data.get('alt');\n    let justifyContent;\n\n    switch (alignment) {\n      case 'left':\n        justifyContent = 'flex-start';\n        break;\n\n      case 'center':\n        justifyContent = 'center';\n        break;\n\n      case 'right':\n        justifyContent = 'flex-end';\n        break;\n\n      default:\n        justifyContent = 'flex-start';\n        break;\n    }\n    log('[render] node.data:', node.data);\n\n    const size = this.getSize(node.data);\n\n    log('[render] style:', size);\n\n    const className = classNames(\n      classes.root,\n      !loaded && classes.loading,\n      deleteStatus === 'pending' && classes.pendingDelete,\n    );\n\n    const progressClasses = classNames(classes.progress, loaded && classes.hideProgress);\n\n    return [\n      <span key={'sp1'}>&nbsp;</span>,\n      <div key={'comp'} onFocus={onFocus} className={className} style={{ justifyContent }}>\n        <LinearProgress mode=\"determinate\" value={percent > 0 ? percent : 0} className={progressClasses} />\n        <div className={classes.imageContainer}>\n          <img\n            {...attributes}\n            className={classNames(classes.image, active && classes.active)}\n            ref={(ref) => {\n              this.img = ref;\n            }}\n            src={src}\n            style={size}\n            onLoad={this.loadImage}\n            alt={alt}\n          />\n          <div\n            ref={(ref) => {\n              this.resize = ref;\n            }}\n            className={classNames(classes.resize, 'resize')}\n          />\n        </div>\n      </div>,\n      <span key={'sp2'}>&nbsp;</span>,\n    ];\n  }\n}\n\nconst styles = (theme) => ({\n  portal: {\n    position: 'absolute',\n    opacity: 0,\n    transition: 'opacity 200ms linear',\n  },\n  floatingButtonRow: {\n    backgroundColor: theme.palette.background.paper,\n    borderRadius: '1px',\n    display: 'flex',\n    padding: '10px',\n    border: `solid 1px ${theme.palette.grey[200]}`,\n    boxShadow:\n      '0px 1px 5px 0px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 3px 1px -2px rgba(0, 0, 0, 0.12)',\n  },\n  progress: {\n    position: 'absolute',\n    left: '0',\n    width: 'fit-content',\n    top: '0%',\n    transition: 'opacity 200ms linear',\n  },\n  hideProgress: {\n    opacity: 0,\n  },\n  loading: {\n    opacity: 0.3,\n  },\n  pendingDelete: {\n    opacity: 0.3,\n  },\n  root: {\n    position: 'relative',\n    border: `solid 1px ${theme.palette.common.white}`,\n    display: 'flex',\n    transition: 'opacity 200ms linear',\n  },\n  delete: {\n    position: 'absolute',\n    right: 0,\n  },\n  imageContainer: {\n    position: 'relative',\n    width: 'fit-content',\n    display: 'flex',\n    alignItems: 'center',\n\n    '&&:hover > .resize': {\n      display: 'block',\n    },\n  },\n  active: {\n    border: `solid 1px ${theme.palette.primary.main}`,\n  },\n  resize: {\n    backgroundColor: theme.palette.primary.main,\n    cursor: 'col-resize',\n    height: '35px',\n    width: '5px',\n    borderRadius: 8,\n    marginLeft: '5px',\n    marginRight: '10px',\n    display: 'none',\n  },\n  drawableHeight: {\n    minHeight: 350,\n  },\n});\n\nexport default withStyles(styles)(Component);\n"],"file":"component.js"}

package/configure/node_modules/@pie-element/multiple-choice/node_modules/@pie-lib/pie-toolbox/code/editable-html/plugins/image/image-toolbar.js

@@ -0,0 +1,177 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.ImageToolbar = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _debug = _interopRequireDefault(require("debug"));
+
+var _reactDom = _interopRequireDefault(require("react-dom"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _toolbarButtons = require("../toolbar/toolbar-buttons");
+
+var _altDialog = _interopRequireDefault(require("./alt-dialog"));
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var log = (0, _debug["default"])('@pie-lib:editable-html:plugins:image:image-toolbar');
+
+var AlignmentButton = function AlignmentButton(_ref) {
+  var alignment = _ref.alignment,
+      active = _ref.active,
+      onClick = _ref.onClick;
+  return /*#__PURE__*/_react["default"].createElement(_toolbarButtons.MarkButton, {
+    active: active,
+    onToggle: function onToggle() {
+      return onClick(alignment);
+    },
+    label: alignment
+  }, alignment);
+};
+
+AlignmentButton.propTypes = {
+  alignment: _propTypes["default"].string.isRequired,
+  active: _propTypes["default"].bool.isRequired,
+  onClick: _propTypes["default"].func.isRequired
+};
+
+var ImageToolbar = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(ImageToolbar, _React$Component);
+
+  var _super = _createSuper(ImageToolbar);
+
+  function ImageToolbar() {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, ImageToolbar);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onAltTextDone", function (newAlt) {
+      log('[onAltTextDone]: alt:', newAlt);
+
+      _this.props.onChange({
+        alt: newAlt
+      }, true);
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onAlignmentClick", function (alignment) {
+      log('[onAlignmentClick]: alignment:', alignment);
+
+      _this.props.onChange({
+        alignment: alignment
+      });
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "renderDialog", function () {
+      var alt = _this.props.alt;
+      var popoverEl = document.createElement('div');
+
+      var el = /*#__PURE__*/_react["default"].createElement(_altDialog["default"], {
+        alt: alt,
+        onDone: _this.onAltTextDone
+      });
+
+      _reactDom["default"].render(el, popoverEl);
+
+      document.body.appendChild(popoverEl);
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(ImageToolbar, [{
+    key: "render",
+    value: function render() {
+      var _classNames,
+          _this2 = this;
+
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          alignment = _this$props.alignment,
+          imageLoaded = _this$props.imageLoaded,
+          disableImageAlignmentButtons = _this$props.disableImageAlignmentButtons;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.holder
+      }, !disableImageAlignmentButtons && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(AlignmentButton, {
+        alignment: 'left',
+        active: alignment === 'left',
+        onClick: this.onAlignmentClick
+      }), /*#__PURE__*/_react["default"].createElement(AlignmentButton, {
+        alignment: 'center',
+        active: alignment === 'center',
+        onClick: this.onAlignmentClick
+      }), /*#__PURE__*/_react["default"].createElement(AlignmentButton, {
+        alignment: 'right',
+        active: alignment === 'right',
+        onClick: this.onAlignmentClick
+      })), /*#__PURE__*/_react["default"].createElement("span", {
+        className: (0, _classnames["default"])((_classNames = {}, (0, _defineProperty2["default"])(_classNames, classes.disabled, !imageLoaded), (0, _defineProperty2["default"])(_classNames, classes.altButton, !disableImageAlignmentButtons), _classNames)),
+        onMouseDown: function onMouseDown(event) {
+          return imageLoaded && _this2.renderDialog(event);
+        }
+      }, "Alt text"));
+    }
+  }]);
+  return ImageToolbar;
+}(_react["default"].Component);
+
+exports.ImageToolbar = ImageToolbar;
+(0, _defineProperty2["default"])(ImageToolbar, "propTypes", {
+  onChange: _propTypes["default"].func.isRequired,
+  classes: _propTypes["default"].object.isRequired,
+  alignment: _propTypes["default"].string,
+  alt: _propTypes["default"].string,
+  imageLoaded: _propTypes["default"].bool,
+  disableImageAlignmentButtons: _propTypes["default"].bool
+});
+
+var styles = function styles(theme) {
+  return {
+    holder: {
+      paddingLeft: theme.spacing.unit,
+      display: 'flex',
+      alignItems: 'center'
+    },
+    disabled: {
+      opacity: 0.5
+    },
+    altButton: {
+      borderLeft: '1px solid grey',
+      paddingLeft: 8,
+      marginLeft: 4
+    }
+  };
+};
+
+var _default = (0, _styles.withStyles)(styles)(ImageToolbar);
+
+exports["default"] = _default;
+//# sourceMappingURL=image-toolbar.js.map

package/configure/node_modules/@pie-element/multiple-choice/node_modules/@pie-lib/pie-toolbox/code/editable-html/plugins/image/image-toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/code/editable-html/plugins/image/image-toolbar.jsx"],"names":["log","AlignmentButton","alignment","active","onClick","propTypes","PropTypes","string","isRequired","bool","func","ImageToolbar","newAlt","props","onChange","alt","popoverEl","document","createElement","el","onAltTextDone","ReactDOM","render","body","appendChild","classes","imageLoaded","disableImageAlignmentButtons","holder","onAlignmentClick","disabled","altButton","event","renderDialog","React","Component","object","styles","theme","paddingLeft","spacing","unit","display","alignItems","opacity","borderLeft","marginLeft"],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\nimport debug from 'debug';\nimport ReactDOM from 'react-dom';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\n\nimport { MarkButton } from '../toolbar/toolbar-buttons';\nimport AltDialog from './alt-dialog';\n\nconst log = debug('@pie-lib:editable-html:plugins:image:image-toolbar');\n\nconst AlignmentButton = ({ alignment, active, onClick }) => {\n  return (\n    <MarkButton active={active} onToggle={() => onClick(alignment)} label={alignment}>\n      {alignment}\n    </MarkButton>\n  );\n};\n\nAlignmentButton.propTypes = {\n  alignment: PropTypes.string.isRequired,\n  active: PropTypes.bool.isRequired,\n  onClick: PropTypes.func.isRequired,\n};\n\nexport class ImageToolbar extends React.Component {\n  static propTypes = {\n    onChange: PropTypes.func.isRequired,\n    classes: PropTypes.object.isRequired,\n    alignment: PropTypes.string,\n    alt: PropTypes.string,\n    imageLoaded: PropTypes.bool,\n    disableImageAlignmentButtons: PropTypes.bool,\n  };\n\n  onAltTextDone = (newAlt) => {\n    log('[onAltTextDone]: alt:', newAlt);\n\n    this.props.onChange({ alt: newAlt }, true);\n  };\n\n  onAlignmentClick = (alignment) => {\n    log('[onAlignmentClick]: alignment:', alignment);\n    this.props.onChange({ alignment });\n  };\n\n  renderDialog = () => {\n    const { alt } = this.props;\n    const popoverEl = document.createElement('div');\n\n    const el = <AltDialog alt={alt} onDone={this.onAltTextDone} />;\n\n    ReactDOM.render(el, popoverEl);\n\n    document.body.appendChild(popoverEl);\n  };\n\n  render() {\n    const { classes, alignment, imageLoaded, disableImageAlignmentButtons } = this.props;\n    return (\n      <div className={classes.holder}>\n        {!disableImageAlignmentButtons && (\n          <>\n            <AlignmentButton alignment={'left'} active={alignment === 'left'} onClick={this.onAlignmentClick} />\n            <AlignmentButton alignment={'center'} active={alignment === 'center'} onClick={this.onAlignmentClick} />\n            <AlignmentButton alignment={'right'} active={alignment === 'right'} onClick={this.onAlignmentClick} />\n          </>\n        )}\n        <span\n          className={classNames({\n            [classes.disabled]: !imageLoaded,\n            [classes.altButton]: !disableImageAlignmentButtons,\n          })}\n          onMouseDown={(event) => imageLoaded && this.renderDialog(event)}\n        >\n          Alt text\n        </span>\n      </div>\n    );\n  }\n}\n\nconst styles = (theme) => ({\n  holder: {\n    paddingLeft: theme.spacing.unit,\n    display: 'flex',\n    alignItems: 'center',\n  },\n  disabled: {\n    opacity: 0.5,\n  },\n  altButton: {\n    borderLeft: '1px solid grey',\n    paddingLeft: 8,\n    marginLeft: 4,\n  },\n});\n\nexport default withStyles(styles)(ImageToolbar);\n"],"file":"image-toolbar.js"}

package/configure/node_modules/@pie-element/multiple-choice/node_modules/@pie-lib/pie-toolbox/code/editable-html/plugins/image/index.js

@@ -0,0 +1,262 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = ImagePlugin;
+exports.serialization = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _slate = require("slate");
+
+var _Image = _interopRequireDefault(require("@material-ui/icons/Image"));
+
+var _component = _interopRequireDefault(require("./component"));
+
+var _imageToolbar = _interopRequireDefault(require("./image-toolbar"));
+
+var _insertImageHandler = _interopRequireDefault(require("./insert-image-handler"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _debug = _interopRequireDefault(require("debug"));
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var log = (0, _debug["default"])('@pie-lib:editable-html:plugins:image');
+
+function ImagePlugin(opts) {
+  var toolbar = opts.insertImageRequested && {
+    icon: /*#__PURE__*/_react["default"].createElement(_Image["default"], null),
+    onClick: function onClick(value, onChange) {
+      log('[toolbar] onClick');
+
+      var inline = _slate.Inline.create({
+        type: 'image',
+        isVoid: true,
+        data: {
+          loaded: false,
+          src: undefined
+        }
+      });
+
+      var change = value.change().insertInline(inline);
+      onChange(change);
+      opts.insertImageRequested(inline, function (onFinish, getValue) {
+        return new _insertImageHandler["default"](inline, onFinish, getValue, onChange);
+      });
+    },
+    supports: function supports(node) {
+      return node.object === 'inline' && node.type === 'image';
+    },
+    customToolbar: function customToolbar(node, value, onToolbarDone) {
+      var alignment = node.data.get('alignment');
+      var alt = node.data.get('alt');
+      var imageLoaded = node.data.get('loaded') !== false;
+
+      var onChange = function onChange(newValues, done) {
+        var update = _objectSpread(_objectSpread({}, node.data.toObject()), newValues);
+
+        var change = value.change().setNodeByKey(node.key, {
+          data: update
+        });
+        onToolbarDone(change, done);
+      };
+
+      var Tb = function Tb() {
+        return /*#__PURE__*/_react["default"].createElement(_imageToolbar["default"], {
+          disableImageAlignmentButtons: opts.disableImageAlignmentButtons,
+          alt: alt,
+          imageLoaded: imageLoaded,
+          alignment: alignment || 'left',
+          onChange: onChange
+        });
+      };
+
+      return Tb;
+    },
+    showDone: true
+  };
+  return {
+    name: 'image',
+    toolbar: toolbar,
+    deleteNode: function deleteNode(e, node, value, onChange) {
+      e.preventDefault();
+
+      if (opts.onDelete) {
+        var update = node.data.merge(_slate.Data.create({
+          deleteStatus: 'pending'
+        }));
+        var change = value.change().setNodeByKey(node.key, {
+          data: update
+        });
+        onChange(change);
+        opts.onDelete(node, function (err, v) {
+          if (!err) {
+            change = v.change().removeNodeByKey(node.key);
+          } else {
+            log('[error]: ', err);
+            change = v.change().setNodeByKey(node.key, node.data.merge(_slate.Data.create({
+              deleteStatus: 'failed'
+            })));
+          }
+
+          onChange(change);
+        });
+      } else {
+        var _change = value.change().removeNodeByKey(node.key);
+
+        onChange(_change);
+      }
+    },
+    stopReset: function stopReset(value) {
+      var imgPendingInsertion = value.document.findDescendant(function (n) {
+        if (n.type !== 'image') {
+          return;
+        }
+
+        return n.data.get('loaded') === false;
+      });
+      /** don't reset if there is an image pending insertion */
+
+      return imgPendingInsertion !== undefined && imgPendingInsertion !== null;
+    },
+    renderNode: function renderNode(props) {
+      if (props.node.type === 'image') {
+        var all = Object.assign({
+          onDelete: opts.onDelete,
+          onFocus: opts.onFocus,
+          onBlur: opts.onBlur,
+          maxImageWidth: opts.maxImageWidth,
+          maxImageHeight: opts.maxImageHeight
+        }, props);
+        return /*#__PURE__*/_react["default"].createElement(_component["default"], all);
+      }
+    },
+    normalizeNode: function normalizeNode(node) {
+      var textNodeMap = {};
+      var updateNodesArray = [];
+      var index = 0;
+      if (node.object !== 'document') return;
+      node.findDescendant(function (d) {
+        if (d.object === 'text') {
+          textNodeMap[index] = d;
+        }
+
+        if (d.type === 'image') {
+          if (index > 0 && textNodeMap[index - 1] && textNodeMap[index - 1].text === '') {
+            updateNodesArray.push(textNodeMap[index - 1]);
+          }
+        }
+
+        index++;
+      });
+      if (!updateNodesArray.length) return;
+      return function (change) {
+        change.withoutNormalization(function () {
+          updateNodesArray.forEach(function (n) {
+            return change.insertTextByKey(n.key, 0, ' ');
+          });
+        });
+      };
+    }
+  };
+}
+
+var serialization = {
+  deserialize: function deserialize(el
+  /*, next*/
+  ) {
+    var name = el.tagName.toLowerCase();
+    if (name !== 'img') return;
+    log('deserialize: ', name);
+    var style = el.style || {
+      width: '',
+      height: '',
+      margin: '',
+      justifyContent: ''
+    };
+    var width = parseInt(style.width.replace('px', ''), 10) || null;
+    var height = parseInt(style.height.replace('px', ''), 10) || null;
+    var out = {
+      object: 'inline',
+      type: 'image',
+      isVoid: true,
+      data: {
+        src: el.getAttribute('src'),
+        width: width,
+        height: height,
+        margin: el.style.margin,
+        justifyContent: el.style.justifyContent,
+        alignment: el.getAttribute('alignment'),
+        alt: el.getAttribute('alt')
+      }
+    };
+    log('return object: ', out);
+    return out;
+  },
+  serialize: function serialize(object
+  /*, children*/
+  ) {
+    if (object.type !== 'image') return;
+    var data = object.data;
+    var src = data.get('src');
+    var width = data.get('width');
+    var height = data.get('height');
+    var alignment = data.get('alignment') || 'left';
+    var margin = data.get('margin');
+    var justifyContent = data.get('margin');
+    var alt = data.get('alt');
+    var style = {};
+
+    if (width) {
+      style.width = "".concat(width, "px");
+    }
+
+    if (height) {
+      style.height = "".concat(height, "px");
+    }
+
+    style.margin = margin;
+    style.justifyContent = justifyContent;
+
+    if (alignment) {
+      switch (alignment) {
+        case 'left':
+          style.justifyContent = 'flex-start';
+          style.margin = '0';
+          break;
+
+        case 'center':
+          style.justifyContent = 'center';
+          style.margin = '0 auto';
+          break;
+
+        case 'right':
+          style.justifyContent = 'flex-end';
+          style.margin = 'auto 0 0 auto';
+          break;
+
+        default:
+          style.justifyContent = 'flex-start';
+          break;
+      }
+    }
+
+    style.objectFit = 'contain';
+    var props = {
+      src: src,
+      style: style,
+      alignment: alignment,
+      alt: alt
+    };
+    return /*#__PURE__*/_react["default"].createElement("img", props);
+  }
+};
+exports.serialization = serialization;
+//# sourceMappingURL=index.js.map

package/configure/node_modules/@pie-element/multiple-choice/node_modules/@pie-lib/pie-toolbox/code/editable-html/plugins/image/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/code/editable-html/plugins/image/index.jsx"],"names":["log","ImagePlugin","opts","toolbar","insertImageRequested","icon","onClick","value","onChange","inline","Inline","create","type","isVoid","data","loaded","src","undefined","change","insertInline","onFinish","getValue","InsertImageHandler","supports","node","object","customToolbar","onToolbarDone","alignment","get","alt","imageLoaded","newValues","done","update","toObject","setNodeByKey","key","Tb","disableImageAlignmentButtons","showDone","name","deleteNode","e","preventDefault","onDelete","merge","Data","deleteStatus","err","v","removeNodeByKey","stopReset","imgPendingInsertion","document","findDescendant","n","renderNode","props","all","Object","assign","onFocus","onBlur","maxImageWidth","maxImageHeight","normalizeNode","textNodeMap","updateNodesArray","index","d","text","push","length","withoutNormalization","forEach","insertTextByKey","serialization","deserialize","el","tagName","toLowerCase","style","width","height","margin","justifyContent","parseInt","replace","out","getAttribute","serialize","objectFit"],"mappings":"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","sourcesContent":["import { Data, Inline } from 'slate';\n\nimport Image from '@material-ui/icons/Image';\nimport ImageComponent from './component';\nimport ImageToolbar from './image-toolbar';\nimport InsertImageHandler from './insert-image-handler';\nimport React from 'react';\nimport debug from 'debug';\n\nconst log = debug('@pie-lib:editable-html:plugins:image');\n\nexport default function ImagePlugin(opts) {\n  const toolbar = opts.insertImageRequested && {\n    icon: <Image />,\n    onClick: (value, onChange) => {\n      log('[toolbar] onClick');\n      const inline = Inline.create({\n        type: 'image',\n        isVoid: true,\n        data: {\n          loaded: false,\n          src: undefined,\n        },\n      });\n\n      const change = value.change().insertInline(inline);\n\n      onChange(change);\n      opts.insertImageRequested(\n        inline,\n        (onFinish, getValue) => new InsertImageHandler(inline, onFinish, getValue, onChange),\n      );\n    },\n    supports: (node) => node.object === 'inline' && node.type === 'image',\n    customToolbar: (node, value, onToolbarDone) => {\n      const alignment = node.data.get('alignment');\n      const alt = node.data.get('alt');\n      const imageLoaded = node.data.get('loaded') !== false;\n      const onChange = (newValues, done) => {\n        const update = {\n          ...node.data.toObject(),\n          ...newValues,\n        };\n\n        const change = value.change().setNodeByKey(node.key, { data: update });\n        onToolbarDone(change, done);\n      };\n\n      const Tb = () => (\n        <ImageToolbar\n          disableImageAlignmentButtons={opts.disableImageAlignmentButtons}\n          alt={alt}\n          imageLoaded={imageLoaded}\n          alignment={alignment || 'left'}\n          onChange={onChange}\n        />\n      );\n      return Tb;\n    },\n    showDone: true,\n  };\n\n  return {\n    name: 'image',\n    toolbar,\n    deleteNode: (e, node, value, onChange) => {\n      e.preventDefault();\n      if (opts.onDelete) {\n        const update = node.data.merge(Data.create({ deleteStatus: 'pending' }));\n\n        let change = value.change().setNodeByKey(node.key, { data: update });\n\n        onChange(change);\n        opts.onDelete(node, (err, v) => {\n          if (!err) {\n            change = v.change().removeNodeByKey(node.key);\n          } else {\n            log('[error]: ', err);\n            change = v.change().setNodeByKey(node.key, node.data.merge(Data.create({ deleteStatus: 'failed' })));\n          }\n          onChange(change);\n        });\n      } else {\n        let change = value.change().removeNodeByKey(node.key);\n        onChange(change);\n      }\n    },\n    stopReset: (value) => {\n      const imgPendingInsertion = value.document.findDescendant((n) => {\n        if (n.type !== 'image') {\n          return;\n        }\n        return n.data.get('loaded') === false;\n      });\n      /** don't reset if there is an image pending insertion */\n      return imgPendingInsertion !== undefined && imgPendingInsertion !== null;\n    },\n    renderNode(props) {\n      if (props.node.type === 'image') {\n        const all = Object.assign(\n          {\n            onDelete: opts.onDelete,\n            onFocus: opts.onFocus,\n            onBlur: opts.onBlur,\n            maxImageWidth: opts.maxImageWidth,\n            maxImageHeight: opts.maxImageHeight,\n          },\n          props,\n        );\n        return <ImageComponent {...all} />;\n      }\n    },\n    normalizeNode: (node) => {\n      const textNodeMap = {};\n      const updateNodesArray = [];\n      let index = 0;\n\n      if (node.object !== 'document') return;\n\n      node.findDescendant((d) => {\n        if (d.object === 'text') {\n          textNodeMap[index] = d;\n        }\n\n        if (d.type === 'image') {\n          if (index > 0 && textNodeMap[index - 1] && textNodeMap[index - 1].text === '') {\n            updateNodesArray.push(textNodeMap[index - 1]);\n          }\n        }\n\n        index++;\n      });\n\n      if (!updateNodesArray.length) return;\n\n      return (change) => {\n        change.withoutNormalization(() => {\n          updateNodesArray.forEach((n) => change.insertTextByKey(n.key, 0, ' '));\n        });\n      };\n    },\n  };\n}\n\nexport const serialization = {\n  deserialize(el /*, next*/) {\n    const name = el.tagName.toLowerCase();\n    if (name !== 'img') return;\n\n    log('deserialize: ', name);\n    const style = el.style || { width: '', height: '', margin: '', justifyContent: '' };\n    const width = parseInt(style.width.replace('px', ''), 10) || null;\n    const height = parseInt(style.height.replace('px', ''), 10) || null;\n\n    const out = {\n      object: 'inline',\n      type: 'image',\n      isVoid: true,\n      data: {\n        src: el.getAttribute('src'),\n        width,\n        height,\n        margin: el.style.margin,\n        justifyContent: el.style.justifyContent,\n        alignment: el.getAttribute('alignment'),\n        alt: el.getAttribute('alt'),\n      },\n    };\n    log('return object: ', out);\n    return out;\n  },\n  serialize(object /*, children*/) {\n    if (object.type !== 'image') return;\n\n    const { data } = object;\n    const src = data.get('src');\n    const width = data.get('width');\n    const height = data.get('height');\n    const alignment = data.get('alignment') || 'left';\n    const margin = data.get('margin');\n    const justifyContent = data.get('margin');\n    const alt = data.get('alt');\n    const style = {};\n    if (width) {\n      style.width = `${width}px`;\n    }\n\n    if (height) {\n      style.height = `${height}px`;\n    }\n\n    style.margin = margin;\n    style.justifyContent = justifyContent;\n\n    if (alignment) {\n      switch (alignment) {\n        case 'left':\n          style.justifyContent = 'flex-start';\n          style.margin = '0';\n          break;\n        case 'center':\n          style.justifyContent = 'center';\n          style.margin = '0 auto';\n          break;\n        case 'right':\n          style.justifyContent = 'flex-end';\n          style.margin = 'auto 0 0 auto';\n          break;\n        default:\n          style.justifyContent = 'flex-start';\n          break;\n      }\n    }\n\n    style.objectFit = 'contain';\n\n    const props = {\n      src,\n      style,\n      alignment,\n      alt,\n    };\n\n    return <img {...props} />;\n  },\n};\n"],"file":"index.js"}