Update Configs

.github/renovate.json5

@@ -2,7 +2,8 @@
 // https://docs.renovatebot.com/configuration-options/
 {
   "extends": [
-    "config:base"
+    "config:base",
+    "github>gossi/frontend-configs//config/renovate.json5"
   ],
   "automerge": true,
   "masterIssue": true,

packages/@theemo/build/package.json

@@ -45,12 +45,12 @@
     "read-pkg": "^9.0.0"
   },
   "devDependencies": {
-    "@gossi/config-eslint": "^0.7.0",
+    "@gossi/config-eslint": "^0.10.0",
     "@gossi/config-prettier": "^0.8.0",
     "@types/node": "^20.6.3",
     "concurrently": "^8.2.0",
     "eslint": "^8.49.0",
-    "prettier": "^3.0.3",
+    "prettier": "^3.2.5",
     "tsup": "^8.0.0",
     "typescript": "^5.2.2",
     "vitest": "^1.0.0"

packages/@theemo/build/src/build.ts

@@ -77,12 +77,7 @@ function prepareColorSchemes(config: GenerateConfig, name: string) {
 
   for (const [scheme, schemaConfig] of Object.entries(config.colorSchemes)) {
     contents.push(
-      `/* Color Scheme: ${scheme} */\n${prepareColorScheme(
-        scheme,
-        name,
-        config,
-        schemaConfig as SchemeConfig
-      )}`
+      `/* Color Scheme: ${scheme} */\n${prepareColorScheme(scheme, name, config, schemaConfig)}`
     );
   }
 
@@ -127,10 +122,6 @@ export function build(config: GenerateConfig) {
     packageJson.theemo.colorSchemes = Object.keys(config.colorSchemes);
     packageJson.theemo.file = outFile;
 
-    if (!packageJson.keywords) {
-      packageJson.keywords = [];
-    }
-
     if (!packageJson.keywords.includes('theemo-theme')) {
       packageJson.keywords.push('theemo-theme');
     }

packages/@theemo/cli/package.json

@@ -60,14 +60,14 @@
     "esm": "^3.2.25"
   },
   "devDependencies": {
-    "@gossi/config-eslint": "^0.7.0",
+    "@gossi/config-eslint": "^0.10.0",
     "@gossi/config-prettier": "^0.8.0",
     "@swc/cli": "^0.3.0",
     "@swc/core": "^1.3.67",
     "@types/node": "^20.3.3",
     "concurrently": "^8.2.0",
     "eslint": "^8.49.0",
-    "prettier": "^3.0.3",
+    "prettier": "^3.2.5",
     "tsup": "^8.0.0",
     "typescript": "^5.2.2",
     "vitest": "^1.0.0"

packages/@theemo/cli/src/cli.ts

@@ -85,4 +85,4 @@ export async function cli() {
   program.parse(argv);
 }
 
-cli();
+void cli();

packages/@theemo/cli/src/theemo.ts

@@ -21,7 +21,7 @@ export default class Theemo {
     const usedConfig = config ?? this.config.sync;
 
     if (usedConfig) {
-      sync(usedConfig);
+      await sync(usedConfig);
     }
   }
 

packages/@theemo/core/package.json

@@ -43,11 +43,11 @@
     "_test:dev": "vitest"
   },
   "devDependencies": {
-    "@gossi/config-eslint": "^0.7.0",
+    "@gossi/config-eslint": "^0.10.0",
     "@gossi/config-prettier": "^0.8.0",
     "concurrently": "^8.2.0",
     "eslint": "^8.49.0",
-    "prettier": "^3.0.3",
+    "prettier": "^3.2.5",
     "tsup": "^8.0.0",
     "typescript": "^5.2.2",
     "vitest": "^1.0.0"

packages/@theemo/figma/package.json

@@ -54,15 +54,15 @@
   "devDependencies": {
     "@babel/core": "^7.22.5",
     "@babel/eslint-parser": "^7.22.5",
-    "@gossi/config-eslint": "^0.7.0",
+    "@gossi/config-eslint": "^0.10.0",
     "@gossi/config-prettier": "^0.8.0",
     "@types/lodash.isempty": "^4.4.7",
     "@types/lodash.merge": "^4.6.7",
-    "@typescript-eslint/eslint-plugin": "^5.60.1",
-    "@typescript-eslint/parser": "^5.60.1",
+    "@typescript-eslint/eslint-plugin": "^7.11.0",
+    "@typescript-eslint/parser": "^7.11.0",
     "concurrently": "^8.2.0",
     "eslint": "^8.49.0",
-    "prettier": "^3.0.3",
+    "prettier": "^3.2.5",
     "tsup": "^8.0.0",
     "typescript": "^5.2.2",
     "vitest": "^1.0.0"

packages/@theemo/figma/src/config.ts

@@ -163,7 +163,7 @@ export interface FigmaParserConfig {
    * @param variable Figma Variable
    * @returns the constraints for the given mode
    */
-  getConstraints?: (mode: string, variable: FigmaVariable) => void | Constraints;
+  getConstraints?: (mode: string, variable: FigmaVariable) => Constraints | undefined;
 
   //
   // misc

packages/@theemo/figma/src/figma-styles.ts

@@ -26,7 +26,7 @@ export interface StyleShadow {
   color: StyleColor;
 }
 
-export function getTypefromStyle(style: Style): TokenType | void {
+export function getTypefromStyle(style: Style): TokenType | undefined {
   // 'FILL' | 'STROKE' | 'TEXT' | 'EFFECT' | 'GRID'
   const type = style.styleType;
 
@@ -41,16 +41,18 @@ export function getTypefromStyle(style: Style): TokenType | void {
     case 'text':
       return 'typography';
   }
+
+  return undefined;
 }
 
 export function getDimension(value: number | string, unit: string): DimensionValue {
   let val = typeof value === 'string' ? Number.parseFloat(value) : value;
 
-  return val === 0 ? '0' : `${val}${unit}`;
+  return val === 0 ? '0' : `${val.toString()}${unit}`;
 }
 
 export function parseColorFromStyle(color: StyleColor, config: ColorConfig): string {
-  if (color.visible === false) {
+  if (!color.visible) {
     return 'transparent';
   }
 
@@ -85,6 +87,7 @@ export function parseShadowsFromStyle(effects: Effect[], config: ColorConfig): S
 
 function parseTextTransform(textCase: TextCase): TextTransformValue {
   switch (textCase) {
+    /* eslint-disable @typescript-eslint/no-unsafe-enum-comparison */
     case 'UPPER':
       return 'uppercase';
 
@@ -99,6 +102,8 @@ function parseTextTransform(textCase: TextCase): TextTransformValue {
     case 'ORIGINAL':
     default:
       return 'none';
+
+    /* eslint-enable @typescript-eslint/no-unsafe-enum-comparison */
   }
 }
 

packages/@theemo/figma/src/figma-variables.ts

@@ -18,7 +18,9 @@ import type { GetFileResult } from 'figma-api/lib/api-types.js';
 
 export function isAlias(value: VariableValue): value is VariableAlias {
   return (
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     (value as VariableAlias).type !== undefined &&
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     (value as VariableAlias).type === 'VARIABLE_ALIAS'
   );
 }
@@ -64,7 +66,8 @@ function parseValue(
   variable: FigmaVariable,
   mode: string,
   config: FigmaParserConfigWithDefaults
-): TokenValue<TokenType> | void {
+  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+): TokenValue<TokenType> | undefined {
   const value = variable.valuesByMode[mode];
 
   switch (variable.resolvedType) {
@@ -83,7 +86,8 @@ function parseValueOrReference(
   modeId: string,
   variables: FigmaVariable[],
   config: FigmaParserConfigWithDefaults
-): TokenValue<TokenType> | void {
+  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+): TokenValue<TokenType> | undefined {
   const aliasOrValue = variable.valuesByMode[modeId];
 
   const publishedAlias = isAlias(aliasOrValue) && isAliasPublished(aliasOrValue, variables, config);
@@ -123,7 +127,8 @@ function parseTokenValue(
   variable: FigmaVariable,
   variables: FigmaVariable[],
   config: FigmaParserConfigWithDefaults
-): TokenValue<TokenType> | void {
+  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+): TokenValue<TokenType> | undefined {
   const tokenValues: TokenValue<TokenType>[] = [];
 
   // when constraints are needed and at least one of them is considered
@@ -222,6 +227,7 @@ export function parseVariables(
   const tokens = new TokenCollection<FigmaToken>();
 
   for (const variable of variables) {
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     if (variable.collection && config.isTokenByVariable(variable)) {
       tokens.add(createTokenFromVariable(variable, variables, file, config));
     }

packages/@theemo/figma/src/plugins/figma-parser.ts

@@ -12,7 +12,7 @@ import type { StyleColor } from '../figma-styles.js';
 import type { Plugin } from '../plugin.js';
 import type { FigmaToken } from '../token.js';
 import type { TokenType } from '@theemo/tokens';
-import type { Effect, Node, Paint, Style, StylesMap, TypeStyle } from 'figma-api';
+import type { Effect, Node, Paint, Style, StylesMap } from 'figma-api';
 import type { GetFileResult } from 'figma-api/lib/api-types.js';
 
 type CompositeNode = Node & {
@@ -124,6 +124,7 @@ export default class FigmaParser implements Plugin {
     let key = `${type}s`.replace('ss', 's') as keyof Node<'TEXT'> & 'texts';
 
     // fill - color swatch
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     if (key === 'fills' && node[key]) {
       token.value = parseColorFromStyle(
         this.getColorFromPaint(node[key] as Paint[]),
@@ -132,6 +133,7 @@ export default class FigmaParser implements Plugin {
     }
 
     // stroke - somewhere used as border
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     else if (key === 'strokes' && node[key]) {
       token.value = parseColorFromStyle(
         this.getColorFromPaint(node[key] as Paint[]),
@@ -140,21 +142,20 @@ export default class FigmaParser implements Plugin {
     }
 
     // effect - shadows
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     else if (key === 'effects' && node[key]) {
       const shadows = parseShadowsFromStyle(node[key] as Effect[], this.config.formats);
 
-      if (shadows) {
-        token.value = shadows;
-      }
+      token.value = shadows;
     }
 
     // typography
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition, dot-notation
     else if (key === 'texts' && node['style']) {
-      const typo = parseTypographyFromStyle(node['style'] as TypeStyle);
+      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition, dot-notation
+      const typo = parseTypographyFromStyle(node['style']);
 
-      if (typo) {
-        token.value = typo;
-      }
+      token.value = typo;
     }
 
     return token;

packages/@theemo/figma/src/plugins/theemo.ts

@@ -20,8 +20,8 @@ function paintToColorTransforms(paint: PaintTransforms): ColorTransform {
 
   if (paint.opacity) {
     // @ts-expect-error opacity is invalidly copied over
-    delete colorTransforms['opacity'];
-    colorTransforms['alpha'] = paint['opacity'];
+    delete colorTransforms.opacity;
+    colorTransforms.alpha = paint.opacity;
   }
 
   return colorTransforms;
@@ -97,6 +97,7 @@ export class TheemoPlugin implements Plugin {
     const configStyle = Object.values(file.styles).find((style) => style.name === CONFIG);
 
     if (configStyle) {
+      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
       const theemoConfig = JSON.parse(configStyle.description ?? '{}') as Config;
 
       this.styleConfig = theemoConfig.styles;
@@ -108,7 +109,8 @@ export class TheemoPlugin implements Plugin {
 
   private parseVariables(file: GetFileResult): TokenCollection<FigmaToken> {
     let tokens = new TokenCollection<FigmaToken>();
-    const pluginData = file.document.pluginData[this.getPluginData()] as PluginData;
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+    const pluginData = file.document.pluginData[this.getPluginData()] as PluginData | undefined;
 
     if (pluginData) {
       const variables = (JSON.parse(pluginData.variables) ?? {}) as Variables;
@@ -143,7 +145,7 @@ export class TheemoPlugin implements Plugin {
 
             // value is constrained, find by matching constraints
             else if (Array.isArray(token.value)) {
-              const constraints = this.parserConfig.getConstraints?.(mode.name, variable) ?? {};
+              const constraints = this.parserConfig.getConstraints?.(mode.name, variable);
 
               if (!constraints || Object.keys(constraints).length === 0) {
                 // eslint-disable-next-line no-console
@@ -152,6 +154,7 @@ export class TheemoPlugin implements Plugin {
                 value = (token.value as ComputedValue<TokenType>[]).find(
                   (val) =>
                     typeof val === 'object' &&
+                    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
                     matches(val as ConstrainedValue<TokenType>, constraints)
                 ) as ComputedValue<TokenType>;
 
@@ -169,6 +172,7 @@ export class TheemoPlugin implements Plugin {
             // found the matching value
             if (value) {
               // attach transforms
+              // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
               if (varConfig.transforms) {
                 (value as ComputedValue<TokenType>).transforms = paintToColorTransforms(
                   varConfig.transforms
@@ -181,9 +185,8 @@ export class TheemoPlugin implements Plugin {
 
                 // ref found and matched token
                 if (ref && this.parserConfig.isTokenByVariable(ref)) {
-                  (
-                    value as ComputedValue<TokenType>
-                  ).value = `{${this.parserConfig.getNameFromVariable(ref)}}`;
+                  (value as ComputedValue<TokenType>).value =
+                    `{${this.parserConfig.getNameFromVariable(ref)}}`;
                 }
               }
 

packages/@theemo/figma/src/reader.ts

@@ -6,14 +6,15 @@ import { TokenCollection } from '@theemo/tokens';
 import { DEFAULT_PARSER_CONFIG } from './defaults.js';
 import FigmaParser from './plugins/figma-parser.js';
 
-import type { FigmaParserConfig, FigmaReaderConfig } from './config.js';
+import type { FigmaReaderConfig } from './config.js';
+import type { FigmaParserConfigWithDefaults } from './defaults.js';
 import type { Plugin } from './plugin.js';
 import type { FigmaToken } from './token.js';
 import type { Token } from '@theemo/tokens';
 import type { GetFileResult } from 'figma-api/lib/api-types.js';
 
 type FigmaReaderConfigWithParser = FigmaReaderConfig & {
-  parser: Required<FigmaParserConfig>;
+  parser: FigmaParserConfigWithDefaults;
 };
 
 interface Parser extends Required<Pick<Plugin, 'parse'>> {}
@@ -97,7 +98,7 @@ export default class FigmaReader {
     const resolvers = this.plugins.filter((plugin) => plugin.resolve !== undefined) as Resolver[];
 
     for (const resolver of resolvers) {
-      t = resolver.resolve(token, tokens) ?? t;
+      t = resolver.resolve(token, tokens);
     }
 
     return t;

packages/@theemo/figma/src/token-values.ts

@@ -21,23 +21,23 @@ export function parseColorValue(value: string | RGB | RGBA, config: ColorConfig)
   if (color.alpha() === 1) {
     switch (config.color) {
       case ColorFormat.Hsl:
-        return color.toHslString() as ColorValue;
+        return color.toHslString();
 
       case ColorFormat.Rgb:
-        return color.toRgbString() as ColorValue;
+        return color.toRgbString();
 
       default:
       case ColorFormat.Hex:
-        return color.toHex() as ColorValue;
+        return color.toHex();
     }
   } else {
     switch (config.colorAlpha) {
       case ColorAlphaFormat.Hsl:
-        return color.toHslString() as ColorValue;
+        return color.toHslString();
 
       default:
       case ColorAlphaFormat.Rgb:
-        return color.toRgbString() as ColorValue;
+        return color.toRgbString();
     }
   }
 }