Skip to content

Commit

Permalink
fix(plasma-icons): handle icons size
Browse files Browse the repository at this point in the history
  • Loading branch information
Yakutoc committed Jun 19, 2024
1 parent d3160af commit 26d7555
Showing 1 changed file with 43 additions and 21 deletions.
64 changes: 43 additions & 21 deletions packages/plasma-icons/scripts/generateReactComponents.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,11 @@ import * as path from 'path';
import { getIconAsset, getIconComponent } from './utils';

const rootPath = './src-build/scalable';

const sourceDirectory16 = `${rootPath}/Icon.svg.16`;
const sourceDirectory36 = `${rootPath}/Icon.svg.36`;
const sourceDirectory = `${rootPath}/Icon.svg.24`;

const AssetDirectory16 = `${rootPath}/Icon.assets.16`;
const AssetDirectory24 = `${rootPath}/Icon.assets.24`;
const AssetDirectory36 = `${rootPath}/Icon.assets.36`;
Expand All @@ -17,6 +21,11 @@ const destinations = [AssetDirectory16, AssetDirectory24, AssetDirectory36, Icon

const files = fs.readdirSync(sourceDirectory);

// INFO: заглушка под другие размеры, использовать по необходимости
// const assetContentNull = `export const ${componentName} = null;\n`;
// @example
// fs.writeFileSync(getPath(AssetDirectory42, componentName), assetContentNull, 'utf8')

// Создаем директории, если нет
destinations.forEach((destination) => {
if (!fs.existsSync(destination)) {
Expand All @@ -26,32 +35,37 @@ destinations.forEach((destination) => {

const names: Array<string> = [];

const getPath = (dir: string, name: string) => {
return path.join(dir, `${name}.tsx`);
};

files.forEach((file) => {
const sourceFilePath = path.join(sourceDirectory, file);
const extension = path.extname(file);

if (extension !== '.svg') {
return;
}

const data = fs.readFileSync(sourceFilePath, 'utf8');
const svg16 = fs.readFileSync(path.join(sourceDirectory16, file), 'utf8');
const svg24 = fs.readFileSync(path.join(sourceDirectory, file), 'utf8');
const svg36 = fs.readFileSync(path.join(sourceDirectory36, file), 'utf8');

const componentName = path.parse(file).name;

names.push(componentName);
const assetContent24 = getIconAsset(data, componentName);
// заглушка под другие размеры
const assetContentNull = `export const ${componentName} = null;\n`;
const componentContent = getIconComponent(componentName);

const getPath = (dir: string, name: string) => {
return path.join(dir, `${name}.tsx`);
};
const assetContent16 = getIconAsset(svg16, componentName);
const assetContent24 = getIconAsset(svg24, componentName);
const assetContent36 = getIconAsset(svg36, componentName);

const componentContent = getIconComponent(componentName);

// генерируем файлы-ассеты
fs.writeFileSync(getPath(AssetDirectory16, componentName), assetContentNull, 'utf8');
// генерируем файлы-assets
fs.writeFileSync(getPath(AssetDirectory16, componentName), assetContent16, 'utf8');
fs.writeFileSync(getPath(AssetDirectory24, componentName), assetContent24, 'utf8');
fs.writeFileSync(getPath(AssetDirectory36, componentName), assetContentNull, 'utf8');
// генерируем компоненты
fs.writeFileSync(getPath(AssetDirectory36, componentName), assetContent36, 'utf8');

// генерируем компонент
fs.writeFileSync(getPath(IconsDirectory, `Icon${componentName}`), componentContent, 'utf8');
});

Expand All @@ -64,13 +78,21 @@ const indexExport = names

fs.appendFileSync(IndexPath, indexExport, 'utf8');

// добавляем к маппингу по категориям
const dataIconFile = fs.readFileSync(IconPath, 'utf8');
const iconImport = names
.map((name) => {
return `import { ${name} } from '.${AssetDirectory24.replace(rootPath, '')}/${name}';`;
})
.join('\n');
const resultIconFile = iconImport + '\n' + dataIconFile.replace(/\'/g, '');
// добавляем mapping по категориям
let dataIconFile = fs.readFileSync(IconPath, 'utf8');

const iconImports = [];

names.forEach((name) => {
const regex = new RegExp(`'${name}'`);
const iconName = `Icon${name}`;

// INFO: В файле Icon.tsx заменяем строку типа alarmAddFill: 'AlarmAddFill' -> alarmAddFill: IconAlarmAddFill
dataIconFile = dataIconFile.replace(regex, iconName);

iconImports.push(`import { ${iconName} } from './Icons/${iconName}';`);
});

const resultIconFile = iconImports.join('\n') + '\n\n' + dataIconFile;

fs.writeFileSync(IconPath, resultIconFile, 'utf8');

0 comments on commit 26d7555

Please sign in to comment.