d2aura 23.0.0

package/coreui/components/d2Chart/d2ChartToolboxPanel.js

@@ -0,0 +1,116 @@
+import React from "react";
+import { CalendarOutlined, FullscreenOutlined, IssuesCloseOutlined, ZoomInOutlined, ZoomOutOutlined } from "@ant-design/icons";
+import i18n from "d2core/i18n/i18n";
+import { Popover } from "antd";
+import { CHART_CALENDAR_HOLIDAY_COLOR, CHART_CALENDAR_SATURDAY_COLOR, CHART_CALENDAR_SUNDAY_COLOR } from "../../../api/constants/d2ChartConstants";
+import { PRIMARY_COLOR, WARNING_COLOR } from "../../../api/constants/constants";
+import dayjs from "d2core/dayjs";
+import { LocaleHolder } from "d2core/i18n/localeHolder";
+export default class D2ChartToolboxPanel extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            zoomEnabled: false,
+        };
+    }
+    renderZoomInIcon(iconMargin) {
+        return (React.createElement(ZoomInOutlined, { style: {
+                cursor: "pointer",
+                margin: `0px ${iconMargin}px`,
+                color: this.state.zoomEnabled ? "#2998ff" : "rgba(0, 0, 0, 0.5)",
+            }, title: i18n(`${this.state.zoomEnabled ? "Deactivate" : "Activate"} Zoom`), onClick: () => {
+                const zoomEnabled = !this.state.zoomEnabled;
+                this.setState({ zoomEnabled: zoomEnabled });
+                this.props.onZoomControlSwitch?.(zoomEnabled);
+            } }));
+    }
+    renderZoomOutIcon(iconMargin) {
+        return (React.createElement(ZoomOutOutlined, { style: {
+                cursor: "pointer",
+                margin: `0px ${iconMargin}px`,
+            }, title: i18n("Zoom Reset"), onClick: () => {
+                this.props.onZoomReset?.();
+            } }));
+    }
+    renderMissingDataIcon(iconMargin) {
+        const missingData = this.props.missingData;
+        const icon = React.createElement(IssuesCloseOutlined, { style: {
+                cursor: "pointer",
+                margin: `0px ${iconMargin}px`,
+                color: this.props.missingDataVisible ? (missingData.length > 0 ? WARNING_COLOR : PRIMARY_COLOR) : "rgba(0, 0, 0, 0.5)",
+            }, title: i18n(`${this.props.missingDataVisible ? "Hide" : "Show"} Missing Data`), onClick: () => {
+                this.props.onSwitchMissingData?.();
+            } });
+        if (this.props.missingDataVisible) {
+            return (React.createElement(Popover, { mouseEnterDelay: 0.8, placement: "topRight", title: React.createElement("span", null,
+                    React.createElement(CalendarOutlined, null),
+                    " ",
+                    i18n("Missing Data Periods")), content: React.createElement("div", { style: { width: 220, maxHeight: 400, overflow: "auto", fontSize: 13 } },
+                    missingData.length === 0 && React.createElement("span", null, i18n("No missing data")),
+                    missingData.map((value, index) => {
+                        const from = dayjs(value[0].xAxis).format(LocaleHolder.getDateTimeFormat(true, false, false));
+                        const to = dayjs(value[1].xAxis).format(LocaleHolder.getDateTimeFormat(true, false, false));
+                        return React.createElement("div", { key: index },
+                            from,
+                            " - ",
+                            to);
+                    })) }, icon));
+        }
+        else {
+            return icon;
+        }
+    }
+    renderFullScreenIcon(iconMargin) {
+        return (React.createElement(FullscreenOutlined, { style: {
+                cursor: "pointer",
+                margin: `0px ${iconMargin}px`,
+            }, title: i18n("Fullscreen"), onClick: () => {
+                this.props.onFullScreen?.();
+            } }));
+    }
+    renderCalendarIcon(iconMargin) {
+        return (React.createElement(Popover, { mouseEnterDelay: 0.8, content: React.createElement("div", { style: { width: 92, padding: "3px 4px 2px" } },
+                React.createElement("div", { style: {
+                        backgroundColor: CHART_CALENDAR_SATURDAY_COLOR,
+                        textAlign: "center",
+                        marginBottom: 2
+                    } },
+                    React.createElement("span", { style: { color: "#000" } }, i18n("Saturday"))),
+                React.createElement("div", { style: {
+                        backgroundColor: CHART_CALENDAR_SUNDAY_COLOR,
+                        textAlign: "center",
+                        marginBottom: 2
+                    } },
+                    React.createElement("span", { style: { color: "#000" } }, i18n("Sunday"))),
+                React.createElement("div", { style: { backgroundColor: CHART_CALENDAR_HOLIDAY_COLOR, textAlign: "center" } },
+                    React.createElement("span", { style: { color: "#000" } }, i18n("Holiday")))) },
+            React.createElement(CalendarOutlined, { style: {
+                    cursor: "pointer",
+                    margin: `0px ${iconMargin}px`,
+                    color: this.props.calendarDataVisible ? "#2998ff" : "rgba(0, 0, 0, 0.5)",
+                }, title: i18n(`${this.props.calendarDataVisible ? "Hide" : "Show"} Calendar Data`), onClick: () => {
+                    this.props.onSwitchCalendarData?.();
+                } })));
+    }
+    render() {
+        const iconMargin = 2;
+        return (React.createElement("div", { style: {
+                position: "absolute",
+                top: 1,
+                right: 0,
+                fontSize: this.props.compact ? 18 : 28,
+                color: "rgba(0, 0, 0, 0.5)",
+                display: "flex",
+                justifyContent: "end",
+                margin: this.props.compact ? "4px 4px 0px" : "0px 32px",
+                backgroundColor: "white",
+                zIndex: 1,
+            } },
+            this.renderZoomInIcon(iconMargin),
+            this.renderZoomOutIcon(iconMargin),
+            this.props.showCalendarIcon && this.renderCalendarIcon(iconMargin),
+            this.renderMissingDataIcon(iconMargin),
+            this.props.compact && this.renderFullScreenIcon(iconMargin)));
+    }
+}
+//# sourceMappingURL=d2ChartToolboxPanel.js.map

