figgo
Version:
A CLI tool make your design tokens stay up to date with your Figma design styleguide
47 lines • 1.42 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const helper_1 = require("../helper");
class Color {
constructor(name, r, g, b, a) {
this.name = name.replace(/\s+/g, "-").toUpperCase();
this.rFloat = r;
this.gFloat = g;
this.bFloat = b;
this.aFloat = a;
}
get formatedName() {
return this.name;
}
get HEX() {
if (this.rgbaIsValid()) {
return helper_1.rgbToHex(this.rFloat, this.gFloat, this.bFloat);
}
}
get RGBA() {
if (this.rgbaIsValid()) {
return helper_1.rgbaToString(this.rFloat, this.gFloat, this.bFloat, this.aFloat);
}
}
get scss() {
const color = this.aFloat < 1 ? this.RGBA : this.HEX;
return `$${this.name}: ${color};`;
}
get js() {
const color = this.aFloat < 1 ? this.RGBA : this.HEX;
const name = this.name.replace(/-/g, "_");
return `export const ${name} = '${color}';`;
}
get css() {
const color = this.aFloat < 1 ? this.RGBA : this.HEX;
const name = this.name.replace(/_/g, "-").toLowerCase();
return `--${name}: ${color};`;
}
rgbaIsValid() {
if (!(this.rFloat || this.gFloat || this.bFloat || this.aFloat)) {
return false;
}
return true;
}
}
exports.default = Color;
//# sourceMappingURL=color.js.map