@mx-cartographer/experiences 9.3.0-alpha.bb2 → 9.3.0

package/dist/spending/components/Spending.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Spending.es.js","names":[],"sources":["../../../src/spending/components/Spending.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\nimport { useTheme } from '@mui/material'\nimport type { Theme } from '@mui/system'\n\nimport { Icon } from '@mxenabled/mxui'\n\nimport {\n  Drawer,\n  useAppConfig,\n  useCategoryStore,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useTransactionStore,\n} from '../../common'\nimport { CategoryGuids } from '../../core/constants'\nimport { Transaction } from '../../core'\nimport { exportTransactionsToCSV } from '../../core/utils/TransactionUtils'\n\nimport { TransactionDetails, TransactionList } from '../../transactions'\nimport { getIncomeData, getSpendingData } from '../utils/SpendingData'\nimport SpendingChart from './SpendingChart'\nimport SpendingTabLabel from './SpendingTabLabel'\n\nconst getIncomeColors = (theme: Theme) => {\n  return [\n    theme.palette.chartMono.chartMono5,\n    theme.palette.chartMono.chartMono4,\n    theme.palette.chartMono.chartMono3,\n    theme.palette.chartMono.chartMono2,\n    theme.palette.chartMono.chartMono1,\n    theme.palette.chartMono.chartMono6,\n  ]\n}\n\nconst Spending = () => {\n  const theme = useTheme()\n  const { is_mobile_webview } = useAppConfig()\n\n  const { clientConfig } = useAppConfig()\n  const { categories, dateRangeCategoryTotals } = useCategoryStore()\n\n  const {\n    goals: goalsCopy,\n    spending: spendingCopy,\n    transactions: transactionCopy,\n  } = useGlobalCopyStore()\n  const { displayedDateRange, selectedAccountGuids } = useGlobalUiStore()\n  const {\n    setFilter,\n    sortedTransactions: transactions,\n    sortedTransactionsWithSplits,\n    tags,\n  } = useTransactionStore()\n\n  const accountGuids = clientConfig?.master?.deep_link_params?.account_guids\n  const view = clientConfig?.master?.deep_link_params?.view\n\n  const [selectedId, setSelectedId] = React.useState('')\n  const [selectedTab, setSelectedTab] = React.useState(view === 'income' ? 1 : 0)\n  const [transactionGuid, setTransactionGuid] = React.useState('')\n  const [transactionsOpen, setTransactionsOpen] = React.useState(false)\n\n  const spendingData = React.useMemo(\n    () => getSpendingData(categories, goalsCopy, theme, dateRangeCategoryTotals),\n    [categories, dateRangeCategoryTotals],\n  )\n\n  const incomeData = React.useMemo(\n    () => getIncomeData(categories, dateRangeCategoryTotals, getIncomeColors(theme)),\n    [categories, dateRangeCategoryTotals],\n  )\n\n  const transaction = React.useMemo(\n    () => transactions.find((t) => t.guid === transactionGuid),\n    [transactionGuid, transactions],\n  )\n\n  const handleTabChange = (_event: React.SyntheticEvent, newValue: number) => {\n    setSelectedTab(newValue)\n    setSelectedId('')\n  }\n\n  const handleSelected = (id: string, isSubcategory: boolean = false) => {\n    if (isSubcategory) {\n      handleSelectedSubcategory(id)\n    } else {\n      setSelectedId(selectedId === id || id === '0' ? '' : id)\n    }\n  }\n\n  const handleSelectedSubcategory = (id: string) => {\n    const transactionFilter = {\n      accounts: accountGuids ? accountGuids : selectedAccountGuids,\n      dateRange: displayedDateRange,\n    }\n\n    setFilter({\n      ...transactionFilter,\n      custom: (t: Transaction) =>\n        selectedId === 'other' ? t.top_level_category_guid === id : t.category_guid === id,\n      showSplits: true,\n    })\n\n    setTransactionsOpen(true)\n  }\n\n  const handleViewTransactions = (id: string) => {\n    const transactionFilter = {\n      accounts: accountGuids ? accountGuids : selectedAccountGuids,\n      dateRange: displayedDateRange,\n    }\n\n    if (selectedTab === 0) {\n      // Spending\n      if (id === 'other') {\n        const other = spendingData.categoryData.find((c) => c.guid === 'other')\n        setFilter({\n          ...transactionFilter,\n          custom: (t: Transaction) =>\n            Boolean(other?.categoryTotals?.find((ct) => ct.guid === t.top_level_category_guid)),\n        })\n      } else {\n        setFilter({\n          ...transactionFilter,\n          custom: (t: Transaction) =>\n            id\n              ? t.top_level_category_guid === id\n              : t.top_level_category_guid !== CategoryGuids.INCOME &&\n                t.category_guid !== CategoryGuids.INCOME &&\n                t.top_level_category_guid !== CategoryGuids.INVESTMENTS &&\n                t.top_level_category_guid !== CategoryGuids.TRANSFER,\n          showSplits: Boolean(id),\n        })\n      }\n    } else {\n      // Income\n      setFilter({\n        ...transactionFilter,\n        custom: (t: Transaction) =>\n          id\n            ? t.category_guid === id\n            : t.category_guid === CategoryGuids.INCOME ||\n              t.top_level_category_guid === CategoryGuids.INCOME,\n      })\n    }\n\n    setTransactionsOpen(true)\n  }\n\n  const handleExportToCsv = () => {\n    exportTransactionsToCSV(sortedTransactionsWithSplits, tags)\n  }\n\n  return (\n    <Box>\n      <Tabs onChange={handleTabChange} value={selectedTab} variant=\"fullWidth\">\n        <Tab\n          label={\n            <SpendingTabLabel\n              amount={spendingData.totalAmount}\n              label={spendingCopy.spend_tab_title}\n            />\n          }\n        />\n        <Tab\n          label={\n            <SpendingTabLabel\n              amount={incomeData.totalAmount}\n              label={spendingCopy.income_tab_title}\n            />\n          }\n        />\n      </Tabs>\n      {selectedTab === 0 && (\n        <SpendingChart\n          data={spendingData}\n          onSelected={handleSelected}\n          onViewTransactions={handleViewTransactions}\n          selectedId={selectedId}\n          title={spendingCopy.spend_tab_title}\n        />\n      )}\n      {selectedTab === 1 && (\n        <SpendingChart\n          data={incomeData}\n          onSelected={handleSelected}\n          onViewTransactions={handleViewTransactions}\n          selectedId={selectedId}\n          title={spendingCopy.income_tab_title}\n        />\n      )}\n      <Drawer\n        ariaLabelClose={spendingCopy.close_drawer_aria}\n        isOpen={transactionsOpen}\n        onClose={() => setTransactionsOpen(false)}\n        title={spendingCopy.transactions_drawer_title}\n      >\n        <Stack>\n          {!is_mobile_webview && transactions.length > 0 && (\n            <Stack direction=\"row\" justifyContent=\"right\" mb={-24} mr={8} mt={8} zIndex={1}>\n              <Button\n                onClick={handleExportToCsv}\n                startIcon={<Icon name=\"ios_share\" />}\n                variant=\"text\"\n              >\n                {transactionCopy.export_csv_btn}\n              </Button>\n            </Stack>\n          )}\n          <TransactionList onClick={setTransactionGuid} />\n        </Stack>\n      </Drawer>\n      <Drawer\n        ariaLabelClose={spendingCopy.close_drawer_aria}\n        isOpen={Boolean(transaction)}\n        onClose={() => setTransactionGuid('')}\n        title={spendingCopy.transaction_details_drawer_title}\n      >\n        {transaction && <TransactionDetails transaction={transaction} />}\n      </Drawer>\n    </Box>\n  )\n}\n\nexport default observer(Spending)\n"],"mappings":"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"}
+{"version":3,"file":"Spending.es.js","names":[],"sources":["../../../src/spending/components/Spending.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\nimport { useTheme } from '@mui/material'\nimport type { Theme } from '@mui/system'\n\nimport { Icon } from '@mxenabled/mxui'\n\nimport {\n  Drawer,\n  useAppConfig,\n  useCategoryStore,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useTransactionStore,\n} from '../../common'\nimport { CategoryGuids } from '../../core/constants'\nimport { Transaction } from '../../core'\nimport { exportTransactionsToCSV } from '../../core/utils/TransactionUtils'\n\nimport { TransactionDetails, TransactionList } from '../../transactions'\nimport { getIncomeData, getSpendingData } from '../utils/SpendingData'\nimport SpendingChart from './SpendingChart'\nimport SpendingTabLabel from './SpendingTabLabel'\n\nconst getIncomeColors = (theme: Theme) => {\n  return [\n    theme.palette.chartMono.chartMono5,\n    theme.palette.chartMono.chartMono4,\n    theme.palette.chartMono.chartMono3,\n    theme.palette.chartMono.chartMono2,\n    theme.palette.chartMono.chartMono1,\n    theme.palette.chartMono.chartMono6,\n  ]\n}\n\nconst Spending = () => {\n  const theme = useTheme()\n  const { is_mobile_webview } = useAppConfig()\n\n  const { clientConfig } = useAppConfig()\n  const { categories, dateRangeCategoryTotals } = useCategoryStore()\n\n  const {\n    goals: goalsCopy,\n    spending: spendingCopy,\n    transactions: transactionCopy,\n  } = useGlobalCopyStore()\n  const { displayedDateRange, selectedAccountGuids } = useGlobalUiStore()\n  const {\n    setFilter,\n    sortedTransactions: transactions,\n    sortedTransactionsWithSplits,\n    tags,\n  } = useTransactionStore()\n\n  const accountGuids = clientConfig?.master?.deep_link_params?.account_guids\n  const view = clientConfig?.master?.deep_link_params?.view\n\n  const [selectedId, setSelectedId] = React.useState('')\n  const [selectedTab, setSelectedTab] = React.useState(view === 'income' ? 1 : 0)\n  const [transactionGuid, setTransactionGuid] = React.useState('')\n  const [transactionsOpen, setTransactionsOpen] = React.useState(false)\n\n  const spendingData = React.useMemo(\n    () => getSpendingData(categories, goalsCopy, theme, dateRangeCategoryTotals),\n    [categories, dateRangeCategoryTotals],\n  )\n\n  const incomeData = React.useMemo(\n    () => getIncomeData(categories, dateRangeCategoryTotals, getIncomeColors(theme)),\n    [categories, dateRangeCategoryTotals],\n  )\n\n  const transaction = React.useMemo(\n    () => transactions.find((t) => t.guid === transactionGuid),\n    [transactionGuid, transactions],\n  )\n\n  const handleTabChange = (_event: React.SyntheticEvent, newValue: number) => {\n    setSelectedTab(newValue)\n    setSelectedId('')\n  }\n\n  const handleSelected = (id: string, isSubcategory: boolean = false) => {\n    if (isSubcategory) {\n      handleSelectedSubcategory(id)\n    } else {\n      setSelectedId(selectedId === id || id === '0' ? '' : id)\n    }\n  }\n\n  const handleSelectedSubcategory = (id: string) => {\n    const transactionFilter = {\n      accounts: accountGuids ? accountGuids : selectedAccountGuids,\n      dateRange: displayedDateRange,\n    }\n\n    setFilter({\n      ...transactionFilter,\n      custom: (t: Transaction) =>\n        selectedId === 'other' ? t.top_level_category_guid === id : t.category_guid === id,\n      showSplits: true,\n    })\n\n    setTransactionsOpen(true)\n  }\n\n  const handleViewTransactions = (id: string) => {\n    const transactionFilter = {\n      accounts: accountGuids ? accountGuids : selectedAccountGuids,\n      dateRange: displayedDateRange,\n    }\n\n    if (selectedTab === 0) {\n      // Spending\n      if (id === 'other') {\n        const other = spendingData.categoryData.find((c) => c.guid === 'other')\n        setFilter({\n          ...transactionFilter,\n          custom: (t: Transaction) =>\n            Boolean(other?.categoryTotals?.find((ct) => ct.guid === t.top_level_category_guid)),\n        })\n      } else {\n        setFilter({\n          ...transactionFilter,\n          custom: (t: Transaction) =>\n            id\n              ? t.top_level_category_guid === id\n              : t.top_level_category_guid !== CategoryGuids.INCOME &&\n                t.category_guid !== CategoryGuids.INCOME &&\n                t.top_level_category_guid !== CategoryGuids.INVESTMENTS &&\n                t.top_level_category_guid !== CategoryGuids.TRANSFER,\n          showSplits: Boolean(id),\n        })\n      }\n    } else {\n      // Income\n      setFilter({\n        ...transactionFilter,\n        custom: (t: Transaction) =>\n          id\n            ? t.category_guid === id\n            : t.category_guid === CategoryGuids.INCOME ||\n              t.top_level_category_guid === CategoryGuids.INCOME,\n      })\n    }\n\n    setTransactionsOpen(true)\n  }\n\n  const handleExportToCsv = () => {\n    exportTransactionsToCSV(sortedTransactionsWithSplits, tags)\n  }\n\n  return (\n    <Box>\n      <Tabs onChange={handleTabChange} value={selectedTab} variant=\"fullWidth\">\n        <Tab\n          label={\n            <SpendingTabLabel\n              amount={spendingData.totalAmount}\n              label={spendingCopy.spend_tab_title}\n            />\n          }\n        />\n        <Tab\n          label={\n            <SpendingTabLabel\n              amount={incomeData.totalAmount}\n              label={spendingCopy.income_tab_title}\n            />\n          }\n        />\n      </Tabs>\n      {selectedTab === 0 && (\n        <SpendingChart\n          data={spendingData}\n          onSelected={handleSelected}\n          onViewTransactions={handleViewTransactions}\n          selectedId={selectedId}\n          title={spendingCopy.spend_tab_title}\n        />\n      )}\n      {selectedTab === 1 && (\n        <SpendingChart\n          data={incomeData}\n          onSelected={handleSelected}\n          onViewTransactions={handleViewTransactions}\n          selectedId={selectedId}\n          title={spendingCopy.income_tab_title}\n        />\n      )}\n      <Drawer\n        ariaLabelClose={spendingCopy.close_drawer_aria}\n        isOpen={transactionsOpen}\n        onClose={() => setTransactionsOpen(false)}\n        title={spendingCopy.transactions_drawer_title}\n      >\n        <Stack>\n          {!is_mobile_webview && transactions.length > 0 && (\n            <Stack direction=\"row\" justifyContent=\"right\" mb={-24} mr={8} mt={8} zIndex={1}>\n              <Button\n                onClick={handleExportToCsv}\n                startIcon={<Icon name=\"ios_share\" />}\n                variant=\"text\"\n              >\n                {transactionCopy.export_csv_btn}\n              </Button>\n            </Stack>\n          )}\n          <TransactionList onClick={setTransactionGuid} />\n        </Stack>\n      </Drawer>\n      <Drawer\n        ariaLabelClose={spendingCopy.close_drawer_aria}\n        isOpen={Boolean(transaction)}\n        onClose={() => setTransactionGuid('')}\n        title={spendingCopy.transaction_details_drawer_title}\n      >\n        {transaction && <TransactionDetails transaction={transaction} />}\n      </Drawer>\n    </Box>\n  )\n}\n\nexport default observer(Spending)\n"],"mappings":"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"}

package/dist/spending/components/SpendingChart.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpendingChart.es.js","names":[],"sources":["../../../src/spending/components/SpendingChart.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\n\nimport { useCategoryStore, useGlobalCopyStore, useScreenSize } from '../../common'\n\nimport { SpendingData } from '../utils/SpendingData'\nimport SpendingDonut from './SpendingDonut'\nimport SpendingList from './SpendingList'\n\ninterface SpendingChartProps {\n  data: SpendingData\n  title: string\n  onSelected: (id: string, isSubcategory?: boolean) => void\n  onViewTransactions: (id: string) => void\n  selectedId: string\n}\n\nconst SpendingChart: React.FC<SpendingChartProps> = ({\n  data,\n  onSelected,\n  onViewTransactions,\n  selectedId,\n  title,\n}) => {\n  const { isDesktop, isMobile } = useScreenSize()\n  const { dateRangeTotalsLoading } = useCategoryStore()\n  const { spending: spendingCopy } = useGlobalCopyStore()\n\n  const handleDonutSelected = (id: string) => {\n    onSelected(id)\n    setTimeout(() => document.getElementById(`spending-list-category-${id}`)?.focus(), 0)\n  }\n\n  const loadingDonut = (\n    <SpendingDonut\n      data={{\n        categoryData: [],\n        donutData: [],\n        totalAmount: 0,\n      }}\n      onSelected={() => {}}\n      selectedId={''}\n      size={isDesktop ? 400 : 300}\n      totalLabel={'Loading ...'}\n      variant=\"full\"\n    />\n  )\n\n  return (\n    <Stack\n      alignItems={isMobile ? 'center' : 'flex-start'}\n      direction={isMobile ? 'column' : 'row'}\n      gap={{ xs: 16, md: 64, xl: 100 }}\n      justifyContent=\"center\"\n      pt={50}\n      px={8}\n    >\n      {dateRangeTotalsLoading && loadingDonut}\n      {/* Not using a ternary here because it doesn't show the animation */}\n      {!dateRangeTotalsLoading && (\n        <SpendingDonut\n          data={data}\n          onSelected={handleDonutSelected}\n          onViewTransactions={onViewTransactions}\n          selectedId={selectedId}\n          size={isDesktop ? 400 : 300}\n          totalLabel={spendingCopy.total_amount}\n          variant=\"full\"\n        />\n      )}\n\n      <SpendingList data={data} onSelected={onSelected} selectedId={selectedId} title={title} />\n    </Stack>\n  )\n}\n\nexport default observer(SpendingChart)\n"],"mappings":";;;;;;;;AAmBA,IAAM,IAAA,CAA+C,EACnD,MAAA,GACA,YAAA,GACA,oBAAA,GACA,YAAA,GACA,OAAA,EAAA,MACI;AACJ,QAAM,EAAE,WAAA,GAAW,UAAA,EAAA,IAAa,EAAc,GACxC,EAAE,wBAAA,EAAA,IAA2B,EAAiB,GAC9C,EAAE,UAAU,EAAA,IAAiB,EAAmB;AAsBtD,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,YAAY,IAAW,WAAW;AAAA,IAClC,WAAW,IAAW,WAAW;AAAA,IACjC,KAAK;AAAA,MAAE,IAAI;AAAA,MAAI,IAAI;AAAA,MAAI,IAAI;AAAA,IAAI;AAAA,IAC/B,gBAAe;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,cANN;AAAA,MAQG,KAvBH,gBAAA,EAAC,GAAD;AAAA,QACE,MAAM;AAAA,UACJ,cAAc,CAAC;AAAA,UACf,WAAW,CAAC;AAAA,UACZ,aAAa;AAAA,QACf;AAAA,QACA,YAAA,MAAkB;AAAA,QAAC;AAAA,QACnB,YAAY;AAAA,QACZ,MAAM,IAAY,MAAM;AAAA,QACxB,YAAY;AAAA,QACZ,SAAQ;AAAA,MACT,CAY4B;AAAA,MAE1B,CAAC,KACA,gBAAA,EAAC,GAAD;AAAA,QACQ,MAAA;AAAA,QACN,YAlCF,CAAuB,MAAe;AAC1C,UAAA,EAAW,CAAE,GACb,WAAA,MAAiB,SAAS,eAAe,0BAA0B,CAAA,EAAI,GAAG,MAAM,GAAG,CAAC;AAAA,QACtF;AAAA,QAgC4B,oBAAA;AAAA,QACR,YAAA;AAAA,QACZ,MAAM,IAAY,MAAM;AAAA,QACxB,YAAY,EAAa;AAAA,QACzB,SAAQ;AAAA,MACT,CAAA;AAAA,MAGH,gBAAA,EAAC,GAAD;AAAA,QAAoB,MAAA;AAAA,QAAkB,YAAA;AAAA,QAAwB,YAAA;AAAA,QAAmB,OAAA;AAAA,MAAQ,CAAA;AAAA,IACpF;AAAA;AAEX,GAEA,IAAe,EAAS,CAAa"}
+{"version":3,"file":"SpendingChart.es.js","names":[],"sources":["../../../src/spending/components/SpendingChart.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\n\nimport { useCategoryStore, useGlobalCopyStore, useScreenSize } from '../../common'\n\nimport { SpendingData } from '../utils/SpendingData'\nimport SpendingDonut from './SpendingDonut'\nimport SpendingList from './SpendingList'\n\ninterface SpendingChartProps {\n  data: SpendingData\n  title: string\n  onSelected: (id: string, isSubcategory?: boolean) => void\n  onViewTransactions: (id: string) => void\n  selectedId: string\n}\n\nconst SpendingChart: React.FC<SpendingChartProps> = ({\n  data,\n  onSelected,\n  onViewTransactions,\n  selectedId,\n  title,\n}) => {\n  const { isDesktop, isMobile } = useScreenSize()\n  const { dateRangeTotalsLoading } = useCategoryStore()\n  const { spending: spendingCopy } = useGlobalCopyStore()\n\n  const handleDonutSelected = (id: string) => {\n    onSelected(id)\n    setTimeout(() => document.getElementById(`spending-list-category-${id}`)?.focus(), 0)\n  }\n\n  const loadingDonut = (\n    <SpendingDonut\n      data={{\n        categoryData: [],\n        donutData: [],\n        totalAmount: 0,\n      }}\n      onSelected={() => {}}\n      selectedId={''}\n      size={isDesktop ? 400 : 300}\n      totalLabel={'Loading ...'}\n      variant=\"full\"\n    />\n  )\n\n  return (\n    <Stack\n      alignItems={isMobile ? 'center' : 'flex-start'}\n      direction={isMobile ? 'column' : 'row'}\n      gap={{ xs: 16, md: 64, xl: 100 }}\n      justifyContent=\"center\"\n      pt={50}\n      px={8}\n    >\n      {dateRangeTotalsLoading && loadingDonut}\n      {/* Not using a ternary here because it doesn't show the animation */}\n      {!dateRangeTotalsLoading && (\n        <SpendingDonut\n          data={data}\n          onSelected={handleDonutSelected}\n          onViewTransactions={onViewTransactions}\n          selectedId={selectedId}\n          size={isDesktop ? 400 : 300}\n          totalLabel={spendingCopy.total_amount}\n          variant=\"full\"\n        />\n      )}\n\n      <SpendingList data={data} onSelected={onSelected} selectedId={selectedId} title={title} />\n    </Stack>\n  )\n}\n\nexport default observer(SpendingChart)\n"],"mappings":";;;;;;;;AAmBA,IAAM,IAAA,CAA+C,EACnD,MAAA,GACA,YAAA,GACA,oBAAA,GACA,YAAA,GACA,OAAA,EAAA,MACI;AACJ,QAAM,EAAE,WAAA,GAAW,UAAA,EAAA,IAAa,EAAc,GACxC,EAAE,wBAAA,EAAA,IAA2B,EAAiB,GAC9C,EAAE,UAAU,EAAA,IAAiB,EAAmB;AAsBtD,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,YAAY,IAAW,WAAW;AAAA,IAClC,WAAW,IAAW,WAAW;AAAA,IACjC,KAAK;AAAA,MAAE,IAAI;AAAA,MAAI,IAAI;AAAA,MAAI,IAAI;AAAA,IAAI;AAAA,IAC/B,gBAAe;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IANN,UAAA;AAAA,MAQG,KAvBH,gBAAA,EAAC,GAAD;AAAA,QACE,MAAM;AAAA,UACJ,cAAc,CAAC;AAAA,UACf,WAAW,CAAC;AAAA,UACZ,aAAa;AAAA,QACf;AAAA,QACA,YAAA,MAAkB;AAAA,QAAC;AAAA,QACnB,YAAY;AAAA,QACZ,MAAM,IAAY,MAAM;AAAA,QACxB,YAAY;AAAA,QACZ,SAAQ;AAAA,MACT,CAY4B;AAAA,MAE1B,CAAC,KACA,gBAAA,EAAC,GAAD;AAAA,QACQ,MAAA;AAAA,QACN,YAlCF,CAAuB,MAAe;AAC1C,UAAA,EAAW,CAAE,GACb,WAAA,MAAiB,SAAS,eAAe,0BAA0B,CAAA,EAAI,GAAG,MAAM,GAAG,CAAC;AAAA,QACtF;AAAA,QAgC4B,oBAAA;AAAA,QACR,YAAA;AAAA,QACZ,MAAM,IAAY,MAAM;AAAA,QACxB,YAAY,EAAa;AAAA,QACzB,SAAQ;AAAA,MACT,CAAA;AAAA,MAGH,gBAAA,EAAC,GAAD;AAAA,QAAoB,MAAA;AAAA,QAAkB,YAAA;AAAA,QAAwB,YAAA;AAAA,QAAmB,OAAA;AAAA,MAAQ,CAAA;AAAA,IACpF;AAAA;AAEX,GAEA,IAAe,EAAS,CAAa"}

package/dist/spending/components/SpendingDonut.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpendingDonut.es.js","names":[],"sources":["../../../src/spending/components/SpendingDonut.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { CategoryIcon, CategoryIconVariants, P, Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore, useScreenSize } from '../../common'\nimport { CategoryGuids } from '../../core/constants'\nimport Donut from '../../common/components/charts/Donut'\nimport { useAriaLive } from '../../common/hooks/useAriaLive'\n\nimport type { SpendingData } from '../utils/SpendingData'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\n\ninterface SpendingDonutProps {\n  data: SpendingData\n  isIncome?: boolean\n  onSelected: (id: string) => void\n  onViewTransactions?: (id: string) => void\n  selectedId: string\n  size?: number\n  totalLabel: string\n  variant?: 'mini' | 'full'\n}\n\nconst SpendingDonut: React.FC<SpendingDonutProps> = ({\n  data,\n  isIncome = false,\n  onSelected,\n  onViewTransactions,\n  selectedId,\n  size = 150,\n  totalLabel,\n  variant = 'mini',\n}) => {\n  const { spending: spendingCopy } = useGlobalCopyStore()\n  const theme = useTheme()\n  const { isTablet } = useScreenSize()\n  const { announce, ariaLive } = useAriaLive()\n\n  const selectedCategory = React.useMemo(\n    () => (selectedId ? data.categoryData.find((cd) => cd.guid === selectedId) : undefined),\n    [selectedId],\n  )\n\n  // Announce category selection to screen readers\n  React.useEffect(() => {\n    if (selectedCategory) {\n      const amount = formatCurrency(selectedCategory.amount, variant === 'mini' ? '0,0' : '0,0.00')\n      announce(`${selectedCategory.name}: ${amount}`)\n    }\n  }, [selectedCategory, announce, variant])\n\n  const donutData =\n    data.donutData.length > 0\n      ? data.donutData\n      : [{ id: '0', color: theme.palette.divider, value: 100 }]\n\n  const handleViewTransactions = () => {\n    onViewTransactions?.(selectedId)\n  }\n\n  const iconSize = isTablet ? 32 : 48\n  return (\n    <Box\n      aria-label={spendingCopy.chart_description}\n      height={size}\n      position=\"relative\"\n      role=\"group\"\n      width={size}\n    >\n      {ariaLive}\n      <Donut data={donutData} onClick={onSelected} selectedId={selectedId} size={size}>\n        <Stack alignItems=\"center\" height=\"100%\" justifyContent=\"center\" width=\"100%\">\n          <Stack alignItems=\"center\" justifyContent=\"center\" minHeight={size} minWidth={size}>\n            {selectedCategory && (\n              <Stack\n                alignItems=\"center\"\n                gap={variant === 'mini' ? 0 : 8}\n                mb={variant === 'mini' ? 0 : 8}\n                mt={variant === 'mini' ? 0 : -16}\n                sx={\n                  variant === 'mini'\n                    ? { gap: 0, mb: 0 }\n                    : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } }\n                }\n              >\n                <Box aria-hidden=\"true\" role=\"presentation\">\n                  <CategoryIcon\n                    categoryGuid={isIncome ? CategoryGuids.INCOME : selectedCategory.guid}\n                    size={variant === 'mini' ? 24 : iconSize}\n                    variant={CategoryIconVariants.Transparent}\n                  />\n                </Box>\n                <Text\n                  color=\"text.secondary\"\n                  noWrap={true}\n                  variant={variant === 'mini' ? 'tiny' : 'body1'}\n                >\n                  {selectedCategory ? selectedCategory.name : totalLabel}\n                </Text>\n              </Stack>\n            )}\n\n            {!selectedCategory && variant === 'full' && (\n              <Text bold={true} color=\"text.secondary\" sx={{ mb: { xs: 4, xl: 8 } }}>\n                {totalLabel}\n              </Text>\n            )}\n\n            <P variant={variant === 'mini' ? 'h2' : 'h1'}>\n              {selectedCategory\n                ? formatCurrency(selectedCategory.amount, variant === 'mini' ? '0,0' : '0,0.00')\n                : formatCurrency(data.totalAmount, variant === 'mini' ? '0,0' : '0,0.00')}\n            </P>\n            {!selectedCategory && variant === 'mini' && (\n              <Text color=\"text.secondary\" noWrap={true} variant=\"tiny\">\n                {totalLabel}\n              </Text>\n            )}\n\n            {variant === 'full' && (\n              <Button\n                aria-label={`View ${selectedCategory?.name || ''} Transactions`}\n                disabled={data.categoryData.length === 0}\n                onClick={handleViewTransactions}\n                sx={{ mt: { xl: 4, xs: 0 }, zIndex: 1 }}\n                variant=\"text\"\n              >\n                {spendingCopy.view_transactions}\n              </Button>\n            )}\n          </Stack>\n        </Stack>\n      </Donut>\n    </Box>\n  )\n}\n\nexport default observer(SpendingDonut)\n"],"mappings":";;;;;;;;;;;;;;AA6BA,IAAM,IAAA,CAA+C,EACnD,MAAA,GACA,UAAA,IAAW,IACX,YAAA,GACA,oBAAA,GACA,YAAA,GACA,MAAA,IAAO,KACP,YAAA,GACA,SAAA,IAAU,OAAA,MACN;AACJ,QAAM,EAAE,UAAU,EAAA,IAAiB,EAAmB,GAChD,IAAQ,EAAS,GACjB,EAAE,UAAA,EAAA,IAAa,EAAc,GAC7B,EAAE,UAAA,GAAU,UAAA,EAAA,IAAa,EAAY,GAErC,IAAmB,EAAM,QAAA,MACtB,IAAa,EAAK,aAAa,KAAA,CAAM,MAAO,EAAG,SAAS,CAAU,IAAI,QAC7E,CAAC,CAAU,CACb;AAGA,EAAA,EAAM,UAAA,MAAgB;AACpB,QAAI,GAAkB;AACpB,YAAM,IAAS,EAAe,EAAiB,QAAQ,MAAY,SAAS,QAAQ,QAAQ;AAC5F,MAAA,EAAS,GAAG,EAAiB,IAAA,KAAS,CAAA,EAAQ;AAAA,IAChD;AAAA,EACF,GAAG;AAAA,IAAC;AAAA,IAAkB;AAAA,IAAU;AAAA,EAAO,CAAC;AAExC,QAAM,IACJ,EAAK,UAAU,SAAS,IACpB,EAAK,YACL,CAAC;AAAA,IAAE,IAAI;AAAA,IAAK,OAAO,EAAM,QAAQ;AAAA,IAAS,OAAO;AAAA,EAAI,CAAC,GAEtD,IAAA,MAA+B;AACnC,IAAA,IAAqB,CAAU;AAAA,EACjC,GAEM,IAAW,IAAW,KAAK;AACjC,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,cAAY,EAAa;AAAA,IACzB,QAAQ;AAAA,IACR,UAAS;AAAA,IACT,MAAK;AAAA,IACL,OAAO;AAAA,cALT,CAOG,GACD,gBAAA,EAAC,GAAD;AAAA,MAAO,MAAM;AAAA,MAAW,SAAS;AAAA,MAAwB,YAAA;AAAA,MAAkB,MAAA;AAAA,gBACzE,gBAAA,EAAC,GAAD;AAAA,QAAO,YAAW;AAAA,QAAS,QAAO;AAAA,QAAO,gBAAe;AAAA,QAAS,OAAM;AAAA,kBACrE,gBAAA,EAAC,GAAD;AAAA,UAAO,YAAW;AAAA,UAAS,gBAAe;AAAA,UAAS,WAAW;AAAA,UAAM,UAAU;AAAA,oBAA9E;AAAA,YACG,KACC,gBAAA,EAAC,GAAD;AAAA,cACE,YAAW;AAAA,cACX,KAAK,MAAY,SAAS,IAAI;AAAA,cAC9B,IAAI,MAAY,SAAS,IAAI;AAAA,cAC7B,IAAI,MAAY,SAAS,IAAI;AAAA,cAC7B,IACE,MAAY,SACR;AAAA,gBAAE,KAAK;AAAA,gBAAG,IAAI;AAAA,cAAE,IAChB;AAAA,gBAAE,KAAK;AAAA,kBAAE,IAAI;AAAA,kBAAG,IAAI;AAAA,gBAAE;AAAA,gBAAG,IAAI;AAAA,kBAAE,IAAI;AAAA,kBAAG,IAAI;AAAA,gBAAE;AAAA,cAAE;AAAA,wBARtD,CAWE,gBAAA,EAAC,GAAD;AAAA,gBAAK,eAAY;AAAA,gBAAO,MAAK;AAAA,0BAC3B,gBAAA,EAAC,GAAD;AAAA,kBACE,cAAc,IAAW,EAAc,SAAS,EAAiB;AAAA,kBACjE,MAAM,MAAY,SAAS,KAAK;AAAA,kBAChC,SAAS,EAAqB;AAAA,gBAC/B,CAAA;AAAA,cACE,CAAA,GACL,gBAAA,EAAC,GAAD;AAAA,gBACE,OAAM;AAAA,gBACN,QAAQ;AAAA,gBACR,SAAS,MAAY,SAAS,SAAS;AAAA,0BAEtC,IAAmB,EAAiB,OAAO;AAAA,cACxC,CAAA,CACD;AAAA;YAGR,CAAC,KAAoB,MAAY,UAChC,gBAAA,EAAC,GAAD;AAAA,cAAM,MAAM;AAAA,cAAM,OAAM;AAAA,cAAiB,IAAI,EAAE,IAAI;AAAA,gBAAE,IAAI;AAAA,gBAAG,IAAI;AAAA,cAAE,EAAE;AAAA,wBACjE;AAAA,YACG,CAAA;AAAA,YAGR,gBAAA,EAAC,GAAD;AAAA,cAAG,SAAS,MAAY,SAAS,OAAO;AAAA,wBACrC,IACG,EAAe,EAAiB,QAAQ,MAAY,SAAS,QAAQ,QAAQ,IAC7E,EAAe,EAAK,aAAa,MAAY,SAAS,QAAQ,QAAQ;AAAA,YACzE,CAAA;AAAA,YACF,CAAC,KAAoB,MAAY,UAChC,gBAAA,EAAC,GAAD;AAAA,cAAM,OAAM;AAAA,cAAiB,QAAQ;AAAA,cAAM,SAAQ;AAAA,wBAChD;AAAA,YACG,CAAA;AAAA,YAGP,MAAY,UACX,gBAAA,EAAC,GAAD;AAAA,cACE,cAAY,QAAQ,GAAkB,QAAQ,EAAA;AAAA,cAC9C,UAAU,EAAK,aAAa,WAAW;AAAA,cACvC,SAAS;AAAA,cACT,IAAI;AAAA,gBAAE,IAAI;AAAA,kBAAE,IAAI;AAAA,kBAAG,IAAI;AAAA,gBAAE;AAAA,gBAAG,QAAQ;AAAA,cAAE;AAAA,cACtC,SAAQ;AAAA,wBAEP,EAAa;AAAA,YACR,CAAA;AAAA,UAEL;AAAA;MACF,CAAA;AAAA,IACF,CAAA,CACJ;AAAA;AAET,GAEA,IAAe,EAAS,CAAa"}
+{"version":3,"file":"SpendingDonut.es.js","names":[],"sources":["../../../src/spending/components/SpendingDonut.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { CategoryIcon, CategoryIconVariants, P, Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore, useScreenSize } from '../../common'\nimport { CategoryGuids } from '../../core/constants'\nimport Donut from '../../common/components/charts/Donut'\nimport { useAriaLive } from '../../common/hooks/useAriaLive'\n\nimport type { SpendingData } from '../utils/SpendingData'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\n\ninterface SpendingDonutProps {\n  data: SpendingData\n  isIncome?: boolean\n  onSelected: (id: string) => void\n  onViewTransactions?: (id: string) => void\n  selectedId: string\n  size?: number\n  totalLabel: string\n  variant?: 'mini' | 'full'\n}\n\nconst SpendingDonut: React.FC<SpendingDonutProps> = ({\n  data,\n  isIncome = false,\n  onSelected,\n  onViewTransactions,\n  selectedId,\n  size = 150,\n  totalLabel,\n  variant = 'mini',\n}) => {\n  const { spending: spendingCopy } = useGlobalCopyStore()\n  const theme = useTheme()\n  const { isTablet } = useScreenSize()\n  const { announce, ariaLive } = useAriaLive()\n\n  const selectedCategory = React.useMemo(\n    () => (selectedId ? data.categoryData.find((cd) => cd.guid === selectedId) : undefined),\n    [selectedId],\n  )\n\n  // Announce category selection to screen readers\n  React.useEffect(() => {\n    if (selectedCategory) {\n      const amount = formatCurrency(selectedCategory.amount, variant === 'mini' ? '0,0' : '0,0.00')\n      announce(`${selectedCategory.name}: ${amount}`)\n    }\n  }, [selectedCategory, announce, variant])\n\n  const donutData =\n    data.donutData.length > 0\n      ? data.donutData\n      : [{ id: '0', color: theme.palette.divider, value: 100 }]\n\n  const handleViewTransactions = () => {\n    onViewTransactions?.(selectedId)\n  }\n\n  const iconSize = isTablet ? 32 : 48\n  return (\n    <Box\n      aria-label={spendingCopy.chart_description}\n      height={size}\n      position=\"relative\"\n      role=\"group\"\n      width={size}\n    >\n      {ariaLive}\n      <Donut data={donutData} onClick={onSelected} selectedId={selectedId} size={size}>\n        <Stack alignItems=\"center\" height=\"100%\" justifyContent=\"center\" width=\"100%\">\n          <Stack alignItems=\"center\" justifyContent=\"center\" minHeight={size} minWidth={size}>\n            {selectedCategory && (\n              <Stack\n                alignItems=\"center\"\n                gap={variant === 'mini' ? 0 : 8}\n                mb={variant === 'mini' ? 0 : 8}\n                mt={variant === 'mini' ? 0 : -16}\n                sx={\n                  variant === 'mini'\n                    ? { gap: 0, mb: 0 }\n                    : { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } }\n                }\n              >\n                <Box aria-hidden=\"true\" role=\"presentation\">\n                  <CategoryIcon\n                    categoryGuid={isIncome ? CategoryGuids.INCOME : selectedCategory.guid}\n                    size={variant === 'mini' ? 24 : iconSize}\n                    variant={CategoryIconVariants.Transparent}\n                  />\n                </Box>\n                <Text\n                  color=\"text.secondary\"\n                  noWrap={true}\n                  variant={variant === 'mini' ? 'tiny' : 'body1'}\n                >\n                  {selectedCategory ? selectedCategory.name : totalLabel}\n                </Text>\n              </Stack>\n            )}\n\n            {!selectedCategory && variant === 'full' && (\n              <Text bold={true} color=\"text.secondary\" sx={{ mb: { xs: 4, xl: 8 } }}>\n                {totalLabel}\n              </Text>\n            )}\n\n            <P variant={variant === 'mini' ? 'h2' : 'h1'}>\n              {selectedCategory\n                ? formatCurrency(selectedCategory.amount, variant === 'mini' ? '0,0' : '0,0.00')\n                : formatCurrency(data.totalAmount, variant === 'mini' ? '0,0' : '0,0.00')}\n            </P>\n            {!selectedCategory && variant === 'mini' && (\n              <Text color=\"text.secondary\" noWrap={true} variant=\"tiny\">\n                {totalLabel}\n              </Text>\n            )}\n\n            {variant === 'full' && (\n              <Button\n                aria-label={`View ${selectedCategory?.name || ''} Transactions`}\n                disabled={data.categoryData.length === 0}\n                onClick={handleViewTransactions}\n                sx={{ mt: { xl: 4, xs: 0 }, zIndex: 1 }}\n                variant=\"text\"\n              >\n                {spendingCopy.view_transactions}\n              </Button>\n            )}\n          </Stack>\n        </Stack>\n      </Donut>\n    </Box>\n  )\n}\n\nexport default observer(SpendingDonut)\n"],"mappings":"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"}

package/dist/spending/components/SpendingLegend.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpendingLegend.es.js","names":[],"sources":["../../../src/spending/components/SpendingLegend.tsx"],"sourcesContent":["import React from 'react'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport type { SpendingData } from '../utils/SpendingData'\n\ninterface SpendingLegendProps {\n  data: SpendingData\n  onSelected: (id: string) => void\n  selectedId: string\n}\n\nconst SpendingLegend: React.FC<SpendingLegendProps> = ({ data, onSelected, selectedId }) => {\n  const handleKeyDown = (event: React.KeyboardEvent, guid: string) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      onSelected(guid)\n    }\n  }\n\n  return (\n    <Stack gap={8} height=\"100%\" justifyContent=\"center\" my=\"auto\">\n      {data.categoryData.map((item) => (\n        <Stack\n          alignItems=\"center\"\n          aria-label={item.name}\n          aria-pressed={item.guid === selectedId}\n          direction=\"row\"\n          gap={8}\n          key={item.guid}\n          onClick={() => onSelected(item.guid)}\n          onKeyDown={(e) => handleKeyDown(e, item.guid)}\n          role=\"button\"\n          sx={{ cursor: 'pointer', touchAction: 'manipulation' }}\n          tabIndex={0}\n        >\n          <Box borderRadius={4} height={8} sx={{ backgroundColor: item.color }} width={8} />\n          <Text bold={item.guid === selectedId} variant=\"caption\">\n            {item.name}\n          </Text>\n        </Stack>\n      ))}\n    </Stack>\n  )\n}\n\nexport default SpendingLegend\n"],"mappings":";;;;;AAeA,IAAM,IAAA,CAAiD,EAAE,MAAA,GAAM,YAAA,GAAY,YAAA,EAAA,MAAiB;AAC1F,QAAM,IAAA,CAAiB,GAA4B,MAAiB;AAClE,KAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,SACzC,EAAM,eAAe,GACrB,EAAW,CAAI;AAAA,EAEnB;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,KAAK;AAAA,IAAG,QAAO;AAAA,IAAO,gBAAe;AAAA,IAAS,IAAG;AAAA,cACrD,EAAK,aAAa,IAAA,CAAK,MACtB,gBAAA,EAAC,GAAD;AAAA,MACE,YAAW;AAAA,MACX,cAAY,EAAK;AAAA,MACjB,gBAAc,EAAK,SAAS;AAAA,MAC5B,WAAU;AAAA,MACV,KAAK;AAAA,MAEL,SAAA,MAAe,EAAW,EAAK,IAAI;AAAA,MACnC,WAAA,CAAY,MAAM,EAAc,GAAG,EAAK,IAAI;AAAA,MAC5C,MAAK;AAAA,MACL,IAAI;AAAA,QAAE,QAAQ;AAAA,QAAW,aAAa;AAAA,MAAe;AAAA,MACrD,UAAU;AAAA,gBAXZ,CAaE,gBAAA,EAAC,GAAD;AAAA,QAAK,cAAc;AAAA,QAAG,QAAQ;AAAA,QAAG,IAAI,EAAE,iBAAiB,EAAK,MAAM;AAAA,QAAG,OAAO;AAAA,MAAI,CAAA,GACjF,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAM,EAAK,SAAS;AAAA,QAAY,SAAQ;AAAA,kBAC3C,EAAK;AAAA,MACF,CAAA,CACD;AAAA,OAXA,EAAK,IAWL,CACR;AAAA,EACI,CAAA;AAEX"}
+{"version":3,"file":"SpendingLegend.es.js","names":[],"sources":["../../../src/spending/components/SpendingLegend.tsx"],"sourcesContent":["import React from 'react'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport type { SpendingData } from '../utils/SpendingData'\n\ninterface SpendingLegendProps {\n  data: SpendingData\n  onSelected: (id: string) => void\n  selectedId: string\n}\n\nconst SpendingLegend: React.FC<SpendingLegendProps> = ({ data, onSelected, selectedId }) => {\n  const handleKeyDown = (event: React.KeyboardEvent, guid: string) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      onSelected(guid)\n    }\n  }\n\n  return (\n    <Stack gap={8} height=\"100%\" justifyContent=\"center\" my=\"auto\">\n      {data.categoryData.map((item) => (\n        <Stack\n          alignItems=\"center\"\n          aria-label={item.name}\n          aria-pressed={item.guid === selectedId}\n          direction=\"row\"\n          gap={8}\n          key={item.guid}\n          onClick={() => onSelected(item.guid)}\n          onKeyDown={(e) => handleKeyDown(e, item.guid)}\n          role=\"button\"\n          sx={{ cursor: 'pointer', touchAction: 'manipulation' }}\n          tabIndex={0}\n        >\n          <Box borderRadius={4} height={8} sx={{ backgroundColor: item.color }} width={8} />\n          <Text bold={item.guid === selectedId} variant=\"caption\">\n            {item.name}\n          </Text>\n        </Stack>\n      ))}\n    </Stack>\n  )\n}\n\nexport default SpendingLegend\n"],"mappings":";;;;;AAeA,IAAM,IAAA,CAAiD,EAAE,MAAA,GAAM,YAAA,GAAY,YAAA,EAAA,MAAiB;AAC1F,QAAM,IAAA,CAAiB,GAA4B,MAAiB;AAClE,KAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,SACzC,EAAM,eAAe,GACrB,EAAW,CAAI;AAAA,EAEnB;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,KAAK;AAAA,IAAG,QAAO;AAAA,IAAO,gBAAe;AAAA,IAAS,IAAG;AAAA,IACrD,UAAA,EAAK,aAAa,IAAA,CAAK,MACtB,gBAAA,EAAC,GAAD;AAAA,MACE,YAAW;AAAA,MACX,cAAY,EAAK;AAAA,MACjB,gBAAc,EAAK,SAAS;AAAA,MAC5B,WAAU;AAAA,MACV,KAAK;AAAA,MAEL,SAAA,MAAe,EAAW,EAAK,IAAI;AAAA,MACnC,WAAA,CAAY,MAAM,EAAc,GAAG,EAAK,IAAI;AAAA,MAC5C,MAAK;AAAA,MACL,IAAI;AAAA,QAAE,QAAQ;AAAA,QAAW,aAAa;AAAA,MAAe;AAAA,MACrD,UAAU;AAAA,MAXZ,UAAA,CAaE,gBAAA,EAAC,GAAD;AAAA,QAAK,cAAc;AAAA,QAAG,QAAQ;AAAA,QAAG,IAAI,EAAE,iBAAiB,EAAK,MAAM;AAAA,QAAG,OAAO;AAAA,MAAI,CAAA,GACjF,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAM,EAAK,SAAS;AAAA,QAAY,SAAQ;AAAA,QAC3C,UAAA,EAAK;AAAA,MACF,CAAA,CACD;AAAA,IAXA,GAAA,EAAK,IAWL,CACR;AAAA,EACI,CAAA;AAEX"}

package/dist/spending/components/SpendingList.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpendingList.es.js","names":[],"sources":["../../../src/spending/components/SpendingList.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Collapse from '@mui/material/Collapse'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore } from '../../common'\nimport { SpendingData } from '../utils/SpendingData'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\n\ninterface SpendingListProps {\n  data: SpendingData\n  onSelected: (id: string, isSubcategory?: boolean) => void\n  selectedId?: string\n  title: string\n}\n\nconst SpendingList: React.FC<SpendingListProps> = ({\n  data,\n  onSelected,\n  selectedId = '',\n  title,\n}) => {\n  const { spending: spendingCopy } = useGlobalCopyStore()\n  const selectedCategory = data.categoryData.find((parent) => parent.guid === selectedId)\n\n  return (\n    <Stack direction=\"column\" justifyContent=\"center\" maxWidth={400} minWidth={275} width=\"100%\">\n      <Text bold={true} id=\"spending-list-title\" sx={{ py: 12 }} variant=\"h3\">\n        {`${title} ${spendingCopy.by_category}`}\n      </Text>\n\n      <Divider aria-hidden=\"true\" />\n\n      <List aria-labelledby=\"spending-list-title\">\n        {data.categoryData.map((item) => (\n          <React.Fragment key={item.guid}>\n            <ListItem\n              disableGutters={true}\n              disablePadding={true}\n              sx={{\n                borderBottom: 1,\n                borderColor: 'divider',\n                minHeight: 44,\n              }}\n            >\n              <ListItemButton\n                aria-expanded={Boolean(selectedCategory?.guid === item.guid)}\n                id={`spending-list-category-${item.guid}`}\n                onClick={() => onSelected(item.guid)}\n                sx={{ minHeight: 44, px: 8, py: 0 }}\n              >\n                <Box\n                  aria-hidden=\"true\"\n                  borderRadius={4}\n                  flexShrink={0}\n                  height={8}\n                  role=\"presentation\"\n                  sx={{ backgroundColor: item.color, mr: 8 }}\n                  width={8}\n                />\n                <Stack\n                  alignItems=\"center\"\n                  direction=\"row\"\n                  justifyContent=\"space-between\"\n                  width=\"100%\"\n                >\n                  <Text bold={selectedId === item.guid}>{item.name}</Text>\n                  <Text bold={selectedId === item.guid} variant=\"body1\">\n                    {formatCurrency(item.amount, '0,0.00')}\n                  </Text>\n                </Stack>\n              </ListItemButton>\n            </ListItem>\n\n            {item.categoryTotals && item.categoryTotals.length > 0 && (\n              <Collapse in={Boolean(selectedCategory?.guid === item.guid)} unmountOnExit={true}>\n                <List sx={{ borderBottom: 1, borderColor: 'divider' }}>\n                  {selectedCategory?.categoryTotals?.map((subItem) => (\n                    <ListItem\n                      key={subItem.guid}\n                      sx={{\n                        pl: 12,\n                        py: 0,\n                      }}\n                    >\n                      <ListItemButton\n                        id={`spending-list-subcategory-${subItem.guid}`}\n                        onClick={() => onSelected(subItem.guid, true)}\n                        sx={{ minHeight: 44, px: 8, py: 0 }}\n                      >\n                        <Stack direction=\"row\" justifyContent=\"space-between\" width=\"100%\">\n                          <Text>{subItem.name} </Text>\n                          <Text>{formatCurrency(subItem.amount, '0,0.00')}</Text>\n                        </Stack>\n                      </ListItemButton>\n                    </ListItem>\n                  ))}\n                </List>\n              </Collapse>\n            )}\n          </React.Fragment>\n        ))}\n      </List>\n\n      <Text bold={true} sx={{ mt: 12, pr: 8, textAlign: 'right' }}>\n        {`${spendingCopy.total}: ${formatCurrency(data.totalAmount, '0,0.00')}`}\n      </Text>\n    </Stack>\n  )\n}\n\nexport default observer(SpendingList)\n"],"mappings":"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"}
+{"version":3,"file":"SpendingList.es.js","names":[],"sources":["../../../src/spending/components/SpendingList.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Collapse from '@mui/material/Collapse'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore } from '../../common'\nimport { SpendingData } from '../utils/SpendingData'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\n\ninterface SpendingListProps {\n  data: SpendingData\n  onSelected: (id: string, isSubcategory?: boolean) => void\n  selectedId?: string\n  title: string\n}\n\nconst SpendingList: React.FC<SpendingListProps> = ({\n  data,\n  onSelected,\n  selectedId = '',\n  title,\n}) => {\n  const { spending: spendingCopy } = useGlobalCopyStore()\n  const selectedCategory = data.categoryData.find((parent) => parent.guid === selectedId)\n\n  return (\n    <Stack direction=\"column\" justifyContent=\"center\" maxWidth={400} minWidth={275} width=\"100%\">\n      <Text bold={true} id=\"spending-list-title\" sx={{ py: 12 }} variant=\"h3\">\n        {`${title} ${spendingCopy.by_category}`}\n      </Text>\n\n      <Divider aria-hidden=\"true\" />\n\n      <List aria-labelledby=\"spending-list-title\">\n        {data.categoryData.map((item) => (\n          <React.Fragment key={item.guid}>\n            <ListItem\n              disableGutters={true}\n              disablePadding={true}\n              sx={{\n                borderBottom: 1,\n                borderColor: 'divider',\n                minHeight: 44,\n              }}\n            >\n              <ListItemButton\n                aria-expanded={Boolean(selectedCategory?.guid === item.guid)}\n                id={`spending-list-category-${item.guid}`}\n                onClick={() => onSelected(item.guid)}\n                sx={{ minHeight: 44, px: 8, py: 0 }}\n              >\n                <Box\n                  aria-hidden=\"true\"\n                  borderRadius={4}\n                  flexShrink={0}\n                  height={8}\n                  role=\"presentation\"\n                  sx={{ backgroundColor: item.color, mr: 8 }}\n                  width={8}\n                />\n                <Stack\n                  alignItems=\"center\"\n                  direction=\"row\"\n                  justifyContent=\"space-between\"\n                  width=\"100%\"\n                >\n                  <Text bold={selectedId === item.guid}>{item.name}</Text>\n                  <Text bold={selectedId === item.guid} variant=\"body1\">\n                    {formatCurrency(item.amount, '0,0.00')}\n                  </Text>\n                </Stack>\n              </ListItemButton>\n            </ListItem>\n\n            {item.categoryTotals && item.categoryTotals.length > 0 && (\n              <Collapse in={Boolean(selectedCategory?.guid === item.guid)} unmountOnExit={true}>\n                <List sx={{ borderBottom: 1, borderColor: 'divider' }}>\n                  {selectedCategory?.categoryTotals?.map((subItem) => (\n                    <ListItem\n                      key={subItem.guid}\n                      sx={{\n                        pl: 12,\n                        py: 0,\n                      }}\n                    >\n                      <ListItemButton\n                        id={`spending-list-subcategory-${subItem.guid}`}\n                        onClick={() => onSelected(subItem.guid, true)}\n                        sx={{ minHeight: 44, px: 8, py: 0 }}\n                      >\n                        <Stack direction=\"row\" justifyContent=\"space-between\" width=\"100%\">\n                          <Text>{subItem.name} </Text>\n                          <Text>{formatCurrency(subItem.amount, '0,0.00')}</Text>\n                        </Stack>\n                      </ListItemButton>\n                    </ListItem>\n                  ))}\n                </List>\n              </Collapse>\n            )}\n          </React.Fragment>\n        ))}\n      </List>\n\n      <Text bold={true} sx={{ mt: 12, pr: 8, textAlign: 'right' }}>\n        {`${spendingCopy.total}: ${formatCurrency(data.totalAmount, '0,0.00')}`}\n      </Text>\n    </Stack>\n  )\n}\n\nexport default observer(SpendingList)\n"],"mappings":"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"}

package/dist/spending/components/SpendingTabLabel.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpendingTabLabel.es.js","names":[],"sources":["../../../src/spending/components/SpendingTabLabel.tsx"],"sourcesContent":["import React from 'react'\n\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\n\ninterface SpendingTabLabelProps {\n  amount: number\n  label: string\n  variant?: 'mini' | 'full'\n}\n\nconst SpendingTabLabel: React.FC<SpendingTabLabelProps> = ({ amount, label, variant = 'full' }) => {\n  return (\n    <Stack direction=\"column\">\n      <Text bold={true} sx={{ textTransform: 'none' }} variant=\"body1\">\n        {label}\n      </Text>\n      <Text variant=\"caption\">{formatCurrency(amount, variant === 'mini' ? '0,0' : '0,0.00')}</Text>\n    </Stack>\n  )\n}\n\nexport default SpendingTabLabel\n"],"mappings":";;;;;AAaA,IAAM,IAAA,CAAqD,EAAE,QAAA,GAAQ,OAAA,GAAO,SAAA,IAAU,OAAA,MAElF,gBAAA,EAAC,GAAD;AAAA,EAAO,WAAU;AAAA,YAAjB,CACE,gBAAA,EAAC,GAAD;AAAA,IAAM,MAAM;AAAA,IAAM,IAAI,EAAE,eAAe,OAAO;AAAA,IAAG,SAAQ;AAAA,cACtD;AAAA,EACG,CAAA,GACN,gBAAA,EAAC,GAAD;AAAA,IAAM,SAAQ;AAAA,cAAW,EAAe,GAAQ,MAAY,SAAS,QAAQ,QAAQ;AAAA,EAAQ,CAAA,CACxF"}
+{"version":3,"file":"SpendingTabLabel.es.js","names":[],"sources":["../../../src/spending/components/SpendingTabLabel.tsx"],"sourcesContent":["import React from 'react'\n\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\n\ninterface SpendingTabLabelProps {\n  amount: number\n  label: string\n  variant?: 'mini' | 'full'\n}\n\nconst SpendingTabLabel: React.FC<SpendingTabLabelProps> = ({ amount, label, variant = 'full' }) => {\n  return (\n    <Stack direction=\"column\">\n      <Text bold={true} sx={{ textTransform: 'none' }} variant=\"body1\">\n        {label}\n      </Text>\n      <Text variant=\"caption\">{formatCurrency(amount, variant === 'mini' ? '0,0' : '0,0.00')}</Text>\n    </Stack>\n  )\n}\n\nexport default SpendingTabLabel\n"],"mappings":";;;;;AAaA,IAAM,IAAA,CAAqD,EAAE,QAAA,GAAQ,OAAA,GAAO,SAAA,IAAU,OAAA,MAElF,gBAAA,EAAC,GAAD;AAAA,EAAO,WAAU;AAAA,EAAjB,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,IAAM,MAAM;AAAA,IAAM,IAAI,EAAE,eAAe,OAAO;AAAA,IAAG,SAAQ;AAAA,IACtD,UAAA;AAAA,EACG,CAAA,GACN,gBAAA,EAAC,GAAD;AAAA,IAAM,SAAQ;AAAA,IAAW,UAAA,EAAe,GAAQ,MAAY,SAAS,QAAQ,QAAQ;AAAA,EAAQ,CAAA,CACxF"}

package/dist/transactions/TransactionWidget.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TransactionWidget.es.js","names":[],"sources":["../../src/transactions/TransactionWidget.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { endOfMonth } from 'date-fns/endOfMonth'\nimport { getUnixTime } from 'date-fns/getUnixTime'\nimport { startOfMonth } from 'date-fns/startOfMonth'\nimport { startOfToday } from 'date-fns/startOfToday'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport type { DateRange } from '@mui/x-date-pickers-pro'\n\nimport {\n  ANALYTICS_EVENTS,\n  Drawer,\n  Loader,\n  SearchBox,\n  useAccountStore,\n  useAppConfig,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useScreenSize,\n  useTransactionStore,\n  useUserStore,\n  useWidgetLoadTimer,\n  WidgetContainer,\n} from '../common'\nimport { WidgetProps } from '../core'\n\nimport { useTransactionsUiStore } from './context/hooks'\nimport { DEFAULT_TRANSACTION } from '../core/constants/Transaction'\nimport { exportTransactionsToCSV } from '../core/utils/TransactionUtils'\nimport ConnectDrawer from '../common/components/ConnectDrawer'\nimport ManualTransactionDetails from './components/shared/transactiondetails/ManualTransactionDetails'\nimport TransactionDetails from './components/shared/TransactionDetails'\nimport TransactionList from './components/shared/TransactionList'\nimport TransactionTable from './components/shared/TransactionTable'\nimport AddAccountModal from './components/transactionwidget/AddAccountModal'\nimport EditCategoryAction from './components/transactionwidget/actions/EditCategoryAction'\n\nimport { useCategoryUiStore } from '../categories'\nimport { useAriaLive } from '../common/hooks/useAriaLive'\nimport { SkeletonLoader } from '../common/components/SkeletonLoader'\nimport { buildDynamicCopy } from '../core/utils/Localization'\n\nconst HEADER_HEIGHT = 120\n\nenum Drawers {\n  AddTransaction = 'addTransaction',\n  Category = 'category',\n  Transaction = 'transaction',\n}\n\ninterface TransactionWidgetProps extends WidgetProps {\n  height?: string | number\n  showInsights?: boolean\n}\n\nconst TransactionWidget: React.FC<TransactionWidgetProps> = ({\n  onBackClick,\n  onMenuClick,\n  height = '100dvh',\n  showInsights = false,\n  sx = {},\n}) => {\n  const { manualAccounts, refreshAccounts } = useAccountStore()\n  const { is_mobile_webview, clientConfig, config } = useAppConfig()\n  const { setSearchValue: setCategorySearchValue } = useCategoryUiStore()\n  const { onEvent } = useEvent()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const { displayedDateRange, isInitialized, selectedAccountGuids, setDisplayedDate } =\n    useGlobalUiStore()\n  const { isDesktop, isTablet } = useScreenSize()\n  const theme = useTheme()\n  const {\n    addTransaction,\n    filter,\n    isTransactionDataLoaded,\n    loadTransactionData,\n    setFilter,\n    sortedTransactions,\n    sortedTransactionsWithSplits,\n    tags,\n    detailedTransactions: transactions,\n    updateTransaction,\n  } = useTransactionStore()\n  const {\n    clearExpandedSplits,\n    isAmountValid,\n    manualTransaction,\n    searchValue,\n    setSearchValue,\n    setShowInsights,\n    updateManualTransaction,\n  } = useTransactionsUiStore()\n  const { userProfile } = useUserStore()\n\n  const [drawerOpen, setDrawerOpen] = React.useState('')\n  const [transactionGuid, setTransactionGuid] = React.useState('')\n\n  const [addManualAccountModalOpen, setAddManualAccountModalOpen] = React.useState(false)\n  const [showConnectWidget, setShowConnectWidget] = React.useState(false)\n\n  const { announce, ariaLive } = useAriaLive()\n\n  const selected_account_guid = clientConfig?.transactions?.selected_account_guid\n\n  useWidgetLoadTimer({\n    widgetName: 'TransactionWidget',\n    isLoaded: isTransactionDataLoaded,\n  })\n\n  React.useEffect(() => {\n    if (!isTransactionDataLoaded) {\n      loadTransactionData().finally()\n    }\n\n    // Set the displayed date to the current month\n    const startDate = startOfMonth(startOfToday())\n    const endDate = endOfMonth(startOfToday())\n    setDisplayedDate(startDate, endDate)\n\n    onEvent(ANALYTICS_EVENTS.TRANSACTIONS_VIEW)\n  }, [])\n\n  React.useEffect(() => {\n    if (isInitialized) {\n      // Update the filter whenever the display date or account filter changes\n      setFilter({\n        accounts: selected_account_guid ? [selected_account_guid] : selectedAccountGuids,\n        dateRange: { start: displayedDateRange.start, end: displayedDateRange.end },\n        searchTerm: searchValue,\n      })\n    }\n  }, [isInitialized, displayedDateRange, selectedAccountGuids])\n\n  React.useEffect(() => {\n    setShowInsights(showInsights)\n  }, [showInsights])\n\n  React.useEffect(() => {\n    if (isInitialized) {\n      announce(\n        buildDynamicCopy(copy.showing_transactions_count, sortedTransactions.length) as string,\n      )\n    }\n  }, [isInitialized, sortedTransactions])\n\n  const transaction = transactionGuid\n    ? transactions.find((transaction) => transaction.guid === transactionGuid)\n    : undefined\n\n  const isTransactionValid =\n    isAmountValid &&\n    Boolean(manualTransaction.payee) &&\n    Boolean(manualTransaction.account_guid) &&\n    Boolean(manualTransaction.category_guid)\n\n  const handleDateChanged = (range: DateRange<Date>) => {\n    clearExpandedSplits()\n    setDisplayedDate(range[0] as Date, range[1] as Date)\n  }\n\n  const handleSearch = (searchTerm: string) => {\n    setSearchValue(searchTerm)\n    setFilter({\n      ...filter,\n      searchTerm,\n    })\n    onEvent(ANALYTICS_EVENTS.TRANSACTIONS_CLICK_SEARCH, { search_term: searchTerm })\n  }\n\n  const handleExportCsvClick = () => {\n    exportTransactionsToCSV(sortedTransactionsWithSplits, tags)\n    onEvent(ANALYTICS_EVENTS.TRANSACTIONS_CLICK_EXPORT)\n  }\n\n  const handleAddTransactionClick = () => {\n    if (manualAccounts.length > 0) {\n      updateManualTransaction({\n        ...DEFAULT_TRANSACTION,\n        date: getUnixTime(startOfToday()),\n        user_guid: userProfile?.user_guid || '',\n      })\n\n      setDrawerOpen(Drawers.AddTransaction)\n      onEvent(ANALYTICS_EVENTS.TRANSACTIONS_CLICK_ADD)\n    } else {\n      setAddManualAccountModalOpen(true)\n      onEvent(ANALYTICS_EVENTS.TRANSACTIONS_ADD_MANUAL_ACCOUNT_MODAL)\n    }\n  }\n\n  const handleAddTransaction = async () => {\n    if (isTransactionValid) {\n      await addTransaction(manualTransaction)\n    }\n\n    setDrawerOpen('')\n  }\n\n  const handleAddManualAccountClick = () => {\n    setAddManualAccountModalOpen(false)\n    setShowConnectWidget(true)\n  }\n\n  const handleConnectWidgetClose = async () => {\n    setShowConnectWidget(false)\n    await refreshAccounts()\n  }\n\n  const handleTransactionDrawerClose = async () => {\n    // mark transaction as viewed\n    if (transaction && !transaction.has_been_viewed) {\n      await updateTransaction({ ...transaction, has_been_viewed: true })\n    }\n    setDrawerOpen('')\n  }\n\n  if (!isInitialized) {\n    return <Loader />\n  }\n\n  const actions = []\n\n  if (!is_mobile_webview && (isDesktop || isTablet)) {\n    actions.push({\n      iconName: 'open_in_new',\n      label: copy.export_csv_btn,\n      onClick: handleExportCsvClick,\n    })\n  }\n\n  if (config.show_connections_widget_in_master) {\n    actions.push({\n      iconName: 'add',\n      label: copy.add_transaction_btn,\n      onClick: handleAddTransactionClick,\n    })\n  }\n\n  return (\n    <WidgetContainer\n      actions={actions}\n      calendarActions={{\n        onRangeChanged: handleDateChanged,\n      }}\n      hasDivider={true}\n      onAccountsFilterClick={() => onEvent(ANALYTICS_EVENTS.ACCOUNTS_CLICK_FILTER)}\n      onBackClick={onBackClick}\n      onMenuClick={onMenuClick}\n      showAccountFilter={!selected_account_guid}\n      sx={sx}\n      title={copy.transactions_title}\n    >\n      {!isTransactionDataLoaded ? (\n        <SkeletonLoader sx={{ m: 48 }} variant=\"list\" />\n      ) : (\n        <Stack>\n          {ariaLive}\n          <Box>\n            <SearchBox\n              onChange={handleSearch}\n              placeholder={copy.action_bar_search_placeholder}\n              searchValue={searchValue}\n            />\n          </Box>\n\n          <Box\n            sx={{\n              [theme.breakpoints.down('md')]: { display: 'none' },\n              [theme.breakpoints.up('md')]: { display: 'block' },\n            }}\n          >\n            <TransactionTable\n              height={`calc(${height} - ${HEADER_HEIGHT}px)`}\n              onCategoryClick={(guid: string) => {\n                setTransactionGuid(guid)\n                setDrawerOpen(Drawers.Category)\n              }}\n              onRowClick={(guid: string) => {\n                setTransactionGuid(guid)\n                setDrawerOpen(Drawers.Transaction)\n                onEvent(ANALYTICS_EVENTS.TRANSACTIONS_CLICK_DETAILS, { transaction_guid: guid })\n              }}\n            />\n          </Box>\n          <Box\n            sx={{\n              [theme.breakpoints.down('md')]: { display: 'block' },\n              [theme.breakpoints.up('md')]: { display: 'none' },\n            }}\n          >\n            <TransactionList\n              height={`calc(${height} - ${HEADER_HEIGHT}px)`}\n              onClick={(guid: string) => {\n                setTransactionGuid(guid)\n                setDrawerOpen(Drawers.Transaction)\n              }}\n              showInsights={showInsights}\n            />\n          </Box>\n        </Stack>\n      )}\n\n      <Drawer\n        ariaLabelClose={commonCopy.close_aria}\n        isOpen={drawerOpen === Drawers.Transaction && Boolean(transaction)}\n        onClose={handleTransactionDrawerClose}\n        title={copy.details_title}\n      >\n        {transaction && <TransactionDetails transaction={transaction} />}\n      </Drawer>\n      {transaction && drawerOpen === Drawers.Category && (\n        <EditCategoryAction\n          onClose={() => {\n            setCategorySearchValue('')\n            setDrawerOpen('')\n            setTransactionGuid('')\n          }}\n          transaction={transaction}\n        />\n      )}\n      <Drawer\n        ariaLabelClose={commonCopy.close_aria}\n        isOpen={drawerOpen === Drawers.AddTransaction}\n        isPrimaryDisabled={!isTransactionValid}\n        onClose={() => setDrawerOpen('')}\n        onPrimaryAction={handleAddTransaction}\n        title={copy.add_transaction_title}\n      >\n        <ManualTransactionDetails />\n      </Drawer>\n      <AddAccountModal\n        copy={{ title: copy.add_manual_account }}\n        isOpen={addManualAccountModalOpen}\n        onClose={() => {\n          setAddManualAccountModalOpen(false)\n        }}\n        onPrimaryAction={handleAddManualAccountClick}\n      />\n      <ConnectDrawer\n        onClose={handleConnectWidgetClose}\n        showConnectWidget={showConnectWidget}\n        title={copy.add_manual_account}\n      />\n    </WidgetContainer>\n  )\n}\n\nexport default observer(TransactionWidget)\n"],"mappings":"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"}
+{"version":3,"file":"TransactionWidget.es.js","names":[],"sources":["../../src/transactions/TransactionWidget.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { endOfMonth } from 'date-fns/endOfMonth'\nimport { getUnixTime } from 'date-fns/getUnixTime'\nimport { startOfMonth } from 'date-fns/startOfMonth'\nimport { startOfToday } from 'date-fns/startOfToday'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport type { DateRange } from '@mui/x-date-pickers-pro'\n\nimport {\n  ANALYTICS_EVENTS,\n  Drawer,\n  Loader,\n  SearchBox,\n  useAccountStore,\n  useAppConfig,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useScreenSize,\n  useTransactionStore,\n  useUserStore,\n  useWidgetLoadTimer,\n  WidgetContainer,\n} from '../common'\nimport { WidgetProps } from '../core'\n\nimport { useTransactionsUiStore } from './context/hooks'\nimport { DEFAULT_TRANSACTION } from '../core/constants/Transaction'\nimport { exportTransactionsToCSV } from '../core/utils/TransactionUtils'\nimport ConnectDrawer from '../common/components/ConnectDrawer'\nimport ManualTransactionDetails from './components/shared/transactiondetails/ManualTransactionDetails'\nimport TransactionDetails from './components/shared/TransactionDetails'\nimport TransactionList from './components/shared/TransactionList'\nimport TransactionTable from './components/shared/TransactionTable'\nimport AddAccountModal from './components/transactionwidget/AddAccountModal'\nimport EditCategoryAction from './components/transactionwidget/actions/EditCategoryAction'\n\nimport { useCategoryUiStore } from '../categories'\nimport { useAriaLive } from '../common/hooks/useAriaLive'\nimport { SkeletonLoader } from '../common/components/SkeletonLoader'\nimport { buildDynamicCopy } from '../core/utils/Localization'\n\nconst HEADER_HEIGHT = 120\n\nenum Drawers {\n  AddTransaction = 'addTransaction',\n  Category = 'category',\n  Transaction = 'transaction',\n}\n\ninterface TransactionWidgetProps extends WidgetProps {\n  height?: string | number\n  showInsights?: boolean\n}\n\nconst TransactionWidget: React.FC<TransactionWidgetProps> = ({\n  onBackClick,\n  onMenuClick,\n  height = '100dvh',\n  showInsights = false,\n  sx = {},\n}) => {\n  const { manualAccounts, refreshAccounts } = useAccountStore()\n  const { is_mobile_webview, clientConfig, config } = useAppConfig()\n  const { setSearchValue: setCategorySearchValue } = useCategoryUiStore()\n  const { onEvent } = useEvent()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const { displayedDateRange, isInitialized, selectedAccountGuids, setDisplayedDate } =\n    useGlobalUiStore()\n  const { isDesktop, isTablet } = useScreenSize()\n  const theme = useTheme()\n  const {\n    addTransaction,\n    filter,\n    isTransactionDataLoaded,\n    loadTransactionData,\n    setFilter,\n    sortedTransactions,\n    sortedTransactionsWithSplits,\n    tags,\n    detailedTransactions: transactions,\n    updateTransaction,\n  } = useTransactionStore()\n  const {\n    clearExpandedSplits,\n    isAmountValid,\n    manualTransaction,\n    searchValue,\n    setSearchValue,\n    setShowInsights,\n    updateManualTransaction,\n  } = useTransactionsUiStore()\n  const { userProfile } = useUserStore()\n\n  const [drawerOpen, setDrawerOpen] = React.useState('')\n  const [transactionGuid, setTransactionGuid] = React.useState('')\n\n  const [addManualAccountModalOpen, setAddManualAccountModalOpen] = React.useState(false)\n  const [showConnectWidget, setShowConnectWidget] = React.useState(false)\n\n  const { announce, ariaLive } = useAriaLive()\n\n  const selected_account_guid = clientConfig?.transactions?.selected_account_guid\n\n  useWidgetLoadTimer({\n    widgetName: 'TransactionWidget',\n    isLoaded: isTransactionDataLoaded,\n  })\n\n  React.useEffect(() => {\n    if (!isTransactionDataLoaded) {\n      loadTransactionData().finally()\n    }\n\n    // Set the displayed date to the current month\n    const startDate = startOfMonth(startOfToday())\n    const endDate = endOfMonth(startOfToday())\n    setDisplayedDate(startDate, endDate)\n\n    onEvent(ANALYTICS_EVENTS.TRANSACTIONS_VIEW)\n  }, [])\n\n  React.useEffect(() => {\n    if (isInitialized) {\n      // Update the filter whenever the display date or account filter changes\n      setFilter({\n        accounts: selected_account_guid ? [selected_account_guid] : selectedAccountGuids,\n        dateRange: { start: displayedDateRange.start, end: displayedDateRange.end },\n        searchTerm: searchValue,\n      })\n    }\n  }, [isInitialized, displayedDateRange, selectedAccountGuids])\n\n  React.useEffect(() => {\n    setShowInsights(showInsights)\n  }, [showInsights])\n\n  React.useEffect(() => {\n    if (isInitialized) {\n      announce(\n        buildDynamicCopy(copy.showing_transactions_count, sortedTransactions.length) as string,\n      )\n    }\n  }, [isInitialized, sortedTransactions])\n\n  const transaction = transactionGuid\n    ? transactions.find((transaction) => transaction.guid === transactionGuid)\n    : undefined\n\n  const isTransactionValid =\n    isAmountValid &&\n    Boolean(manualTransaction.payee) &&\n    Boolean(manualTransaction.account_guid) &&\n    Boolean(manualTransaction.category_guid)\n\n  const handleDateChanged = (range: DateRange<Date>) => {\n    clearExpandedSplits()\n    setDisplayedDate(range[0] as Date, range[1] as Date)\n  }\n\n  const handleSearch = (searchTerm: string) => {\n    setSearchValue(searchTerm)\n    setFilter({\n      ...filter,\n      searchTerm,\n    })\n    onEvent(ANALYTICS_EVENTS.TRANSACTIONS_CLICK_SEARCH, { search_term: searchTerm })\n  }\n\n  const handleExportCsvClick = () => {\n    exportTransactionsToCSV(sortedTransactionsWithSplits, tags)\n    onEvent(ANALYTICS_EVENTS.TRANSACTIONS_CLICK_EXPORT)\n  }\n\n  const handleAddTransactionClick = () => {\n    if (manualAccounts.length > 0) {\n      updateManualTransaction({\n        ...DEFAULT_TRANSACTION,\n        date: getUnixTime(startOfToday()),\n        user_guid: userProfile?.user_guid || '',\n      })\n\n      setDrawerOpen(Drawers.AddTransaction)\n      onEvent(ANALYTICS_EVENTS.TRANSACTIONS_CLICK_ADD)\n    } else {\n      setAddManualAccountModalOpen(true)\n      onEvent(ANALYTICS_EVENTS.TRANSACTIONS_ADD_MANUAL_ACCOUNT_MODAL)\n    }\n  }\n\n  const handleAddTransaction = async () => {\n    if (isTransactionValid) {\n      await addTransaction(manualTransaction)\n    }\n\n    setDrawerOpen('')\n  }\n\n  const handleAddManualAccountClick = () => {\n    setAddManualAccountModalOpen(false)\n    setShowConnectWidget(true)\n  }\n\n  const handleConnectWidgetClose = async () => {\n    setShowConnectWidget(false)\n    await refreshAccounts()\n  }\n\n  const handleTransactionDrawerClose = async () => {\n    // mark transaction as viewed\n    if (transaction && !transaction.has_been_viewed) {\n      await updateTransaction({ ...transaction, has_been_viewed: true })\n    }\n    setDrawerOpen('')\n  }\n\n  if (!isInitialized) {\n    return <Loader />\n  }\n\n  const actions = []\n\n  if (!is_mobile_webview && (isDesktop || isTablet)) {\n    actions.push({\n      iconName: 'open_in_new',\n      label: copy.export_csv_btn,\n      onClick: handleExportCsvClick,\n    })\n  }\n\n  if (config.show_connections_widget_in_master) {\n    actions.push({\n      iconName: 'add',\n      label: copy.add_transaction_btn,\n      onClick: handleAddTransactionClick,\n    })\n  }\n\n  return (\n    <WidgetContainer\n      actions={actions}\n      calendarActions={{\n        onRangeChanged: handleDateChanged,\n      }}\n      hasDivider={true}\n      onAccountsFilterClick={() => onEvent(ANALYTICS_EVENTS.ACCOUNTS_CLICK_FILTER)}\n      onBackClick={onBackClick}\n      onMenuClick={onMenuClick}\n      showAccountFilter={!selected_account_guid}\n      sx={sx}\n      title={copy.transactions_title}\n    >\n      {!isTransactionDataLoaded ? (\n        <SkeletonLoader sx={{ m: 48 }} variant=\"list\" />\n      ) : (\n        <Stack>\n          {ariaLive}\n          <Box>\n            <SearchBox\n              onChange={handleSearch}\n              placeholder={copy.action_bar_search_placeholder}\n              searchValue={searchValue}\n            />\n          </Box>\n\n          <Box\n            sx={{\n              [theme.breakpoints.down('md')]: { display: 'none' },\n              [theme.breakpoints.up('md')]: { display: 'block' },\n            }}\n          >\n            <TransactionTable\n              height={`calc(${height} - ${HEADER_HEIGHT}px)`}\n              onCategoryClick={(guid: string) => {\n                setTransactionGuid(guid)\n                setDrawerOpen(Drawers.Category)\n              }}\n              onRowClick={(guid: string) => {\n                setTransactionGuid(guid)\n                setDrawerOpen(Drawers.Transaction)\n                onEvent(ANALYTICS_EVENTS.TRANSACTIONS_CLICK_DETAILS, { transaction_guid: guid })\n              }}\n            />\n          </Box>\n          <Box\n            sx={{\n              [theme.breakpoints.down('md')]: { display: 'block' },\n              [theme.breakpoints.up('md')]: { display: 'none' },\n            }}\n          >\n            <TransactionList\n              height={`calc(${height} - ${HEADER_HEIGHT}px)`}\n              onClick={(guid: string) => {\n                setTransactionGuid(guid)\n                setDrawerOpen(Drawers.Transaction)\n              }}\n              showInsights={showInsights}\n            />\n          </Box>\n        </Stack>\n      )}\n\n      <Drawer\n        ariaLabelClose={commonCopy.close_aria}\n        isOpen={drawerOpen === Drawers.Transaction && Boolean(transaction)}\n        onClose={handleTransactionDrawerClose}\n        title={copy.details_title}\n      >\n        {transaction && <TransactionDetails transaction={transaction} />}\n      </Drawer>\n      {transaction && drawerOpen === Drawers.Category && (\n        <EditCategoryAction\n          onClose={() => {\n            setCategorySearchValue('')\n            setDrawerOpen('')\n            setTransactionGuid('')\n          }}\n          transaction={transaction}\n        />\n      )}\n      <Drawer\n        ariaLabelClose={commonCopy.close_aria}\n        isOpen={drawerOpen === Drawers.AddTransaction}\n        isPrimaryDisabled={!isTransactionValid}\n        onClose={() => setDrawerOpen('')}\n        onPrimaryAction={handleAddTransaction}\n        title={copy.add_transaction_title}\n      >\n        <ManualTransactionDetails />\n      </Drawer>\n      <AddAccountModal\n        copy={{ title: copy.add_manual_account }}\n        isOpen={addManualAccountModalOpen}\n        onClose={() => {\n          setAddManualAccountModalOpen(false)\n        }}\n        onPrimaryAction={handleAddManualAccountClick}\n      />\n      <ConnectDrawer\n        onClose={handleConnectWidgetClose}\n        showConnectWidget={showConnectWidget}\n        title={copy.add_manual_account}\n      />\n    </WidgetContainer>\n  )\n}\n\nexport default observer(TransactionWidget)\n"],"mappings":"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"}

package/dist/transactions/components/shared/TransactionDetails.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TransactionDetails.es.js","names":[],"sources":["../../../../src/transactions/components/shared/TransactionDetails.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Alert from '@mui/material/Alert'\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport Paper from '@mui/material/Paper'\nimport Snackbar from '@mui/material/Snackbar'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { MerchantLogo, P, Text } from '@mxenabled/mxui'\n\nimport { endOfMonth } from 'date-fns/endOfMonth'\nimport { isBefore } from 'date-fns/isBefore'\nimport { startOfMonth } from 'date-fns/startOfMonth'\n\nimport {\n  ANALYTICS_EVENTS,\n  Loader,\n  useCategoryStore,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useTransactionStore,\n  useUserStore,\n} from '../../../common'\nimport { DATE_FORMATS_INTL, formatDate } from '../../../core/constants'\nimport { Transaction } from '../../../core'\nimport { fromUnixUTC } from '../../../core/utils/DateUtil'\nimport { isFeatureEnabled } from '../../../core/utils/UserUtils'\nimport { ChartTransactionWithDrillDown, EmbeddedCard } from '../../../insights'\n\nimport {\n  BottomActions,\n  DEFAULT_BOTTOM_ACTIONS,\n  DEFAULT_TOP_ACTIONS,\n  TopActions,\n} from '../../constants/Actions'\n\nimport {\n  AddMerchantBudgetAction,\n  CategoryAction,\n  DateAction,\n  DeleteAction,\n  DeleteLogoAction,\n  ExcludeAction,\n  MemoAction,\n  SplitAction,\n  TagsAction,\n} from './transactiondetails/actions'\nimport Description from './transactiondetails/Description'\nimport FlagTransaction from './transactiondetails/FlagTransaction'\nimport TransactionDetailsView from './transactiondetails/TransactionDetailsView'\nimport { getEmbeddedInstanceSlotByBeatTemplates } from './getEmbeddedInstanceSlotByBeatTemplates'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\nimport { buildDynamicCopy } from '../../../core/utils/Localization'\n\nexport interface TransactionDetailsProps {\n  bottomActions?: BottomActions[]\n  canFlagTransaction?: boolean\n  topActions?: TopActions[]\n  transaction: Transaction\n}\n\nconst TransactionDetails: React.FC<TransactionDetailsProps> = ({\n  bottomActions = DEFAULT_BOTTOM_ACTIONS,\n  canFlagTransaction = true,\n  topActions = DEFAULT_TOP_ACTIONS,\n  transaction,\n}) => {\n  const { onEvent } = useEvent()\n  const { isCopyLoaded } = useGlobalUiStore()\n  const { userFeatures } = useUserStore()\n  const { accounts: copy, common: commonCopy, insights_feed: insightsCopy } = useGlobalCopyStore()\n\n  const { detailedCategories } = useCategoryStore()\n  const {\n    alert,\n    associatedBeats,\n    detailedTransactions,\n    cachedStartDate,\n    loadEmbeddedInstanceTransactions,\n    setAlert,\n  } = useTransactionStore()\n\n  const [showTranscationDrilldownDrawer, setShowTransactionDrillDownDrawer] = React.useState(false)\n\n  const [isLoading, setIsLoading] = React.useState(false)\n  const [closeTipSection, setCloseTipSection] = React.useState(false)\n  const theme = useTheme()\n\n  const showFullNumber = transaction?.number && transaction.number.length > 4\n\n  const beat = React.useMemo(() => {\n    return associatedBeats.find((beat) => beat.associated_transaction_guid === transaction.guid)\n  }, [associatedBeats, transaction])\n\n  const embeddedData = getEmbeddedInstanceSlotByBeatTemplates(commonCopy, beat)\n\n  const [selectedTabIndex, setSelectedTabIndex] = React.useState(\n    embeddedData ? embeddedData.dataSeries.length - 1 : 0,\n  )\n\n  React.useEffect(\n    () =>\n      onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_VIEW, { transaction_guid: transaction.guid }),\n    [],\n  )\n\n  React.useEffect(() => {\n    if (!embeddedData || embeddedData.dataSeries.length === 0) return\n\n    const { date: selectedSeriesItemDate } = embeddedData.dataSeries[selectedTabIndex]\n\n    const start = startOfMonth(selectedSeriesItemDate)\n\n    if (isBefore(start, cachedStartDate)) {\n      setIsLoading(true)\n      loadEmbeddedInstanceTransactions(start).finally(() => {\n        setIsLoading(false)\n      })\n    }\n  }, [selectedTabIndex, embeddedData, cachedStartDate])\n\n  //if merchant_guid is null then no need to show the MerchantBudget action.\n  const updatedBottomActions =\n    bottomActions.includes(BottomActions.MerchantBudget) && !transaction?.merchant_guid\n      ? bottomActions.filter((action) => action !== BottomActions.MerchantBudget)\n      : bottomActions\n\n  const embeddedCardDataCategory = useMemo(() => {\n    if (embeddedData) {\n      const category = detailedCategories.find(\n        (cat) => cat.guid === transaction.top_level_category_guid,\n      )\n      const mean = beat?.payload?.average_amount ?? 0\n      const currentAmount = transaction.amount\n\n      let changetype = insightsCopy.general.increased_text\n      if (currentAmount - mean < 0) {\n        changetype = insightsCopy.general.decreased_text\n      }\n      const percentageAmount =\n        mean === 0 ? 0 : Math.round((Math.abs(currentAmount - mean) / mean) * 100)\n\n      return { category, percentageAmount, changetype }\n    }\n    return null\n  }, [embeddedData, detailedCategories])\n\n  const filteredTransactions = useMemo(() => {\n    if (!embeddedData?.dataSeries?.length) {\n      return []\n    }\n\n    const { guid: selectedSeriesItemGuid, date: selectedSeriesItemDate } =\n      embeddedData.dataSeries[selectedTabIndex]\n\n    const start = startOfMonth(selectedSeriesItemDate)\n    const end = endOfMonth(selectedSeriesItemDate)\n\n    return detailedTransactions.filter((t) => {\n      const transactionDate = fromUnixUTC(t.date)\n      return transactionDate >= start && transactionDate <= end && t.guid === selectedSeriesItemGuid\n    })\n  }, [selectedTabIndex, embeddedData, detailedTransactions, isLoading])\n\n  if (!isCopyLoaded) {\n    return <Loader />\n  }\n\n  const shouldShowViewOnlyMode = isFeatureEnabled(userFeatures, 'MX_TXN_DETAILS_VIEW_ONLY')\n\n  const bgColor = theme.palette.mode === 'dark' ? 'grey.800' : 'grey.100'\n\n  return (\n    <Box className=\"mx-txn-transaction-details\" width=\"100%\">\n      {transaction && (\n        <Stack>\n          <Stack gap={12} p={24}>\n            <Paper elevation={2} sx={{ width: 64 }}>\n              <MerchantLogo\n                categoryGuid={transaction.top_level_category_guid || ''}\n                merchantGuid={transaction.merchant_guid || ''}\n                size={64}\n              />\n            </Paper>\n\n            <Description transaction={transaction} viewOnly={shouldShowViewOnlyMode} />\n\n            <Stack direction=\"row\" justifyContent=\"space-between\" sx={{ minHeight: 44 }}>\n              <P color={transaction.isIncome ? 'success.main' : 'text.primary'} variant=\"h1\">\n                {transaction.isIncome ? '+' : ''}\n                {formatCurrency(transaction.amount, '0,0.00')}\n              </P>\n              {!shouldShowViewOnlyMode && canFlagTransaction && (\n                <FlagTransaction transaction={transaction} />\n              )}\n            </Stack>\n\n            {embeddedData?.instanceSlot && (\n              <EmbeddedCard\n                callToAction={embeddedData.callToAction}\n                description={\n                  buildDynamicCopy(\n                    insightsCopy.general.embedded_description,\n                    embeddedCardDataCategory!.changetype,\n                    <strong>{embeddedCardDataCategory!.percentageAmount}</strong>,\n                  ) as string\n                }\n                instanceSlot={embeddedData.instanceSlot}\n                onCtaClick={() => {\n                  setShowTransactionDrillDownDrawer(true)\n                }}\n                title={beat!.html_micro_title!}\n              />\n            )}\n            <Stack sx={{ bgcolor: bgColor, borderRadius: '4px', gap: 4, p: 8 }}>\n              <Text bold={true}>\n                {`${transaction.account}\n                ${\n                  showFullNumber\n                    ? transaction.number\n                    : '\\u2022'.repeat(4).concat(transaction.number ?? '')\n                }`}\n              </Text>\n              <Text bold={true} truncate={true} variant=\"tiny\">\n                {transaction.feed_description}\n              </Text>\n            </Stack>\n          </Stack>\n\n          <Paper square={true} sx={{ boxShadow: 'none' }}>\n            {shouldShowViewOnlyMode ? (\n              <TransactionDetailsView transaction={transaction} />\n            ) : (\n              <List>\n                {topActions.map((action, index) => (\n                  <React.Fragment key={action}>\n                    {action === TopActions.Category && <CategoryAction transaction={transaction} />}\n                    {action === TopActions.Date && <DateAction transaction={transaction} />}\n                    {action === TopActions.Memo && <MemoAction transaction={transaction} />}\n                    {action === TopActions.Tags && <TagsAction transaction={transaction} />}\n                    <Divider\n                      component=\"li\"\n                      variant={index < topActions.length - 1 ? 'inset' : 'fullWidth'}\n                    />\n                  </React.Fragment>\n                ))}\n              </List>\n            )}\n          </Paper>\n\n          {!shouldShowViewOnlyMode && updatedBottomActions.length > 0 && (\n            <React.Fragment>\n              <Text bold={true} mb={8} ml={26} mt={16} variant=\"body1\">\n                {copy.actions}\n              </Text>\n\n              <Paper square={true} sx={{ boxShadow: 'none' }}>\n                <List>\n                  {updatedBottomActions.map((action, index) => (\n                    <React.Fragment key={action}>\n                      {action === BottomActions.MerchantBudget && (\n                        <AddMerchantBudgetAction transaction={transaction} />\n                      )}\n                      {action === BottomActions.SplitTransaction && (\n                        <SplitAction transaction={transaction} />\n                      )}\n                      {action === BottomActions.HideTransaction && (\n                        <ExcludeAction transaction={transaction} />\n                      )}\n                      {action === BottomActions.MerchantLogo && (\n                        <DeleteLogoAction transaction={transaction} />\n                      )}\n                      <Divider\n                        component=\"li\"\n                        variant={index < updatedBottomActions.length - 1 ? 'inset' : 'fullWidth'}\n                      />\n                    </React.Fragment>\n                  ))}\n\n                  {/*\n                Show DeleteAction only if:\n                - The transaction is manual\n                - The transaction is NOT a parent transaction (no parent_guid)\n                - The transaction has NOT been split (has_been_split is false)\n                \n                This ensures delete is hidden for parent or split transactions.\n              */}\n                  {transaction.is_manual &&\n                    !transaction.parent_guid &&\n                    !transaction.has_been_split && <DeleteAction transaction={transaction} />}\n                </List>\n              </Paper>\n            </React.Fragment>\n          )}\n        </Stack>\n      )}\n      {beat && embeddedData && (\n        <ChartTransactionWithDrillDown\n          ariaLabel={formatDate(\n            embeddedData?.dataSeries[selectedTabIndex]?.date,\n            DATE_FORMATS_INTL.MONTH,\n          )}\n          barChartProps={{\n            amounts: {\n              average: beat.payload.average_amount,\n              formattedAverage: formatCurrency(beat.payload.average_amount, '0,0'),\n            },\n            color: embeddedCardDataCategory!.category?.color || '',\n            data: embeddedData.chartData,\n            margin: { bottom: 10, left: 24, right: 24, top: 20 },\n            monthlyAmountLabel: insightsCopy.general.monthly_amount,\n            onBarClick: (index) => {\n              setSelectedTabIndex(index)\n            },\n            trendAmountLabel: insightsCopy.general.trend,\n            legendPosition: 'top',\n          }}\n          beat={{\n            heading: beat.html_title,\n            subHeading: {\n              category_guid: transaction.category_guid ?? '',\n              merchant_guid: transaction.merchant_guid ?? '',\n              description: transaction.description ?? '',\n            },\n          }}\n          data={embeddedData.chartData}\n          defaultSelectedIndex={selectedTabIndex}\n          icon={\n            <MerchantLogo\n              alt={transaction.description ?? ''}\n              categoryGuid={transaction.category_guid ?? ''}\n              merchantGuid={transaction.merchant_guid ?? ''}\n              size={16}\n            />\n          }\n          isOpen={showTranscationDrilldownDrawer}\n          onClose={() => {\n            setShowTransactionDrillDownDrawer(false)\n            setSelectedTabIndex(embeddedData!.dataSeries.length - 1)\n          }}\n          onTabChange={(index: number) => {\n            setSelectedTabIndex(index)\n          }}\n          tipSection={\n            !closeTipSection\n              ? {\n                  message: buildDynamicCopy(\n                    insightsCopy.general.tip_section_message,\n                    <strong>{insightsCopy.general.tip_section_title}</strong>,\n                    <strong>{beat.primary_transaction?.description}</strong>,\n                  ) as string,\n                  onDismiss: () => setCloseTipSection(true),\n                }\n              : undefined\n          }\n          title={insightsCopy.general.transaction_history_title}\n          transactionListProps={{\n            showLoader: isLoading,\n            showInsights: true,\n            transaction: filteredTransactions,\n          }}\n        />\n      )}\n      <Snackbar\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n        autoHideDuration={3500}\n        onClose={() => setAlert('')}\n        open={Boolean(alert)}\n      >\n        <Alert closeText=\"\" onClose={() => setAlert('')} severity=\"success\" variant=\"filled\">\n          {alert}\n        </Alert>\n      </Snackbar>\n    </Box>\n  )\n}\n\nexport default observer(TransactionDetails)\n"],"mappings":"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"}
+{"version":3,"file":"TransactionDetails.es.js","names":[],"sources":["../../../../src/transactions/components/shared/TransactionDetails.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Alert from '@mui/material/Alert'\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport Paper from '@mui/material/Paper'\nimport Snackbar from '@mui/material/Snackbar'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { MerchantLogo, P, Text } from '@mxenabled/mxui'\n\nimport { endOfMonth } from 'date-fns/endOfMonth'\nimport { isBefore } from 'date-fns/isBefore'\nimport { startOfMonth } from 'date-fns/startOfMonth'\n\nimport {\n  ANALYTICS_EVENTS,\n  Loader,\n  useCategoryStore,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useTransactionStore,\n  useUserStore,\n} from '../../../common'\nimport { DATE_FORMATS_INTL, formatDate } from '../../../core/constants'\nimport { Transaction } from '../../../core'\nimport { fromUnixUTC } from '../../../core/utils/DateUtil'\nimport { isFeatureEnabled } from '../../../core/utils/UserUtils'\nimport { ChartTransactionWithDrillDown, EmbeddedCard } from '../../../insights'\n\nimport {\n  BottomActions,\n  DEFAULT_BOTTOM_ACTIONS,\n  DEFAULT_TOP_ACTIONS,\n  TopActions,\n} from '../../constants/Actions'\n\nimport {\n  AddMerchantBudgetAction,\n  CategoryAction,\n  DateAction,\n  DeleteAction,\n  DeleteLogoAction,\n  ExcludeAction,\n  MemoAction,\n  SplitAction,\n  TagsAction,\n} from './transactiondetails/actions'\nimport Description from './transactiondetails/Description'\nimport FlagTransaction from './transactiondetails/FlagTransaction'\nimport TransactionDetailsView from './transactiondetails/TransactionDetailsView'\nimport { getEmbeddedInstanceSlotByBeatTemplates } from './getEmbeddedInstanceSlotByBeatTemplates'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\nimport { buildDynamicCopy } from '../../../core/utils/Localization'\n\nexport interface TransactionDetailsProps {\n  bottomActions?: BottomActions[]\n  canFlagTransaction?: boolean\n  topActions?: TopActions[]\n  transaction: Transaction\n}\n\nconst TransactionDetails: React.FC<TransactionDetailsProps> = ({\n  bottomActions = DEFAULT_BOTTOM_ACTIONS,\n  canFlagTransaction = true,\n  topActions = DEFAULT_TOP_ACTIONS,\n  transaction,\n}) => {\n  const { onEvent } = useEvent()\n  const { isCopyLoaded } = useGlobalUiStore()\n  const { userFeatures } = useUserStore()\n  const { accounts: copy, common: commonCopy, insights_feed: insightsCopy } = useGlobalCopyStore()\n\n  const { detailedCategories } = useCategoryStore()\n  const {\n    alert,\n    associatedBeats,\n    detailedTransactions,\n    cachedStartDate,\n    loadEmbeddedInstanceTransactions,\n    setAlert,\n  } = useTransactionStore()\n\n  const [showTranscationDrilldownDrawer, setShowTransactionDrillDownDrawer] = React.useState(false)\n\n  const [isLoading, setIsLoading] = React.useState(false)\n  const [closeTipSection, setCloseTipSection] = React.useState(false)\n  const theme = useTheme()\n\n  const showFullNumber = transaction?.number && transaction.number.length > 4\n\n  const beat = React.useMemo(() => {\n    return associatedBeats.find((beat) => beat.associated_transaction_guid === transaction.guid)\n  }, [associatedBeats, transaction])\n\n  const embeddedData = getEmbeddedInstanceSlotByBeatTemplates(commonCopy, beat)\n\n  const [selectedTabIndex, setSelectedTabIndex] = React.useState(\n    embeddedData ? embeddedData.dataSeries.length - 1 : 0,\n  )\n\n  React.useEffect(\n    () =>\n      onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_VIEW, { transaction_guid: transaction.guid }),\n    [],\n  )\n\n  React.useEffect(() => {\n    if (!embeddedData || embeddedData.dataSeries.length === 0) return\n\n    const { date: selectedSeriesItemDate } = embeddedData.dataSeries[selectedTabIndex]\n\n    const start = startOfMonth(selectedSeriesItemDate)\n\n    if (isBefore(start, cachedStartDate)) {\n      setIsLoading(true)\n      loadEmbeddedInstanceTransactions(start).finally(() => {\n        setIsLoading(false)\n      })\n    }\n  }, [selectedTabIndex, embeddedData, cachedStartDate])\n\n  //if merchant_guid is null then no need to show the MerchantBudget action.\n  const updatedBottomActions =\n    bottomActions.includes(BottomActions.MerchantBudget) && !transaction?.merchant_guid\n      ? bottomActions.filter((action) => action !== BottomActions.MerchantBudget)\n      : bottomActions\n\n  const embeddedCardDataCategory = useMemo(() => {\n    if (embeddedData) {\n      const category = detailedCategories.find(\n        (cat) => cat.guid === transaction.top_level_category_guid,\n      )\n      const mean = beat?.payload?.average_amount ?? 0\n      const currentAmount = transaction.amount\n\n      let changetype = insightsCopy.general.increased_text\n      if (currentAmount - mean < 0) {\n        changetype = insightsCopy.general.decreased_text\n      }\n      const percentageAmount =\n        mean === 0 ? 0 : Math.round((Math.abs(currentAmount - mean) / mean) * 100)\n\n      return { category, percentageAmount, changetype }\n    }\n    return null\n  }, [embeddedData, detailedCategories])\n\n  const filteredTransactions = useMemo(() => {\n    if (!embeddedData?.dataSeries?.length) {\n      return []\n    }\n\n    const { guid: selectedSeriesItemGuid, date: selectedSeriesItemDate } =\n      embeddedData.dataSeries[selectedTabIndex]\n\n    const start = startOfMonth(selectedSeriesItemDate)\n    const end = endOfMonth(selectedSeriesItemDate)\n\n    return detailedTransactions.filter((t) => {\n      const transactionDate = fromUnixUTC(t.date)\n      return transactionDate >= start && transactionDate <= end && t.guid === selectedSeriesItemGuid\n    })\n  }, [selectedTabIndex, embeddedData, detailedTransactions, isLoading])\n\n  if (!isCopyLoaded) {\n    return <Loader />\n  }\n\n  const shouldShowViewOnlyMode = isFeatureEnabled(userFeatures, 'MX_TXN_DETAILS_VIEW_ONLY')\n\n  const bgColor = theme.palette.mode === 'dark' ? 'grey.800' : 'grey.100'\n\n  return (\n    <Box className=\"mx-txn-transaction-details\" width=\"100%\">\n      {transaction && (\n        <Stack>\n          <Stack gap={12} p={24}>\n            <Paper elevation={2} sx={{ width: 64 }}>\n              <MerchantLogo\n                categoryGuid={transaction.top_level_category_guid || ''}\n                merchantGuid={transaction.merchant_guid || ''}\n                size={64}\n              />\n            </Paper>\n\n            <Description transaction={transaction} viewOnly={shouldShowViewOnlyMode} />\n\n            <Stack direction=\"row\" justifyContent=\"space-between\" sx={{ minHeight: 44 }}>\n              <P color={transaction.isIncome ? 'success.main' : 'text.primary'} variant=\"h1\">\n                {transaction.isIncome ? '+' : ''}\n                {formatCurrency(transaction.amount, '0,0.00')}\n              </P>\n              {!shouldShowViewOnlyMode && canFlagTransaction && (\n                <FlagTransaction transaction={transaction} />\n              )}\n            </Stack>\n\n            {embeddedData?.instanceSlot && (\n              <EmbeddedCard\n                callToAction={embeddedData.callToAction}\n                description={\n                  buildDynamicCopy(\n                    insightsCopy.general.embedded_description,\n                    embeddedCardDataCategory!.changetype,\n                    <strong>{embeddedCardDataCategory!.percentageAmount}</strong>,\n                  ) as string\n                }\n                instanceSlot={embeddedData.instanceSlot}\n                onCtaClick={() => {\n                  setShowTransactionDrillDownDrawer(true)\n                }}\n                title={beat!.html_micro_title!}\n              />\n            )}\n            <Stack sx={{ bgcolor: bgColor, borderRadius: '4px', gap: 4, p: 8 }}>\n              <Text bold={true}>\n                {`${transaction.account}\n                ${\n                  showFullNumber\n                    ? transaction.number\n                    : '\\u2022'.repeat(4).concat(transaction.number ?? '')\n                }`}\n              </Text>\n              <Text bold={true} truncate={true} variant=\"tiny\">\n                {transaction.feed_description}\n              </Text>\n            </Stack>\n          </Stack>\n\n          <Paper square={true} sx={{ boxShadow: 'none' }}>\n            {shouldShowViewOnlyMode ? (\n              <TransactionDetailsView transaction={transaction} />\n            ) : (\n              <List>\n                {topActions.map((action, index) => (\n                  <React.Fragment key={action}>\n                    {action === TopActions.Category && <CategoryAction transaction={transaction} />}\n                    {action === TopActions.Date && <DateAction transaction={transaction} />}\n                    {action === TopActions.Memo && <MemoAction transaction={transaction} />}\n                    {action === TopActions.Tags && <TagsAction transaction={transaction} />}\n                    <Divider\n                      component=\"li\"\n                      variant={index < topActions.length - 1 ? 'inset' : 'fullWidth'}\n                    />\n                  </React.Fragment>\n                ))}\n              </List>\n            )}\n          </Paper>\n\n          {!shouldShowViewOnlyMode && updatedBottomActions.length > 0 && (\n            <React.Fragment>\n              <Text bold={true} mb={8} ml={26} mt={16} variant=\"body1\">\n                {copy.actions}\n              </Text>\n\n              <Paper square={true} sx={{ boxShadow: 'none' }}>\n                <List>\n                  {updatedBottomActions.map((action, index) => (\n                    <React.Fragment key={action}>\n                      {action === BottomActions.MerchantBudget && (\n                        <AddMerchantBudgetAction transaction={transaction} />\n                      )}\n                      {action === BottomActions.SplitTransaction && (\n                        <SplitAction transaction={transaction} />\n                      )}\n                      {action === BottomActions.HideTransaction && (\n                        <ExcludeAction transaction={transaction} />\n                      )}\n                      {action === BottomActions.MerchantLogo && (\n                        <DeleteLogoAction transaction={transaction} />\n                      )}\n                      <Divider\n                        component=\"li\"\n                        variant={index < updatedBottomActions.length - 1 ? 'inset' : 'fullWidth'}\n                      />\n                    </React.Fragment>\n                  ))}\n\n                  {/*\n                Show DeleteAction only if:\n                - The transaction is manual\n                - The transaction is NOT a parent transaction (no parent_guid)\n                - The transaction has NOT been split (has_been_split is false)\n                \n                This ensures delete is hidden for parent or split transactions.\n              */}\n                  {transaction.is_manual &&\n                    !transaction.parent_guid &&\n                    !transaction.has_been_split && <DeleteAction transaction={transaction} />}\n                </List>\n              </Paper>\n            </React.Fragment>\n          )}\n        </Stack>\n      )}\n      {beat && embeddedData && (\n        <ChartTransactionWithDrillDown\n          ariaLabel={formatDate(\n            embeddedData?.dataSeries[selectedTabIndex]?.date,\n            DATE_FORMATS_INTL.MONTH,\n          )}\n          barChartProps={{\n            amounts: {\n              average: beat.payload.average_amount,\n              formattedAverage: formatCurrency(beat.payload.average_amount, '0,0'),\n            },\n            color: embeddedCardDataCategory!.category?.color || '',\n            data: embeddedData.chartData,\n            margin: { bottom: 10, left: 24, right: 24, top: 20 },\n            monthlyAmountLabel: insightsCopy.general.monthly_amount,\n            onBarClick: (index) => {\n              setSelectedTabIndex(index)\n            },\n            trendAmountLabel: insightsCopy.general.trend,\n            legendPosition: 'top',\n          }}\n          beat={{\n            heading: beat.html_title,\n            subHeading: {\n              category_guid: transaction.category_guid ?? '',\n              merchant_guid: transaction.merchant_guid ?? '',\n              description: transaction.description ?? '',\n            },\n          }}\n          data={embeddedData.chartData}\n          defaultSelectedIndex={selectedTabIndex}\n          icon={\n            <MerchantLogo\n              alt={transaction.description ?? ''}\n              categoryGuid={transaction.category_guid ?? ''}\n              merchantGuid={transaction.merchant_guid ?? ''}\n              size={16}\n            />\n          }\n          isOpen={showTranscationDrilldownDrawer}\n          onClose={() => {\n            setShowTransactionDrillDownDrawer(false)\n            setSelectedTabIndex(embeddedData!.dataSeries.length - 1)\n          }}\n          onTabChange={(index: number) => {\n            setSelectedTabIndex(index)\n          }}\n          tipSection={\n            !closeTipSection\n              ? {\n                  message: buildDynamicCopy(\n                    insightsCopy.general.tip_section_message,\n                    <strong>{insightsCopy.general.tip_section_title}</strong>,\n                    <strong>{beat.primary_transaction?.description}</strong>,\n                  ) as string,\n                  onDismiss: () => setCloseTipSection(true),\n                }\n              : undefined\n          }\n          title={insightsCopy.general.transaction_history_title}\n          transactionListProps={{\n            showLoader: isLoading,\n            showInsights: true,\n            transaction: filteredTransactions,\n          }}\n        />\n      )}\n      <Snackbar\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n        autoHideDuration={3500}\n        onClose={() => setAlert('')}\n        open={Boolean(alert)}\n      >\n        <Alert closeText=\"\" onClose={() => setAlert('')} severity=\"success\" variant=\"filled\">\n          {alert}\n        </Alert>\n      </Snackbar>\n    </Box>\n  )\n}\n\nexport default observer(TransactionDetails)\n"],"mappings":"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"}

package/dist/transactions/components/shared/TransactionList.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TransactionList.es.js","names":[],"sources":["../../../../src/transactions/components/shared/TransactionList.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { useVirtualizer } from '@tanstack/react-virtual'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\n\nimport { ANALYTICS_EVENTS, Loader, useEvent } from '../../../common'\nimport { type Transaction } from '../../../core'\n\nimport { useTransactionsUiStore } from '../../context/hooks'\nimport { useTransactionStore } from '../../../common'\n\nimport SubheaderRow from '../../../common/components/SubheaderRow'\nimport TransactionRow from './transactionlist/TransactionRow'\nimport ZeroState from './transactionlist/ZeroState'\n\nimport { hasInsetBorder, shouldShowDate } from '../../utils/Transactions'\nimport { fromUnixUTCToDayOfWeekAndDate } from '../../../core/utils/DateUtil'\n\nconst ROW_HEIGHT = 65\nconst DATE_ROW_HEIGHT = 32\n\nexport interface TransactionListProps {\n  bgcolor?: string\n  filter?: (t: Transaction) => boolean\n  height?: number | string\n  loader?: React.JSX.Element\n  onClick?: (guid: string) => void\n  showInsights?: boolean\n  showLoader?: boolean\n  transaction?: Transaction[]\n  width?: number | string\n  zeroState?: React.JSX.Element\n}\n\nconst TransactionList: React.FC<TransactionListProps> = ({\n  bgcolor,\n  filter,\n  height = 'calc(100dvh - 36px)',\n  loader = <Loader label=\"Loading\" size={40} />,\n  onClick,\n  showInsights = false,\n  showLoader = false,\n  transaction,\n  width = '100%',\n  zeroState = <ZeroState />,\n}) => {\n  const { isLoading, sortedTransactions: allTransactions } = useTransactionStore()\n  const transactions = React.useMemo(() => {\n    const updatedTransactions = filter ? allTransactions.filter(filter) : allTransactions\n    return transaction ?? updatedTransactions\n  }, [allTransactions, transaction])\n\n  const { clearExpandedSplits, setShowInsights, toggleSplit } = useTransactionsUiStore()\n  const { onEvent } = useEvent()\n\n  const handleClick = (guid: string) => {\n    const transaction = transactions.find((t) => t.guid === guid)\n\n    if (transaction?.has_been_split) {\n      toggleSplit(transaction.guid)\n      return\n    }\n\n    onEvent(ANALYTICS_EVENTS.ACCOUNT_DETAILS_CLICK_TRANSACTION, {\n      account_guid: transaction?.account_guid,\n      transaction_guid: guid,\n    })\n    onClick?.(guid)\n  }\n\n  const parentRef = React.useRef<HTMLDivElement>(null)\n  const rowVirtualizer = useVirtualizer({\n    count: transactions.length,\n    getScrollElement: () => parentRef.current,\n    estimateSize: (i) => ROW_HEIGHT + (shouldShowDate(i, transactions) ? DATE_ROW_HEIGHT : 0),\n    overscan: 5,\n  })\n\n  React.useEffect(() => rowVirtualizer.measure(), [transactions])\n  React.useEffect(() => setShowInsights(showInsights), [showInsights])\n\n  React.useEffect(() => {\n    return () => clearExpandedSplits()\n  }, [])\n\n  return (\n    <List component=\"div\" role=\"list\" sx={{ width: width }}>\n      <Box height={height} overflow=\"auto\" ref={parentRef} role=\"presentation\" width={width}>\n        <Box\n          height={\n            // set the height to auto when there are no transactions so the zero state isn't set to 0\n            rowVirtualizer.getVirtualItems().length === 0 ? 'auto' : rowVirtualizer.getTotalSize()\n          }\n          position=\"relative\"\n          role=\"presentation\"\n          width=\"100%\"\n        >\n          {(isLoading || showLoader) && loader}\n          {!isLoading && !showLoader && rowVirtualizer.getVirtualItems().length === 0 && zeroState}\n          {!isLoading &&\n            !showLoader &&\n            rowVirtualizer.getVirtualItems().length > 0 &&\n            rowVirtualizer.getVirtualItems().map((row) => {\n              const transaction = transactions[row.index]\n              const showDate = shouldShowDate(row.index, transactions)\n              const isInset = hasInsetBorder(row.index, transactions)\n              const rowHeight = ROW_HEIGHT + (showDate ? DATE_ROW_HEIGHT : 0)\n\n              return (\n                <Box\n                  key={transaction.guid}\n                  role=\"listitem\"\n                  sx={{\n                    height: rowHeight,\n                    position: 'absolute',\n                    transform: `translateY(${row.start}px)`,\n                    width: '100%',\n                    bgcolor: 'background.paper',\n                  }}\n                >\n                  {showDate && (\n                    <SubheaderRow bgcolor={bgcolor}>\n                      {fromUnixUTCToDayOfWeekAndDate(transaction.date)}\n                    </SubheaderRow>\n                  )}\n                  <TransactionRow\n                    component=\"div\"\n                    {...(onClick && { onClick: handleClick })}\n                    transaction={transaction}\n                  />\n                  <Divider sx={{ ml: isInset ? 68 : 0 }} />\n                </Box>\n              )\n            })}\n        </Box>\n      </Box>\n    </List>\n  )\n}\n\nexport default observer(TransactionList)\n"],"mappings":"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"}
+{"version":3,"file":"TransactionList.es.js","names":[],"sources":["../../../../src/transactions/components/shared/TransactionList.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\nimport { useVirtualizer } from '@tanstack/react-virtual'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\n\nimport { ANALYTICS_EVENTS, Loader, useEvent } from '../../../common'\nimport { type Transaction } from '../../../core'\n\nimport { useTransactionsUiStore } from '../../context/hooks'\nimport { useTransactionStore } from '../../../common'\n\nimport SubheaderRow from '../../../common/components/SubheaderRow'\nimport TransactionRow from './transactionlist/TransactionRow'\nimport ZeroState from './transactionlist/ZeroState'\n\nimport { hasInsetBorder, shouldShowDate } from '../../utils/Transactions'\nimport { fromUnixUTCToDayOfWeekAndDate } from '../../../core/utils/DateUtil'\n\nconst ROW_HEIGHT = 65\nconst DATE_ROW_HEIGHT = 32\n\nexport interface TransactionListProps {\n  bgcolor?: string\n  filter?: (t: Transaction) => boolean\n  height?: number | string\n  loader?: React.JSX.Element\n  onClick?: (guid: string) => void\n  showInsights?: boolean\n  showLoader?: boolean\n  transaction?: Transaction[]\n  width?: number | string\n  zeroState?: React.JSX.Element\n}\n\nconst TransactionList: React.FC<TransactionListProps> = ({\n  bgcolor,\n  filter,\n  height = 'calc(100dvh - 36px)',\n  loader = <Loader label=\"Loading\" size={40} />,\n  onClick,\n  showInsights = false,\n  showLoader = false,\n  transaction,\n  width = '100%',\n  zeroState = <ZeroState />,\n}) => {\n  const { isLoading, sortedTransactions: allTransactions } = useTransactionStore()\n  const transactions = React.useMemo(() => {\n    const updatedTransactions = filter ? allTransactions.filter(filter) : allTransactions\n    return transaction ?? updatedTransactions\n  }, [allTransactions, transaction])\n\n  const { clearExpandedSplits, setShowInsights, toggleSplit } = useTransactionsUiStore()\n  const { onEvent } = useEvent()\n\n  const handleClick = (guid: string) => {\n    const transaction = transactions.find((t) => t.guid === guid)\n\n    if (transaction?.has_been_split) {\n      toggleSplit(transaction.guid)\n      return\n    }\n\n    onEvent(ANALYTICS_EVENTS.ACCOUNT_DETAILS_CLICK_TRANSACTION, {\n      account_guid: transaction?.account_guid,\n      transaction_guid: guid,\n    })\n    onClick?.(guid)\n  }\n\n  const parentRef = React.useRef<HTMLDivElement>(null)\n  const rowVirtualizer = useVirtualizer({\n    count: transactions.length,\n    getScrollElement: () => parentRef.current,\n    estimateSize: (i) => ROW_HEIGHT + (shouldShowDate(i, transactions) ? DATE_ROW_HEIGHT : 0),\n    overscan: 5,\n  })\n\n  React.useEffect(() => rowVirtualizer.measure(), [transactions])\n  React.useEffect(() => setShowInsights(showInsights), [showInsights])\n\n  React.useEffect(() => {\n    return () => clearExpandedSplits()\n  }, [])\n\n  return (\n    <List component=\"div\" role=\"list\" sx={{ width: width }}>\n      <Box height={height} overflow=\"auto\" ref={parentRef} role=\"presentation\" width={width}>\n        <Box\n          height={\n            // set the height to auto when there are no transactions so the zero state isn't set to 0\n            rowVirtualizer.getVirtualItems().length === 0 ? 'auto' : rowVirtualizer.getTotalSize()\n          }\n          position=\"relative\"\n          role=\"presentation\"\n          width=\"100%\"\n        >\n          {(isLoading || showLoader) && loader}\n          {!isLoading && !showLoader && rowVirtualizer.getVirtualItems().length === 0 && zeroState}\n          {!isLoading &&\n            !showLoader &&\n            rowVirtualizer.getVirtualItems().length > 0 &&\n            rowVirtualizer.getVirtualItems().map((row) => {\n              const transaction = transactions[row.index]\n              const showDate = shouldShowDate(row.index, transactions)\n              const isInset = hasInsetBorder(row.index, transactions)\n              const rowHeight = ROW_HEIGHT + (showDate ? DATE_ROW_HEIGHT : 0)\n\n              return (\n                <Box\n                  key={transaction.guid}\n                  role=\"listitem\"\n                  sx={{\n                    height: rowHeight,\n                    position: 'absolute',\n                    transform: `translateY(${row.start}px)`,\n                    width: '100%',\n                    bgcolor: 'background.paper',\n                  }}\n                >\n                  {showDate && (\n                    <SubheaderRow bgcolor={bgcolor}>\n                      {fromUnixUTCToDayOfWeekAndDate(transaction.date)}\n                    </SubheaderRow>\n                  )}\n                  <TransactionRow\n                    component=\"div\"\n                    {...(onClick && { onClick: handleClick })}\n                    transaction={transaction}\n                  />\n                  <Divider sx={{ ml: isInset ? 68 : 0 }} />\n                </Box>\n              )\n            })}\n        </Box>\n      </Box>\n    </List>\n  )\n}\n\nexport default observer(TransactionList)\n"],"mappings":";;;;;;;;;;;;;;;;AAqBA,IAAM,IAAa,IACb,IAAkB,IAelB,IAAA,CAAmD,EACvD,SAAA,GACA,QAAA,GACA,QAAA,IAAS,uBACT,QAAA,IAAS,gBAAA,EAAC,GAAD;AAAA,EAAQ,OAAM;AAAA,EAAU,MAAM;AAAK,CAAA,GAC5C,SAAA,GACA,cAAA,IAAe,IACf,YAAA,IAAa,IACb,aAAA,GACA,OAAA,IAAQ,QACR,WAAA,IAAY,gBAAA,EAAC,GAAD,CAAY,CAAA,EAAA,MACpB;AACJ,QAAM,EAAE,WAAA,GAAW,oBAAoB,EAAA,IAAoB,EAAoB,GACzE,IAAe,EAAM,QAAA,MAAc;AACvC,UAAM,IAAsB,IAAS,EAAgB,OAAO,CAAM,IAAI;AACtE,WAAO,KAAe;AAAA,EACxB,GAAG,CAAC,GAAiB,CAAW,CAAC,GAE3B,EAAE,qBAAA,GAAqB,iBAAA,GAAiB,aAAA,EAAA,IAAgB,EAAuB,GAC/E,EAAE,SAAA,EAAA,IAAY,EAAS,GAEvB,IAAA,CAAe,MAAiB;AACpC,UAAM,IAAc,EAAa,KAAA,CAAM,MAAM,EAAE,SAAS,CAAI;AAE5D,QAAI,GAAa,gBAAgB;AAC/B,MAAA,EAAY,EAAY,IAAI;AAC5B;AAAA,IACF;AAEA,IAAA,EAAQ,EAAiB,mCAAmC;AAAA,MAC1D,cAAc,GAAa;AAAA,MAC3B,kBAAkB;AAAA,IACpB,CAAC,GACD,IAAU,CAAI;AAAA,EAChB,GAEM,IAAY,EAAM,OAAuB,IAAI,GAC7C,IAAiB,EAAe;AAAA,IACpC,OAAO,EAAa;AAAA,IACpB,kBAAA,MAAwB,EAAU;AAAA,IAClC,cAAA,CAAe,MAAM,KAAc,EAAe,GAAG,CAAY,IAAI,IAAkB;AAAA,IACvF,UAAU;AAAA,EACZ,CAAC;AAED,SAAA,EAAM,UAAA,MAAgB,EAAe,QAAQ,GAAG,CAAC,CAAY,CAAC,GAC9D,EAAM,UAAA,MAAgB,EAAgB,CAAY,GAAG,CAAC,CAAY,CAAC,GAEnE,EAAM,UAAA,MACJ,MAAa,EAAoB,GAChC,CAAC,CAAC,GAGH,gBAAA,EAAC,GAAD;AAAA,IAAM,WAAU;AAAA,IAAM,MAAK;AAAA,IAAO,IAAI,EAAS,OAAA,EAAM;AAAA,IACnD,UAAA,gBAAA,EAAC,GAAD;AAAA,MAAa,QAAA;AAAA,MAAQ,UAAS;AAAA,MAAO,KAAK;AAAA,MAAW,MAAK;AAAA,MAAsB,OAAA;AAAA,MAC9E,UAAA,gBAAA,EAAC,GAAD;AAAA,QACE,QAEE,EAAe,gBAAgB,EAAE,WAAW,IAAI,SAAS,EAAe,aAAa;AAAA,QAEvF,UAAS;AAAA,QACT,MAAK;AAAA,QACL,OAAM;AAAA,QAPR,UAAA;AAAA,WASI,KAAa,MAAe;AAAA,UAC7B,CAAC,KAAa,CAAC,KAAc,EAAe,gBAAgB,EAAE,WAAW,KAAK;AAAA,UAC9E,CAAC,KACA,CAAC,KACD,EAAe,gBAAgB,EAAE,SAAS,KAC1C,EAAe,gBAAgB,EAAE,IAAA,CAAK,MAAQ;AAC5C,kBAAM,IAAc,EAAa,EAAI,KAAA,GAC/B,IAAW,EAAe,EAAI,OAAO,CAAY,GACjD,IAAU,EAAe,EAAI,OAAO,CAAY;AAGtD,mBACE,gBAAA,EAAC,GAAD;AAAA,cAEE,MAAK;AAAA,cACL,IAAI;AAAA,gBACF,QAPY,KAAc,IAAW,IAAkB;AAAA,gBAQvD,UAAU;AAAA,gBACV,WAAW,cAAc,EAAI,KAAA;AAAA,gBAC7B,OAAO;AAAA,gBACP,SAAS;AAAA,cACX;AAAA,cATF,UAAA;AAAA,gBAWG,KACC,gBAAA,EAAC,GAAD;AAAA,kBAAuB,SAAA;AAAA,kBACpB,UAAA,EAA8B,EAAY,IAAI;AAAA,gBACnC,CAAA;AAAA,gBAEhB,gBAAA,EAAC,GAAD;AAAA,kBACE,WAAU;AAAA,kBACV,GAAK,KAAW,EAAE,SAAS,EAAY;AAAA,kBAC1B,aAAA;AAAA,gBACd,CAAA;AAAA,gBACD,gBAAA,EAAC,GAAD,EAAS,IAAI,EAAE,IAAI,IAAU,KAAK,EAAE,EAAI,CAAA;AAAA,cACrC;AAAA,YArBE,GAAA,EAAY,IAqBd;AAAA,UAET,CAAC;AAAA,QACA;AAAA;IACF,CAAA;AAAA,EACD,CAAA;AAEV,GAEA,KAAe,EAAS,CAAe"}

package/dist/transactions/components/shared/TransactionTable.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TransactionTable.es.js","names":[],"sources":["../../../../src/transactions/components/shared/TransactionTable.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Paper from '@mui/material/Paper'\nimport { DataGridPro, GridCellParams, GridColDef } from '@mui/x-data-grid-pro'\n\nimport {\n  ANALYTICS_EVENTS,\n  Loader,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useTransactionStore,\n} from '../../../common'\n\nimport { useTransactionsUiStore } from '../../context/hooks'\n\nimport {\n  AccountCell,\n  AmountCell,\n  CategoryCell,\n  DateCell,\n  FlagCell,\n  HeaderCell,\n  PayeeCell,\n} from './transactiontable/cells'\n\ninterface TransactionTableProps {\n  height?: number | string\n  onCategoryClick?: (guid: string) => void\n  onRowClick?: (guid: string) => void\n}\n\nconst TransactionTable: React.FC<TransactionTableProps> = ({\n  height = '100dvh',\n  onCategoryClick,\n  onRowClick,\n}) => {\n  const { onEvent } = useEvent()\n  const { transactions: copy } = useGlobalCopyStore()\n  const { isCopyLoaded } = useGlobalUiStore()\n  const { isLoading, sortedTransactions } = useTransactionStore()\n  const { clearExpandedSplits, toggleSplit } = useTransactionsUiStore()\n\n  React.useEffect(() => {\n    return () => clearExpandedSplits()\n  }, [])\n\n  const rows = React.useMemo(\n    () =>\n      sortedTransactions.map((transaction) => ({\n        id: transaction.guid,\n        isHovering: false,\n        ...transaction,\n      })),\n    [sortedTransactions],\n  )\n\n  const handleCellClick = ({ row: { id, guid, has_been_split }, field }: GridCellParams) => {\n    if (has_been_split) return toggleSplit(id)\n\n    if (field === 'category') {\n      onEvent(ANALYTICS_EVENTS.TRANSACTIONS_TABLE_CLICK_CATEGORY, { guid })\n      return onCategoryClick?.(guid)\n    }\n\n    return onRowClick?.(guid)\n  }\n\n  const handleCellKeyDown = (params: GridCellParams, event: React.KeyboardEvent) => {\n    if (event.key !== 'Enter' && event.key !== ' ') return\n    handleCellClick(params)\n  }\n\n  if (!isCopyLoaded) {\n    return <Loader />\n  }\n\n  const columns: GridColDef[] = [\n    {\n      field: 'flag',\n      headerName: '',\n      minWidth: 32,\n      width: 32,\n      sortable: false,\n      renderCell: (params) => <FlagCell {...params} />,\n      renderHeader: () => <span aria-label={copy.transaction_status} />,\n    },\n    {\n      field: 'date',\n      headerName: copy.date_title,\n      width: 103,\n      renderHeader: HeaderCell,\n      renderCell: (params) => (params.row.parent_guid ? null : <DateCell {...params} />),\n      sortingOrder: ['desc', 'asc'],\n    },\n    {\n      cellClassName: 'vertical-align-center',\n      field: 'payee',\n      headerName: copy.payee_title,\n      flex: 0.33,\n      renderHeader: HeaderCell,\n      renderCell: (params) => <PayeeCell {...params} excludedText={copy.is_excluded} />,\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'category',\n      headerName: copy.category_title,\n      flex: 0.25,\n      renderHeader: HeaderCell,\n      renderCell: (params) => <CategoryCell {...params} />,\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'account',\n      headerName: copy.account_title,\n      flex: 0.33,\n      renderHeader: HeaderCell,\n      renderCell: (params) => (params.row.parent_guid ? null : <AccountCell {...params} />),\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'amount',\n      headerName: copy.amount_title,\n      flex: 0.25,\n      renderHeader: HeaderCell,\n      renderCell: AmountCell,\n      align: 'right',\n      headerAlign: 'right',\n      sortingOrder: ['asc', 'desc'],\n    },\n  ]\n\n  return (\n    <Paper sx={{ height: height, px: 24, width: '100%', boxShadow: 'none' }}>\n      <DataGridPro\n        columns={columns}\n        disableColumnFilter={true}\n        disableColumnMenu={true}\n        getCellClassName={(params) => {\n          if (params.row.parent_guid) return 'split-row'\n          if (params.row.is_hidden) return 'excluded-row'\n          return ''\n        }}\n        hideFooter={true}\n        initialState={{ sorting: { sortModel: [{ field: 'date', sort: 'desc' }] } }}\n        loading={isLoading}\n        onCellClick={handleCellClick}\n        onCellKeyDown={handleCellKeyDown}\n        rows={rows}\n        slotProps={{ baseIconButton: { color: 'secondary', sx: { ml: 8 } } }}\n        sx={{\n          '& .split-row': {\n            bgcolor: 'background.default',\n          },\n          '& .excluded-row': {\n            bgcolor: 'grey.50',\n            color: 'text.secondary',\n          },\n        }}\n      />\n    </Paper>\n  )\n}\n\nexport default observer(TransactionTable)\n"],"mappings":";;;;;;;;;;;;;;;;AAiCA,IAAM,IAAA,CAAqD,EACzD,QAAA,IAAS,UACT,iBAAA,GACA,YAAA,EAAA,MACI;AACJ,QAAM,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,EAAE,cAAc,EAAA,IAAS,EAAmB,GAC5C,EAAE,cAAA,EAAA,IAAiB,EAAiB,GACpC,EAAE,WAAA,GAAW,oBAAA,EAAA,IAAuB,EAAoB,GACxD,EAAE,qBAAA,GAAqB,aAAA,EAAA,IAAgB,EAAuB;AAEpE,EAAA,EAAM,UAAA,MACJ,MAAa,EAAoB,GAChC,CAAC,CAAC;AAEL,QAAM,IAAO,EAAM,QAAA,MAEf,EAAmB,IAAA,CAAK,OAAiB;AAAA,IACvC,IAAI,EAAY;AAAA,IAChB,YAAY;AAAA,IACZ,GAAG;AAAA,EACL,EAAE,GACJ,CAAC,CAAkB,CACrB,GAEM,IAAA,CAAmB,EAAE,KAAK,EAAE,IAAA,GAAI,MAAA,GAAM,gBAAA,EAAA,GAAkB,OAAA,EAAA,MACxD,IAAuB,EAAY,CAAE,IAErC,MAAU,cACZ,EAAQ,EAAiB,mCAAmC,EAAE,MAAA,EAAK,CAAC,GAC7D,IAAkB,CAAI,KAGxB,IAAa,CAAI,GAGpB,IAAA,CAAqB,GAAwB,MAA+B;AAChF,IAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,OAC3C,EAAgB,CAAM;AAAA,EACxB;AAEA,MAAI,CAAC,EACH,QAAO,gBAAA,EAAC,GAAD,CAAS,CAAA;AAGlB,QAAM,IAAwB;AAAA,IAC5B;AAAA,MACE,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,OAAO;AAAA,MACP,UAAU;AAAA,MACV,YAAA,CAAa,MAAW,gBAAA,EAAC,GAAD,EAAU,GAAI,EAAS,CAAA;AAAA,MAC/C,cAAA,MAAoB,gBAAA,EAAC,QAAD,EAAM,cAAY,EAAK,mBAAqB,CAAA;AAAA,IAClE;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,YAAY,EAAK;AAAA,MACjB,OAAO;AAAA,MACP,cAAc;AAAA,MACd,YAAA,CAAa,MAAY,EAAO,IAAI,cAAc,OAAO,gBAAA,EAAC,GAAD,EAAU,GAAI,EAAS,CAAA;AAAA,MAChF,cAAc,CAAC,QAAQ,KAAK;AAAA,IAC9B;AAAA,IACA;AAAA,MACE,eAAe;AAAA,MACf,OAAO;AAAA,MACP,YAAY,EAAK;AAAA,MACjB,MAAM;AAAA,MACN,cAAc;AAAA,MACd,YAAA,CAAa,MAAW,gBAAA,EAAC,GAAD;AAAA,QAAW,GAAI;AAAA,QAAQ,cAAc,EAAK;AAAA,MAAc,CAAA;AAAA,MAChF,cAAc,CAAC,OAAO,MAAM;AAAA,IAC9B;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,YAAY,EAAK;AAAA,MACjB,MAAM;AAAA,MACN,cAAc;AAAA,MACd,YAAA,CAAa,MAAW,gBAAA,EAAC,GAAD,EAAc,GAAI,EAAS,CAAA;AAAA,MACnD,cAAc,CAAC,OAAO,MAAM;AAAA,IAC9B;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,YAAY,EAAK;AAAA,MACjB,MAAM;AAAA,MACN,cAAc;AAAA,MACd,YAAA,CAAa,MAAY,EAAO,IAAI,cAAc,OAAO,gBAAA,EAAC,GAAD,EAAa,GAAI,EAAS,CAAA;AAAA,MACnF,cAAc,CAAC,OAAO,MAAM;AAAA,IAC9B;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,YAAY,EAAK;AAAA,MACjB,MAAM;AAAA,MACN,cAAc;AAAA,MACd,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,aAAa;AAAA,MACb,cAAc,CAAC,OAAO,MAAM;AAAA,IAC9B;AAAA,EACF;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAU,QAAA;AAAA,MAAQ,IAAI;AAAA,MAAI,OAAO;AAAA,MAAQ,WAAW;AAAA,IAAO;AAAA,cACpE,gBAAA,EAAC,GAAD;AAAA,MACW,SAAA;AAAA,MACT,qBAAqB;AAAA,MACrB,mBAAmB;AAAA,MACnB,kBAAA,CAAmB,MACb,EAAO,IAAI,cAAoB,cAC/B,EAAO,IAAI,YAAkB,iBAC1B;AAAA,MAET,YAAY;AAAA,MACZ,cAAc,EAAE,SAAS,EAAE,WAAW,CAAC;AAAA,QAAE,OAAO;AAAA,QAAQ,MAAM;AAAA,MAAO,CAAC,EAAE,EAAE;AAAA,MAC1E,SAAS;AAAA,MACT,aAAa;AAAA,MACb,eAAe;AAAA,MACT,MAAA;AAAA,MACN,WAAW,EAAE,gBAAgB;AAAA,QAAE,OAAO;AAAA,QAAa,IAAI,EAAE,IAAI,EAAE;AAAA,MAAE,EAAE;AAAA,MACnE,IAAI;AAAA,QACF,gBAAgB,EACd,SAAS,qBACX;AAAA,QACA,mBAAmB;AAAA,UACjB,SAAS;AAAA,UACT,OAAO;AAAA,QACT;AAAA,MACF;AAAA,IACD,CAAA;AAAA,EACI,CAAA;AAEX,GAEA,KAAe,EAAS,CAAgB"}
+{"version":3,"file":"TransactionTable.es.js","names":[],"sources":["../../../../src/transactions/components/shared/TransactionTable.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Paper from '@mui/material/Paper'\nimport { DataGridPro, GridCellParams, GridColDef } from '@mui/x-data-grid-pro'\n\nimport {\n  ANALYTICS_EVENTS,\n  Loader,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useTransactionStore,\n} from '../../../common'\n\nimport { useTransactionsUiStore } from '../../context/hooks'\n\nimport {\n  AccountCell,\n  AmountCell,\n  CategoryCell,\n  DateCell,\n  FlagCell,\n  HeaderCell,\n  PayeeCell,\n} from './transactiontable/cells'\n\ninterface TransactionTableProps {\n  height?: number | string\n  onCategoryClick?: (guid: string) => void\n  onRowClick?: (guid: string) => void\n}\n\nconst TransactionTable: React.FC<TransactionTableProps> = ({\n  height = '100dvh',\n  onCategoryClick,\n  onRowClick,\n}) => {\n  const { onEvent } = useEvent()\n  const { transactions: copy } = useGlobalCopyStore()\n  const { isCopyLoaded } = useGlobalUiStore()\n  const { isLoading, sortedTransactions } = useTransactionStore()\n  const { clearExpandedSplits, toggleSplit } = useTransactionsUiStore()\n\n  React.useEffect(() => {\n    return () => clearExpandedSplits()\n  }, [])\n\n  const rows = React.useMemo(\n    () =>\n      sortedTransactions.map((transaction) => ({\n        id: transaction.guid,\n        isHovering: false,\n        ...transaction,\n      })),\n    [sortedTransactions],\n  )\n\n  const handleCellClick = ({ row: { id, guid, has_been_split }, field }: GridCellParams) => {\n    if (has_been_split) return toggleSplit(id)\n\n    if (field === 'category') {\n      onEvent(ANALYTICS_EVENTS.TRANSACTIONS_TABLE_CLICK_CATEGORY, { guid })\n      return onCategoryClick?.(guid)\n    }\n\n    return onRowClick?.(guid)\n  }\n\n  const handleCellKeyDown = (params: GridCellParams, event: React.KeyboardEvent) => {\n    if (event.key !== 'Enter' && event.key !== ' ') return\n    handleCellClick(params)\n  }\n\n  if (!isCopyLoaded) {\n    return <Loader />\n  }\n\n  const columns: GridColDef[] = [\n    {\n      field: 'flag',\n      headerName: '',\n      minWidth: 32,\n      width: 32,\n      sortable: false,\n      renderCell: (params) => <FlagCell {...params} />,\n      renderHeader: () => <span aria-label={copy.transaction_status} />,\n    },\n    {\n      field: 'date',\n      headerName: copy.date_title,\n      width: 103,\n      renderHeader: HeaderCell,\n      renderCell: (params) => (params.row.parent_guid ? null : <DateCell {...params} />),\n      sortingOrder: ['desc', 'asc'],\n    },\n    {\n      cellClassName: 'vertical-align-center',\n      field: 'payee',\n      headerName: copy.payee_title,\n      flex: 0.33,\n      renderHeader: HeaderCell,\n      renderCell: (params) => <PayeeCell {...params} excludedText={copy.is_excluded} />,\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'category',\n      headerName: copy.category_title,\n      flex: 0.25,\n      renderHeader: HeaderCell,\n      renderCell: (params) => <CategoryCell {...params} />,\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'account',\n      headerName: copy.account_title,\n      flex: 0.33,\n      renderHeader: HeaderCell,\n      renderCell: (params) => (params.row.parent_guid ? null : <AccountCell {...params} />),\n      sortingOrder: ['asc', 'desc'],\n    },\n    {\n      field: 'amount',\n      headerName: copy.amount_title,\n      flex: 0.25,\n      renderHeader: HeaderCell,\n      renderCell: AmountCell,\n      align: 'right',\n      headerAlign: 'right',\n      sortingOrder: ['asc', 'desc'],\n    },\n  ]\n\n  return (\n    <Paper sx={{ height: height, px: 24, width: '100%', boxShadow: 'none' }}>\n      <DataGridPro\n        columns={columns}\n        disableColumnFilter={true}\n        disableColumnMenu={true}\n        getCellClassName={(params) => {\n          if (params.row.parent_guid) return 'split-row'\n          if (params.row.is_hidden) return 'excluded-row'\n          return ''\n        }}\n        hideFooter={true}\n        initialState={{ sorting: { sortModel: [{ field: 'date', sort: 'desc' }] } }}\n        loading={isLoading}\n        onCellClick={handleCellClick}\n        onCellKeyDown={handleCellKeyDown}\n        rows={rows}\n        slotProps={{ baseIconButton: { color: 'secondary', sx: { ml: 8 } } }}\n        sx={{\n          '& .split-row': {\n            bgcolor: 'background.default',\n          },\n          '& .excluded-row': {\n            bgcolor: 'grey.50',\n            color: 'text.secondary',\n          },\n        }}\n      />\n    </Paper>\n  )\n}\n\nexport default observer(TransactionTable)\n"],"mappings":"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"}

package/dist/transactions/components/shared/transactiondetails/Description.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Description.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/transactiondetails/Description.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport FormGroup from '@mui/material/FormGroup'\nimport IconButton from '@mui/material/IconButton'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\n\nimport { Icon, Text } from '@mxenabled/mxui'\n\nimport type { Transaction } from '../../../../core'\n\nimport {\n  ANALYTICS_EVENTS,\n  useEvent,\n  useGlobalCopyStore,\n  useTransactionStore,\n} from '../../../../common'\nimport { useAriaLive } from '../../../../common/hooks/useAriaLive'\nimport { ON_CLICK_EVENTS } from '../../../constants/OnClickEvents'\n\ninterface DescriptionProps {\n  transaction: Transaction\n  viewOnly?: boolean\n}\n\nconst Description: React.FC<DescriptionProps> = ({ transaction, viewOnly = false }) => {\n  const { updateTransaction } = useTransactionStore()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const { onEvent } = useEvent()\n  const { announce, ariaLive } = useAriaLive()\n\n  const [isEditing, setIsEditing] = React.useState(false)\n  const [description, setDescription] = React.useState('')\n\n  const inputRef = React.useRef<HTMLInputElement>(null)\n\n  React.useEffect(() => {\n    if (isEditing) {\n      setDescription(transaction.description)\n      inputRef?.current?.focus()\n    }\n  }, [isEditing])\n\n  const handleEdit = () => {\n    setIsEditing(true)\n    onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_DESCRIPTION_EDIT_CLICK)\n    setTimeout(() => document.getElementById(`transaction-description-input`)?.focus(), 0)\n  }\n\n  const handleSave = async () => {\n    onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_CLICK_DESCRIPTION, {\n      transaction_guid: transaction.guid,\n    })\n    await updateTransaction({ ...transaction, description })\n    setIsEditing(false)\n    announce(`${copy.payee_title}: ${description}`)\n    setTimeout(() => document.getElementById(`transaction-description-edit-button`)?.focus(), 0)\n  }\n\n  return (\n    <Box className=\"mx-txn-transaction-description\">\n      {ariaLive}\n      {isEditing ? (\n        <FormGroup row={true}>\n          <TextField\n            aria-label={copy.payee_title}\n            id={`transaction-description-input`}\n            label={copy.payee_title}\n            name={copy.payee_title}\n            onChange={(e: React.ChangeEvent<HTMLInputElement>) => setDescription(e.target.value)}\n            ref={inputRef}\n            slotProps={{ htmlInput: { maxLength: 140 } }}\n            sx={{\n              backgroundColor: 'background.paper',\n              '.MuiOutlinedInput-root': { borderTopRightRadius: 0, borderBottomRightRadius: 0 },\n              '.MuiOutlinedInput-input': { p: 11 },\n              width: 250,\n            }}\n            value={description}\n          />\n          <Button\n            disabled={!description}\n            onClick={handleSave}\n            sx={{\n              borderTopLeftRadius: 0,\n              borderBottomLeftRadius: 0,\n            }}\n            variant=\"outlined\"\n          >\n            {commonCopy.save_button}\n          </Button>\n        </FormGroup>\n      ) : (\n        <Stack alignItems=\"center\" direction=\"row\" gap={4} sx={{ minHeight: 44 }}>\n          <Text bold={true}>{transaction.description}</Text>\n          {!viewOnly && (\n            <IconButton\n              aria-label={copy.payee_edit}\n              id={`transaction-description-edit-button`}\n              onClick={handleEdit}\n              sx={{ color: 'action.active' }}\n            >\n              <Icon name=\"create\" size={22} />\n            </IconButton>\n          )}\n        </Stack>\n      )}\n    </Box>\n  )\n}\n\nexport default observer(Description)\n"],"mappings":";;;;;;;;;;;;;;AA4BA,IAAM,IAAA,CAA2C,EAAE,aAAA,GAAa,UAAA,IAAW,GAAA,MAAY;AACrF,QAAM,EAAE,mBAAA,EAAA,IAAsB,EAAoB,GAC5C,EAAE,QAAQ,GAAY,cAAc,EAAA,IAAS,EAAmB,GAChE,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,EAAE,UAAA,GAAU,UAAA,EAAA,IAAa,EAAY,GAErC,CAAC,GAAW,CAAA,IAAgB,EAAM,SAAS,EAAK,GAChD,CAAC,GAAa,CAAA,IAAkB,EAAM,SAAS,EAAE,GAEjD,IAAW,EAAM,OAAyB,IAAI;AAEpD,EAAA,EAAM,UAAA,MAAgB;AACpB,IAAI,MACF,EAAe,EAAY,WAAW,GACtC,GAAU,SAAS,MAAM;AAAA,EAE7B,GAAG,CAAC,CAAS,CAAC;AAEd,QAAM,IAAA,MAAmB;AACvB,IAAA,EAAa,EAAI,GACjB,EAAQ,EAAgB,qCAAqC,GAC7D,WAAA,MAAiB,SAAS,eAAe,+BAA+B,GAAG,MAAM,GAAG,CAAC;AAAA,EACvF,GAEM,IAAa,YAAY;AAC7B,IAAA,EAAQ,EAAiB,uCAAuC,EAC9D,kBAAkB,EAAY,KAChC,CAAC,GACD,MAAM,EAAkB;AAAA,MAAE,GAAG;AAAA,MAAa,aAAA;AAAA,IAAY,CAAC,GACvD,EAAa,EAAK,GAClB,EAAS,GAAG,EAAK,WAAA,KAAgB,CAAA,EAAa,GAC9C,WAAA,MAAiB,SAAS,eAAe,qCAAqC,GAAG,MAAM,GAAG,CAAC;AAAA,EAC7F;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAK,WAAU;AAAA,cAAf,CACG,GACA,IACC,gBAAA,EAAC,GAAD;AAAA,MAAW,KAAK;AAAA,gBAAhB,CACE,gBAAA,EAAC,GAAD;AAAA,QACE,cAAY,EAAK;AAAA,QACjB,IAAI;AAAA,QACJ,OAAO,EAAK;AAAA,QACZ,MAAM,EAAK;AAAA,QACX,UAAA,CAAW,MAA2C,EAAe,EAAE,OAAO,KAAK;AAAA,QACnF,KAAK;AAAA,QACL,WAAW,EAAE,WAAW,EAAE,WAAW,IAAI,EAAE;AAAA,QAC3C,IAAI;AAAA,UACF,iBAAiB;AAAA,UACjB,0BAA0B;AAAA,YAAE,sBAAsB;AAAA,YAAG,yBAAyB;AAAA,UAAE;AAAA,UAChF,2BAA2B,EAAE,GAAG,GAAG;AAAA,UACnC,OAAO;AAAA,QACT;AAAA,QACA,OAAO;AAAA,MACR,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,QACE,UAAU,CAAC;AAAA,QACX,SAAS;AAAA,QACT,IAAI;AAAA,UACF,qBAAqB;AAAA,UACrB,wBAAwB;AAAA,QAC1B;AAAA,QACA,SAAQ;AAAA,kBAEP,EAAW;AAAA,MACN,CAAA,CACC;AAAA,SAEX,gBAAA,EAAC,GAAD;AAAA,MAAO,YAAW;AAAA,MAAS,WAAU;AAAA,MAAM,KAAK;AAAA,MAAG,IAAI,EAAE,WAAW,GAAG;AAAA,gBAAvE,CACE,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAM;AAAA,kBAAO,EAAY;AAAA,MAAkB,CAAA,GAChD,CAAC,KACA,gBAAA,EAAC,GAAD;AAAA,QACE,cAAY,EAAK;AAAA,QACjB,IAAI;AAAA,QACJ,SAAS;AAAA,QACT,IAAI,EAAE,OAAO,gBAAgB;AAAA,kBAE7B,gBAAA,EAAC,GAAD;AAAA,UAAM,MAAK;AAAA,UAAS,MAAM;AAAA,QAAK,CAAA;AAAA,MACrB,CAAA,CAET;AAAA,MAEN;AAAA;AAET,GAEA,IAAe,EAAS,CAAW"}
+{"version":3,"file":"Description.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/transactiondetails/Description.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport FormGroup from '@mui/material/FormGroup'\nimport IconButton from '@mui/material/IconButton'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\n\nimport { Icon, Text } from '@mxenabled/mxui'\n\nimport type { Transaction } from '../../../../core'\n\nimport {\n  ANALYTICS_EVENTS,\n  useEvent,\n  useGlobalCopyStore,\n  useTransactionStore,\n} from '../../../../common'\nimport { useAriaLive } from '../../../../common/hooks/useAriaLive'\nimport { ON_CLICK_EVENTS } from '../../../constants/OnClickEvents'\n\ninterface DescriptionProps {\n  transaction: Transaction\n  viewOnly?: boolean\n}\n\nconst Description: React.FC<DescriptionProps> = ({ transaction, viewOnly = false }) => {\n  const { updateTransaction } = useTransactionStore()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const { onEvent } = useEvent()\n  const { announce, ariaLive } = useAriaLive()\n\n  const [isEditing, setIsEditing] = React.useState(false)\n  const [description, setDescription] = React.useState('')\n\n  const inputRef = React.useRef<HTMLInputElement>(null)\n\n  React.useEffect(() => {\n    if (isEditing) {\n      setDescription(transaction.description)\n      inputRef?.current?.focus()\n    }\n  }, [isEditing])\n\n  const handleEdit = () => {\n    setIsEditing(true)\n    onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_DESCRIPTION_EDIT_CLICK)\n    setTimeout(() => document.getElementById(`transaction-description-input`)?.focus(), 0)\n  }\n\n  const handleSave = async () => {\n    onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_CLICK_DESCRIPTION, {\n      transaction_guid: transaction.guid,\n    })\n    await updateTransaction({ ...transaction, description })\n    setIsEditing(false)\n    announce(`${copy.payee_title}: ${description}`)\n    setTimeout(() => document.getElementById(`transaction-description-edit-button`)?.focus(), 0)\n  }\n\n  return (\n    <Box className=\"mx-txn-transaction-description\">\n      {ariaLive}\n      {isEditing ? (\n        <FormGroup row={true}>\n          <TextField\n            aria-label={copy.payee_title}\n            id={`transaction-description-input`}\n            label={copy.payee_title}\n            name={copy.payee_title}\n            onChange={(e: React.ChangeEvent<HTMLInputElement>) => setDescription(e.target.value)}\n            ref={inputRef}\n            slotProps={{ htmlInput: { maxLength: 140 } }}\n            sx={{\n              backgroundColor: 'background.paper',\n              '.MuiOutlinedInput-root': { borderTopRightRadius: 0, borderBottomRightRadius: 0 },\n              '.MuiOutlinedInput-input': { p: 11 },\n              width: 250,\n            }}\n            value={description}\n          />\n          <Button\n            disabled={!description}\n            onClick={handleSave}\n            sx={{\n              borderTopLeftRadius: 0,\n              borderBottomLeftRadius: 0,\n            }}\n            variant=\"outlined\"\n          >\n            {commonCopy.save_button}\n          </Button>\n        </FormGroup>\n      ) : (\n        <Stack alignItems=\"center\" direction=\"row\" gap={4} sx={{ minHeight: 44 }}>\n          <Text bold={true}>{transaction.description}</Text>\n          {!viewOnly && (\n            <IconButton\n              aria-label={copy.payee_edit}\n              id={`transaction-description-edit-button`}\n              onClick={handleEdit}\n              sx={{ color: 'action.active' }}\n            >\n              <Icon name=\"create\" size={22} />\n            </IconButton>\n          )}\n        </Stack>\n      )}\n    </Box>\n  )\n}\n\nexport default observer(Description)\n"],"mappings":";;;;;;;;;;;;;;AA4BA,IAAM,IAAA,CAA2C,EAAE,aAAA,GAAa,UAAA,IAAW,GAAA,MAAY;AACrF,QAAM,EAAE,mBAAA,EAAA,IAAsB,EAAoB,GAC5C,EAAE,QAAQ,GAAY,cAAc,EAAA,IAAS,EAAmB,GAChE,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,EAAE,UAAA,GAAU,UAAA,EAAA,IAAa,EAAY,GAErC,CAAC,GAAW,CAAA,IAAgB,EAAM,SAAS,EAAK,GAChD,CAAC,GAAa,CAAA,IAAkB,EAAM,SAAS,EAAE,GAEjD,IAAW,EAAM,OAAyB,IAAI;AAEpD,EAAA,EAAM,UAAA,MAAgB;AACpB,IAAI,MACF,EAAe,EAAY,WAAW,GACtC,GAAU,SAAS,MAAM;AAAA,EAE7B,GAAG,CAAC,CAAS,CAAC;AAEd,QAAM,IAAA,MAAmB;AACvB,IAAA,EAAa,EAAI,GACjB,EAAQ,EAAgB,qCAAqC,GAC7D,WAAA,MAAiB,SAAS,eAAe,+BAA+B,GAAG,MAAM,GAAG,CAAC;AAAA,EACvF,GAEM,IAAa,YAAY;AAC7B,IAAA,EAAQ,EAAiB,uCAAuC,EAC9D,kBAAkB,EAAY,KAChC,CAAC,GACD,MAAM,EAAkB;AAAA,MAAE,GAAG;AAAA,MAAa,aAAA;AAAA,IAAY,CAAC,GACvD,EAAa,EAAK,GAClB,EAAS,GAAG,EAAK,WAAA,KAAgB,CAAA,EAAa,GAC9C,WAAA,MAAiB,SAAS,eAAe,qCAAqC,GAAG,MAAM,GAAG,CAAC;AAAA,EAC7F;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAK,WAAU;AAAA,IAAf,UAAA,CACG,GACA,IACC,gBAAA,EAAC,GAAD;AAAA,MAAW,KAAK;AAAA,MAAhB,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,QACE,cAAY,EAAK;AAAA,QACjB,IAAI;AAAA,QACJ,OAAO,EAAK;AAAA,QACZ,MAAM,EAAK;AAAA,QACX,UAAA,CAAW,MAA2C,EAAe,EAAE,OAAO,KAAK;AAAA,QACnF,KAAK;AAAA,QACL,WAAW,EAAE,WAAW,EAAE,WAAW,IAAI,EAAE;AAAA,QAC3C,IAAI;AAAA,UACF,iBAAiB;AAAA,UACjB,0BAA0B;AAAA,YAAE,sBAAsB;AAAA,YAAG,yBAAyB;AAAA,UAAE;AAAA,UAChF,2BAA2B,EAAE,GAAG,GAAG;AAAA,UACnC,OAAO;AAAA,QACT;AAAA,QACA,OAAO;AAAA,MACR,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,QACE,UAAU,CAAC;AAAA,QACX,SAAS;AAAA,QACT,IAAI;AAAA,UACF,qBAAqB;AAAA,UACrB,wBAAwB;AAAA,QAC1B;AAAA,QACA,SAAQ;AAAA,QAEP,UAAA,EAAW;AAAA,MACN,CAAA,CACC;AAAA,IAEX,CAAA,IAAA,gBAAA,EAAC,GAAD;AAAA,MAAO,YAAW;AAAA,MAAS,WAAU;AAAA,MAAM,KAAK;AAAA,MAAG,IAAI,EAAE,WAAW,GAAG;AAAA,MAAvE,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAM;AAAA,QAAO,UAAA,EAAY;AAAA,MAAkB,CAAA,GAChD,CAAC,KACA,gBAAA,EAAC,GAAD;AAAA,QACE,cAAY,EAAK;AAAA,QACjB,IAAI;AAAA,QACJ,SAAS;AAAA,QACT,IAAI,EAAE,OAAO,gBAAgB;AAAA,QAE7B,UAAA,gBAAA,EAAC,GAAD;AAAA,UAAM,MAAK;AAAA,UAAS,MAAM;AAAA,QAAK,CAAA;AAAA,MACrB,CAAA,CAET;AAAA,IAEN,CAAA,CAAA;AAAA;AAET,GAEA,IAAe,EAAS,CAAW"}

package/dist/transactions/components/shared/transactiondetails/FlagTransaction.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlagTransaction.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/transactiondetails/FlagTransaction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport ToggleButton from '@mui/material/ToggleButton'\nimport { alpha, useTheme } from '@mui/material/styles'\n\nimport { Flag as FlagOutlinedIcon } from '@mxenabled/mx-icons'\n\nimport type { Transaction } from '../../../../core'\n\nimport {\n  ANALYTICS_EVENTS,\n  useEvent,\n  useGlobalCopyStore,\n  useTransactionStore,\n} from '../../../../common'\n\ninterface FlagTransactionProps {\n  transaction: Transaction\n}\n\nconst FlagTransaction: React.FC<FlagTransactionProps> = ({ transaction }) => {\n  const { updateTransaction } = useTransactionStore()\n  const { transactions: copy } = useGlobalCopyStore()\n  const { onEvent } = useEvent()\n\n  const theme = useTheme()\n  const isDarkMode = theme.palette.mode === 'dark'\n\n  const handleFlagTransaction = async () => {\n    onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_CLICK_FLAG, { transaction_guid: transaction.guid })\n    await updateTransaction({ ...transaction, is_flagged: !transaction.is_flagged })\n  }\n\n  return (\n    <div className=\"mx-txn-transaction-flag\">\n      <ToggleButton\n        aria-label={copy.flag_btn_aria}\n        aria-pressed={transaction.is_flagged}\n        color={isDarkMode ? 'primary' : 'warning'}\n        onClick={handleFlagTransaction}\n        selected={transaction.is_flagged}\n        sx={{\n          borderRadius: 6,\n          color: isDarkMode ? 'common.white' : 'secondary.main',\n          '&.Mui-selected': {\n            color: isDarkMode ? 'primary.main' : 'common.white',\n            backgroundColor: isDarkMode ? alpha(theme.palette.primary.main, 0.25) : 'warning.dark',\n            ':hover': {\n              color: isDarkMode ? 'primary.main' : 'common.white',\n              backgroundColor: isDarkMode ? alpha(theme.palette.primary.main, 0.2) : 'warning.main',\n            },\n          },\n          ':hover': {\n            color: isDarkMode ? 'common.white' : 'warning.contrastText',\n            backgroundColor: isDarkMode ? alpha(theme.palette.primary.main, 0.2) : 'warning.light',\n          },\n        }}\n        value=\"flagged\"\n      >\n        <FlagOutlinedIcon color=\"inherit\" />\n      </ToggleButton>\n    </div>\n  )\n}\nexport default observer(FlagTransaction)\n"],"mappings":";;;;;;;;AAqBA,IAAM,IAAA,CAAmD,EAAE,aAAA,EAAA,MAAkB;AAC3E,QAAM,EAAE,mBAAA,EAAA,IAAsB,EAAoB,GAC5C,EAAE,cAAc,EAAA,IAAS,EAAmB,GAC5C,EAAE,SAAA,EAAA,IAAY,EAAS,GAEvB,IAAQ,EAAS,GACjB,IAAa,EAAM,QAAQ,SAAS,QAEpC,IAAwB,YAAY;AACxC,IAAA,EAAQ,EAAiB,gCAAgC,EAAE,kBAAkB,EAAY,KAAK,CAAC,GAC/F,MAAM,EAAkB;AAAA,MAAE,GAAG;AAAA,MAAa,YAAY,CAAC,EAAY;AAAA,IAAW,CAAC;AAAA,EACjF;AAEA,SACE,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,cACb,gBAAA,EAAC,GAAD;AAAA,MACE,cAAY,EAAK;AAAA,MACjB,gBAAc,EAAY;AAAA,MAC1B,OAAO,IAAa,YAAY;AAAA,MAChC,SAAS;AAAA,MACT,UAAU,EAAY;AAAA,MACtB,IAAI;AAAA,QACF,cAAc;AAAA,QACd,OAAO,IAAa,iBAAiB;AAAA,QACrC,kBAAkB;AAAA,UAChB,OAAO,IAAa,iBAAiB;AAAA,UACrC,iBAAiB,IAAa,EAAM,EAAM,QAAQ,QAAQ,MAAM,IAAI,IAAI;AAAA,UACxE,UAAU;AAAA,YACR,OAAO,IAAa,iBAAiB;AAAA,YACrC,iBAAiB,IAAa,EAAM,EAAM,QAAQ,QAAQ,MAAM,GAAG,IAAI;AAAA,UACzE;AAAA,QACF;AAAA,QACA,UAAU;AAAA,UACR,OAAO,IAAa,iBAAiB;AAAA,UACrC,iBAAiB,IAAa,EAAM,EAAM,QAAQ,QAAQ,MAAM,GAAG,IAAI;AAAA,QACzE;AAAA,MACF;AAAA,MACA,OAAM;AAAA,gBAEN,gBAAA,EAAC,GAAD,EAAkB,OAAM,UAAW,CAAA;AAAA,IACvB,CAAA;AAAA,EACX,CAAA;AAET,GACA,IAAe,EAAS,CAAe"}
+{"version":3,"file":"FlagTransaction.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/transactiondetails/FlagTransaction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport ToggleButton from '@mui/material/ToggleButton'\nimport { alpha, useTheme } from '@mui/material/styles'\n\nimport { Flag as FlagOutlinedIcon } from '@mxenabled/mx-icons'\n\nimport type { Transaction } from '../../../../core'\n\nimport {\n  ANALYTICS_EVENTS,\n  useEvent,\n  useGlobalCopyStore,\n  useTransactionStore,\n} from '../../../../common'\n\ninterface FlagTransactionProps {\n  transaction: Transaction\n}\n\nconst FlagTransaction: React.FC<FlagTransactionProps> = ({ transaction }) => {\n  const { updateTransaction } = useTransactionStore()\n  const { transactions: copy } = useGlobalCopyStore()\n  const { onEvent } = useEvent()\n\n  const theme = useTheme()\n  const isDarkMode = theme.palette.mode === 'dark'\n\n  const handleFlagTransaction = async () => {\n    onEvent(ANALYTICS_EVENTS.TRANSACTION_DETAILS_CLICK_FLAG, { transaction_guid: transaction.guid })\n    await updateTransaction({ ...transaction, is_flagged: !transaction.is_flagged })\n  }\n\n  return (\n    <div className=\"mx-txn-transaction-flag\">\n      <ToggleButton\n        aria-label={copy.flag_btn_aria}\n        aria-pressed={transaction.is_flagged}\n        color={isDarkMode ? 'primary' : 'warning'}\n        onClick={handleFlagTransaction}\n        selected={transaction.is_flagged}\n        sx={{\n          borderRadius: 6,\n          color: isDarkMode ? 'common.white' : 'secondary.main',\n          '&.Mui-selected': {\n            color: isDarkMode ? 'primary.main' : 'common.white',\n            backgroundColor: isDarkMode ? alpha(theme.palette.primary.main, 0.25) : 'warning.dark',\n            ':hover': {\n              color: isDarkMode ? 'primary.main' : 'common.white',\n              backgroundColor: isDarkMode ? alpha(theme.palette.primary.main, 0.2) : 'warning.main',\n            },\n          },\n          ':hover': {\n            color: isDarkMode ? 'common.white' : 'warning.contrastText',\n            backgroundColor: isDarkMode ? alpha(theme.palette.primary.main, 0.2) : 'warning.light',\n          },\n        }}\n        value=\"flagged\"\n      >\n        <FlagOutlinedIcon color=\"inherit\" />\n      </ToggleButton>\n    </div>\n  )\n}\nexport default observer(FlagTransaction)\n"],"mappings":";;;;;;;;AAqBA,IAAM,IAAA,CAAmD,EAAE,aAAA,EAAA,MAAkB;AAC3E,QAAM,EAAE,mBAAA,EAAA,IAAsB,EAAoB,GAC5C,EAAE,cAAc,EAAA,IAAS,EAAmB,GAC5C,EAAE,SAAA,EAAA,IAAY,EAAS,GAEvB,IAAQ,EAAS,GACjB,IAAa,EAAM,QAAQ,SAAS,QAEpC,IAAwB,YAAY;AACxC,IAAA,EAAQ,EAAiB,gCAAgC,EAAE,kBAAkB,EAAY,KAAK,CAAC,GAC/F,MAAM,EAAkB;AAAA,MAAE,GAAG;AAAA,MAAa,YAAY,CAAC,EAAY;AAAA,IAAW,CAAC;AAAA,EACjF;AAEA,SACE,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,IACb,UAAA,gBAAA,EAAC,GAAD;AAAA,MACE,cAAY,EAAK;AAAA,MACjB,gBAAc,EAAY;AAAA,MAC1B,OAAO,IAAa,YAAY;AAAA,MAChC,SAAS;AAAA,MACT,UAAU,EAAY;AAAA,MACtB,IAAI;AAAA,QACF,cAAc;AAAA,QACd,OAAO,IAAa,iBAAiB;AAAA,QACrC,kBAAkB;AAAA,UAChB,OAAO,IAAa,iBAAiB;AAAA,UACrC,iBAAiB,IAAa,EAAM,EAAM,QAAQ,QAAQ,MAAM,IAAI,IAAI;AAAA,UACxE,UAAU;AAAA,YACR,OAAO,IAAa,iBAAiB;AAAA,YACrC,iBAAiB,IAAa,EAAM,EAAM,QAAQ,QAAQ,MAAM,GAAG,IAAI;AAAA,UACzE;AAAA,QACF;AAAA,QACA,UAAU;AAAA,UACR,OAAO,IAAa,iBAAiB;AAAA,UACrC,iBAAiB,IAAa,EAAM,EAAM,QAAQ,QAAQ,MAAM,GAAG,IAAI;AAAA,QACzE;AAAA,MACF;AAAA,MACA,OAAM;AAAA,MAEN,UAAA,gBAAA,EAAC,GAAD,EAAkB,OAAM,UAAW,CAAA;AAAA,IACvB,CAAA;AAAA,EACX,CAAA;AAET,GACA,IAAe,EAAS,CAAe"}

