@hashicorp/flight-icons 4.1.1-rc-20251231193629 → 4.1.1-rc-20260105174051

package/scripts/build-parts/generateBundleSymbolJS.ts

@@ -1,138 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import fs from 'fs-extra';
-import prettier from 'prettier';
-import path from 'path';
-
-import { ConfigData } from '../@types/ConfigData';
-import { AssetsCatalog } from '../@types/AssetsCatalog';
-
-const prettierConfig = {
-    tabWidth: 4,
-    singleQuote: true,
-    trailingComma: 'none'
-} as const;
-
-const getSymbolModule = (sourceSvg: string): string => {
-    const viewBoxMatch = sourceSvg.match(/viewBox="([^"]+)"/);
-    const viewBox = viewBoxMatch ? viewBoxMatch[1] : '0 0 16 16';
-
-    let innerContent = sourceSvg
-        .replace(/<svg[^>]*>/, '')
-        .replace(/<\/svg>/, '');
-
-    innerContent = innerContent.replace(/ fill="#000001"/gi, '');
-
-    return `export default function (id) {
-        return \`<symbol id="\${id}" viewBox="${viewBox}">${innerContent}</symbol>\`;
-    }`;
-};
-
-export async function generateBundleSymbolJS({ config, catalog }: { config: ConfigData, catalog: AssetsCatalog }): Promise<void> {
-    const tempSVGFolderPath = config.tempFolder;
-    const mappingFilePath = path.resolve(__dirname, '../../../../hds-carbon-icon-map.json');
-    const carbonIconsPath = path.resolve(__dirname, '../../node_modules/@carbon/icons/svg');
-
-    let mapping: Record<string, string> = {};
-    try {
-        mapping = await fs.readJSON(mappingFilePath);
-    } catch {
-        console.warn('⚠️ Map file not found.');
-    }
-
-    // Define folders
-    const outputFolder = `${config.mainFolder}/symbol-js`;
-    const flightFolder = `${outputFolder}/flight`;
-    const carbonFolder = `${outputFolder}/carbon`;
-
-    // Ensure folders exist (but empty)
-    await fs.emptyDir(outputFolder);
-    await fs.ensureDir(flightFolder);
-    await fs.ensureDir(carbonFolder);
-
-    const registry: Record<string, { flight: Record<string, string>, carbon: string | null }> = {};
-
-    for (const { fileName } of catalog.assets) {
-        try {
-            const flightSource = await fs.readFile(`${tempSVGFolderPath}/${fileName}.svg`, 'utf8');
-            const flightContent = await prettier.format(getSymbolModule(flightSource), { ...prettierConfig, parser: 'typescript' });
-            
-            await fs.writeFile(`${flightFolder}/${fileName}.js`, flightContent);
-        } catch (err) {
-            console.error(`Error reading Flight icon: ${fileName}`, err);
-        }
-
-        const match = fileName.match(/^(.*)-(16|24)$/);
-
-        if (match) {
-            const [, baseName, size] = match;
-
-            if (!registry[baseName]) {
-                registry[baseName] = { flight: {}, carbon: null };
-            }
-
-            registry[baseName].flight[size] = `() => import('./flight/${fileName}.js')`;
-
-            const carbonName = mapping[baseName];
-
-            if (carbonName && !registry[baseName].carbon) {
-                const carbonPath = path.join(carbonIconsPath, '32', `${carbonName}.svg`);
-
-                if (fs.existsSync(carbonPath)) {
-                    const carbonSource = await fs.readFile(carbonPath, 'utf8');
-                    const carbonContent = await prettier.format(getSymbolModule(carbonSource), { ...prettierConfig, parser: 'typescript' });
-
-                    await fs.writeFile(`${carbonFolder}/${baseName}.js`, carbonContent);
-                    
-                    registry[baseName].carbon = `() => import('./carbon/${baseName}.js')`;
-                } else {
-                    console.warn(`⚠️ Carbon icon missing: ${carbonName} (size 32)`);
-                }
-            }
-        }
-    }
-
-    // Generate Registry (JS + Types)
-    const registryLines = Object.entries(registry).map(([baseName, data]) => {
-        const flightSizes = Object.entries(data.flight)
-            .map(([size, imp]) => `'${size}': ${imp}`)
-            .join(', ');
-
-        const carbonImp = data.carbon ? data.carbon : 'null';
-
-        return `'${baseName}': { 
-            flight: { ${flightSizes} }, 
-            carbon: ${carbonImp} 
-        },`;
-    });
-
-    const registryJsContent = await prettier.format(`
-        export const IconRegistry = {
-            ${registryLines.join('\n')}
-        };
-    `, { ...prettierConfig, parser: 'babel' });
-
-    await fs.writeFile(`${outputFolder}/registry.js`, registryJsContent);
-
-    const registryDtsContent = await prettier.format(`
-        import type { IconName } from '../svg';
-
-        export interface HdsIconModule {
-            default: (id: string) => string;
-        }
-
-        export interface HdsIconRegistryEntry {
-            flight: {
-                [size: string]: () => Promise<HdsIconModule>;
-            };
-            carbon: (() => Promise<HdsIconModule>) | null;
-        }
-
-        export declare const IconRegistry: Record<IconName, HdsIconRegistryEntry>;
-    `, { ...prettierConfig, parser: 'typescript' });
-
-    await fs.writeFile(`${outputFolder}/registry.d.ts`, registryDtsContent);
-}

