@mx-cartographer/experiences 6.25.3-alpha.al3 → 6.25.3-alpha.mega2

package/dist/common/components/InformationTooltip.js

@@ -0,0 +1,42 @@
+import { jsx as o, jsxs as n } from "react/jsx-runtime";
+import a from "@mui/material/IconButton";
+import m from "@mui/material/Stack";
+import l from "@mui/material/Tooltip";
+import { Text as t, Icon as c, IconWeight as p } from "@mxenabled/mxui";
+const u = ({
+  body: i,
+  iconName: e = "info",
+  title: r
+}) => /* @__PURE__ */ o(
+  l,
+  {
+    enterTouchDelay: 500,
+    title: /* @__PURE__ */ n(m, { gap: 2, p: 12, sx: { textOverflow: "none" }, children: [
+      /* @__PURE__ */ o(t, { bold: !0, variant: "Body", children: r }),
+      /* @__PURE__ */ o(t, { sx: { whiteSpace: "unset" }, variant: "Small", children: i })
+    ] }),
+    children: /* @__PURE__ */ o(
+      a,
+      {
+        "aria-label": r,
+        sx: {
+          minHeight: 0,
+          minWidth: 0,
+          p: 0
+        },
+        children: /* @__PURE__ */ o(
+          c,
+          {
+            name: e,
+            sx: { color: "primary.main", fontSize: 16 },
+            weight: p.Dark
+          }
+        )
+      }
+    )
+  }
+);
+export {
+  u as default
+};
+//# sourceMappingURL=InformationTooltip.js.map

