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

package/dist/collection/AlignBoxBottomRightFilledIcon.js

@@ -0,0 +1,15 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/AlignBoxBottomRightFilledIcon.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", {
+		fill: t,
+		d: "M18.333 2c1.96 0 3.56 1.537 3.662 3.472l.005.195v12.666c0 1.96-1.537 3.56-3.472 3.662l-.195.005H5.667a3.667 3.667 0 0 1-3.662-3.472L2 18.333V5.667c0-1.96 1.537-3.56 3.472-3.662L5.667 2zM12 15a1 1 0 0 0-1 1v2l.007.117A1 1 0 0 0 13 18v-2l-.007-.117A1 1 0 0 0 12 15m3-4a1 1 0 0 0-1 1v6l.007.117A1 1 0 0 0 16 18v-6l-.007-.117A1 1 0 0 0 15 11m3 2a1 1 0 0 0-1 1v4l.007.117A1 1 0 0 0 19 18v-4l-.007-.117A1 1 0 0 0 18 13"
+	})
+});
+//#endregion
+export { t as AlignBoxBottomRightFilledIcon, t as default };

package/dist/collection/AlignBoxBottomRightIcon.d.ts

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

package/dist/collection/AlignBoxBottomRightIcon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/AlignBoxBottomRightIcon.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: "M11 15v2m3-6v6m3-4v4M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"
+	})
+});
+//#endregion
+export { t as AlignBoxBottomRightIcon, t as default };

package/dist/collection/AlignBoxCenterMiddleFilledIcon.d.ts

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

package/dist/collection/AlignBoxCenterMiddleFilledIcon.js

@@ -0,0 +1,15 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/AlignBoxCenterMiddleFilledIcon.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", {
+		fill: t,
+		d: "M19 2a3 3 0 0 1 2.995 2.824L22 5v14a3 3 0 0 1-2.824 2.995L19 22H5a3 3 0 0 1-2.993-2.802L2 19V5a3 3 0 0 1 2.824-2.995L5 2zm-6 12h-2l-.117.007a1 1 0 0 0 0 1.986L11 16h2l.117-.007a1 1 0 0 0 0-1.986zm2-3H9l-.117.007a1 1 0 0 0 0 1.986L9 13h6l.117-.007a1 1 0 0 0 0-1.986zm-1-3h-4l-.117.007a1 1 0 0 0 0 1.986L10 10h4l.117-.007a1 1 0 0 0 0-1.986z"
+	})
+});
+//#endregion
+export { t as AlignBoxCenterMiddleFilledIcon, t as default };

package/dist/collection/AlignBoxCenterMiddleIcon.d.ts

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

package/dist/collection/AlignBoxCenterMiddleIcon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/AlignBoxCenterMiddleIcon.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: "M11 15h2m-4-3h6m-5-3h4M3 19V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2"
+	})
+});
+//#endregion
+export { t as AlignBoxCenterMiddleIcon, t as default };

package/dist/collection/AlignBoxLeftBottomFilledIcon.d.ts

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

package/dist/collection/AlignBoxLeftBottomFilledIcon.js

@@ -0,0 +1,15 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/AlignBoxLeftBottomFilledIcon.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", {
+		fill: t,
+		d: "M18.333 2c1.96 0 3.56 1.537 3.662 3.472l.005.195v12.666c0 1.96-1.537 3.56-3.472 3.662l-.195.005H5.667a3.667 3.667 0 0 1-3.662-3.472L2 18.333V5.667c0-1.96 1.537-3.56 3.472-3.662L5.667 2zM8 17H6l-.117.007A1 1 0 0 0 6 19h2l.117-.007A1 1 0 0 0 8 17m4-3H6l-.117.007A1 1 0 0 0 6 16h6l.117-.007A1 1 0 0 0 12 14m-2-3H6l-.117.007A1 1 0 0 0 6 13h4l.117-.007A1 1 0 0 0 10 11"
+	})
+});
+//#endregion
+export { t as AlignBoxLeftBottomFilledIcon, t as default };