package/coreui/components/d2Chart/d2ChartToolboxPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"d2ChartToolboxPanel.js","sourceRoot":"","sources":["../../../../../coreui/components/d2Chart/d2ChartToolboxPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACH,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,EACnB,cAAc,EACd,eAAe,EAClB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,IAAI,MAAM,kBAAkB,CAAC;AACpC,OAAO,EAAC,OAAO,EAAC,MAAM,MAAM,CAAC;AAC7B,OAAO,EACH,4BAA4B,EAC5B,6BAA6B,EAC7B,2BAA2B,EAC9B,MAAM,yCAAyC,CAAC;AACjD,OAAO,EAAC,aAAa,EAAE,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAC9E,OAAO,KAAK,MAAM,cAAc,CAAC;AACjC,OAAO,EAAC,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAyBtD,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,KAAK,CAAC,SAAyD;IAC5G,YAAY,KAAuC;QAC/C,KAAK,CAAC,KAAK,CAAC,CAAC;QAEb,IAAI,CAAC,KAAK,GAAG;YACT,WAAW,EAAE,KAAK;SACrB,CAAA;IACL,CAAC;IAEO,gBAAgB,CAAC,UAAkB;QACvC,OAAO,CACH,oBAAC,cAAc,IACX,KAAK,EAAE;gBACH,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,OAAO,UAAU,IAAI;gBAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,oBAAoB;aACnE,EACD,KAAK,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,UAAU,OAAO,CAAC,EACzE,OAAO,EAAE,GAAG,EAAE;gBACV,MAAM,WAAW,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAA;gBAC3C,IAAI,CAAC,QAAQ,CAAC,EAAC,WAAW,EAAE,WAAW,EAAC,CAAC,CAAC;gBAC1C,IAAI,CAAC,KAAK,CAAC,mBAAmB,EAAE,CAAC,WAAW,CAAC,CAAC;YAClD,CAAC,GACH,CACL,CAAC;IACN,CAAC;IAEO,iBAAiB,CAAC,UAAkB;QACxC,OAAO,CACH,oBAAC,eAAe,IACZ,KAAK,EAAE;gBACH,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,OAAO,UAAU,IAAI;aAChC,EACD,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,EACzB,OAAO,EAAE,GAAG,EAAE;gBACV,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,EAAE,CAAC;YAC/B,CAAC,GACH,CACL,CAAC;IACN,CAAC;IAEO,qBAAqB,CAAC,UAAkB;QAC5C,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC;QAE3C,MAAM,IAAI,GACN,oBAAC,mBAAmB,IACpB,KAAK,EAAE;gBACH,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,OAAO,UAAU,IAAI;gBAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,oBAAoB;aACzH,EACD,KAAK,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,eAAe,CAAC,EAC9E,OAAO,EAAE,GAAG,EAAE;gBACV,IAAI,CAAC,KAAK,CAAC,mBAAmB,EAAE,EAAE,CAAC;YACvC,CAAC,GACH,CAAA;QAEF,IAAI,IAAI,CAAC,KAAK,CAAC,kBAAkB,EAAE,CAAC;YAChC,OAAO,CACH,oBAAC,OAAO,IACJ,eAAe,EAAE,GAAG,EACpB,SAAS,EAAC,UAAU,EACpB,KAAK,EAAE;oBAAM,oBAAC,gBAAgB,OAAE;;oBAAE,IAAI,CAAC,sBAAsB,CAAC,CAAQ,EACtE,OAAO,EACH,6BAAK,KAAK,EAAE,EAAC,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,EAAC;oBACnE,WAAW,CAAC,MAAM,KAAK,CAAC,IAAI,kCAAO,IAAI,CAAC,iBAAiB,CAAC,CAAQ;oBAE/D,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;wBAC7B,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,iBAAiB,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC;wBAC9F,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,iBAAiB,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC;wBAE5F,OAAO,6BAAK,GAAG,EAAE,KAAK;4BAAG,IAAI;;4BAAK,EAAE,CAAO,CAAA;oBAC/C,CAAC,CAAC,CAEJ,IAGT,IAAI,CACC,CACb,CAAC;QACN,CAAC;aAAM,CAAC;YACJ,OAAO,IAAI,CAAC;QAChB,CAAC;IACL,CAAC;IAEO,oBAAoB,CAAC,UAAkB;QAC3C,OAAO,CACH,oBAAC,kBAAkB,IACf,KAAK,EAAE;gBACH,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,OAAO,UAAU,IAAI;aAChC,EACD,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,EACzB,OAAO,EAAE,GAAG,EAAE;gBACV,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,EAAE,CAAC;YAChC,CAAC,GACH,CACL,CAAC;IACN,CAAC;IAEO,kBAAkB,CAAC,UAAkB;QACzC,OAAO,CACH,oBAAC,OAAO,IACJ,eAAe,EAAE,GAAG,EACpB,OAAO,EACH,6BAAK,KAAK,EAAE,EAAC,KAAK,EAAE,EAAE,EAAE,OAAO,EAAE,aAAa,EAAC;gBAC3C,6BAAK,KAAK,EAAE;wBACR,eAAe,EAAE,6BAA6B;wBAC9C,SAAS,EAAE,QAAQ;wBACnB,YAAY,EAAE,CAAC;qBAClB;oBACG,8BAAM,KAAK,EAAE,EAAC,KAAK,EAAE,MAAM,EAAC,IAAG,IAAI,CAAC,UAAU,CAAC,CAAQ,CACrD;gBACN,6BAAK,KAAK,EAAE;wBACR,eAAe,EAAE,2BAA2B;wBAC5C,SAAS,EAAE,QAAQ;wBACnB,YAAY,EAAE,CAAC;qBAClB;oBACG,8BAAM,KAAK,EAAE,EAAC,KAAK,EAAE,MAAM,EAAC,IAAG,IAAI,CAAC,QAAQ,CAAC,CAAQ,CACnD;gBACN,6BAAK,KAAK,EAAE,EAAC,eAAe,EAAE,4BAA4B,EAAE,SAAS,EAAE,QAAQ,EAAC;oBAC5E,8BAAM,KAAK,EAAE,EAAC,KAAK,EAAE,MAAM,EAAC,IAAG,IAAI,CAAC,SAAS,CAAC,CAAQ,CACpD,CACJ;YAGV,oBAAC,gBAAgB,IACb,KAAK,EAAE;oBACH,MAAM,EAAE,SAAS;oBACjB,MAAM,EAAE,OAAO,UAAU,IAAI;oBAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,oBAAoB;iBAC3E,EACD,KAAK,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,gBAAgB,CAAC,EAChF,OAAO,EAAE,GAAG,EAAE;oBACV,IAAI,CAAC,KAAK,CAAC,oBAAoB,EAAE,EAAE,CAAC;gBACxC,CAAC,GACH,CACI,CACb,CAAC;IACN,CAAC;IAED,MAAM;QACF,MAAM,UAAU,GAAG,CAAC,CAAC;QAErB,OAAO,CACH,6BACI,KAAK,EAAE;gBACH,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,CAAC;gBACN,KAAK,EAAE,CAAC;gBACR,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE;gBACtC,KAAK,EAAE,oBAAoB;gBAC3B,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,KAAK;gBACrB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU;gBACvD,eAAe,EAAE,OAAO;gBACxB,MAAM,EAAE,CAAC;aACZ;YAEA,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC;YACjC,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC;YAClC,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,IAAI,CAAC,kBAAkB,CAAC,UAAU,CAAC;YAClE,IAAI,CAAC,qBAAqB,CAAC,UAAU,CAAC;YACtC,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,IAAI,CAAC,oBAAoB,CAAC,UAAU,CAAC,CAC1D,CACT,CAAC;IACN,CAAC;CAEJ","sourcesContent":["import React from \"react\";\r\nimport {\r\n    CalendarOutlined,\r\n    FullscreenOutlined,\r\n    IssuesCloseOutlined,\r\n    ZoomInOutlined,\r\n    ZoomOutOutlined\r\n} from \"@ant-design/icons\";\r\nimport i18n from \"d2core/i18n/i18n\";\r\nimport {Popover} from \"antd\";\r\nimport {\r\n    CHART_CALENDAR_HOLIDAY_COLOR,\r\n    CHART_CALENDAR_SATURDAY_COLOR,\r\n    CHART_CALENDAR_SUNDAY_COLOR\r\n} from \"../../../api/constants/d2ChartConstants\";\r\nimport {PRIMARY_COLOR, WARNING_COLOR} from \"../../../api/constants/constants\";\r\nimport dayjs from \"d2core/dayjs\";\r\nimport {LocaleHolder} from \"d2core/i18n/localeHolder\";\r\nimport {MarkAreaData} from \"../../../api/types/d2ChartTypes\";\r\n\r\ninterface ChartToolboxPanelProps {\r\n    missingData: MarkAreaData[][]\r\n    calendarDataVisible?: boolean\r\n    missingDataVisible?: boolean\r\n    showCalendarIcon?: boolean\r\n    compact?: boolean\r\n\r\n    onZoomControlSwitch(zoomEnabled: boolean): void\r\n\r\n    onZoomReset(): void\r\n\r\n    onFullScreen?(): void\r\n\r\n    onSwitchCalendarData?(): void\r\n\r\n    onSwitchMissingData?(): void\r\n}\r\n\r\ninterface ChartToolboxPanelState {\r\n    zoomEnabled: boolean\r\n}\r\n\r\nexport default class D2ChartToolboxPanel extends React.Component<ChartToolboxPanelProps, ChartToolboxPanelState> {\r\n    constructor(props: Readonly<ChartToolboxPanelProps>) {\r\n        super(props);\r\n\r\n        this.state = {\r\n            zoomEnabled: false,\r\n        }\r\n    }\r\n\r\n    private renderZoomInIcon(iconMargin: number) {\r\n        return (\r\n            <ZoomInOutlined\r\n                style={{\r\n                    cursor: \"pointer\",\r\n                    margin: `0px ${iconMargin}px`,\r\n                    color: this.state.zoomEnabled ? \"#2998ff\" : \"rgba(0, 0, 0, 0.5)\",\r\n                }}\r\n                title={i18n(`${this.state.zoomEnabled ? \"Deactivate\" : \"Activate\"} Zoom`)}\r\n                onClick={() => {\r\n                    const zoomEnabled = !this.state.zoomEnabled\r\n                    this.setState({zoomEnabled: zoomEnabled});\r\n                    this.props.onZoomControlSwitch?.(zoomEnabled);\r\n                }}\r\n            />\r\n        );\r\n    }\r\n\r\n    private renderZoomOutIcon(iconMargin: number) {\r\n        return (\r\n            <ZoomOutOutlined\r\n                style={{\r\n                    cursor: \"pointer\",\r\n                    margin: `0px ${iconMargin}px`,\r\n                }}\r\n                title={i18n(\"Zoom Reset\")}\r\n                onClick={() => {\r\n                    this.props.onZoomReset?.();\r\n                }}\r\n            />\r\n        );\r\n    }\r\n\r\n    private renderMissingDataIcon(iconMargin: number) {\r\n        const missingData = this.props.missingData;\r\n\r\n        const icon =\r\n            <IssuesCloseOutlined\r\n            style={{\r\n                cursor: \"pointer\",\r\n                margin: `0px ${iconMargin}px`,\r\n                color: this.props.missingDataVisible ? (missingData.length > 0 ? WARNING_COLOR : PRIMARY_COLOR) : \"rgba(0, 0, 0, 0.5)\",\r\n            }}\r\n            title={i18n(`${this.props.missingDataVisible ? \"Hide\" : \"Show\"} Missing Data`)}\r\n            onClick={() => {\r\n                this.props.onSwitchMissingData?.();\r\n            }}\r\n        />\r\n\r\n        if (this.props.missingDataVisible) {\r\n            return (\r\n                <Popover\r\n                    mouseEnterDelay={0.8}\r\n                    placement=\"topRight\"\r\n                    title={<span><CalendarOutlined/> {i18n(\"Missing Data Periods\")}</span>}\r\n                    content={\r\n                        <div style={{width: 220, maxHeight: 400, overflow: \"auto\", fontSize: 13}}>\r\n                            {missingData.length === 0 && <span>{i18n(\"No missing data\")}</span>}\r\n                            {\r\n                                missingData.map((value, index) => {\r\n                                    const from = dayjs(value[0].xAxis).format(LocaleHolder.getDateTimeFormat(true, false, false));\r\n                                    const to = dayjs(value[1].xAxis).format(LocaleHolder.getDateTimeFormat(true, false, false));\r\n\r\n                                    return <div key={index}>{from} - {to}</div>\r\n                                })\r\n                            }\r\n                        </div>\r\n                    }\r\n                >\r\n                    {icon}\r\n                </Popover>\r\n            );\r\n        } else {\r\n            return icon;\r\n        }\r\n    }\r\n\r\n    private renderFullScreenIcon(iconMargin: number) {\r\n        return (\r\n            <FullscreenOutlined\r\n                style={{\r\n                    cursor: \"pointer\",\r\n                    margin: `0px ${iconMargin}px`,\r\n                }}\r\n                title={i18n(\"Fullscreen\")}\r\n                onClick={() => {\r\n                    this.props.onFullScreen?.();\r\n                }}\r\n            />\r\n        );\r\n    }\r\n\r\n    private renderCalendarIcon(iconMargin: number) {\r\n        return (\r\n            <Popover\r\n                mouseEnterDelay={0.8}\r\n                content={\r\n                    <div style={{width: 92, padding: \"3px 4px 2px\"}}>\r\n                        <div style={{\r\n                            backgroundColor: CHART_CALENDAR_SATURDAY_COLOR,\r\n                            textAlign: \"center\",\r\n                            marginBottom: 2\r\n                        }}>\r\n                            <span style={{color: \"#000\"}}>{i18n(\"Saturday\")}</span>\r\n                        </div>\r\n                        <div style={{\r\n                            backgroundColor: CHART_CALENDAR_SUNDAY_COLOR,\r\n                            textAlign: \"center\",\r\n                            marginBottom: 2\r\n                        }}>\r\n                            <span style={{color: \"#000\"}}>{i18n(\"Sunday\")}</span>\r\n                        </div>\r\n                        <div style={{backgroundColor: CHART_CALENDAR_HOLIDAY_COLOR, textAlign: \"center\"}}>\r\n                            <span style={{color: \"#000\"}}>{i18n(\"Holiday\")}</span>\r\n                        </div>\r\n                    </div>\r\n                }\r\n            >\r\n                <CalendarOutlined\r\n                    style={{\r\n                        cursor: \"pointer\",\r\n                        margin: `0px ${iconMargin}px`,\r\n                        color: this.props.calendarDataVisible ? \"#2998ff\" : \"rgba(0, 0, 0, 0.5)\",\r\n                    }}\r\n                    title={i18n(`${this.props.calendarDataVisible ? \"Hide\" : \"Show\"} Calendar Data`)}\r\n                    onClick={() => {\r\n                        this.props.onSwitchCalendarData?.();\r\n                    }}\r\n                />\r\n            </Popover>\r\n        );\r\n    }\r\n\r\n    render() {\r\n        const iconMargin = 2;\r\n\r\n        return (\r\n            <div\r\n                style={{\r\n                    position: \"absolute\",\r\n                    top: 1,\r\n                    right: 0,\r\n                    fontSize: this.props.compact ? 18 : 28,\r\n                    color: \"rgba(0, 0, 0, 0.5)\",\r\n                    display: \"flex\",\r\n                    justifyContent: \"end\",\r\n                    margin: this.props.compact ? \"4px 4px 0px\" : \"0px 32px\",\r\n                    backgroundColor: \"white\",\r\n                    zIndex: 1,\r\n                }}\r\n            >\r\n                {this.renderZoomInIcon(iconMargin)}\r\n                {this.renderZoomOutIcon(iconMargin)}\r\n                {this.props.showCalendarIcon && this.renderCalendarIcon(iconMargin)}\r\n                {this.renderMissingDataIcon(iconMargin)}\r\n                {this.props.compact && this.renderFullScreenIcon(iconMargin)}\r\n            </div>\r\n        );\r\n    }\r\n\r\n}"]}

