@layerfi/components 0.1.132-alpha.4 → 0.1.132

package/dist/cjs/index.cjs

@@ -278,7 +278,7 @@ var getIntlLocale = (locale) => {
 };
 var package_default = {
 	name: "@layerfi/components",
-	version: "0.1.132-alpha.4",
+	version: "0.1.132",
 	description: "Layer React Components",
 	main: "dist/cjs/index.cjs",
 	module: "dist/esm/index.mjs",
@@ -1678,6 +1678,8 @@ var linkedAccounts_default$1 = {
 		"ledger_balance": "Ledger balance",
 		"link_bank_accounts_and_credit_cards": "Link your bank accounts and credit cards",
 		"link_more_accounts_any_time": "You can link more accounts at any time from the Bank Transactions section",
+		"link_your_bank_accounts": "Link your bank accounts",
+		"link_your_bank_accounts_description": "Linking your bank accounts allows us to load your bank transactions and automatically categorize them.",
 		"linked_accounts": "Linked Accounts",
 		"loading_accounts": "Loading Your Accounts...",
 		"may_take_few_minutes": "This may take a few minutes",
@@ -1825,6 +1827,8 @@ var taxEstimates_default$1 = {
 		"no_tax_estimates_summary": "Get started with your tax estimates",
 		"no_tax_estimates_summary_description": "Start by importing and categorizing your bank transactions",
 		"no_tax_payments_to_display": "There are no tax payments to display.",
+		"tax_due_is_negative_or_zero": "No taxes owed this year",
+		"tax_due_is_negative_or_zero_description": "Your deductible losses exceed your income for this period, bringing your tax liability to zero.",
 		"tax_payments": "No tax payments found"
 	},
 	error: {
@@ -1839,6 +1843,7 @@ var taxEstimates_default$1 = {
 		"retrieve_tax_profile": "We couldn’t retrieve your tax profile. Please check your connection and try again.",
 		"while_loading_tax_details": "An error occurred while loading your tax details. Please check your connection and try again.",
 		"while_loading_tax_estimates": "An error occurred while loading your tax estimates. Please check your connection and try again.",
+		"while_loading_tax_estimates_summary": "An error occurred while loading your tax summary. Please check your connection and try again.",
 		"while_loading_tax_payments": "An error occurred while loading your tax payments. Please check your connection and try again.",
 		"while_loading_tax_summary": "An error occurred while loading your tax summary. Please check your connection and try again."
 	},
@@ -1882,6 +1887,8 @@ var taxEstimates_default$1 = {
 		"quarter_taxes": "{{quarterLabel}} taxes",
 		"remaining_balance": "Remaining Balance",
 		"rolled_over_from_previous_quarter": "Rolled Over From Previous Quarter",
+		"set_up_your_tax_profile": "Set up your tax profile",
+		"set_up_your_tax_profile_description": "Configuring your tax profile allows us to provide you with tax estimates and avoid any surprises come tax time.",
 		"single": "Single",
 		"state": "State",
 		"tax_details": "Tax Details",
@@ -3106,6 +3113,8 @@ var linkedAccounts_default = {
 		"ledger_balance": "Solde du grand livre",
 		"link_bank_accounts_and_credit_cards": "Liez vos comptes bancaires et vos cartes de crédit",
 		"link_more_accounts_any_time": "Vous pouvez lier d’autres comptes en tout temps à partir de la section Transactions bancaires",
+		"link_your_bank_accounts": "Liez vos comptes bancaires",
+		"link_your_bank_accounts_description": "Lier vos comptes bancaires nous permet de charger vos opérations bancaires et de les catégoriser automatiquement.",
 		"linked_accounts": "Comptes liés",
 		"loading_accounts": "Chargement de vos comptes...",
 		"may_take_few_minutes": "Cela peut prendre quelques minutes",
@@ -3253,6 +3262,8 @@ var taxEstimates_default = {
 		"no_tax_estimates_summary": "Commencez vos estimations d’impôt",
 		"no_tax_estimates_summary_description": "Commencez par importer et catégoriser vos opérations bancaires",
 		"no_tax_payments_to_display": "Il n’y a aucun paiement d’impôt à afficher.",
+		"tax_due_is_negative_or_zero": "Aucun impôt à payer cette année",
+		"tax_due_is_negative_or_zero_description": "Vos pertes déductibles dépassent votre revenu pour cette période, ce qui ramène votre impôt à payer à zéro.",
 		"tax_payments": "Aucun paiement d’impôt trouvé"
 	},
 	error: {
@@ -3267,6 +3278,7 @@ var taxEstimates_default = {
 		"retrieve_tax_profile": "Nous n’avons pas pu récupérer votre profil fiscal. Veuillez vérifier votre connexion et réessayer.",
 		"while_loading_tax_details": "Une erreur s’est produite lors du chargement de vos détails fiscaux. Veuillez vérifier votre connexion et réessayer.",
 		"while_loading_tax_estimates": "Une erreur s’est produite lors du chargement de vos estimations d’impôt. Veuillez vérifier votre connexion et réessayer.",
+		"while_loading_tax_estimates_summary": "Une erreur s'est produite lors du chargement de votre sommaire fiscal. Veuillez vérifier votre connexion et réessayer.",
 		"while_loading_tax_payments": "Une erreur s’est produite lors du chargement de vos paiements d’impôt. Veuillez vérifier votre connexion et réessayer.",
 		"while_loading_tax_summary": "Une erreur s’est produite lors du chargement de votre sommaire fiscal. Veuillez vérifier votre connexion et réessayer."
 	},
@@ -3280,7 +3292,7 @@ var taxEstimates_default = {
 		"categorization_incomplete": "Catégorisation incomplète",
 		"deductions": "Déductions",
 		"due": "Échéance",
-		"due_at": "",
+		"due_at": "Échéance le {{date}}",
 		"due_with_date": "Échéance : {{date}}",
 		"enter_amount": "Saisissez un montant",
 		"enter_area": "Saisissez la superficie",
@@ -3310,6 +3322,8 @@ var taxEstimates_default = {
 		"quarter_taxes": "Impôts du {{quarterLabel}}",
 		"remaining_balance": "Solde restant",
 		"rolled_over_from_previous_quarter": "Reporté du trimestre précédent",
+		"set_up_your_tax_profile": "Configurez votre profil fiscal",
+		"set_up_your_tax_profile_description": "La configuration de votre profil fiscal nous permet de vous fournir des estimations d'impôt et d'éviter les mauvaises surprises au moment des impôts.",
 		"single": "Célibataire",
 		"state": "État",
 		"tax_details": "Détails fiscaux",
@@ -3636,7 +3650,7 @@ var vehicles_default = {
 		"enter_vin": "Saisissez le NIV",
 		"license_plate": "Plaque d’immatriculation",
 		"make_model": "Marque et modèle",
-		"unnamed_vehicle": "",
+		"unnamed_vehicle": "Véhicule sans nom",
 		"vehicle": "Véhicule",
 		"vehicle_name_hidden_from_active_list": "{{vehicleName}} sera masqué de votre liste de véhicules actifs. Vous pourrez le réactiver en tout temps.",
 		"vehicle_name_restored_to_active_list": "{{vehicleName}} sera restauré dans votre liste de véhicules actifs et pourra être utilisé pour faire le suivi de vos déplacements.",
@@ -8030,6 +8044,9 @@ var getLeafCategories$1 = (categories) => {
 		return getLeafCategories$1(category.subCategories);
 	});
 };
+var flattenCategories$2 = (categories) => {
+	return categories.flatMap((category) => [category, ...category.subCategories ? flattenCategories$2(category.subCategories) : []]);
+};
 //#endregion
 //#region src/schemas/customer.ts
 var CustomerStatusSchema = effect.Schema.Literal("ACTIVE", "ARCHIVED");
@@ -8742,6 +8759,7 @@ var CategorizationRuleSchema = effect_index.Schema.Struct({
 	suggestion2: (0, effect_index.pipe)(effect_index.Schema.propertySignature(effect_index.Schema.NullishOr(AccountIdentifierSchema)), effect_index.Schema.fromKey("suggestion_2")),
 	suggestion3: (0, effect_index.pipe)(effect_index.Schema.propertySignature(effect_index.Schema.NullishOr(AccountIdentifierSchema)), effect_index.Schema.fromKey("suggestion_3")),
 	counterpartyFilter: (0, effect_index.pipe)(effect_index.Schema.propertySignature(effect_index.Schema.NullishOr(BankTransactionCounterpartySchema)), effect_index.Schema.fromKey("counterparty_filter")),
+	readableTransactionDescriptionFilter: (0, effect_index.pipe)(effect_index.Schema.propertySignature(effect_index.Schema.NullishOr(effect_index.Schema.String)), effect_index.Schema.fromKey("readable_transaction_description_filter")),
 	bankDirectionFilter: (0, effect_index.pipe)(effect_index.Schema.propertySignature(effect_index.Schema.NullishOr(BankDirectionFilterSchema)), effect_index.Schema.fromKey("bank_direction_filter")),
 	createdAt: (0, effect_index.pipe)(effect_index.Schema.propertySignature(effect_index.Schema.Date), effect_index.Schema.fromKey("created_at")),
 	updatedAt: (0, effect_index.pipe)(effect_index.Schema.propertySignature(effect_index.Schema.Date), effect_index.Schema.fromKey("updated_at")),
@@ -23608,10 +23626,13 @@ var getCategorizationRuleDirectionLabel = (bankDirectionFilter, t) => {
 	const entry = DIRECTION_CONFIG.find((c) => c.value === bankDirectionFilter);
 	return entry ? t(entry.i18nKey, entry.defaultValue) : t("categorizationRules:label.any_direction", "Any direction");
 };
+var getCategorizationRuleCounterpartyLabel = (rule) => {
+	var _ref, _rule$counterpartyFil, _rule$counterpartyFil2;
+	return (_ref = (_rule$counterpartyFil = (_rule$counterpartyFil2 = rule.counterpartyFilter) === null || _rule$counterpartyFil2 === void 0 ? void 0 : _rule$counterpartyFil2.name) !== null && _rule$counterpartyFil !== void 0 ? _rule$counterpartyFil : rule.readableTransactionDescriptionFilter) !== null && _ref !== void 0 ? _ref : void 0;
+};
 //#endregion
 //#region src/components/CategorizationRules/CategorizationRulesMobileList/CategorizationRulesMobileList.tsx
 var CategorizationRuleMobileListItem = ({ rule, options, onDeletePress }) => {
-	var _rule$counterpartyFil;
 	const { t } = (0, react_i18next.useTranslation)();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 		justify: "space-between",
@@ -23625,7 +23646,7 @@ var CategorizationRuleMobileListItem = ({ rule, options, onDeletePress }) => {
 				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
 					weight: "bold",
 					ellipsis: true,
-					children: (_rule$counterpartyFil = rule.counterpartyFilter) === null || _rule$counterpartyFil === void 0 ? void 0 : _rule$counterpartyFil.name
+					children: getCategorizationRuleCounterpartyLabel(rule)
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 					gap: "3xs",
@@ -23970,13 +23991,10 @@ var CategorizationRulesTable = ({ data, isLoading, isError, paginationProps, opt
 		{
 			id: CategorizationRuleColumns.Counterparty,
 			header: t("common:label.counterparty", "Counterparty"),
-			cell: (row) => {
-				var _row$original$counter;
-				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
-					ellipsis: true,
-					children: (_row$original$counter = row.original.counterpartyFilter) === null || _row$original$counter === void 0 ? void 0 : _row$original$counter.name
-				});
-			}
+			cell: (row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+				ellipsis: true,
+				children: getCategorizationRuleCounterpartyLabel(row.original)
+			})
 		},
 		{
 			id: CategorizationRuleColumns.Direction,
@@ -24067,7 +24085,7 @@ var CategorizationRulesHeader = ({ onGoBack }) => {
 };
 var resolveVariant$1 = ({ width }) => width < BREAKPOINTS.TABLET ? "Mobile" : "Desktop";
 var ResponsiveCategorizationRulesView = () => {
-	var _selectedRule$counter, _selectedRule$counter2;
+	var _ref;
 	const { t } = (0, react_i18next.useTranslation)();
 	const [selectedRule, setSelectedRule] = (0, react.useState)(null);
 	const [showDeletionConfirmationModal, setShowDeletionConfirmationModal] = (0, react.useState)(false);
@@ -24077,7 +24095,7 @@ var ResponsiveCategorizationRulesView = () => {
 	const { data: categories, isLoading: categoriesAreLoading } = useCategories({ mode: CategoriesListMode.All });
 	const options = (0, react.useMemo)(() => {
 		if (!categories) return [];
-		return getLeafCategories$1(categories);
+		return flattenCategories$2(categories);
 	}, [categories]);
 	const { data, hasMore, isLoading: rulesAreLoading, isError, size, setSize } = useListCategorizationRules({});
 	const categorizationRules = (0, react.useMemo)(() => data === null || data === void 0 ? void 0 : data.flatMap(({ data }) => data), [data]);
@@ -24123,66 +24141,69 @@ var ResponsiveCategorizationRulesView = () => {
 	]);
 	const isLoading = data === void 0 || rulesAreLoading || categoriesAreLoading;
 	const { toBankTransactionsTable } = useBankTransactionsNavigation();
+	const DesktopView = (0, react.useMemo)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BaseDetailView, {
+		slots: {
+			Header: CategorizationRulesHeader,
+			BackIcon: BackArrow
+		},
+		name: "CategorizationRulesDrawer",
+		onGoBack: toBankTransactionsTable,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CategorizationRulesTable, {
+			data: categorizationRules,
+			isLoading,
+			isError,
+			paginationProps,
+			options,
+			onDeleteRule,
+			slots: {
+				EmptyState: CategorizationRulesEmptyState,
+				ErrorState: CategorizationRulesErrorState
+			}
+		})
+	}), [
+		toBankTransactionsTable,
+		categorizationRules,
+		isLoading,
+		isError,
+		paginationProps,
+		options,
+		onDeleteRule
+	]);
+	const MobileView = (0, react.useMemo)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
+		gap: "md",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CategorizationRulesHeader, { onGoBack: toBankTransactionsTable }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CategorizationRulesMobileList, {
+			data: categorizationRules,
+			isLoading,
+			isError,
+			paginationProps,
+			options,
+			onDeleteRule,
+			slots: {
+				EmptyState: CategorizationRulesEmptyState,
+				ErrorState: CategorizationRulesErrorState
+			}
+		})]
+	}), [
+		toBankTransactionsTable,
+		categorizationRules,
+		isLoading,
+		isError,
+		paginationProps,
+		options,
+		onDeleteRule
+	]);
+	const selectedRuleCounterpartyLabel = (_ref = selectedRule && getCategorizationRuleCounterpartyLabel(selectedRule)) !== null && _ref !== void 0 ? _ref : t("bankTransactions:label.selected_counterparty", "this counterparty");
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ResponsiveComponent, {
 		resolveVariant: resolveVariant$1,
 		slots: {
-			Desktop: (0, react.useMemo)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BaseDetailView, {
-				slots: {
-					Header: CategorizationRulesHeader,
-					BackIcon: BackArrow
-				},
-				name: "CategorizationRulesDrawer",
-				onGoBack: toBankTransactionsTable,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CategorizationRulesTable, {
-					data: categorizationRules,
-					isLoading,
-					isError,
-					paginationProps,
-					options,
-					onDeleteRule,
-					slots: {
-						EmptyState: CategorizationRulesEmptyState,
-						ErrorState: CategorizationRulesErrorState
-					}
-				})
-			}), [
-				toBankTransactionsTable,
-				categorizationRules,
-				isLoading,
-				isError,
-				paginationProps,
-				options,
-				onDeleteRule
-			]),
-			Mobile: (0, react.useMemo)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
-				gap: "md",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CategorizationRulesHeader, { onGoBack: toBankTransactionsTable }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CategorizationRulesMobileList, {
-					data: categorizationRules,
-					isLoading,
-					isError,
-					paginationProps,
-					options,
-					onDeleteRule,
-					slots: {
-						EmptyState: CategorizationRulesEmptyState,
-						ErrorState: CategorizationRulesErrorState
-					}
-				})]
-			}), [
-				toBankTransactionsTable,
-				categorizationRules,
-				isLoading,
-				isError,
-				paginationProps,
-				options,
-				onDeleteRule
-			])
+			Desktop: DesktopView,
+			Mobile: MobileView
 		}
 	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BaseConfirmationModal, {
 		isOpen: showDeletionConfirmationModal,
 		onOpenChange: setShowDeletionConfirmationModal,
 		title: t("categorizationRules:prompt.delete_categorization_rule", "Delete categorization rule?"),
-		description: t("categorizationRules:label.transaction_no_longer_automatically_categorized", "Transactions will no longer automatically be categorized by this rule. Any transactions previously categorized to {{counterparty}} will not be affected.", { counterparty: (_selectedRule$counter = selectedRule === null || selectedRule === void 0 || (_selectedRule$counter2 = selectedRule.counterpartyFilter) === null || _selectedRule$counter2 === void 0 ? void 0 : _selectedRule$counter2.name) !== null && _selectedRule$counter !== void 0 ? _selectedRule$counter : t("bankTransactions:label.selected_counterparty", "this counterparty") }),
+		description: t("categorizationRules:label.transaction_no_longer_automatically_categorized", "Transactions will no longer automatically be categorized by this rule. Any transactions previously categorized to {{counterparty}} will not be affected.", { counterparty: selectedRuleCounterpartyLabel }),
 		onConfirm: archiveCategorizationRule,
 		confirmLabel: t("common:action.delete_label", "Delete"),
 		cancelLabel: t("common:action.cancel_label", "Cancel"),
@@ -27413,13 +27434,13 @@ var ProfitAndLossChartSelectionIndicator = ({ viewBox, selected }) => {
 	const boxWidth = width + 2 * margin;
 	const borderRadius = 6;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
-		className: "Layer__profit-and-loss-chart__selection-indicator",
+		className: "Layer__ProfitAndLossChart__SelectionIndicator",
 		rx: borderRadius,
 		ry: borderRadius,
 		x: x - margin,
-		y: 16,
+		y: 24,
 		width: boxWidth,
-		height: "calc(100% - 30px)"
+		height: "calc(100% - 38px)"
 	});
 };
 //#endregion
