@layerfi/components 0.1.128-alpha → 0.1.128-alpha.1

package/dist/cjs/index.cjs

@@ -175,6 +175,10 @@ let Direction = /* @__PURE__ */ function(Direction$1) {
 	Direction$1["DEBIT"] = "DEBIT";
 	return Direction$1;
 }({});
+const ApiEnumErrorType = {
+	SpecifiedIdNotFound: "SpecifiedIdNotFound",
+	SpecifiedBadRequest: "SpecifiedBadRequest"
+};
 var APIError = class APIError extends Error {
 	constructor(message, code, messages) {
 		super(message);
@@ -221,7 +225,7 @@ const getIntlLocale = (locale) => {
 	return isSupportedLocale(locale) ? locale : DEFAULT_LOCALE;
 };
 const name = "@layerfi/components";
-const version$1 = "0.1.128-alpha";
+const version$1 = "0.1.128-alpha.1";
 const description = "Layer React Components";
 const main = "dist/cjs/index.cjs";
 const module$1 = "dist/esm/index.mjs";
@@ -1990,6 +1994,7 @@ const error$23 = {
 	"archive_service": "Could not archive this service. Please try again.",
 	"cancel_timer": "Failed to cancel timer. Please try again.",
 	"complete_timer": "Failed to complete timer. Please try again.",
+	"complete_timer_stale": "This timer was already completed or cancelled. Reload the page.",
 	"create_service": "Failed to create service. Please try again.",
 	"delete_entry": "Failed to delete time entry. Please check your connection and try again.",
 	"load_active_timer": "Failed to load active timer. Please check your connection and try again.",
@@ -1998,6 +2003,7 @@ const error$23 = {
 	"load_services": "Failed to load services.",
 	"load_summary": "Failed to load time tracking summary",
 	"start_timer": "Failed to start timer. Please try again.",
+	"start_timer_already_active": "A timer is already running. Please reload the page.",
 	"unarchive_service": "Could not restore this service. Please try again.",
 	"update_service": "Could not save this service. Please try again.",
 	"update_timer": "Failed to update timer. Please try again."
@@ -2020,7 +2026,7 @@ const label$30 = {
 	"invoiced": "Invoiced",
 	"less_than_one_minute": "< 1 min",
 	"memo": "Memo",
-	"no_activity_breakdown": "No activity breakdown available for this period.",
+	"no_activity_breakdown": "No activity during this period",
 	"no_services": "No services available",
 	"other": "Other",
 	"select_customer": "Select a customer (optional)",
@@ -2028,7 +2034,8 @@ const label$30 = {
 	"select_service": "Select a service",
 	"service": "Service",
 	"time_entries": "Time Entries",
-	"time_tracking": "Time Tracking"
+	"time_tracking": "Time Tracking",
+	"zero_minutes": "0 min"
 };
 const prompt$15 = {
 	"delete_entry": "Delete this time entry?",
@@ -2041,6 +2048,7 @@ const services$1 = {
 	"archive_confirm_description": "This service will be removed from your active list. Time entries that used it are unchanged.",
 	"archive_confirm_title": "Archive this service?",
 	"archived": "Archived",
+	"archived_service": "{{name}} (Archived)",
 	"cancel": "Cancel",
 	"create_service_input_value": "Create service \"{{inputValue}}\"",
 	"hourly_rate_optional": "Default hourly rate (optional)",
@@ -3551,6 +3559,7 @@ const error$4 = {
 	"archive_service": "Impossible d'archiver ce service. Veuillez réessayer.",
 	"cancel_timer": "Impossible d'annuler le minuteur. Veuillez réessayer.",
 	"complete_timer": "Impossible de terminer le minuteur. Veuillez réessayer.",
+	"complete_timer_stale": "",
 	"create_service": "Impossible de créer le service. Veuillez réessayer.",
 	"delete_entry": "Impossible de supprimer l'entrée de temps. Veuillez vérifier votre connexion et réessayer.",
 	"load_active_timer": "Impossible de charger le minuteur actif. Veuillez vérifier votre connexion et réessayer.",
@@ -3559,6 +3568,7 @@ const error$4 = {
 	"load_services": "Impossible de charger les services.",
 	"load_summary": "Impossible de charger le sommaire du suivi du temps",
 	"start_timer": "Impossible de démarrer le minuteur. Veuillez réessayer.",
+	"start_timer_already_active": "",
 	"unarchive_service": "Impossible de restaurer ce service. Veuillez réessayer.",
 	"update_service": "Impossible d'enregistrer ce service. Veuillez réessayer.",
 	"update_timer": "Impossible de mettre à jour le minuteur. Veuillez réessayer."
@@ -3581,7 +3591,7 @@ const label$5 = {
 	"invoiced": "Facturé",
 	"less_than_one_minute": "",
 	"memo": "Note",
-	"no_activity_breakdown": "Aucune répartition des activités n'est disponible pour cette période.",
+	"no_activity_breakdown": "",
 	"no_services": "Aucun service disponible",
 	"other": "Autre",
 	"select_customer": "Sélectionner un client (facultatif)",
@@ -3589,7 +3599,8 @@ const label$5 = {
 	"select_service": "Sélectionner un service",
 	"service": "Service",
 	"time_entries": "Entrées de temps",
-	"time_tracking": ""
+	"time_tracking": "",
+	"zero_minutes": ""
 };
 const prompt$3 = {
 	"delete_entry": "Supprimer cette entrée de temps?",
@@ -3602,6 +3613,7 @@ const services = {
 	"archive_confirm_description": "Ce service sera retiré de votre liste active. Les entrées de temps qui l'utilisaient ne sont pas modifiées.",
 	"archive_confirm_title": "Archiver ce service?",
 	"archived": "Archivés",
+	"archived_service": "",
 	"cancel": "Annuler",
 	"create_service_input_value": "",
 	"hourly_rate_optional": "Taux horaire par défaut (facultatif)",
@@ -3962,11 +3974,11 @@ function _objectWithoutProperties(e, t) {
 	}
 	return i;
 }
-var _excluded$113 = ["_locale"];
+var _excluded$115 = ["_locale"];
 var createLocalizedFetcher = (fetcher) => {
 	if (!fetcher) return null;
 	return (_ref, ...rest) => {
-		let { _locale: _locale$1 } = _ref, key = _objectWithoutProperties(_ref, _excluded$113);
+		let { _locale: _locale$1 } = _ref, key = _objectWithoutProperties(_ref, _excluded$115);
 		setLocaleHeader(_locale$1);
 		return fetcher(key, ...rest);
 	};
@@ -3981,7 +3993,7 @@ const useLocalizedKey = () => {
 		return _objectSpread2(_objectSpread2({}, key), {}, { _locale: locale });
 	};
 };
-var _excluded$112 = ["trigger"];
+var _excluded$114 = ["trigger"];
 var UNLINK_BANK_ACCOUNT_TAG_KEY = "#unlink-bank-account";
 var unlinkBankAccount = del(({ businessId, bankAccountId }) => `/v1/businesses/${businessId}/bank-accounts/${bankAccountId}`);
 function buildKey$87({ access_token: accessToken, apiUrl, businessId }) {
@@ -4004,7 +4016,7 @@ function useUnlinkBankAccount() {
 	})), ({ accessToken, apiUrl: apiUrl$1, businessId: businessId$1 }, { arg: bankAccountId }) => unlinkBankAccount(apiUrl$1, accessToken, { params: {
 		businessId: businessId$1,
 		bankAccountId
-	} }), { revalidate: false }), { trigger: rawTrigger } = _useSWRMutation, rest = _objectWithoutProperties(_useSWRMutation, _excluded$112);
+	} }), { revalidate: false }), { trigger: rawTrigger } = _useSWRMutation, rest = _objectWithoutProperties(_useSWRMutation, _excluded$114);
 	const triggerRef = (0, react.useRef)(rawTrigger);
 	triggerRef.current = rawTrigger;
 	return _objectSpread2({ trigger: (0, react.useCallback)((bankAccountId) => triggerRef.current(bankAccountId), []) }, rest);
@@ -7357,14 +7369,14 @@ const useBankTransactionsFilters = ({ scope, monthlyView, applyGlobalDateRange,
 		dateFilterMode
 	]);
 };
-var _excluded$111 = ["size"];
+var _excluded$113 = ["size"];
 var Bell = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$111)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$113)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -7381,14 +7393,14 @@ var Bell = (_ref) => {
 	}));
 };
 var Bell_default = Bell;
-var _excluded$110 = ["size"];
+var _excluded$112 = ["size"];
 var CreditCard = (_ref) => {
 	let { size = 12 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 12 12",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$110)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$112)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -7405,14 +7417,14 @@ var CreditCard = (_ref) => {
 	}));
 };
 var CreditCard_default = CreditCard;
-var _excluded$109 = ["size"];
+var _excluded$111 = ["size"];
 var Folder = (_ref) => {
 	let { size = 12 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 12 12",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$109)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$111)), {}, {
 		width: size,
 		height: size,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -7424,14 +7436,14 @@ var Folder = (_ref) => {
 	}));
 };
 var Folder_default = Folder;
-var _excluded$108 = ["size"];
-var Link$1 = (_ref) => {
+var _excluded$110 = ["size"];
+var Link$2 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$108)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$110)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -7447,7 +7459,7 @@ var Link$1 = (_ref) => {
 		})]
 	}));
 };
-var Link_default = Link$1;
+var Link_default = Link$2;
 var PlaidIcon = () => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
 		src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAhCAYAAAC4JqlRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAQDSURBVHgB7VbpK65bFP+9XJTMJGPGDIVIpjIln2S4SIr4AxSOIZFwPxA+HUf5rhAZb3xQylCUizKLD+I1ROYpZcq+e63u+9S5t573XN1z3nvr/or97GVba+3fmrYGf8DBwSHx/f09VH7a4DvD2Nj414uLi1X61tAvOzu7z0KIT/iB0Gg0bdfX12UaafyTNP4ZBoB0okxja2u7L789YRhoyQEBA8IIBsZ/0wF7e3tYWVkpe2tra8hQ4iP46VsOWVpaIiYmBrGxsYiKikJERASWl5eRnZ0NU1NT9PX1ISwsDCsrK5iZmcHi4iKmpqbw+vqqV7feJCwsLERbW5uyX19fx/7+PjIyMrC5uQkTExP4+/tjZGQEvr6+CA4OVs6Wlpaiq6sLqiAH1H4GBgaEDqmpqYq8qalJkdfX1yvyrKwscXd3x/L+/n6hT79eBnZ3d3F6egobGxtInUhPT8f9/T3fWHfb7e1tpKSk8JmxsTGWPT4+wsnJCV5eXqoEqCYhUSo7JXp6epCWlkadC5OTkxgaGmLjFRUVKC8vR2BgIEZHR9k4OUlnJXOcnO7u7vhwCKqqqpjKxMRE3tOqQ3Nzs3KutbWVZU9PT0IywbKEhASW1dbWqoZAlQHKbEJISAiXXnt7O+/Pz8+Rn58PDw8PeHp6Ii8vDzLuMDMzQ0tLC988Li6Oz/r5+X2cARcXF7G1tcU3OTk54bWyslJIx8Tx8bGQ00wcHR2Jw8NDERoaKsrKyviMzBleZcUIZ2dnVQb0VkF0dLR4fn5mhbLeFXlBQYESDsnAX6rm5eWF/1efflUHXF1d+RY6BuSDRRQXF/NtdTe/ubnhb5JVV1d/xYCsDuHm5vZxB2QTYUU1NTVCxprDQU6QUR3tFA5y4OzsTKHdx8dHyOrgfW9v78eTcGdnh9e5uTlOMukI3t7euN47OztxcHAArVaL7u5uODo68lnJEGRuYHWVX1zcntWgOguothsbG5GcnIyHhwd0dHRA3hS3t7eoq6vD5eUlzM3NIalnQ9R0qPVSs4qPj2cd09PTaib0zwLq+9QJLSwseE/KZQgwPj6OgIAAlm1sbPBsIGbIaWpGxJisIm5matA7jicmJtgQ1XZJSQlTTsplbJUzw8PDzAr9raioiLtfUFAQT0R90DuOZ2dnkZOTwyOZDK2trWFvbw+ZmZk8AygnGhoaIBMS3t7eX01Dyh19+KY3IY3cpKQkREZGQrZjZfbn5ubyzB8cHER4eDiWlpawsLDAhufn5zlv/hEH/gzdZKRQEIgdephcXV3h7+L/V/G/wgEtDAetkUymLzAQyLaxfMX8JtspPeqj8QMhn3dfZEf9RaMTyNIKNTIy+hnfGXKa3splVXbOGdr/DtMw0L76HoUPAAAAAElFTkSuQmCC",
@@ -7455,14 +7467,14 @@ var PlaidIcon = () => {
 	});
 };
 var PlaidIcon_default = PlaidIcon;
-var _excluded$107 = ["size"];
+var _excluded$109 = ["size"];
 var Sunrise = (_ref) => {
 	let { size = 12 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 12 12",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$107)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$109)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -7539,7 +7551,7 @@ var ChevronRight$2 = (_ref) => {
 	}) }));
 };
 var ChevronRight_default = ChevronRight$2;
-var _excluded$106 = [
+var _excluded$108 = [
 	"className",
 	"children",
 	"icon",
@@ -7551,7 +7563,7 @@ var _excluded$106 = [
 	"download"
 ];
 const IconButton = (_ref) => {
-	let { className, children: _children, icon, active, withBorder = false, href, target, rel, download } = _ref, props = _objectWithoutProperties(_ref, _excluded$106);
+	let { className, children: _children, icon, active, withBorder = false, href, target, rel, download } = _ref, props = _objectWithoutProperties(_ref, _excluded$108);
 	const baseClassName$1 = (0, classnames.default)("Layer__icon-btn", `Layer__icon-btn--${active ? "active" : "inactive"}`, withBorder && "Layer__icon-btn--border", className);
 	if (href) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
 		href,
@@ -7635,17 +7647,17 @@ const useTooltip = ({ initialOpen = false, placement = "top", open: controlledOp
 		data
 	]);
 };
-var _excluded$105 = ["children"], _excluded2$14 = ["children", "asChild"], _excluded3$6 = ["className", "width"];
+var _excluded$107 = ["children"], _excluded2$15 = ["children", "asChild"], _excluded3$6 = ["className", "width"];
 const DeprecatedTooltip = (_ref) => {
 	let { children } = _ref;
-	const tooltip = useTooltip(_objectWithoutProperties(_ref, _excluded$105));
+	const tooltip = useTooltip(_objectWithoutProperties(_ref, _excluded$107));
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipContext.Provider, {
 		value: tooltip,
 		children
 	});
 };
 const DeprecatedTooltipTrigger = (0, react.forwardRef)(function TooltipTrigger$1(_ref2, propRef) {
-	let { children, asChild = false } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$14);
+	let { children, asChild = false } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$15);
 	const context = useTooltipContext();
 	const childrenRef = (0, react.isValidElement)(children) && "ref" in children ? children.ref : null;
 	const ref = (0, __floating_ui_react.useMergeRefs)([
@@ -7676,7 +7688,7 @@ const DeprecatedTooltipContent = (0, react.forwardRef)(function TooltipContent$1
 		children: props.children
 	}) })) });
 });
-var _excluded$104 = [
+var _excluded$106 = [
 	"as",
 	"className",
 	"children",
@@ -7687,7 +7699,7 @@ var _excluded$104 = [
 	"status",
 	"pb",
 	"invertColor"
-], _excluded2$13 = [
+], _excluded2$14 = [
 	"as",
 	"className",
 	"children",
@@ -7713,7 +7725,7 @@ let TextUseTooltip = /* @__PURE__ */ function(TextUseTooltip$1) {
 	return TextUseTooltip$1;
 }({});
 const Text = (_ref) => {
-	let { as: Component$1 = "p", className, children, size = TextSize.md, weight = TextWeight.normal, withDeprecatedTooltip: withTooltip, ellipsis, status, pb, invertColor } = _ref, props = _objectWithoutProperties(_ref, _excluded$104);
+	let { as: Component$1 = "p", className, children, size = TextSize.md, weight = TextWeight.normal, withDeprecatedTooltip: withTooltip, ellipsis, status, pb, invertColor } = _ref, props = _objectWithoutProperties(_ref, _excluded$106);
 	const dataProperties = toDataProperties({
 		status,
 		ellipsis,
@@ -7734,7 +7746,7 @@ const Text = (_ref) => {
 	}));
 };
 const DeprecatedTextWithTooltip = (_ref2) => {
-	let { as: Component$1 = "p", className, children, size: _size = TextSize.md, weight: _weight = TextWeight.normal, withDeprecatedTooltip: _withTooltip = TextUseTooltip.whenTruncated, tooltipOptions } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$13);
+	let { as: Component$1 = "p", className, children, size: _size = TextSize.md, weight: _weight = TextWeight.normal, withDeprecatedTooltip: _withTooltip = TextUseTooltip.whenTruncated, tooltipOptions } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$14);
 	const textElementRef = (0, react.useRef)();
 	const compareSize = () => {
 		if (textElementRef.current) setHover(textElementRef.current.children[0].scrollWidth > textElementRef.current.children[0].clientWidth);
@@ -7836,14 +7848,14 @@ const Badge = ({ icon, onClick, children, tooltip, size = BadgeSize.MEDIUM, vari
 	});
 	return content;
 };
-var _excluded$103 = ["size"];
+var _excluded$105 = ["size"];
 var Loader$1 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$103)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$105)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -7899,7 +7911,7 @@ var Loader$1 = (_ref) => {
 	}));
 };
 var Loader_default = Loader$1;
-var _excluded$102 = [
+var _excluded$104 = [
 	"className",
 	"children",
 	"variant",
@@ -7919,7 +7931,7 @@ let ButtonVariant = /* @__PURE__ */ function(ButtonVariant$1) {
 	return ButtonVariant$1;
 }({});
 const Button$1 = (_ref) => {
-	let { className, children, variant = ButtonVariant.primary, leftIcon, rightIcon, iconOnly, iconAsPrimary = false, justify = "center", fullWidth, isProcessing, tooltip } = _ref, props = _objectWithoutProperties(_ref, _excluded$102);
+	let { className, children, variant = ButtonVariant.primary, leftIcon, rightIcon, iconOnly, iconAsPrimary = false, justify = "center", fullWidth, isProcessing, tooltip } = _ref, props = _objectWithoutProperties(_ref, _excluded$104);
 	const buttonRef = (0, react.useRef)(null);
 	let justifyContent = "center";
 	if (justify) justifyContent = justify;
@@ -7966,14 +7978,14 @@ const Button$1 = (_ref) => {
 		}) : content
 	}));
 };
-var _excluded$101 = ["size"];
+var _excluded$103 = ["size"];
 var AlertOctagon = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 18 18",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$101)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$103)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -7999,14 +8011,14 @@ var AlertOctagon = (_ref) => {
 	}));
 };
 var AlertOctagon_default = AlertOctagon;
-var _excluded$100 = ["size"];
+var _excluded$102 = ["size"];
 var CheckCircle$2 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 18 18",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$100)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$102)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -8023,14 +8035,14 @@ var CheckCircle$2 = (_ref) => {
 	}));
 };
 var CheckCircle_default = CheckCircle$2;
-var _excluded$99 = ["size"];
+var _excluded$101 = ["size"];
 var RefreshCcw$1 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 18 18",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$99)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$101)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -8618,7 +8630,7 @@ function BulkSelectionStoreProvider({ children }) {
 		children
 	});
 }
