@evergis/react 3.1.50 → 3.1.52

package/dist/react.esm.js

@@ -1,9 +1,9 @@
 import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
-import { IconButton, Flex, transition, Chip, Icon, Description, FlexSpan, IconToggle, Popup, Menu, DraggableTree, shadows, Divider, LegendToggler, Tooltip as Tooltip$1, DropdownField, MultiSelectContainer, IconButtonButton, FlatButton, DraggableTreeContainer, LinearProgress, H2, ThemeProvider, defaultTheme, Preview, Blank, Popover, Expander, darkTheme, NumberRangeSlider, useAsyncAutocomplete, AutoComplete, Dropdown, Checkbox, CircularProgress, RangeNumberInput, dateFormat } from '@evergis/uilib-gl';
+import { IconButton, Flex, transition, Chip, Divider, Icon, Description, FlexSpan, IconToggle, Popup, Menu, DraggableTree, shadows, LegendToggler, Tooltip as Tooltip$1, DropdownField, MultiSelectContainer, IconButtonButton, FlatButton, DraggableTreeContainer, UploaderItemArea, UploaderTitleWrapper, Uploader, WaitingButton, LinearProgress, H2, ThemeProvider, defaultTheme, Preview, Blank, Popover, Expander, darkTheme, NumberRangeSlider, useAsyncAutocomplete, AutoComplete, Dropdown, Checkbox, CircularProgress, RangeNumberInput, dateFormat } from '@evergis/uilib-gl';
 import { createContext, memo, useRef, useState, useEffect, useCallback, useContext, useMemo, Fragment } from 'react';
 import styled, { createGlobalStyle, css, useTheme } from 'styled-components';
 import { lineChartClassNames, BarChart as BarChart$1, barChartClassNames, LineChart, PieChart } from '@evergis/charts';
-import { AttributeType, GeometryType } from '@evergis/api';
+import { AttributeType, GeometryType, RemoteTaskStatus } from '@evergis/api';
 import Gradient from 'javascript-color-gradient';
 import { Color as Color$1 } from '@evergis/color';
 import { isValid, format, parseJSON, parseISO, toDate, sub } from 'date-fns';
@@ -3380,6 +3380,8 @@ var ContainerTemplate;
     ContainerTemplate["AddFeature"] = "AddFeature";
     ContainerTemplate["Slideshow"] = "Slideshow";
     ContainerTemplate["ExportPdf"] = "ExportPdf";
+    ContainerTemplate["Upload"] = "Upload";
+    ContainerTemplate["Task"] = "Task";
     ContainerTemplate["Divider"] = "Divider";
 })(ContainerTemplate || (ContainerTemplate = {}));
 var HeaderTemplate;
@@ -4503,6 +4505,75 @@ const DashboardChip$1 = styled(Chip) `
   ${({ $fontColor, $isDefault }) => !!$fontColor && !$isDefault && CustomChipColorMixin}
 `;
 