package/dist/collection/AlignBoxLeftBottomIcon.d.ts

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

package/dist/collection/AlignBoxLeftBottomIcon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/AlignBoxLeftBottomIcon.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: "M9 17H7m6-3H7m4-3H7M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"
+	})
+});
+//#endregion
+export { t as AlignBoxLeftBottomIcon, t as default };

package/dist/collection/AlignBoxLeftMiddleFilledIcon.d.ts

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

package/dist/collection/AlignBoxLeftMiddleFilledIcon.js

@@ -0,0 +1,15 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/AlignBoxLeftMiddleFilledIcon.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", {
+		fill: t,
+		d: "M18.333 2c1.96 0 3.56 1.537 3.662 3.472l.005.195v12.666c0 1.96-1.537 3.56-3.472 3.662l-.195.005H5.667a3.667 3.667 0 0 1-3.662-3.472L2 18.333V5.667c0-1.96 1.537-3.56 3.472-3.662L5.667 2zM8 14H6l-.117.007A1 1 0 0 0 6 16h2l.117-.007A1 1 0 0 0 8 14m4-3H6l-.117.007A1 1 0 0 0 6 13h6l.117-.007A1 1 0 0 0 12 11m-2-3H6l-.117.007A1 1 0 0 0 6 10h4l.117-.007A1 1 0 0 0 10 8"
+	})
+});
+//#endregion
+export { t as AlignBoxLeftMiddleFilledIcon, t as default };

package/dist/collection/AlignBoxLeftMiddleIcon.d.ts

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

package/dist/collection/AlignBoxLeftMiddleIcon.js

@@ -0,0 +1,18 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/collection/AlignBoxLeftMiddleIcon.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: "M9 15H7m6-3H7m4-3H7M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"
+	})
+});
+//#endregion
+export { t as AlignBoxLeftMiddleIcon, t as default };

package/dist/collection/index.d.ts

@@ -1,10 +1,23 @@
 /**
- * AUTO-GENERATED by scripts/sync-icons.mjs.
- * Do not edit manually.
+ * СГЕНЕРИРОВАНО АВТОМАТИЧЕСКИ скриптом scripts/sync-icons.mjs.
+ * Не редактировать вручную.
  */
 export type { IIconComponentProps } from "./types.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";
+export { default as AdjustmentsPlusIcon } from "./AdjustmentsPlusIcon.js";
+export { default as AdjustmentsQuestionIcon } from "./AdjustmentsQuestionIcon.js";
+export { default as AlarmPlusFilledIcon } from "./AlarmPlusFilledIcon.js";
+export { default as AlarmSnoozeFilledIcon } from "./AlarmSnoozeFilledIcon.js";
+export { default as AlarmSnoozeIcon } from "./AlarmSnoozeIcon.js";
+export { default as AlbumIcon } from "./AlbumIcon.js";
+export { default as AlbumOffIcon } from "./AlbumOffIcon.js";
+export { default as AlertCircleFilledIcon } from "./AlertCircleFilledIcon.js";
+export { default as AlertCircleIcon } from "./AlertCircleIcon.js";
+export { default as AlertHexagonIcon } from "./AlertHexagonIcon.js";
+export { default as AlignBoxBottomRightFilledIcon } from "./AlignBoxBottomRightFilledIcon.js";
+export { default as AlignBoxBottomRightIcon } from "./AlignBoxBottomRightIcon.js";
+export { default as AlignBoxCenterMiddleFilledIcon } from "./AlignBoxCenterMiddleFilledIcon.js";
+export { default as AlignBoxCenterMiddleIcon } from "./AlignBoxCenterMiddleIcon.js";
+export { default as AlignBoxLeftBottomFilledIcon } from "./AlignBoxLeftBottomFilledIcon.js";
+export { default as AlignBoxLeftBottomIcon } from "./AlignBoxLeftBottomIcon.js";
+export { default as AlignBoxLeftMiddleFilledIcon } from "./AlignBoxLeftMiddleFilledIcon.js";
+export { default as AlignBoxLeftMiddleIcon } from "./AlignBoxLeftMiddleIcon.js";

