@skbkontur/icons-codemods

Пакет с кодмодами для пакета иконок @skbkontur/icons.
Для запуска потребуется Node 20.19.0 и выше.

Использование

Рекомендуемый запуск (полная миграция v1 🠊 v2) через корпоративный registry (Nexus):

npm exec --yes --registry=https://nexus.kontur.host/repository/kontur-npm-group/ @skbkontur/icons-codemods -- \
icons-v1-v2/transformImports.js --parser tsx --extensions ts,tsx,js,jsx ./src && \
npm exec --yes --registry=https://nexus.kontur.host/repository/kontur-npm-group/ @skbkontur/icons-codemods -- \
icons-v1-v2/transformExports.js --parser tsx --extensions ts,tsx,js,jsx ./src

Если версия Node не подходит, переключитесь перед запуском: nvm use --lts. Если нужно зафиксировать конкретный релиз, укажите версию явно: @skbkontur/icons-codemods@<version>.

Если нужно запустить по шагам:

npm exec --yes --registry=https://nexus.kontur.host/repository/kontur-npm-group/ @skbkontur/icons-codemods -- \
  icons-v1-v2/transformImports.js --parser tsx --extensions ts,tsx,js,jsx ./src

npm exec --yes --registry=https://nexus.kontur.host/repository/kontur-npm-group/ @skbkontur/icons-codemods -- \
  icons-v1-v2/transformExports.js --parser tsx --extensions ts,tsx,js,jsx ./src

CLI по умолчанию запускает jscodeshift c --gitignore. Если при явном пути получается No files selected, nothing to do, команда автоматически повторяется без --gitignore.

Список кодмодов

Миграция @skbkontur/icons с v1 на v2

Трансформации:

• Обновляет формат имён [Name]Icon[Size][Weight] 🠊 Icon[Name][Weight][Size]

• Цельные иконки переименовываются с дефолтным начертанием ...Regular16

• Приводит все импорты в единый формат @skbkontur/icons/{Icon...Regular16}

• Алиасы остаются

• Учитывает weight в JSX (weight="light|regular|solid") и переносит его в имя иконки

• Учитывает size в JSX для выбора ближайшего существующего size/weight-варианта

• Удаляет weight-проп из JSX после переноса в имя иконки

• Дедуплицирует совпавшие импорты после трансформации

• Сохраняет leading-комментарии в начале файла (например, /* eslint-disable */)

• Кодмод исправляет неправильные сочетания weight/size на ближайшее начертание из таблицы: | | Light | Regular | Solid | | :--- | :---: | :---: | :---: | | 16 | ✅ | ✅ | ✅ | | 20 | ✅ | ✅ | ✅ | | 24 | ❌ | ✅ | ✅ | | 32 | ❌ | ✅ | ❌ | | 64 | ❌ | ✅ | ❌ |

• Если weight/size не удается определить, то подставится Regular16

icons-v1-v2/transformImports

Использование

npm exec --yes --registry=https://nexus.kontur.host/repository/kontur-npm-group/ \
  @skbkontur/icons-codemods \
  -- icons-v1-v2/transformImports.js --parser tsx --extensions ts,tsx,js,jsx ./src

Пример

import { CertRosetteIcon20Solid } from "@skbkontur/icons/icons/CertRosetteIcon/CertRosetteIcon20Solid";
import { NetCloudIcon16Light as Cloud } from "@skbkontur/icons/icons/NetCloudIcon16Light";
import { PeopleCircle1Icon24Regular } from "@skbkontur/icons/icons/PeopleCircle1Icon";
import { QuestionSquareIcon16Regular as HelpLite } from "@skbkontur/icons/icons/QuestionSquareIcon/QuestionSquareIcon16Regular";
import { XIcon } from "@skbkontur/icons/XIcon";
import { RootIcon } from "@skbkontur/icons";
import { Root1Icon, Root2Icon as Root, Root3Icon20Solid } from "@skbkontur/icons";

export const fixture = () => (
  <>
    <XIcon />
    <Cloud />
    <CertRosetteIcon20Solid />
    <PeopleCircle1Icon24Regular />
    <HelpLite />
    <RootIcon />
    <Root1Icon size={24} />
    <Root />
    <Root3Icon20Solid />
  </>
);