+const getAttributeByName = (attributeName, attributes) => {
+    return Array.isArray(attributeName)
+        ? null
+        : attributeName
+            ? attributes?.find(({ name }) => name === attributeName)
+            : null;
+};
+
+const formatElementValue = ({ t, value, elementConfig, attributes, wrap, }) => {
+    const { id, type, defaultValue, options, style, attributeName, templateName } = elementConfig || {};
+    const attribute = attributeName ? getAttributeByName(attributeName, attributes) : null;
+    const { fontColor, fontSize, noUnits, tagView, bgColor, withDivider, radius } = options || {};
+    const valueOrDefault = value || defaultValue;
+    const resultValue = type === "attributeValue" && attribute?.type && attribute?.stringFormat
+        ? formatAttributeValue({
+            t,
+            type: attribute.type,
+            value: valueOrDefault,
+            stringFormat: attribute.stringFormat,
+            noUnits,
+        })
+        : valueOrDefault;
+    if (!wrap)
+        return resultValue;
+    return (jsxs(Fragment, { children: [tagView ? (jsx(DashboardChip$1, { text: resultValue, "$bgColor": bgColor, "$fontColor": fontColor, "$fontSize": fontSize, "$radius": radius, style: style })) : resultValue, withDivider && jsx(Divider, {})] }, id));
+};
+
+const getAttributeValue = (element, attributes) => {
+    const attribute = getAttributeByName(element?.attributeName, attributes);
+    const { maxLength, separator, expandable, lineBreak } = element.options || {};
+    let value = "";
+    if (attribute?.type === AttributeType.Boolean && typeof attribute.value === "boolean") {
+        return jsx(DashboardCheckbox, { title: attribute.alias || attribute.name, checked: attribute.value });
+    }
+    if (Array.isArray(element?.attributeName)) {
+        const concatAttributes = element.attributeName.map((attributeName) => attributes?.find(({ name }) => name === attributeName)?.value || "");
+        value = concatAttributes.join(separator || ", ");
+    }
+    else {
+        value = attribute?.value?.toString() || "";
+    }
+    return maxLength && maxLength < value.length ? (jsx(TextTrim, { maxLength: maxLength, expandable: expandable, lineBreak: lineBreak, children: value })) : (value);
+};
+
+const getChartAxes = (chartElement) => chartElement?.options?.relatedDataSources?.filter(({ chartAxis }) => chartAxis === "y");
+
+const getChartFilterName = (relatedDataSources) => {
+    const relatedAttributes = relatedDataSources || [];
+    const axes = relatedAttributes.filter(({ chartAxis }) => chartAxis === "y");
+    return axes?.[0]?.filterName;
+};
+
+function getValueIndex(items, attributes) {
+    return items?.findIndex(({ name }) => name.toString() === attributes.value?.toString());
+}
+const getChartMarkers = (items, markers, dataSources) => {
+    if (typeof markers === "string") {
+        const dataSource = getDataSource(markers, dataSources);
+        return dataSource?.features?.map(({ attributes }) => ({
+            ...attributes,
+            value: getValueIndex(items, attributes),
+        })) || [];
+    }
+    return (markers?.map(marker => ({
+        ...marker,
+        value: getValueIndex(items, marker),
+    })) || []);
+};
+
 const ChartLegendContainer = styled(Flex) `
   flex-direction: column;
   flex-wrap: wrap;
@@ -4531,156 +4602,6 @@ const ChartLegendName = styled.div `
   color: ${({ theme: { palette }, $fontColor }) => $fontColor || palette.textPrimary};
 `;
 
-const Container = styled(Flex) `
-  flex-direction: column;
-  width: 100%;
-
-  ${({ isColumn }) => isColumn
-    ? css `
-          > * {
-            width: 100%;
-          }
-        `
-    : css `
-          flex-direction: row;
-          justify-content: space-between;
-          align-items: center;
-        `}
-
-  ${({ isMain, isColumn }) => (isMain || isColumn) &&
-    css `
-      > :not(:last-child) {
-        margin-bottom: 1.5rem;
-      }
-    `}
-
-  ${({ isTitle }) => isTitle &&
-    css `
-      &&&& {
-        margin-bottom: 0.75rem;
-      }
-    `}
-  
-  ${({ noBorders }) => noBorders && css `
-    ${ContainerWrapper} {
-      box-shadow: none;
-      padding: 0;
-    }
-  `}
-`;
-const ContainerAlias = styled(Flex) `
-  align-items: center;
-  flex-wrap: nowrap;
-  margin-bottom: ${({ hasBottomMargin }) => (hasBottomMargin ? 0.25 : 0)}rem;
-  font-size: 0.75rem;
-  color: ${({ theme: { palette } }) => palette.textSecondary};
-
-  span[kind] {
-    margin-right: 0.5rem;
-
-    :after {
-      color: ${({ theme: { palette } }) => palette.primary};
-    }
-  }
-`;
-const ContainerAliasIcon = styled.div `
-  margin-right: 0.5rem;
-`;
-const ContainerChart = styled(Flex) `
-  justify-content: flex-start;
-
-  > * {
-    display: flex;
-    justify-content: center;
-    width: 100%;
-  }
-`;
-const ContainerLegend = styled(Flex) ``;
-const ContainerUnits = styled.div `
-  margin-left: 0.5rem;
-  white-space: nowrap;
-  font-size: 0.75rem;
-`;
-const ContainerValue = styled(Flex) `
-  justify-content: flex-end;
-  align-items: center;
-  flex-wrap: nowrap;
-  width: 100%;
-  font-size: ${({ big }) => (big ? 1.5 : 1)}rem;
-  color: ${({ fontColor, theme: { palette } }) => fontColor || palette.textPrimary};
-
-  > * {
-    width: ${({ column }) => (column ? "100%" : "auto")};
-  }
-
-  ${ContainerChart}, ${ContainerLegend} {
-    width: ${({ column }) => (column ? "100%" : "50%")};
-  }
-
-  ${ContainerLegend} {
-    margin-left: ${({ column }) => (column ? 0 : "1rem")};
-  }
-
-  ${ChartLegendContainer} {
-    flex-direction: ${({ column }) => (column ? "row" : "column")};
-    margin-top: ${({ column }) => (column ? "1rem" : 0)};
-  }
-`;
-const ColorIconMixin = css `
-  :after {
-    color: ${({ $fontColor }) => $fontColor} !important;
-  }
-`;
-const SizeIconMixin = css `
-  :after {
-    font-size: ${({ $fontSize }) => $fontSize}px !important;
-  }
-`;
-const ContainerIcon = styled(Icon) `
-  width: auto;
-  height: auto;
-  margin-bottom: 0.5rem;
-  ${({ $fontColor }) => !!$fontColor && ColorIconMixin};
-  ${({ $fontSize }) => !!$fontSize && SizeIconMixin};
-`;
-const SvgContainerColorMixin$1 = css `
-  path,
-  line,
-  circle {
-    fill: ${({ $fontColor }) => $fontColor};
-  }
-`;
-const SvgContainer$1 = styled.div `
-  &&& {
-    min-width: ${({ $width }) => ($width ? `${$width}px` : "1rem")};
-    max-width: ${({ $width }) => ($width ? `${$width}px` : "1rem")};
-
-    ${({ $fontColor }) => !!$fontColor && SvgContainerColorMixin$1};
-
-    > * {
-      min-width: inherit;
-    }
-  }
-`;
-const TwoColumnContainerWrapper = styled(Flex) `
-  width: 100%;
-  flex-direction: row;
-  flex-wrap: nowrap;
-  align-items: center;
-
-  > * {
-    flex: 1;
-  }
-
-  > ${ContainerValue} {
-    justify-content: flex-end;
-
-    > * {
-      text-align: right;
-    }
-  }
-`;
-
 const LayerGroupContainer = styled(Flex) `
   display: flex;
   justify-content: center;