package/scripts/build-parts/generatePublicZIPFile.ts

@@ -1,26 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import fs from 'fs-extra';
-
-import { ConfigData } from '../@types/ConfigData';
-
-import { zipSVGFolder } from './zipSVGFolder';
-
-export async function generatePublicZIPFile({ config } : { config: ConfigData }): Promise<void> {
-
-    const srcFolderPath = `${config.mainFolder}/svg`;
-    const zipFilePath = `${config.emberPublicFolder}/assets/zip/flight-icons-svg.zip`;
-
-    // remove the previous version of the ZIP file
-    try {
-        await fs.remove(zipFilePath)
-    } catch (err) {
-        console.error(err);
-    }
-
-    // zip the standalone SVG folder
-    await zipSVGFolder({ srcFolderPath, zipFilePath })
-}

package/scripts/build-parts/getCssForIconAnimation.ts

@@ -1,38 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-import prettier from 'prettier';
-
-const prettierConfig = { parser: 'css' as const, tabWidth: 4 };
-
-export const getCssForIconAnimation = async(): Promise<string> => {
-    let cssSource = '/**\n * Copyright IBM Corp. 2021, 2025\n * SPDX-License-Identifier: MPL-2.0\n */\n\n';
-    cssSource += `
-        @keyframes hds-flight-icon-animation-rotation {
-            to {transform: rotate(360deg);}
-        }
-
-        .hds-flight-icon--animation-loading {
-            animation: hds-flight-icon-animation-rotation 9s linear infinite;
-        }
-
-        .hds-flight-icon--animation-running {
-            animation: hds-flight-icon-animation-rotation 9s linear infinite;
-        }
-
-        @media (prefers-reduced-motion: no-preference) {
-
-            .hds-flight-icon--animation-loading {
-                animation-duration: .7s;
-            }
-
-            .hds-flight-icon--animation-running {
-                animation-duration: 1s;
-            }
-        }
-    `;
-    const formattedCss = await prettier.format(cssSource, prettierConfig);
-
-    return formattedCss;
-};

package/scripts/build-parts/optimizeAssetsSVG.ts