-var _excluded$98 = [
+var _excluded$100 = [
 	"align",
 	"children",
 	"className",
@@ -8636,7 +8648,7 @@ var _excluded$98 = [
 ];
 var CLASS_NAME$11 = "Layer__Stack";
 const Stack = (0, react.forwardRef)(function Stack$2(_ref, ref) {
-	let { align, children, className, direction, gap, justify, overflow, pb, pbs, pbe, pi, pis, pie, fluid } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$98);
+	let { align, children, className, direction, gap, justify, overflow, pb, pbs, pbe, pi, pis, pie, fluid } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$100);
 	const dataProperties = toDataProperties({
 		align,
 		direction,
@@ -8746,11 +8758,11 @@ function translationKey(key, defaultValue$1, ns) {
 }
 const toLocalDateString = (date) => (0, date_fns.formatISO)(date.valueOf(), { representation: "date" });
 function getDueDifference(dueDate) {
-	const today$4 = /* @__PURE__ */ new Date();
-	today$4.setHours(0, 0, 0, 0);
+	const today$5 = /* @__PURE__ */ new Date();
+	today$5.setHours(0, 0, 0, 0);
 	const normalizedDue = new Date(dueDate);
 	normalizedDue.setHours(0, 0, 0, 0);
-	return (0, date_fns.differenceInDays)(normalizedDue, today$4);
+	return (0, date_fns.differenceInDays)(normalizedDue, today$5);
 }
 const convertDateToZonedDateTime = (date) => (0, __internationalized_date.fromDate)(date, (0, __internationalized_date.getLocalTimeZone)());
 const formatCalendarDate = (date, formatDate$1) => {
@@ -8935,7 +8947,7 @@ function useSizeClass() {
 		isDesktop: sizeClass === "desktop"
 	};
 }
-var _excluded$97 = ["children"], _excluded2$12 = [
+var _excluded$99 = ["children"], _excluded2$13 = [
 	"children",
 	"asChild",
 	"wordBreak"
@@ -8946,14 +8958,14 @@ var _excluded$97 = ["children"], _excluded2$12 = [
 ];
 const Tooltip$1 = (_ref) => {
 	let { children } = _ref;
-	const tooltip = useTooltip(_objectWithoutProperties(_ref, _excluded$97));
+	const tooltip = useTooltip(_objectWithoutProperties(_ref, _excluded$99));
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipContext.Provider, {
 		value: tooltip,
 		children
 	});
 };
 const TooltipTrigger = (0, react.forwardRef)(function TooltipTrigger$1(_ref2, propRef) {
-	let { children, asChild = false, wordBreak } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$12);
+	let { children, asChild = false, wordBreak } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$13);
 	const context = useTooltipContext();
 	const childrenRef = (0, react.isValidElement)(children) && "ref" in children ? children.ref : null;
 	const ref = (0, __floating_ui_react.useMergeRefs)([
@@ -9041,7 +9053,7 @@ function useTruncationDetection(elementRef, options = {
 	}, [checkTruncation]);
 	return isTruncated;
 }
-var _excluded$96 = [
+var _excluded$98 = [
 	"align",
 	"children",
 	"ellipsis",
@@ -9056,7 +9068,7 @@ var _excluded$96 = [
 	"weight"
 ];
 function splitTextProps(props) {
-	const { align, children, ellipsis, nonAria, noWrap, pb, pbe, pbs, size, status, variant, weight } = props, restProps = _objectWithoutProperties(props, _excluded$96);
+	const { align, children, ellipsis, nonAria, noWrap, pb, pbe, pbs, size, status, variant, weight } = props, restProps = _objectWithoutProperties(props, _excluded$98);
 	return {
 		children,
 		dataProperties: toDataProperties({
@@ -9218,7 +9230,7 @@ function withRenderProp(renderProp, callback) {
 	if (typeof renderProp === "function") return renderProp;
 	return callback(renderProp);
 }
-var _excluded$95 = [
+var _excluded$97 = [
 	"children",
 	"ellipsis",
 	"icon",
@@ -9246,7 +9258,7 @@ function ButtonTransparentContent({ children }) {
 	});
 }
 var Button = (0, react.forwardRef)((_ref, ref) => {
-	let { children, ellipsis, icon, inset, size = "md", variant = "solid", fullWidth = false, flex = false } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$95);
+	let { children, ellipsis, icon, inset, size = "md", variant = "solid", fullWidth = false, flex = false } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$97);
 	const { isPending = false } = restProps;
 	const dataProperties = toDataProperties({
 		ellipsis,
@@ -9267,10 +9279,10 @@ var Button = (0, react.forwardRef)((_ref, ref) => {
 	}));
 });
 Button.displayName = "Button";
-var _excluded$94 = ["one", "other"];
+var _excluded$96 = ["one", "other"];
 const tPlural = (translate, key, _ref) => {
 	let { one, other } = _ref;
-	return translate(key, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$94)), {}, {
+	return translate(key, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$96)), {}, {
 		defaultValue_one: one,
 		defaultValue_other: other
 	}));
@@ -10436,7 +10448,7 @@ const useVirtualKeyboardHeight = () => {
 	}, []);
 	return keyboardHeight;
 };
-var _excluded$93 = ["variant"], _excluded2$11 = [
+var _excluded$95 = ["variant"], _excluded2$12 = [
 	"variant",
 	"children",
 	"slots",
@@ -10446,7 +10458,7 @@ var _excluded$93 = ["variant"], _excluded2$11 = [
 ];
 var MODAL_OVERLAY_CLASS_NAME = `Layer__Portal Layer__ModalOverlay`;
 var ModalOverlay = (0, react.forwardRef)((_ref, ref) => {
-	let { variant } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$93);
+	let { variant } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$95);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.ModalOverlay, _objectSpread2(_objectSpread2(_objectSpread2({}, toDataProperties({ variant })), restProps), {}, {
 		className: MODAL_OVERLAY_CLASS_NAME,
 		ref
@@ -10480,7 +10492,7 @@ var MobileDrawerKeyboardSpacer = () => {
 };
 var DIALOG_CLASS_NAME = "Layer__Dialog";
 var Dialog$3 = (0, react.forwardRef)((_ref2, ref) => {
-	let { variant = "center", children, slots, isEntering, isExiting, fixedHeight } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$11);
+	let { variant = "center", children, slots, isEntering, isExiting, fixedHeight } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$12);
 	const dataProperties = toDataProperties({
 		variant,
 		entering: isEntering,
@@ -10548,7 +10560,7 @@ function Drawer({ isOpen, onOpenChange, size = "md", flexBlock, flexInline, chil
 		})
 	});
 }
-var _excluded$92 = [
+var _excluded$94 = [
 	"align",
 	"pie",
 	"pbe",
@@ -10560,7 +10572,7 @@ var _excluded$92 = [
 ];
 var HEADING_CLASS_NAME = "Layer__UI__Heading";
 var Heading = (0, react.forwardRef)((_ref, ref) => {
-	let { align, pie, pbe, size, variant, weight, ellipsis, className } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$92);
+	let { align, pie, pbe, size, variant, weight, ellipsis, className } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$94);
 	const dataProperties = toDataProperties({
 		pbe,
 		pie,
@@ -10644,14 +10656,14 @@ function ModalActions({ children }) {
 		children
 	});
 }
-var _excluded$91 = ["size"];
+var _excluded$93 = ["size"];
 var AlertCircle$1 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 18 18",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$91)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$93)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -10677,14 +10689,14 @@ var AlertCircle$1 = (_ref) => {
 	}));
 };
 var AlertCircle_default = AlertCircle$1;
-var _excluded$90 = ["size"];
+var _excluded$92 = ["size"];
 var Save$6 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$90)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$92)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -10710,7 +10722,7 @@ var Save$6 = (_ref) => {
 	}));
 };
 var Save_default = Save$6;
-var _excluded$89 = [
+var _excluded$91 = [
 	"className",
 	"processing",
 	"disabled",
@@ -10718,7 +10730,7 @@ var _excluded$89 = [
 	"children"
 ];
 const RetryButton = (_ref) => {
-	let { className, processing, disabled, error: error$38, children } = _ref, props = _objectWithoutProperties(_ref, _excluded$89);
+	let { className, processing, disabled, error: error$38, children } = _ref, props = _objectWithoutProperties(_ref, _excluded$91);
 	const baseClassName$1 = (0, classnames.default)("Layer__retry-btn", processing ? "Layer__btn--processing" : "", className);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button$1, _objectSpread2(_objectSpread2({}, props), {}, {
 		className: baseClassName$1,
@@ -10730,7 +10742,7 @@ const RetryButton = (_ref) => {
 		children
 	}));
 };
-var _excluded$88 = [
+var _excluded$90 = [
 	"active",
 	"className",
 	"processing",
@@ -10767,7 +10779,7 @@ var buildRightIcon = ({ processing, error: error$38, action: action$44, noIcon }
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Save_default, { size: 16 });
 };
 const SubmitButton = (_ref) => {
-	let { active, className, processing, disabled, error: error$38, children, action: action$44 = SubmitAction.SAVE, noIcon, variant = ButtonVariant.primary, withRetry, iconAsPrimary = true } = _ref, props = _objectWithoutProperties(_ref, _excluded$88);
+	let { active, className, processing, disabled, error: error$38, children, action: action$44 = SubmitAction.SAVE, noIcon, variant = ButtonVariant.primary, withRetry, iconAsPrimary = true } = _ref, props = _objectWithoutProperties(_ref, _excluded$90);
 	const { t } = (0, react_i18next.useTranslation)();
 	const baseClassName$1 = (0, classnames.default)(active ? "Layer__btn--active" : "", className);
 	if (withRetry && error$38) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RetryButton, _objectSpread2(_objectSpread2({}, props), {}, {
@@ -10790,7 +10802,7 @@ const SubmitButton = (_ref) => {
 		children
 	}));
 };
-var _excluded$87 = [
+var _excluded$89 = [
 	"isOpen",
 	"onOpenChange",
 	"useDrawer"
@@ -10856,7 +10868,7 @@ var BaseConfirmationModalContent = (0, react.memo)(function BaseConfirmationModa
 	});
 });
 function BaseConfirmationModal(_ref) {
-	let { isOpen, onOpenChange, useDrawer = false } = _ref, contentProps = _objectWithoutProperties(_ref, _excluded$87);
+	let { isOpen, onOpenChange, useDrawer = false } = _ref, contentProps = _objectWithoutProperties(_ref, _excluded$89);
 	if (useDrawer) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Drawer, {
 		flexBlock: true,
 		isOpen,
@@ -10909,14 +10921,14 @@ const COMBO_BOX_CLASS_NAMES = {
 	MULTI_VALUE: "Layer__ComboBoxMultiValue",
 	MULTI_VALUE_LABEL: "Layer__ComboBoxMultiValueLabel"
 };
-var _excluded$86 = ["size"];
+var _excluded$88 = ["size"];
 var Check$4 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 18 18",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$86)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$88)), {}, {
 		width: size,
 		height: size,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -10928,14 +10940,14 @@ var Check$4 = (_ref) => {
 	}));
 };
 var Check_default = Check$4;
-var _excluded$85 = ["size"];
+var _excluded$87 = ["size"];
 var ChevronDown$1 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 18 18",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$85)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$87)), {}, {
 		width: size,
 		height: size,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -10947,14 +10959,14 @@ var ChevronDown$1 = (_ref) => {
 	}));
 };
 var ChevronDown_default = ChevronDown$1;
-var _excluded$84 = ["size"];
+var _excluded$86 = ["size"];
 var X$1 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$84)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$86)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -10971,10 +10983,10 @@ var X$1 = (_ref) => {
 	}));
 };
 var X_default = X$1;
-var _excluded$83 = ["children"], _excluded2$10 = ["children"], _excluded3$4 = ["children"], _excluded4$3 = ["children"], _excluded5$2 = ["children"], _excluded6$2 = ["children"], _excluded7 = ["children"], _excluded8 = ["children"];
+var _excluded$85 = ["children"], _excluded2$11 = ["children"], _excluded3$4 = ["children"], _excluded4$3 = ["children"], _excluded5$2 = ["children"], _excluded6$2 = ["children"], _excluded7 = ["children"], _excluded8 = ["children"];
 function buildCustomClearIndicator() {
 	return function CustomClearIndicator(_ref) {
-		let { children } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$83);
+		let { children } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$85);
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_select.components.ClearIndicator, _objectSpread2(_objectSpread2({}, restProps), {}, {
 			className: COMBO_BOX_CLASS_NAMES.CLEAR_INDICATOR,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(X_default, { size: 16 })
@@ -10983,7 +10995,7 @@ function buildCustomClearIndicator() {
 }
 function buildCustomDropdownIndicator() {
 	return function CustomDropdownIndicator(_ref2) {
-		let { children } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$10);
+		let { children } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$11);
 		const { isDisabled } = restProps;
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_select.components.DropdownIndicator, _objectSpread2(_objectSpread2({}, restProps), {}, {
 			className: COMBO_BOX_CLASS_NAMES.DROPDOWN_INDICATOR,
@@ -11180,7 +11192,7 @@ function useCommonComboBoxProps({ className, options, groups, onInputValueChange
 		styles
 	]);
 }
-var _excluded$82 = [
+var _excluded$84 = [
 	"className",
 	"slots",
 	"isError",
@@ -11188,7 +11200,7 @@ var _excluded$82 = [
 	"onSelectedValueChange"
 ];
 function ComboBox(_ref) {
-	let { className, slots, isError, selectedValue, onSelectedValueChange } = _ref, props = _objectWithoutProperties(_ref, _excluded$82);
+	let { className, slots, isError, selectedValue, onSelectedValueChange } = _ref, props = _objectWithoutProperties(_ref, _excluded$84);
 	const commonSelectProps = useCommonComboBoxProps(_objectSpread2({
 		className,
 		slots,
@@ -11207,13 +11219,13 @@ function ComboBox(_ref) {
 		})]
 	});
 }
-var _excluded$81 = [
+var _excluded$83 = [
 	"amount",
 	"displayPlusSign",
 	"className"
 ];
 var MoneySpan = (0, react.forwardRef)((_ref, ref) => {
-	let { amount, displayPlusSign, className } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$81);
+	let { amount, displayPlusSign, className } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$83);
 	const { formatCurrencyFromCents: formatCurrencyFromCents$1 } = useIntlFormatter();
 	const formattedAmount = formatCurrencyFromCents$1(amount, { signDisplay: displayPlusSign ? "always" : "auto" });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, _objectSpread2(_objectSpread2({}, restProps), {}, {
@@ -11530,14 +11542,14 @@ const getDefaultSelectedCategoryForBankTransaction = (bankTransaction, ignoreSug
 	if (hasSuggestions(bankTransaction.categorization_flow)) return convertApiCategorizationToCategoryOrSplitAsOption(bankTransaction.categorization_flow.suggestions[0]);
 	return null;
 };
-var _excluded$80 = ["size"];
+var _excluded$82 = ["size"];
 var MinimizeTwo = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$80)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$82)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -11569,14 +11581,14 @@ var MinimizeTwo = (_ref) => {
 	}));
 };
 var MinimizeTwo_default = MinimizeTwo;
-var _excluded$79 = ["size"];
+var _excluded$81 = ["size"];
 var Scissors = (_ref) => {
 	let { size = 11 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 11 11",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$79)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$81)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -11996,7 +12008,7 @@ var toActionableListOption = (opt) => {
 		value: opt
 	};
 };
-var _excluded$78 = [
+var _excluded$80 = [
 	"actionCount",
 	"className",
 	"slots",
@@ -12004,7 +12016,7 @@ var _excluded$78 = [
 ];
 var INPUT_GROUP_CLASS_NAME = "Layer__UI__InputGroup";
 const InputGroup$1 = (0, react.forwardRef)(function InputGroup$2(_ref, ref) {
-	let { actionCount, className, slots, children } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$78);
+	let { actionCount, className, slots, children } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$80);
 	const combinedClassName = (0, classnames.default)(INPUT_GROUP_CLASS_NAME, className);
 	const dataProperties = toDataProperties({ "action-count": actionCount });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Group, _objectSpread2(_objectSpread2(_objectSpread2({}, restProps), dataProperties), {}, {
@@ -12013,10 +12025,10 @@ const InputGroup$1 = (0, react.forwardRef)(function InputGroup$2(_ref, ref) {
 		children
 	}));
 });
-var _excluded$77 = ["placeholder", "isDisabled"];
+var _excluded$79 = ["placeholder", "isDisabled"];
 var CLASS_NAME$8 = "Layer__MinimalSearchField";
 function MinimalSearchField(_ref) {
-	let { placeholder, isDisabled } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$77);
+	let { placeholder, isDisabled } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$79);
 	const { t } = (0, react_i18next.useTranslation)();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_aria_components.SearchField, _objectSpread2(_objectSpread2({}, restProps), {}, {
 		isDisabled,
@@ -12034,7 +12046,7 @@ function MinimalSearchField(_ref) {
 		})]
 	}));
 }
-var _excluded$76 = [
+var _excluded$78 = [
 	"slot",
 	"className",
 	"label",
@@ -12042,7 +12054,7 @@ var _excluded$76 = [
 ];
 var CLASS_NAME$7 = "Layer__SearchField";
 function SearchField(_ref) {
-	let { slot = "search", className, label: label$50, isDisabled } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$76);
+	let { slot = "search", className, label: label$50, isDisabled } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$78);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(InputGroup$1, {
 		slot,
 		className: (0, classnames.default)(CLASS_NAME$7, className),
@@ -12548,14 +12560,14 @@ const BankTransactionsBulkActions = ({ isMobileView = false, slotProps }) => {
 		] })
 	}) });
 };
-var _excluded$75 = ["size"];
+var _excluded$77 = ["size"];
 var DownloadCloud = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$75)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$77)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -12581,14 +12593,14 @@ var DownloadCloud = (_ref) => {
 	}));
 };
 var DownloadCloud_default = DownloadCloud;
-var _excluded$74 = ["size"];
+var _excluded$76 = ["size"];
 var UploadCloud = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 18 18",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$74)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$76)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -12834,7 +12846,7 @@ function useCustomAccountParseCsv() {
 		file
 	}).then(({ data: data$1 }) => data$1), { revalidate: false });
 }
-var _excluded$73 = [
+var _excluded$75 = [
 	"className",
 	"slots",
 	"isError",
@@ -12847,7 +12859,7 @@ var _excluded$73 = [
 ];
 var returnTrue = () => true;
 function CreatableComboBox(_ref) {
-	let { className, slots, isError, selectedValue, onSelectedValueChange, onCreateOption, formatCreateLabel: formatCreateLabel$3, createOptionPosition = "first", isValidNewOption = returnTrue } = _ref, props = _objectWithoutProperties(_ref, _excluded$73);
+	let { className, slots, isError, selectedValue, onSelectedValueChange, onCreateOption, formatCreateLabel: formatCreateLabel$3, createOptionPosition = "first", isValidNewOption = returnTrue } = _ref, props = _objectWithoutProperties(_ref, _excluded$75);
 	const commonSelectProps = useCommonComboBoxProps(_objectSpread2({
 		className,
 		slots,
@@ -12888,14 +12900,14 @@ const CopyTemplateHeadersButtonGroup = ({ headers, className }) => {
 		}, key))
 	});
 };
-var _excluded$72 = ["size"];
+var _excluded$74 = ["size"];
 var CloseIcon = (_ref) => {
 	let { size = 12 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 12 12",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$72)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$74)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -13126,7 +13138,7 @@ function useCreateCustomAccount() {
 		return Reflect.get(target, prop);
 	} });
 }
