@dubium/icons 0.0.2-alpha.1 → 0.0.2-alpha.3

package/README.md

@@ -0,0 +1,101 @@
+
+
+## Vite: только используемые SPA-иконки в dist
+
+Для SPA рекомендуется подключить compile-time plugin:
+
+```ts
+// vite.config.ts
+import react from "@vitejs/plugin-react"
+import { defineConfig } from "vite"
+import { dubiumIcons } from "@dubium/icons/vite"
+
+export default defineConfig({
+	plugins: [
+		dubiumIcons(),
+		react(),
+	],
+})
+```
+
+После этого API остаётся прежним:
+
+```tsx
+import { Icon } from "@dubium/icons/spa"
+
+export const Header = () => (
+	<>
+		<Icon name="User" />
+		<Icon name="Search" />
+	</>
+)
+```
+
+`@dubium/icons/vite` заранее сканирует `src`, создаёт virtual registry и генерирует
+только такие lazy imports:
+
+```ts
+{
+	User: () => import("@dubium/icons/icons/User"),
+	Search: () => import("@dubium/icons/icons/Search"),
+}
+```
+
+Поэтому остальные иконки из npm-пакета не попадают в `dist` consuming-приложения.
+
+### Динамический name
+
+Значение вида `<Icon name={item.icon} />` невозможно определить на этапе сборки.
+Перечислите допустимые runtime-иконки вручную:
+
+```ts
+dubiumIcons({
+	include: ["User", "Search", "Settings"],
+})
+```
+
+По умолчанию плагин предупреждает о динамических `name`. Чтобы делать это ошибкой сборки:
+
+```ts
+dubiumIcons({
+	include: ["User", "Search"],
+	strictDynamicNames: true,
+})
+```
+
+По умолчанию сканируется каталог `src`. Для монорепозитория или другой структуры:
+
+```ts
+dubiumIcons({
+	scan: ["src", "app", "../shared/src"],
+})
+```
+
+
+
+## Lightweight 5-icon test build
+
+This archive intentionally keeps only the first five source SVG files so local testing stays fast:
+
+- `123.svg` → `Icon123Icon`
+- `24-hours.svg` → `Icon24HoursIcon`
+- `2fa.svg` → `Icon2faIcon`
+- `360-view.svg` → `Icon360ViewIcon`
+- `360.svg` → `Icon360Icon`
+
+Bundler-friendly container usage:
+
+```tsx
+import { Icon } from "@dubium/icons/container"
+import { Icon360Icon } from "@dubium/icons/icons/Icon360Icon"
+
+export function Example() {
+	return <Icon icon={Icon360Icon} size={24} />
+}
+```
+
+The older short subpath remains compatible too:
+
+```tsx
+import Icon360Icon from "@dubium/icons/icons/Icon360"
+```

package/dist/collection/Icon123Icon.d.ts

@@ -0,0 +1,3 @@
+import type { IIconComponentProps } from "./types.js";
+export declare const Icon123Icon: ({ color, ...props }: IIconComponentProps) => import("react").JSX.Element;
+export default Icon123Icon;

package/dist/collection/Icon123Icon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/Icon123Icon.tsx
+var t = ({ color: t = "var(--icon-color, currentColor)", ...n }) => /* @__PURE__ */ e("svg", {
+	...n,
+	fill: "none",
+	viewBox: "0 0 24 24",
+	width: "100%",
+	height: "100%",
+	children: /* @__PURE__ */ e("path", {
+		stroke: t,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		strokeWidth: "2",
+		d: "m3 10 2-2v8m4-8h3a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-2a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h3m4-8h2.5A1.5 1.5 0 0 1 21 9.5v1a1.5 1.5 0 0 1-1.5 1.5m0 0H18m1.5 0a1.5 1.5 0 0 1 1.5 1.5v1a1.5 1.5 0 0 1-1.5 1.5H17"
+	})
+});
+//#endregion
+export { t as Icon123Icon, t as default };

package/dist/collection/Icon24HoursIcon.d.ts

@@ -0,0 +1,3 @@
+import type { IIconComponentProps } from "./types.js";
+export declare const Icon24HoursIcon: ({ color, ...props }: IIconComponentProps) => import("react").JSX.Element;
+export default Icon24HoursIcon;

