diff --git a/src/core/build.ts b/src/core/build.ts index ec21c16..94a8caa 100644 --- a/src/core/build.ts +++ b/src/core/build.ts @@ -52,29 +52,26 @@ StyleDictionaryApi.registerAction({ }) export async function build(config: Config): Promise { - const normalizedConfig: Config[] = Array.isArray(config) ? config : [config] - for (const themeConfig of normalizedConfig) { - for (const entryKey in themeConfig.entry) { - const theme = await loadTheme(themeConfig.entry[entryKey]) - for (const platform of theme.platforms) { - // TODO: Load sources in themes? - const sources = await loadSources(theme.sources, platform) - // TODO: Load mappers in themes? - store.set('mapper', await loadMappers(theme.mappers)) - for (const _themeFileConfig of themeConfig.output.files) { - store.set('whitepaper', theme.whitepaper) - const styleDictionaryConfig = createStyleDictionaryConfig({ - platform: platform, - source: sources, - theme: entryKey, - outDir: themeConfig.output.path, - whitepaper: theme.whitepaper, - }) - const StyleDictionary = StyleDictionaryApi.extend(styleDictionaryConfig) - StyleDictionary.properties = dedupeProps(StyleDictionary.properties) - StyleDictionary.buildPlatform('css') - } - } + for (const entry in config.entry) { + const theme = await loadTheme(config.entry[entry]) + for (const platform of theme.platforms) { + // TODO: Load sources in themes? + const sources = await loadSources(theme.sources, platform) + + // TODO: Load mappers in themes? + store.set('mapper', await loadMappers(theme.mappers)) + store.set('whitepaper', theme.whitepaper) + + const styleDictionaryConfig = createStyleDictionaryConfig({ + platform: platform, + sources: sources, + entry: entry, + output: config.output, + }) + const StyleDictionary = StyleDictionaryApi.extend(styleDictionaryConfig) + + StyleDictionary.properties = dedupeProps(StyleDictionary.properties) + StyleDictionary.buildAllPlatforms() } } } diff --git a/src/core/config.ts b/src/core/config.ts index b35e3ca..0454444 100644 --- a/src/core/config.ts +++ b/src/core/config.ts @@ -1,12 +1,8 @@ +import { Platform } from 'style-dictionary' + export type Config = { entry: Record - output: { - path: string - files: Array<{ - filename: string - format: string - }> - } + output: Record } export async function loadConfig(path: string): Promise { diff --git a/src/core/style-dictionary-config.ts b/src/core/style-dictionary-config.ts index 042ca78..3c125ff 100644 --- a/src/core/style-dictionary-config.ts +++ b/src/core/style-dictionary-config.ts @@ -1,24 +1,34 @@ -export function createStyleDictionaryConfig({ - source, - theme, - outDir, - platform, - whitepaper, -}: any): any { - const themeFolder = platform === 'common' ? theme : `${theme}/${platform}` +import { Platform, Config } from 'style-dictionary' + +type Options = { + sources: string[] + entry: string + platform: string + output: Record +} + +export function createStyleDictionaryConfig({ sources, entry, platform, output }: Options): Config { + const platforms = Object.entries(output) + // prettier-ignore + .reduce>((acc, [key, value]) => { + const target = { ...value } + // Normalize path for style-dictionary specifics. + target.buildPath = target.buildPath.endsWith('/') ? target.buildPath : `${target.buildPath}/` + target.files = target.files.map((file) => ({ + ...file, + // Replace placeholders for multiple themes and platforms. + destination: file.destination + .replace(/\[entry\]/, entry) + .replace(/\[platform\]/, platform) + // Remove common level, because is root. + .replace(/common\/?/, ''), + })) + acc[key] = target + return acc + }, {}) + return { - include: source, - platforms: { - css: { - buildPath: outDir.endsWith('/') ? outDir : `${outDir}/`, - transforms: ['attribute/cti', 'time/seconds', 'color/css', 'name/cti/kebab', 'name/mapper'], - actions: ['process-color'], - files: Object.keys(whitepaper).map((file: any) => ({ - destination: `${themeFolder}/${file}.css`, - format: 'css/whitepaper', - filter: (token: any) => token.group === file, - })), - }, - }, + include: sources, + platforms: platforms, } }