fix: use btoa instead of Buffer.from (#327)

dist/ui.html

@@ -661,7 +661,7 @@
     display: grid;
     grid-template-columns: repeat(3, 1fr);
   }
-`,vr=()=>{const{settings:n,updateSettings:t}=(0,e.useContext)(on),{tokens:r,setTokens:a}=(0,e.useContext)(sn),{figmaUIApi:l}=(0,e.useContext)(ln),o=(0,e.useRef)();return e.useEffect((()=>{const{accessToken:e}=n,t=hr(n,["accessToken"]);l.postMessage({pluginMessage:{command:an.saveSettings,payload:{settings:t,accessToken:e}}},"*")}),[n]),e.createElement("form",{onSubmit:e=>{if(e.preventDefault(),!0===e.target.checkValidity()){const{accessToken:e}=n,t=hr(n,["accessToken"]);if(l.postMessage({pluginMessage:{command:an.saveSettings,payload:{settings:t,accessToken:e}}},"*"),!r||"[]"===r||"{}"===r)return void l.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:"No tokens to export!"}}},"*");const i=pr(r,t);a(i),((e,n,t)=>{if("[]"!==t)try{const r=new Blob([t],{type:"application/json"}),a=URL.createObjectURL(r);n.href=a,n.click(),URL.revokeObjectURL(a),e.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:"🎉 Design token export successful!"}}},"*")}catch(n){e.postMessage({pluginMessage:{payload:{notification:"⛔️ Design token failed!"}}},"*"),console.error("Export error: ",n)}else e.postMessage({pluginMessage:{payload:{notification:"⛔️ No design token detected!"}}},"*")})(parent,o.current,gr(i,t.compression))}},className:mr},e.createElement(nn,{size:"xlarge",weight:"bold"},"File Export settings"),e.createElement(gn,null,e.createElement(qe,{label:"Compress JSON output file",type:"switch",checked:n.compression,onChange:e=>t((n=>{n.compression=e}))}),e.createElement(Be,{width:240,label:"Compression removes line breaks and whitespace from the json string"}),"standard"===n.tokenFormat&&e.createElement(e.Fragment,null,e.createElement(qe,{label:"Exclude extension property",type:"switch",checked:n.excludeExtensionProp,onChange:e=>t((n=>{n.excludeExtensionProp=e}))}),e.createElement(Be,{width:240,label:"The extension property holds additional information about the token"}))),e.createElement(nn,{size:"large",weight:"bold"},"Include types in export"),e.createElement("div",{className:"grid-3-col"},Object.entries(ur).map((([,{key:r,label:a,exclude:l}])=>(void 0===l||!l.includes(n.tokenFormat))&&e.createElement(qe,{key:r,label:a,checked:n.exports[r],onChange:e=>t((n=>{n.exports[r]=e}))})))),e.createElement(fn,null,e.createElement(bn,{align:"start",href:"https://github.com/lukasoppermann/design-tokens#design-tokens"},"Documentation"),e.createElement(He,{type:"submit",autofocus:!0},"Export")),e.createElement("a",{ref:o,download:`${n.filename}${n.extension}`,title:`${n.filename}${n.extension}`}))};class br{constructor(e){this.baseUrl=e.baseUrl,this.token=e.token}upload({client_payload:e},{reference:n},t){return function(e,n,t,r){return new(t||(t=Promise))((function(a,l){function o(e){try{s(r.next(e))}catch(e){l(e)}}function i(e){try{s(r.throw(e))}catch(e){l(e)}}function s(e){var n;e.done?a(e.value):(n=e.value,n instanceof t?n:new t((function(e){e(n)}))).then(o,i)}s((r=r.apply(e,n||[])).next())}))}(this,void 0,void 0,(function*(){const r=(e=>{const n=(new TextEncoder).encode(e),t=Array.from(n,(e=>String.fromCodePoint(e))).join("");return Buffer.from(t,"binary").toString("base64")})(e.tokens),a=encodeURIComponent(e.filename);let l;try{l=yield this._checkFile(a,n)}catch(e){return void(e&&e.request&&401===e.code&&t.onLoaded(e.request))}const o=new XMLHttpRequest;o.onerror=e=>t.onError(),o.onload=e=>t.onLoaded(e.target),this._uploadFile({request:o,content:r,commitMessage:e.commitMessage,filepath:a,branch:n,isFileExist:l})}))}_checkFile(e,n){return new Promise(((t,r)=>{const a=new XMLHttpRequest;a.open("GET",`${this.baseUrl}/repository/files/${e}?ref=${n}`),this._setRequestHeader(a),a.onreadystatechange=e=>{if(a.readyState!==XMLHttpRequest.DONE)return;const n=a.status;200!==n?404!==n?r({code:n,message:a.response,request:a}):t(!1):t(!0)},a.send()}))}_uploadFile(e){const{isFileExist:n,request:t,branch:r,content:a,commitMessage:l,filepath:o}=e,i={branch:r,content:a,commit_message:l||`Design token update at ${Date.now()}`,encoding:"base64"},s=encodeURIComponent(o);t.open(n?"PUT":"POST",`${this.baseUrl}/repository/files/${s}`),this._setRequestHeader(t),t.send(JSON.stringify(i))}_setRequestHeader(e){e.setRequestHeader("Authorization",`Bearer ${this.token}`),e.setRequestHeader("Content-Type","application/json")}}const yr=e=>401===e.status?"🚨 401: Check your access token":404===e.status?"🚨 404: Check your server url, auth type and the access token":e.status>399?`🚨 ${e.status}: An error occurred, please check the console for details.`:"🎉 Design tokens pushed to server!";function xr(){parent.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:"🚨 An error occurred while sending the tokens: check your settings & your server."}}},"*")}function wr(e){parent.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:yr(e)}}},"*")}const kr=(e,n,t)=>{if(""===n.url&&e.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:"🚨 No server url was provided, push aborted!"}}},"*"),n.authType===cn.key.authType.gitlabCommit)return void new br({baseUrl:n.url,token:n.accessToken}).upload(t,n,{onError:xr,onLoaded:wr});const r=new XMLHttpRequest;r.open("POST",n.url),((e,n)=>{n.authType!==cn.key.authType.gitlabToken&&(e.setRequestHeader("Accept",n.acceptHeader||"application/vnd.github.everest-preview+json"),e.setRequestHeader("Content-Type",n.contentType||"text/plain;charset=UTF-8")),""!==n.accessToken&&""!==n.authType&&n.authType!==cn.key.authType.gitlabToken&&e.setRequestHeader("Authorization",`${n.authType} ${n.accessToken}`)})(r,n),(e=>{e.onerror=e=>{xr()},e.onload=e=>{wr(e.target)}})(r);const a=((e,n)=>{let t;return e.authType===cn.key.authType.gitlabToken?(t=new FormData,t.append("token",e.accessToken),t.append("ref",e.reference),t.append("variables[FIGMA_EVENT_TYPE]",n.event_type),t.append("variables[FIGMA_CLIENT_PAYLOAD_TOKENS]",n.client_payload.tokens),t.append("variables[FIGMA_CLIENT_PAYLOAD_FILENAME]",n.client_payload.filename),t.append("variables[FIGMA_CLIENT_PAYLOAD_COMMIT_MESSAGE]",n.client_payload.commitMessage)):t=JSON.stringify(n,null,2),t})(n,t);r.send(a)};const Er=De`
+`,vr=()=>{const{settings:n,updateSettings:t}=(0,e.useContext)(on),{tokens:r,setTokens:a}=(0,e.useContext)(sn),{figmaUIApi:l}=(0,e.useContext)(ln),o=(0,e.useRef)();return e.useEffect((()=>{const{accessToken:e}=n,t=hr(n,["accessToken"]);l.postMessage({pluginMessage:{command:an.saveSettings,payload:{settings:t,accessToken:e}}},"*")}),[n]),e.createElement("form",{onSubmit:e=>{if(e.preventDefault(),!0===e.target.checkValidity()){const{accessToken:e}=n,t=hr(n,["accessToken"]);if(l.postMessage({pluginMessage:{command:an.saveSettings,payload:{settings:t,accessToken:e}}},"*"),!r||"[]"===r||"{}"===r)return void l.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:"No tokens to export!"}}},"*");const i=pr(r,t);a(i),((e,n,t)=>{if("[]"!==t)try{const r=new Blob([t],{type:"application/json"}),a=URL.createObjectURL(r);n.href=a,n.click(),URL.revokeObjectURL(a),e.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:"🎉 Design token export successful!"}}},"*")}catch(n){e.postMessage({pluginMessage:{payload:{notification:"⛔️ Design token failed!"}}},"*"),console.error("Export error: ",n)}else e.postMessage({pluginMessage:{payload:{notification:"⛔️ No design token detected!"}}},"*")})(parent,o.current,gr(i,t.compression))}},className:mr},e.createElement(nn,{size:"xlarge",weight:"bold"},"File Export settings"),e.createElement(gn,null,e.createElement(qe,{label:"Compress JSON output file",type:"switch",checked:n.compression,onChange:e=>t((n=>{n.compression=e}))}),e.createElement(Be,{width:240,label:"Compression removes line breaks and whitespace from the json string"}),"standard"===n.tokenFormat&&e.createElement(e.Fragment,null,e.createElement(qe,{label:"Exclude extension property",type:"switch",checked:n.excludeExtensionProp,onChange:e=>t((n=>{n.excludeExtensionProp=e}))}),e.createElement(Be,{width:240,label:"The extension property holds additional information about the token"}))),e.createElement(nn,{size:"large",weight:"bold"},"Include types in export"),e.createElement("div",{className:"grid-3-col"},Object.entries(ur).map((([,{key:r,label:a,exclude:l}])=>(void 0===l||!l.includes(n.tokenFormat))&&e.createElement(qe,{key:r,label:a,checked:n.exports[r],onChange:e=>t((n=>{n.exports[r]=e}))})))),e.createElement(fn,null,e.createElement(bn,{align:"start",href:"https://github.com/lukasoppermann/design-tokens#design-tokens"},"Documentation"),e.createElement(He,{type:"submit",autofocus:!0},"Export")),e.createElement("a",{ref:o,download:`${n.filename}${n.extension}`,title:`${n.filename}${n.extension}`}))};class br{constructor(e){this.baseUrl=e.baseUrl,this.token=e.token}upload({client_payload:e},{reference:n},t){return function(e,n,t,r){return new(t||(t=Promise))((function(a,l){function o(e){try{s(r.next(e))}catch(e){l(e)}}function i(e){try{s(r.throw(e))}catch(e){l(e)}}function s(e){var n;e.done?a(e.value):(n=e.value,n instanceof t?n:new t((function(e){e(n)}))).then(o,i)}s((r=r.apply(e,n||[])).next())}))}(this,void 0,void 0,(function*(){const r=(e=>{const n=(new TextEncoder).encode(e),t=Array.from(n,(e=>String.fromCodePoint(e))).join("");return btoa(t)})(e.tokens),a=encodeURIComponent(e.filename);let l;try{l=yield this._checkFile(a,n)}catch(e){return void(e&&e.request&&401===e.code&&t.onLoaded(e.request))}const o=new XMLHttpRequest;o.onerror=e=>t.onError(),o.onload=e=>t.onLoaded(e.target),this._uploadFile({request:o,content:r,commitMessage:e.commitMessage,filepath:a,branch:n,isFileExist:l})}))}_checkFile(e,n){return new Promise(((t,r)=>{const a=new XMLHttpRequest;a.open("GET",`${this.baseUrl}/repository/files/${e}?ref=${n}`),this._setRequestHeader(a),a.onreadystatechange=e=>{if(a.readyState!==XMLHttpRequest.DONE)return;const n=a.status;200!==n?404!==n?r({code:n,message:a.response,request:a}):t(!1):t(!0)},a.send()}))}_uploadFile(e){const{isFileExist:n,request:t,branch:r,content:a,commitMessage:l,filepath:o}=e,i={branch:r,content:a,commit_message:l||`Design token update at ${Date.now()}`,encoding:"base64"},s=encodeURIComponent(o);t.open(n?"PUT":"POST",`${this.baseUrl}/repository/files/${s}`),this._setRequestHeader(t),t.send(JSON.stringify(i))}_setRequestHeader(e){e.setRequestHeader("Authorization",`Bearer ${this.token}`),e.setRequestHeader("Content-Type","application/json")}}const yr=e=>401===e.status?"🚨 401: Check your access token":404===e.status?"🚨 404: Check your server url, auth type and the access token":e.status>399?`🚨 ${e.status}: An error occurred, please check the console for details.`:"🎉 Design tokens pushed to server!";function xr(){parent.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:"🚨 An error occurred while sending the tokens: check your settings & your server."}}},"*")}function wr(e){parent.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:yr(e)}}},"*")}const kr=(e,n,t)=>{if(""===n.url&&e.postMessage({pluginMessage:{command:an.closePlugin,payload:{notification:"🚨 No server url was provided, push aborted!"}}},"*"),n.authType===cn.key.authType.gitlabCommit)return void new br({baseUrl:n.url,token:n.accessToken}).upload(t,n,{onError:xr,onLoaded:wr});const r=new XMLHttpRequest;r.open("POST",n.url),((e,n)=>{n.authType!==cn.key.authType.gitlabToken&&(e.setRequestHeader("Accept",n.acceptHeader||"application/vnd.github.everest-preview+json"),e.setRequestHeader("Content-Type",n.contentType||"text/plain;charset=UTF-8")),""!==n.accessToken&&""!==n.authType&&n.authType!==cn.key.authType.gitlabToken&&e.setRequestHeader("Authorization",`${n.authType} ${n.accessToken}`)})(r,n),(e=>{e.onerror=e=>{xr()},e.onload=e=>{wr(e.target)}})(r);const a=((e,n)=>{let t;return e.authType===cn.key.authType.gitlabToken?(t=new FormData,t.append("token",e.accessToken),t.append("ref",e.reference),t.append("variables[FIGMA_EVENT_TYPE]",n.event_type),t.append("variables[FIGMA_CLIENT_PAYLOAD_TOKENS]",n.client_payload.tokens),t.append("variables[FIGMA_CLIENT_PAYLOAD_FILENAME]",n.client_payload.filename),t.append("variables[FIGMA_CLIENT_PAYLOAD_COMMIT_MESSAGE]",n.client_payload.commitMessage)):t=JSON.stringify(n,null,2),t})(n,t);r.send(a)};const Er=De`
   display: flex;
   flex-direction: column;
   h1:first-child {