🠋

import { IconCertRosetteSolid20 } from "@skbkontur/icons/IconCertRosetteSolid20";
import { IconNetCloudLight16 as Cloud } from "@skbkontur/icons/IconNetCloudLight16";
import { IconPeopleCircle1Regular24 } from "@skbkontur/icons/IconPeopleCircle1Regular24";
import { IconQuestionSquareRegular16 as HelpLite } from "@skbkontur/icons/IconQuestionSquareRegular16";
import { IconXRegular16 } from "@skbkontur/icons/IconXRegular16";
import { IconRootRegular16 } from "@skbkontur/icons/IconRootRegular16";
import { IconRoot1Regular16 } from "@skbkontur/icons/IconRoot1Regular16";
import { IconRoot2Regular16 as Root } from "@skbkontur/icons/IconRoot2Regular16";
import { IconRoot3Solid20 } from "@skbkontur/icons/IconRoot3Solid20";

export const fixture = () => (
  <>
    <IconXRegular16 />
    <Cloud />
    <IconCertRosetteSolid20 />
    <IconPeopleCircle1Regular24 />
    <HelpLite />
    <IconRootRegular16 />
    <IconRoot1Regular16 size={24} />
    <Root />
    <IconRoot3Solid20 />
  </>
);

Дополнительный пример (учёт weight/size):

import { RootIcon } from "@skbkontur/icons";
import { XIcon as Close } from "@skbkontur/icons";
import { LinkIcon as LightSized } from "@skbkontur/icons";

export const fixture = (props: Record<any, any>) => (
    <>
        <RootIcon color="red" size={30} weight="solid" />
        <Close weight={"light"} size={18} />
        <Close weight={props.weight} />
        <LightSized weight="light" size={24} />
    </>
);

🠋

import { IconRootSolid24 } from "@skbkontur/icons/IconRootSolid24";
import { IconXRegular16 as Close } from "@skbkontur/icons/IconXRegular16";
import { IconLinkLight20 as LightSized } from "@skbkontur/icons/IconLinkLight20";

export const fixture = (props: Record<any, any>) => (
    <>
        <IconRootSolid24 color="red" size={30} />
        <Close size={18} />
        <Close />
        <LightSized size={24} />
    </>
);

Дополнительный пример (дедупликация и сохранение комментария):

/* eslint-disable */
import { ToolPencilLineIcon } from "@skbkontur/icons/icons/ToolPencilLineIcon";
import { ToolPencilLineIcon16Regular } from "@skbkontur/icons/icons/ToolPencilLineIcon/ToolPencilLineIcon16Regular";

export const fixture = () => (
  <>
    <ToolPencilLineIcon />
    <ToolPencilLineIcon16Regular />
  </>
);

🠋

/* eslint-disable */
import { IconToolPencilLineRegular16 } from "@skbkontur/icons/IconToolPencilLineRegular16";

export const fixture = () => (
  <>
    <IconToolPencilLineRegular16 />
    <IconToolPencilLineRegular16 />
  </>
);

icons-v1-v2/transformExports

Использование

npm exec --yes --registry=https://nexus.kontur.host/repository/kontur-npm-group/ \
  @skbkontur/icons-codemods \
  -- icons-v1-v2/transformExports.js --parser tsx --extensions ts,tsx,js,jsx ./src

Пример

export { CopyIcon16Regular } from "@skbkontur/icons/CopyIcon16Regular";
export { DocsTextIcon16Light } from "@skbkontur/icons/icons/DocsTextIcon/DocsTextIcon16Light";
export { ShapeCircleSIcon16Solid as ShapeIcon } from "@skbkontur/icons/icons/ShapeCircleSIcon/ShapeCircleSIcon16Solid";
export { XIcon } from "@skbkontur/icons";

🠋

export { IconCopyRegular16 } from "@skbkontur/icons/IconCopyRegular16";
export { IconDocsTextLight16 } from "@skbkontur/icons/IconDocsTextLight16";
export { IconShapeCircleSSolid16 as ShapeIcon } from "@skbkontur/icons/IconShapeCircleSSolid16";
export { IconXRegular16 } from "@skbkontur/icons/IconXRegular16";