@dubium/icons 0.0.1

package/dist/collection/UserIcon.d.ts

@@ -0,0 +1,12 @@
+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

@@ -0,0 +1,19 @@
+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/collection/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Коллекция базовых SVG-иконок.
+ *
+ * Экспортирует готовые компоненты иконок и связанные типы.
+ */
+export type { IIconComponentProps } from "./types.js";
+export { default as UserIcon } from "./UserIcon.js";

package/dist/collection/types.d.ts

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

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

@@ -0,0 +1,40 @@
+import type { TEmptyIconRegistry, TIconRegistry } from "./Icon.types.js";
+import { type IconProps } from "./Icon.js";
+/**
+ * Создаёт типизированную обёртку над компонентом `Icon`
+ * с поддержкой автодополнения (autocomplete) для кастомных иконок.
+ *
+ * @typeParam TCustomIcons - Реестр кастомных иконок (обычно `typeof appIcons`)
+ *
+ * @returns Компонент иконки с типобезопасным пропом `name`,
+ * включающим как встроенные (`defaultIcons`), так и кастомные иконки.
+ *
+ * @example
+ * ```ts
+ * const appIcons = {
+ *   User: () => import("./UserIcon"),
+ *   Settings: () => import("./SettingsIcon"),
+ * } as const;
+ *
+ * type TAppIcons = typeof appIcons;
+ *
+ * const AppIcon = createIcon<TAppIcons>();
+ * ```
+ *
+ * ```tsx
+ * <IconProvider icons={appIcons}>
+ *   <AppIcon name="User" />     // ✅ autocomplete
+ *   <AppIcon name="Close" />    // ✅ из UIKit
+ *   <AppIcon name="Wrong" />    // ❌ ошибка TypeScript
+ * </IconProvider>
+ * ```
+ *
+ * @remarks
+ * - Требует использования `IconProvider` для передачи реестра иконок в runtime
+ * - Без `IconProvider` кастомные иконки не будут найдены
+ * - Используется для улучшения DX (type safety + autocomplete)
+ */
+export declare const createIcon: <TCustomIcons extends TIconRegistry = TEmptyIconRegistry>() => {
+    (props: IconProps<TCustomIcons>): import("react").JSX.Element;
+    displayName: string;
+};

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

@@ -0,0 +1,9 @@
+import { Icon as e } from "./Icon.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/icons/spa/icon/Icon.create.tsx
+var n = () => {
+	let n = (n) => /* @__PURE__ */ t(e, { ...n });
+	return n.displayName = "TypedIcon", n;
+};
+//#endregion
+export { n as createIcon };

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

@@ -0,0 +1,57 @@
+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;
+    /**
+     * Угол поворота
+     */
+    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 - Обработчик клика по иконке
+ *
+ * @example
+ * <Icon name="Arrow" size={32} color="blue" deg={90} />
+ *
+ * @returns React-элемент иконки
+ */
+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 MemoizedIcon: MemoExoticComponent<typeof IconComponentBase> & typeof IconComponentBase;
+export { MemoizedIcon as Icon };

package/dist/spa/icon/Icon.js

