diff --git a/src/formats/cssCustomMedia.ts b/src/formats/cssCustomMedia.ts index 7b3363e3e..501af4a3d 100644 --- a/src/formats/cssCustomMedia.ts +++ b/src/formats/cssCustomMedia.ts @@ -1,6 +1,6 @@ import {format} from 'prettier' import type {FormatFn, FormatFnArguments} from 'style-dictionary/types' -import {fileHeader} from 'style-dictionary/utils' +import {fileHeader, sortByName} from 'style-dictionary/utils' /** * @description Converts `StyleDictionary.dictionary.tokens` to css with @custom-media @@ -11,7 +11,7 @@ export const cssCustomMedia: FormatFn = async ({dictionary, options: _options, f // add file header const output = [await fileHeader({file})] // add single theme css - dictionary.allTokens.map(({name, $value}) => { + dictionary.allTokens.sort(sortByName).map(({name, $value}) => { output.push(`@custom-media --${name} ${$value};`) }) // return prettified diff --git a/src/formats/jsonOneDimensional.ts b/src/formats/jsonOneDimensional.ts index 2e2f91874..9882314f2 100644 --- a/src/formats/jsonOneDimensional.ts +++ b/src/formats/jsonOneDimensional.ts @@ -1,6 +1,7 @@ import {format} from 'prettier' import {jsonToFlat} from './utilities/jsonToFlat.js' import type {FormatFn, FormatFnArguments} from 'style-dictionary/types' +import {sortByName} from 'style-dictionary/utils' /** * @description Takes a style dictionary token dictionary and converts it to a one dimensional json object. * @param FormatFnArguments @@ -10,7 +11,7 @@ import type {FormatFn, FormatFnArguments} from 'style-dictionary/types' export const jsonOneDimensional: FormatFn = ({dictionary, file: _file, options}: FormatFnArguments) => { // option to allow verbose output (object) or just the value const {outputVerbose, propertyConversion} = options - const tokens = jsonToFlat(dictionary.allTokens, outputVerbose) + const tokens = jsonToFlat(dictionary.allTokens.sort(sortByName), outputVerbose) if (propertyConversion === undefined) { // const output = JSON.stringify(tokens, null, 2)