Feat/icons generation reproducibility check

.gitattributes

@@ -1 +1,4 @@
+ui-admin/icons/src/icons/** text eol=lf
+ui-admin/icons/src/replacements.ts text eol=lf
+
 *.zip filter=lfs diff=lfs merge=lfs -text

generators/icons/package.json

@@ -12,30 +12,33 @@
   },
   "main": "src/index.ts",
   "bin": {
-    "generate-icons": "dist/icons.generator.js"
+    "generate-icons": "dist/generator.js"
   },
   "files": [
     "dist"
   ],
   "scripts": {
     "build": "yarn library build",
-    "generate-icons": "tsx src/icons.generator.ts",
+    "generate-icons": "tsx src/generator.ts",
     "prepack": "yarn run build",
     "postpack": "rm -rf dist"
   },
   "dependencies": {
     "@atls-ui-generators/utils": "workspace:*",
     "@svgr/core": "8.1.0",
+    "@svgr/plugin-jsx": "8.1.0",
+    "@svgr/plugin-prettier": "8.1.0",
+    "@svgr/plugin-svgo": "8.1.0",
     "@swc-node/register": "1.9.0",
     "@swc/core": "1.6.1",
     "cheerio": "1.1.2",
     "clipanion": "4.0.0-rc.4",
+    "domhandler": "5.0.3",
     "glob": "11.0.2",
     "is-svg": "6.1.0"
   },
   "devDependencies": {
     "@types/node": "22.15.3",
-    "domhandler": "5.0.3",
     "tsx": "4.20.5",
     "typescript": "5.5.4"
   },

generators/icons/src/commands/base-icons.command.ts

@@ -1,6 +1,6 @@
 /* eslint-disable n/no-sync */
 
-import type { ResolvedIconsPath } from '../icons.interfaces.js'
+import type { ResolvedIconsPath } from '../interfaces.js'
 
 import assert                     from 'node:assert/strict'
 import fs                         from 'node:fs'
@@ -49,6 +49,7 @@ export class BaseIconsCommand extends Command {
       this.resolvePaths()
     } catch (error) {
       this.logger.error(error)
+      process.exitCode = 1
     }
   }
 }

generators/icons/src/commands/generate-icons.command.ts

@@ -1,6 +1,6 @@
 /* eslint-disable n/no-sync */
 
-import type { Replacements } from '../icons.interfaces.js'
+import type { Replacements } from '../interfaces.js'
 
 import assert                from 'node:assert/strict'
 import { lstatSync }         from 'node:fs'
@@ -57,6 +57,7 @@ export class GenerateIconsCommand extends BaseIconsCommand {
       this.logger.info(`Generated into ${outputPath}`)
     } catch (error) {
       this.logger.error(error)
+      process.exitCode = 1
     }
   }
 }

generators/icons/src/commands/generate-replacements.command.ts

@@ -38,6 +38,7 @@ export class GenerateReplacementsCommand extends BaseIconsCommand {
       this.logger.info(`Generated into ${outputFilePath}`)
     } catch (error) {
       this.logger.error(error)
+      process.exitCode = 1
     }
   }
 }

generators/icons/src/replacement-utils/build-replacements/build-replacements.util.ts → generators/icons/src/replacement-utils/build-replacements/build-replacements.ts

@@ -1,5 +1,5 @@
-import type { Icon }                   from '../../icons.interfaces.js'
-import type { Replacements }           from '../../icons.interfaces.js'
+import type { Icon }                   from '../../interfaces.js'
+import type { Replacements }           from '../../interfaces.js'
 
 import { createReplacementIconColors } from '../create-replacement-icon-colors/index.js'
 import { createReplacements }          from '../create-replacements/index.js'

generators/icons/src/replacement-utils/build-replacements/index.ts

@@ -1 +1 @@
-export * from './build-replacements.util.js'
+export * from './build-replacements.js'

generators/icons/src/replacement-utils/create-replacement-icon-colors/create-replacement-icon-colors.util.ts → generators/icons/src/replacement-utils/create-replacement-icon-colors/create-replacement-icon-colors.ts

@@ -1,9 +1,9 @@
-import type { Icon }                  from '../../icons.interfaces.js'
-import type { ReplacementIconColors } from '../../icons.interfaces.js'
+import type { Icon }                  from '../../interfaces.js'
+import type { ReplacementIconColors } from '../../interfaces.js'
 
 import { compileIconJsx }             from '../../svgr-utils/index.js'
 import { getSvgColors }               from '../../svgr-utils/index.js'