@@ -27729,7 +27750,8 @@ var transformPnLData = ({ data, compactView, formatMonthName }) => {
 var CHART_MARGINS = {
 	left: 12,
 	right: 12,
-	bottom: 12
+	bottom: 12,
+	top: 24
 };
 var ProfitAndLossChart = ({ tagFilter, hideLegend = false }) => {
 	var _getColor$hex, _getColor, _getColor$hex2, _getColor2, _getColor$hex3, _getColor3;
@@ -27803,9 +27825,9 @@ var ProfitAndLossChart = ({ tagFilter, hideLegend = false }) => {
 		activationDate
 	]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "Layer__chart-wrapper",
+		className: "Layer__ProfitAndLossChart",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(recharts.ResponsiveContainer, {
-			className: "Layer__chart-container",
+			className: "Layer__ProfitAndLossChart__Container",
 			width: "100%",
 			height: "100%",
 			onResize: (0, react.useCallback)((width) => {
@@ -27817,7 +27839,7 @@ var ProfitAndLossChart = ({ tagFilter, hideLegend = false }) => {
 				margin: CHART_MARGINS,
 				data: dataOrPlaceholderData,
 				onClick,
-				className: "Layer__profit-and-loss-chart",
+				className: "Layer__profit-and-loss-chart Layer__ProfitAndLossChart__Chart",
 				children: [
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLossChartPatternDefs, {}),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(recharts.ReferenceLine, {
@@ -27908,7 +27930,6 @@ var DetailedChart = ({ data, isLoading, interactionProps, stylingProps, slots })
 				x: x + width / 2,
 				textAnchor: "middle",
 				verticalAnchor: "middle",
-				breakAll: true,
 				maxLines: 2,
 				width: Math.max(width - 40, 0),
 				className: "Layer__DetailedChart__centerLabelTitle",
@@ -29965,7 +29986,7 @@ var SyncingBadge = () => {
 };
 //#endregion
 //#region src/components/ProfitAndLossHeader/ProfitAndLossHeader.tsx
-var ProfitAndLossHeader = ({ text, className, headingClassName, withDatePicker, withDownloadButton, withStatus = true, stringOverrides, dateSelectionMode = "full" }) => {
+var ProfitAndLossHeader = ({ text, className, headingClassName, withDatePicker, withDownloadButton, withStatus = true, stringOverrides, dateSelectionMode = "full", trailingContent }) => {
 	const { t } = (0, react_i18next.useTranslation)();
 	const { data: linkedAccounts } = useLinkedAccounts();
 	const { activePeriod } = useActiveBookkeepingPeriod();
@@ -29993,10 +30014,15 @@ var ProfitAndLossHeader = ({ text, className, headingClassName, withDatePicker,
 			]
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 			gap: "xs",
-			children: [withDatePicker && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CombinedDateRangeSelection, {
-				mode: dateSelectionMode,
-				showLabels: false
-			}), withDownloadButton && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLossDownloadButton, { stringOverrides: stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.downloadButton })]
+			align: "center",
+			children: [
+				trailingContent,
+				withDatePicker && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CombinedDateRangeSelection, {
+					mode: dateSelectionMode,
+					showLabels: false
+				}),
+				withDownloadButton && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLossDownloadButton, { stringOverrides: stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.downloadButton })
+			]
 		})]
 	});
 };
@@ -44106,8 +44132,8 @@ var ProfitAndLossOverviewDetailedCharts = ({ variant, detailedChartsStringOverri
 			label: (detailedChartsStringOverrides === null || detailedChartsStringOverrides === void 0 || (_detailedChartsString2 = detailedChartsStringOverrides.detailedChartStringOverrides) === null || _detailedChartsString2 === void 0 ? void 0 : _detailedChartsString2.expenseToggleLabel) || t("common:label.expenses", "Expenses")
 		}];
 	}, [detailedChartsStringOverrides, t]);