package/dist/collection/index.js

@@ -1,6 +1,19 @@
-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 };
+import { AdjustmentsPlusIcon as e } from "./AdjustmentsPlusIcon.js";
+import { AdjustmentsQuestionIcon as t } from "./AdjustmentsQuestionIcon.js";
+import { AlarmPlusFilledIcon as n } from "./AlarmPlusFilledIcon.js";
+import { AlarmSnoozeFilledIcon as r } from "./AlarmSnoozeFilledIcon.js";
+import { AlarmSnoozeIcon as i } from "./AlarmSnoozeIcon.js";
+import { AlbumIcon as a } from "./AlbumIcon.js";
+import { AlbumOffIcon as o } from "./AlbumOffIcon.js";
+import { AlertCircleFilledIcon as s } from "./AlertCircleFilledIcon.js";
+import { AlertCircleIcon as c } from "./AlertCircleIcon.js";
+import { AlertHexagonIcon as l } from "./AlertHexagonIcon.js";
+import { AlignBoxBottomRightFilledIcon as u } from "./AlignBoxBottomRightFilledIcon.js";
+import { AlignBoxBottomRightIcon as d } from "./AlignBoxBottomRightIcon.js";
+import { AlignBoxCenterMiddleFilledIcon as f } from "./AlignBoxCenterMiddleFilledIcon.js";
+import { AlignBoxCenterMiddleIcon as p } from "./AlignBoxCenterMiddleIcon.js";
+import { AlignBoxLeftBottomFilledIcon as m } from "./AlignBoxLeftBottomFilledIcon.js";
+import { AlignBoxLeftBottomIcon as h } from "./AlignBoxLeftBottomIcon.js";
+import { AlignBoxLeftMiddleFilledIcon as g } from "./AlignBoxLeftMiddleFilledIcon.js";
+import { AlignBoxLeftMiddleIcon as _ } from "./AlignBoxLeftMiddleIcon.js";
+export { e as AdjustmentsPlusIcon, t as AdjustmentsQuestionIcon, n as AlarmPlusFilledIcon, r as AlarmSnoozeFilledIcon, i as AlarmSnoozeIcon, a as AlbumIcon, o as AlbumOffIcon, s as AlertCircleFilledIcon, c as AlertCircleIcon, l as AlertHexagonIcon, u as AlignBoxBottomRightFilledIcon, d as AlignBoxBottomRightIcon, f as AlignBoxCenterMiddleFilledIcon, p as AlignBoxCenterMiddleIcon, m as AlignBoxLeftBottomFilledIcon, h as AlignBoxLeftBottomIcon, g as AlignBoxLeftMiddleFilledIcon, _ as AlignBoxLeftMiddleIcon };

package/dist/collection/types.d.ts

@@ -1,6 +1,22 @@
 import type { SVGProps } from "react";
-/** Props shared by generated SVG icon components. */
+/**
+ * Свойства сгенерированных SVG-компонентов иконок.
+ *
+ * @remarks
+ * Расширяет стандартные атрибуты `SVGProps`, добавляя пропы для замены
+ * первичного и вторичного цвета иконки.
+ */
 export interface IIconComponentProps extends SVGProps<SVGSVGElement> {
+    /**
+     * Основной цвет иконки.
+     *
+     * Заменяет первый найденный цвет в исходном SVG.
+     */
     color?: string;
+    /**
+     * Вторичный цвет для двухцветных иконок.
+     *
+     * Заменяет второй найденный цвет в исходном SVG.
+     */
     secondaryColor?: string;
 }

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