package/dist/collection/Icon24HoursIcon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/Icon24HoursIcon.tsx
+var t = ({ color: t = "var(--icon-color, currentColor)", ...n }) => /* @__PURE__ */ e("svg", {
+	...n,
+	fill: "none",
+	viewBox: "0 0 24 24",
+	width: "100%",
+	height: "100%",
+	children: /* @__PURE__ */ e("path", {
+		stroke: t,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		strokeWidth: "2",
+		d: "M20 11A8.1 8.1 0 0 0 4.5 9M4 5v4h4m-4 4a8 8 0 0 0 3 5.24M11 15h2a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1h-1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1h2m3-6v2a1 1 0 0 0 1 1h1m1-3v6"
+	})
+});
+//#endregion
+export { t as Icon24HoursIcon, t as default };

package/dist/collection/Icon2faIcon.d.ts

@@ -0,0 +1,3 @@
+import type { IIconComponentProps } from "./types.js";
+export declare const Icon2faIcon: ({ color, ...props }: IIconComponentProps) => import("react").JSX.Element;
+export default Icon2faIcon;

package/dist/collection/Icon2faIcon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/Icon2faIcon.tsx
+var t = ({ color: t = "var(--icon-color, currentColor)", ...n }) => /* @__PURE__ */ e("svg", {
+	...n,
+	fill: "none",
+	viewBox: "0 0 24 24",
+	width: "100%",
+	height: "100%",
+	children: /* @__PURE__ */ e("path", {
+		stroke: t,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		strokeWidth: "2",
+		d: "M7 16H3l3.47-4.66A2 2 0 1 0 3 9.8m7 6.2V8h4m-4 4h3m4 4v-6a2 2 0 1 1 4 0v6m-4-3h4"
+	})
+});
+//#endregion
+export { t as Icon2faIcon, t as default };

package/dist/collection/Icon360Icon.d.ts

@@ -0,0 +1,3 @@
+import type { IIconComponentProps } from "./types.js";
+export declare const Icon360Icon: ({ color, ...props }: IIconComponentProps) => import("react").JSX.Element;
+export default Icon360Icon;

package/dist/collection/Icon360Icon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/Icon360Icon.tsx
+var t = ({ color: t = "var(--icon-color, currentColor)", ...n }) => /* @__PURE__ */ e("svg", {
+	...n,
+	fill: "none",
+	viewBox: "0 0 24 24",
+	width: "100%",
+	height: "100%",
+	children: /* @__PURE__ */ e("path", {
+		stroke: t,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		strokeWidth: "2",
+		d: "M17 15.33c2.41-.72 4-1.94 4-3.33 0-2.21-4.03-4-9-4s-9 1.79-9 4 4.03 4 9 4m-3 3 3-3-3-3"
+	})
+});
+//#endregion
+export { t as Icon360Icon, t as default };

package/dist/collection/Icon360ViewIcon.d.ts

@@ -0,0 +1,3 @@
+import type { IIconComponentProps } from "./types.js";
+export declare const Icon360ViewIcon: ({ color, ...props }: IIconComponentProps) => import("react").JSX.Element;
+export default Icon360ViewIcon;

package/dist/collection/Icon360ViewIcon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/Icon360ViewIcon.tsx
+var t = ({ color: t = "var(--icon-color, currentColor)", ...n }) => /* @__PURE__ */ e("svg", {
+	...n,
+	fill: "none",
+	viewBox: "0 0 24 24",
+	width: "100%",
+	height: "100%",
+	children: /* @__PURE__ */ e("path", {
+		stroke: t,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		strokeWidth: "2",
+		d: "M14 6a1 1 0 0 0-1-1h-2a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1h-3M3 5h2.5A1.5 1.5 0 0 1 7 6.5v1A1.5 1.5 0 0 1 5.5 9m0 0H4m1.5 0A1.5 1.5 0 0 1 7 10.5v1A1.5 1.5 0 0 1 5.5 13H3m0 3c0 1.66 4.03 3 9 3s9-1.34 9-3m-4-9v4a2 2 0 0 0 4 0V7a2 2 0 1 0-4 0"
+	})
+});
+//#endregion
+export { t as Icon360ViewIcon, t as default };

package/dist/collection/index.d.ts

@@ -3,4 +3,8 @@
  * Do not edit manually.
  */
 export type { IIconComponentProps } from "./types.js";
-export { default as UserIcon } from "./UserIcon.js";
+export { default as Icon123Icon } from "./Icon123Icon.js";
+export { default as Icon24HoursIcon } from "./Icon24HoursIcon.js";
+export { default as Icon2faIcon } from "./Icon2faIcon.js";
+export { default as Icon360Icon } from "./Icon360Icon.js";
+export { default as Icon360ViewIcon } from "./Icon360ViewIcon.js";