-	const chartsWrapperClassName = variant === "accounting" ? "Layer__accounting-overview-profit-and-loss-charts" : "Layer__bookkeeping-overview-profit-and-loss-charts";
-	const chartContainerName = variant === "accounting" ? "accounting-overview-profit-and-loss-chart" : "bookkeeping-overview-profit-and-loss-chart";
+	const chartsWrapperClassName = variant === "accounting" ? "Layer__AccountingOverview__ProfitAndLossCharts" : "Layer__BookkeepingOverview__ProfitAndLossCharts";
+	const chartContainerName = variant === "accounting" ? "AccountingOverview__ProfitAndLossChart" : "BookkeepingOverview__ProfitAndLossChart";
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
 		className: chartsWrapperClassName,
 		gap: "md",
@@ -44148,6 +44174,49 @@ var ProfitAndLossOverviewDetailedCharts = ({ variant, detailedChartsStringOverri
 	});
 };
 //#endregion
+//#region src/components/ProfitAndLossSummaryCard/PnlLegend.tsx
+var Swatch$1 = ({ className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+	className: `Layer__PnlLegend__Swatch ${className}`,
+	"aria-hidden": true
+});
+var PnlLegend = ({ direction = "row" }) => {
+	const { t } = (0, react_i18next.useTranslation)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Stack, {
+		className: "Layer__PnlLegend",
+		direction,
+		align: "start",
+		gap: direction === "row" ? "md" : "2xs",
+		pis: direction === "column" ? "md" : void 0,
+		pbe: direction === "column" ? "md" : void 0,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+				gap: "2xs",
+				align: "center",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Swatch$1, { className: "Layer__PnlLegend__Swatch--income" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+					size: "sm",
+					children: t("common:label.revenue", "Revenue")
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+				gap: "2xs",
+				align: "center",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Swatch$1, { className: "Layer__PnlLegend__Swatch--expenses" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+					size: "sm",
+					children: t("common:label.expenses", "Expenses")
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+				gap: "2xs",
+				align: "center",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Swatch$1, { className: "Layer__PnlLegend__Swatch--uncategorized" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+					size: "sm",
+					children: t("common:label.uncategorized", "Uncategorized")
+				})]
+			})
+		]
+	});
+};
+//#endregion
 //#region src/views/AccountingOverview/AccountingOverview.tsx
 var AccountingOverview = ({ title, showTitle = true, enableOnboarding = false, onboardingStepOverride = void 0, onTransactionsToReviewClick, middleBanner, chartColorsList, stringOverrides, tagFilter = void 0, slotProps }) => {
 	var _slotProps$profitAndL, _stringOverrides$prof, _stringOverrides$prof2;
@@ -44162,6 +44231,7 @@ var AccountingOverview = ({ title, showTitle = true, enableOnboarding = false, o
 		} : void 0,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(View, {
 			title: (stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.title) || title || t("overview:label.accounting_overview", "Accounting overview"),
+			viewClassName: "Layer__AccountingOverview",
 			showHeader: showTitle,
 			header: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Header$1, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HeaderRow, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HeaderCol, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GlobalMonthPicker, { truncateMonth: sizeClass === "mobile" }) }) }) }),
 			children: [
@@ -44177,11 +44247,19 @@ var AccountingOverview = ({ title, showTitle = true, enableOnboarding = false, o
 				}),
 				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Container, {
 					name: "accounting-overview-profit-and-loss",
+					className: "Layer__AccountingOverview__ProfitAndLossContainer",
 					asWidget: true,
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLoss.Header, { text: (stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.header) || t("common:label.profit_loss", "Profit & Loss") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLoss.Chart, { tagFilter: tagFilter ? {
-						key: tagFilter.tagKey,
-						values: tagFilter.tagValues
-					} : void 0 })]
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLoss.Header, {
+						text: (stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.header) || t("common:label.profit_loss", "Profit & Loss"),
+						className: "Layer__AccountingOverview__ProfitAndLossHeader",
+						trailingContent: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PnlLegend, { direction: "row" })
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLoss.Chart, {
+						tagFilter: tagFilter ? {
+							key: tagFilter.tagKey,
+							values: tagFilter.tagValues
+						} : void 0,
+						hideLegend: true
+					})]
 				}),
 				middleBanner && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Container, {
 					name: "accounting-overview-middle-banner",
@@ -44684,7 +44762,7 @@ var BookkeepingOverview = ({ title, showTitle = true, onClickReconnectAccounts,
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ProfitAndLoss, {
 		asContainer: false,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(View, {
-			viewClassName: "Layer__bookkeeping-overview--view",
+			viewClassName: "Layer__bookkeeping-overview--view Layer__BookkeepingOverview",
 			title: (stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.title) || title || t("overview:label.bookkeeping_overview", "Bookkeeping overview"),
 			header: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Header$1, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HeaderRow, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HeaderCol, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GlobalMonthPicker, { truncateMonth: sizeClass === "mobile" }) }) }) }),
 			withSidebar: width > 1100,