@@ -0,0 +1,29 @@
+import type { CSSProperties, ReactNode } from "react";
+/**
+ * Свойства контейнера иконки.
+ */
+export interface IconContainerProps {
+    /** Доступное имя иконки. */
+    ariaLabel?: string;
+    /** Угол поворота иконки в градусах. */
+    deg?: number;
+    /** Высота контейнера. */
+    height?: number | string;
+    /** Размер контейнера по умолчанию. */
+    size?: number | string;
+    /** Дополнительные CSS-стили контейнера. */
+    style?: CSSProperties;
+    /** Ширина контейнера. */
+    width?: number | string;
+    /** Содержимое контейнера. */
+    children: ReactNode;
+}
+/**
+ * Универсальный контейнер для отображения иконки.
+ *
+ * @remarks
+ * Контейнер управляет размерами, поворотом и доступностью.
+ * Не зависит от способа рендера и может использоваться как
+ * при клиентском рендеринге, так и при SSR.
+ */
+export declare const IconContainer: ({ ariaLabel, children, deg, height, size, style, width, }: IconContainerProps) => import("react").JSX.Element;

package/dist/icon/Icon.container.js

@@ -0,0 +1,19 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/icons/icon/Icon.container.tsx
+var t = ({ ariaLabel: t, children: n, deg: r = 0, height: i, size: a = 24, style: o, width: s }) => /* @__PURE__ */ e("span", {
+	"aria-label": t,
+	"aria-hidden": !t || void 0,
+	role: t ? "img" : void 0,
+	style: {
+		display: "inline-flex",
+		flexShrink: 0,
+		height: i ?? a,
+		lineHeight: 0,
+		transform: r ? `rotate(${r}deg)` : void 0,
+		width: s ?? a,
+		...o
+	},
+	children: n
+});
+//#endregion
+export { t as IconContainer };

package/dist/icon/Icon.d.ts

@@ -0,0 +1,5 @@
+import type { IconProps } from "./Icon.types.js";
+export declare function Icon({ ariaLabel, color, deg, height, name: IconComponent, secondaryColor, size, style, width, }: IconProps): import("react").JSX.Element;
+export declare namespace Icon {
+    var displayName: string;
+}

package/dist/icon/Icon.js

@@ -0,0 +1,20 @@
+import { IconContainer as e } from "./Icon.container.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/icons/icon/Icon.tsx
+var n = ({ ariaLabel: n, color: r = "var(--icon-color, currentColor)", deg: i = 0, height: a, name: o, secondaryColor: s = "var(--icon-secondary-color, currentColor)", size: c = 24, style: l, width: u }) => /* @__PURE__ */ t(e, {
+	ariaLabel: n,
+	deg: i,
+	height: a,
+	size: c,
+	style: l,
+	width: u,
+	children: /* @__PURE__ */ t(o, {
+		"aria-hidden": "true",
+		color: r,
+		focusable: "false",
+		secondaryColor: s
+	})
+});
+n.displayName = "Icon";
+//#endregion
+export { n as Icon };

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

@@ -0,0 +1,59 @@
+import type { ComponentType, CSSProperties } from "react";
+import type { IIconComponentProps } from "../collection/types.js";
+/**
+ * React-компонент, представляющий иконку.
+ */
+export type TIconComponent = ComponentType<IIconComponentProps>;
+/**
+ * Свойства универсального компонента Icon.
+ */
+export interface IconProps {
+    /**
+     * Доступное название (aria-label).
+     *
+     * Без названия иконка считается декоративной.
+     */
+    ariaLabel?: string;
+    /**
+     * Основной цвет иконки.
+     */
+    color?: string;
+    /**
+     * Вторичный цвет для двухцветных иконок.
+     */
+    secondaryColor?: string;
+    /**
+     * Поворот контейнера в градусах.
+     *
+     * @default 0
+     */
+    deg?: number;
+    /**
+     * Высота контейнера.
+     *
+     * Переопределяет `size` для высоты.
+     */
+    height?: number | string;
+    /**
+     * Компонент иконки, отображаемый внутри контейнера.
+     */
+    name: TIconComponent;
+    /**
+     * Размер контейнера.
+     *
+     * Используется и для ширины, и для высоты, если они не заданы отдельно.
+     *
+     * @default 24
+     */
+    size?: number | string;
+    /**
+     * Стили контейнера.
+     */
+    style?: CSSProperties;
+    /**
+     * Ширина контейнера.
+     *
+     * Переопределяет `size` для ширины.
+     */
+    width?: number | string;
+}