@@ -4992,6 +4913,88 @@ const useServerNotificationsContext = () => {
     return useContext(ServerNotificationsContext);
 };
 
+const SERVER_NOTIFICATION_EVENT = {
+    ReceiveFeaturesUpdate: "ReceiveFeaturesUpdateNotification",
+    PythonProgressNotification: "ReceivePythonProgressNotification",
+};
+
+const usePythonTask = () => {
+    const { api, t } = useGlobalContext();
+    const { addSubscription, connection, unsubscribeById } = useServerNotificationsContext();
+    const [result, setResult] = useState(null);
+    const [error, setError] = useState(null);
+    const [loading, setLoading] = useState(false);
+    const [executionTime, setExecutionTime] = useState(null);
+    const [taskId, setTaskId] = useState(null);
+    const [subscriptionId, setSubscriptionId] = useState(null);
+    const reset = useCallback(() => {
+        setResult(null);
+        setError(null);
+        setLoading(true);
+        setExecutionTime(null);
+        setTaskId(null);
+        setSubscriptionId(null);
+    }, []);
+    const runTask = useCallback(async ({ resourceId, parameters, script, }) => {
+        reset();
+        const start = Date.now();
+        let prototypeId = await api.remoteTaskManager.createTaskPrototype({
+            enabled: true,
+            startIfPreviousError: true,
+            startIfPreviousNotFinished: true,
+            subTaskSettings: [
+                {
+                    type: "pythonService",
+                    startParameters: {
+                        resourceId,
+                        parameters,
+                        script,
+                        method: "pythonrunner/run",
+                    },
+                },
+            ],
+        });
+        prototypeId = prototypeId.replace(/["']+/g, "");
+        const { id: newTaskId, success } = await api.remoteTaskManager.startTask1(prototypeId);
+        if (!success) {
+            setResult(t("taskRunFail", { ns: "devMode", defaultValue: "Не удалось запустить задачу" }));
+            setExecutionTime(Date.now() - start);
+            setLoading(false);
+        }
+        const newSubscriptionId = await addSubscription({
+            tag: "python_task_progress_event",
+            taskId: newTaskId,
+        });
+        setTaskId(newTaskId);
+        setSubscriptionId(newSubscriptionId);
+        const onNotification = ({ data }) => {
+            if (data?.taskId === newTaskId) {
+                setResult(`${data ? `${data}\n` : ""}${data.log || ""}`);
+                setError(null);
+                setExecutionTime(Date.now() - start);
+                setLoading(false);
+                setTaskId([RemoteTaskStatus.Completed, RemoteTaskStatus.Error].includes(data.status)
+                    ? undefined
+                    : newTaskId);
+                setSubscriptionId([RemoteTaskStatus.Completed, RemoteTaskStatus.Error].includes(data.status)
+                    ? undefined
+                    : newSubscriptionId);
+                if ([RemoteTaskStatus.Completed, RemoteTaskStatus.Error].includes(data.status)) {
+                    unsubscribeById(newSubscriptionId);
+                    connection.off(SERVER_NOTIFICATION_EVENT.PythonProgressNotification, onNotification);
+                }
+            }
+        };
+        connection.on(SERVER_NOTIFICATION_EVENT.PythonProgressNotification, onNotification);
+    }, [api, connection, addSubscription, unsubscribeById, reset]);
+    const stopTask = useCallback(async () => {
+        await api.remoteTaskManager.stop(taskId);
+        reset();
+        unsubscribeById(subscriptionId);
+    }, [api, reset, unsubscribeById, taskId, subscriptionId]);
+    return { runTask, stopTask, result, error, loading, executionTime };
+};
+
 const useAppHeight = () => {
     useEffect(() => {
         const setAppHeight = () => {
@@ -5127,12 +5130,8 @@ const LayerListContainer = styled(Flex) `
   box-sizing: border-box;
 `;
 
-const ElementValueWrapper = styled.div `
-  transition: background-color ${transition.toggle};
-`;
 const ContainerWrapper = styled(Flex) `
   position: relative;
-  min-height: 1rem;
   box-sizing: border-box;
   width: 100%;
   background: ${({ theme: { palette } }) => palette.backgroundAlpha};
@@ -5144,7 +5143,7 @@ const ContainerWrapper = styled(Flex) `
   z-index: ${({ $zIndex }) => $zIndex ?? 1};
   transition: background-color ${transition.toggle};
 
-  ${Container} > ${ElementValueWrapper}:not(:last-child) {
+  ${Container} > :not(:last-child) {
     margin-bottom: 1.5rem;
   }
 `;
@@ -5397,74 +5396,155 @@ const FeatureControls = styled(Flex) `
   }
 `;
 
-const getAttributeByName = (attributeName, attributes) => {
-    return Array.isArray(attributeName)
-        ? null
-        : attributeName
-            ? attributes?.find(({ name }) => name === attributeName)
-            : null;
-};
-
-const formatElementValue = ({ t, value, elementConfig, attributes, wrap, }) => {
-    const { id, type, defaultValue, options, style, attributeName, templateName } = elementConfig || {};
-    const attribute = attributeName ? getAttributeByName(attributeName, attributes) : null;
-    const { fontColor, fontSize, noUnits, tagView, bgColor, withDivider, radius } = options || {};
-    const valueOrDefault = value || defaultValue;
-    const resultValue = type === "attributeValue" && attribute?.type && attribute?.stringFormat
-        ? formatAttributeValue({
-            t,
-            type: attribute.type,
-            value: valueOrDefault,
-            stringFormat: attribute.stringFormat,
-            noUnits,
-        })
-        : valueOrDefault;
-    if (!wrap)
-        return resultValue;
-    return (jsxs(Fragment, { children: [tagView ? (jsx(DashboardChip$1, { text: resultValue, "$bgColor": bgColor, "$fontColor": fontColor, "$fontSize": fontSize, "$radius": radius, style: style })) : (jsx(ElementValueWrapper, { "data-id": id, "data-templatename": templateName, style: style, children: resultValue })), withDivider && jsx(Divider, {})] }, id));
-};
-
-const getAttributeValue = (element, attributes) => {
-    const attribute = getAttributeByName(element?.attributeName, attributes);
-    const { maxLength, separator, expandable, lineBreak } = element.options || {};
-    let value = "";
-    if (attribute?.type === AttributeType.Boolean && typeof attribute.value === "boolean") {
-        return jsx(DashboardCheckbox, { title: attribute.alias || attribute.name, checked: attribute.value });
-    }
-    if (Array.isArray(element?.attributeName)) {
-        const concatAttributes = element.attributeName.map((attributeName) => attributes?.find(({ name }) => name === attributeName)?.value || "");
-        value = concatAttributes.join(separator || ", ");
-    }
-    else {
-        value = attribute?.value?.toString() || "";
-    }
-    return maxLength && maxLength < value.length ? (jsx(TextTrim, { maxLength: maxLength, expandable: expandable, lineBreak: lineBreak, children: value })) : (value);
-};
-
-const getChartAxes = (chartElement) => chartElement?.options?.relatedDataSources?.filter(({ chartAxis }) => chartAxis === "y");
-
-const getChartFilterName = (relatedDataSources) => {
-    const relatedAttributes = relatedDataSources || [];
-    const axes = relatedAttributes.filter(({ chartAxis }) => chartAxis === "y");
-    return axes?.[0]?.filterName;
-};
-
-function getValueIndex(items, attributes) {
-    return items?.findIndex(({ name }) => name.toString() === attributes.value?.toString());
-}
-const getChartMarkers = (items, markers, dataSources) => {
-    if (typeof markers === "string") {
-        const dataSource = getDataSource(markers, dataSources);
-        return dataSource?.features?.map(({ attributes }) => ({
-            ...attributes,
-            value: getValueIndex(items, attributes),
-        })) || [];
-    }
-    return (markers?.map(marker => ({
-        ...marker,
-        value: getValueIndex(items, marker),
-    })) || []);
-};
+const Container = styled(Flex) `
+  flex-direction: column;
+  width: 100%;
+
+  ${({ isColumn }) => isColumn
+    ? css `
+          > * {
+            width: 100%;
+          }
+        `
+    : css `
+          flex-direction: row;
+          justify-content: space-between;
+          align-items: center;
+        `}
+
+  ${({ isMain, isColumn }) => (isMain || isColumn) &&
+    css `
+      > :not(:last-child) {
+        margin-bottom: 1.5rem;
+      }
+    `}
+
+  ${({ isTitle }) => isTitle &&
+    css `
+      &&&& {
+        margin-bottom: 0.75rem;
+      }
+    `}
+  
+  ${({ noBorders }) => noBorders && css `
+    ${ContainerWrapper} {
+      box-shadow: none;
+      padding: 0;
+    }
+  `}
+`;
+const ContainerAlias = styled(Flex) `
+  align-items: center;
+  flex-wrap: nowrap;
+  margin-bottom: ${({ hasBottomMargin }) => (hasBottomMargin ? 0.25 : 0)}rem;
+  font-size: 0.75rem;
+  color: ${({ theme: { palette } }) => palette.textSecondary};
+
+  span[kind] {
+    margin-right: 0.5rem;
+
+    :after {
+      color: ${({ theme: { palette } }) => palette.primary};
+    }
+  }
+`;
+const ContainerAliasIcon = styled.div `
+  margin-right: 0.5rem;
+`;
+const ContainerChart = styled(Flex) `
+  justify-content: flex-start;
+
+  > * {
+    display: flex;
+    justify-content: center;
+    width: 100%;
+  }
+`;
+const ContainerLegend = styled(Flex) ``;
+const ContainerUnits = styled.div `
+  margin-left: 0.5rem;
+  white-space: nowrap;
+  font-size: 0.75rem;
+`;
+const ContainerValue = styled(Flex) `
+  justify-content: flex-end;
+  align-items: center;
+  flex-wrap: nowrap;
+  width: 100%;
+  font-size: ${({ big }) => (big ? 1.5 : 1)}rem;
+  color: ${({ fontColor, theme: { palette } }) => fontColor || palette.textPrimary};
+
+  > * {
+    width: ${({ column }) => (column ? "100%" : "auto")};
+  }
+
+  ${ContainerChart}, ${ContainerLegend} {
+    width: ${({ column }) => (column ? "100%" : "50%")};
+  }
+
+  ${ContainerLegend} {
+    margin-left: ${({ column }) => (column ? 0 : "1rem")};
+  }
+
+  ${ChartLegendContainer} {
+    flex-direction: ${({ column }) => (column ? "row" : "column")};
+    margin-top: ${({ column }) => (column ? "1rem" : 0)};
+  }
+`;
+const ColorIconMixin = css `
+  :after {
+    color: ${({ $fontColor }) => $fontColor} !important;
+  }
+`;
+const SizeIconMixin = css `
+  :after {
+    font-size: ${({ $fontSize }) => $fontSize}px !important;
+  }
+`;
+const ContainerIcon = styled(Icon) `
+  width: auto;
+  height: auto;
+  margin-bottom: 0.5rem;
+  ${({ $fontColor }) => !!$fontColor && ColorIconMixin};
+  ${({ $fontSize }) => !!$fontSize && SizeIconMixin};
+`;
+const SvgContainerColorMixin$1 = css `
+  path,
+  line,
+  circle {
+    fill: ${({ $fontColor }) => $fontColor};
+  }
+`;
+const SvgContainer$1 = styled.div `
+  &&& {
+    min-width: ${({ $width }) => ($width ? `${$width}px` : "1rem")};
+    max-width: ${({ $width }) => ($width ? `${$width}px` : "1rem")};
+
+    ${({ $fontColor }) => !!$fontColor && SvgContainerColorMixin$1};
+
+    > * {
+      min-width: inherit;
+    }
+  }
+`;
+const TwoColumnContainerWrapper = styled(Flex) `
+  width: 100%;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+
+  > * {
+    flex: 1;
+  }
+
+  > ${ContainerValue} {
+    justify-content: flex-end;
+
+    > * {
+      text-align: right;
+    }
+  }
+`;
 
 const ContainersGroupContainer = memo(({ elementConfig, type, renderElement }) => {
     const { expandedContainers } = useWidgetContext(type);
@@ -6635,6 +6715,98 @@ const ExportPdfContainer = memo(({ type, elementConfig }) => {
     return (jsx(Container, { id: id, style: style, children: jsx(IconButton, { kind: icon || "download", primary: true, disabled: loading, onClick: onExport, children: title ?? t("downloadPdf", { ns: "dashboard", defaultValue: "Скачать PDF" }) }) }));
 });
 
+const UploaderContainer = styled(Container) `
+  ${UploaderItemArea} {
+    overflow: visible;
+    padding-top: 1rem;
+    padding-bottom: 1rem;
+  }
+  
+  ${UploaderTitleWrapper} {
+    top: 0;
+    padding-top: 0;
+    border: 0;
+  }
+`;
+const UploaderTitle = styled(Flex) `
+  flex-direction: column;
+  align-items: center;
+  width: 11rem;
+  margin: 0 auto;
+  text-align: center;
+  font-size: 0.625rem;
+  color: ${({ theme: { palette } }) => palette.textSecondary};
+  
+  span[kind] {
+    width: 1.5rem;
+    height: 1.5rem;
+    margin-bottom: 0.75rem;
+    
+    :after {
+      font-size: 1.5rem;
+      color: ${({ theme: { palette } }) => palette.textSecondary};
+      opacity: 0.12;
+    }
+  }
+`;
+
+const DEFAULT_FILE_EXTENSIONS = ".txt,.csv,.py";
+const UploadContainer = memo(({ type, elementConfig, renderElement }) => {
+    const { t, api } = useGlobalContext();
+    const { changeFilters } = useWidgetContext(type);
+    const [files, setFiles] = useState([]);
+    const refInput = useRef();
+    const { id, style, options } = elementConfig || {};
+    const { icon, title, filterName, fileExtensions = DEFAULT_FILE_EXTENSIONS, parentResourceId, multiSelect } = options || {};
+    const onUpload = useCallback(async (input) => {
+        const files = Array.isArray(input) ? input : [input];
+        const response = await Promise.all(files.map(file => {
+            return api.file.upload(file, true, parentResourceId, file.name);
+        }));
+        const uploadedFiles = response.map(item => ({
+            name: item.name,
+            id: item.resourceId,
+            done: true,
+        }));
+        setFiles(currentFiles => ([...uploadedFiles, ...currentFiles]));
+    }, [parentResourceId]);
+    const onDelete = useCallback(async (id) => {
+        const index = files.findIndex(file => file.id === id);
+        if (index === -1)
+            return;
+        const resourceId = files[index].id;
+        await api.file.deleteResource(resourceId);
+        setFiles(currentFiles => currentFiles.filter(({ id }) => id !== resourceId));
+    }, [files]);
+    const renderTitle = useMemo(() => {
+        if (files.length)
+            return null;
+        return (jsxs(UploaderTitle, { children: [jsx(Icon, { kind: icon || "upload" }), jsx("div", { children: title ?? t("uploadTitle", {
+                        ns: "dashboard",
+                        defaultValue: "Перетащите файл сюда или нажмите, чтобы выбрать",
+                    }) })] }));
+    }, [icon, t, title, files.length]);
+    useEffect(() => {
+        if (!filterName)
+            return;
+        changeFilters({ [filterName]: { value: files.map(({ id }) => id) } });
+    }, [files]);
+    return (jsxs(Fragment$1, { children: [jsx(ExpandableTitle, { elementConfig: elementConfig, type: type, renderElement: renderElement }), jsx(UploaderContainer, { id: id, style: style, children: jsx(Uploader, { title: renderTitle, accept: fileExtensions, fileItems: files, currentRef: refInput, isMultiple: multiSelect, onUpload: onUpload, onDelete: onDelete }) })] }));
+});
+
+const TaskContainer = memo(({ elementConfig }) => {
+    const { t } = useGlobalContext();
+    const { runTask, error, result, executionTime, loading } = usePythonTask();
+    const { options } = elementConfig || {};
+    const { title, relatedResources } = options || {};
+    const onClick = useCallback(async () => {
+        await Promise.all(relatedResources.map(({ resourceId, parameters, script }) => {
+            return runTask({ resourceId, parameters, script });
+        }));
+    }, [relatedResources, runTask]);
+    return (jsx(WaitingButton, { primary: true, isWaiting: loading, disabled: !relatedResources?.length, onClick: onClick, children: title || t("run", { ns: "dashboard", defaultValue: "Запуск" }) }));
+});
+
 const containerComponents = {
     [ContainerTemplate.DefaultAttributes]: DefaultAttributesContainer,
     [ContainerTemplate.Pages]: PagesContainer,
@@ -6656,6 +6828,8 @@ const containerComponents = {
     [ContainerTemplate.AddFeature]: AddFeatureContainer,
     [ContainerTemplate.Divider]: DividerContainer,
     [ContainerTemplate.ExportPdf]: ExportPdfContainer,
+    [ContainerTemplate.Upload]: UploadContainer,
+    [ContainerTemplate.Task]: TaskContainer,
     default: ContainersGroupContainer,
 };
 
@@ -10571,5 +10745,5 @@ const Map$1 = ({ zIndex, lowerSiblings, upperSiblings, onError, children, ...res
                 }, children: children }), upperSiblings] }));
 };
 
-export { AddFeatureButton, AddFeatureContainer, AttributeGalleryContainer, AttributeLabel, BaseMapTheme, CONFIG_PAGES_ID, CONFIG_PAGE_ID, CameraContainer, Chart, ChartContainer, ChartLegend, ChartLoading, ContainerChildren, ContainerLoading, ContainerTemplate, ContainerWrapper, ContainersGroupContainer, DEFAULT_ATTRIBUTE_NAME, DEFAULT_BARCHART_RADIUS, DEFAULT_BASE_MAP, DEFAULT_CHART_ANGLE, DEFAULT_CHART_HEIGHT, DEFAULT_CHART_WIDTH, DEFAULT_CIRCLE_PAINT, DEFAULT_DASHBOARD_CONFIG, DEFAULT_DATA_SOURCE_LIMIT, DEFAULT_FILL_EXTRUSION_PAINT, DEFAULT_FILL_PAINT, DEFAULT_ID_ATTRIBUTE_NAME, DEFAULT_LAT, DEFAULT_LINE_PAINT, DEFAULT_LNG, DEFAULT_PAGES_CONFIG, DEFAULT_PIECHART_RADIUS, DEFAULT_ZOOM, Dashboard, DashboardCheckbox, DashboardChip, DashboardContent, DashboardContext, DashboardDefaultHeader, DashboardHeader, DashboardLoading, DashboardPlaceholder, DashboardPlaceholderWrap, DashboardProvider, DashboardWrapper, DataSourceContainer, DataSourceError, DataSourceErrorContainer, DataSourceInnerContainer, DataSourceProgressContainer, DateFormat, DefaultAttributesContainer, DefaultHeaderContainer, DefaultHeaderWrapper, DividerContainer, EditGeometryType, ElementButton, ElementCamera, ElementChart, ElementChips, ElementIcon, ElementImage, ElementLegend, ElementLink, ElementMarkdown, ElementSlideshow, ElementSvg, ElementTooltip, ElementValueWrapper, ExpandableTitle, FEATURE_CARD_DEFAULT_COLORS, FEATURE_CARD_OTHER_COLOR, FILTERED_VALUE_OPACITY, FILTER_PREFIX, FeatureCardButtons, FeatureCardContext, FeatureCardDefaultHeader, FeatureCardGradientHeader, FeatureCardHeader, FeatureCardIconHeader, FeatureCardProvider, FeatureCardSlideshowHeader, FeatureCardTitle, FeatureControls, FeatureTitleContainer, FiltersContainer, GEOMETRY_ATTRIBUTE, GlobalContext, GlobalProvider, Header, HeaderContainer, HeaderFrontView, HeaderTemplate, HeaderTitleContainer, HiddenTitleItems, IconContainer, ImageContainer, LEFT_PANEL_HEADER_HEIGHT, Layer, LayerDescription, LayerGroup, LayerGroupList, LayerIcon, LayerListContainer, LayerTree, LayersContainer, LayersListWrapper, LinearProgressContainer, LogoContainer, MAX_CHART_WIDTH, Map$1 as Map, MapContext, MapProvider, NO_CONTENT_VALUE, NUMERIC_ATTRIBUTE_TYPES, NoLiveSnapshotContainer, OneColumnContainer, PageNavigator, PageTitle, PagesContainer, Pagination, PresentationHeader, PresentationHeaderButtons, PresentationHeaderTools, PresentationPanelContainer, PresentationPanelWrapper, PresentationWrapper, ProgressContainer, RoundedBackgroundContainer, ScalingFactor, ServerNotificationsContext, ServerNotificationsProvider, SlideshowContainer, SmallPreviewContainer$1 as SmallPreviewContainer, SmallPreviewControl, SmallPreviewCounter, SmallPreviewImages, SmallPreviewLeft, SmallPreviewRight, StackBar, SvgImage, TIME_ZONE_FORMAT, TabsContainer, TextTrim, ThemeName, TitleContainer, TmsType, TopContainer, TopContainerButtons, TwoColumnContainer, WidgetType, addDataSource, addDataSources, applyFiltersToCondition, applyQueryFilters, applyVarsToCondition, checkEqualOrIncludes, checkIsLoading, convertSpToTurfFeature, createConfigLayer, createConfigPage, createNewPageId, createTreeNode, dateOptions, debounce, decimalOpacityToHex, eqlParametersToPayload, findAttributeInExpression, formatArea, formatAttributeValue, formatChartRelatedValue, formatConditionValue, formatDataSourceCondition, formatDate$1 as formatDate, formatElementValue, formatLength, formatNumber, formatPolygonMeasure, getActualExtrusionHeight, getAttributeByName, getAttributeValue, getAttributesConfiguration, getChartAxes, getChartFilterName, getChartMarkers, getConfigFilter, getContainerComponent, getDashboardHeader, getDataFromAttributes, getDataFromRelatedFeatures, getDataSource, getDataSourceFilterValue, getDate, getDefaultConfig, getElementValue, getFeatureAttributes, getFeatureCardHeader, getFilterComponent, getFilterSelectedItems, getFilterValue, getFormattedAttributes, getGradientColors, getLayerDefinition, getLayerInfo, getLayerInfoFromDataSources, getPagesFromConfig, getPagesFromProjectInfo, getProxyService, getRelatedAttribute, getRenderElement, getResourceUrl, getRootElementId, getSelectedFilterValue, getSlideshowImages, getSvgUrl, getTotalFromAttributes, getTotalFromRelatedFeatures, hexToRgba, isCompositeLayerConfiguration, isEmptyElementValue, isEmptyValue, isHiddenEmptyValue, isLayerService, isNotValidSelectedTab, isNumeric, isObject, isProxyService, isVisibleContainer, numberOptions, parseClientStyle, pieChartTooltipFromAttributes, pieChartTooltipFromRelatedFeatures, pointOptions, removeDataSource, rgbToHex, roundTotalSum, sliceShownOtherItems, timeOptions, tooltipNameFromAttributes, tooltipValueFromAttributes, tooltipValueFromRelatedFeatures, transparentizeColor, treeNodesToProjectItems, useAppHeight, useChartChange, useChartData, useDashboardHeader, useDataSources, useDebouncedCallback, useDiffPage, useExpandableContainers, useExportPdf, useGetConfigLayer, useGlobalContext, useHeaderRender, useLayerParams, useMapContext, useMapDraw, useProjectDashboardInit, useRedrawLayer, useRelatedDataSourceAttributes, useRenderElement, useServerNotificationsContext, useShownOtherItems, useToggle, useUpdateDataSource, useWidgetConfig, useWidgetContext, useWidgetFilters, useWidgetPage, useWindowResize, useZoomToFeatures, useZoomToPoint };
+export { AddFeatureButton, AddFeatureContainer, AttributeGalleryContainer, AttributeLabel, BaseMapTheme, CONFIG_PAGES_ID, CONFIG_PAGE_ID, CameraContainer, Chart, ChartContainer, ChartLegend, ChartLoading, ContainerChildren, ContainerLoading, ContainerTemplate, ContainerWrapper, ContainersGroupContainer, DEFAULT_ATTRIBUTE_NAME, DEFAULT_BARCHART_RADIUS, DEFAULT_BASE_MAP, DEFAULT_CHART_ANGLE, DEFAULT_CHART_HEIGHT, DEFAULT_CHART_WIDTH, DEFAULT_CIRCLE_PAINT, DEFAULT_DASHBOARD_CONFIG, DEFAULT_DATA_SOURCE_LIMIT, DEFAULT_FILL_EXTRUSION_PAINT, DEFAULT_FILL_PAINT, DEFAULT_ID_ATTRIBUTE_NAME, DEFAULT_LAT, DEFAULT_LINE_PAINT, DEFAULT_LNG, DEFAULT_PAGES_CONFIG, DEFAULT_PIECHART_RADIUS, DEFAULT_ZOOM, Dashboard, DashboardCheckbox, DashboardChip, DashboardContent, DashboardContext, DashboardDefaultHeader, DashboardHeader, DashboardLoading, DashboardPlaceholder, DashboardPlaceholderWrap, DashboardProvider, DashboardWrapper, DataSourceContainer, DataSourceError, DataSourceErrorContainer, DataSourceInnerContainer, DataSourceProgressContainer, DateFormat, DefaultAttributesContainer, DefaultHeaderContainer, DefaultHeaderWrapper, DividerContainer, EditGeometryType, ElementButton, ElementCamera, ElementChart, ElementChips, ElementIcon, ElementImage, ElementLegend, ElementLink, ElementMarkdown, ElementSlideshow, ElementSvg, ElementTooltip, ExpandableTitle, FEATURE_CARD_DEFAULT_COLORS, FEATURE_CARD_OTHER_COLOR, FILTERED_VALUE_OPACITY, FILTER_PREFIX, FeatureCardButtons, FeatureCardContext, FeatureCardDefaultHeader, FeatureCardGradientHeader, FeatureCardHeader, FeatureCardIconHeader, FeatureCardProvider, FeatureCardSlideshowHeader, FeatureCardTitle, FeatureControls, FeatureTitleContainer, FiltersContainer, GEOMETRY_ATTRIBUTE, GlobalContext, GlobalProvider, Header, HeaderContainer, HeaderFrontView, HeaderTemplate, HeaderTitleContainer, HiddenTitleItems, IconContainer, ImageContainer, LEFT_PANEL_HEADER_HEIGHT, Layer, LayerDescription, LayerGroup, LayerGroupList, LayerIcon, LayerListContainer, LayerTree, LayersContainer, LayersListWrapper, LinearProgressContainer, LogoContainer, MAX_CHART_WIDTH, Map$1 as Map, MapContext, MapProvider, NO_CONTENT_VALUE, NUMERIC_ATTRIBUTE_TYPES, NoLiveSnapshotContainer, OneColumnContainer, PageNavigator, PageTitle, PagesContainer, Pagination, PresentationHeader, PresentationHeaderButtons, PresentationHeaderTools, PresentationPanelContainer, PresentationPanelWrapper, PresentationWrapper, ProgressContainer, RoundedBackgroundContainer, SERVER_NOTIFICATION_EVENT, ScalingFactor, ServerNotificationsContext, ServerNotificationsProvider, SlideshowContainer, SmallPreviewContainer$1 as SmallPreviewContainer, SmallPreviewControl, SmallPreviewCounter, SmallPreviewImages, SmallPreviewLeft, SmallPreviewRight, StackBar, SvgImage, TIME_ZONE_FORMAT, TabsContainer, TextTrim, ThemeName, TitleContainer, TmsType, TopContainer, TopContainerButtons, TwoColumnContainer, UploadContainer, WidgetType, addDataSource, addDataSources, applyFiltersToCondition, applyQueryFilters, applyVarsToCondition, checkEqualOrIncludes, checkIsLoading, convertSpToTurfFeature, createConfigLayer, createConfigPage, createNewPageId, createTreeNode, dateOptions, debounce, decimalOpacityToHex, eqlParametersToPayload, findAttributeInExpression, formatArea, formatAttributeValue, formatChartRelatedValue, formatConditionValue, formatDataSourceCondition, formatDate$1 as formatDate, formatElementValue, formatLength, formatNumber, formatPolygonMeasure, getActualExtrusionHeight, getAttributeByName, getAttributeValue, getAttributesConfiguration, getChartAxes, getChartFilterName, getChartMarkers, getConfigFilter, getContainerComponent, getDashboardHeader, getDataFromAttributes, getDataFromRelatedFeatures, getDataSource, getDataSourceFilterValue, getDate, getDefaultConfig, getElementValue, getFeatureAttributes, getFeatureCardHeader, getFilterComponent, getFilterSelectedItems, getFilterValue, getFormattedAttributes, getGradientColors, getLayerDefinition, getLayerInfo, getLayerInfoFromDataSources, getPagesFromConfig, getPagesFromProjectInfo, getProxyService, getRelatedAttribute, getRenderElement, getResourceUrl, getRootElementId, getSelectedFilterValue, getSlideshowImages, getSvgUrl, getTotalFromAttributes, getTotalFromRelatedFeatures, hexToRgba, isCompositeLayerConfiguration, isEmptyElementValue, isEmptyValue, isHiddenEmptyValue, isLayerService, isNotValidSelectedTab, isNumeric, isObject, isProxyService, isVisibleContainer, numberOptions, parseClientStyle, pieChartTooltipFromAttributes, pieChartTooltipFromRelatedFeatures, pointOptions, removeDataSource, rgbToHex, roundTotalSum, sliceShownOtherItems, timeOptions, tooltipNameFromAttributes, tooltipValueFromAttributes, tooltipValueFromRelatedFeatures, transparentizeColor, treeNodesToProjectItems, useAppHeight, useChartChange, useChartData, useDashboardHeader, useDataSources, useDebouncedCallback, useDiffPage, useExpandableContainers, useExportPdf, useGetConfigLayer, useGlobalContext, useHeaderRender, useLayerParams, useMapContext, useMapDraw, useProjectDashboardInit, usePythonTask, useRedrawLayer, useRelatedDataSourceAttributes, useRenderElement, useServerNotificationsContext, useShownOtherItems, useToggle, useUpdateDataSource, useWidgetConfig, useWidgetContext, useWidgetFilters, useWidgetPage, useWindowResize, useZoomToFeatures, useZoomToPoint };
 //# sourceMappingURL=react.esm.js.map