package/dist/common/components/InformationTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InformationTooltip.js","sources":["../../../src/common/components/InformationTooltip.tsx"],"sourcesContent":["import React from 'react'\n\nimport IconButton from '@mui/material/IconButton'\nimport Stack from '@mui/material/Stack'\nimport Tooltip from '@mui/material/Tooltip'\n\nimport { Icon, IconWeight, Text } from '@mxenabled/mxui'\n\ninterface InformationTooltipProps {\n  body: string\n  iconName?: string\n  title: string\n}\n\nconst InformationTooltip: React.FC<InformationTooltipProps> = ({\n  body,\n  iconName = 'info',\n  title,\n}) => {\n  return (\n    <Tooltip\n      enterTouchDelay={500}\n      title={\n        <Stack gap={2} p={12} sx={{ textOverflow: 'none' }}>\n          <Text bold={true} variant=\"Body\">\n            {title}\n          </Text>\n          <Text sx={{ whiteSpace: 'unset' }} variant=\"Small\">\n            {body}\n          </Text>\n        </Stack>\n      }\n    >\n      <IconButton\n        aria-label={title}\n        sx={{\n          minHeight: 0,\n          minWidth: 0,\n          p: 0,\n        }}\n      >\n        <Icon\n          name={iconName}\n          sx={{ color: 'primary.main', fontSize: 16 }}\n          weight={IconWeight.Dark}\n        />\n      </IconButton>\n    </Tooltip>\n  )\n}\n\nexport default InformationTooltip\n"],"names":["InformationTooltip","body","iconName","title","jsx","Tooltip","jsxs","Stack","Text","IconButton","Icon","IconWeight"],"mappings":";;;;;AAcA,MAAMA,IAAwD,CAAC;AAAA,EAC7D,MAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,OAAAC;AACF,MAEI,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,iBAAiB;AAAA,IACjB,OACG,gBAAAC,EAAAC,GAAA,EAAM,KAAK,GAAG,GAAG,IAAI,IAAI,EAAE,cAAc,OAAA,GACxC,UAAA;AAAA,MAAA,gBAAAH,EAACI,GAAK,EAAA,MAAM,IAAM,SAAQ,QACvB,UACHL,GAAA;AAAA,MACA,gBAAAC,EAACI,KAAK,IAAI,EAAE,YAAY,QAAQ,GAAG,SAAQ,SACxC,UACHP,EAAA,CAAA;AAAA,IAAA,GACF;AAAA,IAGF,UAAA,gBAAAG;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,cAAYN;AAAA,QACZ,IAAI;AAAA,UACF,WAAW;AAAA,UACX,UAAU;AAAA,UACV,GAAG;AAAA,QACL;AAAA,QAEA,UAAA,gBAAAC;AAAA,UAACM;AAAA,UAAA;AAAA,YACC,MAAMR;AAAA,YACN,IAAI,EAAE,OAAO,gBAAgB,UAAU,GAAG;AAAA,YAC1C,QAAQS,EAAW;AAAA,UAAA;AAAA,QACrB;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAAA;"}

package/dist/common/components/ListItemAction.js

@@ -0,0 +1,214 @@
+import { jsxs as i, jsx as r } from "react/jsx-runtime";
+import u from "react";
+import { observer as v } from "mobx-react-lite";
+import x from "@mui/material/ListItem";
+import C from "@mui/material/ListItemButton";
+import I from "@mui/material/ListItemText";
+import g from "@mui/material/Stack";
+import { ChevronRight as L } from "@mxenabled/mx-icons";
+import { Text as e } from "@mxenabled/mxui";
+import "bowser";
+import "date-fns/getUnixTime";
+import "date-fns/intlFormat";
+import "../constants/Account.js";
+import "../constants/Category.js";
+import "date-fns/addMonths";
+import "date-fns/addQuarters";
+import "date-fns/addWeeks";
+import "date-fns/addYears";
+import "date-fns/getDay";
+import "date-fns/isBefore";
+import "date-fns/nextDay";
+import "date-fns/setDate";
+import "date-fns/startOfToday";
+import "date-fns/fromUnixTime";
+import "numeral";
+import "@mui/material";
+import "@mui/material/Button";
+import "@mui/material/Tooltip";
+import "@mui/material/Box";
+import "@mui/material/IconButton";
+import "./accountfilter/AccountFilterOptions.js";
+import { useGlobalCopyStore as j } from "../context/hooks.js";
+import "../context/GlobalDataProvider.js";
+import "../context/WidgetContainerProvider.js";
+import "@mui/material/styles/useTheme";
+import "@mui/material/useMediaQuery";
+import "@mxenabled/cssinjs";
+import "date-fns/addDays";
+import "date-fns/eachDayOfInterval";
+import "date-fns/eachWeekOfInterval";
+import "date-fns/endOfMonth";
+import "date-fns/format";
+import "date-fns/isSameMonth";
+import "date-fns/startOfMonth";
+import "date-fns/subMonths";
+import "@mui/material/Paper";
+import "date-fns/isSameDay";
+import "date-fns/isWithinInterval";
+import "d3";
+import "@mui/material/styles";
+import "@mui/x-charts";
+import "./charts/linechart/CustomLegend.js";
+import "@mui/x-charts/ChartsTooltip";
+import "./charts/stackedlinechart/CustomAreaTooltip.js";
+import "date-fns/differenceInCalendarDays";
+import "date-fns/endOfToday";
+import "date-fns/endOfYear";
+import "date-fns/startOfYear";
+import "date-fns/subDays";
+import "date-fns/subYears";
+import "@mui/material/ButtonGroup";
+import "@mui/material/Tab";
+import "@mui/material/Tabs";
+import "@mui/material/ToggleButton";
+import "@mui/material/ToggleButtonGroup";
+import P from "./dialog/Dialog.js";
+import "./ErrorBoundary.js";
+import "@mui/material/Card";
+import "@mui/material/CardContent";
+import "@mui/material/CardHeader";
+import "./WidgetContainer.js";
+import "./ConnectDrawer.js";
+import "uuid";
+import "@mui/material/CircularProgress";
+import "./SearchBox.js";
+import "@mui/material/FormControlLabel";
+import "@mui/material/Radio";
+import "@mui/material/Avatar";
+import "@mui/material/ListItemAvatar";
+import "@mui/material/ListItemIcon";
+import "@mui/material/MenuItem";
+import "@mui/material/TextField";
+import "@mui/material/Switch";
+import "mobx";
+import "../../accounts/AccountsWidget.js";
+import "../../accounts/AccountsMiniWidget.js";
+import "../../accounts/ConnectMiniWidget.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsHeader.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsContent.js";
+import "../types/Account.js";
+import "posthog-js";
+import "../../cashflow/CashflowMiniWidget.js";
+import "../../cashflow/CashflowWidget.js";
+import "../../cashflow/CashflowOnboarding.js";
+import "date-fns/differenceInDays";
+import "../../categories/components/CategorySelector.js";
+import "../../categories/components/CategorySelectorDrawer.js";
+import "../../categories/components/CategoryRow.js";
+import "../../debts/DebtsWidget.js";
+import "@mui/x-data-grid-pro";
+import "date-fns";
+import "@mui/material/Divider";
+import "@mui/material/List";
+import "../../finstrong/components/FinancialStrengthGraph.js";
+import "../../finstrong/components/CreditScoreGraph.js";
+import "../../finstrong/FinstrongWidget.js";
+import "../../goals/GoalsWidget.js";
+import "../../goals/GoalsMicroWidget.js";
+import "../../investments/util/InvestmentUtil.js";
+import "../../merchants/components/MerchantLookup.js";
+import "../../networth/components/NetWorthChart.js";
+import "../../networth/components/NetWorthList.js";
+import "../../networth/components/NetWorthSummary.js";
+import "../../networth/NetWorthMicroWidget.js";
+import "../../networth/NetWorthWidget.js";
+import "../../notifications/components/NotificationList.js";
+import "../../notifications/components/NotificationDrawer.js";
+import "date-fns/formatISO";
+import "../../transactions/constants/Analytics.js";
+import "../../transactions/constants/Transaction.js";
+import "../../transactions/components/shared/transactionlist/TransactionRow.js";
+import "../../transactions/components/shared/TransactionList.js";
+import "../../transactions/components/shared/TransactionTable.js";
+import "../../transactions/components/shared/TransactionDetails.js";
+import "../../transactions/components/transactionwidget/AddAccountModal.js";
+import "../../transactions/TransactionWidget.js";
+import "../../settings/SettingsWidget.js";
+import "../../settings/components/SettingsWidgetContents.js";
+import "../../settings/components/profile/ProfileTab.js";
+import "../../settings/components/devices/DeviceTab.js";
+import "../../settings/NotificationSettingsWidget.js";
+import "../../settings/components/notifications/NotificationSettings.js";
+import "../../settings/components/notifications/AccountNotificationProfiles.js";
+import "../../settings/components/notifications/BudgetNotificationProfiles.js";
+import "../../settings/components/notifications/InsightsNotificationProfiles.js";
+import "../../settings/components/transactionrules/TransactionRulesTab.js";
+import "../../recurringtransactions/RecurringTransactionsWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMiniWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMicroWidget.js";
+import "date-fns/isAfter";
+import "date-fns/parseISO";
+import "date-fns/subQuarters";
+import "date-fns/lastDayOfMonth";
+import "date-fns/setDayOfYear";
+import "../../recurringtransactions/components/shared/RecurringSettings.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageIncome.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageExpenses.js";
+import "../../recurringtransactions/components/shared/recurringsettings/SelectTransaction.js";
+import "../../recurringtransactions/components/shared/recurringsettings/AddRecurringTransactionDetails.js";
+import "../../trends/TrendsFullWidget.js";
+import "../../trends/TrendsMiniWidget.js";
+import "../../trends/TrendsMicroWidget.js";
+import "../../trends/TrendsWidget.js";
+import "date-fns/addSeconds";
+import "date-fns/getMonth";
+const Ct = v(
+  ({
+    children: n,
+    isDisabled: m = !1,
+    isSaveDisabled: a = !1,
+    label: s,
+    onCancel: c,
+    onSave: l,
+    primaryText: f,
+    secondaryText: y,
+    zeroStateText: o
+  }) => {
+    const { common: p } = j(), [d, t] = u.useState(!1), h = () => {
+      t(!1), c?.();
+    }, b = () => {
+      t(!1), l();
+    };
+    return /* @__PURE__ */ i(x, { children: [
+      /* @__PURE__ */ i(C, { onClick: () => t(!m), children: [
+        /* @__PURE__ */ r(
+          I,
+          {
+            primary: /* @__PURE__ */ i(g, { alignItems: "center", direction: "row", justifyContent: "space-between", children: [
+              /* @__PURE__ */ r(e, { variant: "body1", children: f }),
+              /* @__PURE__ */ r(
+                e,
+                {
+                  bold: !0,
+                  color: o ? "primary.main" : "text.primary",
+                  sx: { mr: 4 },
+                  variant: "body1",
+                  children: o || y
+                }
+              )
+            ] }),
+            primaryTypographyProps: { variant: "body1" }
+          }
+        ),
+        !m && !o && /* @__PURE__ */ r(L, {})
+      ] }),
+      /* @__PURE__ */ r(
+        P,
+        {
+          copy: { title: s, close_aria: p.close_aria },
+          disablePrimaryButton: a,
+          isOpen: d,
+          onClose: h,
+          onPrimaryAction: b,
+          primaryText: p.save_button,
+          children: n
+        }
+      )
+    ] });
+  }
+);
+export {
+  Ct as ListItemAction
+};
+//# sourceMappingURL=ListItemAction.js.map

package/dist/common/components/ListItemAction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemAction.js","sources":["../../../src/common/components/ListItemAction.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport ListItem from '@mui/material/ListItem'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemText from '@mui/material/ListItemText'\nimport Stack from '@mui/material/Stack'\n\nimport { ChevronRight } from '@mxenabled/mx-icons'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { Dialog, useGlobalCopyStore } from '../'\n\ninterface ListItemActionProps {\n  children?: React.ReactNode\n  isDisabled?: boolean\n  isSaveDisabled?: boolean\n  label: string\n  onCancel?: () => void\n  onSave: () => void\n  primaryText: string\n  secondaryText: string\n  zeroStateText?: string\n}\n\nexport const ListItemAction = observer(\n  ({\n    children,\n    isDisabled = false,\n    isSaveDisabled = false,\n    label,\n    onCancel,\n    onSave,\n    primaryText,\n    secondaryText,\n    zeroStateText,\n  }: ListItemActionProps) => {\n    const { common: copy } = useGlobalCopyStore()\n\n    const [isOpen, setIsOpen] = React.useState(false)\n\n    const handleCancel = () => {\n      setIsOpen(false)\n      onCancel?.()\n    }\n\n    const handleSave = () => {\n      setIsOpen(false)\n      onSave()\n    }\n\n    return (\n      <ListItem>\n        <ListItemButton onClick={() => setIsOpen(!isDisabled)}>\n          <ListItemText\n            primary={\n              <Stack alignItems=\"center\" direction=\"row\" justifyContent=\"space-between\">\n                <Text variant=\"body1\">{primaryText}</Text>\n                <Text\n                  bold={true}\n                  color={zeroStateText ? 'primary.main' : 'text.primary'}\n                  sx={{ mr: 4 }}\n                  variant=\"body1\"\n                >\n                  {zeroStateText || secondaryText}\n                </Text>\n              </Stack>\n            }\n            primaryTypographyProps={{ variant: 'body1' }}\n          />\n          {!isDisabled && !zeroStateText && <ChevronRight />}\n        </ListItemButton>\n        <Dialog\n          copy={{ title: label, close_aria: copy.close_aria }}\n          disablePrimaryButton={isSaveDisabled}\n          isOpen={isOpen}\n          onClose={handleCancel}\n          onPrimaryAction={handleSave}\n          primaryText={copy.save_button}\n        >\n          {children}\n        </Dialog>\n      </ListItem>\n    )\n  },\n)\n"],"names":["ListItemAction","observer","children","isDisabled","isSaveDisabled","label","onCancel","onSave","primaryText","secondaryText","zeroStateText","copy","useGlobalCopyStore","isOpen","setIsOpen","React","handleCancel","handleSave","ListItem","jsxs","ListItemButton","jsx","ListItemText","Stack","Text","ChevronRight","Dialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BO,MAAMA,KAAiBC;AAAA,EAC5B,CAAC;AAAA,IACC,UAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,gBAAAC,IAAiB;AAAA,IACjB,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,eAAAC;AAAA,EAAA,MACyB;AACzB,UAAM,EAAE,QAAQC,EAAK,IAAIC,EAAmB,GAEtC,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAE1CC,IAAe,MAAM;AACzB,MAAAF,EAAU,EAAK,GACJR;IAAA,GAGPW,IAAa,MAAM;AACvB,MAAAH,EAAU,EAAK,GACRP;IAAA;AAGT,6BACGW,GACC,EAAA,UAAA;AAAA,MAAA,gBAAAC,EAACC,KAAe,SAAS,MAAMN,EAAU,CAACX,CAAU,GAClD,UAAA;AAAA,QAAA,gBAAAkB;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,2BACGC,GAAM,EAAA,YAAW,UAAS,WAAU,OAAM,gBAAe,iBACxD,UAAA;AAAA,cAAC,gBAAAF,EAAAG,GAAA,EAAK,SAAQ,SAAS,UAAYhB,GAAA;AAAA,cACnC,gBAAAa;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,MAAM;AAAA,kBACN,OAAOd,IAAgB,iBAAiB;AAAA,kBACxC,IAAI,EAAE,IAAI,EAAE;AAAA,kBACZ,SAAQ;AAAA,kBAEP,UAAiBA,KAAAD;AAAA,gBAAA;AAAA,cACpB;AAAA,YAAA,GACF;AAAA,YAEF,wBAAwB,EAAE,SAAS,QAAQ;AAAA,UAAA;AAAA,QAC7C;AAAA,QACC,CAACN,KAAc,CAACO,uBAAkBe,GAAa,CAAA,CAAA;AAAA,MAAA,GAClD;AAAA,MACA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACC,MAAM,EAAE,OAAOrB,GAAO,YAAYM,EAAK,WAAW;AAAA,UAClD,sBAAsBP;AAAA,UACtB,QAAAS;AAAA,UACA,SAASG;AAAA,UACT,iBAAiBC;AAAA,UACjB,aAAaN,EAAK;AAAA,UAEjB,UAAAT;AAAA,QAAA;AAAA,MACH;AAAA,IACF,EAAA,CAAA;AAAA,EAEJ;AACF;"}

package/dist/common/components/ListItemRow.js

@@ -0,0 +1,68 @@
+import { jsxs as e, jsx as r } from "react/jsx-runtime";
+import f from "react";
+import h from "@mui/material/ListItem";
+import I from "@mui/material/ListItemButton";
+import s from "@mui/material/ListItemIcon";
+import g from "@mui/material/ListItemText";
+import t from "@mui/material/Stack";
+import { Text as i } from "@mxenabled/mxui";
+const R = ({
+  onClick: o,
+  leftIcon: n,
+  rightIcon: m,
+  title: a,
+  subtitle: c,
+  rightContent: l,
+  titleBold: x = !0,
+  rightContentBold: p = !0
+}) => {
+  const d = /* @__PURE__ */ e(f.Fragment, { children: [
+    n && /* @__PURE__ */ r(s, { sx: { ml: 0 }, children: n }),
+    /* @__PURE__ */ r(g, { children: /* @__PURE__ */ e(
+      t,
+      {
+        sx: {
+          alignItems: "center",
+          flexDirection: "row",
+          marginLeft: 12
+        },
+        children: [
+          /* @__PURE__ */ e(t, { sx: { flex: 1, minWidth: 0 }, children: [
+            /* @__PURE__ */ r(i, { bold: x, variant: "body1", children: a }),
+            c && /* @__PURE__ */ r(i, { variant: "caption", children: c })
+          ] }),
+          /* @__PURE__ */ e(t, { sx: { flexDirection: "row", alignItems: "center", gap: 1 }, children: [
+            l && /* @__PURE__ */ r(i, { bold: p, display: "flex", variant: "body1", children: l }),
+            m && /* @__PURE__ */ r(s, { children: m })
+          ] })
+        ]
+      }
+    ) })
+  ] });
+  return /* @__PURE__ */ r(h, { sx: { bgcolor: "background.paper" }, children: o ? /* @__PURE__ */ r(
+    I,
+    {
+      onClick: o,
+      sx: {
+        py: 14
+      },
+      children: d
+    }
+  ) : /* @__PURE__ */ r(
+    t,
+    {
+      sx: {
+        py: 14,
+        px: 24,
+        width: "100%",
+        flexDirection: "row",
+        alignItems: "center"
+      },
+      children: d
+    }
+  ) });
+};
+export {
+  R as ListItemRow
+};
+//# sourceMappingURL=ListItemRow.js.map

package/dist/common/components/ListItemRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemRow.js","sources":["../../../src/common/components/ListItemRow.tsx"],"sourcesContent":["import React from 'react'\n\nimport ListItem from '@mui/material/ListItem'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemIcon from '@mui/material/ListItemIcon'\nimport ListItemText from '@mui/material/ListItemText'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\ninterface ListItemRowProps {\n  onClick?: () => void\n  leftIcon?: React.ReactNode\n  rightIcon?: React.ReactNode\n  title?: string\n  subtitle?: string\n  rightContent?: React.ReactNode\n  titleBold?: boolean\n  rightContentBold?: boolean\n}\n\nexport const ListItemRow: React.FC<ListItemRowProps> = ({\n  onClick,\n  leftIcon,\n  rightIcon,\n  title,\n  subtitle,\n  rightContent,\n  titleBold = true,\n  rightContentBold = true,\n}) => {\n  const content = (\n    <React.Fragment>\n      {leftIcon && <ListItemIcon sx={{ ml: 0 }}>{leftIcon}</ListItemIcon>}\n      <ListItemText>\n        <Stack\n          sx={{\n            alignItems: 'center',\n            flexDirection: 'row',\n            marginLeft: 12,\n          }}\n        >\n          <Stack sx={{ flex: 1, minWidth: 0 }}>\n            <Text bold={titleBold} variant=\"body1\">\n              {title}\n            </Text>\n            {subtitle && <Text variant=\"caption\">{subtitle}</Text>}\n          </Stack>\n          <Stack sx={{ flexDirection: 'row', alignItems: 'center', gap: 1 }}>\n            {rightContent && (\n              <Text bold={rightContentBold} display=\"flex\" variant=\"body1\">\n                {rightContent}\n              </Text>\n            )}\n            {rightIcon && <ListItemIcon>{rightIcon}</ListItemIcon>}\n          </Stack>\n        </Stack>\n      </ListItemText>\n    </React.Fragment>\n  )\n\n  return (\n    <ListItem sx={{ bgcolor: 'background.paper' }}>\n      {onClick ? (\n        <ListItemButton\n          onClick={onClick}\n          sx={{\n            py: 14,\n          }}\n        >\n          {content}\n        </ListItemButton>\n      ) : (\n        <Stack\n          sx={{\n            py: 14,\n            px: 24,\n            width: '100%',\n            flexDirection: 'row',\n            alignItems: 'center',\n          }}\n        >\n          {content}\n        </Stack>\n      )}\n    </ListItem>\n  )\n}\n"],"names":["ListItemRow","onClick","leftIcon","rightIcon","title","subtitle","rightContent","titleBold","rightContentBold","content","jsxs","React","ListItemIcon","ListItemText","Stack","jsx","Text","ListItem","ListItemButton"],"mappings":";;;;;;;;AAqBO,MAAMA,IAA0C,CAAC;AAAA,EACtD,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,kBAAAC,IAAmB;AACrB,MAAM;AACJ,QAAMC,IACJ,gBAAAC,EAACC,EAAM,UAAN,EACE,UAAA;AAAA,IAAAT,uBAAaU,GAAa,EAAA,IAAI,EAAE,IAAI,KAAM,UAASV,GAAA;AAAA,sBACnDW,GACC,EAAA,UAAA,gBAAAH;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,IAAI;AAAA,UACF,YAAY;AAAA,UACZ,eAAe;AAAA,UACf,YAAY;AAAA,QACd;AAAA,QAEA,UAAA;AAAA,UAAA,gBAAAJ,EAACI,KAAM,IAAI,EAAE,MAAM,GAAG,UAAU,EAC9B,GAAA,UAAA;AAAA,YAAA,gBAAAC,EAACC,GAAK,EAAA,MAAMT,GAAW,SAAQ,SAC5B,UACHH,GAAA;AAAA,YACCC,KAAY,gBAAAU,EAACC,GAAK,EAAA,SAAQ,WAAW,UAASX,GAAA;AAAA,UAAA,GACjD;AAAA,UACA,gBAAAK,EAACI,GAAM,EAAA,IAAI,EAAE,eAAe,OAAO,YAAY,UAAU,KAAK,EAAA,GAC3D,UAAA;AAAA,YACCR,KAAA,gBAAAS,EAACC,KAAK,MAAMR,GAAkB,SAAQ,QAAO,SAAQ,SAClD,UACHF,EAAA,CAAA;AAAA,YAEDH,KAAc,gBAAAY,EAAAH,GAAA,EAAc,UAAUT,EAAA,CAAA;AAAA,UAAA,GACzC;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAEJ;AAAA,EACF,EAAA,CAAA;AAGF,2BACGc,GAAS,EAAA,IAAI,EAAE,SAAS,sBACtB,UACChB,IAAA,gBAAAc;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,SAAAjB;AAAA,MACA,IAAI;AAAA,QACF,IAAI;AAAA,MACN;AAAA,MAEC,UAAAQ;AAAA,IAAA;AAAA,EAAA,IAGH,gBAAAM;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACF,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,eAAe;AAAA,QACf,YAAY;AAAA,MACd;AAAA,MAEC,UAAAL;AAAA,IAAA;AAAA,EAGP,EAAA,CAAA;AAEJ;"}

package/dist/common/components/ListItemWrapper.js

@@ -0,0 +1,35 @@
+import { jsx as r } from "react/jsx-runtime";
+import i from "@mui/material/ListItem";
+import m from "@mui/material/ListItemButton";
+import { useEvent as n } from "../context/hooks.js";
+import "../context/GlobalDataProvider.js";
+import "../context/WidgetContainerProvider.js";
+const g = ({
+  children: t,
+  clickEventName: o,
+  onClick: e,
+  sx: s = {}
+}) => {
+  const { onEvent: p } = n();
+  return e ? /* @__PURE__ */ r(i, { sx: { bgcolor: "background.paper", ...s }, children: /* @__PURE__ */ r(
+    m,
+    {
+      onClick: () => {
+        o && p(o), e();
+      },
+      children: t
+    }
+  ) }) : /* @__PURE__ */ r(
+    i,
+    {
+      disableGutters: !1,
+      disablePadding: !1,
+      sx: { bgcolor: "background.paper", ...s },
+      children: t
+    }
+  );
+};
+export {
+  g as ListItemWrapper
+};
+//# sourceMappingURL=ListItemWrapper.js.map

package/dist/common/components/ListItemWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemWrapper.js","sources":["../../../src/common/components/ListItemWrapper.tsx"],"sourcesContent":["import React from 'react'\n\nimport ListItem from '@mui/material/ListItem'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport { SxProps } from '@mui/material/styles'\n\nimport { useEvent } from '../context'\n\ninterface ListItemWrapperProps {\n  clickEventName?: string\n  onClick?: () => void\n  sx?: SxProps\n}\n\nexport const ListItemWrapper: React.FC<React.PropsWithChildren<ListItemWrapperProps>> = ({\n  children,\n  clickEventName,\n  onClick,\n  sx = {},\n}) => {\n  const { onEvent } = useEvent()\n\n  if (onClick) {\n    return (\n      <ListItem sx={{ bgcolor: 'background.paper', ...sx }}>\n        <ListItemButton\n          onClick={() => {\n            if (clickEventName) {\n              onEvent(clickEventName)\n            }\n            onClick()\n          }}\n        >\n          {children}\n        </ListItemButton>\n      </ListItem>\n    )\n  } else {\n    return (\n      <ListItem\n        disableGutters={false}\n        disablePadding={false}\n        sx={{ bgcolor: 'background.paper', ...sx }}\n      >\n        {children}\n      </ListItem>\n    )\n  }\n}\n"],"names":["ListItemWrapper","children","clickEventName","onClick","sx","onEvent","useEvent","jsx","ListItem","ListItemButton"],"mappings":";;;;;;AAcO,MAAMA,IAA2E,CAAC;AAAA,EACvF,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,SAAAC;AAAA,EACA,IAAAC,IAAK,CAAC;AACR,MAAM;AACE,QAAA,EAAE,SAAAC,MAAYC;AAEpB,SAAIH,IAEA,gBAAAI,EAACC,KAAS,IAAI,EAAE,SAAS,oBAAoB,GAAGJ,KAC9C,UAAA,gBAAAG;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,SAAS,MAAM;AACb,QAAIP,KACFG,EAAQH,CAAc,GAEhBC;MACV;AAAA,MAEC,UAAAF;AAAA,IAAA;AAAA,EAEL,EAAA,CAAA,IAIA,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB,IAAI,EAAE,SAAS,oBAAoB,GAAGJ,EAAG;AAAA,MAExC,UAAAH;AAAA,IAAA;AAAA,EAAA;AAIT;"}

package/dist/common/components/Loader.js

@@ -0,0 +1,15 @@
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import i from "@mui/material/CircularProgress";
+import c from "@mui/material/Stack";
+import { useTokens as m, Text as a } from "@mxenabled/mxui";
+const d = ({ height: e = 250, label: r = "", size: o = 32 }) => {
+  const n = m();
+  return /* @__PURE__ */ s(c, { alignItems: "center", gap: n.Spacing.XLarge, height: e, justifyContent: "center", children: [
+    /* @__PURE__ */ t(i, { size: o }),
+    r && /* @__PURE__ */ t(a, { children: r })
+  ] });
+};
+export {
+  d as default
+};
+//# sourceMappingURL=Loader.js.map

package/dist/common/components/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loader.js","sources":["../../../src/common/components/Loader.tsx"],"sourcesContent":["import React from 'react'\n\nimport CircularProgress from '@mui/material/CircularProgress'\nimport Stack from '@mui/material/Stack'\n\nimport { Text, useTokens } from '@mxenabled/mxui'\n\ninterface LoaderProps {\n  height?: number\n  label?: string\n  size?: number\n}\n\nconst Loader: React.FC<LoaderProps> = ({ height = 250, label = '', size = 32 }) => {\n  const tokens = useTokens()\n\n  return (\n    <Stack alignItems=\"center\" gap={tokens.Spacing.XLarge} height={height} justifyContent=\"center\">\n      <CircularProgress size={size} />\n      {label && <Text>{label}</Text>}\n    </Stack>\n  )\n}\n\nexport default Loader\n"],"names":["Loader","height","label","size","tokens","useTokens","jsxs","Stack","jsx","CircularProgress","Text"],"mappings":";;;;AAaM,MAAAA,IAAgC,CAAC,EAAE,QAAAC,IAAS,KAAK,OAAAC,IAAQ,IAAI,MAAAC,IAAO,SAAS;AACjF,QAAMC,IAASC;AAGb,SAAA,gBAAAC,EAACC,GAAM,EAAA,YAAW,UAAS,KAAKH,EAAO,QAAQ,QAAQ,QAAAH,GAAgB,gBAAe,UACpF,UAAA;AAAA,IAAA,gBAAAO,EAACC,KAAiB,MAAAN,GAAY;AAAA,IAC7BD,KAAU,gBAAAM,EAAAE,GAAA,EAAM,UAAMR,EAAA,CAAA;AAAA,EACzB,EAAA,CAAA;AAEJ;"}

package/dist/common/components/MicroWidgetContainer.js

@@ -0,0 +1,48 @@
+import { jsx as r, jsxs as h, Fragment as f } from "react/jsx-runtime";
+import x from "@mui/material/Button";
+import C from "@mui/material/Card";
+import b from "@mui/material/CardContent";
+import g from "@mui/material/CardHeader";
+import { P as u, H3 as v } from "@mxenabled/mxui";
+import { ChevronRight as w } from "@mxenabled/mx-icons";
+import "react";
+import "../context/GlobalDataProvider.js";
+import { WidgetContainerProvider as H } from "../context/WidgetContainerProvider.js";
+import { useDimensions as W } from "../hooks/useDimensions.js";
+const q = ({
+  children: e,
+  className: o,
+  ctaLabel: n,
+  onCTAClick: a,
+  subHeader: t,
+  sx: d,
+  title: m,
+  variant: s = "borderless"
+}) => {
+  const [c, { height: l, width: p }] = W(), i = /* @__PURE__ */ h(f, { children: [
+    /* @__PURE__ */ r(
+      g,
+      {
+        action: /* @__PURE__ */ r(
+          x,
+          {
+            endIcon: /* @__PURE__ */ r(w, { size: 20 }),
+            onClick: a,
+            size: "small",
+            variant: "text",
+            children: n
+          }
+        ),
+        subheader: t && /* @__PURE__ */ r(u, { sx: { color: "text.secondary" }, variant: "body2", children: t }),
+        sx: { p: 0, pb: 8, width: "calc(100% - 8px)", "& .MuiCardHeader-action": { mt: 0 } },
+        title: /* @__PURE__ */ r(v, { sx: { width: "calc(100% - 10px)" }, children: m })
+      }
+    ),
+    /* @__PURE__ */ r(b, { ref: c, sx: { p: 0, ":last-child": { pb: 0 } }, children: /* @__PURE__ */ r(H, { availableHeight: l, availableWidth: p, children: e }) })
+  ] });
+  return s === "borderless" ? i : /* @__PURE__ */ r(C, { className: o, sx: { alignItems: "center", p: 16, ...d }, children: i });
+};
+export {
+  q as default
+};
+//# sourceMappingURL=MicroWidgetContainer.js.map

package/dist/common/components/MicroWidgetContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MicroWidgetContainer.js","sources":["../../../src/common/components/MicroWidgetContainer.tsx"],"sourcesContent":["import Button from '@mui/material/Button'\nimport Card from '@mui/material/Card'\nimport CardContent from '@mui/material/CardContent'\nimport CardHeader from '@mui/material/CardHeader'\nimport type { SxProps } from '@mui/material/styles'\n\nimport { H3, P } from '@mxenabled/mxui'\nimport { ChevronRight } from '@mxenabled/mx-icons'\n\nimport { WidgetContainerProvider } from '../context'\nimport { useDimensions } from '../hooks/useDimensions'\n\ninterface MicroWidgetContainerProps {\n  className?: string\n  ctaLabel: string\n  onCTAClick: () => void\n  subHeader?: string\n  sx?: SxProps\n  title: string\n  variant?: 'borderless' | 'card'\n}\n\nconst MicroWidgetContainer: React.FC<React.PropsWithChildren<MicroWidgetContainerProps>> = ({\n  children,\n  className,\n  ctaLabel,\n  onCTAClick,\n  subHeader,\n  sx,\n  title,\n  variant = 'borderless',\n}) => {\n  const [containerRef, { height, width }] = useDimensions()\n\n  const content = (\n    <>\n      <CardHeader\n        action={\n          <Button\n            endIcon={<ChevronRight size={20} />}\n            onClick={onCTAClick}\n            size=\"small\"\n            variant=\"text\"\n          >\n            {ctaLabel}\n          </Button>\n        }\n        subheader={\n          subHeader && (\n            <P sx={{ color: 'text.secondary' }} variant=\"body2\">\n              {subHeader}\n            </P>\n          )\n        }\n        sx={{ p: 0, pb: 8, width: 'calc(100% - 8px)', '& .MuiCardHeader-action': { mt: 0 } }}\n        title={<H3 sx={{ width: 'calc(100% - 10px)' }}>{title}</H3>}\n      />\n\n      <CardContent ref={containerRef} sx={{ p: 0, ':last-child': { pb: 0 } }}>\n        <WidgetContainerProvider availableHeight={height} availableWidth={width}>\n          {children}\n        </WidgetContainerProvider>\n      </CardContent>\n    </>\n  )\n\n  if (variant === 'borderless') return content\n\n  return (\n    <Card className={className} sx={{ alignItems: 'center', p: 16, ...sx }}>\n      {content}\n    </Card>\n  )\n}\n\nexport default MicroWidgetContainer\n"],"names":["MicroWidgetContainer","children","className","ctaLabel","onCTAClick","subHeader","sx","title","variant","containerRef","height","width","useDimensions","content","jsxs","Fragment","jsx","CardHeader","Button","ChevronRight","P","H3","CardContent","WidgetContainerProvider","Card"],"mappings":";;;;;;;;;;;AAsBA,MAAMA,IAAqF,CAAC;AAAA,EAC1F,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC,IAAU;AACZ,MAAM;AACJ,QAAM,CAACC,GAAc,EAAE,QAAAC,GAAQ,OAAAC,EAAO,CAAA,IAAIC,KAEpCC,IAEF,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,QACE,gBAAAD;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,SAAS,gBAAAF,EAACG,GAAa,EAAA,MAAM,GAAI,CAAA;AAAA,YACjC,SAASf;AAAA,YACT,MAAK;AAAA,YACL,SAAQ;AAAA,YAEP,UAAAD;AAAA,UAAA;AAAA,QACH;AAAA,QAEF,WACEE,KACE,gBAAAW,EAACI,GAAE,EAAA,IAAI,EAAE,OAAO,iBAAiB,GAAG,SAAQ,SACzC,UACHf,EAAA,CAAA;AAAA,QAGJ,IAAI,EAAE,GAAG,GAAG,IAAI,GAAG,OAAO,oBAAoB,2BAA2B,EAAE,IAAI,EAAA,EAAI;AAAA,QACnF,yBAAQgB,GAAG,EAAA,IAAI,EAAE,OAAO,uBAAwB,UAAMd,GAAA;AAAA,MAAA;AAAA,IACxD;AAAA,IAEA,gBAAAS,EAACM,KAAY,KAAKb,GAAc,IAAI,EAAE,GAAG,GAAG,eAAe,EAAE,IAAI,OAC/D,UAAC,gBAAAO,EAAAO,GAAA,EAAwB,iBAAiBb,GAAQ,gBAAgBC,GAC/D,UAAAV,EACH,CAAA,GACF;AAAA,EACF,EAAA,CAAA;AAGE,SAAAO,MAAY,eAAqBK,IAGlC,gBAAAG,EAAAQ,GAAA,EAAK,WAAAtB,GAAsB,IAAI,EAAE,YAAY,UAAU,GAAG,IAAI,GAAGI,EAAG,GAClE,UACHO,EAAA,CAAA;AAEJ;"}

package/dist/common/components/MiniWidgetContainer.js

@@ -0,0 +1,42 @@
+import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import f from "@mui/material/Button";
+import u from "@mui/material/Card";
+import x from "@mui/material/CardHeader";
+import b from "@mui/material/CardContent";
+import g from "@mui/material/IconButton";
+import { Icon as v, ChevronRight as C } from "@mxenabled/mx-icons";
+import { Text as H, H3 as I } from "@mxenabled/mxui";
+import "react";
+import "../context/GlobalDataProvider.js";
+import { WidgetContainerProvider as W } from "../context/WidgetContainerProvider.js";
+import { useDimensions as j } from "../hooks/useDimensions.js";
+const A = ({
+  className: n = "mx-cmn-mini-widget",
+  closeLabel: m,
+  children: a,
+  onClose: i,
+  onPrimaryCtaClick: o,
+  primaryCtaLabel: l = "",
+  subTitle: e = "",
+  sx: d = {},
+  title: t = ""
+}) => {
+  const [p, { height: c, width: h }] = j();
+  return /* @__PURE__ */ s(u, { className: n, sx: { ...d }, children: [
+    /* @__PURE__ */ r(
+      x,
+      {
+        action: i ? /* @__PURE__ */ r(g, { "aria-label": m, onClick: i, children: /* @__PURE__ */ r(v, { name: "close", size: 24 }) }) : o && /* @__PURE__ */ r(f, { endIcon: /* @__PURE__ */ r(C, {}), onClick: o, children: /* @__PURE__ */ r(H, { bold: !0, variant: "Small", children: l }) }),
+        subheader: e || null,
+        subheaderTypographyProps: { variant: "Small" },
+        sx: { pb: 4 },
+        title: t ? /* @__PURE__ */ r(I, { sx: { pb: 4 }, children: t }) : null
+      }
+    ),
+    /* @__PURE__ */ r(b, { ref: p, sx: { p: 0 }, children: /* @__PURE__ */ r(W, { availableHeight: c, availableWidth: h, children: a }) })
+  ] });
+};
+export {
+  A as default
+};
+//# sourceMappingURL=MiniWidgetContainer.js.map

package/dist/common/components/MiniWidgetContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MiniWidgetContainer.js","sources":["../../../src/common/components/MiniWidgetContainer.tsx"],"sourcesContent":["import React from 'react'\n\nimport Button from '@mui/material/Button'\nimport Card from '@mui/material/Card'\nimport CardHeader from '@mui/material/CardHeader'\nimport CardContent from '@mui/material/CardContent'\nimport IconButton from '@mui/material/IconButton'\nimport type { SxProps } from '@mui/material/styles'\n\nimport { Icon } from '@mxenabled/mx-icons'\nimport { ChevronRight } from '@mxenabled/mx-icons'\n\nimport { H3, Text } from '@mxenabled/mxui'\n\nimport { WidgetContainerProvider } from '../context'\nimport { useDimensions } from '../hooks/useDimensions'\n\ninterface CardContainerProps {\n  className?: string\n  closeLabel?: string\n  onClose?: () => void\n  onPrimaryCtaClick?: () => void\n  primaryCtaLabel?: string\n  subTitle?: string\n  sx?: SxProps\n  title?: string\n}\n\nconst MiniWidgetContainer: React.FC<React.PropsWithChildren<CardContainerProps>> = ({\n  className = 'mx-cmn-mini-widget',\n  closeLabel,\n  children,\n  onClose,\n  onPrimaryCtaClick,\n  primaryCtaLabel = '',\n  subTitle = '',\n  sx = {},\n  title = '',\n}) => {\n  const [containerRef, { height, width }] = useDimensions()\n\n  return (\n    <Card className={className} sx={{ ...sx }}>\n      <CardHeader\n        action={\n          onClose ? (\n            <IconButton aria-label={closeLabel} onClick={onClose}>\n              <Icon name=\"close\" size={24} />\n            </IconButton>\n          ) : (\n            onPrimaryCtaClick && (\n              <Button endIcon={<ChevronRight />} onClick={onPrimaryCtaClick}>\n                <Text bold={true} variant=\"Small\">\n                  {primaryCtaLabel}\n                </Text>\n              </Button>\n            )\n          )\n        }\n        subheader={subTitle ? subTitle : null}\n        subheaderTypographyProps={{ variant: 'Small' }}\n        sx={{ pb: 4 }}\n        title={title ? <H3 sx={{ pb: 4 }}>{title}</H3> : null}\n      />\n\n      <CardContent ref={containerRef} sx={{ p: 0 }}>\n        <WidgetContainerProvider availableHeight={height} availableWidth={width}>\n          {children}\n        </WidgetContainerProvider>\n      </CardContent>\n    </Card>\n  )\n}\n\nexport default MiniWidgetContainer\n"],"names":["MiniWidgetContainer","className","closeLabel","children","onClose","onPrimaryCtaClick","primaryCtaLabel","subTitle","sx","title","containerRef","height","width","useDimensions","Card","jsx","CardHeader","IconButton","Icon","Button","ChevronRight","Text","H3","CardContent","WidgetContainerProvider"],"mappings":";;;;;;;;;;;;AA4BA,MAAMA,IAA6E,CAAC;AAAA,EAClF,WAAAC,IAAY;AAAA,EACZ,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,UAAAC,IAAW;AAAA,EACX,IAAAC,IAAK,CAAC;AAAA,EACN,OAAAC,IAAQ;AACV,MAAM;AACJ,QAAM,CAACC,GAAc,EAAE,QAAAC,GAAQ,OAAAC,EAAO,CAAA,IAAIC;AAE1C,2BACGC,GAAK,EAAA,WAAAb,GAAsB,IAAI,EAAE,GAAGO,EACnC,GAAA,UAAA;AAAA,IAAA,gBAAAO;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,QACEZ,IACG,gBAAAW,EAAAE,GAAA,EAAW,cAAYf,GAAY,SAASE,GAC3C,UAAA,gBAAAW,EAACG,GAAK,EAAA,MAAK,SAAQ,MAAM,GAAI,CAAA,EAC/B,CAAA,IAEAb,KACE,gBAAAU,EAACI,GAAO,EAAA,SAAU,gBAAAJ,EAAAK,GAAA,CAAA,CAAa,GAAI,SAASf,GAC1C,UAAC,gBAAAU,EAAAM,GAAA,EAAK,MAAM,IAAM,SAAQ,SACvB,YACH,CAAA,GACF;AAAA,QAIN,WAAWd,KAAsB;AAAA,QACjC,0BAA0B,EAAE,SAAS,QAAQ;AAAA,QAC7C,IAAI,EAAE,IAAI,EAAE;AAAA,QACZ,OAAOE,IAAQ,gBAAAM,EAACO,GAAG,EAAA,IAAI,EAAE,IAAI,EAAA,GAAM,UAAAb,EAAA,CAAM,IAAQ;AAAA,MAAA;AAAA,IACnD;AAAA,sBAECc,GAAY,EAAA,KAAKb,GAAc,IAAI,EAAE,GAAG,KACvC,UAAA,gBAAAK,EAACS,KAAwB,iBAAiBb,GAAQ,gBAAgBC,GAC/D,UAAAT,EACH,CAAA,GACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/dist/common/components/ResponsiveButton.js

@@ -0,0 +1,46 @@
+import { jsxs as m, jsx as t } from "react/jsx-runtime";
+import p from "react";
+import d from "@mui/material/Button";
+import a from "@mui/material/IconButton";
+import f from "@mui/material/Tooltip";
+import c from "@mui/material/styles/useTheme";
+const B = ({
+  icon: e,
+  label: i,
+  onClick: o,
+  placement: s = "bottom",
+  tooltipText: r,
+  variant: l = "text"
+}) => {
+  const n = c();
+  return /* @__PURE__ */ m(p.Fragment, { children: [
+    /* @__PURE__ */ t(
+      d,
+      {
+        onClick: o,
+        startIcon: e,
+        sx: {
+          [n.breakpoints.down("lg")]: { display: "none" },
+          [n.breakpoints.up("lg")]: { display: "inline-flex" }
+        },
+        title: r,
+        variant: l,
+        children: i
+      }
+    ),
+    /* @__PURE__ */ t(
+      f,
+      {
+        describeChild: !0,
+        placement: s,
+        sx: { display: { xs: "inline-flex", lg: "none" } },
+        title: r,
+        children: /* @__PURE__ */ t(a, { onClick: o, children: e })
+      }
+    )
+  ] });
+};
+export {
+  B as default
+};
+//# sourceMappingURL=ResponsiveButton.js.map

package/dist/common/components/ResponsiveButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResponsiveButton.js","sources":["../../../src/common/components/ResponsiveButton.tsx"],"sourcesContent":["import React from 'react'\n\nimport Button from '@mui/material/Button'\nimport IconButton from '@mui/material/IconButton'\nimport Tooltip from '@mui/material/Tooltip'\nimport useTheme from '@mui/material/styles/useTheme'\n\ninterface ResponsiveButtonProps {\n  icon: React.ReactElement\n  label: string\n  onClick?: () => void\n  placement?:\n    | 'bottom-end'\n    | 'bottom-start'\n    | 'bottom'\n    | 'left-end'\n    | 'left-start'\n    | 'left'\n    | 'right-end'\n    | 'right-start'\n    | 'right'\n    | 'top-end'\n    | 'top-start'\n    | 'top'\n  tooltipText: string\n  variant?: 'contained' | 'outlined' | 'text'\n}\n\nconst ResponsiveButton: React.FC<ResponsiveButtonProps> = ({\n  icon,\n  label,\n  onClick,\n  placement = 'bottom',\n  tooltipText,\n  variant = 'text',\n}) => {\n  const theme = useTheme()\n\n  return (\n    <React.Fragment>\n      <Button\n        onClick={onClick}\n        startIcon={icon}\n        sx={{\n          [theme.breakpoints.down('lg')]: { display: 'none' },\n          [theme.breakpoints.up('lg')]: { display: 'inline-flex' },\n        }}\n        title={tooltipText}\n        variant={variant}\n      >\n        {label}\n      </Button>\n      <Tooltip\n        describeChild={true}\n        placement={placement}\n        sx={{ display: { xs: 'inline-flex', lg: 'none' } }}\n        title={tooltipText}\n      >\n        <IconButton onClick={onClick}>{icon}</IconButton>\n      </Tooltip>\n    </React.Fragment>\n  )\n}\n\nexport default ResponsiveButton\n"],"names":["ResponsiveButton","icon","label","onClick","placement","tooltipText","variant","theme","useTheme","jsxs","React","jsx","Button","Tooltip","IconButton"],"mappings":";;;;;;AA4BA,MAAMA,IAAoD,CAAC;AAAA,EACzD,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,aAAAC;AAAA,EACA,SAAAC,IAAU;AACZ,MAAM;AACJ,QAAMC,IAAQC;AAGZ,SAAA,gBAAAC,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAAAT;AAAA,QACA,WAAWF;AAAA,QACX,IAAI;AAAA,UACF,CAACM,EAAM,YAAY,KAAK,IAAI,CAAC,GAAG,EAAE,SAAS,OAAO;AAAA,UAClD,CAACA,EAAM,YAAY,GAAG,IAAI,CAAC,GAAG,EAAE,SAAS,cAAc;AAAA,QACzD;AAAA,QACA,OAAOF;AAAA,QACP,SAAAC;AAAA,QAEC,UAAAJ;AAAA,MAAA;AAAA,IACH;AAAA,IACA,gBAAAS;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,eAAe;AAAA,QACf,WAAAT;AAAA,QACA,IAAI,EAAE,SAAS,EAAE,IAAI,eAAe,IAAI,SAAS;AAAA,QACjD,OAAOC;AAAA,QAEP,UAAA,gBAAAM,EAACG,GAAW,EAAA,SAAAX,GAAmB,UAAKF,GAAA;AAAA,MAAA;AAAA,IACtC;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/dist/common/components/SearchBox.js

@@ -0,0 +1,43 @@
+import { jsx as e } from "react/jsx-runtime";
+import { observer as p } from "mobx-react-lite";
+import d from "@mui/material/Box";
+import h from "@mui/material/IconButton";
+import a from "@mui/material/InputAdornment";
+import { useTokens as u, TextField as x, Icon as c } from "@mxenabled/mxui";
+const b = ({
+  ariaLabel: t = "Search",
+  cancelAriaLabel: s = "Cancel Search",
+  onChange: r,
+  placeholder: i = "Search",
+  searchValue: o
+}) => {
+  const n = u(), m = /* @__PURE__ */ e(
+    h,
+    {
+      "aria-label": s,
+      className: "mx-cat-cancel-search-button",
+      color: "primary",
+      onClick: () => r(""),
+      children: /* @__PURE__ */ e(c, { name: "cancel", size: 24 })
+    }
+  );
+  return /* @__PURE__ */ e(d, { className: "mx-cmn-search-box", px: n.Spacing.Large, py: n.Spacing.Medium, children: /* @__PURE__ */ e(
+    x,
+    {
+      InputProps: {
+        startAdornment: /* @__PURE__ */ e(a, { position: "start", children: /* @__PURE__ */ e(c, { color: "disabled", name: "search", size: 26 }) }),
+        endAdornment: /* @__PURE__ */ e(a, { position: "end", sx: { p: 0 }, children: o ? m : null })
+      },
+      "aria-label": t,
+      name: "search",
+      onChange: (l) => r(l.target.value),
+      placeholder: i,
+      sx: { bgcolor: "background.paper", width: "100%" },
+      value: o
+    }
+  ) });
+}, v = p(b);
+export {
+  v as default
+};
+//# sourceMappingURL=SearchBox.js.map

package/dist/common/components/SearchBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchBox.js","sources":["../../../src/common/components/SearchBox.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport IconButton from '@mui/material/IconButton'\nimport InputAdornment from '@mui/material/InputAdornment'\n\nimport { Icon, TextField, useTokens } from '@mxenabled/mxui'\n\nexport interface SearchBoxProps {\n  ariaLabel?: string\n  cancelAriaLabel?: string\n  onChange: (value: string) => void\n  placeholder?: string\n  searchValue: string\n}\n\nconst SearchBox: React.FC<SearchBoxProps> = ({\n  ariaLabel = 'Search',\n  cancelAriaLabel = 'Cancel Search',\n  onChange,\n  placeholder = 'Search',\n  searchValue,\n}) => {\n  const tokens = useTokens()\n\n  const cancelButton = (\n    <IconButton\n      aria-label={cancelAriaLabel}\n      className=\"mx-cat-cancel-search-button\"\n      color=\"primary\"\n      onClick={() => onChange('')}\n    >\n      <Icon name=\"cancel\" size={24} />\n    </IconButton>\n  )\n\n  return (\n    <Box className=\"mx-cmn-search-box\" px={tokens.Spacing.Large} py={tokens.Spacing.Medium}>\n      <TextField\n        InputProps={{\n          startAdornment: (\n            <InputAdornment position=\"start\">\n              <Icon color=\"disabled\" name=\"search\" size={26} />\n            </InputAdornment>\n          ),\n          endAdornment: (\n            <InputAdornment position=\"end\" sx={{ p: 0 }}>\n              {searchValue ? cancelButton : null}\n            </InputAdornment>\n          ),\n        }}\n        aria-label={ariaLabel}\n        name=\"search\"\n        onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange(e.target.value)}\n        placeholder={placeholder}\n        // TODO: Theme needs to have the background color defaulted to paper for TextField\n        sx={{ bgcolor: 'background.paper', width: '100%' }}\n        value={searchValue}\n      />\n    </Box>\n  )\n}\n\nexport default observer(SearchBox)\n"],"names":["SearchBox","ariaLabel","cancelAriaLabel","onChange","placeholder","searchValue","tokens","useTokens","cancelButton","jsx","IconButton","Icon","Box","TextField","InputAdornment","e","SearchBox$1","observer"],"mappings":";;;;;;AAiBA,MAAMA,IAAsC,CAAC;AAAA,EAC3C,WAAAC,IAAY;AAAA,EACZ,iBAAAC,IAAkB;AAAA,EAClB,UAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,aAAAC;AACF,MAAM;AACJ,QAAMC,IAASC,KAETC,IACJ,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,cAAYR;AAAA,MACZ,WAAU;AAAA,MACV,OAAM;AAAA,MACN,SAAS,MAAMC,EAAS,EAAE;AAAA,MAE1B,UAAC,gBAAAM,EAAAE,GAAA,EAAK,MAAK,UAAS,MAAM,IAAI;AAAA,IAAA;AAAA,EAAA;AAKhC,SAAA,gBAAAF,EAACG,GAAI,EAAA,WAAU,qBAAoB,IAAIN,EAAO,QAAQ,OAAO,IAAIA,EAAO,QAAQ,QAC9E,UAAA,gBAAAG;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,YAAY;AAAA,QACV,gBACE,gBAAAJ,EAACK,GAAe,EAAA,UAAS,SACvB,UAAA,gBAAAL,EAACE,GAAK,EAAA,OAAM,YAAW,MAAK,UAAS,MAAM,GAAI,CAAA,GACjD;AAAA,QAEF,cACE,gBAAAF,EAACK,GAAe,EAAA,UAAS,OAAM,IAAI,EAAE,GAAG,EAAE,GACvC,UAAcT,IAAAG,IAAe,KAChC,CAAA;AAAA,MAEJ;AAAA,MACA,cAAYP;AAAA,MACZ,MAAK;AAAA,MACL,UAAU,CAACc,MAA2CZ,EAASY,EAAE,OAAO,KAAK;AAAA,MAC7E,aAAAX;AAAA,MAEA,IAAI,EAAE,SAAS,oBAAoB,OAAO,OAAO;AAAA,MACjD,OAAOC;AAAA,IAAA;AAAA,EAEX,EAAA,CAAA;AAEJ,GAEeW,IAAAC,EAASjB,CAAS;"}