package/coreui/components/edaManager/abstract/edaManagerAbstractPanel.d.ts

@@ -0,0 +1,51 @@
+import React from "react";
+import { EdaApi, EdaManagerRecord, EdaVector, EdaStepEnum } from "../../../../api/edaApi";
+import { EdaManagerTimePanelConfiguration } from "../components/edaManagerTimePanel";
+import * as FlexLayout from "flexlayout-react";
+import { Props } from "../../d2Chart/d2ChartPanel";
+import { AdvancedFilterApi } from "../../../../api/advancedFilterApi";
+export interface EdaManagerFilterToSave {
+    version: number;
+    currentVectors: EdaVector[];
+    timeFrom: string;
+    timeTo: string;
+    selectedStep: EdaStepEnum;
+    autoRefresh: boolean;
+}
+export interface EdaManagerFilter {
+    currentVectors: EdaVector[];
+    timePanelConfiguration: EdaManagerTimePanelConfiguration;
+}
+export interface EdaManagerAbstractPanelProps extends Omit<Props, "d2ChartSeries" | "d2ChartRecords" | "d2ChartCalendarRecords" | "loading"> {
+    style?: React.CSSProperties;
+    edaApi: EdaApi;
+    advancedFilterApi: AdvancedFilterApi;
+    onVectorsLoaded?(loadedVectors: EdaManagerRecord[]): void;
+}
+export interface EdaManagerAbstractPanelState {
+    layoutModel: FlexLayout.Model;
+    loadedVectors: EdaManagerRecord[];
+    loadedCalendarVector?: EdaManagerRecord[];
+    loading: boolean;
+    currentFilter: EdaManagerFilter;
+    loadedDataFilter: EdaManagerFilter;
+}
+export default abstract class EdaManagerAbstractPanel<P extends EdaManagerAbstractPanelProps, S extends EdaManagerAbstractPanelState> extends React.Component<P, S> {
+    private edaManagerTablePanel;
+    private edaManagerChartPanel;
+    protected get initialFilter(): EdaManagerFilter;
+    protected initialState: Omit<EdaManagerAbstractPanelState, "layoutModel">;
+    protected constructor(props: Readonly<P>);
+    componentDidMount(): void;
+    protected saveFilter(): void;
+    getFilterNameToSave(): string | undefined;
+    protected getActiveVectors(): EdaVector[];
+    protected onReload(): void;
+    onLoadVectors(): Promise<void>;
+    private onLoadVector;
+    private renderTimePanel;
+    protected get edaManagerChartPanelCompact(): boolean;
+    protected get tabWrapperStyle(): React.CSSProperties;
+    protected flexLayoutFactory(node: FlexLayout.TabNode): React.ReactNode;
+    render(): React.JSX.Element;
+}

