@cloud-ru/ft-gulp-icon-builder 1.0.1-preview-df9ff74.0

package/dist/cjs/utils/svgr-template.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTemplate = void 0;
+const size = 24;
+const getTemplate = ({ idPrefix, generateDataTestId }) => ({ imports, interfaces, componentName, exports }, { tpl }) => {
+    const testId = generateDataTestId(componentName);
+    const componentProp = size ? `{ size = ${size}, ...props }: ISvgIconProps` : `{ size, ...props }: ISvgIconProps`;
+    return tpl `
+    // DO NOT EDIT IT MANUALLY
+    ${imports}
+    ${interfaces}
+
+    export interface ISvgIconProps extends SVGProps<SVGSVGElement> {
+      className?: string;
+      size?: number;
+      style?: React.CSSProperties;
+    }
+
+    const ${componentName} = React.forwardRef((${componentProp}, ref: React.Ref<SVGSVGElement>) => {
+      props.width = undefined;
+      props.height = undefined;
+
+      const testId = ${JSON.stringify(testId)};
+      const isCustomSize = typeof size === 'number';
+
+      if(isCustomSize) {
+        if(!props.style) props.style = {};
+        props.style.width = size+"px";
+        props.style.height = size+"px";
+      }
+
+      return (
+        <svg
+          ref={ref}
+          xmlns='http://www.w3.org/2000/svg'
+          width={24}
+          height={24}
+          fill='currentColor'
+          viewBox='0 0 24 24'
+          data-test-id={'icon-' + testId}
+          {...props}
+         >
+           <use href={'#' + ${JSON.stringify(idPrefix)} + '-' + testId} />
+        </svg>
+      );
+    });
+
+    ${exports}
+    `;
+};
+exports.getTemplate = getTemplate;

package/dist/esm/index.d.ts

@@ -0,0 +1,7 @@
+export { gulpFixSvg } from './svg-fixer';
+export { gulpSvgSizeValidator } from './svg-size-validator';
+export { gulpSvgUniqValidator } from './svg-uniq-validator';
+export { gulpCreateSvgSprite } from './svg-create-sprite';
+export { gulpSvgr, type GulpSvgrParams } from './svg-svgr';
+export { gulpSvgIndexFile } from './svg-index-file';
+export * from './utils';

package/dist/esm/index.js

@@ -0,0 +1,7 @@
+export { gulpFixSvg } from './svg-fixer';
+export { gulpSvgSizeValidator } from './svg-size-validator';
+export { gulpSvgUniqValidator } from './svg-uniq-validator';
+export { gulpCreateSvgSprite } from './svg-create-sprite';
+export { gulpSvgr } from './svg-svgr';
+export { gulpSvgIndexFile } from './svg-index-file';
+export * from './utils';

package/dist/esm/svg-create-sprite.d.ts

@@ -0,0 +1,4 @@
+export declare function gulpCreateSvgSprite({ filePath, idPrefix }: {
+    idPrefix: string;
+    filePath: string;
+}): import("stream").Transform;

package/dist/esm/svg-create-sprite.js

@@ -0,0 +1,35 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import fs from 'node:fs';
+import path from 'node:path';
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+import SVGSprite from 'svg-sprite';
+import { createPipeTransformer } from './utils/createPipeTransformer';
+export function gulpCreateSvgSprite({ filePath, idPrefix }) {
+    const sprite = new SVGSprite({
+        dest: path.resolve(process.cwd(), filePath),
+        mode: {
+            symbol: true,
+        },
+    });
+    return createPipeTransformer({
+        transformer: (file, _encoding, callback) => {
+            const content = file.contents.toString();
+            const name = (idPrefix + '-' + path.basename(file.path)).split('.')[0];
+            sprite.add(name, null, content.replace(/fill="[A-Za-z0-9#]+"/g, 'fill="inherit"'));
+            callback(null, file);
+        },
+        onEnd: () => __awaiter(this, void 0, void 0, function* () {
+            const { result } = yield sprite.compileAsync();
+            fs.writeFileSync(path.resolve(process.cwd(), filePath), result.symbol.sprite.contents.toString());
+        }),
+    });
+}