@@ -1,63 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import fs from 'fs-extra';
-import chalk from 'chalk';
-
-// Notice: we're using SVGO vs 1.3.2 instead of 2.x.x because the new version has a terrible API, the documentation is still missing
-// and I couldn't set it up to work in a node script; since what it does is just optimize an SVG and the SVG format hasn't changed in years
-// is safe to use this older version, nothing groundbreaking is lost.
-import SVGO from 'svgo';
-
-import { ConfigData } from '../@types/ConfigData';
-import { AssetsCatalog } from '../@types/AssetsCatalog';
-
-// Notice: in case in the future you start to see SVGs containing strange "clipPath" attributes
-// is not a problem of SVGO configuration, is Figma adding it to the exported SVGs when the content of a frame/component
-// touches the borders of the bounding box. The solution is to uncheck the "Clip content" flag in the Figma UI for that element.
-// See: https://forum.figma.com/t/setting-an-explicit-svg-viewbox/2504/7
-const svgo = new SVGO({
-    plugins: [
-        // IMPORTANT: this is needed so SVGO will add the icon name (see below) as prefix for the IDs
-        { prefixIds: true },
-        { removeViewBox: false },
-        { sortAttrs: true },
-    ]
-});
-
-
-// if in the future this does more than simply optimize, we can rename it to "preprocessAssetsSVG"
-export async function optimizeAssetsSVG({ config, catalog } : { config: ConfigData, catalog: AssetsCatalog }): Promise<void> {
-
-    // IMPORTANT: don't use foreach here, it does async stuff inside!
-    for (const asset of catalog.assets) {
-        // Note: `svg-original/` directory is the raw .svg output from Figma, before processing
-        const srcAssetPath = `${config.mainFolder}/svg-original/${asset.fileName}.svg`;
-        const tempAssetPath = `${config.tempFolder}/${asset.fileName}.svg`;
-
-        // check that the asset actually exists in the "src" folder
-        if (fs.existsSync(srcAssetPath)) {
-            // Note: Noisy so commented out by default. Feel free to change locally.
-            // console.log(`Processing asset "${asset.fileName}.svg"`);
-
-            // optimize the SVG and add it to the temp folder
-            try {
-                const svgSource = await fs.readFile(srcAssetPath, 'utf8');
-
-                // IMPORTANT: the "path" is used by SVGO to extract the icon name and add it as prefix to the IDs
-                const svgOptimized = await svgo.optimize(svgSource, { path: asset.fileName });
-
-                await fs.outputFile(tempAssetPath, svgOptimized.data);
-
-            } catch (err) {
-                console.log(`Error with SVG optimization for ${asset.fileName}.svg:`);
-                console.error(err);
-            }
-
-        } else {
-            console.error(chalk.red(`ATTENTION:\nCould not find source file "${asset.fileName}.svg", please check why.\nYou can try to run the "sync" again and see if this fixes the issue.`));
-        }
-    }
-}

package/scripts/build-parts/zipSVGFolder.ts

@@ -1,43 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import fs from 'fs-extra';
-import archiver from 'archiver';
-
-export function zipSVGFolder({ srcFolderPath, zipFilePath } : { srcFolderPath: string, zipFilePath: string }): Promise<void> {
-    return new Promise<void>((resolve, reject) => {
-
-        // zip the content of the src directory (notice: if "parentFolder" is set to false, the archiver will not create a "root" parent folder)
-        const zipArchiver = archiver('zip', { zlib: { level: 9 } });
-        zipArchiver.directory(srcFolderPath, 'flight-icons-svg');
-
-        // handle warnings and errors
-        zipArchiver.on('warning', function (err) {
-            if (err.code === 'ENOENT') {
-                console.log('an error occurred', err, err.code);
-            } else {
-                reject(err);
-            }
-        });
-
-        zipArchiver.on('error', function (err) {
-            reject(err);
-        });
-
-        // create a file to stream archive data to
-        const outputStream = fs.createWriteStream(zipFilePath);
-
-        // on completion of the stream writing
-        outputStream.on('close', function () {
-            resolve();
-        });
-
-        // pipe stream data to the file
-        zipArchiver.pipe(outputStream);
-
-        // finalize the archive
-        zipArchiver.finalize();
-    });
-}

package/scripts/build.ts