package/coreui/components/edaManager/abstract/edaManagerAbstractPanel.js

@@ -0,0 +1,169 @@
+import React from "react";
+import { EdaStepEnum } from "../../../../api/edaApi";
+import EdaManagerTimePanel from "../components/edaManagerTimePanel";
+import * as FlexLayout from "flexlayout-react";
+import dayjs from "d2core/dayjs";
+import cloneDeep from "lodash/cloneDeep";
+import debounce from "lodash/debounce";
+import EdaManagerTablePanel from "../components/edaManagerTablePanel";
+import D2ChartPanel from "../../d2Chart/d2ChartPanel";
+import { isEqual, omit } from "lodash";
+const CONFIGURATION_VERSION = 2;
+export default class EdaManagerAbstractPanel extends React.Component {
+    get initialFilter() {
+        return {
+            currentVectors: [],
+            timePanelConfiguration: {
+                selectedTimeFrom: dayjs().subtract(1, "week").startOf("day"),
+                selectedTimeTo: dayjs().subtract(1, "week").startOf("day"),
+                selectedStep: EdaStepEnum.DEFAULT_VALUE,
+                autoRefresh: false,
+            }
+        };
+    }
+    constructor(props) {
+        super(props);
+        this.edaManagerTablePanel = null;
+        this.edaManagerChartPanel = null;
+        this.initialState = {
+            loadedVectors: [],
+            loading: false,
+            currentFilter: this.initialFilter,
+            loadedDataFilter: cloneDeep(this.initialFilter),
+        };
+        this.onLoadVectors = debounce(this.onLoadVectors.bind(this), 500);
+        this.flexLayoutFactory = this.flexLayoutFactory.bind(this);
+    }
+    componentDidMount() {
+        const filterNameToSave = this.getFilterNameToSave();
+        if (filterNameToSave) {
+            const item = localStorage.getItem(filterNameToSave);
+            if (item) {
+                try {
+                    const savedFilter = JSON.parse(item);
+                    if (savedFilter.version === CONFIGURATION_VERSION) {
+                        const filter = {
+                            currentVectors: savedFilter.currentVectors,
+                            timePanelConfiguration: {
+                                selectedTimeFrom: dayjs(savedFilter.timeFrom),
+                                selectedTimeTo: dayjs(savedFilter.timeTo),
+                                selectedStep: savedFilter.selectedStep,
+                                autoRefresh: savedFilter.autoRefresh,
+                            }
+                        };
+                        this.setState({ currentFilter: filter }, () => this.onLoadVectors());
+                    }
+                }
+                catch {
+                }
+            }
+        }
+    }
+    saveFilter() {
+        const filterNameToSave = this.getFilterNameToSave();
+        if (filterNameToSave) {
+            const filterToSave = {
+                version: CONFIGURATION_VERSION,
+                currentVectors: this.state.currentFilter.currentVectors,
+                timeFrom: this.state.currentFilter.timePanelConfiguration.selectedTimeFrom?.toString() ?? "",
+                timeTo: this.state.currentFilter.timePanelConfiguration.selectedTimeTo?.toString() ?? "",
+                selectedStep: this.state.currentFilter.timePanelConfiguration.selectedStep,
+                autoRefresh: this.state.currentFilter.timePanelConfiguration.autoRefresh,
+            };
+            localStorage.setItem(filterNameToSave, JSON.stringify(filterToSave));
+        }
+    }
+    getFilterNameToSave() {
+        return undefined;
+    }
+    getActiveVectors() {
+        return this.state.currentFilter.currentVectors.filter(vector => vector.active);
+    }
+    onReload() {
+        this.edaManagerTablePanel?.onReload();
+        this.edaManagerChartPanel?.onReload();
+    }
+    async onLoadVectors() {
+        const activeVectors = this.getActiveVectors();
+        this.setState({ loading: true });
+        const loadedVectors = await this.props.edaApi.loadVectors(activeVectors, this.state.currentFilter.timePanelConfiguration.selectedTimeFrom, this.state.currentFilter.timePanelConfiguration.selectedTimeTo, this.state.currentFilter.timePanelConfiguration.selectedStep);
+        const loadedCalendarVector = await this.props.edaApi.loadCalendarVector(this.state.currentFilter.timePanelConfiguration.selectedTimeFrom, this.state.currentFilter.timePanelConfiguration.selectedTimeTo);
+        this.setState({
+            loading: false,
+            loadedVectors: loadedVectors,
+            loadedCalendarVector: loadedCalendarVector,
+            loadedDataFilter: cloneDeep(this.state.currentFilter),
+        }, () => this.onReload());
+        this.props.onVectorsLoaded?.(loadedVectors);
+    }
+    async onLoadVector(code) {
+        const activeVectors = this.getActiveVectors();
+        const currentVectorIndex = activeVectors.findIndex(value => value.code === code);
+        if (currentVectorIndex >= 0) {
+            const currentVector = activeVectors[currentVectorIndex];
+            const loadedVectors = this.state.loadedVectors;
+            const loadedVector = await this.props.edaApi.loadVectors([currentVector], this.state.currentFilter.timePanelConfiguration.selectedTimeFrom, this.state.currentFilter.timePanelConfiguration.selectedTimeTo, this.state.currentFilter.timePanelConfiguration.selectedStep);
+            loadedVectors.forEach((value, index) => {
+                value[`col${currentVectorIndex}`] = loadedVector[index].col0;
+            });
+            this.setState({ loadedVectors: loadedVectors });
+            this.edaManagerTablePanel?.refreshCells();
+            this.edaManagerChartPanel?.onReload();
+        }
+    }
+    renderTimePanel() {
+        const pathsToOmit = ["timePanelConfiguration.autoRefresh"];
+        this.state.currentFilter.currentVectors.forEach((_, index) => {
+            pathsToOmit.push(`currentVectors[${index}].target`);
+        });
+        const filterChanged = !isEqual(omit(cloneDeep(this.state.currentFilter), pathsToOmit), omit(cloneDeep(this.state.loadedDataFilter), pathsToOmit));
+        return (React.createElement(EdaManagerTimePanel, { loading: this.state.loading, configuration: this.state.currentFilter.timePanelConfiguration, filterChanged: filterChanged, onChangeConfiguration: configuration => {
+                const currentFilter = this.state.currentFilter;
+                const timePanelConfiguration = currentFilter.timePanelConfiguration;
+                Object.assign(timePanelConfiguration, configuration);
+                this.setState({ currentFilter: currentFilter }, () => {
+                    this.saveFilter();
+                    if (timePanelConfiguration.autoRefresh) {
+                        this.onLoadVectors();
+                    }
+                });
+            }, onReload: () => {
+                this.onLoadVectors();
+            } }));
+    }
+    get edaManagerChartPanelCompact() {
+        return false;
+    }
+    get tabWrapperStyle() {
+        return { padding: "8px 12px" };
+    }
+    flexLayoutFactory(node) {
+        const component = node.getComponent();
+        const activeVectors = this.getActiveVectors();
+        if (component === "table") {
+            return (React.createElement(EdaManagerTablePanel, { style: this.tabWrapperStyle, ref: component => this.edaManagerTablePanel = component, edaApi: this.props.edaApi, timePanel: this.renderTimePanel(), currentVectors: activeVectors, loadedVectors: this.state.loadedVectors, loading: this.state.loading, onReloadVectorData: code => {
+                    this.onLoadVector(code);
+                } }));
+        }
+        else if (component === "chart") {
+            const d2ChartSeries = activeVectors.map(value => {
+                return {
+                    id: value.id,
+                    code: value.code,
+                    name: value.name,
+                    colorIndex: value.colorIndex,
+                    lineStyle: value.lineStyle,
+                };
+            });
+            return (React.createElement("div", { style: Object.assign({ display: "flex", flexDirection: "column", height: "100%" }, this.tabWrapperStyle) },
+                this.renderTimePanel(),
+                React.createElement(D2ChartPanel, { ref: component => this.edaManagerChartPanel = component, d2ChartSeries: d2ChartSeries, d2ChartRecords: this.state.loadedVectors, d2ChartCalendarRecords: this.state.loadedCalendarVector, loading: this.state.loading, compact: this.edaManagerChartPanelCompact, markArea: this.props.markArea, tableHeight: this.props.tableHeight, tableWrapperStyle: this.props.tableWrapperStyle })));
+        }
+        return React.createElement("span", null, component);
+    }
+    render() {
+        return (React.createElement("div", { style: { minWidth: 100, minHeight: 500, ...this.props.style } },
+            React.createElement(FlexLayout.Layout, { model: this.state.layoutModel, onModelChange: model => this.setState({ layoutModel: model }), factory: this.flexLayoutFactory })));
+    }
+}
+//# sourceMappingURL=edaManagerAbstractPanel.js.map