-var _excluded$71 = ["children", "className"], _excluded2$9 = [
+var _excluded$73 = ["children", "className"], _excluded2$10 = [
 	"children",
 	"inline",
 	"textarea",
@@ -13135,7 +13147,7 @@ var _excluded$71 = ["children", "className"], _excluded2$9 = [
 var FORM_CLASS_NAME = "Layer__UI__Form";
 const Form = (0, react.forwardRef)(function Form$1(_ref, ref) {
 	let { children, className } = _ref;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Form, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$71)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Form, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$73)), {}, {
 		className: (0, classnames.default)(FORM_CLASS_NAME, className),
 		ref,
 		children
@@ -13143,7 +13155,7 @@ const Form = (0, react.forwardRef)(function Form$1(_ref, ref) {
 });
 var TEXT_FIELD_CLASS_NAME = "Layer__UI__TextField";
 const TextField = (0, react.forwardRef)(function TextField$1(_ref2, ref) {
-	let { children, inline, textarea, className } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$9);
+	let { children, inline, textarea, className } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$10);
 	const dataProperties = toDataProperties({
 		inline,
 		textarea
@@ -13342,10 +13354,10 @@ function useBigDecimalInput({ value, onChange, onBlur, mode, maxValue, maxDecima
 		onPaste
 	};
 }
-var _excluded$70 = ["inset", "placement"];
+var _excluded$72 = ["inset", "placement"];
 var INPUT_CLASS_NAME = "Layer__UI__Input";
 const Input$1 = (0, react.forwardRef)(function Input$2(_ref, ref) {
-	let { inset, placement } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$70);
+	let { inset, placement } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$72);
 	const dataProperties = toDataProperties({
 		inset,
 		placement
@@ -13355,7 +13367,7 @@ const Input$1 = (0, react.forwardRef)(function Input$2(_ref, ref) {
 		ref
 	}));
 });
-var _excluded$69 = [
+var _excluded$71 = [
 	"mode",
 	"allowNegative",
 	"maxValue",
@@ -13369,7 +13381,7 @@ var DEFAULT_MAX_VALUE$1 = effect.BigDecimal.fromBigInt(BigInt(1e7));
 var DEFAULT_MIN_DECIMAL_PLACES$1 = 0;
 var DEFAULT_MAX_DECIMAL_PLACES$1 = 3;
 function FormBigDecimalField(_ref) {
-	let { mode = "decimal", allowNegative = false, maxValue = mode === "percent" ? BIG_DECIMAL_ONE : DEFAULT_MAX_VALUE$1, minDecimalPlaces = mode === "currency" ? 2 : DEFAULT_MIN_DECIMAL_PLACES$1, maxDecimalPlaces = mode === "currency" ? 2 : DEFAULT_MAX_DECIMAL_PLACES$1, slots, placeholder, allowEmpty } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$69);
+	let { mode = "decimal", allowNegative = false, maxValue = mode === "percent" ? BIG_DECIMAL_ONE : DEFAULT_MAX_VALUE$1, minDecimalPlaces = mode === "currency" ? 2 : DEFAULT_MIN_DECIMAL_PLACES$1, maxDecimalPlaces = mode === "currency" ? 2 : DEFAULT_MAX_DECIMAL_PLACES$1, slots, placeholder, allowEmpty } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$71);
 	const { name: name$1, state: state$14, handleChange, handleBlur } = useFieldContext();
 	const { value } = state$14;
 	const { inputValue, onInputChange, onInputBlur, onBeforeInput, onPaste } = useBigDecimalInput({
@@ -13402,13 +13414,13 @@ function FormBigDecimalField(_ref) {
 		})
 	}));
 }
-var _excluded$68 = [
+var _excluded$70 = [
 	"children",
 	"className",
 	"variant",
 	"size",
 	"isIndeterminate"
-], _excluded2$8 = ["tooltip"];
+], _excluded2$9 = ["tooltip"];
 var CLASS_NAME$6 = "Layer__Checkbox";
 var CHECK_SIZE = {
 	sm: 12,
@@ -13416,7 +13428,7 @@ var CHECK_SIZE = {
 	lg: 16
 };
 function Checkbox(_ref) {
-	let { children, className, variant = "default", size = "sm", isIndeterminate } = _ref, props = _objectWithoutProperties(_ref, _excluded$68);
+	let { children, className, variant = "default", size = "sm", isIndeterminate } = _ref, props = _objectWithoutProperties(_ref, _excluded$70);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Checkbox, _objectSpread2(_objectSpread2(_objectSpread2({}, (0, react.useMemo)(() => toDataProperties({
 		size,
 		variant,
@@ -13435,7 +13447,7 @@ function Checkbox(_ref) {
 	}));
 }
 function CheckboxWithTooltip(_ref2) {
-	let { tooltip } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$8);
+	let { tooltip } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$9);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		className: "Layer__checkbox-wrapper",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DeprecatedTooltip, {
@@ -13475,15 +13487,15 @@ function FormCheckboxField({ label: label$50, className, inline = false, showLab
 		children: label$50
 	}) }));
 }
-var _excluded$67 = [
+var _excluded$69 = [
 	"inline",
 	"className",
 	"isReadOnly"
-], _excluded2$7 = ["inset", "pointerEvents"], _excluded3$3 = ["isReadOnly"], _excluded4$2 = ["className"];
+], _excluded2$8 = ["inset", "pointerEvents"], _excluded3$3 = ["isReadOnly"], _excluded4$2 = ["className"];
 const DATE_PICKER_CLASS_NAME = "Layer__UI__DatePicker";
 var DATE_FIELD_CLASS_NAME = "Layer__UI__DateField";
 const DateField = (0, react.forwardRef)(function DateField$1(_ref, ref) {
-	let { inline, className, isReadOnly } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$67);
+	let { inline, className, isReadOnly } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$69);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.DateField, _objectSpread2(_objectSpread2(_objectSpread2({}, toDataProperties({
 		inline,
 		readonly: isReadOnly
@@ -13495,7 +13507,7 @@ const DateField = (0, react.forwardRef)(function DateField$1(_ref, ref) {
 });
 var DATE_INPUT_CLASS_NAME = "Layer__UI__DateInput";
 const DateInput = (0, react.forwardRef)(function DateInput$1(_ref2, ref) {
-	let { inset, pointerEvents } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$7);
+	let { inset, pointerEvents } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$8);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.DateInput, _objectSpread2(_objectSpread2(_objectSpread2({}, toDataProperties({
 		inset,
 		"pointer-events": pointerEvents
@@ -13570,10 +13582,10 @@ function FormDateField({ label: label$50, className, inline = false, showLabel =
 		shouldShowErrorMessage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldError, { children: errorMessage })
 	] }));
 }
-var _excluded$66 = ["className", "isReadOnly"], _excluded2$6 = ["className"], _excluded3$2 = ["className"], _excluded4$1 = ["className", "size"], _excluded5$1 = ["className"], _excluded6$1 = ["className", "size"];
+var _excluded$68 = ["className", "isReadOnly"], _excluded2$7 = ["className"], _excluded3$2 = ["className"], _excluded4$1 = ["className", "size"], _excluded5$1 = ["className"], _excluded6$1 = ["className", "size"];
 var CALENDAR_CLASS_NAME = "Layer__UI__Calendar";
 const Calendar$1 = (0, react.forwardRef)(function Calendar$2(_ref, ref) {
-	let { className, isReadOnly } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$66);
+	let { className, isReadOnly } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$68);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Calendar, _objectSpread2(_objectSpread2(_objectSpread2({}, toDataProperties({ readonly: isReadOnly })), restProps), {}, {
 		isReadOnly,
 		className: (0, classnames.default)(CALENDAR_CLASS_NAME, className),
@@ -13583,7 +13595,7 @@ const Calendar$1 = (0, react.forwardRef)(function Calendar$2(_ref, ref) {
 var CALENDAR_GRID_CLASS_NAME = "Layer__UI__CalendarGrid";
 const CalendarGrid = (0, react.forwardRef)(function CalendarGrid$1(_ref2, ref) {
 	let { className } = _ref2;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.CalendarGrid, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref2, _excluded2$6)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.CalendarGrid, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref2, _excluded2$7)), {}, {
 		className: (0, classnames.default)(CALENDAR_GRID_CLASS_NAME, className),
 		ref
 	}));
@@ -13712,10 +13724,10 @@ const DatePickerInput = ({ errorText, variant, onClick, isReadOnly }) => {
 		})]
 	});
 };
-var _excluded$65 = ["flexInline"];
+var _excluded$67 = ["flexInline"];
 var POPOVER_CLASS_NAMES = `Layer__Portal Layer__Popover`;
 const Popover$2 = (0, react.forwardRef)(function Popover$3(_ref, ref) {
-	let { flexInline = false } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$65);
+	let { flexInline = false } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$67);
 	const dataProperties = toDataProperties({ "flex-inline": flexInline });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Popover, _objectSpread2(_objectSpread2(_objectSpread2({}, restProps), dataProperties), {}, {
 		className: POPOVER_CLASS_NAMES,
@@ -13835,7 +13847,7 @@ const fromNonRecursiveBigDecimal = (nrbd) => {
 const nrbdEquals = (a, b) => {
 	return effect.BigDecimal.equals(fromNonRecursiveBigDecimal(a), fromNonRecursiveBigDecimal(b));
 };
-var _excluded$64 = [
+var _excluded$66 = [
 	"mode",
 	"allowNegative",
 	"maxValue",
@@ -13849,7 +13861,7 @@ var DEFAULT_MAX_VALUE = effect.BigDecimal.fromBigInt(BigInt(1e7));
 var DEFAULT_MIN_DECIMAL_PLACES = 0;
 var DEFAULT_MAX_DECIMAL_PLACES = 3;
 function FormNonRecursiveBigDecimalField(_ref) {
-	let { mode = "decimal", allowNegative = false, maxValue = mode === "percent" ? BIG_DECIMAL_ONE : DEFAULT_MAX_VALUE, minDecimalPlaces = mode === "currency" ? 2 : DEFAULT_MIN_DECIMAL_PLACES, maxDecimalPlaces = mode === "currency" ? 2 : DEFAULT_MAX_DECIMAL_PLACES, slots, placeholder, allowEmpty } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$64);
+	let { mode = "decimal", allowNegative = false, maxValue = mode === "percent" ? BIG_DECIMAL_ONE : DEFAULT_MAX_VALUE, minDecimalPlaces = mode === "currency" ? 2 : DEFAULT_MIN_DECIMAL_PLACES, maxDecimalPlaces = mode === "currency" ? 2 : DEFAULT_MAX_DECIMAL_PLACES, slots, placeholder, allowEmpty } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$66);
 	const { name: name$1, state: state$14, handleChange, handleBlur } = useFieldContext();
 	const { value: nrbdValue } = state$14;
 	const { inputValue, onInputChange, onInputBlur, onBeforeInput, onPaste } = useBigDecimalInput({
@@ -13884,14 +13896,14 @@ function FormNonRecursiveBigDecimalField(_ref) {
 		})
 	}));
 }
-var _excluded$63 = [
+var _excluded$65 = [
 	"inline",
 	"className",
 	"isReadOnly"
 ];
 var NUMBER_FIELD_CLASS_NAME = "Layer__UI__NumberField";
 const NumberField = (0, react.forwardRef)(function NumberField$1(_ref, ref) {
-	let { inline, className, isReadOnly } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$63);
+	let { inline, className, isReadOnly } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$65);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.NumberField, _objectSpread2(_objectSpread2(_objectSpread2({ step: 1 }, toDataProperties({
 		inline,
 		readonly: isReadOnly
@@ -13938,17 +13950,17 @@ function FormNumberField({ label: label$50, className, inline = false, showLabel
 		shouldShowErrorMessage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldError, { children: errorMessage })
 	] }));
 }
-var _excluded$62 = [
+var _excluded$64 = [
 	"children",
 	"className",
 	"onChange"
-], _excluded2$5 = ["children", "className"];
+], _excluded2$6 = ["children", "className"];
 var RADIO_GROUP_CLASS_NAME = "Layer__RadioGroup";
 var RADIO_CLASS_NAME = "Layer__Radio";
 var INDICATOR_SIZE = 10;
 function RadioGroup(_ref) {
 	let { children, className, onChange } = _ref;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.RadioGroup, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$62)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.RadioGroup, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$64)), {}, {
 		onChange,
 		className: (0, classnames.default)(RADIO_GROUP_CLASS_NAME, className),
 		children
@@ -13956,7 +13968,7 @@ function RadioGroup(_ref) {
 }
 function Radio(_ref2) {
 	let { children, className } = _ref2;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Radio, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref2, _excluded2$5)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Radio, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref2, _excluded2$6)), {}, {
 		className: (0, classnames.default)(RADIO_CLASS_NAME, className),
 		children: withRenderProp(children, (node) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			slot: "radio",
@@ -14057,11 +14069,11 @@ function FormRadioGroupYesNoField({ label: label$50, className, inline = false,
 		}), shouldShowErrorMessage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldError, { children: errorMessage })]
 	})] }));
 }
-var _excluded$61 = ["children", "className"];
+var _excluded$63 = ["children", "className"];
 var SWITCH_CLASS_NAME = "Layer__UI__Switch";
 const Switch = (0, react.forwardRef)((_ref, ref) => {
 	let { children, className } = _ref;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Switch, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$61)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Switch, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$63)), {}, {
 		className: (0, classnames.default)(SWITCH_CLASS_NAME, className),
 		ref,
 		children: withRenderProp(children, (node) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { slot: "indicator" }), node] }))
@@ -14091,19 +14103,19 @@ function FormSwitchField({ label: label$50, slots, className, inline = false, sh
 		})]
 	}) }));
 }
-var _excluded$60 = ["resize"];
+var _excluded$62 = ["resize"];
 var TEXTAREA_CLASS_NAME = "Layer__UI__TextArea";
 const TextArea = (0, react.forwardRef)(function TextArea$1(_ref, ref) {
-	let { resize = "none" } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$60);
+	let { resize = "none" } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$62);
 	const dataProperties = toDataProperties({ resize });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.TextArea, _objectSpread2(_objectSpread2(_objectSpread2({}, restProps), dataProperties), {}, {
 		className: TEXTAREA_CLASS_NAME,
 		ref
 	}));
 });
-var _excluded$59 = ["placeholder"];
+var _excluded$61 = ["placeholder"];
 function FormTextAreaField(_ref) {
-	let { placeholder } = _ref, props = _objectWithoutProperties(_ref, _excluded$59);
+	let { placeholder } = _ref, props = _objectWithoutProperties(_ref, _excluded$61);
 	const { name: name$1, state: state$14, handleChange, handleBlur } = useFieldContext();
 	const { value } = state$14;
 	const onChange = (0, react.useCallback)((e) => {
@@ -14122,9 +14134,9 @@ function FormTextAreaField(_ref) {
 		})
 	}));
 }
-var _excluded$58 = ["placeholder"];
+var _excluded$60 = ["placeholder"];
 function FormTextField(_ref) {
-	let { placeholder } = _ref, props = _objectWithoutProperties(_ref, _excluded$58);
+	let { placeholder } = _ref, props = _objectWithoutProperties(_ref, _excluded$60);
 	const { name: name$1, state: state$14, handleChange, handleBlur } = useFieldContext();
 	const { value } = state$14;
 	const onChange = (0, react.useCallback)((e) => {
@@ -14221,14 +14233,14 @@ const useCustomAccountForm = ({ onSuccess }) => {
 		isFormValid: (0, __tanstack_react_form.useStore)(form.store, (state$14) => state$14.isValid)
 	};
 };
-var _excluded$57 = [
+var _excluded$59 = [
 	"className",
 	"isInvalid",
 	"errorMessage",
 	"leftText"
 ];
 const Input = (_ref) => {
-	let { className, isInvalid, errorMessage, leftText } = _ref, props = _objectWithoutProperties(_ref, _excluded$57);
+	let { className, isInvalid, errorMessage, leftText } = _ref, props = _objectWithoutProperties(_ref, _excluded$59);
 	const baseClassName$1 = (0, classnames.default)("Layer__input", isInvalid ? "Layer__input--error" : "", leftText ? "Layer__input--with-left-text" : "", className);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DeprecatedTooltip, {
 		disabled: !isInvalid || !errorMessage,
@@ -14256,14 +14268,14 @@ const InputGroup = ({ label: label$50, name: name$1, className, inline, children
 		}), children]
 	});
 };
-var _excluded$56 = ["size"];
+var _excluded$58 = ["size"];
 var ChevronDownFill = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$56)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$58)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -14278,9 +14290,9 @@ var ChevronDownFill = (_ref) => {
 	}));
 };
 var ChevronDownFill_default = ChevronDownFill;
-var _excluded$55 = ["children"];
+var _excluded$57 = ["children"];
 const SelectMenuPortal = (_ref) => {
-	let { children } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$55);
+	let { children } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$57);
 	const dataProperties = toDataProperties({ "react-aria-top-layer": true });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_select.components.MenuPortal, _objectSpread2(_objectSpread2({}, restProps), {}, {
 		innerProps: dataProperties,
@@ -14320,10 +14332,10 @@ const Select$1 = ({ name: name$1, options, className, classNamePrefix = "Layer__
 		})]
 	});
 };
-var _excluded$54 = ["className"];
+var _excluded$56 = ["className"];
 const ErrorText = (_ref) => {
 	let { className } = _ref;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Text, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$54)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Text, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$56)), {}, {
 		status: "error",
 		className
 	}));
@@ -14644,7 +14656,7 @@ function UploadTransactionsUploadCsvStep({ selectedAccount, onSelectAccount, sel
 		] })]
 	});
 }
-var _excluded$53 = ["customAccountId"];
+var _excluded$55 = ["customAccountId"];
 var createCustomAccountTransactions = post(({ businessId, customAccountId }) => `/v1/businesses/${businessId}/custom-accounts/${customAccountId}/transactions`);
 function buildKey$73({ access_token: accessToken, apiUrl, businessId }) {
 	if (accessToken && apiUrl) return {
@@ -14659,7 +14671,7 @@ function useCreateCustomAccountTransactions() {
 	const { data } = useAuth();
 	const { businessId } = useLayerContext();
 	return (0, swr_mutation.default)(() => withLocale(buildKey$73(_objectSpread2(_objectSpread2({}, data), {}, { businessId }))), ({ accessToken, apiUrl, businessId: businessId$1 }, _ref) => {
-		let { arg: _ref2 } = _ref, { customAccountId } = _ref2, body = _objectWithoutProperties(_ref2, _excluded$53);
+		let { arg: _ref2 } = _ref, { customAccountId } = _ref2, body = _objectWithoutProperties(_ref2, _excluded$55);
 		return createCustomAccountTransactions(apiUrl, accessToken, {
 			params: {
 				businessId: businessId$1,
@@ -14672,6 +14684,31 @@ function useCreateCustomAccountTransactions() {
 		throwOnError: false
 	});
 }
+let ReportControl = /* @__PURE__ */ function(ReportControl$1) {
+	ReportControl$1["Date"] = "date";
+	ReportControl$1["DateRange"] = "date_range";
+	ReportControl$1["GroupBy"] = "group_by";
+	ReportControl$1["Unknown"] = "unknown";
+	return ReportControl$1;
+}({});
+var TransformedReportControlSchema = createTransformedEnumSchema(effect.Schema.Enums(ReportControl), ReportControl, ReportControl.Unknown);
+const ReportConfigSchema = effect.Schema.Struct({
+	key: effect.Schema.String,
+	reportRoute: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("report_route")),
+	displayName: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("display_name")),
+	controls: effect.Schema.Array(TransformedReportControlSchema),
+	baseQueryParameters: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.Record({
+		key: effect.Schema.String,
+		value: effect.Schema.String
+	})), effect.Schema.fromKey("base_query_parameters")),
+	isDefaultReport: effect.Schema.optional(effect.Schema.Boolean).pipe(effect.Schema.fromKey("is_default_report"))
+});
+const ReportGroupSchema = effect.Schema.Struct({
+	groupType: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("group_type")),
+	displayName: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("display_name")),
+	reports: effect.Schema.Array(ReportConfigSchema)
+});
+const ReportConfigResponseSchema = effect.Schema.Struct({ data: effect.Schema.Array(ReportGroupSchema) });
 let DateGroupBy = /* @__PURE__ */ function(DateGroupBy$1) {
 	DateGroupBy$1["AllTime"] = "ALL_TIME";
 	DateGroupBy$1["Month"] = "MONTH";
@@ -14685,6 +14722,13 @@ let Alignment = /* @__PURE__ */ function(Alignment$1) {
 	return Alignment$1;
 }({});
 var TransformedAlignmentSchema = createTransformedEnumSchema(effect.Schema.Enums(Alignment), Alignment, Alignment.Left);
+let Pinning = /* @__PURE__ */ function(Pinning$1) {
+	Pinning$1["Left"] = "LEFT";
+	Pinning$1["Right"] = "RIGHT";
+	Pinning$1["Unpinned"] = "UNPINNED";
+	return Pinning$1;
+}({});
+var TransformedPinningSchema = createTransformedEnumSchema(effect.Schema.Enums(Pinning), Pinning, Pinning.Unpinned);
 const DateQueryParamsSchema = effect.Schema.Struct({ effectiveDate: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.Date), effect.Schema.fromKey("effective_date")) });
 const DateRangeQueryParamsSchema = effect.Schema.Struct({
 	startDate: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.Date), effect.Schema.fromKey("start_date")),
