Penpot/penpot-exporter-figma-plugin
0
Fork 0
mirror of https://github.com/penpot/penpot-exporter-figma-plugin.git synced 2025-01-18 05:22:28 -05:00
Code Issues Activity

removed debug

Browse source
This commit is contained in:
Alex Sánchez 2024-04-08 13:20:13 +02:00
parent 09e714afdc
commit 80ac20cd71
No known key found for this signature in database
GPG key ID: 68A95170EEB87E16
1 changed files with 1 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
src/ui.tsx
View file

@ -20,19 +20,13 @@ type FigmaImageData = {
}; };
type PenpotExporterState = { type PenpotExporterState = {
isDebug: boolean;
penpotFileData: string;
missingFonts: Set<string>; missingFonts: Set<string>;
figmaFileData: string;
figmaRootNode: NodeData | null; figmaRootNode: NodeData | null;
images: { [id: string]: FigmaImageData }; images: { [id: string]: FigmaImageData };
}; };
export default class PenpotExporter extends React.Component<unknown, PenpotExporterState> { export default class PenpotExporter extends React.Component<unknown, PenpotExporterState> {
state: PenpotExporterState = { state: PenpotExporterState = {
isDebug: false,
penpotFileData: '',
figmaFileData: '',
missingFonts: new Set(), missingFonts: new Set(),
figmaRootNode: null, figmaRootNode: null,
images: {} images: {}
@ -379,16 +373,7 @@ export default class PenpotExporter extends React.Component<unknown, PenpotExpor
} }
onCreatePenpot = () => { onCreatePenpot = () => {
const file = this.createPenpotFile(); this.createPenpotFile().export();
const penpotFileMap = file.asMap();
this.setState(() => ({
penpotFileData: JSON.stringify(
penpotFileMap,
(key, value) => (value instanceof Map ? [...value] : value),
4
)
}));
file.export();
}; };
onCancel = () => { onCancel = () => {
@ -399,11 +384,6 @@ export default class PenpotExporter extends React.Component<unknown, PenpotExpor
onMessage = (event: any) => { onMessage = (event: any) => {
if (event.data.pluginMessage.type == 'FIGMAFILE') { if (event.data.pluginMessage.type == 'FIGMAFILE') {
this.setState(() => ({ this.setState(() => ({
figmaFileData: JSON.stringify(
event.data.pluginMessage.data,
(key, value) => (value instanceof Map ? [...value] : value),
4
),
figmaRootNode: event.data.pluginMessage.data figmaRootNode: event.data.pluginMessage.data
})); }));
} else if (event.data.pluginMessage.type == 'IMAGE') { } else if (event.data.pluginMessage.type == 'IMAGE') {
@ -436,19 +416,9 @@ export default class PenpotExporter extends React.Component<unknown, PenpotExpor
width = 400; width = 400;
} }
if (this.state.isDebug) {
height += 600;
width = 800;
}
parent.postMessage({ pluginMessage: { type: 'resize', width: width, height: height } }, '*'); parent.postMessage({ pluginMessage: { type: 'resize', width: width, height: height } }, '*');
}; };
toggleDebug = (event: React.ChangeEvent<HTMLInputElement>) => {
const isDebug = event.currentTarget.checked;
this.setState(() => ({ isDebug: isDebug }));
};
renderFontWarnings = () => { renderFontWarnings = () => {
return ( return (
<ul> <ul>
@ -476,31 +446,7 @@ export default class PenpotExporter extends React.Component<unknown, PenpotExpor
<small>Ensure fonts are installed in Penpot before importing.</small> <small>Ensure fonts are installed in Penpot before importing.</small>
<div id="missing-fonts-list">{this.renderFontWarnings()}</div> <div id="missing-fonts-list">{this.renderFontWarnings()}</div>
</div> </div>
<div>
<input type="checkbox" id="chkDebug" name="chkDebug" onChange={this.toggleDebug} />
<label htmlFor="chkDebug">Show debug data</label>
</div>
</section> </section>
<div style={{ display: this.state.isDebug ? '' : 'none' }}>
<section>
<textarea
style={{ width: '790px', height: '270px' }}
id="figma-file-data"
value={this.state.figmaFileData}
readOnly
/>
<label htmlFor="figma-file-data">Figma file data</label>
</section>
<section>
<textarea
style={{ width: '790px', height: '270px' }}
id="penpot-file-data"
value={this.state.penpotFileData}
readOnly
/>
<label htmlFor="penpot-file-data">Penpot file data</label>
</section>
</div>
<footer> <footer>
<button className="brand" onClick={this.onCreatePenpot}> <button className="brand" onClick={this.onCreatePenpot}>
Export Export