package/coreui/components/edaManager/abstract/edaManagerAbstractPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"edaManagerAbstractPanel.js","sourceRoot":"","sources":["../../../../../../coreui/components/edaManager/abstract/edaManagerAbstractPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\r\nimport {EdaApi, EdaManagerRecord, EdaVector, EdaStepEnum} from \"../../../../api/edaApi\";\r\nimport EdaManagerTimePanel, {EdaManagerTimePanelConfiguration} from \"../components/edaManagerTimePanel\";\r\nimport * as FlexLayout from \"flexlayout-react\";\r\nimport dayjs from \"d2core/dayjs\";\r\nimport cloneDeep from \"lodash/cloneDeep\";\r\nimport debounce from \"lodash/debounce\";\r\nimport EdaManagerTablePanel from \"../components/edaManagerTablePanel\";\r\nimport D2ChartPanel, {Props} from \"../../d2Chart/d2ChartPanel\";\r\nimport {isEqual, omit} from \"lodash\";\r\nimport {AdvancedFilterApi} from \"../../../../api/advancedFilterApi\";\r\nimport {D2ChartSeriesItem} from \"../../../../api/types/d2ChartTypes\";\r\n\r\nconst CONFIGURATION_VERSION = 2;\r\n\r\nexport interface EdaManagerFilterToSave {\r\n    version: number\r\n    currentVectors: EdaVector[]\r\n    timeFrom: string\r\n    timeTo: string;\r\n\r\n    selectedStep: EdaStepEnum\r\n    autoRefresh: boolean\r\n}\r\n\r\nexport interface EdaManagerFilter {\r\n    currentVectors: EdaVector[]\r\n    timePanelConfiguration: EdaManagerTimePanelConfiguration\r\n}\r\n\r\nexport interface EdaManagerAbstractPanelProps extends Omit<Props, \"d2ChartSeries\" | \"d2ChartRecords\" | \"d2ChartCalendarRecords\" | \"loading\"> {\r\n    style?: React.CSSProperties\r\n\r\n    edaApi: EdaApi\r\n    advancedFilterApi: AdvancedFilterApi\r\n\r\n    onVectorsLoaded?(loadedVectors: EdaManagerRecord[]): void\r\n}\r\n\r\nexport interface EdaManagerAbstractPanelState {\r\n    layoutModel: FlexLayout.Model\r\n    loadedVectors: EdaManagerRecord[]\r\n    loadedCalendarVector?: EdaManagerRecord[]\r\n    loading: boolean\r\n\r\n    currentFilter: EdaManagerFilter\r\n    loadedDataFilter: EdaManagerFilter\r\n}\r\n\r\nexport default abstract class EdaManagerAbstractPanel<P extends EdaManagerAbstractPanelProps, S extends EdaManagerAbstractPanelState> extends React.Component<P, S> {\r\n    private edaManagerTablePanel: EdaManagerTablePanel | null = null;\r\n    private edaManagerChartPanel: D2ChartPanel | null = null;\r\n\r\n    protected get initialFilter(): EdaManagerFilter {\r\n        return {\r\n            currentVectors: [],\r\n            timePanelConfiguration: {\r\n                selectedTimeFrom: dayjs().subtract(1, \"week\").startOf(\"day\"),\r\n                selectedTimeTo: dayjs().subtract(1, \"week\").startOf(\"day\"),\r\n                selectedStep: EdaStepEnum.DEFAULT_VALUE,\r\n                autoRefresh: false,\r\n            }\r\n        }\r\n    }\r\n\r\n    protected initialState: Omit<EdaManagerAbstractPanelState, \"layoutModel\"> = {\r\n        loadedVectors: [],\r\n        loading: false,\r\n\r\n        currentFilter: this.initialFilter,\r\n        loadedDataFilter: cloneDeep(this.initialFilter),\r\n    }\r\n\r\n    protected constructor(props: Readonly<P>) {\r\n        super(props);\r\n\r\n        // @ts-ignore\r\n        this.onLoadVectors = debounce(this.onLoadVectors.bind(this), 500);\r\n        this.flexLayoutFactory = this.flexLayoutFactory.bind(this);\r\n    }\r\n\r\n    componentDidMount() {\r\n        const filterNameToSave = this.getFilterNameToSave();\r\n\r\n        if (filterNameToSave) {\r\n            const item = localStorage.getItem(filterNameToSave);\r\n\r\n            if (item) {\r\n                try {\r\n                    const savedFilter: EdaManagerFilterToSave = JSON.parse(item);\r\n                    if (savedFilter.version === CONFIGURATION_VERSION) {\r\n                        const filter: EdaManagerFilter = {\r\n                            currentVectors: savedFilter.currentVectors,\r\n                            timePanelConfiguration: {\r\n                                selectedTimeFrom: dayjs(savedFilter.timeFrom),\r\n                                selectedTimeTo: dayjs(savedFilter.timeTo),\r\n                                selectedStep: savedFilter.selectedStep,\r\n                                autoRefresh: savedFilter.autoRefresh,\r\n                            }\r\n                        }\r\n\r\n                        this.setState({currentFilter: filter}, () => this.onLoadVectors());\r\n                    }\r\n                } catch {\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    protected saveFilter() {\r\n        const filterNameToSave = this.getFilterNameToSave();\r\n\r\n        if (filterNameToSave) {\r\n            const filterToSave: EdaManagerFilterToSave = {\r\n                version: CONFIGURATION_VERSION,\r\n                currentVectors: this.state.currentFilter.currentVectors,\r\n                timeFrom: this.state.currentFilter.timePanelConfiguration.selectedTimeFrom?.toString() ?? \"\",\r\n                timeTo: this.state.currentFilter.timePanelConfiguration.selectedTimeTo?.toString() ?? \"\",\r\n                selectedStep: this.state.currentFilter.timePanelConfiguration.selectedStep,\r\n                autoRefresh: this.state.currentFilter.timePanelConfiguration.autoRefresh,\r\n            }\r\n\r\n            localStorage.setItem(filterNameToSave, JSON.stringify(filterToSave));\r\n        }\r\n    }\r\n\r\n    getFilterNameToSave(): string | undefined {\r\n        return undefined;\r\n    }\r\n\r\n    protected getActiveVectors(): EdaVector[] {\r\n        return this.state.currentFilter.currentVectors.filter(vector => vector.active);\r\n    }\r\n\r\n    protected onReload() {\r\n        this.edaManagerTablePanel?.onReload();\r\n        this.edaManagerChartPanel?.onReload();\r\n    }\r\n\r\n    async onLoadVectors() {\r\n        const activeVectors = this.getActiveVectors();\r\n        this.setState({loading: true});\r\n\r\n        const loadedVectors = await this.props.edaApi.loadVectors(\r\n            activeVectors,\r\n            this.state.currentFilter.timePanelConfiguration.selectedTimeFrom,\r\n            this.state.currentFilter.timePanelConfiguration.selectedTimeTo,\r\n            this.state.currentFilter.timePanelConfiguration.selectedStep,\r\n        );\r\n\r\n        const loadedCalendarVector = await this.props.edaApi.loadCalendarVector(\r\n            this.state.currentFilter.timePanelConfiguration.selectedTimeFrom,\r\n            this.state.currentFilter.timePanelConfiguration.selectedTimeTo,\r\n        );\r\n\r\n        this.setState({\r\n            loading: false,\r\n            loadedVectors: loadedVectors,\r\n            loadedCalendarVector: loadedCalendarVector,\r\n            loadedDataFilter: cloneDeep(this.state.currentFilter),\r\n        }, () => this.onReload());\r\n\r\n        this.props.onVectorsLoaded?.(loadedVectors);\r\n    }\r\n\r\n    private async onLoadVector(code: string) {\r\n        const activeVectors = this.getActiveVectors();\r\n        const currentVectorIndex = activeVectors.findIndex(value => value.code === code);\r\n\r\n        if (currentVectorIndex >= 0) {\r\n            const currentVector = activeVectors[currentVectorIndex];\r\n            const loadedVectors = this.state.loadedVectors;\r\n\r\n            const loadedVector = await this.props.edaApi.loadVectors(\r\n                [currentVector],\r\n                this.state.currentFilter.timePanelConfiguration.selectedTimeFrom,\r\n                this.state.currentFilter.timePanelConfiguration.selectedTimeTo,\r\n                this.state.currentFilter.timePanelConfiguration.selectedStep,\r\n            );\r\n\r\n            loadedVectors.forEach((value, index) => {\r\n                value[`col${currentVectorIndex}`] = loadedVector[index].col0;\r\n            });\r\n\r\n            this.setState({loadedVectors: loadedVectors});\r\n\r\n            this.edaManagerTablePanel?.refreshCells();\r\n            this.edaManagerChartPanel?.onReload();\r\n        }\r\n    }\r\n\r\n    private renderTimePanel() {\r\n        const pathsToOmit = [\"timePanelConfiguration.autoRefresh\"];\r\n        this.state.currentFilter.currentVectors.forEach((_, index) => {\r\n            pathsToOmit.push(`currentVectors[${index}].target`);\r\n        });\r\n\r\n        const filterChanged = !isEqual(\r\n            omit(cloneDeep(this.state.currentFilter), pathsToOmit),\r\n            omit(cloneDeep(this.state.loadedDataFilter), pathsToOmit)\r\n        );\r\n\r\n        return (\r\n            <EdaManagerTimePanel\r\n                loading={this.state.loading}\r\n                configuration={this.state.currentFilter.timePanelConfiguration}\r\n                filterChanged={filterChanged}\r\n                onChangeConfiguration={configuration => {\r\n                    const currentFilter = this.state.currentFilter;\r\n                    const timePanelConfiguration = currentFilter.timePanelConfiguration;\r\n                    Object.assign(timePanelConfiguration, configuration);\r\n                    this.setState({currentFilter: currentFilter}, () => {\r\n                        this.saveFilter();\r\n                        if (timePanelConfiguration.autoRefresh) {\r\n                            this.onLoadVectors();\r\n                        }\r\n                    });\r\n                }}\r\n                onReload={() => {\r\n                    this.onLoadVectors();\r\n                }}\r\n            />\r\n        );\r\n    }\r\n\r\n    protected get edaManagerChartPanelCompact(): boolean {\r\n        return false;\r\n    }\r\n\r\n    protected get tabWrapperStyle(): React.CSSProperties {\r\n        return {padding: \"8px 12px\"}\r\n    }\r\n\r\n    protected flexLayoutFactory(node: FlexLayout.TabNode): React.ReactNode {\r\n        const component = node.getComponent();\r\n        const activeVectors = this.getActiveVectors();\r\n        if (component === \"table\") {\r\n            return (\r\n                <EdaManagerTablePanel\r\n                    style={this.tabWrapperStyle}\r\n                    ref={component => this.edaManagerTablePanel = component}\r\n                    edaApi={this.props.edaApi}\r\n                    timePanel={this.renderTimePanel()}\r\n                    currentVectors={activeVectors}\r\n                    loadedVectors={this.state.loadedVectors}\r\n                    loading={this.state.loading}\r\n                    onReloadVectorData={code => {\r\n                        this.onLoadVector(code);\r\n                    }}\r\n                />\r\n            );\r\n        } else if (component === \"chart\") {\r\n            const d2ChartSeries: D2ChartSeriesItem[] = activeVectors.map(value => {\r\n                return {\r\n                    id: value.id,\r\n                    code: value.code,\r\n                    name: value.name,\r\n                    colorIndex: value.colorIndex,\r\n                    lineStyle: value.lineStyle,\r\n                }\r\n            });\r\n\r\n            return (\r\n                <div\r\n                    style={Object.assign(\r\n                        {display: \"flex\", flexDirection: \"column\", height: \"100%\"},\r\n                        this.tabWrapperStyle\r\n                    )}\r\n                >\r\n                    {this.renderTimePanel()}\r\n                    <D2ChartPanel\r\n                        ref={component => this.edaManagerChartPanel = component}\r\n                        d2ChartSeries={d2ChartSeries}\r\n                        d2ChartRecords={this.state.loadedVectors}\r\n                        d2ChartCalendarRecords={this.state.loadedCalendarVector}\r\n                        loading={this.state.loading}\r\n                        compact={this.edaManagerChartPanelCompact}\r\n                        markArea={this.props.markArea}\r\n                        tableHeight={this.props.tableHeight}\r\n                        tableWrapperStyle={this.props.tableWrapperStyle}\r\n                    />\r\n                </div>\r\n            )\r\n        }\r\n\r\n        return <span>{component}</span>\r\n    }\r\n\r\n    render() {\r\n        return (\r\n            <div style={{minWidth: 100, minHeight: 500, ...this.props.style}}>\r\n                <FlexLayout.Layout\r\n                    model={this.state.layoutModel}\r\n                    onModelChange={model => this.setState({layoutModel: model})}\r\n                    factory={this.flexLayoutFactory}\r\n                />\r\n            </div>\r\n        );\r\n    }\r\n\r\n}"]}