@@ -14695,7 +14739,8 @@ var unifiedReportColumnFields = {
 	columnKey: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("column_key")),
 	displayName: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("display_name")),
 	isRowHeader: effect.Schema.optional(effect.Schema.Boolean).pipe(effect.Schema.fromKey("is_row_header")),
-	alignment: effect.Schema.optional(TransformedAlignmentSchema)
+	alignment: effect.Schema.optional(TransformedAlignmentSchema),
+	pinning: effect.Schema.optional(TransformedPinningSchema)
 };
 const UnifiedReportColumnSchema = effect.Schema.Struct(_objectSpread2(_objectSpread2({}, unifiedReportColumnFields), {}, { columns: effect.Schema.optional(effect.Schema.Array(effect.Schema.suspend(() => UnifiedReportColumnSchema))) }));
 var UnifiedCellValueAmountSchema = effect.Schema.Struct({
@@ -14718,7 +14763,8 @@ const isEmptyCellValue = (value) => value.type === "Empty";
 var UnifiedCellFormatSchema = effect.Schema.Struct({ bold: effect.Schema.optional(effect.Schema.Boolean) });
 var UnifiedReportCellSchema = effect.Schema.Struct({
 	value: UnifiedCellValueSchema,
-	format: effect.Schema.optional(UnifiedCellFormatSchema)
+	format: effect.Schema.optional(UnifiedCellFormatSchema),
+	reportConfig: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.NullishOr(ReportConfigSchema)), effect.Schema.fromKey("report_config"))
 });
 var unifiedReportRowFields = {
 	rowKey: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("row_key")),
@@ -14733,15 +14779,14 @@ const UnifiedReportSchema = effect.Schema.Struct({
 	columns: effect.Schema.Array(UnifiedReportColumnSchema),
 	rows: effect.Schema.Array(UnifiedReportRowSchema)
 });
-var _excluded$52 = [
+var _excluded$54 = [
 	"children",
 	"className",
 	"nonAria",
 	"slot"
-], _excluded2$4 = [
+], _excluded2$5 = [
 	"children",
 	"className",
-	"hideHeader",
 	"nonAria"
 ], _excluded3$1 = [
 	"children",
@@ -14760,13 +14805,15 @@ var _excluded$52 = [
 	"nonAria",
 	"id",
 	"alignment",
-	"colSpan"
+	"colSpan",
+	"pinned"
 ], _excluded6 = [
 	"children",
 	"className",
 	"nonAria",
 	"id",
-	"alignment"
+	"alignment",
+	"pinned"
 ];
 var TableSubComponent = /* @__PURE__ */ function(TableSubComponent$1) {
 	TableSubComponent$1["Table"] = "Table";
@@ -14786,9 +14833,9 @@ var toAlignmentDataValue = (alignment) => {
 		default: return;
 	}
 };
-var getClassName = (component, additionalClassNames, withHidden) => (0, classnames.default)(`${CSS_PREFIX$1}-${component}`, withHidden && `${CSS_PREFIX$1}-${component}--hidden`, additionalClassNames);
+var getClassName = (component, additionalClassNames) => (0, classnames.default)(`${CSS_PREFIX$1}-${component}`, additionalClassNames);
 var Table = (0, react.forwardRef)((_ref, ref) => {
-	let { children, className, nonAria, slot } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$52);
+	let { children, className, nonAria, slot } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$54);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(nonAria ? "table" : react_aria_components.Table, _objectSpread2(_objectSpread2({
 		className: getClassName(TableSubComponent.Table, className),
 		slot: slot !== null && slot !== void 0 ? slot : void 0
@@ -14799,8 +14846,8 @@ var Table = (0, react.forwardRef)((_ref, ref) => {
 });
 Table.displayName = TableSubComponent.Table;
 var TableHeaderInner = (_ref2, ref) => {
-	let { children, className, hideHeader, nonAria } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$4);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(nonAria ? "thead" : react_aria_components.TableHeader, _objectSpread2(_objectSpread2({ className: getClassName(TableSubComponent.TableHeader, className, hideHeader) }, restProps), {}, {
+	let { children, className, nonAria } = _ref2, restProps = _objectWithoutProperties(_ref2, _excluded2$5);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(nonAria ? "thead" : react_aria_components.TableHeader, _objectSpread2(_objectSpread2({ className: getClassName(TableSubComponent.TableHeader, className) }, restProps), {}, {
 		ref,
 		children: withRenderProp(children, (node) => node)
 	}));
@@ -14830,8 +14877,11 @@ var RowInner = (_ref4, ref) => {
 var Row = (0, react.forwardRef)(RowInner);
 Row.displayName = TableSubComponent.Row;
 var Column = (0, react.forwardRef)((_ref5, ref) => {
-	let { children, className, nonAria, id, alignment = Alignment.Left, colSpan = 1 } = _ref5, restProps = _objectWithoutProperties(_ref5, _excluded5);
-	const dataProperties = toDataProperties({ align: toAlignmentDataValue(alignment) });
+	let { children, className, nonAria, id, alignment = Alignment.Left, colSpan = 1, pinned } = _ref5, restProps = _objectWithoutProperties(_ref5, _excluded5);
+	const dataProperties = toDataProperties({
+		align: toAlignmentDataValue(alignment),
+		pinned
+	});
 	const columnClassName = getClassName(TableSubComponent.Column, className);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(nonAria ? "th" : react_aria_components.Column, _objectSpread2(_objectSpread2(_objectSpread2({ className: columnClassName }, restProps), dataProperties), {}, {
 		ref,
@@ -14842,8 +14892,11 @@ var Column = (0, react.forwardRef)((_ref5, ref) => {
 });
 Column.displayName = TableSubComponent.Column;
 var Cell = (0, react.forwardRef)((_ref6, ref) => {
-	let { children, className, nonAria, id, alignment } = _ref6, restProps = _objectWithoutProperties(_ref6, _excluded6);
-	const dataProperties = toDataProperties({ align: toAlignmentDataValue(alignment) });
+	let { children, className, nonAria, id, alignment, pinned } = _ref6, restProps = _objectWithoutProperties(_ref6, _excluded6);
+	const dataProperties = toDataProperties({
+		align: toAlignmentDataValue(alignment),
+		pinned
+	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(nonAria ? "td" : react_aria_components.Cell, _objectSpread2(_objectSpread2(_objectSpread2({ className: getClassName(TableSubComponent.Cell, className) }, restProps), dataProperties), {}, {
 		ref,
 		id: id === null || id === void 0 ? void 0 : id.toString(),
@@ -14878,6 +14931,42 @@ const getColumnDefs = (columnConfig) => {
 		});
 	});
 };
+const computePinningStyles = (headerGroups, widths) => {
+	var _headerGroups$at$head, _headerGroups$at;
+	const leafHeaders = (_headerGroups$at$head = (_headerGroups$at = headerGroups.at(-1)) === null || _headerGroups$at === void 0 ? void 0 : _headerGroups$at.headers) !== null && _headerGroups$at$head !== void 0 ? _headerGroups$at$head : [];
+	const styles = /* @__PURE__ */ new Map();
+	const accumulate = (headersInOrder, side) => {
+		let offset$1 = 0;
+		for (const header of headersInOrder) {
+			var _widths$header$column;
+			if (header.column.getIsPinned() !== side) continue;
+			styles.set(header.column.id, {
+				position: "sticky",
+				[side]: `${offset$1}px`
+			});
+			offset$1 += (_widths$header$column = widths[header.column.id]) !== null && _widths$header$column !== void 0 ? _widths$header$column : 0;
+		}
+	};
+	accumulate(leafHeaders, "left");
+	accumulate([...leafHeaders].reverse(), "right");
+	return styles;
+};
+const getColumnPinning = (columnConfig) => {
+	const left = [];
+	const right = [];
+	for (const col of columnConfig) if (isLeafColumn(col)) {
+		if (col.pinning === "left") left.push(col.id);
+		else if (col.pinning === "right") right.push(col.id);
+	} else {
+		const nested = getColumnPinning(col.columns);
+		left.push(...nested.left);
+		right.push(...nested.right);
+	}
+	return {
+		left,
+		right
+	};
+};
 const Loader = ({ children, size = 28 }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
 		className: "Layer__loader",
@@ -14893,7 +14982,7 @@ var DEFAULT_NUM_ROWS = 15;
 var HEADER_HEIGHT = 52;
 var DEFAULT_TABLE_HEIGHT = DEFAULT_ROW_HEIGHT * DEFAULT_NUM_ROWS + HEADER_HEIGHT - 1;
 var CSS_PREFIX = "Layer__UI__VirtualizedTable";
-var EMPTY_ARRAY$3 = [];
+var EMPTY_ARRAY$4 = [];
 const VirtualizedDataTable = ({ columnConfig, data, isLoading, isError, componentName, ariaLabel, slots, shrinkHeightToFitRows = false, height = DEFAULT_TABLE_HEIGHT, rowHeight = DEFAULT_ROW_HEIGHT, overscan = DEFAULT_OVERSCAN }) => {
 	const { EmptyState: EmptyState$6, ErrorState: ErrorState$5 } = slots;
 	const containerRef = (0, react.useRef)(null);
@@ -14909,7 +14998,7 @@ const VirtualizedDataTable = ({ columnConfig, data, isLoading, isError, componen
 		shrinkHeightToFitRows
 	]);
 	const table$1 = (0, __tanstack_react_table.useReactTable)({
-		data: data !== null && data !== void 0 ? data : EMPTY_ARRAY$3,
+		data: data !== null && data !== void 0 ? data : EMPTY_ARRAY$4,
 		columns: getColumnDefs(columnConfig),
 		getCoreRowModel: (0, __tanstack_react_table.getCoreRowModel)(),
 		getSortedRowModel: (0, __tanstack_react_table.getSortedRowModel)()
@@ -15919,7 +16008,7 @@ function useDelayedRemoveBankTransaction({ bankTransaction, onRemove }) {
 	}, [bankTransaction.recently_categorized]);
 	return (0, react.useMemo)(() => ({ isBeingRemoved }), [isBeingRemoved]);
 }
-var _excluded$51 = ["bankTransactionId"];
+var _excluded$53 = ["bankTransactionId"];
 var CATEGORIZE_BANK_TRANSACTION_TAG = "#categorize-bank-transaction";
 var categorizeBankTransaction = put(({ businessId, bankTransactionId }) => `/v1/businesses/${businessId}/bank-transactions/${bankTransactionId}/categorize`);
 function buildKey$72({ access_token: accessToken, apiUrl, businessId }) {
@@ -15943,7 +16032,7 @@ function useCategorizeBankTransaction() {
 		apiUrl: auth === null || auth === void 0 ? void 0 : auth.apiUrl,
 		businessId
 	})), ({ accessToken, apiUrl, businessId: businessId$1 }, _ref) => {
-		let { arg: _ref2 } = _ref, { bankTransactionId } = _ref2, rest = _objectWithoutProperties(_ref2, _excluded$51);
+		let { arg: _ref2 } = _ref, { bankTransactionId } = _ref2, rest = _objectWithoutProperties(_ref2, _excluded$53);
 		return categorizeBankTransaction(apiUrl, accessToken, {
 			params: {
 				businessId: businessId$1,
@@ -16009,7 +16098,7 @@ function useCategorizeBankTransactionWithCacheUpdate() {
 		isError
 	]);
 }
-var _excluded$50 = ["bankTransactionId"];
+var _excluded$52 = ["bankTransactionId"];
 var matchBankTransaction = put(({ businessId, bankTransactionId }) => `/v1/businesses/${businessId}/bank-transactions/${bankTransactionId}/match`);
 var MATCH_BANK_TRANSACTION_TAG = "#match-bank-transaction";
 function buildKey$71({ access_token: accessToken, apiUrl, businessId }) {
@@ -16033,7 +16122,7 @@ function useMatchBankTransaction() {
 		apiUrl: auth === null || auth === void 0 ? void 0 : auth.apiUrl,
 		businessId
 	})), ({ accessToken, apiUrl, businessId: businessId$1 }, _ref) => {
-		let { arg: _ref2 } = _ref, { bankTransactionId } = _ref2, body = _objectWithoutProperties(_ref2, _excluded$50);
+		let { arg: _ref2 } = _ref, { bankTransactionId } = _ref2, body = _objectWithoutProperties(_ref2, _excluded$52);
 		return matchBankTransaction(apiUrl, accessToken, {
 			params: {
 				businessId: businessId$1,
@@ -16161,14 +16250,14 @@ function useDelayedVisibility({ delay, initialVisibility = false }) {
 	}, []);
 	return { isVisible };
 }
-var _excluded$49 = ["size"];
+var _excluded$51 = ["size"];
 var File$1 = (_ref) => {
 	let { size = 12 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 12 12",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$49)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$51)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -16270,7 +16359,7 @@ const variants = {
 		}
 	}
 };
-var _excluded$48 = [
+var _excluded$50 = [
 	"as",
 	"children",
 	"variant",
@@ -16279,7 +16368,7 @@ var _excluded$48 = [
 	"motionKey"
 ];
 function AnimatedPresenceElementInner(_ref, ref) {
-	let { as, children, variant, isOpen, slotProps = { AnimatePresence: { initial: false } }, motionKey } = _ref, props = _objectWithoutProperties(_ref, _excluded$48);
+	let { as, children, variant, isOpen, slotProps = { AnimatePresence: { initial: false } }, motionKey } = _ref, props = _objectWithoutProperties(_ref, _excluded$50);
 	const config = variants[variant];
 	const MotionComponent = motion_react.motion[as !== null && as !== void 0 ? as : "div"];
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.AnimatePresence, _objectSpread2(_objectSpread2({}, slotProps.AnimatePresence), {}, { children: isOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MotionComponent, _objectSpread2(_objectSpread2({
@@ -16424,14 +16513,14 @@ function useBookkeepingPeriods() {
 		return Reflect.get(target, prop);
 	} });
 }
-var _excluded$47 = ["size"];
+var _excluded$49 = ["size"];
 var Clock$2 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$47)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$49)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -16936,14 +17025,14 @@ const useSplitsForm = ({ bankTransaction, selectedCategory, isOpen }) => {
 		saveLocalSplitsToCategoryStore
 	};
 };
-var _excluded$46 = ["size"];
+var _excluded$48 = ["size"];
 var ScissorsFullOpen = (_ref) => {
 	let { size = 12 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 12 12",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$46)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$48)), {}, {
 		width: size,
 		height: size,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
@@ -16989,14 +17078,14 @@ var ScissorsFullOpen = (_ref) => {
 	}));
 };
 var ScissorsFullOpen_default = ScissorsFullOpen;
-var _excluded$45 = ["size"];
+var _excluded$47 = ["size"];
 var Trash$1 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$45)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$47)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -17744,9 +17833,9 @@ const ReceiptsProvider = ({ children, bankTransaction, isActive }) => {
 		children
 	});
 };
-var _excluded$44 = ["size"];
+var _excluded$46 = ["size"];
 var Eye = (_ref) => {
-	let { size = 18 } = _ref, props = _objectWithoutProperties(_ref, _excluded$44);
+	let { size = 18 } = _ref, props = _objectWithoutProperties(_ref, _excluded$46);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		width: size,
@@ -17840,9 +17929,9 @@ const FileThumb = ({ url, floatingActions = false, uploadPending, deletePending,
 		}) : null]
 	});
 };
-var _excluded$43 = ["className", "children"];
+var _excluded$45 = ["className", "children"];
 const TextButton = (_ref) => {
-	let { className, children } = _ref, props = _objectWithoutProperties(_ref, _excluded$43);
+	let { className, children } = _ref, props = _objectWithoutProperties(_ref, _excluded$45);
 	const baseClassName$1 = (0, classnames.default)("Layer__text-btn", className);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", _objectSpread2(_objectSpread2({}, props), {}, {
 		className: baseClassName$1,
@@ -17888,7 +17977,7 @@ const FileInput = ({ text, onUpload, disabled = false, secondary, iconOnly = fal
 		style: { display: "none" }
 	})] });
 };
-var _excluded$42 = ["bankTransaction", "isActive"];
+var _excluded$44 = ["bankTransaction", "isActive"];
 var MAX_RECEIPTS_COUNT = 10;
 var openReceiptInNewTab = (url, receiptTitle) => (e) => {
 	e.preventDefault();
@@ -17909,7 +17998,7 @@ var BankTransactionReceiptsWithProvider = (0, react.forwardRef)((_ref, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ReceiptsProvider, {
 		bankTransaction,
 		isActive,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BankTransactionReceipts, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$42)), {}, { ref }))
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BankTransactionReceipts, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$44)), {}, { ref }))
 	});
 });
 BankTransactionReceiptsWithProvider.displayName = "BankTransactionReceiptsWithProvider";
@@ -17988,14 +18077,14 @@ const getCurrencyFormatConfig = (intl) => {
 		suffix: parts.slice(lastNumberIndex + 1).map((part) => part.value).join("")
 	};
 };
-var _excluded$41 = [
+var _excluded$43 = [
 	"onChange",
 	"className",
 	"errorMessage",
 	"isInvalid"
 ];
 const AmountInput = (_ref) => {
-	let { onChange, className, errorMessage, isInvalid } = _ref, props = _objectWithoutProperties(_ref, _excluded$41);
+	let { onChange, className, errorMessage, isInvalid } = _ref, props = _objectWithoutProperties(_ref, _excluded$43);
 	const intl = (0, react_intl.useIntl)();
 	const formatter = useIntlFormatter();
 	const currencyFormatConfig = (0, react.useMemo)(() => getCurrencyFormatConfig(intl), [intl]);
@@ -18635,14 +18724,14 @@ const BankTransactionsMobileListItemCheckbox = ({ bulkActionsEnabled, bankTransa
 		})
 	});
 };
-var _excluded$40 = ["size"];
+var _excluded$42 = ["size"];
 var Paperclip = (_ref) => {
 	let { size = 20 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 20 20",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$40)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$42)), {}, {
 		width: size,
 		height: size,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -19722,14 +19811,14 @@ const BankTransactionRow = ({ index, bankTransaction, initialLoad, showDescripti
 		})
 	}) })] });
 };
-var _excluded$39 = ["size"];
+var _excluded$41 = ["size"];
 var Inbox = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$39)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$41)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -20027,14 +20116,14 @@ function useArchiveCategorizationRule() {
 		return Reflect.get(target, prop);
 	} });
 }
-var _excluded$38 = ["size"];
+var _excluded$40 = ["size"];
 var BackArrow = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 12 12",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$38)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$40)), {}, {
 		width: size,
 		height: size,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -20111,7 +20200,7 @@ const MobileListItem = ({ item, onClickItem, children }) => {
 		}), children$1] }))
 	}, item.id);
 };