@@ -0,0 +1,64 @@
+import { useIconContext as e } from "../provider/IconProvider.context.js";
+import { defaultIcons as t } from "./Icon.registry.js";
+import { memo as n, useEffect as r, useMemo as i, useState as a } from "react";
+import { jsx as o } from "react/jsx-runtime";
+//#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]), [_, v] = a(() => s.get(n) || null), [y, b] = a(!1), x = l ?? c, S = u ?? c, C = i(() => ({
+		display: "inline-flex",
+		alignItems: "center",
+		justifyContent: "center",
+		width: x,
+		height: S,
+		transform: `rotate(${f}deg)`
+	}), [
+		x,
+		S,
+		f
+	]);
+	return r(() => {
+		let e = !1;
+		return (async () => {
+			let t = String(n), r = s.get(t);
+			if (r) {
+				v(() => r);
+				return;
+			}
+			let i = g[n];
+			if (!i) {
+				console.warn(`Иконка "${t}" не найдена`), v(() => null);
+				return;
+			}
+			b(!0), v(() => null), i().then((n) => {
+				if (e) return;
+				let r = n.default;
+				s.set(t, r), v(() => r);
+			}).catch((n) => {
+				e || (console.error(`Ошибка загрузки иконки "${t}":`, n), v(() => null));
+			}).finally(() => {
+				e || b(!1);
+			});
+		})(), () => {
+			e = !0;
+		};
+	}, [n, g]), y || !_ ? /* @__PURE__ */ o("div", {
+		"aria-hidden": "true",
+		role: "img",
+		style: {
+			...C,
+			visibility: "hidden"
+		}
+	}) : /* @__PURE__ */ o("div", {
+		"aria-label": m || n,
+		onClick: p,
+		role: "img",
+		style: C,
+		children: _ ? /* @__PURE__ */ o(_, { color: d }) : null
+	});
+});
+c.displayName = "Icon";
+//#endregion
+export { c as Icon };

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

@@ -0,0 +1,36 @@
+/**
+ * Реестр встроенных иконок.
+ *
+ * Каждая иконка описывается как функция-лоадер с динамическим `import()`,
+ * что позволяет:
+ * - выполнять code-splitting (tree shaking)
+ * - загружать иконки по требованию (lazy loading)
+ *
+ * @example
+ * ```ts
+ * const defaultIcons = {
+ *   Close: () => import("../../icons/CloseIcon"),
+ * };
+ * ```
+ *
+ * @remarks
+ * - Используется внутри компонента `Icon` как базовый источник иконок
+ * - Может быть расширен пользовательскими иконками через `IconProvider`
+ * - Не требует `IconProvider` для работы
+ */
+export declare const defaultIcons: {
+    readonly Close: () => Promise<typeof import("../../collection/UserIcon.js")>;
+};
+/**
+ * Объединение имён всех встроенных иконок.
+ *
+ * Используется для:
+ * - типизации пропа `name` в `Icon`
+ * - автодополнения (autocomplete) для встроенных иконок
+ *
+ * @example
+ * ```ts
+ * type TDefaultIconName = "Close";
+ * ```
+ */
+export type TDefaultIconName = keyof typeof defaultIcons;

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

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

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

@@ -0,0 +1,79 @@
+import type { ComponentType, SVGProps } from "react";
+import type { TDefaultIconName } from "./Icon.registry.js";
+/**
+ * Тип "пустого" реестра иконок.
+ *
+ * Используется как значение по умолчанию в generic-параметрах,
+ * чтобы избежать использования `{}` (который допускает любые значения).
+ *
+ * @remarks
+ * Обеспечивает корректную типизацию без ослабления type safety.
+ */
+export type TEmptyIconRegistry = Record<string, never>;
+/**
+ * Базовые пропсы для SVG-иконки.
+ *
+ * Расширяет стандартные SVG-атрибуты и добавляет поддержку цвета.
+ *
+ * @property color - Цвет заливки иконки (обычно прокидывается в `fill`)
+ */
+export interface IIconComponentProps extends SVGProps<SVGSVGElement> {
+    color?: string;
+}
+/**
+ * Тип React-компонента иконки.
+ *
+ * Каждая иконка должна быть функциональным компонентом,
+ * принимающим `IIconComponentProps`.
+ */
+export type TIcon = ComponentType<IIconComponentProps>;
+/**
+ * Тип модуля, возвращаемого через динамический `import()`.
+ *
+ * @property default - React-компонент иконки
+ */
+export type TIconModule = {
+    default: TIcon;
+};
+/**
+ * Тип функции-лоадера иконки.
+ *
+ * Используется для lazy loading (code splitting) через `import()`.
+ *
+ * @example
+ * ```ts
+ * const loader: TIconLoader = () => import("./CloseIcon");
+ * ```
+ */
+export type TIconLoader = () => Promise<TIconModule>;
+/**
+ * Реестр иконок.
+ *
+ * Представляет собой словарь, где:
+ * - ключ — имя иконки
+ * - значение — функция загрузки (lazy import)
+ *
+ * @example
+ * ```ts
+ * const icons: TIconRegistry = {
+ *   Close: () => import("./CloseIcon"),
+ * };
+ * ```
+ */
+export type TIconRegistry = Readonly<Record<string, TIconLoader>>;
+/**
+ * Тип допустимых имён иконок.
+ *
+ * Объединяет:
+ * - встроенные иконки (`TDefaultIconName`)
+ * - кастомные иконки (`TCustomIcons`)
+ *
+ * @typeParam TCustomIcons - Реестр кастомных иконок
+ *
+ * @example
+ * ```ts
+ * type Name = TIconName<typeof appIcons>;
+ * // "Close" | "User" | "Settings"
+ * ```
+ */
+export type TIconName<TCustomIcons extends TIconRegistry = TEmptyIconRegistry> = Extract<keyof TCustomIcons, string> | TDefaultIconName;

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