@@ -1,88 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import dotenv from 'dotenv';
-import fs from 'fs-extra';
-import { deleteSync } from 'del';
-import chalk from 'chalk';
-
-import { optimizeAssetsSVG } from './build-parts/optimizeAssetsSVG';
-import { generateBundleSVG } from './build-parts/generateBundleSVG';
-import { generateBundleSymbolJS } from './build-parts/generateBundleSymbolJS';
-import { generateBundleSVGSprite } from './build-parts/generateBundleSVGSprite';
-import { generateBundleSVGReact } from './build-parts/generateBundleSVGReact';
-import { generatePublicZIPFile } from './build-parts/generatePublicZIPFile';
-
-// read the environment variables from the ".env" file
-dotenv.config();
-
-// read our custom config
-import { config } from './config';
-
-(async () => {
-    try {
-        console.log(`\n==========\n${chalk.cyan('Build started...')}\n==========\n`);
-
-        await build();
-
-        console.log(`\n==========\n${chalk.green('Build completed.')}\n==========\n`);
-
-    } catch (err) {
-        console.error(err);
-        process.exit(1);
-
-    }
-})();
-
-async function build() {
-
-    // prepare the temporary folder
-    try {
-        console.log('Preparing the "temp" folder');
-        if (fs.existsSync(config.tempFolder)) {
-            fs.emptyDirSync(config.tempFolder);
-        } else {
-            fs.mkdirsSync(config.tempFolder);
-        }
-    } catch (err) {
-        console.error(err);
-    }
-
-    // read the assets "catalog"
-    const catalog = fs.readJSONSync(`${config.mainFolder}/catalog.json`);
-
-    // pre-process the assets (SVG optimization)
-    console.log('Optimizing the SVG files');
-    await optimizeAssetsSVG({ config, catalog });
-
-    // generate the bundle for the standalone SVGs
-    console.log('Generating bundle for standalone SVG files');
-    await generateBundleSVG({ config, catalog });
-
-    // generate the bundle for the SVG JS files
-    console.log('Generating bundle for SVG JS files');
-    await generateBundleSymbolJS({ config, catalog });
-
-    // generate the bundle for the SVG sprite
-    console.log('Generating bundle for SVG sprite');
-    await generateBundleSVGSprite({ config, catalog });
-
-    // generate the bundle for the SVGs in React
-    console.log('Generating bundle for SVG React');
-    await generateBundleSVGReact({ config, catalog });
-
-    // zip the standalone SVG bundle and save it in the dummy app public folder
-    console.log('Generating ZIP file with standalone SVG files');
-    await generatePublicZIPFile({ config });
-
-    // remove temporary folder
-    // notice: comment this if you need to debug the assets initial SVG processing
-    try {
-        console.log('Removing the "temp" folder');
-        deleteSync(`${config.tempFolder}`, { force: true });
-    } catch (err) {
-        console.error(err);
-    }
-}

package/scripts/config.ts

@@ -1,26 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-
-import path from 'path';
-
-import { ConfigData } from "./@types/ConfigData";
-
-export const config: ConfigData = {
-    // the metadata for the Figma file we sync with
-    figmaFile: {
-        // this is the "production" file
-        id: 'TLnoT5AYQfy3tZ0H68BgOr', // if needed use this ID for testing purposes: `2u60imwCVJvSpH0io1O068`
-        page: 'Export',
-        // you can use this filter to exclude specific frames
-        excludeFrames: [],
-    },
-    // notice: these paths are relative to where the npm script is invoked, not this file!
-    mainFolder: '.',
-    tempFolder: './temp',
-    emberPublicFolder: path.resolve(__dirname, '../../../website/public'),
-    // number of files retrieved by figma-export in a batch request
-    syncConcurrency: 100,
-};

package/scripts/sync-parts/exportAssetsToFolder.ts

