@vanillabp/bc-ui 0.0.3

package/dist/components/ListOfWorkflows.js

@@ -0,0 +1,974 @@
+import {
+  __async,
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "../chunk-YH4NJHER.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { Box, CheckBox, Grid, Text, TextInput, Tip } from "grommet";
+import {
+  colorForEndedItemsOrUndefined,
+  colorRowAccordingToUpdateStatus,
+  debounce,
+  DefaultListCell,
+  ENDED_FONT_COLOR,
+  Link,
+  ListCell as StyledListCell,
+  useResponsiveScreen
+} from "@vanillabp/bc-shared";
+import {
+  ListCell,
+  SearchableAndSortableUpdatingList,
+  TypeOfItem,
+  useFederationModules
+} from "../index.js";
+import { ListColumnHeader } from "./ListColumnHeader.js";
+import { Clear, Refresh, Search } from "grommet-icons";
+const minWidthOfTitleColumn = "20rem";
+const updateModuleDefinitions = (workflows, existingModuleDefinitions, setModulesOfWorkflows, existingWorkflowDefinitions, setDefinitionsOfWorkflows) => {
+  const newModuleDefinitions = workflows.filter((workflow) => workflow.workflowModuleId !== void 0).reduce((moduleDefinitions, workflow) => moduleDefinitions.includes(workflow) ? moduleDefinitions : moduleDefinitions.concat(workflow), existingModuleDefinitions || []);
+  if ((existingModuleDefinitions == null ? void 0 : existingModuleDefinitions.length) !== newModuleDefinitions.length) {
+    setModulesOfWorkflows(newModuleDefinitions);
+    const newWorkflowDefinitions = __spreadValues({}, existingWorkflowDefinitions);
+    workflows.forEach((workflow) => newWorkflowDefinitions[`${workflow.workflowModuleId}#${workflow.bpmnProcessId}`] = workflow);
+    if (existingWorkflowDefinitions === void 0 || Object.keys(existingWorkflowDefinitions).length !== Object.keys(newWorkflowDefinitions).length) {
+      setDefinitionsOfWorkflows(newWorkflowDefinitions);
+    }
+  }
+};
+const loadWorkflows = (workflowlistApi, setNumberOfWorkflows, existingModuleDefinitions, setModulesOfWorkflows, existingWorkflowDefinitions, setDefinitionsOfWorkflows, pageSize, pageNumber, initialTimestamp, searchQueries, sort, sortAscending, mapToBcWorkflow) => __async(void 0, null, function* () {
+  const result = yield workflowlistApi.getWorkflows((/* @__PURE__ */ new Date()).getTime().toString(), pageNumber, pageSize, sort, sortAscending, searchQueries, initialTimestamp);
+  setNumberOfWorkflows(result.page.totalElements);
+  updateModuleDefinitions(result.workflows, existingModuleDefinitions, setModulesOfWorkflows, existingWorkflowDefinitions, setDefinitionsOfWorkflows);
+  return {
+    serverTimestamp: result.serverTimestamp,
+    items: result.workflows.map((workflow) => mapToBcWorkflow(workflow))
+  };
+});
+const reloadWorkflows = (workflowlistApi, setNumberOfWorkflows, existingModuleDefinitions, setModulesOfWorkflows, existingWorkflowDefinitions, setDefinitionsOfWorkflows, numberOfItems, knownItemsIds, initialTimestamp, searchQueries, sort, sortAscending, mapToBcWorkflow) => __async(void 0, null, function* () {
+  const result = yield workflowlistApi.getWorkflowsUpdate(
+    (/* @__PURE__ */ new Date()).getTime().toString(),
+    numberOfItems,
+    knownItemsIds,
+    sort,
+    sortAscending,
+    searchQueries,
+    initialTimestamp
+  );
+  setNumberOfWorkflows(result.page.totalElements);
+  updateModuleDefinitions(result.workflows, existingModuleDefinitions, setModulesOfWorkflows, existingWorkflowDefinitions, setDefinitionsOfWorkflows);
+  return {
+    serverTimestamp: result.serverTimestamp,
+    items: result.workflows.map((workflow) => mapToBcWorkflow(workflow))
+  };
+});
+const FulltextSearch = ({
+  t,
+  initialQuery,
+  limitListToKwic,
+  kwic
+  // focus = false,
+}) => {
+  const { isPhone } = useResponsiveScreen();
+  const textFieldRef = useRef(null);
+  const [query, setQuery] = useState(initialQuery);
+  const currentQuery = useRef(initialQuery(void 0));
+  const [suggestions, setSuggestions] = useState(void 0);
+  const ignoreKeyEnter = useRef(false);
+  const select = (value, suggestion) => {
+    if (suggestion) {
+      ignoreKeyEnter.current = true;
+    } else if (ignoreKeyEnter.current) {
+      ignoreKeyEnter.current = false;
+      return;
+    }
+    if (value === void 0)
+      return;
+    setSuggestions(void 0);
+    setQuery(value);
+    currentQuery.current = value;
+    limitListToKwic(void 0, value);
+  };
+  const kwicDebounced = useMemo(() => debounce(() => __async(void 0, null, function* () {
+    const result = yield kwic(void 0, currentQuery.current);
+    const newSuggestions = result.map((r) => ({
+      value: r.item,
+      label: /* @__PURE__ */ jsxs(
+        Box,
+        {
+          direction: "row",
+          justify: "between",
+          pad: "xsmall",
+          children: [
+            /* @__PURE__ */ jsx(
+              Text,
+              {
+                weight: "bold",
+                truncate: "tip",
+                children: r.item
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Box,
+              {
+                align: "right",
+                children: r.count
+              }
+            )
+          ]
+        }
+      )
+    }));
+    setSuggestions(
+      newSuggestions.length > 20 ? [...newSuggestions.slice(0, 20), { value: void 0, label: /* @__PURE__ */ jsx(Box, { pad: "xsmall", children: t("kwic_to-many-hits") }) }] : newSuggestions
+    );
+  }), 300), [currentQuery, setSuggestions]);
+  const updateResult = (newQuery) => {
+    currentQuery.current = newQuery;
+    setQuery(newQuery);
+    if (newQuery.length < 3) {
+      if (suggestions) {
+        setSuggestions(void 0);
+      }
+      return;
+    }
+    kwicDebounced();
+  };
+  const clear = () => {
+    currentQuery.current = "";
+    setQuery("");
+    setSuggestions(void 0);
+    textFieldRef.current.focus();
+    limitListToKwic(void 0, void 0);
+  };
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      width: isPhone ? "100%" : "min(100%, 30rem)",
+      elevation: "small",
+      alignContent: "center",
+      hoverIndicator: "white",
+      focusIndicator: false,
+      round: { size: "0.4rem" },
+      border: { color: "dark-4" },
+      children: /* @__PURE__ */ jsxs(
+        Grid,
+        {
+          columns: ["auto", "2rem"],
+          fill: true,
+          children: [
+            /* @__PURE__ */ jsx(
+              Box,
+              {
+                pad: { horizontal: "0.4rem", vertical: "0.25rem" },
+                direction: "row",
+                justify: "center",
+                children: /* @__PURE__ */ jsx(
+                  TextInput,
+                  {
+                    plain: "full",
+                    ref: textFieldRef,
+                    value: query,
+                    placeholder: t("kwic_placeholder"),
+                    onKeyDown: (event) => event.key === "Enter" ? select(query, false) : void 0,
+                    onChange: (event) => updateResult(event.target.value),
+                    suggestions: suggestions === void 0 ? [] : suggestions.length === 0 ? [{ value: void 0, label: /* @__PURE__ */ jsx(Box, { pad: "xsmall", children: t("kwic_no-hit") }) }] : suggestions,
+                    onSuggestionSelect: (x) => select(x.suggestion.value, true),
+                    focusIndicator: false,
+                    reverse: true
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Tip,
+              {
+                content: t("kwic_tooltip"),
+                children: /* @__PURE__ */ jsx(
+                  Box,
+                  {
+                    align: "center",
+                    justify: "center",
+                    children: Boolean(query) ? /* @__PURE__ */ jsx(
+                      Clear,
+                      {
+                        onMouseUp: clear,
+                        color: "dark-4"
+                      }
+                    ) : /* @__PURE__ */ jsx(
+                      Search,
+                      {
+                        color: "dark-4"
+                      }
+                    )
+                  }
+                )
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+};
+const RefreshButton = ({
+  t,
+  disabled,
+  refresh
+}) => {
+  const color = disabled ? "light-4" : "dark-3";
+  const textColor = disabled ? "dark-4" : "dark-1";
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      hoverIndicator: disabled ? "light-2" : "accent-1",
+      focusIndicator: false,
+      onClick: refresh,
+      direction: "row",
+      elevation: "small",
+      background: !disabled ? { color: "accent-1", opacity: "strong" } : void 0,
+      round: { size: "0.4rem" },
+      border: { color },
+      children: /* @__PURE__ */ jsx(
+        Tip,
+        {
+          content: t("refresh_workflows"),
+          children: /* @__PURE__ */ jsx(
+            Box,
+            {
+              height: "2rem",
+              pad: { horizontal: "0.4rem" },
+              align: "center",
+              direction: "row",
+              justify: "center",
+              children: /* @__PURE__ */ jsx(
+                Refresh,
+                {
+                  size: "20rem",
+                  color: textColor
+                }
+              )
+            }
+          )
+        }
+      )
+    }
+  );
+};
+const DefaultFooter = ({
+  t,
+  isPhone,
+  isTablet,
+  numberOfWorkflows
+}) => {
+  const isNotPhone = !isPhone;
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      direction: "row",
+      justify: "between",
+      align: "center",
+      children: [
+        /* @__PURE__ */ jsxs(
+          Box,
+          {
+            pad: "xsmall",
+            children: [
+              t("total"),
+              " ",
+              numberOfWorkflows
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Box,
+          {
+            direction: "row",
+            gap: "medium",
+            pad: "xsmall",
+            align: "center",
+            children: [
+              /* @__PURE__ */ jsxs(
+                Box,
+                {
+                  direction: "row",
+                  align: "center",
+                  gap: "xsmall",
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Box,
+                      {
+                        direction: "row",
+                        height: "1rem",
+                        border: { color: "light-4", size: "1px" },
+                        children: /* @__PURE__ */ jsx(
+                          Box,
+                          {
+                            width: "1rem",
+                            height: "100%",
+                            align: "center",
+                            justify: "center",
+                            background: "white",
+                            children: /* @__PURE__ */ jsx(Text, { size: "xsmall", children: "T" })
+                          }
+                        )
+                      }
+                    ),
+                    isNotPhone ? /* @__PURE__ */ jsx(Box, { children: t("legend_unchanged") }) : void 0
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Box,
+                {
+                  direction: "row",
+                  align: "center",
+                  gap: "xsmall",
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Box,
+                      {
+                        direction: "row",
+                        height: "1rem",
+                        border: { color: "light-4", size: "1px" },
+                        children: /* @__PURE__ */ jsx(
+                          Box,
+                          {
+                            width: "1rem",
+                            height: "100%",
+                            align: "center",
+                            justify: "center",
+                            background: { color: "accent-3", opacity: 0.1 },
+                            children: /* @__PURE__ */ jsx(Text, { size: "xsmall", children: "T" })
+                          }
+                        )
+                      }
+                    ),
+                    isNotPhone ? /* @__PURE__ */ jsx(Box, { children: t("legend_new") }) : void 0
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Box,
+                {
+                  direction: "row",
+                  align: "center",
+                  gap: "xsmall",
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Box,
+                      {
+                        direction: "row",
+                        height: "1rem",
+                        border: { color: "light-4", size: "1px" },
+                        children: /* @__PURE__ */ jsx(
+                          Box,
+                          {
+                            width: "1rem",
+                            height: "100%",
+                            align: "center",
+                            justify: "center",
+                            background: { color: "accent-1", opacity: 0.35 },
+                            children: /* @__PURE__ */ jsx(Text, { size: "xsmall", children: "T" })
+                          }
+                        )
+                      }
+                    ),
+                    isNotPhone ? /* @__PURE__ */ jsx(Box, { children: t("legend_updated") }) : void 0
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Box,
+                {
+                  direction: "row",
+                  align: "center",
+                  gap: "xsmall",
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Box,
+                      {
+                        direction: "row",
+                        height: "1rem",
+                        border: { color: "light-4", size: "1px" },
+                        children: /* @__PURE__ */ jsx(
+                          Box,
+                          {
+                            width: "1rem",
+                            height: "100%",
+                            align: "center",
+                            justify: "center",
+                            background: { color: "light-2", opacity: 0.5 },
+                            children: /* @__PURE__ */ jsx(Text, { size: "xsmall", color: ENDED_FONT_COLOR, children: "T" })
+                          }
+                        )
+                      }
+                    ),
+                    isNotPhone ? /* @__PURE__ */ jsx(Box, { children: t("legend_completed") }) : void 0
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Box,
+                {
+                  direction: "row",
+                  align: "center",
+                  gap: "xsmall",
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Box,
+                      {
+                        direction: "row",
+                        height: "1rem",
+                        border: { color: "light-4", size: "1px" },
+                        children: /* @__PURE__ */ jsx(
+                          Box,
+                          {
+                            width: "1rem",
+                            height: "100%",
+                            align: "center",
+                            justify: "center",
+                            background: { color: "light-2", opacity: 0.5 },
+                            children: /* @__PURE__ */ jsx(Text, { size: "xsmall", children: "T" })
+                          }
+                        )
+                      }
+                    ),
+                    isNotPhone ? /* @__PURE__ */ jsx(Box, { children: t("legend_filtered") }) : void 0
+                  ]
+                }
+              )
+            ]
+          }
+        )
+      ]
+    },
+    "footer"
+  );
+};
+const DefaultHeader = ({
+  t,
+  isPhone,
+  isTablet,
+  numberOfWorkflows,
+  selectAll,
+  allSelected,
+  refresh,
+  refreshDisabled,
+  initialKwicQuery,
+  limitListToKwic,
+  kwic
+}) => {
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      fill: true,
+      background: "white",
+      direction: "row",
+      align: "center",
+      justify: "start",
+      gap: "small",
+      pad: { horizontal: "xsmall" },
+      children: [
+        /* @__PURE__ */ jsx(
+          FulltextSearch,
+          {
+            t,
+            initialQuery: initialKwicQuery,
+            limitListToKwic,
+            kwic
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          RefreshButton,
+          {
+            t,
+            refresh,
+            disabled: refreshDisabled
+          }
+        )
+      ]
+    }
+  );
+};
+const SelectDefaultListCell = ({
+  item,
+  selectItem
+}) => {
+  const background = colorRowAccordingToUpdateStatus(item);
+  return /* @__PURE__ */ jsx(
+    StyledListCell,
+    {
+      background,
+      align: "center",
+      children: /* @__PURE__ */ jsx(
+        CheckBox,
+        {
+          checked: item.selected,
+          onChange: (event) => selectItem(event.currentTarget.checked)
+        }
+      )
+    }
+  );
+};
+const TitleDefaultListCell = ({
+  item,
+  currentLanguage
+}) => {
+  const titleLanguages = Object.keys(item.data["title"]);
+  let title;
+  if (titleLanguages.includes(currentLanguage)) {
+    title = item.data["title"][currentLanguage];
+  } else {
+    title = item.data["title"][titleLanguages[0]];
+  }
+  const background = colorRowAccordingToUpdateStatus(item);
+  return /* @__PURE__ */ jsx(
+    StyledListCell,
+    {
+      align: "left",
+      background,
+      children: /* @__PURE__ */ jsx(
+        Text,
+        {
+          color: colorForEndedItemsOrUndefined(item),
+          weight: item.read === void 0 ? "bold" : "normal",
+          truncate: "tip",
+          children: /* @__PURE__ */ jsx(
+            Link,
+            {
+              onClick: item.data.navigateToWorkflow,
+              children: title
+            }
+          )
+        }
+      )
+    }
+  );
+};
+const WorkflowDefaultListCell = (_a) => {
+  var _b = _a, { column } = _b, props = __objRest(_b, ["column"]);
+  let Cell;
+  if (column.path === "id") {
+    Cell = SelectDefaultListCell;
+  } else if (column.path === "title") {
+    Cell = TitleDefaultListCell;
+  } else {
+    Cell = DefaultListCell;
+  }
+  return /* @__PURE__ */ jsx(
+    Cell,
+    __spreadValues({
+      column
+    }, props)
+  );
+};
+const ListOfWorkflows = ({
+  showLoadingIndicator,
+  useGuiSse,
+  useWorkflowlistApi,
+  openTask,
+  navigateToWorkflow,
+  currentLanguage,
+  defaultSort,
+  defaultSortAscending,
+  name,
+  columns,
+  children,
+  headerHeight = "3rem",
+  footer,
+  footerHeight = "2rem",
+  t,
+  rowSeparator,
+  applyBackgroundColor = true,
+  showColumnHeaders = true,
+  excludeIdColumn = false,
+  columnHeader,
+  columnHeaderBackground = "dark-3",
+  columnHeaderSeparator,
+  defaultSearchQueries = []
+}) => {
+  const { isPhone, isTablet, isNotPhone } = useResponsiveScreen();
+  const wakeupSseCallback = useRef(void 0);
+  const workflowlistApi = useWorkflowlistApi(wakeupSseCallback);
+  const [refreshIndicator, setRefreshIndicator] = useState(/* @__PURE__ */ new Date());
+  const [searchQueries, setSearchQueries] = useState(defaultSearchQueries);
+  const updateListRef = useRef(void 0);
+  const updateList = useMemo(() => (ev) => __async(void 0, null, function* () {
+    if (!updateListRef.current)
+      return;
+    const listOfUpdatedWorkflows = ev.data.map((workflowEvent) => workflowEvent.event.id);
+    updateListRef.current(listOfUpdatedWorkflows);
+  }), [updateListRef]);
+  wakeupSseCallback.current = useGuiSse(
+    updateList,
+    /^Workflow$/
+  );
+  const refreshItemRef = useRef(void 0);
+  const mapToBcWorkflow = (workflow) => {
+    const getUserTasksFunction = (activeOnly, limitListAccordingToCurrentUsersPermissions) => __async(void 0, null, function* () {
+      return (yield workflowlistApi.getUserTasksOfWorkflow(
+        workflow.id,
+        activeOnly,
+        limitListAccordingToCurrentUsersPermissions
+      )).map((userTask) => __spreadProps(__spreadValues({}, userTask), {
+        open: () => openTask(userTask),
+        navigateToWorkflow: () => {
+        }
+        // don't change view because workflow is already shown
+      }));
+    });
+    return __spreadProps(__spreadValues({}, workflow), {
+      navigateToWorkflow: () => navigateToWorkflow(workflow),
+      getUserTasks: getUserTasksFunction
+    });
+  };
+  const workflows = useRef(void 0);
+  const [numberOfWorkflows, setNumberOfWorkflows] = useState(-1);
+  const [modulesOfWorkflows, setModulesOfWorkflows] = useState(void 0);
+  const [languagesOfTitles, setLanguagesOfTitles] = useState([currentLanguage]);
+  const [definitionsOfWorkflows, setDefinitionsOfWorkflows] = useState(void 0);
+  useEffect(
+    () => {
+      const loadMetaInformation = () => __async(void 0, null, function* () {
+        const result = yield loadWorkflows(
+          workflowlistApi,
+          setNumberOfWorkflows,
+          modulesOfWorkflows,
+          setModulesOfWorkflows,
+          definitionsOfWorkflows,
+          setDefinitionsOfWorkflows,
+          20,
+          0,
+          void 0,
+          searchQueries,
+          effectiveSort,
+          sortAscending,
+          mapToBcWorkflow
+        );
+        const titleLanguages = result.items.flatMap((workflow) => Object.keys(workflow.title)).reduce((allLanguages, titleLanguage) => {
+          if (!allLanguages.includes(titleLanguage)) {
+            allLanguages.push(titleLanguage);
+          }
+          return allLanguages;
+        }, new Array(currentLanguage));
+        setLanguagesOfTitles(titleLanguages);
+      });
+      if (workflows.current === void 0) {
+        showLoadingIndicator(true);
+        loadMetaInformation();
+      }
+    },
+    // workflowlistApi is not part of dependency because it changes one time but this is irrelevant to the
+    // purpose of preloading modules used by workflows
+    [workflows, setNumberOfWorkflows, setModulesOfWorkflows, setDefinitionsOfWorkflows, showLoadingIndicator, refreshIndicator, setLanguagesOfTitles]
+  );
+  const [columnsOfWorkflows, setColumnsOfWorkflows] = useState(void 0);
+  const modules = useFederationModules(modulesOfWorkflows, "WorkflowList");
+  useEffect(() => {
+    if (modules === void 0) {
+      return;
+    }
+    if (definitionsOfWorkflows === void 0) {
+      return;
+    }
+    const totalColumns = Object.keys(definitionsOfWorkflows).map((definition) => definitionsOfWorkflows[definition]).map((definition) => {
+      const columnsOfWorkflow = modules.filter((m) => m !== void 0).filter((m) => m.workflowModuleId === definition.workflowModuleId).filter((m) => m.workflowListColumns !== void 0).map((module) => module.workflowListColumns(definition));
+      if (columnsOfWorkflow.length === 0)
+        return void 0;
+      return columnsOfWorkflow[0];
+    }).filter((columnsOfWorkflow) => columnsOfWorkflow !== void 0).reduce((totalColumns2, columnsOfWorkflow) => {
+      columnsOfWorkflow.forEach((column) => {
+        totalColumns2[column.path] = column;
+      });
+      return totalColumns2;
+    }, {});
+    if (totalColumns.id === void 0 && !excludeIdColumn) {
+      totalColumns.id = {
+        title: { [currentLanguage]: "id" },
+        path: "id",
+        width: "2.2rem",
+        priority: -1,
+        show: true,
+        sortable: false,
+        filterable: false,
+        resizeable: false
+      };
+    }
+    if (totalColumns.title === void 0) {
+      totalColumns.title = {
+        title: { [currentLanguage]: t("column_title") },
+        path: "title",
+        width: "",
+        priority: 0,
+        show: true,
+        sortable: true,
+        filterable: true,
+        resizeable: true
+      };
+    }
+    const existingColumnsSignature = columnsOfWorkflows === void 0 ? " " : columnsOfWorkflows.map((c) => c.path).join("|");
+    const columnsToShow = Object.values(totalColumns).sort((a, b) => a.priority - b.priority);
+    const newColumnsSignature = columnsToShow.map((c) => c.path).join("|");
+    if (existingColumnsSignature === newColumnsSignature) {
+      return;
+    }
+    setColumnsOfWorkflows(columnsToShow);
+  }, [modules, definitionsOfWorkflows, columnsOfWorkflows, setColumnsOfWorkflows, refreshIndicator]);
+  const [allSelected, setAllSelected] = useState(false);
+  const [anySelected, setAnySelected] = useState(false);
+  const [refreshNecessary, setRefreshNecessary] = useState(false);
+  const [effectiveSort, _setSort] = useState(defaultSort);
+  const sort = (effectiveSort == null ? void 0 : effectiveSort.startsWith("title.")) ? "title" : effectiveSort;
+  const [sortAscending, _setSortAscending] = useState(defaultSortAscending === void 0 ? true : defaultSortAscending);
+  const refreshList = () => {
+    workflows.current = void 0;
+    setRefreshNecessary(false);
+    setColumnsOfWorkflows(void 0);
+    setRefreshIndicator(/* @__PURE__ */ new Date());
+  };
+  const setSort = (column) => {
+    if (column) {
+      if (column.path === "title") {
+        _setSort("title." + languagesOfTitles.join(",title."));
+      } else {
+        _setSort(column.path);
+      }
+    } else {
+      _setSort(defaultSort);
+    }
+    _setSortAscending(defaultSortAscending === void 0 ? true : defaultSortAscending);
+    refreshList();
+  };
+  const setSortAscending = (sortAscending2) => {
+    _setSortAscending(sortAscending2);
+    refreshList();
+  };
+  const [columnWidthAdjustments, setColumnWidthAdjustments] = useState({});
+  const getColumnSize = (column) => {
+    return !column.resizeable ? column.width : column.width !== "" ? `max(4rem, calc(${column.width} + ${columnWidthAdjustments[column.path] ? columnWidthAdjustments[column.path] : 0}px))` : columnWidthAdjustments[column.path] ? `${columnWidthAdjustments[column.path]}px` : void 0;
+  };
+  const setColumnWidthAdjustment = (column, adjustment) => {
+    if (column.width === "") {
+      column.width = `${adjustment}px`;
+      return;
+    }
+    const current = columnWidthAdjustments[column.path];
+    if (current === adjustment)
+      return;
+    setColumnWidthAdjustments(__spreadProps(__spreadValues({}, columnWidthAdjustments), { [column.path]: adjustment }));
+  };
+  const selectAll = (select) => {
+    refreshItemRef.current(
+      workflows.current.reduce((allItemIds, item) => {
+        item.selected = select;
+        allItemIds.push(item.id);
+        return allItemIds;
+      }, new Array())
+    );
+    setAllSelected(select);
+    if (anySelected !== select) {
+      setAnySelected(select);
+    }
+  };
+  const selectItem = (item, select) => {
+    item.selected = select;
+    refreshItemRef.current([item.id]);
+    const currentlyAllSelected = workflows.current.reduce((allSelected2, userTask) => allSelected2 && userTask.selected, true);
+    if (currentlyAllSelected !== allSelected) {
+      setAllSelected(currentlyAllSelected);
+    }
+    const currentlyAnySelected = workflows.current.reduce((anySelected2, userTask) => anySelected2 || userTask.selected, false);
+    if (anySelected !== currentlyAnySelected) {
+      setAnySelected(currentlyAnySelected);
+    }
+  };
+  const columnsOfList = columnsOfWorkflows === void 0 ? [] : columnsOfWorkflows.filter((column) => column.show).filter((column) => columns === void 0 || columns.includes(column.path)).map((column, columnIndex, allColumns) => ({
+    property: column.path,
+    size: getColumnSize(column),
+    plain: true,
+    verticalAlign: "top",
+    header: /* @__PURE__ */ jsx(
+      ListColumnHeader,
+      {
+        t,
+        currentLanguage,
+        nameOfList: name,
+        columnHeader,
+        hasColumnWidthAdjustment: columnWidthAdjustments[column.path] !== void 0,
+        setColumnWidthAdjustment,
+        sort: sort === column.path,
+        setSort,
+        sortAscending,
+        setSortAscending,
+        column,
+        columnIndex,
+        numberOfAllColumns: allColumns.length,
+        allSelected,
+        selectAll
+      }
+    ),
+    render: (item) => /* @__PURE__ */ jsx(
+      ListCell,
+      {
+        modulesAvailable: modules,
+        column,
+        currentLanguage,
+        nameOfList: name,
+        typeOfItem: TypeOfItem.WorkflowList,
+        showUnreadAsBold: false,
+        t,
+        item,
+        selectItem,
+        defaultListCell: WorkflowDefaultListCell
+      }
+    )
+  }));
+  const initialKwicQuery = (columnPath) => {
+    const query = searchQueries.filter((query2) => query2.path === columnPath).map((query2) => query2.query);
+    if (query.length === 0)
+      return "";
+    return query[0];
+  };
+  const setKwic = (columnPath, value) => {
+    const newSearchQueries = searchQueries.filter((query) => query.path !== columnPath);
+    if (value !== void 0 && value.trim().length > 0) {
+      newSearchQueries.push({ path: columnPath, query: value });
+    }
+    setSearchQueries(newSearchQueries);
+    refreshList();
+  };
+  const kwic = (columnPath, query) => __async(void 0, null, function* () {
+    return yield workflowlistApi.kwicWorkflows(
+      query,
+      columnPath,
+      searchQueries
+    );
+  });
+  const defaultHeader = () => /* @__PURE__ */ jsx(
+    DefaultHeader,
+    {
+      t,
+      isPhone,
+      isTablet,
+      numberOfWorkflows,
+      selectAll: (select) => {
+      },
+      allSelected,
+      refresh: refreshList,
+      refreshDisabled: !refreshNecessary,
+      initialKwicQuery,
+      limitListToKwic: setKwic,
+      kwic
+    }
+  );
+  const defaultFooter = () => /* @__PURE__ */ jsx(
+    DefaultFooter,
+    {
+      isPhone,
+      isTablet,
+      numberOfWorkflows,
+      t
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    Grid,
+    {
+      rows: [headerHeight, "auto", footerHeight],
+      fill: true,
+      children: [
+        children !== void 0 ? children(
+          isPhone,
+          isTablet,
+          numberOfWorkflows,
+          columnsOfWorkflows,
+          sort,
+          setSort,
+          sortAscending,
+          setSortAscending,
+          selectAll,
+          allSelected,
+          refreshList,
+          !refreshNecessary,
+          initialKwicQuery,
+          setKwic,
+          kwic
+        ) : defaultHeader(),
+        columnsOfWorkflows === void 0 ? /* @__PURE__ */ jsx(Box, {}, "list") : /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
+          SearchableAndSortableUpdatingList,
+          {
+            rowSeparator,
+            applyBackgroundColor,
+            showLoadingIndicator,
+            minWidthOfAutoColumn: minWidthOfTitleColumn,
+            showColumnHeaders,
+            columnHeaderBackground,
+            columnHeaderSeparator,
+            columns: columnsOfList,
+            itemsRef: workflows,
+            updateListRef,
+            refreshItemRef,
+            refreshNecessaryCallback: () => setRefreshNecessary(true),
+            retrieveItems: (pageNumber, pageSize, initialTimestamp) => (
+              // @ts-ignore
+              loadWorkflows(
+                workflowlistApi,
+                setNumberOfWorkflows,
+                modulesOfWorkflows,
+                setModulesOfWorkflows,
+                definitionsOfWorkflows,
+                setDefinitionsOfWorkflows,
+                pageSize,
+                pageNumber,
+                initialTimestamp,
+                searchQueries,
+                effectiveSort,
+                sortAscending,
+                mapToBcWorkflow
+              )
+            ),
+            reloadItems: (numberOfItems, updatedItemsIds, initialTimestamp) => (
+              // @ts-ignore
+              reloadWorkflows(
+                workflowlistApi,
+                setNumberOfWorkflows,
+                modulesOfWorkflows,
+                setModulesOfWorkflows,
+                definitionsOfWorkflows,
+                setDefinitionsOfWorkflows,
+                numberOfItems,
+                updatedItemsIds,
+                initialTimestamp,
+                searchQueries,
+                effectiveSort,
+                sortAscending,
+                mapToBcWorkflow
+              )
+            )
+          }
+        ) }, "list"),
+        footer !== void 0 ? footer(
+          isPhone,
+          isTablet,
+          numberOfWorkflows,
+          columnsOfWorkflows,
+          sort,
+          setSort,
+          sortAscending,
+          setSortAscending,
+          selectAll,
+          allSelected,
+          refreshList,
+          !refreshNecessary,
+          initialKwicQuery,
+          setKwic,
+          kwic
+        ) : defaultFooter()
+      ]
+    }
+  );
+};
+export {
+  ListOfWorkflows
+};