@@ -0,0 +1,9 @@
+/**
+ * Публичный API модуля иконок для SPA (клиентский рендеринг).
+ *
+ * Экспортирует компонент `Icon`, фабрику `createIcon` и связанные типы
+ * с поддержкой ленивой загрузки иконок через динамический `import()`.
+ */
+export { Icon, type IconProps } from "./Icon.js";
+export { createIcon } from "./Icon.create.js";
+export type { IIconComponentProps, TEmptyIconRegistry, TIcon, TIconLoader, TIconModule, TIconName, TIconRegistry, } from "./Icon.types.js";

package/dist/spa/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Публичный API пакета иконок для SPA (клиентский рендеринг).
+ *
+ * Позволяет лениво загружать иконки через динамический `import()`
+ * с поддержкой code-splitting.
+ */
+export { IconProvider, useIconContext, type IIconContextValue, type IIconProviderProps } from "./provider/index.js";
+export { Icon, createIcon, type IconProps, type IIconComponentProps, type TEmptyIconRegistry, type TIcon, type TIconLoader, type TIconModule, type TIconName, type TIconRegistry, } from "./icon/index.js";

package/dist/spa/index.js

@@ -0,0 +1,5 @@
+import { useIconContext as e } from "./provider/IconProvider.context.js";
+import { IconProvider as t } from "./provider/IconProvider.js";
+import { Icon as n } from "./icon/Icon.js";
+import { createIcon as r } from "./icon/Icon.create.js";
+export { n as Icon, t as IconProvider, r as createIcon, e as useIconContext };

package/dist/spa/provider/IconProvider.context.d.ts

@@ -0,0 +1,32 @@
+import type { TEmptyIconRegistry, TIconRegistry } from "../icon/index.ts";
+import type { IIconContextValue } from "./IconProvider.types.ts";
+/**
+ * React-контекст для хранения реестра иконок.
+ *
+ * Используется компонентами `Icon` / `AppIcon` для получения кастомных иконок,
+ * переданных через `IconProvider`.
+ *
+ * @remarks
+ * - Значение по умолчанию содержит пустой реестр (`icons: {}`)
+ * - Без `IconProvider` будут доступны только встроенные (`defaultIcons`) иконки
+ */
+export declare const IconContext: import("react").Context<IIconContextValue<Readonly<Record<string, import("../index.ts").TIconLoader>>>>;
+/**
+ * Хук для доступа к `IconContext` с поддержкой типизации кастомных иконок.
+ *
+ * @typeParam TCustomIcons - Тип реестра кастомных иконок
+ *
+ * @returns Значение контекста с типизированным полем `icons`
+ *
+ * @example
+ * ```ts
+ * const { icons } = useIconContext<typeof appIcons>();
+ * ```
+ *
+ * @remarks
+ * - Выполняет приведение типа (`type assertion`), так как TypeScript
+ *   не может автоматически вывести тип из `IconProvider`
+ * - Используется внутри `Icon` для объединения:
+ *   `{ ...defaultIcons, ...icons }`
+ */
+export declare const useIconContext: <TCustomIcons extends TIconRegistry = TEmptyIconRegistry>() => IIconContextValue<TCustomIcons>;