@@ -1,52 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import * as FigmaExport from '@figma-export/types';
-import * as figmaExport from '@figma-export/core';
-import outputComponentsAsSvg from '@figma-export/output-components-as-svg';
-
-import { ConfigData } from '../@types/ConfigData';
-import { AssetCoreData, AssetsMetadata } from '../@types/AssetsMetadata';
-import { getAssetFileName } from './getAssetFileName';
-
-export async function exportAssetsToFolder({ config, assetsMetadata } : { config: ConfigData, assetsMetadata: AssetsMetadata }): Promise<FigmaExport.PageNode[]> {
-
-    // override the "figma-export" functions (see: https://github.com/marcomontalbano/figma-export/tree/master/packages/output-components-as-svg)
-
-    // we removed the SVGO transformer, we will do it later in the "build" part with other parameters
-    const transformer: FigmaExport.StringTransformer[] = [];
-    const outputter: FigmaExport.ComponentOutputter[] = [
-        outputComponentsAsSvg({
-            output: config.mainFolder,
-            // IMPORTANT: when exported by Figma by default the variants' name looks like this: "Size=16, Style=Color"
-            // and we want to sanitize it (otherwise variants with the same props/values will override one another)
-            // so this is used to change icon's name to a "standard" format that will be used across the entire script
-            getBasename: (options: FigmaExport.ComponentOutputterParamOption): string => {
-                const assetCoreData: AssetCoreData = assetsMetadata[options.id];
-                return `${getAssetFileName(assetCoreData)}.svg`
-            },
-            // by default figma-export adds the "page" name to the path (so creating an extra folder)
-            // but we prefer to have all the icons saved under the "SVG" format (so we're open in the future to have other formats too)
-            getDirname: (): string => 'svg-original',
-        })
-    ];
-
-    let result: FigmaExport.PageNode[] = [];
-
-    await figmaExport.components({
-        fileId: config.figmaFile.id,
-        concurrency: config.syncConcurrency,
-        token: process.env.FIGMA_TOKEN || 'MISSING-TOKEN-ADD-IT-TO-ENV-FILE',
-        onlyFromPages: [config.figmaFile.page],
-        transformers: transformer,
-        outputters: outputter
-    }).then(async (figmaExportPageNode: FigmaExport.PageNode[]) => {
-        result = figmaExportPageNode;
-    }).catch((err: Error) => {
-        console.error(err);
-    });
-
-    return result;
-}

package/scripts/sync-parts/getAssetFileName.ts

@@ -1,23 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import { AssetCoreData } from "../@types/AssetsMetadata";
-
-export const getAssetFileName = (assetCoreData: AssetCoreData): string => {
-    const fileNameParts = [];
-    fileNameParts.push(assetCoreData.iconName);
-    if (assetCoreData.variantProps) {
-        if (assetCoreData.variantProps.tint) {
-            // we don't add the "mono" tint to the asset filename, it's considered the default
-            if (assetCoreData.variantProps.tint !== 'mono') {
-                fileNameParts.push(assetCoreData.variantProps.tint);
-            }
-        }
-        if (assetCoreData.variantProps.size) {
-            fileNameParts.push(assetCoreData.variantProps.size);
-        }
-    }
-    return `${fileNameParts.join('-')}`;
-}

package/scripts/sync-parts/getAssetsCatalog.ts

@@ -1,42 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import * as FigmaExport from '@figma-export/types';
-
-import { AssetCoreData, AssetsMetadata } from '../@types/AssetsMetadata';
-import { AssetCatalogItem, AssetsCatalog } from '../@types/AssetsCatalog';
-import { getAssetFileName } from './getAssetFileName';
-
-import { ConfigData } from '../@types/ConfigData';
-
-export function getAssetsCatalog({ config, assetsMetadata, figmaExportPageNode } : { config: ConfigData, assetsMetadata: AssetsMetadata, figmaExportPageNode: FigmaExport.PageNode[] }): AssetsCatalog {
-
-    // initialize the "catalog" object
-    const assetsCatalog: AssetsCatalog = {
-        lastRunTimeISO: new Date().toISOString(),
-        lastRunFigma: config.figmaFile,
-        assets: []
-    };
-
-    figmaExportPageNode[0].components.forEach(component => {
-
-        const assetCoreData: AssetCoreData = assetsMetadata[component.id];
-
-        // add the asset and its relevant data to the catalog and save it as JSON file
-        const assetCatalogItemData: AssetCatalogItem = {
-            id: component.id,
-            fileName: getAssetFileName(assetCoreData),
-            iconName: assetCoreData.iconName,
-            description: assetCoreData.description,
-            category: assetCoreData.category,
-            size: assetCoreData.variantProps?.size || '',
-            width: component.absoluteBoundingBox.width,
-            height: component.absoluteBoundingBox.width,
-        };
-        assetsCatalog.assets.push(assetCatalogItemData);
-    });
-
-    return assetsCatalog;
-}

package/scripts/sync-parts/getAssetsMetadata.ts