@@ -44721,6 +44799,7 @@ var BookkeepingOverview = ({ title, showTitle = true, onClickReconnectAccounts,
 					onClick: () => upperElementInFocus.current = false,
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Container, {
 						name: "bookkeeping-overview-profit-and-loss",
+						className: "Layer__BookkeepingOverview__ProfitAndLossContainer",
 						asWidget: true,
 						style: {
 							position: "relative",
@@ -44729,7 +44808,8 @@ var BookkeepingOverview = ({ title, showTitle = true, onClickReconnectAccounts,
 						children: [
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLoss.Header, {
 								text: (stringOverrides === null || stringOverrides === void 0 || (_stringOverrides$prof = stringOverrides.profitAndLoss) === null || _stringOverrides$prof === void 0 ? void 0 : _stringOverrides$prof.header) || t("common:label.profit_loss", "Profit & Loss"),
-								withStatus: true
+								withStatus: true,
+								trailingContent: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PnlLegend, { direction: "row" })
 							}),
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(VStack, {
 								pb: "md",
@@ -44740,7 +44820,7 @@ var BookkeepingOverview = ({ title, showTitle = true, onClickReconnectAccounts,
 									variants: profitAndLossSummariesVariants
 								})
 							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLoss.Chart, {})
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLoss.Chart, { hideLegend: true })
 						]
 					})
 				}),