package/dist/spa/provider/IconProvider.context.js

@@ -0,0 +1,5 @@
+import { createContext as e, useContext as t } from "react";
+//#region src/icons/spa/provider/IconProvider.context.ts
+var n = e({ icons: {} }), r = () => t(n);
+//#endregion
+export { n as IconContext, r as useIconContext };

package/dist/spa/provider/IconProvider.d.ts

@@ -0,0 +1,34 @@
+import type { TEmptyIconRegistry, TIconRegistry } from "../icon/index.ts";
+import type { IIconProviderProps } from "./IconProvider.types.ts";
+/**
+ * Провайдер контекста UI-библиотеки (`IconProvider`).
+ *
+ * Обеспечивает передачу реестра кастомных иконок вниз по дереву компонентов,
+ * чтобы они могли быть использованы в `Icon` / `AppIcon`.
+ *
+ * @typeParam TCustomIcons - Тип реестра кастомных иконок (обычно `typeof appIcons`)
+ *
+ * @param props - Свойства провайдера
+ * @param props.children - Дочерние React-элементы
+ * @param props.icons - Реестр кастомных иконок (lazy loaders)
+ *
+ * @returns Провайдер контекста с доступом к иконкам
+ *
+ * @example
+ * ```tsx
+ * const appIcons = {
+ *   User: () => import("./UserIcon"),
+ * } as const;
+ *
+ * <IconProvider icons={appIcons}>
+ *   <App />
+ * </IconProvider>
+ * ```
+ *
+ * @remarks
+ * - Не обязателен для использования встроенных (`defaultIcons`) иконок
+ * - Обязателен для работы кастомных иконок
+ * - Использует `useMemo` для предотвращения лишних перерисовок
+ * - Если `icons` не передан, используется пустой реестр
+ */
+export declare const IconProvider: <TCustomIcons extends TIconRegistry = TEmptyIconRegistry>({ children, icons, }: IIconProviderProps<TCustomIcons>) => import("react").JSX.Element;

package/dist/spa/provider/IconProvider.js

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

package/dist/spa/provider/IconProvider.types.d.ts

@@ -0,0 +1,28 @@
+import type { ReactNode } from "react";
+import type { TEmptyIconRegistry, TIconRegistry } from "../icon/index.ts";
+/**
+ * Значение, хранящееся в React-контексте `IconContext`.
+ *
+ * @template TCustomIcons - Тип реестра кастомных иконок (расширяет `TIconRegistry`)
+ */
+export interface IIconContextValue<TCustomIcons extends TIconRegistry = TEmptyIconRegistry> {
+    /**
+     * Реестр кастомных иконок (ленивые загрузчики)
+     */
+    icons: TCustomIcons;
+}
+/**
+ * Свойства компонента `IconProvider`.
+ *
+ * @template TCustomIcons - Тип реестра кастомных иконок (расширяет `TIconRegistry`)
+ */
+export interface IIconProviderProps<TCustomIcons extends TIconRegistry = TEmptyIconRegistry> {
+    /**
+     * Дочерние React-элементы, которые получат доступ к контексту
+     */
+    children: ReactNode;
+    /**
+     * Реестр кастомных иконок (опционально, по умолчанию пустой объект)
+     */
+    icons?: TCustomIcons;
+}

package/dist/spa/provider/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Публичный API модуля провайдера иконок для SPA (клиентский рендеринг).
+ *
+ * Экспортирует `IconProvider`, хук `useIconContext` и связанные типы.
+ */
+export { IconProvider } from "./IconProvider.js";
+export { useIconContext } from "./IconProvider.context.js";
+export type { IIconContextValue, IIconProviderProps } from "./IconProvider.types.js";

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

