refactor: tighten types and reuse instrument UI

packages/ui/src/EntryCard/EntryCard.module.css

@@ -93,3 +93,13 @@
 		transition: none;
 	}
 }
+
+.row[data-wrap] p {
+	white-space: normal;
+	overflow-wrap: anywhere;
+}
+@media (min-width: 36em) {
+	.row[data-wrap] {
+		grid-template-columns: auto minmax(0, 1fr) minmax(0, 40%);
+	}
+}

packages/ui/src/EntryCard/EntryCard.stories.tsx

@@ -39,3 +39,5 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 
 export const LongContentAndFallback: Story = {};
+
+export const WrappedOperation: Story = { args: { value: "−123 456 789 012 345 678,90 ₽", wrap: true } };

packages/ui/src/EntryCard/EntryCard.tsx

@@ -18,6 +18,7 @@ type EntryCardProps = {
 		| "positive";
 	value: string;
 	valueLabel: string;
+	wrap?: boolean;
 };
 
 const EntryCard: FC<EntryCardProps> = (props) => {
@@ -31,7 +32,12 @@ const EntryCard: FC<EntryCardProps> = (props) => {
 	const valueLabelClass = `${classes[props.tone]} ${props.actions ? classes.valueLabel : ""}`;
 
 	return (
-		<Paper className={classes.row} style={surfaceStyle} withBorder>
+		<Paper
+			className={classes.row}
+			data-wrap={props.wrap || undefined}
+			style={surfaceStyle}
+			withBorder
+		>
 			<Avatar
 				alt=""
 				aria-hidden="true"

packages/ui/tsconfig.json

@@ -1,13 +1,10 @@
 {
+	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
-		"target": "ES2023",
 		"lib": ["ES2023", "DOM"],
 		"module": "ESNext",
 		"moduleResolution": "Bundler",
 		"resolveJsonModule": true,
-		"strict": true,
-		"skipLibCheck": true,
-		"verbatimModuleSyntax": true,
 		"declaration": true,
 		"emitDeclarationOnly": true,
 		"rootDir": "src",