Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
function buildLibrary(designInfo, newSketch) {
const libraryPage = new Page({
name: "Library"
});
var offset = 20;
var lastX = 20;
for (const library of designInfo.libraries) {
const artboard = new Artboard({
name: library.libraryName
});
switch (library.libraryName) {
case "Color":
buildColorLibrary(library.libraryPresets, newSketch, artboard);
break;
case "FontSize":
buildFontSizeLibrary(library.libraryPresets, newSketch, artboard);
break;
default:
break;
}
artboard.frame.x = lastX;
lastX = lastX + artboard.frame.width + offset;
function buildFlows(designInfo, newSketch) {
for (const flow of designInfo.flows) {
const page = new Page({
name: flow.flowName
});
if (flow.interactions == null) {
continue;
}
var index = 1;
for (const interaction of flow.interactions) {
let seeComponentName = interaction.see.componentName.replace(/\"/g, "");
let seeComponentData = interaction.see.data.replace(/\"/g, "");
const artboard = new Artboard({
name: seeComponentData + seeComponentName,
frame: {
width: '320px',
height: '480px',
x: 360 * index + 'px'
},
});
page.addArtboard(artboard);
index++;
reactIndex = 0;
let lastFrame = {
x: 0,
y: 0
};
],
},
width: 320,
height: 400,
x: 120,
y: addYPos(40),
})
const artboardFrame = {
width: 1280,
height: addYPos(520),
x: 0,
y: 0
}
const artboard = new Artboard({
name: 'Telements',
layers: [
textVersion,
textTelements,
textGeneratedFile,
rectangleDivider,
textComponents,
textAlert,
rectangleAlertBackground,
textButton,
rectangleButton,
textCard,
rectangleCard,
],
frame: artboardFrame,
});
x: 360 * index + 'px'
},
});
page.addArtboard(artboard);
index++;
reactIndex = 0;
let lastFrame = {
x: 0,
y: 0
};
for (const react of interaction.react) {
let componentName = react.reactComponentName.replace(/\"/g, "");
let componentData = react.reactComponentData.replace(/\"/g, "");
const artboard1 = new Artboard({
name: componentData + componentName,
frame: {
width: '320px',
height: '480px',
x: 360 * index + 'px',
y: lastFrame.y + reactIndex * 20 + 'px'
},
});
lastFrame = {
y: artboard1.frame.height
};
if (components[componentName]) {
if (components[componentName].width) {
artboard1.frame.width = components[componentName].width
}
});
const rectangleDivider = new Rectangle({
name: "divider",
style: {
fills: [
{ color: '#dfdfdf' }
],
},
width: 100,
height: 2,
x: 120,
y: addYPos(40),
});
const textComponents = new Text({
string: "Components:",
name: "Components",
fontSize: 16,
color: "#777",
frame: {
height: 20,
x: 120,
y: addYPos(40),
}
})
const textAlert = new Text({
string: "Alert",
name: "Alert",
fontSize: 16,
color: "#777",
});
const rectangleAlertBackground = new Rectangle({
name: "Alert Background",
style: {
fills: [
{ color: '#ddd' }
],
},
width: 800,
height: 60,
x: 120,
y: addYPos(40),
});
const textButton = new Text({
string: "Button",
name: "Button",
fontSize: 16,
color: "#777",
frame: {
height: 20,
x: 120,
y: addYPos(100),
}
});
const rectangleButton = new Rectangle({
name: "Button Background",
style: {
fills: [
{ color: '#ddd' }
y: addYPos(40),
});
const textComponents = new Text({
string: "Components:",
name: "Components",
fontSize: 16,
color: "#777",
frame: {
height: 20,
x: 120,
y: addYPos(40),
}
})
const textAlert = new Text({
string: "Alert",
name: "Alert",
fontSize: 16,
color: "#777",
frame: {
height: 20,
x: 120,
y: addYPos(40),
}
});
const rectangleAlertBackground = new Rectangle({
name: "Alert Background",
style: {
fills: [
{ color: '#ddd' }
const addYPos = (value: number = 0) => {
return yPos = yPos + value;
}
const textVersion = new Text({
string: `Version: ${pkg.version}`,
name: `Version: ${pkg.version}`,
fontSize: 16,
color: "#777",
frame: {
x: 1058,
y: 120,
}
});
const textTelements = new Text({
string: "Telements",
name: "Telements",
fontSize: 24,
color: "#333",
frame: {
x: 120,
y: addYPos(120),
}
});
const textGeneratedFile = new Text({
string: "Generated file",
name: "Generated file",
fontSize: 16,
color: "#777",
frame: {
const swatchColor = new Rectangle({
width: 200,
height: 100,
x: 0,
y: 0,
name: args.value,
style: {
fills: [
{
color: args.value,
},
],
},
});
const swatchLabel = new Text({
string: args.label,
name: args.label,
fontSize: 24,
color: '#ccc',
frame: {
width: 200,
height: 50,
x: 0,
y: 120,
},
});
Object.assign(this, {
layers: [swatchColor, swatchLabel],
name: args.label,
});
const pkg = JSON.parse(fs.readFileSync('./package.json', 'utf8'));
const buildFolder = './build';
const newSketch = new Sketch({});
const pageWelcome = new Page({
name: 'Welcome'
});
let yPos = 0;
const addYPos = (value: number = 0) => {
return yPos = yPos + value;
}
const textVersion = new Text({
string: `Version: ${pkg.version}`,
name: `Version: ${pkg.version}`,
fontSize: 16,
color: "#777",
frame: {
x: 1058,
y: 120,
}
});
const textTelements = new Text({
string: "Telements",
name: "Telements",
fontSize: 24,
color: "#333",
frame: {