@@ -46852,11 +46932,13 @@ var SummaryCard = ({ slots, children, className }) => {
 	});
 };
 //#endregion
-//#region src/hooks/utils/i18n/useGlobalMonthSubtitle.ts
-var useGlobalMonthSubtitle = () => {
+//#region src/hooks/utils/i18n/useGlobalDateFormatter.ts
+var useGlobalDateFormatter = () => {
 	const { formatDate } = useIntlFormatter();
-	const { date } = useGlobalDate({ dateSelectionMode: "month" });
-	return formatDate(date, MonthYearPattern.MonthYear);
+	const { date } = useGlobalDate();
+	return (0, react.useCallback)((format) => {
+		return formatDate(date, format);
+	}, [date, formatDate]);
 };
 //#endregion
 //#region src/components/ui/SummaryCard/ExpandSummaryCardButton.tsx
@@ -46871,9 +46953,9 @@ function ExpandSummaryCardButton({ callback, ariaLabel }) {
 }
 //#endregion
 //#region src/components/ui/SummaryCard/useSummaryCardSlots.tsx
-var useSummaryCardSlots = ({ defaultTitle, legend, interactionProps, stringOverrides }) => {
+var useSummaryCardSlots = ({ defaultTitle, legend, interactionProps, subtitleDateFormat = DateFormat.MonthYear, stringOverrides }) => {
 	const { t } = (0, react_i18next.useTranslation)();
-	const subtitle = useGlobalMonthSubtitle();
+	const formatGlobalDate = useGlobalDateFormatter();
 	const { onClickExpand } = interactionProps !== null && interactionProps !== void 0 ? interactionProps : {};
 	return (0, react.useMemo)(() => {
 		var _stringOverrides$titl;
@@ -46883,14 +46965,15 @@ var useSummaryCardSlots = ({ defaultTitle, legend, interactionProps, stringOverr
 		}) : void 0;
 		return {
 			title: (_stringOverrides$titl = stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.title) !== null && _stringOverrides$titl !== void 0 ? _stringOverrides$titl : defaultTitle,
-			subtitle,
+			subtitle: formatGlobalDate(subtitleDateFormat),
 			legend,
 			primaryAction
 		};
 	}, [
 		stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.title,
 		defaultTitle,
-		subtitle,
+		subtitleDateFormat,
+		formatGlobalDate,
 		legend,
 		onClickExpand,
 		t
@@ -47005,55 +47088,13 @@ var MileageTrackingSummary = ({ stringOverrides, interactionProps } = {}) => {
 		slots: useSummaryCardSlots({
 			defaultTitle: t("mileageTracking:label.mileage_tracking", "Mileage Tracking"),
 			interactionProps,
-			stringOverrides
+			stringOverrides,
+			subtitleDateFormat: DateFormat.Year
 		}),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Content$1, {})
 	});
 };
 //#endregion
-//#region src/components/ProfitAndLossSummaryCard/PnlLegend.tsx
-var Swatch$1 = ({ className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-	className: `Layer__PnlLegend__Swatch ${className}`,
-	"aria-hidden": true
-});
-var PnlLegend = ({ direction = "row" }) => {
-	const { t } = (0, react_i18next.useTranslation)();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Stack, {
-		className: "Layer__PnlLegend",
-		direction,
-		align: "start",
-		gap: direction === "row" ? "md" : "2xs",
-		pis: direction === "column" ? "md" : void 0,
-		pbe: direction === "column" ? "md" : void 0,
-		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
-				gap: "2xs",
-				align: "center",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Swatch$1, { className: "Layer__PnlLegend__Swatch--income" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
-					size: "sm",
-					children: t("common:label.revenue", "Revenue")
-				})]
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
-				gap: "2xs",
-				align: "center",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Swatch$1, { className: "Layer__PnlLegend__Swatch--expenses" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
-					size: "sm",
-					children: t("common:label.expenses", "Expenses")
-				})]
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
-				gap: "2xs",
-				align: "center",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Swatch$1, { className: "Layer__PnlLegend__Swatch--uncategorized" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
-					size: "sm",
-					children: t("common:label.uncategorized", "Uncategorized")
-				})]
-			})
-		]
-	});
-};
-//#endregion
 //#region src/components/ProfitAndLossSummaryCard/ProfitAndLossSummaryCard.tsx
 var ProfitAndLossSummaryCard = ({ interactionProps, stringOverrides, className }) => {
 	const { t } = (0, react_i18next.useTranslation)();
@@ -47235,33 +47276,39 @@ var getOnboardingBannerState = ({ isLoading, hasLinkedAccounts, hasSavedTaxProfi
 var NoBankAccountsLinkedBanner = () => {
 	const { addConnection } = (0, react.useContext)(LinkedAccountsContext);
 	const { isMobile } = useSizeClass();
+	const { t } = (0, react_i18next.useTranslation)();
 	const handleLinkBankAccounts = (0, react.useCallback)(() => {
 		addConnection("PLAID");
 	}, [addConnection]);
+	const Icon = isMobile ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Info, { size: 16 });
+	const title = t("linkedAccounts:label.link_your_bank_accounts", "Link your bank accounts");
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Banner, {
-		title: "Link your bank accounts",
-		description: "Linking your bank accounts allows us to load your bank transactions and automatically categorize them.",
+		title,
+		description: t("linkedAccounts:label.link_your_bank_accounts_description", "Linking your bank accounts allows us to load your bank transactions and automatically categorize them."),
 		slots: {
-			Icon: isMobile ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Info, { size: 16 }),
+			Icon,
 			Button: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button$1, {
 				onPress: handleLinkBankAccounts,
 				variant: "outlined-light",
-				children: "Link your bank accounts"
+				children: title
 			})
 		}
 	});
 };
 var NoTaxProfileBanner = ({ onSetupTaxProfile }) => {
 	const { isMobile } = useSizeClass();
+	const { t } = (0, react_i18next.useTranslation)();
+	const Icon = isMobile ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Info, { size: 16 });
+	const title = t("taxEstimates:label.set_up_your_tax_profile", "Set up your tax profile");
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Banner, {
-		title: "Set up your tax profile",
-		description: "Configuring your tax profile allows us to provide you with tax estimates and avoid any surprises come tax time.",
+		title,
+		description: t("taxEstimates:label.set_up_your_tax_profile_description", "Configuring your tax profile allows us to provide you with tax estimates and avoid any surprises come tax time."),
 		slots: {
-			Icon: isMobile ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Info, { size: 16 }),
+			Icon,
 			Button: onSetupTaxProfile ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button$1, {
 				onPress: onSetupTaxProfile,
 				variant: "outlined-light",
-				children: "Setup your tax profile"
+				children: title
 			}) : null
 		}
 	});