package/coreui/components/edaManager/abstract/edaManagerAbstractTablePanel.d.ts

@@ -0,0 +1,32 @@
+import React from "react";
+import { DataGridColDef, MenuElement } from "d2coreui/components/grid/dataGrid";
+import { EdaManagerRecord, EdaVector } from "../../../../api/edaApi";
+import { GridRowStyle } from "d2coreui/components/grid/cell/tableDefaultRowStyleRules";
+import { GridApi } from "ag-grid-community";
+export interface EdaManagerAbstractTablePanelProps {
+    style?: React.CSSProperties;
+    currentVectors: EdaVector[];
+    loadedVectors: EdaManagerRecord[];
+    loading?: boolean;
+}
+export interface EdaManagerAbstractTablePanelState {
+    columnDefs: DataGridColDef[];
+    selectedData: EdaManagerRecord[];
+}
+export default abstract class EdaManagerAbstractTablePanel<P extends EdaManagerAbstractTablePanelProps, S extends EdaManagerAbstractTablePanelState> extends React.Component<P, S> {
+    protected gridApi?: GridApi;
+    protected constructor(props: Readonly<P>);
+    protected initialState: EdaManagerAbstractTablePanelState;
+    onReload(): void;
+    refreshCells(): void;
+    redrawRows(): void;
+    protected getDateTimeColumn(): DataGridColDef;
+    abstract getColumnDefs(): DataGridColDef[];
+    private onSelectionChanged;
+    protected renderToolbarButtons(): React.ReactElement | undefined;
+    protected renderAdditionalContent(): React.ReactNode | undefined;
+    protected getRowStyle(data: EdaManagerRecord): GridRowStyle | undefined;
+    protected renderContextMenu(originalMenuItems: MenuElement[]): MenuElement[];
+    protected onClickContextMenuItem(key: string): void;
+    render(): React.JSX.Element;
+}