@@ -0,0 +1,56 @@
+import type { IconProps, TIconRegistry } from "./Icon.types.js";
+/**
+ * Создаёт типизированную обёртку над компонентом `Icon`
+ * с поддержкой автодополнения (autocomplete) для кастомных иконок.
+ *
+ * @typeParam TIcons - Реестр иконок (обычно `typeof appIcons`)
+ *
+ * @returns Компонент иконки с типобезопасным пропом `name`,
+ * включающим все иконки из переданного реестра.
+ *
+ * @example
+ * ```tsx
+ * const appIcons = defineIcons({
+ *   User: UserIcon,
+ *   Settings: SettingsIcon,
+ * });
+ *
+ * const AppIcon = createIcon<typeof appIcons>();
+ *
+ * <IconProvider icons={appIcons}>
+ *   <AppIcon name="User" />     // ✅ autocomplete
+ *   <AppIcon name="Wrong" />    // ❌ ошибка TypeScript
+ * </IconProvider>
+ * ```
+ *
+ * @remarks
+ * - В отличие от SPA-версии, иконки передаются синхронно (без `import()`)
+ * - Требует использования `IconProvider` для передачи реестра иконок в runtime
+ */
+export declare const createIcon: <TIcons extends TIconRegistry>() => {
+    (props: IconProps<TIcons>): import("react").JSX.Element;
+    displayName: string;
+};
+/**
+ * Помогает вывести точный тип реестра иконок для серверного рендеринга.
+ *
+ * Используется вместе с `createIcon`, чтобы TypeScript сохранил
+ * конкретные имена иконок в типе вместо общего `string`.
+ *
+ * @typeParam TIcons - Реестр иконок (выводится автоматически)
+ *
+ * @param icons - Реестр иконок с синхронными React-компонентами
+ *
+ * @returns Тот же реестр иконок с неизменённым (точным) типом
+ *
+ * @example
+ * ```ts
+ * const appIcons = defineIcons({
+ *   User: UserIcon,
+ *   Close: CloseIcon,
+ * });
+ *
+ * // typeof appIcons → { User: typeof UserIcon; Close: typeof CloseIcon }
+ * ```
+ */
+export declare const defineIcons: <const TIcons extends TIconRegistry>(icons: TIcons) => TIcons;

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

@@ -0,0 +1,9 @@
+import { Icon as e } from "./Icon.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/icons/ssr/icon/Icon.create.tsx
+var n = () => {
+	let n = (n) => /* @__PURE__ */ t(e, { ...n });
+	return n.displayName = "SSRIcon", n;
+}, r = (e) => e;
+//#endregion
+export { n as createIcon, r as defineIcons };

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

@@ -0,0 +1,33 @@
+import type { IconProps, TIconRegistry } from "./Icon.types.js";
+/**
+ * Компонент иконки для серверного рендеринга (SSR).
+ *
+ * Иконка загружается синхронно из реестра, переданного через `IconProvider`,
+ * без динамических импортов, что корректно работает на сервере.
+ *
+ * @typeParam TIcons - Тип реестра иконок
+ *
+ * @param props - Свойства компонента иконки
+ * @param props.name - Имя иконки для отображения
+ * @param props.size - Размер иконки в пикселях (по умолчанию 24)
+ * @param props.width - Ширина иконки (если нужен прямоугольник)
+ * @param props.height - Высота иконки (если нужен прямоугольник)
+ * @param props.color - Цвет иконки (по умолчанию "currentColor")
+ * @param props.deg - Угол поворота иконки в градусах (по умолчанию 0)
+ * @param props.onClick - Обработчик клика по иконке
+ * @param props.ariaLabel - Атрибут `aria-label` для доступности
+ * @param props.style - Дополнительные CSS-стили контейнера
+ *
+ * @example
+ * ```tsx
+ * <Icon name="Arrow" size={32} color="blue" deg={90} />
+ * ```
+ *
+ * @remarks
+ * - Если иконка не найдена в реестре, выводится предупреждение и `null`
+ * - Контейнер рендерится как `<span>` с `inline-flex` для центрирования
+ * - При указании `ariaLabel` контейнер становится видимым для скринридера (`role="img"`)
+ *
+ * @returns React-элемент иконки
+ */
+export declare const Icon: <TIcons extends TIconRegistry = TIconRegistry>({ name, size, width, height, color, deg, onClick, ariaLabel, style, }: IconProps<TIcons>) => import("react").JSX.Element | null;