package/dist/esm/svg-fixer.d.ts

@@ -0,0 +1 @@
+export declare function gulpFixSvg(): import("stream").Transform;

package/dist/esm/svg-fixer.js

@@ -0,0 +1,23 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-expect-error
+import svgFixer from 'oslllo-svg-fixer';
+import { createPipeTransformer } from './utils/createPipeTransformer';
+const fixSvg = svgFixer.fixString;
+export function gulpFixSvg() {
+    return createPipeTransformer({
+        transformer: (file, encoding, callback) => __awaiter(this, void 0, void 0, function* () {
+            const fixedSvg = yield fixSvg(file.contents);
+            file.contents = Buffer.from(fixedSvg, encoding);
+            return callback(null, file);
+        }),
+    });
+}

package/dist/esm/svg-index-file.d.ts

@@ -0,0 +1,6 @@
+type Params = {
+    src: string;
+    dest: string;
+};
+export declare function gulpSvgIndexFile({ src, dest }: Params): import("stream").Transform;
+export {};

package/dist/esm/svg-index-file.js

@@ -0,0 +1,56 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import fs from 'node:fs';
+import path from 'node:path';
+import { createPipeTransformer } from './utils/createPipeTransformer';
+import { getComponent } from './utils/index-template';
+const capitalizeFirstLetter = (str) => {
+    if (!str)
+        return str;
+    return str.charAt(0).toUpperCase() + str.slice(1);
+};
+export function gulpSvgIndexFile({ src, dest }) {
+    const folders = {};
+    const getTail = (fullPath) => fullPath.replace(`${path.resolve(process.cwd(), src)}/`, '');
+    return createPipeTransformer({
+        transformer: (file, _encoding, callback) => {
+            const folder = file.dirname;
+            const files = folders[folder] || [];
+            files.push(file.basename);
+            folders[folder] = files;
+            callback(null, file);
+        },
+        onEnd: () => __awaiter(this, void 0, void 0, function* () {
+            const imports = [];
+            let indexFile;
+            for (const [folder, files] of Object.entries(folders)) {
+                if (files.length !== 1 && files.length !== 2) {
+                    throw new Error(`Unexpected count of files in folder: ${folder}`);
+                }
+                {
+                    // index file for icon folder
+                    const component = files.length === 2 ? getComponent(files, 'Component') : `export * from './${files[0].split('.')[0]}';`;
+                    const finalFilePath = path.resolve(dest, getTail(folder), 'index.tsx');
+                    fs.writeFileSync(finalFilePath, component);
+                }
+                {
+                    // index file for all
+                    const folderName = path.basename(folder);
+                    const componentName = capitalizeFirstLetter(folderName);
+                    imports.push(`export { default as ${componentName} } from './${folderName}';`);
+                    if (!indexFile) {
+                        indexFile = path.resolve(dest, getTail(path.dirname(folder)), 'index.tsx');
+                    }
+                }
+            }
+            fs.writeFileSync(indexFile, imports.join('\n'));
+        }),
+    });
+}

package/dist/esm/svg-size-validator.d.ts

@@ -0,0 +1 @@
+export declare function gulpSvgSizeValidator(maxSize?: number): import("stream").Transform;

package/dist/esm/svg-size-validator.js

