@dubium/icons 0.0.2-alpha.7 → 0.0.2

package/README.md

@@ -1,338 +1,310 @@
-# Способы использования иконок
+# @dubium/icons
 
-В `@dubium/icons` есть два способа использовать иконки:
-
-1. напрямую импортировать React-компонент;
-2. использовать строковое имя через Vite plugin.
-
-Если сборщик проекта — **Vite**, доступны оба способа.
-
-Если используется **другой сборщик**, используйте прямой импорт.
-
----
+SVG-иконки для React. Поддерживает прямой импорт компонентов и загрузку по строковому имени через Vite.
 
 ## Содержание
 
-- [Способы использования иконок](#способы-использования-иконок)
-    - [Содержание](#содержание)
-    - [1. Прямой импорт](#1-прямой-импорт)
-        - [Когда использовать](#когда-использовать)
-    - [2. Сборщик Vite](#2-сборщик-vite)
-        - [Подключение plugin](#подключение-plugin)
-        - [Что делает plugin](#что-делает-plugin)
-        - [Зачем нужен registry](#зачем-нужен-registry)
-        - [Cache](#cache)
-        - [Строковые имена в конфигурациях](#строковые-имена-в-конфигурациях)
-        - [Прямой импорт и Vite API можно использовать вместе](#прямой-импорт-и-vite-api-можно-использовать-вместе)
-    - [3. Другие сборщики](#3-другие-сборщики)
-    - [4. Что выбрать](#4-что-выбрать)
-        - [Сборщик Vite](#сборщик-vite)
-        - [Другой сборщик](#другой-сборщик)
-- [Коротко](#коротко)
-
----
-
-## 1. Прямой импорт
-
-Если нужная иконка известна прямо в коде, импортируйте её как обычный React-компонент:
+- [@dubium/icons](#dubiumicons)
+  - [Содержание](#содержание)
+  - [1. Компонент Icon](#1-компонент-icon)
+    - [Props](#props)
+  - [2. Использование](#2-использование)
+    - [Прямой импорт, без Vite-плагина](#прямой-импорт-без-vite-плагина)
+    - [Через Vite](#через-vite)
+  - [3. IconProvider](#3-iconprovider)
+    - [Пример компонента иконки](#пример-компонента-иконки)
+    - [Пример иконки с двумя цветами и обводкой](#пример-иконки-с-двумя-цветами-и-обводкой)
+  - [4. Плагины для vite.config](#4-плагины-для-viteconfig)
+    - [dubiumIcons](#dubiumicons-1)
+      - [Параметры](#параметры)
+      - [Настройка sources](#настройка-sources)
+      - [Пример со всеми параметрами](#пример-со-всеми-параметрами)
+    - [fixFederationCss](#fixfederationcss)
+
+## 1. Компонент Icon
+
+В библиотеке есть два компонента `Icon`. Они отличаются способом передачи иконки:
+
+| Импорт | React-компонент | Описание |
+| --------------------------------------- | --------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `import { Icon } from "@dubium/icons/icon"` | `<Icon name={UserOutlineIcon} />` | Отображает переданный React-компонент. Не требует Vite или плагинов |
+| `import { Icon } from "@dubium/icons/vite"` | `<Icon name="UserOutline" />` | Принимает строковое имя из справочника всех иконок библиотеки. По имени находит загрузчик в реестре и загружает иконку при отображении. Требует `dubiumIcons()` |
+
+### Props
+
+| props            | Описание                                                                                                   |
+| ---------------- | ---------------------------------------------------------------------------------------------------------- |
+| `name`           | React-компонент для `@dubium/icons/icon` или строковое имя из справочника для `@dubium/icons/vite`         |
+| `size`           | Ширина и высота иконки. По умолчанию `24`                                                                  |
+| `width`          | Ширина иконки. Переопределяет ширину, заданную через `size`                                                |
+| `height`         | Высота иконки. Переопределяет высоту, заданную через `size`                                                |
+| `color`          | Основной цвет иконки. По умолчанию `var(--icon-color, currentColor)`                                       |
+| `secondaryColor` | Второй цвет для иконок, которые его поддерживают. По умолчанию `var(--icon-secondary-color, currentColor)` |
+| `strokeWidth`    | Толщина обводки для иконок, которые её поддерживают `var(--icon-stroke-width, 1.5px)`                      |
+| `deg`            | Угол поворота в градусах                                                                                   |
+| `ariaLabel`      | Доступное название для скринридера. Без него иконка считается декоративной                                 |
+
+## 2. Использование
+
+### Прямой импорт, без Vite-плагина
+
+Импортируйте иконку и передайте её компонент в `name`:
 
 ```tsx
-import { UserIcon } from "@dubium/icons/icons"
-import { Icon } from "@dubium/icons/icon"
-
-export const Profile = () => <Icon name={UserIcon} />
+import { Icon } from "@dubium/icons/icon";
+import { UserOutlineIcon } from "@dubium/icons/icons";
+
+export const ProfileIcon = () => (
+ <Icon
+  name={UserOutlineIcon}
+  size={24}
+  color="currentColor"
+  ariaLabel="Профиль"
+ />
+);
 ```
 
-Сборщик видит прямой импорт `UserIcon` и добавляет в build нужную иконку.
-
-Вся коллекция иконок для этого не подключается.
-
-Этот вариант не зависит от Vite и подходит для других сборщиков.
+### Через Vite
 
-### Когда использовать
-
-Используйте прямой импорт, если иконка заранее известна в коде:
+Подключите `dubiumIcons()` в `vite.config.ts`, как показано ниже. Саму иконку импортировать не нужно:
 
 ```tsx
-import { SearchIcon } from "@dubium/icons/icons"
-import { Icon } from "@dubium/icons/icon"
-
-return <Icon name={SearchIcon} />
+import { Icon } from "@dubium/icons/vite";
+
+export const ProfileIcon = () => (
+ <Icon
+  name="UserOutline"
+  size={24}
+  color="currentColor"
+  ariaLabel="Профиль"
+ />
+);
 ```
 
-Для такого использования `dubiumIcons()` не нужен.
-
----
+**Строковое имя пишется без суффикса `Icon`:** компоненту `UserOutlineIcon` соответствует `"UserOutline"`. Варианты `Outline` и `Filled` являются частью имени.
 
-## 2. Сборщик Vite
+## 3. IconProvider
 
-Если проект собирается через Vite, кроме прямого импорта можно использовать иконки по строковому имени:
+`IconProvider` подключает собственные иконки к строковому API. Передайте ему объект, где ключи являются именами иконок, а значения являются функциями их загрузки.
 
 ```tsx
-<Icon name="User" />
+import { createIcon, IconProvider } from "@dubium/icons/vite";
+
+const appIcons = {
+ CompanyLogo: () => import("./icons/CompanyLogoIcon"),
+ TwoToneCircle: () => import("./icons/TwoToneCircleIcon"),
+};
+
+const AppIcon = createIcon<typeof appIcons>();
+
+export const App = () => (
+ <IconProvider icons={appIcons}>
+  <AppIcon name="CompanyLogo" size={32} />
+
+  <AppIcon
+   name="TwoToneCircle"
+   size={32}
+   color="#2563eb"
+   secondaryColor="#dbeafe"
+   strokeWidth={2}
+  />
+ </IconProvider>
+);
 ```
 
-Для этого используется `@dubium/icons/vite`.
+Файлы `CompanyLogoIcon.tsx` и `TwoToneCircleIcon.tsx` должны экспортировать React-компоненты SVG через `default export`.
 
-### Подключение plugin
+`IconProvider` делает загрузчики доступными дочерним компонентам. `createIcon()` добавляет пользовательские имена в типизацию `name`, но сам ничего не регистрирует.
 
-Добавьте `dubiumIcons()` в `vite.config.ts`:
+При совпадении имени иконка из провайдера имеет приоритет над остальными источниками. Для встроенных иконок провайдер не нужен. **Плагин `dubiumIcons()` нужен и при использовании провайдера.**
 
-```ts
-import react from "@vitejs/plugin-react"
-import { defineConfig } from "vite"
+### Пример компонента иконки
 
-import { dubiumIcons } from "@dubium/icons/vite/plugin"
-
-export default defineConfig({
-	plugins: [dubiumIcons(), react()],
-})
-```
-
-После этого можно использовать:
+Создадим `icons/CompanyLogoIcon.tsx` из примера выше. Для простоты иконка изображает точку:
 
 ```tsx
-<Icon name="User" />
-<Icon name="Search" />
+import type { IIconComponentProps } from "@dubium/icons/icons";
+
+export const CompanyLogoIcon = ({
+ color = "var(--icon-color, currentColor)",
+ secondaryColor: _secondaryColor,
+ ...svgProps
+}: IIconComponentProps) => (
+ <svg {...svgProps} width="100%" height="100%" viewBox="0 0 24 24">
+  <circle cx="12" cy="12" r="3" fill={color} />
+ </svg>
+);
+
+export default CompanyLogoIcon;
 ```
 
-### Что делает plugin
-
-Plugin **не сканирует всю коллекцию иконок**.
+Размер задаёт обёртка `Icon`, поэтому SVG занимает `100%` её ширины и высоты. Неиспользуемый `secondaryColor` извлекается отдельно, чтобы не попадать в DOM.
 
-Он проходит по исходникам приложения и ищет используемые строковые имена.
-
-Например:
-
-```tsx
-<Icon name="User" />
-<Icon name="Search" />
-```
+`svgProps` не является отдельным prop компонента `Icon`. Это локальный объект, в который собираются оставшиеся свойства, переданные SVG-компоненту, например `aria-hidden` и `focusable`. Через `{...svgProps}` они передаются на `<svg>`.
 
-Plugin найдёт только **статически указанные** имена:
+### Пример иконки с двумя цветами и обводкой
 
-```text
-User
-Search
-```
+Создадим `icons/TwoToneCircleIcon.tsx`: круг с обводкой цвета `color` и заливкой цвета `secondaryColor`.
 
-Такое значение можно определить во время сборки:
+Для иконок с настраиваемой толщиной обводки используется тип `IStrokeIconComponentProps`, который добавляет `strokeWidth` к `IIconComponentProps`.
 
 ```tsx
-<Icon name="User" /> // найдёт
+import type { IStrokeIconComponentProps } from "@dubium/icons/icons";
+
+export const TwoToneCircleIcon = ({
+ color = "var(--icon-color, currentColor)",
+ secondaryColor = "var(--icon-secondary-color, currentColor)",
+ strokeWidth = "var(--icon-stroke-width, 1.5px)",
+ ...svgProps
+}: IStrokeIconComponentProps) => (
+ <svg {...svgProps} width="100%" height="100%" viewBox="0 0 24 24">
+  <circle
+   cx="12"
+   cy="12"
+   r="8"
+   fill={secondaryColor}
+   stroke={color}
+   strokeWidth={strokeWidth}
+  />
+ </svg>
+);
+
+export default TwoToneCircleIcon;
 ```
 
-А конкретное значение здесь заранее неизвестно:
+Оба цвета и толщина обводки передаются через `AppIcon`, как показано в примере подключения выше. Если `strokeWidth` не задан, используется CSS-переменная `--icon-stroke-width`, а при её отсутствии `1.5px`.
 
-```tsx
-<Icon name={iconName} /> // заранее определить не сможет
-```
+## 4. Плагины для vite.config
 
-Для найденных статических имён plugin создаёт registry.
+### dubiumIcons
 
-Упрощённо:
+Создаёт реестр загрузчиков для строкового `Icon`. По умолчанию сканирует `src` и находит статические имена, например `<Icon name="UserOutline" />`.
 
-```ts
-export const iconRegistry = {
-	Search: () => import("@dubium/icons/icons/Search"),
-	User: () => import("@dubium/icons/icons/User"),
-}
-```
-
-Если другие иконки из библиотеки в проекте не используются, в registry они не попадут.
-
-### Зачем нужен registry
-
-При прямом импорте сборщик уже знает, какая иконка нужна:
+Минимальная настройка:
 
 ```ts
-import { UserIcon } from "@dubium/icons/icons"
-```
-
-Но здесь:
+import react from "@vitejs/plugin-react";
+import { defineConfig } from "vite";
+import { dubiumIcons } from "@dubium/icons/vite/plugin";
 
-```tsx
-<Icon name="User" />
+export default defineConfig({
+ plugins: [react(), dubiumIcons()],
+});
 ```
 
-`"User"` — обычная строка.
-
-Plugin связывает строковое имя с нужным модулем:
-
-```text
-User → @dubium/icons/icons/User
-```
+#### Параметры
 
-Для каждой найденной иконки создаётся отдельный dynamic `import()`:
+Все параметры необязательны. Тип настроек `DubiumIconsPluginOptions` доступен через публичный импорт:
 
 ```ts
-return () => import("@dubium/icons/icons/User")
+import type { DubiumIconsPluginOptions } from "@dubium/icons/vite/plugin";
 ```
 
-Поэтому строковый API не требует подключать всю коллекцию иконок.
+| Параметр          | Описание                                                                                                                                                                                                                                                                                                                    |
+| ----------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `scan`            | Каталоги для рекурсивного поиска использований иконок относительно корня Vite-проекта. Принимает пути к каталогам, не glob-шаблоны. `[]` отключает сканирование. По умолчанию `["src"]`                                                                                                                                     |
+| `componentNames`  | Дополнительные имена JSX-компонентов, у которых нужно искать свойство `name`, например `["AppIcon"]` для `<AppIcon name="UserOutline" />`. Нужен для собственных обёрток и реэкспортов. Обычный `Icon` из `@dubium/icons/vite`, включая импорт с алиасом, определяется автоматически. По умолчанию `[]`                         |
+| `include`         | Имена иконок, которые нужно добавить в реестр независимо от результатов сканирования. Используется, когда `name` задаётся динамически, а возможные значения известны заранее. Добавляет загрузчики, но не загружает все иконки сразу. По умолчанию `[]`                                                                     |
+| `propertyNames`   | Имена полей объектов, строковые значения которых нужно считать именами иконок. Например, `["iconName"]` позволяет найти `"SearchOutline"` в `{ iconName: "SearchOutline" }`. По умолчанию `[]`; при включённом `runtimeRegistry` поле `iconName` добавляется автоматически                                                  |
+| `runtimeRegistry` | Непустой уникальный идентификатор приложения или микрофронтенда, например `"profile-mf"`. Включает публикацию найденных и добавленных через `include` загрузчиков в общий runtime-реестр. После выполнения кода приложения они доступны другим приложениям в том же JavaScript-окружении. По умолчанию публикация отключена |
+| `sources`         | Источники компонентов иконок: локальные каталоги и npm-пакет. Определяют, откуда импортировать найденное имя. По умолчанию `[{ type: "package", importPattern: "@dubium/icons/icons/{name}" }]`                                                                                                                                 |
 
-### Cache
+Сканируются файлы `.js`, `.jsx`, `.mjs`, `.cjs`, `.ts` и `.tsx`.
 
-После загрузки иконка сохраняется в памяти приложения.
+**Плагин не вычисляет значения переменных и выражений.** Для `<Icon name={iconName} />` добавьте возможные имена в `include` или укажите поля конфигурации со статическими именами через `propertyNames`.
 
-Если `User` уже был загружен, при следующем использовании:
+#### Настройка sources
 
-```tsx
-<Icon name="User" />
-```
+Каждый элемент `sources` описывает один источник:
 
-готовый React-компонент берётся из cache.
+| Параметр        | Описание                                                                                                                                                                                                               |
+| --------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `type`          | Тип источника: `"local"` для каталога компонентов или `"package"` для импорта из npm-пакета. Обязателен                                                                                                                |
+| `path`          | Путь к каталогу компонентов относительно корня Vite-проекта. Обязателен для `"local"`                                                                                                                                  |
+| `suffix`        | Суффикс имени файла, по которому распознаются локальные иконки. При формировании строкового имени суффикс удаляется: `CompanyLogoIcon.tsx` становится `CompanyLogo`. Используется для `"local"`. По умолчанию `"Icon"` |
+| `importPattern` | Шаблон пути импорта с обязательным `{name}`, который заменяется именем иконки. Например, `@dubium/icons/icons/{name}`. Обязателен для `"package"`                                                                          |
 
-Важно не путать:
+Можно указать несколько локальных источников: они проверяются в порядке перечисления, используется первое совпадение. Источник `"package"` допускается только один и используется, если имя не найдено локально.
 
-- **registry** хранит информацию о том, как загрузить иконку;
-- **cache** хранит уже загруженный React-компонент.
+**Переданный `sources` заменяет стандартный список.** Чтобы сохранить доступ к встроенной коллекции вместе с локальными иконками, добавьте источник `@dubium/icons` явно. `sources: []` убирает все источники, поэтому найденные сканером или добавленные через `include` имена не смогут разрешиться.
 
-### Строковые имена в конфигурациях
+Локальные файлы должны экспортировать React-компонент SVG через `default export`, как в примере из раздела `IconProvider`.
 
-Строковый API удобен, когда имя иконки находится в конфигурации.
+#### Пример со всеми параметрами
 
-Чтобы plugin искал такие значения, укажите название свойства в `propertyNames`:
+Указывайте только настройки, необходимые приложению:
 
 ```ts
 dubiumIcons({
-	propertyNames: ["iconName"],
-})
+ // Где искать использования иконок.
+ scan: ["src"],
+
+ // Какие собственные JSX-обёртки сканировать.
+ componentNames: ["AppIcon"],
+
+ // Какие динамические имена добавить явно.
+ include: ["UserOutline", "UserFilled"],
+
+ // В каких полях объектов искать строковые имена.
+ propertyNames: ["iconName"],
+
+ // Под каким идентификатором публиковать загрузчики
+ // для других приложений в общем runtime-реестре.
+ runtimeRegistry: "profile-mf",
+
+ // Откуда импортировать найденные иконки.
+ sources: [
+  {
+   type: "local",
+   path: "src/icons",
+   suffix: "Icon",
+  },
+  {
+   type: "package",
+   importPattern: "@dubium/icons/icons/{name}",
+  },
+ ],
+});
 ```
 
-После этого:
+Сканер не читает содержимое `IconProvider`. Если пользовательское имя попало в сканирование через `componentNames`, `propertyNames` или было добавлено в `include`, оно должно разрешаться через `sources`.
 
-```ts
-const menu = [
-	{
-		title: "Profile",
-		iconName: "User",
-	},
-]
-```
-
-статическое значение `User` будет найдено и добавлено в registry.
-
-### Прямой импорт и Vite API можно использовать вместе
-
-Если сборщик — Vite, не обязательно выбирать только один способ.
-
-Часть иконок можно импортировать напрямую:
+### fixFederationCss
 
-```tsx
-import { CompanyLogoIcon } from "@dubium/icons/icons"
-import { Icon as BaseIcon } from "@dubium/icons/icon"
-
-return <BaseIcon name={CompanyLogoIcon} />
-```
+Исправляет CSS-плейсхолдеры в собранном `remoteEntry.js` у `@originjs/vite-plugin-federation`.
 
-а часть использовать по строковому имени:
-
-```tsx
-<Icon name="User" />
-```
+Нужен только в Remote-приложении, где возникает эта проблема. Подключается **после `federation()`** и требует **`build.cssCodeSplit: false`**.
 
-Оба способа добавляют только необходимые приложению иконки, но делают это по-разному.
-
-|                      | Прямой импорт              | Vite API                   |
-| -------------------- | -------------------------- | -------------------------- |
-| Использование        | `<Icon name={UserIcon} />` | `<Icon name="User" />`     |
-| Как находится иконка | обычный import             | plugin сканирует исходники |
-| Registry             | не нужен                   | создаётся автоматически    |
-| Lazy loading         | нет                        | dynamic `import()`         |
-| Нужен Vite           | нет                        | да                         |
-
----
-
-## 3. Другие сборщики
-
-Если проект использует не Vite, а другой сборщик, используйте прямой импорт:
-
-```tsx
-import { UserIcon } from "@dubium/icons/icons"
-import { Icon } from "@dubium/icons/icon"
-
-return <Icon name={UserIcon} />
-```
-
-Для этого варианта не нужны:
-
-- `dubiumIcons()`;
-- Vite plugin;
-- compile-time registry.
-
-Иконка импортируется как обычный React-компонент, а сборщик добавляет её в build стандартным способом.
-
-Строковый API:
-
-```tsx
-<Icon name="User" />
-```
-
-требует Vite plugin, поэтому с другими сборщиками этот вариант не используется.
-
----
-
-## 4. Что выбрать
-
-### Сборщик Vite
-
-Доступны оба варианта.
-
-Если иконка известна прямо в коде:
-
-```tsx
-import { UserIcon } from "@dubium/icons/icons"
-import { Icon } from "@dubium/icons/icon"
-
-return <Icon name={UserIcon} />
-```
-
-используйте прямой импорт.
-
-Если нужно работать со строковым именем:
-
-```tsx
-<Icon name="User" />
-```
-
-используйте Vite API.
-
-### Другой сборщик
-
-Используйте прямой импорт:
-
-```tsx
-import { UserIcon } from "@dubium/icons/icons"
-import { Icon } from "@dubium/icons/icon"
-
-return <Icon name={UserIcon} />
-```
-
----
-
-# Коротко
-
-| Сборщик         | Прямой импорт | Строковый API |
-| --------------- | ------------- | ------------- |
-| Vite            | ✅            | ✅            |
-| Другие сборщики | ✅            | ❌            |
-
-Для Vite:
-
-```tsx
-// Прямой импорт
-<Icon name={UserIcon} />
+```ts
+import react from "@vitejs/plugin-react";
+import federation from "@originjs/vite-plugin-federation";
+import { defineConfig } from "vite";
+import { dubiumIcons } from "@dubium/icons/vite/plugin";
+import { fixFederationCss } from "@dubium/icons/vite/federation";
 
-// Или строковый API
-<Icon name="User" />
+export default defineConfig({
+ plugins: [
+  react(),
+  dubiumIcons(),
+
+  federation({
+   name: "profile_remote",
+   filename: "remoteEntry.js",
+   exposes: {
+    "./Profile": "./src/Profile.tsx",
+   },
+  }),
+
+  fixFederationCss(),
+ ],
+
+ build: {
+  target: "esnext",
+  cssCodeSplit: false,
+ },
+});
 ```
 
-Для других сборщиков:
+В существующем Remote сохраните свои настройки `federation()`.
 
-```tsx
-import { UserIcon } from "@dubium/icons/icons"
-import { Icon } from "@dubium/icons/icon"
-
-return <Icon name={UserIcon} />
-```
+Для другого имени entry-файла передайте `fixFederationCss({ remoteEntry: "profileRemote.js" })`.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@dubium/icons",
-	"version": "0.0.2-alpha.7",
+	"version": "0.0.2",
 	"private": false,
 	"files": [
 		"dist"
@@ -32,6 +32,10 @@
 			"types": "./dist/vite/runtime/index.d.ts",
 			"import": "./dist/vite/runtime/index.js"
 		},
+		"./vite/federation": {
+			"types": "./dist/vite/federation/index.d.ts",
+			"import": "./dist/vite/federation/index.js"
+		},
 		"./vite/plugin": {
 			"types": "./dist/vite/plugin/index.d.ts",
 			"import": "./dist/vite/plugin/index.js"
@@ -56,10 +60,13 @@
 		"@types/react": "^19.2.18",
 		"@types/react-dom": "^19.2.7",
 		"@vitejs/plugin-react": "^6.1.1",
+		"highlight.js": "^11.12.0",
 		"oxfmt": "^0.66.0",
 		"oxlint": "^1.81.0",
 		"oxlint-tsgolint": "^7.0.2001",
 		"react-markdown": "^10.1.0",
+		"rehype-highlight": "^7.0.2",
+		"rehype-slug": "^6.0.0",
 		"remark-gfm": "^4.0.1",
 		"rollup-plugin-visualizer": "^7.1.1",
 		"svgo": "^4.1.0",

package/dist/collection/AB2OutlineIcon.d.ts

@@ -1,6 +0,0 @@
-import type { IIconComponentProps } from "./types.js";
-/**
- * SVG-иконка с поддержкой динамического цвета.
- */
-export declare const AB2OutlineIcon: ({ color, secondaryColor: _secondaryColor, ...svgProps }: IIconComponentProps) => import("react").JSX.Element;
-export default AB2OutlineIcon;

package/dist/collection/AB2OutlineIcon.js

@@ -1,16 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-//#region src/icons/collection/AB2OutlineIcon.tsx
-var t = ({ color: t = "var(--icon-color, currentColor)", secondaryColor: n, ...r }) => /* @__PURE__ */ e("svg", {
-	...r,
-	fill: "none",
-	stroke: t,
-	strokeLinecap: "round",
-	strokeLinejoin: "round",
-	strokeWidth: "2",
-	viewBox: "0 0 24 24",
-	width: "100%",
-	height: "100%",
-	children: /* @__PURE__ */ e("path", { d: "M16 21h3c.81 0 1.48-.67 1.48-1.48l.02-.02c0-.82-.69-1.5-1.5-1.5h-3zm0-6h2.5c.84-.01 1.5.66 1.5 1.5s-.66 1.5-1.5 1.5H16zM4 9V5c0-1.036.895-2 2-2s2 .964 2 2v4m-5.01 2.98a9 9 0 0 0 9 9m9-9a9 9 0 0 0-9-9M8 7H4" })
-});
-//#endregion
-export { t as AB2OutlineIcon, t as default };

package/dist/collection/ABOffOutlineIcon.d.ts

@@ -1,6 +0,0 @@
-import type { IIconComponentProps } from "./types.js";
-/**
- * SVG-иконка с поддержкой динамического цвета.
- */
-export declare const ABOffOutlineIcon: ({ color, secondaryColor: _secondaryColor, ...svgProps }: IIconComponentProps) => import("react").JSX.Element;
-export default ABOffOutlineIcon;