package/dist/collection/index.js

@@ -0,0 +1,6 @@
+import { Icon123Icon as e } from "./Icon123Icon.js";
+import { Icon24HoursIcon as t } from "./Icon24HoursIcon.js";
+import { Icon2faIcon as n } from "./Icon2faIcon.js";
+import { Icon360Icon as r } from "./Icon360Icon.js";
+import { Icon360ViewIcon as i } from "./Icon360ViewIcon.js";
+export { e as Icon123Icon, t as Icon24HoursIcon, n as Icon2faIcon, r as Icon360Icon, i as Icon360ViewIcon };

package/dist/collection/types.d.ts

@@ -1,11 +1,6 @@
 import type { SVGProps } from "react";
-/**
- * Базовые пропсы для SVG-иконки.
- *
- * Расширяет стандартные SVG-атрибуты и добавляет поддержку цвета.
- *
- * @property color - Цвет заливки иконки (обычно прокидывается в `fill`)
- */
+/** Props shared by generated SVG icon components. */
 export interface IIconComponentProps extends SVGProps<SVGSVGElement> {
     color?: string;
+    secondaryColor?: string;
 }

package/dist/spa/icon/Icon.d.ts

@@ -1,57 +1,25 @@
 import { type MemoExoticComponent } from "react";
 import type { TEmptyIconRegistry, TIconName, TIconRegistry } from "./Icon.types.js";
-/**
- * Свойства компонента иконки
- */
 export interface IconProps<TCustomIcons extends TIconRegistry = TEmptyIconRegistry> {
-    /**
-     * Атрибут aria-label
-     */
     ariaLabel?: string;
-    /**
-     * Цвет иконки
-     */
     color?: string;
-    /**
-     * Угол поворота
-     */
+    secondaryColor?: string;
     deg?: number;
-    /**
-     * Высота (если нужен прямоугольник)
-     */
     height?: number;
-    /**
-     * Имя иконки
-     */
     name: TIconName<TCustomIcons>;
-    /**
-     * Обработчик клика
-     */
     onClick?: VoidFunction;
-    /**
-     * Приоритетный размер (квадратный)
-     */
     size?: number;
-    /**
-     * Ширина (если нужен прямоугольник)
-     */
     width?: number;
 }
 /**
- * Компонент иконки, который динамически загружает SVG иконки по имени.
- *
- * @param props - Свойства компонента иконки
- * @param props.name - Имя иконки для отображения
- * @param props.size - Размер иконки в пикселях (по умолчанию 24)
- * @param props.color - Цвет иконки (по умолчанию "currentColor")
- * @param props.deg - Угол поворота иконки в градусах (по умолчанию 0)
- * @param props.onClick - Обработчик клика по иконке
+ * SPA-иконка с lazy loading.
  *
- * @example
- * <Icon name="Arrow" size={32} color="blue" deg={90} />
+ * Встроенные loader-ы поступают из virtual:@dubium/icons-registry.
+ * Этот virtual module создаёт @dubium/icons/vite на этапе сборки приложения
+ * и помещает в него только статически используемые <Icon name="..." />.
  *
- * @returns React-элемент иконки
+ * Пользовательский IconProvider имеет приоритет над встроенным registry.
  */
-declare const IconComponentBase: <TCustomIcons extends TIconRegistry = TEmptyIconRegistry>({ name, size, width: propWidth, height: propHeight, color, deg, onClick: handleOnClick, ariaLabel, }: IconProps<TCustomIcons>) => import("react").JSX.Element;
+declare const IconComponentBase: <TCustomIcons extends TIconRegistry = TEmptyIconRegistry>({ name, size, width: propWidth, height: propHeight, color, secondaryColor, deg, onClick: handleOnClick, ariaLabel, }: IconProps<TCustomIcons>) => import("react").JSX.Element;
 declare const MemoizedIcon: MemoExoticComponent<typeof IconComponentBase> & typeof IconComponentBase;
 export { MemoizedIcon as Icon };

package/dist/spa/icon/Icon.js

@@ -1,62 +1,56 @@
 import { useIconContext as e } from "../provider/IconProvider.context.js";
-import { defaultIcons as t } from "./Icon.registry.js";
+import { jsx as t } from "react/jsx-runtime";
 import { memo as n, useEffect as r, useMemo as i, useState as a } from "react";