package/dist/transactions/components/shared/transactiondetails/ManualTransactionDetails.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ManualTransactionDetails.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/transactiondetails/ManualTransactionDetails.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport MenuItem from '@mui/material/MenuItem'\nimport RadioGroup from '@mui/material/RadioGroup'\nimport Stack from '@mui/material/Stack'\n\nimport { TextField } from '@mxenabled/mxui'\nimport { ExpandMore as ExpandMoreIcon } from '@mxenabled/mx-icons'\n\nimport {\n  CurrencyInput,\n  SelectionBox,\n  useAccountStore,\n  useGlobalCopyStore,\n} from '../../../../common'\nimport { TransactionType } from '../../../../core'\n\nimport { useTransactionsUiStore } from '../../../context/hooks'\n\nimport { CategoryAction, DateAction, MemoAction, TagsAction } from './actions'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\n\ntype ManualAccount = {\n  label: string\n  value: string\n}\nconst ManualTransactionDetails = () => {\n  const { visibleAccounts: accounts } = useAccountStore()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const { manualTransaction, setIsAmountValid, updateManualTransaction } = useTransactionsUiStore()\n\n  const [amount, setAmount] = React.useState('')\n  const [payee, setPayee] = React.useState('')\n\n  const manualAccounts = React.useMemo(\n    () => accounts.filter((account) => account.is_manual),\n    [accounts],\n  ).map((account) => {\n    return {\n      label: `${account.name} | ${formatCurrency(account.balance, '0,0.00')}`,\n      value: account.guid,\n    } as ManualAccount\n  })\n\n  const currencyCopy = {\n    error_amount_is_invalid: commonCopy.currency_input.error_amount_is_invalid,\n    error_amount_must_be_equal_to: commonCopy.currency_input.error_amount_must_be_equal_to,\n    error_amount_must_be_less_than_or_equal_to:\n      commonCopy.currency_input.error_amount_must_be_less_than_or_equal_to,\n    enter_amount: commonCopy.currency_input.enter_amount,\n  }\n\n  const handleAmountChanged = (amount: string) => {\n    setAmount(amount)\n    updateManualTransaction({ ...manualTransaction, amount: Number(amount) })\n  }\n\n  const handleTransactionTypeChanged = (_event: React.ChangeEvent<HTMLElement>, value: string) => {\n    updateManualTransaction({ ...manualTransaction, transaction_type: Number(value) })\n  }\n\n  const handlePayeeChanged = (payee: string) => {\n    setPayee(payee)\n    updateManualTransaction({ ...manualTransaction, payee, description: payee })\n  }\n\n  const handleAccountChanged = (guid: string) => {\n    updateManualTransaction({ ...manualTransaction, account_guid: guid })\n  }\n\n  return (\n    <Box className=\"mx-txn-manual-transaction-details\">\n      <Stack gap={40} mx={24} my={32}>\n        <Stack\n          direction=\"row\"\n          sx={{ flexDirection: { xs: 'column', sm: 'row' }, gap: { xs: 40, sm: 8 } }}\n        >\n          <CurrencyInput\n            allowDecimals={true}\n            amount={amount}\n            ariaLabel={copy.amount_title}\n            copy={currencyCopy}\n            label={copy.amount_title}\n            setAmount={handleAmountChanged}\n            setHasValidInput={setIsAmountValid}\n            sx={{ bgcolor: 'background.paper' }}\n            type=\"number\"\n          />\n          <RadioGroup name=\"TransactionType\" onChange={handleTransactionTypeChanged} row={true}>\n            <Stack alignItems=\"center\" direction=\"row\">\n              <SelectionBox\n                checked={manualTransaction.transaction_type === TransactionType.CREDIT}\n                label={copy.manual_transaction_credit_button_label}\n                sx={{ ml: { xs: 0, sm: 8 } }}\n                tooltip={copy.manual_transaction_credit_button_tooltip}\n                value={TransactionType.CREDIT}\n              />\n              <SelectionBox\n                checked={manualTransaction.transaction_type === TransactionType.DEBIT}\n                label={copy.manual_transaction_debit_button_label}\n                tooltip={copy.manual_transaction_debit_button_tooltip}\n                value={TransactionType.DEBIT}\n              />\n            </Stack>\n          </RadioGroup>\n        </Stack>\n\n        <TextField\n          label={copy.payee_title}\n          name=\"payee\"\n          onChange={(e: React.ChangeEvent<HTMLInputElement>) => handlePayeeChanged(e.target.value)}\n          sx={{ bgcolor: 'background.paper' }}\n          value={payee}\n        />\n\n        <TextField\n          label={copy.manual_transaction_select_an_account}\n          onChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n            handleAccountChanged(e.target.value)\n          }\n          placeholder={copy.manual_transaction_select}\n          select={true}\n          slotProps={{\n            inputLabel: { shrink: true },\n            select: { defaultValue: '', IconComponent: ExpandMoreIcon },\n          }}\n          sx={{ bgcolor: 'background.paper' }}\n        >\n          {manualAccounts.map((account) => (\n            <MenuItem key={account.value} value={account.value}>\n              {account.label}\n            </MenuItem>\n          ))}\n        </TextField>\n      </Stack>\n      <Divider light={true} />\n      <Box bgcolor=\"background.paper\">\n        <CategoryAction transaction={manualTransaction} />\n        <DateAction transaction={manualTransaction} />\n        <MemoAction transaction={manualTransaction} />\n        <TagsAction transaction={manualTransaction} />\n      </Box>\n    </Box>\n  )\n}\n\nexport default observer(ManualTransactionDetails)\n"],"mappings":"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"}
+{"version":3,"file":"ManualTransactionDetails.es.js","names":[],"sources":["../../../../../src/transactions/components/shared/transactiondetails/ManualTransactionDetails.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport MenuItem from '@mui/material/MenuItem'\nimport RadioGroup from '@mui/material/RadioGroup'\nimport Stack from '@mui/material/Stack'\n\nimport { TextField } from '@mxenabled/mxui'\nimport { ExpandMore as ExpandMoreIcon } from '@mxenabled/mx-icons'\n\nimport {\n  CurrencyInput,\n  SelectionBox,\n  useAccountStore,\n  useGlobalCopyStore,\n} from '../../../../common'\nimport { TransactionType } from '../../../../core'\n\nimport { useTransactionsUiStore } from '../../../context/hooks'\n\nimport { CategoryAction, DateAction, MemoAction, TagsAction } from './actions'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\n\ntype ManualAccount = {\n  label: string\n  value: string\n}\nconst ManualTransactionDetails = () => {\n  const { visibleAccounts: accounts } = useAccountStore()\n  const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n  const { manualTransaction, setIsAmountValid, updateManualTransaction } = useTransactionsUiStore()\n\n  const [amount, setAmount] = React.useState('')\n  const [payee, setPayee] = React.useState('')\n\n  const manualAccounts = React.useMemo(\n    () => accounts.filter((account) => account.is_manual),\n    [accounts],\n  ).map((account) => {\n    return {\n      label: `${account.name} | ${formatCurrency(account.balance, '0,0.00')}`,\n      value: account.guid,\n    } as ManualAccount\n  })\n\n  const currencyCopy = {\n    error_amount_is_invalid: commonCopy.currency_input.error_amount_is_invalid,\n    error_amount_must_be_equal_to: commonCopy.currency_input.error_amount_must_be_equal_to,\n    error_amount_must_be_less_than_or_equal_to:\n      commonCopy.currency_input.error_amount_must_be_less_than_or_equal_to,\n    enter_amount: commonCopy.currency_input.enter_amount,\n  }\n\n  const handleAmountChanged = (amount: string) => {\n    setAmount(amount)\n    updateManualTransaction({ ...manualTransaction, amount: Number(amount) })\n  }\n\n  const handleTransactionTypeChanged = (_event: React.ChangeEvent<HTMLElement>, value: string) => {\n    updateManualTransaction({ ...manualTransaction, transaction_type: Number(value) })\n  }\n\n  const handlePayeeChanged = (payee: string) => {\n    setPayee(payee)\n    updateManualTransaction({ ...manualTransaction, payee, description: payee })\n  }\n\n  const handleAccountChanged = (guid: string) => {\n    updateManualTransaction({ ...manualTransaction, account_guid: guid })\n  }\n\n  return (\n    <Box className=\"mx-txn-manual-transaction-details\">\n      <Stack gap={40} mx={24} my={32}>\n        <Stack\n          direction=\"row\"\n          sx={{ flexDirection: { xs: 'column', sm: 'row' }, gap: { xs: 40, sm: 8 } }}\n        >\n          <CurrencyInput\n            allowDecimals={true}\n            amount={amount}\n            ariaLabel={copy.amount_title}\n            copy={currencyCopy}\n            label={copy.amount_title}\n            setAmount={handleAmountChanged}\n            setHasValidInput={setIsAmountValid}\n            sx={{ bgcolor: 'background.paper' }}\n            type=\"number\"\n          />\n          <RadioGroup name=\"TransactionType\" onChange={handleTransactionTypeChanged} row={true}>\n            <Stack alignItems=\"center\" direction=\"row\">\n              <SelectionBox\n                checked={manualTransaction.transaction_type === TransactionType.CREDIT}\n                label={copy.manual_transaction_credit_button_label}\n                sx={{ ml: { xs: 0, sm: 8 } }}\n                tooltip={copy.manual_transaction_credit_button_tooltip}\n                value={TransactionType.CREDIT}\n              />\n              <SelectionBox\n                checked={manualTransaction.transaction_type === TransactionType.DEBIT}\n                label={copy.manual_transaction_debit_button_label}\n                tooltip={copy.manual_transaction_debit_button_tooltip}\n                value={TransactionType.DEBIT}\n              />\n            </Stack>\n          </RadioGroup>\n        </Stack>\n\n        <TextField\n          label={copy.payee_title}\n          name=\"payee\"\n          onChange={(e: React.ChangeEvent<HTMLInputElement>) => handlePayeeChanged(e.target.value)}\n          sx={{ bgcolor: 'background.paper' }}\n          value={payee}\n        />\n\n        <TextField\n          label={copy.manual_transaction_select_an_account}\n          onChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n            handleAccountChanged(e.target.value)\n          }\n          placeholder={copy.manual_transaction_select}\n          select={true}\n          slotProps={{\n            inputLabel: { shrink: true },\n            select: { defaultValue: '', IconComponent: ExpandMoreIcon },\n          }}\n          sx={{ bgcolor: 'background.paper' }}\n        >\n          {manualAccounts.map((account) => (\n            <MenuItem key={account.value} value={account.value}>\n              {account.label}\n            </MenuItem>\n          ))}\n        </TextField>\n      </Stack>\n      <Divider light={true} />\n      <Box bgcolor=\"background.paper\">\n        <CategoryAction transaction={manualTransaction} />\n        <DateAction transaction={manualTransaction} />\n        <MemoAction transaction={manualTransaction} />\n        <TagsAction transaction={manualTransaction} />\n      </Box>\n    </Box>\n  )\n}\n\nexport default observer(ManualTransactionDetails)\n"],"mappings":"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"}