package/dist/ssr/icon/Icon.js

@@ -0,0 +1,31 @@
+import { useIconRegistry as e } from "../provider/useIconRegistry.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/icons/ssr/icon/Icon.tsx
+var n = ({ name: n, size: r = 24, width: i, height: a, color: o = "currentColor", deg: s = 0, onClick: c, ariaLabel: l, style: u }) => {
+	let d = e()[String(n)];
+	if (!d) return console.warn(`Иконка "${String(n)}" не найдена`), null;
+	let f = {
+		display: "inline-flex",
+		alignItems: "center",
+		justifyContent: "center",
+		flex: "0 0 auto",
+		width: i ?? r,
+		height: a ?? r,
+		transform: `rotate(${s}deg)`,
+		...u
+	};
+	return /* @__PURE__ */ t("span", {
+		"aria-hidden": !l || void 0,
+		"aria-label": l,
+		onClick: c,
+		role: l ? "img" : void 0,
+		style: f,
+		children: /* @__PURE__ */ t(d, {
+			"aria-hidden": "true",
+			color: o,
+			focusable: "false"
+		})
+	});
+};
+//#endregion
+export { n as Icon };

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

@@ -0,0 +1,90 @@
+import type { ComponentType, CSSProperties, MouseEventHandler, SVGProps } from "react";
+/**
+ * Базовые пропсы для SVG-иконки.
+ *
+ * Расширяет стандартные SVG-атрибуты и добавляет поддержку цвета.
+ *
+ * @property color - Цвет заливки иконки (обычно прокидывается в `fill`)
+ */
+export interface IIconComponentProps extends SVGProps<SVGSVGElement> {
+    color?: string;
+}
+/**
+ * Тип React-компонента иконки.
+ *
+ * Каждая иконка должна быть функциональным компонентом,
+ * принимающим `IIconComponentProps`.
+ */
+export type TIcon = ComponentType<IIconComponentProps>;
+/**
+ * Реестр иконок для серверного рендеринга (SSR).
+ *
+ * В отличие от SPA-версии, здесь иконки хранятся как уже готовые
+ * React-компоненты (синхронно), а не как функции-лоадеры с `import()`.
+ *
+ * @example
+ * ```ts
+ * const icons: TIconRegistry = {
+ *   Close: CloseIcon,
+ *   User: UserIcon,
+ * };
+ * ```
+ */
+export type TIconRegistry = Readonly<Record<string, TIcon>>;
+/**
+ * Тип допустимых имён иконок.
+ *
+ * Ограничивает проп `name` в `Icon` строго ключами переданного реестра.
+ *
+ * @typeParam TIcons - Реестр иконок
+ *
+ * @example
+ * ```ts
+ * type Name = TIconName<typeof appIcons>;
+ * // "Close" | "User"
+ * ```
+ */
+export type TIconName<TIcons extends TIconRegistry = TIconRegistry> = Extract<keyof TIcons, string>;
+/**
+ * Свойства компонента иконки для серверного рендеринга (SSR).
+ *
+ * @template TIcons - Тип реестра иконок
+ */
+export interface IconProps<TIcons extends TIconRegistry = TIconRegistry> {
+    /**
+     * Атрибут aria-label (делает иконку доступной для скринридера)
+     */
+    ariaLabel?: string;
+    /**
+     * Цвет иконки
+     */
+    color?: string;
+    /**
+     * Угол поворота в градусах
+     */
+    deg?: number;
+    /**
+     * Высота (если нужен прямоугольник)
+     */
+    height?: number | string;
+    /**
+     * Имя иконки
+     */
+    name: TIconName<TIcons>;
+    /**
+     * Обработчик клика по контейнеру иконки
+     */
+    onClick?: MouseEventHandler<HTMLSpanElement>;
+    /**
+     * Приоритетный размер (квадратный)
+     */
+    size?: number | string;
+    /**
+     * Дополнительные CSS-стили контейнера
+     */
+    style?: CSSProperties;
+    /**
+     * Ширина (если нужен прямоугольник)
+     */
+    width?: number | string;
+}