@@ -0,0 +1,24 @@
+import { XMLParser } from 'fast-xml-parser';
+import { createPipeTransformer } from './utils/createPipeTransformer';
+export function gulpSvgSizeValidator(maxSize = 24) {
+    const parser = new XMLParser({
+        ignoreAttributes: false,
+        attributeNamePrefix: '@_',
+    });
+    return createPipeTransformer({
+        transformer: (file, _encoding, callback) => {
+            const content = file.contents.toString();
+            /*
+            А че, если мы не будем здесь стопать парсингом xml пайп, а вместо этого отложим парсинг и проверку в асинхронный пул?
+            А дожидаться разгребания этого пула будем в колбеке закрытия стрима, когда вся основная работа уже сделана.
+          */
+            const xml = parser.parse(content);
+            const width = xml.svg['@_width'];
+            const height = xml.svg['@_height'];
+            if ((width && Number(width) > maxSize) || (height && Number(height) > maxSize)) {
+                return callback(new Error(`Icon size is bigger than ${maxSize}px, please make it smaller:\n\t${file.path}\n`));
+            }
+            return callback(null, file);
+        },
+    });
+}

package/dist/esm/svg-svgr.d.ts

@@ -0,0 +1,5 @@
+import type { Template } from '@svgr/babel-plugin-transform-svg-component';
+export type GulpSvgrParams = {
+    template: Template;
+};
+export declare function gulpSvgr({ template }: GulpSvgrParams): import("stream").Transform;

package/dist/esm/svg-svgr.js

@@ -0,0 +1,23 @@
+import { transform } from '@svgr/core';
+import { getComponentName } from './utils';
+import { createPipeTransformer } from './utils/createPipeTransformer';
+export function gulpSvgr({ template }) {
+    return createPipeTransformer({
+        transformer: (file, _encoding, callback) => {
+            const content = file.contents.toString();
+            const componentName = getComponentName(file.basename);
+            const result = transform.sync(content, {
+                icon: true,
+                template,
+                typescript: true,
+                expandProps: 'end',
+                jsxRuntime: 'classic',
+                exportType: 'default',
+                plugins: ['@svgr/plugin-jsx'],
+            }, { componentName, caller: { name: 'gulp-svgr' }, filePath: file.path });
+            file.contents = Buffer.from(result);
+            file.extname = '.tsx';
+            callback(null, file);
+        },
+    });
+}

package/dist/esm/svg-uniq-validator.d.ts

@@ -0,0 +1 @@
+export declare function gulpSvgUniqValidator(): import("stream").Transform;

package/dist/esm/svg-uniq-validator.js

@@ -0,0 +1,16 @@
+import { createPipeTransformer } from './utils/createPipeTransformer';
+export function gulpSvgUniqValidator() {
+    const storage = new Map();
+    return createPipeTransformer({
+        transformer: (file, _encoding, callback) => {
+            const content = file.contents.toString();
+            const alreadyHaveIcon = storage.get(content);
+            const iconPath = file.path;
+            if (alreadyHaveIcon) {
+                return callback(new Error(`There are duplicating icons:\n\t${alreadyHaveIcon} \n\t${iconPath}\n`));
+            }
+            storage.set(content, iconPath);
+            callback(null, file);
+        },
+    });
+}

package/dist/esm/utils/createPipeTransformer.d.ts

@@ -0,0 +1,10 @@
+import { Transform } from 'node:stream';
+import type File from 'vinyl';
+type TransformCallback = (err?: Error | null, data?: File) => void;
+type Transformer = (file: File.BufferFile, _encoding: BufferEncoding, callback: TransformCallback) => void;
+export type PipeTransformerParams = {
+    transformer: Transformer;
+    onEnd?: () => void;
+};
+export declare function createPipeTransformer({ transformer, onEnd }: PipeTransformerParams): Transform;
+export {};

package/dist/esm/utils/createPipeTransformer.js

@@ -0,0 +1,32 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { Transform } from 'node:stream';
+export function createPipeTransformer({ transformer, onEnd }) {
+    const stream = new Transform({
+        objectMode: true,
+        transform(file, _encoding, callback) {
+            return __awaiter(this, void 0, void 0, function* () {
+                if (file.isNull()) {
+                    return callback(null, file);
+                }
+                if (file.isStream()) {
+                    return callback(new Error('Streaming not supported'));
+                }
+                if (file.isBuffer()) {
+                    return transformer(file, _encoding, callback);
+                }
+                return callback(null, file);
+            });
+        },
+    });
+    if (onEnd)
+        stream.on('end', onEnd);
+    return stream;
+}