-var _excluded$37 = [
+var _excluded$39 = [
 	"ariaLabel",
 	"data",
 	"slots",
@@ -20125,7 +20214,7 @@ var isSelectionEnabled = (props) => {
 	return props.selectionMode !== "none" && props.enableSelection;
 };
 const MobileList = (props) => {
-	const { ariaLabel, data, slots, renderItem, onClickItem, isLoading, isError, selectionMode = "none" } = props, restSelectionProps = _objectWithoutProperties(props, _excluded$37);
+	const { ariaLabel, data, slots, renderItem, onClickItem, isLoading, isError, selectionMode = "none" } = props, restSelectionProps = _objectWithoutProperties(props, _excluded$39);
 	const { EmptyState: EmptyState$6, ErrorState: ErrorState$5 } = slots;
 	const resolvedSelectionMode = isSelectionEnabled(props) ? selectionMode : "none";
 	const resolvedSelectionBehavior = resolvedSelectionMode === "none" ? "toggle" : void 0;
@@ -20179,9 +20268,9 @@ const usePaginationRange = ({ totalCount, pageSize, siblingCount = 1, currentPag
 		currentPage
 	]);
 };
-var _excluded$36 = ["children", "isSelected"];
+var _excluded$38 = ["children", "isSelected"];
 var PaginationButton = (_ref) => {
-	let { children, isSelected } = _ref, buttonProps = _objectWithoutProperties(_ref, _excluded$36);
+	let { children, isSelected } = _ref, buttonProps = _objectWithoutProperties(_ref, _excluded$38);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, _objectSpread2(_objectSpread2({
 		inset: true,
 		icon: true,
@@ -20248,14 +20337,14 @@ const Pagination = ({ onPageChange, totalCount, siblingCount = 1, currentPage, p
 		})
 	});
 };
-var _excluded$35 = ["data", "paginationProps"];
-var EMPTY_ARRAY$2 = [];
+var _excluded$37 = ["data", "paginationProps"];
+var EMPTY_ARRAY$3 = [];
 const PaginatedMobileList = (props) => {
 	var _data$length;
-	const { data, paginationProps } = props, listProps = _objectWithoutProperties(props, _excluded$35);
+	const { data, paginationProps } = props, listProps = _objectWithoutProperties(props, _excluded$37);
 	const { initialPage = 0, onSetPage, pageSize = 20, hasMore, fetchMore, autoResetPageIndexRef } = paginationProps;
 	const { pageItems, pageIndex, setPage } = usePaginatedList({
-		data: data !== null && data !== void 0 ? data : EMPTY_ARRAY$2,
+		data: data !== null && data !== void 0 ? data : EMPTY_ARRAY$3,
 		pageSize,
 		initialPage,
 		onSetPage
@@ -20370,9 +20459,55 @@ const CategorizationRulesMobileList = ({ data, isLoading, isError, paginationPro
 		})
 	});
 };
-const DataTable = ({ isLoading, isError, componentName, ariaLabel, slots, hideHeader, dependencies: dependencies$1, data, headerGroups, numColumns, withClickableRow }) => {
+var WIDTH_CHANGE_THRESHOLD_PX = .5;
+var getLeafHeaderCells = (header) => {
+	const leafRow = header === null || header === void 0 ? void 0 : header.lastElementChild;
+	if (!leafRow) return null;
+	return Array.from(leafRow.children);
+};
+var computeUpdatedWidths = (prev, columnIds, cells) => {
+	let next = prev;
+	columnIds.forEach((id, i) => {
+		var _prev$id;
+		const cell = cells[i];
+		if (!cell) return;
+		const width = cell.getBoundingClientRect().width;
+		if (Math.abs(((_prev$id = prev[id]) !== null && _prev$id !== void 0 ? _prev$id : 0) - width) < WIDTH_CHANGE_THRESHOLD_PX) return;
+		if (next === prev) next = _objectSpread2({}, prev);
+		next[id] = width;
+	});
+	return next;
+};
+const useColumnHeaderWidths = (headerRef, columnIds) => {
+	const [widths, setWidths] = (0, react.useState)({});
+	(0, react.useLayoutEffect)(() => {
+		const cells = getLeafHeaderCells(headerRef.current);
+		if (!cells) return;
+		const measure = () => {
+			setWidths((prev) => computeUpdatedWidths(prev, columnIds, cells));
+		};
+		measure();
+		const observer = new ResizeObserver(measure);
+		cells.forEach((cell) => observer.observe(cell));
+		return () => observer.disconnect();
+	}, [headerRef, columnIds.join("|")]);
+	return widths;
+};
+const useColumnPinningStyles = (headerGroups) => {
+	const headerRef = (0, react.useRef)(null);
+	const headerWidths = useColumnHeaderWidths(headerRef, (0, react.useMemo)(() => {
+		var _headerGroups$at$head, _headerGroups$at;
+		return (_headerGroups$at$head = (_headerGroups$at = headerGroups.at(-1)) === null || _headerGroups$at === void 0 ? void 0 : _headerGroups$at.headers.map((h) => h.column.id)) !== null && _headerGroups$at$head !== void 0 ? _headerGroups$at$head : [];
+	}, [headerGroups]));
+	return {
+		headerRef,
+		pinningStyles: (0, react.useMemo)(() => computePinningStyles(headerGroups, headerWidths), [headerGroups, headerWidths])
+	};
+};
+const DataTable = ({ isLoading, isError, componentName, ariaLabel, slots, dependencies: dependencies$1, data, headerGroups, numColumns, withClickableRow }) => {
 	const nonAria = headerGroups.length > 1;
 	const { EmptyState: EmptyState$6, ErrorState: ErrorState$5 } = slots;
+	const { headerRef, pinningStyles } = useColumnPinningStyles(headerGroups);
 	const isEmptyTable = (data === null || data === void 0 ? void 0 : data.length) === 0;
 	const renderTableBody = (0, react.useMemo)(() => {
 		if (isError) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Row, {
@@ -20418,6 +20553,8 @@ const DataTable = ({ isLoading, isError, componentName, ariaLabel, slots, hideHe
 					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Cell, {
 						className: `Layer__UI__Table-Cell__${componentName}--${cell.column.id}`,
 						alignment: (_cell$column$columnDe = cell.column.columnDef.meta) === null || _cell$column$columnDe === void 0 ? void 0 : _cell$column$columnDe.alignment,
+						pinned: cell.column.getIsPinned(),
+						style: pinningStyles.get(cell.column.id),
 						nonAria,
 						children: (0, __tanstack_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext())
 					}, `${row.id}-${cell.id}`);
@@ -20434,34 +20571,40 @@ const DataTable = ({ isLoading, isError, componentName, ariaLabel, slots, hideHe
 		ErrorState$5,
 		EmptyState$6,
 		withClickableRow,
-		componentName
+		componentName,
+		pinningStyles
 	]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Table, {
-		"aria-label": ariaLabel,
-		className: `Layer__UI__Table__${componentName}`,
-		nonAria,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableHeader, {
-			hideHeader,
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "Layer__UI__Table-ScrollContainer",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Table, {
+			"aria-label": ariaLabel,
+			className: `Layer__UI__Table__${componentName}`,
 			nonAria,
-			children: headerGroups.map((headerGroup) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Row, {
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableHeader, {
+				ref: headerRef,
 				nonAria,
-				children: headerGroup.headers.map((header) => {
-					var _header$column$column, _header$column$column2;
-					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Column, {
-						isRowHeader: (_header$column$column = header.column.columnDef.meta) === null || _header$column$column === void 0 ? void 0 : _header$column$column.isRowHeader,
-						className: `Layer__UI__Table-Column__${componentName}--${header.id}`,
-						alignment: (_header$column$column2 = header.column.columnDef.meta) === null || _header$column$column2 === void 0 ? void 0 : _header$column$column2.alignment,
-						nonAria,
-						colSpan: header.colSpan,
-						children: header.isPlaceholder ? null : typeof header.column.columnDef.header === "function" ? header.column.columnDef.header(header.getContext()) : header.column.columnDef.header
-					}, header.id);
-				})
-			}, headerGroup.id))
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableBody, {
-			dependencies: dependencies$1,
-			nonAria,
-			children: renderTableBody
-		})]
+				children: headerGroups.map((headerGroup) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Row, {
+					nonAria,
+					children: headerGroup.headers.map((header) => {
+						var _header$column$column, _header$column$column2;
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Column, {
+							isRowHeader: (_header$column$column = header.column.columnDef.meta) === null || _header$column$column === void 0 ? void 0 : _header$column$column.isRowHeader,
+							className: `Layer__UI__Table-Column__${componentName}--${header.id}`,
+							alignment: (_header$column$column2 = header.column.columnDef.meta) === null || _header$column$column2 === void 0 ? void 0 : _header$column$column2.alignment,
+							pinned: header.column.getIsPinned(),
+							style: pinningStyles.get(header.column.id),
+							nonAria,
+							colSpan: header.colSpan,
+							children: header.isPlaceholder ? null : typeof header.column.columnDef.header === "function" ? header.column.columnDef.header(header.getContext()) : header.column.columnDef.header
+						}, header.id);
+					})
+				}, headerGroup.id))
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableBody, {
+				dependencies: dependencies$1,
+				nonAria,
+				children: renderTableBody
+			})]
+		})
 	});
 };
 function PaginatedTable({ data, isLoading, isError, columnConfig, componentName, ariaLabel, paginationProps, slots }) {
@@ -21165,7 +21308,7 @@ const SuggestedCategorizationRuleUpdatesDialog = ({ isOpen, onOpenChange, ruleSu
 		})] })
 	});
 };
-var _excluded$34 = [
+var _excluded$36 = [
 	"onError",
 	"showTags",
 	"showCustomerVendor",
@@ -21177,7 +21320,7 @@ var _excluded$34 = [
 ];
 var COMPONENT_NAME$12 = "bank-transactions";
 const BankTransactions = (_ref) => {
-	let { onError, showTags = false, showCustomerVendor = false, monthlyView = false, applyGlobalDateRange = false, mode, renderInAppLink, filters } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$34);
+	let { onError, showTags = false, showCustomerVendor = false, monthlyView = false, applyGlobalDateRange = false, mode, renderInAppLink, filters } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$36);
 	usePreloadTagDimensions({ isEnabled: showTags });
 	usePreloadCustomers({ isEnabled: showCustomerVendor });
 	usePreloadVendors({ isEnabled: showCustomerVendor });
@@ -21483,9 +21626,9 @@ function QuickbooksContextProvider({ children }) {
 		children
 	});
 }
-var _excluded$33 = ["size"];
+var _excluded$35 = ["size"];
 var Cog = (_ref) => {
-	let { size = 12 } = _ref, props = _objectWithoutProperties(_ref, _excluded$33);
+	let { size = 12 } = _ref, props = _objectWithoutProperties(_ref, _excluded$35);
 	const id = (0, react.useId)();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
@@ -21516,9 +21659,9 @@ var Cog = (_ref) => {
 	}) })] }));
 };
 var Cog_default = Cog;
-var _excluded$32 = ["size"];
+var _excluded$34 = ["size"];
 var QuickbooksIcon = (_ref) => {
-	let { size = 24 } = _ref, props = _objectWithoutProperties(_ref, _excluded$32);
+	let { size = 24 } = _ref, props = _objectWithoutProperties(_ref, _excluded$34);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 24 24",
@@ -21705,14 +21848,14 @@ function IntegrationsQuickbooksUnlinkConfirmationModal({ isOpen, onOpenChange })
 		errorText: t("integrations:error.unlink_failed", "Unlink failed. Please check your connection and try again in a few seconds.")
 	});
 }
-var _excluded$31 = ["size"];
+var _excluded$33 = ["size"];
 var MoreVertical = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 16 14",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$31)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$33)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -21906,14 +22049,14 @@ const IntegrationsComponent = ({ stringOverrides }) => {
 		]
 	});
 };
-var _excluded$30 = ["size"];
+var _excluded$32 = ["size"];
 var PlusIcon = (_ref) => {
 	let { size = 14 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 16 16",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$30)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$32)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -21988,14 +22131,14 @@ function useConfirmAndExcludeMultiple({ onSuccess }) {
 		throwOnError: false
 	});
 }
-var _excluded$29 = ["size"];
+var _excluded$31 = ["size"];
 var InstitutionIcon = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 27 28",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$29)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$31)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -22521,10 +22664,10 @@ const MenuItem$1 = (0, react.forwardRef)(function MenuItem$2({ children, textVal
 		children
 	});
 });
-var _excluded$28 = ["children", "status"];
+var _excluded$30 = ["children", "status"];
 var PILL_CLASS_NAME = "Layer__Pill";
 const Pill = (0, react.forwardRef)(function Pill$1(_ref, ref) {
-	let { children, status } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$28);
+	let { children, status } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$30);
 	const dataProperties = toDataProperties({ status });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Button, _objectSpread2(_objectSpread2(_objectSpread2({}, restProps), dataProperties), {}, {
 		className: PILL_CLASS_NAME,
@@ -23682,16 +23825,16 @@ const useProfitAndLossLTM = ({ tagFilter, reportingBasis, chartWindow }) => {
 		isError
 	};
 };
-var _excluded$27 = [
+var _excluded$29 = [
 	"verticalAnchor",
 	"visibleTicksCount",
 	"tickFormatter",
 	"format",
 	"payload"
-], _excluded2$3 = ["format"];
+], _excluded2$4 = ["format"];
 var CustomizedYTick = (_ref) => {
 	let { verticalAnchor: _verticalAnchor, visibleTicksCount: _visibleTicksCount, tickFormatter: _tickFormatter, format: format$1, payload } = _ref;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$27)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$29)), {}, {
 		className: "Layer__ChartYAxis__tick",
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tspan", {
 			dy: "0.355em",
@@ -23700,7 +23843,7 @@ var CustomizedYTick = (_ref) => {
 	}));
 };
 const ChartYAxis = (_ref2) => {
-	let { format: format$1 } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$3);
+	let { format: format$1 } = _ref2, props = _objectWithoutProperties(_ref2, _excluded2$4);
 	const { formatNumber: formatNumber$1 } = useIntlFormatter();
 	const formatYAxisValue = (0, react.useCallback)((value) => {
 		if (!value) return value;
@@ -23731,12 +23874,12 @@ var shiftWindow = (chartWindow, months) => ({
 	end: (0, date_fns.endOfMonth)((0, date_fns.add)(chartWindow.end, { months }))
 });
 const getChartWindow = ({ chartWindow, selectedDate, activationDate }) => {
-	const today$4 = (0, date_fns.startOfMonth)(Date.now());
+	const today$5 = (0, date_fns.startOfMonth)(Date.now());
 	const minStart = (0, date_fns.startOfMonth)(activationDate);
 	const selected = (0, date_fns.startOfMonth)(selectedDate);
 	const windowStart = (0, date_fns.startOfMonth)(chartWindow.start);
 	const windowEnd = (0, date_fns.startOfMonth)(chartWindow.end);
-	if ((0, date_fns.differenceInMonths)(today$4, minStart) < MONTHS_IN_WINDOW) return buildWindow((0, date_fns.sub)(today$4, { months: MONTHS_IN_WINDOW - 1 }));
+	if ((0, date_fns.differenceInMonths)(today$5, minStart) < MONTHS_IN_WINDOW) return buildWindow((0, date_fns.sub)(today$5, { months: MONTHS_IN_WINDOW - 1 }));
 	const position = (0, date_fns.differenceInMonths)(selected, windowStart);
 	if (position >= 1 && position <= 10) return chartWindow;
 	if (position === 0) {
@@ -23744,7 +23887,7 @@ const getChartWindow = ({ chartWindow, selectedDate, activationDate }) => {
 		return shift$1 > 0 ? shiftWindow(chartWindow, -shift$1) : chartWindow;
 	}
 	if (position === MONTHS_IN_WINDOW - 1) {
-		const shift$1 = Math.min(MAX_EDGE_SHIFT, (0, date_fns.differenceInMonths)(today$4, windowEnd));
+		const shift$1 = Math.min(MAX_EDGE_SHIFT, (0, date_fns.differenceInMonths)(today$5, windowEnd));
 		return shift$1 > 0 ? shiftWindow(chartWindow, shift$1) : chartWindow;
 	}
 	const monthsFromActivation = (0, date_fns.differenceInMonths)(selected, minStart);
@@ -23868,7 +24011,7 @@ const ProfitAndLossChartSelectionIndicator = ({ viewBox, selected }) => {
 		height: "calc(100% - 30px)"
 	});
 };
-var _excluded$26 = ["payload", "fill"];
+var _excluded$28 = ["payload", "fill"];
 var BAR_RADIUS$1 = [
 	2,
 	2,
@@ -23888,7 +24031,7 @@ const ProfitAndLossChartBar = ({ dataKey, xAxisId, cellFill, className, barSize,
 		isAnimationActive: barAnimation,
 		fill: cellFill,
 		shape: (0, react.useCallback)((props) => {
-			const { payload, fill } = props, restProps = _objectWithoutProperties(props, _excluded$26);
+			const { payload, fill } = props, restProps = _objectWithoutProperties(props, _excluded$28);
 			const shouldRound = payload && isOutermostBar(payload, dataKey, xAxisId);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(recharts.Rectangle, _objectSpread2(_objectSpread2({}, restProps), {}, {
 				fill,
@@ -23950,14 +24093,14 @@ const ProfitAndLossChartLegend = () => {
 		})), [t]))
 	});
 };
-var _excluded$25 = ["size"];
+var _excluded$27 = ["size"];
 var BarChart2 = (_ref) => {
 	let { size = 12 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 12 12",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$25)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$27)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -24000,7 +24143,7 @@ const ProfitAndLossChartStateCard = () => {
 		})]
 	});
 };
-var _excluded$24 = [
+var _excluded$26 = [
 	"content",
 	"cursorWidth",
 	"animationDuration",
@@ -24036,7 +24179,7 @@ const ChartTooltipCursor = ({ width, points, height }) => {
 	});
 };
 const ChartTooltip = (_ref) => {
-	let { content, cursorWidth, animationDuration = 100, animationEasing = "ease-out" } = _ref, props = _objectWithoutProperties(_ref, _excluded$24);
+	let { content, cursorWidth, animationDuration = 100, animationEasing = "ease-out" } = _ref, props = _objectWithoutProperties(_ref, _excluded$26);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(recharts.Tooltip, _objectSpread2({
 		wrapperClassName: "Layer__ChartTooltip__wrapper",
 		content,
@@ -24297,9 +24440,9 @@ const ProfitAndLossChart = ({ tagFilter }) => {
 		}, "pnl-chart"), isSyncing ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLossChartStateCard, {}) : null]
 	});
 };
-var _excluded$23 = ["className", "textOnly"];
+var _excluded$25 = ["className", "textOnly"];
 const BackButton = (_ref) => {
-	let { className, textOnly = false } = _ref, props = _objectWithoutProperties(_ref, _excluded$23);
+	let { className, textOnly = false } = _ref, props = _objectWithoutProperties(_ref, _excluded$25);
 	const baseClassName$1 = (0, classnames.default)("Layer__btn", "Layer__back-btn", className);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", _objectSpread2(_objectSpread2({}, props), {}, {
 		className: baseClassName$1,
@@ -24473,7 +24616,7 @@ const DetailedChart = ({ data, isLoading, interactionProps, stylingProps, slots
 		})]
 	});
 };
-var _excluded$22 = ["size"];
+var _excluded$24 = ["size"];
 var ClassNames = {
 	DESC_ARROW: "Layer__SortArrows__DescArrow",
 	ASC_ARROW: "Layer__SortArrows__AscArrow"
@@ -24484,7 +24627,7 @@ var SortArrows = (_ref) => {
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 12 13",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$22)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$24)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
@@ -24622,7 +24765,7 @@ var RegularValueIcon = ({ colorMapping }) => {
 		})
 	});
 };
