tycho-components 0.2.4-SNAPSHOT-4 → 0.2.4-SNAPSHOT-5
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.
|
@@ -10,7 +10,7 @@ type Props = {
|
|
|
10
10
|
renderWithInfo?: boolean;
|
|
11
11
|
placeholder?: string;
|
|
12
12
|
onClickExpression?: () => void;
|
|
13
|
-
onExpand?: (
|
|
13
|
+
onExpand?: () => void;
|
|
14
14
|
onReadyCustom?: (thisCy: Core) => void;
|
|
15
15
|
};
|
|
16
16
|
export default function TreeView({ struct, expression, selector, translations, wheelSensitivity, renderWithInfo, placeholder, onClickExpression, onExpand, onReadyCustom, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
@@ -16,7 +16,6 @@ export default function TreeView({ struct, expression, selector = 'canvas-tree',
|
|
|
16
16
|
const [cy, setCy] = useState(null);
|
|
17
17
|
const [showInfo, setShowInfo] = useState(renderWithInfo);
|
|
18
18
|
const [invalid, setInvalid] = useState();
|
|
19
|
-
const [expandedExternally, setExpandedExternally] = useState(false);
|
|
20
19
|
const load = () => {
|
|
21
20
|
setCy(null);
|
|
22
21
|
const element = document.getElementById(selector);
|
|
@@ -93,28 +92,15 @@ export default function TreeView({ struct, expression, selector = 'canvas-tree',
|
|
|
93
92
|
setShowInfo(newVal);
|
|
94
93
|
applyInfo(cy, struct, newVal);
|
|
95
94
|
};
|
|
96
|
-
const handleExpand = () => {
|
|
97
|
-
setExpandedExternally(true);
|
|
98
|
-
onExpand && onExpand(reset);
|
|
99
|
-
};
|
|
100
95
|
useEffect(() => {
|
|
101
96
|
setInvalid(undefined);
|
|
102
97
|
load();
|
|
103
98
|
}, [struct]);
|
|
104
|
-
useEffect(() => {
|
|
105
|
-
if (expandedExternally) {
|
|
106
|
-
const id = setTimeout(() => {
|
|
107
|
-
reset();
|
|
108
|
-
setExpandedExternally(false);
|
|
109
|
-
}, 50);
|
|
110
|
-
return () => clearTimeout(id);
|
|
111
|
-
}
|
|
112
|
-
}, [expandedExternally]);
|
|
113
99
|
if (invalid) {
|
|
114
100
|
return (_jsx(AppPlaceholder, { text: placeholder || t('placeholder.sentence.notparsed') }));
|
|
115
101
|
}
|
|
116
102
|
return (_jsxs("div", { className: "tree-view-container", children: [cy &&
|
|
117
|
-
getButtons(generateImage, reset, onClickExpression || downloadPsd, toggleInfo,
|
|
103
|
+
getButtons(generateImage, reset, onClickExpression || downloadPsd, toggleInfo, onExpand, expression)
|
|
118
104
|
.filter((btn) => btn.condition)
|
|
119
105
|
.map((btn, i) => {
|
|
120
106
|
const right = 12 + i * 44;
|
|
@@ -122,7 +108,7 @@ export default function TreeView({ struct, expression, selector = 'canvas-tree',
|
|
|
122
108
|
}), _jsx("div", { id: selector, className: "canvas-tree" }), showInfo && (_jsxs("div", { className: "info", children: [_jsx("span", { children: SentenceUtils.getAsText(struct) }), translations &&
|
|
123
109
|
Object.entries(translations).map(([k, v]) => (_jsxs("div", { className: "translation", children: [_jsxs("b", { children: [k, ":"] }), _jsx("span", { children: v })] }, k))), struct.parsed && (_jsxs("span", { className: "date", children: [t('date.parsed'), ' ', DateUtils.formatDateTime(struct.parsed, 'dd/MM/yyyy HH:mm:ss')] }))] }))] }));
|
|
124
110
|
}
|
|
125
|
-
const getButtons = (generateImage, reset, downloadPsd, toggleInfo,
|
|
111
|
+
const getButtons = (generateImage, reset, downloadPsd, toggleInfo, onExpand, expression) => [
|
|
126
112
|
{
|
|
127
113
|
condition: true,
|
|
128
114
|
title: 'button.download.tree',
|
|
@@ -145,7 +131,7 @@ const getButtons = (generateImage, reset, downloadPsd, toggleInfo, handleExpand,
|
|
|
145
131
|
{
|
|
146
132
|
condition: !!onExpand,
|
|
147
133
|
title: 'button.expand.tree',
|
|
148
|
-
onClick:
|
|
134
|
+
onClick: onExpand,
|
|
149
135
|
icon: faUpRightAndDownLeftFromCenter,
|
|
150
136
|
},
|
|
151
137
|
{
|