@mx-cartographer/experiences 9.4.45 → 9.4.47
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/dist/common/components/dialog/Dialog.d.ts +2 -1
- package/dist/common/components/dialog/Dialog.es.js +56 -35
- package/dist/common/components/dialog/Dialog.es.js.map +1 -1
- package/dist/transactions/components/tagmanager/TagRow.es.js +57 -53
- package/dist/transactions/components/tagmanager/TagRow.es.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,11 @@
|
|
|
1
|
+
## [9.4.47] - 09-30-2026
|
|
2
|
+
|
|
3
|
+
- **FIXED** - Confirmation dialogs now return screen reader focus to the row that opened them instead of stranding it (MEW-4016)
|
|
4
|
+
|
|
5
|
+
## [9.4.46] - 09-30-2026
|
|
6
|
+
|
|
7
|
+
- **FIXED** - Tags drawer rows no longer nest a checkbox inside a `role="checkbox"` button (MEW-4124)
|
|
8
|
+
|
|
1
9
|
## [9.4.45] - 09-29-2026
|
|
2
10
|
|
|
3
11
|
- **CHANGED** - insights-v2 `BillAmountNotStandard` design tweaks: `BarchartBlock` and `TransactionHistoryBlock`'s drill-down chart now use explicit margins for consistent spacing instead of relying on unset/default values (WEC-1853)
|
|
@@ -4,7 +4,8 @@ export type CopyObject = {
|
|
|
4
4
|
close_aria?: string;
|
|
5
5
|
title: string;
|
|
6
6
|
};
|
|
7
|
-
|
|
7
|
+
type OwnedMuiProps = 'disableRestoreFocus' | 'onFocus' | 'open' | 'slotProps' | 'slots' | 'TransitionComponent' | 'TransitionProps';
|
|
8
|
+
export interface DialogProps extends Omit<MuiDialogProps, OwnedMuiProps> {
|
|
8
9
|
className?: string;
|
|
9
10
|
copy: CopyObject;
|
|
10
11
|
disablePrimaryButton?: boolean;
|
|
@@ -1,51 +1,72 @@
|
|
|
1
|
-
import { useScreenSize as
|
|
2
|
-
import
|
|
3
|
-
import { DialogFooter as
|
|
4
|
-
import { jsx as
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
var N = ({ className:
|
|
8
|
-
const { sx:
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
import { useScreenSize as T } from "../../hooks/useScreenSize.es.js";
|
|
2
|
+
import r from "react";
|
|
3
|
+
import { DialogFooter as k, DialogHeader as C } from "@mxenabled/mxui";
|
|
4
|
+
import { jsx as i, jsxs as L } from "react/jsx-runtime";
|
|
5
|
+
import j from "@mui/material/Dialog";
|
|
6
|
+
import w from "@mui/material/DialogContent";
|
|
7
|
+
var N = ({ className: p, copy: l, disablePrimaryButton: g = !1, isOpen: c = !1, onClose: n, onPrimaryAction: x, primaryColor: h = "primary", primaryText: y = "Confirm", onSecondaryAction: u, secondaryColor: D = "primary", secondaryText: b = "Cancel", children: R, ...E }) => {
|
|
8
|
+
const { sx: m, ...M } = E, S = l?.title ?? "", P = l?.close_aria ?? "Close", f = r.useId(), { isSmallMobile: v } = T(), a = r.useRef(null), o = r.useRef(null), s = r.useRef(null);
|
|
9
|
+
r.useLayoutEffect(() => {
|
|
10
|
+
if (!c) return;
|
|
11
|
+
o.current = null;
|
|
12
|
+
const e = document.activeElement;
|
|
13
|
+
s.current = e instanceof HTMLElement && e !== document.body && !a.current?.contains(e) ? e : null;
|
|
14
|
+
}, [c]);
|
|
15
|
+
const H = (e) => {
|
|
16
|
+
const { relatedTarget: t } = e;
|
|
17
|
+
o.current === null && t instanceof HTMLElement && !e.currentTarget.contains(t) && (o.current = t);
|
|
18
|
+
}, d = () => {
|
|
19
|
+
const e = o.current ?? s.current;
|
|
20
|
+
if (o.current = null, s.current = null, !e?.isConnected) return;
|
|
21
|
+
const t = e.ownerDocument.activeElement;
|
|
22
|
+
(!t || t === e.ownerDocument.body || a.current?.contains(t)) && e.focus();
|
|
12
23
|
};
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
24
|
+
r.useEffect(() => () => queueMicrotask(d), []);
|
|
25
|
+
const A = () => {
|
|
26
|
+
x?.(), n();
|
|
27
|
+
}, F = () => {
|
|
28
|
+
u && u(), n();
|
|
29
|
+
};
|
|
30
|
+
return /* @__PURE__ */ i("div", {
|
|
31
|
+
className: `mx-cmn-dialog ${p}`,
|
|
32
|
+
children: /* @__PURE__ */ L(j, {
|
|
33
|
+
"aria-labelledby": f,
|
|
17
34
|
maxWidth: "xs",
|
|
18
|
-
onClose:
|
|
19
|
-
open:
|
|
35
|
+
onClose: n,
|
|
36
|
+
open: c,
|
|
20
37
|
sx: [{
|
|
21
38
|
"& .MuiDialog-paperScrollPaper": { backgroundColor: "background.default" },
|
|
22
|
-
...
|
|
39
|
+
...v && { "& .MuiDialog-paper": { minWidth: "100%" } },
|
|
23
40
|
height: "100%"
|
|
24
|
-
}, ...
|
|
25
|
-
...
|
|
41
|
+
}, ...m ? [m] : []],
|
|
42
|
+
...M,
|
|
43
|
+
disableRestoreFocus: !0,
|
|
44
|
+
onFocus: H,
|
|
45
|
+
ref: a,
|
|
46
|
+
slotProps: { transition: { onExited: d } },
|
|
26
47
|
children: [
|
|
27
|
-
/* @__PURE__ */
|
|
48
|
+
/* @__PURE__ */ i(C, {
|
|
28
49
|
ariaHidden: !0,
|
|
29
50
|
copy: {
|
|
30
|
-
title:
|
|
31
|
-
close_aria:
|
|
51
|
+
title: S,
|
|
52
|
+
close_aria: P
|
|
32
53
|
},
|
|
33
|
-
id:
|
|
34
|
-
onClose:
|
|
54
|
+
id: f,
|
|
55
|
+
onClose: n,
|
|
35
56
|
truncate: !0
|
|
36
57
|
}),
|
|
37
|
-
/* @__PURE__ */
|
|
58
|
+
/* @__PURE__ */ i(w, {
|
|
38
59
|
sx: { lineHeight: 1.5 },
|
|
39
|
-
children:
|
|
60
|
+
children: R
|
|
40
61
|
}),
|
|
41
|
-
/* @__PURE__ */
|
|
42
|
-
isPrimaryDisabled:
|
|
43
|
-
onPrimaryAction:
|
|
44
|
-
onSecondaryAction:
|
|
45
|
-
primaryColor:
|
|
46
|
-
primaryText:
|
|
47
|
-
secondaryColor:
|
|
48
|
-
secondaryText:
|
|
62
|
+
/* @__PURE__ */ i(k, {
|
|
63
|
+
isPrimaryDisabled: g,
|
|
64
|
+
onPrimaryAction: A,
|
|
65
|
+
onSecondaryAction: F,
|
|
66
|
+
primaryColor: h,
|
|
67
|
+
primaryText: y,
|
|
68
|
+
secondaryColor: D,
|
|
69
|
+
secondaryText: b
|
|
49
70
|
})
|
|
50
71
|
]
|
|
51
72
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.es.js","names":[],"sources":["../../../../src/common/components/dialog/Dialog.tsx"],"sourcesContent":["import React from 'react'\n\nimport MuiDialog from '@mui/material/Dialog'\nimport { DialogProps as MuiDialogProps } from '@mui/material/Dialog'\nimport DialogContent from '@mui/material/DialogContent'\nimport type { SxProps } from '@mui/material/styles'\n\nimport { DialogFooter, DialogHeader } from '@mxenabled/mxui'\nimport { useScreenSize } from '../../hooks'\n\nexport type CopyObject = {\n close_aria?: string\n title: string\n}\n\nexport interface DialogProps extends Omit<MuiDialogProps,
|
|
1
|
+
{"version":3,"file":"Dialog.es.js","names":[],"sources":["../../../../src/common/components/dialog/Dialog.tsx"],"sourcesContent":["import React from 'react'\n\nimport MuiDialog from '@mui/material/Dialog'\nimport { DialogProps as MuiDialogProps } from '@mui/material/Dialog'\nimport DialogContent from '@mui/material/DialogContent'\nimport type { SxProps } from '@mui/material/styles'\n\nimport { DialogFooter, DialogHeader } from '@mxenabled/mxui'\nimport { useScreenSize } from '../../hooks'\n\nexport type CopyObject = {\n close_aria?: string\n title: string\n}\n\ntype OwnedMuiProps =\n | 'disableRestoreFocus'\n | 'onFocus'\n | 'open'\n | 'slotProps'\n | 'slots'\n | 'TransitionComponent'\n | 'TransitionProps'\n\nexport interface DialogProps extends Omit<MuiDialogProps, OwnedMuiProps> {\n className?: string\n copy: CopyObject\n disablePrimaryButton?: boolean\n isOpen: boolean\n onClose: (event?: unknown, reason?: string) => void\n onPrimaryAction?: () => void\n onSecondaryAction?: () => void\n primaryColor?: 'primary' | 'inherit' | 'secondary' | 'success' | 'error' | 'info' | 'warning'\n primaryText?: string\n secondaryColor?: 'primary' | 'inherit' | 'secondary' | 'success' | 'error' | 'info' | 'warning'\n secondaryText?: string\n}\n\nconst Dialog: React.FC<React.PropsWithChildren<DialogProps>> = ({\n className,\n copy,\n disablePrimaryButton = false,\n isOpen = false,\n onClose,\n onPrimaryAction,\n primaryColor = 'primary',\n primaryText = 'Confirm',\n onSecondaryAction,\n secondaryColor = 'primary',\n secondaryText = 'Cancel',\n children,\n ...rest\n}) => {\n // Extract sx from rest to merge with Dialog's own styles instead of overwriting\n const { sx: restSx, ...restProps } = rest\n const title = copy?.title ?? ''\n const closeAria = copy?.close_aria ?? 'Close'\n\n // Label the dialog *by* its visible heading (WAI-ARIA APG) instead of a duplicate\n // aria-label, so screen readers announce the title once rather than name + heading.\n const titleId = React.useId()\n\n const { isSmallMobile } = useScreenSize()\n\n const rootRef = React.useRef<HTMLDivElement>(null)\n const openerRef = React.useRef<HTMLElement | null>(null)\n const openerSnapshotRef = React.useRef<HTMLElement | null>(null)\n\n React.useLayoutEffect(() => {\n if (!isOpen) return\n openerRef.current = null\n const active = document.activeElement\n openerSnapshotRef.current =\n active instanceof HTMLElement &&\n active !== document.body &&\n !rootRef.current?.contains(active)\n ? active\n : null\n }, [isOpen])\n\n const captureOpener = (event: React.FocusEvent<HTMLDivElement>) => {\n const { relatedTarget } = event\n if (\n openerRef.current === null &&\n relatedTarget instanceof HTMLElement &&\n !event.currentTarget.contains(relatedTarget)\n ) {\n openerRef.current = relatedTarget\n }\n }\n\n const restoreFocus = () => {\n const target = openerRef.current ?? openerSnapshotRef.current\n openerRef.current = null\n openerSnapshotRef.current = null\n if (!target?.isConnected) return\n\n const active = target.ownerDocument.activeElement\n const focusIsUnclaimed =\n !active || active === target.ownerDocument.body || Boolean(rootRef.current?.contains(active))\n if (focusIsUnclaimed) {\n target.focus()\n }\n }\n\n React.useEffect(() => () => queueMicrotask(restoreFocus), [])\n\n const handlePrimaryAction = () => {\n onPrimaryAction?.()\n onClose()\n }\n\n const handleSecondaryAction = () => {\n if (onSecondaryAction) {\n onSecondaryAction()\n }\n onClose()\n }\n\n return (\n <div className={`mx-cmn-dialog ${className}`}>\n <MuiDialog\n aria-labelledby={titleId}\n maxWidth=\"xs\"\n onClose={onClose}\n open={isOpen}\n sx={\n [\n {\n '& .MuiDialog-paperScrollPaper': { backgroundColor: 'background.default' },\n ...(isSmallMobile && { '& .MuiDialog-paper': { minWidth: '100%' } }),\n height: '100%',\n },\n ...(restSx ? [restSx] : []),\n ] as SxProps\n }\n {...restProps}\n disableRestoreFocus={true}\n onFocus={captureOpener}\n ref={rootRef}\n slotProps={{ transition: { onExited: restoreFocus } }}\n >\n <DialogHeader\n ariaHidden={true}\n copy={{ title, close_aria: closeAria }}\n id={titleId}\n onClose={onClose}\n truncate={true}\n />\n\n <DialogContent sx={{ lineHeight: 1.5 }}>{children}</DialogContent>\n\n <DialogFooter\n isPrimaryDisabled={disablePrimaryButton}\n onPrimaryAction={handlePrimaryAction}\n onSecondaryAction={handleSecondaryAction}\n primaryColor={primaryColor}\n primaryText={primaryText}\n secondaryColor={secondaryColor}\n secondaryText={secondaryText}\n />\n </MuiDialog>\n </div>\n )\n}\n\nexport default Dialog\n"],"mappings":"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"}
|
|
@@ -1,40 +1,38 @@
|
|
|
1
|
-
import { useEvent as
|
|
2
|
-
import
|
|
3
|
-
import { ON_CLICK_EVENTS as
|
|
1
|
+
import { useEvent as x, useGlobalCopyStore as v, useTransactionStore as D } from "../../../common/context/hooks.es.js";
|
|
2
|
+
import T from "../../../common/components/dialog/Dialog.es.js";
|
|
3
|
+
import { ON_CLICK_EVENTS as a } from "../../constants/OnClickEvents.es.js";
|
|
4
4
|
import r from "react";
|
|
5
|
-
import { observer as
|
|
6
|
-
import
|
|
7
|
-
import { P as L, Text as
|
|
8
|
-
import { Delete as
|
|
9
|
-
import { jsx as t, jsxs as
|
|
5
|
+
import { observer as G } from "mobx-react-lite";
|
|
6
|
+
import I from "@mui/material/Stack";
|
|
7
|
+
import { P as L, Text as w, TextField as R } from "@mxenabled/mxui";
|
|
8
|
+
import { Delete as k, Edit as K } from "@mxenabled/mx-icons";
|
|
9
|
+
import { jsx as t, jsxs as c } from "react/jsx-runtime";
|
|
10
10
|
import p from "@mui/material/IconButton";
|
|
11
11
|
import P from "@mui/material/Checkbox";
|
|
12
|
-
import
|
|
13
|
-
import j from "@mui/material/
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
const { onEvent: a } = O(), { removeTag: h, updateTag: A } = D(), { common: m, transactions: n } = b(), [C, i] = r.useState(!1), [g, s] = r.useState(!1), [c, _] = r.useState(""), [T, E] = r.useState(""), N = async () => {
|
|
18
|
-
a(o.ON_TRANSACTION_TAGS_TAG_EDIT_SAVED), e && await A({
|
|
12
|
+
import F from "@mui/material/FormControlLabel";
|
|
13
|
+
import j from "@mui/material/ListItem";
|
|
14
|
+
var B = ({ onTagChecked: u, selectedTags: f, tag: e }) => {
|
|
15
|
+
const { onEvent: o } = x(), { removeTag: g, updateTag: C } = D(), { common: m, transactions: n } = v(), [h, i] = r.useState(!1), [A, s] = r.useState(!1), [l, d] = r.useState(""), [_, E] = r.useState(""), N = async () => {
|
|
16
|
+
o(a.ON_TRANSACTION_TAGS_TAG_EDIT_SAVED), e && await C({
|
|
19
17
|
...e,
|
|
20
|
-
name:
|
|
18
|
+
name: l
|
|
21
19
|
}), i(!1);
|
|
22
20
|
}, S = async () => {
|
|
23
|
-
a
|
|
21
|
+
o(a.ON_TRANSACTION_TAGS_TAG_DELETED), await g(e.guid), s(!1);
|
|
24
22
|
};
|
|
25
23
|
r.useEffect(() => {
|
|
26
|
-
E(
|
|
27
|
-
}, [
|
|
24
|
+
E(l.length > 40 ? n.tags_error_name_must_be_40_chars : "");
|
|
25
|
+
}, [l]);
|
|
28
26
|
const y = () => {
|
|
29
|
-
a
|
|
30
|
-
},
|
|
31
|
-
a
|
|
27
|
+
o(a.ON_TRANSACTION_TAGS_TAG_EDIT_CLICK), d(e.name), i(!0);
|
|
28
|
+
}, b = () => {
|
|
29
|
+
o(a.ON_TRANSACTION_TAGS_TAG_DELETE_CLICK), s(!0);
|
|
32
30
|
};
|
|
33
|
-
return /* @__PURE__ */
|
|
31
|
+
return /* @__PURE__ */ c(j, {
|
|
34
32
|
className: "mx-txn-transaction-manager-row",
|
|
35
33
|
disableGutters: !0,
|
|
36
34
|
disablePadding: !0,
|
|
37
|
-
secondaryAction: !e.is_default_tag && /* @__PURE__ */
|
|
35
|
+
secondaryAction: !e.is_default_tag && /* @__PURE__ */ c(I, {
|
|
38
36
|
direction: "row",
|
|
39
37
|
children: [/* @__PURE__ */ t(p, {
|
|
40
38
|
"aria-label": `Edit ${e.name} tag`,
|
|
@@ -44,65 +42,71 @@ var F = ({ onTagChecked: f, selectedTags: d, tag: e }) => {
|
|
|
44
42
|
}), /* @__PURE__ */ t(p, {
|
|
45
43
|
"aria-label": `Delete ${e.name} tag`,
|
|
46
44
|
color: "secondary",
|
|
47
|
-
onClick:
|
|
48
|
-
children: /* @__PURE__ */ t(
|
|
45
|
+
onClick: b,
|
|
46
|
+
children: /* @__PURE__ */ t(k, { color: "secondary" })
|
|
49
47
|
})]
|
|
50
48
|
}),
|
|
51
49
|
children: [
|
|
52
|
-
/* @__PURE__ */
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
50
|
+
/* @__PURE__ */ t(F, {
|
|
51
|
+
control: /* @__PURE__ */ t(P, {
|
|
52
|
+
checked: f.includes(e.guid),
|
|
53
|
+
edge: "start",
|
|
54
|
+
onChange: () => u(e.guid)
|
|
55
|
+
}),
|
|
56
|
+
label: e.name,
|
|
57
|
+
sx: {
|
|
58
|
+
flexGrow: 1,
|
|
59
|
+
m: 0,
|
|
60
|
+
minHeight: 64,
|
|
61
|
+
minWidth: 0,
|
|
62
|
+
px: 24,
|
|
63
|
+
py: 12,
|
|
64
|
+
"&:hover": { bgcolor: "action.hover" },
|
|
65
|
+
"& .MuiFormControlLabel-label": {
|
|
66
|
+
fontSize: 15,
|
|
67
|
+
fontWeight: 600
|
|
68
|
+
}
|
|
69
|
+
}
|
|
66
70
|
}),
|
|
67
|
-
/* @__PURE__ */
|
|
71
|
+
/* @__PURE__ */ c(T, {
|
|
68
72
|
copy: { title: "Update tag name" },
|
|
69
|
-
isOpen:
|
|
73
|
+
isOpen: h,
|
|
70
74
|
onClose: () => i(!1),
|
|
71
75
|
onPrimaryAction: N,
|
|
72
76
|
onSecondaryAction: () => i(!1),
|
|
73
|
-
children: [/* @__PURE__ */ t(
|
|
74
|
-
"aria-describedby":
|
|
77
|
+
children: [/* @__PURE__ */ t(R, {
|
|
78
|
+
"aria-describedby": _ ? "update-tag-error" : void 0,
|
|
75
79
|
"aria-label": n.tags_update_the_tag_name,
|
|
76
80
|
name: "update-tag",
|
|
77
|
-
onChange: (
|
|
81
|
+
onChange: (O) => d(O.target.value),
|
|
78
82
|
placeholder: "Tag name",
|
|
79
83
|
sx: { width: "100%" },
|
|
80
|
-
value:
|
|
84
|
+
value: l
|
|
81
85
|
}), /* @__PURE__ */ t(L, {
|
|
82
86
|
id: "update-tag-error",
|
|
83
87
|
sx: { color: "error.main" },
|
|
84
88
|
variant: "subtitle2",
|
|
85
|
-
children:
|
|
89
|
+
children: _
|
|
86
90
|
})]
|
|
87
91
|
}),
|
|
88
|
-
/* @__PURE__ */ t(
|
|
92
|
+
/* @__PURE__ */ t(T, {
|
|
89
93
|
copy: { title: n.tags_delete_title },
|
|
90
|
-
isOpen:
|
|
94
|
+
isOpen: A,
|
|
91
95
|
onClose: () => s(!1),
|
|
92
96
|
onPrimaryAction: S,
|
|
93
|
-
onSecondaryAction: () => a
|
|
97
|
+
onSecondaryAction: () => o(a.ON_TRANSACTION_TAGS_TAG_DELETE_CANCEL_CLICK),
|
|
94
98
|
primaryText: m.delete_button,
|
|
95
99
|
secondaryText: m.cancel_button,
|
|
96
|
-
children: /* @__PURE__ */ t(
|
|
100
|
+
children: /* @__PURE__ */ t(w, {
|
|
97
101
|
truncate: !1,
|
|
98
102
|
children: n.tags_deleting_this_tag_will_remove_it
|
|
99
103
|
})
|
|
100
104
|
})
|
|
101
105
|
]
|
|
102
106
|
});
|
|
103
|
-
},
|
|
107
|
+
}, ee = G(B);
|
|
104
108
|
export {
|
|
105
|
-
|
|
109
|
+
ee as default
|
|
106
110
|
};
|
|
107
111
|
|
|
108
112
|
//# sourceMappingURL=TagRow.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TagRow.es.js","names":[],"sources":["../../../../src/transactions/components/tagmanager/TagRow.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Checkbox from '@mui/material/Checkbox'\nimport
|
|
1
|
+
{"version":3,"file":"TagRow.es.js","names":[],"sources":["../../../../src/transactions/components/tagmanager/TagRow.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Checkbox from '@mui/material/Checkbox'\nimport FormControlLabel from '@mui/material/FormControlLabel'\nimport IconButton from '@mui/material/IconButton'\nimport ListItem from '@mui/material/ListItem'\nimport Stack from '@mui/material/Stack'\n\nimport { P, Text, TextField } from '@mxenabled/mxui'\nimport { Delete as DeleteOutlinedIcon, Edit as EditIcon } from '@mxenabled/mx-icons'\n\nimport { Dialog, useGlobalCopyStore } from '../../../common'\n\nimport type { Tag } from '../../../core'\n\nimport { useEvent, useTransactionStore } from '../../../common'\nimport { ON_CLICK_EVENTS } from '../../constants/OnClickEvents'\n\ninterface TagRowProps {\n tag: Tag\n selectedTags: string[]\n onTagChecked: (guid: string) => void\n}\n\nconst TagRow: React.FC<TagRowProps> = ({ onTagChecked, selectedTags, tag }) => {\n const { onEvent } = useEvent()\n const { removeTag, updateTag } = useTransactionStore()\n const { common: commonCopy, transactions: copy } = useGlobalCopyStore()\n\n const [editOpen, setEditOpen] = React.useState(false)\n const [deleteOpen, setDeleteOpen] = React.useState(false)\n\n const [tagName, setTagName] = React.useState('')\n const [tagNameError, setTagNameError] = React.useState('')\n\n const handleSaveTag = async () => {\n onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_TAGS_TAG_EDIT_SAVED)\n if (tag) {\n await updateTag({ ...tag, name: tagName })\n }\n setEditOpen(false)\n }\n\n const handleDeleteTag = async () => {\n onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_TAGS_TAG_DELETED)\n await removeTag(tag.guid)\n setDeleteOpen(false)\n }\n\n React.useEffect(() => {\n setTagNameError(tagName.length > 40 ? copy.tags_error_name_must_be_40_chars : '')\n }, [tagName])\n\n const handleEditClick = () => {\n onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_TAGS_TAG_EDIT_CLICK)\n setTagName(tag.name)\n setEditOpen(true)\n }\n\n const handleDeleteClick = () => {\n onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_TAGS_TAG_DELETE_CLICK)\n setDeleteOpen(true)\n }\n\n return (\n <ListItem\n className=\"mx-txn-transaction-manager-row\"\n disableGutters={true}\n disablePadding={true}\n secondaryAction={\n !tag.is_default_tag && (\n <Stack direction=\"row\">\n <IconButton\n aria-label={`Edit ${tag.name} tag`}\n color=\"secondary\"\n onClick={handleEditClick}\n >\n <EditIcon color=\"secondary\" />\n </IconButton>\n <IconButton\n aria-label={`Delete ${tag.name} tag`}\n color=\"secondary\"\n onClick={handleDeleteClick}\n >\n <DeleteOutlinedIcon color=\"secondary\" />\n </IconButton>\n </Stack>\n )\n }\n >\n <FormControlLabel\n control={\n <Checkbox\n checked={selectedTags.includes(tag.guid)}\n edge=\"start\"\n onChange={() => onTagChecked(tag.guid)}\n />\n }\n label={tag.name}\n sx={{\n flexGrow: 1,\n m: 0,\n minHeight: 64,\n minWidth: 0,\n px: 24,\n py: 12,\n '&:hover': { bgcolor: 'action.hover' },\n '& .MuiFormControlLabel-label': { fontSize: 15, fontWeight: 600 },\n }}\n />\n\n <Dialog\n copy={{ title: 'Update tag name' }} // TODO: Need copy\n isOpen={editOpen}\n onClose={() => setEditOpen(false)}\n onPrimaryAction={handleSaveTag}\n onSecondaryAction={() => setEditOpen(false)}\n >\n <TextField\n aria-describedby={tagNameError ? 'update-tag-error' : undefined}\n aria-label={copy.tags_update_the_tag_name}\n name=\"update-tag\"\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => setTagName(e.target.value)}\n placeholder=\"Tag name\" // TODO: Need copy\n sx={{ width: '100%' }}\n value={tagName}\n />\n <P id=\"update-tag-error\" sx={{ color: 'error.main' }} variant=\"subtitle2\">\n {tagNameError}\n </P>\n </Dialog>\n\n <Dialog\n copy={{ title: copy.tags_delete_title }}\n isOpen={deleteOpen}\n onClose={() => setDeleteOpen(false)}\n onPrimaryAction={handleDeleteTag}\n onSecondaryAction={() =>\n onEvent(ON_CLICK_EVENTS.ON_TRANSACTION_TAGS_TAG_DELETE_CANCEL_CLICK)\n }\n primaryText={commonCopy.delete_button}\n secondaryText={commonCopy.cancel_button}\n >\n <Text truncate={false}>{copy.tags_deleting_this_tag_will_remove_it}</Text>\n </Dialog>\n </ListItem>\n )\n}\n\nexport default observer(TagRow)\n"],"mappings":"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"}
|