package/dist/icon/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Универсальный React API для отображения иконок.
+ *
+ * @example
+ * ```tsx
+ * import { UserIcon } from "@dubium/icons/icons"
+ * import { Icon } from "@dubium/icons/icon"
+ *
+ * <Icon name={UserIcon} />
+ * ```
+ */
+export { Icon } from "./Icon.js";
+export type { IconProps, TIconComponent } from "./Icon.types.js";

package/dist/icon/index.js

@@ -0,0 +1,2 @@
+import { Icon as e } from "./Icon.js";
+export { e as Icon };

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

@@ -0,0 +1,35 @@
+import type { TEmptyIconRegistry, TIconRegistry } from "./Icon.types.js";
+import { type IconProps } from "./Icon.js";
+/**
+ * Создаёт типизированную версию Icon
+ * для кастомного registry.
+ *
+ * При этом autocomplete содержит:
+ *
+ * - все встроенные иконки @sg/icons;
+ * - все ключи TCustomIcons.
+ *
+ * @example
+ *
+ * ```ts
+ * const appIcons = {
+ *   CompanyLogo: () => import("./CompanyLogoIcon"),
+ *   SpecialDocument: () => import("./SpecialDocumentIcon"),
+ * } as const
+ *
+ * const AppIcon = createIcon<typeof appIcons>()
+ * ```
+ *
+ * После этого:
+ *
+ * ```tsx
+ * <AppIcon name="Abacus" />
+ * <AppIcon name="CompanyLogo" />
+ * ```
+ *
+ * оба варианта будут типизированы.
+ */
+export declare const createIcon: <TCustomIcons extends TIconRegistry = TEmptyIconRegistry>() => {
+    (props: IconProps<TCustomIcons>): import("react").JSX.Element;
+    displayName: string;
+};

package/dist/{spa → vite}/icon/Icon.create.js

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

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

@@ -0,0 +1,66 @@
+import { type MemoExoticComponent } from "react";
+import type { TEmptyIconRegistry, TIconName, TIconRegistry } from "./Icon.types.js";
+/**
+ * Props компонента Icon.
+ *
+ * По умолчанию `name` содержит autocomplete
+ * всех встроенных иконок @sg/icons.
+ *
+ * Если передан custom registry, его ключи также
+ * добавляются в autocomplete.
+ */
+export interface IconProps<TCustomIcons extends TIconRegistry = TEmptyIconRegistry> {
+    /**
+     * Accessible label.
+     *
+     * Если не передан, иконка считается декоративной.
+     */
+    ariaLabel?: string;
+    /**
+     * Основной цвет.
+     */
+    color?: string;
+    /**
+     * Вторичный цвет для двухцветных иконок.
+     */
+    secondaryColor?: string;
+    /**
+     * Поворот в градусах.
+     */
+    deg?: number;
+    /**
+     * Высота.
+     *
+     * Имеет приоритет над size.
+     */
+    height?: number;
+    /**
+     * Имя иконки.
+     *
+     * VS Code должен предлагать все имена,
+     * экспортируемые из collection/index.ts.
+     */
+    name: TIconName<TCustomIcons>;
+    /**
+     * Размер иконки.
+     */
+    size?: number;
+    /**
+     * Ширина.
+     *
+     * Имеет приоритет над size.
+     */
+    width?: number;
+}
+/**
+ * Базовый компонент Icon.
+ *
+ * Иконка разрешается в следующем порядке:
+ *
+ * 1. IconProvider;
+ * 2. runtime registry;
+ * 3. compile-time virtual registry.
+ */
+declare const IconComponentBase: <TCustomIcons extends TIconRegistry = TEmptyIconRegistry>({ name, size, width: propWidth, height: propHeight, color, secondaryColor, deg, ariaLabel, }: IconProps<TCustomIcons>) => import("react").JSX.Element;
+declare const MemoizedIcon: MemoExoticComponent<typeof IconComponentBase> & typeof IconComponentBase;
+export { MemoizedIcon as Icon };

