Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion dist/ui.html
Original file line number Diff line number Diff line change
Expand Up @@ -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 {
Expand Down
Loading
Loading