-var _excluded$21 = ["data"];
+var _excluded$23 = ["data"];
 const DetailedTable = ({ stylingProps, sortParams, sortFunction, interactionProps, rows, stringOverrides }) => {
 	const { t } = (0, react_i18next.useTranslation)();
 	const setAndToggleSortDirection = (params) => {
@@ -24753,7 +24896,7 @@ const DetailedTable = ({ stylingProps, sortParams, sortFunction, interactionProp
 	});
 };
 const DetailedTableWithData = (_ref) => {
-	let { data } = _ref, props = _objectWithoutProperties(_ref, _excluded$21);
+	let { data } = _ref, props = _objectWithoutProperties(_ref, _excluded$23);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DetailedTable, _objectSpread2({ rows: useDetailedTableRows({ data }) }, props));
 };
 function useGlobalDatePickerBounds() {
@@ -24907,9 +25050,9 @@ const LedgerAccountsContext = (0, react.createContext)({
 	hasMore: false,
 	fetchMore: () => {}
 });
-var _excluded$20 = ["className", "textOnly"];
+var _excluded$22 = ["className", "textOnly"];
 const CloseButton = (_ref) => {
-	let { className, textOnly = false } = _ref, props = _objectWithoutProperties(_ref, _excluded$20);
+	let { className, textOnly = false } = _ref, props = _objectWithoutProperties(_ref, _excluded$22);
 	const baseClassName$1 = (0, classnames.default)("Layer__btn", "Layer__back-btn", className);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", _objectSpread2(_objectSpread2({}, props), {}, {
 		className: baseClassName$1,
@@ -27335,7 +27478,7 @@ function TransactionsToReview({ onClick, tagFilter = void 0, variants: variants$
 		})]
 	});
 }
-var _excluded$19 = ["onTransactionsToReviewClick"];
+var _excluded$21 = ["onTransactionsToReviewClick"];
 var SECTION_CLASS_NAMES = `Layer__ProfitAndLossSummaries Layer__component`;
 function Internal_ProfitAndLossSummaries({ actionable = false, revenueLabel, stringOverrides, chartColorsList, slots, variants: variants$1 }) {
 	var _effectiveData$income3, _effectiveData$income4, _effectiveData$income5, _data$netProfit;
@@ -27442,7 +27585,7 @@ function Internal_ProfitAndLossSummaries({ actionable = false, revenueLabel, str
 	});
 }
 function ProfitAndLossSummaries(_ref) {
-	let { onTransactionsToReviewClick } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$19);
+	let { onTransactionsToReviewClick } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$21);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Internal_ProfitAndLossSummaries, _objectSpread2(_objectSpread2({}, restProps), {}, { slots: { unstable_AdditionalListItems: onTransactionsToReviewClick ? [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TransactionsToReview, {
 		variants: restProps.variants,
 		onClick: onTransactionsToReviewClick
@@ -28767,14 +28910,14 @@ const ChartOfAccountsContext = (0, react.createContext)({
 	changeFormData: () => {},
 	submitForm: () => {}
 });
-var _excluded$18 = ["size"];
-var Plus$7 = (_ref) => {
+var _excluded$20 = ["size"];
+var Plus$8 = (_ref) => {
 	let { size = 14 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 14 14",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$18)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$20)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -28790,7 +28933,7 @@ var Plus$7 = (_ref) => {
 		})]
 	}));
 };
-var Plus_default = Plus$7;
+var Plus_default = Plus$8;
 var getLedgerAccountBalancesCSV = get(({ businessId }) => `/v1/businesses/${businessId}/ledger/balances/exports/csv`);
 function buildKey$50({ access_token: accessToken, apiUrl, businessId, startCutoff, endCutoff }) {
 	if (accessToken && apiUrl) return {
@@ -29042,14 +29185,14 @@ let LedgerAccountNodeType = /* @__PURE__ */ function(LedgerAccountNodeType$1) {
 	LedgerAccountNodeType$1["Parent"] = "Parent";
 	return LedgerAccountNodeType$1;
 }({});
-var _excluded$17 = ["size"];
+var _excluded$19 = ["size"];
 var Edit2 = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$17)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$19)), {}, {
 		width: size,
 		height: size,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -30554,10 +30697,10 @@ const JournalEntryLineItem = ({ form, index, displayIndex, isReadOnly, onDeleteL
 		})
 	});
 };
-var EMPTY_ARRAY$1 = [];
+var EMPTY_ARRAY$2 = [];
 const JournalEntryLineItemsTable = ({ form, isReadOnly, title, direction, showTags = false }) => {
 	const { t } = (0, react_i18next.useTranslation)();
-	const lineItems = (0, __tanstack_react_form.useStore)(form.store, (state$14) => state$14.values.lineItems || EMPTY_ARRAY$1);
+	const lineItems = (0, __tanstack_react_form.useStore)(form.store, (state$14) => state$14.values.lineItems || EMPTY_ARRAY$2);
 	const filteredIndices = (0, react.useMemo)(() => {
 		const indices = [];
 		lineItems.forEach((item, index) => {
@@ -31592,14 +31735,14 @@ const TasksHeader = ({ tasksHeader }) => {
 		})
 	});
 };
-var _excluded$16 = ["size"];
+var _excluded$18 = ["size"];
 var SmileIcon = (_ref) => {
 	let { size = 12 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		viewBox: "0 0 12 12",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
-	}, _objectWithoutProperties(_ref, _excluded$16)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$18)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -31787,13 +31930,13 @@ function useSubmitUserResponseForTask() {
 		return Reflect.get(target, prop);
 	} });
 }
-var _excluded$15 = [
+var _excluded$17 = [
 	"className",
 	"isInvalid",
 	"errorMessage"
 ];
 const Textarea = (_ref) => {
-	let { className, isInvalid, errorMessage } = _ref, props = _objectWithoutProperties(_ref, _excluded$15);
+	let { className, isInvalid, errorMessage } = _ref, props = _objectWithoutProperties(_ref, _excluded$17);
 	const baseClassName$1 = (0, classnames.default)("Layer__textarea", isInvalid ? "Layer__textarea--error" : "", className);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DeprecatedTooltip, {
 		disabled: !isInvalid || !errorMessage,
@@ -32291,14 +32434,14 @@ const useBookkeepingYearsStatus = () => {
 		isLoading
 	};
 };
-var _excluded$14 = ["size"];
+var _excluded$16 = ["size"];
 var ArrowRightCircle = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$14)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$16)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -33535,14 +33678,14 @@ function LinkAccountsContent({ onComplete }) {
 		})
 	});
 }
-var _excluded$13 = ["size"];
+var _excluded$15 = ["size"];
 var CoffeeIcon = (_ref) => {
 	let { size = 11 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 12 12",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$13)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$15)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
@@ -33591,7 +33734,7 @@ var CoffeeIcon = (_ref) => {
 	}));
 };
 var Coffee_default = CoffeeIcon;
-var _excluded$12 = [
+var _excluded$14 = [
 	"className",
 	"children",
 	"variant",
@@ -33602,8 +33745,8 @@ var _excluded$12 = [
 	"justify",
 	"fullWidth"
 ];
-const Link = (_ref) => {
-	let { className, children, variant = ButtonVariant.primary, leftIcon, rightIcon, iconOnly, iconAsPrimary = false, justify = "center", fullWidth } = _ref, props = _objectWithoutProperties(_ref, _excluded$12);
+const Link$1 = (_ref) => {
+	let { className, children, variant = ButtonVariant.primary, leftIcon, rightIcon, iconOnly, iconAsPrimary = false, justify = "center", fullWidth } = _ref, props = _objectWithoutProperties(_ref, _excluded$14);
 	const linkRef = (0, react.useRef)(null);
 	let justifyContent = "center";
 	if (justify) justifyContent = justify;
@@ -33659,7 +33802,7 @@ const BookkeepingUpsellBar = ({ onClick, href }) => {
 			variant: ButtonVariant.secondary,
 			onClick,
 			children: t("bookkeeping:action.schedule_a_demo", "Schedule a demo")
-		}) : href ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Link, {
+		}) : href ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Link$1, {
 			href,
 			target: "_blank",
 			variant: ButtonVariant.secondary,
@@ -33701,14 +33844,14 @@ const useMileageSummaryGlobalCacheActions = () => {
 	const { invalidate } = useGlobalCacheActions();
 	return { invalidateMileageSummary: (0, react.useCallback)(() => invalidate(({ tags }) => tags.includes(MILEAGE_SUMMARY_TAG_KEY)), [invalidate]) };
 };
-var _excluded$11 = ["size"];
+var _excluded$13 = ["size"];
 var ArrowRightCircleAlt = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$11)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$13)), {}, {
 		width: size,
 		height: size,
 		children: [
@@ -34989,14 +35132,14 @@ function getCustomerName(customer) {
 	var _ref, _customer$individualN;
 	return (_ref = (_customer$individualN = customer === null || customer === void 0 ? void 0 : customer.individualName) !== null && _customer$individualN !== void 0 ? _customer$individualN : customer === null || customer === void 0 ? void 0 : customer.companyName) !== null && _ref !== void 0 ? _ref : "Unknown Customer";
 }
-var _excluded$10 = ["size"];
+var _excluded$12 = ["size"];
 var ChevronRightFill = (_ref) => {
 	let { size = 18 } = _ref;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", _objectSpread2(_objectSpread2({
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 18 18",
 		fill: "none"
-	}, _objectWithoutProperties(_ref, _excluded$10)), {}, {
+	}, _objectWithoutProperties(_ref, _excluded$12)), {}, {
 		width: size,
 		height: size,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
@@ -35027,8 +35170,7 @@ const DataTableHeader = ({ name: name$1, count, slotProps = {}, slots = {} }) =>
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 				align: "center",
 				gap: "sm",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
-					weight: "bold",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Heading, {
 					size: "md",
 					children: name$1
 				}), showCount && (totalCount ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badge, {
@@ -37019,9 +37161,9 @@ const useCustomerForm = (props) => {
 		submitError
 	}), [form, submitError]);
 };
-var _excluded$9 = ["onSuccess", "isReadOnly"];
+var _excluded$11 = ["onSuccess", "isReadOnly"];
 const CustomerForm = (_ref) => {
-	let { onSuccess, isReadOnly } = _ref, formState = _objectWithoutProperties(_ref, _excluded$9);
+	let { onSuccess, isReadOnly } = _ref, formState = _objectWithoutProperties(_ref, _excluded$11);
 	const { t } = (0, react_i18next.useTranslation)();
 	const { form, submitError } = useCustomerForm(_objectSpread2({ onSuccess }, formState));
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Form, {
@@ -37874,10 +38016,10 @@ const useInvoiceForm = (props) => {
 		submitError
 	]);
 };
-var _excluded$8 = ["isReadOnly"];
+var _excluded$10 = ["isReadOnly"];
 const InvoiceForm = (0, react.forwardRef)((props, ref) => {
 	var _accountingConfig$ena;
-	const _useInvoiceDetail = useInvoiceDetail(), { isReadOnly } = _useInvoiceDetail, viewState = _objectWithoutProperties(_useInvoiceDetail, _excluded$8);
+	const _useInvoiceDetail = useInvoiceDetail(), { isReadOnly } = _useInvoiceDetail, viewState = _objectWithoutProperties(_useInvoiceDetail, _excluded$10);
 	const { mode } = viewState;
 	const { onSuccess, onChangeFormState } = props;
 	const { businessId } = useLayerContext();
@@ -38323,7 +38465,7 @@ const InvoiceDetail = () => {
 		})
 	] });
 };
-var _excluded$7 = [
+var _excluded$9 = [
 	"className",
 	"label",
 	"meterOnly"
@@ -38334,7 +38476,7 @@ var getClassnameForSubComponent = (className, suffix) => {
 var METER_CLASS_NAME = "Layer__Meter";
 const Meter = (0, react.forwardRef)(function Meter$1(_ref, ref) {
 	let { className, label: label$50, meterOnly } = _ref;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Meter, _objectSpread2(_objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$7)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Meter, _objectSpread2(_objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$9)), {}, {
 		className: (0, classnames.default)(METER_CLASS_NAME, className),
 		ref
 	}, meterOnly && { "aria-label": label$50 }), {}, { children: ({ percentage, valueText }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
@@ -38777,7 +38919,7 @@ const Invoices = ({ stringOverrides }) => {
 var InvoicesContent = () => {
 	return useInvoiceRouteState().route === InvoiceRoute.Detail ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(InvoiceDetail, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(InvoiceOverview, {});
 };
-var _excluded$6 = ["containerRef", "stringOverrides"];
+var _excluded$8 = ["containerRef", "stringOverrides"];
 var COMPONENT_NAME$4 = "profit-and-loss";
 const ProfitAndLossView = (props) => {
 	const containerRef = (0, react.useRef)(null);
@@ -38788,7 +38930,7 @@ const ProfitAndLossView = (props) => {
 	});
 };
 var ProfitAndLossPanel = (_ref) => {
-	let { containerRef, stringOverrides } = _ref, props = _objectWithoutProperties(_ref, _excluded$6);
+	let { containerRef, stringOverrides } = _ref, props = _objectWithoutProperties(_ref, _excluded$8);
 	const { t } = (0, react_i18next.useTranslation)();
 	const { sidebarScope } = (0, react.useContext)(ProfitAndLossContext);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Panel, {
@@ -38829,39 +38971,6 @@ var Components = ({ hideChart = false, hideTable = false, stringOverrides }) =>
 		})]
 	}), !hideTable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfitAndLossTableWithProvider, { stringOverrides: stringOverrides === null || stringOverrides === void 0 ? void 0 : stringOverrides.profitAndLossTable })] });
 };
-let ReportControl = /* @__PURE__ */ function(ReportControl$1) {
-	ReportControl$1["Date"] = "date";
-	ReportControl$1["DateRange"] = "date_range";
-	ReportControl$1["GroupBy"] = "group_by";
-	ReportControl$1["Unknown"] = "unknown";
-	return ReportControl$1;
-}({});
-let ReportGroupType = /* @__PURE__ */ function(ReportGroupType$1) {
-	ReportGroupType$1["Accounting"] = "accounting";
-	ReportGroupType$1["Unknown"] = "unknown";
-	return ReportGroupType$1;
-}({});
-var ReportControlSchema = effect.Schema.Enums(ReportControl);
-var ReportGroupTypeSchema = effect.Schema.Enums(ReportGroupType);
-var TransformedReportControlSchema = createTransformedEnumSchema(ReportControlSchema, ReportControl, ReportControl.Unknown);
-var TransformedReportGroupTypeSchema = createTransformedEnumSchema(ReportGroupTypeSchema, ReportGroupType, ReportGroupType.Unknown);
-const ReportConfigSchema = effect.Schema.Struct({
-	key: effect.Schema.String,
-	reportRoute: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("report_route")),
-	displayName: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("display_name")),
-	controls: effect.Schema.Array(TransformedReportControlSchema),
-	baseQueryParameters: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.Record({
-		key: effect.Schema.String,
-		value: effect.Schema.String
-	})), effect.Schema.fromKey("base_query_parameters")),
-	isDefaultReport: effect.Schema.optional(effect.Schema.Boolean).pipe(effect.Schema.fromKey("is_default_report"))
-});
-const ReportGroupSchema = effect.Schema.Struct({
-	groupType: (0, effect.pipe)(effect.Schema.propertySignature(TransformedReportGroupTypeSchema), effect.Schema.fromKey("group_type")),
-	displayName: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.String), effect.Schema.fromKey("display_name")),
-	reports: effect.Schema.Array(ReportConfigSchema)
-});
-const ReportConfigResponseSchema = effect.Schema.Struct({ data: effect.Schema.Array(ReportGroupSchema) });
 const REPORT_CONFIG_TAG_KEY = "#report-config";
 var getReportConfig = get(({ businessId }) => `/v1/businesses/${businessId}/reports/config`);
 function buildKey$26({ access_token: accessToken, apiUrl, businessId }) {
@@ -38890,11 +38999,14 @@ const hasControl = (report, control) => {
 	return (_report$controls$incl = report === null || report === void 0 ? void 0 : report.controls.includes(control)) !== null && _report$controls$incl !== void 0 ? _report$controls$incl : false;
 };
 var UnifiedReportStoreContext = (0, react.createContext)((0, zustand.createStore)(() => ({
-	report: null,
+	baseReport: null,
+	detailReportConfig: null,
 	groupBy: DateGroupBy.AllTime,
 	dateSelectionMode: "full",
 	actions: {
-		setReport: () => {},
+		setBaseReport: () => {},
+		openDetailReport: () => {},
+		closeDetailReport: () => {},
 		setGroupBy: () => {}
 	}
 })));
@@ -38903,12 +39015,43 @@ function useUnifiedReportDateSelectionMode() {
 }
 function useActiveUnifiedReport() {
 	const store = (0, react.useContext)(UnifiedReportStoreContext);
-	const report = (0, zustand.useStore)(store, (state$14) => state$14.report);
-	const setReport = (0, zustand.useStore)(store, (state$14) => state$14.actions.setReport);
+	const baseReport = (0, zustand.useStore)(store, (state$14) => state$14.baseReport);
+	const detailReportConfig = (0, zustand.useStore)(store, (state$14) => state$14.detailReportConfig);
+	return (0, react.useMemo)(() => {
+		var _detailReportConfig$r;
+		return {
+			report: (_detailReportConfig$r = detailReportConfig === null || detailReportConfig === void 0 ? void 0 : detailReportConfig.report) !== null && _detailReportConfig$r !== void 0 ? _detailReportConfig$r : baseReport,
+			isDetailView: detailReportConfig != null
+		};
+	}, [baseReport, detailReportConfig]);
+}
+function useBaseUnifiedReport() {
+	const store = (0, react.useContext)(UnifiedReportStoreContext);
+	const baseReport = (0, zustand.useStore)(store, (state$14) => state$14.baseReport);
+	const setBaseReport = (0, zustand.useStore)(store, (state$14) => state$14.actions.setBaseReport);
 	return (0, react.useMemo)(() => ({
-		report,
-		setReport
-	}), [report, setReport]);
+		baseReport,
+		setBaseReport
+	}), [baseReport, setBaseReport]);
+}
+function useDetailUnifiedReport() {
+	const store = (0, react.useContext)(UnifiedReportStoreContext);
+	const detailReportConfig = (0, zustand.useStore)(store, (state$14) => state$14.detailReportConfig);
+	const openDetailReport = (0, zustand.useStore)(store, (state$14) => state$14.actions.openDetailReport);
+	const closeDetailReport = (0, zustand.useStore)(store, (state$14) => state$14.actions.closeDetailReport);
+	return (0, react.useMemo)(() => ({
+		detailReportConfig,
+		isDetailView: detailReportConfig != null,
+		openDetailReport,
+		closeDetailReport
+	}), [
+		detailReportConfig,
+		openDetailReport,
+		closeDetailReport
+	]);
+}
+function useOpenDetailReport() {
+	return (0, zustand.useStore)((0, react.useContext)(UnifiedReportStoreContext), (state$14) => state$14.actions.openDetailReport);
 }
 function useUnifiedReportGroupByParam() {
 	const store = (0, react.useContext)(UnifiedReportStoreContext);
@@ -38949,27 +39092,33 @@ var findDefaultReport = (groups) => {
 };
 var hasReportWithKey = (groups, key) => groups.some((group) => group.reports.some((report) => report.key === key));
 var createUnifiedReportStore = (dateSelectionMode) => (0, zustand.createStore)((set$1) => ({
-	report: null,
+	baseReport: null,
+	detailReportConfig: null,
 	groupBy: DateGroupBy.AllTime,
 	dateSelectionMode,
 	actions: {
-		setReport: (report) => set$1({ report }),
+		setBaseReport: (baseReport) => set$1({
+			baseReport,
+			detailReportConfig: null
+		}),
+		openDetailReport: (detailReportConfig) => set$1({ detailReportConfig }),
+		closeDetailReport: () => set$1({ detailReportConfig: null }),
 		setGroupBy: (groupBy) => set$1({ groupBy })
 	}
 }));
 function useHydrateUnifiedReportStore(store) {
 	const { data } = useReportConfig();
-	const report = (0, zustand.useStore)(store, (state$14) => state$14.report);
-	const setReport = (0, zustand.useStore)(store, (state$14) => state$14.actions.setReport);
+	const baseReport = (0, zustand.useStore)(store, (state$14) => state$14.baseReport);
+	const setBaseReport = (0, zustand.useStore)(store, (state$14) => state$14.actions.setBaseReport);
 	(0, react.useEffect)(() => {
 		if (!data) return;
-		if (report && hasReportWithKey(data, report.key)) return;
+		if (baseReport && hasReportWithKey(data, baseReport.key)) return;
 		const defaultReport = findDefaultReport(data);
-		if (defaultReport) setReport(defaultReport);
+		if (defaultReport) setBaseReport(defaultReport);
 	}, [
 		data,
-		report,
-		setReport
+		baseReport,
+		setBaseReport
 	]);
 }
 function useSyncExternalDateSelectionMode(store, dateSelectionMode) {
@@ -39002,12 +39151,12 @@ function ExpandableDataTableProvider({ children }) {
 		children
 	});
 }