@@ -47617,8 +47664,8 @@ var TaxEstimatesSummaryCardNegativeOrZero = () => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataState, {
 		className: "Layer__TaxEstimatesSummaryCard__DataState Layer__data-state--reset",
 		status: DataStateStatus.info,
-		title: t("taxEstimates:error.tax_due_is_negative_or_zero", "No taxes owed this year"),
-		description: t("taxEstimates:error.tax_due_is_negative_or_zero_description", "Your deductible losses exceed your income for this period, bringing your tax liability to zero.")
+		title: t("taxEstimates:empty.tax_due_is_negative_or_zero", "No taxes owed this year"),
+		description: t("taxEstimates:empty.tax_due_is_negative_or_zero_description", "Your deductible losses exceed your income for this period, bringing your tax liability to zero.")
 	});
 };
 //#endregion
@@ -47879,7 +47926,8 @@ var TaxEstimatesSummaryCard = ({ mode = TaxEstimatesSummaryCardMode.PieChart, in
 	const slots = useSummaryCardSlots({
 		defaultTitle,
 		interactionProps,
-		stringOverrides
+		stringOverrides,
+		subtitleDateFormat: DateFormat.Year
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SummaryCard, {
 		className: (0, classnames.default)("Layer__TaxEstimatesSummaryCard", isSummaryCardLayout && "Layer__TaxEstimatesSummaryCard--summaryCard"),