package/dist/ssr/icon/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Публичный API модуля иконок для серверного рендеринга (SSR).
+ *
+ * Экспортирует компонент `Icon`, фабрику `createIcon`, хелпер `defineIcons`
+ * и связанные типы.
+ */
+export { Icon } from "./Icon.js";
+export { createIcon, defineIcons } from "./Icon.create.js";
+export type { IIconComponentProps, TIcon, TIconRegistry, IconProps, TIconName } from "./Icon.types.js";

package/dist/ssr/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Публичный API пакета иконок для серверного рендеринга (SSR).
+ *
+ * Позволяет отображать иконки синхронно на сервере и клиенте
+ * без динамических импортов.
+ */
+export { Icon, createIcon, defineIcons, type IconProps, type IIconComponentProps, type TIcon, type TIconName, type TIconRegistry, } from "./icon/index.js";
+export { IconProvider, useIconRegistry, type IIconProviderProps } from "./provider/index.js";

package/dist/ssr/index.js

@@ -0,0 +1,5 @@
+import { useIconRegistry as e } from "./provider/useIconRegistry.js";
+import { Icon as t } from "./icon/Icon.js";
+import { createIcon as n, defineIcons as r } from "./icon/Icon.create.js";
+import { IconProvider as i } from "./provider/IconProvider.js";
+export { t as Icon, i as IconProvider, n as createIcon, r as defineIcons, e as useIconRegistry };

package/dist/ssr/provider/IconProvider.context.d.ts

@@ -0,0 +1,7 @@
+/**
+ * React-контекст для хранения реестра иконок при серверном рендеринге (SSR).
+ *
+ * Значение по умолчанию — пустой реестр. Фактический реестр иконок
+ * передаётся через `IconProvider`.
+ */
+export declare const IconRegistryContext: import("react").Context<Readonly<Record<string, import("../index.js").TIcon>>>;

package/dist/ssr/provider/IconProvider.context.js

@@ -0,0 +1,5 @@
+import { createContext as e } from "react";
+//#region src/icons/ssr/provider/IconProvider.context.ts
+var t = e({});
+//#endregion
+export { t as IconRegistryContext };

package/dist/ssr/provider/IconProvider.d.ts

@@ -0,0 +1,33 @@
+import type { TIconRegistry } from "../icon/Icon.types.js";
+import type { IIconProviderProps } from "./IconProvider.types.js";
+/**
+ * Провайдер реестра иконок для серверного рендеринга (SSR).
+ *
+ * Передаёт реестр синхронных иконок вниз по дереву компонентов
+ * через `IconRegistryContext`, объединяя его с родительским реестром.
+ *
+ * @typeParam TIcons - Тип реестра иконок
+ *
+ * @param props - Свойства провайдера
+ * @param props.children - Дочерние React-элементы
+ * @param props.icons - Реестр иконок (синхронные React-компоненты)
+ *
+ * @returns Провайдер контекста с доступом к иконкам
+ *
+ * @example
+ * ```tsx
+ * const appIcons = defineIcons({
+ *   User: UserIcon,
+ * });
+ *
+ * <IconProvider icons={appIcons}>
+ *   <App />
+ * </IconProvider>
+ * ```
+ *
+ * @remarks
+ * - Позволяет вкладывать провайдеры: дочерний реестр наследует родительский
+ * - При совпадении имён иконки дочернего провайдера переопределяют родительские
+ * - Использует `useMemo` для предотвращения лишних перерисовок
+ */
+export declare const IconProvider: <TIcons extends TIconRegistry>({ children, icons }: IIconProviderProps<TIcons>) => import("react").JSX.Element;

package/dist/ssr/provider/IconProvider.js