package/dist/esm/utils/index-template.d.ts

@@ -0,0 +1 @@
+export declare const getComponent: (iconFiles: string[], componentName: string) => string;

package/dist/esm/utils/index-template.js

@@ -0,0 +1,30 @@
+const ICON_PROPS = `
+export interface ISvgIconProps extends SVGProps<SVGSVGElement> {
+  className?: string;
+  size?: number;
+  style?: React.CSSProperties;
+}
+`;
+const REACT_IMPORT = "import { SVGProps, forwardRef, Ref } from 'react';";
+const DEFAULT_SIZE = 24;
+const getExportName = (fileName) => (fileName.endsWith('xs.tsx') ? 'XsSVG' : 'SSVG');
+const withoutExtension = (fileName) => fileName.split('.')[0];
+export const getComponent = (iconFiles, componentName) => {
+    const iconImports = iconFiles
+        .map(file => `import { default as ${getExportName(file)} } from './${withoutExtension(file)}';`)
+        .join('\n');
+    const finalComponentName = `${componentName}SVG`;
+    return `
+  ${REACT_IMPORT}
+  ${iconImports}
+  
+  ${ICON_PROPS}
+  
+  const ${finalComponentName} = forwardRef(({ size = ${DEFAULT_SIZE}, ...props }: ISvgIconProps, ref: Ref<SVGSVGElement>) => {
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    return Number(size) >= 20 ? <SSVG ref={ref} size={size} {...props} /> : <XsSVG ref={ref} size={size} {...props} />;
+  });
+
+  export default ${finalComponentName};`;
+};

package/dist/esm/utils/index.d.ts

@@ -0,0 +1,3 @@
+export { getTemplate } from './svgr-template';
+export { getComponent } from './index-template';
+export * from './name';

package/dist/esm/utils/index.js

@@ -0,0 +1,3 @@
+export { getTemplate } from './svgr-template';
+export { getComponent } from './index-template';
+export * from './name';

package/dist/esm/utils/name.d.ts

@@ -0,0 +1,2 @@
+export declare function getTestId(componentName: string): string;
+export declare function getComponentName(fileName: string): string;

package/dist/esm/utils/name.js

@@ -0,0 +1,8 @@
+import camelcase from 'camelcase';
+import kebabCase from 'kebab-case';
+export function getTestId(componentName) {
+    return kebabCase(componentName.replace('Svg', ''), false);
+}
+export function getComponentName(fileName) {
+    return camelcase(fileName);
+}

package/dist/esm/utils/svgr-template.d.ts

@@ -0,0 +1,7 @@
+import type { Template } from '@svgr/babel-plugin-transform-svg-component';
+type getTemplateParams = {
+    idPrefix: string;
+    generateDataTestId: (fileName: string) => string;
+};
+export declare const getTemplate: ({ idPrefix, generateDataTestId }: getTemplateParams) => Template;
+export {};

package/dist/esm/utils/svgr-template.js

@@ -0,0 +1,47 @@
+const size = 24;
+export const getTemplate = ({ idPrefix, generateDataTestId }) => ({ imports, interfaces, componentName, exports }, { tpl }) => {
+    const testId = generateDataTestId(componentName);
+    const componentProp = size ? `{ size = ${size}, ...props }: ISvgIconProps` : `{ size, ...props }: ISvgIconProps`;
+    return tpl `
+    // DO NOT EDIT IT MANUALLY
+    ${imports}
+    ${interfaces}
+
+    export interface ISvgIconProps extends SVGProps<SVGSVGElement> {
+      className?: string;
+      size?: number;
+      style?: React.CSSProperties;
+    }
+
+    const ${componentName} = React.forwardRef((${componentProp}, ref: React.Ref<SVGSVGElement>) => {
+      props.width = undefined;
+      props.height = undefined;
+
+      const testId = ${JSON.stringify(testId)};
+      const isCustomSize = typeof size === 'number';
+
+      if(isCustomSize) {
+        if(!props.style) props.style = {};
+        props.style.width = size+"px";
+        props.style.height = size+"px";
+      }
+
+      return (
+        <svg
+          ref={ref}
+          xmlns='http://www.w3.org/2000/svg'
+          width={24}
+          height={24}
+          fill='currentColor'
+          viewBox='0 0 24 24'
+          data-test-id={'icon-' + testId}
+          {...props}
+         >
+           <use href={'#' + ${JSON.stringify(idPrefix)} + '-' + testId} />
+        </svg>
+      );
+    });
+
+    ${exports}
+    `;
+};