-import { jsx as o } from "react/jsx-runtime";
+import { iconRegistry as o } from "virtual:@dubium/icons-registry";
 //#region src/icons/spa/icon/Icon.tsx
-var s = /* @__PURE__ */ new Map(), c = n(({ name: n, size: c = 24, width: l, height: u, color: d = "currentColor", deg: f = 0, onClick: p, ariaLabel: m }) => {
-	let { icons: h } = e(), g = i(() => ({
-		...t,
-		...h
-	}), [h]), _ = g[n], [v, y] = a(() => _ ? s.get(_) ?? null : null), [b, x] = a(!1), S = l ?? c, C = u ?? c, w = i(() => ({
-		display: "inline-flex",
+var s = /* @__PURE__ */ new Map(), c = n(({ name: n, size: c = 24, width: l, height: u, color: d = "var(--icon-color, currentColor)", secondaryColor: f = "var(--icon-secondary-color, currentColor)", deg: p = 0, onClick: m, ariaLabel: h }) => {
+	let { icons: g } = e(), _ = g[n] ?? o[String(n)], [v, y] = a(() => _ ? s.get(_) ?? null : null), [b, x] = a(!1), S = l ?? c, C = u ?? c, w = i(() => ({
 		alignItems: "center",
-		justifyContent: "center",
-		width: S,
+		display: "inline-flex",
 		height: C,
-		transform: `rotate(${f}deg)`
+		justifyContent: "center",
+		transform: `rotate(${p}deg)`,
+		width: S
 	}), [
-		S,
 		C,
-		f
+		S,
+		p
 	]);
 	return r(() => {
-		let e = !1;
-		return (async () => {
-			let t = String(n), r = g[n];
-			if (!r) {
-				console.warn(`Иконка "${t}" не найдена`), y(() => null);
-				return;
-			}
-			let i = s.get(r);
-			if (i) {
-				y(() => i);
-				return;
-			}
-			x(!0), y(() => null), r().then((t) => {
-				if (e) return;
-				let n = t.default;
-				s.set(r, n), y(() => n);
-			}).catch((n) => {
-				e || (console.error(`Ошибка загрузки иконки "${t}":`, n), y(() => null));
-			}).finally(() => {
-				e || x(!1);
-			});
-		})(), () => {
+		let e = !1, t = String(n), r = g[n] ?? o[t];
+		if (!r) return x(!1), y(null), console.warn(`Иконка "${t}" не найдена в compile-time registry. Для динамического name добавьте её в dubiumIcons({ include: ["..."] }).`), () => {
 			e = !0;
 		};
-	}, [n, g]), b || !v ? /* @__PURE__ */ o("div", {
+		let i = s.get(r);
+		return i ? (x(!1), y(() => i), () => {
+			e = !0;
+		}) : (x(!0), y(null), r().then((t) => {
+			if (e) return;
+			let n = t.default;
+			s.set(r, n), y(() => n);
+		}).catch((n) => {
+			e || (console.error(`Ошибка загрузки иконки "${t}":`, n), y(null));
+		}).finally(() => {
+			e || x(!1);
+		}), () => {
+			e = !0;
+		});
+	}, [g, n]), b || !v ? /* @__PURE__ */ t("div", {
 		"aria-hidden": "true",
 		role: "img",
 		style: {
 			...w,
 			visibility: "hidden"
 		}
-	}) : /* @__PURE__ */ o("div", {
-		"aria-label": m || n,
-		onClick: p,
+	}) : /* @__PURE__ */ t("div", {
+		"aria-label": h || String(n),
+		onClick: m,
 		role: "img",
 		style: w,
-		children: v ? /* @__PURE__ */ o(v, { color: d }) : null
+		children: /* @__PURE__ */ t(v, {
+			color: d,
+			secondaryColor: f
+		})
 	});
 });
 c.displayName = "Icon";

package/dist/spa/icon/Icon.registry.d.ts

@@ -1,8 +1,12 @@
 /**
  * AUTO-GENERATED by scripts/sync-icons.mjs.
- * Source of truth: src/icons/collection/*Icon.tsx.
+ * Source of truth: icons/source/*.svg.
  */
 export declare const defaultIcons: {
-    readonly User: () => Promise<typeof import("../../collection/UserIcon.js")>;
+    readonly Icon123: () => Promise<typeof import("../../collection/Icon123Icon.js")>;
+    readonly Icon24Hours: () => Promise<typeof import("../../collection/Icon24HoursIcon.js")>;
+    readonly Icon2fa: () => Promise<typeof import("../../collection/Icon2faIcon.js")>;
+    readonly Icon360: () => Promise<typeof import("../../collection/Icon360Icon.js")>;
+    readonly Icon360View: () => Promise<typeof import("../../collection/Icon360ViewIcon.js")>;
 };
 export type TDefaultIconName = keyof typeof defaultIcons;

package/dist/spa/provider/IconProvider.js

@@ -1,10 +1,10 @@
 import { IconContext as e } from "./IconProvider.context.js";
-import { useMemo as t } from "react";
-import { jsx as n } from "react/jsx-runtime";
+import { jsx as t } from "react/jsx-runtime";
+import { useMemo as n } from "react";
 //#region src/icons/spa/provider/IconProvider.tsx
 var r = ({ children: r, icons: i }) => {
-	let a = t(() => ({ icons: i ?? {} }), [i]);
-	return /* @__PURE__ */ n(e.Provider, {
+	let a = n(() => ({ icons: i ?? {} }), [i]);
+	return /* @__PURE__ */ t(e.Provider, {
 		value: a,
 		children: r
 	});

package/dist/ssr/icon/Icon.js

@@ -7,20 +7,21 @@ var r = (e, t) => Object.prototype.hasOwnProperty.call(e, t), i = async (t) => {
 	let n = e[t];
 	return (await n()).default;
 }, a = async (e, a) => {
-	let { name: o, size: s = 24, width: c, height: l, color: u = "currentColor", deg: d = 0, ariaLabel: f, style: p } = e, m = String(o), h = (a && r(a, m) ? a[m] : void 0) ?? await i(m);
-	return h ? /* @__PURE__ */ n(t, {
-		ariaLabel: f,
-		deg: d,
+	let { name: o, size: s = 24, width: c, height: l, color: u = "var(--icon-color, currentColor)", secondaryColor: d = "var(--icon-secondary-color, currentColor)", deg: f = 0, ariaLabel: p, style: m } = e, h = String(o), g = (a && r(a, h) ? a[h] : void 0) ?? await i(h);
+	return g ? /* @__PURE__ */ n(t, {
+		ariaLabel: p,
+		deg: f,
 		height: l,
 		size: s,
-		style: p,
+		style: m,
 		width: c,
-		children: /* @__PURE__ */ n(h, {
+		children: /* @__PURE__ */ n(g, {
 			"aria-hidden": "true",
 			color: u,
-			focusable: "false"
+			focusable: "false",
+			secondaryColor: d
 		})
-	}) : (console.warn(`Иконка "${m}" не найдена`), null);
+	}) : (console.warn(`Иконка "${h}" не найдена`), null);
 }, o = (e) => a(e), s = a;
 //#endregion
 export { o as Icon, s as renderIconWithRegistry };

package/dist/ssr/icon/Icon.registry.d.ts

@@ -1,8 +1,12 @@
 /**
  * AUTO-GENERATED by scripts/sync-icons.mjs.
- * Source of truth: src/icons/collection/*Icon.tsx.
+ * Source of truth: icons/source/*.svg.
  */
 export declare const defaultIcons: {
-    readonly User: () => Promise<typeof import("../../collection/UserIcon.js")>;
+    readonly Icon123: () => Promise<typeof import("../../collection/Icon123Icon.js")>;
+    readonly Icon24Hours: () => Promise<typeof import("../../collection/Icon24HoursIcon.js")>;
+    readonly Icon2fa: () => Promise<typeof import("../../collection/Icon2faIcon.js")>;
+    readonly Icon360: () => Promise<typeof import("../../collection/Icon360Icon.js")>;
+    readonly Icon360View: () => Promise<typeof import("../../collection/Icon360ViewIcon.js")>;
 };
 export type TDefaultIconName = keyof typeof defaultIcons;

package/dist/ssr/icon/Icon.registry.js

@@ -1,4 +1,10 @@
 //#region src/icons/ssr/icon/Icon.registry.ts
-var e = { User: () => import("../../collection/UserIcon.js") };
+var e = {
+	Icon123: () => import("../../collection/Icon123Icon.js"),
+	Icon24Hours: () => import("../../collection/Icon24HoursIcon.js"),
+	Icon2fa: () => import("../../collection/Icon2faIcon.js"),
+	Icon360: () => import("../../collection/Icon360Icon.js"),
+	Icon360View: () => import("../../collection/Icon360ViewIcon.js")
+};
 //#endregion
 export { e as defaultIcons };

package/dist/ssr/icon/Icon.types.d.ts

@@ -65,6 +65,10 @@ export interface IconProps<TCustomIcons extends TIconRegistry = TEmptyIconRegist
      * Цвет иконки
      */
     color?: string;
+    /**
+     * Вторичный цвет двухцветной иконки
+     */
+    secondaryColor?: string;
     /**
      * Угол поворота в градусах
      */

package/dist/vite/index.d.ts

@@ -0,0 +1,50 @@
+import type { Plugin } from "vite";
+export interface DubiumIconsPluginOptions {
+    /**
+     * Имена компонентов, которые плагин должен анализировать.
+     *
+     * @default ["Icon"]
+     */
+    componentNames?: readonly string[];
+    /**
+     * Иконки, которые необходимо включить вручную.
+     *
+     * Используется для runtime-имён:
+     * `<Icon name={valueFromApi} />`.
+     */
+    include?: readonly string[];
+    /**
+     * Имя npm-пакета с иконками.
+     *
+     * @default "@dubium/icons"
+     */
+    packageName?: string;
+    /**
+     * Каталоги приложения, которые нужно сканировать.
+     * Пути могут быть абсолютными или относительными к Vite root.
+     *
+     * @default ["src"]
+     */
+    scan?: readonly string[];
+    /**
+     * Если true, сборка завершится ошибкой при обнаружении
+     * `<Icon name={dynamicValue} />`.
+     *
+     * При false будет выведено предупреждение.
+     *
+     * @default false
+     */
+    strictDynamicNames?: boolean;
+}
+/**
+ * Vite-плагин для compile-time извлечения используемых иконок.
+ *
+ * Он сканирует JSX/TSX, находит статические:
+ * `<Icon name="User" />`,
+ * а затем создаёт virtual registry только для найденных имён.
+ *
+ * Благодаря этому Rollup/Vite видит dynamic import() только реально
+ * используемых иконок, и остальные иконки не попадают в dist приложения.
+ */
+export declare const dubiumIcons: (options?: DubiumIconsPluginOptions) => Plugin;
+export default dubiumIcons;

package/dist/vite/index.js

@@ -0,0 +1,167 @@
+import { readFile as e, readdir as t } from "node:fs/promises";
+import { extname as n, isAbsolute as r, join as i, relative as a, resolve as o } from "node:path";
+//#region src/icons/vite/index.ts
+var s = "virtual:@dubium/icons-registry", c = `\0${s}`, l = /* @__PURE__ */ new Set([
+	".js",
+	".jsx",
+	".mjs",
+	".cjs",
+	".ts",
+	".tsx"
+]), u = /* @__PURE__ */ new Set([
+	".git",
+	".next",
+	".nuxt",
+	".output",
+	".turbo",
+	"build",
+	"coverage",
+	"dist",
+	"node_modules"
+]), d = (e) => e.replaceAll("\\", "/"), f = (e, t) => {
+	if (e.size !== t.size) return !1;
+	for (let n of e) if (!t.has(n)) return !1;
+	return !0;
+}, p = (e) => {
+	let t = e.map((e) => e.replace(/[.*+?^${}()|[\]\\]/gu, "\\$&"));
+	return RegExp(`<\\s*(?:${t.join("|")})\\b`, "gu");
+}, m = (e, t) => {
+	let n = null, r = !1, i = 0;
+	for (let a = t; a < e.length; a += 1) {
+		let t = e[a];
+		if (n) {
+			if (r) {
+				r = !1;
+				continue;
+			}
+			if (t === "\\") {
+				r = !0;
+				continue;
+			}
+			t === n && (n = null);
+			continue;
+		}
+		if (t === "'" || t === "\"" || t === "`") {
+			n = t;
+			continue;
+		}
+		if (t === "{") {
+			i += 1;
+			continue;
+		}
+		if (t === "}") {
+			i = Math.max(0, i - 1);
+			continue;
+		}
+		if (t === ">" && i === 0) return a;
+	}
+	return -1;
+}, h = (e) => {
+	let t = /\bname\s*=\s*(["'])(.*?)\1/su.exec(e);
+	if (t) return t[2].trim();
+	let n = /\bname\s*=\s*\{\s*(?:(["'])(.*?)\1|`([^`${}]*)`)\s*\}/su.exec(e);
+	return n ? (n[2] ?? n[3] ?? "").trim() : null;
+}, g = (e) => /\bname\s*=/u.test(e), _ = (e, t) => {
+	let n = /* @__PURE__ */ new Set(), r = p(t), i = 0;
+	for (let t of e.matchAll(r)) {
+		let r = t.index ?? 0, a = m(e, r);
+		if (a === -1) continue;
+		let o = e.slice(r, a + 1), s = h(o);
+		if (s) {
+			n.add(s);
+			continue;
+		}
+		g(o) && (i += 1);
+	}
+	return {
+		dynamicNames: i,
+		icons: n
+	};
+}, v = async (e) => {
+	let r;
+	try {
+		r = await t(e, { withFileTypes: !0 });
+	} catch {
+		return [];
+	}
+	let a = [];
+	for (let t of r) {
+		let r = i(e, t.name);
+		if (t.isDirectory()) {
+			u.has(t.name) || a.push(...await v(r));
+			continue;
+		}
+		t.isFile() && l.has(n(t.name).toLowerCase()) && a.push(r);
+	}
+	return a;
+}, y = (e, t) => `/**
+ * AUTO-GENERATED in memory by @dubium/icons/vite.
+ * Contains only icons used by the current application.
+ */
+export const iconRegistry = {
+${e.map((e) => `\t${JSON.stringify(e)}: () => import(${JSON.stringify(`${t}/icons/${e}`)}),`).join("\n")}
+}
+`, b = (t = {}) => {
+	let i = t.componentNames?.length ? [...t.componentNames] : ["Icon"], u = t.packageName ?? "@dubium/icons", p = t.scan?.length ? [...t.scan] : ["src"], m = new Set(t.include ?? []), h = /* @__PURE__ */ new Map(), g = /* @__PURE__ */ new Map(), b = process.cwd(), x, S = () => {
+		let e = new Set(m);
+		for (let t of h.values()) for (let n of t) e.add(n);
+		return [...e].sort((e, t) => e.localeCompare(t));
+	}, C = async (t) => {
+		let r = d(t);
+		if (!l.has(n(t).toLowerCase())) return h.delete(r), g.delete(r), !1;
+		let a;
+		try {
+			a = await e(t, "utf8");
+		} catch {
+			let e = h.delete(r), t = g.delete(r);
+			return e || t;
+		}
+		let o = h.get(r) ?? /* @__PURE__ */ new Set(), s = g.get(r) ?? 0, c = _(a, i);
+		return h.set(r, c.icons), c.dynamicNames > 0 ? g.set(r, c.dynamicNames) : g.delete(r), !f(o, c.icons) || s !== c.dynamicNames;
+	}, w = async (e) => {
+		h.clear(), g.clear();
+		for (let t of p) {
+			let n = await v(r(t) ? t : o(b, t));
+			for (let t of n) e?.addWatchFile(t), await C(t);
+		}
+	}, T = () => g.size === 0 ? null : `[@dubium/icons] Найдены динамические name у <Icon>:\n${[...g.entries()].map(([e, t]) => `  - ${d(a(b, e))}: ${t}`).join("\n")}\nVite не может определить такие иконки на этапе сборки. Добавьте допустимые имена в dubiumIcons({ include: [...] }).`, E = () => {
+		if (!x) return;
+		let e = x.moduleGraph.getModuleById(c);
+		e && x.moduleGraph.invalidateModule(e), x.ws.send({ type: "full-reload" });
+	};
+	return {
+		name: "dubium-icons",
+		enforce: "pre",
+		configResolved(e) {
+			b = e.root;
+		},
+		async buildStart() {
+			await w(this);
+			let e = T();
+			e && (t.strictDynamicNames ? this.error(e) : this.warn(e));
+		},
+		configureServer(e) {
+			x = e;
+			let t = async (e) => {
+				await C(e) && E();
+			}, n = async (e) => {
+				let t = d(e);
+				(h.delete(t) || g.delete(t)) && E();
+			};
+			return e.watcher.on("add", t), e.watcher.on("unlink", n), () => {
+				e.watcher.off("add", t), e.watcher.off("unlink", n);
+			};
+		},
+		resolveId(e) {
+			return e === s ? c : null;
+		},
+		load(e) {
+			return e === c ? y(S(), u) : null;
+		},
+		async handleHotUpdate(e) {
+			if (await C(e.file)) return E(), [];
+		}
+	};
+};
+//#endregion
+export { b as default, b as dubiumIcons };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@dubium/icons",
-	"version": "0.0.2-alpha.1",
+	"version": "0.0.2-alpha.3",
 	"private": false,
 	"files": [
 		"dist"
@@ -20,20 +20,31 @@
 			"types": "./dist/collection/index.d.ts",
 			"import": "./dist/collection/index.js"
 		},
+		"./icons/*Icon": {
+			"types": "./dist/collection/*Icon.d.ts",
+			"import": "./dist/collection/*Icon.js"
+		},
 		"./icons/*": {
 			"types": "./dist/collection/*Icon.d.ts",
 			"import": "./dist/collection/*Icon.js"
+		},
+		"./vite": {
+			"types": "./dist/vite/index.d.ts",
+			"import": "./dist/vite/index.js"
 		}
 	},
 	"scripts": {
 		"dev": "vite",
 		"build": "vite build && tsc -p tsconfig.build.json",
+		"build:icons": "vite build --config vite.icons.config.ts",
+		"sync:icons": "node scripts/sync-icons.mjs",
 		"lint": "oxlint",
 		"lint:fix": "oxlint --fix",
 		"format": "oxfmt",
 		"format:check": "oxfmt --check",
 		"check": "npm run lint && npm run format:check && npm run typecheck",
-		"preview": "vite preview"
+		"preview": "vite preview",
+		"typecheck": "tsc --noEmit"
 	},
 	"devDependencies": {
 		"@types/node": "^24.13.3",
@@ -44,11 +55,18 @@
 		"oxlint": "^1.78.0",
 		"oxlint-tsgolint": "^7.0.2001",
 		"rollup-plugin-visualizer": "^7.0.1",
+		"svgo": "^4.0.2",
 		"typescript": "~7.0.2",
 		"vite": "^8.2.1"
 	},
 	"peerDependencies": {
 		"react": "^18.0.0 || ^19.0.0",
-		"react-dom": "^18.0.0 || ^19.0.0"
+		"react-dom": "^18.0.0 || ^19.0.0",
+		"vite": "^8.0.0"
+	},
+	"peerDependenciesMeta": {
+		"vite": {
+			"optional": true
+		}
 	}
 }

package/dist/collection/UserIcon.d.ts

@@ -1,12 +0,0 @@
-import type { IIconComponentProps } from "./types.js";
-/**
- * Иконка.
- *
- * @remarks
- * свойство `color` из {@link IIconComponentProps}.
- *
- * @param props - Свойства компонента иконки.
- * @returns SVG-элемент иконки.
- */
-declare const UserIcon: ({ color, ...props }: IIconComponentProps) => import("react").JSX.Element;
-export default UserIcon;

package/dist/collection/UserIcon.js

@@ -1,19 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-//#region src/icons/collection/UserIcon.tsx
-var t = ({ color: t = "currentColor", ...n }) => /* @__PURE__ */ e("svg", {
-	fill: "none",
-	height: "100%",
-	viewBox: "0 0 24 24",
-	width: "100%",
-	xmlns: "http://www.w3.org/2000/svg",
-	...n,
-	children: /* @__PURE__ */ e("path", {
-		d: "M6 21V19C6 17.9391 6.42143 16.9217 7.17157 16.1716C7.92172 15.4214 8.93913 15 10 15H14C15.0609 15 16.0783 15.4214 16.8284 16.1716C17.5786 16.9217 18 17.9391 18 19V21M8 7C8 8.06087 8.42143 9.07828 9.17157 9.82843C9.92172 10.5786 10.9391 11 12 11C13.0609 11 14.0783 10.5786 14.8284 9.82843C15.5786 9.07828 16 8.06087 16 7C16 5.93913 15.5786 4.92172 14.8284 4.17157C14.0783 3.42143 13.0609 3 12 3C10.9391 3 9.92172 3.42143 9.17157 4.17157C8.42143 4.92172 8 5.93913 8 7Z",
-		stroke: t,
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		strokeWidth: "2"
-	})
-});
-//#endregion
-export { t as default };

package/dist/spa/icon/Icon.registry.js

@@ -1,4 +0,0 @@
-//#region src/icons/spa/icon/Icon.registry.ts
-var e = { User: () => import("../../collection/UserIcon.js") };
-//#endregion
-export { e as defaultIcons };