package/coreui/components/edaManager/abstract/edaManagerAbstractTablePanel.js

@@ -0,0 +1,87 @@
+import React from "react";
+import { LoadingOutlined } from "@ant-design/icons";
+import ExtendedDataGrid from "d2coreui/components/grid/extendedDataGrid";
+import { Empty } from "antd";
+import i18n from "d2core/i18n/i18n";
+export default class EdaManagerAbstractTablePanel extends React.Component {
+    constructor(props) {
+        super(props);
+        this.initialState = {
+            columnDefs: this.getColumnDefs(),
+            selectedData: [],
+        };
+        this.onSelectionChanged = this.onSelectionChanged.bind(this);
+        this.renderContextMenu = this.renderContextMenu.bind(this);
+        this.onClickContextMenuItem = this.onClickContextMenuItem.bind(this);
+    }
+    onReload() {
+        this.setState({ columnDefs: this.getColumnDefs() });
+    }
+    refreshCells() {
+        this.gridApi?.refreshCells();
+    }
+    redrawRows() {
+        this.gridApi?.redrawRows();
+    }
+    getDateTimeColumn() {
+        return {
+            headerName: i18n("Date"),
+            colId: "date",
+            field: "date",
+            type: "dateTimeColumn",
+            initialWidth: 140,
+            group: i18n("Basic Columns"),
+        };
+    }
+    onSelectionChanged(event) {
+        const selectedRows = event.api.getSelectedRows();
+        this.setState({ selectedData: selectedRows });
+    }
+    renderToolbarButtons() {
+        return undefined;
+    }
+    renderAdditionalContent() {
+        return undefined;
+    }
+    getRowStyle(data) {
+        data;
+        return undefined;
+    }
+    renderContextMenu(originalMenuItems) {
+        return originalMenuItems;
+    }
+    onClickContextMenuItem(key) {
+        key;
+    }
+    render() {
+        const toolbarButtons = this.renderToolbarButtons();
+        if (this.props.loading) {
+            return (React.createElement("div", { style: { display: "flex", flexDirection: "column", height: "100%", ...this.props.style } },
+                toolbarButtons,
+                React.createElement("div", { style: { height: "100%", display: "flex", justifyContent: "center", alignItems: "center" } },
+                    React.createElement(LoadingOutlined, null))));
+        }
+        return (React.createElement("div", { style: { height: "100%" } },
+            this.renderAdditionalContent(),
+            React.createElement(ExtendedDataGrid, { columnDefs: this.state.columnDefs, onLoadData: callback => {
+                    callback(this.props.loadedVectors.length);
+                }, defaultGridConfiguration: {
+                    pageSize: -1,
+                }, onGridReady: (params) => {
+                    this.gridApi = params.api;
+                }, rowData: this.props.loadedVectors, onSelectionChanged: this.onSelectionChanged, tablePanelStyle: { marginTop: 8 }, panelStyle: this.props.style, toolbar: {
+                    hideRecordCount: true,
+                    toolbarButtons: toolbarButtons,
+                }, search: {
+                    hidden: true,
+                    searchButtonHidden: true,
+                }, contextMenu: {
+                    renderer: this.renderContextMenu,
+                    onClick: this.onClickContextMenuItem
+                }, noRecordsOverlayRenderer: () => React.createElement(Empty, { description: i18n("No records found."), imageStyle: { height: "8vh" } }), getRowStyle: params => {
+                    const data = params.node.data;
+                    return this.getRowStyle(data);
+                }, rowSelection: "multiple", singleClickEdit: true, stopEditingWhenCellsLoseFocus: true, enterNavigatesVerticallyAfterEdit: true })));
+    }
+}
+//# sourceMappingURL=edaManagerAbstractTablePanel.js.map