-var _excluded$5 = ["children", "className"], _excluded2$2 = ["children"], _excluded3 = ["children"];
+var _excluded$7 = ["children", "className"], _excluded2$3 = ["children"], _excluded3 = ["children"];
 var TREE_CLASS_NAME = "Layer__UI__Tree";
 var TREE_ITEM_CLASS_NAME = "Layer__UI__TreeItem";
 var TreeInner = (_ref, ref) => {
 	let { children, className } = _ref;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Tree, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$5)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Tree, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$7)), {}, {
 		className: (0, classnames.default)(TREE_CLASS_NAME, className),
 		ref,
 		children: withRenderProp(children, (node) => node)
@@ -39017,7 +39166,7 @@ const Tree = (0, react.forwardRef)(TreeInner);
 Tree.displayName = "Tree";
 var TreeItemInner = (_ref2, ref) => {
 	let { children } = _ref2;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.TreeItem, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref2, _excluded2$2)), {}, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.TreeItem, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref2, _excluded2$3)), {}, {
 		className: TREE_ITEM_CLASS_NAME,
 		ref,
 		children: withRenderProp(children, (node) => node)
@@ -39077,11 +39226,7 @@ var renderTreeLeaf = ({ leaf, leafConfig }) => /* @__PURE__ */ (0, react_jsx_run
 	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TreeItemContent, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 		align: "center",
 		justify: "space-between",
-		children: [leafConfig.renderLabel(leaf), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check_default, {
-			className: "Layer__TreeNavigation__Check",
-			width: 14,
-			height: 14
-		})]
+		children: [leafConfig.renderLabel(leaf), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check_default, { className: "Layer__TreeNavigation__Check" })]
 	}) })
 });
 function TreeNavigation({ items, selectedItem, isGroup: isGroup$1, groupConfig: groupConfig$1, leafConfig, ariaLabel }) {
@@ -39176,31 +39321,16 @@ var ReportsNavigationError = () => {
 		spacing: true
 	});
 };
-var REPORT_GROUP_ICON = {
-	[ReportGroupType.Accounting]: lucide_react.Landmark,
-	[ReportGroupType.Unknown]: Folder_default
-};
 var isReportGroup = (item) => "reports" in item;
 var groupConfig = {
 	getId: (group) => group.groupType,
 	getTextValue: (group) => group.displayName,
 	getChildren: (group) => group.reports,
 	renderLabel: (group) => {
-		const Icon = REPORT_GROUP_ICON[group.groupType];
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
-			className: "Layer__ReportsNavigation__GroupLabel",
-			gap: "sm",
-			align: "center",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
-				className: "Layer__ReportsNavigation__GroupIcon",
-				strokeWidth: 1.5,
-				size: 16
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
-				ellipsis: true,
-				variant: "subtle",
-				weight: "bold",
-				children: group.displayName
-			})]
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+			ellipsis: true,
+			weight: "bold",
+			children: group.displayName
 		});
 	}
 };
@@ -39216,8 +39346,8 @@ var buildLeafConfig = (onSelectLeaf) => ({
 function ReportsNavigation() {
 	const { t } = (0, react_i18next.useTranslation)();
 	const { data, isLoading, isError } = useReportConfig();
-	const { report, setReport } = useActiveUnifiedReport();
-	const leafConfig = (0, react.useMemo)(() => buildLeafConfig(setReport), [setReport]);
+	const { baseReport, setBaseReport } = useBaseUnifiedReport();
+	const leafConfig = (0, react.useMemo)(() => buildLeafConfig(setBaseReport), [setBaseReport]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConditionalBlock, {
 		data,
 		isLoading,
@@ -39226,11 +39356,11 @@ function ReportsNavigation() {
 		isError,
 		Error: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ReportsNavigationError, {}),
 		children: ({ data: data$1 }) => {
-			var _report$key;
+			var _baseReport$key;
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TreeNavigation, {
 				ariaLabel: t("reports:label.reports_navigation", "Reports navigation"),
 				items: data$1,
-				selectedItem: (_report$key = report === null || report === void 0 ? void 0 : report.key) !== null && _report$key !== void 0 ? _report$key : null,
+				selectedItem: (_baseReport$key = baseReport === null || baseReport === void 0 ? void 0 : baseReport.key) !== null && _baseReport$key !== void 0 ? _baseReport$key : null,
 				isGroup: isReportGroup,
 				groupConfig,
 				leafConfig
@@ -39238,7 +39368,7 @@ function ReportsNavigation() {
 		}
 	});
 }
-var _excluded$4 = ["businessId", "route"], _excluded2$1 = [
+var _excluded$6 = ["businessId", "route"], _excluded2$2 = [
 	"accessToken",
 	"apiUrl",
 	"businessId",
@@ -39255,7 +39385,7 @@ function buildKey$25({ access_token: accessToken, apiUrl, businessId, params })
 }
 var getUnifiedReport = get((_ref) => {
 	let { businessId, route } = _ref;
-	return `/v1/businesses/${businessId}/reports/unified/${route}?${toDefinedSearchParameters(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$4)))}`;
+	return `/v1/businesses/${businessId}/reports/unified/${route}?${toDefinedSearchParameters(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$6)))}`;
 });
 function useUnifiedReport() {
 	const withLocale = useLocalizedKey();
@@ -39268,7 +39398,7 @@ function useUnifiedReport() {
 		businessId,
 		params
 	}))), (_ref2) => {
-		let { accessToken, apiUrl: apiUrl$1, businessId: businessId$1, tags } = _ref2, restParams = _objectWithoutProperties(_ref2, _excluded2$1);
+		let { accessToken, apiUrl: apiUrl$1, businessId: businessId$1, tags } = _ref2, restParams = _objectWithoutProperties(_ref2, _excluded2$2);
 		return getUnifiedReport(apiUrl$1, accessToken, { params: _objectSpread2({ businessId: businessId$1 }, restParams) })().then(({ data }) => effect.Schema.decodeUnknownPromise(UnifiedReportSchema)(data));
 	}));
 }
@@ -39281,10 +39411,10 @@ const ExpandButton = ({ isExpanded }) => {
 	});
 };
 var getRowIndentStyle = ({ depth, canExpand }) => ({ paddingInlineStart: depth * 20 + (canExpand ? 0 : 4) });
-var EMPTY_ARRAY = [];
-function ExpandableDataTable({ data, isLoading, isError, columnConfig, componentName, ariaLabel, slots, hideHeader, getSubRows: getSubRows$2, getRowId: getRowId$1 }) {
+var EMPTY_ARRAY$1 = [];
+function ExpandableDataTable({ data, isLoading, isError, columnConfig, componentName, ariaLabel, slots, getSubRows: getSubRows$2, getRowId: getRowId$1 }) {
 	const { expanded, setExpanded } = (0, react.useContext)(ExpandableDataTableContext);
-	const columnDefs = getColumnDefs((0, react.useMemo)(() => {
+	const wrappedColumnConfig = (0, react.useMemo)(() => {
 		const [first, ...rest] = columnConfig;
 		if (!first || !isLeafColumn(first)) return columnConfig;
 		const originalFirstCell = first.cell;
@@ -39307,14 +39437,19 @@ function ExpandableDataTable({ data, isLoading, isError, columnConfig, component
 				})
 			});
 		} }), ...rest];
-	}, [columnConfig]));
+	}, [columnConfig]);
+	const columnDefs = getColumnDefs(wrappedColumnConfig);
+	const columnPinning = (0, react.useMemo)(() => getColumnPinning(wrappedColumnConfig), [wrappedColumnConfig]);
 	const table$1 = (0, __tanstack_react_table.useReactTable)({
-		data: data !== null && data !== void 0 ? data : EMPTY_ARRAY,
+		data: data !== null && data !== void 0 ? data : EMPTY_ARRAY$1,
 		columns: columnDefs,
 		getSubRows: getSubRows$2,
 		getCoreRowModel: (0, __tanstack_react_table.getCoreRowModel)(),
 		getExpandedRowModel: (0, __tanstack_react_table.getExpandedRowModel)(),
-		state: { expanded },
+		state: {
+			expanded,
+			columnPinning
+		},
 		onExpandedChange: setExpanded,
 		autoResetPageIndex: false,
 		getRowId: getRowId$1
@@ -39337,7 +39472,6 @@ function ExpandableDataTable({ data, isLoading, isError, columnConfig, component
 		isError,
 		componentName,
 		slots,
-		hideHeader,
 		dependencies: dependencies$1,
 		headerGroups,
 		withClickableRow: (0, react.useMemo)(() => ({
@@ -39346,9 +39480,10 @@ function ExpandableDataTable({ data, isLoading, isError, columnConfig, component
 		}), [onRowClick, isRowClickable])
 	});
 }
-const UnifiedReportTableCellContent = ({ cell }) => {
+const UnifiedReportTableCellContent = ({ cell, column, breadcrumb }) => {
 	var _cell$format;
 	const { formatDate: formatDate$1 } = useIntlFormatter();
+	const openDetailReport = useOpenDetailReport();
 	if (!cell) return;
 	const cellValue = cell.value;
 	const isBold = (_cell$format = cell.format) === null || _cell$format === void 0 ? void 0 : _cell$format.bold;
@@ -39374,16 +39509,57 @@ const UnifiedReportTableCellContent = ({ cell }) => {
 		variant,
 		children: String(cellValue.value)
 	});
+	if (cell.reportConfig) {
+		const reportConfig = cell.reportConfig;
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+			variant: "text",
+			onClick: () => openDetailReport({
+				report: reportConfig,
+				column,
+				breadcrumb
+			}),
+			children: content
+		});
+	}
 	return content;
 };
+var getCell = (row, col) => row.original.cells[col.columnKey];
 var isGroupColumn = (col) => col.columns !== void 0 && col.columns.length > 0;
+var toPinningSide = (pinning) => {
+	switch (pinning) {
+		case Pinning.Left: return "left";
+		case Pinning.Right: return "right";
+		default: return;
+	}
+};
 var makeBaseColumn = (col) => ({
 	id: col.columnKey,
 	header: col.displayName,
 	isRowHeader: col.isRowHeader,
 	alignment: col.alignment
 });
-var makeLeafColumn = (col) => _objectSpread2(_objectSpread2({}, makeBaseColumn(col)), {}, { cell: (row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnifiedReportTableCellContent, { cell: row.original.cells[col.columnKey] }) });
+var makeLeafColumn = (col) => _objectSpread2(_objectSpread2({}, makeBaseColumn(col)), {}, {
+	pinning: toPinningSide(col.pinning),
+	cell: (row) => {
+		var _cell$reportConfig;
+		const cell = getCell(row, col);
+		const cellConfig = (_cell$reportConfig = cell === null || cell === void 0 ? void 0 : cell.reportConfig) !== null && _cell$reportConfig !== void 0 ? _cell$reportConfig : null;
+		const breadcrumb = cellConfig ? [cellConfig] : [];
+		let parentRow = row.getParentRow();
+		while (parentRow) {
+			var _getCell;
+			const parentConfig = (_getCell = getCell(parentRow, col)) === null || _getCell === void 0 ? void 0 : _getCell.reportConfig;
+			if (!parentConfig) break;
+			breadcrumb.push(parentConfig);
+			parentRow = parentRow.getParentRow();
+		}
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnifiedReportTableCellContent, {
+			cell,
+			column: col,
+			breadcrumb: breadcrumb.reverse()
+		});
+	}
+});
 var makeGroupColumn = (col) => _objectSpread2(_objectSpread2({}, makeBaseColumn(col)), {}, { columns: buildNestedColumnConfig(col.columns) });
 const buildNestedColumnConfig = (columns) => {
 	return columns.map((col) => {
@@ -39443,7 +39619,7 @@ const S3PresignedUrlSchema = effect.Schema.Struct({
 	createdAt: effect.Schema.Date,
 	documentId: effect.Schema.NullishOr(effect.Schema.UUID)
 });
-var _excluded$3 = ["businessId", "route"], _excluded2 = [
+var _excluded$5 = ["businessId", "route"], _excluded2$1 = [
 	"accessToken",
 	"apiUrl",
 	"businessId",
@@ -39451,7 +39627,7 @@ var _excluded$3 = ["businessId", "route"], _excluded2 = [
 ];
 var getUnifiedReportExcel = get((_ref) => {
 	let { businessId, route } = _ref;
-	return `/v1/businesses/${businessId}/reports/unified/${route}/exports/excel?${toDefinedSearchParameters(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$3)))}`;
+	return `/v1/businesses/${businessId}/reports/unified/${route}/exports/excel?${toDefinedSearchParameters(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$5)))}`;
 });
 var getTag = (report) => `#unified-${report}-report-excel`;
 var UnifiedReportExcelReturnSchema = effect.Schema.Struct({ data: S3PresignedUrlSchema });
@@ -39474,7 +39650,7 @@ function useUnifiedReportExcel({ onSuccess } = {}) {
 		businessId,
 		params
 	}))), (_ref2) => {
-		let { accessToken, apiUrl: apiUrl$1, businessId: businessId$1, tags } = _ref2, restParams = _objectWithoutProperties(_ref2, _excluded2);
+		let { accessToken, apiUrl: apiUrl$1, businessId: businessId$1, tags } = _ref2, restParams = _objectWithoutProperties(_ref2, _excluded2$1);
 		return getUnifiedReportExcel(apiUrl$1, accessToken, { params: _objectSpread2({ businessId: businessId$1 }, restParams) })().then(effect.Schema.decodeUnknownPromise(UnifiedReportExcelReturnSchema)).then(function() {
 			var _ref3 = _asyncToGenerator(function* ({ data }) {
 				if (onSuccess) yield onSuccess(data);
@@ -39503,9 +39679,9 @@ function UnifiedReportDownloadButton() {
 		children: [isError ? t("common:action.retry_label", "Retry") : t("common:action.download_label", "Download"), isError ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RefreshCcw_default, { size: 12 }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DownloadCloud_default, { size: 16 })]
 	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(InvisibleDownload_default, { ref: invisibleDownloadRef })] });
 }
-const UnifiedReportTableHeader = () => {
+const UnifiedReportBaseHeader = () => {
 	const { t } = (0, react_i18next.useTranslation)();
-	const { report } = useActiveUnifiedReport();
+	const { baseReport } = useBaseUnifiedReport();
 	const { groupBy, setGroupBy } = useUnifiedReportGroupByParam();
 	const dateSelectionMode = useUnifiedReportDateSelectionMode();
 	const { expanded, setExpanded } = (0, react.useContext)(ExpandableDataTableContext);
@@ -39516,46 +39692,154 @@ const UnifiedReportTableHeader = () => {
 	}, [setExpanded, shouldCollapse]);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
 		gap: "lg",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(HStack, {
-			pis: "lg",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+			pi: "lg",
 			pbs: "lg",
-			children: report ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+			align: "center",
+			justify: "space-between",
+			children: [baseReport ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
 				size: "lg",
 				weight: "bold",
-				children: report.displayName
+				children: baseReport.displayName
 			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SkeletonLoader, {
 				width: "192px",
 				height: "24px"
-			})
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+				gap: "xs",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+					variant: "outlined",
+					onClick: onClickExpandOrCollapse,
+					children: shouldCollapse ? t("reports:action.collapse_all", "Collapse All") : t("reports:action.expand_all", "Expand All")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnifiedReportDownloadButton, {})]
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HStack, {
 			fluid: true,
-			justify: "space-between",
 			align: "end",
 			pbe: "lg",
 			className: "Layer__UnifiedReport__Header",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 				pi: "lg",
 				gap: "xs",
 				children: [
-					hasControl(report, ReportControl.DateRange) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CombinedDateRangeSelection, { mode: dateSelectionMode }),
-					hasControl(report, ReportControl.Date) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CombinedDateSelection, { mode: dateSelectionMode }),
-					dateSelectionMode === "full" && hasControl(report, ReportControl.GroupBy) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DateGroupByComboBox, {
+					hasControl(baseReport, ReportControl.DateRange) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CombinedDateRangeSelection, { mode: dateSelectionMode }),
+					hasControl(baseReport, ReportControl.Date) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CombinedDateSelection, { mode: dateSelectionMode }),
+					dateSelectionMode === "full" && hasControl(baseReport, ReportControl.GroupBy) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DateGroupByComboBox, {
 						value: groupBy,
 						onValueChange: setGroupBy
 					})
 				]
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
-				pi: "lg",
-				className: "Layer__UnifiedReport__Header__SecondaryActions",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
-					variant: "outlined",
-					onClick: onClickExpandOrCollapse,
-					children: shouldCollapse ? t("reports:action.collapse_all", "Collapse All") : t("reports:action.expand_all", "Expand All")
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnifiedReportDownloadButton, {})]
+			})
+		})]
+	});
+};
+var _excluded$4 = [
+	"children",
+	"size",
+	"ellipsis",
+	"external",
+	"disabled",
+	"href",
+	"target",
+	"rel"
+];
+var LINK_CLASS_NAME = "Layer__UI__Link";
+const Link = (0, react.forwardRef)(function Link$3(_ref, ref) {
+	let { children, size = "md", ellipsis, external, disabled, href, target, rel } = _ref, restProps = _objectWithoutProperties(_ref, _excluded$4);
+	const dataProperties = toDataProperties({
+		size,
+		ellipsis,
+		external,
+		disabled
+	});
+	const effectiveTarget = external ? "_blank" : target;
+	const effectiveRel = external ? "noopener noreferrer" : rel;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Link, _objectSpread2(_objectSpread2(_objectSpread2({}, restProps), dataProperties), {}, {
+		href,
+		target: effectiveTarget,
+		rel: effectiveRel,
+		className: LINK_CLASS_NAME,
+		ref,
+		children
+	}));
+});
+var _excluded$3 = ["children"], _excluded2 = ["id", "children"];
+var BREADCRUMBS_CLASS_NAME = "Layer__Breadcrumbs";
+var BREADCRUMB_CLASS_NAME = "Layer__Breadcrumb";
+function BreadcrumbsInner(_ref, ref) {
+	let { children } = _ref;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Breadcrumbs, _objectSpread2(_objectSpread2({}, _objectWithoutProperties(_ref, _excluded$3)), {}, {
+		className: BREADCRUMBS_CLASS_NAME,
+		ref,
+		children
+	}));
+}
+const Breadcrumbs = (0, react.forwardRef)(BreadcrumbsInner);
+const Breadcrumb = (0, react.forwardRef)(function Breadcrumb$1(_ref2, ref) {
+	let { id, children } = _ref2, linkProps = _objectWithoutProperties(_ref2, _excluded2);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_aria_components.Breadcrumb, {
+		id,
+		className: BREADCRUMB_CLASS_NAME,
+		ref,
+		children: ({ isCurrent }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Link, _objectSpread2(_objectSpread2({}, linkProps), {}, { children })), !isCurrent && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronRight_default, {})] })
+	});
+});
+var EMPTY_ARRAY = [];
+const UnifiedReportDetailBreadcrumb = () => {
+	const { detailReportConfig, openDetailReport } = useDetailUnifiedReport();
+	const breadcrumb = detailReportConfig === null || detailReportConfig === void 0 ? void 0 : detailReportConfig.breadcrumb;
+	const breadcrumbItems = (0, react.useMemo)(() => breadcrumb !== null && breadcrumb !== void 0 ? breadcrumb : EMPTY_ARRAY, [breadcrumb]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Breadcrumbs, {
+		items: breadcrumbItems,
+		onAction: (0, react.useCallback)((key) => {
+			const index = breadcrumbItems.findIndex((item) => item.key === key);
+			if (index === -1 || !detailReportConfig) return;
+			openDetailReport({
+				report: breadcrumbItems[index],
+				breadcrumb: breadcrumbItems.slice(0, index + 1),
+				column: detailReportConfig === null || detailReportConfig === void 0 ? void 0 : detailReportConfig.column
+			});
+		}, [
+			breadcrumbItems,
+			detailReportConfig,
+			openDetailReport
+		]),
+		children: (item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Breadcrumb, {
+			id: item.key,
+			children: item.displayName
+		})
+	});
+};
+const UnifiedReportDetailHeader = () => {
+	const { detailReportConfig, closeDetailReport } = useDetailUnifiedReport();
+	const { t } = (0, react_i18next.useTranslation)();
+	if (!detailReportConfig) return null;
+	const { column } = detailReportConfig;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+		gap: "sm",
+		pb: "lg",
+		pis: "lg",
+		align: "center",
+		className: "Layer__UnifiedReport__DetailHeader",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+			icon: true,
+			variant: "outlined",
+			onClick: closeDetailReport,
+			"aria-label": t("common:action.back", "Back"),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronLeft_default, { size: 16 })
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
+			gap: "3xs",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnifiedReportDetailBreadcrumb, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+				size: "sm",
+				variant: "subtle",
+				children: column.displayName
 			})]
 		})]
 	});
 };
