refactor: enforce frontend view model boundaries

packages/icons/src/svg/PortfolioIcon.tsx

@@ -0,0 +1,43 @@
+import type { FC } from "react";
+
+import type { IconProps } from "../types";
+
+import { bindIconAnimation } from "../bind-icon-animation";
+import classes from "../navigation.module.css";
+
+const PortfolioIcon: FC<IconProps> = (props) => {
+	const { size = "24", ...svgProps } = props;
+
+	return (
+		<svg
+			aria-hidden="true"
+			fill="none"
+			focusable="false"
+			height={size}
+			ref={bindIconAnimation}
+			stroke="currentColor"
+			strokeLinecap="round"
+			strokeLinejoin="round"
+			strokeWidth="1.5"
+			viewBox="0 0 24 24"
+			width={size}
+			{...svgProps}
+		>
+			<path d="M3 10v9h18v-9" />
+
+			<path className={classes.portfolioHandle} d="M8 6V4h8v2" />
+
+			<path
+				className={classes.portfolioLid}
+				d="M3 10V8a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v2H3Zm6 0v3h6v-3"
+			/>
+
+			<path
+				className={classes.portfolioRuble}
+				d="M10 18v-7h3a2 2 0 0 1 0 4H9m0 1.5h4"
+			/>
+		</svg>
+	);
+};
+
+export { PortfolioIcon };