package/package.json

@@ -0,0 +1,50 @@
+{
+  "name": "@cloud-ru/ft-gulp-icon-builder",
+  "version": "1.0.1-preview-df9ff74.0",
+  "description": "",
+  "keywords": [
+    ""
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "gulp": "gulp"
+  },
+  "author": "yetihead <yetibrain@yandex.ru>",
+  "license": "Apache-2.0",
+  "types": "./dist/esm/index.d.ts",
+  "exports": {
+    "import": "./dist/esm/index.js",
+    "require": "./dist/cjs/index.js"
+  },
+  "files": [
+    "dist/esm",
+    "dist/cjs",
+    "src",
+    "./CHANGELOG.md",
+    "LICENSE"
+  ],
+  "homepage": "https://github.com/cloud-ru-tech/frontend-toolspackages/gulp-icon-builder",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/cloud-ru-tech/frontend-tools.git",
+    "directory": "packages/gulp-icon-builder"
+  },
+  "dependencies": {
+    "@svgr/core": "8.1.0",
+    "@svgr/plugin-jsx": "8.1.0",
+    "camelcase": "5.3.1",
+    "fast-xml-parser": "5.3.3",
+    "gulp": "5.0.1",
+    "kebab-case": "2.0.2",
+    "oslllo-svg-fixer": "6.0.1",
+    "svg-sprite": "2.0.4",
+    "vinyl": "3.0.1"
+  },
+  "devDependencies": {
+    "@types/vinyl": "2.0.12",
+    "gulp-cli": "3.1.0"
+  },
+  "gitHead": "c9d8d521a1fede651fad5e57d618849e24b61acb"
+}

package/src/index.ts

@@ -0,0 +1,7 @@
+export { gulpFixSvg } from './svg-fixer';
+export { gulpSvgSizeValidator } from './svg-size-validator';
+export { gulpSvgUniqValidator } from './svg-uniq-validator';
+export { gulpCreateSvgSprite } from './svg-create-sprite';
+export { gulpSvgr, type GulpSvgrParams } from './svg-svgr';
+export { gulpSvgIndexFile } from './svg-index-file';
+export * from './utils';

package/src/svg-create-sprite.ts

@@ -0,0 +1,33 @@
+import fs from 'node:fs';
+import path from 'node:path';
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+import SVGSprite from 'svg-sprite';
+
+import { createPipeTransformer } from './utils/createPipeTransformer';
+
+export function gulpCreateSvgSprite({ filePath, idPrefix }: { idPrefix: string; filePath: string }) {
+  const sprite = new SVGSprite({
+    dest: path.resolve(process.cwd(), filePath),
+    mode: {
+      symbol: true,
+    },
+  });
+
+  return createPipeTransformer({
+    transformer: (file, _encoding, callback) => {
+      const content = file.contents.toString();
+
+      const name = (idPrefix + '-' + path.basename(file.path)).split('.')[0];
+
+      sprite.add(name, null, content.replace(/fill="[A-Za-z0-9#]+"/g, 'fill="inherit"'));
+
+      callback(null, file);
+    },
+
+    onEnd: async () => {
+      const { result } = await sprite.compileAsync();
+      fs.writeFileSync(path.resolve(process.cwd(), filePath), result.symbol.sprite.contents.toString());
+    },
+  });
+}