package/coreui/components/edaManager/abstract/edaManagerAbstractTablePanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"edaManagerAbstractTablePanel.js","sourceRoot":"","sources":["../../../../../../coreui/components/edaManager/abstract/edaManagerAbstractTablePanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAClD,OAAO,gBAAgB,MAAM,2CAA2C,CAAC;AACzE,OAAO,EAAC,KAAK,EAAC,MAAM,MAAM,CAAC;AAC3B,OAAO,IAAI,MAAM,kBAAkB,CAAC;AAiBpC,MAAM,CAAC,OAAO,OAAgB,4BAAuH,SAAQ,KAAK,CAAC,SAAe;IAG9K,YAAsB,KAAkB;QACpC,KAAK,CAAC,KAAK,CAAC,CAAC;QAOP,iBAAY,GAAsC;YACxD,UAAU,EAAE,IAAI,CAAC,aAAa,EAAE;YAChC,YAAY,EAAE,EAAE;SACnB,CAAA;QARG,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7D,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC3D,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACzE,CAAC;IAOD,QAAQ;QACJ,IAAI,CAAC,QAAQ,CAAC,EAAC,UAAU,EAAE,IAAI,CAAC,aAAa,EAAE,EAAC,CAAC,CAAC;IACtD,CAAC;IAED,YAAY;QACR,IAAI,CAAC,OAAO,EAAE,YAAY,EAAE,CAAC;IACjC,CAAC;IAED,UAAU;QACN,IAAI,CAAC,OAAO,EAAE,UAAU,EAAE,CAAC;IAC/B,CAAC;IAES,iBAAiB;QACvB,OAAO;YACH,UAAU,EAAE,IAAI,CAAC,MAAM,CAAC;YACxB,KAAK,EAAE,MAAM;YACb,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,gBAAgB;YACtB,YAAY,EAAE,GAAG;YACjB,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC;SAC/B,CAAA;IACL,CAAC;IAIO,kBAAkB,CAAC,KAA4B;QACnD,MAAM,YAAY,GAAG,KAAK,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC;QACjD,IAAI,CAAC,QAAQ,CAAC,EAAC,YAAY,EAAE,YAAY,EAAC,CAAC,CAAC;IAChD,CAAC;IAES,oBAAoB;QAC1B,OAAO,SAAS,CAAC;IACrB,CAAC;IAES,uBAAuB;QAC7B,OAAO,SAAS,CAAC;IACrB,CAAC;IAES,WAAW,CAAC,IAAsB;QACxC,IAAI,CAAC;QACL,OAAO,SAAS,CAAC;IACrB,CAAC;IAES,iBAAiB,CAAC,iBAAgC;QACxD,OAAO,iBAAiB,CAAC;IAC7B,CAAC;IAES,sBAAsB,CAAC,GAAW;QACxC,GAAG,CAAC;IACR,CAAC;IAED,MAAM;QACF,MAAM,cAAc,GAAG,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAEnD,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;YACrB,OAAO,CACH,6BAAK,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,EAAC;gBACtF,cAAc;gBACf,6BAAK,KAAK,EAAE,EAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAC;oBACzF,oBAAC,eAAe,OAAE,CAChB,CACJ,CACT,CAAC;QACN,CAAC;QAED,OAAO,CACH,6BAAK,KAAK,EAAE,EAAC,MAAM,EAAE,MAAM,EAAC;YACvB,IAAI,CAAC,uBAAuB,EAAE;YAC/B,oBAAC,gBAAgB,IACb,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,UAAU,EAAE,QAAQ,CAAC,EAAE;oBACnB,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;gBAC7C,CAAC,EACD,wBAAwB,EAAE;oBACtB,QAAQ,EAAE,CAAC,CAAC;iBACf,EACD,WAAW,EAAE,CAAC,MAAsB,EAAE,EAAE;oBACpC,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,GAAG,CAAC;gBAC9B,CAAC,EACD,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,aAAa,EACjC,kBAAkB,EAAE,IAAI,CAAC,kBAAkB,EAC3C,eAAe,EAAE,EAAC,SAAS,EAAE,CAAC,EAAC,EAC/B,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAC5B,OAAO,EAAE;oBACL,eAAe,EAAE,IAAI;oBACrB,cAAc,EAAE,cAAc;iBACjC,EACD,MAAM,EAAE;oBACJ,MAAM,EAAE,IAAI;oBACZ,kBAAkB,EAAE,IAAI;iBAC3B,EACD,WAAW,EAAE;oBACT,QAAQ,EAAE,IAAI,CAAC,iBAAiB;oBAChC,OAAO,EAAE,IAAI,CAAC,sBAAsB;iBACvC,EACD,wBAAwB,EAAE,GAAG,EAAE,CAC3B,oBAAC,KAAK,IAAC,WAAW,EAAE,IAAI,CAAC,mBAAmB,CAAC,EAAE,UAAU,EAAE,EAAC,MAAM,EAAE,KAAK,EAAC,GAAG,EAEjF,WAAW,EAAE,MAAM,CAAC,EAAE;oBAClB,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,IAAwB,CAAC;oBAClD,OAAO,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;gBAClC,CAAC,EACD,YAAY,EAAC,UAAU,EACvB,eAAe,QACf,6BAA6B,QAC7B,iCAAiC,SACnC,CACA,CACT,CAAA;IACL,CAAC;CAEJ","sourcesContent":["import React from \"react\";\r\nimport {DataGridColDef, MenuElement} from \"d2coreui/components/grid/dataGrid\";\r\nimport {LoadingOutlined} from \"@ant-design/icons\";\r\nimport ExtendedDataGrid from \"d2coreui/components/grid/extendedDataGrid\";\r\nimport {Empty} from \"antd\";\r\nimport i18n from \"d2core/i18n/i18n\";\r\nimport {EdaManagerRecord, EdaVector} from \"../../../../api/edaApi\";\r\nimport {GridRowStyle} from \"d2coreui/components/grid/cell/tableDefaultRowStyleRules\";\r\nimport {SelectionChangedEvent, GridReadyEvent, GridApi} from \"ag-grid-community\";\r\n\r\nexport interface EdaManagerAbstractTablePanelProps {\r\n    style?: React.CSSProperties\r\n    currentVectors: EdaVector[],\r\n    loadedVectors: EdaManagerRecord[],\r\n    loading?: boolean\r\n}\r\n\r\nexport interface EdaManagerAbstractTablePanelState {\r\n    columnDefs: DataGridColDef[]\r\n    selectedData: EdaManagerRecord[]\r\n}\r\n\r\nexport default abstract class EdaManagerAbstractTablePanel<P extends EdaManagerAbstractTablePanelProps, S extends EdaManagerAbstractTablePanelState> extends React.Component<P, S> {\r\n    protected gridApi?: GridApi;\r\n\r\n    protected constructor(props: Readonly<P>) {\r\n        super(props);\r\n\r\n        this.onSelectionChanged = this.onSelectionChanged.bind(this);\r\n        this.renderContextMenu = this.renderContextMenu.bind(this);\r\n        this.onClickContextMenuItem = this.onClickContextMenuItem.bind(this);\r\n    }\r\n\r\n    protected initialState: EdaManagerAbstractTablePanelState = {\r\n        columnDefs: this.getColumnDefs(),\r\n        selectedData: [],\r\n    }\r\n\r\n    onReload() {\r\n        this.setState({columnDefs: this.getColumnDefs()});\r\n    }\r\n\r\n    refreshCells() {\r\n        this.gridApi?.refreshCells();\r\n    }\r\n\r\n    redrawRows() {\r\n        this.gridApi?.redrawRows();\r\n    }\r\n\r\n    protected getDateTimeColumn(): DataGridColDef {\r\n        return {\r\n            headerName: i18n(\"Date\"),\r\n            colId: \"date\",\r\n            field: \"date\",\r\n            type: \"dateTimeColumn\",\r\n            initialWidth: 140,\r\n            group: i18n(\"Basic Columns\"),\r\n        }\r\n    }\r\n\r\n    abstract getColumnDefs(): DataGridColDef[];\r\n\r\n    private onSelectionChanged(event: SelectionChangedEvent) {\r\n        const selectedRows = event.api.getSelectedRows();\r\n        this.setState({selectedData: selectedRows});\r\n    }\r\n\r\n    protected renderToolbarButtons(): React.ReactElement | undefined {\r\n        return undefined;\r\n    }\r\n\r\n    protected renderAdditionalContent(): React.ReactNode | undefined {\r\n        return undefined;\r\n    }\r\n\r\n    protected getRowStyle(data: EdaManagerRecord): GridRowStyle | undefined {\r\n        data;\r\n        return undefined;\r\n    }\r\n\r\n    protected renderContextMenu(originalMenuItems: MenuElement[]): MenuElement[] {\r\n        return originalMenuItems;\r\n    }\r\n\r\n    protected onClickContextMenuItem(key: string) {\r\n        key;\r\n    }\r\n\r\n    render() {\r\n        const toolbarButtons = this.renderToolbarButtons();\r\n\r\n        if (this.props.loading) {\r\n            return (\r\n                <div style={{display: \"flex\", flexDirection: \"column\", height: \"100%\", ...this.props.style}}>\r\n                    {toolbarButtons}\r\n                    <div style={{height: \"100%\", display: \"flex\", justifyContent: \"center\", alignItems: \"center\"}}>\r\n                        <LoadingOutlined/>\r\n                    </div>\r\n                </div>\r\n            );\r\n        }\r\n\r\n        return (\r\n            <div style={{height: \"100%\"}}>\r\n                {this.renderAdditionalContent()}\r\n                <ExtendedDataGrid\r\n                    columnDefs={this.state.columnDefs}\r\n                    onLoadData={callback => {\r\n                        callback(this.props.loadedVectors.length)\r\n                    }}\r\n                    defaultGridConfiguration={{\r\n                        pageSize: -1,\r\n                    }}\r\n                    onGridReady={(params: GridReadyEvent) => {\r\n                        this.gridApi = params.api;\r\n                    }}\r\n                    rowData={this.props.loadedVectors}\r\n                    onSelectionChanged={this.onSelectionChanged}\r\n                    tablePanelStyle={{marginTop: 8}}\r\n                    panelStyle={this.props.style}\r\n                    toolbar={{\r\n                        hideRecordCount: true,\r\n                        toolbarButtons: toolbarButtons,\r\n                    }}\r\n                    search={{\r\n                        hidden: true,\r\n                        searchButtonHidden: true,\r\n                    }}\r\n                    contextMenu={{\r\n                        renderer: this.renderContextMenu,\r\n                        onClick: this.onClickContextMenuItem\r\n                    }}\r\n                    noRecordsOverlayRenderer={() =>\r\n                        <Empty description={i18n(\"No records found.\")} imageStyle={{height: \"8vh\"}}/>\r\n                    }\r\n                    getRowStyle={params => {\r\n                        const data = params.node.data as EdaManagerRecord;\r\n                        return this.getRowStyle(data);\r\n                    }}\r\n                    rowSelection=\"multiple\"\r\n                    singleClickEdit\r\n                    stopEditingWhenCellsLoseFocus\r\n                    enterNavigatesVerticallyAfterEdit\r\n                />\r\n            </div>\r\n        )\r\n    }\r\n\r\n}"]}

package/coreui/components/edaManager/abstract/edaManagerAbstractVectorList.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+import { EdaVector, EdaApi } from "../../../../api/edaApi";
+import { DataGridColDef } from "d2coreui/components/grid/dataGrid";
+import { GridApi, SelectionChangedEvent } from "ag-grid-community";
+import { AdvancedFilterApi } from "../../../../api/advancedFilterApi";
+export interface EdaManagerAbstractVectorListProps {
+    edaApi: EdaApi;
+    advancedFilterApi: AdvancedFilterApi;
+    currentVectors: EdaVector[];
+    onChange(): void;
+}
+export interface EdaManagerAbstractVectorListState {
+    selectedVectors: EdaVector[];
+    edaVectorSelectDialogVisible: boolean;
+    columnDefs: DataGridColDef[];
+}
+export default abstract class EdaManagerAbstractVectorList<P extends EdaManagerAbstractVectorListProps, S extends EdaManagerAbstractVectorListState> extends React.Component<P, S> {
+    protected gridApi?: GridApi;
+    protected constructor(props: Readonly<P>);
+    onSelectionChanged(event: SelectionChangedEvent): void;
+    abstract getInitialColumnDefs(): DataGridColDef[];
+    renderToolbarButtons(): React.JSX.Element;
+    render(): React.JSX.Element;
+}