@@ -1,107 +0,0 @@
-/**
- * Copyright IBM Corp. 2021, 2025
- * SPDX-License-Identifier: MPL-2.0
- */
-
-import type { AssetCoreData, AssetsMetadata } from "../@types/AssetsMetadata";
-
-import { PublishedComponent, PublishedComponentSet } from '@figma/rest-api-spec';
-
-import { config } from '../config';
-
-import chalk from 'chalk';
-
-import * as Figma from 'figma-api';
-
-type ComponentSetData = {
-    [id: string] : {
-        name: string;
-        description: string;
-    }
-};
-
-export async function getAssetsMetadata(): Promise<AssetsMetadata> {
-
-    const assetsMetadata: AssetsMetadata = {};
-
-    const api = new Figma.Api({
-        personalAccessToken: process.env.FIGMA_TOKEN || 'MISSING-TOKEN-ADD-IT-TO-ENV-FILE',
-    });
-
-    // retrieve all the component_sets from the Figma file (later we'll use their names and descriptions for the icons)
-    const componentSetsResponse = await api.getFileComponentSets({ file_key: config.figmaFile.id });
-    const componentSetData: ComponentSetData = {};
-    if (componentSetsResponse.meta && componentSetsResponse.meta.component_sets) {
-        componentSetsResponse.meta.component_sets.forEach((component_set: PublishedComponentSet) => {
-            // check that the component_set is inside the expected page/frame
-            if (
-                component_set.containing_frame &&
-                component_set.containing_frame.name &&
-                component_set.containing_frame.pageName === config.figmaFile.page &&
-                !config.figmaFile.excludeFrames.includes(component_set.containing_frame.name)
-            ) {
-                componentSetData[component_set.node_id] = {
-                    name: component_set.name,
-                    description: component_set.description,
-                }
-            }
-        });
-    } else {
-        console.log(chalk.magenta('ATTENTION:\nNo component sets ("icons") found in the Figma file, please check that your configuration file has the right values for "page" and "frame" names.'));
-    }
-
-    const componentsResponse = await api.getFileComponents({ file_key: config.figmaFile.id });
-    if (componentsResponse.meta && componentsResponse.meta.components) {
-        componentsResponse.meta.components.forEach((component: PublishedComponent) => {
-            // check that the component is inside the expected page/frame
-            if (
-                component.containing_frame &&
-                component.containing_frame.name &&
-                component.containing_frame.pageName === config.figmaFile.page &&
-                !config.figmaFile.excludeFrames.includes(component.containing_frame.name)
-            ) {
-                assetsMetadata[component.node_id] = {
-                    id: component.node_id,
-                    variantName: component.name,
-                    iconName: '',
-                    description: '',
-                    category: '',
-                }
-                if (component.containing_frame.name) {
-                    // by convention the category of an icon is the containing frame's name
-                    assetsMetadata[component.node_id].category = component.containing_frame.name;
-                }
-                // this (missing `containingStateGroup` property) is a known issue:
-                // - https://forum.figma.com/t/missing-containingstategroup-parameter-in-documentation-for-frameinfo/2558
-                // - https://github.com/figma/rest-api-spec/issues/29
-                // @ts-ignore
-                if (component.containing_frame.containingStateGroup) {
-                    // @ts-ignore
-                    const parentComponentSet = componentSetData[component.containing_frame.containingStateGroup.nodeId]
-                    if (parentComponentSet) {
-                        assetsMetadata[component.node_id].iconName = parentComponentSet.name;
-                        assetsMetadata[component.node_id].description = parentComponentSet.description;
-                    }
-                }
-
-                // extract the variant props as independent key/value entries (based on the variant name)
-                const variantProperties: AssetCoreData['variantProps'] = {};
-                component.name.split(', ').forEach(partial => {
-                    const match = partial.match(/(.*)=(.*)/)
-                    if (match) {
-                        // we want to make sure all the props key/values for the props are lowercase
-                        const propName = match[1].toLowerCase();
-                        const propValue = match[2].toLowerCase();
-                        variantProperties[propName] = propValue;
-                    }
-                });
-                assetsMetadata[component.node_id].variantProps = variantProperties;
-            }
-        });
-    } else {
-        console.log(chalk.magenta('ATTENTION:\nNo components ("icons variants") found in the Figma file, please check that your configuration file has the right values for "page" and "frame" names.'));
-    }
-
-    return assetsMetadata;
-
-}