@@ -0,0 +1,16 @@
+import { IconRegistryContext as e } from "./IconProvider.context.js";
+import { useContext as t, useMemo as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/icons/ssr/provider/IconProvider.tsx
+var i = ({ children: i, icons: a }) => {
+	let o = t(e), s = n(() => ({
+		...o,
+		...a
+	}), [o, a]);
+	return /* @__PURE__ */ r(e, {
+		value: s,
+		children: i
+	});
+};
+//#endregion
+export { i as IconProvider };

package/dist/ssr/provider/IconProvider.types.d.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from "react";
+import type { TIconRegistry } from "../icon/Icon.types.js";
+/**
+ * Свойства компонента `IconProvider` для серверного рендеринга (SSR).
+ *
+ * @template TIcons - Тип реестра иконок
+ */
+export interface IIconProviderProps<TIcons extends TIconRegistry = TIconRegistry> {
+    /** Дочерние React-элементы, которые получат доступ к реестру иконок */
+    children: ReactNode;
+    /** Реестр иконок (синхронные React-компоненты) */
+    icons: TIcons;
+}

package/dist/ssr/provider/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Публичный API модуля провайдера иконок для серверного рендеринга (SSR).
+ *
+ * Экспортирует `IconProvider`, хук `useIconRegistry` и связанные типы.
+ */
+export { IconProvider } from "./IconProvider.js";
+export { useIconRegistry } from "./useIconRegistry.js";
+export type { IIconProviderProps } from "./IconProvider.types.js";

package/dist/ssr/provider/useIconRegistry.d.ts

@@ -0,0 +1,18 @@
+import type { TIconRegistry } from "../icon/Icon.types.js";
+/**
+ * Хук для доступа к реестру иконок при серверном рендеринге (SSR).
+ *
+ * Возвращает текущий реестр иконок из `IconRegistryContext`.
+ *
+ * @returns Реестр иконок, переданный через `IconProvider`
+ *
+ * @example
+ * ```ts
+ * const registry = useIconRegistry();
+ * ```
+ *
+ * @remarks
+ * - Без `IconProvider` вернёт пустой реестр `{}`
+ * - Используется внутри компонента `Icon` для поиска иконки по имени
+ */
+export declare const useIconRegistry: () => TIconRegistry;

package/dist/ssr/provider/useIconRegistry.js

@@ -0,0 +1,6 @@
+import { IconRegistryContext as e } from "./IconProvider.context.js";
+import { useContext as t } from "react";
+//#region src/icons/ssr/provider/useIconRegistry.ts
+var n = () => t(e);
+//#endregion
+export { n as useIconRegistry };

package/package.json

@@ -0,0 +1,54 @@
+{
+	"name": "@dubium/icons",
+	"version": "0.0.1",
+	"private": false,
+	"files": [
+		"dist"
+	],
+	"type": "module",
+	"sideEffects": false,
+	"exports": {
+		"./spa": {
+			"types": "./dist/spa/index.d.ts",
+			"import": "./dist/spa/index.js"
+		},
+		"./ssr": {
+			"types": "./dist/ssr/index.d.ts",
+			"import": "./dist/ssr/index.js"
+		},
+		"./icons": {
+			"types": "./dist/collection/index.d.ts",
+			"import": "./dist/collection/index.js"
+		},
+		"./icons/*": {
+			"types": "./dist/collection/*Icon.d.ts",
+			"import": "./dist/collection/*Icon.js"
+		}
+	},
+	"scripts": {
+		"dev": "vite",
+		"build": "vite build && tsc -p tsconfig.build.json",
+		"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"
+	},
+	"devDependencies": {
+		"@types/node": "^24.13.3",
+		"@types/react": "^19.2.18",
+		"@types/react-dom": "^19.2.4",
+		"@vitejs/plugin-react": "^6.0.5",
+		"oxfmt": "^0.63.0",
+		"oxlint": "^1.78.0",
+		"oxlint-tsgolint": "^7.0.2001",
+		"rollup-plugin-visualizer": "^7.0.1",
+		"typescript": "~7.0.2",
+		"vite": "^8.2.1"
+	},
+	"peerDependencies": {
+		"react": "^18.0.0 || ^19.0.0",
+		"react-dom": "^18.0.0 || ^19.0.0"
+	}
+}