+const UnifiedReportTableHeader = () => {
+	const { isDetailView } = useDetailUnifiedReport();
+	return isDetailView ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnifiedReportDetailHeader, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnifiedReportBaseHeader, {});
+};
 const UnifiedReport = ({ dateSelectionMode }) => {
 	const { t } = (0, react_i18next.useTranslation)();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(View, {
@@ -44923,6 +45207,7 @@ const StartTrackerSchema = effect.Schema.Struct({
 	memo: effect.Schema.NullishOr(effect.Schema.String),
 	metadata: effect.Schema.NullishOr(effect.Schema.Unknown)
 });
+const StopTrackerSchema = effect.Schema.Struct({ date: CalendarDateSchema });
 const ACTIVE_TIME_TRACKER_TAG_KEY = "#active-time-tracker";
 var ActiveTimeTrackerResponseSchema = effect.Schema.Struct({ data: effect.Schema.Struct({ timeEntry: (0, effect.pipe)(effect.Schema.propertySignature(effect.Schema.NullishOr(TimeEntrySchema)), effect.Schema.fromKey("time_entry")) }) });
 var getActiveTimeTracker = get(({ businessId }) => `/v1/businesses/${businessId}/time-tracking/tracker/active`);
@@ -45414,10 +45699,13 @@ function ActiveServicesContent({ services: services$2, showCreateForm, showAddBu
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
 		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConditionalList, {
 			list: services$2,
-			Empty: (0, react.useMemo)(() => showCreateForm ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataState, {
-				status: DataStateStatus.allDone,
-				title: t("timeTracking:services.no_active", "No services yet"),
-				spacing: true
+			Empty: (0, react.useMemo)(() => showCreateForm ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VStack, {
+				className: "Layer__TimeTrackingServicesDrawer__EmptyState",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataState, {
+					status: DataStateStatus.allDone,
+					title: t("timeTracking:services.no_active", "No services yet"),
+					spacing: true
+				})
 			}), [showCreateForm, t]),
 			Container: ({ children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VStack, {
 				className: "Layer__TimeTrackingServicesDrawer__accordion",
@@ -45476,10 +45764,13 @@ function ArchivedServicesContent({ isEnabled, formatHourly, onRestore }) {
 		Error: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoadServicesErrorState, {}),
 		children: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConditionalList, {
 			list: archivedServices,
-			Empty: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataState, {
-				status: DataStateStatus.allDone,
-				title: t("timeTracking:services.no_archived", "No archived services"),
-				spacing: true
+			Empty: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VStack, {
+				className: "Layer__TimeTrackingServicesDrawer__EmptyState",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataState, {
+					status: DataStateStatus.allDone,
+					title: t("timeTracking:services.no_archived", "No archived services"),
+					spacing: true
+				})
 			}),
 			Container: ({ children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VStack, {
 				className: "Layer__TimeTrackingServicesDrawer__archivedList",
@@ -46051,7 +46342,10 @@ const useStopTimeTracker = () => {
 	const { forceReloadTimeEntries } = useTimeEntriesGlobalCacheActions();
 	const { invalidateTimeTrackingSummary } = useTimeTrackingSummaryGlobalCacheActions();
 	const { invalidateActiveTimeTracker } = useActiveTimeTrackerGlobalCacheActions();
-	const mutationResponse = new SWRMutationResult((0, swr_mutation.default)(() => withLocale(buildKey$2(_objectSpread2(_objectSpread2({}, data), {}, { businessId }))), ({ accessToken, apiUrl, businessId: businessId$1 }) => stopTimeTracker(apiUrl, accessToken, { params: { businessId: businessId$1 } }).then(effect.Schema.decodeUnknownPromise(StopTimeTrackerResponseSchema)), {
+	const mutationResponse = new SWRMutationResult((0, swr_mutation.default)(() => withLocale(buildKey$2(_objectSpread2(_objectSpread2({}, data), {}, { businessId }))), ({ accessToken, apiUrl, businessId: businessId$1 }, { arg: body }) => stopTimeTracker(apiUrl, accessToken, {
+		params: { businessId: businessId$1 },
+		body
+	}).then(effect.Schema.decodeUnknownPromise(StopTimeTrackerResponseSchema)), {
 		revalidate: false,
 		throwOnError: true
 	}));
@@ -46073,6 +46367,12 @@ const useStopTimeTracker = () => {
 		return Reflect.get(target, prop);
 	} });
 };
+var isNoActiveTimerResponse = (error$38) => {
+	var _error$messages;
+	if (!(error$38 instanceof APIError)) return false;
+	if (error$38.code === 404) return true;
+	return ((_error$messages = error$38.messages) === null || _error$messages === void 0 ? void 0 : _error$messages.some((m) => m.error_enum === ApiEnumErrorType.SpecifiedIdNotFound)) === true;
+};
 const useActiveTimerBannerForm = ({ activeEntry }) => {
 	const { t } = (0, react_i18next.useTranslation)();
 	const [actionError, setActionError] = (0, react.useState)(null);
@@ -46098,9 +46398,10 @@ const useActiveTimerBannerForm = ({ activeEntry }) => {
 					return;
 				}
 				try {
-					yield stopTimeTracker$1();
-				} catch (_unused2) {
-					setActionError(t("timeTracking:error.complete_timer", "Failed to complete timer. Please try again."));
+					yield stopTimeTracker$1({ date: (0, __internationalized_date.today)((0, __internationalized_date.getLocalTimeZone)()).toString() });
+				} catch (error$38) {
+					if (isNoActiveTimerResponse(error$38)) setActionError(t("timeTracking:error.complete_timer_stale", "This timer was already completed or cancelled. Reload the page."));
+					else setActionError(t("timeTracking:error.complete_timer", "Failed to complete timer. Please try again."));
 				}
 			});
 			return function(_x) {
@@ -46146,7 +46447,7 @@ const useActiveTimerBannerForm = ({ activeEntry }) => {
 		try {
 			yield deleteTimeEntry$1();
 			invalidateActiveTimeTracker();
-		} catch (_unused3) {
+		} catch (_unused2) {
 			setActionError(t("timeTracking:error.cancel_timer", "Failed to cancel timer. Please try again."));
 		}
 	}), [
@@ -46182,16 +46483,21 @@ const useActiveTimerBannerForm = ({ activeEntry }) => {
 		isUpdating
 	]);
 };
+function getServiceLabel(service, t) {
+	return service.archivedAt ? t("timeTracking:services.archived_service", "{{name}} (Archived)", { name: service.name }) : service.name;
+}
 var ServiceAsOption = class {
-	constructor(service) {
+	constructor(service, t) {
 		_defineProperty(this, "internalService", void 0);
+		_defineProperty(this, "t", void 0);
 		this.internalService = service;
+		this.t = t;
 	}
 	get original() {
 		return this.internalService;
 	}
 	get label() {
-		return this.internalService.name;
+		return getServiceLabel(this.internalService, this.t);
 	}
 	get id() {
 		return this.internalService.id;
@@ -46200,16 +46506,23 @@ var ServiceAsOption = class {
 		return this.internalService.id;
 	}
 };
-var formatCreateLabel = (inputValue, t) => inputValue ? t("timeTracking:services.create_service_input_value", "Create service \"{{inputValue}}\"", { inputValue }) : t("timeTracking:services.add_service", "Add service");
-function TimeEntryServiceSelector({ selectedServiceId, onSelectedServiceIdChange, placeholder, isReadOnly, isClearable, inline, className, showLabel = true, isCreatable, onCreateService }) {
+var formatCreateLabel = (inputValue, t) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Span, {
+	variant: "inherit",
+	className: "Layer__TimeEntryServiceSelector__CreateLabel",
+	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, {
+		size: 14,
+		"aria-hidden": "true"
+	}), inputValue ? t("timeTracking:services.create_service_input_value", "Create service \"{{inputValue}}\"", { inputValue }) : t("timeTracking:services.add_service", "Add service")]
+});
+function TimeEntryServiceSelector({ selectedServiceId, onSelectedServiceIdChange, placeholder, isReadOnly, isClearable, inline, className, showLabel = true, allowArchived, isCreatable, onCreateService }) {
 	const { t } = (0, react_i18next.useTranslation)();
-	const { data: servicesResponse, isLoading, isError } = useListCatalogServices();
+	const { data: servicesResponse, isLoading, isError } = useListCatalogServices({ allowArchived });
 	const isLoadingWithoutFallback = isLoading && !servicesResponse;
 	const shouldDisableComboBox = isLoadingWithoutFallback || isError;
 	const serviceOptions = (0, react.useMemo)(() => {
 		var _servicesResponse$dat;
-		return (_servicesResponse$dat = servicesResponse === null || servicesResponse === void 0 ? void 0 : servicesResponse.data.map((service) => new ServiceAsOption(service))) !== null && _servicesResponse$dat !== void 0 ? _servicesResponse$dat : [];
-	}, [servicesResponse]);
+		return (_servicesResponse$dat = servicesResponse === null || servicesResponse === void 0 ? void 0 : servicesResponse.data.map((service) => new ServiceAsOption(service, t))) !== null && _servicesResponse$dat !== void 0 ? _servicesResponse$dat : [];
+	}, [servicesResponse, t]);
 	const combinedClassName = (0, classnames.default)("Layer__TimeEntryServiceSelector", inline && "Layer__TimeEntryServiceSelector--inline", className);
 	const handleSelectionChange = (0, react.useCallback)((selectedOption) => {
 		var _selectedOption$id;
@@ -46276,13 +46589,26 @@ const ActiveTimeTrackerBanner = ({ activeEntry, timerDisplayValue }) => {
 	const { form, actions, state: state$14 } = useActiveTimerBannerForm({ activeEntry });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Container, {
 		name: "ActiveTimeTracker",
-		children: [state$14.actionError && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VStack, {
+		className: "Layer__ActiveTimeTracker__Container",
+		children: [state$14.actionError && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HStack, {
+			className: "Layer__ActiveTimeTracker__ErrorStrip",
+			pb: "xs",
 			pi: "md",
-			pbe: "2xs",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataState, {
-				status: DataStateStatus.failed,
-				title: state$14.actionError,
-				inline: true
+			role: "alert",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+				className: "Layer__ActiveTimeTracker__ErrorStripRow",
+				gap: "sm",
+				align: "center",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.AlertTriangle, {
+					"aria-hidden": true,
+					className: "Layer__ActiveTimeTracker__ErrorStripIcon",
+					size: 16,
+					strokeWidth: 1.25
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+					size: "sm",
+					className: "Layer__ActiveTimeTracker__ErrorStripText",
+					children: state$14.actionError
+				})]
 			})
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 			className: "Layer__ActiveTimeTracker__Main",
@@ -46342,8 +46668,7 @@ const ActiveTimeTrackerBanner = ({ activeEntry, timerDisplayValue }) => {
 					children: (selectedServiceId) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
 						variant: "outlined-light",
 						onPress: actions.completeTimer,
-						isPending: state$14.isStopping || state$14.isUpdating,
-						isDisabled: state$14.isCancelling || !selectedServiceId,
+						isDisabled: state$14.isCancelling || state$14.isStopping || state$14.isUpdating || !selectedServiceId,
 						children: [t("timeTracking:action.complete_timer", "Complete"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Check, { size: 16 })]
 					})
 				})]
@@ -46385,6 +46710,11 @@ const useStartTimeTracker = () => {
 		return Reflect.get(target, prop);
 	} });
 };
+var isActiveTimerAlreadyExistsError = (error$38) => {
+	var _error$messages;
+	if (!(error$38 instanceof APIError)) return false;
+	return ((_error$messages = error$38.messages) === null || _error$messages === void 0 ? void 0 : _error$messages.some((m) => m.error_enum === ApiEnumErrorType.SpecifiedBadRequest)) === true;
+};
 const useStartTimerForm = ({ onStarted }) => {
 	const { t } = (0, react_i18next.useTranslation)();
 	const [actionError, setActionError] = (0, react.useState)(null);
@@ -46403,8 +46733,9 @@ const useStartTimerForm = ({ onStarted }) => {
 					yield startTimeTracker$1(payload);
 					formApi.reset(EMPTY_DRAFT);
 					onStarted();
-				} catch (_unused) {
-					setActionError(t("timeTracking:error.start_timer", "Failed to start timer. Please try again."));
+				} catch (error$38) {
+					if (isActiveTimerAlreadyExistsError(error$38)) setActionError(t("timeTracking:error.start_timer_already_active", "A timer is already running. Please reload the page."));
+					else setActionError(t("timeTracking:error.start_timer", "Failed to start timer. Please try again."));
 				}
 			});
 			return function(_x) {
@@ -46728,6 +47059,7 @@ const TimeEntriesTableHeader = () => {
 	const HeaderActions = (0, react.useCallback)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
 		gap: "xs",
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+			variant: "outlined-light",
 			onPress: onAddEntry,
 			children: [t("timeTracking:action.add_entry", "Add Entry"), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Plus, { size: 16 })]
 		}), onStartTimer && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
@@ -46751,6 +47083,7 @@ const TimeEntriesTableHeader = () => {
 			className: "Layer__TimeEntriesTable__FilterService",
 			placeholder: t("timeTracking:label.all_services", "All Services"),
 			showLabel: false,
+			allowArchived: true,
 			inline: true
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CustomerSelector, {
 			selectedCustomer,
@@ -46809,14 +47142,20 @@ var TimeEntryActionsCell = (0, react.memo)(function TimeEntryActionsCell$1({ ent
 			onPress: () => setDrawerOpen(true, entry),
 			"aria-label": t("timeTracking:action.view_entry", "View Entry"),
 			variant: "ghost",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Edit, { size: 20 })
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Edit, {
+				size: 20,
+				strokeWidth: 1.25
+			})
 		}), !isLocked && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
 			inset: true,
 			icon: true,
 			onPress: () => setDeleteModalOpen(true, entry),
 			"aria-label": t("timeTracking:action.delete_entry", "Delete Entry"),
 			variant: "ghost",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Trash2, { size: 20 })
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Trash2, {
+				size: 20,
+				strokeWidth: 1.25
+			})
 		})]
 	});
 });
@@ -47205,10 +47544,16 @@ const TimeEntryDrawer = () => {
 						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
 							variant: "outlined",
 							onPress: handleDeleteEntry,
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Trash2, { size: 16 }), t("timeTracking:action.delete_entry", "Delete Entry")]
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Trash2, {
+								size: 16,
+								strokeWidth: 1.25
+							}), t("timeTracking:action.delete_entry", "Delete Entry")]
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
 							onPress: () => setIsEditMode(true),
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Edit, { size: 16 }), t("timeTracking:action.edit_entry", "Edit Entry")]
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Edit, {
+								size: 16,
+								strokeWidth: 1.25
+							}), t("timeTracking:action.edit_entry", "Edit Entry")]
 						})]
 					})]
 				})
@@ -47396,29 +47741,31 @@ var TimeTrackingStatsBreakdown = (0, react.memo)(function TimeTrackingStatsBreak
 			children: entries.map(({ color, key, percentage, serviceName, totalMinutes }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
 				className: "Layer__TimeTrackingStats__LegendItem",
 				gap: "2xs",
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
-						className: "Layer__TimeTrackingStats__LegendLabel",
-						gap: "2xs",
-						align: "center",
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TimeTrackingStatsLegendSwatch, { color }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
-							size: "md",
-							children: serviceName
-						})]
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+					className: "Layer__TimeTrackingStats__LegendLabel",
+					gap: "2xs",
+					align: "center",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TimeTrackingStatsLegendSwatch, { color }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+						size: "md",
+						ellipsis: true,
+						withTooltip: true,
+						children: serviceName
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(HStack, {
+					className: "Layer__TimeTrackingStats__LegendMeta",
+					gap: "2xs",
+					align: "baseline",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
 						className: "Layer__TimeTrackingStats__LegendDuration",
-						size: "xl",
-						weight: "bold",
+						size: "sm",
 						children: formatMinutesAsDuration$1(totalMinutes)
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
 						className: "Layer__TimeTrackingStats__LegendPercentage",
 						size: "sm",
 						variant: "subtle",
 						children: formatPercent$1(percentage, { maximumFractionDigits: 0 })
-					})
-				]
+					})]
+				})]
 			}, key))
 		})]
 	});
@@ -47427,6 +47774,7 @@ function TimeTrackingStatsContent({ summary }) {
 	const { t } = (0, react_i18next.useTranslation)();
 	const { formatMinutesAsDuration: formatMinutesAsDuration$1 } = useIntlFormatter();
 	const serviceBreakdown = (0, react.useMemo)(() => buildServiceBreakdown(summary.byService, t("timeTracking:label.other", "Other")), [summary.byService, t]);
+	const totalDurationDisplay = summary.totalMinutes > 0 ? formatMinutesAsDuration$1(summary.totalMinutes) : t("timeTracking:label.zero_minutes", "0 min");
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VStack, {
 		className: "Layer__TimeTrackingStats__Content",
 		gap: "lg",
@@ -47461,7 +47809,7 @@ function TimeTrackingStatsContent({ summary }) {
 					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
 						className: "Layer__TimeTrackingStats__SummaryValue",
 						weight: "bold",
-						children: formatMinutesAsDuration$1(summary.totalMinutes)
+						children: totalDurationDisplay
 					})]
 				})]
 			})]
@@ -47473,7 +47821,7 @@ function TimeTrackingStatsContent({ summary }) {
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(HStack, { className: "Layer__TimeTrackingStats__ChartBar Layer__TimeTrackingStats__ChartBar--empty" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Span, {
 				size: "sm",
 				variant: "subtle",
-				children: t("timeTracking:label.no_activity_breakdown", "No activity breakdown available for this period.")
+				children: t("timeTracking:label.no_activity_breakdown", "No activity during this period")
 			})]
 		})]
 	});