package/src/svg-fixer.ts

@@ -0,0 +1,19 @@
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-expect-error
+import svgFixer from 'oslllo-svg-fixer';
+
+import { createPipeTransformer } from './utils/createPipeTransformer';
+
+type SvgFixer = { fixString: (svg: string | Buffer) => Promise<string> };
+
+const fixSvg = (svgFixer as unknown as SvgFixer).fixString;
+
+export function gulpFixSvg() {
+  return createPipeTransformer({
+    transformer: async (file, encoding, callback) => {
+      const fixedSvg = await fixSvg(file.contents);
+      file.contents = Buffer.from(fixedSvg, encoding);
+      return callback(null, file);
+    },
+  });
+}

package/src/svg-index-file.ts

@@ -0,0 +1,63 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
+import { createPipeTransformer } from './utils/createPipeTransformer';
+import { getComponent } from './utils/index-template';
+
+type Params = {
+  src: string;
+  dest: string;
+};
+
+const capitalizeFirstLetter = (str: string): string => {
+  if (!str) return str;
+  return str.charAt(0).toUpperCase() + str.slice(1);
+};
+
+export function gulpSvgIndexFile({ src, dest }: Params) {
+  const folders: Record<string, string[]> = {};
+
+  const getTail = (fullPath: string) => fullPath.replace(`${path.resolve(process.cwd(), src)}/`, '');
+
+  return createPipeTransformer({
+    transformer: (file, _encoding, callback) => {
+      const folder = file.dirname;
+      const files = folders[folder] || [];
+      files.push(file.basename);
+      folders[folder] = files;
+
+      callback(null, file);
+    },
+
+    onEnd: async () => {
+      const imports: string[] = [];
+      let indexFile: string | undefined;
+
+      for (const [folder, files] of Object.entries(folders)) {
+        if (files.length !== 1 && files.length !== 2) {
+          throw new Error(`Unexpected count of files in folder: ${folder}`);
+        }
+
+        {
+          // index file for icon folder
+          const component =
+            files.length === 2 ? getComponent(files, 'Component') : `export * from './${files[0].split('.')[0]}';`;
+          const finalFilePath = path.resolve(dest, getTail(folder), 'index.tsx');
+          fs.writeFileSync(finalFilePath, component);
+        }
+
+        {
+          // index file for all
+          const folderName = path.basename(folder);
+          const componentName = capitalizeFirstLetter(folderName);
+          imports.push(`export { default as ${componentName} } from './${folderName}';`);
+          if (!indexFile) {
+            indexFile = path.resolve(dest, getTail(path.dirname(folder)), 'index.tsx');
+          }
+        }
+      }
+
+      fs.writeFileSync(indexFile as string, imports.join('\n'));
+    },
+  });
+}

package/src/svg-size-validator.ts

@@ -0,0 +1,30 @@
+import { XMLParser } from 'fast-xml-parser';
+
+import { createPipeTransformer } from './utils/createPipeTransformer';
+
+export function gulpSvgSizeValidator(maxSize: number = 24) {
+  const parser = new XMLParser({
+    ignoreAttributes: false,
+    attributeNamePrefix: '@_',
+  });
+
+  return createPipeTransformer({
+    transformer: (file, _encoding, callback) => {
+      const content = file.contents.toString();
+      /*
+      А че, если мы не будем здесь стопать парсингом xml пайп, а вместо этого отложим парсинг и проверку в асинхронный пул?
+      А дожидаться разгребания этого пула будем в колбеке закрытия стрима, когда вся основная работа уже сделана.
+    */
+      const xml = parser.parse(content);
+
+      const width = xml.svg['@_width'];
+      const height = xml.svg['@_height'];
+
+      if ((width && Number(width) > maxSize) || (height && Number(height) > maxSize)) {
+        return callback(new Error(`Icon size is bigger than ${maxSize}px, please make it smaller:\n\t${file.path}\n`));
+      }
+
+      return callback(null, file);
+    },
+  });
+}