-import { getSvgColorsOptions }        from './create-replacement-icon-colors.constants.js'
+import { getSvgColorsOptions }        from './constants.js'
 
 export const createReplacementIconColors = async (
   icons: Array<Icon>

generators/icons/src/replacement-utils/create-replacement-icon-colors/index.ts

@@ -1 +1 @@
-export * from './create-replacement-icon-colors.util.js'
+export * from './create-replacement-icon-colors.js'

generators/icons/src/replacement-utils/create-replacements/create-replacements.util.ts → generators/icons/src/replacement-utils/create-replacements/create-replacements.ts

@@ -1,5 +1,5 @@
-import type { Replacements }          from '../../icons.interfaces.js'
-import type { ReplacementIconColors } from '../../icons.interfaces.js'
+import type { Replacements }          from '../../interfaces.js'
+import type { ReplacementIconColors } from '../../interfaces.js'
 
 import { getColorReplacement }        from '../get-color-replacement/index.js'
 

generators/icons/src/replacement-utils/create-replacements/index.cts

@@ -1 +1 @@
-export * from './create-replacements.util.cjs'
+export * from './create-replacements.cjs'

generators/icons/src/replacement-utils/create-replacements/index.ts

@@ -1 +1 @@
-export * from './create-replacements.util.js'
+export * from './create-replacements.js'

generators/icons/src/replacement-utils/create-replacements/tests/create-replacements.test.interfaces.ts

@@ -1,4 +1,4 @@
-import type { Replacements } from '../../../icons.interfaces.js'
+import type { Replacements } from '../../../interfaces.js'
 
 export interface TestCase {
   replacementIcons: Record<string, Array<string> | string>

generators/icons/src/replacement-utils/get-color-replacement/get-color-replacement.util.ts → generators/icons/src/replacement-utils/get-color-replacement/get-color-replacement.ts

@@ -1,4 +1,4 @@
-import type { GetColorReplacement } from './get-color-replacement.interfaces.js'
+import type { GetColorReplacement } from './interfaces.js'
 
 export const getColorReplacement: GetColorReplacement = (options) => ({
   [options.color]: `currentColor`,

generators/icons/src/replacement-utils/get-color-replacement/index.cts

@@ -1 +1 @@
-export * from './get-color-replacement.util.cjs'
+export * from './get-color-replacement.cjs'

generators/icons/src/replacement-utils/get-color-replacement/index.ts

@@ -1 +1 @@
-export * from './get-color-replacement.util.js'
+export * from './get-color-replacement.js'

generators/icons/src/replacement-utils/write-replacements-file/index.ts

@@ -1 +1 @@
-export * from './write-replacements-file.util.js'
+export * from './write-replacements-file.js'

generators/icons/src/replacement-utils/write-replacements-file/write-replacements-file.util.ts → generators/icons/src/replacement-utils/write-replacements-file/write-replacements-file.ts

@@ -1,6 +1,6 @@
 /* eslint-disable n/no-sync */
 
-import type { Replacements } from '../../icons.interfaces.js'
+import type { Replacements } from '../../interfaces.js'
 
 import { writeFileSync }     from 'node:fs'
 

generators/icons/src/svgr-utils/build-svgr.util.ts → generators/icons/src/svgr-utils/build-svgr.ts

@@ -1,8 +1,8 @@
-import type { Replacements }  from '../icons.interfaces.js'
+import type { Replacements }  from '../interfaces.js'
 
 import { compileIcons }       from './compile-icons/index.js'
-import { discoverIcons }      from './discover-icons.util.js'
-import { writeCompiledIcons } from './write-compiled-icons.util.js'
+import { discoverIcons }      from './discover-icons.js'
+import { writeCompiledIcons } from './write-compiled-icons.js'
 
 export const buildSvgr = async (
   iconsPath: string,

generators/icons/src/svgr-utils/compile-icons/constants.ts

@@ -0,0 +1,35 @@
+import type { Config }     from '@svgr/core'
+
+import type { SvgrPlugin } from './interfaces.js'
+
+import { createRequire }   from 'node:module'
+
+import { svgrTemplate }    from './template.js'
+
+const require = createRequire(import.meta.url)
+
+const svgoPlugin = require('@svgr/plugin-svgo') as SvgrPlugin
+
+const jsxPlugin = require('@svgr/plugin-jsx') as SvgrPlugin
+
+const prettierPlugin = require('@svgr/plugin-prettier') as SvgrPlugin
+
+const svgrTransformPlugins = [svgoPlugin, jsxPlugin, prettierPlugin]
+
+export const MASK_ID_PATTERN = /mask0/g
+export const PROPS_SPREAD_FROM = '...props'
+export const PROPS_SPREAD_TO = '...otherProps'
+
+export const FIFTY_PLUS_PATTERN = '50+'
+export const FIFTY_PLUS_REPLACEMENT = 'FiftyPlus'
+
+export const svgrTransformConfig: Config = {
+  icon: true,
+  typescript: true,
+  template: svgrTemplate,
+  plugins: svgrTransformPlugins,
+  svgProps: {
+    className: `{clsx(className, String(otherProps.className || ''))}`,
+    style: '{iconStyle}',
+  },
+}

generators/icons/src/svgr-utils/compile-icons/compile-icon-jsx.util.ts → generators/icons/src/svgr-utils/compile-icons/icon-jsx.ts

@@ -1,9 +1,9 @@
-import type { Icon }           from '../../icons.interfaces.js'
+import type { Icon }           from '../../interfaces.js'
 
 import { transform }           from '@svgr/core'
 
-import { MASK_ID_PATTERN }     from './compile-icons.constants.js'
-import { svgrTransformConfig } from './compile-icons.constants.js'
+import { MASK_ID_PATTERN }     from './constants.js'
+import { svgrTransformConfig } from './constants.js'
 
 export const compileIconJsx = async (icon: Icon): Promise<string> =>
   transform(icon.source.replace(MASK_ID_PATTERN, icon.name), {

generators/icons/src/svgr-utils/compile-icons/compile-icons.util.ts → generators/icons/src/svgr-utils/compile-icons/icons.ts

@@ -1,15 +1,15 @@
-import type { Icon }              from '../../icons.interfaces.js'
-import type { Replacements }      from '../../icons.interfaces.js'
-import type { Source }            from '../../icons.interfaces.js'
+import type { Icon }              from '../../interfaces.js'
+import type { Replacements }      from '../../interfaces.js'
+import type { Source }            from '../../interfaces.js'
 
 import { transform }              from '@svgr/core'
 
-import { MASK_ID_PATTERN }        from './compile-icons.constants.js'
-import { PROPS_SPREAD_FROM }      from './compile-icons.constants.js'
-import { PROPS_SPREAD_TO }        from './compile-icons.constants.js'
-import { FIFTY_PLUS_PATTERN }     from './compile-icons.constants.js'
-import { FIFTY_PLUS_REPLACEMENT } from './compile-icons.constants.js'
-import { svgrTransformConfig }    from './compile-icons.constants.js'
+import { MASK_ID_PATTERN }        from './constants.js'
+import { PROPS_SPREAD_FROM }      from './constants.js'
+import { PROPS_SPREAD_TO }        from './constants.js'
+import { FIFTY_PLUS_PATTERN }     from './constants.js'
+import { FIFTY_PLUS_REPLACEMENT } from './constants.js'
+import { svgrTransformConfig }    from './constants.js'
 
 export const compileIcons = async (
   icons: Array<Icon>,

generators/icons/src/svgr-utils/compile-icons/index.ts

@@ -1,3 +1,3 @@
-export * from './compile-icon-jsx.util.js'
-export * from './compile-icons.template.js'
-export * from './compile-icons.util.js'
+export * from './icon-jsx.js'
+export * from './icons.js'
+export * from './template.js'

generators/icons/src/svgr-utils/compile-icons/interfaces.ts

@@ -0,0 +1,3 @@
+import type { Config } from '@svgr/core'
+
+export type SvgrPlugin = NonNullable<Config['plugins']>[number]

generators/icons/src/svgr-utils/discover-icons.util.ts → generators/icons/src/svgr-utils/discover-icons.ts

@@ -1,6 +1,6 @@
 /* eslint-disable n/no-sync */
 
-import type { Icon }    from '../icons.interfaces.js'
+import type { Icon }    from '../interfaces.js'
 
 import fs               from 'node:fs'
 

generators/icons/src/svgr-utils/get-svg-colors/constants.ts

@@ -0,0 +1 @@
+export const styleColorAttributeKey = 'style'

generators/icons/src/svgr-utils/get-svg-colors/extract-color-from-element.helper.ts → generators/icons/src/svgr-utils/get-svg-colors/extract-color-from-element.ts

@@ -1,9 +1,9 @@
-import type { CheerioAPI }           from 'cheerio'
-import type { AnyNode }              from 'domhandler'
+import type { CheerioAPI }          from 'cheerio/slim'
+import type { AnyNode }             from 'domhandler'
 
-import type { GetSvgColorsOptions }  from './get-svg-colors.interfaces.js'
+import type { GetSvgColorsOptions } from './interfaces.js'
 
-import { STYLE_COLOR_ATTRIBUTE_KEY } from './get-svg-colors.constants.js'
+import { styleColorAttributeKey }   from './constants.js'
 
 export const extractColorFromElement = (
   cheerio: CheerioAPI,
@@ -19,7 +19,7 @@ export const extractColorFromElement = (
       colors.add(value)
     }
 
-    if (name === STYLE_COLOR_ATTRIBUTE_KEY) {
+    if (name === styleColorAttributeKey) {
       options.colorAttributes?.forEach((colorAttribute) => {
         colors.add(cheerio(element).css(colorAttribute) || '')
       })

generators/icons/src/svgr-utils/get-svg-colors/get-svg-colors.util.ts → generators/icons/src/svgr-utils/get-svg-colors/get-svg-colors.ts

@@ -1,9 +1,9 @@
-import type { GetSvgColorsOptions } from './get-svg-colors.interfaces.js'
+import type { GetSvgColorsOptions } from './interfaces.js'
 
-import { load }                     from 'cheerio'
+import { load }                     from 'cheerio/slim'
 
-import { extractColorFromElement }  from './extract-color-from-element.helper.js'
-import { validateColor }            from './validate-color.helper.js'
+import { extractColorFromElement }  from './extract-color-from-element.js'
+import { validateColor }            from './helpers/validate-color.js'
 
 export const getSvgColors = (source: string, options: GetSvgColorsOptions = {}): Array<string> => {
   const colors = new Set<string>()

generators/icons/src/svgr-utils/get-svg-colors/validate-color.helper.ts → generators/icons/src/svgr-utils/get-svg-colors/helpers/validate-color.ts

@@ -1,4 +1,4 @@
-import type { GetSvgColorsOptions } from './get-svg-colors.interfaces.js'
+import type { GetSvgColorsOptions } from '../interfaces.js'
 
 export const validateColor = (color: string, options: GetSvgColorsOptions): boolean => {
   if (!color) {

generators/icons/src/svgr-utils/get-svg-colors/index.ts

@@ -1,2 +1,2 @@
-export * from './get-svg-colors.util.js'
-export type * from './get-svg-colors.interfaces.js'
+export * from './get-svg-colors.js'
+export type * from './interfaces.js'

generators/icons/src/svgr-utils/index.ts

@@ -1,4 +1,4 @@
-export * from './build-svgr.util.js'
+export * from './build-svgr.js'
 export * from './compile-icons/index.js'
-export * from './discover-icons.util.js'
+export * from './discover-icons.js'
 export * from './get-svg-colors/index.js'

generators/icons/src/svgr-utils/write-compiled-icons.util.ts → generators/icons/src/svgr-utils/write-compiled-icons.ts

@@ -1,6 +1,6 @@
 /* eslint-disable n/no-sync */
 
-import type { Source } from '../icons.interfaces.js'
+import type { Source } from '../interfaces.js'
 
 import fs              from 'node:fs'
 import path            from 'node:path'

ui-admin/icons/lib/generated/check/cli.ts

@@ -0,0 +1,13 @@
+import { checkSuccessMessage } from './constants.js'
+import { outputLineBreak }     from './constants.js'
+import { checkGenerated }      from './index.js'
+
+try {
+  await checkGenerated()
+  process.stdout.write(`${checkSuccessMessage}${outputLineBreak}`)
+} catch (error) {
+  const errorMessage = error instanceof Error ? (error.stack ?? error.message) : String(error)
+
+  process.stderr.write(`${errorMessage}${outputLineBreak}`)
+  process.exitCode = 1
+}

ui-admin/icons/lib/generated/check/command/interfaces.ts

@@ -0,0 +1,3 @@
+export interface CommandOptions {
+  cwd?: string
+}