Spending insights
A period switcher, four stat tiles, cash flow, a monthly budget dial and a spending breakdown.
Preview
Mirrored is the same English content laid out right to left: it separates a mirroring bug from a translation one.
EnglishMirroredArabic
DesktopMobile
LTR →
Installation
Add the block
npx ritla add spending-insightsAlso works with shadcn:
npx shadcn@latest add @ritla/spending-insights
Built from
The Ritla UI components this block is made of. Each is installed with it.
Arabic and RTL notes
Mirrors
- The switcher, tiles and cards follow the reading direction.
- The budget dial fills from the start side (anticlockwise in Arabic), and the cash flow months run with the page.
Does not mirror
- The tiles' mini charts keep time left to right: they show a shape, not dates.
- Numerals
- Totals, axis values and shares follow the numerals setting.