package/dist/vite/icon/Icon.js

@@ -0,0 +1,79 @@
+import { useIconContext as e } from "../provider/useIconContext.js";
+import { getRuntimeIconLoader as t, getRuntimeIconsVersion as n, subscribeRuntimeIcons as r } from "../runtime/IconRuntime.registry.js";
+import { jsx as i } from "react/jsx-runtime";
+import { memo as a, useEffect as o, useMemo as s, useState as c, useSyncExternalStore as l } from "react";
+import { iconRegistry as u } from "virtual:@dubium/icons-registry";
+//#region src/icons/vite/icon/Icon.tsx
+var d = /* @__PURE__ */ new Map(), f = a(({ name: a, size: f = 24, width: p, height: m, color: h = "var(--icon-color, currentColor)", secondaryColor: g = "var(--icon-secondary-color, currentColor)", deg: _ = 0, ariaLabel: v }) => {
+	let { icons: y } = e(), b = String(a);
+	l(r, n, n);
+	let x = y[a] ?? t(b) ?? u[b], [S, C] = c(() => {
+		if (!x) return null;
+		let e = d.get(x);
+		return e ? {
+			Component: e,
+			loader: x
+		} : null;
+	}), [w, T] = c(!1), E = p ?? f, D = m ?? f, O = s(() => ({
+		alignItems: "center",
+		display: "inline-flex",
+		height: D,
+		justifyContent: "center",
+		transform: `rotate(${_}deg)`,
+		width: E
+	}), [
+		D,
+		E,
+		_
+	]);
+	o(() => {
+		let e = !1;
+		if (!x) return T(!1), C(null), console.warn(`Иконка "${b}" не найдена в IconProvider, runtime registry или compile-time registry.`), () => {
+			e = !0;
+		};
+		let t = d.get(x);
+		return t ? (T(!1), C({
+			Component: t,
+			loader: x
+		}), () => {
+			e = !0;
+		}) : (T(!0), C(null), x().then((t) => {
+			if (e) return;
+			let n = t.default;
+			d.set(x, n), C({
+				Component: n,
+				loader: x
+			});
+		}).catch((t) => {
+			e || (console.error(`Ошибка загрузки иконки "${b}":`, t), C(null));
+		}).finally(() => {
+			e || T(!1);
+		}), () => {
+			e = !0;
+		});
+	}, [x, b]);
+	let k = S !== null && S.loader === x;
+	if (w || !k) return /* @__PURE__ */ i("div", {
+		"aria-hidden": "true",
+		style: {
+			...O,
+			visibility: "hidden"
+		}
+	});
+	let A = S.Component;
+	return /* @__PURE__ */ i("div", {
+		"aria-hidden": !v || void 0,
+		"aria-label": v,
+		role: v ? "img" : void 0,
+		style: O,
+		children: /* @__PURE__ */ i(A, {
+			"aria-hidden": "true",
+			color: h,
+			focusable: "false",
+			secondaryColor: g
+		})
+	});
+});
+f.displayName = "Icon";
+//#endregion
+export { f as Icon };